@mhmo91/schmancy 0.9.27 → 0.10.1

package/dist/agent/schmancy.manifest.json

@@ -1,107 +1,7 @@
 {
-  "schemaVersion": "1.1.0",
+  "schemaVersion": "1.0.0",
   "readme": "# Schmancy\n\nA Web Component UI library built on Lit, RxJS, and Tailwind CSS. Surfaces are glass. Depth is light. Interactions are physics.\n\n## Agent runtime\n\nFor sandboxed-iframe agents (Claude Design, Claude Artifacts, any LLM that can\nonly write HTML), schmancy ships a single-URL runtime at `@mhmo91/schmancy/agent`.\nDrop one `<script type=\"module\">` tag and every `<schmancy-*>` element is\nregistered. No bundler, no bare specifiers, no npm install.\n\n```html\n<script type=\"module\">\n  import { $dialog, theme } from 'https://esm.sh/@mhmo91/schmancy/agent';\n</script>\n<schmancy-theme root scheme=\"dark\">\n  <schmancy-surface type=\"solid\" fill=\"all\">\n    <schmancy-button>Hi</schmancy-button>\n    <schmancy-skill></schmancy-skill>\n  </schmancy-surface>\n</schmancy-theme>\n```\n\nThe `<schmancy-skill>` tag installs `window.schmancy` for runtime discovery:\n\n- `window.schmancy.help()` — full manifest (CEM v1 shape).\n- `window.schmancy.help('schmancy-button')` — one tag's attributes, events, slots, CSS parts.\n- `window.schmancy.tokens()` — build-time-extracted list of `--schmancy-*` theme tokens.\n- `window.schmancy.manifestUrl` — Blob URL; `fetch()` it for the same data.\n- `window.schmancy.a11yAudit()` — walks the live DOM and reports ARIA / shadow-root / form-association status per instance.\n- `window.schmancy.platformPrimitive('schmancy-dialog')` — map to the native element a component wraps (present when the component's JSDoc has `@platform`).\n- `window.schmancy.capabilities()` — runtime feature probe (`popover`, `declarativeShadowDom`, `scopedRegistries`, `trustedTypes`, `cssRegisteredProperties`, `elementInternalsAria`, `formAssociated`, `adoptedStyleSheets`). Agents use this to adapt to the sandbox they're in rather than the one they expect.\n\nEvery enum-typed attribute carries a `values` array — e.g. `schmancy-button`'s `variant` ships `[\"elevated\", \"filled\", \"filled tonal\", \"tonal\", \"outlined\", \"text\"]` so agents never have to parse `\"'filled' | 'tonal' | ...\"` strings.\n\nThe manifest is also emitted as a sibling file at `@mhmo91/schmancy/agent/manifest`\nfor tooling that prefers reading JSON from disk.\n\n## Install\n\n```bash\nnpm install @mhmo91/schmancy\n```\n\n```typescript\nimport '@mhmo91/schmancy'\nimport { magnetic, cursorGlow, gravity } from '@mhmo91/schmancy/directives'\n```\n\n## Use with Claude Code\n\nSchmancy ships a Claude Code plugin. In any Claude Code session, run:\n\n```\n/plugin install https://github.com/samwaai/schmancy\n```\n\nClaude now knows every Schmancy component, foundation pattern, and convention in your project. The skill activates automatically when you work on schmancy code — no CLAUDE.md edits, no symlinks.\n\n## Quick Start\n\n```html\n<schmancy-theme root scheme=\"dark\">\n  <schmancy-surface type=\"solid\" fill=\"all\">\n    <schmancy-area name=\"root\" .default=${lazy(() => import('./home.page'))}>\n      <schmancy-route when=\"home-page\" .component=${lazy(() => import('./home.page'))} />\n    </schmancy-area>\n  </schmancy-surface>\n</schmancy-theme>\n```\n\n## Design: Luminous Glass\n\n| Surface | Opacity | Blur | Purpose |\n|---------|---------|------|---------|\n| `solid` | 92% | — | Dense glass, high readability |\n| `subtle` | 78% | 8px | Frosted panel (default) |\n| `glass` | 55% | 16px | Overlays, dialogs, dropdowns |\n| `luminous` | 42% | 20px | Hero panels with glow halo |\n\n## Docs\n\nSchmancy is organized in four layers:\n\n- **Foundations** — [Area](./skills/schmancy/area.md) · [Store](./skills/schmancy/store.md) · [Mixins ($LitElement)](./skills/schmancy/mixins.md) · [Theme](./skills/schmancy/theme.md) · [Directives](./skills/schmancy/directives.md)\n- **Atoms** — [Typography](./skills/schmancy/typography.md) · [Icons](./skills/schmancy/icons.md) · [Button](./skills/schmancy/button.md) · [Surface](./skills/schmancy/surface.md) · [Divider](./skills/schmancy/divider.md) · [Avatar](./skills/schmancy/avatar.md)\n- **Composites (by job)** — Forms, Navigation, Overlays, Interaction, Feedback, Display\n- **Utilities** — [Animation](./skills/schmancy/animation.md) · [Audio](./skills/schmancy/audio.md) · [Discovery](./skills/schmancy/discovery.md) · [RxJS Utils](./skills/schmancy/rxjs-utils.md) · [Utils](./skills/schmancy/utils.md)\n\n**Full component index:** [skills/schmancy/INDEX.md](./skills/schmancy/INDEX.md) — the single-file map with every tag, service, and convention. Written primarily for AI agents; humans welcome.\n\n## Tech Stack\n\n[Lit](https://lit.dev) · [RxJS](https://rxjs.dev) · [Tailwind CSS v4](https://tailwindcss.com) · [Blackbird](./src/utils/animation.ts)\n\n## License\n\nApache-2.0\n",
   "modules": [
-    {
-      "kind": "javascript-module",
-      "path": "avatar.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "name": "SchmancyAvatar",
-          "tagName": "schmancy-avatar",
-          "description": "A customizable avatar component that displays initials or an icon Designed to match the Schmancy design system",
-          "attributes": [
-            {
-              "name": "initials",
-              "type": {
-                "text": "string"
-              },
-              "default": "''"
-            },
-            {
-              "name": "src",
-              "type": {
-                "text": "string"
-              },
-              "default": "''"
-            },
-            {
-              "name": "icon",
-              "type": {
-                "text": "string"
-              },
-              "default": "''"
-            },
-            {
-              "name": "size",
-              "type": {
-                "text": "AvatarSize"
-              },
-              "values": [
-                "xxs",
-                "xs",
-                "sm",
-                "md",
-                "lg",
-                "xl"
-              ],
-              "default": "'md'"
-            },
-            {
-              "name": "color",
-              "type": {
-                "text": "AvatarColor"
-              },
-              "values": [
-                "primary",
-                "secondary",
-                "tertiary",
-                "success",
-                "error",
-                "neutral"
-              ],
-              "default": "'primary'"
-            },
-            {
-              "name": "shape",
-              "type": {
-                "text": "AvatarShape"
-              },
-              "values": [
-                "circle",
-                "square"
-              ],
-              "default": "'circle'"
-            },
-            {
-              "name": "bordered",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "name": "status",
-              "type": {
-                "text": "AvatarStatus"
-              },
-              "values": [
-                "online",
-                "offline",
-                "busy",
-                "away",
-                "none"
-              ],
-              "default": "'none'"
-            }
-          ],
-          "examples": [
-            "<schmancy-avatar\n  initials=\"JD\"\n  size=\"md\"\n  color=\"primary\"\n></schmancy-avatar>"
-          ]
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "agent/schmancy-skill.ts",
@@ -122,13 +22,6 @@
           "kind": "class",
           "name": "SchmancyArea",
           "tagName": "schmancy-area",
-          "description": "Router outlet — renders the active route's component for the named area. Drives the schmancy router via the `area` service.",
-          "summary": "Mount once per \"addressable region\" of the app (typically the main content area). Use the imperative `area.push({ area, component, params })` service to navigate. Multiple named areas can coexist on a page (e.g. main content + a sheet).",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Routing outlet. Degrades to an empty div if the tag never registers — routing is lost but the page stays accessible."
-          },
           "attributes": [
             {
               "name": "name",
@@ -143,15 +36,6 @@
                 "text": "RouteComponent"
               }
             }
-          ],
-          "events": [
-            {
-              "name": "redirect",
-              "description": "When the area resolves a route to a different destination (programmatic redirect). `detail.from` and `detail.to` are the route names."
-            }
-          ],
-          "examples": [
-            "<schmancy-area name=\"main\"></schmancy-area>\n<script>\n  import { area } from '@mhmo91/schmancy';\n  area.push({ area: 'main', component: MyDashboardView, params: { id: 42 } });\n</script>"
           ]
         }
       ]
@@ -219,6 +103,15 @@
               }
             }
           ],
+          "events": [
+            {
+              "name": "redirect",
+              "type": {
+                "text": "SchmancyRouteRedirectEvent"
+              },
+              "description": "Fired by the parent schmancy-area on this element when the route's guard emits false. Listen with `@redirect`."
+            }
+          ],
           "examples": [
             "<schmancy-area>\n  <schmancy-route\n    when=\"users\"\n    .component=${UserComponent}\n    exact\n  ></schmancy-route>\n</schmancy-area>"
           ]
@@ -233,13 +126,7 @@
           "kind": "class",
           "name": "SchmancyAutocomplete",
           "tagName": "schmancy-autocomplete",
-          "description": "Combobox with type-ahead filtering over a list of `<schmancy-option>` children. Single or multi-select. Form-associated.",
-          "summary": "Use when users need to pick from a known list of options but the list is too long for a plain select dropdown. Prefer schmancy-select for short static lists.",
-          "platformPrimitive": {
-            "tag": "combobox",
-            "mode": "change",
-            "note": "Composed of a schmancy-input + a floating listbox populated from `<schmancy-option>` children. Multi-select renders selections as schmancy-input-chip chips. Degrades to a datalist-backed native input if the tag never registers."
-          },
+          "description": "Autocomplete input component with filtering and multi-select support.",
           "attributes": [
             {
               "name": "required",
@@ -339,15 +226,106 @@
               },
               "default": "''"
             }
-          ],
-          "events": [
+          ]
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "avatar/avatar.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "name": "SchmancyAvatar",
+          "tagName": "schmancy-avatar",
+          "description": "A customizable avatar component that displays initials or an icon Designed to match the Schmancy design system",
+          "attributes": [
             {
-              "name": "change",
-              "description": "`SchmancyAutocompleteChangeEvent` with `{ value }` (single) or `{ value, values }` (multi)."
+              "name": "initials",
+              "type": {
+                "text": "string"
+              },
+              "default": "''"
+            },
+            {
+              "name": "src",
+              "type": {
+                "text": "string"
+              },
+              "default": "''"
+            },
+            {
+              "name": "icon",
+              "type": {
+                "text": "string"
+              },
+              "default": "''"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "AvatarSize"
+              },
+              "values": [
+                "xxs",
+                "xs",
+                "sm",
+                "md",
+                "lg",
+                "xl"
+              ],
+              "default": "'md'"
+            },
+            {
+              "name": "color",
+              "type": {
+                "text": "AvatarColor"
+              },
+              "values": [
+                "primary",
+                "secondary",
+                "tertiary",
+                "success",
+                "error",
+                "neutral"
+              ],
+              "default": "'primary'"
+            },
+            {
+              "name": "shape",
+              "type": {
+                "text": "AvatarShape"
+              },
+              "values": [
+                "circle",
+                "square"
+              ],
+              "default": "'circle'"
+            },
+            {
+              "name": "bordered",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "status",
+              "type": {
+                "text": "AvatarStatus"
+              },
+              "values": [
+                "online",
+                "offline",
+                "busy",
+                "away",
+                "none"
+              ],
+              "default": "'none'"
             }
           ],
           "examples": [
-            "<schmancy-autocomplete name=\"country\" label=\"Country\" placeholder=\"Start typing…\">\n  <schmancy-option value=\"US\">United States</schmancy-option>\n  <schmancy-option value=\"CA\">Canada</schmancy-option>\n  <schmancy-option value=\"GB\">United Kingdom</schmancy-option>\n</schmancy-autocomplete>"
+            "<schmancy-avatar\n  initials=\"JD\"\n  size=\"md\"\n  color=\"primary\"\n></schmancy-avatar>"
           ]
         }
       ]
@@ -540,13 +518,7 @@
           "kind": "class",
           "name": "SchmancyBreadcrumb",
           "tagName": "schmancy-breadcrumb",
