@adia-ai/a2ui-corpus 0.0.7 → 0.0.9

package/chunks/onb-provider-tiles.json

@@ -10,5 +10,5 @@
   },
   "html": "<div data-onb-form data-chunk=\"onb-provider-tiles\">\n      <div data-onb-provider-grid role=\"radiogroup\" aria-label=\"Source picker\">\n        <option-card-ui layout=\"tile\" name=\"source\" value=\"github\" checked\n                        icon=\"github-logo\"\n                        heading=\"GitHub\"\n                        description=\"Repos, issues, PRs, releases\"></option-card-ui>\n        <option-card-ui layout=\"tile\" name=\"source\" value=\"linear\"\n                        icon=\"kanban\"\n                        heading=\"Linear\"\n                        description=\"Issues, cycles, projects\"></option-card-ui>\n        <option-card-ui layout=\"tile\" name=\"source\" value=\"stripe\"\n                        icon=\"credit-card\"\n                        heading=\"Stripe\"\n                        description=\"Customers, MRR, churn\"></option-card-ui>\n        <option-card-ui layout=\"tile\" name=\"source\" value=\"postgres\"\n                        icon=\"database\"\n                        heading=\"Postgres\"\n                        description=\"Read-only SQL connection\"></option-card-ui>\n        <option-card-ui layout=\"tile\" name=\"source\" value=\"notion\"\n                        icon=\"notebook\"\n                        heading=\"Notion\"\n                        description=\"Pages, databases, comments\"></option-card-ui>\n        <option-card-ui layout=\"tile\" name=\"source\" value=\"slack\"\n                        icon=\"slack-logo\"\n                        heading=\"Slack\"\n                        description=\"Channels, threads, search\"></option-card-ui>\n      </div>\n\n      <alert-ui variant=\"info\" icon=\"shield-check\">\n        <span slot=\"content\"><strong>Read-only by default.</strong> AdiaUI never writes or deletes data on your provider. You can audit + revoke from settings → Integrations.</span>\n      </alert-ui>\n    </div>",
   "source": "site/pages/examples/onboarding/connect-source/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/onb-settings-review.json

@@ -10,5 +10,5 @@
   },
   "html": "<div data-onb-form data-chunk=\"onb-settings-review\">\n      <div data-onb-summary>\n\n        <div data-onb-summary-row>\n          <span data-summary-label>Role</span>\n          <div>\n            <span data-summary-value>Developer</span>\n            <text-ui color=\"subtle\" size=\"sm\" style=\"display:block;\">Home pinned to release dashboards.</text-ui>\n          </div>\n          <button-ui text=\"Edit\" variant=\"ghost\" size=\"sm\" onclick=\"document.getElementById('drawer-role').open = true\"></button-ui>\n        </div>\n\n        <div data-onb-summary-row>\n          <span data-summary-label>Source</span>\n          <div>\n            <span data-summary-value>GitHub</span>\n            <text-ui color=\"subtle\" size=\"sm\" style=\"display:block;\">Authorized as kim@acme.com · 23 repos visible.</text-ui>\n          </div>\n          <button-ui text=\"Edit\" variant=\"ghost\" size=\"sm\" onclick=\"document.getElementById('drawer-source').open = true\"></button-ui>\n        </div>\n\n        <div data-onb-summary-row>\n          <span data-summary-label>Data start</span>\n          <div>\n            <span data-summary-value>Sample data</span>\n            <text-ui color=\"subtle\" size=\"sm\" style=\"display:block;\">Switch to live source any time from settings.</text-ui>\n          </div>\n          <button-ui text=\"Edit\" variant=\"ghost\" size=\"sm\" onclick=\"document.getElementById('drawer-data-start').open = true\"></button-ui>\n        </div>\n\n        <div data-onb-summary-row>\n          <span data-summary-label>First dashboard</span>\n          <div>\n            <span data-summary-value>Weekly revenue · 6-month trend</span>\n            <text-ui color=\"subtle\" size=\"sm\" style=\"display:block;\">Generated and pinned to your home.</text-ui>\n          </div>\n          <button-ui text=\"Edit\" variant=\"ghost\" size=\"sm\" onclick=\"document.getElementById('drawer-first-dashboard').open = true\"></button-ui>\n        </div>\n\n      </div>\n\n      <alert-ui variant=\"success\" icon=\"check-circle\">\n        <span slot=\"content\"><strong>Looking good.</strong> Next we'll set notification preferences, then offer two optional companion installs (mobile app + browser extension). Nothing else is required.</span>\n      </alert-ui>\n    </div>",
   "source": "site/pages/examples/onboarding/review/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/onb-step-footer.json

@@ -101,8 +101,8 @@
         "onb-step-progress"
       ],
       "attrs": {},
-      "html": "<footer data-chunk=\"onb-step-footer\">\n      <div data-onb-progress data-chunk=\"onb-step-progress\">\n        <text-ui color=\"subtle\" size=\"sm\">Step 1 of 10</text-ui>\n        <div data-onb-progress-track>\n          <span data-active></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>\n        </div>\n      </div>\n      <div data-onb-actions>\n        <button-ui text=\"Get started\" variant=\"primary\" type=\"submit\"></button-ui>\n      </div>\n    </footer>"
+      "html": "<footer data-chunk=\"onb-step-footer\" data-chunk-slot=\"page-footer\">\n      <div data-onb-progress data-chunk=\"onb-step-progress\">\n        <text-ui color=\"subtle\" size=\"sm\">Step 1 of 10</text-ui>\n        <div data-onb-progress-track>\n          <span data-active></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>\n        </div>\n      </div>\n      <div data-onb-actions>\n        <button-ui text=\"Get started\" variant=\"primary\" type=\"submit\"></button-ui>\n      </div>\n    </footer>"
     }
   ],
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/onb-step-header.json

@@ -101,8 +101,8 @@
       "attrs": {
         "data-onb-heading": ""
       },
