haze-ui 1.30.0 → 1.32.0

package/dist/mcp-docs.json

@@ -1,5 +1,5 @@
 {
-  "generatedAt": "2026-09-14T15:54:16.071Z",
+  "generatedAt": "2026-10-11T16:55:31.959Z",
   "components": {
     "Accordion": {
       "cssFamily": "accordion",
@@ -50,6 +50,86 @@
         ]
       }
     },
+    "ActivityRail": {
+      "cssFamily": "activity-rail",
+      "importStatement": "import { ActivityRail, ActivityRailItem } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/activity-rail.css';",
+      "peerDeps": [],
+      "description": "VSCode-style vertical icon rail (`nav`): 44px items with icon/label/badge/active indicator, tooltip labels and `slot=\"end\"` bottom pinning.",
+      "props": {
+        "ActivityRailItemProps": [
+          {
+            "name": "icon",
+            "type": "ReactNode",
+            "required": true,
+            "description": "Item icon (rendered centered in the 44px target)"
+          },
+          {
+            "name": "label",
+            "type": "string",
+            "required": true,
+            "description": "Item name — drives the tooltip and the accessible name"
+          },
+          {
+            "name": "badge",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Overlay badge (usually <Badge/>) — counters like pending reviews"
+          },
+          {
+            "name": "active",
+            "type": "boolean",
+            "required": false,
+            "default": "false",
+            "description": "Marks the current view: aria-current + the 2px rail-side indicator"
+          },
+          {
+            "name": "onSelect",
+            "type": "() => void",
+            "required": false,
+            "description": "Selection callback"
+          },
+          {
+            "name": "slot",
+            "type": "'start' | 'end'",
+            "required": false,
+            "default": "'start'",
+            "description": "end slots pin to the rail bottom (settings/account entries)"
+          },
+          {
+            "name": "...rest",
+            "type": "button attributes",
+            "required": false,
+            "description": "Native button props (type=button is built in)"
+          }
+        ],
+        "ActivityRailProps": [
+          {
+            "name": "children",
+            "type": "ReactNode",
+            "required": true,
+            "description": "ActivityRailItem elements"
+          },
+          {
+            "name": "orientation",
+            "type": "'vertical' | 'horizontal'",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "className",
+            "type": "string",
+            "required": false,
+            "description": "Additional CSS class"
+          },
+          {
+            "name": "...rest",
+            "type": "nav attributes",
+            "required": false,
+            "description": "Renders a nav landmark — pass aria-label via rest"
+          }
+        ]
+      }
+    },
     "Affix": {
       "cssFamily": "affix",
       "importStatement": "import { Affix } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/affix.css';",
@@ -700,6 +780,38 @@
             "type": "boolean",
             "required": false,
             "description": ""
+          },
+          {
+            "name": "loading",
+            "type": "boolean | { icon?: ReactNode; text?: ReactNode; }",
+            "required": false,
+            "description": ""
+          }
+        ],
+        "ButtonOwnProps": [
+          {
+            "name": "variant",
+            "type": "'solid' | 'outline' | 'ghost'",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "size",
+            "type": "'sm' | 'md' | 'lg'",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "square",
+            "type": "boolean",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "loading",
+            "type": "boolean | { icon?: ReactNode; text?: ReactNode; }",
+            "required": false,
+            "description": ""
           }
         ],
         "ButtonProps": [
@@ -724,6 +836,18 @@
             "default": "false",
             "description": "Equal padding on all sides, ideal for icon-only buttons"
           },
+          {
+            "name": "loading",
+            "type": "boolean | { icon?: ReactNode; text?: ReactNode; }",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "as",
+            "type": "T",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "disabled",
             "type": "boolean",
@@ -1057,7 +1181,7 @@
           },
           {
             "name": "layout",
-            "type": "'horizontal' | 'vertical'",
+            "type": "'vertical' | 'horizontal'",
             "required": false,
             "description": ""
           },
@@ -1640,7 +1764,7 @@
           },
           {
             "name": "ref",
-            "type": "Ref<HTMLDivElement | HTMLButtonElement>",
+            "type": "Ref<HTMLButtonElement | HTMLDivElement>",
             "required": false,
             "description": ""
           }
