Juli4nG/elm-json-render/1.0.0

NOTE: the latest version is 3.0.0

JsonRender.Render

Render a validated Spec to Html, driven by host-owned state, with actions flowing back out as Effect values.

This is a small TEA component. The host owns the json-render state and passes it to view on every frame; the renderer reads it but never mutates it behind the host's back. The only local state the renderer owns is the pending confirm dialog. User actions (button presses, checkbox toggles) surface to the host as Effects the host applies — exactly mirroring the framework-neutral host↔renderer contract.

Because the output is Elm Html (no innerHTML, no script escape hatch), the rendered tree is XSS-safe by construction.

State

type Model

Renderer-local UI state. Holds only the pending confirm dialog (if any); the host owns everything else.

The initial (empty) renderer state: no dialog open.

Messages

type Msg

Renderer messages. Opaque to the host: the host maps Html Msg into its own message type and feeds Msgs back through update, acting on the returned Effect.

update : Msg -> Model -> ( Model, Maybe Effect )

Advance renderer-local state in response to a Msg, optionally yielding an Effect for the host to apply.

confirm is honored here: a press carrying a confirm opens the dialog and emits nothing; the EmitAction only fires once the user accepts.

Effects (out to the host)

type Effect
= EmitAction
{ verb : String
, params : Value
}
| EmitStateChange
{ path : String
, value : Value
}

What the renderer asks the host to do. The renderer never performs the side effect itself.

  • EmitAction { verb, params } — a wired on:press fired (and any confirm was accepted). params are already expression-resolved. The host re-checks the verb against its allowlist and performs the side effect.
  • EmitStateChange { path, value } — a two-way input ($bindState / $bindItem checkbox) was toggled. The host treats this as the source of truth, writes it at the given absolute JSON Pointer, and re-projects state.

View

view : Spec -> Value -> Model -> Html Msg

Render the spec against the current host-owned state. The returned Html Msg includes the confirm dialog overlay when one is pending.