-      "html": "<header data-onb-heading data-chunk=\"onb-step-header\">\n      <h1>Let's get you set up</h1>\n      <text-ui color=\"subtle\">A quick guided tour. Everything is changeable in settings later.</text-ui>\n    </header>"
+      "html": "<header data-onb-heading data-chunk=\"onb-step-header\" data-chunk-slot=\"page-header\">\n      <h1>Let's get you set up</h1>\n      <text-ui color=\"subtle\">A quick guided tour. Everything is changeable in settings later.</text-ui>\n    </header>"
     }
   ],
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/onb-step-progress.json

@@ -104,5 +104,5 @@
       "html": "<div data-onb-progress data-chunk=\"onb-step-progress\">\n        <text-ui color=\"subtle\" size=\"sm\">Step 1 of 10</text-ui>\n        <div data-onb-progress-track>\n          <span data-active></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>\n        </div>\n      </div>"
     }
   ],
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/onb-step-shell.json

@@ -38,5 +38,5 @@
   },
   "html": "<main data-onb prose data-chunk=\"onb-step-shell\" data-chunk-kind=\"page\">\n\n  <aside data-onb-story data-chunk=\"onb-story-pane\" data-chunk-slot=\"page-story\">\n    <a data-onb-brand href=\"/\" aria-label=\"AdiaUI home\">\n      <img src=\"/icons/agent-ui-light.svg\" alt=\"\" />\n      <strong>AdiaUI</strong>\n    </a>\n    <div data-onb-story-content>\n      <h2>Welcome aboard, Kim.</h2>\n      <p>\n        You're three minutes away from your first usable workspace.\n        We'll walk through the essentials — pick how you'll use it,\n        connect a data source, see your first dashboard come to life.\n        Skip anything you'd rather come back to later.\n      </p>\n      <text-ui color=\"subtle\" size=\"sm\">Step 1 of 10 · Onboarding</text-ui>\n    </div>\n  </aside>\n\n  <form data-onb-input action=\"/site/examples/onboarding/mode\" method=\"get\">\n\n    <header data-onb-heading data-chunk=\"onb-step-header\" data-chunk-slot=\"page-header\">\n      <h1>Let's get you set up</h1>\n      <text-ui color=\"subtle\">A quick guided tour. Everything is changeable in settings later.</text-ui>\n    </header>\n\n    <div data-onb-form data-chunk=\"onb-hero-welcome\" data-chunk-slot=\"page-content\">\n      <ul data-onb-outcomes>\n        <li>\n          <icon-ui name=\"check-circle\" weight=\"fill\"></icon-ui>\n          <div>\n            <strong>Pick how you'll use it</strong>\n            <text-ui color=\"subtle\" size=\"sm\">Tailors the home screen + which integrations we suggest first.</text-ui>\n          </div>\n        </li>\n        <li>\n          <icon-ui name=\"check-circle\" weight=\"fill\"></icon-ui>\n          <div>\n            <strong>Connect your first data source</strong>\n            <text-ui color=\"subtle\" size=\"sm\">One integration unlocks dashboards, alerts, and search across your stack.</text-ui>\n          </div>\n        </li>\n        <li>\n          <icon-ui name=\"check-circle\" weight=\"fill\"></icon-ui>\n          <div>\n            <strong>See your first dashboard</strong>\n            <text-ui color=\"subtle\" size=\"sm\">Generated from real data, ready to share or edit.</text-ui>\n          </div>\n        </li>\n      </ul>\n    </div>\n\n    <footer data-chunk=\"onb-step-footer\" data-chunk-slot=\"page-footer\">\n      <div data-onb-progress data-chunk=\"onb-step-progress\">\n        <text-ui color=\"subtle\" size=\"sm\">Step 1 of 10</text-ui>\n        <div data-onb-progress-track>\n          <span data-active></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>\n        </div>\n      </div>\n      <div data-onb-actions>\n        <button-ui text=\"Get started\" variant=\"primary\" type=\"submit\"></button-ui>\n      </div>\n    </footer>\n\n  </form>\n\n</main>",
   "source": "site/pages/examples/onboarding/welcome/index.html",
-  "captured_at": "2026-04-28T22:40:45.443Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/onb-story-pane.json

@@ -101,8 +101,8 @@
       "attrs": {
         "data-onb-story": ""
       },
-      "html": "<aside data-onb-story data-chunk=\"onb-story-pane\">\n    <a data-onb-brand href=\"/\" aria-label=\"AdiaUI home\">\n      <img src=\"/icons/agent-ui-light.svg\" alt=\"\" />\n      <strong>AdiaUI</strong>\n    </a>\n    <div data-onb-story-content>\n      <h2>Welcome aboard, Kim.</h2>\n      <p>\n        You're three minutes away from your first usable workspace.\n        We'll walk through the essentials — pick how you'll use it,\n        connect a data source, see your first dashboard come to life.\n        Skip anything you'd rather come back to later.\n      </p>\n      <text-ui color=\"subtle\" size=\"sm\">Step 1 of 10 · Onboarding</text-ui>\n    </div>\n  </aside>"
+      "html": "<aside data-onb-story data-chunk=\"onb-story-pane\" data-chunk-slot=\"page-story\">\n    <a data-onb-brand href=\"/\" aria-label=\"AdiaUI home\">\n      <img src=\"/icons/agent-ui-light.svg\" alt=\"\" />\n      <strong>AdiaUI</strong>\n    </a>\n    <div data-onb-story-content>\n      <h2>Welcome aboard, Kim.</h2>\n      <p>\n        You're three minutes away from your first usable workspace.\n        We'll walk through the essentials — pick how you'll use it,\n        connect a data source, see your first dashboard come to life.\n        Skip anything you'd rather come back to later.\n      </p>\n      <text-ui color=\"subtle\" size=\"sm\">Step 1 of 10 · Onboarding</text-ui>\n    </div>\n  </aside>"
     }
   ],
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/onb-tutorial-steps.json