@@ -1832,6 +1956,12 @@
             "required": false,
             "description": "Additional CSS class"
           },
+          {
+            "name": "classNames",
+            "type": "ComboboxClassNames",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "ref",
             "type": "Ref<HTMLInputElement>",
@@ -2067,7 +2197,7 @@
     },
     "ConfirmDialog": {
       "cssFamily": "confirm-dialog",
-      "importStatement": "import { ConfirmDialog } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/confirm-dialog.css';",
+      "importStatement": "import { ConfirmDialog, confirm } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/confirm-dialog.css';",
       "peerDeps": [],
       "description": "Ready-made confirm dialog with confirm/cancel actions and a danger variant.",
       "props": {
@@ -2105,7 +2235,7 @@
           {
             "name": "children",
             "type": "ReactNode",
-            "required": true,
+            "required": false,
             "description": "Dialog body content"
           },
           {
@@ -2316,6 +2446,12 @@
             "required": true,
             "description": "ConversationItem elements"
           },
+          {
+            "name": "onLoadMore",
+            "type": "() => void",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "className",
             "type": "string",
@@ -2762,6 +2898,94 @@
         ]
       }
     },
+    "DateTimePicker": {
+      "cssFamily": "date-time-picker",
+      "importStatement": "import { DateTimePicker } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/date-time-picker.css';",
+      "peerDeps": [],
+      "description": "",
+      "props": {
+        "DateTimePickerProps": [
+          {
+            "name": "value",
+            "type": "ControlOrValue<string>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "open",
+            "type": "ControlOrValue<boolean>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "min",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "max",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "disabledDate",
+            "type": "(date: Date) => boolean",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "presets",
+            "type": "DatepickerPreset[]",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "showSeconds",
+            "type": "boolean",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "locale",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "weekStartsOn",
+            "type": "0 | 1",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "cellRender",
+            "type": "CalendarCellRender",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "placeholder",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "className",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "ref",
+            "type": "Ref<HTMLInputElement>",
+            "required": false,
+            "description": ""
+          }
+        ]
+      }
+    },
     "Datepicker": {
       "cssFamily": "datepicker",
       "importStatement": "import { Datepicker, DatepickerCore } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/datepicker.css';",
@@ -3151,7 +3375,7 @@
         "DividerProps": [
           {
             "name": "orientation",
-            "type": "'horizontal' | 'vertical'",
+            "type": "'vertical' | 'horizontal'",
             "required": false,
             "default": "'horizontal'",
             "description": "Direction of the divider"
@@ -3204,6 +3428,12 @@
             "required": false,
             "description": "Additional CSS class"
           },
+          {
+            "name": "classNames",
+            "type": "DrawerClassNames",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "children",
             "type": "ReactNode",
@@ -3652,6 +3882,28 @@
         ]
       }
     },
+    "Fieldset": {
+      "cssFamily": "fieldset",
+      "importStatement": "import { Fieldset } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/fieldset.css';",
+      "peerDeps": [],
+      "description": "Semantic form grouping: native `fieldset`+`legend` (group named by the legend), `disabled` disables every control inside.",
+      "props": {
+        "FieldsetProps": [
+          {
+            "name": "legend",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "disabled",
+            "type": "boolean",
+            "required": false,
+            "description": ""
+          }
+        ]
+      }
+    },
     "FileInput": {
       "cssFamily": "file-input",
       "importStatement": "import { FileInput } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/file-input.css';",
@@ -4032,6 +4284,40 @@
         ]
       }
     },
+    "Highlight": {
+      "cssFamily": "highlight",
+      "importStatement": "import { Highlight } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/highlight.css';",
+      "peerDeps": [],
+      "description": "",
+      "props": {
+        "HighlightProps": [
+          {
+            "name": "children",
+            "type": "string",
+            "required": true,
+            "description": ""
+          },
+          {
+            "name": "highlight",
+            "type": "string | string[]",
+            "required": true,
+            "description": ""
+          },
+          {
+            "name": "caseSensitive",
+            "type": "boolean",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "color",
+            "type": "'success' | 'warning' | 'danger' | 'primary'",
+            "required": false,
+            "description": ""
+          }
+        ]
+      }
+    },
     "HoverCard": {
       "cssFamily": "hover-card",
       "importStatement": "import { HoverCard } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/hover-card.css';",
@@ -4210,27 +4496,67 @@
         ]
       }
     },
