@adia-ai/a2ui-corpus 0.6.21 → 0.6.23

package/chunks/reg-step-shell.json

@@ -64,7 +64,7 @@
       "layout": "page"
     }
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "image",

package/chunks/reg-story-pane.json

@@ -184,5 +184,5 @@
       "html": "<aside data-reg-story>\n        <a data-reg-brand href=\"/\" aria-label=\"AdiaUI home\">\n          <img src=\"/icons/agent-ui-light.svg\" alt=\"\" />\n          <strong>AdiaUI</strong>\n        </a>\n\n        <div data-reg-story-content>\n          <h2>Build your team's home.</h2>\n          <p>\n            A workspace is where conversations, projects, and integrations live. Most teams start with one — name it after your company and add more rooms\n            inside as you grow.\n          </p>\n          <text-ui color=\"subtle\" size=\"sm\">Step 1 of 10 · Workspace setup</text-ui>\n        </div>\n      </aside>"
     }
   ],
-  "captured_at": "2026-05-21T19:10:53.888Z"
+  "captured_at": "2026-05-22T20:26:33.817Z"
 }

package/chunks/reg-success-summary.json

@@ -10,5 +10,5 @@
   },
   "html": "<section data-reg-form>\n          <col-ui gap=\"3\">\n            <card-ui>\n              <header>\n                <span slot=\"icon\"><avatar-ui icon=\"user-plus\"></avatar-ui></span>\n                <span slot=\"heading\"><text-ui strong>Invite more teammates</text-ui></span>\n                <span slot=\"description\">\n                  <text-ui color=\"subtle\" size=\"sm\">Three invites are out — add more from the workspace settings.</text-ui>\n                </span>\n                <button-ui slot=\"action\" text=\"Invite\" variant=\"ghost\" icon=\"arrow-right\" icon-position=\"end\"></button-ui>\n              </header>\n            </card-ui>\n            <card-ui>\n              <header>\n                <span slot=\"icon\"><avatar-ui icon=\"squares-four\"></avatar-ui></span>\n                <span slot=\"heading\"><text-ui strong>Browse templates</text-ui></span>\n                <span slot=\"description\">\n                  <text-ui color=\"subtle\" size=\"sm\">Pre-built dashboards, plans, and trackers — start from a template.</text-ui>\n                </span>\n                <button-ui slot=\"action\" text=\"Browse\" variant=\"ghost\" icon=\"arrow-right\" icon-position=\"end\"></button-ui>\n              </header>\n            </card-ui>\n            <card-ui>\n              <header>\n                <span slot=\"icon\"><avatar-ui icon=\"book-open\"></avatar-ui></span>\n                <span slot=\"heading\"><text-ui strong>Read the docs</text-ui></span>\n                <span slot=\"description\">\n                  <text-ui color=\"subtle\" size=\"sm\">15 minutes to get fluent — keyboard shortcuts, sharing, and search.</text-ui>\n                </span>\n                <button-ui slot=\"action\" text=\"Open docs\" variant=\"ghost\" icon=\"arrow-right\" icon-position=\"end\"></button-ui>\n              </header>\n            </card-ui>\n          </col-ui>\n        </section>",
   "source": "apps/user-flow/app/registration/confirmation/confirmation.contents.html",
-  "captured_at": "2026-05-21T19:10:53.888Z"
+  "captured_at": "2026-05-22T20:26:33.817Z"
 }

package/chunks/reg-team-size.json

@@ -10,5 +10,5 @@
   },
   "html": "<section data-reg-form>\n          <field-ui inline label=\"Team Size\">\n            <segmented-ui name=\"team-size\" value=\"2-10\">\n              <segment-ui text=\"2–10\" value=\"2-10\"></segment-ui>\n              <segment-ui text=\"11–50\" value=\"11-50\"></segment-ui>\n              <segment-ui text=\"50+\" value=\"20+\"></segment-ui>\n            </segmented-ui>\n          </field-ui>\n          <field-ui inline label=\"Industry\" hint=\"Optional. Helps us recommend relevant templates.\">\n            <select-ui name=\"industry\">\n              <option value=\"\">Choose…</option>\n              <option value=\"software\">Software · SaaS</option>\n              <option value=\"design\">Design · Creative</option>\n              <option value=\"marketing\">Marketing · Growth</option>\n              <option value=\"ecommerce\">E-commerce · Retail</option>\n              <option value=\"finance\">Finance · Fintech</option>\n              <option value=\"education\">Education · Research</option>\n              <option value=\"healthcare\">Healthcare · Biotech</option>\n              <option value=\"other\">Something else</option>\n            </select-ui>\n          </field-ui>\n        </section>",
   "source": "apps/user-flow/app/registration/team-size/team-size.contents.html",
