@vielzeug/codex 26.11.4 → 26.11.5

package/data/refine.json

@@ -1012,6 +1012,24 @@
     ],
     "description": "Parses a boolean HTML attribute value into `true | false | undefined`, where\n`undefined` means \"attribute absent\": the signal controlled components (`open`)\nuse to distinguish uncontrolled from controlled mode.\n\nThe grammar is the standard attribute one: presence with no value (`open`) or\nthe literal `\"true\"` is true; anything else, including `\"false\"`, is false.\nEvery controlled overlay (dialog, drawer, menu, popover, tooltip,\ncommand-palette) parses its `open` prop with this exact contract."
   },
+  {
+    "kind": "function",
+    "name": "parseDetents",
+    "return": {
+      "type": {
+        "text": "readonly number[] | undefined"
+      }
+    },
+    "parameters": [
+      {
+        "name": "value",
+        "type": {
+          "text": "string | null"
+        }
+      }
+    ],
+    "description": "Parses a comma-separated list of detent fractions into a sorted, deduplicated\narray of numbers in the open interval (0, 1): `detents=\"0.5,0.75\"`. A detent\nfraction is the share of the panel that stays on-screen when a dragged panel\ncomes to rest there (`0.5` = half-open). Entries outside (0, 1) are dropped;\nan absent or fully-invalid attribute yields `undefined` (\"no detents\"), which\nkeeps the component two-state (fully open / fully closed)."
+  },
   {
     "kind": "function",
     "name": "createDropdownPositioner",
@@ -1565,6 +1583,43 @@
     ],
     "description": "The container width to test against a breakpoint, falling back to the element itself."
   },
+  {
+    "kind": "variable",
+    "name": "FLING_PROJECTION_SECONDS",
+    "type": {
+      "text": "number"
+    },
+    "default": "0.25",
+    "description": "Fling projection: how far a released gesture would travel if its release\nvelocity carried on.\n\nApple's sheet and card gestures are velocity-sensitive: a short, fast flick\ndismisses just as surely as a long slow drag that crosses the threshold. A\nfixed distance threshold alone misses the flick entirely. Projecting the\nrelease position forward by the distance the current velocity would cover in\n`seconds` folds the flick into the same comparison the component already\nmakes, so one threshold serves both gestures.\n\nA quarter-second is the sweet spot: long enough that a deliberate flick\n(~1500 px/s) projects ~375px and clears any panel threshold, short enough\nthat a slow drag reads as itself. Components pair this with\n`@vielzeug/necromancer`'s `spring()`, seeded with the same release velocity,\nso the projection decides *where* the panel settles and the spring reproduces\nthe momentum that put it there."
+  },
+  {
+    "kind": "function",
+    "name": "projectFling",
+    "return": {
+      "type": {
+        "text": "number"
+      }
+    },
+    "parameters": [
+      {
+        "name": "position",
+        "type": {
+          "text": "number"
+        }
+      },
+      {
+        "name": "velocity",
+        "type": {
+          "text": "number"
+        }
+      },
+      {
+        "name": "seconds",
+        "default": "FLING_PROJECTION_SECONDS"
+      }
+    ],
+    "description": "Project a released position forward along the direction of `velocity`\n(px/s), as if it had continued for FLING_PROJECTION_SECONDS."
+  },
   {
     "kind": "function",
     "name": "motionReduced",
@@ -4852,6 +4907,152 @@
       }
     ]
   },
