@adia-ai/a2ui-corpus 0.0.2 → 0.0.3

package/chunks/textarea-readonly.json

@@ -0,0 +1,15 @@
+{
+  "name": "textarea-readonly",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/textarea",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "readonly"
+  },
+  "html": "<section data-section data-property=\"readonly\" data-chunk=\"textarea-readonly\">\n  <h2 variant=\"section\">readonly</h2>\n  <p data-note>Focusable and selectable but not editable.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"Terms\">\n    <field-ui label=\"Terms\">\n      <textarea-ui value=\"By using this service you agree to the terms and conditions outlined in this document. Content is read-only.\" readonly rows=\"3\"></textarea-ui>\n    </field-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/textarea/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/textarea-resize.json

@@ -0,0 +1,15 @@
+{
+  "name": "textarea-resize",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/textarea",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "resize"
+  },
+  "html": "<section data-section data-property=\"resize\" data-chunk=\"textarea-resize\">\n  <h2 variant=\"section\">resize</h2>\n  <p data-note>Controls resize behavior. Defaults to \"vertical\".</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"Vertical resize\">\n    <field-ui label=\"Vertical resize\">\n      <textarea-ui placeholder=\"Drag the corner to resize\" resize=\"vertical\"></textarea-ui>\n    </field-ui>\n  </div>\n  <div data-artifact-item data-artifact-label=\"No resize\">\n    <field-ui label=\"No resize\">\n      <textarea-ui placeholder=\"Fixed height\" resize=\"none\"></textarea-ui>\n    </field-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/textarea/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/textarea-rows.json

@@ -0,0 +1,15 @@
+{
+  "name": "textarea-rows",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/textarea",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "rows"
+  },
+  "html": "<section data-section data-property=\"rows\" data-chunk=\"textarea-rows\">\n  <h2 variant=\"section\">rows</h2>\n  <p data-note>Controls the initial visible height. Defaults to 3.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"Compact (2 rows)\">\n    <field-ui label=\"Compact (2 rows)\">\n      <textarea-ui placeholder=\"Short input...\" rows=\"2\"></textarea-ui>\n    </field-ui>\n  </div>\n  <div data-artifact-item data-artifact-label=\"Default (3 rows)\">\n    <field-ui label=\"Default (3 rows)\">\n      <textarea-ui placeholder=\"Standard height...\" rows=\"3\"></textarea-ui>\n    </field-ui>\n  </div>\n  <div data-artifact-item data-artifact-label=\"Tall (6 rows)\">\n    <field-ui label=\"Tall (6 rows)\">\n      <textarea-ui placeholder=\"More space for content...\" rows=\"6\"></textarea-ui>\n    </field-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/textarea/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/timeline-compact.json

@@ -0,0 +1,15 @@
+{
+  "name": "timeline-compact",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/timeline",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "compact"
+  },
+  "html": "<section data-section data-property=\"compact\" data-chunk=\"timeline-compact\">\n  <h2 variant=\"section\">Compact (size=\"sm\")</h2>\n  <p data-note>Tighter spacing and smaller dots, tuned for agent pipeline traces and chat-adjacent surfaces. Labels align inline with duration on the right.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"compact + spinner + duration\">\n      <timeline-ui size=\"sm\">\n        <timeline-item-ui text=\"interpret: Classifying request\" duration=\"420ms\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"search: Finding patterns\" duration=\"850ms\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"generate: Adapting pattern\" duration=\"2.1s\" status=\"active\" spinner></timeline-item-ui>\n        <timeline-item-ui text=\"validate: Scoring output\"></timeline-item-ui>\n      </timeline-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/timeline/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/timeline-error.json