-          "description": "Breadcrumb trail — navigation history from root to current page. Renders schmancy-breadcrumb-item children with separators between.",
-          "summary": "Use for deep hierarchical navigation (file explorer paths, e-commerce category chains, admin settings trees). Last item is styled as the current page automatically.",
-          "platformPrimitive": {
-            "tag": "nav",
-            "mode": "-",
-            "note": "Styled `<nav aria-label=\"Breadcrumb\">`. Degrades to a plain nav if the tag never registers."
-          },
+          "description": "Breadcrumb navigation container. Wraps a list of `schmancy-breadcrumb-item` elements with the correct ARIA landmark and semantics.",
           "attributes": [
             {
               "name": "separator",
@@ -567,22 +539,13 @@
               "name": "separator",
               "description": "The separator element."
             }
-          ],
-          "examples": [
-            "<schmancy-breadcrumb separator=\"›\">\n  <schmancy-breadcrumb-item href=\"/\">Home</schmancy-breadcrumb-item>\n  <schmancy-breadcrumb-item href=\"/docs\">Docs</schmancy-breadcrumb-item>\n  <schmancy-breadcrumb-item>Getting started</schmancy-breadcrumb-item>\n</schmancy-breadcrumb>"
           ]
         },
         {
           "kind": "class",
           "name": "SchmancyBreadcrumbItem",
           "tagName": "schmancy-breadcrumb-item",
-          "description": "Single segment in a schmancy-breadcrumb trail — a link when `href` is set, or a plain span (the current page) when omitted.",
-          "summary": "Always nested inside schmancy-breadcrumb. Omit `href` on the current page — it gets aria-current=\"page\" automatically.",
-          "platformPrimitive": {
-            "tag": "a",
-            "mode": "-",
-            "note": "Renders an `<a>` or `<span>` depending on href. Degrades to a plain anchor/span if the tag never registers."
-          },
+          "description": "Individual breadcrumb item. Renders as a link when `href` is provided, otherwise as a plain span (represents the current page).",
           "attributes": [
             {
               "name": "href",
@@ -604,9 +567,6 @@
               "name": "",
               "description": "Label content."
             }
-          ],
-          "examples": [
-            "<schmancy-breadcrumb-item href=\"/products\">Products</schmancy-breadcrumb-item>"
           ]
         }
       ]
@@ -680,13 +640,7 @@
           "kind": "class",
           "name": "SchmancyButton",
           "tagName": "schmancy-button",
-          "description": "Material Design button — primary interactive surface for triggering actions or navigation.",
-          "summary": "Trigger actions or navigate. Form-associated; participates in native form submission.",
-          "platformPrimitive": {
-            "tag": "button",
-            "mode": "click",
-            "note": "Schmancy-skinned native `<button type=\"submit\">`. When `href` is set, degrades to `<a href=\"…\">`. Falls back to plain `<button>` styled with Tailwind if the tag never registers."
-          },
+          "description": "A button component.",
           "attributes": [
             {
               "name": "variant",
@@ -796,9 +750,6 @@
               "description": "The underlying native `<button>` (or `<a>` when `href` is set)."
             }
           ],
-          "examples": [
-            "<schmancy-button variant=\"filled\" @click=${() => save()}>Save</schmancy-button>\n<schmancy-button variant=\"outlined\" href=\"/next\">Continue</schmancy-button>"
-          ],
           "contexts": [
             {
               "name": "SchmancyButtonSizeContext",
@@ -816,13 +767,7 @@
           "kind": "class",
           "name": "SchmnacyIconButton",
           "tagName": "schmancy-icon-button",
-          "description": "Icon-only button for toolbar actions, close affordances, or overflow menus.",
-          "summary": "Compact round/square button wrapping a single icon glyph. Form-associated like schmancy-button.",
-          "platformPrimitive": {
-            "tag": "button",
-            "mode": "click",
-            "note": "Schmancy-skinned native `<button>` (or `<a>` when `href` is set). aria-label is required for a11y because there's no text content."
-          },
+          "description": "An icon button component.",
           "attributes": [
             {
               "name": "size",
@@ -923,9 +868,6 @@
               "name": "base",
               "description": "The underlying native `<button>` (or `<a>` when `href` is set)."
             }
-          ],
-          "examples": [
-            "<schmancy-icon-button aria-label=\"Close\" @click=${() => close()}>\n  <schmancy-icon>close</schmancy-icon>\n</schmancy-icon-button>"
           ]
         }
       ]
@@ -938,21 +880,11 @@
           "kind": "class",
           "name": "SchmancyCardAction",
           "tagName": "schmancy-card-action",
-          "description": "Action row of a schmancy-card — holds the card's buttons / links (typically aligned bottom-right).",
-          "summary": "Always nested inside schmancy-card. Holds the primary + secondary CTAs for the card.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Styled flex container. Degrades to a plain div if the tag never registers."
-          },
           "slots": [
             {
               "name": "",
               "description": "The content of the action"
             }
-          ],
-          "examples": [
-            "<schmancy-card-action>\n  <schmancy-button variant=\"text\">Cancel</schmancy-button>\n  <schmancy-button variant=\"filled\">Save</schmancy-button>\n</schmancy-card-action>"
           ]
         }
       ]
@@ -965,13 +897,6 @@
           "kind": "class",
           "name": "SchmancyCard",
           "tagName": "schmancy-card",
-          "description": "Material Design card — a surface-level container for grouping related content with media / content / actions slots.",
-          "summary": "Use for discrete pieces of content that appear in a list (a product, a note, a message). Combine with schmancy-card-media / schmancy-card-content / schmancy-card-action children.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Styled `<div>`; becomes an `<a>` when `href` is set so the whole card is a single interactive surface. Degrades to a plain div/a if the tag never registers."
-          },
           "attributes": [
             {
               "name": "type",
@@ -1040,15 +965,6 @@
               "default": "''",
               "description": "ARIA label for accessibility."
             }
-          ],
-          "events": [
-            {
-              "name": "schmancy-click",
-              "description": "When an interactive card is clicked or activated via keyboard. `detail.value` echoes the card's `type`. Only fires when `interactive` is set."
-            }
-          ],
-          "examples": [
-            "<schmancy-card type=\"elevated\" href=\"/items/42\">\n  <schmancy-card-media src=\"/thumb.jpg\" alt=\"Thumbnail\"></schmancy-card-media>\n  <schmancy-card-content>\n    <h3>Title</h3>\n    <p>One-line description of the card's content.</p>\n  </schmancy-card-content>\n  <schmancy-card-action>\n    <schmancy-button variant=\"text\">Open</schmancy-button>\n  </schmancy-card-action>\n</schmancy-card>"
           ]
         }
       ]
@@ -1060,17 +976,7 @@
         {
           "kind": "class",
           "name": "SchmancyCardContent",
-          "tagName": "schmancy-card-content",
-          "description": "Content region of a schmancy-card — holds the card's headline, supporting text, and inline controls.",
-          "summary": "Always nested inside schmancy-card. The padded content block between the media and action rows.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Styled `<div>` with padding. Degrades to a plain div if the tag never registers."
-          },
-          "examples": [
-            "<schmancy-card-content>\n  <h3>Card title</h3>\n  <p>Supporting text that describes the card's subject.</p>\n</schmancy-card-content>"
-          ]
+          "tagName": "schmancy-card-content"
         }
       ]
     },
@@ -1082,13 +988,6 @@
           "kind": "class",
           "name": "SchmancyCardMedia",
           "tagName": "schmancy-card-media",
-          "description": "Media region of a schmancy-card — the image / thumbnail at the top of the card.",
-          "summary": "Always nested inside schmancy-card. Pass `src` + `alt` props or slot an `<img>` / `<video>` for custom media.",
-          "platformPrimitive": {
-            "tag": "img",
-            "mode": "-",
-            "note": "Renders an `<img>` (or wraps a slotted media element). Degrades to a styled `<img>` if the tag never registers."
-          },
           "attributes": [
             {
               "name": "src",
@@ -1118,9 +1017,6 @@
               },
               "default": "''"
             }
-          ],
-          "examples": [
-            "<schmancy-card-media src=\"/thumb.jpg\" alt=\"Product photo\"></schmancy-card-media>"
           ]
         }
       ]
@@ -1335,13 +1231,6 @@
           "kind": "class",
           "name": "SchmancyCheckboxElement",
           "tagName": "schmancy-checkbox",
-          "description": "Binary checkbox for multi-select or boolean form fields. Wraps Material Web's `<md-checkbox>`; form-associated.",
-          "summary": "Use for \"select many from a list\" or any boolean that's part of a form submission. Prefer schmancy-switch for immediate-effect toggles.",
-          "platformPrimitive": {
-            "tag": "checkbox",
-            "mode": "change",
-            "note": "Wraps `<md-checkbox>` from `@material/web`. Degrades to styled native `<input type=\"checkbox\">` if the tag never registers."
-          },
           "attributes": [
             {
               "name": "value",
@@ -1402,7 +1291,7 @@
           "events": [
             {
               "name": "valueChange",
-              "description": "`CustomEvent<{ value: boolean }>` when the checkbox is toggled."
+              "description": "Event fired when the checkbox value changes."
             }
           ],
           "slots": [
@@ -1410,9 +1299,6 @@
               "name": "",
               "description": "The label for the checkbox."
             }
-          ],
-          "examples": [
-            "<schmancy-checkbox name=\"tos\" required>I accept the terms</schmancy-checkbox>"
           ]
         }
       ]
@@ -1425,13 +1311,7 @@
           "kind": "class",
           "name": "SchmancyAssistChip",
           "tagName": "schmancy-assist-chip",
-          "description": "Assist chip — single-tap trigger for a contextual action (open calendar event, share content, jump to related view). Distinct from filter and input chips: assist chips have no selected state; clicking fires `action`.",
-          "summary": "Use for \"do this thing\" suggestions surfaced in context (next to a date, after a recipient list, near a long description). Pair with schmancy-icon for the leading glyph.",
-          "platformPrimitive": {
-            "tag": "button",
-            "mode": "click",
-            "note": "Material 3 assist-chip semantics. Degrades to a plain `<button>` if the tag never registers."
-          },
+          "description": "Assist chip component - prompts user actions like opening calendar events or sharing content Pure Schmancy implementation with Tailwind CSS and RxJS state management",
           "attributes": [
             {
               "name": "value",
@@ -1481,15 +1361,6 @@
               "default": "true",
               "description": "Elevated style variant - true by default per M3 spec for assist chips"
             }
-          ],
-          "events": [
-            {
-              "name": "action",
-              "description": "When the chip is clicked or activated via keyboard. `detail.value` echoes the chip's `value` attribute."
-            }
-          ],
-          "examples": [
-            "<schmancy-assist-chip @action=${(e) => share(e.detail.value)}>\n  <schmancy-icon slot=\"icon\">share</schmancy-icon>\n  Share\n</schmancy-assist-chip>"
           ]
         }
       ]
@@ -1502,13 +1373,6 @@
           "kind": "class",
           "name": "SchmancyChips",
           "tagName": "schmancy-chips",
-          "description": "Filter-chip group — container for selectable `<schmancy-chip>` children. Single or multi-select.",
-          "summary": "Use for filtering or choosing from 2–8 mutually-visible options (\"Status: active / paused / archived\"). Prefer schmancy-select when the list gets long or vertical.",
-          "platformPrimitive": {
-            "tag": "chip-group",
-            "mode": "change",
-            "note": "No direct native equivalent. Degrades to a styled schmancy-select with similar semantics if the tag never registers."
-          },
           "attributes": [
             {
               "name": "wrap",
@@ -1536,15 +1400,6 @@
               ],
               "default": "'start'"
             }
-          ],
-          "events": [
-            {
-              "name": "change",
-              "description": "`CustomEvent<{ value: string }>` (single) or `{ values: string[] }` (multi)."
-            }
-          ],
-          "examples": [
-            "<schmancy-chips multi @change=${(e) => this.filters = e.detail.values}>\n  <schmancy-chip value=\"active\">Active</schmancy-chip>\n  <schmancy-chip value=\"paused\">Paused</schmancy-chip>\n  <schmancy-chip value=\"archived\">Archived</schmancy-chip>\n</schmancy-chips>"
           ]
         }
       ]
@@ -1557,13 +1412,7 @@
           "kind": "class",
           "name": "SchmancyInputChip",
           "tagName": "schmancy-input-chip",
-          "description": "Input chip — displays user-provided information (tags, recipients, filters) that can be removed but not toggled.  IMPORTANT: Per Material Design 3 specification, input chips do NOT have selected state. They represent discrete pieces of user input (like entered tags, selections from lists, etc.) that can only be removed, not toggled on/off.  Use cases: - Displaying selected recipients in an email - Showing applied filters that can be removed - Tags or keywords entered by the user - Selected items from a multi-select dropdown",
-          "summary": "Removable pill that represents a single user input value. No selected state — use schmancy-chip (filter chip) for toggleable options.",
-          "platformPrimitive": {
-            "tag": "chip",
-            "mode": "remove",
-            "note": "No native equivalent. Composed of a labeled pill + close button. Degrades to a styled `<span>` with a trailing close `<button>` if the tag never registers."
-          },
+          "description": "Input chip component - represents user-provided information that can be removed.  IMPORTANT: Per Material Design 3 specification, input chips do NOT have selected state. They represent discrete pieces of user input (like entered tags, selections from lists, etc.) that can only be removed, not toggled on/off.  Use cases: - Displaying selected recipients in an email - Showing applied filters that can be removed - Tags or keywords entered by the user - Selected items from a multi-select dropdown",
           "attributes": [
             {
               "name": "value",
@@ -1638,13 +1487,7 @@
           "kind": "class",
           "name": "SchmancySuggestionChip",
           "tagName": "schmancy-suggestion-chip",
-          "description": "Suggestion chip — single-tap insertion of a recommended value. Distinct from filter chips (no selected state) and assist chips (assist triggers an action; suggestion offers a value the user can pick).",
-          "summary": "Use for \"would you also like to…\" prompts above a search input or below a message thread. Click fires `action` with the chip's `value` so the parent can insert it into a field or trigger a search.",
-          "platformPrimitive": {
-            "tag": "button",
-            "mode": "click",
-            "note": "Material 3 suggestion-chip semantics. Degrades to a plain `<button>` if the tag never registers."
-          },
+          "description": "Suggestion chip component - provides contextual recommendations to users  IMPORTANT: Suggestion chips do NOT have a selected state. They are designed to provide suggestions and recommendations that trigger actions when clicked. Unlike filter chips, they cannot be toggled on/off.  Pure Schmancy implementation with Tailwind CSS and RxJS state management",
           "attributes": [
             {
               "name": "value",
@@ -1694,15 +1537,6 @@
               "default": "false",
               "description": "Elevated style variant - flat by default per M3 spec"
             }
-          ],
-          "events": [
-            {
-              "name": "action",
-              "description": "When the chip is clicked or activated via keyboard. `detail.value` echoes the chip's `value` attribute."
-            }
-          ],
-          "examples": [
-            "<schmancy-suggestion-chip value=\"yesterday\" @action=${(e) => setRange(e.detail.value)}>\n  Yesterday\n</schmancy-suggestion-chip>"
           ]
         }
       ]