+  {
+    "kind": "variable",
+    "name": "TEXT_TAG",
+    "type": {
+      "text": "'ore-text'"
+    },
+    "default": "'ore-text'",
+    "description": "A typography component with semantic variants and responsive sizing."
+  },
+  {
+    "kind": "class",
+    "name": "OreTextElement",
+    "tagName": "ore-text",
+    "customElement": true,
+    "description": "A typography component with semantic variants and responsive sizing.",
+    "summary": "",
+    "attributes": [
+      {
+        "name": "variant",
+        "type": {
+          "text": "'body' | 'heading' | 'label' | 'caption' | 'overline' | 'code'"
+        },
+        "description": "Text variant: 'body' | 'heading' | 'label' | 'caption' | 'overline' | 'code'"
+      },
+      {
+        "name": "size",
+        "type": {
+          "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
+        },
+        "description": "Font size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'. Maps to --text-* tokens for body variants and --heading-* tokens for the heading variant."
+      },
+      {
+        "name": "weight",
+        "type": {
+          "text": "'normal' | 'medium' | 'semibold' | 'bold'"
+        },
+        "description": "Font weight: 'normal' | 'medium' | 'semibold' | 'bold'"
+      },
+      {
+        "name": "color",
+        "type": {
+          "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error' | 'heading' | 'body' | 'muted' | 'tertiary' | 'disabled' | 'contrast'"
+        },
+        "description": "Text color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error' | 'heading' | 'body' | 'muted' | 'tertiary' | 'disabled' | 'contrast'"
+      },
+      {
+        "name": "align",
+        "type": {
+          "text": "'left' | 'center' | 'right' | 'justify'"
+        },
+        "description": "Text alignment: 'left' | 'center' | 'right' | 'justify'"
+      },
+      {
+        "name": "truncate",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Truncate text with ellipsis when it overflows (single-line)"
+      },
+      {
+        "name": "lines",
+        "type": {
+          "text": "number"
+        },
+        "description": "Clamp to N lines with ellipsis (multi-line truncation)"
+      },
+      {
+        "name": "expandable",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Reveal clipped text on click/tap (pairs with `truncate` or `lines`)"
+      },
+      {
+        "name": "expanded",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Controlled expanded state for an `expandable` text"
+      },
+      {
+        "name": "default-expanded",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Initial uncontrolled expanded state"
+      },
+      {
+        "name": "italic",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Italic text style"
+      },
+      {
+        "name": "as",
+        "type": {
+          "text": "'span' | 'p' | 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'label' | 'code'"
+        },
+        "description": "Semantic HTML element: 'span' | 'p' | 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'label' | 'code'"
+      }
+    ],
+    "events": [
+      {
+        "name": "expand-change",
+        "description": "Fired when an `expandable` text is toggled. detail: { expanded: boolean }",
+        "type": {
+          "text": "CustomEvent"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "",
+        "description": "Text content"
+      }
+    ],
+    "cssProperties": [
+      {
+        "name": "--text-size",
+        "description": "Font size"
+      },
+      {
+        "name": "--text-weight",
+        "description": "Font weight"
+      },
+      {
+        "name": "--text-color",
+        "description": "Text color"
+      },
+      {
+        "name": "--text-line-height",
+        "description": "Line height"
+      },
+      {
+        "name": "--text-letter-spacing",
+        "description": "Letter spacing"
+      }
+    ],
+    "demos": [
+      {
+        "url": "",
+        "description": "```html\n<ore-text variant=\"heading\" size=\"2xl\" weight=\"bold\">Welcome</ore-text>\n<ore-text as=\"h2\" variant=\"heading\" size=\"xl\">Section title</ore-text>\n<ore-text color=\"primary\" weight=\"semibold\">Important notice</ore-text>\n<ore-text variant=\"code\">npm install</ore-text>\n<ore-text lines=\"2\">Long paragraph that clamps at two lines…</ore-text>\n<!-- Clamp and let the reader expand -->\n<ore-text lines=\"2\" expandable>Long paragraph, tap to read the rest…</ore-text>\n```"
+      }
+    ]
+  },
   {
     "kind": "variable",
     "name": "ALERT_TAG",
@@ -5041,333 +5242,75 @@
   },
   {
     "kind": "variable",
-    "name": "TEXT_TAG",
+    "name": "BADGE_TAG",
     "type": {
-      "text": "'ore-text'"
+      "text": "'ore-badge'"
     },
-    "default": "'ore-text'",
-    "description": "A typography component with semantic variants and responsive sizing."
+    "default": "'ore-badge'",
+    "description": "A compact badge/chip for counts, statuses, and labels.\nSupports numeric counts with overflow, dot mode, and icon slots."
   },
   {
     "kind": "class",
-    "name": "OreTextElement",
-    "tagName": "ore-text",
+    "name": "OreBadgeElement",
+    "tagName": "ore-badge",
     "customElement": true,
-    "description": "A typography component with semantic variants and responsive sizing.",
+    "description": "A compact badge/chip for counts, statuses, and labels.\nSupports numeric counts with overflow, dot mode, and icon slots.",
     "summary": "",
     "attributes": [
       {
-        "name": "variant",
+        "name": "color",
         "type": {
-          "text": "'body' | 'heading' | 'label' | 'caption' | 'overline' | 'code'"
+          "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
         },
-        "description": "Text variant: 'body' | 'heading' | 'label' | 'caption' | 'overline' | 'code'"
+        "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
       },
       {
-        "name": "size",
+        "name": "variant",
         "type": {
-          "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
+          "text": "'solid' | 'flat' | 'bordered' | 'outline' | 'frost'"
         },
-        "description": "Font size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'. Maps to --text-* tokens for body variants and --heading-* tokens for the heading variant."
+        "description": "Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'frost'"
       },
       {
-        "name": "weight",
+        "name": "size",
         "type": {
-          "text": "'normal' | 'medium' | 'semibold' | 'bold'"
+          "text": "'xs' | 'sm' | 'md' | 'lg'"
         },
-        "description": "Font weight: 'normal' | 'medium' | 'semibold' | 'bold'"
+        "description": "Component size: 'xs' | 'sm' | 'md' | 'lg'"
       },
       {
-        "name": "color",
+        "name": "count",
         "type": {
-          "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error' | 'heading' | 'body' | 'muted' | 'tertiary' | 'disabled' | 'contrast'"
+          "text": "number"
         },
-        "description": "Text color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error' | 'heading' | 'body' | 'muted' | 'tertiary' | 'disabled' | 'contrast'"
+        "description": "Numeric count to display"
       },
       {
-        "name": "align",
+        "name": "max",
         "type": {
-          "text": "'left' | 'center' | 'right' | 'justify'"
+          "text": "number"
         },
-        "description": "Text alignment: 'left' | 'center' | 'right' | 'justify'"
+        "description": "Max count before showing \"<max>+\""
       },
       {
-        "name": "truncate",
+        "name": "dot",
         "type": {
           "text": "boolean"
         },
-        "description": "Truncate text with ellipsis when it overflows (single-line)"
+        "description": "Render as a dot indicator (no text)"
       },
       {
-        "name": "lines",
+        "name": "rounded",
         "type": {
-          "text": "number"
+          "text": "'none' | 'sm' | 'md' | 'lg' | 'full'"
         },
-        "description": "Clamp to N lines with ellipsis (multi-line truncation)"
-      },
+        "description": "Border radius: 'none' | 'sm' | 'md' | 'lg' | 'full' etc."
+      }
+    ],
+    "slots": [
       {
-        "name": "expandable",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Reveal clipped text on click/tap (pairs with `truncate` or `lines`)"
-      },
-      {
-        "name": "expanded",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Controlled expanded state for an `expandable` text"
-      },
-      {
-        "name": "default-expanded",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Initial uncontrolled expanded state"
-      },
-      {
-        "name": "italic",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Italic text style"
-      },
-      {
-        "name": "as",
-        "type": {
-          "text": "'span' | 'p' | 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'label' | 'code'"
-        },
-        "description": "Semantic HTML element: 'span' | 'p' | 'div' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'label' | 'code'"
-      }
-    ],
-    "events": [
-      {
-        "name": "expand-change",
-        "description": "Fired when an `expandable` text is toggled. detail: { expanded: boolean }",
-        "type": {
-          "text": "CustomEvent"
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "",
-        "description": "Text content"
-      }
-    ],
-    "cssProperties": [
-      {
-        "name": "--text-size",
-        "description": "Font size"
-      },
-      {
-        "name": "--text-weight",
-        "description": "Font weight"
-      },
-      {
-        "name": "--text-color",
-        "description": "Text color"
-      },
-      {
-        "name": "--text-line-height",
-        "description": "Line height"
-      },
-      {
-        "name": "--text-letter-spacing",
-        "description": "Letter spacing"
-      }
-    ],
-    "demos": [
-      {
-        "url": "",
-        "description": "```html\n<ore-text variant=\"heading\" size=\"2xl\" weight=\"bold\">Welcome</ore-text>\n<ore-text as=\"h2\" variant=\"heading\" size=\"xl\">Section title</ore-text>\n<ore-text color=\"primary\" weight=\"semibold\">Important notice</ore-text>\n<ore-text variant=\"code\">npm install</ore-text>\n<ore-text lines=\"2\">Long paragraph that clamps at two lines…</ore-text>\n<!-- Clamp and let the reader expand -->\n<ore-text lines=\"2\" expandable>Long paragraph, tap to read the rest…</ore-text>\n```"
-      }
-    ]
-  },
-  {
-    "kind": "variable",
-    "name": "ASYNC_TAG",
-    "type": {
-      "text": "'ore-async'"
-    },
-    "default": "'ore-async'",
-    "description": "A container for handling asynchronous states (loading, empty, error, success).\nSimplifies data fetching UI by providing consistent fallbacks."
-  },
-  {
-    "kind": "class",
-    "name": "OreAsyncElement",
-    "tagName": "ore-async",
-    "customElement": true,
-    "description": "A container for handling asynchronous states (loading, empty, error, success).\nSimplifies data fetching UI by providing consistent fallbacks.",
-    "summary": "",
-    "attributes": [
-      {
-        "name": "status",
-        "type": {
-          "text": "'idle' | 'loading' | 'empty' | 'error' | 'success'"
-        },
-        "description": "current state: 'idle' | 'loading' | 'empty' | 'error' | 'success' (default: 'success')",
-        "default": "'success'"
-      },
-      {
-        "name": "retryable",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "show retry button in error state (default: false)",
-        "default": "false"
-      },
-      {
-        "name": "empty-label",
-        "type": {
-          "text": "string"
-        },
-        "description": "title for empty state (default: 'No content yet')",
-        "default": "'No content yet'"
-      },
-      {
-        "name": "empty-description",
-        "type": {
-          "text": "string"
-        },
-        "description": "optional text for empty state"
-      },
-      {
-        "name": "error-label",
-        "type": {
-          "text": "string"
-        },
-        "description": "title for error state (default: 'Something went wrong')",
-        "default": "'Something went wrong'"
-      },
-      {
-        "name": "error-description",
-        "type": {
-          "text": "string"
-        },
-        "description": "optional text for error state"
-      }
-    ],
-    "events": [
-      {
-        "name": "retry",
-        "description": "Emitted when the retry button is clicked (no detail payload)",
-        "type": {
-          "text": "CustomEvent"
-        }
-      }
-    ],
-    "slots": [
-      {
-        "name": "",
-        "description": "default content shown in 'success' state"
-      },
-      {
-        "name": "loading",
-        "description": "custom loading UI (overrides default skeletons)"
-      },
-      {
-        "name": "empty",
-        "description": "custom empty UI (overrides default icon/label)"
-      },
-      {
-        "name": "error",
-        "description": "custom error UI (overrides default icon/label)"
-      }
-    ],
-    "cssProperties": [
-      {
-        "name": "--async-color",
-        "description": "Text/icon color used by default async state content"
-      },
-      {
-        "name": "--async-gap",
-        "description": "Vertical spacing between icon, title, description, and actions"
-      },
-      {
-        "name": "--async-icon-size",
-        "description": "Icon size for built-in loading/empty/error visuals"
-      }
-    ],
-    "demos": [
-      {
-        "url": "",
-        "description": "```html\n<!-- Success state: default slot is shown -->\n<ore-async status=\"success\">\n  <ul><li>Item one</li><li>Item two</li></ul>\n</ore-async>\n<!-- Loading state: shows skeleton placeholders -->\n<ore-async status=\"loading\"></ore-async>\n<!-- Empty state with custom message -->\n<ore-async status=\"empty\" empty-label=\"No results\" empty-description=\"Try adjusting your filters.\"></ore-async>\n<!-- Error state with retry button -->\n<ore-async status=\"error\" retryable error-label=\"Failed to load\" error-description=\"Check your connection.\"></ore-async>\n```"
-      }
-    ]
-  },
-  {
-    "kind": "variable",
-    "name": "BADGE_TAG",
-    "type": {
-      "text": "'ore-badge'"
-    },
-    "default": "'ore-badge'",
-    "description": "A compact badge/chip for counts, statuses, and labels.\nSupports numeric counts with overflow, dot mode, and icon slots."
-  },
-  {
-    "kind": "class",
-    "name": "OreBadgeElement",
-    "tagName": "ore-badge",
-    "customElement": true,
-    "description": "A compact badge/chip for counts, statuses, and labels.\nSupports numeric counts with overflow, dot mode, and icon slots.",
-    "summary": "",
-    "attributes": [
-      {
-        "name": "color",
-        "type": {
-          "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
-        },
-        "description": "Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
-      },
-      {
-        "name": "variant",
-        "type": {
-          "text": "'solid' | 'flat' | 'bordered' | 'outline' | 'frost'"
-        },
-        "description": "Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'frost'"
-      },
-      {
-        "name": "size",
-        "type": {
-          "text": "'xs' | 'sm' | 'md' | 'lg'"
-        },
-        "description": "Component size: 'xs' | 'sm' | 'md' | 'lg'"
-      },
-      {
-        "name": "count",
-        "type": {
-          "text": "number"
-        },
-        "description": "Numeric count to display"
-      },
-      {
-        "name": "max",
-        "type": {
-          "text": "number"
-        },
-        "description": "Max count before showing \"<max>+\""
-      },
-      {
-        "name": "dot",
-        "type": {
-          "text": "boolean"
-        },
-        "description": "Render as a dot indicator (no text)"
-      },
-      {
-        "name": "rounded",
-        "type": {
-          "text": "'none' | 'sm' | 'md' | 'lg' | 'full'"
-        },
-        "description": "Border radius: 'none' | 'sm' | 'md' | 'lg' | 'full' etc."
-      }
-    ],
-    "slots": [
-      {
-        "name": "",
-        "description": "Badge label text"
+        "name": "",
+        "description": "Badge label text"
       },
       {
         "name": "icon",
@@ -5999,6 +5942,85 @@
       }
     ]
   },
+  {
+    "kind": "variable",
+    "name": "PULL_TO_REFRESH_TAG",
+    "type": {
+      "text": "'ore-pull-to-refresh'"
+    },
+    "default": "'ore-pull-to-refresh'",
+    "description": "A pull-to-refresh scroll container: drag the (already scrolled-to-top)\ncontent down past the threshold and release to trigger a refresh. A\nspring-physics indicator tracks the finger, rubber-bands past the threshold,\ncarries the release momentum, and holds at the refresh position until the\nconsumer calls `refreshed()`.\n\nThe component owns the gesture and the motion; the consumer owns the data.\nListen for `refresh`, load, then call `refreshed()` on the element when the\nload resolves."
+  },
+  {
+    "kind": "class",
+    "name": "OrePullToRefreshElement",
+    "tagName": "ore-pull-to-refresh",
+    "customElement": true,
+    "description": "A pull-to-refresh scroll container: drag the (already scrolled-to-top)\ncontent down past the threshold and release to trigger a refresh. A\nspring-physics indicator tracks the finger, rubber-bands past the threshold,\ncarries the release momentum, and holds at the refresh position until the\nconsumer calls `refreshed()`.\nThe component owns the gesture and the motion; the consumer owns the data.\nListen for `refresh`, load, then call `refreshed()` on the element when the\nload resolves.",
+    "summary": "",
+    "attributes": [
+      {
+        "name": "threshold",
+        "type": {
+          "text": "number"
+        },
+        "description": "Pull distance in px before release commits (default: 64)",
+        "default": "64"
+      },
+      {
+        "name": "disabled",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Disable the pull gesture"
+      }
+    ],
+    "events": [
+      {
+        "name": "refresh",
+        "description": "Emitted when a pull commits. Call `refreshed()` when the load finishes.",
+        "type": {
+          "text": "CustomEvent"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "",
+        "description": "The scrollable content."
+      }
+    ],
+    "cssParts": [
+      {
+        "name": "indicator",
+        "description": "The indicator region holding the spinner."
+      },
+      {
+        "name": "spinner",
+        "description": "The spinner element."
+      },
+      {
+        "name": "content",
+        "description": "The dragged content wrapper."
+      }
+    ],
+    "cssProperties": [
+      {
+        "name": "--pull-to-refresh-spinner-size",
+        "description": "Spinner diameter (default: 24px)"
+      },
+      {
+        "name": "--pull-to-refresh-spinner-color",
+        "description": "Spinner color (defaults to the primary color)"
+      }
+    ],
+    "demos": [
+      {
+        "url": "",
+        "description": "```html\n<ore-pull-to-refresh id=\"feed\">\n  <ul>...</ul>\n</ore-pull-to-refresh>\n<script>\n  feed.addEventListener('refresh', async () => {\n    await reloadFeed();\n    feed.refreshed();\n  });\n</script>\n```"
+      }
+    ]
+  },
   {
     "kind": "variable",
     "name": "SKELETON_TAG",
@@ -6101,34 +6123,154 @@
         "description": "Circle fallback size"
       },
       {
-        "name": "--skeleton-width",
-        "description": "Width (default: 100%)"
+        "name": "--skeleton-width",
+        "description": "Width (default: 100%)"
+      },
+      {
+        "name": "--skeleton-height",
+        "description": "Height (default: var(--size-4))"
+      },
+      {
+        "name": "--skeleton-line-gap",
+        "description": "Vertical gap between text lines"
+      },
+      {
+        "name": "--skeleton-last-line-width",
+        "description": "Width of the final text line"
+      },
+      {
+        "name": "--skeleton-duration",
+        "description": "Shimmer animation duration"
+      },
+      {
+        "name": "--skeleton-stripe-size",
+        "description": "Width of each diagonal stripe (default: 6px)"
+      }
+    ],
+    "demos": [
+      {
+        "url": "",
+        "description": "```html\n<!-- Paragraph lines -->\n<ore-skeleton variant=\"text\" lines=\"3\" width=\"100%\"></ore-skeleton>\n<!-- Avatar -->\n<ore-skeleton variant=\"circle\" size=\"md\"></ore-skeleton>\n<!-- Card image -->\n<ore-skeleton width=\"100%\" height=\"10rem\"></ore-skeleton>\n```"
+      }
+    ]
+  },
+  {
+    "kind": "variable",
+    "name": "STATE_TAG",
+    "type": {
+      "text": "'ore-state'"
+    },
+    "default": "'ore-state'",
+    "description": "A state container for asynchronous content: one element covers the whole\nlifecycle (idle, loading, empty, error, success) so a data view never\nhand-rolls four separate fallbacks. The default slot shows on `success`;\nevery other state has a built-in visual that a named slot can replace.\n\nEmpty and error render as full placeholders rather than bare labels: an\nillustration, a title, a description, and an action row. Both are\ncustomizable without replacing the whole placeholder: the `illustration`\nslot swaps the icon and the `actions` slot supplies recovery controls\n(retry, browse, create). `retryable` fills the action row with a built-in\nretry button when no actions are slotted."
+  },
+  {
+    "kind": "class",
+    "name": "OreStateElement",
+    "tagName": "ore-state",
+    "customElement": true,
+    "description": "A state container for asynchronous content: one element covers the whole\nlifecycle (idle, loading, empty, error, success) so a data view never\nhand-rolls four separate fallbacks. The default slot shows on `success`;\nevery other state has a built-in visual that a named slot can replace.\nEmpty and error render as full placeholders rather than bare labels: an\nillustration, a title, a description, and an action row. Both are\ncustomizable without replacing the whole placeholder: the `illustration`\nslot swaps the icon and the `actions` slot supplies recovery controls\n(retry, browse, create). `retryable` fills the action row with a built-in\nretry button when no actions are slotted.",
+    "summary": "",
+    "attributes": [
+      {
+        "name": "status",
+        "type": {
+          "text": "'idle' | 'loading' | 'empty' | 'error' | 'success'"
+        },
+        "description": "current state: 'idle' | 'loading' | 'empty' | 'error' | 'success' (default: 'success')",
+        "default": "'success'"
+      },
+      {
+        "name": "retryable",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "show a retry button when the error state has no slotted actions (default: false)",
+        "default": "false"
+      },
+      {
+        "name": "empty-label",
+        "type": {
+          "text": "string"
+        },
+        "description": "title for empty state (default: 'No content yet')",
+        "default": "'No content yet'"
+      },
+      {
+        "name": "empty-description",
+        "type": {
+          "text": "string"
+        },
+        "description": "optional text for empty state"
+      },
+      {
+        "name": "error-label",
+        "type": {
+          "text": "string"
+        },
+        "description": "title for error state (default: 'Something went wrong')",
+        "default": "'Something went wrong'"
+      },
+      {
+        "name": "error-description",
+        "type": {
+          "text": "string"
+        },
+        "description": "optional text for error state"
+      }
+    ],
+    "events": [
+      {
+        "name": "retry",
+        "description": "Emitted when the retry button is clicked (no detail payload)",
+        "type": {
+          "text": "CustomEvent"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "",
+        "description": "default content shown in 'success' state"
+      },
+      {
+        "name": "loading",
+        "description": "custom loading UI (overrides default skeletons)"
+      },
+      {
+        "name": "empty",
+        "description": "custom empty UI (overrides the built-in empty placeholder)"
       },
       {
-        "name": "--skeleton-height",
-        "description": "Height (default: var(--size-4))"
+        "name": "error",
+        "description": "custom error UI (overrides the built-in error placeholder)"
       },
       {
-        "name": "--skeleton-line-gap",
-        "description": "Vertical gap between text lines"
+        "name": "illustration",
+        "description": "artwork for the built-in empty/error placeholder (replaces its default icon)"
       },
       {
-        "name": "--skeleton-last-line-width",
-        "description": "Width of the final text line"
+        "name": "actions",
+        "description": "recovery controls for the built-in empty/error placeholder (rendered below its text)"
+      }
+    ],
+    "cssProperties": [
+      {
+        "name": "--state-color",
+        "description": "Text/icon color used by default state content"
       },
       {
-        "name": "--skeleton-duration",
-        "description": "Shimmer animation duration"
+        "name": "--state-gap",
+        "description": "Vertical spacing between icon, title, description, and actions"
       },
       {
-        "name": "--skeleton-stripe-size",
-        "description": "Width of each diagonal stripe (default: 6px)"
+        "name": "--state-icon-size",
+        "description": "Icon size for built-in loading/empty/error visuals"
       }
     ],
     "demos": [
       {
         "url": "",
-        "description": "```html\n<!-- Paragraph lines -->\n<ore-skeleton variant=\"text\" lines=\"3\" width=\"100%\"></ore-skeleton>\n<!-- Avatar -->\n<ore-skeleton variant=\"circle\" size=\"md\"></ore-skeleton>\n<!-- Card image -->\n<ore-skeleton width=\"100%\" height=\"10rem\"></ore-skeleton>\n```"
+        "description": "```html\n<!-- Success state: default slot is shown -->\n<ore-state status=\"success\">\n  <ul><li>Item one</li><li>Item two</li></ul>\n</ore-state>\n<!-- Loading state: shows skeleton placeholders -->\n<ore-state status=\"loading\"></ore-state>\n<!-- Empty state with a recovery action -->\n<ore-state status=\"empty\" empty-label=\"No results\" empty-description=\"Try adjusting your filters.\">\n  <ore-button slot=\"actions\" variant=\"secondary\">Clear filters</ore-button>\n</ore-state>\n<!-- Error state with the built-in retry button -->\n<ore-state status=\"error\" retryable error-label=\"Failed to load\" error-description=\"Check your connection.\"></ore-state>\n```"
       }
     ]
   },
@@ -6477,6 +6619,13 @@
           "text": "boolean"
         },
         "description": "Full height button (100% of container)"