@@ -10,5 +10,5 @@
   },
   "html": "<div data-onb-form data-chunk=\"onb-tutorial-steps\">\n      <div data-onb-tutorial>\n\n        <div data-onb-tutorial-step>\n          <span data-step-num>1</span>\n          <div data-step-body>\n            <text-ui strong>Describe what you want.</text-ui>\n            <text-ui color=\"subtle\" size=\"sm\">One sentence in plain English. AdiaUI picks the right components and wires them up.</text-ui>\n          </div>\n        </div>\n\n        <field-ui label=\"Prompt\">\n          <input-ui name=\"intent\" placeholder=\"A weekly revenue dashboard with a 6-month trend\"\n                    value=\"A weekly revenue dashboard with a 6-month trend\"></input-ui>\n        </field-ui>\n\n        <div data-onb-tutorial-step>\n          <span data-step-num>2</span>\n          <div data-step-body>\n            <text-ui strong>Generate.</text-ui>\n            <text-ui color=\"subtle\" size=\"sm\">Takes 1–3 seconds. The result lands editable on your canvas.</text-ui>\n          </div>\n        </div>\n\n        <div data-onb-tutorial-step>\n          <span data-step-num>3</span>\n          <div data-step-body>\n            <text-ui strong>Edit and share.</text-ui>\n            <text-ui color=\"subtle\" size=\"sm\">Move blocks, change palettes, swap data sources. Share via link, embed, or export to PNG.</text-ui>\n          </div>\n        </div>\n\n        <button-ui text=\"Generate dashboard\" variant=\"primary\" icon=\"sparkle\"></button-ui>\n      </div>\n\n      <text-ui color=\"subtle\" size=\"sm\">After generation we'll save the result to your workspace and continue to the next step. You can return to it any time from the sidebar.</text-ui>\n    </div>",
   "source": "site/pages/examples/onboarding/first-action/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/option-card-default.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"default\" data-chunk=\"option-card-default\">\n  <h2 variant=\"section\">Default</h2>\n  <p data-note>Heading + description from attributes. Click anywhere on the card to select.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Pick-one-of-three\">\n      <col-ui gap=\"2\" role=\"radiogroup\" aria-label=\"Demo\">\n        <option-card-ui name=\"demo-1\" value=\"build\" checked\n                        heading=\"I'm building a product\"\n                        description=\"Spinning up a new project — design, ship, iterate.\"></option-card-ui>\n        <option-card-ui name=\"demo-1\" value=\"explore\"\n                        heading=\"I'm exploring the product\"\n                        description=\"Kicking the tires before bringing a team along.\"></option-card-ui>\n        <option-card-ui name=\"demo-1\" value=\"migrate\"\n                        heading=\"I'm migrating from another tool\"\n                        description=\"Moving an existing workspace and want a smooth port.\"></option-card-ui>\n      </col-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/option-card/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/option-card-dense.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"dense\" data-chunk=\"option-card-dense\">\n  <h2 variant=\"section\">Dense (no description)</h2>\n  <p data-note>Heading-only when the choice is self-explanatory. The description row collapses out of the grid.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Heading-only\">\n      <col-ui gap=\"2\" role=\"radiogroup\" aria-label=\"Visibility\">\n        <option-card-ui name=\"demo-vis\" value=\"public\" checked heading=\"Public — anyone with the link\"></option-card-ui>\n        <option-card-ui name=\"demo-vis\" value=\"team\" heading=\"Team — workspace members only\"></option-card-ui>\n        <option-card-ui name=\"demo-vis\" value=\"private\" heading=\"Private — only me\"></option-card-ui>\n      </col-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/option-card/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/option-card-disabled.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"disabled\" data-chunk=\"option-card-disabled\">\n  <h2 variant=\"section\">Disabled</h2>\n  <p data-note>Disabled cards remain visible (so users see the unavailable option) but are non-interactive and dimmed.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"One option disabled\">\n      <col-ui gap=\"2\" role=\"radiogroup\" aria-label=\"Region\">\n        <option-card-ui name=\"demo-region\" value=\"us\" checked\n                        heading=\"United States\"\n                        description=\"Servers in us-east-1, us-west-2.\"></option-card-ui>\n        <option-card-ui name=\"demo-region\" value=\"eu\"\n                        heading=\"European Union\"\n                        description=\"Servers in eu-central-1, eu-west-1.\"></option-card-ui>\n        <option-card-ui name=\"demo-region\" value=\"apac\" disabled\n                        heading=\"Asia-Pacific\"\n                        description=\"Coming Q3. Join the waitlist for early access.\"></option-card-ui>\n      </col-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/option-card/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/option-card-heading-rich.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"heading-rich\" data-chunk=\"option-card-heading-rich\">\n  <h2 variant=\"section\">Rich heading slot</h2>\n  <p data-note>Slot any inline content — secondary text, badges, kbd hints — into the heading via <code>slot=\"heading\"</code>. Slotted content overrides the <code>heading</code> attribute.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Plan picker with badge + price\">\n      <col-ui gap=\"2\" role=\"radiogroup\" aria-label=\"Plan\">\n        <option-card-ui name=\"demo-plan\" value=\"free\"\n                        description=\"Up to 5 members · 10 projects · community support\">\n          <span slot=\"heading\">Free <text-ui color=\"subtle\" size=\"sm\">· $0/mo</text-ui></span>\n        </option-card-ui>\n        <option-card-ui name=\"demo-plan\" value=\"pro\" checked\n                        description=\"Unlimited members · advanced charts · 100 GB storage\">\n          <span slot=\"heading\">\n            Pro\n            <text-ui color=\"subtle\" size=\"sm\">· $49/mo</text-ui>\n            <badge-ui text=\"14-day trial\" variant=\"accent\"></badge-ui>\n          </span>\n        </option-card-ui>\n        <option-card-ui name=\"demo-plan\" value=\"team\"\n                        description=\"Everything in Pro · SSO · audit log · 1 TB storage\">\n          <span slot=\"heading\">Team <text-ui color=\"subtle\" size=\"sm\">· $129/mo</text-ui></span>\n        </option-card-ui>\n      </col-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/option-card/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/option-card-icon.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"icon\" data-chunk=\"option-card-icon\">\n  <h2 variant=\"section\">With leading icon</h2>\n  <p data-note>Adds a leading <code>icon-ui</code> between the radio circle and the heading. Useful when each option maps to a recognizable concept.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"With icons\">\n      <col-ui gap=\"2\" role=\"radiogroup\" aria-label=\"Storage\">\n        <option-card-ui name=\"demo-icon\" value=\"local\" icon=\"hard-drive\" checked\n                        heading=\"Local storage\"\n                        description=\"Files stay on this device. No sync, no upload.\"></option-card-ui>\n        <option-card-ui name=\"demo-icon\" value=\"cloud\" icon=\"cloud-arrow-up\"\n                        heading=\"Cloud storage\"\n                        description=\"Files sync across devices and backup automatically.\"></option-card-ui>\n        <option-card-ui name=\"demo-icon\" value=\"hybrid\" icon=\"arrows-clockwise\"\n                        heading=\"Hybrid\"\n                        description=\"Cache locally, sync changes to the cloud in the background.\"></option-card-ui>\n      </col-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/option-card/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/option-card-spillover.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"spillover\" data-chunk=\"option-card-spillover\">\n  <h2 variant=\"section\">Spillover content (default slot)</h2>\n  <p data-note>Drop any unslotted child into the card and it will reveal only when the card is checked — useful for an \"Other\" option that needs a free-text follow-up, or any conditional follow-on input. The textarea below appears only when \"Something else\" is selected.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"With Other + textarea\">\n      <col-ui gap=\"2\" role=\"radiogroup\" aria-label=\"Reason\">\n        <option-card-ui name=\"demo-spill\" value=\"bug\" checked\n                        heading=\"I found a bug\"\n                        description=\"Something isn't working the way you'd expect.\"></option-card-ui>\n        <option-card-ui name=\"demo-spill\" value=\"feature\"\n                        heading=\"I have a feature idea\"\n                        description=\"Something we should build that we haven't yet.\"></option-card-ui>\n        <option-card-ui name=\"demo-spill\" value=\"other\"\n                        heading=\"Something else\"\n                        description=\"Tell us more — we read every response.\">\n          <textarea-ui name=\"demo-spill-detail\" placeholder=\"What's on your mind?\" rows=\"3\"></textarea-ui>\n        </option-card-ui>\n      </col-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/option-card/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/otp-input-disabled.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"disabled\" data-chunk=\"otp-input-disabled\">\n  <h2 variant=\"section\">disabled</h2>\n  <p data-note>Prevents interaction with all digit inputs.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"disabled\">\n    <otp-input-ui disabled></otp-input-ui>\n  </div>\n  <div data-artifact-item data-artifact-label=\"disabled\">\n    <otp-input-ui length=\"4\" disabled></otp-input-ui>\n  </div>\n</div>\n</section>",
   "source": "site/pages/components/otp-input/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/otp-input-length.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"length\" data-chunk=\"otp-input-length\">\n  <h2 variant=\"section\">length</h2>\n  <p data-note>Number of digit boxes. Defaults to 6.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"otp-input\">\n    <otp-input-ui></otp-input-ui>\n  </div>\n  <div data-artifact-item data-artifact-label=\"otp-input\">\n    <otp-input-ui length=\"4\"></otp-input-ui>\n  </div>\n</div>\n</section>",
   "source": "site/pages/components/otp-input/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/otp-input-name.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"name\" data-chunk=\"otp-input-name\">\n  <h2 variant=\"section\">name</h2>\n  <p data-note>Form field name used when submitting the OTP value.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"name=otp\"><otp-input-ui name=\"otp\"></otp-input-ui></div>\n    <div data-artifact-item data-artifact-label=\"name=verification_code\"><otp-input-ui name=\"verification_code\"></otp-input-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/otp-input/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/otp-input-value.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"value\" data-chunk=\"otp-input-value\">\n  <h2 variant=\"section\">value</h2>\n  <p data-note>Pre-filled OTP value.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"partial 123\"><otp-input-ui value=\"123\"></otp-input-ui></div>\n    <div data-artifact-item data-artifact-label=\"full 123456\"><otp-input-ui value=\"123456\"></otp-input-ui></div>\n    <div data-artifact-item data-artifact-label=\"empty\"><otp-input-ui value=\"\"></otp-input-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/otp-input/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-basic.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"basic\" data-chunk=\"pagination-basic\">\n  <h2 variant=\"section\">basic (5 pages)</h2>\n  <p data-note>A small page set shows all page numbers without ellipsis.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"5 pages, page 1\">\n      <pagination-ui page=\"1\" total=\"5\"></pagination-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-combo.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-combo data-chunk=\"pagination-combo\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Various page positions with different total counts.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"middle of small set\">\n      <pagination-ui page=\"3\" total=\"5\"></pagination-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label=\"50 pages, siblings=2, page 7\">\n      <pagination-ui page=\"7\" total=\"50\" siblings=\"2\"></pagination-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label=\"last page of 15\">\n      <pagination-ui page=\"15\" total=\"15\"></pagination-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-edge.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-edge data-chunk=\"pagination-edge\">\n  <h2 variant=\"section\">Edge Cases</h2>\n  <p data-note>Boundary conditions.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"single page\">\n      <pagination-ui page=\"1\" total=\"1\"></pagination-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"two pages\">\n      <pagination-ui page=\"1\" total=\"2\"></pagination-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"1000 pages\">\n      <pagination-ui page=\"500\" total=\"1000\"></pagination-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-first-page.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"first-page\" data-chunk=\"pagination-first-page\">\n  <h2 variant=\"section\">first page</h2>\n  <p data-note>Previous button is disabled on the first page.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"page 1 of 20\">\n      <pagination-ui page=\"1\" total=\"20\"></pagination-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-last-page.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"last-page\" data-chunk=\"pagination-last-page\">\n  <h2 variant=\"section\">last page</h2>\n  <p data-note>Next button is disabled on the last page.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"page 20 of 20\">\n      <pagination-ui page=\"20\" total=\"20\"></pagination-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-many-pages.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"many-pages\" data-chunk=\"pagination-many-pages\">\n  <h2 variant=\"section\">many pages (20 pages)</h2>\n  <p data-note>With many pages, ellipsis appears between sibling range and edges.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"20 pages, page 5\">\n      <pagination-ui page=\"5\" total=\"20\"></pagination-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-page.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"page\" data-chunk=\"pagination-page\">\n  <h2 variant=\"section\">page</h2>\n  <p data-note>Currently active page (1-indexed).</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"page=1\"><pagination-ui page=\"1\" total=\"10\"></pagination-ui></div>\n    <div data-artifact-item data-artifact-label=\"page=5\"><pagination-ui page=\"5\" total=\"10\"></pagination-ui></div>\n    <div data-artifact-item data-artifact-label=\"page=10\"><pagination-ui page=\"10\" total=\"10\"></pagination-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-siblings.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"siblings\" data-chunk=\"pagination-siblings\">\n  <h2 variant=\"section\">siblings</h2>\n  <p data-note>Controls how many page numbers appear on each side of the current page. Defaults to 1.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"siblings=1\">\n      <pagination-ui page=\"10\" total=\"20\" siblings=\"1\"></pagination-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label=\"siblings=2\">\n      <pagination-ui page=\"10\" total=\"20\" siblings=\"2\"></pagination-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-size.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"size\" data-chunk=\"pagination-size\">\n  <h2 variant=\"section\">size</h2>\n  <p data-note>Controls the dimensions. Defaults to \"md\".</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"sm\">\n      <pagination-ui size=\"sm\" total=\"100\" page=\"1\"></pagination-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"md (default)\">\n      <pagination-ui total=\"100\" page=\"1\"></pagination-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"lg\">\n      <pagination-ui size=\"lg\" total=\"100\" page=\"1\"></pagination-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-total.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"total\" data-chunk=\"pagination-total\">\n  <h2 variant=\"section\">total</h2>\n  <p data-note>Total number of pages to display in the control.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"total=3\"><pagination-ui page=\"1\" total=\"3\"></pagination-ui></div>\n    <div data-artifact-item data-artifact-label=\"total=10\"><pagination-ui page=\"1\" total=\"10\"></pagination-ui></div>\n    <div data-artifact-item data-artifact-label=\"total=25\"><pagination-ui page=\"1\" total=\"25\"></pagination-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pagination-variant.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"variant\" data-chunk=\"pagination-variant\">\n  <h2 variant=\"section\">variant</h2>\n  <p data-note>Default is text-style links. <code>variant=\"button\"</code> renders square 1:1 bordered buttons.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"default (text)\">\n      <pagination-ui page=\"3\" total=\"10\"></pagination-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label='variant=\"button\"'>\n      <pagination-ui variant=\"button\" page=\"3\" total=\"10\"></pagination-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pagination/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pane-basic.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"basic\" data-chunk=\"pane-basic\">\n  <h2 variant=\"section\">basic</h2>\n  <p data-note>A pane with a header and content section. Click the header to toggle collapse.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"default pane\" style=\"width:300px;\">\n      <pane-ui>\n        <header>Details</header>\n        <section>\n          <div data-col>\n            <p>This is basic pane content. Click the header to collapse.</p>\n          </div>\n        </section>\n      </pane-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pane/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pane-collapsed.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"collapsed\" data-chunk=\"pane-collapsed\">\n  <h2 variant=\"section\">collapsed</h2>\n  <p data-note>Set the collapsed attribute to start the pane in a collapsed state.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"collapsed on load\" style=\"width:300px;\">\n      <pane-ui collapsed>\n        <header>Collapsed Pane</header>\n        <section>\n          <div data-col>\n            <p>This content is hidden until the pane is expanded.</p>\n          </div>\n        </section>\n      </pane-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pane/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pane-combo.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-combo data-chunk=\"pane-combo\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Resizable pane with rich content and multiple sections.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"resizable + sections + footer\">\n      <pane-ui resizable min-width=\"240\" max-width=\"450\" style=\"width:320px;\">\n        <header>Settings</header>\n        <section>\n          <header>General</header>\n          <div data-col>\n            <field-ui label=\"Dark mode\" inline>\n              <switch-ui></switch-ui>\n            </field-ui>\n            <field-ui label=\"Notifications\" inline>\n              <switch-ui checked></switch-ui>\n            </field-ui>\n          </div>\n        </section>\n        <section>\n          <header>Advanced</header>\n          <div data-col>\n            <field-ui label=\"API Key\">\n              <input-ui placeholder=\"sk-...\"></input-ui>\n            </field-ui>\n            <range-ui label=\"Cache TTL\" value=\"3600\" min=\"0\" max=\"86400\"></range-ui>\n          </div>\n        </section>\n        <footer>\n          <button-ui text=\"Reset\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <span style=\"flex:1;\"></span>\n          <button-ui text=\"Apply\" variant=\"primary\" size=\"sm\"></button-ui>\n        </footer>\n      </pane-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pane/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pane-edge.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-edge data-chunk=\"pane-edge\">\n  <h2 variant=\"section\">Edge Cases</h2>\n  <p data-note>Boundary conditions.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"no content\" style=\"width:300px;\">\n      <pane-ui>\n        <header>Empty Pane</header>\n      </pane-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"long header\" style=\"width:300px;\">\n      <pane-ui>\n        <header>This is a pane with a very long header title that may overflow</header>\n        <section>\n          <div data-col>\n            <p>Content here.</p>\n          </div>\n        </section>\n      </pane-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pane/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pane-maxWidth.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"maxWidth\" data-chunk=\"pane-maxWidth\">\n  <h2 variant=\"section\">maxWidth</h2>\n  <p data-note>Maximum width the pane may be resized to.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"max-width=320px\"><pane-ui max-width=\"320px\" style=\"height:120px;\">Max 320px</pane-ui></div>\n    <div data-artifact-item data-artifact-label=\"max-width=480px\"><pane-ui max-width=\"480px\" style=\"height:120px;\">Max 480px</pane-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/pane/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pane-minWidth.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"minWidth\" data-chunk=\"pane-minWidth\">\n  <h2 variant=\"section\">minWidth</h2>\n  <p data-note>Minimum width the pane may be resized to.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"min-width=120px\"><pane-ui min-width=\"120px\" style=\"height:120px;\">Min 120px</pane-ui></div>\n    <div data-artifact-item data-artifact-label=\"min-width=240px\"><pane-ui min-width=\"240px\" style=\"height:120px;\">Min 240px</pane-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/pane/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pane-resizable.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"resizable\" data-chunk=\"pane-resizable\">\n  <h2 variant=\"section\">resizable</h2>\n  <p data-note>Adds a drag handle for width resizing. Constrained by min-width and max-width.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"resizable (200-500px)\">\n      <pane-ui resizable min-width=\"200\" max-width=\"500\" style=\"width:300px;\">\n        <header>Resizable</header>\n        <section>\n          <div data-col>\n            <p>Drag the right edge to resize this pane between 200px and 500px.</p>\n          </div>\n        </section>\n      </pane-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pane/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pane-sections.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"sections\" data-chunk=\"pane-sections\">\n  <h2 variant=\"section\">header, sections, footer</h2>\n  <p data-note>A full pane with multiple sections and a footer.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"multi-section with footer\" style=\"width:300px;\">\n      <pane-ui>\n        <header>Inspector</header>\n        <section>\n          <header>Properties</header>\n          <div data-col>\n            <field-ui label=\"Name\">\n              <input-ui placeholder=\"Element name\"></input-ui>\n            </field-ui>\n            <field-ui label=\"ID\">\n              <input-ui placeholder=\"element-id\"></input-ui>\n            </field-ui>\n          </div>\n        </section>\n        <section>\n          <header>Appearance</header>\n          <div data-col>\n            <field-ui label=\"Color\">\n              <select-ui placeholder=\"Choose color\"></select-ui>\n            </field-ui>\n            <range-ui label=\"Opacity\" value=\"100\" min=\"0\" max=\"100\"></range-ui>\n          </div>\n        </section>\n        <footer>\n          <span style=\"color:var(--a-fg-muted); font-size:var(--a-font-size-xs);\">2 properties</span>\n        </footer>\n      </pane-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/pane/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/permissions-matrix-grid.json

