@adia-ai/a2ui-corpus 0.0.7 → 0.2.0

package/chunks/drawer-permanent.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"permanent\" data-chunk=\"drawer-permanent\">\n  <h2 variant=\"section\">permanent</h2>\n  <p data-note>When set, hides the close button and disables Escape / backdrop dismiss. The author must close the drawer programmatically (typically from a confirmation action). Default is <code>false</code> — drawers are dismissable.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"default (dismissable)\">\n      <button-ui text=\"Closable\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Confirm changes\" side=\"right\">\n        <section><text-ui color=\"subtle\">Close via × button, Escape, or backdrop click.</text-ui></section>\n      </drawer-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"permanent\">\n      <button-ui text=\"Permanent\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Required step\" side=\"right\" permanent>\n        <section><text-ui color=\"subtle\">Must be resolved through its action button.</text-ui></section>\n        <footer>\n          <button-ui text=\"Complete\" variant=\"primary\" stretch onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n        </footer>\n      </drawer-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/drawer/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/drawer-report.json

@@ -11,5 +11,5 @@
   },
   "html": "<drawer-ui id=\"drawer-report\" data-chunk=\"drawer-report\" side=\"right\" size=\"md\">\n  <header>\n    <span slot=\"icon\">\n      <avatar-ui icon=\"chart-line\"></avatar-ui>\n    </span>\n    <span slot=\"heading\">\n      <text-ui strong data-report-name>Report</text-ui>\n      <badge-ui data-report-status text=\"Active\" variant=\"success\"></badge-ui>\n    </span>\n    <span slot=\"action\"></span>\n  </header>\n  <section>\n    <text-ui color=\"subtle\" size=\"sm\" data-report-meta>Scheduled delivery configuration.</text-ui>\n  </section>\n  <section>\n    <col-ui gap=\"4\">\n      <grid-ui columns=\"2\" gap=\"3\">\n        <card-ui size=\"sm\"\n          ><section><stat-ui label=\"Last run\" data-report-last value=\"—\"></stat-ui></section\n        ></card-ui>\n        <card-ui size=\"sm\"\n          ><section><stat-ui label=\"Recipients\" data-report-recipients value=\"—\"></stat-ui></section\n        ></card-ui>\n      </grid-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"3\">\n        <text-ui strong>Schedule</text-ui>\n        <field-ui label=\"Frequency\">\n          <select-ui value=\"weekly\">\n          <option value=\"hourly\">Hourly</option>\n          <option value=\"daily\">Daily</option>\n          <option value=\"weekly\">Weekly</option>\n          <option value=\"monthly\">Monthly</option>\n          <option value=\"realtime\">Real-time (triggered)</option>\n        </select-ui>\n        </field-ui>\n        <row-ui gap=\"2\">\n          <field-ui label=\"Day\">\n            <select-ui value=\"mon\" grow>\n            <option value=\"mon\">Monday</option>\n            <option value=\"tue\">Tuesday</option>\n            <option value=\"wed\">Wednesday</option>\n            <option value=\"thu\">Thursday</option>\n            <option value=\"fri\">Friday</option>\n          </select-ui>\n          </field-ui>\n          <field-ui label=\"Time\">\n            <input-ui value=\"09:00\" type=\"time\" grow></input-ui>\n          </field-ui>\n          <field-ui label=\"Timezone\">\n            <select-ui value=\"utc\" grow>\n            <option value=\"utc\">UTC</option>\n            <option value=\"pst\">PST</option>\n            <option value=\"est\">EST</option>\n            <option value=\"cet\">CET</option>\n          </select-ui>\n          </field-ui>\n        </row-ui>\n      </col-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"3\">\n        <text-ui strong>Delivery</text-ui>\n        <field-ui label=\"Recipients\">\n          <textarea-ui rows=\"2\" value=\"alex@acme.com, sarah@acme.com, finance@acme.com\" hint=\"Comma-separated email addresses.\"></textarea-ui>\n        </field-ui>\n        <field-ui label=\"Format\">\n          <select-ui value=\"pdf\">\n          <option value=\"pdf\">PDF</option>\n          <option value=\"csv\">CSV</option>\n          <option value=\"xlsx\">Excel (xlsx)</option>\n          <option value=\"slack\">Post to Slack</option>\n        </select-ui>\n        </field-ui>\n        <field-ui label=\"Attach raw data export\" inline>\n          <switch-ui checked></switch-ui>\n        </field-ui>\n        <field-ui label=\"Include AI summary\" inline>\n          <switch-ui></switch-ui>\n        </field-ui>\n      </col-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"3\">\n        <text-ui strong>Scope</text-ui>\n        <field-ui label=\"Date range\">\n          <select-ui value=\"last-7-days\">\n          <option value=\"last-24h\">Last 24 hours</option>\n          <option value=\"last-7-days\">Last 7 days</option>\n          <option value=\"last-30-days\">Last 30 days</option>\n          <option value=\"mtd\">Month-to-date</option>\n          <option value=\"custom\">Custom range</option>\n        </select-ui>\n        </field-ui>\n      </col-ui>\n    </col-ui>\n  </section>\n  <footer slot=\"footer\">\n    <grid-ui>\n      <button-ui text=\"Pause\" icon=\"pause\" variant=\"ghost\"></button-ui>\n      <button-ui text=\"Run now\" icon=\"play\" variant=\"outline\"></button-ui>\n      <button-ui text=\"Save changes\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n    </grid-ui>\n  </footer>\n</drawer-ui>",
   "source": "site/pages/examples/admin-dashboard/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/drawer-revoke-session.json

@@ -11,5 +11,5 @@
   },
   "html": "<drawer-ui id=\"drawer-revoke-session\" data-chunk=\"drawer-revoke-session\" side=\"right\" size=\"md\">\n  <header>\n    <span slot=\"icon\">\n      <avatar-ui icon=\"sign-out\"></avatar-ui>\n    </span>\n    <span slot=\"heading\">\n      <text-ui strong>Revoke session</text-ui>\n    </span>\n    <span slot=\"action\"></span>\n  </header>\n  <section>\n    <text-ui color=\"subtle\" size=\"sm\">Signs the device out immediately. It will need to re-authenticate to sign back in.</text-ui>\n  </section>\n  <section>\n    <col-ui gap=\"4\">\n      <card-ui>\n        <header>\n          <span slot=\"icon\"><avatar-ui icon=\"device-mobile\"></avatar-ui></span>\n          <span slot=\"heading\"><text-ui strong>iPhone 16 · Safari</text-ui></span>\n          <span slot=\"description\"><text-ui color=\"subtle\" size=\"sm\">San Francisco, CA · 2 hours ago · 136.24.51.9</text-ui></span>\n        </header>\n      </card-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"2\">\n        <text-ui strong>Recent activity on this session</text-ui>\n        <row-ui gap=\"2\" align=\"center\"><icon-ui name=\"chat-circle\" color=\"subtle\"></icon-ui><text-ui>Opened 4 conversations</text-ui></row-ui>\n        <row-ui gap=\"2\" align=\"center\"><icon-ui name=\"upload\" color=\"subtle\"></icon-ui><text-ui>Uploaded 2 files</text-ui></row-ui>\n        <row-ui gap=\"2\" align=\"center\"><icon-ui name=\"user-gear\" color=\"subtle\"></icon-ui><text-ui>Changed workspace: AdiaUI</text-ui></row-ui>\n      </col-ui>\n      <divider-ui></divider-ui>\n      <field-ui label=\"Also rotate API keys created from this session\" inline>\n        <check-ui></check-ui>\n      </field-ui>\n      <field-ui label=\"Notify me if this device signs back in\" inline>\n        <check-ui checked></check-ui>\n      </field-ui>\n      <alert-ui variant=\"info\" icon=\"info\" text=\"If you don't recognize this session, revoke it and change your password.\"></alert-ui>\n    </col-ui>\n  </section>\n  <footer slot=\"footer\">\n    <grid-ui>\n      <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n      <button-ui text=\"Revoke session\" icon=\"sign-out\" color=\"danger\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n    </grid-ui>\n  </footer>\n</drawer-ui>",
   "source": "site/pages/examples/profile-security/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/drawer-role.json

