banhaten 0.4.0 → 0.6.0

package/registry/index.json

@@ -18,6 +18,22 @@
         "source": "hooks/use-direction.ts",
         "target": "{{hooks}}/use-direction.ts"
       },
+      {
+        "source": "hooks/use-controllable-state.ts",
+        "target": "{{hooks}}/use-controllable-state.ts"
+      },
+      {
+        "source": "hooks/use-listbox-navigation.ts",
+        "target": "{{hooks}}/use-listbox-navigation.ts"
+      },
+      {
+        "source": "hooks/use-motion-end.ts",
+        "target": "{{hooks}}/use-motion-end.ts"
+      },
+      {
+        "source": "hooks/use-reduced-motion.ts",
+        "target": "{{hooks}}/use-reduced-motion.ts"
+      },
       {
         "source": "guidance/USAGE.md",
         "target": ".banhaten/USAGE.md"
@@ -111,8 +127,8 @@
         "--bh-text-body-xs-medium-line-height",
         "--bh-text-body-xs-regular-font-size",
         "--bh-text-body-xs-regular-line-height",
-        "--shadow-accordion-item",
-        "--shadow-button-focus"
+        "--elevation-accordion-item",
+        "--elevation-button-focus"
       ]
     },
     "aspect-ratio": {
@@ -326,7 +342,7 @@
         "--bh-space-xl-12",
         "--bh-space-xxs-2",
         "--bh-text-body-sm-medium-font-size",
-        "--shadow-avatar-badge"
+        "--elevation-avatar-badge"
       ]
     },
     "badge": {
@@ -440,6 +456,7 @@
         "--bh-border-focus-danger",
         "--bh-border-strong",
         "--bh-border-subtle",
+        "--bh-border-width-default",
         "--bh-content-accent-amber-default",
         "--bh-content-accent-amber-strong",
         "--bh-content-accent-blue-default",
@@ -608,7 +625,7 @@
         "--bh-text-body-xs-medium-letter-spacing",
         "--bh-text-body-xs-medium-line-height",
         "--bh-z-raised",
-        "--shadow-button-focus"
+        "--elevation-button-focus"
       ]
     },
     "attribute": {
@@ -616,6 +633,13 @@
       "dependencies": {
         "class-variance-authority": "^0.7.1"
       },
+      "props": {
+        "AttributeList.density": {
+          "type": "\"compact\" | \"default\" | \"comfortable\"",
+          "default": "default",
+          "description": "compact and default set the row padding (8px, 16px). comfortable is the app-shell detail row: no row padding, rows 16px apart, a 14/20 label in a 176px column and 16px before the value."
+        }
+      },
       "parts": [
         "AttributeCard",
         "AttributeHeader",
@@ -670,6 +694,7 @@
         "examples/attribute-demo.tsx"
       ],
       "tokens": [
+        "--bh-attribute-comfortable-label-width",
         "--bh-attribute-header-icon-size",
         "--bh-attribute-header-icon-size-lg",
         "--bh-attribute-label-width",
@@ -688,6 +713,7 @@
         "--bh-space-5xl-24",
         "--bh-space-6xl-32",
         "--bh-space-md-8",
+        "--bh-space-none",
         "--bh-space-sm-6",
         "--bh-space-xl-12",
         "--bh-space-xs-4",
@@ -699,6 +725,10 @@
         "--bh-text-body-md-regular-font-weight",
         "--bh-text-body-md-regular-letter-spacing",
         "--bh-text-body-md-regular-line-height",
+        "--bh-text-body-sm-regular-font-size",
+        "--bh-text-body-sm-regular-font-weight",
+        "--bh-text-body-sm-regular-letter-spacing",
+        "--bh-text-body-sm-regular-line-height",
         "--bh-text-heading-sm-medium-font-size",
         "--bh-text-heading-sm-medium-font-weight",
         "--bh-text-heading-sm-medium-letter-spacing",
@@ -727,6 +757,11 @@
         }
       ],
       "props": {
+        "variant": {
+          "type": "\"default\" | \"secondary\" | \"soft\" | \"outline\" | \"ghost\" | \"ghost-primary\" | \"danger\" | \"soft-danger\" | \"white\" | \"success\" | \"warning\" | \"link\" | \"destructive\" | \"soft-destructive\"",
+          "default": "default",
+          "description": "Twelve canonical semantic treatments. The deprecated destructive and soft-destructive compatibility aliases remain accepted and map to danger and soft-danger, respectively."
+        },
         "density": {
           "type": "\"compact\" | \"default\" | \"comfortable\"",
           "default": "comfortable",
@@ -752,7 +787,10 @@
         "ghost-primary",
         "danger",
         "soft-danger",
-        "white"
+        "white",
+        "success",
+        "warning",
+        "link"
       ],
       "sizes": [
         "xs",
@@ -870,12 +908,12 @@
         "--bh-text-button-font-weight",
         "--bh-text-button-letter-spacing",
         "--bh-text-button-line-height",
-        "--shadow-button-danger-focus",
-        "--shadow-button-focus",
-        "--shadow-button-raised",
-        "--shadow-button-secondary",
-        "--shadow-button-secondary-focus",
-        "--shadow-button-soft"
+        "--elevation-button-danger-focus",
+        "--elevation-button-focus",
+        "--elevation-button-raised",
+        "--elevation-button-secondary",
+        "--elevation-button-secondary-focus",
+        "--elevation-button-soft"
       ]
     },
     "card": {
@@ -887,6 +925,25 @@
       "registryDependencies": [
         "button"
       ],
+      "sizes": [
+        "default",
+        "comfortable"
+      ],
+      "defaults": {
+        "sizes": "default"
+      },
+      "props": {
+        "Card.size": {
+          "type": "\"default\" | \"comfortable\"",
+          "default": "default",
+          "description": "comfortable is the panel inside an app shell: the same surface and 1px inset edge with a 12px radius instead of the library card's 16px."
+        },
+        "CardSurface.size": {
+          "type": "\"default\" | \"comfortable\"",
+          "default": "default",
+          "description": "The same sizes as Card, for compositions that bring their own layout."
+        }
+      },
       "parts": [
         "Card",
         "CardSurface",
@@ -948,6 +1005,7 @@
         "--bh-card-actions-max-width",
         "--bh-card-bg",
         "--bh-card-border",
+        "--bh-card-comfortable-radius",
         "--bh-card-content-padding",
         "--bh-card-desktop-content-padding",
         "--bh-card-desktop-full-height",
@@ -992,15 +1050,20 @@
         "--bh-text-heading-sm-semibold-font-weight",
         "--bh-text-heading-sm-semibold-letter-spacing",
         "--bh-text-heading-sm-semibold-line-height",
-        "--shadow-button-focus"
+        "--elevation-button-focus"
       ]
     },
     "chart": {
-      "description": "Recharts wrapper with Banhaten chart color tokens, responsive container, tooltip content, legend content, and config-driven color variables.",
+      "description": "Eight token-driven ECharts families and 18 ready-made chart blocks, with responsive SVG rendering, theme-aware typography, tooltips, legends, brushes, and compatible Recharts wrappers.",
       "dependencies": {
-        "recharts": "^3.9.2"
+        "recharts": "^3.9.2",
+        "echarts": "^6.1.0",
+        "lucide-react": "^1.17.0"
       },
       "parts": [
+        "DataChart",
+        "ChartBlock",
+        "EChart",
         "ChartContainer",
         "ChartTooltip",
         "ChartTooltipContent",
@@ -1017,12 +1080,40 @@
             "ChartTooltip",
             "ChartTooltipContent"
           ]
+        },
+        {
+          "source": "components/echart.tsx",
+          "values": [
+            "EChart"
+          ]
+        },
+        {
+          "source": "components/chart-options.ts",
+          "values": [
+            "createChartOption"
+          ]
+        },
+        {
+          "source": "components/data-chart.tsx",
+          "values": [
+            "DataChart"
+          ]
+        },
+        {
+          "source": "components/chart-block.tsx",
+          "values": [
+            "ChartBlock",
+            "chartBlocks"
+          ]
         }
       ],
       "tokens": [
         "--bh-bg-neutral-subtle",
         "--bh-bg-raised",
+        "--bh-border-default",
+        "--bh-border-focus",
         "--bh-border-subtle",
+        "--bh-border-width-default",
         "--bh-chart-categorical-aqua",
         "--bh-chart-categorical-brand",
         "--bh-chart-categorical-danger",
@@ -1031,44 +1122,209 @@
         "--bh-chart-categorical-purple",
         "--bh-chart-categorical-success",
         "--bh-chart-categorical-warning",
+        "--bh-chart-neutral-default",
+        "--bh-content-brand-default",
         "--bh-content-default",
         "--bh-content-muted",
         "--bh-content-subtle",
+        "--bh-duration-default",
+        "--bh-focus-ring-width",
+        "--bh-font-family",
+        "--bh-font-family-mono",
+        "--bh-icon-stroke-200",
+        "--bh-interactive-ghost-hover",
+        "--bh-opacity-15",
+        "--bh-opacity-30",
+        "--bh-opacity-90",
+        "--bh-opacity-muted",
+        "--bh-radius-3xl-16",
         "--bh-radius-full",
         "--bh-radius-lg-8",
+        "--bh-radius-md-6",
+        "--bh-radius-sm-4",
+        "--bh-radius-xl-10",
+        "--bh-radius-xs-2",
+        "--bh-space-11xl-96",
+        "--bh-space-12xl-128",
+        "--bh-space-15xl-224",
         "--bh-space-17xl-288",
         "--bh-space-19xl-384",
         "--bh-space-3xl-16",
+        "--bh-space-4xl-20",
+        "--bh-space-5xl-24",
+        "--bh-space-6xl-32",
+        "--bh-space-7xl-40",
+        "--bh-space-9xl-64",
+        "--bh-space-lg-10",
         "--bh-space-md-8",
         "--bh-space-sm-6",
         "--bh-space-xl-12",
         "--bh-space-xs-4",
+        "--bh-space-xxs-2",
+        "--bh-space-xxxs-1",
+        "--bh-text-body-2xs-regular-font-size",
+        "--bh-text-body-2xs-regular-line-height",
+        "--bh-text-body-3xs-regular-font-size",
+        "--bh-text-body-3xs-regular-line-height",
+        "--bh-text-body-sm-medium-font-size",
+        "--bh-text-body-sm-medium-line-height",
+        "--bh-text-body-sm-regular-font-size",
+        "--bh-text-body-sm-regular-font-weight",
+        "--bh-text-body-sm-regular-line-height",
         "--bh-text-body-xs-medium-font-size",
         "--bh-text-body-xs-medium-font-weight",
         "--bh-text-body-xs-regular-font-size",
         "--bh-text-body-xs-regular-font-weight",
         "--bh-text-body-xs-regular-letter-spacing",
         "--bh-text-body-xs-regular-line-height",
-        "--shadow-popover"
+        "--bh-text-heading-lg-semibold-font-size",
+        "--bh-text-heading-lg-semibold-font-weight",
+        "--bh-text-heading-lg-semibold-letter-spacing",
+        "--bh-text-heading-lg-semibold-line-height",
+        "--bh-text-heading-md-semibold-font-size",
+        "--bh-text-heading-md-semibold-font-weight",
+        "--bh-text-heading-md-semibold-letter-spacing",
+        "--bh-text-heading-md-semibold-line-height",
+        "--bh-text-heading-xs-semibold-font-size",
+        "--bh-text-heading-xs-semibold-font-weight",
+        "--bh-text-heading-xs-semibold-letter-spacing",
+        "--bh-text-heading-xs-semibold-line-height",
+        "--elevation-popover"
       ],
       "features": [
-        "responsive container",
-        "tooltip content",
-        "legend content",
-        "config colors"
+        "eight chart families",
+        "18 ready-made blocks",
+        "live theme and font tokens",
+        "responsive SVG",
+        "tooltips and legends",
+        "range brush",
+        "pattern fills",
+        "reduced motion",
+        "RTL",
+        "Recharts compatibility"
       ],
       "rtl": {
         "inheritsDirection": true,
-        "layout": "Chart labels and legends should use logical layout; chart geometry is controlled by Recharts."
+        "layout": "Labels and block layouts inherit direction. DataChart mirrors Cartesian category axes and value-axis placement. Flow diagrams preserve data-defined direction. Legacy ChartContainer geometry is controlled by Recharts."
       },
       "files": [
         {
           "source": "components/chart.tsx",
           "target": "{{ui}}/chart.tsx"
+        },
+        {
+          "source": "guidance/charts.LICENSE.txt",
+          "target": "{{ui}}/charts.LICENSE.txt"
+        },
+        {
+          "source": "components/chart-block-data.ts",
+          "target": "{{ui}}/chart-block-data.ts",
+          "internal": true
+        },
+        {
+          "source": "components/chart-block.css",
+          "target": "{{ui}}/chart-block.css"
+        },
+        {
+          "source": "components/chart-block.tsx",
+          "target": "{{ui}}/chart-block.tsx"
+        },
+        {
+          "source": "components/chart-interactions.ts",
+          "target": "{{ui}}/chart-interactions.ts",
+          "internal": true
+        },
+        {
+          "source": "components/chart-options.cartesian.ts",
+          "target": "{{ui}}/chart-options.cartesian.ts",
+          "internal": true
+        },
+        {
+          "source": "components/chart-options.paint.ts",
+          "target": "{{ui}}/chart-options.paint.ts",
+          "internal": true
+        },
+        {
+          "source": "components/chart-options.parts.ts",
+          "target": "{{ui}}/chart-options.parts.ts",
+          "internal": true
+        },
+        {
+          "source": "components/chart-options.radial.ts",
+          "target": "{{ui}}/chart-options.radial.ts",
+          "internal": true
+        },
+        {
+          "source": "components/chart-options.ts",
+          "target": "{{ui}}/chart-options.ts"
+        },
+        {
+          "source": "components/chart-options.types.ts",
+          "target": "{{ui}}/chart-options.types.ts",
+          "internal": true
+        },
+        {
+          "source": "components/data-chart.tsx",
+          "target": "{{ui}}/data-chart.tsx"
+        },
+        {
+          "source": "components/echart-theme.ts",
+          "target": "{{ui}}/echart-theme.ts",
+          "internal": true
+        },
+        {
+          "source": "components/echart.css",
+          "target": "{{ui}}/echart.css"
+        },
+        {
+          "source": "components/echart.tsx",
+          "target": "{{ui}}/echart.tsx"
         }
       ],
       "examples": [
-        "examples/chart-demo.tsx"
+        "examples/chart-demo.tsx",
+        "examples/chart-block-demo.tsx"
+      ],
+      "props": {
+        "spec": {
+          "type": "ChartSpec",
+          "default": null,
+          "description": "DataChart: family, data, series, variant, stacking, labels, brush, and interaction options. Series colors are Banhaten palette indices."
+        },
+        "label": {
+          "type": "string",
+          "default": null,
+          "description": "DataChart / EChart: required accessible chart name."
+        },
+        "description": {
+          "type": "string",
+          "default": null,
+          "description": "DataChart / EChart: optional accessible text summary."
+        },
+        "block": {
+          "type": "ChartBlockId",
+          "default": null,
+          "description": "ChartBlock: one of 18 documented blocks, with illustrative data and period controls where applicable."
+        },
+        "option": {
+          "type": "(theme: EChartTheme) => EChartsOption",
+          "default": null,
+          "description": "EChart: advanced option factory receives resolved inherited Banhaten tokens."
+        },
+        "onReady": {
+          "type": "(chart, theme) => void | (() => void)",
+          "default": null,
+          "description": "EChart: attach custom interactions and return their cleanup."
+        },
+        "config": {
+          "type": "ChartConfig",
+          "default": null,
+          "description": "Legacy ChartContainer: maps series names to CSS color variables."
+        }
+      },
+      "registryDependencies": [
+        "button",
+        "progress"
       ]
     },
     "carousel": {
@@ -1269,9 +1525,9 @@
         "--bh-text-button-letter-spacing",
         "--bh-text-button-line-height",
         "--bh-z-raised",
-        "--shadow-button-group",
-        "--shadow-button-group-focus",
-        "--shadow-component-default"
+        "--elevation-button-group",
+        "--elevation-button-group-focus",
+        "--elevation-component-default"
       ]
     },
     "segmented-control": {
@@ -1445,8 +1701,8 @@
         "--bh-toggle-icon-size-md",
         "--bh-toggle-icon-size-sm",
         "--bh-toggle-offset",
-        "--shadow-md",
-        "--shadow-social-button-focus-ring"
+        "--elevation-03",
+        "--elevation-social-button-focus-ring"
       ]
     },
     "menu": {
@@ -1454,7 +1710,8 @@
       "dependencies": {
         "@radix-ui/react-dropdown-menu": "^2.1.17",
         "@radix-ui/react-slot": "^1.2.3",
-        "class-variance-authority": "^0.7.1"
+        "class-variance-authority": "^0.7.1",
+        "lucide-react": "^1.17.0"
       },
       "parts": [
         "Menu",
@@ -1478,6 +1735,8 @@
         "MenuItemBadge",
         "MenuItemSwitch",
         "MenuItemAction",
+        "MenuRadioGroup",
+        "MenuRadioItem",
         "MenuProgress",
         "MenuSeparator",
         "MenuLabel",
@@ -1505,6 +1764,8 @@
             "MenuPortal",
             "MenuPreview",
             "MenuProgress",
+            "MenuRadioGroup",
+            "MenuRadioItem",
             "MenuRoot",
             "MenuSeparator",
             "MenuSub",
@@ -1519,6 +1780,23 @@
           ]
         }
       ],
