@adia-ai/a2ui-corpus 0.6.23 → 0.6.25

package/chunks/playground-render-preview.json

@@ -8,5 +8,291 @@
   "attrs": {},
   "html": "<div id=\"pg-shell\">\n      <!-- ── Toolbar ───────────────────────────────────────────── -->\n      <div id=\"pg-toolbar\">\n        <row-ui gap=\"2\" align=\"center\">\n          <icon-ui name=\"broadcast\" color=\"muted\"></icon-ui>\n          <text-ui strong>Render Preview</text-ui>\n          <badge-ui id=\"pg-status-badge\" text=\"ready\" size=\"sm\" variant=\"default\"></badge-ui>\n        </row-ui>\n        <row-ui gap=\"2\" align=\"center\">\n          <select-ui id=\"pg-example-select\" size=\"sm\" placeholder=\"Load example…\" style=\"min-width: 14rem\">\n            <option value=\"\">Load example…</option>\n            <option value=\"single-card\">Single surface — card + stat</option>\n            <option value=\"streamed-list\">Streamed updates — append items</option>\n            <option value=\"data-bindings\">Data bindings — updateDataModel</option>\n            <option value=\"multi-surface\">Multiple surfaces</option>\n            <option value=\"unknown-component\">Unknown component (graceful fallback)</option>\n          </select-ui>\n          <divider-ui vertical></divider-ui>\n          <button-ui id=\"pg-btn-step\" variant=\"ghost\" size=\"sm\" icon=\"skip-forward\" text=\"Step\" disabled></button-ui>\n          <button-ui id=\"pg-btn-run\" variant=\"primary\" size=\"sm\" icon=\"play\" text=\"Run all\"></button-ui>\n          <button-ui id=\"pg-btn-clear\" variant=\"ghost\" size=\"sm\" icon=\"trash\" text=\"Clear\"></button-ui>\n        </row-ui>\n      </div>\n\n      <!-- ── Body — input | output ─────────────────────────────── -->\n      <div id=\"pg-body\">\n        <!-- LEFT — message stream input -->\n        <section id=\"pg-input-pane\">\n          <header class=\"pg-pane-header\">\n            <text-ui weight=\"medium\" size=\"sm\">A2UI message stream</text-ui>\n            <text-ui size=\"sm\" color=\"muted\" id=\"pg-message-count\">0 messages</text-ui>\n          </header>\n          <textarea\n            id=\"pg-input\"\n            spellcheck=\"false\"\n            autocomplete=\"off\"\n            placeholder='[\n  { \"type\": \"createSurface\", \"surfaceId\": \"main\", \"root\": \"root\" },\n  { \"type\": \"updateComponents\", \"surfaceId\": \"main\", \"components\": [\n    { \"id\": \"root\", \"component\": \"Card\", \"children\": [\"title\"] },\n    { \"id\": \"title\", \"component\": \"Text\", \"variant\": \"title\", \"text\": \"Hello\" }\n  ]}\n]'\n          ></textarea>\n          <footer class=\"pg-pane-footer\" id=\"pg-input-error\" hidden>\n            <icon-ui name=\"warning\" size=\"sm\" color=\"danger\"></icon-ui>\n            <text-ui size=\"sm\" color=\"danger\" id=\"pg-input-error-text\"></text-ui>\n          </footer>\n        </section>\n\n        <!-- RIGHT — render surface + log -->\n        <section id=\"pg-output-pane\">\n          <header class=\"pg-pane-header\">\n            <text-ui weight=\"medium\" size=\"sm\">Rendered output</text-ui>\n            <row-ui gap=\"3\" align=\"center\">\n              <text-ui size=\"sm\" color=\"muted\" id=\"pg-surface-count\">0 surfaces</text-ui>\n              <text-ui size=\"sm\" color=\"muted\" id=\"pg-component-count\">0 components</text-ui>\n            </row-ui>\n          </header>\n          <div id=\"pg-surface\" aria-live=\"polite\"></div>\n          <details id=\"pg-log-panel\">\n            <summary>\n              <text-ui size=\"sm\" color=\"muted\">Message log</text-ui>\n              <text-ui size=\"sm\" color=\"muted\" id=\"pg-log-count\">0</text-ui>\n            </summary>\n            <ol id=\"pg-log\"></ol>\n          </details>\n        </section>\n      </div>\n    </div>",
   "source": "apps/genui/app/render-preview/render-preview.contents.html",
