Floating light/dark theme switch persisted per visitor.
| Field | Type | |
|---|---|---|
| initial | string. "dark" or "light" — which state the toggle (and its label/chrome) paints as on first load. Not itself persistence — a surface that repaints itself (e.g. via paint_result) must pass the reader's LAST choice back in here, or every repaint resets to whatever this says. | optional |
| position | string (optional, default "bottom-right") | optional |
| dark_bg | string (optional, hex, default "#0f172a") | optional |
| label_dark | string (optional, default "🌙") | optional |
| label_light | string (optional, default "☀️") | optional |
| persist_to | string. A ValueStore primitive's id — when set together with persist_action, a click ALSO calls the engine directly (bypassing the standard wire-prop system, which has no event carrying "which theme it became") to set this ValueStore to "dark"/"light" and run persist_action. Omit either and the toggle is purely visual, as before. | optional |
| persist_action | string. An action id to run right after persist_to is set — typically one that saves it server-side. See persist_to. | optional |
{
"type": "theme_toggle"
}
{
"identifier": "urn:air:a2uicatalog.ai:atom:theme_toggle",
"displayName": "Theme Toggle",
"type": "application/vnd.a2ui.atom+json",
"url": "https://a2uicatalog.ai/atoms/theme_toggle",
"capabilities": [
"google-apps-script-web",
"mcp-apps"
],
"description": "Floating light/dark theme switch persisted per visitor.",
"representativeQueries": [
"show a floating light dark theme switch",
"floating light/dark theme switch persisted per visitor.",
"render a theme toggle"
]
}
The renderer is an open-source Google Apps Script web app. Deploy your own instance in 4 commands — you own the URL, no dependency on the demo endpoint.
git clone https://github.com/a2uicatalog/a2ui
cd a2ui/apps-script-surface/gas-wired-renderer
clasp push && clasp deploy
Full deploy guide →