{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "components-headless-checkbox",
  "title": "Checkbox",
  "description": "Checkboxes provide the same functionality as native HTML checkboxes, without any of the styling, giving you a clean slate to design them however you'd like.",
  "dependencies": [
    "class-variance-authority",
    "motion"
  ],
  "registryDependencies": [
    "@animate-ui/v1/primitives-headless-checkbox"
  ],
  "files": [
    {
      "path": "registry/components/headless/checkbox/index.tsx",
      "content": "import * as React from 'react';\nimport { motion } from 'motion/react';\n\nimport {\n  Checkbox as CheckboxPrimitive,\n  CheckboxIndicator as CheckboxIndicatorPrimitive,\n  type CheckboxProps as CheckboxPrimitiveProps,\n} from '@/components/animate-ui/primitives/headless/checkbox';\nimport { cn } from '@/lib/utils';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nconst checkboxVariants = cva(\n  'peer shrink-0 flex items-center justify-center outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 disabled:cursor-not-allowed disabled:opacity-50 transition-colors duration-500 focus-visible:ring-offset-2 [&[data-checked],&[data-indeterminate]]:bg-primary [&[data-checked],&[data-indeterminate]]:text-primary-foreground',\n  {\n    variants: {\n      variant: {\n        default: 'bg-background border',\n        accent: 'bg-input',\n      },\n      size: {\n        default: 'size-5 rounded-sm',\n        sm: 'size-4.5 rounded-[5px]',\n        lg: 'size-6 rounded-[7px]',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\nconst checkboxIndicatorVariants = cva('', {\n  variants: {\n    size: {\n      default: 'size-3.5',\n      sm: 'size-3',\n      lg: 'size-4',\n    },\n  },\n  defaultVariants: {\n    size: 'default',\n  },\n});\n\ntype CheckboxProps<TTag extends React.ElementType = typeof motion.button> =\n  CheckboxPrimitiveProps<TTag> & VariantProps<typeof checkboxVariants>;\n\nfunction Checkbox<TTag extends React.ElementType = typeof motion.button>({\n  className,\n  children,\n  variant,\n  size,\n  ...props\n}: CheckboxProps<TTag>) {\n  return (\n    <CheckboxPrimitive\n      className={cn(checkboxVariants({ variant, size, className }))}\n      {...props}\n    >\n      {(bag) => (\n        <>\n          {typeof children === 'function' ? children(bag) : children}\n          <CheckboxIndicatorPrimitive\n            className={cn(checkboxIndicatorVariants({ size }))}\n          />\n        </>\n      )}\n    </CheckboxPrimitive>\n  );\n}\n\nexport { Checkbox, type CheckboxProps };\n",
      "type": "registry:ui",
      "target": "components/animate-ui/components/headless/checkbox.tsx"
    }
  ],
  "type": "registry:ui"
}