-    "InlineCompletion": {
-      "cssFamily": "inline-completion",
-      "importStatement": "import { InlineCompletion } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/inline-completion.css';",
+    "Indicator": {
+      "cssFamily": "indicator",
+      "importStatement": "import { Indicator } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/indicator.css';",
       "peerDeps": [],
-      "description": "Ghost-text completion overlay for input/textarea: Tab accepts the suggestion, Escape dismisses it.",
+      "description": "Corner badge attached to a host element (avatar, icon button): dot or count label, tone + corner position, zero-badge hides unless `showZero`.",
       "props": {
-        "InlineCompletionProps": [
+        "IndicatorProps": [
           {
-            "name": "suggestion",
-            "type": "string",
+            "name": "label",
+            "type": "ReactNode",
             "required": false,
             "description": ""
           },
           {
-            "name": "value",
-            "type": "ControlOrValue<string>",
+            "name": "showZero",
+            "type": "boolean",
             "required": false,
             "description": ""
           },
           {
-            "name": "onAccept",
+            "name": "color",
+            "type": "'success' | 'warning' | 'danger' | 'primary'",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "position",
+            "type": "'bottom-end' | 'top-start' | 'top-end' | 'bottom-start'",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "children",
+            "type": "ReactNode",
+            "required": true,
+            "description": ""
+          }
+        ]
+      }
+    },
+    "InlineCompletion": {
+      "cssFamily": "inline-completion",
+      "importStatement": "import { InlineCompletion } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/inline-completion.css';",
+      "peerDeps": [],
+      "description": "Ghost-text completion overlay for input/textarea: Tab accepts the suggestion, Escape dismisses it.",
+      "props": {
+        "InlineCompletionProps": [
+          {
+            "name": "suggestion",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "value",
+            "type": "ControlOrValue<string>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "onAccept",
             "type": "() => void",
             "required": false,
             "description": ""
@@ -4371,6 +4697,18 @@
             "required": false,
             "description": ""
           },
+          {
+            "name": "leftSection",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "rightSection",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "ref",
             "type": "Ref<HTMLInputElement>",
@@ -4392,6 +4730,18 @@
             "default": "'md'",
             "description": "Size of the input"
           },
+          {
+            "name": "leftSection",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "rightSection",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "ref",
             "type": "Ref<HTMLInputElement>",
@@ -4515,6 +4865,52 @@
             "type": "ReactNode",
             "required": true,
             "description": "ListItem elements"
+          },
+          {
+            "name": "loadMore",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          }
+        ]
+      }
+    },
+    "LoadingOverlay": {
+      "cssFamily": "loading-overlay",
+      "importStatement": "import { LoadingOverlay } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/loading-overlay.css';",
+      "peerDeps": [],
+      "description": "Container-level loading state: dims content and centers a spinner (or custom loader) above it, `aria-busy` mirrors the phase.",
+      "props": {
+        "LoadingOverlayProps": [
+          {
+            "name": "visible",
+            "type": "boolean",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "label",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "loader",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "spinnerSize",
+            "type": "'sm' | 'md' | 'lg'",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "children",
+            "type": "ReactNode",
+            "required": true,
+            "description": ""
           }
         ]
       }
@@ -4572,6 +4968,12 @@
             "required": false,
             "description": "Active level filter (controllable)"
           },
+          {
+            "name": "onLoadMore",
+            "type": "() => void",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "className",
             "type": "string",
@@ -4601,6 +5003,22 @@
         ]
       }
     },
+    "Mark": {
+      "cssFamily": "mark",
+      "importStatement": "import { Mark } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/mark.css';",
+      "peerDeps": [],
+      "description": "Text-level highlight — semantic `<mark>` skinned with the status tokens (`warning`/`primary`/`success`/`danger`).",
+      "props": {
+        "MarkProps": [
+          {
+            "name": "color",
+            "type": "'success' | 'warning' | 'danger' | 'primary'",
+            "required": false,
+            "description": ""
+          }
+        ]
+      }
+    },
     "MarkdownRenderer": {
       "cssFamily": "markdown-renderer",
       "importStatement": "import { MarkdownRenderer } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/markdown-renderer.css';",
@@ -4823,6 +5241,50 @@
             "description": ""
           }
         ],