+      "props": {
+        "onSelect": {
+          "type": "(event: Event) => void",
+          "default": null,
+          "description": "MenuItem selection handler. Uses Radix's native selection Event, not React's DOM text-selection event; call event.preventDefault() to keep toggle or multi-select menus open."
+        },
+        "onValueChange": {
+          "type": "(value: string) => void",
+          "default": null,
+          "description": "MenuRadioGroup only. Receives the value of the MenuRadioItem that was chosen."
+        },
+        "value": {
+          "type": "string",
+          "default": null,
+          "description": "MenuRadioGroup: the chosen value. MenuRadioItem: the value the item stands for; the item matching its group's value is checked, with role menuitemradio, aria-checked and a trailing check."
+        }
+      },
       "widths": [
         "menu",
         "default",
@@ -1535,7 +1813,8 @@
       ],
       "states": [
         "default",
-        "disabled"
+        "disabled",
+        "checked"
       ],
       "rtl": {
         "inheritsDirection": true,
@@ -1563,6 +1842,7 @@
         "--bh-content-muted",
         "--bh-content-subtle",
         "--bh-control-default",
+        "--bh-icon-stroke-200",
         "--bh-icon-stroke-300",
         "--bh-interactive-indicator-default",
         "--bh-interactive-outlined-default",
@@ -1644,7 +1924,7 @@
         "--bh-text-body-xs-regular-font-weight",
         "--bh-text-body-xs-regular-letter-spacing",
         "--bh-text-body-xs-regular-line-height",
-        "--shadow-menu"
+        "--elevation-menu"
       ]
     },
     "menubar": {
@@ -1742,8 +2022,8 @@
         "--bh-text-body-xs-medium-letter-spacing",
         "--bh-text-body-xs-medium-line-height",
         "--bh-z-popover",
-        "--shadow-component-default",
-        "--shadow-menu"
+        "--elevation-component-default",
+        "--elevation-menu"
       ]
     },
     "command": {
@@ -1834,7 +2114,7 @@
         "--bh-text-body-xs-medium-font-weight",
         "--bh-text-body-xs-medium-letter-spacing",
         "--bh-text-body-xs-medium-line-height",
-        "--shadow-menu"
+        "--elevation-menu"
       ]
     },
     "context-menu": {
@@ -1927,7 +2207,7 @@
         "--bh-text-body-xs-medium-letter-spacing",
         "--bh-text-body-xs-medium-line-height",
         "--bh-z-popover",
-        "--shadow-menu"
+        "--elevation-menu"
       ]
     },
     "tooltip": {
@@ -1963,6 +2243,13 @@
           ]
         }
       ],
+      "props": {
+        "dir": {
+          "type": "\"ltr\" | \"rtl\" | \"auto\"",
+          "default": "ltr",
+          "description": "TooltipShortcut only: keeps key glyphs in physical order inside RTL tooltips. Override only for localized non-shortcut text."
+        }
+      },
       "variants": [
         "dark",
         "default"
@@ -1986,7 +2273,8 @@
         "inheritsDirection": true,
         "spacing": "Uses inherited direction with flex layout so label/shortcut and text/close order mirror naturally.",
         "pointerPlacement": "Top and bottom left/right positions map to logical start/end in RTL. Center-left and center-right remain physical sides to match the Figma matrix.",
-        "textDirection": "Labels and support text use dir=\"auto\" for Arabic and English copy."
+        "textDirection": "Labels and support text use dir=\"auto\" for Arabic and English copy.",
+        "shortcutDirection": "TooltipShortcut defaults to dir=\"ltr\" so physical key order remains stable inside RTL content."
       },
       "files": [
         {
@@ -2035,6 +2323,7 @@
         "--bh-tooltip-close-fg",
         "--bh-tooltip-close-icon-size",
         "--bh-tooltip-close-size",
+        "--bh-tooltip-elevation",
         "--bh-tooltip-fg",
         "--bh-tooltip-lg-padding",
         "--bh-tooltip-lg-radius",
@@ -2048,7 +2337,6 @@
         "--bh-tooltip-pointer-inline-offset",
         "--bh-tooltip-pointer-offset",
         "--bh-tooltip-pointer-width",
-        "--bh-tooltip-shadow",
         "--bh-tooltip-shortcut-bg",
         "--bh-tooltip-shortcut-border",
         "--bh-tooltip-shortcut-height",
@@ -2058,8 +2346,8 @@
         "--bh-tooltip-sm-radius",
         "--bh-z-overlay",
         "--bh-z-raised",
-        "--shadow-button-focus",
-        "--shadow-lg"
+        "--elevation-04",
+        "--elevation-button-focus"
       ]
     },
     "popover": {
@@ -2188,8 +2476,8 @@
         "--bh-text-body-xs-regular-letter-spacing",
         "--bh-text-body-xs-regular-line-height",
         "--bh-z-popover",
-        "--shadow-button-focus",
-        "--shadow-popover"
+        "--elevation-button-focus",
+        "--elevation-popover"
       ]
     },
     "hover-card": {
@@ -2241,7 +2529,7 @@
         "--bh-space-3xl-16",
         "--bh-space-md-8",
         "--bh-z-popover",
-        "--shadow-popover"
+        "--elevation-popover"
       ]
     },
     "modal": {
@@ -2376,9 +2664,9 @@
         "--bh-text-heading-sm-semibold-letter-spacing",
         "--bh-text-heading-sm-semibold-line-height",
         "--bh-z-overlay",
-        "--shadow-2xl",
-        "--shadow-button-focus",
-        "--shadow-modal"
+        "--elevation-06",
+        "--elevation-button-focus",
+        "--elevation-modal"
       ]
     },
     "alert-dialog": {
@@ -2497,8 +2785,8 @@
         "--bh-text-heading-sm-semibold-letter-spacing",
         "--bh-text-heading-sm-semibold-line-height",
         "--bh-z-overlay",
-        "--shadow-2xl",
-        "--shadow-modal"
+        "--elevation-06",
+        "--elevation-modal"
       ]
     },
     "checkbox": {
@@ -2577,9 +2865,9 @@
         "--bh-checkbox-root-size",
         "--bh-content-default",
         "--bh-content-disabled",
-        "--bh-content-on-color",
         "--bh-content-subtle",
         "--bh-icon-stroke-300",
+        "--bh-interactive-checkbox-content",
         "--bh-interactive-checkbox-default",
         "--bh-interactive-checkbox-hover",
         "--bh-opacity-60",
@@ -2591,15 +2879,15 @@
         "--bh-text-body-sm-regular-font-weight",
         "--bh-text-body-sm-regular-letter-spacing",
         "--bh-text-body-sm-regular-line-height",
-        "--shadow-checkbox-card",
-        "--shadow-checkbox-card-focus",
-        "--shadow-checkbox-control",
-        "--shadow-checkbox-focus",
-        "--shadow-component-default"
+        "--elevation-checkbox-card",
+        "--elevation-checkbox-card-focus",
+        "--elevation-checkbox-control",
+        "--elevation-checkbox-focus",
+        "--elevation-component-default"
       ]
     },
     "collapsible": {
-      "description": "Radix Collapsible wrapper for disclosure sections with tokenized trigger, icon rotation, and content slots.",
+      "description": "Radix Collapsible wrapper for disclosure sections with tokenized trigger, icon rotation, content slots, and an unstyled animated panel.",
       "dependencies": {
         "@radix-ui/react-collapsible": "^1.1.15",
         "lucide-react": "^1.17.0"
@@ -2607,7 +2895,8 @@
       "parts": [
         "Collapsible",
         "CollapsibleTrigger",
-        "CollapsibleContent"
+        "CollapsibleContent",
+        "CollapsiblePanel"
       ],
       "supportedExports": [
         {
@@ -2615,6 +2904,7 @@
           "values": [
             "Collapsible",
             "CollapsibleContent",
+            "CollapsiblePanel",
             "CollapsibleTrigger"
           ]
         }
@@ -2623,7 +2913,9 @@
         "controlled state",
         "uncontrolled state",
         "keyboard trigger",
-        "RTL"
+        "RTL",
+        "animated panel",
+        "custom trigger with asChild"
       ],
       "rtl": {
         "inheritsDirection": true,
@@ -2642,6 +2934,8 @@
       "tokens": [
         "--bh-content-default",
         "--bh-content-subtle",
+        "--bh-duration-moderate",
+        "--bh-easing-emphasized",
         "--bh-icon-stroke-200",
         "--bh-interactive-ghost-hover",
         "--bh-radius-lg-8",
@@ -2657,7 +2951,7 @@
         "--bh-text-body-sm-regular-font-weight",
         "--bh-text-body-sm-regular-letter-spacing",
         "--bh-text-body-sm-regular-line-height",
-        "--shadow-button-focus"
+        "--elevation-button-focus"
       ]
     },
     "radio-group": {
@@ -2760,8 +3054,8 @@
         "--bh-text-body-xs-regular-letter-spacing",
         "--bh-text-body-xs-regular-line-height",
         "--bh-z-raised",
-        "--shadow-button-focus",
-        "--shadow-radio-control"
+        "--elevation-button-focus",
+        "--elevation-radio-control"
       ]
     },
     "radio-card": {
@@ -2864,11 +3158,11 @@
         "--bh-text-body-sm-regular-font-weight",
         "--bh-text-body-sm-regular-letter-spacing",
         "--bh-text-body-sm-regular-line-height",
-        "--shadow-component-default",
-        "--shadow-radio-card",
-        "--shadow-radio-card-current",
-        "--shadow-radio-card-disabled",
-        "--shadow-radio-control"
+        "--elevation-component-default",
+        "--elevation-radio-card",
+        "--elevation-radio-card-current",
+        "--elevation-radio-card-disabled",
+        "--elevation-radio-control"
       ]
     },
     "divider": {
@@ -3012,13 +3306,13 @@
         "--bh-pagination-root-gap",
         "--bh-pagination-simple-width",
         "--bh-space-md-8",
-        "--shadow-pagination-active",
-        "--shadow-pagination-control",
-        "--shadow-pagination-focus"
+        "--elevation-pagination-active",
+        "--elevation-pagination-control",
+        "--elevation-pagination-focus"
       ]
     },
     "toolbar": {
-      "description": "Figma Filter Toolbar primitive with eight filter/action styles, search fields, select triggers, icon actions, chips, selected-count badges, desktop/mobile wrapping, and RTL-safe composition.",
+      "description": "Figma Filter Toolbar layout primitive with native Tab-order group semantics, eight filter/action styles, search fields, select triggers, icon actions, chips, selected-count badges, desktop/mobile wrapping, and RTL-safe composition.",
       "dependencies": {
         "@radix-ui/react-slot": "^1.2.3",
         "class-variance-authority": "^0.7.1",
@@ -3074,8 +3368,16 @@
           "type": "readonly string[]",
           "default": null,
           "description": "Adds shared, platform-aware Kbd keycaps to ToolbarSearch without rebuilding a shortcut badge locally."
+        },
+        "role": {
+          "type": "React.AriaRole",
+          "default": "group",
+          "description": "Uses layout-group semantics and native Tab order by default. Applications that override this to toolbar own the complete roving-focus and arrow-key contract."
         }
       },