-  "captured_at": "2026-05-22T20:26:33.817Z"
+  "metadata": {
+    "domain": "layout",
+    "description": "Render preview playground — live component preview panel for the gen-UI editor.",
+    "keywords": [
+      "playground",
+      "render",
+      "preview",
+      "component",
+      "live",
+      "editor"
+    ]
+  },
+  "captured_at": "2026-05-22T23:31:51.450Z",
+  "template": [
+    {
+      "id": "broadcast",
+      "component": "Icon",
+      "name": "broadcast"
+    },
+    {
+      "id": "text",
+      "component": "Text",
+      "strong": true,
+      "textContent": "Render Preview"
+    },
+    {
+      "id": "pg-status-badge",
+      "component": "Badge",
+      "size": "sm",
+      "text": "ready",
+      "variant": "default"
+    },
+    {
+      "id": "row",
+      "component": "Row",
+      "align": "center",
+      "gap": "2",
+      "children": [
+        "broadcast",
+        "text",
+        "pg-status-badge"
+      ]
+    },
+    {
+      "id": "text-2",
+      "component": "Text",
+      "textContent": "Load example…",
+      "variant": "body"
+    },
+    {
+      "id": "text-3",
+      "component": "Text",
+      "textContent": "Single surface — card + stat",
+      "variant": "body"
+    },
+    {
+      "id": "text-4",
+      "component": "Text",
+      "textContent": "Streamed updates — append items",
+      "variant": "body"
+    },
+    {
+      "id": "text-5",
+      "component": "Text",
+      "textContent": "Data bindings — updateDataModel",
+      "variant": "body"
+    },
+    {
+      "id": "text-6",
+      "component": "Text",
+      "textContent": "Multiple surfaces",
+      "variant": "body"
+    },
+    {
+      "id": "text-7",
+      "component": "Text",
+      "textContent": "Unknown component (graceful fallback)",
+      "variant": "body"
+    },
+    {
+      "id": "pg-example-select",
+      "component": "ChoicePicker",
+      "placeholder": "Load example…",
+      "size": "sm",
+      "children": [
+        "text-2",
+        "text-3",
+        "text-4",
+        "text-5",
+        "text-6",
+        "text-7"
+      ]
+    },
+    {
+      "id": "divider",
+      "component": "Divider",
+      "vertical": true
+    },
+    {
+      "id": "pg-btn-step",
+      "component": "Button",
+      "disabled": true,
+      "icon": "skip-forward",
+      "size": "sm",
+      "text": "Step",
+      "variant": "ghost"
+    },
+    {
+      "id": "pg-btn-run",
+      "component": "Button",
+      "icon": "play",
+      "size": "sm",
+      "text": "Run all",
+      "variant": "primary"
+    },
+    {
+      "id": "pg-btn-clear",
+      "component": "Button",
+      "icon": "trash",
+      "size": "sm",
+      "text": "Clear",
+      "variant": "ghost"
+    },
+    {
+      "id": "row-2",
+      "component": "Row",
+      "align": "center",
+      "gap": "2",
+      "children": [
+        "pg-example-select",
+        "divider",
+        "pg-btn-step",
+        "pg-btn-run",
+        "pg-btn-clear"
+      ]
+    },
+    {
+      "id": "pg-toolbar",
+      "component": "Column",
+      "children": [
+        "row",
+        "row-2"
+      ]
+    },
+    {
+      "id": "text-8",
+      "component": "Text",
+      "size": "sm",
+      "weight": "medium",
+      "textContent": "A2UI message stream"
+    },
+    {
+      "id": "pg-message-count",
+      "component": "Text",
+      "color": "muted",
+      "size": "sm",
+      "textContent": "0 messages"
+    },
+    {
+      "id": "header",
+      "component": "Header",
+      "children": [
+        "text-8",
+        "pg-message-count"
+      ]
+    },
+    {
+      "id": "pg-input",
+      "component": "TextArea",
+      "placeholder": "[\n  { \"type\": \"createSurface\", \"surfaceId\": \"main\", \"root\": \"root\" },\n  { \"type\": \"updateComponents\", \"surfaceId\": \"main\", \"components\": [\n    { \"id\": \"root\", \"component\": \"Card\", \"children\": [\"title\"] },\n    { \"id\": \"title\", \"component\": \"Text\", \"variant\": \"title\", \"text\": \"Hello\" }\n  ]}\n]"
+    },
+    {
+      "id": "warning",
+      "component": "Icon",
+      "name": "warning",
+      "size": "sm"
+    },
+    {
+      "id": "pg-input-error-text",
+      "component": "Text",
+      "color": "danger",
+      "size": "sm"
+    },
+    {
+      "id": "pg-input-error",
+      "component": "Footer",
+      "children": [
+        "warning",
+        "pg-input-error-text"
+      ]
+    },
+    {
+      "id": "pg-input-pane",
+      "component": "Section",
+      "children": [
+        "header",
+        "pg-input",
+        "pg-input-error"
+      ]
+    },
+    {
+      "id": "text-9",
+      "component": "Text",
+      "size": "sm",
+      "weight": "medium",
+      "textContent": "Rendered output"
+    },
+    {
+      "id": "pg-surface-count",
+      "component": "Text",
+      "color": "muted",
+      "size": "sm",
+      "textContent": "0 surfaces"
+    },
+    {
+      "id": "pg-component-count",
+      "component": "Text",
+      "color": "muted",
+      "size": "sm",
+      "textContent": "0 components"
+    },
+    {
+      "id": "row-3",
+      "component": "Row",
+      "align": "center",
+      "gap": "3",
+      "children": [
+        "pg-surface-count",
+        "pg-component-count"
+      ]
+    },
+    {
+      "id": "header-2",
+      "component": "Header",
+      "children": [
+        "text-9",
+        "row-3"
+      ]
+    },
+    {
+      "id": "pg-surface",
+      "component": "Column"
+    },
+    {
+      "id": "text-10",
+      "component": "Text",
+      "variant": "subsection",
+      "textContent": "Message log 0"
+    },
+    {
+      "id": "pg-log",
+      "component": "List"
+    },
+    {
+      "id": "pg-log-panel",
+      "component": "Accordion",
+      "children": [
+        "text-10",
+        "pg-log"
+      ]
+    },
+    {
+      "id": "pg-output-pane",
+      "component": "Section",
+      "children": [
+        "header-2",
+        "pg-surface",
+        "pg-log-panel"
+      ]
+    },
+    {
+      "id": "pg-body",
+      "component": "Column",
+      "children": [
+        "pg-input-pane",
+        "pg-output-pane"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Column",
+      "children": [
+        "pg-toolbar",
+        "pg-body"
+      ]
+    }
+  ]
 }

