@adia-ai/gen-ui 0.8.37

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

@@ -0,0 +1,151 @@
+{
+  "name": "form-drawer-simple-form",
+  "kind": "block",
+  "primary": "drawer-ui",
+  "page": "/packages/web-components/patterns/form-drawer/form-drawer.examples.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "text": "New project",
+    "side": "right",
+    "size": "md"
+  },
+  "html": "<drawer-ui text=\"New project\" side=\"right\" size=\"md\">\n        <section slot=\"body\">\n          <col-ui gap=\"3\">\n            <field-ui label=\"Name\">\n              <input-ui placeholder=\"My awesome project\" required></input-ui>\n            </field-ui>\n            <field-ui label=\"Description\">\n              <textarea-ui placeholder=\"What is this project for?\" rows=\"3\"></textarea-ui>\n            </field-ui>\n            <field-ui label=\"Visibility\">\n              <select-ui placeholder=\"Select visibility\">\n              <option value=\"public\">Public</option>\n              <option value=\"team\">Team only</option>\n              <option value=\"private\">Private</option>\n            </select-ui>\n            </field-ui>\n          </col-ui>\n        </section>\n        <footer slot=\"footer\">\n          <span slot=\"action\">\n            <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n            <button-ui text=\"Create\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n          </span>\n        </footer>\n      </drawer-ui>",
+  "source": "packages/web-components/patterns/form-drawer/form-drawer.examples.html",
+  "metadata": {
+    "domain": "forms",
+    "description": "Create-form drawer — 'New project' right-side drawer with name input, description textarea, and visibility select in the body, and Cancel / Create footer actions.",
+    "keywords": [
+      "drawer",
+      "form",
+      "create",
+      "new",
+      "project",
+      "name",
+      "description",
+      "visibility",
+      "right-side",
+      "panel",
+      "cancel",
+      "save",
+      "quick-create"
+    ]
+  },
+  "captured_at": "2026-07-29T09:15:19.217Z",
+  "template": [
+    {
+      "id": "input",
+      "component": "Input",
+      "required": true,
+      "placeholder": "My awesome project"
+    },
+    {
+      "id": "field",
+      "component": "Field",
+      "label": "Name",
+      "children": [
+        "input"
+      ]
+    },
+    {
+      "id": "text-area",
+      "component": "TextArea",
+      "placeholder": "What is this project for?",
+      "rows": "3"
+    },
+    {
+      "id": "field-2",
+      "component": "Field",
+      "label": "Description",
+      "children": [
+        "text-area"
+      ]
+    },
+    {
+      "id": "choice-picker",
+      "component": "ChoicePicker",
+      "placeholder": "Select visibility",
+      "options": [
+        {
+          "value": "public",
+          "label": "Public"
+        },
+        {
+          "value": "team",
+          "label": "Team only"
+        },
+        {
+          "value": "private",
+          "label": "Private"
+        }
+      ]
+    },
+    {
+      "id": "field-3",
+      "component": "Field",
+      "label": "Visibility",
+      "children": [
+        "choice-picker"
+      ]
+    },
+    {
+      "id": "column",
+      "component": "Column",
+      "gap": "3",
+      "children": [
+        "field",
+        "field-2",
+        "field-3"
+      ]
+    },
+    {
+      "id": "section",
+      "component": "Section",
+      "slot": "body",
+      "children": [
+        "column"
+      ]
+    },
+    {
+      "id": "button",
+      "component": "Button",
+      "text": "Cancel",
+      "variant": "ghost"
+    },
+    {
+      "id": "button-2",
+      "component": "Button",
+      "text": "Create",
+      "variant": "primary"
+    },
+    {
+      "id": "text",
+      "component": "Text",
+      "variant": "body",
+      "slot": "action",
+      "children": [
+        "button",
+        "button-2"
+      ]
+    },
+    {
+      "id": "footer",
+      "component": "Footer",
+      "slot": "footer",
+      "children": [
+        "text"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Drawer",
+      "side": "right",
+      "size": "md",
+      "text": "New project",
+      "children": [
+        "section",
+        "footer"
+      ]
+    }
+  ]
+}

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