@@ -0,0 +1,15 @@
+{
+  "name": "timeline-error",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/timeline",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "error"
+  },
+  "html": "<section data-section data-property=\"error\" data-chunk=\"timeline-error\">\n  <h2 variant=\"section\">Error state</h2>\n  <p data-note>Use <code>error</code> for items that failed. Can coexist with <code>completed</code> for a run that errored-after-finish.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"error state\">\n      <timeline-ui>\n        <timeline-item-ui text=\"Build\" duration=\"2m 10s\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"Test\" duration=\"1m 04s\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"Deploy\" duration=\"45s\" status=\"error\"></timeline-item-ui>\n      </timeline-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/timeline/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/timeline-horizontal.json

@@ -0,0 +1,15 @@
+{
+  "name": "timeline-horizontal",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/timeline",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "horizontal"
+  },
+  "html": "<section data-section data-property=\"horizontal\" data-chunk=\"timeline-horizontal\">\n  <h2 variant=\"section\">Horizontal</h2>\n  <p data-note>Horizontal orientation for process flows.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"horizontal\">\n      <timeline-ui orientation=\"horizontal\">\n        <timeline-item-ui text=\"Draft\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"Review\" status=\"active\"></timeline-item-ui>\n        <timeline-item-ui text=\"Approved\"></timeline-item-ui>\n        <timeline-item-ui text=\"Published\"></timeline-item-ui>\n      </timeline-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/timeline/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/timeline-icons.json

@@ -0,0 +1,15 @@
+{
+  "name": "timeline-icons",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/timeline",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "icons"
+  },
+  "html": "<section data-section data-property=\"icons\" data-chunk=\"timeline-icons\">\n  <h2 variant=\"section\">With Icons</h2>\n  <p data-note>Custom icon per item via Phosphor name.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"with icons\">\n      <timeline-ui>\n        <timeline-item-ui text=\"Created\" description=\"Issue opened\" icon=\"plus\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"In Review\" description=\"PR submitted\" icon=\"eye\" status=\"active\"></timeline-item-ui>\n        <timeline-item-ui text=\"Merged\" icon=\"git-merge\"></timeline-item-ui>\n        <timeline-item-ui text=\"Deployed\" icon=\"rocket\"></timeline-item-ui>\n      </timeline-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/timeline/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/timeline-outcomes.json

@@ -0,0 +1,15 @@
+{
+  "name": "timeline-outcomes",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/timeline",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "outcomes"
+  },
+  "html": "<section data-section data-property=\"outcomes\" data-chunk=\"timeline-outcomes\">\n  <h2 variant=\"section\">Outcomes (expandable)</h2>\n  <p data-note>Set <code>.outcomes = [\"line 1\", \"line 2\"]</code> to show a toggle chevron and expandable sub-list. Fires <code>timeline-toggle</code> on expand/collapse.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"click the chevron to expand\">\n      <timeline-ui size=\"sm\" id=\"demo-outcomes\">\n        <timeline-item-ui id=\"t-out-1\" text=\"search: Ranking corpus\" duration=\"900ms\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"generate\" duration=\"2.3s\" status=\"active\" spinner></timeline-item-ui>\n      </timeline-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/timeline/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/timeline-variant.json

@@ -0,0 +1,15 @@
+{
+  "name": "timeline-variant",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/timeline",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "variant"
+  },
+  "html": "<section data-section data-property=\"variant\" data-chunk=\"timeline-variant\">\n  <h2 variant=\"section\">Variant Colors</h2>\n  <p data-note>Per-item variant for color-coded timelines.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"variant colors\">\n      <timeline-ui>\n        <timeline-item-ui text=\"Success\" variant=\"success\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"Info\" variant=\"accent\" status=\"active\"></timeline-item-ui>\n        <timeline-item-ui text=\"Warning\" variant=\"warning\"></timeline-item-ui>\n        <timeline-item-ui text=\"Error\" variant=\"danger\"></timeline-item-ui>\n      </timeline-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/timeline/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/timeline-vertical.json

