banhaten 0.2.0 → 0.4.0

package/registry/index.json

@@ -278,6 +278,7 @@
         "--bh-avatar-icon-size-sm",
         "--bh-avatar-icon-size-xl",
         "--bh-avatar-icon-size-xs",
+        "--bh-avatar-icon-slot-size",
         "--bh-avatar-radius",
         "--bh-avatar-size",
         "--bh-avatar-size-2xl",
@@ -308,9 +309,10 @@
         "--bh-bg-neutral-subtle",
         "--bh-bg-success-default",
         "--bh-border-width-default",
+        "--bh-content-default",
         "--bh-content-on-brand",
-        "--bh-content-subtle",
         "--bh-font-weight-semibold",
+        "--bh-icon-slot-size-default",
         "--bh-icon-stroke-210",
         "--bh-icon-stroke-240",
         "--bh-icon-stroke-260",
@@ -397,7 +399,7 @@
         "--bh-badge-outline-border-width",
         "--bh-bg-accent-amber-default",
         "--bh-bg-accent-amber-subtle",
-        "--bh-bg-accent-blue-default",
+        "--bh-bg-accent-blue-bold",
         "--bh-bg-accent-blue-subtle",
         "--bh-bg-accent-fuchsia-default",
         "--bh-bg-accent-fuchsia-subtle",
@@ -409,11 +411,11 @@
         "--bh-bg-accent-purple-subtle",
         "--bh-bg-accent-red-default",
         "--bh-bg-accent-red-subtle",
-        "--bh-bg-accent-rose-default",
+        "--bh-bg-accent-rose-bold",
         "--bh-bg-accent-rose-subtle",
         "--bh-bg-accent-sky-base",
         "--bh-bg-accent-sky-subtle",
-        "--bh-bg-neutral-default",
+        "--bh-bg-neutral-bold",
         "--bh-bg-neutral-subtle",
         "--bh-border-accent-amber-strong",
         "--bh-border-accent-amber-subtle",
@@ -461,7 +463,7 @@
         "--bh-content-muted",
         "--bh-content-on-color",
         "--bh-content-on-light",
-        "--bh-content-subtle",
+        "--bh-content-on-neutral",
         "--bh-interactive-ghost-default",
         "--bh-opacity-35",
         "--bh-radius-full",
@@ -553,7 +555,7 @@
         "--bh-bg-always-white",
         "--bh-bg-brand-subtle",
         "--bh-bg-danger-default",
-        "--bh-bg-neutral-default",
+        "--bh-bg-neutral-bold",
         "--bh-bg-neutral-subtle",
         "--bh-border-brand-strong",
         "--bh-border-default",
@@ -564,9 +566,11 @@
         "--bh-content-default",
         "--bh-content-disabled",
         "--bh-content-muted",
-        "--bh-content-on-color",
+        "--bh-content-on-neutral",
         "--bh-control-default",
         "--bh-control-md",
+        "--bh-icon-size-default",
+        "--bh-icon-slot-size-default",
         "--bh-icon-stroke-200",
         "--bh-icon-stroke-225",
         "--bh-interactive-ghost-hover",
@@ -674,6 +678,8 @@
         "--bh-border-subtle",
         "--bh-content-default",
         "--bh-content-subtle",
+        "--bh-icon-size-default",
+        "--bh-icon-slot-size-default",
         "--bh-radius-2xl-12",
         "--bh-radius-full",
         "--bh-radius-lg-8",
@@ -788,12 +794,6 @@
       ],
       "tokens": [
         "--bh-bg-always-white",
-        "--bh-bg-success-bold",
-        "--bh-bg-success-default",
-        "--bh-bg-success-strong",
-        "--bh-bg-warning-bold",
-        "--bh-bg-warning-default",
-        "--bh-bg-warning-strong",
         "--bh-border-brand-strong",
         "--bh-border-danger-strong",
         "--bh-border-default",
@@ -804,6 +804,7 @@
         "--bh-button-gap-xs",
         "--bh-button-icon-offset",
         "--bh-button-icon-size",
+        "--bh-button-icon-slot-size",
         "--bh-button-label-padding-x",
         "--bh-button-lg-height",
         "--bh-button-lg-padding-x",
@@ -826,6 +827,8 @@
         "--bh-content-on-brand",
         "--bh-content-on-color",
         "--bh-content-on-light",
+        "--bh-content-on-success",
+        "--bh-content-on-warning",
         "--bh-control-default",
         "--bh-interactive-brand-default",
         "--bh-interactive-brand-disabled",
@@ -855,6 +858,12 @@
         "--bh-interactive-soft-disabled",
         "--bh-interactive-soft-hover",
         "--bh-interactive-soft-pressed",
+        "--bh-interactive-success-default",
+        "--bh-interactive-success-hover",
+        "--bh-interactive-success-pressed",
+        "--bh-interactive-warning-default",
+        "--bh-interactive-warning-hover",
+        "--bh-interactive-warning-pressed",
         "--bh-opacity-30",
         "--bh-space-none",
         "--bh-text-button-font-size",
@@ -880,6 +889,7 @@
       ],
       "parts": [
         "Card",
+        "CardSurface",
         "CardMedia",
         "CardFooter",
         "CardActions"
@@ -892,6 +902,7 @@
             "CardActions",
             "CardFooter",
             "CardMedia",
+            "CardSurface",
             "cardVariants"
           ]
         }
@@ -1200,6 +1211,10 @@
         "Connected action group",
         "Text formatting toggle group"
       ],
+      "features": [
+        "contained horizontal scrolling for narrow containers",
+        "connected dividers remain intact while scrolling"
+      ],
       "rtl": {
         "inheritsDirection": true,
         "itemSizing": "LTR and RTL default items keep their fixed Figma matrix widths. Icon-only groups keep the same square dimensions.",
@@ -1223,6 +1238,7 @@
         "--bh-button-group-content-disabled",
         "--bh-button-group-divider",
         "--bh-button-group-icon-size",
+        "--bh-button-group-icon-slot-size",
         "--bh-button-group-item-active-bg",
         "--bh-button-group-item-bg",
         "--bh-button-group-item-disabled-bg",
@@ -1429,7 +1445,7 @@
         "--bh-toggle-icon-size-md",
         "--bh-toggle-icon-size-sm",
         "--bh-toggle-offset",
-        "--shadow-component-default",
+        "--shadow-md",
         "--shadow-social-button-focus-ring"
       ]
     },
@@ -1586,6 +1602,7 @@
         "--bh-menu-item-slot-gap",
         "--bh-menu-label-padding-x",
         "--bh-menu-leading-icon-size",
+        "--bh-menu-leading-icon-slot-size",
         "--bh-menu-padding-y",
         "--bh-menu-progress-gap",
         "--bh-menu-progress-height",
@@ -2042,7 +2059,7 @@
         "--bh-z-overlay",
         "--bh-z-raised",
         "--shadow-button-focus",
-        "--shadow-component-default"
+        "--shadow-lg"
       ]
     },
     "popover": {
@@ -2359,8 +2376,8 @@
         "--bh-text-heading-sm-semibold-letter-spacing",
         "--bh-text-heading-sm-semibold-line-height",
         "--bh-z-overlay",
+        "--shadow-2xl",
         "--shadow-button-focus",
-        "--shadow-component-default",
         "--shadow-modal"
       ]
     },
@@ -2480,7 +2497,7 @@
         "--bh-text-heading-sm-semibold-letter-spacing",
         "--bh-text-heading-sm-semibold-line-height",
         "--bh-z-overlay",
-        "--shadow-component-default",
+        "--shadow-2xl",
         "--shadow-modal"
       ]
     },
@@ -2809,6 +2826,8 @@
         "--bh-content-default",
         "--bh-content-disabled",
         "--bh-content-subtle",
+        "--bh-icon-size-default",
+        "--bh-icon-slot-size-default",
         "--bh-icon-stroke-180",
         "--bh-icon-stroke-200",
         "--bh-interactive-radiobutton-default",
@@ -2934,6 +2953,10 @@
         "spacing": "Uses logical flex direction, gap, and text direction so English and Arabic captions align naturally."
       },
       "files": [
+        {
+          "source": "components/pagination.css",
+          "target": "{{ui}}/pagination.css"
+        },
         {
           "source": "components/pagination.tsx",
           "target": "{{ui}}/pagination.tsx"
@@ -2942,6 +2965,11 @@
       "examples": [
         "examples/pagination-demo.tsx"
       ],
+      "features": [
+        "container-aware compact numeric pages",
+        "contained horizontal control scrolling",
+        "wrapping captions and summaries"
+      ],
       "tokens": [
         "--bh-border-brand-strong",
         "--bh-content-disabled",
@@ -2969,6 +2997,7 @@
         "--bh-pagination-control-text-rtl-padding-x",
         "--bh-pagination-font-size",
         "--bh-pagination-icon-size",
+        "--bh-pagination-icon-slot-size",
         "--bh-pagination-item-size",
         "--bh-pagination-label-font-weight",
         "--bh-pagination-letter-spacing",
@@ -3119,6 +3148,7 @@
         "--bh-button-gap-xs",
         "--bh-button-icon-offset",
         "--bh-button-icon-size",
+        "--bh-button-icon-slot-size",
         "--bh-button-label-padding-x",
         "--bh-button-md-height",
         "--bh-button-md-padding-x",
@@ -3166,6 +3196,7 @@
         "--bh-select-icon-slot-size",
         "--bh-select-trigger-padding-x",
         "--bh-select-width",
+        "--bh-space-19xl-384",
         "--bh-space-3xl-16",
         "--bh-space-5xl-24",
         "--bh-space-md-8",
@@ -3373,7 +3404,7 @@
         "leadingIcon": {
           "type": "React.ReactNode | false",
           "default": null,
-          "description": "Supplies and enables a custom leading icon; false always removes the leading slot."
+          "description": "Supplies and enables a custom 16px glyph inside the shared 20px leading slot; false always removes the slot."
         },
         "hasInformationIcon": {
           "type": "boolean",
@@ -3399,12 +3430,12 @@
         "shortcutKeys": {
           "type": "readonly string[]",
           "default": "Mod,K",
-          "description": "Renders the shortcut kind with shared Kbd keycaps. Use Mod for a platform-aware primary modifier."
+          "description": "Renders the shortcut kind as one compact platform-aware Shortcut chip. Use Mod for the primary modifier."
         },
         "shortcut": {
           "type": "React.ReactNode",
           "default": null,
-          "description": "Deprecated single-keycap escape hatch. Prefer shortcutKeys for a structured shortcut chord.",
+          "description": "Deprecated compact-chip content escape hatch. Prefer shortcutKeys for a structured platform-aware chord.",
           "deprecated": true
         }
       },
@@ -3451,7 +3482,7 @@
       ],
       "recommendedFor": [
         "Text, email, URL, number, and other native text-entry controls",
-        "Search fields when composed with an explicit search icon and shared shortcut keycaps"
+        "Search fields composed with a 16px search glyph in the shared 20px icon slot and a compact Shortcut chip"
       ],
       "avoidWhen": [
         "Calendar date or date-range selection; use DatePicker or DateRangePicker",
@@ -3501,6 +3532,7 @@
         "--bh-input-content-gap",
         "--bh-input-helper-gap",
         "--bh-input-icon-size",
+        "--bh-input-icon-slot-size",
         "--bh-input-info-icon-size",
         "--bh-input-inline-gap",
         "--bh-input-inline-tags-gap",
@@ -3697,13 +3729,14 @@
       ]
     },
     "kbd": {
-      "description": "Keyboard key and platform-aware shortcut primitives for search fields, command rows, and help text with shared tokenized surfaces.",
+      "description": "Keyboard key and platform-aware shortcut primitives: physical keycaps, separated chords, and compact combined hints for inputs and command rows.",
       "dependencies": {
         "class-variance-authority": "^0.7.1"
       },
       "parts": [
         "Kbd",
-        "KbdShortcut"
+        "KbdShortcut",
+        "Shortcut"
       ],
       "supportedExports": [
         {
@@ -3711,7 +3744,9 @@
           "values": [
             "Kbd",
             "KbdShortcut",
-            "kbdVariants"
+            "Shortcut",
+            "kbdVariants",
+            "shortcutVariants"
           ]
         }
       ],
@@ -3719,7 +3754,7 @@
         "keys": {
           "type": "readonly string[]",
           "default": null,
-          "description": "Required by KbdShortcut. Each entry renders as its own keycap; use Mod for the platform primary modifier."
+          "description": "Used by KbdShortcut and Shortcut. Use Mod for the platform primary modifier; KbdShortcut separates keys while Shortcut combines them."
         },
         "platform": {
           "type": "\"auto\" | \"mac\" | \"windows\" | \"linux\"",
@@ -3741,10 +3776,11 @@
       },
       "recommendedFor": [
         "Single keyboard keys",
-        "Multi-key shortcuts rendered as separate, consistently spaced keycaps"
+        "Multi-key shortcuts rendered as separate, consistently spaced keycaps",
+        "Compact combined shortcut hints inside inputs and constrained action rows"
       ],
       "avoidWhen": [
-        "Rendering an entire shortcut chord as one bespoke badge"
+        "Rebuilding shortcut badges locally instead of using Shortcut or KbdShortcut"
       ],
       "rtl": {
         "inheritsDirection": false,
@@ -3768,12 +3804,18 @@
         "--bh-interactive-soft-default",
         "--bh-interactive-soft-disabled",
         "--bh-radius-md-6",
+        "--bh-radius-sm-4",
+        "--bh-space-4xl-20",
         "--bh-space-5xl-24",
         "--bh-space-6xl-32",
         "--bh-space-md-8",
         "--bh-space-sm-6",
         "--bh-space-xs-4",
         "--bh-space-xxs-2",
+        "--bh-text-body-2xs-medium-font-size",
+        "--bh-text-body-2xs-medium-font-weight",
+        "--bh-text-body-2xs-medium-letter-spacing",
+        "--bh-text-body-2xs-medium-line-height",
         "--bh-text-body-xs-medium-font-size",
         "--bh-text-body-xs-medium-font-weight",
         "--bh-text-body-xs-medium-letter-spacing",
@@ -3863,6 +3905,7 @@
         "--bh-item-gap",
         "--bh-item-group-gap",
         "--bh-item-icon-size",
+        "--bh-item-icon-slot-size",
         "--bh-item-media-radius",
         "--bh-item-media-size",
         "--bh-item-min-height-lg",
@@ -4251,6 +4294,7 @@
         "--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-default",
@@ -4548,22 +4592,35 @@
       ]
     },
     "sidebar": {
-      "description": "Composable app sidebar with controlled or uncontrolled collapse state, grouped menu items, logical start/end placement, RTL mirroring, and generated sidebar tokens.",
+      "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.",
       "dependencies": {
         "@radix-ui/react-slot": "^1.2.3",
         "lucide-react": "^1.17.0"
       },
+      "registryDependencies": [
+        "tooltip"
+      ],
       "parts": [
         "SidebarProvider",
         "Sidebar",
         "SidebarHeader",
+        "SidebarHeaderAction",
+        "SidebarHeaderBrand",
+        "SidebarHeaderWorkspaceSwitch",
         "SidebarBody",
         "SidebarFooter",
+        "SidebarFooterUser",
         "SidebarGroup",
+        "SidebarGroupAction",
         "SidebarGroupLabel",
         "SidebarMenu",
         "SidebarMenuItem",
+        "SidebarMenuBadge",
         "SidebarMenuButton",
+        "SidebarMenuSub",
+        "SidebarMenuSubButton",
+        "SidebarMenuTreeItem",
+        "SidebarTreeGroup",
         "SidebarToggle",
         "SidebarTrigger",
         "SidebarInset",
@@ -4576,69 +4633,224 @@
             "Sidebar",
             "SidebarBody",
             "SidebarFooter",
+            "SidebarFooterUser",
             "SidebarGroup",
+            "SidebarGroupAction",
             "SidebarGroupLabel",
             "SidebarHeader",
+            "SidebarHeaderAction",
+            "SidebarHeaderBrand",
+            "SidebarHeaderWorkspaceSwitch",
             "SidebarInset",
             "SidebarMenu",
+            "SidebarMenuBadge",
             "SidebarMenuButton",
             "SidebarMenuItem",
+            "SidebarMenuSub",
+            "SidebarMenuSubButton",
+            "SidebarMenuTreeItem",
             "SidebarProvider",
             "SidebarRail",
             "SidebarToggle",
+            "SidebarTreeGroup",
             "SidebarTrigger"
           ]
         }
       ],
+      "props": {
+        "collapsed": {
+          "type": "boolean",
+          "default": false,
+          "description": "Controls the provider-owned 280px expanded or 48px rail state. Pair with onCollapsedChange for controlled usage."
+        },
+        "defaultCollapsed": {
+          "type": "boolean",
+          "default": false,
+          "description": "Sets the initial rail state when SidebarProvider owns collapse state internally."
+        },
+        "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\"",
+          "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."
+        },
+        "active": {
+          "type": "boolean",
+          "default": false,
+          "description": "Applies the selected menu or tree treatment and exposes aria-current=\"page\"."
+        },
+        "state": {
+          "type": "\"default\" | \"hover\" | \"active\" | \"focus\"",
+          "default": "default",
+          "description": "Deterministic interaction state for documentation matrices; product hover and focus remain native CSS interactions."
+        },
+        "showLine": {
+          "type": "boolean",
+          "default": false,
+          "description": "Selects the neutral/brand line-guided Level 2 treatment on SidebarMenuSubButton."
+        },
+        "level": {
+          "type": "1 | 2 | 3 | 4",
+          "default": 1,
+          "description": "Controls tokenized logical indentation for SidebarMenuTreeItem."
+        },
+        "expandable": {
+          "type": "boolean",
+          "default": false,
+          "description": "Adds a disclosure affordance to group labels or tree-group headings."
+        },
+        "asChild": {
+          "type": "boolean",
+          "default": false,
+          "description": "Renders menu, tree, or inset content through Radix Slot while preserving sidebar layout and semantics."
+        }
+      },
+      "defaults": {
+        "directions": "ltr",
+        "sides": "start",
+        "states": "default",
+        "variants": "default menu"
+      },
+      "directions": [
+        "ltr",
+        "rtl"
+      ],
+      "sides": [
+        "start",
+        "end"
+      ],
+      "states": [
+        "default",
+        "hover",
+        "active",
+        "focus",
+        "expanded",
+        "collapsed"
+      ],
+      "variants": [
+        "default menu",
+        "avatar menu",
+        "Level 2 menu",
+        "Level 2 line menu",
+        "workspace actions",
+        "workspace card",
+        "default footer",
+        "supporting-text footer"
+      ],
       "features": [
+        "280px expanded and 48px collapsed shells",
         "controlled collapse",
         "uncontrolled collapse",
-        "group labels",
-        "icon-only collapsed state",
-        "logical side placement"
+        "brand header with search and collapse actions",
+        "workspace action and card headers",
+        "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",
+        "four-level tree navigation",
+        "supporting-text and bordered user footers",
+        "icon-only rail with tooltips",
+        "logical side placement and RTL mirroring"
       ],
       "tokens": [
+        "--bh-bg-brand-default",
+        "--bh-bg-default",
+        "--bh-bg-default-hover",
+        "--bh-bg-neutral-subtle",
+        "--bh-border-focus",
+        "--bh-border-subtle",
+        "--bh-border-width-default",
+        "--bh-border-width-strong",
         "--bh-content-default",
+        "--bh-content-disabled",
         "--bh-content-muted",
+        "--bh-content-on-brand",
         "--bh-content-subtle",
+        "--bh-control-sm",
         "--bh-icon-stroke-200",
+        "--bh-interactive-ghost-active",
+        "--bh-interactive-ghost-default",
         "--bh-interactive-ghost-hover",
+        "--bh-opacity-0",
+        "--bh-opacity-100",
+        "--bh-radius-full",
         "--bh-radius-lg-8",
+        "--bh-radius-md-6",
+        "--bh-sidebar-active-guide-height",
         "--bh-sidebar-bg",
         "--bh-sidebar-bg-collapsed",
         "--bh-sidebar-border",
+        "--bh-sidebar-brand-height",
+        "--bh-sidebar-compact-control-size",
+        "--bh-sidebar-header-action-size",
         "--bh-sidebar-icon-size",
+        "--bh-sidebar-icon-size-collapsed",
+        "--bh-sidebar-icon-slot-size",
         "--bh-sidebar-item-bg-active",
         "--bh-sidebar-item-bg-hover",
         "--bh-sidebar-item-content",
         "--bh-sidebar-item-content-active",
-        "--bh-sidebar-item-gap",
         "--bh-sidebar-item-height",
+        "--bh-sidebar-item-height-collapsed",
         "--bh-sidebar-item-padding-x",
+        "--bh-sidebar-level-2-indent-width",
         "--bh-sidebar-padding",
         "--bh-sidebar-rail-width",
+        "--bh-sidebar-tree-indent-step",
+        "--bh-sidebar-tree-item-height",
         "--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-3xl-16",
+        "--bh-space-4xl-20",
         "--bh-space-5xl-24",
+        "--bh-space-6xl-32",
+        "--bh-space-8xl-48",
+        "--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-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-3xs-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-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",
-        "--shadow-button-focus",
-        "--shadow-sidebar"
+        "--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-xl-semibold-font-size",
+        "--bh-text-body-xl-semibold-font-weight",
+        "--bh-text-body-xl-semibold-letter-spacing",
+        "--bh-text-body-xl-semibold-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-text-body-xs-semibold-font-weight",
+        "--shadow-button-focus"
       ],
       "rtl": {
         "inheritsDirection": true,
-        "placement": "Use side=\"start\" or side=\"end\" with dir on SidebarProvider for logical placement.",
-        "spacing": "Menu item icon and label spacing uses flex gaps and logical text alignment."
+        "placement": "Use side=\"start\" or side=\"end\" with dir on SidebarProvider for logical placement and border selection.",
+        "spacing": "Headers, menu rows, nested guides, tree indentation, group actions, and footer content use logical inline spacing.",
+        "icons": "Directional collapse, disclosure, and tree chevrons mirror in RTL; semantic icons retain their orientation."
       },
       "files": [
         {
@@ -4702,6 +4914,8 @@
       ],
       "tokens": [
         "--bh-bg-raised",
+        "--bh-border-subtle",
+        "--bh-border-width-default",
         "--bh-content-default",
         "--bh-content-disabled",
         "--bh-interactive-ghost-hover",
@@ -4749,7 +4963,10 @@
       "features": [
         "vertical scrollbar",
         "horizontal scrollbar",
-        "viewport clipping"
+        "two-axis scrollbar composition",
+        "viewport clipping",
+        "keyboard-focusable viewport",
+        "viewportProps escape hatch"
       ],
       "rtl": {
         "inheritsDirection": true,
@@ -4768,7 +4985,8 @@
         "--bh-border-default",
         "--bh-radius-full",
         "--bh-space-lg-10",
-        "--bh-space-xxs-2"
+        "--bh-space-xxs-2",
+        "--shadow-component-focus-ring"
       ]
     },
     "resizable": {
@@ -4821,7 +5039,8 @@
         "--bh-space-5xl-24",
         "--bh-space-6xl-32",
         "--bh-z-raised",
-        "--shadow-button-focus"
+        "--shadow-button-focus",
+        "--shadow-component-focus-ring"
       ]
     },
     "autocomplete": {
@@ -5031,12 +5250,13 @@
         "examples/date-picker-demo.tsx"
       ],
       "tokens": [
-        "--bh-bg-brand-default",
+        "--bh-bg-brand-bold",
         "--bh-bg-brand-subtle",
         "--bh-bg-default",
         "--bh-bg-default-hover",
         "--bh-bg-raised",
         "--bh-border-disabled",
+        "--bh-border-focus",
         "--bh-border-input",
         "--bh-border-subtle",
         "--bh-border-width-default",
@@ -5047,7 +5267,7 @@
         "--bh-content-default",
         "--bh-content-disabled",
         "--bh-content-muted",
-        "--bh-content-on-color",
+        "--bh-content-on-brand",
         "--bh-content-subtle",
         "--bh-control-default",
         "--bh-date-day-cell-height",
@@ -5060,6 +5280,7 @@
         "--bh-date-month-year-spacer-height",
         "--bh-date-nav-button-size",
         "--bh-date-nav-icon-size",
+        "--bh-date-nav-icon-slot-size",
         "--bh-date-picker-width",
         "--bh-date-presets-width",
         "--bh-date-range-month-width",
@@ -5073,6 +5294,7 @@
         "--bh-date-trigger-border",
         "--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",
@@ -5726,6 +5948,11 @@
         "steady",
         "dynamic"
       ],