@@ -0,0 +1,325 @@
+{
+  "name": "form-drawer-tall-form",
+  "kind": "block",
+  "primary": "drawer-ui",
+  "page": "/packages/web-components/patterns/form-drawer/form-drawer.examples.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "text": "Advanced settings",
+    "side": "right",
+    "size": "lg"
+  },
+  "html": "<drawer-ui text=\"Advanced settings\" side=\"right\" size=\"lg\">\n        <section slot=\"body\">\n          <col-ui gap=\"4\">\n            <col-ui gap=\"3\">\n              <h4>General</h4>\n              <field-ui label=\"Name\">\n                <input-ui value=\"Production API\"></input-ui>\n              </field-ui>\n              <field-ui label=\"Slug\">\n                <input-ui prefix=\"/\" value=\"production-api\"></input-ui>\n              </field-ui>\n              <field-ui label=\"Description\">\n                <textarea-ui rows=\"2\"></textarea-ui>\n              </field-ui>\n            </col-ui>\n            <col-ui gap=\"3\">\n              <h4>Limits</h4>\n              <range-ui label=\"Max concurrent requests\" value=\"100\" min=\"10\" max=\"1000\"></range-ui>\n              <range-ui label=\"Timeout (seconds)\" value=\"30\" min=\"5\" max=\"300\"></range-ui>\n              <range-ui label=\"Retry attempts\" value=\"3\" min=\"0\" max=\"10\"></range-ui>\n            </col-ui>\n            <col-ui gap=\"3\">\n              <h4>Access</h4>\n              <field-ui label=\"Require authentication\" inline>\n                <switch-ui checked></switch-ui>\n              </field-ui>\n              <field-ui label=\"Allow CORS\" inline>\n                <switch-ui checked></switch-ui>\n              </field-ui>\n              <field-ui label=\"Rate limit by IP\" inline>\n                <switch-ui></switch-ui>\n              </field-ui>\n              <field-ui label=\"Log all requests\" inline>\n                <switch-ui></switch-ui>\n              </field-ui>\n            </col-ui>\n            <col-ui gap=\"3\">\n              <h4>Notifications</h4>\n              <field-ui label=\"Email on errors\" inline>\n                <check-ui checked></check-ui>\n              </field-ui>\n              <field-ui label=\"Slack on deploys\" inline>\n                <check-ui></check-ui>\n              </field-ui>\n              <field-ui label=\"PagerDuty on outages\" inline>\n                <check-ui></check-ui>\n              </field-ui>\n            </col-ui>\n          </col-ui>\n        </section>\n        <footer slot=\"footer\">\n          <span slot=\"action\">\n            <button-ui text=\"Cancel\" variant=\"ghost\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n            <button-ui text=\"Save settings\" variant=\"primary\" onclick=\"this.closest('drawer-ui').open=false\"></button-ui>\n          </span>\n        </footer>\n      </drawer-ui>",
+  "source": "packages/web-components/patterns/form-drawer/form-drawer.examples.html",
+  "metadata": {
+    "domain": "forms",
+    "description": "Tall sectioned form drawer — large right-side drawer whose body groups fields under headings (General, then advanced sections) with a scrolling body and pinned footer.",
+    "keywords": [
+      "drawer",
+      "form",
+      "tall",
+      "sections",
+      "advanced",
+      "settings",
+      "general",
+      "slug",
+      "headings",
+      "scroll",
+      "long",
+      "panel",
+      "grouped",
+      "fields"
+    ]
+  },
+  "captured_at": "2026-07-29T09:15:19.217Z",
+  "template": [
+    {
+      "id": "text",
+      "component": "Text",
+      "variant": "subsection",
+      "textContent": "General"
+    },
+    {
+      "id": "input",
+      "component": "Input",
+      "value": "Production API"
+    },
+    {
+      "id": "field",
+      "component": "Field",
+      "label": "Name",
+      "children": [
+        "input"
+      ]
+    },
+    {
+      "id": "input-2",
+      "component": "Input",
+      "prefix": "/",
+      "value": "production-api"
+    },
+    {
+      "id": "field-2",
+      "component": "Field",
+      "label": "Slug",
+      "children": [
+        "input-2"
+      ]
+    },
+    {
+      "id": "text-area",
+      "component": "TextArea",
+      "rows": "2"
+    },
+    {
+      "id": "field-3",
+      "component": "Field",
+      "label": "Description",
+      "children": [
+        "text-area"
+      ]
+    },
+    {
+      "id": "column-2",
+      "component": "Column",
+      "gap": "3",
+      "children": [
+        "text",
+        "field",
+        "field-2",
+        "field-3"
+      ]
+    },
+    {
+      "id": "text-2",
+      "component": "Text",
+      "variant": "subsection",
+      "textContent": "Limits"
+    },
+    {
+      "id": "range",
+      "component": "Range",
+      "label": "Max concurrent requests",
+      "max": 1000,
+      "min": 10,
+      "value": 100
+    },
+    {
+      "id": "range-2",
+      "component": "Range",
+      "label": "Timeout (seconds)",
+      "max": 300,
+      "min": 5,
+      "value": 30
+    },
+    {
+      "id": "range-3",
+      "component": "Range",
+      "label": "Retry attempts",
+      "max": 10,
+      "min": 0,
+      "value": 3
+    },
+    {
+      "id": "column-3",
+      "component": "Column",
+      "gap": "3",
+      "children": [
+        "text-2",
+        "range",
+        "range-2",
+        "range-3"
+      ]
+    },
+    {
+      "id": "text-3",
+      "component": "Text",
+      "variant": "subsection",
+      "textContent": "Access"
+    },
+    {
+      "id": "toggle",
+      "component": "Toggle",
+      "checked": true
+    },
+    {
+      "id": "field-4",
+      "component": "Field",
+      "inline": true,
+      "label": "Require authentication",
+      "children": [
+        "toggle"
+      ]
+    },
+    {
+      "id": "toggle-2",
+      "component": "Toggle",
+      "checked": true
+    },
+    {
+      "id": "field-5",
+      "component": "Field",
+      "inline": true,
+      "label": "Allow CORS",
+      "children": [
+        "toggle-2"
+      ]
+    },
+    {
+      "id": "toggle-3",
+      "component": "Toggle"
+    },
+    {
+      "id": "field-6",
+      "component": "Field",
+      "inline": true,
+      "label": "Rate limit by IP",
+      "children": [
+        "toggle-3"
+      ]
+    },
+    {
+      "id": "toggle-4",
+      "component": "Toggle"
+    },
+    {
+      "id": "field-7",
+      "component": "Field",
+      "inline": true,
+      "label": "Log all requests",
+      "children": [
+        "toggle-4"
+      ]
+    },
+    {
+      "id": "column-4",
+      "component": "Column",
+      "gap": "3",
+      "children": [
+        "text-3",
+        "field-4",
+        "field-5",
+        "field-6",
+        "field-7"
+      ]
+    },
+    {
+      "id": "text-4",
+      "component": "Text",
+      "variant": "subsection",
+      "textContent": "Notifications"
+    },
+    {
+      "id": "check-box",
+      "component": "CheckBox",
+      "checked": true
+    },
+    {
+      "id": "field-8",
+      "component": "Field",
+      "inline": true,
+      "label": "Email on errors",
+      "children": [
+        "check-box"
+      ]
+    },
+    {
+      "id": "check-box-2",
+      "component": "CheckBox"
+    },
+    {
+      "id": "field-9",
+      "component": "Field",
+      "inline": true,
+      "label": "Slack on deploys",
+      "children": [
+        "check-box-2"
+      ]
+    },
+    {
+      "id": "check-box-3",
+      "component": "CheckBox"
+    },
+    {
+      "id": "field-10",
+      "component": "Field",
+      "inline": true,
+      "label": "PagerDuty on outages",
+      "children": [
+        "check-box-3"
+      ]
+    },
+    {
+      "id": "column-5",
+      "component": "Column",
+      "gap": "3",
+      "children": [
+        "text-4",
+        "field-8",
+        "field-9",
+        "field-10"
+      ]
+    },
+    {
+      "id": "column",
+      "component": "Column",
+      "gap": "4",
+      "children": [
+        "column-2",
+        "column-3",
+        "column-4",
+        "column-5"
+      ]
+    },
+    {
+      "id": "section",
+      "component": "Section",
+      "slot": "body",
+      "children": [
+        "column"
+      ]
+    },
+    {
+      "id": "button",
+      "component": "Button",
+      "text": "Cancel",
+      "variant": "ghost"
+    },
+    {
+      "id": "button-2",
+      "component": "Button",
+      "text": "Save settings",
+      "variant": "primary"
+    },
+    {
+      "id": "text-5",
+      "component": "Text",
+      "variant": "body",
+      "slot": "action",
+      "children": [
+        "button",
+        "button-2"
+      ]
+    },
+    {
+      "id": "footer",
+      "component": "Footer",
+      "slot": "footer",
+      "children": [
+        "text-5"
+      ]
+    },
+    {
+      "id": "root",
+      "component": "Drawer",
+      "side": "right",
+      "size": "lg",
+      "text": "Advanced settings",
+      "children": [
+        "section",
+        "footer"
+      ]
+    }
+  ]
+}

