@cgi-learning-hub/ui 0.0.1-dev.1708990372 → 0.0.1-dev.1709027888

package/dist/ButtonBase-B0tkJ9zf.js

@@ -0,0 +1,831 @@
+import { _ as Y, e as ie, P as e, f as x, g as ye, s as re, b as Te, a as Xe, h as Ye } from "./useThemeProps-Dg9Uoq7q.js";
+import * as p from "react";
+import W, { Children as Ae, isValidElement as G, cloneElement as J } from "react";
+import { jsx as I, jsxs as qe } from "react/jsx-runtime";
+import { u as We, a as H } from "./useTimeout-KN97abZR.js";
+import { _ as He, T as de } from "./TransitionGroupContext-C7wWJ6l7.js";
+import { keyframes as se } from "@emotion/react";
+import { a as he } from "./useForkRef-DwN_Iz9R.js";
+import { u as Ge } from "./useIsFocusVisible-D8ksiuhS.js";
+import { r as Je, e as Qe } from "./refType-Hh9tfnoF.js";
+function Ze(t) {
+  if (t === void 0)
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  return t;
+}
+function ae(t, s) {
+  var a = function(n) {
+    return s && G(n) ? s(n) : n;
+  }, l = /* @__PURE__ */ Object.create(null);
+  return t && Ae.map(t, function(o) {
+    return o;
+  }).forEach(function(o) {
+    l[o.key] = a(o);
+  }), l;
+}
+function et(t, s) {
+  t = t || {}, s = s || {};
+  function a(h) {
+    return h in s ? s[h] : t[h];
+  }
+  var l = /* @__PURE__ */ Object.create(null), o = [];
+  for (var n in t)
+    n in s ? o.length && (l[n] = o, o = []) : o.push(n);
+  var i, c = {};
+  for (var u in s) {
+    if (l[u])
+      for (i = 0; i < l[u].length; i++) {
+        var f = l[u][i];
+        c[l[u][i]] = a(f);
+      }
+    c[u] = a(u);
+  }
+  for (i = 0; i < o.length; i++)
+    c[o[i]] = a(o[i]);
+  return c;
+}
+function F(t, s, a) {
+  return a[s] != null ? a[s] : t.props[s];
+}
+function tt(t, s) {
+  return ae(t.children, function(a) {
+    return J(a, {
+      onExited: s.bind(null, a),
+      in: !0,
+      appear: F(a, "appear", t),
+      enter: F(a, "enter", t),
+      exit: F(a, "exit", t)
+    });
+  });
+}
+function nt(t, s, a) {
+  var l = ae(t.children), o = et(s, l);
+  return Object.keys(o).forEach(function(n) {
+    var i = o[n];
+    if (G(i)) {
+      var c = n in s, u = n in l, f = s[n], h = G(f) && !f.props.in;
+      u && (!c || h) ? o[n] = J(i, {
+        onExited: a.bind(null, i),
+        in: !0,
+        exit: F(i, "exit", t),
+        enter: F(i, "enter", t)
+      }) : !u && c && !h ? o[n] = J(i, {
+        in: !1
+      }) : u && c && G(f) && (o[n] = J(i, {
+        onExited: a.bind(null, i),
+        in: f.props.in,
+        exit: F(i, "exit", t),
+        enter: F(i, "enter", t)
+      }));
+    }
+  }), o;
+}
+var ot = Object.values || function(t) {
+  return Object.keys(t).map(function(s) {
+    return t[s];
+  });
+}, it = {
+  component: "div",
+  childFactory: function(s) {
+    return s;
+  }
+}, le = /* @__PURE__ */ function(t) {
+  He(s, t);
+  function s(l, o) {
+    var n;
+    n = t.call(this, l, o) || this;
+    var i = n.handleExited.bind(Ze(n));
+    return n.state = {
+      contextValue: {
+        isMounting: !0
+      },
+      handleExited: i,
+      firstRender: !0
+    }, n;
+  }
+  var a = s.prototype;
+  return a.componentDidMount = function() {
+    this.mounted = !0, this.setState({
+      contextValue: {
+        isMounting: !1
+      }
+    });
+  }, a.componentWillUnmount = function() {
+    this.mounted = !1;
+  }, s.getDerivedStateFromProps = function(o, n) {
+    var i = n.children, c = n.handleExited, u = n.firstRender;
+    return {
+      children: u ? tt(o, c) : nt(o, i, c),
+      firstRender: !1
+    };
+  }, a.handleExited = function(o, n) {
+    var i = ae(this.props.children);
+    o.key in i || (o.props.onExited && o.props.onExited(n), this.mounted && this.setState(function(c) {
+      var u = Y({}, c.children);
+      return delete u[o.key], {
+        children: u
+      };
+    }));
+  }, a.render = function() {
+    var o = this.props, n = o.component, i = o.childFactory, c = ie(o, ["component", "childFactory"]), u = this.state.contextValue, f = ot(this.state.children).map(i);
+    return delete c.appear, delete c.enter, delete c.exit, n === null ? /* @__PURE__ */ W.createElement(de.Provider, {
+      value: u
+    }, f) : /* @__PURE__ */ W.createElement(de.Provider, {
+      value: u
+    }, /* @__PURE__ */ W.createElement(n, c, f));
+  }, s;
+}(W.Component);
+le.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * `<TransitionGroup>` renders a `<div>` by default. You can change this
+   * behavior by providing a `component` prop.
+   * If you use React v16+ and would like to avoid a wrapping `<div>` element
+   * you can pass in `component={null}`. This is useful if the wrapping div
+   * borks your css styles.
+   */
+  component: e.any,
+  /**
+   * A set of `<Transition>` components, that are toggled `in` and out as they
+   * leave. the `<TransitionGroup>` will inject specific transition props, so
+   * remember to spread them through if you are wrapping the `<Transition>` as
+   * with our `<Fade>` example.
+   *
+   * While this component is meant for multiple `Transition` or `CSSTransition`
+   * children, sometimes you may want to have a single transition child with
+   * content that you want to be transitioned out and in when you change it
+   * (e.g. routes, images etc.) In that case you can change the `key` prop of
+   * the transition child as you change its content, this will cause
+   * `TransitionGroup` to transition the child out and back in.
+   */
+  children: e.node,
+  /**
+   * A convenience prop that enables or disables appear animations
+   * for all children. Note that specifying this will override any defaults set
+   * on individual children Transitions.
+   */
+  appear: e.bool,
+  /**
+   * A convenience prop that enables or disables enter animations
+   * for all children. Note that specifying this will override any defaults set
+   * on individual children Transitions.
+   */
+  enter: e.bool,
+  /**
+   * A convenience prop that enables or disables exit animations
+   * for all children. Note that specifying this will override any defaults set
+   * on individual children Transitions.
+   */
+  exit: e.bool,
+  /**
+   * You may need to apply reactive updates to a child as it is exiting.
+   * This is generally done by using `cloneElement` however in the case of an exiting
+   * child the element has already been removed and not accessible to the consumer.
+   *
+   * If you do need to update a child as it leaves you can provide a `childFactory`
+   * to wrap every child, even the ones that are leaving.
+   *
+   * @type Function(child: ReactElement) -> ReactElement
+   */
+  childFactory: e.func
+} : {};
+le.defaultProps = it;
+const rt = le;
+function Me(t) {
+  const {
+    className: s,
+    classes: a,
+    pulsate: l = !1,
+    rippleX: o,
+    rippleY: n,
+    rippleSize: i,
+    in: c,
+    onExited: u,
+    timeout: f
+  } = t, [h, y] = p.useState(!1), g = x(s, a.ripple, a.rippleVisible, l && a.ripplePulsate), v = {
+    width: i,
+    height: i,
+    top: -(i / 2) + n,
+    left: -(i / 2) + o
+  }, m = x(a.child, h && a.childLeaving, l && a.childPulsate);
+  return !c && !h && y(!0), p.useEffect(() => {
+    if (!c && u != null) {
+      const T = setTimeout(u, f);
+      return () => {
+        clearTimeout(T);
+      };
+    }
+  }, [u, c, f]), /* @__PURE__ */ I("span", {
+    className: g,
+    style: v,
+    children: /* @__PURE__ */ I("span", {
+      className: m
+    })
+  });
+}
+process.env.NODE_ENV !== "production" && (Me.propTypes = {
+  /**
+   * Override or extend the styles applied to the component.
+   * See [CSS API](#css) below for more details.
+   */
+  classes: e.object.isRequired,
+  className: e.string,
+  /**
+   * @ignore - injected from TransitionGroup
+   */
+  in: e.bool,
+  /**
+   * @ignore - injected from TransitionGroup
+   */
+  onExited: e.func,
+  /**
+   * If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element.
+   */
+  pulsate: e.bool,
+  /**
+   * Diameter of the ripple.
+   */
+  rippleSize: e.number,
+  /**
+   * Horizontal position of the ripple center.
+   */
+  rippleX: e.number,
+  /**
+   * Vertical position of the ripple center.
+   */
+  rippleY: e.number,
+  /**
+   * exit delay
+   */
+  timeout: e.number.isRequired
+});
+const b = ye("MuiTouchRipple", ["root", "ripple", "rippleVisible", "ripplePulsate", "child", "childLeaving", "childPulsate"]), st = ["center", "classes", "className"];
+let Q = (t) => t, me, be, ge, Re;
+const oe = 550, at = 80, lt = se(me || (me = Q`
+  0% {
+    transform: scale(0);
+    opacity: 0.1;
+  }
+
+  100% {
+    transform: scale(1);
+    opacity: 0.3;
+  }
+`)), ut = se(be || (be = Q`
+  0% {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+  }
+`)), ct = se(ge || (ge = Q`
+  0% {
+    transform: scale(1);
+  }
+
+  50% {
+    transform: scale(0.92);
+  }
+
+  100% {
+    transform: scale(1);
+  }
+`)), pt = re("span", {
+  name: "MuiTouchRipple",
+  slot: "Root"
+})({
+  overflow: "hidden",
+  pointerEvents: "none",
+  position: "absolute",
+  zIndex: 0,
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+  borderRadius: "inherit"
+}), ft = re(Me, {
+  name: "MuiTouchRipple",
+  slot: "Ripple"
+})(Re || (Re = Q`
+  opacity: 0;
+  position: absolute;
+
+  &.${0} {
+    opacity: 0.3;
+    transform: scale(1);
+    animation-name: ${0};
+    animation-duration: ${0}ms;
+    animation-timing-function: ${0};
+  }
+
+  &.${0} {
+    animation-duration: ${0}ms;
+  }
+
+  & .${0} {
+    opacity: 1;
+    display: block;
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    background-color: currentColor;
+  }
+
+  & .${0} {
+    opacity: 0;
+    animation-name: ${0};
+    animation-duration: ${0}ms;
+    animation-timing-function: ${0};
+  }
+
+  & .${0} {
+    position: absolute;
+    /* @noflip */
+    left: 0px;
+    top: 0;
+    animation-name: ${0};
+    animation-duration: 2500ms;
+    animation-timing-function: ${0};
+    animation-iteration-count: infinite;
+    animation-delay: 200ms;
+  }
+`), b.rippleVisible, lt, oe, ({
+  theme: t
+}) => t.transitions.easing.easeInOut, b.ripplePulsate, ({
+  theme: t
+}) => t.transitions.duration.shorter, b.child, b.childLeaving, ut, oe, ({
+  theme: t
+}) => t.transitions.easing.easeInOut, b.childPulsate, ct, ({
+  theme: t
+}) => t.transitions.easing.easeInOut), Ee = /* @__PURE__ */ p.forwardRef(function(s, a) {
+  const l = Te({
+    props: s,
+    name: "MuiTouchRipple"
+  }), {
+    center: o = !1,
+    classes: n = {},
+    className: i
+  } = l, c = ie(l, st), [u, f] = p.useState([]), h = p.useRef(0), y = p.useRef(null);
+  p.useEffect(() => {
+    y.current && (y.current(), y.current = null);
+  }, [u]);
+  const g = p.useRef(!1), v = We(), m = p.useRef(null), T = p.useRef(null), U = p.useCallback((d) => {
+    const {
+      pulsate: M,
+      rippleX: E,
+      rippleY: w,
+      rippleSize: $,
+      cb: z
+    } = d;
+    f((C) => [...C, /* @__PURE__ */ I(ft, {
+      classes: {
+        ripple: x(n.ripple, b.ripple),
+        rippleVisible: x(n.rippleVisible, b.rippleVisible),
+        ripplePulsate: x(n.ripplePulsate, b.ripplePulsate),
+        child: x(n.child, b.child),
+        childLeaving: x(n.childLeaving, b.childLeaving),
+        childPulsate: x(n.childPulsate, b.childPulsate)
+      },
+      timeout: oe,
+      pulsate: M,
+      rippleX: E,
+      rippleY: w,
+      rippleSize: $
+    }, h.current)]), h.current += 1, y.current = z;
+  }, [n]), _ = p.useCallback((d = {}, M = {}, E = () => {
+  }) => {
+    const {
+      pulsate: w = !1,
+      center: $ = o || M.pulsate,
+      fakeElement: z = !1
+      // For test purposes
+    } = M;
+    if ((d == null ? void 0 : d.type) === "mousedown" && g.current) {
+      g.current = !1;
+      return;
+    }
+    (d == null ? void 0 : d.type) === "touchstart" && (g.current = !0);
+    const C = z ? null : T.current, B = C ? C.getBoundingClientRect() : {
+      width: 0,
+      height: 0,
+      left: 0,
+      top: 0
+    };
+    let V, D, S;
+    if ($ || d === void 0 || d.clientX === 0 && d.clientY === 0 || !d.clientX && !d.touches)
+      V = Math.round(B.width / 2), D = Math.round(B.height / 2);
+    else {
+      const {
+        clientX: L,
+        clientY: N
+      } = d.touches && d.touches.length > 0 ? d.touches[0] : d;
+      V = Math.round(L - B.left), D = Math.round(N - B.top);
+    }
+    if ($)
+      S = Math.sqrt((2 * B.width ** 2 + B.height ** 2) / 3), S % 2 === 0 && (S += 1);
+    else {
+      const L = Math.max(Math.abs((C ? C.clientWidth : 0) - V), V) * 2 + 2, N = Math.max(Math.abs((C ? C.clientHeight : 0) - D), D) * 2 + 2;
+      S = Math.sqrt(L ** 2 + N ** 2);
+    }
+    d != null && d.touches ? m.current === null && (m.current = () => {
+      U({
+        pulsate: w,
+        rippleX: V,
+        rippleY: D,
+        rippleSize: S,
+        cb: E
+      });
+    }, v.start(at, () => {
+      m.current && (m.current(), m.current = null);
+    })) : U({
+      pulsate: w,
+      rippleX: V,
+      rippleY: D,
+      rippleSize: S,
+      cb: E
+    });
+  }, [o, U, v]), j = p.useCallback(() => {
+    _({}, {
+      pulsate: !0
+    });
+  }, [_]), O = p.useCallback((d, M) => {
+    if (v.clear(), (d == null ? void 0 : d.type) === "touchend" && m.current) {
+      m.current(), m.current = null, v.start(0, () => {
+        O(d, M);
+      });
+      return;
+    }
+    m.current = null, f((E) => E.length > 0 ? E.slice(1) : E), y.current = M;
+  }, [v]);
+  return p.useImperativeHandle(a, () => ({
+    pulsate: j,
+    start: _,
+    stop: O
+  }), [j, _, O]), /* @__PURE__ */ I(pt, Y({
+    className: x(b.root, n.root, i),
+    ref: T
+  }, c, {
+    children: /* @__PURE__ */ I(rt, {
+      component: null,
+      exit: !0,
+      children: u
+    })
+  }));
+});
+process.env.NODE_ENV !== "production" && (Ee.propTypes = {
+  /**
+   * If `true`, the ripple starts at the center of the component
+   * rather than at the point of interaction.
+   */
+  center: e.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   * See [CSS API](#css) below for more details.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string
+});
+const dt = Ee;
+function ht(t) {
+  return Xe("MuiButtonBase", t);
+}
+const mt = ye("MuiButtonBase", ["root", "disabled", "focusVisible"]), bt = ["action", "centerRipple", "children", "className", "component", "disabled", "disableRipple", "disableTouchRipple", "focusRipple", "focusVisibleClassName", "LinkComponent", "onBlur", "onClick", "onContextMenu", "onDragLeave", "onFocus", "onFocusVisible", "onKeyDown", "onKeyUp", "onMouseDown", "onMouseLeave", "onMouseUp", "onTouchEnd", "onTouchMove", "onTouchStart", "tabIndex", "TouchRippleProps", "touchRippleRef", "type"], gt = (t) => {
+  const {
+    disabled: s,
+    focusVisible: a,
+    focusVisibleClassName: l,
+    classes: o
+  } = t, i = Ye({
+    root: ["root", s && "disabled", a && "focusVisible"]
+  }, ht, o);
+  return a && l && (i.root += ` ${l}`), i;
+}, Rt = re("button", {
+  name: "MuiButtonBase",
+  slot: "Root",
+  overridesResolver: (t, s) => s.root
+})({
+  display: "inline-flex",
+  alignItems: "center",
+  justifyContent: "center",
+  position: "relative",
+  boxSizing: "border-box",
+  WebkitTapHighlightColor: "transparent",
+  backgroundColor: "transparent",
+  // Reset default value
+  // We disable the focus ring for mouse, touch and keyboard users.
+  outline: 0,
+  border: 0,
+  margin: 0,
+  // Remove the margin in Safari
+  borderRadius: 0,
+  padding: 0,
+  // Remove the padding in Firefox
+  cursor: "pointer",
+  userSelect: "none",
+  verticalAlign: "middle",
+  MozAppearance: "none",
+  // Reset
+  WebkitAppearance: "none",
+  // Reset
+  textDecoration: "none",
+  // So we take precedent over the style of a native <a /> element.
+  color: "inherit",
+  "&::-moz-focus-inner": {
+    borderStyle: "none"
+    // Remove Firefox dotted outline.
+  },
+  [`&.${mt.disabled}`]: {
+    pointerEvents: "none",
+    // Disable link interactions
+    cursor: "default"
+  },
+  "@media print": {
+    colorAdjust: "exact"
+  }
+}), Ce = /* @__PURE__ */ p.forwardRef(function(s, a) {
+  const l = Te({
+    props: s,
+    name: "MuiButtonBase"
+  }), {
+    action: o,
+    centerRipple: n = !1,
+    children: i,
+    className: c,
+    component: u = "button",
+    disabled: f = !1,
+    disableRipple: h = !1,
+    disableTouchRipple: y = !1,
+    focusRipple: g = !1,
+    LinkComponent: v = "a",
+    onBlur: m,
+    onClick: T,
+    onContextMenu: U,
+    onDragLeave: _,
+    onFocus: j,
+    onFocusVisible: O,
+    onKeyDown: d,
+    onKeyUp: M,
+    onMouseDown: E,
+    onMouseLeave: w,
+    onMouseUp: $,
+    onTouchEnd: z,
+    onTouchMove: C,
+    onTouchStart: B,
+    tabIndex: V = 0,
+    TouchRippleProps: D,
+    touchRippleRef: S,
+    type: L
+  } = l, N = ie(l, bt), K = p.useRef(null), R = p.useRef(null), xe = he(R, S), {
+    isFocusVisibleRef: ue,
+    onFocus: ve,
+    onBlur: Ve,
+    ref: Ne
+  } = Ge(), [k, A] = p.useState(!1);
+  f && k && A(!1), p.useImperativeHandle(o, () => ({
+    focusVisible: () => {
+      A(!0), K.current.focus();
+    }
+  }), []);
+  const [Z, Pe] = p.useState(!1);
+  p.useEffect(() => {
+    Pe(!0);
+  }, []);
+  const ee = Z && !h && !f;
+  p.useEffect(() => {
+    k && g && !h && Z && R.current.pulsate();
+  }, [h, g, k, Z]);
+  function P(r, pe, Ke = y) {
+    return H((fe) => (pe && pe(fe), !Ke && R.current && R.current[r](fe), !0));
+  }
+  const Be = P("start", E), De = P("stop", U), Se = P("stop", _), we = P("stop", $), Le = P("stop", (r) => {
+    k && r.preventDefault(), w && w(r);
+  }), ke = P("start", B), Fe = P("stop", z), _e = P("stop", C), Oe = P("stop", (r) => {
+    Ve(r), ue.current === !1 && A(!1), m && m(r);
+  }, !1), $e = H((r) => {
+    K.current || (K.current = r.currentTarget), ve(r), ue.current === !0 && (A(!0), O && O(r)), j && j(r);
+  }), te = () => {
+    const r = K.current;
+    return u && u !== "button" && !(r.tagName === "A" && r.href);
+  }, ne = p.useRef(!1), Ie = H((r) => {
+    g && !ne.current && k && R.current && r.key === " " && (ne.current = !0, R.current.stop(r, () => {
+      R.current.start(r);
+    })), r.target === r.currentTarget && te() && r.key === " " && r.preventDefault(), d && d(r), r.target === r.currentTarget && te() && r.key === "Enter" && !f && (r.preventDefault(), T && T(r));
+  }), Ue = H((r) => {
+    g && r.key === " " && R.current && k && !r.defaultPrevented && (ne.current = !1, R.current.stop(r, () => {
+      R.current.pulsate(r);
+    })), M && M(r), T && r.target === r.currentTarget && te() && r.key === " " && !r.defaultPrevented && T(r);
+  });
+  let q = u;
+  q === "button" && (N.href || N.to) && (q = v);
+  const X = {};
+  q === "button" ? (X.type = L === void 0 ? "button" : L, X.disabled = f) : (!N.href && !N.to && (X.role = "button"), f && (X["aria-disabled"] = f));
+  const je = he(a, Ne, K);
+  process.env.NODE_ENV !== "production" && p.useEffect(() => {
+    ee && !R.current && console.error(["MUI: The `component` prop provided to ButtonBase is invalid.", "Please make sure the children prop is rendered in this custom component."].join(`
+`));
+  }, [ee]);
+  const ce = Y({}, l, {
+    centerRipple: n,
+    component: u,
+    disabled: f,
+    disableRipple: h,
+    disableTouchRipple: y,
+    focusRipple: g,
+    tabIndex: V,
+    focusVisible: k
+  }), ze = gt(ce);
+  return /* @__PURE__ */ qe(Rt, Y({
+    as: q,
+    className: x(ze.root, c),
+    ownerState: ce,
+    onBlur: Oe,
+    onClick: T,
+    onContextMenu: De,
+    onFocus: $e,
+    onKeyDown: Ie,
+    onKeyUp: Ue,
+    onMouseDown: Be,
+    onMouseLeave: Le,
+    onMouseUp: we,
+    onDragLeave: Se,
+    onTouchEnd: Fe,
+    onTouchMove: _e,
+    onTouchStart: ke,
+    ref: je,
+    tabIndex: f ? -1 : V,
+    type: L
+  }, X, N, {
+    children: [i, ee ? (
+      /* TouchRipple is only needed client-side, x2 boost on the server. */
+      /* @__PURE__ */ I(dt, Y({
+        ref: xe,
+        center: n
+      }, D))
+    ) : null]
+  }));
+});
+process.env.NODE_ENV !== "production" && (Ce.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * A ref for imperative actions.
+   * It currently only supports `focusVisible()` action.
+   */
+  action: Je,
+  /**
+   * If `true`, the ripples are centered.
+   * They won't start at the cursor interaction position.
+   * @default false
+   */
+  centerRipple: e.bool,
+  /**
+   * The content of the component.
+   */
+  children: e.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: Qe,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: e.bool,
+  /**
+   * 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: e.bool,
+  /**
+   * If `true`, the touch ripple effect is disabled.
+   * @default false
+   */
+  disableTouchRipple: e.bool,
+  /**
+   * If `true`, the base button will have a keyboard focus ripple.
+   * @default false
+   */
+  focusRipple: e.bool,
+  /**
+   * 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: e.string,
+  /**
+   * @ignore
+   */
+  href: e.any,
+  /**
+   * The component used to render a link when the `href` prop is provided.
+   * @default 'a'
+   */
+  LinkComponent: e.elementType,
+  /**
+   * @ignore
+   */
+  onBlur: e.func,
+  /**
+   * @ignore
+   */
+  onClick: e.func,
+  /**
+   * @ignore
+   */
+  onContextMenu: e.func,
+  /**
+   * @ignore
+   */
+  onDragLeave: e.func,
+  /**
+   * @ignore
+   */
+  onFocus: e.func,
+  /**
+   * Callback fired when the component is focused with a keyboard.
+   * We trigger a `onFocus` callback too.
+   */
+  onFocusVisible: e.func,
+  /**
+   * @ignore
+   */
+  onKeyDown: e.func,
+  /**
+   * @ignore
+   */
+  onKeyUp: e.func,
+  /**
+   * @ignore
+   */
+  onMouseDown: e.func,
+  /**
+   * @ignore
+   */
+  onMouseLeave: e.func,
+  /**
+   * @ignore
+   */
+  onMouseUp: e.func,
+  /**
+   * @ignore
+   */
+  onTouchEnd: e.func,
+  /**
+   * @ignore
+   */
+  onTouchMove: e.func,
+  /**
+   * @ignore
+   */
+  onTouchStart: e.func,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * @default 0
+   */
+  tabIndex: e.number,
+  /**
+   * Props applied to the `TouchRipple` element.
+   */
+  TouchRippleProps: e.object,
+  /**
+   * A ref that points to the `TouchRipple` element.
+   */
+  touchRippleRef: e.oneOfType([e.func, e.shape({
+    current: e.shape({
+      pulsate: e.func.isRequired,
+      start: e.func.isRequired,
+      stop: e.func.isRequired
+    })
+  })]),
+  /**
+   * @ignore
+   */
+  type: e.oneOfType([e.oneOf(["button", "reset", "submit"]), e.string])
+});
+const Bt = Ce;
+export {
+  Bt as B
+};