@@ -2313,13 +2147,6 @@
           "kind": "class",
           "name": "SchmancyDetails",
           "tagName": "schmancy-details",
-          "description": "Expandable disclosure panel — a styled `<details>` / `<summary>` pair with animated expand + overlay options.",
-          "summary": "Use for progressive-disclosure content: FAQs, collapsible settings sections, accordion-style lists. Prefer schmancy-expand for full-page accordions where only one section can be open at a time.",
-          "platformPrimitive": {
-            "tag": "details",
-            "mode": "toggle",
-            "note": "Wraps native `<details>`/`<summary>`. Degrades to the native element if the tag never registers — same keyboard accessibility, just no animation."
-          },
           "attributes": [
             {
               "name": "summary",
@@ -2381,15 +2208,6 @@
               },
               "default": "'p-3'"
             }
-          ],
-          "events": [
-            {
-              "name": "toggle",
-              "description": "When the open state changes (bubbles from the native `<details>`)."
-            }
-          ],
-          "examples": [
-            "<schmancy-details summary=\"Shipping details\">\n  <p>Order ships in 2 business days.</p>\n</schmancy-details>"
           ]
         }
       ]
@@ -2437,13 +2255,7 @@
           "kind": "class",
           "name": "SchmancyDialog",
           "tagName": "schmancy-dialog",
-          "description": "Modal dialog — content-only (just a styled panel) or confirm mode (title + message + confirm/cancel buttons). Prefer the imperative `$dialog` service for most use cases; use the element directly only when you want a declaratively-positioned dialog.",
-          "summary": "Blocks interaction with the rest of the page until dismissed. For quick confirmations, prefer `$dialog.confirm({ ... })` over this element. For arbitrary dialog content driven imperatively, prefer `$dialog.component(MyComponent)`.",
-          "platformPrimitive": {
-            "tag": "dialog",
-            "mode": "close",
-            "note": "Positioned overlay in light DOM. Degrades to a styled `<dialog>` if the tag never registers — loses custom animations but keeps focus trap + ESC close."
-          },
+          "description": "Unified dialog component that handles both content-only and confirm modes.",
           "attributes": [
             {
               "name": "uid",
@@ -2513,16 +2325,6 @@
               "description": "Whether to hide action buttons (force content mode)"
             }
           ],
-          "events": [
-            {
-              "name": "confirm",
-              "description": "In confirm mode, when the confirm button is clicked."
-            },
-            {
-              "name": "cancel",
-              "description": "In confirm mode, when the cancel button or ESC is activated."
-            }
-          ],
           "slots": [
             {
               "name": "default",
@@ -2534,8 +2336,8 @@
             }
           ],
           "examples": [
-            "Content mode (no buttons):\n<schmancy-dialog>\n  <my-custom-content></my-custom-content>\n</schmancy-dialog>",
-            "Confirm mode (with buttons):\n<schmancy-dialog\n  title=\"Delete item?\"\n  message=\"This action cannot be undone.\"\n  confirm-text=\"Delete\"\n  cancel-text=\"Keep\"\n></schmancy-dialog>"
+            "Content mode (no buttons):\n\n<schmancy-dialog>\n  <my-custom-content></my-custom-content>\n</schmancy-dialog>",
+            "Confirm mode (with buttons):\n\n<schmancy-dialog\n  title=\"Confirm Action\"\n  message=\"Are you sure?\"\n  confirm-text=\"Yes\"\n  cancel-text=\"No\"\n></schmancy-dialog>"
           ]
         }
       ]
@@ -2548,13 +2350,6 @@
           "kind": "class",
           "name": "SchmancyDivider",
           "tagName": "schmancy-divider",
-          "description": "Thin horizontal (or vertical) separator rule between sections of content.",
-          "summary": "Semantic separator between groups — list items, menu sections, content blocks. Uses outline theme token.",
-          "platformPrimitive": {
-            "tag": "hr",
-            "mode": "-",
-            "note": "Styled horizontal rule. Degrades to a native `<hr>` if the tag never registers."
-          },
           "attributes": [
             {
               "name": "outline",
@@ -2586,9 +2381,6 @@
               ],
               "default": "'start'"
             }
-          ],
-          "examples": [
-            "<schmancy-list-item>First</schmancy-list-item>\n<schmancy-divider></schmancy-divider>\n<schmancy-list-item>Second</schmancy-list-item>"
           ]
         }
       ]
@@ -2601,13 +2393,7 @@
           "kind": "class",
           "name": "SchmancyDropdown",
           "tagName": "schmancy-dropdown",
-          "description": "Anchored floating dropdown — a generic \"show this content relative to that trigger\" primitive. Unlike schmancy-menu (which uses the dialog service and is list-shaped), dropdown is a low-level popover anchored with Floating UI. Use when you want a custom-shaped overlay tied to a specific trigger element without the menu semantics.",
-          "summary": "Prefer schmancy-menu for action lists, schmancy-autocomplete for type-ahead, schmancy-tooltip for hover hints. Reach for schmancy-dropdown when none of those fit — custom filters, color pickers, inline forms anchored to a trigger.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Anchored via Floating UI (autoUpdate, flip, shift). Degrades to inline content if the tag never registers — loses positioning but content stays accessible."
-          },
+          "description": "A dropdown component that displays content when triggered.",
           "attributes": [
             {
               "name": "open",
@@ -2648,16 +2434,6 @@
               "description": "Offset distance in pixels"
             }
           ],
-          "events": [
-            {
-              "name": "open",
-              "description": "When the dropdown opens."
-            },
-            {
-              "name": "close",
-              "description": "When the dropdown closes."
-            }
-          ],
           "slots": [
             {
               "name": "trigger",
@@ -2667,9 +2443,6 @@
               "name": "",
               "description": "Default slot for the dropdown content"
             }
-          ],
-          "examples": [
-            "<schmancy-dropdown>\n  <schmancy-button slot=\"trigger\">Filters</schmancy-button>\n  <schmancy-dropdown-content>\n    <schmancy-form>…</schmancy-form>\n  </schmancy-dropdown-content>\n</schmancy-dropdown>"
           ]
         }
       ]
@@ -2682,13 +2455,7 @@
           "kind": "class",
           "name": "SchmancyDropdownContent",
           "tagName": "schmancy-dropdown-content",
-          "description": "Content panel for a schmancy-dropdown — a styled positioned surface. Always nested inside schmancy-dropdown and placed alongside the trigger slot.",
-          "summary": "Nest this inside schmancy-dropdown (not in the trigger slot). Use the `content` CSS part to customize backgrounds / shadows / padding without shadow-root piercing.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Positioned panel with theme-aware styling. Degrades to an inline div if the tag never registers."
-          },
+          "description": "Content container for the schmancy-dropdown component.",
           "attributes": [
             {
               "name": "width",
@@ -2741,9 +2508,6 @@
               "name": "content",
               "description": "The inner wrapper element; style to override panel backgrounds, shadows, padding, or borders without shadow-root piercing."
             }
-          ],
-          "examples": [
-            "<schmancy-dropdown>\n  <schmancy-button slot=\"trigger\">Open</schmancy-button>\n  <schmancy-dropdown-content>\n    Panel contents…\n  </schmancy-dropdown-content>\n</schmancy-dropdown>"
           ]
         }
       ]
@@ -2756,13 +2520,6 @@
           "kind": "class",
           "name": "SchmancyExpandRoot",
           "tagName": "schmancy-expand-root",
-          "description": "Container for schmancy-expand children — coordinates mutual-exclusion so only one child is open at a time. Also renders the portal panel that the active child expands into.",
-          "summary": "Always wrap a group of schmancy-expand children. Without a root, each schmancy-expand behaves independently (which is usually not what you want — prefer schmancy-details for that).",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Coordinating wrapper. Degrades to a plain div if the tag never registers — children fall back to independent `<details>` behavior."
-          },
           "attributes": [
             {
               "name": "type",
@@ -2795,9 +2552,6 @@
               ],
               "default": "'solid'"
             }
-          ],
-          "examples": [
-            "<schmancy-expand-root>\n  <schmancy-expand summary=\"Step 1\">…</schmancy-expand>\n  <schmancy-expand summary=\"Step 2\">…</schmancy-expand>\n</schmancy-expand-root>"
           ]
         }
       ]
@@ -2810,13 +2564,6 @@
           "kind": "class",
           "name": "SchmancyExpand",
           "tagName": "schmancy-expand",
-          "description": "Accordion-style section — expands on click, coordinates with siblings via schmancy-expand-root to close any sibling when a new one opens. Only one schmancy-expand can be open at a time within the same root.",
-          "summary": "Use for grouped progressive-disclosure where only one section should be open at a time. Prefer schmancy-details when sections should be independent.",
-          "platformPrimitive": {
-            "tag": "details",
-            "mode": "toggle",
-            "note": "Schmancy-skinned accordion section. Degrades to `<details>` if the tag never registers — loses mutual-exclusion behavior but stays functional."
-          },
           "attributes": [
             {
               "name": "summary",
@@ -2874,15 +2621,6 @@
               },
               "default": "false"
             }
-          ],
-          "events": [
-            {
-              "name": "toggle",
-              "description": "When the open state changes."
-            }
-          ],
-          "examples": [
-            "<schmancy-expand-root>\n  <schmancy-expand summary=\"Billing\">Billing form…</schmancy-expand>\n  <schmancy-expand summary=\"Shipping\">Shipping form…</schmancy-expand>\n  <schmancy-expand summary=\"Review\">Order review…</schmancy-expand>\n</schmancy-expand-root>"
           ]
         }
       ]
@@ -2906,13 +2644,7 @@
           "kind": "class",
           "name": "SchmancyForm",
           "tagName": "schmancy-form",
-          "description": "Ergonomic wrapper around a native `<form>`. Children are reparented into a light-DOM `<form>` on connection so form-associated custom elements resolve `internals.form` via native DOM ancestry.  - Form-associated custom elements (FACE) resolve their `internals.form`   correctly via native DOM ancestry. - `new FormData(form)` collects values from every FACE + native control   without any manual walking. - `form.reset()` triggers `formResetCallback()` on every FACE. - `form.reportValidity()` runs native validation UI. - `<button type=\"submit\">` and `<schmancy-button type=\"submit\">` both   submit the form via the native submitter pipeline.  This component exists only to translate the native `submit` / `reset` events into the Schmancy event shape (`detail: FormData`). All heavy lifting is the platform's.",
-          "summary": "Always wrap form-associated schmancy components in schmancy-form (or a native `<form>`) so `new FormData(form)` just works.",
-          "platformPrimitive": {
-            "tag": "form",
-            "mode": "submit",
-            "note": "Light-DOM native `<form>` element. Degrades to a `<form>` if the tag never registers — same semantics, just no CustomEvent translation."
-          },
+          "description": "A thin ergonomic wrapper around a native `<form>` element. Its children are reparented into a `<form>` element in light DOM on connection, so:  - Form-associated custom elements (FACE) resolve their `internals.form`   correctly via native DOM ancestry. - `new FormData(form)` collects values from every FACE + native control   without any manual walking. - `form.reset()` triggers `formResetCallback()` on every FACE. - `form.reportValidity()` runs native validation UI. - `<button type=\"submit\">` and `<schmancy-button type=\"submit\">` both   submit the form via the native submitter pipeline.  This component exists only to translate the native `submit` / `reset` events into the Schmancy event shape (`detail: FormData`). All heavy lifting is the platform's.",
           "events": [
             {
               "name": "submit",
@@ -2922,9 +2654,6 @@
               "name": "reset",
               "description": "Emitted after the underlying form resets."
             }
-          ],
-          "examples": [
-            "<schmancy-form @submit=${(e) => console.log(Object.fromEntries(e.detail))}>\n  <schmancy-input name=\"email\" type=\"email\" required></schmancy-input>\n  <schmancy-input name=\"password\" type=\"password\" required></schmancy-input>\n  <schmancy-button type=\"submit\" variant=\"filled\">Sign in</schmancy-button>\n</schmancy-form>"
           ]
         }
       ]