-  "captured_at": "2026-05-21T19:10:53.888Z"
+  "captured_at": "2026-05-22T20:26:33.817Z"
 }

package/chunks/reg-usecase-picker.json

@@ -12,5 +12,5 @@
   },
   "html": "<section data-reg-form role=\"radiogroup\" aria-label=\"Use case\">\n          <col-ui gap=\"2\">\n            <option-card-ui\n              name=\"use-case\"\n              value=\"build\"\n              checked\n              heading=\"I'm building a product\"\n              description=\"Spinning up a new project — design, ship, iterate.\"\n            ></option-card-ui>\n            <option-card-ui\n              name=\"use-case\"\n              value=\"explore\"\n              heading=\"I'm exploring the product\"\n              description=\"Kicking the tires before bringing a team along.\"\n            ></option-card-ui>\n            <option-card-ui\n              name=\"use-case\"\n              value=\"migrate\"\n              heading=\"I'm migrating from another tool\"\n              description=\"Moving an existing workspace and want a smooth port.\"\n            ></option-card-ui>\n            <option-card-ui\n              name=\"use-case\"\n              value=\"evaluate\"\n              heading=\"I'm evaluating for my team\"\n              description=\"Comparing options and want to dig into specifics.\"\n            ></option-card-ui>\n            <option-card-ui name=\"use-case\" value=\"other\" heading=\"Something else\" description=\"Tell us more — we read every response.\">\n              <textarea-ui name=\"use-case-detail\" placeholder=\"What brings you to AdiaUI?\" rows=\"3\"></textarea-ui>\n            </option-card-ui>\n          </col-ui>\n        </section>",
   "source": "apps/user-flow/app/registration/use-case/use-case.contents.html",
-  "captured_at": "2026-05-21T19:10:53.888Z"
+  "captured_at": "2026-05-22T20:26:33.817Z"
 }

package/chunks/reg-workspace-name.json

@@ -31,7 +31,7 @@
       "setup"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",

package/chunks/responsive-kpi-grid.json

@@ -0,0 +1,166 @@
+{
+  "name": "responsive-kpi-grid",
+  "kind": "block",
+  "primary": "section",
+  "page": "/catalog/ui-patterns/v053-coverage-fill/v053-coverage-fill.contents.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {},
+  "html": "<section>\n    <grid-ui columns=\"1 2@sm 4@lg\" gap=\"3 4@md\">\n      <card-ui>\n        <section>\n          <stat-ui label=\"Total Users\" value=\"12,847\" change=\"+8%\" trend=\"up\"></stat-ui>\n        </section>\n      </card-ui>\n      <card-ui>\n        <section>\n          <stat-ui label=\"Revenue\" value=\"$48.2k\" change=\"+12%\" trend=\"up\"></stat-ui>\n        </section>\n      </card-ui>\n      <card-ui>\n        <section>\n          <stat-ui label=\"Churn Rate\" value=\"2.4%\" change=\"-0.3pp\" trend=\"down\"></stat-ui>\n        </section>\n      </card-ui>\n      <card-ui>\n        <section>\n          <stat-ui label=\"Avg Session\" value=\"4m 12s\" change=\"+23s\" trend=\"up\"></stat-ui>\n        </section>\n      </card-ui>\n    </grid-ui>\n  </section>",
+  "source": "catalog/ui-patterns/v053-coverage-fill/v053-coverage-fill.contents.html",
+  "metadata": {
+    "domain": "data",
+    "description": "Responsive KPI stat-card grid — 1 column on mobile, 2 on tablet (sm+), 4 on desktop (lg+) using @bp notation.",
+    "keywords": [
+      "responsive",
+      "kpi",
+      "stat",
+      "grid",
+      "mobile",
+      "tablet",
+      "desktop",
+      "breakpoint",
+      "columns",
+      "adaptive",
+      "layout"
+    ]
+  },
+  "captured_at": "2026-05-22T20:26:33.817Z",
+  "template": [
+    {
+      "id": "stat",
+      "component": "Stat",
+      "change": "+8%",
+      "label": "Total Users",
+      "trend": "up",
+      "value": "12,847"
+    },
+    {
+      "id": "section",
+      "component": "Section",
+      "children": [
+        "column"
+      ]
+    },
+    {
+      "id": "column",
+      "component": "Column",
+      "children": [
+        "stat"
+      ]
+    },
+    {
+      "id": "card",
+      "component": "Card",
+      "children": [
+        "section"
+      ]
+    },
+    {
+      "id": "stat-2",
+      "component": "Stat",
+      "change": "+12%",
+      "label": "Revenue",
+      "trend": "up",
+      "value": "$48.2k"
+    },
+    {
+      "id": "section-2",
+      "component": "Section",
+      "children": [
+        "column-2"
+      ]
+    },
+    {
+      "id": "column-2",
+      "component": "Column",
+      "children": [
+        "stat-2"
+      ]
+    },
+    {
+      "id": "card-2",
+      "component": "Card",
+      "children": [
+        "section-2"
+      ]
+    },
+    {
+      "id": "stat-3",
+      "component": "Stat",
+      "change": "-0.3pp",
+      "label": "Churn Rate",
+      "trend": "down",
+      "value": "2.4%"
+    },
+    {
+      "id": "section-3",
+      "component": "Section",
+      "children": [
+        "column-3"
+      ]
+    },
+    {
+      "id": "column-3",
+      "component": "Column",
+      "children": [
+        "stat-3"
+      ]
+    },
+    {
+      "id": "card-3",
+      "component": "Card",
+      "children": [
+        "section-3"
+      ]
+    },
+    {
+      "id": "stat-4",
+      "component": "Stat",
+      "change": "+23s",
+      "label": "Avg Session",
+      "trend": "up",
+      "value": "4m 12s"
+    },
+    {
+      "id": "section-4",
+      "component": "Section",
+      "children": [
+        "column-4"
+      ]
+    },
+    {
+      "id": "column-4",
+      "component": "Column",
+      "children": [
+        "stat-4"
+      ]
+    },
+    {
+      "id": "card-4",
+      "component": "Card",
+      "children": [
+        "section-4"
+      ]
+    },
+    {
+      "id": "grid",
+      "component": "Grid",
+      "columns": "1 2@sm 4@lg",
+      "gap": "3 4@md",
+      "children": [
+        "card",
+        "card-2",
+        "card-3",
+        "card-4"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Section",
+      "children": [
+        "grid"
+      ]
+    }
+  ]
+}

package/chunks/search-with-filters.json

@@ -25,7 +25,7 @@
       "directory"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "search-ui",

package/chunks/section-with-stack.json

@@ -8,5 +8,5 @@
   "attrs": {},
   "html": "<section>\n            <col-ui gap=\"2\">\n              <text-ui color=\"subtle\">Embed designs and sync frames.</text-ui>\n            </col-ui>\n          </section>",
   "source": "apps/saas/app/integrations/integrations.contents.html",
-  "captured_at": "2026-05-21T19:10:53.888Z"
+  "captured_at": "2026-05-22T20:26:33.817Z"
 }

