Flowchart - Hyperapp

mermaid
graph TD
    init("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;init&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;")
    init --- |"init:{state}
init:[state, effect(s)]
"|j0[ ] --- j1[ ] -->nextState
    init --> |"init:Action
init:[Action, payload?]"|Action

    domevent("DOM/synthetic&nbsp;
events
&nbsp;(click/myevent)&nbsp;") --> viewEvent
    viewEvent(("&nbsp;&nbsp;&nbsp;&nbsp;view&nbsp;&nbsp;&nbsp;&nbsp;
event")) --> Action
    externalEvents("global/external
processes
&nbsp;(window resize)&nbsp;") --> subscription
    subscription(("subscription")) -->Action

    Action["&nbsp;Action&nbsp;
(state change)"] -->|"OtherAction
&nbsp;[OtherAction, payload?]
"|Action
    Action --- |"NextState
[NextState, ...Effects]"|j2[ ] ---> nextState
    
    nextState(("&nbsp;&nbsp;next&nbsp;&nbsp;
state")) --- j3[ ]
    j3 --> |"view(state)"|newDom("&nbsp;&nbsp;&nbsp;(re)render&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;DOM&nbsp;&nbsp;&nbsp;")
    j3 --> |"subscriptions(state)"|recalcSubs(recalc
subscriptions)
    j3 --> |"(dispatch, Payload?) -> void"|effect
    effect("Effects
(impure code)") -.-> |"dispatch"|dispatchAction("Action")
    
    style j0 height:1px;
    style j0 width:1px;
    style j1 height:1px;
    style j1 width:1px;
    style j2 height:1px;
    style j2 width:1px;
    style j3 height:1px;
    style j3 width:1px;