Checkbox

Checkboxは、ユーザーが複数の選択肢の中から複数の値を選択するための使用されるコンポーネントです。

ソース @yamada-ui/checkbox

Props

CheckboxProps

説明

If true, the checkbox will be checked.

タイプ

boolean

デフォルト

false

説明

The visual color appearance of the component.

タイプ

"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"

デフォルト

"primary"

説明

If true, the checkbox will be initially checked.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be initially checked.

非推奨

Use defaultChecked instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be disabled.

タイプ

boolean

デフォルト

false

説明

Props for icon component.

タイプ

{
children: ReactElement<any, string | JSXElementConstructor<any>>
} & Omit<HTMLUIProps, "children">

説明

id assigned to input.

タイプ

string

説明

If true, the checkbox will be indeterminate.

タイプ

boolean

デフォルト

false

説明

Props for input element.

タイプ

InputHTMLAttributes<HTMLInputElement>

説明

If true, the form control will be invalid.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be checked.

非推奨

Use checked instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be disabled.

非推奨

Use disabled instead.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be indeterminate.

非推奨

Use indeterminate instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be invalid.

非推奨

Use invalid instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be readonly.

非推奨

Use readOnly instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

非推奨

Use required instead.

タイプ

boolean

デフォルト

false

説明

The label of the checkbox.

タイプ

type ONLY_FOR_FORMAT =
| string
| number
| boolean
| ReactElement<any, string | JSXElementConstructor<any>>
| Iterable<ReactNode>
| ReactPortal

説明

Props for label element.

タイプ

HTMLUIProps<"span">

説明

The HTML name attribute used for forms.

タイプ

string

説明

The callback invoked when the checkbox is blurred.

タイプ

FocusEventHandler<HTMLInputElement>

説明

The callback invoked when the checked state changes.

タイプ

ChangeEventHandler<HTMLInputElement>

説明

The callback invoked when the checkbox is focused.

タイプ

FocusEventHandler<HTMLInputElement>

説明

If true, the form control will be readonly.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be selected when the Enter key is pressed.

タイプ

boolean

デフォルト

false

説明

The size of the Checkbox.

タイプ

"sm" | "md" | "lg"

デフォルト

"md"

説明

The tab-index property of the underlying input element.

タイプ

number

説明

The value to be used in the checkbox input.

タイプ

Y

説明

The variant of the Checkbox.

タイプ

string

CheckboxGroupProps

説明

The CSS align-items property.

タイプ

UIValue<AlignItems>

説明

The CSS flex-basis property.

タイプ

UIValue<number | "content" | "px" | "initial" | "inherit" | "max" | "min" | "1" | "-moz-initial" | "revert" | "revert-layer" | "unset" | "2xl" | "lg" | "md" | "sm" | "xl" | ({} & string) | ... 68 more ... | "xs">

説明

The initial value of the checkbox group.

タイプ

Y[]

説明

The CSS flex-direction property.

タイプ

UIValue<FlexDirection>

説明

If true, the form control will be disabled.

タイプ

boolean

デフォルト

false

説明

The CSS flex-grow property.

タイプ

UIValue<FlexGrow>

説明

If true, the form control will be invalid.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be disabled.

非推奨

Use disabled instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be invalid.

非推奨

Use invalid instead.

タイプ

boolean

デフォルト

false

説明

If true, input elements will receive checked attribute instead of isChecked. This assumes, you're using native radio inputs.

非推奨

It will be deprecated in version 2.0.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be readonly.

非推奨

Use readOnly instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

非推奨

Use required instead.

タイプ

boolean

デフォルト

false

説明

If provided, generate checkboxes based on items.

タイプ

CheckboxItem<Y>[]

デフォルト

'[]'

説明

The CSS justify-content property.

タイプ

UIValue<JustifyContent>

説明

The callback fired when any children checkbox is checked or unchecked.

タイプ

(value: Y[]) => void

説明

If true, the form control will be readonly.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

タイプ

boolean

デフォルト

false

説明

The CSS flex-shrink property.

タイプ

UIValue<FlexShrink>

説明

The value of the checkbox group.

タイプ

Y[]

説明

The CSS flex-wrap property.

タイプ

UIValue<FlexWrap>

CheckboxIconProps

説明

The HTML element to render.

タイプ

keyof IntrinsicElements

説明

If true, the icon will be checked.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be disabled.

タイプ

boolean

デフォルト

false

説明

If true, the icon will be indeterminate.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be invalid.

タイプ

boolean

デフォルト

false

説明

If true, the icon will be checked.

非推奨

Use checked instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be disabled.

非推奨

Use disabled instead.

タイプ

boolean

デフォルト

false

説明

If true, the icon will be indeterminate.

非推奨

Use indeterminate instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be invalid.

非推奨

Use invalid instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be readonly.

非推奨

Use readOnly instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

非推奨

Use required instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be readonly.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

タイプ

boolean

デフォルト

false

UseCheckboxProps

説明

If true, the checkbox will be checked.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be initially checked.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be initially checked.

非推奨

Use defaultChecked instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be disabled.

タイプ

boolean

デフォルト

false

説明

id assigned to input.

タイプ

string

説明

If true, the checkbox will be indeterminate.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be invalid.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be checked.

非推奨

Use checked instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be disabled.

非推奨

Use disabled instead.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be indeterminate.

非推奨

Use indeterminate instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be invalid.

非推奨

Use invalid instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be readonly.

非推奨

Use readOnly instead.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

非推奨

Use required instead.

タイプ

boolean

デフォルト

false

説明

The HTML name attribute used for forms.

タイプ

string

説明

The callback invoked when the checkbox is blurred.

タイプ

FocusEventHandler<HTMLInputElement>

説明

The callback invoked when the checked state changes.

タイプ

ChangeEventHandler<HTMLInputElement>

説明

The callback invoked when the checkbox is focused.

タイプ

FocusEventHandler<HTMLInputElement>

説明

If true, the form control will be readonly.

タイプ

boolean

デフォルト

false

説明

If true, the form control will be required.

タイプ

boolean

デフォルト

false

説明

If true, the checkbox will be selected when the Enter key is pressed.

タイプ

boolean

デフォルト

false

説明

The tab-index property of the underlying input element.

タイプ

number

説明

The value to be used in the checkbox input.

タイプ

Y

UseCheckboxGroupProps

説明

The initial value of the checkbox group.

タイプ

Y[]

説明

If true, input elements will receive checked attribute instead of isChecked. This assumes, you're using native radio inputs.

非推奨

It will be deprecated in version 2.0.

タイプ

boolean

デフォルト

false

説明

The callback fired when any children checkbox is checked or unchecked.

タイプ

(value: Y[]) => void

説明

The value of the checkbox group.

タイプ

Y[]

GitHubでこのページを編集する

前RadioCard 次CheckboxCard