forms

Radio

Display a radio field.

Usage

<URadio />

Label

Use the label prop to display a label on the right.

<URadio label="Label" />

Required

Use the required prop to display a red star next to the label.

<URadio label="Label" required />

Help

Use the help prop to display some text under the Radio.

Please choose one

<URadio label="Label" help="Please choose one" />

Disabled

Use the disabled prop to disable the Radio.

<URadio disabled />

Props

Prop Default Description
valuenullstring | number | boolean
modelValuenullstring | number | boolean | Record<string, any>
namenullstring
labelnullstring
helpnullstring
requiredfalseboolean
disabledfalseboolean
uiappConfig.ui.radioany

Preset

{
  "wrapper": "relative flex items-start",
  "base": "h-4 w-4 text-primary-500 dark:text-primary-400 focus-visible:ring-2 focus-visible:ring-offset-2 bg-white dark:bg-gray-900 dark:checked:bg-current dark:checked:border-transparent focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400 focus-visible:ring-offset-white dark:focus-visible:ring-offset-gray-900 border-gray-300 dark:border-gray-700 disabled:opacity-50 disabled:cursor-not-allowed focus:ring-0 focus:ring-transparent focus:ring-offset-transparent",
  "label": "font-medium text-gray-700 dark:text-gray-200",
  "required": "text-red-500 dark:text-red-400",
  "help": "text-gray-500 dark:text-gray-400"
}

Made by