{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "radio-group",
  "title": "Radio Group",
  "description": "A composable single-choice control with fully clickable options, labels, and descriptions.",
  "dependencies": [
    "@base-ui/react"
  ],
  "files": [
    {
      "path": "registry/rivetui/components/radio-group/radio-group.tsx",
      "content": "\"use client\";\n\nimport { Radio as RadioPrimitive } from \"@base-ui/react/radio\";\nimport { RadioGroup as RadioGroupPrimitive } from \"@base-ui/react/radio-group\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype RadioGroupState = {\n  disabled: boolean;\n  invalid: boolean;\n};\n\nconst RadioGroupStateContext = React.createContext<RadioGroupState>({\n  disabled: false,\n  invalid: false,\n});\n\nfunction isAriaInvalid(value: React.AriaAttributes[\"aria-invalid\"]) {\n  return value !== undefined && value !== false && value !== \"false\";\n}\n\nfunction RadioGroup<Value>({\n  className,\n  children,\n  disabled = false,\n  \"aria-invalid\": ariaInvalid,\n  ...props\n}: RadioGroupPrimitive.Props<Value>) {\n  return (\n    <RadioGroupStateContext.Provider value={{ disabled, invalid: isAriaInvalid(ariaInvalid) }}>\n      <RadioGroupPrimitive\n        data-slot=\"radio-group\"\n        className={cn(\"group/radio-group grid w-full gap-2 outline-none\", className)}\n        disabled={disabled}\n        aria-invalid={ariaInvalid}\n        {...props}\n      >\n        {children}\n      </RadioGroupPrimitive>\n    </RadioGroupStateContext.Provider>\n  );\n}\n\nfunction RadioOption<Value>({\n  className,\n  children,\n  disabled = false,\n  id,\n  tabIndex,\n  \"aria-invalid\": ariaInvalid,\n  ...props\n}: RadioPrimitive.Root.Props<Value>) {\n  const groupState = React.useContext(RadioGroupStateContext);\n  const generatedId = React.useId();\n  const controlId = id ?? generatedId;\n  const isDisabled = groupState.disabled || disabled;\n  const isInvalid = groupState.invalid || isAriaInvalid(ariaInvalid);\n\n  return (\n    <label\n      htmlFor={controlId}\n      data-slot=\"radio-option\"\n      className={cn(\n        \"grid min-w-0 cursor-pointer grid-cols-[auto_minmax(0,1fr)] gap-x-3 gap-y-1 rounded-none border border-border bg-background p-4 outline-none transition-[background-color,border-color,box-shadow,opacity] duration-100 hover:border-foreground/40 has-[:focus-visible]:border-ring has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-ring/40 has-data-checked:border-foreground/50 has-data-checked:bg-muted/40 has-data-disabled:cursor-not-allowed has-data-disabled:opacity-40 group-aria-invalid/radio-group:border-destructive group-aria-invalid/radio-group:has-[:focus-visible]:border-destructive group-aria-invalid/radio-group:has-[:focus-visible]:ring-destructive/25 group-data-invalid/radio-group:border-destructive group-data-invalid/radio-group:has-[:focus-visible]:border-destructive group-data-invalid/radio-group:has-[:focus-visible]:ring-destructive/25 motion-reduce:transition-none\",\n        isInvalid &&\n          \"border-destructive has-[:focus-visible]:border-destructive has-[:focus-visible]:ring-destructive/25\",\n        className,\n      )}\n    >\n      <RadioPrimitive.Root\n        id={controlId}\n        data-slot=\"radio-option-control\"\n        className={cn(\n          \"relative mt-0.5 inline-flex size-4 row-span-2 shrink-0 items-center justify-center rounded-full border border-input bg-background outline-none transition-[background-color,border-color,box-shadow,opacity] duration-100 focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/40 data-checked:border-primary data-checked:bg-primary data-disabled:cursor-not-allowed aria-invalid:border-destructive aria-invalid:focus-visible:border-destructive aria-invalid:focus-visible:ring-destructive/25 motion-reduce:transition-none\",\n          isInvalid &&\n            \"border-destructive focus-visible:border-destructive focus-visible:ring-destructive/25\",\n        )}\n        disabled={isDisabled}\n        aria-invalid={ariaInvalid}\n        {...props}\n        {...(isDisabled || tabIndex !== undefined ? { tabIndex: isDisabled ? -1 : tabIndex } : {})}\n      >\n        <RadioPrimitive.Indicator\n          data-slot=\"radio-option-indicator\"\n          className=\"grid size-full place-items-center\"\n        >\n          <span className=\"size-1.5 rounded-full bg-primary-foreground\" />\n        </RadioPrimitive.Indicator>\n      </RadioPrimitive.Root>\n      {children}\n    </label>\n  );\n}\n\nfunction RadioOptionLabel({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"radio-option-label\"\n      className={cn(\"col-start-2 text-sm font-medium leading-snug text-foreground\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction RadioOptionDescription({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"radio-option-description\"\n      className={cn(\"col-start-2 text-sm leading-relaxed text-muted-foreground\", className)}\n      {...props}\n    />\n  );\n}\n\nexport { RadioGroup, RadioOption, RadioOptionDescription, RadioOptionLabel };\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}