@@ -0,0 +1,15 @@
+{
+  "name": "permissions-matrix-grid",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/patterns/permissions-matrix",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "grid"
+  },
+  "html": "<section data-section data-property=\"grid\" data-chunk=\"permissions-matrix-grid\">\n  <h2 variant=\"section\">Editable matrix</h2>\n  <p data-note>Capability per row, role per column, <code>check-ui</code> in each cell. Built-in roles (Viewer / Member / Admin / Owner) render <code>disabled</code> — they reflect the role's permissions but can't be edited from this surface. The <em>Custom</em> column is the authoring affordance: cells there toggle freely and save on change.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"permission matrix grid\">\n      <card-ui data-perm-card>\n        <header>\n          <span slot=\"heading\" variant=\"section\">Permissions</span>\n          <text-ui slot=\"description\" color=\"subtle\">Changes save automatically</text-ui>\n          <button-ui slot=\"action\" text=\"Add custom role\" variant=\"ghost\" size=\"sm\" icon-leading=\"plus\"></button-ui>\n        </header>\n        <section bleed>\n          <table-ui id=\"pat-perm-matrix\" raw></table-ui>\n        </section>\n        <footer divider>\n          <text-ui slot=\"description\" color=\"subtle\" size=\"sm\">Built-in roles are read-only. The Custom column is editable.</text-ui>\n        </footer>\n      </card-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/patterns/permissions-matrix/index.html",
+  "captured_at": "2026-05-01T19:13:23.303Z"
+}

