{ "$schema": "https://ui.shadcn.com/schema/registry-item.json", "name": "switch", "title": "Switch", "description": "A neumorphic toggle switch component.", "dependencies": ["@base-ui/react", "class-variance-authority"], "registryDependencies": ["utils"], "files": [ { "path": "src/components/ui/switch.tsx", "content": "import { Switch as BaseSwitch } from \"@base-ui/react/switch\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport type { ComponentProps } from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nconst switchRootVariants = cva(\n [\n \"inline-flex items-center p-1\",\n \"rounded-full transition-all duration-200\",\n \"bg-surface shadow-neu-inset-sm\",\n \"cursor-pointer data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n \"focus-visible:outline-2 focus-visible:outline-primary focus-visible:outline-offset-2\",\n ],\n {\n variants: {\n size: {\n sm: \"w-8 h-5\",\n md: \"w-11 h-6\",\n lg: \"w-14 h-8\",\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n },\n);\n\nconst switchThumbVariants = cva(\n [\n \"rounded-full aspect-square bg-surface-highlight shadow-neu-xs\",\n \"transition-all duration-200\",\n \"data-[checked]:bg-primary data-[checked]:shadow-neu-sm\",\n ],\n {\n variants: {\n size: {\n sm: \"w-3 h-3 data-[checked]:translate-x-3\",\n md: \"w-4 h-4 data-[checked]:translate-x-5\",\n lg: \"w-6 h-6 data-[checked]:translate-x-6\",\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n },\n);\n\nexport type SwitchProps = ComponentProps &\n VariantProps;\n\nexport default function Switch({\n size,\n className,\n children,\n ...props\n}: SwitchProps) {\n return (\n \n \n \n );\n}\n\nexport { switchRootVariants, switchThumbVariants };\n", "type": "registry:ui" } ], "type": "registry:ui" }