+      },
+      {
+        "name": "value",
+        "type": {
+          "text": "string"
+        },
+        "description": "Button value; inside a segmented `ore-button-group` it identifies this button as one selectable option"
       }
     ],
     "events": [
@@ -6561,6 +6710,18 @@
         "name": "--button-frost-active-border-color",
         "description": "Border color when pressed (frost variant)"
       },
+      {
+        "name": "--button-selected-bg",
+        "description": "Background of a selected segment in a segmented `ore-button-group` (defaults to the color family's base)"
+      },
+      {
+        "name": "--button-selected-color",
+        "description": "Text color of a selected segment in a segmented `ore-button-group` (defaults to the color family's contrast)"
+      },
+      {
+        "name": "--button-selected-border-color",
+        "description": "Border color of a selected segment in a segmented `ore-button-group` (defaults to the color family's base)"
+      },
       {
         "name": "--button-shadow",
         "description": "Resting shadow for an elevated button (default: the color family's halo)"
@@ -6587,16 +6748,130 @@
     "type": {
       "text": "'ore-button-group'"
     },
-    "default": "'ore-button-group'"
+    "default": "'ore-button-group'",
+    "description": "A container for grouping related buttons.\nChild `ore-button` components automatically inherit the group's color, size, and variant.\n\nWith a `value`, the group becomes a segmented control (the web equivalent of\nApple's HIG Segmented Control): child buttons carry `value`, the group owns the\nsingle selection, and the container takes `role=\"radiogroup\"` while each valued\nbutton becomes a `radio` (`aria-checked` plus a roving tabindex, both bound by\n`ore-button` itself from the group's context). Arrow keys move and select (HIG:\na segmented control always has a selection, so arrowing commits it), Home/End\njump to the ends, and `change` reports the new value. A button without `value`\nstays a plain action inside the group and is skipped by the selection. Without\n`value` the group remains a plain container: no roles, no selection."
   },
   {
     "kind": "class",
     "name": "OreButtonGroupElement",
     "tagName": "ore-button-group",
     "customElement": true,
-    "description": "",
+    "description": "A container for grouping related buttons.\nChild `ore-button` components automatically inherit the group's color, size, and variant.\nWith a `value`, the group becomes a segmented control (the web equivalent of\nApple's HIG Segmented Control): child buttons carry `value`, the group owns the\nsingle selection, and the container takes `role=\"radiogroup\"` while each valued\nbutton becomes a `radio` (`aria-checked` plus a roving tabindex, both bound by\n`ore-button` itself from the group's context). Arrow keys move and select (HIG:\na segmented control always has a selection, so arrowing commits it), Home/End\njump to the ends, and `change` reports the new value. A button without `value`\nstays a plain action inside the group and is skipped by the selection. Without\n`value` the group remains a plain container: no roles, no selection.",
     "summary": "",
-    "demos": []
+    "attributes": [
+      {
+        "name": "attached",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Join buttons together into a unit"
+      },
+      {
+        "name": "color",
+        "type": {
+          "text": "'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+        },
+        "description": "Shared color tint: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'"
+      },
+      {
+        "name": "fullwidth",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Group spans full width"
+      },
+      {
+        "name": "label",
+        "type": {
+          "text": "string"
+        },
+        "description": "Accessible label"
+      },
+      {
+        "name": "orientation",
+        "type": {
+          "text": "'horizontal' | 'vertical'"
+        },
+        "description": "'horizontal' | 'vertical'"
+      },
+      {
+        "name": "rounded",
+        "type": {
+          "text": "'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'"
+        },
+        "description": "Corner radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full' (bare attribute defaults to 'full')"
+      },
+      {
+        "name": "size",
+        "type": {
+          "text": "'sm' | 'md' | 'lg'"
+        },
+        "description": "Shared size: 'sm' | 'md' | 'lg'"
+      },
+      {
+        "name": "value",
+        "type": {
+          "text": "string"
+        },
+        "description": "Value of the currently selected button (enables segmented selection)"
+      },
+      {
+        "name": "variant",
+        "type": {
+          "text": "'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'frost'"
+        },
+        "description": "Shared visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'frost'"
+      }
+    ],
+    "events": [
+      {
+        "name": "change",
+        "description": "Emitted when the selected button changes. detail: { values: string[], labels: string[], originalEvent?: Event }",
+        "type": {
+          "text": "CustomEvent"
+        }
+      }
+    ],
+    "slots": [
+      {
+        "name": "",
+        "description": "Place ore-button elements here"
+      }
+    ],
+    "cssParts": [
+      {
+        "name": "group",
+        "description": "Group container."
+      }
+    ],
+    "cssProperties": [
+      {
+        "name": "--group-gap",
+        "description": "Gap between buttons (non-attached mode)"
+      },
+      {
+        "name": "--group-radius",
+        "description": "Border radius of the group container, defaults to the `rounded` attribute's token"
+      },
+      {
+        "name": "--button-radius",
+        "description": "Passed through to child buttons to control corner radius"
+      },
+      {
+        "name": "--button-border-start",
+        "description": "Passed through to suppress start borders in attached mode"
+      },
+      {
+        "name": "--button-border-top",
+        "description": "Passed through to suppress top borders in vertical attached mode"
+      }
+    ],
+    "demos": [
+      {
+        "url": "",
+        "description": "```html\n<ore-button-group attached rounded=\"full\">\n  <ore-button variant=\"solid\" color=\"primary\">Save</ore-button>\n  <ore-button variant=\"solid\" color=\"primary\">Save &amp; Continue</ore-button>\n</ore-button-group>\n<ore-button-group attached value=\"list\" label=\"View mode\" color=\"primary\">\n  <ore-button value=\"list\">List</ore-button>\n  <ore-button value=\"grid\">Grid</ore-button>\n</ore-button-group>\n<ore-button-group orientation=\"vertical\" size=\"sm\">\n  <ore-button>Top</ore-button>\n  <ore-button>Middle</ore-button>\n  <ore-button>Bottom</ore-button>\n</ore-button-group>\n```"
+      }
+    ]
   },
   {
     "kind": "variable",
@@ -7066,6 +7341,121 @@
       }
     ]
   },