+        "MenuItemOwnProps": [
+          {
+            "name": "onSelect",
+            "type": "() => void",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "disabled",
+            "type": "boolean",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "danger",
+            "type": "boolean",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "icon",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "kbdLabel",
+            "type": "ReactNode",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "className",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "children",
+            "type": "ReactNode",
+            "required": true,
+            "description": ""
+          }
+        ],
         "MenuItemProps": [
           {
             "name": "onSelect",
@@ -4866,6 +5328,12 @@
             "type": "ReactNode",
             "required": true,
             "description": "Item content"
+          },
+          {
+            "name": "as",
+            "type": "T",
+            "required": false,
+            "description": ""
           }
         ],
         "MenuProps": [
@@ -5148,6 +5616,46 @@
         ]
       }
     },
+    "NumberFormatter": {
+      "cssFamily": "number-formatter",
+      "importStatement": "import { NumberFormatter } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/number-formatter.css';",
+      "peerDeps": [],
+      "description": "",
+      "props": {
+        "NumberFormatterProps": [
+          {
+            "name": "value",
+            "type": "number",
+            "required": true,
+            "description": ""
+          },
+          {
+            "name": "formatOptions",
+            "type": "NumberFormatOptions",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "locale",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "prefix",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "suffix",
+            "type": "string",
+            "required": false,
+            "description": ""
+          }
+        ]
+      }
+    },
     "NumberInput": {
       "cssFamily": "number-input",
       "importStatement": "import { NumberInput, NumberInputCore } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/number-input.css';",
@@ -5936,7 +6444,7 @@
         "ResizableGroupProps": [
           {
             "name": "direction",
-            "type": "'horizontal' | 'vertical'",
+            "type": "'vertical' | 'horizontal'",
             "required": false,
             "default": "'horizontal'",
             "description": "Layout direction"
@@ -5953,6 +6461,18 @@
             "required": false,
             "description": "Additional CSS class"
           },
+          {
+            "name": "style",
+            "type": "CSSProperties",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "onResizeCommit",
+            "type": "(sizes: Record<string, number>) => void",
+            "required": false,
+            "description": "Fires once when a drag or keyboard resize settles, mapping fixed-panel ids to their committed px sizes — the persistence hook (write it back into a store or Control)"
+          },
           {
             "name": "SplitterGroup · SplitterPanel · SplitterHandle",
             "type": "aliases",
@@ -5965,16 +6485,60 @@
             "name": "className",
             "type": "string",
             "required": false,
-            "description": ""
+            "description": "Additional CSS class"
+          },
+          {
+            "name": "...rest",
+            "type": "div attributes",
+            "required": false,
+            "description": "role=separator with aria-orientation/valuenow is built in; arrow keys resize in 16px steps, Enter or double-click resets the adjacent panel to its defaultSize, and the hit area widens to 44px on coarse pointers"
           }
         ],
         "ResizablePanelProps": [
+          {
+            "name": "id",
+            "type": "string",
+            "required": true,
+            "description": "Stable panel identity — keys the sizes map reported by onResizeCommit; keep it stable across renders for persistence"
+          },
           {
             "name": "defaultSize",
             "type": "number",
             "required": false,
-            "default": "50",
-            "description": "Default size as percentage"
+            "description": "Initial size in px. Omit to make the panel flexible (it absorbs the remaining space); changing this prop after a resize re-pins the panel outside gestures"
+          },
+          {
+            "name": "minSize",
+            "type": "number",
+            "required": false,
+            "default": "—",
+            "description": "Clamp in px enforced by both pointer drags and keyboard steps"
+          },
+          {
+            "name": "maxSize",
+            "type": "number",
+            "required": false,
+            "default": "—",
+            "description": "Clamp in px enforced by both pointer drags and keyboard steps"
+          },
+          {
+            "name": "collapsible",
+            "type": "boolean",
+            "required": false,
+            "default": "false",
+            "description": "Enables collapse semantics: the panel collapses to zero width/height and its handle becomes a keyboard-reachable expander"
+          },
+          {
+            "name": "collapsed",
+            "type": "ControlOrValue<boolean>",
+            "required": false,
+            "description": "Controlled/uncontrolled collapsed state — survives breakpoint flips (desktop dock ⇄ mobile overlay) as one source of truth"
+          },
+          {
+            "name": "onCollapsedChange",
+            "type": "(collapsed: boolean) => void",
+            "required": false,
+            "description": "Notifies on collapse toggles (handle expander, resets crossing the threshold)"
           },
           {
             "name": "children",
@@ -6263,6 +6827,12 @@
             "required": false,
             "description": ""
           },
+          {
+            "name": "classNames",
+            "type": "SelectClassNames",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "ref",
             "type": "Ref<HTMLButtonElement | HTMLSelectElement>",
@@ -6307,6 +6877,12 @@
             "required": false,
             "description": ""
           },
+          {
+            "name": "classNames",
+            "type": "SelectClassNames",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "searchable",
             "type": "boolean",
@@ -6424,6 +7000,12 @@
             "default": "'md'",
             "description": "Size of the select"
           },
+          {
+            "name": "classNames",
+            "type": "SelectClassNames",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "ref",
             "type": "Ref<HTMLButtonElement | HTMLSelectElement>",
@@ -6897,6 +7479,52 @@
         ]
       }
     },
