Skip to main content
⚠️ AppKit is in an early development phase and is subject to change without notice. DO NOT use in production environments.

# RadioGroup

Group of radio buttons for selecting a single option

## Example​

    import { Label, RadioGroup, RadioGroupItem } from "@databricks/appkit-ui/react"

    export default function RadioGroupExample() {
      return (
        <RadioGroup defaultValue="comfortable">
          <div className="flex items-center space-x-2">
            <RadioGroupItem value="default" id="r1" />
            <Label htmlFor="r1">Default</Label>
          </div>
          <div className="flex items-center space-x-2">
            <RadioGroupItem value="comfortable" id="r2" />
            <Label htmlFor="r2">Comfortable</Label>
          </div>
          <div className="flex items-center space-x-2">
            <RadioGroupItem value="compact" id="r3" />
            <Label htmlFor="r3">Compact</Label>
          </div>
        </RadioGroup>
      )
    }

## RadioGroup​

Group of radio buttons for selecting a single option

Source: `packages/appkit-ui/src/react/ui/radio-group.tsx`

### Props​

Prop | Type | Required | Default | Description
--- | --- | --- | --- | ---
`name` | `string` |  | - | -
`required` | `boolean` |  | - | -
`disabled` | `boolean` |  | - | -
`dir` | `enum` |  | - | -
`orientation` | `enum` |  | - | -
`loop` | `boolean` |  | - | -
`defaultValue` | `string` |  | - | -
`value` | `string | null` |  | - | -
`onValueChange` | `((value: string) => void)` |  | - | -
`asChild` | `boolean` |  | - | -

### Usage​

    import { RadioGroup } from '@databricks/appkit-ui';

    <RadioGroup /* props */ />

## RadioGroupItem​

Source: `packages/appkit-ui/src/react/ui/radio-group.tsx`

### Props​

Prop | Type | Required | Default | Description
--- | --- | --- | --- | ---
`value` | `string | null` |  | - | -
`asChild` | `boolean` |  | - | -
`checked` | `boolean` |  | - | -
`required` | `boolean` |  | - | -

### Usage​

    import { RadioGroupItem } from '@databricks/appkit-ui';

    <RadioGroupItem /* props */ />