@@ -11,5 +11,5 @@
   },
   "html": "<drawer-ui id=\"drawer-role\" data-chunk=\"drawer-role\" side=\"right\" size=\"md\">\n  <header>\n    <span slot=\"icon\">\n      <avatar-ui icon=\"user\"></avatar-ui>\n    </span>\n    <span slot=\"heading\">\n      <text-ui strong>Role</text-ui>\n    </span>\n    <span slot=\"action\"></span>\n  </header>\n  <section>\n    <text-ui color=\"subtle\" size=\"sm\">Tunes which dashboards land on your home and which integrations we surface first.</text-ui>\n  </section>\n  <section>\n    <div role=\"radiogroup\" aria-label=\"Role\">\n      <col-ui gap=\"2\">\n        <option-card-ui\n          name=\"role\" value=\"developer\" checked\n          heading=\"Developer\"\n          description=\"Home pinned to release dashboards. Surfaces deploys, PR throughput, error rates.\"></option-card-ui>\n        <option-card-ui\n          name=\"role\" value=\"pm\"\n          heading=\"Product Manager\"\n          description=\"Home pinned to product KPIs. Surfaces feature usage, retention, NPS.\"></option-card-ui>\n        <option-card-ui\n          name=\"role\" value=\"designer\"\n          heading=\"Designer\"\n          description=\"Home pinned to research + funnel surfaces. Surfaces session replays and qual snippets.\"></option-card-ui>\n        <option-card-ui\n          name=\"role\" value=\"other\"\n          heading=\"Something else\"\n          description=\"Tell us more — we'll start with a generalist home and refine later.\">\n          <textarea-ui name=\"role-detail\" placeholder=\"What do you do day-to-day?\" rows=\"2\"></textarea-ui>\n        </option-card-ui>\n      </col-ui>\n    </div>\n  </section>\n  <footer slot=\"footer\">\n    <grid-ui>\n      <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n      <button-ui text=\"Save changes\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n    </grid-ui>\n  </footer>\n</drawer-ui>",
   "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/drawer-side.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"side\" data-chunk=\"drawer-side\">\n  <h2 variant=\"section\">side</h2>\n  <p data-note>Edge the drawer slides in from. Defaults to <code>right</code>.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"left\">\n      <button-ui text=\"Left\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Navigation\" side=\"left\" size=\"sm\">\n        <section>\n          <col-ui gap=\"1\">\n            <button-ui text=\"Dashboard\" icon=\"house\" variant=\"ghost\"></button-ui>\n            <button-ui text=\"Projects\" icon=\"folder\" variant=\"ghost\"></button-ui>\n            <button-ui text=\"Settings\" icon=\"gear\" variant=\"ghost\"></button-ui>\n          </col-ui>\n        </section>\n      </drawer-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"right\">\n      <button-ui text=\"Right\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Edit profile\" side=\"right\">\n        <section>\n          <col-ui gap=\"3\">\n            <field-ui label=\"Name\">\n              <input-ui placeholder=\"Enter name\"></input-ui>\n            </field-ui>\n            <field-ui label=\"Email\">\n              <input-ui placeholder=\"you@example.com\"></input-ui>\n            </field-ui>\n          </col-ui>\n        </section>\n      </drawer-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"top\">\n      <button-ui text=\"Top\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Search\" side=\"top\">\n        <section>\n          <col-ui gap=\"2\">\n            <input-ui placeholder=\"Search anything…\" prefix=\"magnifying-glass\"></input-ui>\n            <text-ui color=\"subtle\" size=\"sm\">Top-aligned drawers work for global search and notification banners.</text-ui>\n          </col-ui>\n        </section>\n      </drawer-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"bottom\">\n      <button-ui text=\"Bottom\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Share\" side=\"bottom\">\n        <section>\n          <col-ui gap=\"2\">\n            <button-ui text=\"Copy link\" icon=\"link\" variant=\"outline\" stretch></button-ui>\n            <button-ui text=\"Email\" icon=\"envelope\" variant=\"outline\" stretch></button-ui>\n            <button-ui text=\"Slack\" icon=\"chat-circle\" variant=\"outline\" stretch></button-ui>\n          </col-ui>\n        </section>\n      </drawer-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/drawer/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/drawer-size.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"size\" data-chunk=\"drawer-size\">\n  <h2 variant=\"section\">size</h2>\n  <p data-note>Panel width (left/right) or height (top/bottom). <code>sm</code>=18rem, <code>md</code>=24rem (default), <code>lg</code>=36rem; each capped at <code>min(value, 90vw)</code> so the drawer never exceeds the viewport.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"sm\">\n      <button-ui text=\"Small\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Filters\" side=\"right\" size=\"sm\">\n        <section>\n          <col-ui gap=\"2\">\n            <field-ui label=\"In stock\" inline>\n              <check-ui checked></check-ui>\n            </field-ui>\n            <field-ui label=\"On sale\" inline>\n              <check-ui></check-ui>\n            </field-ui>\n            <field-ui label=\"Free shipping\" inline>\n              <check-ui></check-ui>\n            </field-ui>\n          </col-ui>\n        </section>\n      </drawer-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"md\">\n      <button-ui text=\"Medium\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Settings\" side=\"right\" size=\"md\">\n        <section>\n          <text-ui color=\"subtle\">Default size — fits most form drawers.</text-ui>\n        </section>\n      </drawer-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"lg\">\n      <button-ui text=\"Large\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Item details\" side=\"right\" size=\"lg\">\n        <section>\n          <text-ui color=\"subtle\">Large drawers fit data tables, side-by-side previews, or rich detail views.</text-ui>\n        </section>\n      </drawer-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/drawer/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/drawer-slack.json

@@ -11,5 +11,5 @@
   },
   "html": "<drawer-ui id=\"drawer-slack\" data-chunk=\"drawer-slack\" side=\"right\" size=\"md\">\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  </header>\n  <section>\n    <text-ui color=\"subtle\" size=\"sm\">Posts to #product-updates · connected by Alex Chen</text-ui>\n  </section>\n  <section>\n    <col-ui gap=\"4\">\n      <grid-ui columns=\"2\" gap=\"3\">\n        <card-ui size=\"sm\"\n          ><section><stat-ui label=\"Messages sent\" value=\"1,284\" change=\"+12 today\" trend=\"up\"></stat-ui></section\n        ></card-ui>\n        <card-ui size=\"sm\"\n          ><section><stat-ui label=\"Last event\" value=\"4m ago\" change=\"deploy.succeeded\"></stat-ui></section\n        ></card-ui>\n      </grid-ui>\n      <divider-ui></divider-ui>\n      <field-ui label=\"Workspace\">\n        <input-ui value=\"acme-corp.slack.com\" readonly></input-ui>\n      </field-ui>\n      <field-ui label=\"Default channel\" hint=\"Events without a routing rule go here.\">\n        <select-ui value=\"product-updates\">\n        <option value=\"general\">#general (842 members)</option>\n        <option value=\"product-updates\">#product-updates (128 members)</option>\n        <option value=\"alerts\">#alerts (34 members)</option>\n        <option value=\"dev\">#dev (56 members)</option>\n        <option value=\"deploys\">#deploys (12 members)</option>\n        <option value=\"releases\">#releases (89 members)</option>\n      </select-ui>\n      </field-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"3\">\n        <text-ui strong>Post to Slack when…</text-ui>\n        <field-ui label=\"Someone mentions @Acme\" inline>\n          <switch-ui checked></switch-ui>\n        </field-ui>\n        <field-ui label=\"A deployment succeeds\" inline>\n          <switch-ui checked></switch-ui>\n        </field-ui>\n        <field-ui label=\"A deployment fails\" inline>\n          <switch-ui checked></switch-ui>\n        </field-ui>\n        <field-ui label=\"An alert fires\" inline>\n          <switch-ui></switch-ui>\n        </field-ui>\n        <field-ui label=\"A new member joins the workspace\" inline>\n          <switch-ui checked></switch-ui>\n        </field-ui>\n        <field-ui label=\"API usage crosses a threshold\" inline>\n          <switch-ui></switch-ui>\n        </field-ui>\n      </col-ui>\n      <divider-ui></divider-ui>\n      <field-ui label=\"Bot display name\">\n        <input-ui value=\"Acme Bot\"></input-ui>\n      </field-ui>\n      <field-ui label=\"Bot user ID\">\n        <input-ui value=\"U06F2G4QR8T\" readonly></input-ui>\n      </field-ui>\n    </col-ui>\n  </section>\n  <footer slot=\"footer\">\n    <grid-ui>\n      <button-ui text=\"Send test post\" icon=\"paper-plane-tilt\" variant=\"ghost\"></button-ui>\n      <button-ui text=\"Disconnect\" icon=\"plug\" color=\"danger\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n      <button-ui text=\"Save changes\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n    </grid-ui>\n  </footer>\n</drawer-ui>",
   "source": "site/pages/examples/integrations/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/drawer-smtp.json