+    "Sparkline": {
+      "cssFamily": "sparkline",
+      "importStatement": "import { Sparkline, sparklineToneStrokes, sparklineToneFills } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/sparkline.css';",
+      "peerDeps": [],
+      "description": "Inline-SVG mini trend chart (line/area variants, tone colors); stateless, recharts-free and RSC-safe.",
+      "props": {
+        "SparklineProps": [
+          {
+            "name": "data",
+            "type": "readonly number[]",
+            "required": true,
+            "description": ""
+          },
+          {
+            "name": "width",
+            "type": "number",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "height",
+            "type": "number",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "variant",
+            "type": "'area' | 'line'",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "tone",
+            "type": "'info' | 'success' | 'warning' | 'danger' | 'primary'",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "className",
+            "type": "string",
+            "required": false,
+            "description": ""
+          }
+        ]
+      }
+    },
     "Spinner": {
       "cssFamily": "spinner",
       "importStatement": "import { Spinner } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/spinner.css';",
@@ -6920,6 +7548,52 @@
         ]
       }
     },
+    "Spoiler": {
+      "cssFamily": "spoiler",
+      "importStatement": "import { Spoiler } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/spoiler.css';",
+      "peerDeps": [],
+      "description": "Collapsed long-content gate (\"show more/less\"): height-capped preview with a fade edge and a toggle button; `expanded` is controllable.",
+      "props": {
+        "SpoilerProps": [
+          {
+            "name": "expanded",
+            "type": "ControlOrValue<boolean>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "maxHeight",
+            "type": "number",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "showLabel",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "hideLabel",
+            "type": "string",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "children",
+            "type": "ReactNode",
+            "required": true,
+            "description": ""
+          },
+          {
+            "name": "className",
+            "type": "string",
+            "required": false,
+            "description": ""
+          }
+        ]
+      }
+    },
     "Stat": {
       "cssFamily": "stat",
       "importStatement": "import { Stat, StatGroup } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/stat.css';",
@@ -6963,31 +7637,92 @@
             "name": "trend",
             "type": "'up' | 'down' | 'neutral'",
             "required": false,
-            "description": "Trend direction"
+            "description": "Trend direction"
+          },
+          {
+            "name": "trendValue",
+            "type": "string",
+            "required": false,
+            "description": "Trend percentage text"
+          },
+          {
+            "name": "prefix",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Content before value"
+          },
+          {
+            "name": "suffix",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Content after value"
+          },
+          {
+            "name": "className",
+            "type": "string",
+            "required": false,
+            "description": "Additional CSS class"
+          }
+        ]
+      }
+    },
+    "StatusBar": {
+      "cssFamily": "status-bar",
+      "importStatement": "import { StatusBar, StatusItem } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/status-bar.css';",
+      "peerDeps": [],
+      "description": "VSCode-style status strip (`footer`): `left`/`right` groups, selectable `StatusItem`s, `priority` items survive the mobile breakpoint.",
+      "props": {
+        "StatusBarProps": [
+          {
+            "name": "left",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Left-aligned items (branch, problems, cursor position…)"
+          },
+          {
+            "name": "right",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Right-aligned items (language, encoding, sync state…)"
           },
           {
-            "name": "trendValue",
+            "name": "className",
             "type": "string",
             "required": false,
-            "description": "Trend percentage text"
+            "description": "Additional CSS class"
           },
           {
-            "name": "prefix",
+            "name": "...rest",
+            "type": "footer attributes",
+            "required": false,
+            "description": "Renders a footer landmark — pass aria-label via rest"
+          }
+        ],
+        "StatusItemProps": [
+          {
+            "name": "children",
             "type": "ReactNode",
+            "required": true,
+            "description": "Item content"
+          },
+          {
+            "name": "priority",
+            "type": "boolean",
             "required": false,
-            "description": "Content before value"
+            "default": "false",
+            "description": "Priority items survive the ≤768px breakpoint (non-priority items are hidden there)"
           },
           {
-            "name": "suffix",
-            "type": "ReactNode",
+            "name": "onSelect",
+            "type": "() => void",
             "required": false,
-            "description": "Content after value"
+            "description": "Presence switches the item to a button; omit for plain text"
           },
           {
-            "name": "className",
-            "type": "string",
+            "name": "...rest",
+            "type": "span | button attributes",
             "required": false,
-            "description": "Additional CSS class"
+            "description": "Native props forwarded to the rendered element"
           }
         ]
       }
@@ -7277,6 +8012,79 @@
         ]
       }
     },