package/chunks/playground-streams-bridge.json

@@ -8,5 +8,357 @@
   "attrs": {},
   "html": "<div id=\"pg-shell\">\n      <div id=\"pg-toolbar\">\n        <row-ui gap=\"2\" align=\"center\">\n          <icon-ui name=\"plug\" color=\"muted\"></icon-ui>\n          <text-ui strong>Streams Bridge</text-ui>\n          <badge-ui id=\"pg-source-badge\" text=\"loading…\" variant=\"default\" size=\"sm\"></badge-ui>\n        </row-ui>\n        <row-ui gap=\"2\">\n          <button-ui id=\"pg-btn-refresh\" variant=\"ghost\" size=\"sm\" icon=\"arrows-clockwise\" text=\"Refresh\"></button-ui>\n          <a href=\"/site/getting-started/wiring\" target=\"_top\" style=\"text-decoration: none\">\n            <button-ui variant=\"ghost\" size=\"sm\" icon=\"book-open\" text=\"Docs\"></button-ui>\n          </a>\n        </row-ui>\n      </div>\n\n      <div id=\"pg-content\">\n        <div id=\"pg-intro\">\n          <h1 style=\"margin: 0 0 var(--a-space-2) 0; font-size: var(--a-ui-lg)\">One stream, two consumers — bridged into A2UI</h1>\n          <p style=\"margin: 0; color: var(--a-text-muted); font-size: var(--a-ui-sm); line-height: 1.5\">\n            Both tiles below subscribe to the same <code>data-stream-id=\"rev-pg\"</code>, fed from <code>/site/mock/revenue.json</code>. The left tile renders a\n            <code>chart-ui</code> driven directly by the <code>data-stream-*</code> attribute trait — the trait writes the parsed response into the chart's\n            <code>.data</code> property and re-renders. The right tile is an <strong>A2UI surface</strong> built from <code>updateComponents</code> messages\n            whose props use <code>{path: '…'}</code> bindings; <code>bridgeStreamAsync</code> proxies the same stream signal into the surface's data model so\n            those bindings resolve — no second fetch (open DevTools' Network tab and confirm only one request per refresh). The bridge piggybacks on the chart's\n            refcount rather than holding its own; the DOM source remains the lifecycle owner.\n          </p>\n        </div>\n\n        <div id=\"pg-grid\">\n          <!-- LEFT — direct data-stream-* trait -->\n          <div class=\"pg-tile\">\n            <h3>Direct via <code>data-stream-src</code></h3>\n            <div id=\"chart-host\">\n              <chart-ui\n                id=\"pg-chart\"\n                type=\"area\"\n                x=\"month\"\n                y=\"revenue\"\n                data-stream-src=\"/site/mock/revenue.json\"\n                data-stream-path=\"data\"\n                data-stream-id=\"rev-pg\"\n                aria-label=\"Revenue chart fed via data-stream-src\"\n                style=\"display: block; width: 100%; height: 280px\"\n              ></chart-ui>\n            </div>\n          </div>\n\n          <!-- RIGHT — A2UI surface, bound via bridgeStreamAsync -->\n          <div class=\"pg-tile\">\n            <h3>Via <code>bridgeStreamAsync</code> → A2UI surface</h3>\n            <div id=\"a2ui-host\">\n              <empty-state-ui\n                icon=\"hourglass\"\n                heading=\"Waiting for stream…\"\n                description=\"The bridge will populate these bindings once the fetch resolves.\"\n              ></empty-state-ui>\n            </div>\n          </div>\n        </div>\n\n        <div id=\"pg-status\">\n          <div data-pg-status-row><strong>Stream id:</strong> <code id=\"pg-status-id\">id:rev-pg</code></div>\n          <div data-pg-status-row><strong>Stream signal:</strong> <span id=\"pg-status-signal\">—</span></div>\n          <div data-pg-status-row><strong>Surface dataModel:</strong> <code id=\"pg-status-model\">—</code></div>\n          <div data-pg-status-row><strong>DOM consumer refs:</strong> <span id=\"pg-status-refs\">—</span></div>\n          <div data-pg-status-row><strong>Last fetch:</strong> <span id=\"pg-status-fetched\">—</span></div>\n        </div>\n\n        <details id=\"pg-code-panel\">\n          <summary>Show the wiring (bridge call + A2UI messages)</summary>\n          <div>\n            <code-ui language=\"javascript\" id=\"pg-code-block\" style=\"font-size: var(--a-ui-sm)\"></code-ui>\n          </div>\n        </details>\n      </div>\n    </div>",
   "source": "apps/genui/app/streams-bridge/streams-bridge.contents.html",