@@ -11,5 +11,5 @@
   },
   "html": "<drawer-ui id=\"drawer-smtp\" data-chunk=\"drawer-smtp\" side=\"right\" size=\"md\">\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\"></span>\n  </header>\n  <section>\n    <text-ui color=\"subtle\" size=\"sm\">Credentials expired April 12, 2026</text-ui>\n  </section>\n  <section>\n    <col-ui gap=\"4\">\n      <alert-ui\n        variant=\"warning\"\n        icon=\"warning\"\n        text=\"SendGrid API key rejected on April 12 at 02:14 UTC. Outbound email has been queued — 143 messages pending. Provide updated credentials to resume delivery.\"\n      ></alert-ui>\n      <divider-ui></divider-ui>\n      <field-ui label=\"Provider\">\n        <select-ui value=\"sendgrid\">\n        <option value=\"sendgrid\">SendGrid</option>\n        <option value=\"postmark\">Postmark</option>\n        <option value=\"ses\">Amazon SES</option>\n        <option value=\"custom\">Custom SMTP</option>\n      </select-ui>\n      </field-ui>\n      <field-ui label=\"SMTP host\">\n        <input-ui value=\"smtp.sendgrid.net\"></input-ui>\n      </field-ui>\n      <row-ui gap=\"2\">\n        <field-ui label=\"Port\">\n          <input-ui value=\"587\" grow></input-ui>\n        </field-ui>\n        <field-ui label=\"Encryption\">\n          <select-ui value=\"tls\" grow>\n          <option value=\"none\">None</option>\n          <option value=\"tls\">STARTTLS</option>\n          <option value=\"ssl\">SSL</option>\n        </select-ui>\n        </field-ui>\n      </row-ui>\n      <field-ui label=\"Username\">\n        <input-ui value=\"apikey\"></input-ui>\n      </field-ui>\n      <field-ui label=\"Password / API key\" hint=\"Paste the new SendGrid API key with at least 'Mail Send' scope.\">\n        <input-ui type=\"password\" placeholder=\"SG.••••••••\"></input-ui>\n      </field-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"3\">\n        <text-ui strong>Sender identity</text-ui>\n        <field-ui label=\"From address\">\n          <input-ui value=\"hello@acme.com\" type=\"email\"></input-ui>\n        </field-ui>\n        <field-ui label=\"From name\">\n          <input-ui value=\"Acme\"></input-ui>\n        </field-ui>\n        <field-ui label=\"Reply-to\">\n          <input-ui value=\"support@acme.com\" type=\"email\"></input-ui>\n        </field-ui>\n      </col-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"2\">\n        <text-ui strong>Domain authentication</text-ui>\n        <row-ui gap=\"2\" align=\"center\">\n          <icon-ui name=\"check-circle\" color=\"success\"></icon-ui>\n          <text-ui grow>SPF record</text-ui>\n          <badge-ui text=\"Verified\" variant=\"success\"></badge-ui>\n        </row-ui>\n        <row-ui gap=\"2\" align=\"center\">\n          <icon-ui name=\"check-circle\" color=\"success\"></icon-ui>\n          <text-ui grow>DKIM</text-ui>\n          <badge-ui text=\"Verified\" variant=\"success\"></badge-ui>\n        </row-ui>\n        <row-ui gap=\"2\" align=\"center\">\n          <icon-ui name=\"warning-circle\" color=\"warning\"></icon-ui>\n          <text-ui grow>DMARC</text-ui>\n          <badge-ui text=\"p=none\" variant=\"warning\"></badge-ui>\n        </row-ui>\n      </col-ui>\n    </col-ui>\n  </section>\n  <footer slot=\"footer\">\n    <grid-ui>\n      <button-ui text=\"Send test email\" icon=\"paper-plane-tilt\" variant=\"ghost\"></button-ui>\n      <button-ui text=\"Remove\" icon=\"trash\" color=\"danger\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n      <button-ui text=\"Reconnect\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n    </grid-ui>\n  </footer>\n</drawer-ui>",
   "source": "site/pages/examples/integrations/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/drawer-source.json

@@ -11,5 +11,5 @@
   },
   "html": "<drawer-ui id=\"drawer-source\" data-chunk=\"drawer-source\" side=\"right\" size=\"md\">\n  <header>\n    <span slot=\"icon\">\n      <avatar-ui icon=\"github-logo\"></avatar-ui>\n    </span>\n    <span slot=\"heading\">\n      <text-ui strong>Source</text-ui>\n      <badge-ui text=\"Connected\" variant=\"success\"></badge-ui>\n    </span>\n    <span slot=\"action\"></span>\n  </header>\n  <section>\n    <text-ui color=\"subtle\" size=\"sm\">Authorized as kim@acme.com · 23 repos visible</text-ui>\n  </section>\n  <section>\n    <col-ui gap=\"4\">\n      <field-ui label=\"Provider\">\n        <select-ui value=\"github\">\n          <option value=\"github\">GitHub</option>\n          <option value=\"gitlab\">GitLab</option>\n          <option value=\"bitbucket\">Bitbucket</option>\n        </select-ui>\n      </field-ui>\n      <field-ui label=\"Authorized account\">\n        <input-ui value=\"kim@acme.com\" readonly></input-ui>\n      </field-ui>\n      <field-ui label=\"Repository scope\" hint=\"Limit which repos AdiaUI can read.\">\n        <select-ui value=\"selected\">\n          <option value=\"all\">All repositories (23)</option>\n          <option value=\"selected\">Selected repositories (23 of 23)</option>\n          <option value=\"public\">Public only</option>\n        </select-ui>\n      </field-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"3\">\n        <text-ui strong>Sync settings</text-ui>\n        <field-ui label=\"Pull request events\" inline>\n          <switch-ui checked></switch-ui>\n        </field-ui>\n        <field-ui label=\"Deployment events\" inline>\n          <switch-ui checked></switch-ui>\n        </field-ui>\n        <field-ui label=\"Issue events\" inline>\n          <switch-ui></switch-ui>\n        </field-ui>\n      </col-ui>\n    </col-ui>\n  </section>\n  <footer slot=\"footer\">\n    <grid-ui>\n      <button-ui text=\"Reauthorize\" icon=\"arrow-clockwise\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n      <button-ui text=\"Disconnect\" icon=\"plug\" color=\"danger\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n      <button-ui text=\"Save changes\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n    </grid-ui>\n  </footer>\n</drawer-ui>",
   "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/drawer-text.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"text\" data-chunk=\"drawer-text\">\n  <h2 variant=\"section\">text</h2>\n  <p data-note>Shorthand for an automatic heading. The drawer stamps a <code>&lt;span slot=\"heading\" data-stamped&gt;</code> with the text when no author-supplied heading is present. Authoring a heading directly always wins.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"text shorthand\">\n      <button-ui text=\"text=&quot;Settings&quot;\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Settings\" side=\"right\">\n        <section><text-ui color=\"subtle\">No header authored — the drawer stamps the title from the text attribute.</text-ui></section>\n      </drawer-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"authored heading wins\">\n      <button-ui text=\"authored heading\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Ignored\" side=\"right\">\n        <header>\n          <span slot=\"heading\">\n            <text-ui strong>Authored title</text-ui>\n            <badge-ui text=\"Live\" variant=\"success\"></badge-ui>\n          </span>\n        </header>\n        <section><text-ui color=\"subtle\">Author-supplied <code>&lt;span slot=\"heading\"&gt;</code> wins over the <code>text</code> attribute.</text-ui></section>\n      </drawer-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/drawer/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/drawer-transaction.json

