State

State

State in Colight is used when: - Data is used in more than one place, or - Data changes over time (via user interaction or from Python)

It provides: - Deduplication (during serialization) - Efficient change propagation between Python and JavaScript - Reactive UI updates within JavaScript

State API

Minimal example

(
    Plot.initialState({"clicks": 0})
    | [
        "div.bg-yellow-200.p-4",
        {"onClick": Plot.js("(e) => $state.clicks = ($state.clicks || 0) + 1")},
        Plot.js("`Clicked ${$state.clicks} times`"),
    ]
    | [
        "div.p-3.border.text-center",
        {"onClick": Plot.js("(e) => $state.update({clicks: 0})")},
        "Reset",
    ]
)