{
"componentDescription": "`ButtonBase` contains as few styles as possible.\nIt aims to be a simple building block for creating a button.\nIt contains a load of style reset and some focus/ripple logic.",
"propDescriptions": {
"action": {
"description": "A ref for imperative actions. It currently only supports focusVisible() action."
},
"centerRipple": {
"description": "If true, the ripples are centered. They won't start at the cursor interaction position."
},
"children": { "description": "The content of the component." },
"classes": { "description": "Override or extend the styles applied to the component." },
"component": {
"description": "The component used for the root node. Either a string to use a HTML element or a component.",
"requiresRef": true
},
"disabled": { "description": "If true, the component is disabled." },
"disableRipple": {
"description": "If true, the ripple effect is disabled.
⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure to highlight the element by applying separate styles with the .Mui-focusVisible class."
},
"disableTouchRipple": {
"description": "If true, the touch ripple effect is disabled."
},
"focusRipple": {
"description": "If true, the base button will have a keyboard focus ripple."
},
"focusVisibleClassName": {
"description": "This prop can help identify which element has keyboard focus. The class name will be applied when the element gains the focus through keyboard interaction. It's a polyfill for the CSS :focus-visible selector. The rationale for using this feature is explained here. A polyfill can be used to apply a focus-visible class to other components if needed."
},
"LinkComponent": {
"description": "The component used to render a link when the href prop is provided."
},
"onFocusVisible": {
"description": "Callback fired when the component is focused with a keyboard. We trigger a onFocus callback too."
},
"sx": {
"description": "The system prop that allows defining system overrides as well as additional CSS styles."
},
"TouchRippleProps": { "description": "Props applied to the TouchRipple element." },
"touchRippleRef": {
"description": "A ref that points to the TouchRipple element."
}
},
"classDescriptions": {
"disabled": {
"description": "State class applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the root element",
"conditions": "disabled={true}"
},
"focusVisible": {
"description": "State class applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the root element",
"conditions": "keyboard focused"
},
"root": { "description": "Styles applied to the root element." }
}
}