@@ -11,5 +11,5 @@
   },
   "html": "<drawer-ui id=\"drawer-transaction\" data-chunk=\"drawer-transaction\" side=\"right\" size=\"md\">\n  <header>\n    <span slot=\"icon\">\n      <avatar-ui icon=\"receipt\"></avatar-ui>\n    </span>\n    <span slot=\"heading\">\n      <text-ui strong data-tx-customer>Transaction</text-ui>\n      <badge-ui data-tx-status text=\"Completed\" variant=\"success\"></badge-ui>\n    </span>\n    <span slot=\"action\"></span>\n  </header>\n  <section>\n    <text-ui color=\"subtle\" size=\"sm\" data-tx-meta>Details for the selected transaction.</text-ui>\n  </section>\n  <section>\n    <col-ui gap=\"4\">\n      <grid-ui columns=\"2\" gap=\"3\">\n        <card-ui size=\"sm\"\n          ><section><stat-ui label=\"Amount\" data-tx-amount value=\"—\"></stat-ui></section\n        ></card-ui>\n        <card-ui size=\"sm\"\n          ><section><stat-ui label=\"Date\" data-tx-date value=\"—\"></stat-ui></section\n        ></card-ui>\n      </grid-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"3\">\n        <text-ui strong>Customer</text-ui>\n        <field-ui label=\"Name\">\n          <input-ui data-tx-name readonly></input-ui>\n        </field-ui>\n        <field-ui label=\"Email\">\n          <input-ui data-tx-email readonly></input-ui>\n        </field-ui>\n        <field-ui label=\"Customer ID\">\n          <input-ui value=\"cus_8420F5K9Q1PL\" readonly></input-ui>\n        </field-ui>\n      </col-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"3\">\n        <text-ui strong>Payment</text-ui>\n        <field-ui label=\"Method\">\n          <input-ui value=\"Visa ending in 4242\" readonly></input-ui>\n        </field-ui>\n        <field-ui label=\"Authorization\">\n          <input-ui value=\"auth_K8N3P2Q7R\" readonly></input-ui>\n        </field-ui>\n        <field-ui label=\"Receipt URL\">\n          <input-ui value=\"https://pay.acme.com/r/tx_H7K2\" readonly suffix=\"arrow-square-out\"></input-ui>\n        </field-ui>\n      </col-ui>\n      <divider-ui></divider-ui>\n      <col-ui gap=\"2\">\n        <text-ui strong>Timeline</text-ui>\n        <row-ui gap=\"2\" align=\"center\"\n          ><icon-ui name=\"check-circle\" color=\"success\"></icon-ui\n          ><col-ui gap=\"0\" grow><text-ui>Payment captured</text-ui><text-ui color=\"subtle\" size=\"sm\">Today · 14:22 UTC</text-ui></col-ui></row-ui\n        >\n        <row-ui gap=\"2\" align=\"center\"\n          ><icon-ui name=\"check-circle\" color=\"success\"></icon-ui\n          ><col-ui gap=\"0\" grow><text-ui>Risk review passed</text-ui><text-ui color=\"subtle\" size=\"sm\">Today · 14:22 UTC</text-ui></col-ui></row-ui\n        >\n        <row-ui gap=\"2\" align=\"center\"\n          ><icon-ui name=\"check-circle\" color=\"success\"></icon-ui\n          ><col-ui gap=\"0\" grow><text-ui>Card authorized</text-ui><text-ui color=\"subtle\" size=\"sm\">Today · 14:21 UTC</text-ui></col-ui></row-ui\n        >\n      </col-ui>\n    </col-ui>\n  </section>\n  <footer slot=\"footer\">\n    <grid-ui>\n      <button-ui text=\"Refund\" icon=\"arrow-u-left-up\" color=\"danger\"></button-ui>\n      <button-ui text=\"Close\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open = false\"></button-ui>\n      <button-ui text=\"View receipt\" icon=\"arrow-square-out\" variant=\"primary\"></button-ui>\n    </grid-ui>\n  </footer>\n</drawer-ui>",
   "source": "site/pages/examples/admin-dashboard/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/embed-aspect.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"aspect\" data-chunk=\"embed-aspect\">\n  <h2 variant=\"section\">aspect</h2>\n  <p data-note>CSS aspect-ratio for responsive sizing.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"16:9\">\n      <embed-ui src=\"https://example.com\" aspect=\"16/9\"></embed-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"square (1:1)\">\n      <embed-ui src=\"https://example.com\" aspect=\"1/1\" width=\"300\"></embed-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/embed/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/embed-default.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"default\" data-chunk=\"embed-default\">\n  <h2 variant=\"section\">Default</h2>\n  <p data-note>Basic embed with default height of 400px and 100% width.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"default\">\n      <embed-ui src=\"https://example.com\"></embed-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/embed/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/embed-height.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"height\" data-chunk=\"embed-height\">\n  <h2 variant=\"section\">height</h2>\n  <p data-note>Custom fixed height.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"height=250\">\n      <embed-ui src=\"https://example.com\" height=\"250\"></embed-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"height=500\">\n      <embed-ui src=\"https://example.com\" height=\"500\"></embed-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/embed/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/embed-src.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"src\" data-chunk=\"embed-src\">\n  <h2 variant=\"section\">src</h2>\n  <p data-note>URL of the embedded resource (iframe/video/image).</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"example.com\"><embed-ui src=\"https://example.com\" style=\"width:240px;height:160px;\"></embed-ui></div>\n    <div data-artifact-item data-artifact-label=\"about:blank\"><embed-ui src=\"about:blank\" style=\"width:240px;height:160px;\"></embed-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/embed/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/embed-width.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"width\" data-chunk=\"embed-width\">\n  <h2 variant=\"section\">width</h2>\n  <p data-note>Explicit width of the embedded frame.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"200\"><embed-ui src=\"about:blank\" width=\"200\" style=\"height:120px;\"></embed-ui></div>\n    <div data-artifact-item data-artifact-label=\"320\"><embed-ui src=\"about:blank\" width=\"320\" style=\"height:120px;\"></embed-ui></div>\n    <div data-artifact-item data-artifact-label=\"480\"><embed-ui src=\"about:blank\" width=\"480\" style=\"height:120px;\"></embed-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/embed/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/empty-state-action.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"action\" data-chunk=\"empty-state-action\">\n  <h2 variant=\"section\">With Action</h2>\n  <p data-note>Action slot for a call-to-action button.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"with action\">\n      <empty-state-ui icon=\"plus-circle\" heading=\"No projects\" description=\"Create your first project to get started.\">\n        <button-ui slot=\"action\" text=\"Create Project\" variant=\"primary\"></button-ui>\n      </empty-state-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/empty-state/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/empty-state-basic.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"basic\" data-chunk=\"empty-state-basic\">\n  <h2 variant=\"section\">Basic</h2>\n  <p data-note>Heading and description only.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"basic\">\n      <empty-state-ui heading=\"No items\" description=\"There are no items to display yet.\"></empty-state-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/empty-state/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/empty-state-description.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"description\" data-chunk=\"empty-state-description\">\n  <h2 variant=\"section\">description</h2>\n  <p data-note>Supporting text rendered below the heading.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"short\"><empty-state-ui heading=\"No items\" description=\"Get started by creating your first item.\" icon=\"plus\"></empty-state-ui></div>\n    <div data-artifact-item data-artifact-label=\"longer\"><empty-state-ui heading=\"All clear\" description=\"You have no pending notifications. We'll let you know as soon as something new arrives.\" icon=\"check\"></empty-state-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/empty-state/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/empty-state-error.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"error\" data-chunk=\"empty-state-error\">\n  <h2 variant=\"section\">Error State</h2>\n  <p data-note>Error with a retry action.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"error + retry\">\n      <empty-state-ui icon=\"warning-circle\" heading=\"Something went wrong\" description=\"We couldn't load your data. Please try again.\">\n        <button-ui slot=\"action\" text=\"Retry\" variant=\"outline\" icon=\"arrow-clockwise\"></button-ui>\n      </empty-state-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/empty-state/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/empty-state-heading.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"heading\" data-chunk=\"empty-state-heading\">\n  <h2 variant=\"section\">heading</h2>\n  <p data-note>Primary heading text for the empty state.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"No results\"><empty-state-ui heading=\"No results\" icon=\"magnifying-glass\"></empty-state-ui></div>\n    <div data-artifact-item data-artifact-label=\"Inbox zero\"><empty-state-ui heading=\"Inbox zero\" icon=\"inbox\"></empty-state-ui></div>\n    <div data-artifact-item data-artifact-label=\"Nothing here yet\"><empty-state-ui heading=\"Nothing here yet\" icon=\"folder\"></empty-state-ui></div>\n  </div>\n</section>",
   "source": "site/pages/components/empty-state/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/empty-state-icon.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"icon\" data-chunk=\"empty-state-icon\">\n  <h2 variant=\"section\">With Icon</h2>\n  <p data-note>Leading icon for visual context.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"search empty\">\n      <empty-state-ui icon=\"magnifying-glass\" heading=\"No results\" description=\"Try adjusting your search or filter criteria.\"></empty-state-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"files empty\">\n      <empty-state-ui icon=\"folder-open\" heading=\"No files\" description=\"Upload a file to get started.\"></empty-state-ui>\n      </div>\n  </div>\n</section>",
   "source": "site/pages/components/empty-state/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/error-404-actions.json

