{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "toggle",
  "title": "Toggle",
  "description": "A shadcn-style toggle component built with Ark UI primitives.",
  "dependencies": ["@ark-ui/react", "class-variance-authority"],
  "files": [
    {
      "path": "src/components/ui/toggle.tsx",
      "content": "\"use client\";\n\nimport { Toggle as TogglePrimitive } from \"@ark-ui/react/toggle\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils\";\n\nconst toggleVariants = cva(\n  \"inline-flex shrink-0 cursor-pointer items-center justify-center gap-2 whitespace-nowrap rounded-lg border font-medium text-sm outline-none transition-colors disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    defaultVariants: {\n      size: \"default\",\n      variant: \"default\",\n    },\n    variants: {\n      size: {\n        default: \"h-9 px-3 sm:h-8\",\n        lg: \"h-10 px-3.5 sm:h-9\",\n        sm: \"h-8 px-2.5 sm:h-7\",\n      },\n      variant: {\n        default:\n          \"border-transparent bg-transparent text-foreground hover:bg-accent data-[state=on]:bg-primary/12 data-[state=on]:text-primary\",\n        outline:\n          \"border-input bg-popover text-foreground shadow-xs/5 hover:bg-accent/50 data-[state=on]:border-primary/30 data-[state=on]:bg-primary/12 data-[state=on]:text-primary\",\n      },\n    },\n  },\n);\n\nexport type ToggleProps = TogglePrimitive.RootProps &\n  VariantProps<typeof toggleVariants>;\n\nexport const Toggle = ({ className, size, variant, ...props }: ToggleProps) => (\n  <TogglePrimitive.Root\n    data-slot=\"toggle\"\n    className={cn(toggleVariants({ className, size, variant }))}\n    {...props}\n  />\n);\n\nexport type ToggleIndicatorProps = TogglePrimitive.IndicatorProps;\n\nexport const ToggleIndicator = ({\n  className,\n  ...props\n}: ToggleIndicatorProps) => (\n  <TogglePrimitive.Indicator\n    data-slot=\"toggle-indicator\"\n    className={cn(\"inline-flex items-center justify-center\", className)}\n    {...props}\n  />\n);\n\nexport const ToggleContext = TogglePrimitive.Context;\n\nexport type { UseToggleProps, UseToggleReturn } from \"@ark-ui/react/toggle\";\nexport { useToggle, useToggleContext } from \"@ark-ui/react/toggle\";\n",
      "type": "registry:ui",
      "target": "src/components/ui/toggle.tsx"
    }
  ],
  "type": "registry:ui"
}