+    "TabBar": {
+      "cssFamily": "tab-bar",
+      "importStatement": "import { TabBar, TabBarItem } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/tab-bar.css';",
+      "peerDeps": [],
+      "description": "Mobile bottom navigation (the ActivityRail viewport peer): 56px safe-area strip, icon+label items, badge, `onSelect`/`onReselect` semantics.",
+      "props": {
+        "TabBarItemProps": [
+          {
+            "name": "icon",
+            "type": "ReactNode",
+            "required": true,
+            "description": "Item icon (above the label)"
+          },
+          {
+            "name": "label",
+            "type": "string",
+            "required": true,
+            "description": "Item name — rendered under the icon and used as the accessible name"
+          },
+          {
+            "name": "badge",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Overlay badge (usually <Badge/>)"
+          },
+          {
+            "name": "active",
+            "type": "boolean",
+            "required": false,
+            "default": "false",
+            "description": "Marks the current view: aria-current + the 2px top indicator"
+          },
+          {
+            "name": "onSelect",
+            "type": "() => void",
+            "required": false,
+            "description": "Fires when a non-active item is tapped"
+          },
+          {
+            "name": "onReselect",
+            "type": "() => void",
+            "required": false,
+            "description": "Fires when the already-active item is tapped again — the 'tap-again-to-dismiss/back-to-root' affordance"
+          },
+          {
+            "name": "...rest",
+            "type": "button attributes",
+            "required": false,
+            "description": "Native button props (type=button is built in)"
+          }
+        ],
+        "TabBarProps": [
+          {
+            "name": "children",
+            "type": "ReactNode",
+            "required": true,
+            "description": "TabBarItem elements (horizontally distributed; safe-area aware)"
+          },
+          {
+            "name": "className",
+            "type": "string",
+            "required": false,
+            "description": "Additional CSS class"
+          },
+          {
+            "name": "...rest",
+            "type": "nav attributes",
+            "required": false,
+            "description": "Renders a nav landmark — pass aria-label via rest. Positioning (fixed) is left to the Workbench or the consumer"
+          }
+        ]
+      }
+    },
     "Table": {
       "cssFamily": "table",
       "importStatement": "import { Table, TableHead, TableBody, TableRow, TableCell } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/table.css';",
@@ -7377,21 +8185,59 @@
     },
     "Tabs": {
       "cssFamily": "tabs",
-      "importStatement": "import { Tabs, TabList, Tab, TabPanel } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/tabs.css';",
+      "importStatement": "import { Tabs, TabList, Tab, TabPanel, SortableTabList } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/tabs.css';",
       "peerDeps": [],
       "description": "Tab panel switcher with controllable active tab (`TabList`, `Tab`, `TabPanel`).",
       "props": {
+        "SortableTabListProps": [
+          {
+            "name": "children",
+            "type": "ReactNode",
+            "required": true,
+            "description": "Tab elements (drag reordering via dnd-kit; keyboard lift via Space, drop via Enter, cancel via Escape). Note: the ⋯ overflow menu is not rendered in the sortable variant — keep the strip scrollable instead"
+          },
+          {
+            "name": "className",
+            "type": "string",
+            "required": false,
+            "description": "Additional CSS class"
+          },
+          {
+            "name": "onReorder",
+            "type": "(nextOrder: number[]) => void",
+            "required": false,
+            "description": "Reports the new index order when a drag or keyboard sort settles — re-rendering the tabs is the owner's job"
+          }
+        ],
         "TabListProps": [
           {
             "name": "className",
             "type": "string",
             "required": false,
+            "description": "Additional CSS class"
+          },
+          {
+            "name": "listRef",
+            "type": "RefObject<HTMLDivElement | null>",
+            "required": false,
             "description": ""
           },
+          {
+            "name": "overflowLabel",
+            "type": "string",
+            "required": false,
+            "description": "Overrides the ⋯ overflow button's accessible label (default from the tabs locale pack: More tabs)"
+          },
           {
             "name": "children",
             "type": "ReactNode",
             "required": true,
+            "description": "Tab elements; overflowing tabs stay reachable through the ⋯ menu, and the strip scrolls horizontally as the fallback"
+          },
+          {
+            "name": "tabMetas",
+            "type": "TabMeta[]",
+            "required": false,
             "description": ""
           }
         ],
@@ -7422,6 +8268,43 @@
             "required": true,
             "description": "Unique value identifying this tab"
           },
+          {
+            "name": "icon",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Leading icon slot (aria-hidden — decorative)"
+          },
+          {
+            "name": "status",
+            "type": "TabStatus",
+            "required": false,
+            "description": "Status dot: dirty=neutral, error=danger, syncing=primary; the SR status word comes from the tabs locale pack unless statusLabel overrides it"
+          },
+          {
+            "name": "statusLabel",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Overrides the status word appended to the accessible name (the i18n hook for SR users)"
+          },
+          {
+            "name": "closable",
+            "type": "boolean",
+            "required": false,
+            "default": "false",
+            "description": "Renders a close × (aria-label from the tabs locale pack, overridable via closeLabel); clicking or pressing Delete closes — unmounting the tab is the owner's job via onClose"
+          },
+          {
+            "name": "closeLabel",
+            "type": "string",
+            "required": false,
+            "description": "Overrides the close button's accessible label"
+          },
+          {
+            "name": "onClose",
+            "type": "(event: MouseEvent<HTMLSpanElement, MouseEvent> | KeyboardEvent<HTMLDivElement>) => void",
+            "required": false,
+            "description": "Close notification — pure notification, the controlled tabs array is the owner's to mutate"
+          },
           {
             "name": "className",
             "type": "string",
@@ -7531,6 +8414,12 @@
             "required": false,
             "description": ""
           },
+          {
+            "name": "classNames",
+            "type": "TagGroupClassNames",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "onReorder",
             "type": "(nextOrder: number[]) => void",
@@ -7570,6 +8459,12 @@
             "type": "string",
             "required": false,
             "description": "Additional CSS class"
+          },
+          {
+            "name": "classNames",
+            "type": "TagGroupClassNames",
+            "required": false,
+            "description": ""
           }
         ]
       }