package/chunks/settings-admin-page.json

@@ -9,7 +9,7 @@
     "drawer-delete-workspace"
   ],
   "attrs": {},
-  "html": "<article>\n<!-- ═══════════════ WORKSPACE DETAILS ═══════════════ -->\n<section>\n  <h2>Workspace</h2>\n  <div data-section>\n    <aside>\n      <h3>Details</h3>\n      <p>Name and identify your workspace.</p>\n    </aside>\n    <div data-col><!-- nested: settings-general-form --></div>\n  </div>\n  <div data-section>\n    <aside>\n      <h3>Description</h3>\n      <p>A brief summary of what this workspace is for.</p>\n    </aside>\n    <div data-col>\n      <field-ui label=\"Description\">\n        <textarea-ui placeholder=\"What is this workspace for?\">A zero-dependency vanilla JS web component library for modern interfaces.</textarea-ui>\n      </field-ui>\n      <field-ui label=\"Timezone\">\n        <select-ui id=\"settings-timezone\" placeholder=\"Select timezone\"></select-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ DEFAULTS ═══════════════ -->\n<section>\n  <h2>Defaults</h2>\n  <div data-section>\n    <aside>\n      <h3>Model</h3>\n      <p>Choose the default model and parameters for new conversations.</p>\n    </aside>\n    <div data-col>\n      <field-ui label=\"Default model\">\n        <select-ui id=\"settings-model\" placeholder=\"Select model\"></select-ui>\n      </field-ui>\n      <grid-ui columns=\"2\" gap=\"3\">\n        <range-ui label=\"Max tokens\" value=\"4096\" min=\"256\" max=\"16384\" step=\"256\"></range-ui>\n        <range-ui label=\"Temperature\" value=\"0.7\" min=\"0\" max=\"2\" step=\"0.1\"></range-ui>\n      </grid-ui>\n    </div>\n  </div>\n  <div data-section>\n    <aside>\n      <h3>System prompt</h3>\n      <p>Default instructions sent with every conversation.</p>\n    </aside>\n    <div data-col>\n      <field-ui label=\"System prompt\">\n        <textarea-ui placeholder=\"You are a helpful assistant...\" rows=\"5\"></textarea-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ PREFERENCES ═══════════════ -->\n<section>\n  <h2>Preferences</h2>\n  <div data-section>\n    <aside>\n      <h3>Behavior</h3>\n      <p>Customize how the interface behaves.</p>\n    </aside>\n    <div data-col>\n      <switch-ui label=\"Send on Enter\" checked></switch-ui>\n      <switch-ui label=\"Stream responses\" checked></switch-ui>\n      <switch-ui label=\"Show token count\"></switch-ui>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ APPEARANCE ═══════════════\n     Workspace-level theming surface. <theme-panel> owns the three\n     knobs of the AdiaUI theming contract: [data-theme] named themes,\n     --a-density / --a-radius-k parametric overrides, and color-scheme\n     light/dark switching, plus localStorage persistence. The Behavior\n     section above lost its standalone \"Dark mode\" switch; the scheme\n     toggle inside <theme-panel> is the canonical control.\n-->\n<section>\n  <h2>Appearance</h2>\n  <div data-section>\n    <aside>\n      <h3>Theme</h3>\n      <p>Pick a theme, adjust density and corner radius, or switch between light and dark mode. Changes apply instantly and are saved per browser.</p>\n    </aside>\n    <div data-col>\n      <theme-panel persist parametric presets scheme-toggle></theme-panel>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ NOTIFICATIONS ═══════════════ -->\n<section>\n  <h2>Notifications</h2>\n  <div data-section>\n    <aside>\n      <h3>Channels</h3>\n      <p>Choose how you receive notifications for workspace activity.</p>\n    </aside>\n    <div data-col>\n      <switch-ui label=\"Email notifications\" checked></switch-ui>\n      <switch-ui label=\"Push notifications\"></switch-ui>\n      <switch-ui label=\"Weekly digest\" checked></switch-ui>\n      <switch-ui label=\"SMS alerts\"></switch-ui>\n    </div>\n  </div>\n  <div data-section>\n    <aside>\n      <h3>Activity</h3>\n      <p>What types of events trigger notifications.</p>\n    </aside>\n    <div data-col>\n      <check-ui label=\"New team member joins\" checked></check-ui>\n      <check-ui label=\"API key rotated\" checked></check-ui>\n      <check-ui label=\"Usage threshold reached\" checked></check-ui>\n      <check-ui label=\"Billing changes\"></check-ui>\n      <check-ui label=\"Deployment completed\"></check-ui>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ DANGER ZONE ═══════════════ -->\n<section>\n  <h2>Danger zone</h2>\n  <div data-section>\n    <aside>\n      <h3>Delete workspace</h3>\n      <p>Permanently delete this workspace and all associated data. This action cannot be undone.</p>\n    </aside>\n    <div data-col>\n      <alert-ui\n        text=\"Deleting your workspace will remove all projects, members, API keys, and conversation history.\"\n        variant=\"danger\"\n        icon=\"warning\"\n      ></alert-ui>\n      <button-ui text=\"Delete workspace\" color=\"danger\" icon=\"trash\" onclick=\"document.getElementById('drawer-delete-workspace').open = true\"></button-ui>\n    </div>\n  </div>\n</section>\n\n<!-- ═══════════════ DELETE WORKSPACE DRAWER ═══════════════ -->\n<drawer-ui id=\"drawer-delete-workspace\" side=\"right\" size=\"md\"><!-- nested: drawer-delete-workspace --></drawer-ui>\n</article>",
+  "html": "<article>\n<!-- ═══════════════ WORKSPACE DETAILS ═══════════════ -->\n<section>\n  <h2>Workspace</h2>\n  <div data-section>\n    <aside>\n      <h3>Details</h3>\n      <p>Name and identify your workspace.</p>\n    </aside>\n    <div data-col><!-- nested: settings-general-form --></div>\n  </div>\n  <div data-section>\n    <aside>\n      <h3>Description</h3>\n      <p>A brief summary of what this workspace is for.</p>\n    </aside>\n    <div data-col>\n      <field-ui label=\"Description\">\n        <textarea-ui placeholder=\"What is this workspace for?\">A zero-dependency vanilla JS web component library for modern interfaces.</textarea-ui>\n      </field-ui>\n      <field-ui label=\"Timezone\">\n        <select-ui id=\"settings-timezone\" placeholder=\"Select timezone\"></select-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ DEFAULTS ═══════════════ -->\n<section>\n  <h2>Defaults</h2>\n  <div data-section>\n    <aside>\n      <h3>Model</h3>\n      <p>Choose the default model and parameters for new conversations.</p>\n    </aside>\n    <div data-col>\n      <field-ui label=\"Default model\">\n        <select-ui id=\"settings-model\" placeholder=\"Select model\"></select-ui>\n      </field-ui>\n      <grid-ui columns=\"1 2@md\" gap=\"3\">\n        <range-ui label=\"Max tokens\" value=\"4096\" min=\"256\" max=\"16384\" step=\"256\"></range-ui>\n        <range-ui label=\"Temperature\" value=\"0.7\" min=\"0\" max=\"2\" step=\"0.1\"></range-ui>\n      </grid-ui>\n    </div>\n  </div>\n  <div data-section>\n    <aside>\n      <h3>System prompt</h3>\n      <p>Default instructions sent with every conversation.</p>\n    </aside>\n    <div data-col>\n      <field-ui label=\"System prompt\">\n        <textarea-ui placeholder=\"You are a helpful assistant...\" rows=\"5\"></textarea-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ PREFERENCES ═══════════════ -->\n<section>\n  <h2>Preferences</h2>\n  <div data-section>\n    <aside>\n      <h3>Behavior</h3>\n      <p>Customize how the interface behaves.</p>\n    </aside>\n    <div data-col>\n      <switch-ui label=\"Send on Enter\" checked></switch-ui>\n      <switch-ui label=\"Stream responses\" checked></switch-ui>\n      <switch-ui label=\"Show token count\"></switch-ui>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ APPEARANCE ═══════════════\n     Workspace-level theming surface. <theme-panel> owns the three\n     knobs of the AdiaUI theming contract: [data-theme] named themes,\n     --a-density / --a-radius-k parametric overrides, and color-scheme\n     light/dark switching, plus localStorage persistence. The Behavior\n     section above lost its standalone \"Dark mode\" switch; the scheme\n     toggle inside <theme-panel> is the canonical control.\n-->\n<section>\n  <h2>Appearance</h2>\n  <div data-section>\n    <aside>\n      <h3>Theme</h3>\n      <p>Pick a theme, adjust density and corner radius, or switch between light and dark mode. Changes apply instantly and are saved per browser.</p>\n    </aside>\n    <div data-col>\n      <theme-panel persist parametric presets scheme-toggle></theme-panel>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ NOTIFICATIONS ═══════════════ -->\n<section>\n  <h2>Notifications</h2>\n  <div data-section>\n    <aside>\n      <h3>Channels</h3>\n      <p>Choose how you receive notifications for workspace activity.</p>\n    </aside>\n    <div data-col>\n      <switch-ui label=\"Email notifications\" checked></switch-ui>\n      <switch-ui label=\"Push notifications\"></switch-ui>\n      <switch-ui label=\"Weekly digest\" checked></switch-ui>\n      <switch-ui label=\"SMS alerts\"></switch-ui>\n    </div>\n  </div>\n  <div data-section>\n    <aside>\n      <h3>Activity</h3>\n      <p>What types of events trigger notifications.</p>\n    </aside>\n    <div data-col>\n      <check-ui label=\"New team member joins\" checked></check-ui>\n      <check-ui label=\"API key rotated\" checked></check-ui>\n      <check-ui label=\"Usage threshold reached\" checked></check-ui>\n      <check-ui label=\"Billing changes\"></check-ui>\n      <check-ui label=\"Deployment completed\"></check-ui>\n    </div>\n  </div>\n</section>\n\n<divider-ui></divider-ui>\n\n<!-- ═══════════════ DANGER ZONE ═══════════════ -->\n<section>\n  <h2>Danger zone</h2>\n  <div data-section>\n    <aside>\n      <h3>Delete workspace</h3>\n      <p>Permanently delete this workspace and all associated data. This action cannot be undone.</p>\n    </aside>\n    <div data-col>\n      <alert-ui\n        text=\"Deleting your workspace will remove all projects, members, API keys, and conversation history.\"\n        variant=\"danger\"\n        icon=\"warning\"\n      ></alert-ui>\n      <button-ui text=\"Delete workspace\" color=\"danger\" icon=\"trash\" onclick=\"document.getElementById('drawer-delete-workspace').open = true\"></button-ui>\n    </div>\n  </div>\n</section>\n\n<!-- ═══════════════ DELETE WORKSPACE DRAWER ═══════════════ -->\n<drawer-ui id=\"drawer-delete-workspace\" side=\"right\" size=\"md\"><!-- nested: drawer-delete-workspace --></drawer-ui>\n</article>",
   "source": "apps/saas/app/settings-page/settings-page.contents.html",
   "metadata": {
     "domain": "settings",
@@ -42,7 +42,7 @@
       "layout": "page"
     }
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",
@@ -263,7 +263,7 @@
     {
       "id": "grid",
       "component": "Grid",
-      "columns": "2",
+      "columns": "1 2@md",
       "gap": "3",
       "children": [
         "range",
@@ -719,7 +719,8 @@
     {
       "id": "text-27",
       "component": "Text",
-      "variant": "body"
+      "variant": "body",
+      "size": "sm"
     },
     {
       "id": "header",
@@ -778,7 +779,6 @@
     {
       "id": "card",
       "component": "Card",
-      "size": "sm",
       "children": [
         "section-9"
       ]
@@ -806,7 +806,6 @@
     {
       "id": "card-2",
       "component": "Card",
-      "size": "sm",
       "children": [
         "section-10"
       ]
@@ -834,7 +833,6 @@
     {
       "id": "card-3",
       "component": "Card",
-      "size": "sm",
       "children": [
         "section-11"
       ]
@@ -862,7 +860,6 @@
     {
       "id": "card-4",
       "component": "Card",
-      "size": "sm",
       "children": [
         "section-12"
       ]

package/chunks/settings-appearance.json

@@ -23,7 +23,7 @@
       "ui-controls"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",

package/chunks/settings-billing-plan.json

@@ -8,7 +8,7 @@
   "attrs": {
     "data-col": ""
   },
-  "html": "<div data-col>\n      <card-ui size=\"sm\">\n        <header>\n          <span slot=\"icon\">\n            <avatar-ui icon=\"star\"></avatar-ui>\n          </span>\n          <span slot=\"heading\">\n            <text-ui strong>Pro</text-ui>\n            <badge-ui text=\"Current\" variant=\"accent\"></badge-ui>\n          </span>\n          <span slot=\"action\">\n            <button-ui text=\"Change plan\" variant=\"primary\" size=\"sm\" onclick=\"document.getElementById('drawer-change-plan').open = true\"></button-ui>\n          </span>\n          <span slot=\"description\">\n            <text-ui color=\"subtle\" size=\"sm\">$49/month · billed monthly · Next invoice May 14, 2026</text-ui>\n          </span>\n        </header>\n      </card-ui>\n      <field-ui label=\"Billing interval\">\n        <segmented-ui value=\"monthly\">\n          <segment-ui value=\"monthly\" text=\"Monthly\"></segment-ui>\n          <segment-ui value=\"annual\" text=\"Annual · 2 months free\"></segment-ui>\n        </segmented-ui>\n      </field-ui>\n    </div>",
+  "html": "<div data-col>\n      <card-ui>\n        <header>\n          <span slot=\"icon\">\n            <avatar-ui icon=\"star\"></avatar-ui>\n          </span>\n          <span slot=\"heading\">\n            <text-ui strong>Pro</text-ui>\n            <badge-ui text=\"Current\" variant=\"accent\"></badge-ui>\n          </span>\n          <span slot=\"action\" size=\"sm\">\n            <button-ui text=\"Change plan\" variant=\"primary\" size=\"sm\" onclick=\"document.getElementById('drawer-change-plan').open = true\"></button-ui>\n          </span>\n          <span slot=\"description\">\n            <text-ui color=\"subtle\" size=\"sm\">$49/month · billed monthly · Next invoice May 14, 2026</text-ui>\n          </span>\n        </header>\n      </card-ui>\n      <field-ui label=\"Billing interval\">\n        <segmented-ui value=\"monthly\">\n          <segment-ui value=\"monthly\" text=\"Monthly\"></segment-ui>\n          <segment-ui value=\"annual\" text=\"Annual · 2 months free\"></segment-ui>\n        </segmented-ui>\n      </field-ui>\n    </div>",
   "source": "apps/saas/app/billing/billing.contents.html",
-  "captured_at": "2026-05-21T19:10:53.888Z"
+  "captured_at": "2026-05-22T20:26:33.817Z"
 }

package/chunks/settings-general-form.json

@@ -25,7 +25,7 @@
       "identity"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "input",

package/chunks/settings-integrations.json

@@ -8,7 +8,7 @@
   "attrs": {
     "data-col": ""
   },
-  "html": "<div data-col\n    >\n      <card-ui size=\"sm\">\n        <header>\n          <span slot=\"icon\">\n            <avatar-ui icon=\"slack-logo\"></avatar-ui>\n          </span>\n          <span slot=\"heading\">\n            <text-ui strong>Slack</text-ui>\n            <badge-ui text=\"Connected\" variant=\"success\"></badge-ui>\n          </span>\n          <span slot=\"action\">\n            <button-ui text=\"Configure\" onclick=\"document.getElementById('drawer-slack').open = true\"></button-ui>\n          </span>\n          <span slot=\"description\">\n            <text-ui color=\"subtle\" size=\"sm\">Posts to #product-updates · connected by Alex Chen</text-ui>\n          </span>\n        </header>\n      </card-ui>\n      <card-ui size=\"sm\">\n        <header>\n          <span slot=\"icon\">\n            <avatar-ui icon=\"github-logo\"></avatar-ui>\n          </span>\n          <span slot=\"heading\">\n            <text-ui strong>GitHub</text-ui>\n            <badge-ui text=\"Connected\" variant=\"success\"></badge-ui>\n          </span>\n          <span slot=\"action\">\n            <button-ui text=\"Configure\" onclick=\"document.getElementById('drawer-github').open = true\"></button-ui>\n          </span>\n          <span slot=\"description\">\n            <text-ui color=\"subtle\" size=\"sm\">acme-corp organization · 14 repositories synced</text-ui>\n          </span>\n        </header>\n      </card-ui>\n      <card-ui size=\"sm\">\n        <header>\n          <span slot=\"icon\">\n            <avatar-ui icon=\"envelope\"></avatar-ui>\n          </span>\n          <span slot=\"heading\">\n            <text-ui strong>Email (SMTP)</text-ui>\n            <badge-ui text=\"Action needed\" variant=\"warning\"></badge-ui>\n          </span>\n          <span slot=\"action\">\n            <button-ui text=\"Reconnect\" variant=\"primary\" onclick=\"document.getElementById('drawer-smtp').open = true\"></button-ui>\n          </span>\n          <span slot=\"description\">\n            <text-ui color=\"subtle\" size=\"sm\">Credentials expired on April 12, 2026</text-ui>\n          </span>\n        </header>\n      </card-ui>\n    </div>",
+  "html": "<div data-col\n    >\n      <card-ui>\n        <header>\n          <span slot=\"icon\">\n            <avatar-ui icon=\"slack-logo\"></avatar-ui>\n          </span>\n          <span slot=\"heading\">\n            <text-ui strong>Slack</text-ui>\n            <badge-ui text=\"Connected\" variant=\"success\"></badge-ui>\n          </span>\n          <span slot=\"action\" size=\"sm\">\n            <button-ui text=\"Configure\" onclick=\"document.getElementById('drawer-slack').open = true\"></button-ui>\n          </span>\n          <span slot=\"description\">\n            <text-ui color=\"subtle\" size=\"sm\">Posts to #product-updates · connected by Alex Chen</text-ui>\n          </span>\n        </header>\n      </card-ui>\n      <card-ui>\n        <header>\n          <span slot=\"icon\">\n            <avatar-ui icon=\"github-logo\"></avatar-ui>\n          </span>\n          <span slot=\"heading\">\n            <text-ui strong>GitHub</text-ui>\n            <badge-ui text=\"Connected\" variant=\"success\"></badge-ui>\n          </span>\n          <span slot=\"action\" size=\"sm\">\n            <button-ui text=\"Configure\" onclick=\"document.getElementById('drawer-github').open = true\"></button-ui>\n          </span>\n          <span slot=\"description\">\n            <text-ui color=\"subtle\" size=\"sm\">acme-corp organization · 14 repositories synced</text-ui>\n          </span>\n        </header>\n      </card-ui>\n      <card-ui>\n        <header>\n          <span slot=\"icon\">\n            <avatar-ui icon=\"envelope\"></avatar-ui>\n          </span>\n          <span slot=\"heading\">\n            <text-ui strong>Email (SMTP)</text-ui>\n            <badge-ui text=\"Action needed\" variant=\"warning\"></badge-ui>\n          </span>\n          <span slot=\"action\" size=\"sm\">\n            <button-ui text=\"Reconnect\" variant=\"primary\" onclick=\"document.getElementById('drawer-smtp').open = true\"></button-ui>\n          </span>\n          <span slot=\"description\">\n            <text-ui color=\"subtle\" size=\"sm\">Credentials expired on April 12, 2026</text-ui>\n          </span>\n        </header>\n      </card-ui>\n    </div>",
   "source": "apps/saas/app/integrations/integrations.contents.html",
   "metadata": {
     "domain": "settings",
@@ -32,7 +32,7 @@
       "layout": "grid"
     }
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",
@@ -48,7 +48,8 @@
     {
       "id": "text-3",
       "component": "Text",
-      "variant": "body"
+      "variant": "body",
+      "size": "sm"
     },
     {
       "id": "text-4",
@@ -69,7 +70,6 @@
     {
       "id": "card",
       "component": "Card",
-      "size": "sm",
       "children": [
         "header"
       ]
@@ -88,7 +88,8 @@
     {
       "id": "text-7",
       "component": "Text",
-      "variant": "body"
+      "variant": "body",
+      "size": "sm"
     },
     {
       "id": "text-8",
@@ -109,7 +110,6 @@
     {
       "id": "card-2",
       "component": "Card",
-      "size": "sm",
       "children": [
         "header-2"
       ]
@@ -128,7 +128,8 @@
     {
       "id": "text-11",
       "component": "Text",
-      "variant": "body"
+      "variant": "body",
+      "size": "sm"
     },
     {
       "id": "text-12",
@@ -149,7 +150,6 @@
     {
       "id": "card-3",
       "component": "Card",
-      "size": "sm",
       "children": [
         "header-3"
       ]

package/chunks/settings-members-invite.json

@@ -12,5 +12,5 @@
   },
   "html": "<div data-col>\n      <field-ui label=\"Email addresses\"><!-- nested: labeled-textarea --></field-ui>\n      <field-ui label=\"Default role\">\n        <select-ui value=\"member\">\n          <option value=\"admin\">Admin · can invite, remove, and billing</option>\n          <option value=\"member\">Member · can edit and invite</option>\n          <option value=\"viewer\">Viewer · read-only</option>\n        </select-ui>\n      </field-ui>\n      <field-ui label=\"Send welcome email\" inline>\n        <switch-ui checked></switch-ui>\n      </field-ui>\n      <button-ui text=\"Send invites\" variant=\"primary\" icon=\"paper-plane-tilt\"></button-ui>\n    </div>",
   "source": "apps/saas/app/members/members.contents.html",
-  "captured_at": "2026-05-21T19:10:53.888Z"
+  "captured_at": "2026-05-22T20:26:33.817Z"
 }

package/chunks/settings-notifications.json

@@ -24,7 +24,7 @@
       "preferences"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",

package/chunks/settings-page-shell.json

@@ -39,7 +39,7 @@
       "panel"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",

package/chunks/settings-profile-security.json

@@ -25,7 +25,7 @@
       "identity"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "avatar",

package/chunks/sidebar-collapsible-nav.json

@@ -24,7 +24,7 @@
       "icon-only"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",

package/chunks/slider-range-controls.json

@@ -24,7 +24,7 @@
       "dual-handle"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",

package/chunks/tabs-with-panels.json

@@ -22,7 +22,7 @@
       "tab-strip"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "tab",

package/chunks/testimonial-grid.json

@@ -22,7 +22,7 @@
       "marketing"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",

package/chunks/text-card.json

@@ -5,10 +5,8 @@
   "page": "/catalog/ui-patterns/app/kanban-board-3col/kanban-board-3col.contents.html",
   "slots": [],
   "nested": [],
-  "attrs": {
-    "size": "sm"
-  },
-  "html": "<card-ui size=\"sm\"><section><text-ui>Design system tokens</text-ui></section></card-ui>",
+  "attrs": {},
+  "html": "<card-ui><section><text-ui>Design system tokens</text-ui></section></card-ui>",
   "source": "catalog/ui-patterns/app/kanban-board-3col/kanban-board-3col.contents.html",
-  "captured_at": "2026-05-21T19:10:53.888Z"
+  "captured_at": "2026-05-22T20:26:33.817Z"
 }

package/chunks/timeline-events.json

@@ -23,7 +23,7 @@
       "releases"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",

package/chunks/toolbar-icons.json

@@ -22,7 +22,7 @@
       "formatting"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "button",

package/chunks/toolbar-tooltips.json

@@ -22,7 +22,7 @@
       "accessibility"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "button",

package/chunks/user-identity-row.json

@@ -12,5 +12,5 @@
   },
   "html": "<row-ui gap=\"2\" align=\"center\" grow>\n              <avatar-ui icon=\"code\" size=\"sm\"></avatar-ui>\n              <col-ui gap=\"0\" grow>\n                <text-ui strong>Developer</text-ui>\n                <text-ui color=\"subtle\" size=\"sm\">API + webhook access · 4 members</text-ui>\n              </col-ui>\n              <button-ui variant=\"ghost\" size=\"sm\" icon=\"pencil-simple\"></button-ui>\n            </row-ui>",
   "source": "apps/saas/app/members/members.contents.html",
-  "captured_at": "2026-05-21T19:10:53.888Z"
+  "captured_at": "2026-05-22T20:26:33.817Z"
 }

package/chunks/user-profile-card.json

@@ -24,7 +24,7 @@
       "team-member"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "avatar",

package/chunks/users-table-badge.json

@@ -24,7 +24,7 @@
       "pagination"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",

package/chunks/video-player-controls.json

@@ -25,7 +25,7 @@
       "controls"
     ]
   },
-  "captured_at": "2026-05-21T19:10:53.888Z",
+  "captured_at": "2026-05-22T20:26:33.817Z",
   "template": [
     {
       "id": "text",