@adia-ai/a2ui-corpus 0.0.2 → 0.0.3

package/chunks/member-edit-drawer.json

@@ -0,0 +1,15 @@
+{
+  "name": "member-edit-drawer",
+  "kind": "block",
+  "primary": "drawer-ui",
+  "page": "/site/examples/registration/org-review",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "placement": "end",
+    "size": "md"
+  },
+  "html": "<drawer-ui id=\"member-edit-drawer\" data-chunk=\"member-edit-drawer\" placement=\"end\" size=\"md\">\n  <header>\n    <h2 slot=\"heading\">Edit member</h2>\n    <text-ui slot=\"description\" color=\"subtle\" size=\"sm\">Adjust role, manager, and department. Changes save to admin → directory.</text-ui>\n  </header>\n  <section>\n    <field-ui label=\"Full name\">\n      <input-ui name=\"m_name\" value=\"Alex Chen\"></input-ui>\n    </field-ui>\n    <field-ui label=\"Title\">\n      <input-ui name=\"m_title\" value=\"Senior Engineer\"></input-ui>\n    </field-ui>\n    <field-ui label=\"Department\">\n      <select-ui name=\"m_dept\" value=\"engineering\">\n        <option value=\"engineering\" selected>Engineering</option>\n        <option value=\"product\">Product</option>\n        <option value=\"design\">Design</option>\n        <option value=\"sales\">Sales</option>\n        <option value=\"cs\">Customer Success</option>\n        <option value=\"ops\">Operations</option>\n      </select-ui>\n    </field-ui>\n    <field-ui label=\"Reports to\">\n      <select-ui name=\"m_manager\" value=\"maya\">\n        <option value=\"jane\">Jane Doe (Founder)</option>\n        <option value=\"maya\" selected>Maya Patel (VP Engineering)</option>\n        <option value=\"riley\">Riley Park (Head of Design)</option>\n        <option value=\"morgan\">Morgan Lee (Head of Sales)</option>\n        <option value=\"\">No manager</option>\n      </select-ui>\n    </field-ui>\n    <field-ui label=\"Status\">\n      <segmented-ui name=\"m_status\" value=\"active\">\n        <segment-ui text=\"Active\" value=\"active\"></segment-ui>\n        <segment-ui text=\"Pending\" value=\"pending\"></segment-ui>\n        <segment-ui text=\"Suspended\" value=\"suspended\"></segment-ui>\n      </segmented-ui>\n    </field-ui>\n  </section>\n  <footer>\n    <button-ui slot=\"action\" text=\"Cancel\" variant=\"ghost\"></button-ui>\n    <button-ui slot=\"action\" text=\"Save changes\" variant=\"primary\"></button-ui>\n  </footer>\n</drawer-ui>",
+  "source": "site/pages/examples/registration/org-review/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-basic.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-basic",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "basic"
+  },
+  "html": "<section data-section data-property=\"basic\" data-chunk=\"menu-basic\">\n  <h2 variant=\"section\">basic</h2>\n  <p data-note>A simple 3-item menu. Click the trigger button to toggle open.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"basic 3 items\">\n      <menu-ui>\n        <button-ui slot=\"trigger\" text=\"Actions\" variant=\"outline\"></button-ui>\n        <menu-item-ui text=\"Edit\" value=\"edit\"></menu-item-ui>\n        <menu-item-ui text=\"Duplicate\" value=\"duplicate\"></menu-item-ui>\n        <menu-item-ui text=\"Archive\" value=\"archive\"></menu-item-ui>\n      </menu-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-combo.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-combo",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-combo": ""
+  },
+  "html": "<section data-section data-combo data-chunk=\"menu-combo\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Full-featured menu with icons, dividers, danger, and disabled combined.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"full-featured\">\n      <menu-ui>\n        <button-ui slot=\"trigger\" icon=\"dots-three-vertical\" variant=\"ghost\" size=\"sm\"></button-ui>\n        <menu-item-ui icon=\"eye\" text=\"View\" value=\"view\"></menu-item-ui>\n        <menu-item-ui icon=\"pencil\" text=\"Edit\" value=\"edit\"></menu-item-ui>\n        <menu-item-ui icon=\"copy\" text=\"Duplicate\" value=\"duplicate\"></menu-item-ui>\n        <menu-divider-ui></menu-divider-ui>\n        <menu-item-ui icon=\"arrow-up\" text=\"Move Up\" value=\"move-up\" disabled></menu-item-ui>\n        <menu-item-ui icon=\"arrow-down\" text=\"Move Down\" value=\"move-down\"></menu-item-ui>\n        <menu-divider-ui></menu-divider-ui>\n        <menu-item-ui icon=\"trash\" text=\"Delete\" value=\"delete\" variant=\"danger\"></menu-item-ui>\n      </menu-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-disabled.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-disabled",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "disabled"
+  },
+  "html": "<section data-section data-property=\"disabled\" data-chunk=\"menu-disabled\">\n  <h2 variant=\"section\">disabled item</h2>\n  <p data-note>Disabled items remain visible but cannot be selected or focused via keyboard.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"disabled items\">\n      <menu-ui>\n        <button-ui slot=\"trigger\" text=\"Options\" variant=\"outline\"></button-ui>\n        <menu-item-ui icon=\"pencil\" text=\"Edit\" value=\"edit\"></menu-item-ui>\n        <menu-item-ui icon=\"lock\" text=\"Permissions\" value=\"permissions\" disabled></menu-item-ui>\n        <menu-item-ui icon=\"share\" text=\"Share\" value=\"share\"></menu-item-ui>\n        <menu-divider-ui></menu-divider-ui>\n        <menu-item-ui icon=\"trash\" text=\"Delete\" value=\"delete\" variant=\"danger\" disabled></menu-item-ui>\n      </menu-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-divider.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-divider",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "divider"
+  },
+  "html": "<section data-section data-property=\"divider\" data-chunk=\"menu-divider\">\n  <h2 variant=\"section\">with divider</h2>\n  <p data-note>Use menu-divider-ui to separate groups of related actions.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"divider between groups\">\n      <menu-ui>\n        <button-ui slot=\"trigger\" text=\"File\" variant=\"outline\"></button-ui>\n        <menu-item-ui icon=\"file-plus\" text=\"New\" value=\"new\"></menu-item-ui>\n        <menu-item-ui icon=\"folder-open\" text=\"Open\" value=\"open\"></menu-item-ui>\n        <menu-item-ui icon=\"floppy-disk\" text=\"Save\" value=\"save\"></menu-item-ui>\n        <menu-divider-ui></menu-divider-ui>\n        <menu-item-ui icon=\"export\" text=\"Export\" value=\"export\"></menu-item-ui>\n        <menu-item-ui icon=\"printer\" text=\"Print\" value=\"print\"></menu-item-ui>\n      </menu-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-edge.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-edge",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-edge": ""
+  },
+  "html": "<section data-section data-edge data-chunk=\"menu-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      <menu-ui>\n        <button-ui slot=\"trigger\" text=\"One\" variant=\"outline\" size=\"sm\"></button-ui>\n        <menu-item-ui text=\"Only option\" value=\"only\"></menu-item-ui>\n      </menu-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"long text\">\n      <menu-ui>\n        <button-ui slot=\"trigger\" text=\"Long\" variant=\"outline\" size=\"sm\"></button-ui>\n        <menu-item-ui icon=\"pencil\" text=\"This is a very long menu item label that might overflow\" value=\"long\"></menu-item-ui>\n        <menu-item-ui text=\"Short\" value=\"short\"></menu-item-ui>\n      </menu-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-gap.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-gap",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "gap"
+  },
+  "html": "<section data-section data-property=\"gap\" data-chunk=\"menu-gap\">\n  <h2 variant=\"section\">gap</h2>\n  <p data-note>Pixel gap between the trigger and popover. Defaults to 4.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label='gap=\"0\"'>\n      <menu-ui gap=\"0\">\n        <button-ui slot=\"trigger\" text=\"gap 0\" variant=\"outline\" size=\"sm\"></button-ui>\n        <menu-item-ui text=\"Option A\" value=\"a\"></menu-item-ui>\n        <menu-item-ui text=\"Option B\" value=\"b\"></menu-item-ui>\n      </menu-ui>\n      </div>\n    <div data-artifact-item data-artifact-label='gap=\"4\" (default)'>\n      <menu-ui gap=\"4\">\n        <button-ui slot=\"trigger\" text=\"gap 4\" variant=\"outline\" size=\"sm\"></button-ui>\n        <menu-item-ui text=\"Option A\" value=\"a\"></menu-item-ui>\n        <menu-item-ui text=\"Option B\" value=\"b\"></menu-item-ui>\n      </menu-ui>\n      </div>\n    <div data-artifact-item data-artifact-label='gap=\"12\"'>\n      <menu-ui gap=\"12\">\n        <button-ui slot=\"trigger\" text=\"gap 12\" variant=\"outline\" size=\"sm\"></button-ui>\n        <menu-item-ui text=\"Option A\" value=\"a\"></menu-item-ui>\n        <menu-item-ui text=\"Option B\" value=\"b\"></menu-item-ui>\n      </menu-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-icon.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-icon",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "icon"
+  },
+  "html": "<section data-section data-property=\"icon\" data-chunk=\"menu-icon\">\n  <h2 variant=\"section\">with icons</h2>\n  <p data-note>Each menu item can display a leading icon.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"icon items\">\n      <menu-ui>\n        <button-ui slot=\"trigger\" icon=\"dots-three-vertical\" variant=\"ghost\"></button-ui>\n        <menu-item-ui icon=\"pencil\" text=\"Edit\" value=\"edit\"></menu-item-ui>\n        <menu-item-ui icon=\"copy\" text=\"Duplicate\" value=\"duplicate\"></menu-item-ui>\n        <menu-item-ui icon=\"download\" text=\"Download\" value=\"download\"></menu-item-ui>\n      </menu-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-open.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-open",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "open"
+  },
+  "html": "<section data-section data-property=\"open\" data-chunk=\"menu-open\">\n  <h2 variant=\"section\">open</h2>\n  <p data-note>Controls menu open state. Toggling the attribute opens/closes the popover; it also reflects user interaction.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"closed (default)\">\n      <menu-ui id=\"menu-open-demo\">\n        <button-ui slot=\"trigger\" text=\"Click trigger\" variant=\"outline\"></button-ui>\n        <menu-item-ui text=\"First\" value=\"first\"></menu-item-ui>\n        <menu-item-ui text=\"Second\" value=\"second\"></menu-item-ui>\n      </menu-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"toggle via JS\">\n      <button-ui text=\"Toggle open\" variant=\"outline\" size=\"sm\"\n        onclick=\"(function(){var m=document.getElementById('menu-open-demo');m.open=!m.open;})()\"></button-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-placement.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-placement",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "placement"
+  },
+  "html": "<section data-section data-property=\"placement\" data-chunk=\"menu-placement\">\n  <h2 variant=\"section\">placement</h2>\n  <p data-note>Anchor placement relative to the trigger. Defaults to <code>bottom-start</code>.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label='placement=\"bottom-start\"'>\n      <menu-ui placement=\"bottom-start\">\n        <button-ui slot=\"trigger\" text=\"bottom-start\" variant=\"outline\" size=\"sm\"></button-ui>\n        <menu-item-ui text=\"Edit\" value=\"edit\"></menu-item-ui>\n        <menu-item-ui text=\"Delete\" value=\"delete\"></menu-item-ui>\n      </menu-ui>\n      </div>\n    <div data-artifact-item data-artifact-label='placement=\"bottom-end\"'>\n      <menu-ui placement=\"bottom-end\">\n        <button-ui slot=\"trigger\" text=\"bottom-end\" variant=\"outline\" size=\"sm\"></button-ui>\n        <menu-item-ui text=\"Edit\" value=\"edit\"></menu-item-ui>\n        <menu-item-ui text=\"Delete\" value=\"delete\"></menu-item-ui>\n      </menu-ui>\n      </div>\n    <div data-artifact-item data-artifact-label='placement=\"top-start\"'>\n      <menu-ui placement=\"top-start\">\n        <button-ui slot=\"trigger\" text=\"top-start\" variant=\"outline\" size=\"sm\"></button-ui>\n        <menu-item-ui text=\"Edit\" value=\"edit\"></menu-item-ui>\n        <menu-item-ui text=\"Delete\" value=\"delete\"></menu-item-ui>\n      </menu-ui>\n      </div>\n    <div data-artifact-item data-artifact-label='placement=\"top-end\"'>\n      <menu-ui placement=\"top-end\">\n        <button-ui slot=\"trigger\" text=\"top-end\" variant=\"outline\" size=\"sm\"></button-ui>\n        <menu-item-ui text=\"Edit\" value=\"edit\"></menu-item-ui>\n        <menu-item-ui text=\"Delete\" value=\"delete\"></menu-item-ui>\n      </menu-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/menu-variant.json

@@ -0,0 +1,15 @@
+{
+  "name": "menu-variant",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/menu",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "variant"
+  },
+  "html": "<section data-section data-property=\"variant\" data-chunk=\"menu-variant\">\n  <h2 variant=\"section\">danger variant</h2>\n  <p data-note>Set variant=\"danger\" on a menu item for destructive actions.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"danger on delete\">\n      <menu-ui>\n        <button-ui slot=\"trigger\" icon=\"dots-three\" variant=\"ghost\"></button-ui>\n        <menu-item-ui icon=\"pencil\" text=\"Edit\" value=\"edit\"></menu-item-ui>\n        <menu-item-ui icon=\"copy\" text=\"Duplicate\" value=\"duplicate\"></menu-item-ui>\n        <menu-divider-ui></menu-divider-ui>\n        <menu-item-ui icon=\"trash\" text=\"Delete\" value=\"delete\" variant=\"danger\"></menu-item-ui>\n      </menu-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/menu/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/modal-basic.json

@@ -0,0 +1,15 @@
+{
+  "name": "modal-basic",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/modal",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "basic"
+  },
+  "html": "<section data-section data-property=\"basic\" data-chunk=\"modal-basic\">\n  <h2 variant=\"section\">basic</h2>\n  <p data-note>A modal with a title, body content, and action buttons. Click the trigger to open.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"basic modal\">\n      <button-ui text=\"Open Modal\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Confirm Action\">\n        <p>Are you sure you want to proceed? This action requires your confirmation.</p>\n        <div slot=\"footer\" style=\"display:flex; gap:var(--a-space-2); justify-content:flex-end;\">\n          <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n          <button-ui text=\"Confirm\" variant=\"primary\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n        </div>\n      </modal-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/modal/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/modal-closable.json

@@ -0,0 +1,15 @@
+{
+  "name": "modal-closable",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/modal",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "closable"
+  },
+  "html": "<section data-section data-property=\"closable\" data-chunk=\"modal-closable\">\n  <h2 variant=\"section\">closable</h2>\n  <p data-note>When false, hides the close button and prevents Escape key dismissal.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"closable (default)\">\n      <button-ui text=\"Closable\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Closable\">\n        <p>This modal can be closed with the X button or Escape key.</p>\n      </modal-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"not closable\">\n      <button-ui text=\"Not Closable\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Mandatory Action\" permanent>\n        <p>This modal must be resolved through its action buttons.</p>\n        <div slot=\"footer\" style=\"display:flex; gap:var(--a-space-2); justify-content:flex-end;\">\n          <button-ui text=\"I Understand\" variant=\"primary\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n        </div>\n      </modal-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/modal/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/modal-combinations.json

@@ -0,0 +1,15 @@
+{
+  "name": "modal-combinations",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/modal",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "combinations"
+  },
+  "html": "<section data-section data-property=\"combinations\" data-chunk=\"modal-combinations\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Modals with various content layouts.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"form modal\">\n      <button-ui text=\"Open Form Modal\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Create New Project\" size=\"md\">\n        <div style=\"display:flex; flex-direction:column; gap:var(--a-space-3);\">\n          <field-ui label=\"Project Name\">\n            <input-ui placeholder=\"My Project\" required></input-ui>\n          </field-ui>\n          <field-ui label=\"Description\">\n            <textarea-ui placeholder=\"Describe your project...\" 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=\"private\">Private</option>\n          </select-ui>\n          </field-ui>\n        </div>\n        <div slot=\"footer\" style=\"display:flex; gap:var(--a-space-2); justify-content:flex-end;\">\n          <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n          <button-ui text=\"Create Project\" variant=\"primary\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n        </div>\n      </modal-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"tabs inside modal\">\n      <button-ui text=\"Open Settings\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Preferences\" size=\"lg\">\n        <tabs-ui value=\"general\">\n          <tab-ui value=\"general\" text=\"General\">\n            <div style=\"display:flex; flex-direction:column; gap:var(--a-space-2); padding:var(--a-space-2) 0;\">\n              <field-ui label=\"Dark mode\" inline>\n                <switch-ui checked></switch-ui>\n              </field-ui>\n              <field-ui label=\"Compact view\" inline>\n                <switch-ui></switch-ui>\n              </field-ui>\n            </div>\n          </tab-ui>\n          <tab-ui value=\"account\" text=\"Account\">\n            <div style=\"display:flex; flex-direction:column; gap:var(--a-space-3); padding:var(--a-space-2) 0;\">\n              <field-ui label=\"Email\">\n                <input-ui value=\"user@example.com\"></input-ui>\n              </field-ui>\n            </div>\n          </tab-ui>\n        </tabs-ui>\n        <div slot=\"footer\" style=\"display:flex; gap:var(--a-space-2); justify-content:flex-end;\">\n          <button-ui text=\"Done\" variant=\"primary\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n        </div>\n      </modal-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/modal/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/modal-edge-cases.json

@@ -0,0 +1,15 @@
+{
+  "name": "modal-edge-cases",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/modal",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "edge-cases"
+  },
+  "html": "<section data-section data-property=\"edge-cases\" data-chunk=\"modal-edge-cases\">\n  <h2 variant=\"section\">Edge Cases</h2>\n  <p data-note>Boundary conditions.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"no body content\">\n      <button-ui text=\"Empty Modal\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Empty\"></modal-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"scrollable content\">\n      <button-ui text=\"Long Content\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Terms of Service\">\n        <div style=\"max-height:300px; overflow-y:auto;\">\n          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>\n          <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident.</p>\n          <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.</p>\n          <p>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</p>\n          <p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias.</p>\n        </div>\n        <div slot=\"footer\" style=\"display:flex; gap:var(--a-space-2); justify-content:flex-end;\">\n          <button-ui text=\"Decline\" variant=\"ghost\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n          <button-ui text=\"Accept\" variant=\"primary\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n        </div>\n      </modal-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/modal/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/modal-open.json

@@ -0,0 +1,15 @@
+{
+  "name": "modal-open",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/modal",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "open"
+  },
+  "html": "<section data-section data-property=\"open\" data-chunk=\"modal-open\">\n  <h2 variant=\"section\">open</h2>\n  <p data-note>When set, the modal is rendered open. Shown inline as a static preview.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"open=true\" style=\"min-height:240px;position:relative;border:1px solid var(--a-border);border-radius:var(--a-radius);overflow:hidden;\">\n      <modal-ui open style=\"position:absolute;inset:0;\">\n        <header slot=\"header\"><h3>Confirm Action</h3></header>\n        <p>This modal is statically open for preview.</p>\n        <footer slot=\"footer\"><button-ui text=\"Cancel\" variant=\"ghost\"></button-ui><button-ui text=\"Confirm\" variant=\"primary\"></button-ui></footer>\n      </modal-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/modal/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/modal-size-xl.json

@@ -0,0 +1,15 @@
+{
+  "name": "modal-size-xl",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/modal",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "size-xl"
+  },
+  "html": "<section data-section data-property=\"size-xl\" data-chunk=\"modal-size-xl\">\n  <h2 variant=\"section\">size: xl</h2>\n  <p data-note>Extra-large modal size for wide dialog content.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"size=xl\" style=\"min-height:260px;position:relative;border:1px solid var(--a-border);border-radius:var(--a-radius);overflow:hidden;\">\n      <modal-ui open size=\"xl\" style=\"position:absolute;inset:0;\">\n        <header slot=\"header\"><h3>Extra Large Modal</h3></header>\n        <p>Full-width dialog for complex flows.</p>\n      </modal-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/modal/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/modal-size.json

@@ -0,0 +1,15 @@
+{
+  "name": "modal-size",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/modal",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "size"
+  },
+  "html": "<section data-section data-property=\"size\" data-chunk=\"modal-size\">\n  <h2 variant=\"section\">size</h2>\n  <p data-note>Controls the panel width. Defaults to \"md\".</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      <modal-ui text=\"Small Modal\" size=\"sm\">\n        <p>A compact modal for simple confirmations.</p>\n      </modal-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      <modal-ui text=\"Medium Modal\" size=\"md\">\n        <p>The default modal size, suitable for most content.</p>\n      </modal-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      <modal-ui text=\"Large Modal\" size=\"lg\">\n        <p>A wider modal for complex forms or detailed content.</p>\n      </modal-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/modal/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/modal-text.json

@@ -0,0 +1,15 @@
+{
+  "name": "modal-text",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/modal",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "text"
+  },
+  "html": "<section data-section data-property=\"text\" data-chunk=\"modal-text\">\n  <h2 variant=\"section\">text</h2>\n  <p data-note>Sets the modal header title and aria-label.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"with title\">\n      <button-ui text=\"With Title\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Edit Profile\">\n        <div style=\"display:flex; flex-direction:column; gap:var(--a-space-3);\">\n          <field-ui label=\"Name\">\n            <input-ui placeholder=\"Your name\"></input-ui>\n          </field-ui>\n          <field-ui label=\"Email\">\n            <input-ui placeholder=\"you@example.com\"></input-ui>\n          </field-ui>\n        </div>\n        <div slot=\"footer\" style=\"display:flex; gap:var(--a-space-2); justify-content:flex-end;\">\n          <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n          <button-ui text=\"Save\" variant=\"primary\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n        </div>\n      </modal-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"no title\">\n      <button-ui text=\"No Title\" variant=\"outline\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui>\n        <p>A modal without a title. The close button is still available.</p>\n      </modal-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/modal/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/modal-trigger.json

@@ -0,0 +1,15 @@
+{
+  "name": "modal-trigger",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/modal",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "trigger"
+  },
+  "html": "<section data-section data-property=\"trigger\" data-chunk=\"modal-trigger\">\n  <h2 variant=\"section\">trigger pattern</h2>\n  <p data-note>To open a modal interactively, set its open attribute to true via JavaScript: modalEl.open = true. Use onclick attributes for simple triggers.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"click to open\">\n      <button-ui text=\"Interactive\" variant=\"primary\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Interactive Modal\">\n        <p>This modal was opened by clicking the trigger button.</p>\n        <div slot=\"footer\" style=\"display:flex; gap:var(--a-space-2); justify-content:flex-end;\">\n          <button-ui text=\"Close\" variant=\"ghost\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n          <button-ui text=\"Confirm\" variant=\"primary\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n        </div>\n      </modal-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"danger confirmation\">\n      <button-ui text=\"Delete Item\" color=\"danger\" onclick=\"this.nextElementSibling.open=true\"></button-ui>\n      <modal-ui text=\"Delete Confirmation\" size=\"sm\">\n        <p>Are you sure you want to delete this item? This action cannot be undone.</p>\n        <div slot=\"footer\" style=\"display:flex; gap:var(--a-space-2); justify-content:flex-end;\">\n          <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n          <button-ui text=\"Delete\" color=\"danger\" onclick=\"this.closest('modal-ui').open=false\"></button-ui>\n        </div>\n      </modal-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/modal/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/noodles-animated.json

@@ -0,0 +1,15 @@
+{
+  "name": "noodles-animated",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/noodles",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "animated"
+  },
+  "html": "<section data-section data-property=\"animated\" data-chunk=\"noodles-animated\">\n  <h2 variant=\"section\">animated</h2>\n  <p data-note>Animates the connection paths with a flow effect.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"animated\">\n      <noodles-ui id=\"noodle-animated\" animated style=\"position:relative; width:400px; height:160px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Start</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">End</div>\n      </noodles-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/noodles/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/noodles-color.json

@@ -0,0 +1,15 @@
+{
+  "name": "noodles-color",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/noodles",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "color"
+  },
+  "html": "<section data-section data-property=\"color\" data-chunk=\"noodles-color\">\n  <h2 variant=\"section\">color</h2>\n  <p data-note>Override the connection stroke color via CSS color value.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"accent color\">\n      <noodles-ui id=\"noodle-color-accent\" color=\"var(--a-accent)\" style=\"position:relative; width:400px; height:160px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label='color=\"crimson\"'>\n      <noodles-ui id=\"noodle-color-danger\" color=\"crimson\" style=\"position:relative; width:400px; height:160px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/noodles/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/noodles-curve.json

@@ -0,0 +1,15 @@
+{
+  "name": "noodles-curve",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/noodles",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "curve"
+  },
+  "html": "<section data-section data-property=\"curve\" data-chunk=\"noodles-curve\">\n  <h2 variant=\"section\">curve</h2>\n  <p data-note>Connection curve style. Nodes and connections must be set via JavaScript.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"bezier (default)\">\n      <noodles-ui id=\"noodle-bezier\" style=\"position:relative; width:400px; height:200px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:30px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Node A</div>\n        <div data-noodle-port=\"left right\" style=\"position:absolute; left:160px; top:90px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Node B</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:300px; top:40px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Node C</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"step\">\n      <noodles-ui id=\"noodle-step\" curve=\"step\" style=\"position:relative; width:400px; height:200px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:30px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Node A</div>\n        <div data-noodle-port=\"left right\" style=\"position:absolute; left:160px; top:90px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Node B</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:300px; top:40px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Node C</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"straight\">\n      <noodles-ui id=\"noodle-straight\" curve=\"straight\" style=\"position:relative; width:400px; height:200px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:30px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Node A</div>\n        <div data-noodle-port=\"left right\" style=\"position:absolute; left:160px; top:90px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Node B</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:300px; top:40px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Node C</div>\n      </noodles-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/noodles/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/noodles-editable.json

@@ -0,0 +1,15 @@
+{
+  "name": "noodles-editable",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/noodles",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "editable"
+  },
+  "html": "<section data-section data-property=\"editable\" data-chunk=\"noodles-editable\">\n  <h2 variant=\"section\">editable + show-ports</h2>\n  <p data-note>Enables interactive drag-to-connect with visible port indicators.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"editable + show-ports\">\n      <noodles-ui id=\"noodle-editable\" editable show-ports style=\"position:relative; width:400px; height:200px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right bottom\" style=\"position:absolute; left:20px; top:30px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Source</div>\n        <div data-noodle-port=\"left right top\" style=\"position:absolute; left:160px; top:100px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Middle</div>\n        <div data-noodle-port=\"left top\" style=\"position:absolute; left:300px; top:40px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">Target</div>\n      </noodles-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/noodles/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/noodles-portSize.json

@@ -0,0 +1,15 @@
+{
+  "name": "noodles-portSize",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/noodles",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "portSize"
+  },
+  "html": "<section data-section data-property=\"portSize\" data-chunk=\"noodles-portSize\">\n  <h2 variant=\"section\">port-size</h2>\n  <p data-note>Diameter of port indicator dots in pixels. Defaults to 10.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"port-size=6\">\n      <noodles-ui id=\"noodle-ps-sm\" show-ports port-size=\"6\" style=\"position:relative; width:400px; height:140px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"port-size=10 (default)\">\n      <noodles-ui id=\"noodle-ps-md\" show-ports port-size=\"10\" style=\"position:relative; width:400px; height:140px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"port-size=16\">\n      <noodles-ui id=\"noodle-ps-lg\" show-ports port-size=\"16\" style=\"position:relative; width:400px; height:140px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/noodles/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/noodles-readonly.json

@@ -0,0 +1,15 @@
+{
+  "name": "noodles-readonly",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/noodles",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "readonly"
+  },
+  "html": "<section data-section data-property=\"readonly\" data-chunk=\"noodles-readonly\">\n  <h2 variant=\"section\">readonly</h2>\n  <p data-note>View-only; connections render but no drag or edit.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"readonly\">\n      <noodles-ui id=\"noodle-readonly\" readonly style=\"position:relative; width:400px; height:160px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/noodles/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/noodles-showPorts.json

@@ -0,0 +1,15 @@
+{
+  "name": "noodles-showPorts",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/noodles",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "showPorts"
+  },
+  "html": "<section data-section data-property=\"showPorts\" data-chunk=\"noodles-showPorts\">\n  <h2 variant=\"section\">show-ports</h2>\n  <p data-note>Show port indicator dots on each declared port. Useful for discoverability in editable graphs.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"show-ports=false\">\n      <noodles-ui id=\"noodle-ports-off\" style=\"position:relative; width:400px; height:160px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right bottom\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left top\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"show-ports\">\n      <noodles-ui id=\"noodle-ports-on\" show-ports style=\"position:relative; width:400px; height:160px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right bottom\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left top\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/noodles/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/noodles-strokeWidth.json

