Signal Animate

Toggle a CSS class when a signal changes; the same primitive drives several transition styles. Each example is one signal + one class.

core-ui/interactive ↗

Live

While the signal is on, this panel carries the is-open class. The transition is the app's own, keyed on that class.
A second signal and a second class: is-shown, on this panel only.

Example

// One signal drives a CSS class toggle: wire any transition you like.
panel := html.Div(html.DivConfig{ID: "panel"}, render.Text("…"))
interactive.AnimateOnSignal(panel, "open", "is-shown")
interactive.ToggleLocal(ui.Button(ui.ButtonConfig{Label: "Toggle"}), "open")