@adia-ai/a2ui-corpus 0.6.41 → 0.6.42

package/chunks/permission-matrix-table.json

@@ -0,0 +1,431 @@
+{
+  "name": "permission-matrix-table",
+  "kind": "block",
+  "primary": "card-ui",
+  "page": "/catalog/ui-patterns/app/permission-matrix-table/permission-matrix-table.contents.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {},
+  "html": "<card-ui>\n  <header>\n    <h3>Role Permissions</h3>\n    <p slot=\"description\">Configure access rights for each role across your workspace.</p>\n  </header>\n  <section>\n    <col-ui gap=\"3\">\n      <grid-ui columns=\"4\" gap=\"4\">\n        <text-ui strong size=\"sm\" color=\"subtle\">Permission</text-ui>\n        <col-ui gap=\"1\" align=\"center\">\n          <badge-ui text=\"Viewer\" variant=\"muted\"></badge-ui>\n        </col-ui>\n        <col-ui gap=\"1\" align=\"center\">\n          <badge-ui text=\"Editor\" variant=\"accent\"></badge-ui>\n        </col-ui>\n        <col-ui gap=\"1\" align=\"center\">\n          <badge-ui text=\"Admin\" variant=\"danger\"></badge-ui>\n        </col-ui>\n      </grid-ui>\n      <divider-ui></divider-ui>\n      <grid-ui columns=\"4\" gap=\"4\">\n        <text-ui size=\"sm\">View content</text-ui>\n        <col-ui align=\"center\"><check-ui checked></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui checked></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui checked></check-ui></col-ui>\n      </grid-ui>\n      <grid-ui columns=\"4\" gap=\"4\">\n        <text-ui size=\"sm\">Edit content</text-ui>\n        <col-ui align=\"center\"><check-ui></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui checked></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui checked></check-ui></col-ui>\n      </grid-ui>\n      <grid-ui columns=\"4\" gap=\"4\">\n        <text-ui size=\"sm\">Invite members</text-ui>\n        <col-ui align=\"center\"><check-ui></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui checked></check-ui></col-ui>\n      </grid-ui>\n      <grid-ui columns=\"4\" gap=\"4\">\n        <text-ui size=\"sm\">Manage billing</text-ui>\n        <col-ui align=\"center\"><check-ui></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui checked></check-ui></col-ui>\n      </grid-ui>\n      <grid-ui columns=\"4\" gap=\"4\">\n        <text-ui size=\"sm\">Delete workspace</text-ui>\n        <col-ui align=\"center\"><check-ui></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui></check-ui></col-ui>\n        <col-ui align=\"center\"><check-ui checked></check-ui></col-ui>\n      </grid-ui>\n    </col-ui>\n  </section>\n</card-ui>",
+  "source": "catalog/ui-patterns/app/permission-matrix-table/permission-matrix-table.contents.html",
+  "metadata": {
+    "domain": "settings",
+    "description": "Permission matrix with roles as columns and resources as rows with checkboxes. Color-coded role badges with checkbox state per permission.",
+    "keywords": [
+      "permission",
+      "matrix",
+      "roles",
+      "columns",
+      "resources",
+      "rows",
+      "checkboxes",
+      "access",
+      "control",
+      "viewer",
+      "editor",
+      "admin",
+      "RBAC",
+      "authorization",
+      "permissions"
+    ]
+  },
+  "captured_at": "2026-05-27T03:59:46.910Z",
+  "template": [
+    {
+      "id": "text",
+      "component": "Text",
+      "variant": "heading",
+      "textContent": "Role Permissions"
+    },
+    {
+      "id": "text-2",
+      "component": "Text",
+      "variant": "body",
+      "textContent": "Configure access rights for each role across your workspace."
+    },
+    {
+      "id": "header",
+      "component": "Header",
+      "children": [
+        "text",
+        "text-2"
+      ]
+    },
+    {
+      "id": "text-3",
+      "component": "Text",
+      "color": "subtle",
+      "size": "sm",
+      "strong": true,
+      "textContent": "Permission"
+    },
+    {
+      "id": "badge",
+      "component": "Badge",
+      "text": "Viewer",
+      "variant": "muted"
+    },
+    {
+      "id": "column-2",
+      "component": "Column",
+      "align": "center",
+      "gap": "1",
+      "children": [
+        "badge"
+      ]
+    },
+    {
+      "id": "badge-2",
+      "component": "Badge",
+      "text": "Editor",
+      "variant": "accent"
+    },
+    {
+      "id": "column-3",
+      "component": "Column",
+      "align": "center",
+      "gap": "1",
+      "children": [
+        "badge-2"
+      ]
+    },
+    {
+      "id": "badge-3",
+      "component": "Badge",
+      "text": "Admin",
+      "variant": "danger"
+    },
+    {
+      "id": "column-4",
+      "component": "Column",
+      "align": "center",
+      "gap": "1",
+      "children": [
+        "badge-3"
+      ]
+    },
+    {
+      "id": "grid",
+      "component": "Grid",
+      "columns": "4",
+      "gap": "4",
+      "children": [
+        "text-3",
+        "column-2",
+        "column-3",
+        "column-4"
+      ]
+    },
+    {
+      "id": "divider",
+      "component": "Divider"
+    },
+    {
+      "id": "text-4",
+      "component": "Text",
+      "size": "sm",
+      "textContent": "View content"
+    },
+    {
+      "id": "check-box",
+      "component": "CheckBox",
+      "checked": true
+    },
+    {
+      "id": "column-5",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box"
+      ]
+    },
+    {
+      "id": "check-box-2",
+      "component": "CheckBox",
+      "checked": true
+    },
+    {
+      "id": "column-6",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-2"
+      ]
+    },
+    {
+      "id": "check-box-3",
+      "component": "CheckBox",
+      "checked": true
+    },
+    {
+      "id": "column-7",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-3"
+      ]
+    },
+    {
+      "id": "grid-2",
+      "component": "Grid",
+      "columns": "4",
+      "gap": "4",
+      "children": [
+        "text-4",
+        "column-5",
+        "column-6",
+        "column-7"
+      ]
+    },
+    {
+      "id": "text-5",
+      "component": "Text",
+      "size": "sm",
+      "textContent": "Edit content"
+    },
+    {
+      "id": "check-box-4",
+      "component": "CheckBox"
+    },
+    {
+      "id": "column-8",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-4"
+      ]
+    },
+    {
+      "id": "check-box-5",
+      "component": "CheckBox",
+      "checked": true
+    },
+    {
+      "id": "column-9",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-5"
+      ]
+    },
+    {
+      "id": "check-box-6",
+      "component": "CheckBox",
+      "checked": true
+    },
+    {
+      "id": "column-10",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-6"
+      ]
+    },
+    {
+      "id": "grid-3",
+      "component": "Grid",
+      "columns": "4",
+      "gap": "4",
+      "children": [
+        "text-5",
+        "column-8",
+        "column-9",
+        "column-10"
+      ]
+    },
+    {
+      "id": "text-6",
+      "component": "Text",
+      "size": "sm",
+      "textContent": "Invite members"
+    },
+    {
+      "id": "check-box-7",
+      "component": "CheckBox"
+    },
+    {
+      "id": "column-11",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-7"
+      ]
+    },
+    {
+      "id": "check-box-8",
+      "component": "CheckBox"
+    },
+    {
+      "id": "column-12",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-8"
+      ]
+    },
+    {
+      "id": "check-box-9",
+      "component": "CheckBox",
+      "checked": true
+    },
+    {
+      "id": "column-13",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-9"
+      ]
+    },
+    {
+      "id": "grid-4",
+      "component": "Grid",
+      "columns": "4",
+      "gap": "4",
+      "children": [
+        "text-6",
+        "column-11",
+        "column-12",
+        "column-13"
+      ]
+    },
+    {
+      "id": "text-7",
+      "component": "Text",
+      "size": "sm",
+      "textContent": "Manage billing"
+    },
+    {
+      "id": "check-box-10",
+      "component": "CheckBox"
+    },
+    {
+      "id": "column-14",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-10"
+      ]
+    },
+    {
+      "id": "check-box-11",
+      "component": "CheckBox"
+    },
+    {
+      "id": "column-15",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-11"
+      ]
+    },
+    {
+      "id": "check-box-12",
+      "component": "CheckBox",
+      "checked": true
+    },
+    {
+      "id": "column-16",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-12"
+      ]
+    },
+    {
+      "id": "grid-5",
+      "component": "Grid",
+      "columns": "4",
+      "gap": "4",
+      "children": [
+        "text-7",
+        "column-14",
+        "column-15",
+        "column-16"
+      ]
+    },
+    {
+      "id": "text-8",
+      "component": "Text",
+      "size": "sm",
+      "textContent": "Delete workspace"
+    },
+    {
+      "id": "check-box-13",
+      "component": "CheckBox"
+    },
+    {
+      "id": "column-17",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-13"
+      ]
+    },
+    {
+      "id": "check-box-14",
+      "component": "CheckBox"
+    },
+    {
+      "id": "column-18",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-14"
+      ]
+    },
+    {
+      "id": "check-box-15",
+      "component": "CheckBox",
+      "checked": true
+    },
+    {
+      "id": "column-19",
+      "component": "Column",
+      "align": "center",
+      "children": [
+        "check-box-15"
+      ]
+    },
+    {
+      "id": "grid-6",
+      "component": "Grid",
+      "columns": "4",
+      "gap": "4",
+      "children": [
+        "text-8",
+        "column-17",
+        "column-18",
+        "column-19"
+      ]
+    },
+    {
+      "id": "column",
+      "component": "Column",
+      "gap": "3",
+      "children": [
+        "grid",
+        "divider",
+        "grid-2",
+        "grid-3",
+        "grid-4",
+        "grid-5",
+        "grid-6"
+      ]
+    },
+    {
+      "id": "section",
+      "component": "Section",
+      "children": [
+        "column"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Card",
+      "children": [
+        "header",
+        "section"
+      ]
+    }
+  ]
+}