@@ -3105,13 +2834,7 @@
           "kind": "class",
           "name": "SchmancyInput",
           "tagName": "schmancy-input",
-          "description": "Single-line text input — the primary form-text primitive. Form-associated via ElementInternals, so it participates in native `<form>` submission, validation, and reset without additional wiring.",
-          "summary": "Text input with Material Design styling, native form integration, and RxJS-debounced input/change/enter events.",
-          "platformPrimitive": {
-            "tag": "input",
-            "mode": "change",
-            "note": "Schmancy-skinned native `<input>`. Degrades to `<input class=\"…\">` styled via Tailwind if the tag never registers."
-          },
+          "description": "Enhanced version of the SchmancyInput component with improved form integration and compatibility with legacy API.  This component uses the native form association API and maintains parity with native input behaviors while providing a stylish, accessible interface.",
           "attributes": [
             {
               "name": "value",
@@ -3280,23 +3003,6 @@
               },
               "description": "For datalist support"
             }
-          ],
-          "events": [
-            {
-              "name": "input",
-              "description": "`CustomEvent<{value: string}>` on every keystroke."
-            },
-            {
-              "name": "change",
-              "description": "`CustomEvent<{value: string}>` on blur/change."
-            },
-            {
-              "name": "enter",
-              "description": "`CustomEvent<{value: string}>` when user presses Enter."
-            }
-          ],
-          "examples": [
-            "<schmancy-form @submit=${onSubmit}>\n  <schmancy-input name=\"email\" type=\"email\" label=\"Email\" required></schmancy-input>\n</schmancy-form>"
           ]
         },
         {
@@ -3386,13 +3092,6 @@
           "kind": "class",
           "name": "SchmancyLightbox",
           "tagName": "schmancy-lightbox",
-          "description": "Image lightbox — thumbnail grid that opens to a full-screen viewer on click, with keyboard navigation between images.",
-          "summary": "Drop-in for galleries / image lists where each thumbnail should expand to fill the viewport. Pass an `images` array of `{ src, alt, caption? }`.",
-          "platformPrimitive": {
-            "tag": "dialog",
-            "mode": "close",
-            "note": "Modal full-screen viewer with keyboard navigation. Degrades to a plain image grid if the tag never registers."
-          },
           "attributes": [
             {
               "name": "src",
@@ -3422,19 +3121,6 @@
               },
               "default": "false"
             }
-          ],
-          "events": [
-            {
-              "name": "change",
-              "description": "When the active image index changes (next/prev). `detail.index` is the new active image's position in the array."
-            },
-            {
-              "name": "close",
-              "description": "When the viewer is dismissed (ESC, backdrop click, close button)."
-            }
-          ],
-          "examples": [
-            "<schmancy-lightbox .images=${[{ src: '/a.jpg', alt: 'A' }, { src: '/b.jpg', alt: 'B' }]}></schmancy-lightbox>"
           ]
         }
       ]
@@ -3447,13 +3133,6 @@
           "kind": "class",
           "name": "SchmancyListItem",
           "tagName": "schmancy-list-item",
-          "description": "Single row in a schmancy-list — supports leading icon/avatar, main content, trailing actions. Clickable via click event, or used as a schmancy-menu-item's visual base.",
-          "summary": "Prefer nesting inside schmancy-list for consistent spacing/surface. Use `href` to make the row a navigation target (renders as `<a>`), or a click handler for in-app actions.",
-          "platformPrimitive": {
-            "tag": "li",
-            "mode": "click",
-            "note": "Styled `<li>` or `<a>` depending on `href`. Degrades to a plain list item if the tag never registers."
-          },
           "attributes": [
             {
               "name": "variant",
@@ -3519,9 +3198,6 @@
               "description": "default content"
             }
           ],
-          "examples": [
-            "<schmancy-list-item href=\"/profile\">\n  <schmancy-icon slot=\"leading\">person</schmancy-icon>\n  Profile\n  <schmancy-icon slot=\"trailing\">chevron_right</schmancy-icon>\n</schmancy-list-item>"
-          ],
           "contexts": [
             {
               "name": "SchmancySurfaceTypeContext",
@@ -3539,13 +3215,7 @@
           "kind": "class",
           "name": "List",
           "tagName": "schmancy-list",
-          "description": "Wrapped list container — holds schmancy-list-item children on a themed surface. Optionally scrollable.",
-          "summary": "Use for vertical lists of similarly-shaped items: settings entries, menu items, contact lists, notification lists. Pair with schmancy-list-item children.",
-          "platformPrimitive": {
-            "tag": "ul",
-            "mode": "-",
-            "note": "Styled list container. Degrades to a plain ul/div if the tag never registers."
-          },
+          "description": "`<schmancy-list>` component.  A list component that wraps its content within a customizable surface. It allows you to set the surface type and fill style, and can optionally enable scrolling behavior by delegating the scroller attribute to the surface.",
           "attributes": [
             {
               "name": "surface",
@@ -3608,7 +3278,7 @@
             }
           ],
           "examples": [
-            "<schmancy-list surface=\"container\" scroller>\n  <schmancy-list-item>First</schmancy-list-item>\n  <schmancy-list-item>Second</schmancy-list-item>\n  <schmancy-list-item>Third</schmancy-list-item>\n</schmancy-list>"
+            "<schmancy-list surface=\"container\" scroller>\n  <schmancy-list-item>List Item 1</schmancy-list-item>\n</schmancy-list>"
           ],
           "contexts": [
             {
@@ -3728,6 +3398,14 @@
               "default": "[]",
               "description": "All available recipients"
             },
+            {
+              "name": "importSources",
+              "type": {
+                "text": "ImportSource[]"
+              },
+              "default": "[]",
+              "description": "Sources users can import recipients from (forwarded from parent)"
+            },
             {
               "name": "selectedRecipients",
               "type": {
@@ -4088,23 +3766,7 @@
         {
           "kind": "class",
           "name": "SchmancyMenuItem",
-          "tagName": "schmancy-menu-item",
-          "description": "Single item inside a schmancy-menu. Auto-dismisses the menu dialog on click — attach your action handler to `@click` and it just works.",
-          "summary": "Always nested inside schmancy-menu. The click handler runs before the dialog closes, so `@click=${() => doThing()}` is the full pattern.",
-          "platformPrimitive": {
-            "tag": "menuitem",
-            "mode": "click",
-            "note": "Wraps schmancy-list-item with auto-dismiss. Degrades to a styled `<button role=\"menuitem\">` if the tag never registers."
-          },
-          "slots": [
-            {
-              "name": "",
-              "description": "The item label and optional icons."
-            }
-          ],
-          "examples": [
-            "<schmancy-menu-item @click=${() => archive()}>\n  <schmancy-icon slot=\"leading\">archive</schmancy-icon>\n  Archive\n</schmancy-menu-item>"
-          ]
+          "tagName": "schmancy-menu-item"
         }
       ]
     },
@@ -4116,13 +3778,7 @@
           "kind": "class",
           "name": "SchmancyMenu",
           "tagName": "schmancy-menu",
-          "description": "Floating menu — a trigger button + a list of schmancy-menu-item children that open as a positioned dialog on click.",
-          "summary": "Use for dropdown menus attached to a button or icon — \"More actions\", \"Account\", row overflow menus in tables. Clicking a schmancy-menu-item inside auto-dismisses; custom components slotted inside must call `$dialog.dismiss()` themselves.",
-          "platformPrimitive": {
-            "tag": "menu",
-            "mode": "close",
-            "note": "Trigger + floating listbox dialog. Degrades to a native `<select>` or inline list if the tag never registers."
-          },
+          "description": "Menu Component  CRITICAL: The dialog ONLY renders the raw menu items passed via the default slot. NO <ul> wrapper, NO classes, NO additional markup in the dialog call. The dialog service handles positioning and display - we just pass the pure content.",
           "slots": [
             {
               "name": "trigger",
@@ -4138,102 +3794,8 @@
             }
           ],
           "examples": [
-            "<schmancy-menu>\n  <schmancy-icon-button slot=\"trigger\" aria-label=\"Actions\">\n    <schmancy-icon>more_vert</schmancy-icon>\n  </schmancy-icon-button>\n  <schmancy-menu-item @click=${() => edit()}>Edit</schmancy-menu-item>\n  <schmancy-menu-item @click=${() => remove()}>Delete</schmancy-menu-item>\n</schmancy-menu>"
-          ]
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "metric/metric.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "name": "SchmancyMetric",
-          "tagName": "schmancy-metric",
-          "description": "KPI metric — a label + value pair for dashboards, with optional trend + delta indicators.",
-          "summary": "The building block of dashboards and meta bars. Pass `label` + `value` for a basic stat; add `trend` / `delta` for the delta-from-last-period pattern. Use multiple metrics side-by-side with Tailwind flex/grid utilities.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Styled `<div>` with two text lines + optional trend arrow. Degrades to a plain div+spans if the tag never registers."
-          },
-          "attributes": [
-            {
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Upper-case caption shown above the value."
-            },
-            {
-              "name": "value",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Primary metric value, rendered large. Pre-format numbers/currency yourself."
-            },
-            {
-              "name": "trend",
-              "type": {
-                "text": "MetricTrend"
-              },
-              "values": [
-                "neutral",
-                "up",
-                "down"
-              ],
-              "description": "Optional trend direction. Controls the color + arrow on the delta pill."
-            },
-            {
-              "name": "delta",
-              "type": {
-                "text": "string"
-              },
-              "description": "Optional delta copy displayed in a pill next to the value (e.g. `+12%`)."
-            },
-            {
-              "name": "size",
-              "type": {
-                "text": "MetricSize"
-              },
-              "values": [
-                "sm",
-                "md",
-                "lg"
-              ],
-              "default": "'md'",
-              "description": "Size scale affecting label + value typography."
-            }
-          ],
-          "slots": [
-            {
-              "name": "",
-              "description": "Optional custom value rendering (overrides the `value` attribute if present)."
-            },
-            {
-              "name": "label",
-              "description": "Optional custom label rendering (overrides the `label` attribute if present)."
-            }
-          ],
-          "cssParts": [
-            {
-              "name": "label",
-              "description": "The label line."
-            },
-            {
-              "name": "value",
-              "description": "The value line."
-            },
-            {
-              "name": "delta",
-              "description": "The delta pill (only when `delta` is set)."
-            }
-          ],
-          "examples": [
-            "<schmancy-metric label=\"In flight\" value=\"4\"></schmancy-metric>\n<schmancy-metric label=\"Open value\" value=\"€165,900\" trend=\"up\" delta=\"+12%\"></schmancy-metric>\n<schmancy-metric label=\"Error rate\" value=\"0.3%\" trend=\"down\" delta=\"-0.1%\"></schmancy-metric>"
+            "Basic menu with auto-dismiss\n\n<schmancy-menu>\n  <schmancy-button slot=\"trigger\">Actions</schmancy-button>\n  <schmancy-menu-item @click=${() => editItem()}>Edit</schmancy-menu-item>\n  <schmancy-menu-item @click=${() => deleteItem()}>Delete</schmancy-menu-item>\n</schmancy-menu>\n\nNote: Dialog auto-dismisses when schmancy-menu-item is clicked",
+            "Custom component (manual dismiss)\n\n<schmancy-menu>\n  <schmancy-icon-button slot=\"trigger\">settings</schmancy-icon-button>\n  <my-settings-form @submit=${() => $dialog.dismiss()}></my-settings-form>\n</schmancy-menu>\n\nNote: Custom components must call $dialog.dismiss() manually"
           ]
         }
       ]
@@ -4246,21 +3808,11 @@
           "kind": "class",
           "name": "SchmancyDrawerAppbar",
           "tagName": "schmancy-nav-drawer-appbar",
-          "description": "Top app bar region inside schmancy-nav-drawer — the horizontal strip above the content area that typically holds the page title, hamburger trigger, and contextual actions.",
-          "summary": "Always nested inside schmancy-nav-drawer. Holds the page-level title + top-right actions. On mobile, the drawer's hamburger button renders inside this region.",
-          "platformPrimitive": {
-            "tag": "header",
-            "mode": "-",
-            "note": "Styled horizontal bar. Degrades to a plain header element if the tag never registers."
-          },
           "slots": [
             {
               "name": "",
               "description": "The default slot"
             }
-          ],
-          "examples": [
-            "<schmancy-nav-drawer-appbar>\n  <schmancy-typography type=\"title\" token=\"lg\">Dashboard</schmancy-typography>\n  <schmancy-icon-button slot=\"trailing\" aria-label=\"Notifications\">\n    <schmancy-icon>notifications</schmancy-icon>\n  </schmancy-icon-button>\n</schmancy-nav-drawer-appbar>"
           ]
         }
       ]