package/chunks/permissions-matrix-summary.json

@@ -0,0 +1,15 @@
+{
+  "name": "permissions-matrix-summary",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/patterns/permissions-matrix",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "summary"
+  },
+  "html": "<section data-section data-property=\"summary\" data-chunk=\"permissions-matrix-summary\">\n  <h2 variant=\"section\">Read-only role summary</h2>\n  <p data-note>One card per role; <code>description-list-ui</code> with capability category as term, list of capabilities as description. Inline tag indicates whether the role is built-in or custom.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"role summary card\">\n      <card-ui data-perm-summary>\n        <header>\n          <span slot=\"heading\" variant=\"section\">Admin</span>\n          <text-ui slot=\"description\" color=\"subtle\">Built-in role · 3 members</text-ui>\n          <tag-ui slot=\"action\" variant=\"accent\" size=\"sm\">Built-in</tag-ui>\n        </header>\n        <section>\n          <description-list-ui>\n            <span slot=\"term\">Content</span>\n            <span slot=\"description\">Read · Comment · Edit own</span>\n            <span slot=\"term\">Members</span>\n            <span slot=\"description\">Manage members (invite, change role, remove)</span>\n            <span slot=\"term\">Workspace</span>\n            <span slot=\"description\">All settings except deletion (Owner only)</span>\n          </description-list-ui>\n        </section>\n        <footer divider>\n          <button-ui slot=\"action\" text=\"View matrix\" variant=\"ghost\" size=\"sm\" icon-trailing=\"arrow-right\"></button-ui>\n        </footer>\n      </card-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/patterns/permissions-matrix/index.html",
+  "captured_at": "2026-05-01T19:13:23.303Z"
+}

