{
  "name": "tsf-radio-field",
  "type": "registry:ui",
  "registryDependencies": [
    "field",
    "label",
    "radio-group",
    "tsf-form-context"
  ],
  "files": [
    {
      "path": "./items/tanstack-form/radio-field/component.tsx",
      "type": "registry:ui",
      "target": "./components/ui/shuip/tanstack-form/radio-field.tsx",
      "content": "'use client';\n\nimport { Field, FieldDescription, FieldError, FieldLabel } from '@/components/ui/field';\nimport { Label } from '@/components/ui/label';\nimport { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';\nimport { useFieldContext } from '@/components/ui/shuip/tanstack-form/form-context';\n\nexport interface RadioFieldOption {\n  label: string;\n  value: string;\n}\n\nexport interface RadioFieldProps {\n  options: RadioFieldOption[];\n  label?: string;\n  description?: string;\n  fieldProps?: React.ComponentProps<typeof Field>;\n  props?: React.ComponentProps<typeof RadioGroup>;\n}\n\nexport function RadioField({ options, label, description, fieldProps, props }: RadioFieldProps) {\n  const field = useFieldContext<string>();\n  const { isValid, errors } = field.state.meta;\n\n  return (\n    <Field className='gap-2' data-invalid={!isValid} {...fieldProps}>\n      {label && <FieldLabel>{label}</FieldLabel>}\n      <RadioGroup\n        name={field.name}\n        value={field.state.value}\n        onValueChange={(value) => field.handleChange(value)}\n        onBlur={field.handleBlur}\n        {...props}\n      >\n        {options.map((option) => (\n          <div key={option.value} className='flex items-center space-x-3 space-y-0'>\n            <RadioGroupItem id={`${field.name}-${option.value}`} value={option.value} aria-invalid={!isValid} />\n            <Label htmlFor={`${field.name}-${option.value}`}>{option.label}</Label>\n          </div>\n        ))}\n      </RadioGroup>\n      {!isValid && (\n        <FieldError\n          className='text-xs text-left'\n          errors={errors.map((error) => ({ message: typeof error === 'string' ? error : error?.message }))}\n        />\n      )}\n      {description && <FieldDescription className='text-xs'>{description}</FieldDescription>}\n    </Field>\n  );\n}\n"
    }
  ],
  "$schema": "https://ui.shadcn.com/schema/registry-item.json"
}