{
  "name": "rhf-radio-field",
  "type": "registry:ui",
  "dependencies": [
    "@hookform/lenses",
    "react",
    "react-hook-form"
  ],
  "registryDependencies": [
    "field",
    "label",
    "radio-group"
  ],
  "files": [
    {
      "path": "./items/react-hook-form/radio-field/component.tsx",
      "type": "registry:ui",
      "target": "./components/ui/shuip/react-hook-form/radio-field.tsx",
      "content": "'use client';\n\nimport type { Lens } from '@hookform/lenses';\nimport type * as React from 'react';\nimport { useController } from 'react-hook-form';\nimport { Field, FieldDescription, FieldError, FieldLabel } from '@/components/ui/field';\nimport { Label } from '@/components/ui/label';\nimport { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';\n\nexport interface RadioFieldProps\n  extends Omit<React.ComponentProps<typeof RadioGroup>, 'value' | 'defaultValue' | 'onValueChange'> {\n  lens: Lens<string>;\n  options: string[];\n  label?: string;\n  description?: string;\n}\n\nexport function RadioField({ lens, options, label, description, ...props }: RadioFieldProps) {\n  const { field, fieldState } = useController(lens.interop());\n\n  return (\n    <Field className='gap-2' data-invalid={fieldState.invalid}>\n      {label && <FieldLabel>{label}</FieldLabel>}\n      <RadioGroup\n        name={field.name}\n        value={field.value ?? ''}\n        onValueChange={field.onChange}\n        onBlur={field.onBlur}\n        className='flex flex-col space-y-1'\n        aria-invalid={fieldState.invalid}\n        {...props}\n      >\n        {options.map((value) => (\n          <div key={value} className='flex items-center space-x-3 space-y-0'>\n            <RadioGroupItem id={`${field.name}-${value}`} value={value} aria-invalid={fieldState.invalid} />\n            <Label htmlFor={`${field.name}-${value}`} className='font-normal'>\n              {value}\n            </Label>\n          </div>\n        ))}\n      </RadioGroup>\n      {fieldState.invalid && <FieldError className='text-xs text-left' errors={[fieldState.error]} />}\n      {description && <FieldDescription className='text-xs'>{description}</FieldDescription>}\n    </Field>\n  );\n}\n"
    }
  ],
  "$schema": "https://ui.shadcn.com/schema/registry-item.json"
}