package/corpus/chunks/form-field-email-hint.json

@@ -0,0 +1,53 @@
+{
+  "name": "form-field-email-hint",
+  "kind": "block",
+  "primary": "field-ui",
+  "page": "/site/patterns/forms.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "label": "Email address",
+    "hint": "We'll never share your email."
+  },
+  "html": "<field-ui label=\"Email address\" hint=\"We'll never share your email.\">\n        <input-ui type=\"email\" placeholder=\"you@example.com\"></input-ui>\n      </field-ui>",
+  "source": "site/pages/patterns/forms.html",
+  "metadata": {
+    "domain": "forms",
+    "description": "A labeled email field with helper hint text — field-ui wrapping an input-ui type=email. The canonical field-wrapper shape that owns the label, hint, and ARIA binding.",
+    "keywords": [
+      "form",
+      "field",
+      "email",
+      "hint",
+      "helper",
+      "label",
+      "field-ui",
+      "input-ui",
+      "type-email",
+      "wrapper",
+      "labeled",
+      "forms",
+      "validation",
+      "aria",
+      "placeholder"
+    ]
+  },
+  "captured_at": "2026-07-17T20:08:04.842Z",
+  "template": [
+    {
+      "id": "input",
+      "component": "Input",
+      "type": "email",
+      "placeholder": "you@example.com"
+    },
+    {
+      "id": "root",
+      "component": "Field",
+      "hint": "We'll never share your email.",
+      "label": "Email address",
+      "children": [
+        "input"
+      ]
+    }
+  ]
+}

