{ "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." } } }