@@ -4272,17 +3824,7 @@
         {
           "kind": "class",
           "name": "SchmancyNavigationDrawerContent",
-          "tagName": "schmancy-nav-drawer-content",
-          "description": "Main content region inside schmancy-nav-drawer — typically hosts the router outlet or the page's body content.",
-          "summary": "Always nested inside schmancy-nav-drawer. Scrollable by default; propagates scroll events up so the drawer can collapse app-bar on scroll.",
-          "platformPrimitive": {
-            "tag": "main",
-            "mode": "scroll",
-            "note": "Scrollable `<main>`. Degrades to a plain scrollable div if the tag never registers."
-          },
-          "examples": [
-            "<schmancy-nav-drawer-content>\n  <schmancy-area name=\"main\"></schmancy-area>\n</schmancy-nav-drawer-content>"
-          ]
+          "tagName": "schmancy-nav-drawer-content"
         }
       ]
     },
@@ -4294,13 +3836,6 @@
           "kind": "class",
           "name": "SchmancyNavigationDrawer",
           "tagName": "schmancy-nav-drawer",
-          "description": "Responsive navigation drawer — a left sidebar that becomes a hamburger-triggered modal overlay on narrow viewports. Composes schmancy-nav-drawer-navbar (the nav rail), schmancy-nav-drawer-appbar (the top bar), and schmancy-nav-drawer-content (the main region).",
-          "summary": "The app-shell layout primitive. Wrap your whole app in this when you want \"persistent sidebar on desktop, drawer on mobile\" behavior. Mode auto-switches at the breakpoint.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Flex layout with viewport-width mode switching. Degrades to a stack of plain divs if the tag never registers."
-          },
           "attributes": [
             {
               "name": "fullscreen",
@@ -4334,21 +3869,12 @@
               ]
             }
           ],
-          "events": [
-            {
-              "name": "schmancy-drawer-state",
-              "description": "When the drawer open/close state changes on mobile."
-            }
-          ],
           "slots": [
             {
               "name": "",
               "description": "The content slot"
             }
           ],
-          "examples": [
-            "<schmancy-nav-drawer>\n  <schmancy-nav-drawer-navbar>\n    <!-- nav items, typically schmancy-list-item links -->\n  </schmancy-nav-drawer-navbar>\n  <schmancy-nav-drawer-appbar>App title</schmancy-nav-drawer-appbar>\n  <schmancy-nav-drawer-content>\n    <!-- router outlet / page content -->\n  </schmancy-nav-drawer-content>\n</schmancy-nav-drawer>"
-          ],
           "contexts": [
             {
               "name": "SchmancyDrawerNavbarMode",
@@ -4370,13 +3896,6 @@
           "kind": "class",
           "name": "SchmancyNavigationDrawerSidebar",
           "tagName": "schmancy-nav-drawer-navbar",
-          "description": "Sidebar region inside schmancy-nav-drawer — the persistent-on-desktop / modal-on-mobile nav rail.",
-          "summary": "Always nested inside schmancy-nav-drawer. On desktop: pinned left sidebar. On mobile: modal overlay triggered by the hamburger button in schmancy-nav-drawer-appbar.",
-          "platformPrimitive": {
-            "tag": "nav",
-            "mode": "-",
-            "note": "Sidebar `<nav>` with responsive open/close behavior. Degrades to a plain sidebar div if the tag never registers."
-          },
           "attributes": [
             {
               "name": "width",
@@ -4386,9 +3905,6 @@
               "default": "'220px'"
             }
           ],
-          "examples": [
-            "<schmancy-nav-drawer-navbar>\n  <schmancy-list>\n    <schmancy-list-item href=\"/dashboard\">Dashboard</schmancy-list-item>\n    <schmancy-list-item href=\"/settings\">Settings</schmancy-list-item>\n  </schmancy-list>\n</schmancy-nav-drawer-navbar>"
-          ],
           "contexts": [
             {
               "name": "SchmancyDrawerNavbarMode",
@@ -4410,13 +3926,7 @@
           "kind": "class",
           "name": "SchmancyNavigationBarItem",
           "tagName": "schmancy-navigation-bar-item",
-          "description": "Single destination inside schmancy-navigation-bar — an icon + optional label representing one primary app destination.",
-          "summary": "Always nested inside schmancy-navigation-bar. Use `icon` attr for a Material Symbols glyph or slot=icon for custom content.",
-          "platformPrimitive": {
-            "tag": "button",
-            "mode": "click",
-            "note": "Styled navigation target. Degrades to a plain `<button>` if the tag never registers."
-          },
+          "description": "`<schmancy-navigation-bar-item>` component  Individual navigation item for use within a navigation bar. Represents a single destination with an icon and optional label following Material Design 3 specifications.",
           "attributes": [
             {
               "name": "icon",
@@ -4498,13 +4008,7 @@
           "kind": "class",
           "name": "SchmancyNavigationBar",
           "tagName": "schmancy-navigation-bar",
-          "description": "Bottom navigation bar — Material Design 3 horizontal nav for mobile primary destinations (3–7 items). Auto-hides in fullscreen mode.",
-          "summary": "Use for mobile primary navigation (home, search, favorites, settings). For persistent desktop nav, prefer schmancy-navigation-rail or schmancy-nav-drawer. Consumer is responsible for fixed-bottom positioning via class.",
-          "platformPrimitive": {
-            "tag": "nav",
-            "mode": "-",
-            "note": "Styled horizontal nav with schmancy-navigation-bar-item children. Degrades to a plain flex container if the tag never registers."
-          },
+          "description": "`<schmancy-navigation-bar>` component  A horizontal navigation component following Material Design 3 specifications. Navigation bars provide access to between 3-7 primary destinations. Automatically hides in fullscreen mode when triggered via schmancyTheme.next({ fullscreen: true }).  **IMPORTANT**: This component includes `z-10` by default (consistent with navigation-rail). The consumer is responsible for positioning the navigation bar in their layout. For typical bottom-fixed positioning, add: `class=\"fixed bottom-0 left-0 right-0\"`.",
           "attributes": [
             {
               "name": "hideLabels",
@@ -4558,13 +4062,7 @@
           "kind": "class",
           "name": "SchmancyNavigationRailItem",
           "tagName": "schmancy-navigation-rail-item",
-          "description": "Single destination inside schmancy-navigation-rail — vertically-stacked icon + optional label. @see https://m3.material.io/components/navigation-rail/overview",
-          "summary": "Always nested inside schmancy-navigation-rail. Use `icon` attr for a Material Symbols glyph, or slot=icon for custom content. Supports a `badge` slot for notification dots / counts.",
-          "platformPrimitive": {
-            "tag": "button",
-            "mode": "click",
-            "note": "Styled vertical navigation target. Degrades to a plain `<button>` if the tag never registers."
-          },
+          "description": "Material Design 3 Navigation Rail Item Component",
           "attributes": [
             {
               "name": "icon",
@@ -4702,7 +4200,7 @@
           "kind": "class",
           "name": "SchmancyNavigationRail",
           "tagName": "schmancy-navigation-rail",
-          "description": "Vertical navigation rail — Material Design 3 compact left-side nav for desktop / tablet layouts with 3–7 primary destinations. Auto-hides in fullscreen mode. @see https://m3.material.io/components/navigation-rail/overview\r  @element schmancy-navigation-rail\r @summary Use as the desktop counterpart of schmancy-navigation-bar: same destinations, different form factor. Prefer schmancy-nav-drawer when you also want a drawer + app-bar combo.",
+          "description": "Material Design 3 Navigation Rail Component\r @see https://m3.material.io/components/navigation-rail/overview\r  `<schmancy-navigation-rail>` component\r  A Material Design 3 vertical navigation component positioned on the left side of an application.\r Navigation rails provide access to between 3-7 primary destinations with a compact footprint.\r Automatically hides in fullscreen mode when triggered via schmancyTheme.next({ fullscreen: true }).\r  @element schmancy-navigation-rail\r @slot fab - Slot for a floating action button at the top\r @slot menu - Slot for a menu icon or button below the FAB\r @slot header - Custom header content slot\r @slot footer - Custom footer content slot\r @slot - Default slot for navigation rail items\r  @fires navigate - When a navigation item is selected\r @fires menu-click - When the menu button is clicked\r @fires fab-click - When the FAB is clicked\r  @csspart rail - The main rail container\r @csspart header - The header section\r @csspart nav - The navigation items container\r @csspart footer - The footer section",
           "attributes": [
             {
               "name": "label-visibility",
@@ -4756,7 +4254,6 @@
             }
           ],
           "examples": [
-            "<schmancy-navigation-rail activeIndex=\"0\">\r\n  <schmancy-icon-button slot=\"fab\" variant=\"filled\">\r\n    <schmancy-icon>add</schmancy-icon>\r\n  </schmancy-icon-button>\r\n  <schmancy-navigation-rail-item icon=\"home\" label=\"Home\"></schmancy-navigation-rail-item>\r\n  <schmancy-navigation-rail-item icon=\"search\" label=\"Search\"></schmancy-navigation-rail-item>\r\n  <schmancy-navigation-rail-item icon=\"settings\" label=\"Settings\"></schmancy-navigation-rail-item>\r\n</schmancy-navigation-rail>\r\n@platform nav - Vertical styled nav. Degrades to a plain vertical flex container if the tag never registers.\r\n@slot fab - Slot for a floating action button at the top\r\n@slot menu - Slot for a menu icon or button below the FAB\r\n@slot header - Custom header content slot\r\n@slot footer - Custom footer content slot\r\n@slot - Default slot for navigation rail items\r\n\n@fires navigate - When a navigation item is selected\r\n@fires menu-click - When the menu button is clicked\r\n@fires fab-click - When the FAB is clicked\r\n\n@csspart rail - The main rail container\r\n@csspart header - The header section\r\n@csspart nav - The navigation items container\r\n@csspart footer - The footer section",
             "<schmancy-navigation-rail activeIndex=\"0\">\r\n  <schmancy-button slot=\"fab\" variant=\"filled\" aria-label=\"Compose\">\r\n    <schmancy-icon>add</schmancy-icon>\r\n  </schmancy-button>\r\n  <schmancy-button slot=\"menu\" variant=\"text\" aria-label=\"Menu\">\r\n    <schmancy-icon>menu</schmancy-icon>\r\n  </schmancy-button>\r\n  <schmancy-navigation-rail-item icon=\"home\" label=\"Home\"></schmancy-navigation-rail-item>\r\n  <schmancy-navigation-rail-item icon=\"search\" label=\"Search\"></schmancy-navigation-rail-item>\r\n  <schmancy-navigation-rail-item icon=\"favorite\" label=\"Favorites\" badge=\"3\"></schmancy-navigation-rail-item>\r\n  <schmancy-navigation-rail-item icon=\"settings\" label=\"Settings\"></schmancy-navigation-rail-item>\r\n</schmancy-navigation-rail>"
           ]
         }
@@ -4961,7 +4458,7 @@
           "kind": "class",
           "name": "SchmancyOverlay",
           "tagName": "schmancy-overlay",
-          "description": "The single overlay element. Hosts a native `<dialog>` in its shadow root for centered/sheet layouts; for anchored, we stay modeless by using `<dialog>` with .show() (non-modal) + explicit positioning.  Public lifecycle: the service calls `open()` to mount content and animate in, `close(reason)` to animate out and dismiss. The element dispatches `overlay-close` when closed; the service listens and resolves the caller's Observable.",
+          "description": "The single overlay element. Custom `<div>` shell (not a native `<dialog>`) — one backdrop mechanism for all layouts, one focus-trap path, one animation orchestrator. The shell is always rendered; the backdrop only renders when modal. The surface is positioned per tier:  - Modal layouts (centered / sheet) → backdrop + surface, focus-trapped,   library-managed z-index. - Anchored 'css-anchor' tier → surface as `popover=\"auto\"` with   CSS Anchor Positioning; native top-layer + light-dismiss. - Anchored 'popover-fui' tier → surface as `popover=\"auto\"` + Floating   UI position math; native top-layer + light-dismiss. - Anchored 'fui-only' tier → surface positioned by Floating UI;   manual click-outside + manual Esc.  Public lifecycle: the service calls `open()` to mount content and animate in, `close(reason)` to animate out and dismiss. The element exposes `closed$` (Observable emitting reason + result once) and `tier` / `layout` / `modal` as properties for the stack entry.",
           "attributes": [
             {
               "name": "layout",
@@ -4988,6 +4485,19 @@
                 "text": "boolean"
               },
               "default": "true"
+            },
+            {
+              "name": "tier",
+              "type": {
+                "text": "OverlayTier"
+              },
+              "values": [
+                "css-anchor",
+                "popover-fui",
+                "fui-only",
+                "modal"
+              ],
+              "default": "'modal'"
             }
           ]
         }
@@ -5080,8 +4590,20 @@
             {
               "name": "input-type",
               "type": {
-                "text": "string"
+                "text": "\"number\" | \"text\" | \"date\" | \"datetime-local\" | \"tel\" | \"search\" | \"email\" | \"url\" | \"password\" | \"time\""
               },
+              "values": [
+                "number",
+                "text",
+                "date",
+                "datetime-local",
+                "tel",
+                "search",
+                "email",
+                "url",
+                "password",
+                "time"
+              ],
               "default": "'text'"
             },
             {
@@ -5109,13 +4631,7 @@
           "kind": "class",
           "name": "SchmancyPage",
           "tagName": "schmancy-page",
-          "description": "Mobile-first page container — fills remaining viewport height, suppresses double-tap zoom / pull-to-refresh / rubber-banding. Lays children in a CSS grid whose row template is `rows`.",
-          "summary": "The root of any app view — wraps header / main / footer children in a full-viewport grid. Use rows=\"auto_1fr_auto\" to make the middle child scroll while header/footer stay pinned.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Full-height CSS-grid container. Degrades to a plain div if the tag never registers — children still flow vertically but without the height fill and gesture suppression."
-          },
+          "description": "Native mobile-like page container. Prevents double-tap zoom, pull-to-refresh, rubber-banding. Automatically fills remaining viewport height.",
           "attributes": [
             {
               "name": "rows",
@@ -5141,7 +4657,40 @@
             }
           ],
           "examples": [
-            "<schmancy-page rows=\"auto_1fr_auto\">\n  <schmancy-nav-drawer-appbar>Title</schmancy-nav-drawer-appbar>\n  <main>Scrollable content</main>\n  <schmancy-navigation-bar></schmancy-navigation-bar>\n</schmancy-page>"
+            "html`\n  <schmancy-page rows=\"1fr_2fr_auto\">\n    <header>App Bar</header>\n    <main>Scrollable content</main>\n    <footer>Navigation</footer>\n  </schmancy-page>\n`"
+          ]
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "payment-card-form/payment-card-form.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "name": "SchmancyPaymentCardForm",
+          "tagName": "schmancy-payment-card-form",
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "{ cardName: string; cardNumber: string; expirationDate: string; cvv: string; }"
+              },
+              "default": "{\n\t\tcardName: '',\n\t\tcardNumber: '',\n\t\texpirationDate: '',\n\t\tcvv: '',\n\t}",
+              "description": "The form data containing all payment card information"
+            }
+          ],
+          "events": [
+            {
+              "name": "change",
+              "description": "Fires when any field in the form changes"
+            }
+          ],
+          "slots": [
+            {
+              "name": "",
+              "description": "Default slot for any additional content"
+            }
           ]
         }
       ]
@@ -5242,13 +4791,7 @@
           "kind": "class",
           "name": "RadioButton",
           "tagName": "schmancy-radio-button",
-          "description": "Single radio button — always rendered as a child of `<schmancy-radio-group>`, never standalone.",
-          "summary": "Low-level primitive. Use schmancy-radio-group and pass `.options` for the common path; only instantiate schmancy-radio-button directly when you need per-button custom rendering.",
-          "platformPrimitive": {
-            "tag": "radio",
-            "mode": "change",
-            "note": "Schmancy-skinned `<input type=\"radio\">` semantics. Degrades to native radio if the tag never registers."
-          },
+          "description": "Radio button component for use within radio groups.",
           "attributes": [
             {
               "name": "value",
@@ -5278,15 +4821,6 @@
               },
               "default": "''"
             }
-          ],
-          "events": [
-            {
-              "name": "radio-button-click",
-              "description": "Internal event consumed by the parent schmancy-radio-group; `detail.value` is the clicked button's value. Listen on schmancy-radio-group for the public `change` event instead of subscribing here."
-            }
-          ],
-          "examples": [
-            "<schmancy-radio-group name=\"plan\">\n  <schmancy-radio-button value=\"free\">Free</schmancy-radio-button>\n  <schmancy-radio-button value=\"pro\" checked>Pro</schmancy-radio-button>\n</schmancy-radio-group>"
           ]
         }
       ]
