import * as React from 'react'; import { SxProps } from '@mui/system'; import { Theme } from "../styles/index.js"; import { TouchRippleActions, TouchRippleProps } from "./TouchRipple.js"; import { OverrideProps, OverridableComponent, OverridableTypeMap } from "../OverridableComponent/index.js"; import { ButtonBaseClasses } from "./buttonBaseClasses.js"; export { TouchRippleActions, TouchRippleProps }; export interface ButtonBaseOwnProps { /** * A ref for imperative actions. * It currently only supports `focusVisible()` action. */ action?: React.Ref | undefined; /** * If `true`, the ripples are centered. * They won't start at the cursor interaction position. * @default false */ centerRipple?: boolean | undefined; /** * The content of the component. */ children?: React.ReactNode; /** * Override or extend the styles applied to the component. */ classes?: Partial | undefined; /** * If `true`, the component is disabled. * @default false */ disabled?: boolean | undefined; /** * 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. * @default false */ disableRipple?: boolean | undefined; /** * If `true`, the touch ripple effect is disabled. * @default false */ disableTouchRipple?: boolean | undefined; /** * If `true`, the base button will have a keyboard focus ripple. * @default false */ focusRipple?: boolean | undefined; /** * 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](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo). * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md). * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components * if needed. */ focusVisibleClassName?: string | undefined; /** * The component used to render a link when the `href` prop is provided. * @default 'a' */ LinkComponent?: React.ElementType | undefined; /** * Whether the custom component is expected to render a native `