+      "features": [
+        "native Tab-order layout grouping"
+      ],
       "densities": [
         "compact",
         "default",
@@ -3111,7 +3413,8 @@
       ],
       "avoidWhen": [
         "Using ToolbarSelect as a complete select menu without application behavior",
-        "Applying unrelated custom heights or padding to individual toolbar children"
+        "Applying unrelated custom heights or padding to individual toolbar children",
+        "Using role=\"toolbar\" without application-owned roving focus and arrow-key behavior"
       ],
       "recipes": [
         "Collection filter bar",
@@ -3215,13 +3518,13 @@
         "--bh-text-button-font-weight",
         "--bh-text-button-letter-spacing",
         "--bh-text-button-line-height",
-        "--shadow-button-danger-focus",
-        "--shadow-button-focus",
-        "--shadow-button-raised",
-        "--shadow-button-soft",
-        "--shadow-input",
-        "--shadow-input-focus-ring",
-        "--shadow-select-trigger"
+        "--elevation-button-danger-focus",
+        "--elevation-button-focus",
+        "--elevation-button-raised",
+        "--elevation-button-soft",
+        "--elevation-input",
+        "--elevation-input-focus-ring",
+        "--elevation-select-trigger"
       ]
     },
     "social-button": {
@@ -3350,13 +3653,13 @@
         "--bh-text-button-font-weight",
         "--bh-text-button-letter-spacing",
         "--bh-text-button-line-height",
-        "--shadow-component-default",
-        "--shadow-social-button",
-        "--shadow-social-button-focus"
+        "--elevation-component-default",
+        "--elevation-social-button",
+        "--elevation-social-button-focus"
       ]
     },
     "input": {
-      "description": "Tokenized input field with semantic control density, labels, helper and error text, explicit icons, shared keyboard shortcuts, add-ons, tags, default and soft styles, and RTL states.",
+      "description": "Tokenized input field with native quantity stepping, action-button contracts, semantic control density, labels, helper and error text, icons, shortcuts, add-ons, tags, default and soft styles, and RTL states.",
       "dependencies": {
         "class-variance-authority": "^0.7.1",
         "lucide-react": "^1.17.0"
@@ -3390,6 +3693,26 @@
         }
       ],
       "props": {
+        "buttonProps": {
+          "type": "InputActionButtonProps",
+          "default": null,
+          "description": "Native button props for leading/trailing button and dropdown kinds, including onClick, keyboard handlers, ref, disabled, and ARIA attributes. Defaults to type=button; consumers supply the action or popup."
+        },
+        "decreaseButtonProps": {
+          "type": "InputStepperButtonProps",
+          "default": null,
+          "description": "Native props for the decrease button, excluding children and type. Supports localized aria-label, ref, and onClick; preventDefault cancels the step. Field disabled and readOnly always disable the stepper."
+        },
+        "increaseButtonProps": {
+          "type": "InputStepperButtonProps",
+          "default": null,
+          "description": "Native props for the increase button, excluding children and type. Supports localized aria-label, ref, and onClick; preventDefault cancels the step. Field disabled and readOnly always disable the stepper."
+        },
+        "onChange": {
+          "type": "React.ChangeEventHandler<HTMLInputElement>",
+          "default": null,
+          "description": "Receives native input changes from typing and quantity buttons. Quantity kinds use type=number, respect min/max/step, and support controlled value or uncontrolled defaultValue. step=any uses one-unit button increments."
+        },
         "density": {
           "type": "\"compact\" | \"default\" | \"comfortable\"",
           "default": "default",
@@ -3412,6 +3735,11 @@
           "description": "Deprecated compatibility alias for showInfo.",
           "deprecated": true
         },
+        "isRequired": {
+          "type": "boolean",
+          "default": false,
+          "description": "Shows the required marker and exposes aria-required on the input without enabling native browser validation. Use the native required prop when constraint validation is intended."
+        },
         "trailingIcon": {
           "type": "React.ReactNode | false",
           "default": null,
@@ -3510,7 +3838,8 @@
         }
       ],
       "examples": [
-        "examples/input-demo.tsx"
+        "examples/input-demo.tsx",
+        "examples/input-actions-demo.tsx"
       ],
       "tokens": [
         "--bh-border-danger-strong",
@@ -3530,6 +3859,7 @@
         "--bh-input-comfortable-height",
         "--bh-input-comfortable-padding-x",
         "--bh-input-content-gap",
+        "--bh-input-content-padding-x",
         "--bh-input-helper-gap",
         "--bh-input-icon-size",
         "--bh-input-icon-slot-size",
@@ -3538,7 +3868,6 @@
         "--bh-input-inline-tags-gap",
         "--bh-input-label-gap",
         "--bh-input-lg-height",
-        "--bh-input-lg-padding-x",
         "--bh-input-md-height",
         "--bh-input-md-padding-x",
         "--bh-input-radius",
@@ -3548,6 +3877,7 @@
         "--bh-input-stepper-width",
         "--bh-input-tag-height",
         "--bh-input-tag-padding-x",
+        "--bh-input-value-inset",
         "--bh-input-width",
         "--bh-interactive-input-default",
         "--bh-interactive-input-disabled",
@@ -3573,14 +3903,14 @@
         "--bh-text-body-xs-regular-letter-spacing",
         "--bh-text-body-xs-regular-line-height",
         "--bh-z-raised",
-        "--shadow-component-default",
-        "--shadow-input",
-        "--shadow-input-disabled-overlay",
-        "--shadow-input-focus-overlay",
-        "--shadow-input-focus-ring",
-        "--shadow-input-focus-surface",
-        "--shadow-input-overlay",
-        "--shadow-input-surface"
+        "--elevation-component-default",
+        "--elevation-input",
+        "--elevation-input-disabled-overlay",
+        "--elevation-input-focus-overlay",
+        "--elevation-input-focus-ring",
+        "--elevation-input-focus-surface",
+        "--elevation-input-overlay",
+        "--elevation-input-surface"
       ]
     },
     "input-group": {
@@ -3665,9 +3995,9 @@
         "--bh-text-body-sm-medium-font-weight",
         "--bh-text-body-sm-medium-letter-spacing",
         "--bh-text-body-sm-medium-line-height",
-        "--shadow-component-default",
-        "--shadow-input",
-        "--shadow-input-focus-ring"
+        "--elevation-component-default",
+        "--elevation-input",
+        "--elevation-input-focus-ring"
       ]
     },
     "label": {
@@ -3751,6 +4081,11 @@
         }
       ],
       "props": {
+        "dir": {
+          "type": "\"ltr\" | \"rtl\" | \"auto\"",
+          "default": "ltr",
+          "description": "Keeps physical key and modifier order stable inside RTL interfaces. Override only for localized non-shortcut key names."
+        },
         "keys": {
           "type": "readonly string[]",
           "default": null,
@@ -3784,7 +4119,7 @@
       ],
       "rtl": {
         "inheritsDirection": false,
-        "semantics": "Kbd is direction-neutral and should be paired with surrounding text labels."
+        "semantics": "Kbd defaults to dir=\"ltr\" so physical key order stays stable, while surrounding shortcut descriptions keep their own text direction."
       },
       "files": [
         {
@@ -3820,7 +4155,7 @@
         "--bh-text-body-xs-medium-font-weight",
         "--bh-text-body-xs-medium-letter-spacing",
         "--bh-text-body-xs-medium-line-height",
-        "--shadow-button-soft"
+        "--elevation-button-soft"
       ]
     },
     "item": {
@@ -3923,7 +4258,7 @@
         "--bh-text-body-sm-regular-font-weight",
         "--bh-text-body-sm-regular-letter-spacing",
         "--bh-text-body-sm-regular-line-height",
-        "--shadow-button-focus"
+        "--elevation-button-focus"
       ]
     },
     "field": {
@@ -4160,6 +4495,16 @@
         }
       ],
       "props": {
+        "aria-label": {
+          "type": "string",
+          "default": null,
+          "description": "Provides a stable purpose-based accessible name for a label-less Select and is forwarded to its trigger."
+        },
+        "aria-labelledby": {
+          "type": "string",
+          "default": null,
+          "description": "Names a label-less Select trigger from external text without placing the relationship on the inert root."
+        },
         "density": {
           "type": "\"compact\" | \"default\" | \"comfortable\"",
           "default": "default",
@@ -4194,6 +4539,11 @@
           "type": "React.ReactNode | false",
           "default": "chevron-down",
           "description": "Uses the default expand chevron when omitted, accepts a replacement node, and hides the slot when false."
+        },
+        "triggerProps": {
+          "type": "React.ComponentProps<\"button\">",
+          "default": null,
+          "description": "Forwards advanced trigger attributes and is spread last, so matching attributes override the top-level trigger defaults."
         }
       },
       "defaults": {
@@ -4291,12 +4641,12 @@
         "--bh-content-default",
         "--bh-content-disabled",
         "--bh-content-muted",
-        "--bh-content-on-color",
         "--bh-content-subtle",
         "--bh-font-weight-semibold",
         "--bh-icon-size-default",
         "--bh-icon-stroke-200",
         "--bh-icon-stroke-220",
+        "--bh-interactive-checkbox-content",
         "--bh-interactive-checkbox-default",
         "--bh-opacity-60",
         "--bh-radius-full",
@@ -4374,12 +4724,12 @@
         "--bh-text-body-xs-regular-letter-spacing",
         "--bh-text-body-xs-regular-line-height",
         "--bh-z-popover",
-        "--shadow-component-default",
-        "--shadow-select-checkbox",
-        "--shadow-select-danger-focus-ring",
-        "--shadow-select-focus-ring",
-        "--shadow-select-menu",
-        "--shadow-select-trigger"
+        "--elevation-component-default",
+        "--elevation-select-checkbox",
+        "--elevation-select-danger-focus-ring",
+        "--elevation-select-focus-ring",
+        "--elevation-select-menu",
+        "--elevation-select-trigger"
       ]
     },
     "native-select": {
@@ -4473,10 +4823,10 @@
         "--bh-text-body-xs-regular-font-weight",
         "--bh-text-body-xs-regular-letter-spacing",
         "--bh-text-body-xs-regular-line-height",
-        "--shadow-component-default",
-        "--shadow-select-danger-focus-ring",
-        "--shadow-select-focus-ring",
-        "--shadow-select-trigger"
+        "--elevation-component-default",
+        "--elevation-select-danger-focus-ring",
+        "--elevation-select-focus-ring",
+        "--elevation-select-trigger"
       ]
     },
     "sheet": {
@@ -4587,12 +4937,12 @@
         "--bh-text-heading-sm-semibold-letter-spacing",
         "--bh-text-heading-sm-semibold-line-height",
         "--bh-z-overlay",
-        "--shadow-button-focus",
-        "--shadow-component-default"
+        "--elevation-button-focus",
+        "--elevation-component-default"
       ]
     },
     "sidebar": {
-      "description": "Figma-aligned application sidebar with 280px expanded and 48px collapsed shells, brand and workspace headers, search and actions, default/avatar/nested/tree menu variants, badges, group actions, user footers, controlled state, tooltips, logical placement, and RTL mirroring.",
+      "description": "Figma-aligned application sidebar with a tokenized 900px minimum height, staged motion between 280px expanded and 48px collapsed shells, brand and workspace headers, search and actions, default/avatar/nested/tree menu variants, badges, group actions, user footers with hover identity previews, controlled state, tooltips, logical placement, and RTL mirroring.",
       "dependencies": {
         "@radix-ui/react-slot": "^1.2.3",
         "lucide-react": "^1.17.0"
@@ -4668,15 +5018,50 @@
           "default": false,
           "description": "Sets the initial rail state when SidebarProvider owns collapse state internally."
         },
+        "size": {
+          "type": "\"default\" | \"comfortable\"",
+          "default": "default",
+          "description": "Set on SidebarProvider. comfortable uses 40px rows 8px apart with body-md labels, 16px shell padding, a 24px section gap, a heading-md brand, and 20px group labels; the collapsed rail is unchanged."
+        },
+        "subtitle": {
+          "type": "React.ReactNode",
+          "default": "undefined",
+          "description": "Adds a body-sm content-subtle line under the SidebarHeaderBrand name and switches the brand to a stacked layout."
+        },
+        "logo": {
+          "type": "React.ReactNode | false",
+          "default": "Sparkles glyph",
+          "description": "Replaces the SidebarHeaderBrand mark; false renders a text-only brand with no logo slot."
+        },
+        "divider": {
+          "type": "boolean",
+          "default": true,
+          "description": "Draws the SidebarFooter top rule; false removes it for inset footer cards."
+        },
+        "avatar": {
+          "type": "React.ReactNode | false",
+          "default": "person glyph",
+          "description": "Replaces the SidebarFooterUser avatar; false hides the slot while expanded. The collapsed rail always shows a glyph."
+        },
+        "trailingIcon": {
+          "type": "React.ReactNode | false",
+          "default": "part-specific",
+          "description": "Trailing glyph on menu rows and the footer user; false hides the footer user's chevron."
+        },
+        "showIdentityPreview": {
+          "type": "boolean",
+          "default": true,
+          "description": "Reveals the collapsed footer user's name and supporting text beside the rail on hover or keyboard focus."
+        },
         "side": {
           "type": "\"start\" | \"end\"",
           "default": "start",
           "description": "Places Sidebar on the logical start or end edge and selects the matching logical border."
         },
         "variant": {
-          "type": "SidebarMenuButtonVariant | SidebarWorkspaceVariant | \"default\" | \"supporting-text\"",
+          "type": "SidebarMenuButtonVariant | SidebarWorkspaceVariant | \"default\" | \"supporting-text\" | \"card\"",
           "default": "part-specific",
-          "description": "Selects default/avatar/nested menu rows, action/card workspace headers, or default/supporting-text footers on the part that owns it."
+          "description": "Selects default/avatar/nested menu rows, action/card workspace headers, or default/supporting-text/card footers on the part that owns it. The card footer is an inset bg-subtle block with a body-md name and body-sm role and no avatar or chevron unless passed."
         },
         "active": {
           "type": "boolean",
@@ -4739,19 +5124,28 @@
         "workspace actions",
         "workspace card",
         "default footer",
-        "supporting-text footer"
+        "supporting-text footer",
+        "card footer",
+        "comfortable size"
       ],
       "features": [
         "280px expanded and 48px collapsed shells",
+        "comfortable size with 40px rows, 8px row gap, and body-md labels",
         "controlled collapse",
         "uncontrolled collapse",
         "brand header with search and collapse actions",
+        "text-only brand with a stacked subtitle",
         "workspace action and card headers",
+        "visible collapsed-header expand action",
         "default, avatar, Level 2, and Level 2 line menu rows",
         "supporting text, count badge, and trailing action slots",
-        "group labels with disclosure and icon actions",
+        "group labels with disclosure, icon actions, and a tokenized label color",
         "four-level tree navigation",
-        "supporting-text and bordered user footers",
+        "supporting-text, bordered, and inset card user footers",
+        "divider-free footer",
+        "collapsed footer identity preview on hover and keyboard focus",
+        "tokenized staged expand and collapse motion",
+        "reduced-motion fallback",
         "icon-only rail with tooltips",
         "logical side placement and RTL mirroring"
       ],
@@ -4760,6 +5154,7 @@
         "--bh-bg-default",
         "--bh-bg-default-hover",
         "--bh-bg-neutral-subtle",
+        "--bh-bg-raised",
         "--bh-border-focus",
         "--bh-border-subtle",
         "--bh-border-width-default",
@@ -4779,12 +5174,21 @@
         "--bh-radius-full",
         "--bh-radius-lg-8",
         "--bh-radius-md-6",
+        "--bh-radius-xl-10",
         "--bh-sidebar-active-guide-height",
         "--bh-sidebar-bg",
         "--bh-sidebar-bg-collapsed",
         "--bh-sidebar-border",
         "--bh-sidebar-brand-height",
+        "--bh-sidebar-comfortable-brand-padding",
+        "--bh-sidebar-comfortable-group-label-height",
+        "--bh-sidebar-comfortable-item-gap",
+        "--bh-sidebar-comfortable-item-height",
+        "--bh-sidebar-comfortable-label-padding",
+        "--bh-sidebar-comfortable-padding",
+        "--bh-sidebar-comfortable-section-gap",
         "--bh-sidebar-compact-control-size",
+        "--bh-sidebar-group-label-content",
         "--bh-sidebar-header-action-size",
         "--bh-sidebar-icon-size",
         "--bh-sidebar-icon-size-collapsed",
@@ -4797,16 +5201,26 @@
         "--bh-sidebar-item-height-collapsed",
         "--bh-sidebar-item-padding-x",
         "--bh-sidebar-level-2-indent-width",
+        "--bh-sidebar-min-height",
+        "--bh-sidebar-motion-delay-content",
+        "--bh-sidebar-motion-duration",
+        "--bh-sidebar-motion-duration-content",
+        "--bh-sidebar-motion-easing",
         "--bh-sidebar-padding",
         "--bh-sidebar-rail-width",
         "--bh-sidebar-tree-indent-step",
         "--bh-sidebar-tree-item-height",
+        "--bh-sidebar-user-card-bg",
+        "--bh-sidebar-user-card-bg-hover",
+        "--bh-sidebar-user-preview-gap",
+        "--bh-sidebar-user-preview-height",
+        "--bh-sidebar-user-preview-width",
         "--bh-sidebar-width",
         "--bh-sidebar-width-collapsed",
         "--bh-sidebar-workspace-card-height",
         "--bh-sidebar-workspace-trigger-max-width",
         "--bh-sidebar-workspace-trigger-width",
-        "--bh-space-19xl-384",
+        "--bh-space-10xl-80",
         "--bh-space-3xl-16",
         "--bh-space-4xl-20",
         "--bh-space-5xl-24",
@@ -4814,6 +5228,7 @@
         "--bh-space-8xl-48",
         "--bh-space-lg-10",
         "--bh-space-md-8",
+        "--bh-space-none",
         "--bh-space-sm-6",
         "--bh-space-xl-12",
         "--bh-space-xs-4",
@@ -4827,6 +5242,13 @@
         "--bh-text-body-3xs-semibold-font-weight",
         "--bh-text-body-3xs-semibold-letter-spacing",
         "--bh-text-body-3xs-semibold-line-height",
+        "--bh-text-body-md-medium-font-size",
+        "--bh-text-body-md-medium-font-weight",
+        "--bh-text-body-md-medium-letter-spacing",
+        "--bh-text-body-md-medium-line-height",
+        "--bh-text-body-md-regular-font-size",
+        "--bh-text-body-md-regular-letter-spacing",
+        "--bh-text-body-md-regular-line-height",
         "--bh-text-body-sm-medium-font-size",
         "--bh-text-body-sm-medium-font-weight",
         "--bh-text-body-sm-medium-letter-spacing",
@@ -4844,7 +5266,13 @@
         "--bh-text-body-xs-regular-letter-spacing",
         "--bh-text-body-xs-regular-line-height",
         "--bh-text-body-xs-semibold-font-weight",
-        "--shadow-button-focus"
+        "--bh-text-heading-md-semibold-font-size",
+        "--bh-text-heading-md-semibold-font-weight",
+        "--bh-text-heading-md-semibold-letter-spacing",
+        "--bh-text-heading-md-semibold-line-height",
+        "--bh-z-overlay",
+        "--elevation-button-focus",
+        "--elevation-component-default"
       ],
       "rtl": {
         "inheritsDirection": true,
@@ -4862,39 +5290,159 @@
         "examples/sidebar-demo.tsx"
       ]
     },
