ToggleButton

ReactProps

Props

API reference for ToggleButton. For usage examples, see the React tab.

ToggleButton

Name	Type	Default
children	ChildrenOrFunction<ToggleButtonRenderProps>	—
The children of the component. A function may be provided to alter the children based on component state.
defaultSelected	boolean	—
Whether the element should be selected (uncontrolled).
isDisabled	boolean	—
Whether the button is disabled.
isSelected	boolean	—
Whether the element should be selected (controlled).
size	"lg" | "md" | "sm"	md
Size of the ToggleButton. Ignored when rendered inside a ToggleButtonGroup; use the group's size prop to control sizing for all buttons in the group.
variant	"icon" | "text"	icon
Icon variant is icon only where text accepts a string and icon.

Accessibility (10)(10 props)

Advanced (11)(11 props)

Events (77)(77 props)

Styling (2)(2 props)

ToggleButtonGroup

Name	Type	Default
children	ChildrenOrFunction<ToggleButtonGroupRenderProps>	—
The children of the component. A function may be provided to alter the children based on component state.
disallowEmptySelection	boolean	—
Whether the collection allows empty selection.
fullWidth	boolean	—
Set to true to span all available space of parent.
isDisabled	boolean	—
Whether all items are disabled.
noSeparators	boolean	false
Sets dividers between the ToggleButtons.
orientation	Orientation	horizontal
The orientation of the the toggle button group.
selectionMode	"multiple" | "single"	single
Whether single or multiple selection is enabled.
size	"lg" | "md" | "sm"	md
Size applied to all ToggleButton children in the group. Individual button size props are ignored while inside a ToggleButtonGroup.

Accessibility (4)(4 props)

Advanced (8)(8 props)

Events (64)(64 props)

Forms (2)(2 props)

Styling (2)(2 props)