@@ -0,0 +1,15 @@
+{
+  "name": "timeline-vertical",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/timeline",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "vertical"
+  },
+  "html": "<section data-section data-property=\"vertical\" data-chunk=\"timeline-vertical\">\n  <h2 variant=\"section\">Vertical Timeline</h2>\n  <p data-note>Default orientation. Each item can be completed, active, or pending.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"completed / active / pending\">\n      <timeline-ui>\n        <timeline-item-ui text=\"Order placed\" time=\"2h ago\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"Payment confirmed\" time=\"1h ago\" status=\"completed\"></timeline-item-ui>\n        <timeline-item-ui text=\"Processing\" status=\"active\"></timeline-item-ui>\n        <timeline-item-ui text=\"Shipped\"></timeline-item-ui>\n        <timeline-item-ui text=\"Delivered\"></timeline-item-ui>\n      </timeline-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/timeline/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toast-closable.json

@@ -0,0 +1,15 @@
+{
+  "name": "toast-closable",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toast",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "closable"
+  },
+  "html": "<section data-section data-property=\"closable\" data-chunk=\"toast-closable\">\n  <h2 variant=\"section\">closable</h2>\n  <p data-note>All toasts include a close button by default. Click it to dismiss immediately.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"closable (10s duration)\">\n      <button-ui text=\"Show Closable\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Click the X to dismiss early.',variant:'success',duration:10000}))\"></button-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toast/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toast-combo.json

@@ -0,0 +1,15 @@
+{
+  "name": "toast-combo",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toast",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-combo": ""
+  },
+  "html": "<section data-section data-combo data-chunk=\"toast-combo\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Multiple toasts can stack. Click several buttons quickly to see stacking behavior.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"stacked toasts\">\n      <button-ui text=\"Stack 3 Toasts\" variant=\"primary\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>{const T=customElements.get('toast-ui');T.show({text:'First: File uploaded.',variant:'success',duration:5000});setTimeout(()=>T.show({text:'Second: Processing...',variant:'info',duration:5000}),300);setTimeout(()=>T.show({text:'Third: Complete!',variant:'success',duration:5000}),600);})\"></button-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toast/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toast-duration.json

@@ -0,0 +1,15 @@
+{
+  "name": "toast-duration",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toast",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "duration"
+  },
+  "html": "<section data-section data-property=\"duration\" data-chunk=\"toast-duration\">\n  <h2 variant=\"section\">auto-dismiss</h2>\n  <p data-note>Toasts automatically dismiss after the duration (default 4000ms). Set a custom duration.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"2 seconds\">\n      <button-ui text=\"Short (2s)\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'This disappears quickly.',variant:'info',duration:2000}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"4 seconds\">\n      <button-ui text=\"Default (4s)\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Default 4 second toast.',variant:'info'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"8 seconds\">\n      <button-ui text=\"Long (8s)\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'This stays visible for 8 seconds.',variant:'info',duration:8000}))\"></button-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toast/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toast-edge.json

@@ -0,0 +1,15 @@
+{
+  "name": "toast-edge",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toast",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-edge": ""
+  },
+  "html": "<section data-section data-edge data-chunk=\"toast-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=\"long text\">\n      <button-ui text=\"Long Text\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'This is a very long toast message that tests how the component handles overflow when the text content exceeds the typical expected width of a notification popup.',variant:'info',duration:6000}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"empty text\">\n      <button-ui text=\"Empty Text\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'',variant:'info'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"single word\">\n      <button-ui text=\"Short Text\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'OK',variant:'success'}))\"></button-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toast/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toast-position.json