package/chunks/permissions-role-picker-radio.json

@@ -0,0 +1,15 @@
+{
+  "name": "permissions-role-picker-radio",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/patterns/permissions-role-picker",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "radio"
+  },
+  "html": "<section data-section data-property=\"radio\" data-chunk=\"permissions-role-picker-radio\">\n  <h2 variant=\"section\">Rich radio group</h2>\n  <p data-note>Each role gets an <code>option-card-ui</code> with name, one-line description, and (optionally) a \"recommended\" badge. Default selection lands on the lowest-privilege role — promote-by-decision, not by accident.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"rich role picker\">\n      <field-ui label=\"Role\" hint=\"Members can be promoted to admin later by any owner.\">\n        <col-ui gap=\"2\">\n          <option-card-ui name=\"role\" value=\"viewer\" heading=\"Viewer\" description=\"Can read everything; cannot edit, comment, or share.\"></option-card-ui>\n          <option-card-ui name=\"role\" value=\"member\" heading=\"Member\" description=\"Can edit content they own and comment on anything.\" checked></option-card-ui>\n          <option-card-ui name=\"role\" value=\"admin\" description=\"Can manage members, billing, and integrations.\">\n            <span slot=\"heading\">Admin <tag-ui size=\"sm\">Recommended for leads</tag-ui></span>\n          </option-card-ui>\n          <option-card-ui name=\"role\" value=\"owner\" heading=\"Owner\" description=\"Admin powers plus the ability to delete the workspace.\"></option-card-ui>\n        </col-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/patterns/permissions-role-picker/index.html",
+  "captured_at": "2026-05-01T19:13:23.303Z"
+}