package/chunks/playground-a2ui.json

@@ -19,7 +19,7 @@
       "interface"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "layout",

package/chunks/playground-app-shell.json

@@ -24,7 +24,7 @@
       "topbar"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "workspace-select",

package/chunks/playground-chat.json

@@ -23,7 +23,7 @@
       "agent"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "text",

package/chunks/playground-construct-canvas.json

@@ -21,7 +21,7 @@
       "editor"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "canvas-host",

package/chunks/playground-css-channel.json

@@ -25,7 +25,7 @@
       "parallel-channels"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "palette",

package/chunks/playground-gen-ui.json

@@ -8,7 +8,7 @@
   "attrs": {
     "data-view": "chat"
   },
-  "html": "<div id=\"gen-ui-shell\" data-view=\"chat\">\n      <!-- Chat pane (resizable via pane-ui) -->\n      <pane-ui id=\"chat-pane\" resizable min-width=\"280\">\n        <section>\n          <chat-shell id=\"gen-chat\">\n            <chat-thread>\n              <chat-empty>\n                <empty-state-ui icon=\"magic-wand\" heading=\"AdiaUI Generator\" description=\"Describe a UI and watch it render live.\">\n                </empty-state-ui>\n              </chat-empty>\n            </chat-thread>\n            <chat-composer>\n              <chat-input-ui placeholder=\"Describe a UI...\"></chat-input-ui>\n            </chat-composer>\n          </chat-shell>\n        </section>\n      </pane-ui>\n\n      <!-- Canvas panel (plain div — no collapse behavior) -->\n      <div id=\"canvas-panel\">\n        <div id=\"canvas-toolbar\">\n          <row-ui gap=\"2\" align=\"center\">\n            <button-ui id=\"btn-toggle-view\" text=\"Chat\" variant=\"ghost\" size=\"sm\" icon=\"chat-circle\"></button-ui>\n            <icon-ui name=\"layout\" color=\"muted\"></icon-ui>\n            <text-ui strong>Canvas</text-ui>\n            <badge-ui id=\"validation-badge\" text=\"\" variant=\"default\" size=\"sm\" hidden></badge-ui>\n          </row-ui>\n          <row-ui gap=\"1\">\n            <button-ui id=\"btn-back\" variant=\"ghost\" size=\"sm\" icon=\"arrow-left\" disabled></button-ui>\n            <button-ui id=\"btn-forward\" variant=\"ghost\" size=\"sm\" icon=\"arrow-right\" disabled></button-ui>\n            <button-ui id=\"btn-clear\" variant=\"ghost\" size=\"sm\" icon=\"trash\"></button-ui>\n            <button-ui id=\"btn-code\" variant=\"ghost\" size=\"sm\" icon=\"code\"></button-ui>\n          </row-ui>\n        </div>\n        <section>\n          <canvas-ui id=\"canvas\"></canvas-ui>\n        </section>\n        <footer id=\"code-panel\" hidden>\n          <code-ui id=\"code-view\" language=\"json\" style=\"font-size: var(--a-ui-sm)\"></code-ui>\n        </footer>\n      </div>\n    </div>",
+  "html": "<div id=\"gen-ui-shell\" data-view=\"chat\">\n      <!-- Chat pane (resizable via pane-ui) -->\n      <pane-ui id=\"chat-pane\" resizable min-width=\"280\">\n        <section>\n          <chat-shell id=\"gen-chat\">\n            <chat-thread>\n              <chat-empty>\n                <empty-state-ui icon=\"magic-wand\" heading=\"AdiaUI Generator\" description=\"Describe a UI and watch it render live.\">\n                </empty-state-ui>\n              </chat-empty>\n            </chat-thread>\n            <chat-composer>\n              <chat-input-ui placeholder=\"Describe a UI...\"></chat-input-ui>\n            </chat-composer>\n          </chat-shell>\n        </section>\n      </pane-ui>\n\n      <!-- Canvas panel (plain div — no collapse behavior) -->\n      <div id=\"canvas-panel\">\n        <div id=\"canvas-toolbar\">\n          <row-ui gap=\"2\" align=\"center\">\n            <button-ui id=\"btn-toggle-view\" text=\"Chat\" variant=\"ghost\" size=\"sm\" icon=\"chat-circle\"></button-ui>\n            <icon-ui name=\"layout\" color=\"muted\"></icon-ui>\n            <text-ui strong>Canvas</text-ui>\n            <badge-ui id=\"validation-badge\" text=\"\" variant=\"default\" size=\"sm\" hidden></badge-ui>\n          </row-ui>\n          <row-ui gap=\"1\">\n            <button-ui id=\"btn-back\" variant=\"ghost\" size=\"sm\" icon=\"arrow-left\" disabled></button-ui>\n            <button-ui id=\"btn-forward\" variant=\"ghost\" size=\"sm\" icon=\"arrow-right\" disabled></button-ui>\n            <button-ui id=\"btn-clear\" variant=\"ghost\" size=\"sm\" icon=\"trash\"></button-ui>\n            <button-ui id=\"btn-code\" variant=\"ghost\" size=\"sm\" icon=\"code\"></button-ui>\n            <button-ui id=\"btn-gallery\" variant=\"ghost\" size=\"sm\" icon=\"squares-four\" text=\"Gallery\" onclick=\"window.open('/apps/genui/app/gen-ui-gallery/gen-ui-gallery.html','_blank')\"></button-ui>\n          </row-ui>\n        </div>\n        <section>\n          <canvas-ui id=\"canvas\"></canvas-ui>\n        </section>\n        <footer id=\"code-panel\" hidden>\n          <code-ui id=\"code-view\" language=\"json\" style=\"font-size: var(--a-ui-sm)\"></code-ui>\n        </footer>\n      </div>\n    </div>",
   "source": "apps/genui/app/gen-ui/gen-ui.contents.html",
   "metadata": {
     "domain": "layout",
@@ -24,7 +24,7 @@
       "preview"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "empty-state",
@@ -149,6 +149,14 @@
       "size": "sm",
       "variant": "ghost"
     },
+    {
+      "id": "btn-gallery",
+      "component": "Button",
+      "icon": "squares-four",
+      "size": "sm",
+      "text": "Gallery",
+      "variant": "ghost"
+    },
     {
       "id": "row-2",
       "component": "Row",
@@ -157,7 +165,8 @@
         "btn-back",
         "btn-forward",
         "btn-clear",
-        "btn-code"
+        "btn-code",
+        "btn-gallery"
       ]
     },
     {

package/chunks/playground-render-preview.json

@@ -20,7 +20,7 @@
       "editor"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "broadcast",

package/chunks/playground-streams-bridge.json

@@ -21,7 +21,7 @@
       "connection"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "plug",

package/chunks/playground-table-toolbar.json

@@ -25,7 +25,7 @@
       "demo"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "root",

package/chunks/popover-with-content.json

@@ -25,7 +25,7 @@
       "dropdown"
     ]
   },
-  "captured_at": "2026-05-26T04:00:28.271Z",
+  "captured_at": "2026-05-27T03:59:46.910Z",
   "template": [
     {
       "id": "text",