@@ -0,0 +1,15 @@
+{
+  "name": "toast-position",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toast",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "position"
+  },
+  "html": "<section data-section data-property=\"position\" data-chunk=\"toast-position\">\n  <h2 variant=\"section\">position</h2>\n  <p data-note>Screen position where the toast appears. One of six corner/edge anchors.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"top-left\">\n      <button-ui text=\"Top Left\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Top left',variant:'info',position:'top-left'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"top-center\">\n      <button-ui text=\"Top Center\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Top center',variant:'info',position:'top-center'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"top-right\">\n      <button-ui text=\"Top Right\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Top right',variant:'info',position:'top-right'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"bottom-left\">\n      <button-ui text=\"Bottom Left\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Bottom left',variant:'info',position:'bottom-left'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"bottom-center\">\n      <button-ui text=\"Bottom Center\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Bottom center',variant:'info',position:'bottom-center'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"bottom-right\">\n      <button-ui text=\"Bottom Right\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Bottom right',variant:'info',position:'bottom-right'}))\"></button-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toast/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toast-text.json

@@ -0,0 +1,15 @@
+{
+  "name": "toast-text",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toast",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "text"
+  },
+  "html": "<section data-section data-property=\"text\" data-chunk=\"toast-text\">\n  <h2 variant=\"section\">text</h2>\n  <p data-note>The message shown in the toast body. Declarative inline toasts render at their specified position.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label='text=\"Changes saved successfully.\"'>\n      <toast-ui text=\"Changes saved successfully.\" variant=\"success\" duration=\"0\" position=\"top-right\"></toast-ui>\n      </div>\n    <div data-artifact-item data-artifact-label='text=\"New message received.\"'>\n      <toast-ui text=\"New message received.\" variant=\"info\" duration=\"0\" position=\"top-left\"></toast-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toast/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toast-variant.json

@@ -0,0 +1,15 @@
+{
+  "name": "toast-variant",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toast",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "variant"
+  },
+  "html": "<section data-section data-property=\"variant\" data-chunk=\"toast-variant\">\n  <h2 variant=\"section\">variant</h2>\n  <p data-note>Controls the color scheme and icon. Click each button to show the toast.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"default\">\n      <button-ui text=\"Default\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Default notification',variant:'default'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"info\">\n      <button-ui text=\"Info\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Here is some information.',variant:'info'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"success\">\n      <button-ui text=\"Success\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Changes saved successfully!',variant:'success'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"warning\">\n      <button-ui text=\"Warning\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'API rate limit approaching.',variant:'warning'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"danger\">\n      <button-ui text=\"Danger\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'Failed to delete resource.',variant:'danger'}))\"></button-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"error\">\n      <button-ui text=\"Error\" variant=\"outline\" size=\"sm\"\n        onclick=\"customElements.whenDefined('toast-ui').then(()=>customElements.get('toast-ui').show({text:'An error occurred while saving.',variant:'error'}))\"></button-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toast/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toggle-group-combo.json

@@ -0,0 +1,15 @@
+{
+  "name": "toggle-group-combo",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toggle-group",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-combo": ""
+  },
+  "html": "<section data-section data-combo data-chunk=\"toggle-group-combo\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Multi-property pairings.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"icon + text + single + disabled\">\n      <toggle-group-ui value=\"grid\" single>\n        <toggle-option-ui value=\"list\" icon=\"list\" text=\"List\"></toggle-option-ui>\n        <toggle-option-ui value=\"grid\" icon=\"squares-four\" text=\"Grid\"></toggle-option-ui>\n        <toggle-option-ui value=\"kanban\" icon=\"kanban\" text=\"Board\" disabled></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label=\"multi-select with icons + text\">\n      <toggle-group-ui value=\"email,push\">\n        <toggle-option-ui value=\"email\" icon=\"envelope\" text=\"Email\"></toggle-option-ui>\n        <toggle-option-ui value=\"push\" icon=\"bell\" text=\"Push\"></toggle-option-ui>\n        <toggle-option-ui value=\"sms\" icon=\"chat-circle\" text=\"SMS\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toggle-group/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toggle-group-disabled.json

