ToggleButtonGroup API

The API documentation of the ToggleButtonGroup React component. Learn more about the properties and the CSS customization points.

import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';

Props

Name	Type	Default	Description
children *	node		The content of the button.
classes	object		Override or extend the styles applied to the component. See CSS API below for more details.
exclusive	bool	false	If `true`, only allow one of the child ToggleButton values to be selected.
onChange	func		Callback fired when the value changes. Signature: `function(event: object, value: object) => void` event: The event source of the callback value: of the selected buttons. When `exclusive` is true this is a single value; when false an array of selected values. If no value is selected and `exclusive` is true the value is null; when false an empty array.
size	enum: 'small' \| 'medium' \| 'large'	'medium'	The size of the buttons.
value	any		The currently selected value within the group or an array of selected values when `exclusive` is false.

The component cannot hold a ref.

Any other properties supplied will be provided to the root element (native element).

You can override all the class names injected by Material-UI thanks to the classes property. This property accepts the following keys:

Name	Description
root	Styles applied to the root element.

If using the overrides key of the theme, you need to use the following style sheet name: MuiToggleButtonGroup.

The component can cause issues in StrictMode.