package/chunks/permissions-role-picker-select.json

@@ -0,0 +1,15 @@
+{
+  "name": "permissions-role-picker-select",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/patterns/permissions-role-picker",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "select"
+  },
+  "html": "<section data-section data-property=\"select\" data-chunk=\"permissions-role-picker-select\">\n  <h2 variant=\"section\">Compact select (table inline)</h2>\n  <p data-note>Used inside a members table. The select replaces the static role tag on row-hover, or stays inline when the table is in edit mode. Falls back to a non-interactive <code>tag-ui</code> when the current user can't change roles.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"role select inline\">\n      <row-ui gap=\"3\" align=\"center\" padding=\"2\" style=\"max-width: 480px;\">\n        <avatar-ui size=\"sm\" text=\"Kim Granlund\"></avatar-ui>\n        <col-ui gap=\"0\" grow>\n          <text-ui strong>Kim Granlund</text-ui>\n          <text-ui color=\"subtle\" size=\"sm\">kim@example.com</text-ui>\n        </col-ui>\n        <select-ui value=\"admin\" size=\"sm\" style=\"min-width: 140px;\">\n          <option value=\"viewer\">Viewer</option>\n          <option value=\"member\">Member</option>\n          <option value=\"admin\" selected>Admin</option>\n          <option value=\"owner\">Owner</option>\n        </select-ui>\n      </row-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/patterns/permissions-role-picker/index.html",
+  "captured_at": "2026-05-01T19:13:23.303Z"
+}

package/chunks/permissions-share-link.json

@@ -0,0 +1,15 @@
+{
+  "name": "permissions-share-link",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/patterns/permissions-sharing",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "share-link"
+  },
+  "html": "<section data-section data-property=\"share-link\" data-chunk=\"permissions-share-link\">\n  <h2 variant=\"section\">Share link with expiry</h2>\n  <p data-note>Surfaces when the user picks Link or Public scope. Generated URL with copy button; <code>select-ui</code> for expiry; revoke button as a danger-tone secondary action.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"share link with expiry\">\n      <card-ui style=\"max-width: 560px;\">\n        <header>\n          <span slot=\"heading\" variant=\"section\">Share link</span>\n          <tag-ui slot=\"action\" variant=\"accent\" size=\"sm\">Anyone with the link</tag-ui>\n        </header>\n        <section>\n          <col-ui gap=\"3\">\n            <row-ui gap=\"2\" align=\"center\">\n              <input-ui readonly value=\"https://acme.app/d/8421-revenue-q2\" style=\"flex: 1;\"></input-ui>\n              <button-ui text=\"Copy\" variant=\"primary\" icon-leading=\"copy\"></button-ui>\n            </row-ui>\n            <row-ui gap=\"3\" align=\"center\">\n              <field-ui label=\"Expires\" inline>\n                <select-ui value=\"7d\" size=\"sm\" style=\"min-width: 140px;\">\n                  <option value=\"never\">Never</option>\n                  <option value=\"24h\">24 hours</option>\n                  <option value=\"7d\" selected>7 days</option>\n                  <option value=\"30d\">30 days</option>\n                  <option value=\"custom\">Custom date…</option>\n                </select-ui>\n              </field-ui>\n              <field-ui label=\"Permission\" inline>\n                <select-ui value=\"view\" size=\"sm\" style=\"min-width: 140px;\">\n                  <option value=\"view\" selected>Can view</option>\n                  <option value=\"comment\">Can comment</option>\n                  <option value=\"edit\">Can edit</option>\n                </select-ui>\n              </field-ui>\n            </row-ui>\n            <description-list-ui>\n              <dt>Created</dt>\n              <dd>Apr 22 · by Kim Granlund</dd>\n              <dt>Used</dt>\n              <dd>14 opens · last 2 hours ago</dd>\n            </description-list-ui>\n          </col-ui>\n        </section>\n        <footer divider>\n          <button-ui slot=\"action\" text=\"Revoke link\" variant=\"ghost\" color=\"danger\" size=\"sm\" icon-leading=\"x\"></button-ui>\n        </footer>\n      </card-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/patterns/permissions-sharing/index.html",
+  "captured_at": "2026-05-01T19:13:23.303Z"
+}

package/chunks/permissions-share-people.json

