Open

SketchSystems.spec

Open
  cancel -> Void
  add change -> Editing

# End
Void

Editing
  cancel -> Void
  Valid
    change -> Validating
    finalize -> Extras Needed
  Invalid
    change -> Validating

  # Transient
  Validating
    valid change -> Valid
    invalid change -> Invalid
    
  # Transient
  Extras Needed
    amendment -> Waiting for Signature
    endorsement -> Submitted to Underwriting
    sogh&endorsement -> Waiting for Signature

Waiting for Signature
  timeout -> Rejected
  get signature -> Submitted to Underwriting

Submitted to Underwriting
  needs_manual -> Waiting for Underwriting
  automatic -> Accepted

# End
Waiting for Underwriting
  is underwritten -> Accepted
  is not underwritten -> Rejected

# End
Accepted

# End
Rejected

SketchSystems_prototype.js

function render(model){
  let current_state_name = model.active_states[0].name;
  return (
    <h1 style={{ color: 'blue' }}>
      The current state is {current_state_name.toLowerCase()}
    </h1>
  );
}