Props

The component used to render a link when the href prop is provided.

Props applied to the TouchRipple element.

A ref for imperative actions. It currently only supports focusVisible() action.

If true, the ripples are centered. They won't start at the cursor interaction position.

The content of the component.

Override or extend the styles applied to the component.

The component used for the root node. Either a string to use a HTML element or a component.

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.

If true, the touch ripple effect is disabled.

If true, the component is disabled.

If true, the base button will have a keyboard focus ripple.

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.

Callback fired when the component is focused with a keyboard. We trigger a onFocus callback too.

The system prop that allows defining system overrides as well as additional CSS styles.

A ref that points to the TouchRipple element.