{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "radio-group",
  "title": "Radio Group",
  "description": "Radio group + item on radix-ui with 4 tones and 3 sizes. Exports RadioGroup and RadioGroupItem.",
  "dependencies": [
    "class-variance-authority@^0.7.1",
    "radix-ui@^1.6.1"
  ],
  "registryDependencies": [
    "@ai2/tokens",
    "@ai2/primitives"
  ],
  "files": [
    {
      "path": "registry/ai2/ui/radio-group.tsx",
      "content": "\"use client\"\n\nimport type * as React from \"react\"\nimport { RadioGroup as RadioGroupPrimitive } from \"@/registry/ai2/ui/primitives\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\nfunction RadioGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Root>) {\n  return (\n    <RadioGroupPrimitive.Root\n      data-slot=\"radio-group\"\n      className={cn(\"grid gap-3\", className)}\n      {...props}\n    />\n  )\n}\n\nconst radioItemVariants = cva(\n  \"relative aspect-square shrink-0 rounded-full border border-field-border shadow-xs outline-none transition-colors duration-(--motion-fast) after:absolute after:-inset-1.5 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-danger aria-invalid:ring-danger/20 dark:aria-invalid:ring-danger/40 dark:bg-input/30\",\n  {\n    variants: {\n      tone: {\n        neutral: \"data-[state=checked]:border-primary text-primary\",\n        brand: \"data-[state=checked]:border-brand text-brand\",\n        success: \"data-[state=checked]:border-success text-success\",\n        danger: \"data-[state=checked]:border-danger text-danger\",\n      },\n      size: {\n        sm: \"size-3.5\",\n        md: \"size-4\",\n        lg: \"size-5\",\n      },\n    },\n    defaultVariants: { tone: \"neutral\", size: \"md\" },\n  }\n)\n\ninterface RadioGroupItemProps\n  extends React.ComponentProps<typeof RadioGroupPrimitive.Item>,\n    VariantProps<typeof radioItemVariants> {}\n\nfunction RadioGroupItem({ className, tone, size, ...props }: RadioGroupItemProps) {\n  return (\n    <RadioGroupPrimitive.Item\n      data-slot=\"radio-group-item\"\n      data-tone={tone ?? \"neutral\"}\n      className={cn(radioItemVariants({ tone, size, className }))}\n      {...props}\n    >\n      <RadioGroupPrimitive.Indicator\n        data-slot=\"radio-group-indicator\"\n        className=\"flex size-full items-center justify-center\"\n      >\n        <span className=\"size-1/2 rounded-full bg-current\" />\n      </RadioGroupPrimitive.Indicator>\n    </RadioGroupPrimitive.Item>\n  )\n}\n\nexport { RadioGroup, RadioGroupItem, radioItemVariants, type RadioGroupItemProps }\n",
      "type": "registry:ui"
    }
  ],
  "docs": "Wrap RadioGroupItem elements in RadioGroup and give each item a value. tone/size are set per item.",
  "categories": [
    "form"
  ],
  "type": "registry:ui"
}