@@ -8407,7 +9302,7 @@
         "ToolbarProps": [
           {
             "name": "orientation",
-            "type": "'horizontal' | 'vertical'",
+            "type": "'vertical' | 'horizontal'",
             "required": false,
             "description": ""
           },
@@ -9671,6 +10566,18 @@
             "default": "5",
             "description": "Extra items to render outside viewport"
           },
+          {
+            "name": "onEndReached",
+            "type": "() => void",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "endReachedThreshold",
+            "type": "number",
+            "required": false,
+            "description": ""
+          },
           {
             "name": "reverse",
             "type": "boolean",
@@ -9692,6 +10599,15 @@
         ]
       }
     },
+    "VisuallyHidden": {
+      "cssFamily": "visually-hidden",
+      "importStatement": "import { VisuallyHidden } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/visually-hidden.css';",
+      "peerDeps": [],
+      "description": "Screen-reader-only content primitive: clipped off every visual axis while staying in the a11y tree (the icon-only-button label soup).",
+      "props": {
+        "VisuallyHiddenProps": []
+      }
+    },
     "Watermark": {
       "cssFamily": "watermark",
       "importStatement": "import { Watermark } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/watermark.css';",
@@ -9761,6 +10677,130 @@
           }
         ]
       }
+    },
+    "Workbench": {
+      "cssFamily": "workbench",
+      "importStatement": "import { Workbench } from 'haze-ui';\nimport 'haze-ui/css/tokens.css';\nimport 'haze-ui/css/workbench.css';",
+      "peerDeps": [],
+      "description": "IDE-style application frame (`100dvh`): activityBar/sidebar/auxiliaryBar/panel/statusBar/tabBar slots with px-resizable collapsible regions and a maximizable bottom panel; below 768px sides become overlays and the tabBar takes over.",
+      "props": {
+        "WorkbenchProps": [
+          {
+            "name": "activityBar",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Left icon rail slot (usually <ActivityRail/>) — hidden below 768px where the tabBar takes over"
+          },
+          {
+            "name": "activityBarPosition",
+            "type": "ControlOrValue<'top' | 'bottom' | 'side'>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "sidebar",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Primary side region (explorer, search…); docked+resizable on desktop, a scrimmed overlay on mobile"
+          },
+          {
+            "name": "auxiliaryBar",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Secondary side region (inspector) docked right; also overlay below 768px"
+          },
+          {
+            "name": "panel",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Bottom panel region (terminal/output/problems); docked+resizable on desktop, hidden on mobile — surface it as a view there"
+          },
+          {
+            "name": "statusBar",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Status strip slot (usually <StatusBar/>)"
+          },
+          {
+            "name": "tabBar",
+            "type": "ReactNode",
+            "required": false,
+            "description": "Mobile bottom navigation slot (usually <TabBar/>); hidden on desktop"
+          },
+          {
+            "name": "sidebarWidth",
+            "type": "ControlOrValue<number>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "sidebarCollapsed",
+            "type": "ControlOrValue<boolean>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "mobileSidebarOpen",
+            "type": "ControlOrValue<boolean>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "auxiliaryBarWidth",
+            "type": "ControlOrValue<number>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "auxiliaryBarCollapsed",
+            "type": "ControlOrValue<boolean>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "panelHeight",
+            "type": "ControlOrValue<number>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "panelCollapsed",
+            "type": "ControlOrValue<boolean>",
+            "required": false,
+            "description": ""
+          },
+          {
+            "name": "panelMaximized",
+            "type": "ControlOrValue<boolean>",
+            "required": false,
+            "description": "Maximizes the bottom panel over the main area (VSCode ctrl+J style); reversible through the same Control"
+          },
+          {
+            "name": "children",
+            "type": "ReactNode",
+            "required": true,
+            "description": "Main editor area — compose freely (Tabs + TabPanel, anything)"
+          },
+          {
+            "name": "sidebarWidth / auxiliaryBarWidth / panelHeight",
+            "type": "Control<number> | number",
+            "required": false,
+            "description": "Region sizes in px — plain props double as defaults after a resize (commit via the internal group's onResizeCommit semantics)"
+          },
+          {
+            "name": "sidebarCollapsed / auxiliaryBarCollapsed / panelCollapsed",
+            "type": "Control<boolean> | boolean",
+            "required": false,
+            "description": "Region visibility — one source of truth across breakpoints: docked collapse on desktop reads as the overlay being closed on mobile"
+          },
+          {
+            "name": "className",
+            "type": "string",
+            "required": false,
+            "description": "Additional CSS class"
+          }
+        ]
+      }
     }
   },
   "tokens": [