package/corpus/chunks/form-field-range.json

@@ -0,0 +1,54 @@
+{
+  "name": "form-field-range",
+  "kind": "block",
+  "primary": "field-ui",
+  "page": "/site/patterns/forms.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "label": "Volume"
+  },
+  "html": "<field-ui label=\"Volume\">\n        <range-ui min=\"0\" max=\"100\" value=\"60\"></range-ui>\n      </field-ui>",
+  "source": "site/pages/patterns/forms.html",
+  "metadata": {
+    "domain": "forms",
+    "description": "A labeled range slider field — field-ui wrapping a range-ui with min/max/value. For selecting a numeric value within a bounded range (volume, opacity, threshold).",
+    "keywords": [
+      "form",
+      "field",
+      "range",
+      "slider",
+      "field-ui",
+      "range-ui",
+      "min",
+      "max",
+      "value",
+      "numeric",
+      "bounded",
+      "volume",
+      "opacity",
+      "threshold",
+      "forms",
+      "labeled",
+      "slider-control"
+    ]
+  },
+  "captured_at": "2026-07-17T20:08:04.842Z",
+  "template": [
+    {
+      "id": "range",
+      "component": "Range",
+      "max": 100,
+      "min": 0,
+      "value": 60
+    },
+    {
+      "id": "root",
+      "component": "Field",
+      "label": "Volume",
+      "children": [
+        "range"
+      ]
+    }
+  ]
+}

package/corpus/chunks/form-field-required.json

@@ -0,0 +1,52 @@
+{
+  "name": "form-field-required",
+  "kind": "block",
+  "primary": "field-ui",
+  "page": "/site/patterns/forms.html",
+  "slots": [],
+  "nested": [],
+  "attrs": {
+    "label": "Full name",
+    "required": ""
+  },
+  "html": "<field-ui label=\"Full name\" required>\n        <input-ui placeholder=\"Maya Chen\"></input-ui>\n      </field-ui>",
+  "source": "site/pages/patterns/forms.html",
+  "metadata": {
+    "domain": "forms",
+    "description": "A required labeled text field — field-ui with the required attribute wrapping an input-ui, rendering the required asterisk and constraint binding.",
+    "keywords": [
+      "form",
+      "field",
+      "required",
+      "asterisk",
+      "label",
+      "field-ui",
+      "input-ui",
+      "text",
+      "wrapper",
+      "labeled",
+      "forms",
+      "validation",
+      "mandatory",
+      "name",
+      "placeholder"
+    ]
+  },
+  "captured_at": "2026-07-17T20:08:04.842Z",
+  "template": [
+    {
+      "id": "input",
+      "component": "Input",
+      "placeholder": "Maya Chen"
+    },
+    {
+      "id": "root",
+      "component": "Field",
+      "required": true,
+      "label": "Full name",
+      "children": [
+        "input"
+      ]
+    }
+  ]
+}