+  {
+    "kind": "variable",
+    "name": "COLOR_PICKER_TAG",
+    "type": {
+      "text": "'ore-color-picker'"
+    },
+    "default": "'ore-color-picker'",
+    "description": "A palette of color swatches that allows users to pick a single color, like a\nproduct paint configurator. Renders as a radiogroup: arrow keys move through\nthe swatches, and selection is form-associated."
+  },
+  {
+    "kind": "class",
+    "name": "OreColorPickerElement",
+    "tagName": "ore-color-picker",
+    "customElement": true,
+    "description": "A palette of color swatches that allows users to pick a single color, like a\nproduct paint configurator. Renders as a radiogroup: arrow keys move through\nthe swatches, and selection is form-associated.",
+    "summary": "",
+    "attributes": [
+      {
+        "name": "value",
+        "type": {
+          "text": "string"
+        },
+        "description": "Value of the selected option"
+      },
+      {
+        "name": "label",
+        "type": {
+          "text": "string"
+        },
+        "description": "Group label (also the accessible name)"
+      },
+      {
+        "name": "name",
+        "type": {
+          "text": "string"
+        },
+        "description": "Form field name"
+      },
+      {
+        "name": "disabled",
+        "type": {
+          "text": "boolean"
+        },
+        "description": "Disabled state"
+      },
+      {
+        "name": "size",
+        "type": {
+          "text": "'sm' | 'md' | 'lg'"
+        },
+        "description": "'sm' | 'md' | 'lg'"
+      },
+      {
+        "name": "helper",
+        "type": {
+          "text": "string"
+        },
+        "description": "Helper text below the swatches"
+      },
+      {
+        "name": "error",
+        "type": {
+          "text": "string"
+        },
+        "description": "Error message below the swatches"
+      }
+    ],
+    "events": [
+      {
+        "name": "change",
+        "description": "Emitted when a color is selected. detail: { values: string[], labels: string[], originalEvent?: Event }",
+        "type": {
+          "text": "CustomEvent"
+        }
+      }
+    ],
+    "cssParts": [
+      {
+        "name": "swatches",
+        "description": "Swatch container."
+      },
+      {
+        "name": "swatch",
+        "description": "Swatch button element."
+      },
+      {
+        "name": "legend",
+        "description": "Group label."
+      },
+      {
+        "name": "helper-text",
+        "description": "The helper/error text element."
+      }
+    ],
+    "cssProperties": [
+      {
+        "name": "--color-picker-swatch-size",
+        "description": "Swatch diameter (defaults to the size preset)"
+      },
+      {
+        "name": "--color-picker-swatch-radius",
+        "description": "Swatch corner radius (defaults to a circle)"
+      },
+      {
+        "name": "--color-picker-gap",
+        "description": "Gap between swatches"
+      }
+    ],
+    "demos": [
+      {
+        "url": "",
+        "description": "```html\n<ore-color-picker\n  label=\"Paint\"\n  value=\"midnight\"\n  options='[{ \"value\": \"midnight\", \"color\": \"#19202b\", \"label\": \"Midnight Black\" }, { \"value\": \"pearl\", \"color\": \"#f2efe9\", \"label\": \"Pearl White\" }]'>\n</ore-color-picker>\n```"
+      }
+    ]
+  },
   {
     "kind": "function",
     "name": "parseSlottedOptions",
@@ -8424,6 +8814,14 @@
         "name": "spinner",
         "description": "The inline loading spinner shown inside the field while `loading`"
       },
