ToggleButtonGroup

The ToggleButtonGroup is used to group related options. The group consists of at least two ToggleButtonGroupItems. The ToggleButtonGroup supports exclusive selection only. That means that selecting one option deselects any other.

OverviewPropertiesUsage

ToggleButtonGroupProps

Signature:

export declare type ToggleButtonGroupProps = & ( | );

ToggleButtonGroupBaseProps

extends, , , , ,

Name	Type	Default	Description
required?		false	When true, at least one item in the group has to be active. Otherwise, no item needs to be active.
readOnly?		false	When true, all items in the group are read only.
name?		-	Name used for the component when submitting it in a form.
disabled?		false	When true, all items in the group are disabled and this means for example they cannot be interacted with.

ToggleButtonGroupControlledProps

Name	Type	Default	Description
value		-	The controlled value for the entire ToggleButtonGroup.
onChange	(value: , event?: < | >) =>	-	Handler that is called when the value of the group changes.

ToggleButtonGroupUncontrolledProps

Name	Type	Default	Description
defaultValue?		-	The value of the group (uncontrolled).

ToggleButtonGroupItem

You can use the ToggleButtonGroupItem component to render an item inside the ToggleButtonGroup.

ToggleButtonGroupItemProps

extends, , , ,

Name	Type	Default	Description
disabled?		false	When true, the item cannot be clicked for example.
value		-	The controlled value of the ToggleButtonGroupItem.
checked?		false	Zero or more items in a group can be checked.
hovered?		false	Indicates if the mover is currently over the item.