@@ -0,0 +1,15 @@
+{
+  "name": "toggle-group-disabled",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toggle-group",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "disabled"
+  },
+  "html": "<section data-section data-property=\"disabled\" data-chunk=\"toggle-group-disabled\">\n  <h2 variant=\"section\">disabled option</h2>\n  <p data-note>Individual options can be disabled. They remain visible but cannot be toggled.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"underline + strike disabled\">\n      <toggle-group-ui value=\"bold\">\n        <toggle-option-ui value=\"bold\" icon=\"text-b\"></toggle-option-ui>\n        <toggle-option-ui value=\"italic\" icon=\"text-italic\"></toggle-option-ui>\n        <toggle-option-ui value=\"underline\" icon=\"text-underline\" disabled></toggle-option-ui>\n        <toggle-option-ui value=\"strikethrough\" icon=\"text-strikethrough\" disabled></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toggle-group/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toggle-group-edge.json

@@ -0,0 +1,15 @@
+{
+  "name": "toggle-group-edge",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toggle-group",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-edge": ""
+  },
+  "html": "<section data-section data-edge data-chunk=\"toggle-group-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 option\">\n      <toggle-group-ui>\n        <toggle-option-ui value=\"only\" icon=\"star\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"many options\">\n      <toggle-group-ui>\n        <toggle-option-ui value=\"a\" text=\"A\"></toggle-option-ui>\n        <toggle-option-ui value=\"b\" text=\"B\"></toggle-option-ui>\n        <toggle-option-ui value=\"c\" text=\"C\"></toggle-option-ui>\n        <toggle-option-ui value=\"d\" text=\"D\"></toggle-option-ui>\n        <toggle-option-ui value=\"e\" text=\"E\"></toggle-option-ui>\n        <toggle-option-ui value=\"f\" text=\"F\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"all selected\">\n      <toggle-group-ui value=\"bold,italic,underline,strike\">\n        <toggle-option-ui value=\"bold\" icon=\"text-b\"></toggle-option-ui>\n        <toggle-option-ui value=\"italic\" icon=\"text-italic\"></toggle-option-ui>\n        <toggle-option-ui value=\"underline\" icon=\"text-underline\"></toggle-option-ui>\n        <toggle-option-ui value=\"strike\" icon=\"text-strikethrough\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toggle-group/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toggle-group-icon-group.json

@@ -0,0 +1,15 @@
+{
+  "name": "toggle-group-icon-group",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toggle-group",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "icon-group"
+  },
+  "html": "<section data-section data-property=\"icon-group\" data-chunk=\"toggle-group-icon-group\">\n  <h2 variant=\"section\">icon group</h2>\n  <p data-note>Icon-only toggle options for formatting controls. Multiple can be active simultaneously.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"bold/italic/underline\">\n      <toggle-group-ui value=\"bold\">\n        <toggle-option-ui value=\"bold\" icon=\"text-b\"></toggle-option-ui>\n        <toggle-option-ui value=\"italic\" icon=\"text-italic\"></toggle-option-ui>\n        <toggle-option-ui value=\"underline\" icon=\"text-underline\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toggle-group/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toggle-group-pre-selected.json

@@ -0,0 +1,15 @@
+{
+  "name": "toggle-group-pre-selected",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toggle-group",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "pre-selected"
+  },
+  "html": "<section data-section data-property=\"pre-selected\" data-chunk=\"toggle-group-pre-selected\">\n  <h2 variant=\"section\">pre-selected</h2>\n  <p data-note>Comma-separated values in the value attribute select multiple options on load.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"bold + italic pre-selected\">\n      <toggle-group-ui value=\"bold,italic\">\n        <toggle-option-ui value=\"bold\" icon=\"text-b\"></toggle-option-ui>\n        <toggle-option-ui value=\"italic\" icon=\"text-italic\"></toggle-option-ui>\n        <toggle-option-ui value=\"underline\" icon=\"text-underline\"></toggle-option-ui>\n        <toggle-option-ui value=\"strikethrough\" icon=\"text-strikethrough\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toggle-group/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toggle-group-single-vs-multi.json