@@ -5299,13 +4833,6 @@
           "kind": "class",
           "name": "RadioGroup",
           "tagName": "schmancy-radio-group",
-          "description": "Radio-button group — single-select from a static list of mutually-exclusive options. Form-associated.",
-          "summary": "Use for 2–5 mutually-exclusive options where all should stay visible (\"Shipping: standard / express / overnight\"). Prefer schmancy-select when the list grows.",
-          "platformPrimitive": {
-            "tag": "radiogroup",
-            "mode": "change",
-            "note": "Renders schmancy-radio-button children. Degrades to a fieldset with native `<input type=\"radio\" name=\"…\">` siblings if the tag never registers."
-          },
           "attributes": [
             {
               "name": "label",
@@ -5342,15 +4869,6 @@
               },
               "default": "false"
             }
-          ],
-          "events": [
-            {
-              "name": "change",
-              "description": "`SchmancyRadioGroupChangeEvent` with the selected `value`."
-            }
-          ],
-          "examples": [
-            "<schmancy-radio-group\n  name=\"shipping\"\n  label=\"Shipping\"\n  .options=${[\n    { label: 'Standard (5 days)', value: 'standard' },\n    { label: 'Express (2 days)', value: 'express' },\n    { label: 'Overnight', value: 'overnight' },\n  ]}\n></schmancy-radio-group>"
           ]
         }
       ]
@@ -5423,13 +4941,7 @@
           "kind": "class",
           "name": "SchmancySelect",
           "tagName": "schmancy-select",
-          "description": "Dropdown selector — single or multi-select from a list of `<schmancy-option>` children. Form-associated.",
-          "summary": "Material Design dropdown with type-to-filter, keyboard nav, single or multi-select. Options are declared as `<schmancy-option>` children; value / values props sync with selection.",
-          "platformPrimitive": {
-            "tag": "select",
-            "mode": "change",
-            "note": "Floating-UI-positioned listbox. Degrades to native `<select>` styled via Tailwind if the tag never registers, though multi-select UX is lost."
-          },
+          "description": "Select dropdown component with single and multi-select support.",
           "attributes": [
             {
               "name": "name",
@@ -5513,15 +5025,6 @@
               },
               "default": "''"
             }
-          ],
-          "events": [
-            {
-              "name": "change",
-              "description": "`SchmancySelectChangeEvent` with `{ value }` (single) or `{ value: string[] }` (multi)."
-            }
-          ],
-          "examples": [
-            "<schmancy-select name=\"priority\" label=\"Priority\" value=\"medium\">\n  <schmancy-option value=\"low\">Low</schmancy-option>\n  <schmancy-option value=\"medium\">Medium</schmancy-option>\n  <schmancy-option value=\"high\">High</schmancy-option>\n</schmancy-select>"
           ]
         }
       ]
@@ -5557,13 +5060,6 @@
           "kind": "class",
           "name": "SchmancySheet",
           "tagName": "schmancy-sheet",
-          "description": "Side-docked or bottom-docked panel — a dialog variant that slides in from an edge. Driven imperatively by the `sheet` service; rarely instantiated directly.",
-          "summary": "Prefer `sheet.open({ component, position })` over placing this element declaratively — the service handles stacking, focus, close on outside-click, ESC, and router integration.",
-          "platformPrimitive": {
-            "tag": "dialog",
-            "mode": "close",
-            "note": "Positioned-fixed panel with backdrop. Degrades to a `<dialog>` if the tag never registers — loses slide animation, keeps focus trap + dismiss."
-          },
           "attributes": [
             {
               "name": "open",
@@ -5604,15 +5100,6 @@
               },
               "default": "true"
             }
-          ],
-          "events": [
-            {
-              "name": "close",
-              "description": "When the sheet is dismissed (backdrop click, close button, ESC)."
-            }
-          ],
-          "examples": [
-            "import { sheet, SchmancySheetPosition } from '@mhmo91/schmancy'\nsheet.open({\n  component: new MyEditorElement(),\n  position: SchmancySheetPosition.Side,\n  title: 'Edit item',\n})"
           ]
         }
       ]
@@ -5928,13 +5415,7 @@
           "kind": "class",
           "name": "SchmancySurface",
           "tagName": "schmancy-surface",
-          "description": "Themed container — the root surface primitive. Sets background, text color, rounding, elevation, and (optionally) internal scroll. Provides a `SchmancySurfaceTypeContext` so descendants can adapt to the enclosing surface variant.",
-          "summary": "Wrap a region of a page when you need it to pick up theme tokens (background + on-color + elevation). Nest surfaces to express Material Design's hierarchical color stacking.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Styled `<div>` with theme-driven background/color/elevation. Degrades to a plain `<div>` if the tag never registers — text stays readable, just loses theming."
-          },
+          "description": "`<schmancy-surface>` component  This component renders a styled container that adapts its dimensions based on the `fill` property. It supports various rounding options, elevation levels, and applies background and text color classes based on the specified surface variant. Additionally, when the `scroller` property is true, the component enables internal scrolling by applying overflow and scroll-behavior styles.  SurfaceMixin automatically provides surfaceStyles CSS.",
           "attributes": [
             {
               "name": "type",
@@ -5995,13 +5476,7 @@
           "kind": "class",
           "name": "SchmancySwitch",
           "tagName": "schmancy-switch",
-          "description": "Binary on/off control with immediate effect. Form-associated, keyboard-accessible, semantically a switch (ARIA role=\"switch\"). Distinct from `schmancy-checkbox`: a switch represents an immediate state change, a checkbox represents a selection in a form to be submitted.",
-          "summary": "Use when flipping the control takes effect right away (e.g. \"Dark mode\", \"Enable notifications\"). Prefer schmancy-checkbox for form submissions.",
-          "platformPrimitive": {
-            "tag": "switch",
-            "mode": "change",
-            "note": "Accessible native `<button role=\"switch\" aria-checked>` under the hood. No native HTML element exists; falls back to a styled checkbox if the tag never registers."
-          },
+          "description": "Binary on/off control. Form-associated, keyboard-accessible, semantically a switch (ARIA role=\"switch\"). Distinct from `schmancy-checkbox`: a switch represents an immediate state change, a checkbox represents a selection in a form to be submitted.",
           "attributes": [
             {
               "name": "checked",
@@ -6061,9 +5536,6 @@
               "name": "thumb",
               "description": "The moving thumb."
             }
-          ],
-          "examples": [
-            "<schmancy-switch ?checked=${this.darkMode} @change=${(e) => this.darkMode = e.detail.value}>\n  Dark mode\n</schmancy-switch>"
           ]
         }
       ]
@@ -6096,13 +5568,7 @@
           "kind": "class",
           "name": "SchmancyDataTable",
           "tagName": "schmancy-table",
-          "description": "Generic data table — typed columns, optional sort, custom renderers per column. Pass `data` (array) and `columns` (TableColumn descriptors).",
-          "summary": "Use for tabular data where each column has a known shape. Pair with `<schmancy-table-row>` for the per-row interaction surface. Sort by setting `sortable: true` on a column descriptor; the table emits `sort-change` so the parent can re-fetch / re-sort in the data layer if needed.",
-          "platformPrimitive": {
-            "tag": "table",
-            "mode": "-",
-            "note": "Renders an accessible table with `<lit-virtualizer>` for large datasets. Degrades to a styled `<table>` if the tag never registers."
-          },
+          "description": "SchmancyDataTable is a generic data table component. It supports sorting, filtering, and custom rendering of rows.",
           "attributes": [
             {
               "name": "keyField",
@@ -6125,19 +5591,6 @@
               },
               "default": "false"
             }
-          ],
-          "events": [
-            {
-              "name": "click",
-              "description": "When a data row is activated. `detail.item` is the row's source object, `detail.index` is the position in the data array."
-            },
-            {
-              "name": "sort-change",
-              "description": "When the user toggles a column sort. `detail.column` is the column key, `detail.direction` is `'asc' | 'desc' | null`."
-            }
-          ],
-          "examples": [
-            "<schmancy-table .data=${rows} .columns=${[{ name: 'Name', key: 'name' }, { name: 'Status', key: 'status' }]}></schmancy-table>"
           ]
         }
       ]
@@ -6275,13 +5728,7 @@
           "kind": "class",
           "name": "SchmancyTextarea",
           "tagName": "schmancy-textarea",
-          "description": "Multi-line text input with auto-resize and form integration. Form-associated.",
-          "summary": "Textarea for freeform text — notes, descriptions, messages. Auto-grows with content up to a maxlength.",
-          "platformPrimitive": {
-            "tag": "textarea",
-            "mode": "change",
-            "note": "Schmancy-skinned native `<textarea>`. Degrades to styled native `<textarea>` if the tag never registers."
-          },
+          "description": "Textarea component with auto-resize and form integration.",
           "attributes": [
             {
               "name": "label",
@@ -6460,19 +5907,6 @@
               },
               "default": "false"
             }
-          ],
-          "events": [
-            {
-              "name": "input",
-              "description": "On every keystroke."
-            },
-            {
-              "name": "change",
-              "description": "On blur."
-            }
-          ],
-          "examples": [
-            "<schmancy-textarea name=\"description\" label=\"Description\" rows=\"4\" maxlength=\"500\"></schmancy-textarea>"
           ]
         }
       ]
@@ -6535,13 +5969,7 @@
           "kind": "class",
           "name": "SchmancyThemeComponent",
           "tagName": "schmancy-theme",
