Function Search

SketchSystems.spec

Function Search
  Start
    search -> Start with Results 
  Start with Results
    select function -> Function
    delete all -> Start
  Module
    backspace -> Start
    search -> Module
    select function -> Function
  Function
    search -> Module
    backspace -> Module

SketchSystems_prototype.js

function render(model){
  const current_state_name = model.active_states[0].name;
  
  switch (current_state_name) {
    case 'Start':
        return (
          <div>
            <input/>
          </div>
        )
    case 'Start with Results':         
      return (
          <div>
            <input value='List.map'/>
            <ul>
              <li onClick={() => model.emit('select function')}>List.map</li>
            </ul>
          </div>
        )
    case 'Module':
      return (
          <div>
            <input value='elm-lang/core'/>
            <ul>
              <li onClick={() => model.emit('select function')}>List.map</li>
            </ul>
          </div>
        )
     
    case 'Function':
      return (
        <div>
          <input value='elm-lang/core/List.map'/>
          <ul>
            <li>
            <pre>{`
code snipped 1
code`}</pre>
             </li>
            <li>
            <pre>{`
code snippet 2 
List.map`}</pre>
            </li>
           </ul>
        </div>
     )
  }
}