+      "rtl": {
+        "inheritsDirection": true,
+        "motion": "Circular loading motion is direction-neutral; no icon or track mirroring is required.",
+        "semantics": "The indicator keeps the same accessible loading label in either direction; localize that label at the call site."
+      },
       "features": [
         "steady arc rotation",
         "dynamic arc length",
@@ -5842,6 +6069,21 @@
     "activity-feed": {
       "description": "Expanded activity feed composition with avatar indicators, status dots, captions, action buttons, slot rows, timestamps, links, and RTL copy.",
       "status": "expanded",
+      "variants": [
+        "caption",
+        "slot"
+      ],
+      "states": [
+        "default",
+        "with-status",
+        "with-link",
+        "with-actions"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "The feed and each item inherit direction; marker, copy, timestamps, links, and owned Button actions mirror through logical CSS.",
+        "textDirection": "Labels, captions, support text, and timestamps preserve their supplied content while the row aligns to the inherited direction."
+      },
       "registryDependencies": [
         "button"
       ],
@@ -5919,12 +6161,85 @@
         "--shadow-component-default"
       ]
     },
+    "activity-heatmap": {
+      "description": "Token-only calendar activity heatmap with seven-day columns, five semantic intensity levels, responsive horizontal overflow, cell labels, and RTL support.",
+      "status": "expanded",
+      "dependencies": {},
+      "parts": [
+        "ActivityHeatmap"
+      ],
+      "supportedExports": [
+        {
+          "source": "components/expanded/ActivityHeatmap.tsx",
+          "values": [
+            "ActivityHeatmap"
+          ]
+        }
+      ],
+      "files": [
+        {
+          "source": "components/expanded/activityHeatmap.css",
+          "target": "{{ui}}/expanded/activityHeatmap.css"
+        },
+        {
+          "source": "components/expanded/ActivityHeatmap.tsx",
+          "target": "{{ui}}/expanded/ActivityHeatmap.tsx"
+        }
+      ],
+      "examples": [
+        "examples/expanded/activity-heatmap-demo.tsx"
+      ],
+      "props": {
+        "ariaLabel": {
+          "type": "string",
+          "default": "Activity heatmap",
+          "description": "Accessible summary for the full visualized period."
+        },
+        "dir": {
+          "type": "ltr | rtl",
+          "default": "inherited",
+          "description": "Places the first activity column at the logical start edge."
+        },
+        "items": {
+          "type": "readonly ActivityHeatmapItem[]",
+          "default": "[]",
+          "description": "Column-major cells grouped into seven-day weeks, each with a level from zero through four."
+        }
+      },
+      "states": [
+        "level-0",
+        "level-1",
+        "level-2",
+        "level-3",
+        "level-4"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Grid auto-placement follows logical inline direction while preserving the supplied item order."
+      },
+      "tokens": [
+        "--bh-bg-accent-purple-default",
+        "--bh-bg-accent-purple-soft",
+        "--bh-bg-accent-purple-subtle",
+        "--bh-bg-neutral-medium",
+        "--bh-content-accent-purple-strong",
+        "--bh-content-default",
+        "--bh-font-family",
+        "--bh-radius-sm-4",
+        "--bh-space-3xl-16",
+        "--bh-space-xs-4",
+        "--shadow-component-focus-ring"
+      ]
+    },
     "alert": {
       "description": "Contextual feedback primitive with danger, success, warning, info, neutral, compact, expandable, action, close, and RTL variants.",
       "dependencies": {
         "class-variance-authority": "^0.7.1",
         "lucide-react": "^1.17.0"
       },
+      "registryDependencies": [
+        "button"
+      ],
       "parts": [
         "Alert"
       ],
@@ -5970,6 +6285,7 @@
         "--bh-alert-expanded-radius",
         "--bh-alert-expanded-width",
         "--bh-alert-icon-size",
+        "--bh-alert-icon-slot-size",
         "--bh-bg-danger-subtle",
         "--bh-bg-info-subtle",
         "--bh-bg-neutral-subtle",
@@ -5996,7 +6312,6 @@
         "--bh-font-weight-medium",
         "--bh-font-weight-regular",
         "--bh-icon-stroke-225",
-        "--bh-opacity-80",
         "--bh-radius-full",
         "--bh-space-3xl-16",
         "--bh-space-md-8",
@@ -6013,13 +6328,36 @@
         "--bh-text-body-md-underline-line-height",
         "--bh-text-body-sm-regular-font-size",
         "--bh-text-body-sm-regular-letter-spacing",
-        "--bh-text-body-sm-regular-line-height",
-        "--shadow-button-focus"
+        "--bh-text-body-sm-regular-line-height"
       ]
     },
     "banner": {
       "description": "Expanded banner system with slim, inline action, single action, input, floating, full-width, brand, grey, brand-light, and RTL variants.",
       "status": "expanded",
+      "variants": [
+        "brand",
+        "grey",
+        "brand-light"
+      ],
+      "sizes": [
+        "floating",
+        "full-width"
+      ],
+      "states": [
+        "title",
+        "title-description"
+      ],
+      "modes": [
+        "slim",
+        "single-action-inline",
+        "single-action",
+        "input"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Message, action, input, and close clusters use logical layout and :dir(rtl), including when direction comes from an ancestor.",
+        "composition": "Actions and dismiss controls compose Button; the input mode composes Input."
+      },
       "dependencies": {
         "lucide-react": "^1.17.0"
       },
@@ -6052,23 +6390,26 @@
         "examples/expanded/banner-demo.tsx"
       ],
       "tokens": [
-        "--bh-bg-brand-default",
+        "--bh-bg-brand-bold",
         "--bh-bg-brand-soft",
         "--bh-bg-muted",
         "--bh-border-subtle",
         "--bh-content-default",
-        "--bh-content-inverse",
         "--bh-content-link",
+        "--bh-content-on-brand",
         "--bh-content-subtle",
         "--bh-font-family",
         "--bh-font-weight-regular",
         "--bh-font-weight-semibold",
+        "--bh-icon-size-default",
+        "--bh-icon-slot-size-default",
         "--bh-icon-stroke-210",
         "--bh-icon-stroke-225",
         "--bh-input-width",
         "--bh-radius-xl-10",
+        "--bh-space-17xl-288",
+        "--bh-space-19xl-384",
         "--bh-space-3xl-16",
-        "--bh-space-4xl-20",
         "--bh-space-8xl-48",
         "--bh-space-lg-10",
         "--bh-space-md-8",
@@ -6086,12 +6427,31 @@
         "--bh-text-body-md-medium-font-weight",
         "--bh-text-body-md-medium-letter-spacing",
         "--bh-text-body-md-medium-line-height",
-        "--shadow-component-default"
+        "--shadow-xl"
       ]
     },
     "catalog-components": {
       "description": "Expanded catalog showcase with breadcrumbs, catalog-only content dividers, tag previews, file upload states, and table previews.",
       "status": "expanded",
+      "variants": [
+        "solid-divider",
+        "dotted-divider"
+      ],
+      "states": [
+        "label",
+        "action",
+        "disabled-action"
+      ],
+      "modes": [
+        "showcase",
+        "divider",
+        "content-divider"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "composition": "The showcase composes the owned Breadcrumbs, Button, Tag, File Upload, and Table components and includes explicit RTL surfaces.",
+        "spacing": "Catalog dividers use logical flex order and gaps, so labels and actions remain centered in either direction."
+      },
       "dependencies": {
         "lucide-react": "^1.17.0"
       },
@@ -6189,6 +6549,26 @@
     "breadcrumbs": {
       "description": "Expanded breadcrumbs navigation with default, raised, icon, overflow, separator, and RTL variants.",
       "status": "expanded",
+      "variants": [
+        "default",
+        "raised"
+      ],
+      "states": [
+        "link",
+        "current",
+        "overflow"
+      ],
+      "modes": [
+        "text",
+        "icon-only",
+        "slash",
+        "chevron"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "The ordered trail follows inherited inline direction, and chevron separators mirror through :dir(rtl).",
+        "semantics": "The root is a named navigation landmark and the final or explicitly current item exposes aria-current=\"page\"."
+      },
       "dependencies": {
         "lucide-react": "^1.17.0"
       },
@@ -6227,6 +6607,8 @@
         "--bh-focus-ring-width",
         "--bh-font-family",
         "--bh-font-weight-medium",
+        "--bh-icon-size-default",
+        "--bh-icon-slot-size-default",
         "--bh-icon-stroke-190",
         "--bh-icon-stroke-200",
         "--bh-icon-stroke-225",
@@ -6234,7 +6616,6 @@
         "--bh-radius-lg-8",
         "--bh-radius-sm-4",
         "--bh-space-3xl-16",
-        "--bh-space-4xl-20",
         "--bh-space-6xl-32",
         "--bh-space-md-8",
         "--bh-space-xl-12",
@@ -6250,6 +6631,32 @@
     "file-upload": {
       "description": "Expanded file upload composition with drag-and-drop zones, file rows, upload states, disabled behavior, and RTL direction.",
       "status": "expanded",
+      "variants": [
+        "default",
+        "button"
+      ],
+      "sizes": [
+        "lg",
+        "sm"
+      ],
+      "states": [
+        "default",
+        "hover",
+        "disabled",
+        "uploaded",
+        "uploading",
+        "uploading-progress",
+        "error"
+      ],
+      "modes": [
+        "single",
+        "multiple"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Dropzone copy, file metadata, progress, and owned Button actions mirror from inherited direction using logical spacing.",
+        "semantics": "The native file input remains the owned component's intrinsic control; status graphics are decorative in rows and named only when standalone."
+      },
       "dependencies": {
         "lucide-react": "^1.17.0"
       },
@@ -6327,6 +6734,7 @@
         "--bh-font-weight-medium",
         "--bh-font-weight-regular",
         "--bh-font-weight-semibold",
+        "--bh-icon-size-default",
         "--bh-icon-stroke-200",
         "--bh-icon-stroke-220",
         "--bh-radius-2xl-12",
@@ -6365,12 +6773,34 @@
         "--bh-text-body-xs-regular-line-height",
         "--bh-underline-offset-default",
         "--shadow-component-default",
-        "--shadow-xs"
+        "--shadow-sm"
       ]
     },
     "table": {
       "description": "Expanded table and data table composition with selection, stateful sortable headers, search, filters, bulk actions, pagination, empty/loading/error states, status badges, progress cells, actions, row states, and RTL mirroring.",
       "status": "expanded",
+      "sizes": [
+        "sm",
+        "lg"
+      ],
+      "states": [
+        "default",
+        "selected",
+        "disabled",
+        "loading",
+        "empty",
+        "error"
+      ],
+      "modes": [
+        "table",
+        "data-table"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Headers, cells, search/filter tools, selection, pagination, and actions inherit direction and use logical alignment.",
+        "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": {
         "lucide-react": "^1.17.0"
       },
@@ -6388,7 +6818,14 @@
       ],
       "parts": [
         "Table",
-        "DataTable"
+        "DataTable",
+        "DataTableSurface",
+        "TableRoot",
+        "TableHeader",
+        "TableBody",
+        "TableRowElement",
+        "TableHead",
+        "TableCell"
       ],
       "supportedExports": [
         {
@@ -6397,6 +6834,18 @@
             "DataTable",
             "Table"
           ]
+        },
+        {
+          "source": "components/table-elements.tsx",
+          "values": [
+            "DataTableSurface",
+            "TableBody",
+            "TableCell",
+            "TableHead",
+            "TableHeader",
+            "TableRoot",
+            "TableRowElement"
+          ]
         }
       ],
       "files": [
@@ -6407,12 +6856,20 @@
         {
           "source": "components/expanded/Table.tsx",
           "target": "{{ui}}/expanded/Table.tsx"
+        },
+        {
+          "source": "components/table-elements.tsx",
+          "target": "{{ui}}/table-elements.tsx"
         }
       ],
       "examples": [
         "examples/expanded/table-demo.tsx"
       ],
       "tokens": [
+        "--bh-avatar-fallback-font-size-md",
+        "--bh-avatar-fallback-font-size-xs",
+        "--bh-avatar-size-md",
+        "--bh-avatar-size-xs",
         "--bh-bg-accent-amber-subtle",
         "--bh-bg-accent-fuchsia-subtle",
         "--bh-bg-accent-golden-default",
@@ -6448,10 +6905,12 @@
         "--bh-easing-standard",
         "--bh-focus-ring-width",
         "--bh-font-family",
-        "--bh-font-weight-bold",
         "--bh-font-weight-semibold",
+        "--bh-icon-size-default",
+        "--bh-icon-slot-size-default",
         "--bh-icon-stroke-190",
         "--bh-icon-stroke-225",
+        "--bh-input-width",
         "--bh-interactive-ghost-hover",
         "--bh-opacity-0",
         "--bh-opacity-100",
@@ -6489,10 +6948,12 @@
         "--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-weight",
         "--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"
+        "--bh-text-body-xs-regular-font-size",
+        "--shadow-component-focus-ring"
       ]
     },
     "empty-state": {
@@ -6580,6 +7041,16 @@
     "onboarding-step": {
       "description": "Expanded onboarding step list item with finished, active, and inactive progress states for compact setup flows in LTR and RTL.",
       "status": "expanded",
+      "states": [
+        "finished",
+        "active",
+        "inactive"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Marker lines and label alignment follow inherited direction through logical CSS and :dir(rtl).",
+        "semantics": "Decorative progress geometry is hidden from assistive technology while the visible label remains readable."
+      },
       "dependencies": {
         "lucide-react": "^1.17.0"
       },
@@ -6617,10 +7088,11 @@
         "--bh-content-success-default",
         "--bh-control-default",
         "--bh-font-family",
+        "--bh-icon-size-default",
+        "--bh-icon-slot-size-default",
         "--bh-icon-stroke-225",
         "--bh-space-17xl-288",
         "--bh-space-2xl-14",
-        "--bh-space-4xl-20",
         "--bh-space-5xl-24",
         "--bh-space-7xl-40",
         "--bh-space-lg-10",
@@ -6638,10 +7110,30 @@
     "page-header": {
       "description": "Expanded page header composition with breadcrumbs, metadata, description copy, action groups, responsive layout, and optional local tabs.",
       "status": "expanded",
+      "states": [
+        "default",
+        "without-icon",
+        "without-actions",
+        "without-tabs"
+      ],
+      "modes": [
+        "breadcrumbs",
+        "metadata",
+        "description",
+        "actions",
+        "tabs"
+      ],
+      "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."
+      },
       "dependencies": {
         "lucide-react": "^1.17.0"
       },
       "registryDependencies": [
+        "breadcrumbs",
+        "button",
         "tabs"
       ],
       "parts": [
@@ -6710,8 +7202,32 @@
       ]
     },
     "slideout": {
-      "description": "Expanded slideout panel with desktop and mobile breakpoints, header and footer actions, slotted content, and RTL coverage.",
+      "description": "Expanded presentational slideout panel with desktop and mobile breakpoints, header and footer actions, slotted content, and RTL coverage. Use Sheet or Modal when overlay behavior is required.",
       "status": "expanded",
+      "sizes": [
+        "small",
+        "medium",
+        "large"
+      ],
+      "states": [
+        "header-action",
+        "footer-actions",
+        "without-footer",
+        "primary-only"
+      ],
+      "modes": [
+        "desktop",
+        "mobile"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Header, body, and footer use logical spacing and :dir(rtl), including when direction is inherited from an ancestor.",
+        "semantics": "Slideout is a presentational region named by its title, not a modal dialog. Compose Sheet or Modal for focus trapping, Escape dismissal, portals, and focus return.",
+        "composition": "Header and footer actions use the owned Button component."
+      },
+      "registryDependencies": [
+        "button"
+      ],
       "dependencies": {
         "lucide-react": "^1.17.0"
       },
@@ -6800,6 +7316,30 @@
     "steps": {
       "description": "Expanded steps composition with horizontal and vertical progress indicators, icon markers, number markers, item alignment, and RTL layouts.",
       "status": "expanded",
+      "variants": [
+        "icon",
+        "number"
+      ],
+      "states": [
+        "complete",
+        "active",
+        "todo"
+      ],
+      "modes": [
+        "steps",
+        "progress-steps",
+        "horizontal-item",
+        "vertical-item"
+      ],
+      "orientations": [
+        "horizontal",
+        "vertical"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Markers, connectors, labels, support copy, and actions follow inherited direction through :dir(rtl) and logical spacing.",
+        "composition": "Step actions compose Button, and ordered progress structures preserve their semantic list order."
+      },
       "dependencies": {
         "lucide-react": "^1.17.0"
       },
@@ -6808,6 +7348,7 @@
       ],
       "parts": [
         "HorizontalStepItem",
+        "ProgressSteps",
         "Steps",
         "VerticalStepItem"
       ],
@@ -6816,6 +7357,7 @@
           "source": "components/expanded/Steps.tsx",
           "values": [
             "HorizontalStepItem",
+            "ProgressSteps",
             "Steps",
             "VerticalStepItem"
           ]
@@ -6967,6 +7509,24 @@
     "timeline": {
       "description": "Expanded timeline composition with vertical and horizontal orientations, dates, captions, active states, finished states, item variants, and RTL layouts.",
       "status": "expanded",
+      "variants": [
+        "default",
+        "icon"
+      ],
+      "states": [
+        "finished",
+        "active",
+        "inactive"
+      ],
+      "orientations": [
+        "vertical",
+        "horizontal"
+      ],
+      "rtl": {
+        "inheritsDirection": true,
+        "layout": "Marker, connector, date, title, and caption ordering follows inherited direction through :dir(rtl) and logical padding.",
+        "keyboard": "Horizontal timelines are focusable and own local inline scrolling in narrow containers."
+      },
       "dependencies": {
         "lucide-react": "^1.17.0"
       },
@@ -7030,7 +7590,8 @@
         "--bh-text-body-sm-regular-line-height",
         "--bh-timeline-grid-width",
         "--bh-timeline-narrow-width",
-        "--bh-timeline-sidebar-width"
+        "--bh-timeline-sidebar-width",
+        "--shadow-component-focus-ring"
       ]
     }
   }