RadioGroup

Radio group selection.

Use RadioGroup to let users pick one of several options.

import { RadioGroup, RadioGroupItem } from '@tile-ui/react';

export default function RadioGroupDemo() {
	return (
		<RadioGroup defaultValue="a" orientation="horizontal">
			<div className="button-group">

Registry install

pnpm dlx shadcn@latest add @tile-ui/radio-group

Package usage

import { RadioGroup, RadioGroupItem } from '@tile-ui/react';
 
<RadioGroup defaultValue="a">
	<RadioGroupItem value="a" />
	<RadioGroupItem value="b" />
</RadioGroup>

Highlights

  • Controlled and uncontrolled
  • Horizontal and vertical
  • Item disabled

Registry dependencies

ItemPurpose
radio-groupComponent source and module styles
coreFramework-agnostic logic helpers
stylesShared SCSS tokens and globals

API reference

RadioGroup

PropTypeDefault
valuestring
defaultValuestring
onValueChange(value: string) => void
orientation'horizontal' | 'vertical'
namestring
disabledboolean

RadioGroupItem

PropTypeDefault
valuestring
disabledboolean