banhaten 0.1.3 → 0.2.0

package/docs/design-system/components/popover.md

@@ -56,3 +56,22 @@ Open the live component page or run `npx banhaten docs popover` to inspect sourc
 - `alignment`: Top and bottom alignments use logical start/end so the panel edge and arrow align correctly in LTR and RTL.
 - `spacing`: Uses logical layout and Banhaten spacing tokens for headers, bodies, footers, arrows, and trigger gaps.
 - `textDirection`: Title and description slots use dir="auto" while product content can inherit the nearest direction.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/popover.tsx: Popover, PopoverAnchor, PopoverBody, PopoverClose, PopoverContent, PopoverDescription, PopoverFooter, PopoverHeader, PopoverRoot, PopoverTitle, PopoverTrigger, popoverContentVariants` |
+| `parts` | `Popover`, `PopoverRoot`, `PopoverAnchor`, `PopoverTrigger`, `PopoverContent`, `PopoverHeader`, `PopoverTitle`, `PopoverDescription`, `PopoverBody`, `PopoverFooter`, `PopoverClose` |
+| `registryDependencies` | None |
+| `alignments` | `start`, `center`, `end` |
+| `features` | `filter popover`, `settings popover`, `actions popover`, `focus trigger`, `text link trigger`, `icon button trigger`, `optional arrow`, `RTL` |
+| `offsets` | `tight`, `default`, `loose` |
+| `sides` | `top`, `right`, `bottom`, `left` |
+| `sizes` | `sm`, `md`, `lg`, `auto` |
+| `tokens` | `--bh-content-default`, `--bh-content-disabled`, `--bh-content-subtle`, `--bh-control-default`, `--bh-font-family`, `--bh-icon-stroke-200`, `--bh-interactive-ghost-hover`, `--bh-popover-arrow-depth`, `--bh-popover-arrow-width`, `--bh-popover-bg`, `--bh-popover-body-gap`, `--bh-popover-border`, `--bh-popover-close-icon-size`, `--bh-popover-close-size`, `--bh-popover-content-gap`, `--bh-popover-footer-gap`, `--bh-popover-header-gap`, `--bh-popover-lg-width`, `--bh-popover-max-width`, `--bh-popover-md-width`, `--bh-popover-offset`, `--bh-popover-offset-default`, `--bh-popover-offset-loose`, `--bh-popover-offset-tight`, `--bh-popover-padding`, `--bh-popover-radius`, `--bh-popover-sm-width`, `--bh-popover-trigger-gap`, `--bh-radius-full`, `--bh-text-base-letter-spacing`, `--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-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`, `--shadow-button-focus`, `--shadow-popover` |
+<!-- registry-contract:end -->

package/docs/design-system/components/progress-slider.md

@@ -46,3 +46,21 @@ Open the live component page or run `npx banhaten docs progress-slider` to inspe
 - `inheritsDirection`: true
 - `valueDirection`: Radix Slider handles direction and keyboard behavior through the inherited dir attribute; the fill stays anchored to the logical start edge.
 - `spacing`: Uses tokenized pill geometry and logical direction through Radix.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/progress-slider.tsx: ProgressSlider, progressSliderVariants` |
+| `parts` | `ProgressSlider` |
+| `registryDependencies` | None |
+| `features` | `start-anchored fill`, `grip handle`, `ticks` |
+| `sizes` | `default`, `lg` |
+| `states` | `default`, `disabled` |
+| `tokens` | `--bh-bg-brand-soft`, `--bh-bg-brand-subtle`, `--bh-bg-danger-soft`, `--bh-bg-danger-subtle`, `--bh-bg-neutral-soft`, `--bh-bg-neutral-subtle`, `--bh-bg-success-soft`, `--bh-bg-success-subtle`, `--bh-bg-warning-soft`, `--bh-bg-warning-subtle`, `--bh-border-brand-strong`, `--bh-border-brand-subtle`, `--bh-border-danger-strong`, `--bh-border-danger-subtle`, `--bh-border-strong`, `--bh-border-subtle`, `--bh-border-success-strong`, `--bh-border-success-subtle`, `--bh-border-warning-strong`, `--bh-border-warning-subtle`, `--bh-content-disabled`, `--bh-opacity-60`, `--bh-progress-slider-border-width-current`, `--bh-progress-slider-border-width-lg`, `--bh-progress-slider-border-width-md`, `--bh-progress-slider-fill-bg`, `--bh-progress-slider-fill-border`, `--bh-progress-slider-grip-bg`, `--bh-progress-slider-grip-height-current`, `--bh-progress-slider-grip-height-lg`, `--bh-progress-slider-grip-height-md`, `--bh-progress-slider-grip-width`, `--bh-progress-slider-handle-width-current`, `--bh-progress-slider-handle-width-lg`, `--bh-progress-slider-handle-width-md`, `--bh-progress-slider-height-current`, `--bh-progress-slider-height-lg`, `--bh-progress-slider-height-md`, `--bh-progress-slider-radius`, `--bh-progress-slider-tick-bg`, `--bh-progress-slider-tick-gap`, `--bh-progress-slider-tick-padding`, `--bh-progress-slider-tick-size`, `--bh-progress-slider-track-bg`, `--bh-progress-slider-width-current`, `--bh-progress-slider-width-lg`, `--bh-progress-slider-width-md`, `--bh-radius-full`, `--bh-z-overlay`, `--bh-z-popover`, `--bh-z-raised`, `--shadow-progress-slider-thumb-focus` |
+| `tones` | `brand`, `neutral`, `success`, `warning`, `danger` |
+<!-- registry-contract:end -->

package/docs/design-system/components/progress.md

@@ -73,3 +73,20 @@ Covered source files: `components/progress.tsx`.
 ## Accessibility
 
 Keep native semantics, accessible names, keyboard reachability, focus-visible treatment, and status/error announcements intact when composing this component.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/progress.tsx: Progress, progressTrackVariants, progressVariants` |
+| `parts` | `Progress` |
+| `registryDependencies` | None |
+| `features` | `progressbar semantics`, `helper text`, `optional label text`, `info icon`, `spinner indicator`, `logical start fill` |
+| `labelPositions` | `top`, `bottom`, `none`, `inline` |
+| `sizes` | `sm`, `lg` |
+| `tokens` | `--bh-bg-neutral-soft`, `--bh-content-default`, `--bh-content-muted`, `--bh-content-subtle`, `--bh-interactive-indicator-default`, `--bh-progress-gap`, `--bh-progress-indicator-size`, `--bh-progress-track-height-current`, `--bh-radius-full`, `--bh-space-3xl-16`, `--bh-space-md-8`, `--bh-space-sm-6`, `--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-letter-spacing`, `--bh-text-body-2xs-regular-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`, `--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` |
+<!-- registry-contract:end -->

package/docs/design-system/components/radio-card.md

@@ -47,3 +47,19 @@ Open the live component page or run `npx banhaten docs radio-card` to inspect so
 - `inheritsDirection`: false
 - `layout`: Uses the explicit Figma RTL physical order while text nodes use RTL direction and right alignment.
 - `spacing`: Company icon and icon-radio-left RTL variants use the Figma 12px card gap; other variants use the 10px card gap.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/radio-card.tsx: RadioCard, radioCardVariants` |
+| `parts` | `RadioCard` |
+| `registryDependencies` | None |
+| `states` | `default`, `active`, `disabled` |
+| `tokens` | `--bh-bg-accent-blue-soft`, `--bh-bg-accent-purple-soft`, `--bh-bg-always-white`, `--bh-bg-neutral-subtle`, `--bh-bg-raised`, `--bh-bg-raised-hover`, `--bh-border-brand-strong`, `--bh-border-default`, `--bh-border-disabled`, `--bh-border-input`, `--bh-border-subtle`, `--bh-border-width-default`, `--bh-content-default`, `--bh-content-disabled`, `--bh-content-subtle`, `--bh-icon-stroke-180`, `--bh-icon-stroke-200`, `--bh-interactive-radiobutton-default`, `--bh-opacity-disabled-media`, `--bh-radio-card-bg`, `--bh-radio-card-border`, `--bh-radio-card-border-width`, `--bh-radio-card-border-width-active`, `--bh-radio-card-company-mark-color`, `--bh-radio-card-payment-height`, `--bh-radio-card-payment-logo-color`, `--bh-radio-card-payment-logo-height`, `--bh-radio-card-payment-logo-width`, `--bh-radio-card-payment-width`, `--bh-radio-card-width`, `--bh-radio-control-border`, `--bh-radius-full`, `--bh-radius-md-6`, `--bh-radius-xl-10`, `--bh-space-3xl-16`, `--bh-space-4xl-20`, `--bh-space-5xl-24`, `--bh-space-7xl-40`, `--bh-space-lg-10`, `--bh-space-sm-6`, `--bh-space-xl-12`, `--bh-space-xs-4`, `--bh-space-xxs-2`, `--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-regular-font-size`, `--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` |
+| `types` | `with-icon`, `icon-radio-right`, `payment`, `with-avatar`, `company-icon`, `icon-radio-left`, `radio-label` |
+<!-- registry-contract:end -->

package/docs/design-system/components/radio-group.md

@@ -53,3 +53,20 @@ Open the live component page or run `npx banhaten docs radio-group` to inspect s
 - `controlPlacement`: RadioField and RadioGroupItem use start/end control placement so the radio mirrors correctly in RTL.
 - `textDirection`: Group labels, item labels, descriptions, and error text use dir="auto" with tokenized body typography.
 - `semantics`: Uses native radio inputs with a shared group name, fieldset grouping, and label wrapping for platform keyboard and form behavior.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/radio-group.tsx: Radio, RadioField, RadioGroup, RadioGroupItem, radioControl, radioField, radioGroupItems, radioGroupRoot, radioRoot` |
+| `parts` | `Radio`, `RadioField`, `RadioGroup`, `RadioGroupItem` |
+| `registryDependencies` | None |
+| `controlPositions` | `start`, `end` |
+| `orientations` | `vertical`, `horizontal` |
+| `states` | `default`, `error`, `disabled` |
+| `tokens` | `--bh-bg-always-white`, `--bh-bg-default`, `--bh-bg-disabled`, `--bh-border-brand-strong`, `--bh-border-danger-strong`, `--bh-border-disabled`, `--bh-border-input`, `--bh-border-width-default`, `--bh-content-danger-default`, `--bh-content-default`, `--bh-content-disabled`, `--bh-content-subtle`, `--bh-interactive-radiobutton-default`, `--bh-opacity-0`, `--bh-opacity-100`, `--bh-radio-control-border`, `--bh-radio-group-message-max-width`, `--bh-radius-full`, `--bh-space-3xl-16`, `--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-text-body-md-medium-font-weight`, `--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-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-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-raised`, `--shadow-button-focus`, `--shadow-radio-control` |
+<!-- registry-contract:end -->

package/docs/design-system/components/resizable.md

@@ -40,3 +40,18 @@ Open the live component page or run `npx banhaten docs resizable` to inspect sou
 
 - `inheritsDirection`: true
 - `layout`: Panel order follows DOM order; use logical shell layout for RTL workspaces.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/resizable.tsx: ResizableHandle, ResizablePanel, ResizablePanelGroup` |
+| `parts` | `ResizablePanelGroup`, `ResizablePanel`, `ResizableHandle` |
+| `registryDependencies` | None |
+| `features` | `horizontal panels`, `vertical panels`, `keyboard resize handle` |
+| `tokens` | `--bh-bg-raised`, `--bh-border-subtle`, `--bh-border-width-default`, `--bh-content-muted`, `--bh-radius-full`, `--bh-space-3xl-16`, `--bh-space-4xl-20`, `--bh-space-5xl-24`, `--bh-space-6xl-32`, `--bh-z-raised`, `--shadow-button-focus` |
+<!-- registry-contract:end -->

package/docs/design-system/components/scroll-area.md

@@ -43,3 +43,18 @@ Open the live component page or run `npx banhaten docs scroll-area` to inspect s
 
 - `inheritsDirection`: true
 - `spacing`: Viewport content should use logical padding so scrollable regions mirror with document direction.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/scroll-area.tsx: ScrollArea, ScrollBar` |
+| `parts` | `ScrollArea`, `ScrollBar` |
+| `registryDependencies` | None |
+| `features` | `vertical scrollbar`, `horizontal scrollbar`, `viewport clipping` |
+| `tokens` | `--bh-border-default`, `--bh-radius-full`, `--bh-space-lg-10`, `--bh-space-xxs-2` |
+<!-- registry-contract:end -->

package/docs/design-system/components/segmented-control.md

@@ -0,0 +1,71 @@
+# Segmented Control
+
+Segmented Control presents a small set of related choices on one connected, content-width surface. It is the preferred primitive for view, density, period, and numeric display choices such as “Cards per row”.
+
+Use Select or Radio Group when labels are long or the option set is large. Use Button Group when the items are actions rather than values.
+
+## API
+
+Give the group an accessible name, give every item a stable value, and use `SegmentedControlLabel` only for non-interactive context.
+
+```tsx
+<SegmentedControl
+  aria-label="Cards per row"
+  density="default"
+  defaultValue="4"
+>
+  <SegmentedControlLabel>Cards / row</SegmentedControlLabel>
+  <SegmentedControlItem value="3">3</SegmentedControlItem>
+  <SegmentedControlItem value="4">4</SegmentedControlItem>
+  <SegmentedControlItem value="5">5</SegmentedControlItem>
+  <SegmentedControlItem value="6">6</SegmentedControlItem>
+</SegmentedControl>
+```
+
+The default density is `default` (36px). Use `compact` for 32px control rows and `comfortable` for 40px controls. Keep adjacent controls on the same density contract.
+
+## Install
+
+```bash
+npx banhaten add segmented-control
+```
+
+## Examples
+
+Primary registry example: `examples/segmented-control-demo.tsx`.
+
+The results-toolbar recipe demonstrates the labeled cards-per-row composition alongside a Select action.
+
+## Token Contract
+
+Segmented Control reuses Button Group surface, divider, interaction, typography, and density tokens. Do not replace its height, padding, radius, color, or shadow with local literal values.
+
+Covered source files: `components/segmented-control.tsx` and its `button-group` registry dependency.
+
+## RTL Rules
+
+- The group inherits document direction.
+- Content-width items and logical dividers follow inherited direction without alternate markup.
+- Horizontal arrow-key navigation resolves the computed direction through the underlying Toggle Group.
+
+## Accessibility
+
+Provide `aria-label` on every Segmented Control. Items expose pressed state through the underlying Toggle Group, support single or multiple selection, and retain Home, End, and direction-aware arrow-key navigation. The label segment is descriptive and never focusable.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/segmented-control.tsx: SegmentedControl, SegmentedControlItem, SegmentedControlLabel` |
+| `parts` | `SegmentedControl`, `SegmentedControlItem`, `SegmentedControlLabel` |
+| `registryDependencies` | `button-group` |
+| `props.density` | `"compact" \| "default" \| "comfortable"; default "default"; Uses the shared 32px, 36px, or 40px control height contract.` |
+| `props.type` | `"single" \| "multiple"; default "single"; Controls whether one or multiple item values may be active.` |
+| `props.aria-label` | `string; default null; Required accessible name for the complete selection group.` |
+| `densities` | `compact`, `default`, `comfortable` |
+| `selectionTypes` | `single`, `multiple` |
+<!-- registry-contract:end -->

package/docs/design-system/components/select.md

@@ -11,13 +11,23 @@ Select is a Radix Select-backed field and menu system. It supports default and s
 </Select>
 ```
 
-| Prop | Values |
-| --- | --- |
-| `variant` | `default`, `soft` |
-| `size` | `lg`, `md` |
-| `state` | `default`, `filled`, `error`, `disabled` |
-| `itemType` | `default`, `icon`, `avatar`, `company`, `payment`, `dot` |
-| `selectionType` | `default`, `checkbox` |
+| Prop | Type / values | Default | Notes |
+| --- | --- | --- | --- |
+| `variant` | `default`, `soft` | `default` | Selects the trigger surface. |
+| `size` | `lg`, `md` | `lg` | Selects the trigger height. |
+| `state` | `default`, `filled`, `error`, `disabled` | `default` | Selects the visual state. |
+| `itemType` | `default`, `icon`, `avatar`, `company`, `payment`, `dot` | `default` | Selects menu-item media. |
+| `selectionType` | `default`, `checkbox` | `default` | Selects the menu-item selection indicator. |
+| `hasInformationIcon` | `boolean` | `false` | Shows an information icon beside the field label. |
+| `hasLeadingIcon` | `boolean` | `false` | Set true to show the default user icon. |
+| `leadingIcon` | `ReactNode \| false` | `null` | A node enables the leading slot; false always removes it. |
+| `hasTrailingIcon` | `boolean` | `false` | Set true to show the default information icon inside the trigger. |
+| `trailingIcon` | `ReactNode \| false` | `null` | A node enables the trailing slot; false always removes it. |
+| `expandIcon` | `ReactNode \| false` | `chevron-down` | Replaces the expand icon, or removes it when false. |
+
+## Migration
+
+Select now renders only its expand chevron when optional trigger-icon props are omitted. Add `hasLeadingIcon` or `hasTrailingIcon` to retain the previous default user or information icon. A supplied icon enables its slot, while explicit `false` always removes it.
 
 ## Token Contract
 
@@ -48,3 +58,30 @@ Open the live component page or run `npx banhaten docs select` to inspect source
 - `inheritsDirection`: true
 - `textAlignment`: Uses text-start and dir="auto" for values, labels, helper text, and menu item text.
 - `spacing`: Uses logical padding, start/end positioning, and inherited flex direction so trigger icons and selected checks mirror in RTL.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/select-content.tsx: SelectIcon, SelectItemAvatar, SelectItemCompanyLogo, SelectItemPaymentIcon, SelectItemStatusDot, getDefaultSelectItemMedia`, `components/select.tsx: Select, SelectCheckboxIndicator, SelectHelperText, SelectItemAvatar, SelectItemCompanyLogo, SelectItemPaymentIcon, SelectItemStatusDot, SelectLabel, SelectMenu, SelectMenuItem, SelectRoot, SelectTrigger, selectMenu, selectMenuItem, selectRoot, selectTrigger` |
+| `parts` | `Select`, `SelectRoot`, `SelectLabel`, `SelectTrigger`, `SelectHelperText`, `SelectMenu`, `SelectMenuItem`, `SelectCheckboxIndicator`, `SelectItemAvatar`, `SelectItemCompanyLogo`, `SelectItemPaymentIcon`, `SelectItemStatusDot` |
+| `registryDependencies` | None |
+| `props.density` | `"compact" \| "default" \| "comfortable"; default "default"; Preferred cross-component sizing contract. Overrides the legacy size prop with 32px, 36px, or 40px control heights.` |
+| `props.hasInformationIcon` | `boolean; default false; Shows an information icon beside the field label.` |
+| `props.hasLeadingIcon` | `boolean; default false; Shows the default user leading icon when no leadingIcon is supplied.` |
+| `props.leadingIcon` | `React.ReactNode \| false; default null; Supplies and enables a custom leading icon; false always removes the leading slot.` |
+| `props.hasTrailingIcon` | `boolean; default false; Shows the default information trailing icon when no trailingIcon is supplied.` |
+| `props.trailingIcon` | `React.ReactNode \| false; default null; Supplies and enables a custom trailing icon; false always removes the trailing slot.` |
+| `props.expandIcon` | `React.ReactNode \| false; default "chevron-down"; Uses the default expand chevron when omitted, accepts a replacement node, and hides the slot when false.` |
+| `densities` | `compact`, `default`, `comfortable` |
+| `itemTypes` | `default`, `icon`, `avatar`, `company`, `payment`, `dot` |
+| `selectionTypes` | `default`, `checkbox` |
+| `sizes` | `lg`, `md`, `comfortable` |
+| `states` | `default`, `filled`, `error`, `disabled` |
+| `tokens` | `--bh-bg-accent-blue-default`, `--bh-bg-accent-blue-soft`, `--bh-bg-accent-purple-soft`, `--bh-bg-accent-red-default`, `--bh-bg-always-white`, `--bh-bg-brand-default`, `--bh-bg-danger-default`, `--bh-bg-default`, `--bh-bg-disabled`, `--bh-bg-info-default`, `--bh-bg-neutral-default`, `--bh-bg-success-default`, `--bh-bg-warning-default`, `--bh-border-disabled`, `--bh-border-input`, `--bh-border-subtle`, `--bh-border-width-default`, `--bh-content-accent-blue-strong`, `--bh-content-accent-purple-default`, `--bh-content-danger-default`, `--bh-content-default`, `--bh-content-disabled`, `--bh-content-muted`, `--bh-content-on-color`, `--bh-content-subtle`, `--bh-font-weight-semibold`, `--bh-icon-stroke-200`, `--bh-icon-stroke-220`, `--bh-interactive-checkbox-default`, `--bh-opacity-60`, `--bh-radius-full`, `--bh-select-avatar-font-size`, `--bh-select-check-color`, `--bh-select-checkbox-border`, `--bh-select-checkbox-icon-size`, `--bh-select-checkbox-radius`, `--bh-select-checkbox-size`, `--bh-select-company-icon-size`, `--bh-select-content-gap`, `--bh-select-field-gap`, `--bh-select-icon-size`, `--bh-select-icon-slot-size`, `--bh-select-item-check-offset`, `--bh-select-item-content-padding`, `--bh-select-item-gap`, `--bh-select-item-hover-bg`, `--bh-select-item-min-height`, `--bh-select-item-padding-x`, `--bh-select-item-radius`, `--bh-select-item-selected-padding-end`, `--bh-select-item-value-padding-x`, `--bh-select-label-gap`, `--bh-select-media-inset`, `--bh-select-menu-bg`, `--bh-select-menu-list-gap`, `--bh-select-menu-offset`, `--bh-select-menu-padding-y`, `--bh-select-menu-radius`, `--bh-select-menu-width`, `--bh-select-payment-height`, `--bh-select-payment-mark-offset`, `--bh-select-payment-mark-size`, `--bh-select-payment-radius`, `--bh-select-payment-width`, `--bh-select-status-dot-size`, `--bh-select-trigger-bg`, `--bh-select-trigger-bg-disabled`, `--bh-select-trigger-bg-soft`, `--bh-select-trigger-border`, `--bh-select-trigger-border-current`, `--bh-select-trigger-border-disabled`, `--bh-select-trigger-border-error`, `--bh-select-trigger-border-focus`, `--bh-select-trigger-gap`, `--bh-select-trigger-icon-color`, `--bh-select-trigger-padding-x`, `--bh-select-trigger-padding-y-comfortable`, `--bh-select-trigger-padding-y-lg`, `--bh-select-trigger-padding-y-md`, `--bh-select-trigger-radius`, `--bh-select-value-padding-inline`, `--bh-select-width`, `--bh-space-md-8`, `--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-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-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`, `--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`, `--shadow-component-default`, `--shadow-select-checkbox`, `--shadow-select-danger-focus-ring`, `--shadow-select-focus-ring`, `--shadow-select-menu`, `--shadow-select-trigger` |
+| `variants` | `default`, `soft` |
+<!-- registry-contract:end -->

package/docs/design-system/components/sheet.md

@@ -63,3 +63,20 @@ Open the live component page or run `npx banhaten docs sheet` to inspect source
 - `placement`: Use side="start" and side="end" for logical placement; CSS start/end edges mirror under RTL.
 - `textDirection`: Title and description use dir="auto" for Arabic and English copy.
 - `semantics`: Radix Dialog handles modal semantics, focus trapping, and dismissal.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/sheet.tsx: Sheet, SheetBody, SheetClose, SheetCloseButton, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, sheetContentVariants` |
+| `parts` | `Sheet`, `SheetTrigger`, `SheetContent`, `SheetHeader`, `SheetTitle`, `SheetDescription`, `SheetBody`, `SheetFooter`, `SheetClose`, `SheetCloseButton`, `SheetOverlay`, `SheetPortal` |
+| `registryDependencies` | None |
+| `features` | `focus trap`, `outside dismissal`, `Escape dismissal`, `logical sides`, `scrollable body`, `footer actions` |
+| `sides` | `start`, `end`, `top`, `bottom` |
+| `sizes` | `sm`, `default`, `lg` |
+| `tokens` | `--bh-bg-backdrop`, `--bh-bg-raised`, `--bh-border-subtle`, `--bh-content-default`, `--bh-content-subtle`, `--bh-icon-stroke-200`, `--bh-interactive-ghost-hover`, `--bh-radius-2xl-12`, `--bh-radius-full`, `--bh-space-12xl-128`, `--bh-space-16xl-256`, `--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-8xl-48`, `--bh-space-9xl-64`, `--bh-space-lg-10`, `--bh-space-md-8`, `--bh-space-xs-4`, `--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-semibold-font-size`, `--bh-text-heading-sm-semibold-font-weight`, `--bh-text-heading-sm-semibold-letter-spacing`, `--bh-text-heading-sm-semibold-line-height`, `--bh-z-overlay`, `--shadow-button-focus`, `--shadow-component-default` |
+<!-- registry-contract:end -->

package/docs/design-system/components/sidebar.md

@@ -66,3 +66,18 @@ Open the live component page or run `npx banhaten docs sidebar` to inspect sourc
 - `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.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/sidebar.tsx: Sidebar, SidebarBody, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarHeader, SidebarInset, SidebarMenu, SidebarMenuButton, SidebarMenuItem, SidebarProvider, SidebarRail, SidebarToggle, SidebarTrigger` |
+| `parts` | `SidebarProvider`, `Sidebar`, `SidebarHeader`, `SidebarBody`, `SidebarFooter`, `SidebarGroup`, `SidebarGroupLabel`, `SidebarMenu`, `SidebarMenuItem`, `SidebarMenuButton`, `SidebarToggle`, `SidebarTrigger`, `SidebarInset`, `SidebarRail` |
+| `registryDependencies` | None |
+| `features` | `controlled collapse`, `uncontrolled collapse`, `group labels`, `icon-only collapsed state`, `logical side placement` |
+| `tokens` | `--bh-content-default`, `--bh-content-muted`, `--bh-content-subtle`, `--bh-icon-stroke-200`, `--bh-interactive-ghost-hover`, `--bh-radius-lg-8`, `--bh-sidebar-bg`, `--bh-sidebar-bg-collapsed`, `--bh-sidebar-border`, `--bh-sidebar-icon-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-padding-x`, `--bh-sidebar-padding`, `--bh-sidebar-rail-width`, `--bh-sidebar-width`, `--bh-sidebar-width-collapsed`, `--bh-space-19xl-384`, `--bh-space-5xl-24`, `--bh-space-md-8`, `--bh-space-xl-12`, `--bh-space-xs-4`, `--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` |
+<!-- registry-contract:end -->

package/docs/design-system/components/skeleton.md

@@ -71,3 +71,21 @@ Open the live component page or run `npx banhaten docs skeleton` to inspect sour
 ## Accessibility
 
 Keep native semantics, accessible names, keyboard reachability, focus-visible treatment, and status/error announcements intact when composing this component.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/skeleton.tsx: Skeleton, SkeletonAvatar, SkeletonButton, SkeletonCard, SkeletonForm, SkeletonInput, SkeletonList, SkeletonTable, SkeletonText, skeletonVariants` |
+| `parts` | `Skeleton`, `SkeletonText`, `SkeletonAvatar`, `SkeletonButton`, `SkeletonInput`, `SkeletonCard`, `SkeletonList`, `SkeletonTable`, `SkeletonForm` |
+| `registryDependencies` | None |
+| `features` | `shimmer animation`, `reduced motion`, `text lines`, `avatar placeholders`, `button placeholders`, `input placeholders`, `card placeholders`, `list placeholders`, `table placeholders`, `form placeholders` |
+| `shapes` | `block`, `text`, `circle` |
+| `sizes` | `xs`, `sm`, `md`, `lg`, `xl` |
+| `tokens` | `--bh-alpha-alpha-transparent`, `--bh-bg-brand-soft`, `--bh-bg-brand-subtle`, `--bh-bg-default`, `--bh-bg-default-hover`, `--bh-bg-muted`, `--bh-bg-raised`, `--bh-bg-raised-subtle`, `--bh-bg-subtle`, `--bh-border-default`, `--bh-border-subtle`, `--bh-button-lg-height`, `--bh-button-md-height`, `--bh-button-sm-height`, `--bh-button-xl-height`, `--bh-card-desktop-content-padding`, `--bh-control-default`, `--bh-radius-full`, `--bh-radius-lg-8`, `--bh-radius-md-6`, `--bh-radius-xl-10`, `--bh-skeleton-bg`, `--bh-skeleton-duration`, `--bh-skeleton-height`, `--bh-skeleton-highlight`, `--bh-skeleton-radius`, `--bh-skeleton-shimmer-width`, `--bh-skeleton-table-columns`, `--bh-skeleton-width`, `--bh-space-11xl-96`, `--bh-space-12xl-128`, `--bh-space-13xl-160`, `--bh-space-14xl-192`, `--bh-space-3xl-16`, `--bh-space-4xl-20`, `--bh-space-5xl-24`, `--bh-space-6xl-32`, `--bh-space-7xl-40`, `--bh-space-8xl-48`, `--bh-space-9xl-64`, `--bh-space-md-8`, `--bh-space-sm-6`, `--bh-space-xl-12`, `--bh-space-xs-4`, `--bh-text-body-md-regular-line-height`, `--shadow-component-default` |
+| `tones` | `default`, `subtle`, `surface`, `brand` |
+<!-- registry-contract:end -->

package/docs/design-system/components/slideout.md

@@ -61,3 +61,17 @@ Covered source files: `components/expanded/slideout.css`, `components/expanded/S
 ## RTL Rules
 
 This component has no special RTL contract beyond inherited document direction and logical spacing.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/expanded/Slideout.tsx: Slideout` |
+| `parts` | `Slideout` |
+| `registryDependencies` | None |
+| `tokens` | `--bh-bg-default`, `--bh-bg-dim`, `--bh-bg-muted`, `--bh-bg-neutral-medium`, `--bh-bg-neutral-subtle`, `--bh-bg-raised`, `--bh-border-default`, `--bh-border-input`, `--bh-border-subtle`, `--bh-content-brand-default`, `--bh-content-default`, `--bh-content-link`, `--bh-content-on-brand`, `--bh-content-on-color`, `--bh-content-subtle`, `--bh-content-success-default`, `--bh-control-default`, `--bh-font-family`, `--bh-font-weight-medium`, `--bh-icon-stroke-220`, `--bh-interactive-brand-default`, `--bh-interactive-ghost-hover`, `--bh-radius-2xl-12`, `--bh-radius-full`, `--bh-radius-lg-8`, `--bh-space-11xl-96`, `--bh-space-12xl-128`, `--bh-space-18xl-320`, `--bh-space-19xl-384`, `--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-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-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-heading-sm-medium-font-size`, `--bh-text-heading-sm-medium-font-weight`, `--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` |
+<!-- registry-contract:end -->

package/docs/design-system/components/slider.md

@@ -59,3 +59,23 @@ Covered source files: `components/slider.tsx`.
 ## Accessibility
 
 This component relies on `@radix-ui/react-slider` for its base accessibility behavior. Keep required labels, titles, descriptions, and focusable trigger/content relationships intact when composing it.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/slider.tsx: Slider, sliderVariants` |
+| `parts` | `Slider` |
+| `registryDependencies` | None |
+| `features` | `ticks`, `text indicators`, `tooltip indicators`, `thumb grip`, `pill variant`, `vertical orientation` |
+| `indicators` | `none`, `lower-text`, `upper-text`, `lower-tooltip`, `upper-tooltip` |
+| `sizes` | `sm`, `default`, `lg` |
+| `states` | `default`, `disabled` |
+| `tokens` | `--bh-bg-always-white`, `--bh-bg-brand-soft`, `--bh-bg-brand-subtle`, `--bh-bg-danger-default`, `--bh-bg-danger-soft`, `--bh-bg-danger-subtle`, `--bh-bg-default`, `--bh-bg-disabled`, `--bh-bg-neutral-bold`, `--bh-bg-neutral-soft`, `--bh-bg-neutral-subtle`, `--bh-bg-raised`, `--bh-bg-success-default`, `--bh-bg-success-soft`, `--bh-bg-success-subtle`, `--bh-bg-warning-default`, `--bh-bg-warning-soft`, `--bh-bg-warning-subtle`, `--bh-border-brand-strong`, `--bh-border-brand-subtle`, `--bh-border-danger-strong`, `--bh-border-danger-subtle`, `--bh-border-disabled`, `--bh-border-strong`, `--bh-border-subtle`, `--bh-border-success-strong`, `--bh-border-success-subtle`, `--bh-border-warning-strong`, `--bh-border-warning-subtle`, `--bh-content-default`, `--bh-content-disabled`, `--bh-content-subtle`, `--bh-interactive-indicator-default`, `--bh-opacity-60`, `--bh-radius-full`, `--bh-radius-md-6`, `--bh-slider-indicator-gap`, `--bh-slider-pill-height`, `--bh-slider-pill-radius`, `--bh-slider-pill-thumb-border-width`, `--bh-slider-pill-thumb-width`, `--bh-slider-pill-track-bg`, `--bh-slider-range-bg`, `--bh-slider-thumb-bg`, `--bh-slider-thumb-grip-bg`, `--bh-slider-thumb-grip-width`, `--bh-slider-thumb-pill-bg`, `--bh-slider-thumb-pill-border`, `--bh-slider-thumb-radius`, `--bh-slider-thumb-ring-bg`, `--bh-slider-thumb-ring-width-current`, `--bh-slider-thumb-ring-width-lg`, `--bh-slider-thumb-ring-width-md`, `--bh-slider-thumb-ring-width-sm`, `--bh-slider-thumb-size-current`, `--bh-slider-thumb-size-lg`, `--bh-slider-thumb-size-md`, `--bh-slider-thumb-size-sm`, `--bh-slider-tick-bg`, `--bh-slider-tick-gap`, `--bh-slider-tick-size`, `--bh-slider-track-bg`, `--bh-slider-track-radius`, `--bh-slider-track-size-current`, `--bh-slider-track-size-lg`, `--bh-slider-track-size-md`, `--bh-slider-track-size-sm`, `--bh-slider-vertical-height`, `--bh-slider-width`, `--bh-space-6xl-32`, `--bh-space-lg-10`, `--bh-space-md-8`, `--bh-space-sm-6`, `--bh-space-xl-12`, `--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-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-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-z-base`, `--bh-z-overlay`, `--bh-z-popover`, `--bh-z-raised`, `--shadow-slider-thumb`, `--shadow-slider-thumb-focus`, `--shadow-slider-tooltip` |
+| `tones` | `brand`, `neutral`, `success`, `warning`, `danger` |
+| `valueModes` | `single`, `range`, `multi-thumb` |
+<!-- registry-contract:end -->

package/docs/design-system/components/social-button.md

@@ -1,6 +1,6 @@
 # Social Button
 
-Social Button is the sign-in action primitive for supported identity providers. It includes Figma-matched platform styling, solid and outlined variants, icon-only mode, native focus-visible styling, and RTL labels.
+Social Button is the sign-in action primitive for supported identity providers. It includes Figma-matched platform styling, solid and outlined variants, icon-only mode, native focus-visible styling, RTL layout, and explicit localized messages.
 
 ## API
 
@@ -15,6 +15,7 @@ Social Button is the sign-in action primitive for supported identity providers.
 | `variant` | `solid`, `outline` |
 | `size` | `default`, `icon` |
 | `label` | localized label override |
+| `messages` | partial provider-label catalog selected by product locale |
 
 ## Token Contract
 
@@ -22,7 +23,7 @@ Social Button uses Banhaten control, typography, radius, focus, spacing, and sha
 
 ## RTL
 
-When direction is RTL, platform labels default to Arabic where provided. Icon and label spacing uses logical flex rhythm.
+Icon and label spacing uses logical flex rhythm in RTL. Labels remain English unless `messages`, `label`, or text children select another language; `arabicSocialButtonMessages` is available for an explicit Arabic locale.
 
 ## Accessibility
 
@@ -43,5 +44,22 @@ Open the live component page or run `npx banhaten docs social-button` to inspect
 ## RTL Rules
 
 - `inheritsDirection`: true
-- `labels`: Defaults to the Arabic platform label when the document direction is RTL, and accepts an explicit label for nested RTL surfaces.
+- `messages`: Direction controls layout only. Pass label, children, aria-label, or messages to localize provider names.
 - `spacing`: Uses logical label padding and flex gap so the icon/label order follows inherited direction.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/social-button.tsx: SocialButton, arabicSocialButtonMessages, socialButtonVariants, socialPlatformConfig` |
+| `parts` | `SocialButton` |
+| `registryDependencies` | None |
+| `platforms` | `apple`, `facebook`, `google`, `linkedin`, `twitter`, `whatsapp` |
+| `sizes` | `default`, `icon` |
+| `tokens` | `--bh-bg-raised`, `--bh-bg-raised-hover`, `--bh-border-default`, `--bh-border-focus`, `--bh-border-width-default`, `--bh-content-default`, `--bh-icon-stroke-200`, `--bh-icon-stroke-225`, `--bh-opacity-50`, `--bh-social-apple-bg`, `--bh-social-apple-border`, `--bh-social-apple-fg`, `--bh-social-apple-hover`, `--bh-social-apple-icon`, `--bh-social-apple-icon-border`, `--bh-social-apple-outline-icon`, `--bh-social-apple-width`, `--bh-social-apple-width-rtl`, `--bh-social-button-bg`, `--bh-social-button-bg-hover`, `--bh-social-button-border`, `--bh-social-button-current-border`, `--bh-social-button-fg`, `--bh-social-button-focus-border`, `--bh-social-button-gap`, `--bh-social-button-height`, `--bh-social-button-icon`, `--bh-social-button-icon-size`, `--bh-social-button-label-padding-inline-end`, `--bh-social-button-padding-x`, `--bh-social-button-padding-y`, `--bh-social-button-radius`, `--bh-social-button-width`, `--bh-social-button-width-rtl`, `--bh-social-facebook-bg`, `--bh-social-facebook-fg`, `--bh-social-facebook-hover`, `--bh-social-facebook-icon`, `--bh-social-facebook-outline-icon`, `--bh-social-facebook-width`, `--bh-social-facebook-width-rtl`, `--bh-social-google-bg`, `--bh-social-google-border`, `--bh-social-google-fg`, `--bh-social-google-hover`, `--bh-social-google-width`, `--bh-social-google-width-rtl`, `--bh-social-linkedin-bg`, `--bh-social-linkedin-fg`, `--bh-social-linkedin-hover`, `--bh-social-linkedin-icon`, `--bh-social-linkedin-outline-icon`, `--bh-social-linkedin-width`, `--bh-social-linkedin-width-rtl`, `--bh-social-twitter-bg`, `--bh-social-twitter-border`, `--bh-social-twitter-fg`, `--bh-social-twitter-hover`, `--bh-social-twitter-icon`, `--bh-social-twitter-icon-border`, `--bh-social-twitter-outline-icon`, `--bh-social-twitter-width`, `--bh-social-twitter-width-rtl`, `--bh-social-whatsapp-bg`, `--bh-social-whatsapp-fg`, `--bh-social-whatsapp-hover`, `--bh-social-whatsapp-icon`, `--bh-social-whatsapp-outline-icon`, `--bh-social-whatsapp-width`, `--bh-social-whatsapp-width-rtl`, `--bh-text-button-font-size`, `--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` |
+| `variants` | `solid`, `outline` |
+<!-- registry-contract:end -->

package/docs/design-system/components/spinner.md

@@ -59,3 +59,19 @@ This component has no special RTL contract beyond inherited document direction a
 ## Accessibility
 
 Keep native semantics, accessible names, keyboard reachability, focus-visible treatment, and status/error announcements intact when composing this component.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/spinner.tsx: DynamicSpinner, Spinner` |
+| `parts` | `Spinner`, `DynamicSpinner` |
+| `registryDependencies` | None |
+| `features` | `steady arc rotation`, `dynamic arc length`, `slower continuous rotation`, `text color inheritance`, `CSS variable sizing` |
+| `modes` | `steady`, `dynamic` |
+| `tokens` | `--bh-opacity-25`, `--bh-spinner-duration-dynamic`, `--bh-spinner-duration-steady`, `--bh-spinner-easing`, `--bh-spinner-size`, `--bh-spinner-stroke-width` |
+<!-- registry-contract:end -->

package/docs/design-system/components/steps.md

@@ -61,3 +61,17 @@ This component has no special RTL contract beyond inherited document direction a
 ## Accessibility
 
 Keep native semantics, accessible names, keyboard reachability, focus-visible treatment, and status/error announcements intact when composing this component.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/expanded/Steps.tsx: HorizontalStepItem, Steps, VerticalStepItem` |
+| `parts` | `HorizontalStepItem`, `Steps`, `VerticalStepItem` |
+| `registryDependencies` | `button` |
+| `tokens` | `--bh-bg-accent-purple-subtle`, `--bh-bg-inverse`, `--bh-border-accent-purple-strong`, `--bh-border-default`, `--bh-content-default`, `--bh-content-inverse`, `--bh-content-on-brand`, `--bh-content-subtle`, `--bh-control-default`, `--bh-font-family`, `--bh-font-weight-medium`, `--bh-font-weight-regular`, `--bh-font-weight-semibold`, `--bh-icon-stroke-300`, `--bh-interactive-brand-default`, `--bh-interactive-secondary-default`, `--bh-radius-full`, `--bh-radius-sm-4`, `--bh-space-3xl-16`, `--bh-space-5xl-24`, `--bh-space-9xl-64`, `--bh-space-md-8`, `--bh-space-xl-12`, `--bh-space-xs-4`, `--bh-space-xxxs-1`, `--bh-steps-horizontal-width`, `--bh-steps-indicator-panel-width`, `--bh-steps-vertical-width`, `--bh-text-base-letter-spacing`, `--bh-text-body-lg-medium-font-size`, `--bh-text-body-lg-medium-line-height`, `--bh-text-body-md-font-size`, `--bh-text-body-md-line-height`, `--bh-text-body-sm-regular-font-size`, `--bh-text-body-sm-regular-line-height`, `--bh-text-body-xs-regular-font-size` |
+<!-- registry-contract:end -->

package/docs/design-system/components/table.md

@@ -376,7 +376,7 @@ npx banhaten add table
 
 ## API
 
-Public exports: `Table`, `DataTable`.
+Supported runtime exports: `DataTable`, `Table`.
 
 Use the live registry docs for the generated API table and source-backed examples.
 
@@ -395,3 +395,17 @@ Covered source files: `components/expanded/table.css`, `components/expanded/Tabl
 ## RTL Rules
 
 This component has no special RTL contract beyond inherited document direction and logical spacing.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/expanded/Table.tsx: DataTable, Table` |
+| `parts` | `Table`, `DataTable` |
+| `registryDependencies` | `avatar`, `badge`, `button`, `checkbox`, `pagination`, `progress`, `spinner`, `tag`, `toggle`, `toolbar` |
+| `tokens` | `--bh-bg-accent-amber-subtle`, `--bh-bg-accent-fuchsia-subtle`, `--bh-bg-accent-golden-default`, `--bh-bg-brand-default`, `--bh-bg-brand-soft`, `--bh-bg-danger-subtle`, `--bh-bg-default`, `--bh-bg-muted`, `--bh-bg-neutral-medium`, `--bh-bg-neutral-soft`, `--bh-bg-neutral-subtle`, `--bh-bg-raised`, `--bh-bg-success-default`, `--bh-bg-success-subtle`, `--bh-bg-warning-default`, `--bh-bg-warning-subtle`, `--bh-border-brand-strong`, `--bh-border-default`, `--bh-border-focus`, `--bh-border-subtle`, `--bh-content-accent-amber-strong`, `--bh-content-accent-fuchsia-strong`, `--bh-content-brand-default`, `--bh-content-danger-strong`, `--bh-content-default`, `--bh-content-muted`, `--bh-content-on-brand`, `--bh-content-subtle`, `--bh-content-success-default`, `--bh-content-warning-strong`, `--bh-control-default`, `--bh-duration-fast`, `--bh-easing-standard`, `--bh-focus-ring-width`, `--bh-font-family`, `--bh-font-weight-bold`, `--bh-font-weight-semibold`, `--bh-icon-stroke-190`, `--bh-icon-stroke-225`, `--bh-interactive-ghost-hover`, `--bh-opacity-0`, `--bh-opacity-100`, `--bh-opacity-muted`, `--bh-radius-full`, `--bh-radius-lg-8`, `--bh-radius-md-6`, `--bh-radius-sm-4`, `--bh-space-12xl-128`, `--bh-space-16xl-256`, `--bh-space-19xl-384`, `--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-8xl-48`, `--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-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-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-semibold-font-size`, `--bh-text-body-md-semibold-font-weight`, `--bh-text-body-md-semibold-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` |
+<!-- registry-contract:end -->