+      {
+        "name": "pwd-toggle",
+        "description": "The password visibility toggle, shown only when `type=\"password\"`; it reveals the value as text while pressed (`aria-pressed`) and returns focus to the field"
+      },
+      {
+        "name": "clear",
+        "description": "The clear button, shown when `clearable` and the field has a value"
+      },
       {
         "name": "helper",
         "description": "The helper text element"
@@ -12389,9 +12787,9 @@
       {
         "name": "backdrop",
         "type": {
-          "text": "'blur' | 'transparent'"
+          "text": "'opaque' | 'blur' | 'transparent'"
         },
-        "description": "Backdrop style: 'opaque' (default) | 'blur' | 'transparent'"
+        "description": "Backdrop style: none (default, click-to-close only) | 'opaque' | 'blur' | 'transparent'"
       },
       {
         "name": "close-on-select",
@@ -12449,7 +12847,7 @@
     "cssParts": [
       {
         "name": "drawer-backdrop",
-        "description": "Backdrop veil behind the open drawer (click closes it)."
+        "description": "Backdrop behind the open drawer (click closes it; dimming is opt-in via `backdrop`)."
       },
       {
         "name": "drawer-close-btn",
@@ -12535,7 +12933,7 @@
       },
       {
         "name": "--sidebar-drawer-backdrop-bg",
-        "description": "Backdrop color behind the open drawer (default: var(--overlay-veil))"
+        "description": "Backdrop color behind the open drawer (default: transparent; the dimming modes use var(--overlay-veil))"
       },
       {
         "name": "--sidebar-drawer-shadow",
@@ -14516,6 +14914,13 @@
         },
         "description": "'sm' | 'lg' | 'full'"
       },
+      {
+        "name": "detents",
+        "type": {
+          "text": "string"
+        },
+        "description": "Comma-separated drag snap points as fractions of panel size ('0.5,0.75'); bottom/top placement only"
+      },
       {
         "name": "title",
         "type": {
@@ -14655,6 +15060,14 @@
     },
     "default": "['grid', 'list']"
   },
+  {
+    "kind": "variable",
+    "name": "MENU_TRIGGERS",
+    "type": {
+      "text": "['click', 'contextmenu']"
+    },
+    "default": "['click', 'contextmenu']"
+  },
   {
     "kind": "variable",
     "name": "MENU_CTX",
@@ -14749,6 +15162,13 @@
           "text": "'sm' | 'md' | 'lg'"
         },
         "description": "Size: 'sm' | 'md' | 'lg'"
+      },
+      {
+        "name": "trigger",
+        "type": {
+          "text": "string"
+        },
+        "description": "How the menu opens: 'click' (default) | 'contextmenu' (right-click or long-press opens at the pointer; left-click does nothing)"
       }
     ],
     "events": [
@@ -14825,6 +15245,14 @@
       {
         "url": "",
         "description": "```html\n<ore-menu>\n  <button slot=\"trigger\">Actions</button>\n  <ore-menu-item value=\"edit\">Edit</ore-menu-item>\n  <ore-menu-item value=\"delete\">Delete</ore-menu-item>\n</ore-menu>\n```"
+      },
+      {
+        "url": "",
+        "description": "```html\n<ore-menu trigger=\"contextmenu\">\n  <p slot=\"trigger\">Right-click this text</p>\n  <ore-menu-item value=\"copy\">Copy</ore-menu-item>\n  <ore-menu-item value=\"paste\">Paste</ore-menu-item>\n</ore-menu>\n```"
+      },
+      {
+        "url": "",
+        "description": "```html\n<!-- Nested submenu: items slotted into `submenu` fly out on hover, ArrowRight, or Enter -->\n<ore-menu>\n  <button slot=\"trigger\">File</button>\n  <ore-menu-item value=\"new\">New</ore-menu-item>\n  <ore-menu-item>\n    Open recent\n    <ore-menu-item slot=\"submenu\" value=\"recent-1\">report.pdf</ore-menu-item>\n    <ore-menu-item slot=\"submenu\" value=\"recent-2\">notes.md</ore-menu-item>\n  </ore-menu-item>\n</ore-menu>\n```"
       }
     ]
   },