-    "navigation-menu": {
-      "description": "Radix NavigationMenu-backed top navigation with trigger, content, link, viewport, and indicator parts.",
+    "app-header": {
+      "description": "Workspace bar above page content with a flexible location region, a search landmark, and flush icon or text actions that keep their design footprint while exposing 40px pointer targets.",
       "dependencies": {
-        "@radix-ui/react-navigation-menu": "^1.2.17",
-        "lucide-react": "^1.17.0"
+        "@radix-ui/react-slot": "^1.2.3"
       },
+      "registryDependencies": [],
       "parts": [
-        "NavigationMenu",
-        "NavigationMenuList",
-        "NavigationMenuItem",
-        "NavigationMenuTrigger",
-        "NavigationMenuContent",
-        "NavigationMenuLink",
-        "NavigationMenuViewport",
-        "NavigationMenuIndicator"
+        "AppHeader",
+        "AppHeaderStart",
+        "AppHeaderEnd",
+        "AppHeaderSearch",
+        "AppHeaderAction"
       ],
       "supportedExports": [
         {
-          "source": "components/navigation-menu.tsx",
+          "source": "components/app-header.tsx",
           "values": [
-            "NavigationMenu",
-            "NavigationMenuContent",
-            "NavigationMenuIndicator",
-            "NavigationMenuItem",
-            "NavigationMenuLink",
-            "NavigationMenuList",
-            "NavigationMenuTrigger",
-            "NavigationMenuViewport"
+            "AppHeader",
+            "AppHeaderAction",
+            "AppHeaderEnd",
+            "AppHeaderSearch",
+            "AppHeaderStart"
           ]
         }
       ],
-      "features": [
-        "top navigation",
+      "props": {
+        "AppHeaderAction.icon": {
+          "type": "ReactNode",
+          "default": null,
+          "description": "Icon content. Without children the action is icon-only and needs aria-label; the icon occupies 24px and the pointer target is 40px."
+        },
+        "AppHeaderAction.size": {
+          "type": "\"sm\" | \"md\"",
+          "default": "md",
+          "description": "md uses body-md medium default content. sm uses body-sm medium subtle content and reserves 32px at the end edge, so a short label such as a language code can change without moving earlier controls."
+        },
+        "AppHeaderAction.asChild": {
+          "type": "boolean",
+          "default": false,
+          "description": "Renders the action styles on the child element, such as a link."
+        },
+        "AppHeaderSearch.role": {
+          "type": "string",
+          "default": "search",
+          "description": "Search landmark role on the wrapping form. Nest an Input with an accessible name; the header sets its width to the 320px search token."
+        }
+      },
+      "defaults": {
+        "sizes": "md"
+      },
+      "sizes": [
+        "md",
+        "sm"
+      ],
+      "features": [
+        "72px bar with 24px inline padding, a 24px item gap, and a subtle bottom border",
+        "flexible start region for Breadcrumbs or a location label in body-sm medium subtle content",
+        "Breadcrumbs inside the header render their current item in the location color",
+        "search landmark that sizes a nested Input to 320px",
+        "flush icon actions with a 24px footprint and a 40px target",
+        "flush text actions in md and sm sizes",
+        "logical layout that mirrors in RTL"
+      ],
+      "recommendedFor": [
+        "The bar above page content in a sidebar workspace, holding the location trail, workspace search, notifications, help, or language",
+        "Product shells that need workspace tools aligned to the page content edge"
+      ],
+      "avoidWhen": [
+        "Page titles, descriptions, and page actions; use Page Header inside the page",
+        "Marketing or public site navigation with menus; use Navigation Menu",
+        "Toolbars that act on a selection or a document; use Toolbar"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Start and End regions, the inline padding, and the reserved width of small text actions use logical properties and mirror with inherited direction.",
+        "semantics": "The root is a header element. AppHeaderSearch is a search landmark. Icon-only actions require aria-label."
+      },
+      "files": [
+        {
+          "source": "components/app-header.tsx",
+          "target": "{{ui}}/app-header.tsx"
+        }
+      ],
+      "examples": [
+        "examples/app-header-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-app-header-action-bg-hover",
+        "--bh-app-header-action-content",
+        "--bh-app-header-action-hit-inset",
+        "--bh-app-header-action-radius",
+        "--bh-app-header-action-sm-content",
+        "--bh-app-header-action-sm-min-width",
+        "--bh-app-header-bg",
+        "--bh-app-header-border",
+        "--bh-app-header-gap",
+        "--bh-app-header-height",
+        "--bh-app-header-icon-size",
+        "--bh-app-header-location-content",
+        "--bh-app-header-padding-x",
+        "--bh-app-header-search-width",
+        "--bh-app-header-start-gap",
+        "--bh-app-header-start-min-width",
+        "--bh-border-width-default",
+        "--bh-breadcrumbs-current-content",
+        "--bh-content-default",
+        "--bh-content-disabled",
+        "--bh-input-width",
+        "--bh-space-xs-4",
+        "--bh-text-body-md-medium-font-size",
+        "--bh-text-body-md-medium-font-weight",
+        "--bh-text-body-md-medium-letter-spacing",
+        "--bh-text-body-md-medium-line-height",
+        "--bh-text-body-sm-medium-font-size",
+        "--bh-text-body-sm-medium-font-weight",
+        "--bh-text-body-sm-medium-letter-spacing",
+        "--bh-text-body-sm-medium-line-height",
+        "--elevation-button-focus"
+      ]
+    },
+    "navigation-menu": {
+      "description": "Radix NavigationMenu-backed top navigation with trigger, content, link, viewport, and indicator parts.",
+      "dependencies": {
+        "@radix-ui/react-navigation-menu": "^1.2.17",
+        "lucide-react": "^1.17.0"
+      },
+      "parts": [
+        "NavigationMenu",
+        "NavigationMenuList",
+        "NavigationMenuItem",
+        "NavigationMenuTrigger",
+        "NavigationMenuContent",
+        "NavigationMenuLink",
+        "NavigationMenuViewport",
+        "NavigationMenuIndicator"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/navigation-menu.tsx",
+          "values": [
+            "NavigationMenu",
+            "NavigationMenuContent",
+            "NavigationMenuIndicator",
+            "NavigationMenuItem",
+            "NavigationMenuLink",
+            "NavigationMenuList",
+            "NavigationMenuTrigger",
+            "NavigationMenuViewport"
+          ]
+        }
+      ],
+      "features": [
+        "top navigation",
         "viewport",
         "indicator",
         "dropdown content"
@@ -4939,7 +5487,7 @@
         "--bh-text-body-sm-regular-line-height",
         "--bh-z-popover",
         "--bh-z-raised",
-        "--shadow-popover"
+        "--elevation-popover"
       ]
     },
     "scroll-area": {
@@ -4986,7 +5534,7 @@
         "--bh-radius-full",
         "--bh-space-lg-10",
         "--bh-space-xxs-2",
-        "--shadow-component-focus-ring"
+        "--elevation-component-focus-ring"
       ]
     },
     "resizable": {
@@ -5039,8 +5587,8 @@
         "--bh-space-5xl-24",
         "--bh-space-6xl-32",
         "--bh-z-raised",
-        "--shadow-button-focus",
-        "--shadow-component-focus-ring"
+        "--elevation-button-focus",
+        "--elevation-component-focus-ring"
       ]
     },
     "autocomplete": {
@@ -5292,10 +5840,10 @@
         "--bh-date-title-chevron-size",
         "--bh-date-title-height",
         "--bh-date-trigger-border",
+        "--bh-date-trigger-elevation",
         "--bh-date-trigger-height",
         "--bh-date-trigger-icon-size",
         "--bh-date-trigger-icon-slot-size",
-        "--bh-date-trigger-shadow",
         "--bh-date-trigger-width",
         "--bh-icon-stroke-180",
         "--bh-interactive-ghost-hover",
@@ -5334,12 +5882,12 @@
         "--bh-text-body-md-regular-letter-spacing",
         "--bh-text-body-md-regular-line-height",
         "--bh-z-raised",
-        "--shadow-button-focus",
-        "--shadow-component-default",
-        "--shadow-date-month-year-list",
-        "--shadow-date-surface",
-        "--shadow-date-time-input",
-        "--shadow-input-focus-ring"
+        "--elevation-button-focus",
+        "--elevation-component-default",
+        "--elevation-date-month-year-list",
+        "--elevation-date-surface",
+        "--elevation-date-time-input",
+        "--elevation-input-focus-ring"
       ]
     },
     "slider": {
@@ -5501,9 +6049,9 @@
         "--bh-z-overlay",
         "--bh-z-popover",
         "--bh-z-raised",
-        "--shadow-slider-thumb",
-        "--shadow-slider-thumb-focus",
-        "--shadow-slider-tooltip"
+        "--elevation-slider-thumb",
+        "--elevation-slider-thumb-focus",
+        "--elevation-slider-tooltip"
       ]
     },
     "progress": {
@@ -5690,7 +6238,7 @@
         "--bh-z-overlay",
         "--bh-z-popover",
         "--bh-z-raised",
-        "--shadow-progress-slider-thumb-focus"
+        "--elevation-progress-slider-thumb-focus"
       ]
     },
     "textarea": {
@@ -5793,8 +6341,8 @@
         "--bh-textarea-tag-avatar-size",
         "--bh-textarea-tag-height",
         "--bh-textarea-width",
-        "--shadow-component-default",
-        "--shadow-textarea"
+        "--elevation-component-default",
+        "--elevation-textarea"
       ]
     },
     "skeleton": {
@@ -5925,7 +6473,7 @@
         "--bh-space-xl-12",
         "--bh-space-xs-4",
         "--bh-text-body-md-regular-line-height",
-        "--shadow-component-default"
+        "--elevation-component-default"
       ]
     },
     "spinner": {
@@ -6063,7 +6611,7 @@
         "--bh-text-body-xs-regular-line-height",
         "--bh-toast-accent",
         "--bh-toast-accent-bg",
-        "--shadow-component-default"
+        "--elevation-component-default"
       ]
     },
     "activity-feed": {
@@ -6157,8 +6705,8 @@
         "--bh-text-body-sm-regular-font-size",
         "--bh-text-body-sm-regular-line-height",
         "--bh-text-body-xs-regular-font-size",
-        "--shadow-button-raised",
-        "--shadow-component-default"
+        "--elevation-button-raised",
+        "--elevation-component-default"
       ]
     },
     "activity-heatmap": {
@@ -6228,7 +6776,7 @@
         "--bh-radius-sm-4",
         "--bh-space-3xl-16",
         "--bh-space-xs-4",
-        "--shadow-component-focus-ring"
+        "--elevation-component-focus-ring"
       ]
     },
     "alert": {
@@ -6240,6 +6788,23 @@
       "registryDependencies": [
         "button"
       ],
+      "props": {
+        "Alert.descriptionColor": {
+          "type": "\"status\" | \"default\"",
+          "default": "status",
+          "description": "status sets the description in the status colour, as in the library; default sets it in content/default, as the ATS360 frames do."
+        },
+        "Alert.icon": {
+          "type": "ReactNode",
+          "default": null,
+          "description": "Replaces the status icon in its 20px slot."
+        },
+        "Alert.isExpandable": {
+          "type": "boolean",
+          "default": false,
+          "description": "Uses the expanded layout when the alert has a description or a visible action; otherwise it stays compact."
+        }
+      },
       "parts": [
         "Alert"
       ],
@@ -6427,7 +6992,7 @@
         "--bh-text-body-md-medium-font-weight",
         "--bh-text-body-md-medium-letter-spacing",
         "--bh-text-body-md-medium-line-height",
-        "--shadow-xl"
+        "--elevation-05"
       ]
     },
     "catalog-components": {
@@ -6543,11 +7108,11 @@
         "--bh-text-heading-xs-semibold-font-size",
         "--bh-text-heading-xs-semibold-font-weight",
         "--bh-text-heading-xs-semibold-line-height",
-        "--shadow-component-default"
+        "--elevation-component-default"
       ]
     },
     "breadcrumbs": {
-      "description": "Expanded breadcrumbs navigation with default, raised, icon, overflow, separator, and RTL variants.",
+      "description": "Expanded breadcrumbs navigation with default, raised, icon, overflow, separator, small, and RTL variants.",
       "status": "expanded",
       "variants": [
         "default",
@@ -6564,9 +7129,14 @@
         "slash",
         "chevron"
       ],
+      "sizes": [
+        "md",
+        "sm"
+      ],
       "rtl": {
         "inheritsDirection": true,
         "layout": "The ordered trail follows inherited inline direction, and chevron separators mirror through :dir(rtl).",
+        "textDirection": "Each label uses dir=\"auto\" so Arabic and Latin crumbs resolve independently and truncate at their content end without changing trail order.",
         "semantics": "The root is a named navigation landmark and the final or explicitly current item exposes aria-current=\"page\"."
       },
       "dependencies": {
@@ -6602,6 +7172,7 @@
         "--bh-bg-raised",
         "--bh-border-focus",
         "--bh-border-subtle",
+        "--bh-breadcrumbs-current-content",
         "--bh-content-default",
         "--bh-content-subtle",
         "--bh-focus-ring-width",
@@ -6625,7 +7196,11 @@
         "--bh-text-base-letter-spacing",
         "--bh-text-body-2xs-regular-line-height",
         "--bh-text-body-md-font-size",
-        "--bh-text-body-md-line-height"
+        "--bh-text-body-md-line-height",
+        "--bh-text-body-sm-medium-font-size",
+        "--bh-text-body-sm-medium-font-weight",
+        "--bh-text-body-sm-medium-letter-spacing",
+        "--bh-text-body-sm-medium-line-height"
       ]
     },
     "file-upload": {
@@ -6772,8 +7347,8 @@
         "--bh-text-body-xs-regular-font-size",
         "--bh-text-body-xs-regular-line-height",
         "--bh-underline-offset-default",
-        "--shadow-component-default",
-        "--shadow-sm"
+        "--elevation-02",
+        "--elevation-component-default"
       ]
     },
     "table": {
@@ -6781,8 +7356,44 @@
       "status": "expanded",
       "sizes": [
         "sm",
-        "lg"
+        "lg",
+        "comfortable"
       ],
+      "defaults": {
+        "sizes": "sm"
+      },
+      "props": {
+        "Table.size": {
+          "type": "\"sm\" | \"lg\" | \"comfortable\"",
+          "default": "sm",
+          "description": "sm and lg are 48px and 56px rows; sm uses body-sm text and lg uses body-md, as in the Table item 1.2 sm and lg cells. comfortable follows Table item 1.2: 44px headers in body-sm medium on the table-header fill, 64px rows with 8px cells and body-md text, no row rules, and a 12px radius."
+        },
+        "TableItem.caption": {
+          "type": "string",
+          "default": null,
+          "description": "Second line under the label on text, avatarText, brandLogoText, payment and image items (Table item 1.2 hasCaption): body-2xs in content/subtle with no gap. Use it in lg or comfortable rows; the two lines fill 40px of a 56px row. Search matches captions; sorting uses the label."
+        },
+        "TableRoot.size": {
+          "type": "\"comfortable\"",
+          "default": null,
+          "description": "Applies the comfortable spec to TableHead and TableCell. Without a size the owned elements stay unstyled."
+        },
+        "TableContainer": {
+          "type": "div",
+          "default": null,
+          "description": "Frame for the owned elements: 12px radius, default background, and a 1px subtle border drawn inside the edge. The table scrolls horizontally inside it."
+        },
+        "TableCellText": {
+          "type": "span",
+          "default": null,
+          "description": "Text content for an owned TableCell: children are the label, caption adds the second line, leading adds an icon or avatar 6px before the text, and tone (default | subtle) and weight (regular | medium) set the label. The label keeps the cell text size; use TableCellLink when it opens a record."
+        },
+        "TableCellLink": {
+          "type": "button",
+          "default": null,
+          "description": "A cell label that opens a record: it keeps the cell text style and colour, sits flush with the cell padding, underlines on hover and focus, and shows the focus ring 2px outside the text. Renders a button, or its child (such as an anchor) with asChild. Use it as the TableCellText label instead of a padded Button."
+        }
+      },
       "states": [
         "default",
         "selected",
@@ -6795,13 +7406,25 @@
         "table",
         "data-table"
       ],
+      "features": [
+        "measured DataTable pagination captions",
+        "explicit DataTable pagination message catalogs",
+        "safe row-key cell fallback",
+        "comfortable size with 44px headers, 64px rows, 8px cells, body-md text, and no row rules",
+        "TableContainer frame with a 12px radius and an inside border",
+        "comfortable size on the owned table elements through TableRoot size",
+        "line + subline cells: an optional caption under text, avatarText, brandLogoText, payment and image items, and TableCellText for the owned elements",
+        "TableCellLink for flush record links in owned cells"
+      ],
       "rtl": {
         "inheritsDirection": true,
         "layout": "Headers, cells, search/filter tools, selection, pagination, and actions inherit direction and use logical alignment.",
+        "textDirection": "Each label and caption in a line + subline cell (avatarText, captioned items and TableCellText) uses dir=\"auto\" to resolve its own content direction, so ellipsis preserves the identifying start without changing the mirrored cell layout.",
         "semantics": "Sortable headers are owned Buttons, selection uses Checkbox, progress cells are named, and row actions expose accessible labels.",
         "narrowContainers": "The toolbar wraps and the table owns local horizontal scrolling instead of overlapping controls or overflowing the page."
       },
       "dependencies": {
+        "@radix-ui/react-slot": "^1.2.3",
         "lucide-react": "^1.17.0"
       },
       "registryDependencies": [
@@ -6820,12 +7443,15 @@
         "Table",
         "DataTable",
         "DataTableSurface",
+        "TableContainer",
         "TableRoot",
         "TableHeader",
         "TableBody",
         "TableRowElement",
         "TableHead",
-        "TableCell"
+        "TableCell",
+        "TableCellText",
+        "TableCellLink"
       ],
       "supportedExports": [
         {
@@ -6841,6 +7467,9 @@
             "DataTableSurface",
             "TableBody",
             "TableCell",
+            "TableCellLink",
+            "TableCellText",
+            "TableContainer",
             "TableHead",
             "TableHeader",
             "TableRoot",
@@ -6890,6 +7519,7 @@
         "--bh-border-default",
         "--bh-border-focus",
         "--bh-border-subtle",
+        "--bh-border-width-default",
         "--bh-content-accent-amber-strong",
         "--bh-content-accent-fuchsia-strong",
         "--bh-content-brand-default",
@@ -6905,6 +7535,8 @@
         "--bh-easing-standard",
         "--bh-focus-ring-width",
         "--bh-font-family",
+        "--bh-font-weight-medium",
+        "--bh-font-weight-regular",
         "--bh-font-weight-semibold",
         "--bh-icon-size-default",
         "--bh-icon-slot-size-default",
@@ -6930,30 +7562,53 @@
         "--bh-space-7xl-40",
         "--bh-space-8xl-48",
         "--bh-space-md-8",
+        "--bh-space-none",
         "--bh-space-sm-6",
         "--bh-space-xl-12",
         "--bh-space-xs-4",
         "--bh-space-xxs-2",
         "--bh-space-xxxs-1",
+        "--bh-table-caption-content",
+        "--bh-table-cell-text-gap",
+        "--bh-table-comfortable-cell-content",
+        "--bh-table-comfortable-cell-padding-x",
+        "--bh-table-comfortable-header-bg",
+        "--bh-table-comfortable-header-content",
+        "--bh-table-comfortable-header-height",
+        "--bh-table-comfortable-min-width",
+        "--bh-table-comfortable-radius",
+        "--bh-table-comfortable-row-height",
+        "--bh-table-container-bg",
+        "--bh-table-container-border",
+        "--bh-table-container-radius",
         "--bh-table-min-width",
         "--bh-table-selection-column-min-width",
         "--bh-text-base-letter-spacing",
         "--bh-text-body-2xs-regular-font-size",
+        "--bh-text-body-2xs-regular-font-weight",
+        "--bh-text-body-2xs-regular-letter-spacing",
         "--bh-text-body-2xs-regular-line-height",
         "--bh-text-body-3xs-regular-font-size",
         "--bh-text-body-3xs-regular-line-height",
         "--bh-text-body-lg-semibold-font-size",
         "--bh-text-body-lg-semibold-font-weight",
         "--bh-text-body-lg-semibold-line-height",
+        "--bh-text-body-md-regular-font-size",
+        "--bh-text-body-md-regular-font-weight",
+        "--bh-text-body-md-regular-letter-spacing",
+        "--bh-text-body-md-regular-line-height",
         "--bh-text-body-md-semibold-font-size",
         "--bh-text-body-md-semibold-font-weight",
         "--bh-text-body-md-semibold-line-height",
+        "--bh-text-body-sm-medium-font-size",
         "--bh-text-body-sm-medium-font-weight",
+        "--bh-text-body-sm-medium-letter-spacing",
+        "--bh-text-body-sm-medium-line-height",
         "--bh-text-body-sm-regular-font-size",
         "--bh-text-body-sm-regular-font-weight",
         "--bh-text-body-sm-regular-line-height",
         "--bh-text-body-xs-regular-font-size",
-        "--shadow-component-focus-ring"
+        "--elevation-component-focus-ring"
       ]
     },
     "empty-state": {
@@ -7104,12 +7759,46 @@
         "--bh-text-body-md-medium-font-weight",
         "--bh-text-body-md-medium-letter-spacing",
         "--bh-text-body-md-medium-line-height",
-        "--shadow-component-default"
+        "--elevation-component-default"
       ]
     },
     "page-header": {
-      "description": "Expanded page header composition with breadcrumbs, metadata, description copy, action groups, responsive layout, and optional local tabs.",
+      "description": "Expanded page header composition with breadcrumbs, metadata, description copy, action groups, responsive layout, and content-safe scrollable local tabs.",
       "status": "expanded",
+      "sizes": [
+        "default",
+        "comfortable"
+      ],
+      "defaults": {
+        "sizes": "default"
+      },
+      "props": {
+        "PageHeader.size": {
+          "type": "\"default\" | \"comfortable\"",
+          "default": "default",
+          "description": "comfortable is the page heading inside an app shell whose header carries the breadcrumbs: no block padding, 8px between title and description, 24px between copy and actions, 12px between actions, 40px action Buttons with a 160px minimum width (176px for primary), and no icon or tabs unless passed."
+        },
+        "PageHeader.actions": {
+          "type": "PageHeaderAction[] | ReactNode | false",
+          "default": "[]",
+          "description": "Action data renders secondary Buttons at the header density; pass your own nodes for primary actions or other controls."
+        },
+        "PageHeader.description": {
+          "type": "ReactNode",
+          "default": null,
+          "description": "Inline description content under the title, in body-md and content/subtle."
+        },
+        "PageHeader.children": {
+          "type": "ReactNode",
+          "default": null,
+          "description": "Supporting content under the description, such as status badges, in a wrapping row with 8px gaps."
+        },
+        "PageHeader.title": {
+          "type": "ReactNode",
+          "default": null,
+          "description": "Heading content in heading-md semibold (24/28); inline content such as a record name and its type is allowed."
+        }
+      },
       "states": [
         "default",
         "without-icon",
@@ -7123,10 +7812,19 @@
         "actions",
         "tabs"
       ],
+      "features": [
+        "Breadcrumb-owned icon-slot visibility",
+        "Button-owned default-density secondary action styling",
+        "content-safe horizontal tab overflow",
+        "full-width tab opt-out",
+        "comfortable size for app-shell page headings",
+        "custom action nodes and rich descriptions"
+      ],
       "rtl": {
         "inheritsDirection": true,
-        "layout": "Heading, metadata, owned Breadcrumbs, Button actions, and Tabs mirror through inherited direction and logical spacing.",
-        "semantics": "Every tab trigger owns a matching panel, and breadcrumb navigation receives a stable accessible label."
+        "layout": "Heading, metadata, owned Breadcrumbs, Button actions, and content-safe scrolling Tabs mirror through inherited direction and logical spacing.",
+        "textDirection": "Title and description use dir=\"auto\" so Arabic and Latin copy resolve independently and terminal punctuation stays at the content end.",
+        "semantics": "Every complete tab label remains available inside its trigger, every trigger owns a matching panel, and breadcrumb navigation receives a stable accessible label."
       },
       "dependencies": {
         "lucide-react": "^1.17.0"
@@ -7161,30 +7859,26 @@
         "examples/expanded/page-header-demo.tsx"
       ],
       "tokens": [
-        "--bh-bg-raised",
-        "--bh-border-default",
+        "--bh-button-label-padding-x",
         "--bh-content-brand-default",
         "--bh-content-default",
         "--bh-content-muted",
         "--bh-content-subtle",
-        "--bh-control-default",
         "--bh-focus-ring-width",
         "--bh-font-family",
         "--bh-icon-stroke-190",
-        "--bh-interactive-secondary-default",
-        "--bh-opacity-muted",
+        "--bh-page-header-comfortable-action-min-width",
+        "--bh-page-header-comfortable-primary-action-min-width",
         "--bh-space-2xl-14",
         "--bh-space-3xl-16",
         "--bh-space-4xl-20",
         "--bh-space-5xl-24",
-        "--bh-space-6xl-32",
         "--bh-space-7xl-40",
         "--bh-space-lg-10",
         "--bh-space-md-8",
         "--bh-space-xl-12",
         "--bh-space-xs-4",
         "--bh-space-xxs-2",
-        "--bh-space-xxxs-1",
         "--bh-text-body-2xs-regular-font-size",
         "--bh-text-body-2xs-regular-font-weight",
         "--bh-text-body-2xs-regular-line-height",
@@ -7197,8 +7891,7 @@
         "--bh-text-body-md-regular-line-height",
         "--bh-text-heading-md-semibold-font-size",
         "--bh-text-heading-md-semibold-font-weight",
-        "--bh-text-heading-md-semibold-line-height",
-        "--shadow-button-secondary"
+        "--bh-text-heading-md-semibold-line-height"
       ]
     },
     "slideout": {
@@ -7308,9 +8001,9 @@
         "--bh-text-heading-sm-medium-line-height",
         "--bh-text-heading-xs-medium-font-size",
         "--bh-text-heading-xs-medium-line-height",
-        "--shadow-button-raised",
-        "--shadow-button-soft",
-        "--shadow-component-default"
+        "--elevation-button-raised",
+        "--elevation-button-soft",
+        "--elevation-component-default"
       ]
     },
     "steps": {
@@ -7447,20 +8140,24 @@
       "sizes": [
         "md",
         "sm",
-        "xs"
+        "xs",
+        "comfortable"
       ],
       "features": [
         "Radix keyboard behavior",
         "controlled active index",
         "controlled value",
         "optional panels",
-        "full-width tabs"
+        "content-hug tabs",
+        "content-safe full-width tabs",
+        "horizontal overflow without label overlap",
+        "comfortable view-navigation size: 48px underline tabs 8px apart, inset indicator, no divider"
       ],
       "rtl": {
         "inheritsDirection": true,
         "keyboard": "Radix receives dir so arrow-key navigation follows the document direction.",
         "textDirection": "Trigger labels use dir=\"auto\" by default for Arabic and English tab labels.",
-        "spacing": "Uses inherited direction and logical inline spacing so underline, segmented, and rounded treatments mirror naturally."
+        "spacing": "Uses inherited direction and logical inline spacing so underline, segmented, and rounded treatments mirror naturally, including horizontal overflow."
       },
       "files": [
         {
@@ -7503,7 +8200,7 @@
         "--bh-text-body-md-regular-font-weight",
         "--bh-text-body-md-regular-letter-spacing",
         "--bh-text-body-md-regular-line-height",
-        "--shadow-button-soft"
+        "--elevation-button-soft"
       ]
     },
     "timeline": {
@@ -7591,7 +8288,928 @@
         "--bh-timeline-grid-width",
         "--bh-timeline-narrow-width",
         "--bh-timeline-sidebar-width",
-        "--shadow-component-focus-ring"
+        "--elevation-component-focus-ring"
+      ]
+    },
+    "shimmer-text": {
+      "description": "Text with a soft brightness valley sweeping through it in reading direction, for labels of work in progress such as syncing, reading, or thinking.",
+      "dependencies": {},
+      "parts": [
+        "ShimmerText"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/shimmer-text.tsx",
+          "values": [
+            "ShimmerText"
+          ]
+        }
+      ],
+      "props": {
+        "animated": {
+          "type": "boolean",
+          "default": "true",
+          "description": "Runs the brightness sweep; set false to keep the same colors without motion."
+        },
+        "tone": {
+          "type": "\"subtle\" | \"default\"",
+          "default": "subtle",
+          "description": "Secondary or primary text color pair for the sweep."
+        }
+      },
+      "tones": [
+        "subtle",
+        "default"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "motion": "The shine sweeps from the reading start to the reading end, so RTL text uses mirrored keyframes."
+      },
+      "files": [
+        {
+          "source": "components/shimmer-text.css",
+          "target": "{{ui}}/shimmer-text.css"
+        },
+        {
+          "source": "components/shimmer-text.tsx",
+          "target": "{{ui}}/shimmer-text.tsx"
+        }
+      ],
+      "examples": [
+        "examples/shimmer-text-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-content-default",
+        "--bh-content-disabled",
+        "--bh-content-subtle",
+        "--bh-easing-standard",
+        "--bh-shimmer-text-duration"
+      ]
+    },
+    "thinking-state": {
+      "description": "Minimal shimmering status label that signals an agent is working before its first token arrives.",
+      "dependencies": {},
+      "registryDependencies": [
+        "shimmer-text"
+      ],
+      "parts": [
+        "ThinkingState"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/thinking-state.tsx",
+          "values": [
+            "ThinkingState"
+          ]
+        }
+      ],
+      "props": {
+        "status": {
+          "type": "\"thinking\" | \"done\"",
+          "default": "thinking",
+          "description": "Thinking runs the brightness sweep; done leaves the label as static text."
+        },
+        "tone": {
+          "type": "\"subtle\" | \"default\"",
+          "default": "subtle",
+          "description": "Secondary or primary text color pair for the sweep."
+        },
+        "children": {
+          "type": "React.ReactNode",
+          "default": "\"Thinking\"",
+          "description": "Localized label text."
+        }
+      },
+      "tones": [
+        "subtle",
+        "default"
+      ],
+      "states": [
+        "thinking",
+        "done"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "motion": "The shine sweeps from the reading start to the reading end, so RTL text uses mirrored keyframes."
+      },
+      "files": [
+        {
+          "source": "components/thinking-state.css",
+          "target": "{{ui}}/thinking-state.css"
+        },
+        {
+          "source": "components/thinking-state.tsx",
+          "target": "{{ui}}/thinking-state.tsx"
+        }
+      ],
+      "examples": [
+        "examples/thinking-state-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-content-subtle",
+        "--bh-font-family",
+        "--bh-text-body-xs-medium-font-size",
+        "--bh-text-body-xs-medium-font-weight",
+        "--bh-text-body-xs-medium-letter-spacing",
+        "--bh-text-body-xs-medium-line-height"
+      ]
+    },
+    "thinking-reasoning": {
+      "description": "Animated, collapsible reasoning block: a shimmering label reveals sentences as they arrive, auto-scrolls behind soft fades, then folds into a Thought for Ns summary that unfolds on demand.",
+      "dependencies": {
+        "lucide-react": "^1.17.0"
+      },
+      "registryDependencies": [
+        "collapsible",
+        "shimmer-text"
+      ],
+      "parts": [
+        "ThinkingReasoning"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/thinking-reasoning.tsx",
+          "values": [
+            "ThinkingReasoning"
+          ]
+        }
+      ],
+      "props": {
+        "steps": {
+          "type": "readonly string[]",
+          "default": null,
+          "description": "Reasoning sentences in arrival order; append to stream new ones."
+        },
+        "status": {
+          "type": "\"thinking\" | \"done\"",
+          "default": "thinking",
+          "description": "Thinking keeps the block open and auto-scrolling; done folds it into the summary."
+        },
+        "duration": {
+          "type": "number",
+          "default": "measured",
+          "description": "Seconds shown in the summary; measured from mount when omitted."
+        },
+        "open": {
+          "type": "boolean",
+          "default": "false",
+          "description": "Controls whether the finished reasoning is unfolded."
+        },
+        "reserveSpace": {
+          "type": "boolean",
+          "default": "false",
+          "description": "Keeps the block height stable while folding so content below does not jump."
+        },
+        "labels": {
+          "type": "Partial<ThinkingReasoningLabels>",
+          "default": "English",
+          "description": "Localized thinking, thought, and duration copy; the finished summary also names the toggle."
+        }
+      },
+      "states": [
+        "thinking",
+        "done",
+        "open",
+        "closed"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Header, chevron, and sentences use logical alignment; the vertical auto-scroll and fades are direction-neutral."
+      },
+      "files": [
+        {
+          "source": "components/thinking-reasoning.css",
+          "target": "{{ui}}/thinking-reasoning.css"
+        },
+        {
+          "source": "components/thinking-reasoning.tsx",
+          "target": "{{ui}}/thinking-reasoning.tsx"
+        }
+      ],
+      "examples": [
+        "examples/thinking-reasoning-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-content-muted",
+        "--bh-content-subtle",
+        "--bh-duration-fast",
+        "--bh-duration-moderate",
+        "--bh-duration-slow",
+        "--bh-duration-slower",
+        "--bh-easing-emphasized",
+        "--bh-easing-standard",
+        "--bh-font-family",
+        "--bh-icon-stroke-180",
+        "--bh-opacity-0",
+        "--bh-opacity-100",
+        "--bh-radius-sm-4",
+        "--bh-space-sm-6",
+        "--bh-space-xl-12",
+        "--bh-space-xs-4",
+        "--bh-text-body-xs-medium-font-size",
+        "--bh-text-body-xs-medium-font-weight",
+        "--bh-text-body-xs-medium-letter-spacing",
+        "--bh-text-body-xs-medium-line-height",
+        "--bh-text-body-xs-regular-font-size",
+        "--bh-text-body-xs-regular-font-weight",
+        "--bh-text-body-xs-regular-letter-spacing",
+        "--bh-text-body-xs-regular-line-height",
+        "--bh-thinking-reasoning-fade",
+        "--bh-thinking-reasoning-max-height",
+        "--bh-thinking-reasoning-width",
+        "--elevation-component-focus-ring"
+      ]
+    },
+    "streaming-text": {
+      "description": "Token-by-token text with a slim caret that stays solid while streaming and blinks once the response is complete, plus a useTypewriter hook that reveals a finished text locally.",
+      "dependencies": {},
+      "parts": [
+        "StreamingText"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/streaming-text.tsx",
+          "values": [
+            "StreamingText",
+            "useTypewriter"
+          ]
+        }
+      ],
+      "props": {
+        "text": {
+          "type": "string",
+          "default": null,
+          "description": "The text that has arrived so far."
+        },
+        "streaming": {
+          "type": "boolean",
+          "default": "false",
+          "description": "True while more text is on its way; keeps the caret solid and sets aria-busy."
+        },
+        "caret": {
+          "type": "boolean",
+          "default": "true",
+          "description": "Shows the caret after the visible text."
+        },
+        "as": {
+          "type": "\"p\" | \"div\" | \"span\"",
+          "default": "p",
+          "description": "Rendered element; the ref is an HTMLElement for all three."
+        },
+        "speed": {
+          "type": "number",
+          "default": "220",
+          "description": "useTypewriter option: characters revealed per second."
+        }
+      },
+      "states": [
+        "streaming",
+        "complete"
+      ],
+      "features": [
+        "caller-driven streaming",
+        "local typewriter reveal",
+        "reduced motion",
+        "RTL"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "The caret follows the text through logical margins, so it trails Arabic text at its end edge."
+      },
+      "files": [
+        {
+          "source": "components/streaming-text.css",
+          "target": "{{ui}}/streaming-text.css"
+        },
+        {
+          "source": "components/streaming-text.tsx",
+          "target": "{{ui}}/streaming-text.tsx"
+        }
+      ],
+      "examples": [
+        "examples/streaming-text-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-content-default",
+        "--bh-font-family",
+        "--bh-opacity-0",
+        "--bh-opacity-100",
+        "--bh-radius-full",
+        "--bh-space-xxs-2",
+        "--bh-streaming-text-caret-duration",
+        "--bh-streaming-text-caret-width",
+        "--bh-text-body-sm-regular-font-size",
+        "--bh-text-body-sm-regular-font-weight",
+        "--bh-text-body-sm-regular-letter-spacing",
+        "--bh-text-body-sm-regular-line-height"
+      ]
+    },
+    "inline-citations": {
+      "description": "Prose composed with superscript citation marks that link to numbered sources and reveal the reference name on hover, plus a compact source list with host and external-link affordance.",
+      "dependencies": {
+        "lucide-react": "^1.17.0"
+      },
+      "registryDependencies": [
+        "tooltip"
+      ],
+      "parts": [
+        "InlineCitations",
+        "CitationProse",
+        "CitationMark",
+        "CitationList",
+        "CitationItem"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/inline-citations.tsx",
+          "values": [
+            "CitationItem",
+            "CitationList",
+            "CitationMark",
+            "CitationProse",
+            "InlineCitations"
+          ]
+        }
+      ],
+      "props": {
+        "children": {
+          "type": "React.ReactNode",
+          "default": null,
+          "description": "Cited prose: CitationProse paragraphs with CitationMark markers that find their source by number."
+        },
+        "sources": {
+          "type": "readonly CitationSource[]",
+          "default": null,
+          "description": "Cited sources with label, url, optional host, and optional marker number. Only http and https URLs become links."
+        },
+        "showSources": {
+          "type": "boolean",
+          "default": "true",
+          "description": "Renders the compact source list under the prose when there are sources."
+        },
+        "labels": {
+          "type": "Partial<InlineCitationsLabels>",
+          "default": "English",
+          "description": "Localized accessible names for markers and the source list."
+        }
+      },
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Chips and list rows use logical margins and gaps; hosts stay LTR and the external arrow mirrors."
+      },
+      "files": [
+        {
+          "source": "components/inline-citations.css",
+          "target": "{{ui}}/inline-citations.css"
+        },
+        {
+          "source": "components/inline-citations.tsx",
+          "target": "{{ui}}/inline-citations.tsx"
+        }
+      ],
+      "examples": [
+        "examples/inline-citations-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-border-subtle",
+        "--bh-border-width-default",
+        "--bh-citation-mark-size",
+        "--bh-content-default",
+        "--bh-content-subtle",
+        "--bh-duration-default",
+        "--bh-duration-fast",
+        "--bh-easing-standard",
+        "--bh-font-family",
+        "--bh-icon-stroke-180",
+        "--bh-interactive-soft-default",
+        "--bh-interactive-soft-hover",
+        "--bh-opacity-0",
+        "--bh-opacity-100",
+        "--bh-radius-sm-4",
+        "--bh-space-lg-10",
+        "--bh-space-sm-6",
+        "--bh-space-xl-12",
+        "--bh-space-xxs-2",
+        "--bh-space-xxxs-1",
+        "--bh-text-body-2xs-regular-font-size",
+        "--bh-text-body-2xs-regular-font-weight",
+        "--bh-text-body-2xs-regular-letter-spacing",
+        "--bh-text-body-2xs-regular-line-height",
+        "--bh-text-body-3xs-semibold-font-size",
+        "--bh-text-body-3xs-semibold-font-weight",
+        "--bh-text-body-3xs-semibold-letter-spacing",
+        "--bh-text-body-sm-regular-font-size",
+        "--bh-text-body-sm-regular-font-weight",
+        "--bh-text-body-sm-regular-letter-spacing",
+        "--bh-text-body-sm-regular-line-height",
+        "--elevation-component-focus-ring"
+      ]
+    },
+    "rolling-count": {
+      "description": "Tabular figures that roll each changed character into place like an odometer while assistive technology reads the plain value.",
+      "dependencies": {},
+      "parts": [
+        "RollingCount"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/rolling-count.tsx",
+          "values": [
+            "RollingCount"
+          ]
+        }
+      ],
+      "props": {
+        "value": {
+          "type": "string",
+          "default": null,
+          "description": "Text to show; each changed character rolls up or down into place."
+        },
+        "aria-label": {
+          "type": "string",
+          "default": null,
+          "description": "What assistive technology reads instead of the value, for example 2 of 5 done."
+        },
+        "dir": {
+          "type": "\"ltr\" | \"rtl\"",
+          "default": "ltr",
+          "description": "Glyph order. Stays left-to-right by default so values like 2/5 keep their order inside RTL copy."
+        }
+      },
+      "rtl": {
+        "inheritsDirection": false,
+        "layout": "Digits keep left-to-right order inside RTL copy so separators such as 2/5 stay in reading order."
+      },
+      "files": [
+        {
+          "source": "components/rolling-count.css",
+          "target": "{{ui}}/rolling-count.css"
+        },
+        {
+          "source": "components/rolling-count.tsx",
+          "target": "{{ui}}/rolling-count.tsx"
+        }
+      ],
+      "examples": [
+        "examples/rolling-count-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-duration-slow",
+        "--bh-easing-standard"
+      ]
+    },
+    "task-list": {
+      "description": "Collapsible agent progress tracker with pending, active, and done rows, a header icon that moves from list to pie to check, and rolling counters, plus parts that compose static and folded lists.",
+      "dependencies": {
+        "lucide-react": "^1.17.0"
+      },
+      "registryDependencies": [
+        "collapsible",
+        "rolling-count",
+        "shimmer-text"
+      ],
+      "parts": [
+        "TaskList",
+        "TaskListRoot",
+        "TaskListHeader",
+        "TaskListItems",
+        "TaskListPreview"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/task-list.tsx",
+          "values": [
+            "TaskList",
+            "TaskListHeader",
+            "TaskListItems",
+            "TaskListPreview",
+            "TaskListRoot"
+          ]
+        }
+      ],
+      "props": {
+        "items": {
+          "type": "readonly TaskListItem[]",
+          "default": null,
+          "description": "Rows with id, label, and pending, active, or done status."
+        },
+        "surface": {
+          "type": "\"card\" | \"well\" | \"plain\"",
+          "default": "card",
+          "description": "Raised card, subtle well for embedding, or no surface."
+        },
+        "labels": {
+          "type": "Partial<TaskListLabels>",
+          "default": "English",
+          "description": "Localized counter copy, read after the title in the toggle's name."
+        },
+        "visibleCount": {
+          "type": "number",
+          "default": "3",
+          "description": "TaskListPreview: rows shown before the rest fold behind a more control."
+        }
+      },
+      "states": [
+        "pending",
+        "active",
+        "done"
+      ],
+      "variants": [
+        "card",
+        "well",
+        "plain"
+      ],
+      "features": [
+        "controlled state",
+        "uncontrolled state",
+        "composable parts",
+        "preview fold",
+        "reduced motion",
+        "RTL"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Rows, counters, and the collapse chevron use logical placement; the active arrow icon mirrors."
+      },
+      "files": [
+        {
+          "source": "components/task-list.css",
+          "target": "{{ui}}/task-list.css"
+        },
+        {
+          "source": "components/task-list.tsx",
+          "target": "{{ui}}/task-list.tsx"
+        }
+      ],
+      "examples": [
+        "examples/task-list-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-bg-raised",
+        "--bh-bg-subtle",
+        "--bh-content-default",
+        "--bh-content-subtle",
+        "--bh-content-success-default",
+        "--bh-duration-default",
+        "--bh-duration-fast",
+        "--bh-duration-moderate",
+        "--bh-duration-slow",
+        "--bh-easing-standard",
+        "--bh-font-family",
+        "--bh-icon-stroke-180",
+        "--bh-icon-stroke-200",
+        "--bh-opacity-0",
+        "--bh-opacity-100",
+        "--bh-radius-2xl-12",
+        "--bh-radius-full",
+        "--bh-radius-lg-8",
+        "--bh-radius-sm-4",
+        "--bh-space-4xl-20",
+        "--bh-space-lg-10",
+        "--bh-space-md-8",
+        "--bh-space-sm-6",
+        "--bh-space-xl-12",
+        "--bh-space-xs-4",
+        "--bh-space-xxs-2",
+        "--bh-space-xxxs-1",
+        "--bh-task-list-icon-size",
+        "--bh-task-list-stagger",
+        "--bh-text-body-xs-medium-font-weight",
+        "--bh-text-body-xs-regular-font-size",
+        "--bh-text-body-xs-regular-font-weight",
+        "--bh-text-body-xs-regular-letter-spacing",
+        "--bh-text-body-xs-regular-line-height",
+        "--elevation-02",
+        "--elevation-component-focus-ring"
+      ]
+    },
+    "agent-input": {
+      "description": "Composable AI prompt field with an auto-growing editor, slash-command skill palette, skill and attachment chips, an add menu for files, skills, and models, prompt enhancement with a sweeping ring, and a send action.",
+      "dependencies": {
+        "lucide-react": "^1.17.0"
+      },
+      "registryDependencies": [
+        "button",
+        "menu",
+        "shimmer-text",
+        "spinner",
+        "tag"
+      ],
+      "parts": [
+        "AgentInput"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/agent-input.tsx",
+          "values": [
+            "AgentInput"
+          ]
+        }
+      ],
+      "props": {
+        "value": {
+          "type": "string",
+          "default": null,
+          "description": "Controlled prompt text; use defaultValue for uncontrolled usage."
+        },
+        "onSend": {
+          "type": "(payload: AgentInputPayload) => void",
+          "default": null,
+          "description": "Receives text, attachments, skills, and the selected model; picked attachments carry their File for upload."
+        },
+        "onEnhance": {
+          "type": "(prompt: string, signal: AbortSignal) => Promise<string>",
+          "default": null,
+          "description": "Enables the Enhance Prompt action; resolves to the rewritten prompt."
+        },
+        "models": {
+          "type": "readonly AgentInputModel[]",
+          "default": "[]",
+          "description": "Selectable models with name, description, meta, and icon."
+        },
+        "skills": {
+          "type": "readonly AgentInputSkill[]",
+          "default": "[]",
+          "description": "Skills available from the add menu and the slash palette."
+        },
+        "attachments": {
+          "type": "readonly AgentInputAttachment[]",
+          "default": null,
+          "description": "Controlled attachment chips; omit to let the field own picked files."
+        },
+        "onAttachmentsChange": {
+          "type": "(attachments: AgentInputAttachment[]) => void",
+          "default": null,
+          "description": "Called when chips are added or removed; picked files arrive with their File, so uploads can start right away."
+        },
+        "labels": {
+          "type": "Partial<AgentInputLabels>",
+          "default": "English",
+          "description": "Localized placeholder, menu, action, and remove copy."
+        }
+      },
+      "states": [
+        "idle",
+        "enhancing",
+        "enhanced"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "The editor, chips, palette, and action row use logical spacing; the add menu and slash palette open toward the logical start."
+      },
+      "files": [
+        {
+          "source": "components/agent-input.css",
+          "target": "{{ui}}/agent-input.css"
+        },
+        {
+          "source": "components/agent-input.tsx",
+          "target": "{{ui}}/agent-input.tsx"
+        },
+        {
+          "source": "components/agent-input-parts.tsx",
+          "target": "{{ui}}/agent-input-parts.tsx",
+          "internal": true
+        },
+        {
+          "source": "components/agent-input-state.ts",
+          "target": "{{ui}}/agent-input-state.ts",
+          "internal": true
+        }
+      ],
+      "examples": [
+        "examples/agent-input-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-agent-input-field-max-height",
+        "--bh-agent-input-palette-width",
+        "--bh-agent-input-ring-duration",
+        "--bh-agent-input-ring-width",
+        "--bh-bg-raised",
+        "--bh-button-xs-height",
+        "--bh-content-accent-aqua-default",
+        "--bh-content-accent-blue-default",
+        "--bh-content-accent-fuchsia-default",
+        "--bh-content-accent-purple-default",
+        "--bh-content-default",
+        "--bh-content-disabled",
+        "--bh-content-muted",
+        "--bh-content-subtle",
+        "--bh-duration-default",
+        "--bh-duration-moderate",
+        "--bh-easing-emphasized",
+        "--bh-font-family",
+        "--bh-menu-bg",
+        "--bh-menu-item-hover-bg",
+        "--bh-menu-item-radius",
+        "--bh-menu-radius",
+        "--bh-opacity-0",
+        "--bh-opacity-100",
+        "--bh-radius-2xl-12",
+        "--bh-space-2xl-14",
+        "--bh-space-6xl-32",
+        "--bh-space-lg-10",
+        "--bh-space-md-8",
+        "--bh-space-sm-6",
+        "--bh-space-xl-12",
+        "--bh-space-xs-4",
+        "--bh-space-xxs-2",
+        "--bh-text-body-2xs-regular-font-size",
+        "--bh-text-body-2xs-regular-font-weight",
+        "--bh-text-body-2xs-regular-line-height",
+        "--bh-text-body-sm-regular-font-size",
+        "--bh-text-body-sm-regular-font-weight",
+        "--bh-text-body-sm-regular-letter-spacing",
+        "--bh-text-body-sm-regular-line-height",
+        "--bh-text-body-xs-regular-font-size",
+        "--bh-text-body-xs-regular-font-weight",
+        "--bh-text-body-xs-regular-letter-spacing",
+        "--bh-text-body-xs-regular-line-height",
+        "--bh-z-popover",
+        "--elevation-02",
+        "--elevation-menu"
+      ]
+    },
+    "approval-card": {
+      "description": "Human-in-the-loop decision cards that pause the agent: ApprovalQuestions for up to a few questions, ApprovalCommand to approve a shell command, and ApprovalPlan to green-light a short plan with an optional auto-approve countdown, all built on the ApprovalFrame shell for custom decisions.",
+      "dependencies": {
+        "lucide-react": "^1.17.0"
+      },
+      "registryDependencies": [
+        "button",
+        "kbd",
+        "rolling-count",
+        "task-list",
+        "tooltip"
+      ],
+      "parts": [
+        "ApprovalQuestions",
+        "ApprovalCommand",
+        "ApprovalPlan",
+        "ApprovalFrame"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/approval-card.tsx",
+          "values": [
+            "ApprovalCommand",
+            "ApprovalFrame",
+            "ApprovalPlan",
+            "ApprovalQuestions"
+          ]
+        }
+      ],
+      "props": {
+        "questions": {
+          "type": "readonly ApprovalQuestion[]",
+          "default": null,
+          "description": "ApprovalQuestions: single-choice questions, each with a free-text Something else option."
+        },
+        "command": {
+          "type": "string",
+          "default": null,
+          "description": "ApprovalCommand: shell command shown in the mono block."
+        },
+        "cwd": {
+          "type": "string",
+          "default": null,
+          "description": "ApprovalCommand: working directory shown above the command."
+        },
+        "plan": {
+          "type": "readonly ApprovalPlanStep[]",
+          "default": null,
+          "description": "ApprovalPlan: steps with an id and a title, rendered as a pending to-do list. Step details belong in the full plan."
+        },
+        "planPreviewCount": {
+          "type": "number",
+          "default": "3",
+          "description": "ApprovalPlan: steps shown before the more fold."
+        },
+        "autoApproveSeconds": {
+          "type": "number",
+          "default": "0",
+          "description": "ApprovalPlan: opt-in countdown; at zero onApprove fires with source timeout. Either action cancels it. A new value restarts it."
+        },
+        "icon": {
+          "type": "React.ReactNode",
+          "default": null,
+          "description": "ApprovalFrame: header glyph, sized and stroked by the tinted icon tile."
+        },
+        "tone": {
+          "type": "\"info\" | \"warning\" | \"success\"",
+          "default": null,
+          "description": "ApprovalFrame: tint of the icon tile. Questions use info, commands warning, and plans success."
+        },
+        "onApprove": {
+          "type": "callback",
+          "default": null,
+          "description": "Primary action. ApprovalQuestions passes { answers }, ApprovalPlan passes { source: user | timeout }, and ApprovalCommand passes nothing."
+        },
+        "onReject": {
+          "type": "() => void",
+          "default": null,
+          "description": "Skip action on ApprovalQuestions and ApprovalCommand."
+        },
+        "onViewPlan": {
+          "type": "() => void",
+          "default": null,
+          "description": "ApprovalPlan secondary action that opens the full plan; it also stops the countdown."
+        },
+        "labels": {
+          "type": "Partial<ApprovalQuestionsLabels> | Partial<ApprovalPlanLabels>",
+          "default": "English",
+          "description": "Localized navigation, countdown, and helper copy for the card that uses them."
+        }
+      },
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Header, options, and actions use logical alignment; the command block and paths stay LTR while the submit arrow mirrors."
+      },
+      "files": [
+        {
+          "source": "components/approval-card.css",
+          "target": "{{ui}}/approval-card.css"
+        },
+        {
+          "source": "components/approval-card.tsx",
+          "target": "{{ui}}/approval-card.tsx"
+        },
+        {
+          "source": "components/approval-frame.tsx",
+          "target": "{{ui}}/approval-frame.tsx",
+          "internal": true
+        },
+        {
+          "source": "components/approval-questions.tsx",
+          "target": "{{ui}}/approval-questions.tsx",
+          "internal": true
+        }
+      ],
+      "examples": [
+        "examples/approval-card-demo.tsx"
+      ],
+      "tokens": [
+        "--bh-bg-info-subtle",
+        "--bh-bg-inverse",
+        "--bh-bg-raised",
+        "--bh-bg-subtle",
+        "--bh-bg-success-subtle",
+        "--bh-bg-warning-subtle",
+        "--bh-border-subtle",
+        "--bh-border-success-subtle",
+        "--bh-border-width-default",
+        "--bh-content-default",
+        "--bh-content-information-default",
+        "--bh-content-inverse",
+        "--bh-content-muted",
+        "--bh-content-subtle",
+        "--bh-content-success-default",
+        "--bh-content-warning-default",
+        "--bh-duration-default",
+        "--bh-duration-fast",
+        "--bh-duration-moderate",
+        "--bh-duration-slow",
+        "--bh-easing-emphasized",
+        "--bh-easing-standard",
+        "--bh-font-family",
+        "--bh-font-family-mono",
+        "--bh-icon-stroke-180",
+        "--bh-icon-stroke-200",
+        "--bh-icon-stroke-250",
+        "--bh-opacity-0",
+        "--bh-opacity-100",
+        "--bh-radius-2xl-12",
+        "--bh-radius-full",
+        "--bh-radius-lg-8",
+        "--bh-radius-md-6",
+        "--bh-space-2xl-14",
+        "--bh-space-3xl-16",
+        "--bh-space-5xl-24",
+        "--bh-space-6xl-32",
+        "--bh-space-lg-10",
+        "--bh-space-md-8",
+        "--bh-space-sm-6",
+        "--bh-space-xl-12",
+        "--bh-space-xs-4",
+        "--bh-space-xxs-2",
+        "--bh-space-xxxs-1",
+        "--bh-text-body-2xs-medium-font-size",
+        "--bh-text-body-2xs-medium-font-weight",
+        "--bh-text-body-2xs-regular-font-size",
+        "--bh-text-body-2xs-regular-line-height",
+        "--bh-text-body-3xs-regular-font-size",
+        "--bh-text-body-3xs-regular-line-height",
+        "--bh-text-body-md-medium-font-size",
+        "--bh-text-body-md-medium-font-weight",
+        "--bh-text-body-md-medium-letter-spacing",
+        "--bh-text-body-md-medium-line-height",
+        "--bh-text-body-xs-medium-font-weight",
+        "--bh-text-body-xs-regular-font-size",
+        "--bh-text-body-xs-regular-font-weight",
+        "--bh-text-body-xs-regular-letter-spacing",
+        "--bh-text-body-xs-regular-line-height",
+        "--elevation-02",
+        "--elevation-component-focus-ring"
       ]
     }
   }