-          "description": "Theme provider — generates a Material 3 palette from a seed color, resolves light/dark scheme, and publishes the token set to descendants as CSS custom properties (var(--schmancy-sys-color-…)).",
-          "summary": "Always wrap your app root in a `<schmancy-theme root scheme=\"auto\" color=\"#…\">`. Nest additional `<schmancy-theme>` blocks to override theming for a subtree.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Styled `<div>` that publishes theme tokens via inline `--schmancy-sys-color-*` custom properties. Degrades to a plain div if the tag never registers — children lose theming and fall back to browser defaults."
-          },
+          "description": "SchmancyThemeComponent - Provides theming capabilities for Schmancy components.  This component manages color schemes, primary colors, and theme distribution throughout the component tree. It can be used at the root level or nested to provide different themes to different parts of the application.",
           "attributes": [
             {
               "name": "color",
@@ -6596,8 +6024,7 @@
             }
           ],
           "examples": [
-            "<!-- Root theme provider -->\n<schmancy-theme root scheme=\"auto\" color=\"#6200ee\">\n  <your-app></your-app>\n</schmancy-theme>",
-            "<!-- Nested theme for a specific section -->\n<schmancy-theme scheme=\"dark\" color=\"#2196f3\">\n  <schmancy-surface fill=\"all\">\n    <!-- Components here use the blue dark theme -->\n  </schmancy-surface>\n</schmancy-theme>"
+            "<!-- Root theme provider -->\n<schmancy-theme color=\"#6200ee\" scheme=\"auto\" root>\n  <your-app></your-app>\n</schmancy-theme>\n\n<!-- Nested theme for specific section -->\n<schmancy-theme color=\"#2196f3\" scheme=\"dark\">\n  <div class=\"dark-section\">\n    <!-- Components here will use blue dark theme -->\n  </div>\n</schmancy-theme>"
           ],
           "contexts": [
             {
@@ -6647,145 +6074,87 @@
     },
     {
       "kind": "javascript-module",
-      "path": "tree/tree.ts",
+      "path": "timeline/timeline-tile.ts",
       "declarations": [
         {
           "kind": "class",
-          "name": "SchmancyTree",
-          "tagName": "schmancy-tree",
-          "description": "Expandable tree node — a recursive disclosure widget. One root slot, one default slot for child nodes. Each node can itself contain schmancy-tree children.",
-          "summary": "Use for hierarchical navigation / file-explorer layouts. Each level is a schmancy-tree with a `root` slot (the parent label) and default slot (the children, which may be more schmancy-trees).",
-          "platformPrimitive": {
-            "tag": "details",
-            "mode": "toggle",
-            "note": "Recursive `<details>`-like disclosure. Degrades to a plain nested list if the tag never registers — loses expand/collapse but stays navigable."
-          },
+          "name": "SchmancyTimelineTile",
+          "tagName": "schmancy-timeline-tile",
           "attributes": [
             {
-              "name": "open",
+              "name": "state",
               "type": {
-                "text": "boolean"
+                "text": "TimelineTileState"
               },
-              "default": "false",
-              "description": "Whether the tree’s children are visible"
-            }
-          ],
-          "events": [
+              "values": [
+                "filled",
+                "empty",
+                "stack-top",
+                "stack-sibling"
+              ],
+              "default": "'empty'"
+            },
             {
-              "name": "toggle",
-              "description": "When the root toggler or chevron is clicked. Fires before the open state flips; the host's `open` property reflects the new state on the next animation frame."
-            }
-          ],
-          "slots": [
-            {
-              "name": "root",
-              "description": "The root element of the tree"
-            },
-            {
-              "name": "",
-              "description": "The children of the tree"
-            }
-          ],
-          "examples": [
-            "<schmancy-tree>\n  <schmancy-list-item slot=\"root\">src/</schmancy-list-item>\n  <schmancy-tree>\n    <schmancy-list-item slot=\"root\">components/</schmancy-list-item>\n    <schmancy-list-item>button.ts</schmancy-list-item>\n  </schmancy-tree>\n</schmancy-tree>"
-          ]
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "typewriter/typewriter.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "name": "TypewriterElement",
-          "tagName": "schmancy-typewriter",
-          "description": "Typewriter effect — animates text typing/deletion with a cursor. Wraps the TypeIt library, lazy-loaded on first render.",
-          "summary": "Drop string content as the default slot or use `<p>` / `<span>` with `cycle=\"A|B|C\"` attribute children for cycling phrases. Set `loop` for infinite cycling, `once` to remember completion across sessions via sessionStorage.",
-          "platformPrimitive": {
-            "tag": "span",
-            "mode": "-",
-            "note": "Animated text container. Degrades to its raw text content if the tag never registers — animation is lost but content stays visible."
-          },
-          "attributes": [
-            {
-              "name": "speed",
+              "name": "glyph",
               "type": {
-                "text": "number"
+                "text": "string"
               },
-              "default": "35",
-              "description": "Typing speed in milliseconds per character."
+              "default": "''"
             },
             {
-              "name": "delay",
+              "name": "stack-count",
               "type": {
                 "text": "number"
-              },
-              "default": "0",
-              "description": "Delay before typing starts (ms)."
+              }
             },
             {
-              "name": "autoStart",
+              "name": "index",
               "type": {
-                "text": "boolean"
-              },
-              "default": "true",
-              "description": "Automatically start typing on initialization."
+                "text": "number"
+              }
             },
             {
-              "name": "cursorChar",
+              "name": "tooltip",
               "type": {
                 "text": "string"
-              },
-              "default": "''",
-              "description": "The cursor character."
-            },
-            {
-              "name": "deleteSpeed",
-              "type": {
-                "text": "number"
-              },
-              "default": "20",
-              "description": "Typing speed for deletions (ms per character)."
+              }
             },
             {
-              "name": "once",
+              "name": "caption",
               "type": {
-                "text": "boolean"
-              },
-              "default": "true",
-              "description": "Only animate once per session."
-            },
+                "text": "string"
+              }
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "tree/tree.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "name": "SchmancyTree",
+          "tagName": "schmancy-tree",
+          "attributes": [
             {
-              "name": "loop",
+              "name": "open",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Loop the animation infinitely (overrides once)."
-            },
-            {
-              "name": "cyclePause",
-              "type": {
-                "text": "number"
-              },
-              "default": "1500",
-              "description": "Default pause duration for cycling (ms)."
+              "description": "Whether the tree’s children are visible"
             }
           ],
-          "events": [
+          "slots": [
             {
-              "name": "typeit-complete",
-              "description": "When the animation finishes typing all content. Fires after the final `afterComplete` callback in the underlying TypeIt instance."
-            }
-          ],
-          "examples": [
-            "<schmancy-typewriter speed=\"35\" cursor-char=\"|\">\n  Hello, world.\n</schmancy-typewriter>"
-          ],
-          "contexts": [
+              "name": "root",
+              "description": "The root element of the tree"
+            },
             {
-              "name": "delayContext",
-              "kind": "consume"
+              "name": "",
+              "description": "The children of the tree"
             }
           ]
         }
@@ -6815,50 +6184,6 @@
               ],
               "default": "'body'"
             },
-            {
-              "name": "preset",
-              "type": {
-                "text": "TypographyPreset"
-              },
-              "values": [
-                "display",
-                "display-lg",
-                "display-md",
-                "display-sm",
-                "heading-lg",
-                "heading-md",
-                "heading-sm",
-                "title-lg",
-                "title-md",
-                "title-sm",
-                "body-lg",
-                "body-md",
-                "body-sm",
-                "label-lg",
-                "label-md",
-                "label-sm",
-                "caption"
-              ],
-              "description": "Shorthand for picking a (type, token) pair in one go. When set, derives `type` and `token` automatically — saves the two-decisions-per-text-node fatigue that hits when a single page has 50+ typography nodes."
-            },
-            {
-              "name": "as",
-              "type": {
-                "text": "TypographyTag"
-              },
-              "values": [
-                "h1",
-                "h2",
-                "h3",
-                "h4",
-                "h5",
-                "h6",
-                "p",
-                "span",
-                "div"
-              ],
-              "description": "Render the slot wrapped in the requested semantic HTML element so screen readers expose the right role / heading level. Without `as`, the slot sits directly in the shadow root and the host is a generic element."
-            },
             {
               "name": "token",
               "type": {
@@ -6940,12 +6265,6 @@
               "description": "Placeholder shown when editable and empty"
             }
           ],
-          "events": [
-            {
-              "name": "change",
-              "description": "When `editable` is true, fires on blur or Enter with `detail.value` set to the new text content. Not fired when `editable` is unset (the default)."
-            }
-          ],
           "slots": [
             {
               "name": "",
@@ -7082,39 +6401,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/form-elements/payment-card-form.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "name": "SchmancyPaymentCardForm",
-          "tagName": "schmancy-payment-card-form",
-          "attributes": [
-            {
-              "name": "value",
-              "type": {
-                "text": "{ cardName: string; cardNumber: string; expirationDate: string; cvv: string; }"
-              },
-              "default": "{\n\t\tcardName: '',\n\t\tcardNumber: '',\n\t\texpirationDate: '',\n\t\tcvv: '',\n\t}",
-              "description": "The form data containing all payment card information"
-            }
-          ],
-          "events": [
-            {
-              "name": "change",
-              "description": "Fires when any field in the form changes"
-            }
-          ],
-          "slots": [
-            {
-              "name": "",
-              "description": "Default slot for any additional content"
-            }
-          ]
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "extra/countries/countries.ts",
@@ -7123,13 +6409,6 @@
           "kind": "class",
           "name": "SchmancyCountriesSelect",
           "tagName": "schmancy-select-countries",
-          "description": "Country picker — type-ahead autocomplete over the ISO 3166-1 country list. Form-associated.",
-          "summary": "Drop-in replacement for schmancy-autocomplete when the options are specifically \"every country\". Pre-seeds the list from countries.data.",
-          "platformPrimitive": {
-            "tag": "combobox",
-            "mode": "change",
-            "note": "Composes schmancy-autocomplete with a static options list. Value is the 2-letter ISO code."
-          },
           "attributes": [
             {
               "name": "value",
@@ -7172,15 +6451,6 @@
               },
               "default": "''"
             }
-          ],
-          "events": [
-            {
-              "name": "change",
-              "description": "`SchmancyAutocompleteChangeEvent` with `{ value: string }` (the ISO code)."
-            }
-          ],
-          "examples": [
-            "<schmancy-select-countries name=\"country\" label=\"Shipping country\" required></schmancy-select-countries>"
           ]
         }
       ]
@@ -7193,13 +6463,7 @@
           "kind": "class",
           "name": "SchmancyTimezonesSelect",
           "tagName": "schmancy-select-timezones",
-          "description": "Timezone picker — type-ahead autocomplete over the IANA tz database. Form-associated.",
-          "summary": "Drop-in replacement for schmancy-autocomplete when the options are IANA timezone names. Value is the IANA identifier (\"America/Los_Angeles\").",
-          "platformPrimitive": {
-            "tag": "combobox",
-            "mode": "change",
-            "note": "Composes schmancy-autocomplete with a static IANA timezones list."
-          },
+          "description": "Timezone selector component with autocomplete filtering.",
           "attributes": [
             {
               "name": "value",
@@ -7242,203 +6506,6 @@
               },
               "default": "''"
             }
-          ],
-          "events": [
-            {
-              "name": "change",
-              "description": "`SchmancyAutocompleteChangeEvent` with `{ value: string }` (the IANA tz name)."
-            }
-          ],
-          "examples": [
-            "<schmancy-select-timezones name=\"tz\" label=\"Timezone\" value=\"America/New_York\"></schmancy-select-timezones>"
-          ]
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "layout/flex/flex.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "name": "SchmancyFlex",
-          "tagName": "schmancy-flex",
-          "attributes": [
-            {
-              "name": "flow",
-              "type": {
-                "text": "\"row\" | \"row-reverse\" | \"col\" | \"col-reverse\""
-              },
-              "values": [
-                "row",
-                "row-reverse",
-                "col",
-                "col-reverse"
-              ],
-              "default": "'col'"
-            },
-            {
-              "name": "wrap",
-              "type": {
-                "text": "\"wrap\" | \"nowrap\" | \"wrap-reverse\""
-              },
-              "values": [
-                "wrap",
-                "nowrap",
-                "wrap-reverse"
-              ],
-              "default": "'wrap'"
-            },
-            {
-              "name": "align",
-              "type": {
-                "text": "\"start\" | \"center\" | \"end\" | \"stretch\" | \"baseline\""
-              },
-              "values": [
-                "start",
-                "center",
-                "end",
-                "stretch",
-                "baseline"
-              ],
-              "default": "'start'"
-            },
-            {
-              "name": "justify",
-              "type": {
-                "text": "\"start\" | \"center\" | \"end\" | \"stretch\" | \"between\""
-              },
-              "values": [
-                "start",
-                "center",
-                "end",
-                "stretch",
-                "between"
-              ],
-              "default": "'start'"
-            },
-            {
-              "name": "gap",
-              "type": {
-                "text": "\"sm\" | \"md\" | \"lg\" | \"none\""
-              },
-              "values": [
-                "sm",
-                "md",
-                "lg",
-                "none"
-              ],
-              "default": "'none'"
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "layout/grid/grid.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "name": "SchmancyGrid",
-          "tagName": "schmancy-grid",
-          "attributes": [
-            {
-              "name": "flow",
-              "type": {
-                "text": "\"row\" | \"col\" | \"dense\" | \"row-dense\" | \"col-dense\""
-              },
-              "values": [
-                "row",
-                "col",
-                "dense",
-                "row-dense",
-                "col-dense"
-              ],
-              "default": "'row'"
-            },
-            {
-              "name": "align",
-              "type": {
-                "text": "\"start\" | \"center\" | \"end\" | \"stretch\" | \"baseline\""
-              },
-              "values": [
-                "start",
-                "center",
-                "end",
-                "stretch",
-                "baseline"
-              ],
-              "default": "'stretch'"
-            },
-            {
-              "name": "justify",
-              "type": {
-                "text": "\"start\" | \"center\" | \"end\" | \"stretch\""
-              },
-              "values": [
-                "start",
-                "center",
-                "end",
-                "stretch"
-              ],
-              "default": "'stretch'"
-            },
-            {
-              "name": "content",
-              "type": {
-                "text": "\"start\" | \"center\" | \"end\" | \"stretch\" | \"between\" | \"around\" | \"evenly\""
-              },
-              "values": [
-                "start",
-                "center",
-                "end",
-                "stretch",
-                "between",
-                "around",
-                "evenly"
-              ],
-              "default": "'stretch'"
-            },
-            {
-              "name": "gap",
-              "type": {
-                "text": "\"xs\" | \"sm\" | \"md\" | \"lg\" | \"none\""
-              },
-              "values": [
-                "xs",
-                "sm",
-                "md",
-                "lg",
-                "none"
-              ],
-              "default": "'none'"
-            },
-            {
-              "name": "cols",
-              "type": {
-                "text": "string"
-              }
-            },
-            {
-              "name": "rows",
-              "type": {
-                "text": "string"
-              }
-            },
-            {
-              "name": "rcols",
-              "type": {
-                "text": "{ xs?: string | number; sm?: string | number; md?: string | number; lg?: string | number; xl?: string | number; '2xl'?: string | number; }"
-              }
-            },
-            {
-              "name": "wrap",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false"
-            }
           ]
         }
       ]