@@ -11,5 +11,5 @@
   },
   "html": "<col-ui gap=\"2\" data-chunk=\"error-404-actions\" size=\"lg\">\n              <button-ui text=\"Go to home\" variant=\"primary\" icon=\"house\" onclick=\"location.href='/'\"></button-ui>\n              <button-ui text=\"Search docs\" variant=\"outline\" icon=\"magnifying-glass\" onclick=\"location.href='/site/'\"></button-ui>\n            </col-ui>",
   "source": "site/pages/examples/errors/404/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/error-404.json

@@ -14,5 +14,5 @@
   },
   "html": "<card-ui raw data-chunk=\"error-404\" style=\"max-width: 32rem\">\n        <header data-chunk=\"auth-card-header\">\n          <col-ui align=\"center\" gap=\"1\">\n            <a href=\"/\" aria-label=\"AdiaUI home\">\n              <img src=\"/icons/agent-ui-light.svg\" alt=\"Adia Logo\" style=\"height: 5rem\" />\n            </a>\n            <h1>404 — Page not found</h1>\n            <text-ui>We couldn't find that page. It may have moved, been renamed, or never existed.</text-ui>\n          </col-ui>\n        </header>\n\n        <section data-chunk=\"auth-card-content\">\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"info\" icon=\"map-trifold\">\n              <span slot=\"content\">Path: <code>/that/route/that/wasnt/found</code></span>\n            </alert-ui>\n\n            <col-ui gap=\"2\" data-chunk=\"error-404-actions\" size=\"lg\">\n              <button-ui text=\"Go to home\" variant=\"primary\" icon=\"house\" onclick=\"location.href='/'\"></button-ui>\n              <button-ui text=\"Search docs\" variant=\"outline\" icon=\"magnifying-glass\" onclick=\"location.href='/site/'\"></button-ui>\n            </col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\">\n              Trace ID: <code>req_18d2f7c4</code>\n            </text-ui>\n          </col-ui>\n        </section>\n      </card-ui>",
   "source": "site/pages/examples/errors/404/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/error-500-actions.json

@@ -11,5 +11,5 @@
   },
   "html": "<col-ui gap=\"2\" data-chunk=\"error-500-actions\" size=\"lg\">\n              <button-ui text=\"Try again\" variant=\"primary\" icon=\"arrows-clockwise\" onclick=\"location.reload()\"></button-ui>\n              <button-ui text=\"View status page\" variant=\"outline\" icon=\"pulse\" onclick=\"window.open('https://status.adia-ui.app', '_blank')\"></button-ui>\n              <button-ui text=\"Contact support\" variant=\"outline\" icon=\"lifebuoy\" onclick=\"location.href='/site/examples/help'\"></button-ui>\n            </col-ui>",
   "source": "site/pages/examples/errors/500/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/error-500.json

@@ -14,5 +14,5 @@
   },
   "html": "<card-ui raw data-chunk=\"error-500\" style=\"max-width: 32rem\">\n        <header data-chunk=\"auth-card-header\">\n          <col-ui align=\"center\" gap=\"1\">\n            <a href=\"/\" aria-label=\"AdiaUI home\">\n              <img src=\"/icons/agent-ui-light.svg\" alt=\"Adia Logo\" style=\"height: 5rem\" />\n            </a>\n            <h1>500 — Something went wrong</h1>\n            <text-ui>Our servers couldn't process your request. The error has been logged automatically; we're already looking into it.</text-ui>\n          </col-ui>\n        </header>\n\n        <section data-chunk=\"auth-card-content\">\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"warning\" icon=\"warning\">\n              <span slot=\"content\">Error reference: <code>err_a8f2d910</code> · Reported 12:42 UTC. Include this ID when contacting support.</span>\n            </alert-ui>\n\n            <col-ui gap=\"2\" data-chunk=\"error-500-actions\" size=\"lg\">\n              <button-ui text=\"Try again\" variant=\"primary\" icon=\"arrows-clockwise\" onclick=\"location.reload()\"></button-ui>\n              <button-ui text=\"View status page\" variant=\"outline\" icon=\"pulse\" onclick=\"window.open('https://status.adia-ui.app', '_blank')\"></button-ui>\n              <button-ui text=\"Contact support\" variant=\"outline\" icon=\"lifebuoy\" onclick=\"location.href='/site/examples/help'\"></button-ui>\n            </col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\">\n              <a href=\"/\">← Back to homepage</a>\n            </text-ui>\n          </col-ui>\n        </section>\n      </card-ui>",
   "source": "site/pages/examples/errors/500/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/error-maintenance-actions.json

@@ -11,5 +11,5 @@
   },
   "html": "<col-ui gap=\"2\" data-chunk=\"error-maintenance-actions\" size=\"lg\">\n              <button-ui text=\"View live status\" variant=\"primary\" icon=\"pulse\" onclick=\"window.open('https://status.adia-ui.app', '_blank')\"></button-ui>\n              <button-ui text=\"Subscribe to updates\" variant=\"outline\" icon=\"bell\"></button-ui>\n            </col-ui>",
   "source": "site/pages/examples/errors/maintenance/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/error-maintenance.json