-  "captured_at": "2026-05-22T20:26:33.817Z"
+  "metadata": {
+    "domain": "agent",
+    "description": "Streams bridge playground — LLM streaming proxy connection demo.",
+    "keywords": [
+      "playground",
+      "streams",
+      "bridge",
+      "llm",
+      "streaming",
+      "proxy",
+      "connection"
+    ]
+  },
+  "captured_at": "2026-05-22T23:31:51.450Z",
+  "template": [
+    {
+      "id": "plug",
+      "component": "Icon",
+      "name": "plug"
+    },
+    {
+      "id": "text",
+      "component": "Text",
+      "strong": true,
+      "textContent": "Streams Bridge"
+    },
+    {
+      "id": "pg-source-badge",
+      "component": "Badge",
+      "size": "sm",
+      "text": "loading…",
+      "variant": "default"
+    },
+    {
+      "id": "row",
+      "component": "Row",
+      "align": "center",
+      "gap": "2",
+      "children": [
+        "plug",
+        "text",
+        "pg-source-badge"
+      ]
+    },
+    {
+      "id": "pg-btn-refresh",
+      "component": "Button",
+      "icon": "arrows-clockwise",
+      "size": "sm",
+      "text": "Refresh",
+      "variant": "ghost"
+    },
+    {
+      "id": "button",
+      "component": "Button",
+      "icon": "book-open",
+      "size": "sm",
+      "text": "Docs",
+      "variant": "ghost"
+    },
+    {
+      "id": "link",
+      "component": "Link",
+      "href": "/site/getting-started/wiring",
+      "target": "_top",
+      "children": [
+        "button"
+      ]
+    },
+    {
+      "id": "row-2",
+      "component": "Row",
+      "gap": "2",
+      "children": [
+        "pg-btn-refresh",
+        "link"
+      ]
+    },
+    {
+      "id": "pg-toolbar",
+      "component": "Column",
+      "children": [
+        "row",
+        "row-2"
+      ]
+    },
+    {
+      "id": "text-2",
+      "component": "Text",
+      "variant": "display",
+      "textContent": "One stream, two consumers — bridged into A2UI"
+    },
+    {
+      "id": "text-3",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "Both tiles below subscribe to the same data-stream-id=\"rev-pg\" , fed from /site/mock/revenue.json . The left tile renders a chart-ui driven directly by the data-stream-* attribute trait — the trait writes the parsed response into the chart's .data property and re-renders. The right tile is an A2UI surface built from updateComponents messages whose props use {path: '…'} bindings; bridgeStreamAsync proxies the same stream signal into the surface's data model so those bindings resolve — no second fetch (open DevTools' Network tab and confirm only one request per refresh). The bridge piggybacks on the chart's refcount rather than holding its own; the DOM source remains the lifecycle owner."
+    },
+    {
+      "id": "column",
+      "component": "Column",
+      "children": [
+        "text-2",
+        "text-3"
+      ]
+    },
+    {
+      "id": "section",
+      "component": "Section",
+      "children": [
+        "column"
+      ]
+    },
+    {
+      "id": "pg-intro",
+      "component": "Card",
+      "children": [
+        "section"
+      ]
+    },
+    {
+      "id": "text-4",
+      "component": "Text",
+      "variant": "heading",
+      "textContent": "Direct via data-stream-src"
+    },
+    {
+      "id": "pg-chart",
+      "component": "Chart",
+      "type": "area",
+      "x": "month",
+      "y": "revenue",
+      "data-stream-src": "/site/mock/revenue.json",
+      "data-stream-path": "data",
+      "data-stream-id": "rev-pg"
+    },
+    {
+      "id": "column-2",
+      "component": "Column",
+      "children": [
+        "text-4",
+        "pg-chart"
+      ]
+    },
+    {
+      "id": "section-2",
+      "component": "Section",
+      "children": [
+        "column-2"
+      ]
+    },
+    {
+      "id": "card",
+      "component": "Card",
+      "children": [
+        "section-2"
+      ]
+    },
+    {
+      "id": "text-5",
+      "component": "Text",
+      "variant": "heading",
+      "textContent": "Via bridgeStreamAsync → A2UI surface"
+    },
+    {
+      "id": "empty-state",
+      "component": "EmptyState",
+      "description": "The bridge will populate these bindings once the fetch resolves.",
+      "heading": "Waiting for stream…",
+      "icon": "hourglass"
+    },
+    {
+      "id": "column-3",
+      "component": "Column",
+      "children": [
+        "text-5",
+        "empty-state"
+      ]
+    },
+    {
+      "id": "section-3",
+      "component": "Section",
+      "children": [
+        "column-3"
+      ]
+    },
+    {
+      "id": "card-2",
+      "component": "Card",
+      "children": [
+        "section-3"
+      ]
+    },
+    {
+      "id": "pg-grid",
+      "component": "Column",
+      "children": [
+        "card",
+        "card-2"
+      ]
+    },
+    {
+      "id": "text-6",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "Stream id:"
+    },
+    {
+      "id": "pg-status-id",
+      "component": "Code",
+      "textContent": "id:rev-pg"
+    },
+    {
+      "id": "column-4",
+      "component": "Column",
+      "data-pg-status-row": "",
+      "children": [
+        "text-6",
+        "pg-status-id"
+      ]
+    },
+    {
+      "id": "text-7",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "Stream signal:"
+    },
+    {
+      "id": "pg-status-signal",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "—"
+    },
+    {
+      "id": "column-5",
+      "component": "Column",
+      "data-pg-status-row": "",
+      "children": [
+        "text-7",
+        "pg-status-signal"
+      ]
+    },
+    {
+      "id": "text-8",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "Surface dataModel:"
+    },
+    {
+      "id": "pg-status-model",
+      "component": "Code",
+      "textContent": "—"
+    },
+    {
+      "id": "column-6",
+      "component": "Column",
+      "data-pg-status-row": "",
+      "children": [
+        "text-8",
+        "pg-status-model"
+      ]
+    },
+    {
+      "id": "text-9",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "DOM consumer refs:"
+    },
+    {
+      "id": "pg-status-refs",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "—"
+    },
+    {
+      "id": "column-7",
+      "component": "Column",
+      "data-pg-status-row": "",
+      "children": [
+        "text-9",
+        "pg-status-refs"
+      ]
+    },
+    {
+      "id": "text-10",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "Last fetch:"
+    },
+    {
+      "id": "pg-status-fetched",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "—"
+    },
+    {
+      "id": "column-8",
+      "component": "Column",
+      "data-pg-status-row": "",
+      "children": [
+        "text-10",
+        "pg-status-fetched"
+      ]
+    },
+    {
+      "id": "pg-status",
+      "component": "Column",
+      "children": [
+        "column-4",
+        "column-5",
+        "column-6",
+        "column-7",
+        "column-8"
+      ]
+    },
+    {
+      "id": "text-11",
+      "component": "Text",
+      "variant": "subsection",
+      "textContent": "Show the wiring (bridge call + A2UI messages)"
+    },
+    {
+      "id": "pg-code-block",
+      "component": "Code",
+      "language": "javascript"
+    },
+    {
+      "id": "pg-code-panel",
+      "component": "Accordion",
+      "children": [
+        "text-11",
+        "pg-code-block"
+      ]
+    },
+    {
+      "id": "pg-content",
+      "component": "Column",
+      "children": [
+        "pg-intro",
+        "pg-grid",
+        "pg-status",
+        "pg-code-panel"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Column",
+      "children": [
+        "pg-toolbar",
+        "pg-content"
+      ]
+    }
+  ]
 }

package/chunks/playground-table-toolbar.json

@@ -12,5 +12,24 @@
   },
   "html": "<table-toolbar-ui for=\"employees\" text=\"All Employees\" count=\"32\"></table-toolbar-ui>",
   "source": "playgrounds/table-toolbar/app/table-toolbar.contents.html",
-  "captured_at": "2026-05-22T20:26:33.817Z"
+  "metadata": {
+    "domain": "data",
+    "description": "Table toolbar playground — table with toolbar controls demo.",
+    "keywords": [
+      "playground",
+      "table",
+      "toolbar",
+      "search",
+      "filter",
+      "sort",
+      "demo"
+    ]
+  },
+  "captured_at": "2026-05-22T23:31:51.450Z",
+  "template": [
+    {
+      "id": "root",
+      "component": "Column"
+    }
+  ]
 }