@solostylist/ui-kit 1.0.174 → 1.0.176

package/dist/ButtonBase-C_YYB9Ry.js

@@ -0,0 +1,1099 @@
+import { c as M } from "./clsx-OuTLNxxd.js";
+import * as f from "react";
+import X, { isValidElement as q, cloneElement as G, Children as Ve } from "react";
+import { P as o } from "./createTheme-f5g1s6ww.js";
+import { j as B } from "./jsx-runtime-tc70JA_2.js";
+import { g as ke } from "./generateUtilityClasses-BtVDwGrk.js";
+import { u as de, c as Ie } from "./DefaultPropsProvider-sk0uWcA6.js";
+import { s as oe } from "./styled-B0KflPi-.js";
+import { a as Fe, _ as Le } from "./objectWithoutPropertiesLoose-DiWPeE4c.js";
+import { keyframes as re } from "@emotion/react";
+import { g as Be, b as $e } from "./buttonBaseClasses-jCihfot4.js";
+import { u as _e } from "./useEnhancedEffect-CJGo-L3B.js";
+function Z(e) {
+  const t = f.useRef(e);
+  return _e(() => {
+    t.current = e;
+  }), f.useRef((...n) => (
+    // @ts-expect-error hide `this`
+    (0, t.current)(...n)
+  )).current;
+}
+function ee(...e) {
+  const t = f.useRef(void 0), n = f.useCallback((r) => {
+    const s = e.map((i) => {
+      if (i == null)
+        return null;
+      if (typeof i == "function") {
+        const u = i, l = u(r);
+        return typeof l == "function" ? l : () => {
+          u(null);
+        };
+      }
+      return i.current = r, () => {
+        i.current = null;
+      };
+    });
+    return () => {
+      s.forEach((i) => i?.());
+    };
+  }, e);
+  return f.useMemo(() => e.every((r) => r == null) ? null : (r) => {
+    t.current && (t.current(), t.current = void 0), r != null && (t.current = n(r));
+  }, e);
+}
+function Ae(e, t) {
+  return process.env.NODE_ENV === "production" ? () => null : function(...r) {
+    return e(...r) || t(...r);
+  };
+}
+function te(e, t) {
+  return te = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(n, r) {
+    return n.__proto__ = r, n;
+  }, te(e, t);
+}
+function Ue(e, t) {
+  e.prototype = Object.create(t.prototype), e.prototype.constructor = e, te(e, t);
+}
+const le = X.createContext(null);
+function ze(e) {
+  if (e === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  return e;
+}
+function se(e, t) {
+  var n = function(i) {
+    return t && q(i) ? t(i) : i;
+  }, r = /* @__PURE__ */ Object.create(null);
+  return e && Ve.map(e, function(s) {
+    return s;
+  }).forEach(function(s) {
+    r[s.key] = n(s);
+  }), r;
+}
+function He(e, t) {
+  e = e || {}, t = t || {};
+  function n(d) {
+    return d in t ? t[d] : e[d];
+  }
+  var r = /* @__PURE__ */ Object.create(null), s = [];
+  for (var i in e)
+    i in t ? s.length && (r[i] = s, s = []) : s.push(i);
+  var u, l = {};
+  for (var c in t) {
+    if (r[c])
+      for (u = 0; u < r[c].length; u++) {
+        var p = r[c][u];
+        l[r[c][u]] = n(p);
+      }
+    l[c] = n(c);
+  }
+  for (u = 0; u < s.length; u++)
+    l[s[u]] = n(s[u]);
+  return l;
+}
+function L(e, t, n) {
+  return n[t] != null ? n[t] : e.props[t];
+}
+function Ye(e, t) {
+  return se(e.children, function(n) {
+    return G(n, {
+      onExited: t.bind(null, n),
+      in: !0,
+      appear: L(n, "appear", e),
+      enter: L(n, "enter", e),
+      exit: L(n, "exit", e)
+    });
+  });
+}
+function Xe(e, t, n) {
+  var r = se(e.children), s = He(t, r);
+  return Object.keys(s).forEach(function(i) {
+    var u = s[i];
+    if (q(u)) {
+      var l = i in t, c = i in r, p = t[i], d = q(p) && !p.props.in;
+      c && (!l || d) ? s[i] = G(u, {
+        onExited: n.bind(null, u),
+        in: !0,
+        exit: L(u, "exit", e),
+        enter: L(u, "enter", e)
+      }) : !c && l && !d ? s[i] = G(u, {
+        in: !1
+      }) : c && l && q(p) && (s[i] = G(u, {
+        onExited: n.bind(null, u),
+        in: p.props.in,
+        exit: L(u, "exit", e),
+        enter: L(u, "enter", e)
+      }));
+    }
+  }), s;
+}
+var Ke = Object.values || function(e) {
+  return Object.keys(e).map(function(t) {
+    return e[t];
+  });
+}, We = {
+  component: "div",
+  childFactory: function(t) {
+    return t;
+  }
+}, ie = /* @__PURE__ */ (function(e) {
+  Ue(t, e);
+  function t(r, s) {
+    var i;
+    i = e.call(this, r, s) || this;
+    var u = i.handleExited.bind(ze(i));
+    return i.state = {
+      contextValue: {
+        isMounting: !0
+      },
+      handleExited: u,
+      firstRender: !0
+    }, i;
+  }
+  var n = t.prototype;
+  return n.componentDidMount = function() {
+    this.mounted = !0, this.setState({
+      contextValue: {
+        isMounting: !1
+      }
+    });
+  }, n.componentWillUnmount = function() {
+    this.mounted = !1;
+  }, t.getDerivedStateFromProps = function(s, i) {
+    var u = i.children, l = i.handleExited, c = i.firstRender;
+    return {
+      children: c ? Ye(s, l) : Xe(s, u, l),
+      firstRender: !1
+    };
+  }, n.handleExited = function(s, i) {
+    var u = se(this.props.children);
+    s.key in u || (s.props.onExited && s.props.onExited(i), this.mounted && this.setState(function(l) {
+      var c = Fe({}, l.children);
+      return delete c[s.key], {
+        children: c
+      };
+    }));
+  }, n.render = function() {
+    var s = this.props, i = s.component, u = s.childFactory, l = Le(s, ["component", "childFactory"]), c = this.state.contextValue, p = Ke(this.state.children).map(u);
+    return delete l.appear, delete l.enter, delete l.exit, i === null ? /* @__PURE__ */ X.createElement(le.Provider, {
+      value: c
+    }, p) : /* @__PURE__ */ X.createElement(le.Provider, {
+      value: c
+    }, /* @__PURE__ */ X.createElement(i, l, p));
+  }, t;
+})(X.Component);
+ie.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: o.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: o.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: o.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: o.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: o.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: o.func
+} : {};
+ie.defaultProps = We;
+const ce = {};
+function he(e, t) {
+  const n = f.useRef(ce);
+  return n.current === ce && (n.current = e(t)), n;
+}
+const qe = [];
+function Ge(e) {
+  f.useEffect(e, qe);
+}
+class ue {
+  static create() {
+    return new ue();
+  }
+  currentId = null;
+  /**
+   * Executes `fn` after `delay`, clearing any previously scheduled call.
+   */
+  start(t, n) {
+    this.clear(), this.currentId = setTimeout(() => {
+      this.currentId = null, n();
+    }, t);
+  }
+  clear = () => {
+    this.currentId !== null && (clearTimeout(this.currentId), this.currentId = null);
+  };
+  disposeEffect = () => this.clear;
+}
+function Ze() {
+  const e = he(ue.create).current;
+  return Ge(e.disposeEffect), e;
+}
+function Je(e) {
+  const {
+    prototype: t = {}
+  } = e;
+  return !!t.isReactComponent;
+}
+function Qe(e, t, n, r, s) {
+  const i = e[t], u = s || t;
+  if (i == null || // When server-side rendering React doesn't warn either.
+  // This is not an accurate check for SSR.
+  // This is only in place for emotion compat.
+  // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
+  typeof window > "u")
+    return null;
+  let l;
+  return typeof i == "function" && !Je(i) && (l = "Did you accidentally provide a plain function component instead?"), i === f.Fragment && (l = "Did you accidentally provide a React.Fragment instead?"), l !== void 0 ? new Error(`Invalid ${r} \`${u}\` supplied to \`${n}\`. Expected an element type that can hold a ref. ${l} For more information see https://mui.com/r/caveat-with-refs-guide`) : null;
+}
+const et = Ae(o.elementType, Qe);
+function tt(e) {
+  return typeof e == "string";
+}
+function nt(e, t, n) {
+  return e === void 0 || tt(e) ? t : {
+    ...t,
+    ownerState: {
+      ...t.ownerState,
+      ...n
+    }
+  };
+}
+function ot(e, t, n) {
+  return typeof e == "function" ? e(t, n) : e;
+}
+function rt(e, t = []) {
+  if (e === void 0)
+    return {};
+  const n = {};
+  return Object.keys(e).filter((r) => r.match(/^on[A-Z]/) && typeof e[r] == "function" && !t.includes(r)).forEach((r) => {
+    n[r] = e[r];
+  }), n;
+}
+function pe(e) {
+  if (e === void 0)
+    return {};
+  const t = {};
+  return Object.keys(e).filter((n) => !(n.match(/^on[A-Z]/) && typeof e[n] == "function")).forEach((n) => {
+    t[n] = e[n];
+  }), t;
+}
+function st(e) {
+  const {
+    getSlotProps: t,
+    additionalProps: n,
+    externalSlotProps: r,
+    externalForwardedProps: s,
+    className: i
+  } = e;
+  if (!t) {
+    const R = M(n?.className, i, s?.className, r?.className), b = {
+      ...n?.style,
+      ...s?.style,
+      ...r?.style
+    }, E = {
+      ...n,
+      ...s,
+      ...r
+    };
+    return R.length > 0 && (E.className = R), Object.keys(b).length > 0 && (E.style = b), {
+      props: E,
+      internalRef: void 0
+    };
+  }
+  const u = rt({
+    ...s,
+    ...r
+  }), l = pe(r), c = pe(s), p = t(u), d = M(p?.className, n?.className, i, s?.className, r?.className), h = {
+    ...p?.style,
+    ...n?.style,
+    ...s?.style,
+    ...r?.style
+  }, y = {
+    ...p,
+    ...n,
+    ...c,
+    ...l
+  };
+  return d.length > 0 && (y.className = d), Object.keys(h).length > 0 && (y.style = h), {
+    props: y,
+    internalRef: p.ref
+  };
+}
+function St(e, t) {
+  const {
+    className: n,
+    elementType: r,
+    ownerState: s,
+    externalForwardedProps: i,
+    internalForwardedProps: u,
+    shouldForwardComponentProp: l = !1,
+    ...c
+  } = t, {
+    component: p,
+    slots: d = {
+      [e]: void 0
+    },
+    slotProps: h = {
+      [e]: void 0
+    },
+    ...y
+  } = i, R = d[e] || r, b = ot(h[e], s), {
+    props: {
+      component: E,
+      ...C
+    },
+    internalRef: O
+  } = st({
+    className: n,
+    ...c,
+    externalForwardedProps: e === "root" ? y : void 0,
+    externalSlotProps: b
+  }), $ = ee(O, b?.ref, t.ref), v = e === "root" ? E || p : E, m = nt(R, {
+    ...e === "root" && !p && !d[e] && u,
+    ...e !== "root" && !d[e] && u,
+    ...C,
+    ...v && !l && {
+      as: v
+    },
+    ...v && l && {
+      component: v
+    },
+    ref: $
+  }, s);
+  return [R, m];
+}
+const it = o.oneOfType([o.func, o.object]);
+function fe(e) {
+  try {
+    return e.matches(":focus-visible");
+  } catch {
+    process.env.NODE_ENV !== "production" && !window.navigator.userAgent.includes("jsdom") && console.warn(["MUI: The `:focus-visible` pseudo class is not supported in this browser.", "Some components rely on this feature to work properly."].join(`
+`));
+  }
+  return !1;
+}
+class J {
+  /** React ref to the ripple instance */
+  /** If the ripple component should be mounted */
+  /** Promise that resolves when the ripple component is mounted */
+  /** If the ripple component has been mounted */
+  /** React state hook setter */
+  static create() {
+    return new J();
+  }
+  static use() {
+    const t = he(J.create).current, [n, r] = f.useState(!1);
+    return t.shouldMount = n, t.setShouldMount = r, f.useEffect(t.mountEffect, [n]), t;
+  }
+  constructor() {
+    this.ref = {
+      current: null
+    }, this.mounted = null, this.didMount = !1, this.shouldMount = !1, this.setShouldMount = null;
+  }
+  mount() {
+    return this.mounted || (this.mounted = at(), this.shouldMount = !0, this.setShouldMount(this.shouldMount)), this.mounted;
+  }
+  mountEffect = () => {
+    this.shouldMount && !this.didMount && this.ref.current !== null && (this.didMount = !0, this.mounted.resolve());
+  };
+  /* Ripple API */
+  start(...t) {
+    this.mount().then(() => this.ref.current?.start(...t));
+  }
+  stop(...t) {
+    this.mount().then(() => this.ref.current?.stop(...t));
+  }
+  pulsate(...t) {
+    this.mount().then(() => this.ref.current?.pulsate(...t));
+  }
+}
+function ut() {
+  return J.use();
+}
+function at() {
+  let e, t;
+  const n = new Promise((r, s) => {
+    e = r, t = s;
+  });
+  return n.resolve = e, n.reject = t, n;
+}
+function me(e) {
+  const {
+    className: t,
+    classes: n,
+    pulsate: r = !1,
+    rippleX: s,
+    rippleY: i,
+    rippleSize: u,
+    in: l,
+    onExited: c,
+    timeout: p
+  } = e, [d, h] = f.useState(!1), y = M(t, n.ripple, n.rippleVisible, r && n.ripplePulsate), R = {
+    width: u,
+    height: u,
+    top: -(u / 2) + i,
+    left: -(u / 2) + s
+  }, b = M(n.child, d && n.childLeaving, r && n.childPulsate);
+  return !l && !d && h(!0), f.useEffect(() => {
+    if (!l && c != null) {
+      const E = setTimeout(c, p);
+      return () => {
+        clearTimeout(E);
+      };
+    }
+  }, [c, l, p]), /* @__PURE__ */ B.jsx("span", {
+    className: y,
+    style: R,
+    children: /* @__PURE__ */ B.jsx("span", {
+      className: b
+    })
+  });
+}
+process.env.NODE_ENV !== "production" && (me.propTypes = {
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object.isRequired,
+  className: o.string,
+  /**
+   * @ignore - injected from TransitionGroup
+   */
+  in: o.bool,
+  /**
+   * @ignore - injected from TransitionGroup
+   */
+  onExited: o.func,
+  /**
+   * If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element.
+   */
+  pulsate: o.bool,
+  /**
+   * Diameter of the ripple.
+   */
+  rippleSize: o.number,
+  /**
+   * Horizontal position of the ripple center.
+   */
+  rippleX: o.number,
+  /**
+   * Vertical position of the ripple center.
+   */
+  rippleY: o.number,
+  /**
+   * exit delay
+   */
+  timeout: o.number.isRequired
+});
+const T = ke("MuiTouchRipple", ["root", "ripple", "rippleVisible", "ripplePulsate", "child", "childLeaving", "childPulsate"]), ne = 550, lt = 80, ct = re`
+  0% {
+    transform: scale(0);
+    opacity: 0.1;
+  }
+
+  100% {
+    transform: scale(1);
+    opacity: 0.3;
+  }
+`, pt = re`
+  0% {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+  }
+`, ft = re`
+  0% {
+    transform: scale(1);
+  }
+
+  50% {
+    transform: scale(0.92);
+  }
+
+  100% {
+    transform: scale(1);
+  }
+`, dt = oe("span", {
+  name: "MuiTouchRipple",
+  slot: "Root"
+})({
+  overflow: "hidden",
+  pointerEvents: "none",
+  position: "absolute",
+  zIndex: 0,
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+  borderRadius: "inherit"
+}), ht = oe(me, {
+  name: "MuiTouchRipple",
+  slot: "Ripple"
+})`
+  opacity: 0;
+  position: absolute;
+
+  &.${T.rippleVisible} {
+    opacity: 0.3;
+    transform: scale(1);
+    animation-name: ${ct};
+    animation-duration: ${ne}ms;
+    animation-timing-function: ${({
+  theme: e
+}) => e.transitions.easing.easeInOut};
+  }
+
+  &.${T.ripplePulsate} {
+    animation-duration: ${({
+  theme: e
+}) => e.transitions.duration.shorter}ms;
+  }
+
+  & .${T.child} {
+    opacity: 1;
+    display: block;
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    background-color: currentColor;
+  }
+
+  & .${T.childLeaving} {
+    opacity: 0;
+    animation-name: ${pt};
+    animation-duration: ${ne}ms;
+    animation-timing-function: ${({
+  theme: e
+}) => e.transitions.easing.easeInOut};
+  }
+
+  & .${T.childPulsate} {
+    position: absolute;
+    /* @noflip */
+    left: 0px;
+    top: 0;
+    animation-name: ${ft};
+    animation-duration: 2500ms;
+    animation-timing-function: ${({
+  theme: e
+}) => e.transitions.easing.easeInOut};
+    animation-iteration-count: infinite;
+    animation-delay: 200ms;
+  }
+`, be = /* @__PURE__ */ f.forwardRef(function(t, n) {
+  const r = de({
+    props: t,
+    name: "MuiTouchRipple"
+  }), {
+    center: s = !1,
+    classes: i = {},
+    className: u,
+    ...l
+  } = r, [c, p] = f.useState([]), d = f.useRef(0), h = f.useRef(null);
+  f.useEffect(() => {
+    h.current && (h.current(), h.current = null);
+  }, [c]);
+  const y = f.useRef(!1), R = Ze(), b = f.useRef(null), E = f.useRef(null), C = f.useCallback((m) => {
+    const {
+      pulsate: P,
+      rippleX: x,
+      rippleY: _,
+      rippleSize: k,
+      cb: U
+    } = m;
+    p((N) => [...N, /* @__PURE__ */ B.jsx(ht, {
+      classes: {
+        ripple: M(i.ripple, T.ripple),
+        rippleVisible: M(i.rippleVisible, T.rippleVisible),
+        ripplePulsate: M(i.ripplePulsate, T.ripplePulsate),
+        child: M(i.child, T.child),
+        childLeaving: M(i.childLeaving, T.childLeaving),
+        childPulsate: M(i.childPulsate, T.childPulsate)
+      },
+      timeout: ne,
+      pulsate: P,
+      rippleX: x,
+      rippleY: _,
+      rippleSize: k
+    }, d.current)]), d.current += 1, h.current = U;
+  }, [i]), O = f.useCallback((m = {}, P = {}, x = () => {
+  }) => {
+    const {
+      pulsate: _ = !1,
+      center: k = s || P.pulsate,
+      fakeElement: U = !1
+      // For test purposes
+    } = P;
+    if (m?.type === "mousedown" && y.current) {
+      y.current = !1;
+      return;
+    }
+    m?.type === "touchstart" && (y.current = !0);
+    const N = U ? null : E.current, D = N ? N.getBoundingClientRect() : {
+      width: 0,
+      height: 0,
+      left: 0,
+      top: 0
+    };
+    let j, w, V;
+    if (k || m === void 0 || m.clientX === 0 && m.clientY === 0 || !m.clientX && !m.touches)
+      j = Math.round(D.width / 2), w = Math.round(D.height / 2);
+    else {
+      const {
+        clientX: z,
+        clientY: I
+      } = m.touches && m.touches.length > 0 ? m.touches[0] : m;
+      j = Math.round(z - D.left), w = Math.round(I - D.top);
+    }
+    if (k)
+      V = Math.sqrt((2 * D.width ** 2 + D.height ** 2) / 3), V % 2 === 0 && (V += 1);
+    else {
+      const z = Math.max(Math.abs((N ? N.clientWidth : 0) - j), j) * 2 + 2, I = Math.max(Math.abs((N ? N.clientHeight : 0) - w), w) * 2 + 2;
+      V = Math.sqrt(z ** 2 + I ** 2);
+    }
+    m?.touches ? b.current === null && (b.current = () => {
+      C({
+        pulsate: _,
+        rippleX: j,
+        rippleY: w,
+        rippleSize: V,
+        cb: x
+      });
+    }, R.start(lt, () => {
+      b.current && (b.current(), b.current = null);
+    })) : C({
+      pulsate: _,
+      rippleX: j,
+      rippleY: w,
+      rippleSize: V,
+      cb: x
+    });
+  }, [s, C, R]), $ = f.useCallback(() => {
+    O({}, {
+      pulsate: !0
+    });
+  }, [O]), v = f.useCallback((m, P) => {
+    if (R.clear(), m?.type === "touchend" && b.current) {
+      b.current(), b.current = null, R.start(0, () => {
+        v(m, P);
+      });
+      return;
+    }
+    b.current = null, p((x) => x.length > 0 ? x.slice(1) : x), h.current = P;
+  }, [R]);
+  return f.useImperativeHandle(n, () => ({
+    pulsate: $,
+    start: O,
+    stop: v
+  }), [$, O, v]), /* @__PURE__ */ B.jsx(dt, {
+    className: M(T.root, i.root, u),
+    ref: E,
+    ...l,
+    children: /* @__PURE__ */ B.jsx(ie, {
+      component: null,
+      exit: !0,
+      children: c
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (be.propTypes = {
+  /**
+   * If `true`, the ripple starts at the center of the component
+   * rather than at the point of interaction.
+   */
+  center: o.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.string
+});
+const mt = (e) => {
+  const {
+    disabled: t,
+    focusVisible: n,
+    focusVisibleClassName: r,
+    classes: s
+  } = e, u = Ie({
+    root: ["root", t && "disabled", n && "focusVisible"]
+  }, Be, s);
+  return n && r && (u.root += ` ${r}`), u;
+}, bt = oe("button", {
+  name: "MuiButtonBase",
+  slot: "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.
+  },
+  [`&.${$e.disabled}`]: {
+    pointerEvents: "none",
+    // Disable link interactions
+    cursor: "default"
+  },
+  "@media print": {
+    colorAdjust: "exact"
+  }
+}), yt = /* @__PURE__ */ f.forwardRef(function(t, n) {
+  const r = de({
+    props: t,
+    name: "MuiButtonBase"
+  }), {
+    action: s,
+    centerRipple: i = !1,
+    children: u,
+    className: l,
+    component: c = "button",
+    disabled: p = !1,
+    disableRipple: d = !1,
+    disableTouchRipple: h = !1,
+    focusRipple: y = !1,
+    focusVisibleClassName: R,
+    LinkComponent: b = "a",
+    onBlur: E,
+    onClick: C,
+    onContextMenu: O,
+    onDragLeave: $,
+    onFocus: v,
+    onFocusVisible: m,
+    onKeyDown: P,
+    onKeyUp: x,
+    onMouseDown: _,
+    onMouseLeave: k,
+    onMouseUp: U,
+    onTouchEnd: N,
+    onTouchMove: D,
+    onTouchStart: j,
+    tabIndex: w = 0,
+    TouchRippleProps: V,
+    touchRippleRef: z,
+    type: I,
+    ...A
+  } = r, H = f.useRef(null), g = ut(), ye = ee(g.ref, z), [F, K] = f.useState(!1);
+  p && F && K(!1), f.useImperativeHandle(s, () => ({
+    focusVisible: () => {
+      K(!0), H.current.focus();
+    }
+  }), []);
+  const ge = g.shouldMount && !d && !p;
+  f.useEffect(() => {
+    F && y && !d && g.pulsate();
+  }, [d, y, F, g]);
+  const Re = S(g, "start", _, h), Ee = S(g, "stop", O, h), Me = S(g, "stop", $, h), Te = S(g, "stop", U, h), Ce = S(g, "stop", (a) => {
+    F && a.preventDefault(), k && k(a);
+  }, h), ve = S(g, "start", j, h), xe = S(g, "stop", N, h), Pe = S(g, "stop", D, h), Ne = S(g, "stop", (a) => {
+    fe(a.target) || K(!1), E && E(a);
+  }, !1), we = Z((a) => {
+    H.current || (H.current = a.currentTarget), fe(a.target) && (K(!0), m && m(a)), v && v(a);
+  }), Q = () => {
+    const a = H.current;
+    return c && c !== "button" && !(a.tagName === "A" && a.href);
+  }, Se = Z((a) => {
+    y && !a.repeat && F && a.key === " " && g.stop(a, () => {
+      g.start(a);
+    }), a.target === a.currentTarget && Q() && a.key === " " && a.preventDefault(), P && P(a), a.target === a.currentTarget && Q() && a.key === "Enter" && !p && (a.preventDefault(), C && C(a));
+  }), Oe = Z((a) => {
+    y && a.key === " " && F && !a.defaultPrevented && g.stop(a, () => {
+      g.pulsate(a);
+    }), x && x(a), C && a.target === a.currentTarget && Q() && a.key === " " && !a.defaultPrevented && C(a);
+  });
+  let W = c;
+  W === "button" && (A.href || A.to) && (W = b);
+  const Y = {};
+  if (W === "button") {
+    const a = !!A.formAction;
+    Y.type = I === void 0 && !a ? "button" : I, Y.disabled = p;
+  } else
+    !A.href && !A.to && (Y.role = "button"), p && (Y["aria-disabled"] = p);
+  const De = ee(n, H), ae = {
+    ...r,
+    centerRipple: i,
+    component: c,
+    disabled: p,
+    disableRipple: d,
+    disableTouchRipple: h,
+    focusRipple: y,
+    tabIndex: w,
+    focusVisible: F
+  }, je = mt(ae);
+  return /* @__PURE__ */ B.jsxs(bt, {
+    as: W,
+    className: M(je.root, l),
+    ownerState: ae,
+    onBlur: Ne,
+    onClick: C,
+    onContextMenu: Ee,
+    onFocus: we,
+    onKeyDown: Se,
+    onKeyUp: Oe,
+    onMouseDown: Re,
+    onMouseLeave: Ce,
+    onMouseUp: Te,
+    onDragLeave: Me,
+    onTouchEnd: xe,
+    onTouchMove: Pe,
+    onTouchStart: ve,
+    ref: De,
+    tabIndex: p ? -1 : w,
+    type: I,
+    ...Y,
+    ...A,
+    children: [u, ge ? /* @__PURE__ */ B.jsx(be, {
+      ref: ye,
+      center: i,
+      ...V
+    }) : null]
+  });
+});
+function S(e, t, n, r = !1) {
+  return Z((s) => (n && n(s), r || e[t](s), !0));
+}
+process.env.NODE_ENV !== "production" && (yt.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: it,
+  /**
+   * If `true`, the ripples are centered.
+   * They won't start at the cursor interaction position.
+   * @default false
+   */
+  centerRipple: o.bool,
+  /**
+   * The content of the component.
+   */
+  children: o.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: et,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: o.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: o.bool,
+  /**
+   * If `true`, the touch ripple effect is disabled.
+   * @default false
+   */
+  disableTouchRipple: o.bool,
+  /**
+   * If `true`, the base button will have a keyboard focus ripple.
+   * @default false
+   */
+  focusRipple: o.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: o.string,
+  /**
+   * @ignore
+   */
+  formAction: o.oneOfType([o.func, o.string]),
+  /**
+   * @ignore
+   */
+  href: o.any,
+  /**
+   * The component used to render a link when the `href` prop is provided.
+   * @default 'a'
+   */
+  LinkComponent: o.elementType,
+  /**
+   * @ignore
+   */
+  onBlur: o.func,
+  /**
+   * @ignore
+   */
+  onClick: o.func,
+  /**
+   * @ignore
+   */
+  onContextMenu: o.func,
+  /**
+   * @ignore
+   */
+  onDragLeave: o.func,
+  /**
+   * @ignore
+   */
+  onFocus: o.func,
+  /**
+   * Callback fired when the component is focused with a keyboard.
+   * We trigger a `onFocus` callback too.
+   */
+  onFocusVisible: o.func,
+  /**
+   * @ignore
+   */
+  onKeyDown: o.func,
+  /**
+   * @ignore
+   */
+  onKeyUp: o.func,
+  /**
+   * @ignore
+   */
+  onMouseDown: o.func,
+  /**
+   * @ignore
+   */
+  onMouseLeave: o.func,
+  /**
+   * @ignore
+   */
+  onMouseUp: o.func,
+  /**
+   * @ignore
+   */
+  onTouchEnd: o.func,
+  /**
+   * @ignore
+   */
+  onTouchMove: o.func,
+  /**
+   * @ignore
+   */
+  onTouchStart: o.func,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
+  /**
+   * @default 0
+   */
+  tabIndex: o.number,
+  /**
+   * Props applied to the `TouchRipple` element.
+   */
+  TouchRippleProps: o.object,
+  /**
+   * A ref that points to the `TouchRipple` element.
+   */
+  touchRippleRef: o.oneOfType([o.func, o.shape({
+    current: o.shape({
+      pulsate: o.func.isRequired,
+      start: o.func.isRequired,
+      stop: o.func.isRequired
+    })
+  })]),
+  /**
+   * @ignore
+   */
+  type: o.oneOfType([o.oneOf(["button", "reset", "submit"]), o.string])
+});
+export {
+  yt as B,
+  le as T,
+  Ue as _,
+  ot as a,
+  Ze as b,
+  St as c,
+  Ae as d,
+  et as e,
+  Z as f,
+  nt as g,
+  rt as h,
+  tt as i,
+  ie as j,
+  st as m,
+  it as r,
+  ee as u
+};