@@ -0,0 +1,15 @@
+{
+  "name": "toggle-group-single-vs-multi",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toggle-group",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "single-vs-multi"
+  },
+  "html": "<section data-section data-property=\"single-vs-multi\" data-chunk=\"toggle-group-single-vs-multi\">\n  <h2 variant=\"section\">single vs multi</h2>\n  <p data-note>Multi-select is the default. Add <code>single</code> for radio-like single-select behavior.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"multi (default)\">\n      <toggle-group-ui value=\"bold,italic\">\n        <toggle-option-ui value=\"bold\" icon=\"text-b\"></toggle-option-ui>\n        <toggle-option-ui value=\"italic\" icon=\"text-italic\"></toggle-option-ui>\n        <toggle-option-ui value=\"underline\" icon=\"text-underline\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"single\">\n      <toggle-group-ui single>\n        <toggle-option-ui value=\"list\" text=\"List\"></toggle-option-ui>\n        <toggle-option-ui value=\"grid\" text=\"Grid\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toggle-group/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toggle-group-single.json

@@ -0,0 +1,15 @@
+{
+  "name": "toggle-group-single",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toggle-group",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "single"
+  },
+  "html": "<section data-section data-property=\"single\" data-chunk=\"toggle-group-single\">\n  <h2 variant=\"section\">single select</h2>\n  <p data-note>Add the <code>single</code> attribute to allow only one option at a time.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"single select alignment\">\n      <toggle-group-ui value=\"left\" single>\n        <toggle-option-ui value=\"left\" icon=\"text-align-left\"></toggle-option-ui>\n        <toggle-option-ui value=\"center\" icon=\"text-align-center\"></toggle-option-ui>\n        <toggle-option-ui value=\"right\" icon=\"text-align-right\"></toggle-option-ui>\n        <toggle-option-ui value=\"justify\" icon=\"text-align-justify\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toggle-group/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toggle-group-text-group.json

@@ -0,0 +1,15 @@
+{
+  "name": "toggle-group-text-group",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toggle-group",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "text-group"
+  },
+  "html": "<section data-section data-property=\"text-group\" data-chunk=\"toggle-group-text-group\">\n  <h2 variant=\"section\">text group</h2>\n  <p data-note>Text-only toggle options for label-based selections.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"text options\">\n      <toggle-group-ui value=\"week\">\n        <toggle-option-ui value=\"day\" text=\"Day\"></toggle-option-ui>\n        <toggle-option-ui value=\"week\" text=\"Week\"></toggle-option-ui>\n        <toggle-option-ui value=\"month\" text=\"Month\"></toggle-option-ui>\n        <toggle-option-ui value=\"year\" text=\"Year\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toggle-group/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toggle-group-value.json

@@ -0,0 +1,15 @@
+{
+  "name": "toggle-group-value",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toggle-group",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "value"
+  },
+  "html": "<section data-section data-property=\"value\" data-chunk=\"toggle-group-value\">\n  <h2 variant=\"section\">value</h2>\n  <p data-note>Selected option key. Set via the <code>value</code> attribute; matches a child's <code>value</code>.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"value=list\">\n      <toggle-group-ui value=\"list\">\n        <toggle-option-ui value=\"list\" text=\"List\"></toggle-option-ui>\n        <toggle-option-ui value=\"grid\" text=\"Grid\"></toggle-option-ui>\n        <toggle-option-ui value=\"board\" text=\"Board\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"value=grid\">\n      <toggle-group-ui value=\"grid\">\n        <toggle-option-ui value=\"list\" text=\"List\"></toggle-option-ui>\n        <toggle-option-ui value=\"grid\" text=\"Grid\"></toggle-option-ui>\n        <toggle-option-ui value=\"board\" text=\"Board\"></toggle-option-ui>\n      </toggle-group-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toggle-group/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toolbar-align.json