@@ -7451,13 +6518,7 @@
           "kind": "class",
           "name": "SchmancyScroll",
           "tagName": "schmancy-scroll",
-          "description": "Scrollable container with debounced scroll events, horizontal/vertical direction, optional hidden scrollbar, and programmatic scrollTo via command events or refs.",
-          "summary": "Use anywhere you'd reach for `overflow: auto` but also need debounced scroll events (for sticky headers, scroll spies, virtualization triggers) or the ability to drive scroll from elsewhere in the app by dispatching a schmancy-scroll-command event.",
-          "platformPrimitive": {
-            "tag": "div",
-            "mode": "-",
-            "note": "Styled scrollable `<div>`. Degrades to a plain scrollable div if the tag never registers — loses the debounced scroll event and the command-bus integration."
-          },
+          "description": "A custom scrollable container with enhanced features.",
           "attributes": [
             {
               "name": "hide",
@@ -7524,132 +6585,6 @@
           ]
         }
       ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "layout/v2/flex.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "name": "SchmancyFlexV2",
-          "tagName": "sch-flex",
-          "attributes": [
-            {
-              "name": "inline",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "name": "flow",
-              "type": {
-                "text": "\"row\" | \"row-reverse\" | \"col\" | \"col-reverse\" | \"row-dense\" | \"col-dense\""
-              },
-              "values": [
-                "row",
-                "row-reverse",
-                "col",
-                "col-reverse",
-                "row-dense",
-                "col-dense"
-              ],
-              "default": "'row'",
-              "description": "Flow property that determines the flex direction. Allowed values:  - Standard: 'row', 'row-reverse', 'col', 'col-reverse'  - Dense variants: 'row-dense', 'col-dense' (dense implies wrapping)"
-            },
-            {
-              "name": "wrap",
-              "type": {
-                "text": "\"wrap\" | \"nowrap\" | \"wrap-reverse\""
-              },
-              "values": [
-                "wrap",
-                "nowrap",
-                "wrap-reverse"
-              ],
-              "default": "'wrap'",
-              "description": "Flex-wrap options:  - 'wrap', 'nowrap', or 'wrap-reverse'"
-            },
-            {
-              "name": "align",
-              "type": {
-                "text": "\"start\" | \"center\" | \"end\" | \"stretch\" | \"baseline\""
-              },
-              "values": [
-                "start",
-                "center",
-                "end",
-                "stretch",
-                "baseline"
-              ],
-              "default": "'stretch'",
-              "description": "Align-items (vertical alignment of flex items):  - 'start', 'center', 'end', 'stretch', or 'baseline'"
-            },
-            {
-              "name": "justify",
-              "type": {
-                "text": "\"start\" | \"center\" | \"end\" | \"between\" | \"around\" | \"evenly\""
-              },
-              "values": [
-                "start",
-                "center",
-                "end",
-                "between",
-                "around",
-                "evenly"
-              ],
-              "default": "'start'",
-              "description": "Justify-content (horizontal distribution):  - 'start', 'center', 'end', 'between', 'around', or 'evenly'"
-            },
-            {
-              "name": "content",
-              "type": {
-                "text": "\"start\" | \"center\" | \"end\" | \"between\" | \"around\" | \"evenly\""
-              },
-              "values": [
-                "start",
-                "center",
-                "end",
-                "between",
-                "around",
-                "evenly"
-              ],
-              "description": "Align-content (spacing between rows when wrapping):  - 'start', 'center', 'end', 'between', 'around', or 'evenly'"
-            },
-            {
-              "name": "gap",
-              "type": {
-                "text": "\"none\" | \"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\" | \"10\" | \"12\" | \"16\" | \"20\" | \"24\" | \"32\" | \"40\" | \"48\" | \"56\" | \"64\""
-              },
-              "values": [
-                "none",
-                "0",
-                "1",
-                "2",
-                "3",
-                "4",
-                "5",
-                "6",
-                "7",
-                "8",
-                "9",
-                "10",
-                "12",
-                "16",
-                "20",
-                "24",
-                "32",
-                "40",
-                "48",
-                "56",
-                "64"
-              ],
-              "default": "'none'",
-              "description": "Gap between flex items. Options (based on Tailwind CSS 4 spacing scale):  - 'none', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '12', '16', '20', '24', '32', '40', '48', '56', or '64'"
-            }
-          ]
-        }
-      ]
     }
   ],
   "tokens": [
@@ -7785,145 +6720,10 @@
     "schmancy-sys-typescale-title-small"
   ],
   "conventions": [
-    "Before authoring any custom element, call window.schmancy.help() to scan the elements[] list. Only compose from primitives if no existing tag fits.",
-    "Use $dialog.confirm / sheet.open / $notify imperatively for overlays. Do not roll element-based dialogs, sheets, or toasts.",
-    "Every UI tag must be a <schmancy-*> custom element. Replace <button> with <schmancy-button>, <input> with <schmancy-input>, <li> with <schmancy-list-item>, etc.",
-    "Every <schmancy-*> tag used in output must exist in the manifest declarations[]. Hand-rolled tags are violations.",
-    "Every attribute on a <schmancy-*> element must be declared in that tag's attributes[] in the manifest.",
-    "When an attribute has a values[] enum, only those values are valid.",
-    "Never use hex literals (#6200ee) in style or class. Reference --schmancy-sys-color-* tokens or the Tailwind utilities that wrap them.",
-    "Never use Tailwind arbitrary values like bg-[#xxx] or text-[13px]. Use bg-primary-default, text-surface-on, and the typography presets instead.",
-    "Prefer Tailwind utility classes (bg-primary-default, text-surface-on) over raw --schmancy-sys-color-* CSS variables. Fall back to the CSS variable only when Tailwind lacks a utility for the property.",
-    "Form-associated controls work standalone, but always wrap a related group in <schmancy-form> so its submit event fires with a FormData payload.",
-    "schmancy-icon-button has no text content; provide aria-label so screen readers can announce it.",
     "Every component extends `$LitElement`, not raw `LitElement`. Use the mixin from `@mhmo91/schmancy/mixins`.",
     "RxJS subscriptions inside a component must end with `.pipe(takeUntil(this.disconnecting))` for automatic cleanup on disconnect.",
     "Theme must wrap a surface: `<schmancy-theme>` provides design tokens, `<schmancy-surface>` paints the background and inherits text color.",
     "Use `repeat()` from `lit/directives/repeat.js` for dynamic lists — never `.map()` inside `html```.",
     "Prefer `fromEvent(target, type).pipe(takeUntil(this.disconnecting))` over raw `addEventListener` inside components."
-  ],
-  "rules": [
-    {
-      "id": "discovery-first",
-      "scope": "workflow",
-      "rule": "Before authoring any custom element, call window.schmancy.help() to scan the elements[] list. Only compose from primitives if no existing tag fits.",
-      "severity": "error"
-    },
-    {
-      "id": "use-existing-overlay-services",
-      "scope": "workflow",
-      "rule": "Use $dialog.confirm / sheet.open / $notify imperatively for overlays. Do not roll element-based dialogs, sheets, or toasts.",
-      "severity": "error"
-    },
-    {
-      "id": "schmancy-tags-only",
-      "scope": "global",
-      "rule": "Every UI tag must be a <schmancy-*> custom element. Replace <button> with <schmancy-button>, <input> with <schmancy-input>, <li> with <schmancy-list-item>, etc.",
-      "severity": "error",
-      "validator": "tag-namespace"
-    },
-    {
-      "id": "tag-must-exist",
-      "scope": "tag",
-      "rule": "Every <schmancy-*> tag used in output must exist in the manifest declarations[]. Hand-rolled tags are violations.",
-      "severity": "error",
-      "validator": "tag-exists"
-    },
-    {
-      "id": "attribute-in-spec",
-      "scope": "attribute",
-      "rule": "Every attribute on a <schmancy-*> element must be declared in that tag's attributes[] in the manifest.",
-      "severity": "error",
-      "validator": "attr-in-spec"
-    },
-    {
-      "id": "enum-attribute-value",
-      "scope": "attribute",
-      "rule": "When an attribute has a values[] enum, only those values are valid.",
-      "severity": "error",
-      "validator": "enum-value-valid"
-    },
-    {
-      "id": "no-hex-literals",
-      "scope": "token",
-      "applies": [
-        "style",
-        "class"
-      ],
-      "rule": "Never use hex literals (#6200ee) in style or class. Reference --schmancy-sys-color-* tokens or the Tailwind utilities that wrap them.",
-      "severity": "error",
-      "validator": "no-hex"
-    },
-    {
-      "id": "no-arbitrary-tailwind-values",
-      "scope": "token",
-      "applies": [
-        "class"
-      ],
-      "rule": "Never use Tailwind arbitrary values like bg-[#xxx] or text-[13px]. Use bg-primary-default, text-surface-on, and the typography presets instead.",
-      "severity": "error",
-      "validator": "no-arbitrary-values"
-    },
-    {
-      "id": "tailwind-classes-preferred-over-css-vars",
-      "scope": "token",
-      "rule": "Prefer Tailwind utility classes (bg-primary-default, text-surface-on) over raw --schmancy-sys-color-* CSS variables. Fall back to the CSS variable only when Tailwind lacks a utility for the property.",
-      "severity": "warn"
-    },
-    {
-      "id": "form-controls-inside-schmancy-form",
-      "scope": "tag",
-      "applies": [
-        "schmancy-input",
-        "schmancy-select",
-        "schmancy-checkbox",
-        "schmancy-radio-group",
-        "schmancy-textarea",
-        "schmancy-switch",
-        "schmancy-autocomplete"
-      ],
-      "rule": "Form-associated controls work standalone, but always wrap a related group in <schmancy-form> so its submit event fires with a FormData payload.",
-      "severity": "warn"
-    },
-    {
-      "id": "icon-buttons-need-aria-label",
-      "scope": "tag",
-      "applies": [
-        "schmancy-icon-button"
-      ],
-      "rule": "schmancy-icon-button has no text content; provide aria-label so screen readers can announce it.",
-      "severity": "error",
-      "validator": "icon-button-aria-label"
-    },
-    {
-      "id": "lit-mixin",
-      "scope": "global",
-      "rule": "Every component extends `$LitElement`, not raw `LitElement`. Use the mixin from `@mhmo91/schmancy/mixins`.",
-      "severity": "hint"
-    },
-    {
-      "id": "rxjs-cleanup",
-      "scope": "global",
-      "rule": "RxJS subscriptions inside a component must end with `.pipe(takeUntil(this.disconnecting))` for automatic cleanup on disconnect.",
-      "severity": "hint"
-    },
-    {
-      "id": "theme-wraps-surface",
-      "scope": "global",
-      "rule": "Theme must wrap a surface: `<schmancy-theme>` provides design tokens, `<schmancy-surface>` paints the background and inherits text color.",
-      "severity": "hint"
-    },
-    {
-      "id": "lit-repeat-not-map",
-      "scope": "global",
-      "rule": "Use `repeat()` from `lit/directives/repeat.js` for dynamic lists — never `.map()` inside `html```.",
-      "severity": "hint"
-    },
-    {
-      "id": "rxjs-fromevent",
-      "scope": "global",
-      "rule": "Prefer `fromEvent(target, type).pipe(takeUntil(this.disconnecting))` over raw `addEventListener` inside components.",
-      "severity": "hint"
-    }
   ]
 }