banhaten 0.1.2 → 0.2.0

package/registry.json

@@ -0,0 +1,1582 @@
+{
+  "$schema": "https://ui.shadcn.com/schema/registry.json",
+  "name": "banhaten",
+  "homepage": "https://github.com/AhmadGalal85/Banhaten-design-system/tree/main/docs",
+  "items": [
+    {
+      "name": "base",
+      "type": "registry:block",
+      "title": "Banhaten Base",
+      "description": "Banhaten base utilities, direction hook, and generated token stylesheet required by registry components.",
+      "author": "Ahmad Galal",
+      "dependencies": [
+        "@fontsource/ibm-plex-sans-arabic@^5.2.9",
+        "@fontsource/inter@^5.2.8",
+        "class-variance-authority@^0.7.1",
+        "clsx@^2.1.1",
+        "tailwind-merge@^3.3.1"
+      ],
+      "files": [
+        {
+          "path": "registry/utils/cn.ts",
+          "type": "registry:lib",
+          "target": "@lib/utils.ts"
+        },
+        {
+          "path": "registry/hooks/use-direction.ts",
+          "type": "registry:hook",
+          "target": "@hooks/use-direction.ts"
+        },
+        {
+          "path": "registry/guidance/USAGE.md",
+          "type": "registry:file",
+          "target": ".banhaten/USAGE.md"
+        },
+        {
+          "path": "registry/styles/globals.css",
+          "type": "registry:style",
+          "target": "app/globals.css"
+        }
+      ]
+    },
+    {
+      "name": "accordion",
+      "type": "registry:component",
+      "title": "Accordion",
+      "description": "Accessible disclosure primitive with single or multiple expansion, Banhaten variants, size scale, animation, and RTL-safe text alignment.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-accordion@^1.2.12",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/accordion.tsx",
+          "type": "registry:component",
+          "target": "@ui/accordion.tsx"
+        }
+      ]
+    },
+    {
+      "name": "aspect-ratio",
+      "type": "registry:component",
+      "title": "Aspect Ratio",
+      "description": "Radix AspectRatio wrapper for fixed-format media, screenshots, previews, and product surfaces with Banhaten radius and neutral background tokens.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-aspect-ratio@^1.1.11"
+      ],
+      "files": [
+        {
+          "path": "registry/components/aspect-ratio.tsx",
+          "type": "registry:component",
+          "target": "@ui/aspect-ratio.tsx"
+        }
+      ]
+    },
+    {
+      "name": "avatar",
+      "type": "registry:component",
+      "title": "Avatar",
+      "description": "Figma-matched user avatar primitive with image, initials, icon fallback, circular and rounded forms, status dots, call-to-action overlays, stacked group count, size scale, and RTL-safe overlap.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-avatar@^1.1.10",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/avatar.tsx",
+          "type": "registry:component",
+          "target": "@ui/avatar.tsx"
+        },
+        {
+          "path": "registry/assets/avatars/avatar-01.jpg",
+          "type": "registry:file",
+          "target": "@ui/assets/avatars/avatar-01.jpg"
+        }
+      ]
+    },
+    {
+      "name": "badge",
+      "type": "registry:component",
+      "title": "Badge",
+      "description": "Figma Badge primitive with light, outline, and solid styles, semantic accent colors, dot, flag, icon, numeric, optional split trailing actions, and RTL-safe composition.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3",
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/badge.tsx",
+          "type": "registry:component",
+          "target": "@ui/badge.tsx"
+        }
+      ]
+    },
+    {
+      "name": "tag",
+      "type": "registry:component",
+      "title": "Tag",
+      "description": "Figma Tag primitive with simple, dot, flag, avatar, and icon types, default/active/disabled states plus native hover and focus-visible styling, xs/md/lg sizes, optional close button, and RTL-safe composition.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/tag.tsx",
+          "type": "registry:component",
+          "target": "@ui/tag.tsx"
+        }
+      ]
+    },
+    {
+      "name": "attribute",
+      "type": "registry:component",
+      "title": "Attribute",
+      "description": "Figma Attribute Card primitive for semantic description lists, key-value rows, detail cards, status values, copyable values, loading rows, two-column summaries, and RTL-safe layouts.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/attribute.tsx",
+          "type": "registry:component",
+          "target": "@ui/attribute.tsx"
+        }
+      ]
+    },
+    {
+      "name": "button",
+      "type": "registry:component",
+      "title": "Button",
+      "description": "Accessible button primitive with semantic variants, size scale, loading composition, and RTL-safe icon behavior.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "spinner"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3",
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/button.tsx",
+          "type": "registry:component",
+          "target": "@ui/button.tsx"
+        }
+      ]
+    },
+    {
+      "name": "card",
+      "type": "registry:component",
+      "title": "Card",
+      "description": "Token-built card primitive with vertical and horizontal image layouts, full-image treatment, desktop/mobile spacing, Button-composed footer actions, and RTL-safe copy.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/card.tsx",
+          "type": "registry:component",
+          "target": "@ui/card.tsx"
+        },
+        {
+          "path": "registry/assets/images/art-01.jpg",
+          "type": "registry:file",
+          "target": "@ui/assets/images/art-01.jpg"
+        }
+      ]
+    },
+    {
+      "name": "chart",
+      "type": "registry:component",
+      "title": "Chart",
+      "description": "Recharts wrapper with Banhaten chart color tokens, responsive container, tooltip content, legend content, and config-driven color variables.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "recharts@^3.9.2"
+      ],
+      "files": [
+        {
+          "path": "registry/components/chart.tsx",
+          "type": "registry:component",
+          "target": "@ui/chart.tsx"
+        }
+      ]
+    },
+    {
+      "name": "carousel",
+      "type": "registry:component",
+      "title": "Carousel",
+      "description": "Embla-backed carousel with content, item, previous, and next controls, horizontal or vertical orientation, and RTL-safe directional icons.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button"
+      ],
+      "dependencies": [
+        "embla-carousel-react@^8.6.0",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/carousel.tsx",
+          "type": "registry:component",
+          "target": "@ui/carousel.tsx"
+        }
+      ]
+    },
+    {
+      "name": "button-group",
+      "type": "registry:component",
+      "title": "Button Group",
+      "description": "Connected Button Group and Toggle Group primitives with semantic control density, fixed or content-width items, reusable surface styling, RTL-safe spacing, and accessible pressed states.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3",
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/button-group.tsx",
+          "type": "registry:component",
+          "target": "@ui/button-group.tsx"
+        }
+      ]
+    },
+    {
+      "name": "segmented-control",
+      "type": "registry:component",
+      "title": "Segmented Control",
+      "description": "Content-width single or multiple selection control with semantic density, an optional non-interactive label segment, keyboard navigation, pressed states, and RTL support.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button-group"
+      ],
+      "dependencies": [],
+      "files": [
+        {
+          "path": "registry/components/segmented-control.tsx",
+          "type": "registry:component",
+          "target": "@ui/segmented-control.tsx"
+        }
+      ]
+    },
+    {
+      "name": "toggle",
+      "type": "registry:component",
+      "title": "Toggle",
+      "description": "Radix Switch-backed toggle primitive and labeled field composition with sm/md geometry, active and disabled states, optional handle icons, tokenized focus ring, and RTL-safe label placement.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-switch@^1.3.0",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/toggle.tsx",
+          "type": "registry:component",
+          "target": "@ui/toggle.tsx"
+        }
+      ]
+    },
+    {
+      "name": "menu",
+      "type": "registry:component",
+      "title": "Menu",
+      "description": "Radix DropdownMenu-backed, Figma-matched menu surface and composable menu item slots for default, multiline, call-to-action, progress, divider, button, label, caption, badge, switch, avatar, meta text, submenus, and RTL layouts.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-dropdown-menu@^2.1.17",
+        "@radix-ui/react-slot@^1.2.3",
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/menu.tsx",
+          "type": "registry:component",
+          "target": "@ui/menu.tsx"
+        }
+      ]
+    },
+    {
+      "name": "menubar",
+      "type": "registry:component",
+      "title": "Menubar",
+      "description": "Radix Menubar-backed application menu with trigger, content, item, checkbox, radio, label, separator, shortcut, and keyboard navigation parts.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-menubar@^1.1.19",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/menubar.tsx",
+          "type": "registry:component",
+          "target": "@ui/menubar.tsx"
+        }
+      ]
+    },
+    {
+      "name": "command",
+      "type": "registry:component",
+      "title": "Command",
+      "description": "cmdk-backed command menu with search input, grouped results, keyboard navigation, shortcuts, separators, and empty state.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "cmdk@^1.1.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/command.tsx",
+          "type": "registry:component",
+          "target": "@ui/command.tsx"
+        }
+      ]
+    },
+    {
+      "name": "context-menu",
+      "type": "registry:component",
+      "title": "Context Menu",
+      "description": "Radix ContextMenu-backed right-click menu with item, checkbox, radio, label, separator, shortcut, and submenu parts.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-context-menu@^2.3.2",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/context-menu.tsx",
+          "type": "registry:component",
+          "target": "@ui/context-menu.tsx"
+        }
+      ]
+    },
+    {
+      "name": "tooltip",
+      "type": "registry:component",
+      "title": "Tooltip",
+      "description": "Radix Tooltip-backed primitive with Figma-matched dark and default surfaces, small and large sizes, shortcut and close slots, logical pointer positions, tokenized shadows, and RTL-safe layout.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-tooltip@^1.2.9",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/tooltip.tsx",
+          "type": "registry:component",
+          "target": "@ui/tooltip.tsx"
+        }
+      ]
+    },
+    {
+      "name": "popover",
+      "type": "registry:component",
+      "title": "Popover",
+      "description": "Token-built popover primitive with click, focus, and hover-capable triggers, positioned content, optional arrow, alignment and offset controls, close affordance, small to large surfaces, and RTL-safe composition.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-popover@^1.1.19",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/popover.tsx",
+          "type": "registry:component",
+          "target": "@ui/popover.tsx"
+        }
+      ]
+    },
+    {
+      "name": "hover-card",
+      "type": "registry:component",
+      "title": "Hover Card",
+      "description": "Radix HoverCard-backed preview surface for rich hover and focus context with tokenized raised content.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-hover-card@^1.1.18"
+      ],
+      "files": [
+        {
+          "path": "registry/components/hover-card.tsx",
+          "type": "registry:component",
+          "target": "@ui/hover-card.tsx"
+        }
+      ]
+    },
+    {
+      "name": "modal",
+      "type": "registry:component",
+      "title": "Modal",
+      "description": "Radix Dialog-backed modal primitive with Figma Small, Default, and Large sizes, tokenized raised surface, header/body/footer slots, ConfirmModal guardrails, Button actions, Checkbox opt-out, and RTL-safe layout.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "alert-dialog",
+        "button",
+        "checkbox",
+        "spinner"
+      ],
+      "dependencies": [
+        "@radix-ui/react-dialog@^1.1.16",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/modal.tsx",
+          "type": "registry:component",
+          "target": "@ui/modal.tsx"
+        }
+      ]
+    },
+    {
+      "name": "alert-dialog",
+      "type": "registry:component",
+      "title": "Alert Dialog",
+      "description": "Radix AlertDialog-backed confirmation primitive for destructive or consequential actions with tokenized alert surface, semantic intent icon, safe cancel/action buttons, focus management, and RTL-safe layout.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button"
+      ],
+      "dependencies": [
+        "@radix-ui/react-alert-dialog@^1.1.18",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/alert-dialog.tsx",
+          "type": "registry:component",
+          "target": "@ui/alert-dialog.tsx"
+        }
+      ]
+    },
+    {
+      "name": "checkbox",
+      "type": "registry:component",
+      "title": "Checkbox",
+      "description": "Figma-matched checkbox primitive and checkbox card composition with 20px root, 16px control, selected and disabled states, native hover styling, component shadow, body text styles, and RTL-safe layout.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-checkbox@^1.3.3",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/checkbox.tsx",
+          "type": "registry:component",
+          "target": "@ui/checkbox.tsx"
+        }
+      ]
+    },
+    {
+      "name": "collapsible",
+      "type": "registry:component",
+      "title": "Collapsible",
+      "description": "Radix Collapsible wrapper for disclosure sections with tokenized trigger, icon rotation, and content slots.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-collapsible@^1.1.15",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/collapsible.tsx",
+          "type": "registry:component",
+          "target": "@ui/collapsible.tsx"
+        }
+      ]
+    },
+    {
+      "name": "radio-group",
+      "type": "registry:component",
+      "title": "Radio Group",
+      "description": "Native-input radio primitive and group composition with field rows, group label, description, error and disabled states, horizontal and vertical layouts, controlled or uncontrolled value, and RTL-safe tokenized copy.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/radio-group.tsx",
+          "type": "registry:component",
+          "target": "@ui/radio-group.tsx"
+        }
+      ]
+    },
+    {
+      "name": "radio-card",
+      "type": "registry:component",
+      "title": "Radio Card",
+      "description": "Figma Radio Card component with seven content types, default/active/disabled states, native hover styling, RTL variants, system radio indicator, and token-bound spacing, typography, border, and shadow.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/radio-card.tsx",
+          "type": "registry:component",
+          "target": "@ui/radio-card.tsx"
+        }
+      ]
+    },
+    {
+      "name": "divider",
+      "type": "registry:component",
+      "title": "Divider",
+      "description": "Figma-matched divider primitive with horizontal and vertical directions plus solid and dotted types.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/divider.tsx",
+          "type": "registry:component",
+          "target": "@ui/divider.tsx"
+        }
+      ]
+    },
+    {
+      "name": "pagination",
+      "type": "registry:component",
+      "title": "Pagination",
+      "description": "Figma-matched pagination primitive with numeric, simple, and summary layouts, soft and ghost styles, exact 32px controls, caption variants, and explicit localized messages.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/pagination.tsx",
+          "type": "registry:component",
+          "target": "@ui/pagination.tsx"
+        }
+      ]
+    },
+    {
+      "name": "toolbar",
+      "type": "registry:component",
+      "title": "Toolbar",
+      "description": "Figma Filter Toolbar primitive with eight filter/action styles, search fields, select triggers, icon actions, chips, selected-count badges, desktop/mobile wrapping, and RTL-safe composition.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "kbd"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/toolbar.tsx",
+          "type": "registry:component",
+          "target": "@ui/toolbar.tsx"
+        }
+      ]
+    },
+    {
+      "name": "social-button",
+      "type": "registry:component",
+      "title": "Social Button",
+      "description": "Social sign-in button primitive with Figma-matched platform styles, solid and outlined variants, icon-only mode, native focus-visible styling, and explicit localized messages.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/social-button.tsx",
+          "type": "registry:component",
+          "target": "@ui/social-button.tsx"
+        }
+      ]
+    },
+    {
+      "name": "input",
+      "type": "registry:component",
+      "title": "Input",
+      "description": "Tokenized input field with semantic control density, labels, helper and error text, explicit icons, shared keyboard shortcuts, add-ons, tags, default and soft styles, and RTL states.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "kbd"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/input-content.ts",
+          "type": "registry:component",
+          "target": "@ui/input-content.ts"
+        },
+        {
+          "path": "registry/components/input.tsx",
+          "type": "registry:component",
+          "target": "@ui/input.tsx"
+        }
+      ]
+    },
+    {
+      "name": "input-group",
+      "type": "registry:component",
+      "title": "Input Group",
+      "description": "Grouped input shell for protocol add-ons, inline actions, prefixes, suffixes, compact field rows, and RTL-safe native input composition.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3",
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/input-group.tsx",
+          "type": "registry:component",
+          "target": "@ui/input-group.tsx"
+        }
+      ]
+    },
+    {
+      "name": "label",
+      "type": "registry:component",
+      "title": "Label",
+      "description": "Radix Label-backed accessible label primitive with required markers, optional text, tone variants, disabled state styling, and RTL-safe copy.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-label@^2.1.11",
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/label.tsx",
+          "type": "registry:component",
+          "target": "@ui/label.tsx"
+        }
+      ]
+    },
+    {
+      "name": "kbd",
+      "type": "registry:component",
+      "title": "Kbd",
+      "description": "Keyboard key and platform-aware shortcut primitives for search fields, command rows, and help text with shared tokenized surfaces.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/kbd.tsx",
+          "type": "registry:component",
+          "target": "@ui/kbd.tsx"
+        }
+      ]
+    },
+    {
+      "name": "item",
+      "type": "registry:component",
+      "title": "Item",
+      "description": "Composable Banhaten list item with media, content, title, description, actions, grouping, separators, three surface variants, three sizes, and RTL-safe logical layout.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3",
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/item.tsx",
+          "type": "registry:component",
+          "target": "@ui/item.tsx"
+        }
+      ]
+    },
+    {
+      "name": "field",
+      "type": "registry:component",
+      "title": "Field",
+      "description": "Accessible form field composition with label, control slot, description, error message, grouped fields, fieldsets, validation state, and responsive or horizontal layout.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "label"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3"
+      ],
+      "files": [
+        {
+          "path": "registry/components/field.tsx",
+          "type": "registry:component",
+          "target": "@ui/field.tsx"
+        }
+      ]
+    },
+    {
+      "name": "input-otp",
+      "type": "registry:component",
+      "title": "Input Otp",
+      "description": "One-time passcode input composed from the Banhaten Input surface, control typography, labels, helper text, tokenized slot gaps, paste handling, grouped slots, masked values, and RTL-aware keyboard navigation.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "input"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/input-otp.tsx",
+          "type": "registry:component",
+          "target": "@ui/input-otp.tsx"
+        }
+      ]
+    },
+    {
+      "name": "select",
+      "type": "registry:component",
+      "title": "Select",
+      "description": "Radix Select-backed field and menu primitives with semantic control density, default and soft trigger styles, error/filled/disabled states, checkbox and check selection, and rich item media.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-select@^2.3.0",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/select-content.tsx",
+          "type": "registry:component",
+          "target": "@ui/select-content.tsx"
+        },
+        {
+          "path": "registry/components/select.tsx",
+          "type": "registry:component",
+          "target": "@ui/select.tsx"
+        }
+      ]
+    },
+    {
+      "name": "native-select",
+      "type": "registry:component",
+      "title": "Native Select",
+      "description": "Tokenized native select field for platform forms, mobile fallback, lightweight option sets, validation state, helper text, and RTL layout.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "label"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/native-select.tsx",
+          "type": "registry:component",
+          "target": "@ui/native-select.tsx"
+        }
+      ]
+    },
+    {
+      "name": "sheet",
+      "type": "registry:component",
+      "title": "Sheet",
+      "description": "Radix Dialog-based edge panel with logical start/end placement, top and bottom placement, size variants, overlay, close control, header, body, footer, and RTL-safe layout.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-dialog@^1.1.16",
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/sheet.tsx",
+          "type": "registry:component",
+          "target": "@ui/sheet.tsx"
+        }
+      ]
+    },
+    {
+      "name": "sidebar",
+      "type": "registry:component",
+      "title": "Sidebar",
+      "description": "Composable app sidebar with controlled or uncontrolled collapse state, grouped menu items, logical start/end placement, RTL mirroring, and generated sidebar tokens.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slot@^1.2.3",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/sidebar.tsx",
+          "type": "registry:component",
+          "target": "@ui/sidebar.tsx"
+        }
+      ]
+    },
+    {
+      "name": "navigation-menu",
+      "type": "registry:component",
+      "title": "Navigation Menu",
+      "description": "Radix NavigationMenu-backed top navigation with trigger, content, link, viewport, and indicator parts.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-navigation-menu@^1.2.17",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/navigation-menu.tsx",
+          "type": "registry:component",
+          "target": "@ui/navigation-menu.tsx"
+        }
+      ]
+    },
+    {
+      "name": "scroll-area",
+      "type": "registry:component",
+      "title": "Scroll Area",
+      "description": "Radix ScrollArea wrapper with tokenized viewport, scrollbar, thumb, and corner styling for bounded panels and menus.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-scroll-area@^1.2.13"
+      ],
+      "files": [
+        {
+          "path": "registry/components/scroll-area.tsx",
+          "type": "registry:component",
+          "target": "@ui/scroll-area.tsx"
+        }
+      ]
+    },
+    {
+      "name": "resizable",
+      "type": "registry:component",
+      "title": "Resizable",
+      "description": "react-resizable-panels-backed split pane primitive with horizontal and vertical panel groups plus tokenized resize handle.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0",
+        "react-resizable-panels@^4.12.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/resizable.tsx",
+          "type": "registry:component",
+          "target": "@ui/resizable.tsx"
+        }
+      ]
+    },
+    {
+      "name": "autocomplete",
+      "type": "registry:component",
+      "title": "Autocomplete",
+      "description": "Composable autocomplete and combobox field built from Banhaten Input, Select menu items, and Tag selections with filtering, single or multiple selection, keyboard navigation, error/disabled states, and RTL-safe layout.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "input",
+        "popover",
+        "select",
+        "tag"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/autocomplete.tsx",
+          "type": "registry:component",
+          "target": "@ui/autocomplete.tsx"
+        }
+      ]
+    },
+    {
+      "name": "date-picker",
+      "type": "registry:component",
+      "title": "Date Picker",
+      "description": "Calendar, Range Calendar, Date Picker, and Date Range Picker suite with semantic trigger density, explicit calendar affordances, presets, time, range selection, and RTL support.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "popover"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/date-picker.tsx",
+          "type": "registry:component",
+          "target": "@ui/date-picker.tsx"
+        },
+        {
+          "path": "registry/components/date-picker-state.ts",
+          "type": "registry:component",
+          "target": "@ui/date-picker-state.ts"
+        }
+      ]
+    },
+    {
+      "name": "slider",
+      "type": "registry:component",
+      "title": "Slider",
+      "description": "Figma-matched accessible range control built on Radix Slider with single and double-node values, text and tooltip indicators, RTL, vertical, disabled, ticked, tone, size, pill, and keyboard-ready states.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slider@^1.4.0",
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/slider.tsx",
+          "type": "registry:component",
+          "target": "@ui/slider.tsx"
+        }
+      ]
+    },
+    {
+      "name": "progress",
+      "type": "registry:component",
+      "title": "Progress",
+      "description": "Read-only progress meter with Figma-matched value fill, sm/lg track sizes, top/bottom/helper/inline label compositions, tokenized indicator colors, helper text, info icon, spinner, and RTL-safe start anchoring.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/progress.tsx",
+          "type": "registry:component",
+          "target": "@ui/progress.tsx"
+        }
+      ]
+    },
+    {
+      "name": "progress-slider",
+      "type": "registry:component",
+      "title": "Progress Slider",
+      "description": "Start-anchored progress slider built on Radix Slider where the filled surface grows from the start edge and the grip handle stays on the trailing edge.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-slider@^1.4.0",
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/progress-slider.tsx",
+          "type": "registry:component",
+          "target": "@ui/progress-slider.tsx"
+        }
+      ]
+    },
+    {
+      "name": "textarea",
+      "type": "registry:component",
+      "title": "Textarea",
+      "description": "Figma-matched textarea field with label, helper and error text, default and tags modes, placeholder, filled, disabled, and RTL states.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/textarea.tsx",
+          "type": "registry:component",
+          "target": "@ui/textarea.tsx"
+        }
+      ]
+    },
+    {
+      "name": "skeleton",
+      "type": "registry:component",
+      "title": "Skeleton",
+      "description": "Token-built loading placeholder primitive with text, avatar, button, input, card, list, table, and form compositions, shimmer motion, reduced-motion fallback, and RTL-safe direction.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1"
+      ],
+      "files": [
+        {
+          "path": "registry/components/skeleton.css",
+          "type": "registry:style",
+          "target": "@ui/skeleton.css"
+        },
+        {
+          "path": "registry/components/skeleton.tsx",
+          "type": "registry:component",
+          "target": "@ui/skeleton.tsx"
+        }
+      ]
+    },
+    {
+      "name": "spinner",
+      "type": "registry:component",
+      "title": "Spinner",
+      "description": "Small composable loading indicators with a steady Spinner and a smoother variable-arc DynamicSpinner, both inheriting text color and CSS variable sizing.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [],
+      "files": [
+        {
+          "path": "registry/components/spinner.tsx",
+          "type": "registry:component",
+          "target": "@ui/spinner.tsx"
+        }
+      ]
+    },
+    {
+      "name": "toast",
+      "type": "registry:component",
+      "title": "Toast",
+      "description": "Sonner-style transient feedback primitive with Banhaten token styling, success, danger, warning, info, and default intents, action slot support, and logical RTL placement.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "sonner@^2.0.7"
+      ],
+      "files": [
+        {
+          "path": "registry/components/toast.tsx",
+          "type": "registry:component",
+          "target": "@ui/toast.tsx"
+        }
+      ]
+    },
+    {
+      "name": "activity-feed",
+      "type": "registry:block",
+      "title": "Activity Feed",
+      "description": "Expanded activity feed composition with avatar indicators, status dots, captions, action buttons, slot rows, timestamps, links, and RTL copy.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button"
+      ],
+      "dependencies": [],
+      "files": [
+        {
+          "path": "registry/components/expanded/activityFeed.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/activityFeed.css"
+        },
+        {
+          "path": "registry/components/expanded/ActivityFeed.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/ActivityFeed.tsx"
+        },
+        {
+          "path": "registry/assets/activity-feed-avatar.png",
+          "type": "registry:file",
+          "target": "@ui/assets/activity-feed-avatar.png"
+        }
+      ]
+    },
+    {
+      "name": "alert",
+      "type": "registry:component",
+      "title": "Alert",
+      "description": "Contextual feedback primitive with danger, success, warning, info, neutral, compact, expandable, action, close, and RTL variants.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "class-variance-authority@^0.7.1",
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/alert.tsx",
+          "type": "registry:component",
+          "target": "@ui/alert.tsx"
+        }
+      ]
+    },
+    {
+      "name": "banner",
+      "type": "registry:block",
+      "title": "Banner",
+      "description": "Expanded banner system with slim, inline action, single action, input, floating, full-width, brand, grey, brand-light, and RTL variants.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button",
+        "input"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/banner.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/banner.css"
+        },
+        {
+          "path": "registry/components/expanded/Banner.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/Banner.tsx"
+        }
+      ]
+    },
+    {
+      "name": "catalog-components",
+      "type": "registry:block",
+      "title": "Catalog Components",
+      "description": "Expanded catalog showcase with breadcrumbs, catalog-only content dividers, tag previews, file upload states, and table previews.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "breadcrumbs",
+        "button",
+        "file-upload",
+        "table",
+        "tag"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/catalogComponentsShowcase.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/catalogComponentsShowcase.css"
+        },
+        {
+          "path": "registry/components/expanded/CatalogComponentsShowcase.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/CatalogComponentsShowcase.tsx"
+        },
+        {
+          "path": "registry/components/expanded/divider.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/divider.css"
+        },
+        {
+          "path": "registry/components/expanded/CatalogDivider.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/CatalogDivider.tsx"
+        }
+      ]
+    },
+    {
+      "name": "breadcrumbs",
+      "type": "registry:block",
+      "title": "Breadcrumbs",
+      "description": "Expanded breadcrumbs navigation with default, raised, icon, overflow, separator, and RTL variants.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/breadcrumbs.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/breadcrumbs.css"
+        },
+        {
+          "path": "registry/components/expanded/Breadcrumbs.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/Breadcrumbs.tsx"
+        }
+      ]
+    },
+    {
+      "name": "file-upload",
+      "type": "registry:block",
+      "title": "File Upload",
+      "description": "Expanded file upload composition with drag-and-drop zones, file rows, upload states, disabled behavior, and RTL direction.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/fileUpload.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/fileUpload.css"
+        },
+        {
+          "path": "registry/components/expanded/FileUpload.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/FileUpload.tsx"
+        }
+      ]
+    },
+    {
+      "name": "table",
+      "type": "registry:block",
+      "title": "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.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "avatar",
+        "badge",
+        "button",
+        "checkbox",
+        "pagination",
+        "progress",
+        "spinner",
+        "tag",
+        "toggle",
+        "toolbar"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/table.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/table.css"
+        },
+        {
+          "path": "registry/components/expanded/Table.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/Table.tsx"
+        }
+      ]
+    },
+    {
+      "name": "empty-state",
+      "type": "registry:block",
+      "title": "Empty State",
+      "description": "Expanded empty and result state composition with neutral icon halo, title, supporting copy, optional Button actions, alignment, compact density, custom icons, and RTL-safe text.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/emptyState.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/emptyState.css"
+        },
+        {
+          "path": "registry/components/expanded/EmptyState.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/EmptyState.tsx"
+        }
+      ]
+    },
+    {
+      "name": "onboarding-step",
+      "type": "registry:block",
+      "title": "Onboarding Step",
+      "description": "Expanded onboarding step list item with finished, active, and inactive progress states for compact setup flows in LTR and RTL.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/onboardingStepListItem.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/onboardingStepListItem.css"
+        },
+        {
+          "path": "registry/components/expanded/OnboardingStepListItem.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/OnboardingStepListItem.tsx"
+        }
+      ]
+    },
+    {
+      "name": "page-header",
+      "type": "registry:block",
+      "title": "Page Header",
+      "description": "Expanded page header composition with breadcrumbs, metadata, description copy, action groups, responsive layout, and optional local tabs.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "tabs"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/pageHeader.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/pageHeader.css"
+        },
+        {
+          "path": "registry/components/expanded/PageHeader.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/PageHeader.tsx"
+        }
+      ]
+    },
+    {
+      "name": "slideout",
+      "type": "registry:block",
+      "title": "Slideout",
+      "description": "Expanded slideout panel with desktop and mobile breakpoints, header and footer actions, slotted content, and RTL coverage.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/slideout.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/slideout.css"
+        },
+        {
+          "path": "registry/components/expanded/Slideout.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/Slideout.tsx"
+        }
+      ]
+    },
+    {
+      "name": "steps",
+      "type": "registry:block",
+      "title": "Steps",
+      "description": "Expanded steps composition with horizontal and vertical progress indicators, icon markers, number markers, item alignment, and RTL layouts.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base",
+        "button"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/steps.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/steps.css"
+        },
+        {
+          "path": "registry/components/expanded/Steps.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/Steps.tsx"
+        }
+      ]
+    },
+    {
+      "name": "tabs",
+      "type": "registry:component",
+      "title": "Tabs",
+      "description": "Radix Tabs-backed local navigation primitive with underline, segmented, and rounded treatments across size, width behavior, controlled state, LTR, and RTL.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "@radix-ui/react-tabs@^1.1.16"
+      ],
+      "files": [
+        {
+          "path": "registry/components/tabs.css",
+          "type": "registry:style",
+          "target": "@ui/tabs.css"
+        },
+        {
+          "path": "registry/components/tabs.tsx",
+          "type": "registry:component",
+          "target": "@ui/tabs.tsx"
+        }
+      ]
+    },
+    {
+      "name": "timeline",
+      "type": "registry:block",
+      "title": "Timeline",
+      "description": "Expanded timeline composition with vertical and horizontal orientations, dates, captions, active states, finished states, item variants, and RTL layouts.",
+      "author": "Ahmad Galal",
+      "registryDependencies": [
+        "base"
+      ],
+      "dependencies": [
+        "lucide-react@^1.17.0"
+      ],
+      "files": [
+        {
+          "path": "registry/components/expanded/timeline.css",
+          "type": "registry:style",
+          "target": "@ui/expanded/timeline.css"
+        },
+        {
+          "path": "registry/components/expanded/Timeline.tsx",
+          "type": "registry:component",
+          "target": "@ui/expanded/Timeline.tsx"
+        }
+      ]
+    }
+  ]
+}