@gv-tech/design-system 2.4.0 → 2.5.1

package/dist/registry/aspect-ratio.json

@@ -1,13 +0,0 @@
-{
-  "name": "aspect-ratio",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/aspect-ratio.tsx",
-      "content": "import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';\n\nconst AspectRatio = AspectRatioPrimitive.Root;\n\nexport { AspectRatio };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/aspect-ratio.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "aspect-ratio.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/aspect-ratio.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport { describe, expect, it } from 'vitest';\nimport { AspectRatio } from './aspect-ratio';\n\ndescribe('AspectRatio', () => {\n  it('renders correctly', () => {\n    const { container } = render(\n      <AspectRatio ratio={16 / 9}>\n        <img src=\"test.jpg\" alt=\"test\" />\n      </AspectRatio>,\n    );\n\n    const img = screen.getByRole('img');\n    expect(img).toBeInTheDocument();\n\n    // Radix AspectRatio renders a wrapper with padding-bottom based on ratio\n    // We can check if the wrapper style is applied\n    const wrapper = container.firstChild;\n    expect(wrapper).toHaveStyle({ paddingBottom: expect.stringMatching(/%$/) });\n  });\n\n  it('renders with custom ratio', () => {\n    const { container } = render(\n      <AspectRatio ratio={1 / 1}>\n        <div>Square</div>\n      </AspectRatio>,\n    );\n\n    expect(screen.getByText('Square')).toBeInTheDocument();\n    const wrapper = container.firstChild;\n    // 1/1 ratio should be 100% padding-bottom\n    expect(wrapper).toHaveStyle({ paddingBottom: '100%' });\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/avatar.json

@@ -1,13 +0,0 @@
-{
-  "name": "avatar",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/avatar.tsx",
-      "content": "import * as AvatarPrimitive from '@radix-ui/react-avatar';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst Avatar = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Root\n    ref={ref}\n    className={cn('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className)}\n    {...props}\n  />\n));\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n\nconst AvatarImage = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Image>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Image ref={ref} className={cn('aspect-square h-full w-full', className)} {...props} />\n));\nAvatarImage.displayName = AvatarPrimitive.Image.displayName;\n\nconst AvatarFallback = React.forwardRef<\n  React.ElementRef<typeof AvatarPrimitive.Fallback>,\n  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>\n>(({ className, ...props }, ref) => (\n  <AvatarPrimitive.Fallback\n    ref={ref}\n    className={cn('flex h-full w-full items-center justify-center rounded-full bg-muted', className)}\n    {...props}\n  />\n));\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;\n\nexport { Avatar, AvatarFallback, AvatarImage };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/avatar.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "avatar.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/avatar.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport { describe, expect, it } from 'vitest';\nimport { Avatar, AvatarFallback, AvatarImage } from './avatar';\n\ndescribe('Avatar', () => {\n  it('renders correctly', () => {\n    render(\n      <Avatar>\n        <AvatarImage src=\"https://github.com/shadcn.png\" alt=\"@shadcn\" />\n        <AvatarFallback>CN</AvatarFallback>\n      </Avatar>,\n    );\n\n    // In JSDOM, image loading might not happen immediately or at all without mocking.\n    // However, the elements should be in the DOM.\n    // Radix conditionally renders Image or Fallback.\n    // By default, it might render Image and hide Fallback, or vice versa depending on loading.\n\n    // Let's check that the root is present\n    const avatar = screen.getByText('CN')?.parentElement || screen.getByRole('img').parentElement;\n    expect(avatar).toBeInTheDocument();\n  });\n\n  it('renders fallback when image is missing', () => {\n    render(\n      <Avatar>\n        <AvatarFallback>CN</AvatarFallback>\n      </Avatar>,\n    );\n\n    expect(screen.getByText('CN')).toBeInTheDocument();\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/badge.json

@@ -1,13 +0,0 @@
-{
-  "name": "badge",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/badge.tsx",
-      "content": "import { cva, type VariantProps } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst badgeVariants = cva(\n  'inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',\n  {\n    variants: {\n      variant: {\n        default: 'border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80',\n        secondary: 'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',\n        destructive: 'border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80',\n        outline: 'text-foreground',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\nexport interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {}\n\nfunction Badge({ className, variant, ...props }: BadgeProps) {\n  return <div className={cn(badgeVariants({ variant }), className)} {...props} />;\n}\n\nexport { Badge, badgeVariants };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/badge.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "badge.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/badge.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport { describe, expect, it } from 'vitest';\nimport { Badge } from './badge';\n\ndescribe('Badge', () => {\n  it('renders correctly', () => {\n    render(<Badge>Test Badge</Badge>);\n    expect(screen.getByText('Test Badge')).toBeInTheDocument();\n  });\n\n  it('renders variants', () => {\n    const { rerender, getByText } = render(<Badge variant=\"default\">Default</Badge>);\n    expect(getByText('Default')).toHaveClass('bg-primary');\n\n    rerender(<Badge variant=\"secondary\">Secondary</Badge>);\n    expect(getByText('Secondary')).toHaveClass('bg-secondary');\n\n    rerender(<Badge variant=\"destructive\">Destructive</Badge>);\n    expect(getByText('Destructive')).toHaveClass('bg-destructive');\n\n    rerender(<Badge variant=\"outline\">Outline</Badge>);\n    expect(getByText('Outline')).toHaveClass('text-foreground');\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/breadcrumb.json

@@ -1,13 +0,0 @@
-{
-  "name": "breadcrumb",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/breadcrumb.tsx",
-      "content": "import { Slot } from '@radix-ui/react-slot';\nimport { ChevronRight, MoreHorizontal } from 'lucide-react';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst Breadcrumb = React.forwardRef<\n  HTMLElement,\n  React.ComponentPropsWithoutRef<'nav'> & {\n    separator?: React.ReactNode;\n  }\n>(({ ...props }, ref) => <nav ref={ref} aria-label=\"breadcrumb\" {...props} />);\nBreadcrumb.displayName = 'Breadcrumb';\n\nconst BreadcrumbList = React.forwardRef<HTMLOListElement, React.ComponentPropsWithoutRef<'ol'>>(\n  ({ className, ...props }, ref) => (\n    <ol\n      ref={ref}\n      className={cn(\n        'flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5',\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nBreadcrumbList.displayName = 'BreadcrumbList';\n\nconst BreadcrumbItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n  ({ className, ...props }, ref) => (\n    <li ref={ref} className={cn('inline-flex items-center gap-1.5', className)} {...props} />\n  ),\n);\nBreadcrumbItem.displayName = 'BreadcrumbItem';\n\nconst BreadcrumbLink = React.forwardRef<\n  HTMLAnchorElement,\n  React.ComponentPropsWithoutRef<'a'> & {\n    asChild?: boolean;\n  }\n>(({ asChild, className, ...props }, ref) => {\n  const Comp = asChild ? Slot : 'a';\n\n  return <Comp ref={ref} className={cn('transition-colors hover:text-foreground', className)} {...props} />;\n});\nBreadcrumbLink.displayName = 'BreadcrumbLink';\n\nconst BreadcrumbPage = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<'span'>>(\n  ({ className, ...props }, ref) => (\n    <span\n      ref={ref}\n      role=\"link\"\n      aria-disabled=\"true\"\n      aria-current=\"page\"\n      className={cn('font-normal text-foreground', className)}\n      {...props}\n    />\n  ),\n);\nBreadcrumbPage.displayName = 'BreadcrumbPage';\n\nconst BreadcrumbSeparator = ({ children, className, ...props }: React.ComponentProps<'li'>) => (\n  <li role=\"presentation\" aria-hidden=\"true\" className={cn('[&>svg]:w-3.5 [&>svg]:h-3.5', className)} {...props}>\n    {children ?? <ChevronRight />}\n  </li>\n);\nBreadcrumbSeparator.displayName = 'BreadcrumbSeparator';\n\nconst BreadcrumbEllipsis = ({ className, ...props }: React.ComponentProps<'span'>) => (\n  <span\n    role=\"presentation\"\n    aria-hidden=\"true\"\n    className={cn('flex h-9 w-9 items-center justify-center', className)}\n    {...props}\n  >\n    <MoreHorizontal className=\"h-4 w-4\" />\n    <span className=\"sr-only\">More</span>\n  </span>\n);\nBreadcrumbEllipsis.displayName = 'BreadcrumbElipssis';\n\nexport {\n  Breadcrumb,\n  BreadcrumbEllipsis,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbList,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n};\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/breadcrumb.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "breadcrumb.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/breadcrumb.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport { describe, expect, it } from 'vitest';\nimport {\n  Breadcrumb,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbList,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n} from './breadcrumb';\n\ndescribe('Breadcrumb', () => {\n  it('renders correctly', () => {\n    render(\n      <Breadcrumb>\n        <BreadcrumbList>\n          <BreadcrumbItem>\n            <BreadcrumbLink href=\"/\">Home</BreadcrumbLink>\n          </BreadcrumbItem>\n          <BreadcrumbSeparator />\n          <BreadcrumbItem>\n            <BreadcrumbPage>Page</BreadcrumbPage>\n          </BreadcrumbItem>\n        </BreadcrumbList>\n      </Breadcrumb>,\n    );\n\n    const nav = screen.getByRole('navigation');\n    expect(nav).toBeInTheDocument();\n    expect(nav).toHaveAttribute('aria-label', 'breadcrumb');\n\n    const links = screen.getAllByRole('link');\n    expect(links).toHaveLength(2); // Link and Page (span role=\"link\")\n    expect(links[0]).toHaveAttribute('href', '/');\n    expect(links[1]).toHaveTextContent('Page');\n  });\n\n  it('renders custom separator', () => {\n    render(\n      <Breadcrumb>\n        <BreadcrumbList>\n          <BreadcrumbItem>\n            <BreadcrumbLink>Home</BreadcrumbLink>\n          </BreadcrumbItem>\n          <BreadcrumbSeparator>/</BreadcrumbSeparator>\n          <BreadcrumbItem>\n            <BreadcrumbPage>Page</BreadcrumbPage>\n          </BreadcrumbItem>\n        </BreadcrumbList>\n      </Breadcrumb>,\n    );\n\n    expect(screen.getByText('/')).toBeInTheDocument();\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/button.json

@@ -1,13 +0,0 @@
-{
-  "name": "button",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/button.tsx",
-      "content": "import { Slot } from '@radix-ui/react-slot';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst buttonVariants = cva(\n  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90',\n        destructive: 'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',\n        outline: 'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',\n        secondary: 'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',\n        ghost: 'hover:bg-accent hover:text-accent-foreground',\n        link: 'text-primary underline-offset-4 hover:underline',\n      },\n      size: {\n        default: 'h-9 px-4 py-2',\n        sm: 'h-8 rounded-md px-3 text-xs',\n        lg: 'h-10 rounded-md px-8',\n        icon: 'h-9 w-9',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {\n  asChild?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ className, variant, size, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : 'button';\n    return <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />;\n  },\n);\nButton.displayName = 'Button';\n\nexport { Button, buttonVariants };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/button.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "button.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/button.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { describe, expect, it, vi } from 'vitest';\nimport { Button } from './button';\n\ndescribe('Button', () => {\n  it('renders correctly', () => {\n    render(<Button>Click me</Button>);\n    expect(screen.getByRole('button', { name: /click me/i })).toBeInTheDocument();\n  });\n\n  it('handles click events', async () => {\n    const handleClick = vi.fn();\n    render(<Button onClick={handleClick}>Click me</Button>);\n\n    await userEvent.click(screen.getByRole('button', { name: /click me/i }));\n    expect(handleClick).toHaveBeenCalledTimes(1);\n  });\n\n  it('can be disabled', () => {\n    render(<Button disabled>Click me</Button>);\n    expect(screen.getByRole('button', { name: /click me/i })).toBeDisabled();\n  });\n\n  it('supports asChild prop', () => {\n    render(\n      <Button asChild>\n        <a href=\"/test\">Link Button</a>\n      </Button>,\n    );\n\n    const link = screen.getByRole('link', { name: /link button/i });\n    expect(link).toBeInTheDocument();\n    expect(link).toHaveAttribute('href', '/test');\n  });\n\n  describe('Variants', () => {\n    const variants = ['default', 'destructive', 'outline', 'secondary', 'ghost', 'link'] as const;\n\n    variants.forEach((variant) => {\n      it(`renders ${variant} variant`, () => {\n        render(<Button variant={variant}>{variant}</Button>);\n        const button = screen.getByRole('button', { name: variant });\n        expect(button).toBeInTheDocument();\n        // We could check for specific classes here, but that might make tests too brittle\n        // checking the role and content presence is a good baseline\n      });\n    });\n  });\n\n  describe('Sizes', () => {\n    const sizes = ['default', 'sm', 'lg', 'icon'] as const;\n\n    sizes.forEach((size) => {\n      it(`renders ${size} size`, () => {\n        render(<Button size={size}>{size}</Button>);\n        const button = screen.getByRole('button', { name: size });\n        expect(button).toBeInTheDocument();\n      });\n    });\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/calendar.json

@@ -1,13 +0,0 @@
-{
-  "name": "calendar",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/calendar.tsx",
-      "content": "import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';\nimport * as React from 'react';\nimport { DayButton, DayPicker, getDefaultClassNames } from 'react-day-picker';\n\nimport { Button, buttonVariants } from '@/components/ui/button';\nimport { cn } from '@/lib/utils';\n\nfunction Calendar({\n  className,\n  classNames,\n  showOutsideDays = true,\n  captionLayout = 'label',\n  buttonVariant = 'ghost',\n  formatters,\n  components,\n  ...props\n}: React.ComponentProps<typeof DayPicker> & {\n  buttonVariant?: React.ComponentProps<typeof Button>['variant'];\n}) {\n  const defaultClassNames = getDefaultClassNames();\n\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      className={cn(\n        'bg-background group/calendar p-3 [--cell-size:2.5rem] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent',\n        String.raw`rtl:**:[.rdp-button\\_next>svg]:rotate-180`,\n        String.raw`rtl:**:[.rdp-button\\_previous>svg]:rotate-180`,\n        'relative',\n        className,\n      )}\n      captionLayout={captionLayout}\n      formatters={{\n        formatMonthDropdown: (date) => date.toLocaleString('default', { month: 'short' }),\n        ...formatters,\n      }}\n      classNames={{\n        root: cn('w-fit', defaultClassNames.root),\n        months: cn('relative flex flex-col gap-4 md:flex-row', defaultClassNames.months),\n        month: cn('flex w-full flex-col gap-4', defaultClassNames.month),\n        nav: cn(\n          'absolute inset-x-0 top-2 flex items-center justify-between pointer-events-none px-2',\n          defaultClassNames.nav,\n        ),\n        button_previous: cn(\n          buttonVariants({ variant: buttonVariant }),\n          'h-7 w-7 select-none p-0 aria-disabled:opacity-50 pointer-events-auto',\n          defaultClassNames.button_previous,\n        ),\n        button_next: cn(\n          buttonVariants({ variant: buttonVariant }),\n          'h-7 w-7 select-none p-0 aria-disabled:opacity-50 pointer-events-auto',\n          defaultClassNames.button_next,\n        ),\n        month_caption: cn(\n          'flex h-[--cell-size] w-full items-center justify-center text-sm font-medium',\n          defaultClassNames.month_caption,\n        ),\n        dropdowns: cn(\n          'flex h-[--cell-size] w-full items-center justify-center gap-1.5 text-sm font-medium',\n          defaultClassNames.dropdowns,\n        ),\n        dropdown_root: cn(\n          'has-focus:border-ring border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-[3px] relative rounded-md border',\n          defaultClassNames.dropdown_root,\n        ),\n        dropdown: cn('bg-popover absolute inset-0 opacity-0', defaultClassNames.dropdown),\n        caption_label: cn(\n          'select-none font-medium',\n          captionLayout === 'label'\n            ? 'text-sm'\n            : '[&>svg]:text-muted-foreground flex h-8 items-center gap-1 rounded-md pl-2 pr-1 text-sm [&>svg]:size-3.5',\n          defaultClassNames.caption_label,\n        ),\n        table: 'w-full border-collapse grow',\n        weekdays: cn('flex', defaultClassNames.weekdays),\n        weekday: cn(\n          'text-muted-foreground pt-1 flex-1 select-none rounded-md text-[0.8rem] font-normal uppercase',\n          defaultClassNames.weekday,\n        ),\n        week: cn('flex w-full mt-2', defaultClassNames.week),\n        week_number_header: cn('w-[--cell-size] select-none', defaultClassNames.week_number_header),\n        week_number: cn('text-muted-foreground select-none text-[0.8rem]', defaultClassNames.week_number),\n        day: cn(\n          'group/day relative flex aspect-square h-10 w-10 select-none items-center justify-center p-0 text-center [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md',\n          defaultClassNames.day,\n        ),\n        range_start: cn('bg-accent rounded-l-md', defaultClassNames.range_start),\n        range_middle: cn('rounded-none', defaultClassNames.range_middle),\n        range_end: cn('bg-accent rounded-r-md', defaultClassNames.range_end),\n        today: cn(\n          'bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none',\n          defaultClassNames.today,\n        ),\n        outside: cn('text-muted-foreground aria-selected:text-muted-foreground', defaultClassNames.outside),\n        disabled: cn('text-muted-foreground opacity-50', defaultClassNames.disabled),\n        hidden: cn('invisible', defaultClassNames.hidden),\n        ...classNames,\n      }}\n      components={{\n        Root: ({ className, rootRef, ...props }) => {\n          return <div data-slot=\"calendar\" ref={rootRef} className={cn(className)} {...props} />;\n        },\n        Chevron: ({ className, orientation, ...props }) => {\n          if (orientation === 'left') {\n            return <ChevronLeftIcon className={cn('size-4', className)} {...props} />;\n          }\n\n          if (orientation === 'right') {\n            return <ChevronRightIcon className={cn('size-4', className)} {...props} />;\n          }\n\n          return <ChevronDownIcon className={cn('size-4', className)} {...props} />;\n        },\n        DayButton: CalendarDayButton,\n        WeekNumber: ({ children, ...props }) => {\n          return (\n            <td {...props}>\n              <div className=\"flex size-[--cell-size] items-center justify-center text-center\">{children}</div>\n            </td>\n          );\n        },\n        ...components,\n      }}\n      {...props}\n    />\n  );\n}\n\nfunction CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>) {\n  const defaultClassNames = getDefaultClassNames();\n\n  const ref = React.useRef<HTMLButtonElement>(null);\n  React.useEffect(() => {\n    if (modifiers.focused) ref.current?.focus();\n  }, [modifiers.focused]);\n\n  return (\n    <Button\n      ref={ref}\n      variant=\"ghost\"\n      size=\"icon\"\n      data-day={day.date.toLocaleDateString()}\n      data-selected-single={\n        modifiers.selected && !modifiers.range_start && !modifiers.range_end && !modifiers.range_middle\n      }\n      data-range-start={modifiers.range_start}\n      data-range-end={modifiers.range_end}\n      data-range-middle={modifiers.range_middle}\n      className={cn(\n        'data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 flex aspect-square h-full w-full min-w-[--cell-size] items-center justify-center font-normal leading-none data-[range-end=true]:rounded-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] [&>span]:text-xs [&>span]:opacity-70',\n        defaultClassNames.day,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Calendar, CalendarDayButton };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/calendar.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "calendar.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/calendar.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport { describe, expect, it } from 'vitest';\nimport { Calendar } from './calendar';\n\ndescribe('Calendar', () => {\n  it('renders correctly', () => {\n    // Mock date to consistent rendering\n    const date = new Date(2023, 0, 1); // Jan 1, 2023\n\n    render(<Calendar mode=\"single\" selected={date} month={date} />);\n\n    expect(screen.getByText('January 2023')).toBeInTheDocument();\n    const days = screen.getAllByText('1');\n    expect(days.length).toBeGreaterThan(0);\n    expect(screen.getByText('Su')).toBeInTheDocument(); // Sunday header\n  });\n\n  it('renders with class name', () => {\n    const { container } = render(<Calendar className=\"test-class\" />);\n    // DayPicker renders a div with the class\n    expect(container.firstChild).toHaveClass('test-class');\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/card.json

@@ -1,13 +0,0 @@
-{
-  "name": "card",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/card.tsx",
-      "content": "import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn('rounded-xl border bg-card text-card-foreground shadow', className)} {...props} />\n));\nCard.displayName = 'Card';\n\nconst CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn('flex flex-col space-y-1.5 p-6', className)} {...props} />\n  ),\n);\nCardHeader.displayName = 'CardHeader';\n\nconst CardTitle = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn('font-semibold leading-none tracking-tight', className)} {...props} />\n  ),\n);\nCardTitle.displayName = 'CardTitle';\n\nconst CardDescription = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />\n  ),\n);\nCardDescription.displayName = 'CardDescription';\n\nconst CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => <div ref={ref} className={cn('p-6 pt-0', className)} {...props} />,\n);\nCardContent.displayName = 'CardContent';\n\nconst CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn('flex items-center p-6 pt-0', className)} {...props} />\n  ),\n);\nCardFooter.displayName = 'CardFooter';\n\nexport { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/card.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "card.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/card.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport { describe, expect, it } from 'vitest';\nimport { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './card';\n\ndescribe('Card', () => {\n  it('renders correctly', () => {\n    render(\n      <Card>\n        <CardHeader>\n          <CardTitle>Title</CardTitle>\n          <CardDescription>Description</CardDescription>\n        </CardHeader>\n        <CardContent>Content</CardContent>\n        <CardFooter>Footer</CardFooter>\n      </Card>,\n    );\n\n    expect(screen.getByText('Title')).toBeInTheDocument();\n    expect(screen.getByText('Description')).toBeInTheDocument();\n    expect(screen.getByText('Content')).toBeInTheDocument();\n    expect(screen.getByText('Footer')).toBeInTheDocument();\n  });\n\n  it('renders with class names', () => {\n    const { container } = render(<Card className=\"test-class\" />);\n    expect(container.firstChild).toHaveClass(\n      'test-class',\n      'rounded-xl',\n      'border',\n      'bg-card',\n      'text-card-foreground',\n      'shadow',\n    );\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/carousel.json

@@ -1,13 +0,0 @@
-{
-  "name": "carousel",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/carousel.tsx",
-      "content": "import useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react';\nimport { ArrowLeft, ArrowRight } from 'lucide-react';\nimport * as React from 'react';\n\nimport { Button } from '@/components/ui/button';\nimport { cn } from '@/lib/utils';\n\ntype CarouselApi = UseEmblaCarouselType[1];\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype CarouselOptions = UseCarouselParameters[0];\ntype CarouselPlugin = UseCarouselParameters[1];\n\ntype CarouselProps = {\n  opts?: CarouselOptions;\n  plugins?: CarouselPlugin;\n  orientation?: 'horizontal' | 'vertical';\n  setApi?: (api: CarouselApi) => void;\n};\n\ntype CarouselContextProps = {\n  carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n  api: ReturnType<typeof useEmblaCarousel>[1];\n  scrollPrev: () => void;\n  scrollNext: () => void;\n  canScrollPrev: boolean;\n  canScrollNext: boolean;\n} & CarouselProps;\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\n\nfunction useCarousel() {\n  const context = React.useContext(CarouselContext);\n\n  if (!context) {\n    throw new Error('useCarousel must be used within a <Carousel />');\n  }\n\n  return context;\n}\n\nconst Carousel = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement> & CarouselProps>(\n  ({ orientation = 'horizontal', opts, setApi, plugins, className, children, ...props }, ref) => {\n    const [carouselRef, api] = useEmblaCarousel(\n      {\n        ...opts,\n        axis: orientation === 'horizontal' ? 'x' : 'y',\n      },\n      plugins,\n    );\n    const [canScrollPrev, setCanScrollPrev] = React.useState(false);\n    const [canScrollNext, setCanScrollNext] = React.useState(false);\n\n    const onSelect = React.useCallback((api: CarouselApi) => {\n      if (!api) {\n        return;\n      }\n\n      setCanScrollPrev(api.canScrollPrev());\n      setCanScrollNext(api.canScrollNext());\n    }, []);\n\n    const scrollPrev = React.useCallback(() => {\n      api?.scrollPrev();\n    }, [api]);\n\n    const scrollNext = React.useCallback(() => {\n      api?.scrollNext();\n    }, [api]);\n\n    const handleKeyDown = React.useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (event.key === 'ArrowLeft') {\n          event.preventDefault();\n          scrollPrev();\n        } else if (event.key === 'ArrowRight') {\n          event.preventDefault();\n          scrollNext();\n        }\n      },\n      [scrollPrev, scrollNext],\n    );\n\n    React.useEffect(() => {\n      if (!api || !setApi) {\n        return;\n      }\n\n      setApi(api);\n    }, [api, setApi]);\n\n    React.useEffect(() => {\n      if (!api) {\n        return;\n      }\n\n      onSelect(api);\n      api.on('reInit', onSelect);\n      api.on('select', onSelect);\n\n      return () => {\n        api?.off('select', onSelect);\n      };\n    }, [api, onSelect]);\n\n    return (\n      <CarouselContext.Provider\n        value={{\n          carouselRef,\n          api: api,\n          opts,\n          orientation: orientation || (opts?.axis === 'y' ? 'vertical' : 'horizontal'),\n          scrollPrev,\n          scrollNext,\n          canScrollPrev,\n          canScrollNext,\n        }}\n      >\n        <div\n          ref={ref}\n          onKeyDownCapture={handleKeyDown}\n          className={cn('relative', className)}\n          role=\"region\"\n          aria-roledescription=\"carousel\"\n          {...props}\n        >\n          {children}\n        </div>\n      </CarouselContext.Provider>\n    );\n  },\n);\nCarousel.displayName = 'Carousel';\n\nconst CarouselContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => {\n    const { carouselRef, orientation } = useCarousel();\n\n    return (\n      <div ref={carouselRef} className=\"overflow-hidden\">\n        <div\n          ref={ref}\n          className={cn('flex', orientation === 'horizontal' ? '-ml-4' : '-mt-4 flex-col', className)}\n          {...props}\n        />\n      </div>\n    );\n  },\n);\nCarouselContent.displayName = 'CarouselContent';\n\nconst CarouselItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => {\n    const { orientation } = useCarousel();\n\n    return (\n      <div\n        ref={ref}\n        role=\"group\"\n        aria-roledescription=\"slide\"\n        className={cn('min-w-0 shrink-0 grow-0 basis-full', orientation === 'horizontal' ? 'pl-4' : 'pt-4', className)}\n        {...props}\n      />\n    );\n  },\n);\nCarouselItem.displayName = 'CarouselItem';\n\nconst CarouselPrevious = React.forwardRef<HTMLButtonElement, React.ComponentProps<typeof Button>>(\n  ({ className, variant = 'outline', size = 'icon', ...props }, ref) => {\n    const { orientation, scrollPrev, canScrollPrev } = useCarousel();\n\n    return (\n      <Button\n        ref={ref}\n        variant={variant}\n        size={size}\n        className={cn(\n          'absolute  h-8 w-8 rounded-full',\n          orientation === 'horizontal'\n            ? '-left-12 top-1/2 -translate-y-1/2'\n            : '-top-12 left-1/2 -translate-x-1/2 rotate-90',\n          className,\n        )}\n        disabled={!canScrollPrev}\n        onClick={scrollPrev}\n        {...props}\n      >\n        <ArrowLeft className=\"h-4 w-4\" />\n        <span className=\"sr-only\">Previous slide</span>\n      </Button>\n    );\n  },\n);\nCarouselPrevious.displayName = 'CarouselPrevious';\n\nconst CarouselNext = React.forwardRef<HTMLButtonElement, React.ComponentProps<typeof Button>>(\n  ({ className, variant = 'outline', size = 'icon', ...props }, ref) => {\n    const { orientation, scrollNext, canScrollNext } = useCarousel();\n\n    return (\n      <Button\n        ref={ref}\n        variant={variant}\n        size={size}\n        className={cn(\n          'absolute h-8 w-8 rounded-full',\n          orientation === 'horizontal'\n            ? '-right-12 top-1/2 -translate-y-1/2'\n            : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',\n          className,\n        )}\n        disabled={!canScrollNext}\n        onClick={scrollNext}\n        {...props}\n      >\n        <ArrowRight className=\"h-4 w-4\" />\n        <span className=\"sr-only\">Next slide</span>\n      </Button>\n    );\n  },\n);\nCarouselNext.displayName = 'CarouselNext';\n\nexport { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type CarouselApi };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/carousel.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "carousel.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/carousel.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport { describe, expect, it } from 'vitest';\nimport { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from './carousel';\n\ndescribe('Carousel', () => {\n  it('renders correctly', () => {\n    render(\n      <Carousel aria-label=\"carousel\">\n        <CarouselContent>\n          <CarouselItem>Slide 1</CarouselItem>\n          <CarouselItem>Slide 2</CarouselItem>\n          <CarouselItem>Slide 3</CarouselItem>\n        </CarouselContent>\n        <CarouselPrevious />\n        <CarouselNext />\n      </Carousel>,\n    );\n\n    expect(screen.getByRole('region', { name: 'carousel' })).toBeInTheDocument();\n    expect(screen.getByText('Slide 1')).toBeInTheDocument();\n    expect(screen.getByText('Slide 2')).toBeInTheDocument();\n    expect(screen.getByText('Slide 3')).toBeInTheDocument();\n    expect(screen.getByRole('button', { name: 'Previous slide' })).toBeInTheDocument();\n    expect(screen.getByRole('button', { name: 'Next slide' })).toBeInTheDocument();\n  });\n\n  it('renders with orientation vertical', () => {\n    render(\n      <Carousel orientation=\"vertical\" aria-label=\"carousel\">\n        <CarouselContent>\n          <CarouselItem>Slide 1</CarouselItem>\n        </CarouselContent>\n      </Carousel>,\n    );\n    expect(screen.getByRole('region', { name: 'carousel' })).toBeInTheDocument();\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/chart.json

@@ -1,13 +0,0 @@
-{
-  "name": "chart",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/chart.tsx",
-      "content": "import * as React from 'react';\nimport * as RechartsPrimitive from 'recharts';\n\nimport { cn } from '@/lib/utils';\n\n// Format: { THEME_NAME: CSS_SELECTOR }\nconst THEMES = { light: '', dark: '.dark' } as const;\n\nexport type ChartConfig = {\n  [k in string]: {\n    label?: React.ReactNode;\n    icon?: React.ComponentType;\n  } & ({ color?: string; theme?: never } | { color?: never; theme: Record<keyof typeof THEMES, string> });\n};\n\ntype ChartContextProps = {\n  config: ChartConfig;\n};\n\nconst ChartContext = React.createContext<ChartContextProps | null>(null);\n\nfunction useChart() {\n  const context = React.useContext(ChartContext);\n\n  if (!context) {\n    throw new Error('useChart must be used within a <ChartContainer />');\n  }\n\n  return context;\n}\n\nconst ChartContainer = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentProps<'div'> & {\n    config: ChartConfig;\n    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>['children'];\n  }\n>(({ id, className, children, config, ...props }, ref) => {\n  const uniqueId = React.useId();\n  const chartId = `chart-${id || uniqueId.replace(/:/g, '')}`;\n\n  return (\n    <ChartContext.Provider value={{ config }}>\n      <div\n        data-chart={chartId}\n        ref={ref}\n        className={cn(\n          \"flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-none [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-sector]:outline-none [&_.recharts-surface]:outline-none\",\n          className,\n        )}\n        {...props}\n      >\n        <ChartStyle id={chartId} config={config} />\n        <RechartsPrimitive.ResponsiveContainer>{children}</RechartsPrimitive.ResponsiveContainer>\n      </div>\n    </ChartContext.Provider>\n  );\n});\nChartContainer.displayName = 'Chart';\n\nconst ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {\n  const colorConfig = Object.entries(config).filter(([, config]) => config.theme || config.color);\n\n  if (!colorConfig.length) {\n    return null;\n  }\n\n  return (\n    <style\n      dangerouslySetInnerHTML={{\n        __html: Object.entries(THEMES)\n          .map(\n            ([theme, prefix]) => `\n${prefix} [data-chart=${id}] {\n${colorConfig\n  .map(([key, itemConfig]) => {\n    const color = itemConfig.theme?.[theme as keyof typeof itemConfig.theme] || itemConfig.color;\n    return color ? `  --color-${key}: ${color};` : null;\n  })\n  .join('\\n')}\n}\n`,\n          )\n          .join('\\n'),\n      }}\n    />\n  );\n};\n\nconst ChartTooltip = RechartsPrimitive.Tooltip;\n\nconst ChartTooltipContent = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentProps<typeof RechartsPrimitive.Tooltip> &\n    React.ComponentProps<'div'> & {\n      hideLabel?: boolean;\n      hideIndicator?: boolean;\n      indicator?: 'line' | 'dot' | 'dashed';\n      nameKey?: string;\n      labelKey?: string;\n    }\n>(\n  (\n    {\n      active,\n      payload,\n      className,\n      indicator = 'dot',\n      hideLabel = false,\n      hideIndicator = false,\n      label,\n      labelFormatter,\n      labelClassName,\n      formatter,\n      color,\n      nameKey,\n      labelKey,\n    },\n    ref,\n  ) => {\n    const { config } = useChart();\n\n    const tooltipLabel = React.useMemo(() => {\n      if (hideLabel || !payload?.length) {\n        return null;\n      }\n\n      const [item] = payload;\n      const key = `${labelKey || item?.dataKey || item?.name || 'value'}`;\n      const itemConfig = getPayloadConfigFromPayload(config, item, key);\n      const value =\n        !labelKey && typeof label === 'string'\n          ? config[label as keyof typeof config]?.label || label\n          : itemConfig?.label;\n\n      if (labelFormatter) {\n        return <div className={cn('font-medium', labelClassName)}>{labelFormatter(value, payload)}</div>;\n      }\n\n      if (!value) {\n        return null;\n      }\n\n      return <div className={cn('font-medium', labelClassName)}>{value}</div>;\n    }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey]);\n\n    if (!active || !payload?.length) {\n      return null;\n    }\n\n    const nestLabel = payload.length === 1 && indicator !== 'dot';\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl',\n          className,\n        )}\n      >\n        {!nestLabel ? tooltipLabel : null}\n        <div className=\"grid gap-1.5\">\n          {payload\n            .filter((item) => item.type !== 'none')\n            .map((item, index) => {\n              const key = `${nameKey || item.name || item.dataKey || 'value'}`;\n              const itemConfig = getPayloadConfigFromPayload(config, item, key);\n              const indicatorColor = color || item.payload.fill || item.color;\n\n              return (\n                <div\n                  key={item.dataKey}\n                  className={cn(\n                    'flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground',\n                    indicator === 'dot' && 'items-center',\n                  )}\n                >\n                  {formatter && item?.value !== undefined && item.name ? (\n                    formatter(item.value, item.name, item, index, item.payload)\n                  ) : (\n                    <>\n                      {itemConfig?.icon ? (\n                        <itemConfig.icon />\n                      ) : (\n                        !hideIndicator && (\n                          <div\n                            className={cn('shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]', {\n                              'h-2.5 w-2.5': indicator === 'dot',\n                              'w-1': indicator === 'line',\n                              'w-0 border-[1.5px] border-dashed bg-transparent': indicator === 'dashed',\n                              'my-0.5': nestLabel && indicator === 'dashed',\n                            })}\n                            style={\n                              {\n                                '--color-bg': indicatorColor,\n                                '--color-border': indicatorColor,\n                              } as React.CSSProperties\n                            }\n                          />\n                        )\n                      )}\n                      <div\n                        className={cn(\n                          'flex flex-1 justify-between leading-none',\n                          nestLabel ? 'items-end' : 'items-center',\n                        )}\n                      >\n                        <div className=\"grid gap-1.5\">\n                          {nestLabel ? tooltipLabel : null}\n                          <span className=\"text-muted-foreground\">{itemConfig?.label || item.name}</span>\n                        </div>\n                        {item.value && (\n                          <span className=\"font-mono font-medium tabular-nums text-foreground\">\n                            {item.value.toLocaleString()}\n                          </span>\n                        )}\n                      </div>\n                    </>\n                  )}\n                </div>\n              );\n            })}\n        </div>\n      </div>\n    );\n  },\n);\nChartTooltipContent.displayName = 'ChartTooltip';\n\nconst ChartLegend = RechartsPrimitive.Legend;\n\nconst ChartLegendContent = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentProps<'div'> &\n    Pick<RechartsPrimitive.LegendProps, 'payload' | 'verticalAlign'> & {\n      hideIcon?: boolean;\n      nameKey?: string;\n    }\n>(({ className, hideIcon = false, payload, verticalAlign = 'bottom', nameKey }, ref) => {\n  const { config } = useChart();\n\n  if (!payload?.length) {\n    return null;\n  }\n\n  return (\n    <div\n      ref={ref}\n      className={cn('flex items-center justify-center gap-4', verticalAlign === 'top' ? 'pb-3' : 'pt-3', className)}\n    >\n      {payload\n        .filter((item) => item.type !== 'none')\n        .map((item) => {\n          const key = `${nameKey || item.dataKey || 'value'}`;\n          const itemConfig = getPayloadConfigFromPayload(config, item, key);\n\n          return (\n            <div\n              key={item.value}\n              className={cn('flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground')}\n            >\n              {itemConfig?.icon && !hideIcon ? (\n                <itemConfig.icon />\n              ) : (\n                <div\n                  className=\"h-2 w-2 shrink-0 rounded-[2px]\"\n                  style={{\n                    backgroundColor: item.color,\n                  }}\n                />\n              )}\n              {itemConfig?.label}\n            </div>\n          );\n        })}\n    </div>\n  );\n});\nChartLegendContent.displayName = 'ChartLegend';\n\n// Helper to extract item config from a payload.\nfunction getPayloadConfigFromPayload(config: ChartConfig, payload: unknown, key: string) {\n  if (typeof payload !== 'object' || payload === null) {\n    return undefined;\n  }\n\n  const payloadPayload =\n    'payload' in payload && typeof payload.payload === 'object' && payload.payload !== null\n      ? payload.payload\n      : undefined;\n\n  let configLabelKey: string = key;\n\n  if (key in payload && typeof payload[key as keyof typeof payload] === 'string') {\n    configLabelKey = payload[key as keyof typeof payload] as string;\n  } else if (\n    payloadPayload &&\n    key in payloadPayload &&\n    typeof payloadPayload[key as keyof typeof payloadPayload] === 'string'\n  ) {\n    configLabelKey = payloadPayload[key as keyof typeof payloadPayload] as string;\n  }\n\n  return configLabelKey in config ? config[configLabelKey] : config[key as keyof typeof config];\n}\n\nexport { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/chart.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "chart.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/chart.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport { Bar, BarChart, CartesianGrid, XAxis } from 'recharts';\nimport { describe, expect, it, vi } from 'vitest';\nimport { ChartContainer, ChartTooltip, ChartTooltipContent } from './chart';\n\n// Mock Recharts ResponsiveContainer to avoid ResizeObserver issues and render children immediately\nvi.mock('recharts', async (importOriginal) => {\n  const original = await importOriginal();\n  return {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    ...(original as any),\n    ResponsiveContainer: ({ children }: { children: React.ReactNode }) => (\n      <div style={{ width: 500, height: 300 }}>{children}</div>\n    ),\n  };\n});\n\nconst chartConfig = {\n  desktop: {\n    label: 'Desktop',\n    color: '#2563eb',\n  },\n  mobile: {\n    label: 'Mobile',\n    color: '#60a5fa',\n  },\n};\n\nconst chartData = [\n  { month: 'January', desktop: 186, mobile: 80 },\n  { month: 'February', desktop: 305, mobile: 200 },\n];\n\ndescribe('Chart', () => {\n  it('renders correctly', () => {\n    render(\n      <ChartContainer config={chartConfig} className=\"min-h-[200px] w-full\">\n        <BarChart accessibilityLayer data={chartData} width={500} height={300}>\n          <CartesianGrid vertical={false} />\n          <XAxis\n            dataKey=\"month\"\n            tickLine={false}\n            tickMargin={10}\n            axisLine={false}\n            tickFormatter={(value) => value.slice(0, 3)}\n          />\n          <ChartTooltip content={<ChartTooltipContent />} />\n          <Bar dataKey=\"desktop\" fill=\"var(--color-desktop)\" radius={4} />\n          <Bar dataKey=\"mobile\" fill=\"var(--color-mobile)\" radius={4} />\n        </BarChart>\n      </ChartContainer>,\n    );\n\n    // Recharts renders SVGs. We can check if the container renders.\n    // The accessibilityLayer prop on BarChart adds role=\"application\" or similar?\n    // Let's check for the chart container.\n    // The ChartContainer adds data-chart attribute.\n    // But we can check for text.\n    expect(screen.getByText('Jan')).toBeInTheDocument();\n    expect(screen.getByText('Feb')).toBeInTheDocument();\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/checkbox.json

@@ -1,13 +0,0 @@
-{
-  "name": "checkbox",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/checkbox.tsx",
-      "content": "import * as CheckboxPrimitive from '@radix-ui/react-checkbox';\nimport { Check } from 'lucide-react';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst Checkbox = React.forwardRef<\n  React.ElementRef<typeof CheckboxPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <CheckboxPrimitive.Root\n    ref={ref}\n    className={cn(\n      'grid place-content-center peer h-4 w-4 shrink-0 rounded-sm border border-primary shadow focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground',\n      className,\n    )}\n    {...props}\n  >\n    <CheckboxPrimitive.Indicator className={cn('grid place-content-center text-current')}>\n      <Check className=\"h-4 w-4\" />\n    </CheckboxPrimitive.Indicator>\n  </CheckboxPrimitive.Root>\n));\nCheckbox.displayName = CheckboxPrimitive.Root.displayName;\n\nexport { Checkbox };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/checkbox.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "checkbox.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/checkbox.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { describe, expect, it } from 'vitest';\nimport { Checkbox } from './checkbox';\n\ndescribe('Checkbox', () => {\n  it('renders correctly', () => {\n    render(<Checkbox />);\n    expect(screen.getByRole('checkbox')).toBeInTheDocument();\n  });\n\n  it('toggles checked state on click', async () => {\n    const user = userEvent.setup();\n    render(<Checkbox />);\n\n    const checkbox = screen.getByRole('checkbox');\n    expect(checkbox).not.toBeChecked();\n\n    await user.click(checkbox);\n    expect(checkbox).toBeChecked();\n\n    await user.click(checkbox);\n    expect(checkbox).not.toBeChecked();\n  });\n\n  it('renders disabled state', () => {\n    render(<Checkbox disabled />);\n    expect(screen.getByRole('checkbox')).toBeDisabled();\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/collapsible.json

@@ -1,13 +0,0 @@
-{
-  "name": "collapsible",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/collapsible.tsx",
-      "content": "import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\n\nconst Collapsible = CollapsiblePrimitive.Root;\n\nconst CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;\n\nconst CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;\n\nexport { Collapsible, CollapsibleContent, CollapsibleTrigger };\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/collapsible.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "collapsible.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/collapsible.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { describe, expect, it } from 'vitest';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from './collapsible';\n\ndescribe('Collapsible', () => {\n  it('renders correctly', () => {\n    render(\n      <Collapsible>\n        <CollapsibleTrigger>Toggle</CollapsibleTrigger>\n        <CollapsibleContent>Content</CollapsibleContent>\n      </Collapsible>,\n    );\n\n    expect(screen.getByRole('button', { name: 'Toggle' })).toBeInTheDocument();\n  });\n\n  it('toggles content visibility', async () => {\n    const user = userEvent.setup();\n    render(\n      <Collapsible>\n        <CollapsibleTrigger>Toggle</CollapsibleTrigger>\n        <CollapsibleContent>Content</CollapsibleContent>\n      </Collapsible>,\n    );\n\n    const trigger = screen.getByRole('button', { name: 'Toggle' });\n\n    // Initial state: Content might be hidden or not present depending on implementation details of Radix\n    // But Radix Collapsible adds data-state attribute\n    expect(trigger).toHaveAttribute('data-state', 'closed');\n\n    await user.click(trigger);\n    expect(trigger).toHaveAttribute('data-state', 'open');\n    expect(screen.getByText('Content')).toBeVisible();\n\n    await user.click(trigger);\n    expect(trigger).toHaveAttribute('data-state', 'closed');\n  });\n\n  it('renders open by default', () => {\n    render(\n      <Collapsible defaultOpen>\n        <CollapsibleTrigger>Toggle</CollapsibleTrigger>\n        <CollapsibleContent>Content</CollapsibleContent>\n      </Collapsible>,\n    );\n    expect(screen.getByRole('button', { name: 'Toggle' })).toHaveAttribute('data-state', 'open');\n    expect(screen.getByText('Content')).toBeVisible();\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/command.json

@@ -1,13 +0,0 @@
-{
-  "name": "command",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/command.tsx",
-      "content": "'use client';\n\nimport { type DialogProps } from '@radix-ui/react-dialog';\nimport { Command as CommandPrimitive } from 'cmdk';\nimport { Search } from 'lucide-react';\nimport * as React from 'react';\n\nimport { Dialog, DialogContent, DialogDescription, DialogTitle } from '@/components/ui/dialog';\nimport { cn } from '@/lib/utils';\n\nconst Command = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive\n    ref={ref}\n    className={cn(\n      'flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground',\n      className,\n    )}\n    {...props}\n  />\n));\nCommand.displayName = CommandPrimitive.displayName;\n\nconst CommandDialog = ({ children, ...props }: DialogProps) => {\n  return (\n    <Dialog {...props}>\n      <DialogContent className=\"overflow-hidden p-0\">\n        <DialogTitle className=\"sr-only\">Search</DialogTitle>\n        <DialogDescription className=\"sr-only\">Search for documentation and components.</DialogDescription>\n        <Command className=\"[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5\">\n          {children}\n        </Command>\n      </DialogContent>\n    </Dialog>\n  );\n};\n\nconst CommandInput = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Input>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>\n>(({ className, ...props }, ref) => (\n  <div className=\"flex items-center border-b px-3\" cmdk-input-wrapper=\"\">\n    <Search className=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n    <CommandPrimitive.Input\n      ref={ref}\n      className={cn(\n        'flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50',\n        className,\n      )}\n      {...props}\n    />\n  </div>\n));\n\nCommandInput.displayName = CommandPrimitive.Input.displayName;\n\nconst CommandList = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.List\n    ref={ref}\n    className={cn('max-h-[300px] overflow-y-auto overflow-x-hidden', className)}\n    {...props}\n  />\n));\n\nCommandList.displayName = CommandPrimitive.List.displayName;\n\nconst CommandEmpty = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Empty>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>((props, ref) => <CommandPrimitive.Empty ref={ref} className=\"py-6 text-center text-sm\" {...props} />);\n\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName;\n\nconst CommandGroup = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Group>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Group\n    ref={ref}\n    className={cn(\n      'overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground',\n      className,\n    )}\n    {...props}\n  />\n));\n\nCommandGroup.displayName = CommandPrimitive.Group.displayName;\n\nconst CommandSeparator = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Separator ref={ref} className={cn('-mx-1 h-px bg-border', className)} {...props} />\n));\nCommandSeparator.displayName = CommandPrimitive.Separator.displayName;\n\nconst CommandItem = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Item\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',\n      className,\n    )}\n    {...props}\n  />\n));\n\nCommandItem.displayName = CommandPrimitive.Item.displayName;\n\nconst CommandShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {\n  return <span className={cn('ml-auto text-xs tracking-widest text-muted-foreground', className)} {...props} />;\n};\nCommandShortcut.displayName = 'CommandShortcut';\n\nexport {\n  Command,\n  CommandDialog,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n  CommandShortcut,\n};\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/command.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "command.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/command.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { describe, expect, it } from 'vitest';\nimport { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from './command';\n\ndescribe('Command', () => {\n  it('renders correctly', () => {\n    render(\n      <Command>\n        <CommandInput placeholder=\"Search...\" />\n        <CommandList>\n          <CommandEmpty>No results found.</CommandEmpty>\n          <CommandGroup heading=\"Suggestions\">\n            <CommandItem>Calendar</CommandItem>\n            <CommandItem>Search Emoji</CommandItem>\n            <CommandItem>Calculator</CommandItem>\n          </CommandGroup>\n        </CommandList>\n      </Command>,\n    );\n\n    expect(screen.getByPlaceholderText('Search...')).toBeInTheDocument();\n    expect(screen.getByText('Suggestions')).toBeInTheDocument();\n    expect(screen.getByText('Calendar')).toBeInTheDocument();\n  });\n\n  it('filters items based on input', async () => {\n    const user = userEvent.setup();\n    render(\n      <Command>\n        <CommandInput placeholder=\"Search...\" />\n        <CommandList>\n          <CommandGroup heading=\"Suggestions\">\n            <CommandItem>Calendar</CommandItem>\n            <CommandItem>Search Emoji</CommandItem>\n            <CommandItem>Calculator</CommandItem>\n          </CommandGroup>\n        </CommandList>\n      </Command>,\n    );\n\n    const input = screen.getByPlaceholderText('Search...');\n    await user.type(input, 'Cal');\n\n    expect(screen.getByText('Calendar')).toBeVisible();\n    expect(screen.getByText('Calculator')).toBeVisible();\n    // search emoji should be filtered out\n    // Note: cmdk might just hide items, so we check if they are visible or not\n    // or checks class names.\n    // Let's check if Search Emoji is not visible or removed\n    const emoji = screen.queryByText('Search Emoji');\n    // If it's still in document but hidden, we check visibility\n    if (emoji) {\n      expect(emoji).not.toBeVisible();\n    } else {\n      expect(emoji).not.toBeInTheDocument();\n    }\n  });\n\n  it('shows empty state when no results', async () => {\n    const user = userEvent.setup();\n    render(\n      <Command>\n        <CommandInput placeholder=\"Search...\" />\n        <CommandList>\n          <CommandEmpty>No results found.</CommandEmpty>\n          <CommandGroup heading=\"Suggestions\">\n            <CommandItem>Calendar</CommandItem>\n          </CommandGroup>\n        </CommandList>\n      </Command>,\n    );\n\n    const input = screen.getByPlaceholderText('Search...');\n    await user.type(input, 'XYZ');\n\n    expect(screen.getByText('No results found.')).toBeVisible();\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/context-menu.json

@@ -1,13 +0,0 @@
-{
-  "name": "context-menu",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/context-menu.tsx",
-      "content": "import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';\nimport { Check, ChevronRight, Circle } from 'lucide-react';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst ContextMenu = ContextMenuPrimitive.Root;\n\nconst ContextMenuTrigger = ContextMenuPrimitive.Trigger;\n\nconst ContextMenuGroup = ContextMenuPrimitive.Group;\n\nconst ContextMenuPortal = ContextMenuPrimitive.Portal;\n\nconst ContextMenuSub = ContextMenuPrimitive.Sub;\n\nconst ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;\n\nconst ContextMenuSubTrigger = React.forwardRef<\n  React.ElementRef<typeof ContextMenuPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubTrigger> & {\n    inset?: boolean;\n  }\n>(({ className, inset, children, ...props }, ref) => (\n  <ContextMenuPrimitive.SubTrigger\n    ref={ref}\n    className={cn(\n      'flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground',\n      inset && 'pl-8',\n      className,\n    )}\n    {...props}\n  >\n    {children}\n    <ChevronRight className=\"ml-auto h-4 w-4\" />\n  </ContextMenuPrimitive.SubTrigger>\n));\nContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;\n\nconst ContextMenuSubContent = React.forwardRef<\n  React.ElementRef<typeof ContextMenuPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => (\n  <ContextMenuPrimitive.SubContent\n    ref={ref}\n    className={cn(\n      'z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-context-menu-content-transform-origin]',\n      className,\n    )}\n    {...props}\n  />\n));\nContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;\n\nconst ContextMenuContent = React.forwardRef<\n  React.ElementRef<typeof ContextMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Content>\n>(({ className, ...props }, ref) => (\n  <ContextMenuPrimitive.Portal>\n    <ContextMenuPrimitive.Content\n      ref={ref}\n      className={cn(\n        'z-50 max-h-[--radix-context-menu-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-context-menu-content-transform-origin]',\n        className,\n      )}\n      {...props}\n    />\n  </ContextMenuPrimitive.Portal>\n));\nContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;\n\nconst ContextMenuItem = React.forwardRef<\n  React.ElementRef<typeof ContextMenuPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Item> & {\n    inset?: boolean;\n  }\n>(({ className, inset, ...props }, ref) => (\n  <ContextMenuPrimitive.Item\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n      inset && 'pl-8',\n      className,\n    )}\n    {...props}\n  />\n));\nContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;\n\nconst ContextMenuCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof ContextMenuPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n  <ContextMenuPrimitive.CheckboxItem\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n      className,\n    )}\n    checked={checked}\n    {...props}\n  >\n    <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n      <ContextMenuPrimitive.ItemIndicator>\n        <Check className=\"h-4 w-4\" />\n      </ContextMenuPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </ContextMenuPrimitive.CheckboxItem>\n));\nContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;\n\nconst ContextMenuRadioItem = React.forwardRef<\n  React.ElementRef<typeof ContextMenuPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n  <ContextMenuPrimitive.RadioItem\n    ref={ref}\n    className={cn(\n      'relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n      className,\n    )}\n    {...props}\n  >\n    <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n      <ContextMenuPrimitive.ItemIndicator>\n        <Circle className=\"h-4 w-4 fill-current\" />\n      </ContextMenuPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </ContextMenuPrimitive.RadioItem>\n));\nContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;\n\nconst ContextMenuLabel = React.forwardRef<\n  React.ElementRef<typeof ContextMenuPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Label> & {\n    inset?: boolean;\n  }\n>(({ className, inset, ...props }, ref) => (\n  <ContextMenuPrimitive.Label\n    ref={ref}\n    className={cn('px-2 py-1.5 text-sm font-semibold text-foreground', inset && 'pl-8', className)}\n    {...props}\n  />\n));\nContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;\n\nconst ContextMenuSeparator = React.forwardRef<\n  React.ElementRef<typeof ContextMenuPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <ContextMenuPrimitive.Separator ref={ref} className={cn('-mx-1 my-1 h-px bg-border', className)} {...props} />\n));\nContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName;\n\nconst ContextMenuShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {\n  return <span className={cn('ml-auto text-xs tracking-widest text-muted-foreground', className)} {...props} />;\n};\nContextMenuShortcut.displayName = 'ContextMenuShortcut';\n\nexport {\n  ContextMenu,\n  ContextMenuCheckboxItem,\n  ContextMenuContent,\n  ContextMenuGroup,\n  ContextMenuItem,\n  ContextMenuLabel,\n  ContextMenuPortal,\n  ContextMenuRadioGroup,\n  ContextMenuRadioItem,\n  ContextMenuSeparator,\n  ContextMenuShortcut,\n  ContextMenuSub,\n  ContextMenuSubContent,\n  ContextMenuSubTrigger,\n  ContextMenuTrigger,\n};\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/context-menu.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "context-menu.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/context-menu.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { describe, expect, it } from 'vitest';\nimport { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger } from './context-menu';\n\ndescribe('ContextMenu', () => {\n  it('renders trigger', () => {\n    render(\n      <ContextMenu>\n        <ContextMenuTrigger>Right click here</ContextMenuTrigger>\n        <ContextMenuContent>\n          <ContextMenuItem>Item 1</ContextMenuItem>\n        </ContextMenuContent>\n      </ContextMenu>,\n    );\n\n    expect(screen.getByText('Right click here')).toBeInTheDocument();\n  });\n\n  it('shows menu on right click', async () => {\n    const user = userEvent.setup();\n    render(\n      <ContextMenu>\n        <ContextMenuTrigger>Right click here</ContextMenuTrigger>\n        <ContextMenuContent>\n          <ContextMenuItem>Item 1</ContextMenuItem>\n        </ContextMenuContent>\n      </ContextMenu>,\n    );\n\n    const trigger = screen.getByText('Right click here');\n    await user.pointer({ keys: '[MouseRight]', target: trigger });\n\n    // Ensure item is visible. Radix UI ContextMenu might render it in a portal.\n    expect(screen.getByText('Item 1')).toBeVisible();\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/dialog.json

@@ -1,13 +0,0 @@
-{
-  "name": "dialog",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/dialog.tsx",
-      "content": "import * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { X } from 'lucide-react';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst Dialog = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = DialogPrimitive.Portal;\n\nconst DialogClose = DialogPrimitive.Close;\n\nconst DialogOverlay = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Overlay\n    ref={ref}\n    className={cn(\n      'fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n      className,\n    )}\n    {...props}\n  />\n));\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\n\nconst DialogContent = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n  <DialogPortal>\n    <DialogOverlay />\n    <DialogPrimitive.Content\n      ref={ref}\n      className={cn(\n        'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <DialogPrimitive.Close className=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground\">\n        <X className=\"h-4 w-4\" />\n        <span className=\"sr-only\">Close</span>\n      </DialogPrimitive.Close>\n    </DialogPrimitive.Content>\n  </DialogPortal>\n));\nDialogContent.displayName = DialogPrimitive.Content.displayName;\n\nconst DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)} {...props} />\n);\nDialogHeader.displayName = 'DialogHeader';\n\nconst DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)} {...props} />\n);\nDialogFooter.displayName = 'DialogFooter';\n\nconst DialogTitle = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Title\n    ref={ref}\n    className={cn('text-lg font-semibold leading-none tracking-tight', className)}\n    {...props}\n  />\n));\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\n\nconst DialogDescription = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />\n));\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger,\n};\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/dialog.test.json

@@ -1,13 +0,0 @@
-{
-  "name": "dialog.test",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/dialog.test.tsx",
-      "content": "import { render, screen } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { describe, expect, it } from 'vitest';\nimport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n} from './dialog';\n\ndescribe('Dialog', () => {\n  it('renders trigger correctly', () => {\n    render(\n      <Dialog>\n        <DialogTrigger>Open Dialog</DialogTrigger>\n        <DialogContent>\n          <DialogHeader>\n            <DialogTitle>Title</DialogTitle>\n            <DialogDescription>Description</DialogDescription>\n          </DialogHeader>\n        </DialogContent>\n      </Dialog>,\n    );\n\n    expect(screen.getByText('Open Dialog')).toBeInTheDocument();\n  });\n\n  it('opens and closes the dialog', async () => {\n    const user = userEvent.setup();\n    render(\n      <Dialog>\n        <DialogTrigger>Open Dialog</DialogTrigger>\n        <DialogContent>\n          <DialogHeader>\n            <DialogTitle>Are you sure absolutely sure?</DialogTitle>\n            <DialogDescription>This action cannot be undone.</DialogDescription>\n          </DialogHeader>\n          <DialogFooter>\n            <DialogClose>Close Dialog</DialogClose>\n          </DialogFooter>\n        </DialogContent>\n      </Dialog>,\n    );\n\n    // Dialog content should not be visible initially (or not in document)\n    expect(screen.queryByText('Are you sure absolutely sure?')).not.toBeInTheDocument();\n\n    // Open dialog\n    await user.click(screen.getByText('Open Dialog'));\n\n    expect(screen.getByRole('dialog')).toBeInTheDocument();\n    expect(screen.getByText('Are you sure absolutely sure?')).toBeVisible();\n\n    // Close dialog\n    // We can use the close button we added\n    await user.click(screen.getByText('Close Dialog'));\n\n    // Should be closed\n    // Radix UI Dialog unmounts content when closed\n    expect(screen.queryByText('Are you sure absolutely sure?')).not.toBeInTheDocument();\n  });\n});\n",
-      "type": "registry:ui"
-    }
-  ]
-}

package/dist/registry/drawer.json

@@ -1,13 +0,0 @@
-{
-  "name": "drawer",
-  "type": "registry:ui",
-  "dependencies": [],
-  "registryDependencies": [],
-  "files": [
-    {
-      "path": "ui/drawer.tsx",
-      "content": "import * as React from 'react';\nimport { Drawer as DrawerPrimitive } from 'vaul';\n\nimport { cn } from '@/lib/utils';\n\nconst Drawer = ({ shouldScaleBackground = true, ...props }: React.ComponentProps<typeof DrawerPrimitive.Root>) => (\n  <DrawerPrimitive.Root shouldScaleBackground={shouldScaleBackground} {...props} />\n);\nDrawer.displayName = 'Drawer';\n\nconst DrawerTrigger = DrawerPrimitive.Trigger;\n\nconst DrawerPortal = DrawerPrimitive.Portal;\n\nconst DrawerClose = DrawerPrimitive.Close;\n\nconst DrawerOverlay = React.forwardRef<\n  React.ElementRef<typeof DrawerPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <DrawerPrimitive.Overlay ref={ref} className={cn('fixed inset-0 z-50 bg-black/80', className)} {...props} />\n));\nDrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;\n\nconst DrawerContent = React.forwardRef<\n  React.ElementRef<typeof DrawerPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n  <DrawerPortal>\n    <DrawerOverlay />\n    <DrawerPrimitive.Content\n      ref={ref}\n      className={cn(\n        'fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background',\n        className,\n      )}\n      {...props}\n    >\n      <div className=\"mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted\" />\n      {children}\n    </DrawerPrimitive.Content>\n  </DrawerPortal>\n));\nDrawerContent.displayName = 'DrawerContent';\n\nconst DrawerHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={cn('grid gap-1.5 p-4 text-center sm:text-left', className)} {...props} />\n);\nDrawerHeader.displayName = 'DrawerHeader';\n\nconst DrawerFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={cn('mt-auto flex flex-col gap-2 p-4', className)} {...props} />\n);\nDrawerFooter.displayName = 'DrawerFooter';\n\nconst DrawerTitle = React.forwardRef<\n  React.ElementRef<typeof DrawerPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DrawerPrimitive.Title\n    ref={ref}\n    className={cn('text-lg font-semibold leading-none tracking-tight', className)}\n    {...props}\n  />\n));\nDrawerTitle.displayName = DrawerPrimitive.Title.displayName;\n\nconst DrawerDescription = React.forwardRef<\n  React.ElementRef<typeof DrawerPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DrawerPrimitive.Description ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />\n));\nDrawerDescription.displayName = DrawerPrimitive.Description.displayName;\n\nexport {\n  Drawer,\n  DrawerClose,\n  DrawerContent,\n  DrawerDescription,\n  DrawerFooter,\n  DrawerHeader,\n  DrawerOverlay,\n  DrawerPortal,\n  DrawerTitle,\n  DrawerTrigger,\n};\n",
-      "type": "registry:ui"
-    }
-  ]
-}