@@ -14,5 +14,5 @@
   },
   "html": "<card-ui raw data-chunk=\"error-maintenance\" style=\"max-width: 32rem\">\n        <header data-chunk=\"auth-card-header\">\n          <col-ui align=\"center\" gap=\"1\">\n            <a href=\"/\" aria-label=\"AdiaUI home\">\n              <img src=\"/icons/agent-ui-light.svg\" alt=\"Adia Logo\" style=\"height: 5rem\" />\n            </a>\n            <h1>We'll be right back</h1>\n            <text-ui>AdiaUI is undergoing scheduled maintenance to roll out a database upgrade. Estimated time to recover: <strong>12:30 UTC</strong> — about 25 minutes from now.</text-ui>\n          </col-ui>\n        </header>\n\n        <section data-chunk=\"auth-card-content\">\n          <col-ui gap=\"6\">\n            <alert-ui variant=\"info\" icon=\"wrench\">\n              <span slot=\"content\">Window: <strong>12:00 – 12:30 UTC</strong> · Affected: web app, API, webhooks. Status pages remain online during the window.</span>\n            </alert-ui>\n\n            <col-ui gap=\"2\" data-chunk=\"error-maintenance-actions\" size=\"lg\">\n              <button-ui text=\"View live status\" variant=\"primary\" icon=\"pulse\" onclick=\"window.open('https://status.adia-ui.app', '_blank')\"></button-ui>\n              <button-ui text=\"Subscribe to updates\" variant=\"outline\" icon=\"bell\"></button-ui>\n            </col-ui>\n\n            <text-ui text-align=\"center\" color=\"subtle\" size=\"sm\">\n              Started 12:05 UTC\n            </text-ui>\n          </col-ui>\n        </section>\n      </card-ui>",
   "source": "site/pages/examples/errors/maintenance/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/field-controls.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"controls\" data-chunk=\"field-controls\">\n  <h2 variant=\"section\">Any form control</h2>\n  <p data-note>Field wraps the control of your choice — select, textarea, switch, check, radio, slider. The control's own <code>label</code> attr is no longer required.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Select\">\n      <field-ui label=\"Priority\">\n        <select-ui>\n          <option value=\"low\">Low</option>\n          <option value=\"med\" selected>Medium</option>\n          <option value=\"high\">High</option>\n        </select-ui>\n      </field-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"Textarea\">\n      <field-ui label=\"Notes\">\n        <textarea-ui rows=\"3\" placeholder=\"Anything we should know?\"></textarea-ui>\n      </field-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"Switch (inline)\">\n      <field-ui inline label=\"Email notifications\">\n        <switch-ui checked></switch-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/field/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/field-default.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"default\" data-chunk=\"field-default\">\n  <h2 variant=\"section\">Default layout</h2>\n  <p data-note>Label stacked above the control. Trailing aligns with the label (right); action aligns with the control (right).</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Just label + control\">\n      <field-ui label=\"Email\">\n        <input-ui type=\"email\" placeholder=\"you@example.com\"></input-ui>\n      </field-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"+ trailing hint\">\n      <field-ui label=\"Email\">\n        <input-ui type=\"email\" placeholder=\"you@example.com\"></input-ui>\n        <span slot=\"trailing\">Required</span>\n      </field-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"+ trailing + action\">\n      <field-ui label=\"API key\">\n        <input-ui type=\"text\" value=\"sk-abcd-1234-efgh\"></input-ui>\n        <span slot=\"trailing\">Keep secret</span>\n        <button-ui slot=\"action\" icon=\"copy\" variant=\"ghost\" aria-label=\"Copy\"></button-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/field/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/field-error.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"error\" data-chunk=\"field-error\">\n  <h2 variant=\"section\">Error</h2>\n  <p data-note>Validation message — takes precedence over <code>hint</code>, rendered in danger style with <code>role=\"alert\"</code> so assistive tech announces state changes.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Error only\">\n      <field-ui label=\"Email\" error=\"Enter a valid email address.\">\n        <input-ui type=\"email\" value=\"not-an-email\"></input-ui>\n      </field-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"Error overrides hint\">\n      <field-ui label=\"Password\" required hint=\"8+ chars recommended\" error=\"Password must be at least 8 characters.\">\n        <input-ui type=\"password\" value=\"abc\"></input-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/field/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/field-hint.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"hint\" data-chunk=\"field-hint\">\n  <h2 variant=\"section\">Hint</h2>\n  <p data-note>Help text below the control in caption style. Wired into the slotted control's <code>aria-describedby</code> so screen readers announce it.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Inline hint\">\n      <field-ui label=\"Email\" hint=\"We'll never share your email with third parties.\">\n        <input-ui type=\"email\" placeholder=\"you@example.com\"></input-ui>\n      </field-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"With required marker + hint\">\n      <field-ui label=\"Password\" required hint=\"8 or more characters. Mix of letters, numbers, and symbols.\">\n        <input-ui type=\"password\"></input-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/field/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/field-inline.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"inline\" data-chunk=\"field-inline\">\n  <h2 variant=\"section\">Inline layout</h2>\n  <p data-note>Set <code>inline</code> to collapse to a single row. Useful for short-value fields, preferences lists, and settings rows.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Label + input\">\n      <field-ui inline label=\"Search\">\n        <input-ui type=\"search\" placeholder=\"Type a command…\"></input-ui>\n      </field-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"+ trailing kbd\">\n      <field-ui inline label=\"Search\">\n        <input-ui type=\"search\" placeholder=\"Type a command…\"></input-ui>\n        <kbd-ui slot=\"trailing\">⌘K</kbd-ui>\n      </field-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"+ trailing + action\">\n      <field-ui inline label=\"Filter\">\n        <input-ui placeholder=\"Name or tag\"></input-ui>\n        <span slot=\"trailing\">Results: 12</span>\n        <button-ui slot=\"action\" icon=\"x\" variant=\"ghost\" aria-label=\"Clear\"></button-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/field/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/field-no-label.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"no-label\" data-chunk=\"field-no-label\">\n  <h2 variant=\"section\">No label</h2>\n  <p data-note>Omit <code>label</code> to use <code>field-ui</code> purely as a layout wrapper for a control plus optional trailing/action regions.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Search + action\">\n      <field-ui>\n        <input-ui type=\"search\" placeholder=\"Search…\"></input-ui>\n        <button-ui slot=\"action\" icon=\"magnifying-glass\" variant=\"primary\" aria-label=\"Search\"></button-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/field/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/field-required.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"required\" data-chunk=\"field-required\">\n  <h2 variant=\"section\">Required marker</h2>\n  <p data-note>Set <code>required</code> on the field to render a red <code>*</code> after the label. The attribute is visual-only — the slotted control's own <code>required</code> attribute drives actual form validation.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"Stacked\">\n      <field-ui label=\"Full name\" required>\n        <input-ui type=\"text\"></input-ui>\n      </field-ui>\n    </div>\n    <div data-artifact-item data-artifact-label=\"Inline\">\n      <field-ui inline label=\"Email\" required>\n        <input-ui type=\"email\"></input-ui>\n      </field-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/components/field/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/filter-bar-active-filters.json

@@ -9,7 +9,7 @@
     "data-section": "",
     "data-property": "active-filters"
   },
-  "html": "<section data-section data-property=\"active-filters\" data-chunk=\"filter-bar-active-filters\">\n  <h2 variant=\"section\">Active filters + Add filter</h2>\n  <p data-note>Chips show each active filter. The trailing button opens a popover of available facets.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"active filters\">\n      <card-ui>\n        <section>\n          <row-ui gap=\"2\" align=\"center\" wrap>\n            <text-ui color=\"subtle\" weight=\"semibold\">Filters:</text-ui>\n            <tag-ui text=\"Status: Active\" removable></tag-ui>\n            <tag-ui text=\"Owner: Alex Chen\" removable></tag-ui>\n            <tag-ui text=\"Updated: last 7 days\" removable></tag-ui>\n            <button-ui text=\"+ Add filter\" variant=\"ghost\" size=\"sm\" popovertarget=\"pat-filter-menu\"></button-ui>\n            <span data-spacer></span>\n            <button-ui text=\"Clear all\" variant=\"ghost\" size=\"sm\"></button-ui>\n          </row-ui>\n          <popover-ui id=\"pat-filter-menu\" anchor=\"previous\">\n            <action-list-ui>\n              <action-item-ui icon=\"flag\" text=\"Status\" value=\"status\"></action-item-ui>\n              <action-item-ui icon=\"user\" text=\"Owner\" value=\"owner\"></action-item-ui>\n              <action-item-ui icon=\"tag\" text=\"Label\" value=\"label\"></action-item-ui>\n              <action-item-ui icon=\"calendar\" text=\"Date range\" value=\"date\"></action-item-ui>\n              <action-item-ui icon=\"folder\" text=\"Project\" value=\"project\"></action-item-ui>\n            </action-list-ui>\n          </popover-ui>\n        </section>\n      </card-ui>\n    </div>\n  </div>\n</section>",
+  "html": "<section data-section data-property=\"active-filters\" data-chunk=\"filter-bar-active-filters\">\n  <h2 variant=\"section\">Active filters + Add filter</h2>\n  <p data-note>Chips show each active filter. The trailing button opens a popover of available facets.</p>\n  <card-ui>\n    <section>\n      <row-ui gap=\"2\" align=\"center\" wrap>\n        <text-ui color=\"subtle\" weight=\"semibold\">Filters:</text-ui>\n        <tag-ui text=\"Status: Active\" removable></tag-ui>\n        <tag-ui text=\"Owner: Alex Chen\" removable></tag-ui>\n        <tag-ui text=\"Updated: last 7 days\" removable></tag-ui>\n        <button-ui text=\"+ Add filter\" variant=\"ghost\" size=\"sm\" popovertarget=\"pat-filter-menu\"></button-ui>\n        <span data-spacer></span>\n        <button-ui text=\"Clear all\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </row-ui>\n      <popover-ui id=\"pat-filter-menu\" anchor=\"previous\">\n        <action-list-ui>\n          <action-item-ui icon=\"flag\" text=\"Status\" value=\"status\"></action-item-ui>\n          <action-item-ui icon=\"user\" text=\"Owner\" value=\"owner\"></action-item-ui>\n          <action-item-ui icon=\"tag\" text=\"Label\" value=\"label\"></action-item-ui>\n          <action-item-ui icon=\"calendar\" text=\"Date range\" value=\"date\"></action-item-ui>\n          <action-item-ui icon=\"folder\" text=\"Project\" value=\"project\"></action-item-ui>\n        </action-list-ui>\n      </popover-ui>\n    </section>\n  </card-ui>\n</section>",
   "source": "site/pages/patterns/filter-bar/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/filter-bar-filter-bar-with-table.json