@@ -0,0 +1,15 @@
+{
+  "name": "permissions-share-people",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/patterns/permissions-sharing",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "people"
+  },
+  "html": "<section data-section data-property=\"people\" data-chunk=\"permissions-share-people\">\n  <h2 variant=\"section\">Add people with role</h2>\n  <p data-note>Surfaces in the Private and Org scopes. Autocomplete <code>search-ui</code> for people; per-row <code>select-ui</code> for the access role; existing-shares list below the input.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"add people share\">\n      <card-ui style=\"max-width: 560px;\">\n        <header>\n          <span slot=\"heading\" variant=\"section\">Share with people</span>\n        </header>\n        <section>\n          <col-ui gap=\"3\">\n            <row-ui gap=\"2\" align=\"center\">\n              <search-ui placeholder=\"Add by name or email\" style=\"flex: 1;\"></search-ui>\n              <select-ui value=\"view\" size=\"sm\" style=\"min-width: 130px;\">\n                <option value=\"view\" selected>Can view</option>\n                <option value=\"comment\">Can comment</option>\n                <option value=\"edit\">Can edit</option>\n              </select-ui>\n              <button-ui text=\"Invite\" variant=\"primary\" size=\"sm\"></button-ui>\n            </row-ui>\n            <col-ui gap=\"2\">\n              <row-ui gap=\"3\" align=\"center\">\n                <avatar-ui size=\"sm\" text=\"Kim Granlund\"></avatar-ui>\n                <col-ui gap=\"0\" grow>\n                  <text-ui strong>Kim Granlund</text-ui>\n                  <text-ui color=\"subtle\" size=\"sm\">kim@example.com</text-ui>\n                </col-ui>\n                <tag-ui size=\"sm\">Owner</tag-ui>\n              </row-ui>\n              <row-ui gap=\"3\" align=\"center\">\n                <avatar-ui size=\"sm\" text=\"Avery Chen\"></avatar-ui>\n                <col-ui gap=\"0\" grow>\n                  <text-ui strong>Avery Chen</text-ui>\n                  <text-ui color=\"subtle\" size=\"sm\">avery@example.com</text-ui>\n                </col-ui>\n                <select-ui value=\"edit\" size=\"sm\" style=\"min-width: 130px;\">\n                  <option value=\"view\">Can view</option>\n                  <option value=\"comment\">Can comment</option>\n                  <option value=\"edit\" selected>Can edit</option>\n                  <option value=\"remove\">Remove access</option>\n                </select-ui>\n              </row-ui>\n              <row-ui gap=\"3\" align=\"center\">\n                <avatar-ui size=\"sm\" text=\"Jordan Park\"></avatar-ui>\n                <col-ui gap=\"0\" grow>\n                  <text-ui strong>Jordan Park</text-ui>\n                  <text-ui color=\"subtle\" size=\"sm\">jordan@example.com</text-ui>\n                </col-ui>\n                <select-ui value=\"comment\" size=\"sm\" style=\"min-width: 130px;\">\n                  <option value=\"view\">Can view</option>\n                  <option value=\"comment\" selected>Can comment</option>\n                  <option value=\"edit\">Can edit</option>\n                  <option value=\"remove\">Remove access</option>\n                </select-ui>\n              </row-ui>\n            </col-ui>\n          </col-ui>\n        </section>\n      </card-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/patterns/permissions-sharing/index.html",
+  "captured_at": "2026-05-01T19:13:23.303Z"
+}

package/chunks/permissions-sharing-scopes.json

@@ -0,0 +1,15 @@
+{
+  "name": "permissions-sharing-scopes",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/patterns/permissions-sharing",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "scopes"
+  },
+  "html": "<section data-section data-property=\"scopes\" data-chunk=\"permissions-sharing-scopes\">\n  <h2 variant=\"section\">Visibility scope picker</h2>\n  <p data-note>Four scopes as <code>option-card-ui</code> in a stacked radio group: Private, Link, Organization, Public. Each shows the audience and the action the user takes after picking.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"visibility scope picker\">\n      <field-ui label=\"Who can access this dashboard?\">\n        <col-ui gap=\"2\">\n          <option-card-ui name=\"scope\" value=\"private\" heading=\"Private\" description=\"Only people you've added explicitly.\" icon=\"lock\" checked></option-card-ui>\n          <option-card-ui name=\"scope\" value=\"link\" heading=\"Anyone with the link\" description=\"No sign-in required. Link can be revoked anytime.\" icon=\"link\"></option-card-ui>\n          <option-card-ui name=\"scope\" value=\"org\" heading=\"Anyone in your workspace\" description=\"Members of acme.com can find and open it.\" icon=\"users\"></option-card-ui>\n          <option-card-ui name=\"scope\" value=\"public\" description=\"Discoverable via search. Use with care.\" icon=\"globe\">\n            <span slot=\"heading\">Public on the web <tag-ui variant=\"warning\" size=\"sm\">Indexable</tag-ui></span>\n          </option-card-ui>\n        </col-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/patterns/permissions-sharing/index.html",
+  "captured_at": "2026-05-01T19:13:23.303Z"
+}

package/chunks/pipeline-status-complete.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"complete\" data-chunk=\"pipeline-status-complete\">\n  <h2 variant=\"section\">complete</h2>\n  <p data-note>Mark the pipeline as finished. The indicator switches to a success state.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"complete\">\n      <pipeline-status-ui stage=\"Done\" message=\"All 100 intents passed\" status=\"completed\"></pipeline-status-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/pipeline-status/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pipeline-status-message.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"message\" data-chunk=\"pipeline-status-message\">\n  <h2 variant=\"section\">message</h2>\n  <p data-note>A secondary status line. Often updated as the stage progresses.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"message\">\n      <pipeline-status-ui stage=\"Running evals\" message=\"32 / 100 intents scored...\"></pipeline-status-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"message\">\n      <pipeline-status-ui stage=\"Uploading\" message=\"dist.tar.gz (4.2 MB)\"></pipeline-status-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/pipeline-status/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/pipeline-status-stage.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"stage\" data-chunk=\"pipeline-status-stage\">\n  <h2 variant=\"section\">stage</h2>\n  <p data-note>The current step label, rendered prominently.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"stage\">\n      <pipeline-status-ui stage=\"Building catalog\" message=\"Reading 100 patterns from disk...\"></pipeline-status-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/pipeline-status/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }