@adia-ai/a2ui-corpus 0.0.2 → 0.0.3

package/chunks/chat-streaming.json

@@ -0,0 +1,15 @@
+{
+  "name": "chat-streaming",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/chat",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "streaming"
+  },
+  "html": "<section data-section data-property=\"streaming\" data-chunk=\"chat-streaming\">\n  <h2 variant=\"section\">streaming</h2>\n  <p data-note>Enable the streaming cursor by setting the <code>streaming</code> attribute on an in-progress assistant message.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"streaming\">\n      <chat-ui>\n        <div role=\"user\">Explain black holes briefly.</div>\n        <div role=\"assistant\" streaming>A black hole is a region of spacetime where gravity is so strong that</div>\n      </chat-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/components/chat/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/chat-with-input.json

@@ -0,0 +1,15 @@
+{
+  "name": "chat-with-input",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/chat",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "with-input"
+  },
+  "html": "<section data-section data-property=\"with-input\" data-chunk=\"chat-with-input\">\n  <h2 variant=\"section\">with input</h2>\n  <p data-note>Compose with <code>chat-input-ui</code> for a full conversation surface.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"with-input\">\n      <chat-ui>\n        <div role=\"user\">Give me a short haiku about the ocean.</div>\n        <div role=\"assistant\">\n          Waves whisper secrets —<br>\n          the tide retreats then returns,<br>\n          carrying the moon.\n        </div>\n      </chat-ui>\n      <chat-input-ui placeholder=\"Type a message...\"></chat-input-ui>\n    </div>\n  </div>\n</section>",
+  "source": "site/pages/components/chat/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/check-checked.json

@@ -0,0 +1,15 @@
+{
+  "name": "check-checked",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/check",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "checked"
+  },
+  "html": "<section data-section data-property=\"checked\" data-chunk=\"check-checked\">\n  <h2 variant=\"section\">checked</h2>\n  <p data-note>Controls the checked state. Click to toggle.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"unchecked\">\n      <field-ui label=\"Unchecked\" inline>\n        <check-ui></check-ui>\n      </field-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"checked\">\n      <field-ui label=\"Checked\" inline>\n        <check-ui checked></check-ui>\n      </field-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/check/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/check-combinations.json

@@ -0,0 +1,15 @@
+{
+  "name": "check-combinations",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/check",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "combinations"
+  },
+  "html": "<section data-section data-property=\"combinations\" data-chunk=\"check-combinations\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Common checkbox group patterns.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"settings group\">\n      <div style=\"display:flex; flex-direction:column; gap:var(--a-space-2);\">\n        <field-ui label=\"Email notifications\" inline>\n          <check-ui checked></check-ui>\n        </field-ui>\n        <field-ui label=\"Push notifications\" inline>\n          <check-ui checked></check-ui>\n        </field-ui>\n        <field-ui label=\"SMS alerts\" inline>\n          <check-ui></check-ui>\n        </field-ui>\n        <field-ui label=\"Slack integration\" inline>\n          <check-ui disabled></check-ui>\n        </field-ui>\n      </div>\n      </div>\n    <div data-artifact-item data-artifact-label=\"parent-child\">\n      <div style=\"display:flex; flex-direction:column; gap:var(--a-space-2);\">\n        <field-ui label=\"Select All\" inline>\n          <check-ui indeterminate></check-ui>\n        </field-ui>\n        <field-ui label=\"Design\" inline>\n          <check-ui checked style=\"margin-left:var(--a-space-4);\"></check-ui>\n        </field-ui>\n        <field-ui label=\"Engineering\" inline>\n          <check-ui checked style=\"margin-left:var(--a-space-4);\"></check-ui>\n        </field-ui>\n        <field-ui label=\"Marketing\" inline>\n          <check-ui style=\"margin-left:var(--a-space-4);\"></check-ui>\n        </field-ui>\n      </div>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/check/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/check-disabled.json

@@ -0,0 +1,15 @@
+{
+  "name": "check-disabled",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/check",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "disabled"
+  },
+  "html": "<section data-section data-property=\"disabled\" data-chunk=\"check-disabled\">\n  <h2 variant=\"section\">disabled</h2>\n  <p data-note>Prevents interaction and applies muted styling.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"disabled unchecked\">\n      <field-ui label=\"Disabled Unchecked\" inline>\n        <check-ui disabled></check-ui>\n      </field-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"disabled checked\">\n      <field-ui label=\"Disabled Checked\" inline>\n        <check-ui checked disabled></check-ui>\n      </field-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"disabled indeterminate\">\n      <field-ui label=\"Disabled Indeterminate\" inline>\n        <check-ui indeterminate disabled></check-ui>\n      </field-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/check/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/check-edge-cases.json

@@ -0,0 +1,15 @@
+{
+  "name": "check-edge-cases",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/check",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "edge-cases"
+  },
+  "html": "<section data-section data-property=\"edge-cases\" data-chunk=\"check-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=\"bare (no props)\">\n      <check-ui></check-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"checked + indeterminate\">\n      <field-ui label=\"Both checked + indeterminate\" inline>\n        <check-ui checked indeterminate></check-ui>\n      </field-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/check/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/check-indeterminate.json

@@ -0,0 +1,15 @@
+{
+  "name": "check-indeterminate",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/check",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "indeterminate"
+  },
+  "html": "<section data-section data-property=\"indeterminate\" data-chunk=\"check-indeterminate\">\n  <h2 variant=\"section\">indeterminate</h2>\n  <p data-note>A third visual state for \"partially selected\" groups. Displays a dash instead of a checkmark.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"indeterminate\">\n      <field-ui label=\"Select All\" inline>\n        <check-ui indeterminate></check-ui>\n      </field-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"checked (all)\">\n      <field-ui label=\"All Selected\" inline>\n        <check-ui checked></check-ui>\n      </field-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"unchecked (none)\">\n      <field-ui label=\"None Selected\" inline>\n        <check-ui></check-ui>\n      </field-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/check/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/check-label.json

@@ -0,0 +1,15 @@
+{
+  "name": "check-label",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/check",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "label"
+  },
+  "html": "<section data-section data-property=\"label\" data-chunk=\"check-label\">\n  <h2 variant=\"section\">label</h2>\n  <p data-note>Accessible label rendered as aria-label. The label text is part of the component display.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"with label\">\n      <field-ui label=\"Accept terms and conditions\" inline>\n        <check-ui></check-ui>\n      </field-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"no label\">\n      <check-ui></check-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"long label\">\n      <field-ui label=\"I agree to the privacy policy, terms of service, and community guidelines\" inline>\n        <check-ui checked></check-ui>\n      </field-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/check/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/check-size.json

@@ -0,0 +1,15 @@
+{
+  "name": "check-size",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/check",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "size"
+  },
+  "html": "<section data-section data-property=\"size\" data-chunk=\"check-size\">\n  <h2 variant=\"section\">size</h2>\n  <p data-note>Controls the dimensions. Defaults to \"md\".</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"sm\">\n      <field-ui label=\"Small\" inline>\n        <check-ui size=\"sm\"></check-ui>\n      </field-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"md (default)\">\n      <field-ui label=\"Medium\" inline>\n        <check-ui checked></check-ui>\n      </field-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"lg\">\n      <field-ui label=\"Large\" inline>\n        <check-ui size=\"lg\"></check-ui>\n      </field-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/check/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-bare.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-bare",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "bare"
+  },
+  "html": "<section data-section data-property=\"bare\" data-chunk=\"code-bare\">\n  <h2 variant=\"section\">bare (no chrome)</h2>\n  <p data-note>The <code>bare</code> attribute omits the header chrome (language label + copy button). Useful for embedded editor surfaces inside panes or cards where the host already provides chrome.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"bare editable\">\n      <code-ui bare editable language=\"yaml\">name: AdiaBadge\ntag: badge-ui\ncategory: utility\nprops:\n  variant:\n    type: string\n    default: solid</code-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-combo.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-combo",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-combo": ""
+  },
+  "html": "<section data-section data-combo data-chunk=\"code-combo\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Inline and block code used together in context.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"inline + block together\">\n      <p>Import the <code-ui inline>AdiaElement</code-ui> base class and extend it:</p>\n      <code-ui language=\"js\">import { AdiaElement } from '@core/element.js';\n\nclass MyWidget extends AdiaElement {\n  static properties = {\n    label: { type: String, default: '', reflect: true },\n  };\n}</code-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-disabled-readonly.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-disabled-readonly",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "disabled-readonly"
+  },
+  "html": "<section data-section data-property=\"disabled-readonly\" data-chunk=\"code-disabled-readonly\">\n  <h2 variant=\"section\">disabled / readonly</h2>\n  <p data-note>Both block input. <code>disabled</code> also excludes the editor from form submission and grays it out. <code>readonly</code> still submits with the form.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"disabled\">\n      <code-ui editable language=\"json\" disabled>{ \"locked\": true }</code-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"readonly\">\n      <code-ui editable language=\"json\" readonly>{ \"readonly\": true }</code-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-edge.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-edge",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-edge": ""
+  },
+  "html": "<section data-section data-edge data-chunk=\"code-edge\">\n  <h2 variant=\"section\">Edge Cases</h2>\n  <p data-note>Boundary conditions and unusual content.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"single character\">\n      <code-ui language=\"js\">x</code-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"empty inline\">\n      <code-ui inline></code-ui>\n      </div>\n    <div data-artifact-item data-artifact-label=\"many lines\">\n      <code-ui language=\"txt\">Line 1\nLine 2\nLine 3\nLine 4\nLine 5\nLine 6\nLine 7\nLine 8\nLine 9\nLine 10\nLine 11\nLine 12\nLine 13\nLine 14\nLine 15</code-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-editable.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-editable",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "editable"
+  },
+  "html": "<section data-section data-property=\"editable\" data-chunk=\"code-editable\">\n  <h2 variant=\"section\">editable</h2>\n  <p data-note>Add <code>editable</code> to turn the block into a live CodeMirror editor. The element emits <code>input</code> on every doc change, <code>change</code> on blur-with-modifications, and <code>save</code> on Mod+S.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"editable json\">\n      <code-ui editable language=\"json\" placeholder=\"Paste JSON here…\">{\n  \"name\": \"AdiaUI\",\n  \"components\": 80,\n  \"version\": \"0.0.13\"\n}</code-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label=\"editable javascript\">\n      <code-ui editable language=\"javascript\" line-numbers>function fibonacci(n) {\n  if (n < 2) return n;\n  return fibonacci(n - 1) + fibonacci(n - 2);\n}</code-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-form-association.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-form-association",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "form-association"
+  },
+  "html": "<section data-section data-property=\"form-association\" data-chunk=\"code-form-association\">\n  <h2 variant=\"section\">Form-association</h2>\n  <p data-note>Editable <code>&lt;code-ui&gt;</code> is a Form-Associated Custom Element (FACE). Set <code>name</code> to participate in form submission; <code>required</code> blocks submit when empty; <code>disabled</code> and <code>readonly</code> behave per the native form-control idiom.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"inside a form — name + required\">\n      <form onsubmit=\"event.preventDefault(); alert('Submitted:\\n' + new FormData(event.target).get('schema'));\">\n        <field-ui label=\"Schema JSON\">\n          <code-ui editable language=\"json\" name=\"schema\" required placeholder=\"Enter JSON…\">{ \"hello\": \"world\" }</code-ui>\n        </field-ui>\n        <div data-mt-sm>\n          <button-ui type=\"submit\" text=\"Submit\" variant=\"primary\"></button-ui>\n          <button-ui type=\"reset\" text=\"Reset\"></button-ui>\n        </div>\n      </form>\n      </div>\n  </div>\n  <p data-note data-mt-sm>Clear the editor and submit — the form blocks with a <code>valueMissing</code> error (custom message via <code>data-msg-required</code>). Reset restores the initial document.</p>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-inline.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-inline",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "inline"
+  },
+  "html": "<section data-section data-property=\"inline\" data-chunk=\"code-inline\">\n  <h2 variant=\"section\">inline</h2>\n  <p data-note>Inline code runs within a paragraph. Set the <code>inline</code> attribute.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"inline in paragraph\">\n      <p>Use <code-ui inline>const x = 42</code-ui> to declare a variable, or call <code-ui inline>Array.from()</code-ui> to convert iterables.</p>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-language.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-language",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "language"
+  },
+  "html": "<section data-section data-property=\"language\" data-chunk=\"code-language\">\n  <h2 variant=\"section\">block with language</h2>\n  <p data-note>Block code renders in a pre/code wrapper with a language label and copy button.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label='language=\"js\"'>\n      <code-ui language=\"js\">function greet(name) {\n  return `Hello, ${name}!`;\n}\n\nconst result = greet('AdiaUI');\nconsole.log(result);</code-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label='language=\"css\"'>\n      <code-ui language=\"css\">:root {\n  --a-accent-hue: 267;\n  --a-accent-c-max: 0.18;\n}\n\nbutton-ui {\n  color: var(--a-fg);\n  background: var(--a-canvas-bg);\n}</code-ui>\n      </div>\n  </div>\n  <div data-artifact-container data-mt-sm>\n    <div data-artifact-item data-artifact-label='language=\"html\"'>\n      <code-ui language=\"html\">&lt;div class=\"container\"&gt;\n  &lt;field-ui label=\"Email\"&gt;\n    &lt;input-ui placeholder=\"you@example.com\"&gt;&lt;/input-ui&gt;\n  &lt;/field-ui&gt;\n  &lt;button-ui text=\"Submit\" variant=\"primary\"&gt;&lt;/button-ui&gt;\n&lt;/div&gt;</code-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-line-numbers.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-line-numbers",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "line-numbers"
+  },
+  "html": "<section data-section data-property=\"line-numbers\" data-chunk=\"code-line-numbers\">\n  <h2 variant=\"section\">line-numbers</h2>\n  <p data-note>Add <code>line-numbers</code> to show a gutter. Works in both read-only and editable modes.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"read-only with line numbers\">\n      <code-ui language=\"javascript\" line-numbers>const scheduler = {\n  queue: [],\n  enqueue(task) { this.queue.push(task); },\n  flush() {\n    while (this.queue.length) {\n      const task = this.queue.shift();\n      task();\n    }\n  },\n};</code-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-lint-gutter.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-lint-gutter",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "lint-gutter"
+  },
+  "html": "<section data-section data-property=\"lint-gutter\" data-chunk=\"code-lint-gutter\">\n  <h2 variant=\"section\">JSON lint gutter</h2>\n  <p data-note>Editable JSON editors get a parse-error gutter + inline wavy underline + tooltip automatically. Try introducing a missing comma or unterminated string below.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"malformed json — see the gutter marker\">\n      <code-ui editable language=\"json\">{\n  \"name\": \"schema-draft\"\n  \"components\": 80,\n  \"note\": \"missing comma on the line above\"\n}</code-ui>\n      </div>\n  </div>\n  <p data-note data-mt-sm>Lint is visual-only — <code>.value</code> returns the raw document regardless of validity. Consumers that want stricter gating can wire validity manually on <code>input</code> events.</p>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-long-code.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-long-code",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "long-code"
+  },
+  "html": "<section data-section data-property=\"long-code\" data-chunk=\"code-long-code\">\n  <h2 variant=\"section\">long code (horizontal scroll)</h2>\n  <p data-note>Long lines overflow horizontally and scroll rather than wrapping.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"horizontal scroll\">\n      <code-ui language=\"js\">const longConfiguration = { apiEndpoint: 'https://api.example.com/v2/resources', timeout: 30000, retries: 3, headers: { 'Authorization': 'Bearer token_abc123', 'Content-Type': 'application/json', 'X-Request-Id': crypto.randomUUID() }, cache: { enabled: true, ttl: 3600, strategy: 'stale-while-revalidate' } };</code-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/code-no-language.json

@@ -0,0 +1,15 @@
+{
+  "name": "code-no-language",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/code",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "no-language"
+  },
+  "html": "<section data-section data-property=\"no-language\" data-chunk=\"code-no-language\">\n  <h2 variant=\"section\">block without language</h2>\n  <p data-note>Omitting the language attribute renders a generic block with \"code\" as the label.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"no language\">\n      <code-ui>npm install adia-ui\ncd my-project\nnpm run dev</code-ui>\n      </div>\n  </div>\n</section>",
+  "source": "site/pages/components/code/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/color-picker-default.json

@@ -0,0 +1,15 @@
+{
+  "name": "color-picker-default",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/color-picker",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "default"
+  },
+  "html": "<section data-section data-property=\"default\" data-chunk=\"color-picker-default\">\n  <h2 variant=\"section\">Default</h2>\n  <p data-note>Default color picker with initial value of #3b82f6.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"color-picker\">\n    <color-picker-ui></color-picker-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/color-picker/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/color-picker-disabled.json

@@ -0,0 +1,15 @@
+{
+  "name": "color-picker-disabled",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/color-picker",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "disabled"
+  },
+  "html": "<section data-section data-property=\"disabled\" data-chunk=\"color-picker-disabled\">\n  <h2 variant=\"section\">disabled</h2>\n  <p data-note>Prevents interaction.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"#3b82f6\">\n    <color-picker-ui value=\"#3b82f6\" disabled></color-picker-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/color-picker/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/color-picker-format.json

@@ -0,0 +1,15 @@
+{
+  "name": "color-picker-format",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/color-picker",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "format"
+  },
+  "html": "<section data-section data-property=\"format\" data-chunk=\"color-picker-format\">\n  <h2 variant=\"section\">format</h2>\n  <p data-note>Color output format: <code>hex</code>, <code>rgb</code>, or <code>hsl</code>.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"hex\"><color-picker-ui format=\"hex\" value=\"#4f46e5\"></color-picker-ui></div>\n    <div data-artifact-item data-artifact-label=\"rgb\"><color-picker-ui format=\"rgb\" value=\"rgb(79,70,229)\"></color-picker-ui></div>\n    <div data-artifact-item data-artifact-label=\"hsl\"><color-picker-ui format=\"hsl\" value=\"hsl(243,75%,59%)\"></color-picker-ui></div>\n  </div>\n</section>",
+  "source": "site/pages/components/color-picker/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/color-picker-name.json

@@ -0,0 +1,15 @@
+{
+  "name": "color-picker-name",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/color-picker",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "name"
+  },
+  "html": "<section data-section data-property=\"name\" data-chunk=\"color-picker-name\">\n  <h2 variant=\"section\">name</h2>\n  <p data-note>Form field name submitted with the chosen color value.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"name=color\"><color-picker-ui name=\"color\"></color-picker-ui></div>\n    <div data-artifact-item data-artifact-label=\"name=brand_color\"><color-picker-ui name=\"brand_color\"></color-picker-ui></div>\n  </div>\n</section>",
+  "source": "site/pages/components/color-picker/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/color-picker-value.json

@@ -0,0 +1,15 @@
+{
+  "name": "color-picker-value",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/color-picker",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "value"
+  },
+  "html": "<section data-section data-property=\"value\" data-chunk=\"color-picker-value\">\n  <h2 variant=\"section\">Pre-set Colors</h2>\n  <p data-note>Initialize with specific hex values.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"#3b82f6\">\n    <color-picker-ui value=\"#3b82f6\"></color-picker-ui>\n  </div>\n  <div data-artifact-item data-artifact-label=\"#ef4444\">\n    <color-picker-ui value=\"#ef4444\"></color-picker-ui>\n  </div>\n  <div data-artifact-item data-artifact-label=\"#22c55e\">\n    <color-picker-ui value=\"#22c55e\"></color-picker-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/color-picker/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/command-combo.json

@@ -0,0 +1,15 @@
+{
+  "name": "command-combo",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/command",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-combo": ""
+  },
+  "html": "<section data-section data-combo data-chunk=\"command-combo\">\n  <h2 variant=\"section\">Combinations</h2>\n  <p data-note>Full-featured command palette with all options combined.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"What do you need?\">\n    <command-ui placeholder=\"What do you need?\" style=\"width:32rem; max-height:24rem; border:1px solid var(--a-border); border-radius:var(--a-radius-lg);\">\n          <optgroup label=\"Quick Actions\">\n            <option value=\"new-chat\" data-icon=\"chat-circle\" data-shortcut=\"&#8984;N\">New Chat</option>\n            <option value=\"search\" data-icon=\"magnifying-glass\" data-shortcut=\"&#8984;K\">Search Everything</option>\n          </optgroup>\n          <optgroup label=\"Navigation\">\n            <option value=\"dashboard\" data-icon=\"chart-bar\">Dashboard</option>\n            <option value=\"settings\" data-icon=\"gear\">Settings</option>\n            <option value=\"members\" data-icon=\"users\">Team Members</option>\n          </optgroup>\n          <optgroup label=\"Theme\">\n            <option value=\"light\" data-icon=\"sun\">Light Mode</option>\n            <option value=\"dark\" data-icon=\"moon\">Dark Mode</option>\n            <option value=\"system\" data-icon=\"desktop\">System Theme</option>\n          </optgroup>\n          <optgroup label=\"Danger Zone\">\n            <option value=\"logout\" data-icon=\"sign-out\">Log Out</option>\n            <option value=\"delete-account\" data-icon=\"trash\">Delete Account</option>\n          </optgroup>\n        </command-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/command/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/command-edge.json

@@ -0,0 +1,15 @@
+{
+  "name": "command-edge",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/command",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-edge": ""
+  },
+  "html": "<section data-section data-edge data-chunk=\"command-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=\"Search...\">\n    <command-ui placeholder=\"Search...\" style=\"width:32rem; max-height:24rem; border:1px solid var(--a-border); border-radius:var(--a-radius-lg);\">\n          <optgroup label=\"Items\">\n            <option value=\"only\">Only Option</option>\n          </optgroup>\n        </command-ui>\n  </div>\n  <div data-artifact-item data-artifact-label=\"Search...\">\n    <command-ui placeholder=\"Search...\" style=\"width:32rem; max-height:24rem; border:1px solid var(--a-border); border-radius:var(--a-radius-lg);\">\n          <optgroup label=\"This is a very long group label\">\n            <option value=\"long\" data-icon=\"text-aa\" data-shortcut=\"&#8984;Shift+L\">This is a very long option label that tests overflow handling</option>\n            <option value=\"short\">Short</option>\n          </optgroup>\n        </command-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/command/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/command-grouped.json

@@ -0,0 +1,15 @@
+{
+  "name": "command-grouped",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/command",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "grouped"
+  },
+  "html": "<section data-section data-property=\"grouped\" data-chunk=\"command-grouped\">\n  <h2 variant=\"section\">grouped options with icons</h2>\n  <p data-note>Options are organized in optgroups. Each option can have a data-icon attribute for a leading icon.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"Type a command...\">\n    <command-ui placeholder=\"Type a command...\" style=\"width:32rem; max-height:24rem; border:1px solid var(--a-border); border-radius:var(--a-radius-lg);\">\n          <optgroup label=\"Navigation\">\n            <option value=\"home\" data-icon=\"house\">Go to Home</option>\n            <option value=\"projects\" data-icon=\"folder\">Go to Projects</option>\n            <option value=\"settings\" data-icon=\"gear\">Go to Settings</option>\n            <option value=\"profile\" data-icon=\"user\">Go to Profile</option>\n          </optgroup>\n          <optgroup label=\"Team\">\n            <option value=\"members\" data-icon=\"users\">View Members</option>\n            <option value=\"roles\" data-icon=\"shield\">Manage Roles</option>\n            <option value=\"invites\" data-icon=\"envelope\">Send Invites</option>\n          </optgroup>\n          <optgroup label=\"Account\">\n            <option value=\"billing\" data-icon=\"credit-card\">Billing</option>\n            <option value=\"logout\" data-icon=\"sign-out\">Log Out</option>\n          </optgroup>\n        </command-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/command/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/command-inline.json

@@ -0,0 +1,15 @@
+{
+  "name": "command-inline",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/command",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "inline"
+  },
+  "html": "<section data-section data-property=\"inline\" data-chunk=\"command-inline\">\n  <h2 variant=\"section\">inline (not in dialog)</h2>\n  <p data-note>The command component can render inline without a dialog wrapper. Useful for embedded search panels.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"Search commands...\">\n    <command-ui placeholder=\"Search commands...\" style=\"width:32rem; max-height:24rem; border:1px solid var(--a-border); border-radius:var(--a-radius-lg);\">\n          <optgroup label=\"Pages\">\n            <option value=\"home\" data-icon=\"house\">Home</option>\n            <option value=\"dashboard\" data-icon=\"chart-bar\">Dashboard</option>\n            <option value=\"settings\" data-icon=\"gear\">Settings</option>\n          </optgroup>\n          <optgroup label=\"Actions\">\n            <option value=\"new\" data-icon=\"plus\">Create New</option>\n            <option value=\"search\" data-icon=\"magnifying-glass\">Search</option>\n          </optgroup>\n        </command-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/command/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/command-open.json

@@ -0,0 +1,15 @@
+{
+  "name": "command-open",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/command",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "open"
+  },
+  "html": "<section data-section data-property=\"open\" data-chunk=\"command-open\">\n  <h2 variant=\"section\">open</h2>\n  <p data-note>When set, the command palette is rendered in its open state.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"open=true\"><command-ui open placeholder=\"Type a command...\" style=\"max-height:24rem;\"></command-ui></div>\n  </div>\n</section>",
+  "source": "site/pages/components/command/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/command-placeholder.json

@@ -0,0 +1,15 @@
+{
+  "name": "command-placeholder",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/command",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "placeholder"
+  },
+  "html": "<section data-section data-property=\"placeholder\" data-chunk=\"command-placeholder\">\n  <h2 variant=\"section\">placeholder</h2>\n  <p data-note>Placeholder text shown in the command palette search field.</p>\n  <div data-artifact-container>\n    <div data-artifact-item data-artifact-label=\"default\"><command-ui placeholder=\"Type a command...\" style=\"width:32rem;max-height:24rem;\"></command-ui></div>\n    <div data-artifact-item data-artifact-label=\"search files\"><command-ui placeholder=\"Search files...\" style=\"width:32rem;max-height:24rem;\"></command-ui></div>\n    <div data-artifact-item data-artifact-label=\"jump\"><command-ui placeholder=\"Jump to...\" style=\"width:32rem;max-height:24rem;\"></command-ui></div>\n  </div>\n</section>",
+  "source": "site/pages/components/command/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}

package/chunks/command-shortcuts.json

@@ -0,0 +1,15 @@
+{
+  "name": "command-shortcuts",
+  "kind": "block",
+  "primary": "section",
+  "page": "/site/components/command",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "data-section": "",
+    "data-property": "shortcuts"
+  },
+  "html": "<section data-section data-property=\"shortcuts\" data-chunk=\"command-shortcuts\">\n  <h2 variant=\"section\">with shortcuts</h2>\n  <p data-note>The data-shortcut attribute displays a keyboard hint on the right side of each option.</p>\n  <div data-artifact-container>\n  <div data-artifact-item data-artifact-label=\"Search...\">\n    <command-ui placeholder=\"Search...\" style=\"width:32rem; max-height:24rem; border:1px solid var(--a-border); border-radius:var(--a-radius-lg);\">\n          <optgroup label=\"Actions\">\n            <option value=\"new-file\" data-icon=\"file-plus\" data-shortcut=\"&#8984;N\">New File</option>\n            <option value=\"open\" data-icon=\"folder-open\" data-shortcut=\"&#8984;O\">Open File</option>\n            <option value=\"save\" data-icon=\"floppy-disk\" data-shortcut=\"&#8984;S\">Save</option>\n            <option value=\"find\" data-icon=\"magnifying-glass\" data-shortcut=\"&#8984;F\">Find</option>\n            <option value=\"replace\" data-icon=\"swap\" data-shortcut=\"&#8984;H\">Find &amp; Replace</option>\n          </optgroup>\n          <optgroup label=\"View\">\n            <option value=\"toggle-sidebar\" data-icon=\"sidebar\" data-shortcut=\"&#8984;B\">Toggle Sidebar</option>\n            <option value=\"toggle-theme\" data-icon=\"moon\" data-shortcut=\"&#8984;D\">Toggle Theme</option>\n            <option value=\"zen-mode\" data-icon=\"arrows-out\" data-shortcut=\"&#8984;K Z\">Zen Mode</option>\n          </optgroup>\n        </command-ui>\n  </div>\n</div>\n</section>",
+  "source": "site/pages/components/command/index.html",
+  "captured_at": "2026-04-28T04:46:20.743Z"
+}