@@ -9,7 +9,7 @@
     "data-section": "",
     "data-property": "filter-bar-with-table"
   },
-  "html": "<section data-section data-property=\"filter-bar-with-table\" data-chunk=\"filter-bar-filter-bar-with-table\">\n  <h2 variant=\"section\">Filter bar + table</h2>\n  <p data-note>The common composition: filters sit above the table inside one card surface so they read as modifying the same data.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"filter bar with table\">\n      <card-ui>\n        <section bleed>\n          <toolbar-ui>\n            <row-ui gap=\"2\" align=\"center\" grow>\n              <tag-ui text=\"Status: Active\" removable></tag-ui>\n              <tag-ui text=\"Owner: Alex\" removable></tag-ui>\n              <button-ui text=\"+ Add filter\" variant=\"ghost\" size=\"sm\"></button-ui>\n            </row-ui>\n            <search-ui placeholder=\"Search…\" size=\"sm\"></search-ui>\n          </toolbar-ui>\n          <table-ui id=\"pat-filter-table\" sortable striped></table-ui>\n        </section>\n      </card-ui>\n    </div>\n  </div>\n</section>",
+  "html": "<section data-section data-property=\"filter-bar-with-table\" data-chunk=\"filter-bar-filter-bar-with-table\">\n  <h2 variant=\"section\">Filter bar + table</h2>\n  <p data-note>The common composition: filters sit above the table inside one card surface so they read as modifying the same data.</p>\n  <card-ui>\n    <section bleed>\n      <toolbar-ui overflow=\"none\" style=\"padding: var(--a-space-2) var(--a-space-3); border-block-end: 1px solid var(--a-border-subtle); border-radius: 0;\">\n        <row-ui gap=\"2\" align=\"center\" grow>\n          <tag-ui text=\"Status: Active\" removable></tag-ui>\n          <tag-ui text=\"Owner: Alex\" removable></tag-ui>\n          <button-ui text=\"+ Add filter\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </row-ui>\n        <search-ui placeholder=\"Search…\" size=\"sm\"></search-ui>\n      </toolbar-ui>\n      <table-ui id=\"pat-filter-table\" sortable striped raw></table-ui>\n    </section>\n  </card-ui>\n</section>",
   "source": "site/pages/patterns/filter-bar/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/filter-bar-saved-views.json

@@ -9,7 +9,7 @@
     "data-section": "",
     "data-property": "saved-views"
   },
-  "html": "<section data-section data-property=\"saved-views\" data-chunk=\"filter-bar-saved-views\">\n  <h2 variant=\"section\">Saved views</h2>\n  <p data-note>Named combinations of filters. Segmented control replaces the active-filter chips while a view is applied.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"saved views\">\n      <card-ui>\n        <section>\n          <row-ui align=\"center\" gap=\"3\" wrap>\n            <segmented-ui value=\"my-open\">\n              <segment-ui value=\"all\" text=\"All\"></segment-ui>\n              <segment-ui value=\"my-open\" text=\"My open\"></segment-ui>\n              <segment-ui value=\"team\" text=\"Team\"></segment-ui>\n              <segment-ui value=\"archived\" text=\"Archived\"></segment-ui>\n            </segmented-ui>\n            <span data-spacer></span>\n            <button-ui text=\"Save view\" icon=\"bookmark\" variant=\"ghost\" size=\"sm\"></button-ui>\n          </row-ui>\n        </section>\n      </card-ui>\n    </div>\n  </div>\n</section>",
+  "html": "<section data-section data-property=\"saved-views\" data-chunk=\"filter-bar-saved-views\">\n  <h2 variant=\"section\">Saved views</h2>\n  <p data-note>Named combinations of filters. Segmented control replaces the active-filter chips while a view is applied.</p>\n  <card-ui>\n    <section>\n      <row-ui align=\"center\" gap=\"3\" wrap>\n        <segmented-ui value=\"my-open\">\n          <segment-ui value=\"all\" text=\"All\"></segment-ui>\n          <segment-ui value=\"my-open\" text=\"My open\"></segment-ui>\n          <segment-ui value=\"team\" text=\"Team\"></segment-ui>\n          <segment-ui value=\"archived\" text=\"Archived\"></segment-ui>\n        </segmented-ui>\n        <span data-spacer></span>\n        <button-ui text=\"Save view\" icon=\"bookmark\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </row-ui>\n    </section>\n  </card-ui>\n</section>",
   "source": "site/pages/patterns/filter-bar/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/form-drawer-edit-form.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"edit-form\" data-chunk=\"form-drawer-edit-form\">\n  <h2 variant=\"section\">Edit form with destructive action</h2>\n  <p data-note>Edit drawers pair a primary action with a destructive one in the footer. Delete sits on the left, Save on the right — separated by the spacer.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"edit form\">\n      <button-ui text=\"Edit project\" icon=\"pencil\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Edit project\" side=\"right\" size=\"md\">\n        <section slot=\"body\">\n          <col-ui gap=\"3\">\n            <field-ui label=\"Name\">\n              <input-ui value=\"Q4 roadmap\"></input-ui>\n            </field-ui>\n            <field-ui label=\"Description\">\n              <textarea-ui rows=\"3\">Quarterly planning doc</textarea-ui>\n            </field-ui>\n            <field-ui label=\"Status\">\n              <select-ui>\n              <option value=\"active\" selected>Active</option>\n              <option value=\"archived\">Archived</option>\n            </select-ui>\n            </field-ui>\n            <field-ui label=\"Notify team members\" inline>\n              <switch-ui checked></switch-ui>\n            </field-ui>\n          </col-ui>\n        </section>\n        <footer slot=\"footer\">\n          <span slot=\"action-leading\">\n            <button-ui text=\"Delete\" icon=\"trash\" color=\"danger\"></button-ui>\n          </span>\n          <span slot=\"action\">\n            <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n            <button-ui text=\"Save changes\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n          </span>\n        </footer>\n      </drawer-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/patterns/form-drawer/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/form-drawer-simple-form.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"simple-form\" data-chunk=\"form-drawer-simple-form\">\n  <h2 variant=\"section\">Simple create form</h2>\n  <p data-note>3–5 fields with primary + cancel actions. The default shape for \"+ New X\" triggers.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"create form\">\n      <button-ui text=\"+ New project\" variant=\"primary\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"New project\" side=\"right\" size=\"md\">\n        <section slot=\"body\">\n          <col-ui gap=\"3\">\n            <field-ui label=\"Name\">\n              <input-ui placeholder=\"My awesome project\" required></input-ui>\n            </field-ui>\n            <field-ui label=\"Description\">\n              <textarea-ui placeholder=\"What is this project for?\" rows=\"3\"></textarea-ui>\n            </field-ui>\n            <field-ui label=\"Visibility\">\n              <select-ui placeholder=\"Select visibility\">\n              <option value=\"public\">Public</option>\n              <option value=\"team\">Team only</option>\n              <option value=\"private\">Private</option>\n            </select-ui>\n            </field-ui>\n          </col-ui>\n        </section>\n        <footer slot=\"footer\">\n          <span slot=\"action\">\n            <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n            <button-ui text=\"Create\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n          </span>\n        </footer>\n      </drawer-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/patterns/form-drawer/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/form-drawer-tall-form.json

