{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "toggle",
  "type": "registry:ui",
  "title": "Toggle",
  "description": "Two-state toggle button on Base UI with sm, default and lg sizes and a pressed style. A shadcn-compatible Toggle for toolbar actions like bold or mute in React.",
  "dependencies": [
    "@base-ui/react",
    "class-variance-authority"
  ],
  "registryDependencies": [
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/toggle.tsx",
      "type": "registry:ui",
      "target": "components/ui/toggle.tsx",
      "content": "\"use client\"\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"@/lib/utils\"\n\nconst toggleVariants = cva(\n  [\n    \"inline-flex items-center justify-center gap-2 rounded-lg border border-transparent text-sm font-medium text-fg\",\n    \"outline-none transition-[background-color,border-color,color] duration-[70ms]\",\n    \"hover:bg-sunken focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2 focus-visible:ring-offset-bg\",\n    \"disabled:pointer-events-none disabled:text-fg-muted\",\n    \"data-[pressed]:border-border data-[pressed]:bg-sunken data-[pressed]:text-fg\",\n  ].join(\" \"),\n  {\n    variants: {\n      size: {\n        sm: \"h-8 px-2.5\",\n        default: \"h-9 px-3\",\n        lg: \"h-11 px-4\",\n      },\n    },\n    defaultVariants: { size: \"default\" },\n  }\n)\n\nfunction Toggle({\n  className,\n  size,\n  ...props\n}: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {\n  return (\n    <TogglePrimitive\n      data-slot=\"toggle\"\n      className={cn(toggleVariants({ size }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Toggle, toggleVariants }\n"
    }
  ]
}