registry.json

{
  "$schema": "https://ui.shadcn.com/schema/registry.json",
  "name": "Quantumblack Design System Registry",
  "homepage": "https://github.com/mckinsey/quantumblack-design-system",
  "items": [
    {
      "name": "utils",
      "type": "registry:lib",
      "title": "QBDS Utilities",
      "description": "Tailwind class merge with QBDS typography class-group support.",
      "dependencies": ["clsx", "tailwind-merge"],
      "files": [
        {
          "path": "src/lib/utils.ts",
          "type": "registry:lib"
        }
      ]
    },
    {
      "name": "alert",
      "type": "registry:ui",
      "title": "Alert",
      "description": "Displays contextual messages with two layouts (modal, long). Compose with AlertIcon, AlertContent, AlertTitle, AlertDescription, and optional AlertClose.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/button.json",
        "__REGISTRY_URL__/r/icon-shell.json",
        "__REGISTRY_URL__/r/icon.json"
      ],
      "files": [
        {
          "path": "src/components/ui/alert.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "accordion",
      "type": "registry:ui",
      "title": "Accordion",
      "description": "Vertical stack of expand/collapse rows for progressively disclosing grouped content. Defaults to regular size with chevron on the right.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/icon.json",
        "__REGISTRY_URL__/r/icon-shell.json"
      ],
      "files": [
        {
          "path": "src/components/ui/accordion.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "aspect-ratio",
      "type": "registry:ui",
      "title": "Aspect Ratio",
      "description": "Constrains content to a fixed width-to-height ratio. Ideal for images, video placeholders, and media cards.",
      "dependencies": ["@radix-ui/react-aspect-ratio"],
      "registryDependencies": ["__REGISTRY_URL__/r/theme.json"],
      "files": [
        {
          "path": "src/components/ui/aspect-ratio.tsx",
          "type": "registry:file",
          "target": "components/ui/aspect-ratio.tsx"
        }
      ]
    },
    {
      "name": "avatar",
      "type": "registry:ui",
      "title": "Avatar",
      "description": "An avatar component with support for images and tooltips.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/button.json"
      ],
      "files": [
        {
          "path": "src/components/ui/avatar.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "badge",
      "type": "registry:ui",
      "title": "Badge",
      "description": "A badge component.",
      "dependencies": ["@radix-ui/react-slot"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/badge.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "button",
      "type": "registry:ui",
      "title": "Button",
      "description": "Allows users to take actions with a single click or tap.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/button.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "button-group",
      "type": "registry:ui",
      "title": "Button Group",
      "description": "Groups related buttons. spacing=spaced (default, 12px gap) for CTA pairs; spacing=attached (1px gap) for split segments. Includes Text, Separator, and splitIconChevronSizing (narrow chevron width).",
      "dependencies": ["class-variance-authority", "@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/separator.json"
      ],
      "files": [
        {
          "path": "src/components/ui/button-group.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "calendar",
      "type": "registry:ui",
      "title": "Calendar",
      "description": "A date picker component built with react-day-picker.",
      "dependencies": ["react-day-picker", "date-fns"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/button.json",
        "__REGISTRY_URL__/r/icon-shell.json",
        "__REGISTRY_URL__/r/input.json",
        "__REGISTRY_URL__/r/icon.json"
      ],
      "files": [
        {
          "path": "src/components/ui/calendar.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "date-picker",
      "type": "registry:ui",
      "title": "Date Picker",
      "description": "Date picker examples with input integration for single date and date range selection. The Date Picker is built using a composition of the <Popover />, <Input /> and the <Calendar /> components.",
      "dependencies": ["react-day-picker", "date-fns"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/button.json",
        "__REGISTRY_URL__/r/calendar.json",
        "__REGISTRY_URL__/r/field.json",
        "__REGISTRY_URL__/r/icon-shell.json",
        "__REGISTRY_URL__/r/input-group.json",
        "__REGISTRY_URL__/r/popover.json",
        "__REGISTRY_URL__/r/icon.json"
      ],
      "files": [
        {
          "path": "src/app/demo/[name]/ui/date-picker.tsx",
          "type": "registry:example",
          "target": ""
        }
      ]
    },
    {
      "name": "time-input",
      "type": "registry:ui",
      "title": "Time Input",
      "description": "Custom time input with composable segment-based hh:mm entry, keyboard navigation, and clock icon trigger. Exports TimeInputRoot, TimeSegmentInput, TimeSeparator, TimeInputTrigger, and TimeInput convenience wrapper.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/field.json",
        "__REGISTRY_URL__/r/input.json",
        "__REGISTRY_URL__/r/icon-shell.json",
        "__REGISTRY_URL__/r/icon.json"
      ],
      "files": [
        {
          "path": "src/components/ui/time-input.tsx",
          "type": "registry:ui"
        },
        {
          "path": "src/app/demo/[name]/ui/time-input.tsx",
          "type": "registry:example",
          "target": ""
        }
      ]
    },
    {
      "name": "time-picker",
      "type": "registry:ui",
      "title": "Time Picker",
      "description": "Individual components for building time picker interfaces. Includes TimePickerItem (radio list item) and TimePickerList (scrollable list) with size support (sm, default, lg).",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/dropdown-menu.json",
        "__REGISTRY_URL__/r/field.json",
        "__REGISTRY_URL__/r/scroll-area.json",
        "__REGISTRY_URL__/r/time-input.json"
      ],
      "files": [
        {
          "path": "src/components/ui/time-picker.tsx",
          "type": "registry:ui"
        },
        {
          "path": "src/app/demo/[name]/ui/time-picker.tsx",
          "type": "registry:example",
          "target": ""
        }
      ]
    },
    {
      "name": "card",
      "type": "registry:ui",
      "title": "Card",
      "description": "A card component.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/card.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "checkbox",
      "type": "registry:ui",
      "title": "Checkbox",
      "description": "Checkbox and CheckboxGroup for single and multi-select options.",
      "dependencies": ["@base-ui/react", "class-variance-authority"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/checkbox.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "dialog",
      "type": "registry:ui",
      "title": "Dialog",
      "description": "A dialog component.",
      "dependencies": ["@radix-ui/react-dialog"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/icon.json"
      ],
      "files": [
        {
          "path": "src/components/ui/dialog.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "context-menu",
      "type": "registry:ui",
      "title": "Context Menu",
      "description": "A menu triggered by a right-click (or long-press) on a target element. Supports items, checkboxes, radio groups, submenus, shortcuts, and destructive actions.",
      "dependencies": ["@radix-ui/react-context-menu"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/icon.json",
        "__REGISTRY_URL__/r/icon-shell.json"
      ],
      "files": [
        {
          "path": "src/components/ui/context-menu.tsx",
          "type": "registry:ui"
        },
        {
          "path": "src/app/demo/[name]/ui/context-menu.tsx",
          "type": "registry:example",
          "target": ""
        }
      ]
    },
    {
      "name": "dropdown-menu",
      "type": "registry:ui",
      "title": "Dropdown Menu",
      "description": "A contextual menu triggered by a button. Supports items, checkboxes, radio groups, submenus, shortcuts, and destructive actions.",
      "dependencies": ["@radix-ui/react-dropdown-menu"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/button.json",
        "__REGISTRY_URL__/r/toggle.json",
        "__REGISTRY_URL__/r/icon.json",
        "__REGISTRY_URL__/r/icon-shell.json"
      ],
      "files": [
        {
          "path": "src/components/ui/dropdown-menu.tsx",
          "type": "registry:ui"
        },
        {
          "path": "src/app/demo/[name]/ui/dropdown-menu.tsx",
          "type": "registry:example",
          "target": ""
        }
      ]
    },
    {
      "name": "field",
      "type": "registry:ui",
      "title": "Field",
      "description": "Composable form field elements: label, help text, error feedback, and layout primitives (FieldSet, FieldLegend, FieldGroup, Field, FieldLabel, FieldContent, FieldTitle, FieldDescription, FieldError).",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/label.json",
        "__REGISTRY_URL__/r/separator.json"
      ],
      "files": [
        {
          "path": "src/components/ui/field.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "form",
      "type": "registry:example",
      "title": "Form",
      "description": "Form recipes built on the Field primitive. Includes a React Hook Form + zod example (stacked layout) and a TanStack Form + zod example (inline layout) with header, sectioned fields (text, date, time, textarea, checkboxes), and submit/cancel actions.",
      "dependencies": [
        "react-hook-form",
        "@hookform/resolvers",
        "@tanstack/react-form",
        "zod",
        "date-fns"
      ],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/field.json",
        "__REGISTRY_URL__/r/button.json",
        "__REGISTRY_URL__/r/button-group.json",
        "__REGISTRY_URL__/r/input.json",
        "__REGISTRY_URL__/r/input-group.json",
        "__REGISTRY_URL__/r/calendar.json",
        "__REGISTRY_URL__/r/popover.json",
        "__REGISTRY_URL__/r/textarea.json",
        "__REGISTRY_URL__/r/time-input.json",
        "__REGISTRY_URL__/r/time-picker.json",
        "__REGISTRY_URL__/r/dropdown-menu.json",
        "__REGISTRY_URL__/r/checkbox.json",
        "__REGISTRY_URL__/r/icon-shell.json"
      ],
      "files": [
        {
          "path": "src/app/demo/[name]/ui/form.tsx",
          "type": "registry:example",
          "target": ""
        },
        {
          "path": "src/app/demo/[name]/ui/form-examples.tsx",
          "type": "registry:example",
          "target": ""
        }
      ]
    },
    {
      "name": "icon",
      "type": "registry:ui",
      "title": "Icon",
      "description": "Material Symbols Sharp icon via variable font. Optical-size-matched per QBDS size (sm/default/lg).",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "css": {
        "@import": "url('https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL,GRAD@20..48,300..400,0,0&display=block')",
        "@layer base": {
          ".material-symbols-sharp": {
            "font-family": "'Material Symbols Sharp'",
            "font-weight": "normal",
            "font-style": "normal",
            "letter-spacing": "normal",
            "text-transform": "none",
            "white-space": "nowrap",
            "word-wrap": "normal",
            "direction": "ltr",
            "font-feature-settings": "'liga'",
            "-webkit-font-smoothing": "antialiased"
          }
        }
      },
      "files": [
        {
          "path": "src/components/ui/icon.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "icon-shell",
      "type": "registry:ui",
      "title": "Icon Shell",
      "description": "Wraps Icon with QBDS size, tone, and opacity. variant for static icons; hoverable for icon-only buttons. disabled overrides styling.",
      "dependencies": ["@radix-ui/react-slot"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/icon.json"
      ],
      "files": [
        {
          "path": "src/components/ui/icon-shell.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "input",
      "type": "registry:ui",
      "title": "Input",
      "description": "A text input field with support for variants (default, inline) and sizes (small, default, large).",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/input.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "input-group",
      "type": "registry:ui",
      "title": "Input Group",
      "description": "A composite input component with support for icons, buttons, and text addons.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/input.json",
        "__REGISTRY_URL__/r/button.json",
        "__REGISTRY_URL__/r/textarea.json"
      ],
      "files": [
        {
          "path": "src/components/ui/input-group.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "combobox",
      "type": "registry:ui",
      "title": "Combobox",
      "description": "Autocomplete input with a list of suggestions. Supports sizes (sm, default, lg), inline variant, and input group addons.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/input-group.json",
        "__REGISTRY_URL__/r/input.json",
        "__REGISTRY_URL__/r/button.json",
        "__REGISTRY_URL__/r/icon.json"
      ],
      "files": [
        {
          "path": "src/components/ui/combobox.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "label",
      "type": "registry:ui",
      "title": "Label",
      "description": "A component that displays a label for form elements.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/label.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "popover",
      "type": "registry:ui",
      "title": "Popover",
      "description": "A popover component.",
      "dependencies": ["@radix-ui/react-popover"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/popover.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "radio-group",
      "type": "registry:ui",
      "title": "Radio Group",
      "description": "A radio group component.",
      "dependencies": ["@base-ui/react", "class-variance-authority"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/radio-group.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "segmented-controls",
      "type": "registry:ui",
      "title": "Segmented Controls",
      "description": "Single-select segmented control with secondary-filled and ghost variants across four sizes.",
      "dependencies": ["@radix-ui/react-toggle-group"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/segmented-controls.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "select",
      "type": "registry:ui",
      "title": "Select",
      "description": "A select component with single and multiple selection support.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/icon.json",
        "__REGISTRY_URL__/r/icon-shell.json",
        "__REGISTRY_URL__/r/input.json"
      ],
      "files": [
        {
          "path": "src/components/ui/select.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "scroll-area",
      "type": "registry:ui",
      "title": "Scroll Area",
      "description": "A scrollable viewport with custom scrollbars, built on Radix Scroll Area primitives.",
      "dependencies": ["@radix-ui/react-scroll-area"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/scroll-area.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "separator",
      "type": "registry:ui",
      "title": "Separator",
      "description": "A visual divider that separates content. Supports horizontal and vertical orientation.",
      "dependencies": ["@radix-ui/react-separator"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/separator.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "sheet",
      "type": "registry:ui",
      "title": "Sheet",
      "description": "Slide-over panel built on Radix Dialog. Used by Sidebar on mobile.",
      "dependencies": ["@radix-ui/react-dialog"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/icon.json"
      ],
      "files": [
        {
          "path": "src/components/ui/sheet.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "skeleton",
      "type": "registry:ui",
      "title": "Skeleton",
      "description": "Placeholder loading state. Used by Sidebar.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/skeleton.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "sidebar",
      "type": "registry:ui",
      "title": "Sidebar",
      "description": "Composable sidebar with a vertical icon-button navbar and optional accordion-based navigation panel",
      "dependencies": [
        "@radix-ui/react-dialog",
        "@radix-ui/react-slot",
        "class-variance-authority"
      ],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/button.json",
        "__REGISTRY_URL__/r/icon.json",
        "__REGISTRY_URL__/r/icon-shell.json",
        "__REGISTRY_URL__/r/separator.json",
        "__REGISTRY_URL__/r/tooltip.json",
        "__REGISTRY_URL__/r/input.json",
        "__REGISTRY_URL__/r/sheet.json",
        "__REGISTRY_URL__/r/skeleton.json"
      ],
      "files": [
        {
          "path": "src/components/ui/sidebar.tsx",
          "type": "registry:ui"
        },
        {
          "path": "src/components/ui/sidebar-nav.tsx",
          "type": "registry:ui"
        },
        {
          "path": "src/hooks/use-mobile.ts",
          "type": "registry:file",
          "target": "hooks/use-mobile.ts"
        }
      ]
    },
    {
      "name": "slider",
      "type": "registry:ui",
      "title": "Slider",
      "description": "An input where the user selects a value from within a given range.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/tooltip.json"
      ],
      "files": [
        {
          "path": "src/components/ui/slider.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "sonner",
      "type": "registry:ui",
      "title": "Sonner",
      "description": "A toast notification component.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/button.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/icon.json",
        "__REGISTRY_URL__/r/icon-shell.json"
      ],
      "dependencies": ["sonner", "next-themes"],
      "files": [
        {
          "path": "src/components/ui/sonner.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "switch",
      "type": "registry:ui",
      "title": "Switch",
      "description": "A switch component.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/switch.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "table",
      "type": "registry:ui",
      "title": "Table",
      "description": "A responsive table component.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/icon.json"
      ],
      "files": [
        {
          "path": "src/components/ui/table.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "tabs",
      "type": "registry:ui",
      "title": "Tabs",
      "description": "A responsive tabs component.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/tabs.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "textarea",
      "type": "registry:ui",
      "title": "Textarea",
      "description": "Displays a form textarea or a component that looks like a textarea.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/input.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/textarea.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "theme",
      "type": "registry:theme",
      "title": "Global Theme",
      "description": "Brand themed styles using Tailwind and Shadcn/ui",
      "files": [
        {
          "path": "src/styles/globals.css",
          "type": "registry:file",
          "target": "styles/globals.css"
        }
      ]
    },
    {
      "name": "tooltip",
      "type": "registry:ui",
      "title": "Tooltip",
      "description": "A component that displays informative text when users hover over an element.",
      "dependencies": ["@radix-ui/react-tooltip"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json"
      ],
      "files": [
        {
          "path": "src/components/ui/tooltip.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "tag",
      "type": "registry:ui",
      "title": "Tag",
      "description": "A dismissable tag with icons, variants (primary, secondary, accent, outline, accent-outline), pill shape, and sizes. Leading IconShell color is consumer-managed via tagIconTone (secondary to neutral-inverse).",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/icon.json",
        "__REGISTRY_URL__/r/icon-shell.json"
      ],
      "files": [
        {
          "path": "src/components/ui/tag.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "tag-group",
      "type": "registry:example",
      "title": "Tag Group",
      "description": "Examples of grouped tags (dismissable, with avatars, and toggleable) across sizes, shapes, and outlines.",
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/tag.json",
        "__REGISTRY_URL__/r/tag-toggle.json",
        "__REGISTRY_URL__/r/avatar.json"
      ],
      "files": [
        {
          "path": "src/app/demo/[name]/ui/tag-group.tsx",
          "type": "registry:example",
          "target": ""
        }
      ]
    },
    {
      "name": "tag-toggle",
      "type": "registry:ui",
      "title": "Tag Toggle",
      "description": "A toggleable tag with icons, pill shape, and sizes. Built on Base UI Toggle.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/tag.json"
      ],
      "files": [
        {
          "path": "src/components/ui/tag-toggle.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "toggle",
      "type": "registry:ui",
      "title": "Toggle",
      "description": "A toggle component.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/button.json"
      ],
      "files": [
        {
          "path": "src/components/ui/toggle.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "toggle-group",
      "type": "registry:ui",
      "title": "Toggle Group",
      "description": "Groups toggle buttons for single or multiple selection.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/toggle.json"
      ],
      "files": [
        {
          "path": "src/components/ui/toggle-group.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "toolbar",
      "type": "registry:ui",
      "title": "Toolbar",
      "description": "A container for grouping buttons and controls. Defaults to an unboxed horizontal layout; supports boxed containers, vertical orientation, circle and square shapes, and sm, default, and lg sizes.",
      "dependencies": ["@base-ui/react"],
      "registryDependencies": [
        "__REGISTRY_URL__/r/theme.json",
        "__REGISTRY_URL__/r/utils.json",
        "__REGISTRY_URL__/r/button.json"
      ],
      "files": [
        {
          "path": "src/components/ui/toolbar.tsx",
          "type": "registry:ui"
        }
      ]
    }
  ]
}