@@ -0,0 +1,15 @@
+{
+  "name": "toolbar-align",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toolbar",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "align"
+  },
+  "html": "<section data-section data-property=\"align\" data-chunk=\"toolbar-align\">\n  <h2 variant=\"section\">align</h2>\n  <p data-note>Controls horizontal alignment of items within the toolbar.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"start\">\n      <toolbar-ui align=\"start\" style=\"width:100%;\">\n        <button-ui icon=\"plus\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"pencil\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </toolbar-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label=\"center\">\n      <toolbar-ui align=\"center\" style=\"width:100%;\">\n        <button-ui icon=\"plus\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"pencil\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </toolbar-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label=\"end\">\n      <toolbar-ui align=\"end\" style=\"width:100%;\">\n        <button-ui icon=\"plus\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"pencil\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </toolbar-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label=\"space-between\">\n      <toolbar-ui align=\"space-between\" style=\"width:100%;\">\n        <button-ui icon=\"arrow-left\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui text=\"Title\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"arrow-right\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </toolbar-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toolbar/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toolbar-basic.json

@@ -0,0 +1,15 @@
+{
+  "name": "toolbar-basic",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toolbar",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "basic"
+  },
+  "html": "<section data-section data-property=\"basic\" data-chunk=\"toolbar-basic\">\n  <h2 variant=\"section\">basic</h2>\n  <p data-note>Icon buttons arranged in a horizontal toolbar.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"basic icon buttons\">\n      <toolbar-ui bordered>\n        <button-ui icon=\"text-b\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"text-italic\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"text-underline\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"text-strikethrough\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </toolbar-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toolbar/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toolbar-bordered.json

@@ -0,0 +1,15 @@
+{
+  "name": "toolbar-bordered",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toolbar",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "bordered"
+  },
+  "html": "<section data-section data-property=\"bordered\" data-chunk=\"toolbar-bordered\">\n  <h2 variant=\"section\">bordered</h2>\n  <p data-note>Add the bordered attribute for a visible frame around the toolbar.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"default (no border)\">\n      <toolbar-ui>\n        <button-ui icon=\"arrow-left\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"arrow-right\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <divider-ui vertical></divider-ui>\n        <button-ui icon=\"arrow-clockwise\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </toolbar-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"bordered\">\n      <toolbar-ui bordered>\n        <button-ui icon=\"arrow-left\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"arrow-right\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <divider-ui vertical></divider-ui>\n        <button-ui icon=\"arrow-clockwise\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </toolbar-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toolbar/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toolbar-combo.json

