{
"componentDescription": "",
"propDescriptions": {
"checked": { "description": "If true, the component is checked." },
"checkedIcon": { "description": "The icon to display when the component is checked." },
"classes": { "description": "Override or extend the styles applied to the component." },
"color": {
"description": "The color of the component. It supports both default and custom theme colors, which can be added as shown in the palette customization guide."
},
"defaultChecked": {
"description": "The default checked state. Use when the component is not controlled."
},
"disabled": { "description": "If true, the component is disabled." },
"disableRipple": { "description": "If true, the ripple effect is disabled." },
"icon": { "description": "The icon to display when the component is unchecked." },
"id": { "description": "The id of the input element." },
"indeterminate": {
"description": "If true, the component appears indeterminate. This does not set the native input element to indeterminate due to inconsistent behavior across browsers. However, we set a data-indeterminate attribute on the input."
},
"indeterminateIcon": {
"description": "The icon to display when the component is indeterminate."
},
"inputProps": {
"description": "Attributes applied to the input element."
},
"onChange": {
"description": "Callback fired when the state is changed.",
"typeDescriptions": {
"event": {
"name": "event",
"description": "The event source of the callback. You can pull out the new checked state by accessing event.target.checked (boolean)."
}
}
},
"required": {
"description": "If true, the input element is required."
},
"size": {
"description": "The size of the component. small is equivalent to the dense checkbox styling."
},
"slotProps": { "description": "The props used for each slot inside." },
"slots": { "description": "The components used for each slot inside." },
"sx": {
"description": "The system prop that allows defining system overrides as well as additional CSS styles."
},
"value": {
"description": "The value of the component. The DOM API casts this to a string. The browser uses "on" as the default value."
}
},
"classDescriptions": {
"checked": {
"description": "State class applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the root element",
"conditions": "checked={true}"
},
"colorPrimary": {
"description": "State class applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the root element",
"conditions": "color=\"primary\""
},
"colorSecondary": {
"description": "State class applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the root element",
"conditions": "color=\"secondary\""
},
"disabled": {
"description": "State class applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the root element",
"conditions": "disabled={true}"
},
"indeterminate": {
"description": "State class applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the root element",
"conditions": "indeterminate={true}"
},
"sizeMedium": {
"description": "State class applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the root element",
"conditions": "size=\"medium\""
},
"sizeSmall": {
"description": "State class applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the root element",
"conditions": "size=\"small\""
}
},
"slotDescriptions": {
"input": "The component that renders the input slot.",
"root": "The component that renders the root slot."
}
}