@@ -0,0 +1,15 @@
+{
+  "name": "noodles-strokeWidth",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/noodles",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "strokeWidth"
+  },
+  "html": "<section data-section data-property=\"strokeWidth\" data-chunk=\"noodles-strokeWidth\">\n  <h2 variant=\"section\">stroke-width</h2>\n  <p data-note>SVG stroke width in pixels. Defaults to 2.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"stroke-width=1\">\n      <noodles-ui id=\"noodle-sw-1\" stroke-width=\"1\" style=\"position:relative; width:400px; height:140px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"stroke-width=4\">\n      <noodles-ui id=\"noodle-sw-4\" stroke-width=\"4\" style=\"position:relative; width:400px; height:140px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"stroke-width=8\">\n      <noodles-ui id=\"noodle-sw-8\" stroke-width=\"8\" style=\"position:relative; width:400px; height:140px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:50px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/noodles/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/noodles-tension.json

@@ -0,0 +1,15 @@
+{
+  "name": "noodles-tension",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/noodles",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "tension"
+  },
+  "html": "<section data-section data-property=\"tension\" data-chunk=\"noodles-tension\">\n  <h2 variant=\"section\">tension</h2>\n  <p data-note>Bezier control-point offset multiplier. Higher values create more pronounced curves. Defaults to 0.5.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"tension=0.1 (flat)\">\n      <noodles-ui id=\"noodle-tension-lo\" tension=\"0.1\" style=\"position:relative; width:400px; height:160px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:30px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:100px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"tension=0.5 (default)\">\n      <noodles-ui id=\"noodle-tension-md\" tension=\"0.5\" style=\"position:relative; width:400px; height:160px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:30px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:100px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"tension=1.2 (loopy)\">\n      <noodles-ui id=\"noodle-tension-hi\" tension=\"1.2\" style=\"position:relative; width:400px; height:160px; border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-md);\">\n        <div data-noodle-port=\"right\" style=\"position:absolute; left:20px; top:30px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">A</div>\n        <div data-noodle-port=\"left\" style=\"position:absolute; left:280px; top:100px; padding:var(--a-space-2) var(--a-space-3); background:var(--a-canvas-2); border:1px solid var(--a-border-subtle); border-radius:var(--a-radius-sm);\">B</div>\n      </noodles-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/noodles/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/onb-completion.json

@@ -0,0 +1,14 @@
+{
+  "name": "onb-completion",
+  "kind": "block",
+  "primary": "div",
+  "page": "/site/examples/onboarding/complete",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-onb-form": ""
+  },
+  "html": "<div data-onb-form data-chunk=\"onb-completion\">\n      <timeline-ui aria-label=\"What you set up during onboarding\">\n        <timeline-item-ui status=\"completed\" variant=\"success\"\n                          text=\"Role + workspace\"\n                          description=\"Developer · Acme\"\n                          time=\"Settings → Profile\"></timeline-item-ui>\n        <timeline-item-ui status=\"completed\" variant=\"success\"\n                          text=\"Source connected\"\n                          description=\"GitHub · 23 repos\"\n                          time=\"Settings → Integrations\"></timeline-item-ui>\n        <timeline-item-ui status=\"completed\" variant=\"success\"\n                          text=\"First dashboard\"\n                          description=\"Weekly revenue · 6-month trend (pinned to home)\"\n                          time=\"Pinned\"></timeline-item-ui>\n        <timeline-item-ui status=\"completed\" variant=\"success\"\n                          text=\"Notifications\"\n                          description=\"Weekly digest · in-app mentions on\"\n                          time=\"Settings → Notifications\"></timeline-item-ui>\n        <timeline-item-ui icon=\"circle-dashed\"\n                          text=\"Mobile app\"\n                          description=\"Skipped — install link emailed for later\"\n                          time=\"Skipped\"></timeline-item-ui>\n        <timeline-item-ui icon=\"circle-dashed\"\n                          text=\"Browser extension\"\n                          description=\"Add any time from settings → Devices\"\n                          time=\"Skipped\"></timeline-item-ui>\n      </timeline-ui>\n\n      <alert-ui variant=\"info\" icon=\"lightbulb\">\n        <span slot=\"content\"><strong>Tip:</strong> press <kbd-ui>⌘</kbd-ui> <kbd-ui>K</kbd-ui> anywhere in AdiaUI to open the search palette — fastest way to find a dashboard, jump to a setting, or trigger a generation.</span>\n      </alert-ui>\n    </div>",
+  "source": "site/pages/examples/onboarding/complete/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}