Search Page

SketchSystems.spec

Search Page
  Small Search Box
    On Click -> Expanded Search
  Expanded Search
    Enter Text -> Category Suggestions
    Press Escape -> Small Search Box
    All Categories
  Category Suggestions
    Select Category -> Field Suggestions
    Continue Typing -> Category Suggestions
    Backspace -> Category Suggestions
    Delete All Text -> Expanded Search
    Searchbox with Text
    Suggested Category List*
  Field Suggestions
    Select Field -> Searchbox with Category and Field
    Continue Typing -> Field Suggestions
    Backspace -> Category Suggestions
    Delete All Text -> Expanded Search
    Searchbox with Category
    Suggested Field List*
  Field Search
    Continue Typing -> Searchbox with Category and Field
    Press Enter -> Results Page
    Backspace -> Field Suggestions
    Delete All Text -> Expanded Search
    Searchbox with Category and Field
    Field Matchers*
  Results Page

SketchSystems_prototype.js

function render(model){
  let current_state_name = model.active_states[0].name;
  return $("h1",
           {style: {color: "darkBlue"}},
           `The current state is: ${current_state_name}`);
}