{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "toggle",
  "title": "Toggle",
  "dependencies": [
    "@base-ui/react",
    "class-variance-authority"
  ],
  "registryDependencies": [
    "https://ui.hotfix.jobs/r/recipes.json",
    "https://ui.hotfix.jobs/r/tokens.json",
    "https://ui.hotfix.jobs/r/utils.json"
  ],
  "files": [
    {
      "path": "registry/components/ui/toggle.tsx",
      "content": "\"use client\";\n\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport type * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\nimport { colorTransition, selectionFocus } from \"@/lib/recipes\";\n\nexport const toggleVariants = cva(\n  [\n    \"relative inline-flex shrink-0 items-center justify-center whitespace-nowrap\",\n    \"rounded-[var(--radius-8)]\",\n    \"disabled:pointer-events-none disabled:opacity-50\",\n    \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n    selectionFocus,\n    colorTransition,\n  ].join(\" \"),\n  {\n    defaultVariants: { size: \"md\", variant: \"tertiary\" },\n    variants: {\n      size: {\n        sm: \"h-6 min-w-6 gap-1.5 px-2.5 text-mini font-medium [&_svg:not([class*='size-'])]:size-3.5\",\n        md: \"h-8 min-w-8 gap-2 px-3.5 text-small font-medium [&_svg:not([class*='size-'])]:size-4\",\n        lg: \"h-10 min-w-10 gap-2 px-4 text-regular font-medium [&_svg:not([class*='size-'])]:size-5\",\n      },\n      variant: {\n        tertiary:\n          \"bg-transparent text-ink-muted hover:bg-layer-hover hover:text-ink data-[pressed]:bg-layer-hover data-[pressed]:text-ink\",\n        secondary:\n          \"bg-fill-1 text-ink hover:bg-fill-2 data-[pressed]:bg-fill-2 data-[pressed]:text-ink\",\n      },\n    },\n  },\n);\n\nexport interface ToggleProps\n  extends Omit<\n      React.ComponentProps<typeof TogglePrimitive>,\n      \"value\" | \"defaultValue\" | \"className\"\n    >,\n    VariantProps<typeof toggleVariants> {\n  className?: string;\n  value?: string;\n}\n\n/** Press-to-toggle button with persistent on/off state. */\nexport function Toggle({\n  variant,\n  size,\n  className,\n  ...props\n}: ToggleProps): React.ReactElement {\n  return (\n    <TogglePrimitive\n      data-slot=\"toggle\"\n      className={cn(toggleVariants({ variant, size }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { TogglePrimitive };\n",
      "type": "registry:ui",
      "target": "components/ui/toggle.tsx"
    }
  ],
  "type": "registry:ui"
}