@@ -0,0 +1,15 @@
+{
+  "name": "toolbar-combo",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toolbar",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-combo": ""
+  },
+  "html": "<section data-section data-combo data-chunk=\"toolbar-combo\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Rich editor toolbar with groups, dividers, and mixed controls. Segmented and select controls stay together as atomic groups when the bar overflows.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"editor toolbar\">\n      <toolbar-ui bordered gap=\"sm\">\n        <toolbar-group-ui>\n          <button-ui icon=\"arrow-counter-clockwise\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"arrow-clockwise\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </toolbar-group-ui>\n        <divider-ui vertical></divider-ui>\n        <toolbar-group-ui>\n          <button-ui icon=\"text-b\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"text-italic\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"text-underline\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"code\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </toolbar-group-ui>\n        <divider-ui vertical></divider-ui>\n        <toolbar-group-ui>\n          <button-ui icon=\"link\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"image\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </toolbar-group-ui>\n      </toolbar-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label=\"mixed controls + resizable\">\n      <div style=\"resize:horizontal;overflow:auto;min-width:6rem;max-width:100%;width:760px;border:1px dashed var(--a-border-subtle);border-radius:var(--a-radius-md);padding:0.5rem;\">\n        <toolbar-ui bordered gap=\"md\" style=\"width:100%;\">\n          <toolbar-group-ui>\n            <segmented-ui>\n              <button-ui text=\"Edit\" size=\"sm\"></button-ui>\n              <button-ui text=\"Preview\" size=\"sm\"></button-ui>\n            </segmented-ui>\n          </toolbar-group-ui>\n          <divider-ui vertical></divider-ui>\n          <toolbar-group-ui>\n            <select-ui size=\"sm\" style=\"min-width: 8rem;\">\n              <option value=\"p\">Paragraph</option>\n              <option value=\"h1\">Heading 1</option>\n              <option value=\"h2\">Heading 2</option>\n              <option value=\"h3\">Heading 3</option>\n            </select-ui>\n          </toolbar-group-ui>\n          <divider-ui vertical></divider-ui>\n          <toolbar-group-ui>\n            <button-ui icon=\"text-b\" variant=\"ghost\" size=\"sm\"></button-ui>\n            <button-ui icon=\"text-italic\" variant=\"ghost\" size=\"sm\"></button-ui>\n            <button-ui icon=\"text-underline\" variant=\"ghost\" size=\"sm\"></button-ui>\n          </toolbar-group-ui>\n          <divider-ui vertical></divider-ui>\n          <toolbar-group-ui>\n            <button-ui icon=\"link\" variant=\"ghost\" size=\"sm\"></button-ui>\n            <button-ui icon=\"image\" variant=\"ghost\" size=\"sm\"></button-ui>\n            <button-ui icon=\"code\" variant=\"ghost\" size=\"sm\"></button-ui>\n            <button-ui icon=\"quotes\" variant=\"ghost\" size=\"sm\"></button-ui>\n          </toolbar-group-ui>\n          <divider-ui vertical></divider-ui>\n          <toolbar-group-ui>\n            <button-ui icon=\"arrow-counter-clockwise\" variant=\"ghost\" size=\"sm\"></button-ui>\n            <button-ui icon=\"arrow-clockwise\" variant=\"ghost\" size=\"sm\"></button-ui>\n          </toolbar-group-ui>\n        </toolbar-ui>\n      </div>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toolbar/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toolbar-dividers.json

@@ -0,0 +1,15 @@
+{
+  "name": "toolbar-dividers",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toolbar",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "dividers"
+  },
+  "html": "<section data-section data-property=\"dividers\" data-chunk=\"toolbar-dividers\">\n  <h2 variant=\"section\">with dividers</h2>\n  <p data-note>Use divider-ui with vertical attribute to separate button groups visually.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"grouped with dividers\">\n      <toolbar-ui>\n        <toolbar-group-ui>\n          <button-ui icon=\"text-b\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"text-italic\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"text-underline\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </toolbar-group-ui>\n        <divider-ui vertical></divider-ui>\n        <toolbar-group-ui>\n          <button-ui icon=\"text-align-left\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"text-align-center\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"text-align-right\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </toolbar-group-ui>\n        <divider-ui vertical></divider-ui>\n        <toolbar-group-ui>\n          <button-ui icon=\"list-bullets\" variant=\"ghost\" size=\"sm\"></button-ui>\n          <button-ui icon=\"list-numbers\" variant=\"ghost\" size=\"sm\"></button-ui>\n        </toolbar-group-ui>\n      </toolbar-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toolbar/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/toolbar-edge.json

@@ -0,0 +1,15 @@
+{
+  "name": "toolbar-edge",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/toolbar",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-edge": ""
+  },
+  "html": "<section data-section data-edge data-chunk=\"toolbar-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 item\">\n      <toolbar-ui>\n        <button-ui icon=\"star\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </toolbar-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"many items (overflow)\">\n      <toolbar-ui>\n        <button-ui icon=\"plus\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"minus\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"pencil\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"trash\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"copy\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"download\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"upload\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"share\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"gear\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <button-ui icon=\"eye\" variant=\"ghost\" size=\"sm\"></button-ui>\n      </toolbar-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/toolbar/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}