@@ -14835,14 +15263,14 @@
       "text": "'ore-menu-item'"
     },
     "default": "'ore-menu-item'",
-    "description": "A selectable action item used inside `<ore-menu>`."
+    "description": "A selectable action item used inside `<ore-menu>`.\n\nContent slotted into `submenu` turns the item into a submenu trigger: it grows a trailing\nchevron, reports `aria-haspopup=\"menu\"` / `aria-expanded`, and flies out a nested menu panel on\nhover, ArrowRight, Enter, Space, or a click. A trigger is never selectable — it emits no `select`\nand carries no value — and its children stay out of the parent menu's arrow navigation, so the\nparent's rows always match what the pointer sees. Escape and ArrowLeft close the flyout and hand\nfocus back to the trigger; selecting a child closes the whole chain. Submenus nest to any depth."
   },
   {
     "kind": "class",
     "name": "OreMenuItemElement",
     "tagName": "ore-menu-item",
     "customElement": true,
-    "description": "A selectable action item used inside `<ore-menu>`.",
+    "description": "A selectable action item used inside `<ore-menu>`.\nContent slotted into `submenu` turns the item into a submenu trigger: it grows a trailing\nchevron, reports `aria-haspopup=\"menu\"` / `aria-expanded`, and flies out a nested menu panel on\nhover, ArrowRight, Enter, Space, or a click. A trigger is never selectable — it emits no `select`\nand carries no value — and its children stay out of the parent menu's arrow navigation, so the\nparent's rows always match what the pointer sees. Escape and ArrowLeft close the flyout and hand\nfocus back to the trigger; selecting a child closes the whole chain. Submenus nest to any depth.",
     "summary": "",
     "attributes": [
       {
@@ -14882,6 +15310,10 @@
       {
         "name": "icon",
         "description": "Optional leading icon content"
+      },
+      {
+        "name": "submenu",
+        "description": "Nested menu items that turn this item into a submenu trigger"
       }
     ],
     "cssParts": [
@@ -14896,6 +15328,10 @@
       {
         "name": "icon-slot",
         "description": "Leading icon slot container."
+      },
+      {
+        "name": "submenu",
+        "description": "Floating submenu panel (present only meaningful when the `submenu` slot is filled)."
       }
     ],
     "cssProperties": [
@@ -14928,6 +15364,10 @@
       {
         "url": "",
         "description": "```html\n<ore-menu-item value=\"edit\">Edit</ore-menu-item>\n<ore-menu-item value=\"delete\" disabled>Delete</ore-menu-item>\n<ore-menu-item type=\"checkbox\" value=\"wrap\" checked>Word wrap</ore-menu-item>\n<ore-menu-item type=\"radio\" value=\"left\">Align left</ore-menu-item>\n```"
+      },
+      {
+        "url": "",
+        "description": "```html\n<!-- Submenu trigger: the label is the row, `submenu` holds the flyout's items -->\n<ore-menu-item>\n  Share\n  <ore-menu-item slot=\"submenu\" value=\"mail\">Email</ore-menu-item>\n  <ore-menu-item slot=\"submenu\" value=\"link\">Copy link</ore-menu-item>\n</ore-menu-item>\n```"
       }
     ]
   },