Results Area&

SketchSystems.spec

Results Area&
  # This is a shim for the full query interface
  resultsFound -> Showing Results
  
  Sort Selector
    Sorting By Experience*
      # This should trigger a refresh of results as well
      sortByProximity -> Sorting By Proximity
    Sorting By Proximity
      # This should trigger a refresh of results as well
      sortByExperience -> Sorting By Experience

  # Wasn't sure exactly how to model this control. It should
  # be easier to model in xstate when context/extended state is available
  Radius Filter
    select -> Other Radius
    Default Radius*
    Other Radius

  Sidebar List
    Showing No Results*
    Showing Results
      Showing Doctors*
        switch -> Showing Locations
        selectDoctor -> Expanding Doctor
        Not Expanding Doctor
        Expanding Doctor
          viewDetails -> Doctor Detail Overlay
          collapse -> Not Expanding Doctor
          # getDirections -> opens externally

          # Entry guard based on if there are multiple
          # locations in the search radius
          Multiple Locations Message
            Hidden*
            Showing
      Showing Locations
        switch -> Showing Doctors
        selectLocation -> Location Detail Overlay
      History
        wasDoctors -> Expanding Doctor
        wasLocations -> Showing Locations

  Map Area
    Map Pins Unselected
    Doctor Pins Selected
    Location Pins Selected

  # This is shimmed, refer to the Detail Overlay sketch for full spec
  Overlays
    close -> History
    Doctor Detail Overlay
    Location Detail Overlay

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}`);
}