package/docs/design-system/components/tabs.md

@@ -50,3 +50,20 @@ Open the live component page or run `npx banhaten docs tabs` to inspect source f
 - `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.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/tabs.tsx: Tabs, TabsContent, TabsList, TabsRoot, TabsTrigger` |
+| `parts` | `Tabs`, `TabsRoot`, `TabsList`, `TabsTrigger`, `TabsContent` |
+| `registryDependencies` | None |
+| `features` | `Radix keyboard behavior`, `controlled active index`, `controlled value`, `optional panels`, `full-width tabs` |
+| `sizes` | `md`, `sm`, `xs` |
+| `tokens` | `--bh-bg-default`, `--bh-bg-neutral-subtle`, `--bh-border-default`, `--bh-content-brand-default`, `--bh-content-default`, `--bh-content-subtle`, `--bh-font-family`, `--bh-font-weight-medium`, `--bh-opacity-60`, `--bh-radius-full`, `--bh-radius-lg-8`, `--bh-radius-md-6`, `--bh-space-3xl-16`, `--bh-space-6xl-32`, `--bh-space-7xl-40`, `--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-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`, `--shadow-button-soft` |
+| `variants` | `underline`, `segment`, `rounded` |
+<!-- registry-contract:end -->

package/docs/design-system/components/tag.md

@@ -76,3 +76,20 @@ Open the live component page or run `npx banhaten docs tag` to inspect source fi
 ## Accessibility
 
 This component relies on `@radix-ui/react-slot` for its base accessibility behavior. Keep required labels, titles, descriptions, and focusable trigger/content relationships intact when composing it.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/tag.tsx: Tag, TagAvatar, TagCloseButton, TagDot, TagFlag, TagIcon, tagVariants` |
+| `parts` | `Tag`, `TagDot`, `TagFlag`, `TagAvatar`, `TagIcon`, `TagCloseButton` |
+| `registryDependencies` | None |
+| `sizes` | `xs`, `md`, `lg` |
+| `states` | `default`, `active`, `disabled` |
+| `tokens` | `--bh-bg-accent-green-default`, `--bh-bg-always-dark`, `--bh-bg-always-white`, `--bh-bg-brand-subtle`, `--bh-bg-danger-default`, `--bh-bg-neutral-default`, `--bh-bg-neutral-subtle`, `--bh-border-brand-strong`, `--bh-border-default`, `--bh-border-disabled`, `--bh-border-focus`, `--bh-border-subtle`, `--bh-content-brand-default`, `--bh-content-default`, `--bh-content-disabled`, `--bh-content-muted`, `--bh-content-on-color`, `--bh-control-default`, `--bh-control-md`, `--bh-icon-stroke-200`, `--bh-icon-stroke-225`, `--bh-interactive-ghost-hover`, `--bh-interactive-secondary-default`, `--bh-interactive-secondary-disabled`, `--bh-interactive-secondary-hover`, `--bh-opacity-30`, `--bh-radius-full`, `--bh-radius-xs-2`, `--bh-space-3xl-16`, `--bh-space-4xl-20`, `--bh-space-5xl-24`, `--bh-space-lg-10`, `--bh-space-md-8`, `--bh-space-none`, `--bh-space-sm-6`, `--bh-space-xl-12`, `--bh-space-xs-4`, `--bh-tag-active-border-width`, `--bh-tag-focus-ring-inset`, `--bh-tag-focus-ring-width`, `--bh-text-body-3xs-semibold-font-size`, `--bh-text-body-3xs-semibold-font-weight`, `--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-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`, `--bh-z-raised`, `--shadow-button-focus` |
+| `types` | `simple`, `dot`, `flag`, `avatar`, `icon` |
+<!-- registry-contract:end -->

package/docs/design-system/components/textarea.md

@@ -46,3 +46,19 @@ Open the live component page or run `npx banhaten docs textarea` to inspect sour
 - `inheritsDirection`: true
 - `textAlignment`: Uses text-start and dir="auto" so Arabic and English content align naturally.
 - `spacing`: Uses inherited direction and flex order so labels, helper icons, and tag chips mirror without physical left/right rules.
+
+<!-- registry-contract:start -->
+## Registry Contract
+
+This table is generated from `registry/index.json`; edit the component-owned source under `registry/catalog/components/`, not this table or the compiled index.
+`supportedExports` is the exhaustive runtime import contract grouped by source module. `parts` is an ordered, non-exhaustive anatomy list.
+
+| Field | Values |
+| --- | --- |
+| `supportedExports` | `components/textarea.tsx: Textarea` |
+| `parts` | `Textarea` |
+| `registryDependencies` | None |
+| `modes` | `default`, `tags` |
+| `states` | `placeholder`, `filled`, `disabled` |
+| `tokens` | `--bh-bg-accent-blue-soft`, `--bh-border-danger-strong`, `--bh-border-default`, `--bh-border-disabled`, `--bh-border-focus`, `--bh-border-input`, `--bh-border-subtle`, `--bh-border-width-default`, `--bh-content-accent-blue-strong`, `--bh-content-danger-default`, `--bh-content-default`, `--bh-content-disabled`, `--bh-content-muted`, `--bh-content-subtle`, `--bh-control-md`, `--bh-font-weight-semibold`, `--bh-icon-stroke-225`, `--bh-icon-stroke-250`, `--bh-interactive-input-default`, `--bh-interactive-input-disabled`, `--bh-interactive-secondary-default`, `--bh-interactive-secondary-disabled`, `--bh-opacity-0`, `--bh-opacity-30`, `--bh-opacity-50`, `--bh-radius-full`, `--bh-space-xs-4`, `--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-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`, `--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-textarea-border`, `--bh-textarea-close-button-size`, `--bh-textarea-close-icon-size`, `--bh-textarea-focus-ring-inset`, `--bh-textarea-focus-ring-width`, `--bh-textarea-gap`, `--bh-textarea-helper-icon-size`, `--bh-textarea-icon-size`, `--bh-textarea-inline-gap`, `--bh-textarea-min-height`, `--bh-textarea-padding`, `--bh-textarea-radius`, `--bh-textarea-tag-avatar-font-size`, `--bh-textarea-tag-avatar-size`, `--bh-textarea-tag-height`, `--bh-textarea-width`, `--shadow-component-default`, `--shadow-textarea` |
+<!-- registry-contract:end -->