@adia-ai/a2ui-corpus 0.7.20 → 0.7.22

package/chunks/avatar-stack-overflow.json

@@ -0,0 +1,124 @@
+{
+  "name": "avatar-stack-overflow",
+  "kind": "block",
+  "primary": "section",
+  "page": "/catalog/ui-patterns/v050-content-blocks/v050-content-blocks.contents.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {},
+  "html": "<section>\n    <row-ui gap=\"3\" align=\"center\">\n      <avatar-group-ui max=\"4\" size=\"sm\">\n        <avatar-ui text=\"Marco Rossi\"></avatar-ui>\n        <avatar-ui text=\"June Chen\"></avatar-ui>\n        <avatar-ui text=\"Diana Singh\"></avatar-ui>\n        <avatar-ui text=\"Aaron Tan\"></avatar-ui>\n        <avatar-ui text=\"Bea Lopez\"></avatar-ui>\n        <avatar-ui text=\"Sam Park\"></avatar-ui>\n        <avatar-ui text=\"Tariq Idris\"></avatar-ui>\n      </avatar-group-ui>\n      <text-ui size=\"sm\" color=\"subtle\">7 collaborators</text-ui>\n    </row-ui>\n  </section>",
+  "source": "catalog/ui-patterns/v050-content-blocks/v050-content-blocks.contents.html",
+  "metadata": {
+    "domain": "display",
+    "description": "Avatar stack with overflow — a row of overlapping member avatars capped at a maximum, with a +N counter for the rest, beside a short 'who's on this' label. The compact 'shared with / collaborators / participants' presence cluster.",
+    "keywords": [
+      "avatar",
+      "stack",
+      "group",
+      "overlap",
+      "overflow",
+      "members",
+      "collaborators",
+      "participants",
+      "people",
+      "team",
+      "shared",
+      "with",
+      "assignees",
+      "attendees",
+      "presence",
+      "faces",
+      "avatar",
+      "group",
+      "plus",
+      "n",
+      "more",
+      "count",
+      "roster",
+      "contributors",
+      "who",
+      "is",
+      "here",
+      "facepile",
+      "overlapping",
+      "avatars"
+    ]
+  },
+  "captured_at": "2026-06-10T19:45:40.486Z",
+  "template": [
+    {
+      "id": "avatar",
+      "component": "Avatar",
+      "text": "Marco Rossi"
+    },
+    {
+      "id": "avatar-2",
+      "component": "Avatar",
+      "text": "June Chen"
+    },
+    {
+      "id": "avatar-3",
+      "component": "Avatar",
+      "text": "Diana Singh"
+    },
+    {
+      "id": "avatar-4",
+      "component": "Avatar",
+      "text": "Aaron Tan"
+    },
+    {
+      "id": "avatar-5",
+      "component": "Avatar",
+      "text": "Bea Lopez"
+    },
+    {
+      "id": "avatar-6",
+      "component": "Avatar",
+      "text": "Sam Park"
+    },
+    {
+      "id": "avatar-7",
+      "component": "Avatar",
+      "text": "Tariq Idris"
+    },
+    {
+      "id": "avatar-group",
+      "component": "AvatarGroup",
+      "max": 4,
+      "size": "sm",
+      "children": [
+        "avatar",
+        "avatar-2",
+        "avatar-3",
+        "avatar-4",
+        "avatar-5",
+        "avatar-6",
+        "avatar-7"
+      ]
+    },
+    {
+      "id": "text",
+      "component": "Text",
+      "color": "subtle",
+      "size": "sm",
+      "textContent": "7 collaborators"
+    },
+    {
+      "id": "row",
+      "component": "Row",
+      "align": "center",
+      "gap": "3",
+      "children": [
+        "avatar-group",
+        "text"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Section",
+      "children": [
+        "row"
+      ]
+    }
+  ]
+}

package/chunks/bulk-selection-actions-bar.json

@@ -0,0 +1,161 @@
+{
+  "name": "bulk-selection-actions-bar",
+  "kind": "block",
+  "primary": "section",
+  "page": "/catalog/ui-patterns/v050-data-blocks/v050-data-blocks.contents.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {},
+  "html": "<section>\n    <card-ui raw>\n      <section>\n        <row-ui gap=\"3\" align=\"center\" justify=\"between\">\n          <row-ui gap=\"2\" align=\"center\">\n            <button-ui icon=\"x\" variant=\"ghost\" size=\"sm\"></button-ui>\n            <text-ui strong size=\"sm\">12 selected</text-ui>\n          </row-ui>\n          <row-ui gap=\"2\">\n            <button-ui text=\"Export\" icon=\"download-simple\" variant=\"outline\" size=\"sm\"></button-ui>\n            <button-ui text=\"Move\" icon=\"folder\" variant=\"outline\" size=\"sm\"></button-ui>\n            <button-ui text=\"Tag\" icon=\"tag\" variant=\"outline\" size=\"sm\"></button-ui>\n            <button-ui text=\"Delete\" icon=\"trash\" variant=\"outline\" size=\"sm\" color=\"danger\"></button-ui>\n          </row-ui>\n        </row-ui>\n      </section>\n    </card-ui>\n  </section>",
+  "source": "catalog/ui-patterns/v050-data-blocks/v050-data-blocks.contents.html",
+  "metadata": {
+    "domain": "data-management",
+    "description": "Bulk selection actions bar — a highlighted toolbar that appears when rows are selected, showing the selected-count on the left and a cluster of bulk operations (Export, Move, Tag, Delete) on the right. The 'N selected — do something to all of them' batch-action strip above a data table.",
+    "keywords": [
+      "bulk",
+      "selection",
+      "actions",
+      "bar",
+      "batch",
+      "operations",
+      "selected",
+      "rows",
+      "toolbar",
+      "multi-select",
+      "export",
+      "move",
+      "tag",
+      "delete",
+      "archive",
+      "count",
+      "clear",
+      "selection",
+      "data",
+      "management",
+      "table",
+      "bulk",
+      "edit",
+      "mass",
+      "action",
+      "apply",
+      "to",
+      "all",
+      "batch",
+      "toolbar",
+      "selected",
+      "items",
+      "deselect"
+    ]
+  },
+  "captured_at": "2026-06-10T19:45:40.486Z",
+  "template": [
+    {
+      "id": "button",
+      "component": "Button",
+      "icon": "x",
+      "size": "sm",
+      "variant": "ghost"
+    },
+    {
+      "id": "text",
+      "component": "Text",
+      "size": "sm",
+      "strong": true,
+      "textContent": "12 selected"
+    },
+    {
+      "id": "row-2",
+      "component": "Row",
+      "align": "center",
+      "gap": "2",
+      "children": [
+        "button",
+        "text"
+      ]
+    },
+    {
+      "id": "button-2",
+      "component": "Button",
+      "icon": "download-simple",
+      "size": "sm",
+      "text": "Export",
+      "variant": "outline"
+    },
+    {
+      "id": "button-3",
+      "component": "Button",
+      "icon": "folder",
+      "size": "sm",
+      "text": "Move",
+      "variant": "outline"
+    },
+    {
+      "id": "button-4",
+      "component": "Button",
+      "icon": "tag",
+      "size": "sm",
+      "text": "Tag",
+      "variant": "outline"
+    },
+    {
+      "id": "button-5",
+      "component": "Button",
+      "color": "danger",
+      "icon": "trash",
+      "size": "sm",
+      "text": "Delete",
+      "variant": "outline"
+    },
+    {
+      "id": "row-3",
+      "component": "Row",
+      "gap": "2",
+      "children": [
+        "button-2",
+        "button-3",
+        "button-4",
+        "button-5"
+      ]
+    },
+    {
+      "id": "row",
+      "component": "Row",
+      "align": "center",
+      "gap": "3",
+      "justify": "between",
+      "children": [
+        "row-2",
+        "row-3"
+      ]
+    },
+    {
+      "id": "section",
+      "component": "Section",
+      "children": [
+        "column"
+      ]
+    },
+    {
+      "id": "column",
+      "component": "Column",
+      "children": [
+        "row"
+      ]
+    },
+    {
+      "id": "card",
+      "component": "Card",
+      "raw": true,
+      "children": [
+        "section"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Section",
+      "children": [
+        "card"
+      ]
+    }
+  ]
+}

package/chunks/card-with-empty-state.json

@@ -0,0 +1,96 @@
+{
+  "name": "card-with-empty-state",
+  "kind": "block",
+  "primary": "div",
+  "page": "/packages/web-components/components/card/card.examples.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-artifact-item": "",
+    "data-artifact-label": "card with empty state"
+  },
+  "html": "<card-ui style=\"max-width:400px\">\n        <header>\n          <h3>Recent transactions</h3>\n          <button-ui slot=\"action\" text=\"+ Add\" variant=\"outline\" size=\"sm\"></button-ui>\n        </header>\n        <section>\n          <empty-state-ui\n            icon=\"receipt\"\n            label=\"No transactions yet\"\n            description=\"Transactions will appear here once your first payment is processed.\">\n            <button-ui slot=\"action\" text=\"Set up payments\" variant=\"primary\"></button-ui>\n          </empty-state-ui>\n        </section>\n      </card-ui>",
+  "source": "packages/web-components/components/card/card.examples.html",
+  "metadata": {
+    "domain": "data",
+    "description": "Empty state card — card showing no-data placeholder with icon, message, and CTA. Use when a data table or list has no rows.",
+    "keywords": [
+      "card",
+      "empty",
+      "state",
+      "no",
+      "data",
+      "placeholder",
+      "icon",
+      "cta",
+      "button",
+      "list",
+      "table",
+      "zero",
+      "rows"
+    ]
+  },
+  "captured_at": "2026-06-10T20:25:14.783Z",
+  "template": [
+    {
+      "id": "text",
+      "component": "Text",
+      "variant": "heading",
+      "textContent": "Recent transactions"
+    },
+    {
+      "id": "button",
+      "component": "Button",
+      "slot": "action",
+      "size": "sm",
+      "text": "+ Add",
+      "variant": "outline"
+    },
+    {
+      "id": "header",
+      "component": "Header",
+      "children": [
+        "text",
+        "button"
+      ]
+    },
+    {
+      "id": "button-2",
+      "component": "Button",
+      "slot": "action",
+      "text": "Set up payments",
+      "variant": "primary"
+    },
+    {
+      "id": "empty-state",
+      "component": "EmptyState",
+      "description": "Transactions will appear here once your first payment is processed.",
+      "icon": "receipt",
+      "children": [
+        "button-2"
+      ]
+    },
+    {
+      "id": "section",
+      "component": "Section",
+      "children": [
+        "column"
+      ]
+    },
+    {
+      "id": "column",
+      "component": "Column",
+      "children": [
+        "empty-state"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Card",
+      "children": [
+        "header",
+        "section"
+      ]
+    }
+  ]
+}

package/chunks/card-with-form.json

@@ -0,0 +1,143 @@
+{
+  "name": "card-with-form",
+  "kind": "block",
+  "primary": "div",
+  "page": "/packages/web-components/components/card/card.examples.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-artifact-item": "",
+    "data-artifact-label": "card with form fields"
+  },
+  "html": "<card-ui style=\"max-width:400px\">\n        <header>\n          <h3>Edit profile</h3>\n        </header>\n        <section>\n          <col-ui gap=\"3\">\n            <field-ui label=\"Full name\">\n              <input-ui value=\"Maya Chen\" placeholder=\"Full name\"></input-ui>\n            </field-ui>\n            <field-ui label=\"Role\">\n              <select-ui value=\"designer\">\n                <option value=\"designer\">Designer</option>\n                <option value=\"engineer\">Engineer</option>\n                <option value=\"product\">Product</option>\n              </select-ui>\n            </field-ui>\n          </col-ui>\n        </section>\n        <footer>\n          <row-ui gap=\"2\" justify=\"end\">\n            <button-ui text=\"Cancel\" variant=\"ghost\"></button-ui>\n            <button-ui text=\"Save changes\" variant=\"primary\"></button-ui>\n          </row-ui>\n        </footer>\n      </card-ui>",
+  "source": "packages/web-components/components/card/card.examples.html",
+  "metadata": {
+    "domain": "forms",
+    "description": "Form card — card containing labeled form fields with a footer action row. Standard shape for settings forms and quick-edit surfaces.",
+    "keywords": [
+      "card",
+      "form",
+      "fields",
+      "input",
+      "select",
+      "label",
+      "footer",
+      "actions",
+      "save",
+      "cancel",
+      "settings",
+      "quick-edit"
+    ]
+  },
+  "captured_at": "2026-06-10T20:25:14.783Z",
+  "template": [
+    {
+      "id": "text",
+      "component": "Text",
+      "variant": "heading",
+      "textContent": "Edit profile"
+    },
+    {
+      "id": "header",
+      "component": "Header",
+      "children": [
+        "text"
+      ]
+    },
+    {
+      "id": "input",
+      "component": "Input",
+      "placeholder": "Full name",
+      "value": "Maya Chen"
+    },
+    {
+      "id": "field",
+      "component": "Field",
+      "label": "Full name",
+      "children": [
+        "input"
+      ]
+    },
+    {
+      "id": "choice-picker",
+      "component": "ChoicePicker",
+      "value": "designer",
+      "options": [
+        {
+          "value": "designer",
+          "label": "Designer"
+        },
+        {
+          "value": "engineer",
+          "label": "Engineer"
+        },
+        {
+          "value": "product",
+          "label": "Product"
+        }
+      ]
+    },
+    {
+      "id": "field-2",
+      "component": "Field",
+      "label": "Role",
+      "children": [
+        "choice-picker"
+      ]
+    },
+    {
+      "id": "column",
+      "component": "Column",
+      "gap": "3",
+      "children": [
+        "field",
+        "field-2"
+      ]
+    },
+    {
+      "id": "section",
+      "component": "Section",
+      "children": [
+        "column"
+      ]
+    },
+    {
+      "id": "button",
+      "component": "Button",
+      "text": "Cancel",
+      "variant": "ghost"
+    },
+    {
+      "id": "button-2",
+      "component": "Button",
+      "text": "Save changes",
+      "variant": "primary"
+    },
+    {
+      "id": "row",
+      "component": "Row",
+      "gap": "2",
+      "justify": "end",
+      "children": [
+        "button",
+        "button-2"
+      ]
+    },
+    {
+      "id": "footer",
+      "component": "Footer",
+      "children": [
+        "row"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Card",
+      "children": [
+        "header",
+        "section",
+        "footer"
+      ]
+    }
+  ]
+}

package/chunks/card-with-sparkline.json

@@ -0,0 +1,90 @@
+{
+  "name": "card-with-sparkline",
+  "kind": "block",
+  "primary": "div",
+  "page": "/packages/web-components/components/card/card.examples.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-artifact-item": "",
+    "data-artifact-label": "card with sparkline chart"
+  },
+  "html": "<card-ui style=\"max-width:320px\">\n        <header>\n          <h3>Weekly signups</h3>\n          <text-ui slot=\"description\">Last 7 days</text-ui>\n        </header>\n        <section>\n          <col-ui gap=\"2\">\n            <text-ui variant=\"display\">284</text-ui>\n            <chart-ui type=\"line\" height=\"60\"\n              data-stream-src=\"\"\n              style=\"--chart-line-color:var(--a-primary)\">\n            </chart-ui>\n          </col-ui>\n        </section>\n      </card-ui>",
+  "source": "packages/web-components/components/card/card.examples.html",
+  "metadata": {
+    "domain": "data",
+    "description": "Sparkline card — KPI metric above a compact line chart. Standard dashboard widget for time-series summaries.",
+    "keywords": [
+      "card",
+      "sparkline",
+      "chart",
+      "line",
+      "metric",
+      "kpi",
+      "dashboard",
+      "widget",
+      "time-series",
+      "trend",
+      "mini-chart"
+    ]
+  },
+  "captured_at": "2026-06-10T20:25:14.783Z",
+  "template": [
+    {
+      "id": "text",
+      "component": "Text",
+      "variant": "heading",
+      "textContent": "Weekly signups"
+    },
+    {
+      "id": "text-2",
+      "component": "Text",
+      "slot": "description",
+      "textContent": "Last 7 days"
+    },
+    {
+      "id": "header",
+      "component": "Header",
+      "children": [
+        "text",
+        "text-2"
+      ]
+    },
+    {
+      "id": "text-3",
+      "component": "Text",
+      "variant": "display",
+      "textContent": "284"
+    },
+    {
+      "id": "chart",
+      "component": "Chart",
+      "type": "line",
+      "data-stream-src": ""
+    },
+    {
+      "id": "column",
+      "component": "Column",
+      "gap": "2",
+      "children": [
+        "text-3",
+        "chart"
+      ]
+    },
+    {
+      "id": "section",
+      "component": "Section",
+      "children": [
+        "column"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Card",
+      "children": [
+        "header",
+        "section"
+      ]
+    }
+  ]
+}