@@ -11,5 +11,5 @@
   },
   "html": "<section data-section data-property=\"tall-form\" data-chunk=\"form-drawer-tall-form\">\n  <h2 variant=\"section\">Long form — scroll body, sticky footer</h2>\n  <p data-note>The footer stays visible even when the form body overflows. This is why the sticky-footer pattern matters — users shouldn't have to scroll to find \"Save\".</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"long form\">\n      <button-ui text=\"Advanced settings\" icon=\"gear\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <drawer-ui text=\"Advanced settings\" side=\"right\" size=\"lg\">\n        <section slot=\"body\">\n          <col-ui gap=\"4\">\n            <col-ui gap=\"3\">\n              <h4>General</h4>\n              <field-ui label=\"Name\">\n                <input-ui value=\"Production API\"></input-ui>\n              </field-ui>\n              <field-ui label=\"Slug\">\n                <input-ui prefix=\"/\" value=\"production-api\"></input-ui>\n              </field-ui>\n              <field-ui label=\"Description\">\n                <textarea-ui rows=\"2\"></textarea-ui>\n              </field-ui>\n            </col-ui>\n            <col-ui gap=\"3\">\n              <h4>Limits</h4>\n              <range-ui label=\"Max concurrent requests\" value=\"100\" min=\"10\" max=\"1000\"></range-ui>\n              <range-ui label=\"Timeout (seconds)\" value=\"30\" min=\"5\" max=\"300\"></range-ui>\n              <range-ui label=\"Retry attempts\" value=\"3\" min=\"0\" max=\"10\"></range-ui>\n            </col-ui>\n            <col-ui gap=\"3\">\n              <h4>Access</h4>\n              <field-ui label=\"Require authentication\" inline>\n                <switch-ui checked></switch-ui>\n              </field-ui>\n              <field-ui label=\"Allow CORS\" inline>\n                <switch-ui checked></switch-ui>\n              </field-ui>\n              <field-ui label=\"Rate limit by IP\" inline>\n                <switch-ui></switch-ui>\n              </field-ui>\n              <field-ui label=\"Log all requests\" inline>\n                <switch-ui></switch-ui>\n              </field-ui>\n            </col-ui>\n            <col-ui gap=\"3\">\n              <h4>Notifications</h4>\n              <field-ui label=\"Email on errors\" inline>\n                <check-ui checked></check-ui>\n              </field-ui>\n              <field-ui label=\"Slack on deploys\" inline>\n                <check-ui></check-ui>\n              </field-ui>\n              <field-ui label=\"PagerDuty on outages\" inline>\n                <check-ui></check-ui>\n              </field-ui>\n            </col-ui>\n          </col-ui>\n        </section>\n        <footer slot=\"footer\">\n          <span slot=\"action\">\n            <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n            <button-ui text=\"Save settings\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n          </span>\n        </footer>\n      </drawer-ui>\n    </div>\n  </div>\n</section>",
   "source": "site/pages/patterns/form-drawer/index.html",
-  "captured_at": "2026-04-28T16:48:01.089Z"
+  "captured_at": "2026-05-01T19:13:23.303Z"
 }

package/chunks/forms-address-autocomplete.json

@@ -0,0 +1,15 @@
+{
+  "name": "forms-address-autocomplete",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/patterns/forms-conditional-and-autocomplete",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "address-autocomplete"
+  },
+  "html": "<section data-section data-property=\"address-autocomplete\" data-chunk=\"forms-address-autocomplete\">\n  <h2 variant=\"section\">Address autocomplete</h2>\n  <p data-note>Single input that opens a `menu-ui` of suggestions as the user types. Each suggestion shows the formatted address with the matched portion highlighted. Selecting a suggestion fills the structured fields below; clicking \"Enter manually\" reveals the structured fields directly.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"address autocomplete\">\n      <card-ui style=\"max-width: 560px;\">\n        <header>\n          <span slot=\"heading\" variant=\"section\">Billing address</span>\n        </header>\n        <section>\n          <col-ui gap=\"2\">\n            <field-ui label=\"Search address\" hint=\"Start typing — we'll suggest matches\">\n              <input-ui name=\"address_query\" placeholder=\"123 Main St\" icon-leading=\"map-pin\" value=\"500 market\"></input-ui>\n            </field-ui>\n            <card-ui raw style=\"max-width: 100%;\" data-shape=\"popover\">\n              <section>\n                <col-ui gap=\"2\">\n                  <row-ui gap=\"2\" align=\"center\">\n                    <icon-ui name=\"map-pin\" size=\"sm\"></icon-ui>\n                    <col-ui gap=\"0\" style=\"flex: 1;\">\n                      <text-ui><strong>500 Market</strong> Street</text-ui>\n                      <text-ui color=\"subtle\" size=\"sm\">San Francisco, CA 94105 · USA</text-ui>\n                    </col-ui>\n                  </row-ui>\n                  <row-ui gap=\"2\" align=\"center\">\n                    <icon-ui name=\"map-pin\" size=\"sm\"></icon-ui>\n                    <col-ui gap=\"0\" style=\"flex: 1;\">\n                      <text-ui><strong>500 Market</strong> Place</text-ui>\n                      <text-ui color=\"subtle\" size=\"sm\">Chattanooga, TN 37402 · USA</text-ui>\n                    </col-ui>\n                  </row-ui>\n                  <row-ui gap=\"2\" align=\"center\">\n                    <icon-ui name=\"map-pin\" size=\"sm\"></icon-ui>\n                    <col-ui gap=\"0\" style=\"flex: 1;\">\n                      <text-ui><strong>500 Market</strong> Square</text-ui>\n                      <text-ui color=\"subtle\" size=\"sm\">Pittsburgh, PA 15222 · USA</text-ui>\n                    </col-ui>\n                  </row-ui>\n                  <divider-ui></divider-ui>\n                  <row-ui gap=\"2\" align=\"center\">\n                    <icon-ui name=\"pencil-simple\" size=\"sm\"></icon-ui>\n                    <text-ui style=\"flex: 1;\">Enter address manually</text-ui>\n                  </row-ui>\n                </col-ui>\n              </section>\n            </card-ui>\n          </col-ui>\n        </section>\n      </card-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/patterns/forms-conditional-and-autocomplete/index.html",
+  "captured_at": "2026-05-01T19:13:23.303Z"
+}

package/chunks/forms-address-fields.json

@@ -0,0 +1,15 @@
+{
+  "name": "forms-address-fields",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/patterns/forms-conditional-and-autocomplete",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "address-fields"
+  },
+  "html": "<section data-section data-property=\"address-fields\" data-chunk=\"forms-address-fields\">\n  <h2 variant=\"section\">Resolved address — structured fields</h2>\n  <p data-note>After a suggestion is picked (or the user chose \"Enter manually\"), the structured fields appear, prefilled. The user can correct any line. Country drives the field set — US postal codes are different shape from CA, UK, etc.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"resolved address fields\">\n      <card-ui style=\"max-width: 560px;\">\n        <header>\n          <span slot=\"heading\" variant=\"section\">Address details</span>\n          <button-ui slot=\"action\" text=\"Search again\" variant=\"ghost\" size=\"sm\" icon-leading=\"arrow-counter-clockwise\"></button-ui>\n        </header>\n        <section>\n          <col-ui gap=\"3\">\n            <field-ui label=\"Street address\" required>\n              <input-ui name=\"street1\" value=\"500 Market Street\"></input-ui>\n            </field-ui>\n            <field-ui label=\"Apt / Suite (optional)\">\n              <input-ui name=\"street2\" placeholder=\"Suite 200\"></input-ui>\n            </field-ui>\n            <grid-ui columns=\"2\" gap=\"3\">\n              <field-ui label=\"City\" required>\n                <input-ui name=\"city\" value=\"San Francisco\"></input-ui>\n              </field-ui>\n              <field-ui label=\"State\" required>\n                <select-ui name=\"state\">\n                  <option value=\"CA\" selected>California</option>\n                  <option value=\"NY\">New York</option>\n                  <option value=\"TX\">Texas</option>\n                </select-ui>\n              </field-ui>\n            </grid-ui>\n            <grid-ui columns=\"2\" gap=\"3\">\n              <field-ui label=\"ZIP code\" required>\n                <input-ui name=\"postal_code\" value=\"94105\"></input-ui>\n              </field-ui>\n              <field-ui label=\"Country\" required>\n                <select-ui name=\"country\">\n                  <option value=\"US\" selected>United States</option>\n                  <option value=\"CA\">Canada</option>\n                  <option value=\"GB\">United Kingdom</option>\n                </select-ui>\n              </field-ui>\n            </grid-ui>\n          </col-ui>\n        </section>\n      </card-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/patterns/forms-conditional-and-autocomplete/index.html",
+  "captured_at": "2026-05-01T19:13:23.303Z"
+}