@cgi-learning-hub/ui 0.0.1-dev.1708959744 → 0.0.1-dev.1708964890

package/dist/components/buttons/DefaultButton/DefaultButton.es.js

@@ -1,142 +1,490 @@
-import { jsx as g, jsxs as y } from "react/jsx-runtime";
-import * as C from "react";
-import B from "./DefaultButtonIcon.es.js";
-import { g as R, c as j, s as f, a as l, e as c, l as M, f as O, _ as W, P as t, j as U } from "../../../useThemeProps-kb_vU-1P.js";
-import { B as _, a as z } from "../../../Button-CmBnwwn3.js";
-import { u as D } from "../../../useId-BW-oWmul.js";
-import { c as F } from "../../../refType-CMQbzE37.js";
-import { C as N } from "../../../CircularProgress-DRE9BLTL.js";
-import { u as k } from "../../../useTheme-BSwuVDD3.js";
-function G(n) {
-  return j("MuiLoadingButton", n);
+import { jsx as b, jsxs as O } from "react/jsx-runtime";
+import * as p from "react";
+import N from "./DefaultButtonIcon.es.js";
+import { g as W, a as M, s as f, r as Y, c as l, _ as a, i as E, o as V, b as _, e as j, f as k, P as i, h as F } from "../../../useThemeProps-Dg9Uoq7q.js";
+import { B as Z } from "../../../ButtonBase-B0tkJ9zf.js";
+import { u as w } from "../../../useId-BW-oWmul.js";
+import { c as oo } from "../../../refType-Hh9tfnoF.js";
+import { C as no } from "../../../CircularProgress-CguDBnxV.js";
+import { u as io } from "../../../useTheme-DJEDOopE.js";
+function to(o) {
+  return M("MuiButton", o);
 }
-const H = R("MuiLoadingButton", ["root", "loading", "loadingIndicator", "loadingIndicatorCenter", "loadingIndicatorStart", "loadingIndicatorEnd", "endIconLoadingEnd", "startIconLoadingStart"]), a = H, V = ["children", "disabled", "id", "loading", "loadingIndicator", "loadingPosition", "variant"], q = (n) => {
+const ao = W("MuiButton", ["root", "text", "textInherit", "textPrimary", "textSecondary", "textSuccess", "textError", "textInfo", "textWarning", "outlined", "outlinedInherit", "outlinedPrimary", "outlinedSecondary", "outlinedSuccess", "outlinedError", "outlinedInfo", "outlinedWarning", "contained", "containedInherit", "containedPrimary", "containedSecondary", "containedSuccess", "containedError", "containedInfo", "containedWarning", "disableElevation", "focusVisible", "disabled", "colorInherit", "textSizeSmall", "textSizeMedium", "textSizeLarge", "outlinedSizeSmall", "outlinedSizeMedium", "outlinedSizeLarge", "containedSizeSmall", "containedSizeMedium", "containedSizeLarge", "sizeMedium", "sizeSmall", "sizeLarge", "fullWidth", "startIcon", "endIcon", "iconSizeSmall", "iconSizeMedium", "iconSizeLarge"]), R = ao, G = /* @__PURE__ */ p.createContext({});
+process.env.NODE_ENV !== "production" && (G.displayName = "ButtonGroupContext");
+const U = G, D = /* @__PURE__ */ p.createContext(void 0);
+process.env.NODE_ENV !== "production" && (D.displayName = "ButtonGroupButtonContext");
+const ro = D, so = ["children", "color", "component", "className", "disabled", "disableElevation", "disableFocusRipple", "endIcon", "focusVisibleClassName", "fullWidth", "size", "startIcon", "type", "variant"], lo = (o) => {
   const {
-    loading: o,
-    loadingPosition: i,
-    classes: r
-  } = n, s = {
-    root: ["root", o && "loading"],
-    startIcon: [o && `startIconLoading${c(i)}`],
-    endIcon: [o && `endIconLoading${c(i)}`],
-    loadingIndicator: ["loadingIndicator", o && `loadingIndicator${c(i)}`]
-  }, d = U(s, G, r);
-  return l({}, r, d);
-}, A = (n) => n !== "ownerState" && n !== "theme" && n !== "sx" && n !== "as" && n !== "classes", J = f(_, {
-  shouldForwardProp: (n) => A(n) || n === "classes",
+    color: n,
+    disableElevation: t,
+    fullWidth: s,
+    size: r,
+    variant: e,
+    classes: d
+  } = o, g = {
+    root: ["root", e, `${e}${l(n)}`, `size${l(r)}`, `${e}Size${l(r)}`, n === "inherit" && "colorInherit", t && "disableElevation", s && "fullWidth"],
+    label: ["label"],
+    startIcon: ["startIcon", `iconSize${l(r)}`],
+    endIcon: ["endIcon", `iconSize${l(r)}`]
+  }, x = F(g, to, d);
+  return a({}, d, x);
+}, S = (o) => a({}, o.size === "small" && {
+  "& > *:nth-of-type(1)": {
+    fontSize: 18
+  }
+}, o.size === "medium" && {
+  "& > *:nth-of-type(1)": {
+    fontSize: 20
+  }
+}, o.size === "large" && {
+  "& > *:nth-of-type(1)": {
+    fontSize: 22
+  }
+}), eo = f(Z, {
+  shouldForwardProp: (o) => Y(o) || o === "classes",
+  name: "MuiButton",
+  slot: "Root",
+  overridesResolver: (o, n) => {
+    const {
+      ownerState: t
+    } = o;
+    return [n.root, n[t.variant], n[`${t.variant}${l(t.color)}`], n[`size${l(t.size)}`], n[`${t.variant}Size${l(t.size)}`], t.color === "inherit" && n.colorInherit, t.disableElevation && n.disableElevation, t.fullWidth && n.fullWidth];
+  }
+})(({
+  theme: o,
+  ownerState: n
+}) => {
+  var t, s;
+  const r = o.palette.mode === "light" ? o.palette.grey[300] : o.palette.grey[800], e = o.palette.mode === "light" ? o.palette.grey.A100 : o.palette.grey[700];
+  return a({}, o.typography.button, {
+    minWidth: 64,
+    padding: "6px 16px",
+    borderRadius: (o.vars || o).shape.borderRadius,
+    transition: o.transitions.create(["background-color", "box-shadow", "border-color", "color"], {
+      duration: o.transitions.duration.short
+    }),
+    "&:hover": a({
+      textDecoration: "none",
+      backgroundColor: o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : E(o.palette.text.primary, o.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        backgroundColor: "transparent"
+      }
+    }, n.variant === "text" && n.color !== "inherit" && {
+      backgroundColor: o.vars ? `rgba(${o.vars.palette[n.color].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : E(o.palette[n.color].main, o.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        backgroundColor: "transparent"
+      }
+    }, n.variant === "outlined" && n.color !== "inherit" && {
+      border: `1px solid ${(o.vars || o).palette[n.color].main}`,
+      backgroundColor: o.vars ? `rgba(${o.vars.palette[n.color].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : E(o.palette[n.color].main, o.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        backgroundColor: "transparent"
+      }
+    }, n.variant === "contained" && {
+      backgroundColor: o.vars ? o.vars.palette.Button.inheritContainedHoverBg : e,
+      boxShadow: (o.vars || o).shadows[4],
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        boxShadow: (o.vars || o).shadows[2],
+        backgroundColor: (o.vars || o).palette.grey[300]
+      }
+    }, n.variant === "contained" && n.color !== "inherit" && {
+      backgroundColor: (o.vars || o).palette[n.color].dark,
+      // Reset on touch devices, it doesn't add specificity
+      "@media (hover: none)": {
+        backgroundColor: (o.vars || o).palette[n.color].main
+      }
+    }),
+    "&:active": a({}, n.variant === "contained" && {
+      boxShadow: (o.vars || o).shadows[8]
+    }),
+    [`&.${R.focusVisible}`]: a({}, n.variant === "contained" && {
+      boxShadow: (o.vars || o).shadows[6]
+    }),
+    [`&.${R.disabled}`]: a({
+      color: (o.vars || o).palette.action.disabled
+    }, n.variant === "outlined" && {
+      border: `1px solid ${(o.vars || o).palette.action.disabledBackground}`
+    }, n.variant === "contained" && {
+      color: (o.vars || o).palette.action.disabled,
+      boxShadow: (o.vars || o).shadows[0],
+      backgroundColor: (o.vars || o).palette.action.disabledBackground
+    })
+  }, n.variant === "text" && {
+    padding: "6px 8px"
+  }, n.variant === "text" && n.color !== "inherit" && {
+    color: (o.vars || o).palette[n.color].main
+  }, n.variant === "outlined" && {
+    padding: "5px 15px",
+    border: "1px solid currentColor"
+  }, n.variant === "outlined" && n.color !== "inherit" && {
+    color: (o.vars || o).palette[n.color].main,
+    border: o.vars ? `1px solid rgba(${o.vars.palette[n.color].mainChannel} / 0.5)` : `1px solid ${E(o.palette[n.color].main, 0.5)}`
+  }, n.variant === "contained" && {
+    color: o.vars ? (
+      // this is safe because grey does not change between default light/dark mode
+      o.vars.palette.text.primary
+    ) : (t = (s = o.palette).getContrastText) == null ? void 0 : t.call(s, o.palette.grey[300]),
+    backgroundColor: o.vars ? o.vars.palette.Button.inheritContainedBg : r,
+    boxShadow: (o.vars || o).shadows[2]
+  }, n.variant === "contained" && n.color !== "inherit" && {
+    color: (o.vars || o).palette[n.color].contrastText,
+    backgroundColor: (o.vars || o).palette[n.color].main
+  }, n.color === "inherit" && {
+    color: "inherit",
+    borderColor: "currentColor"
+  }, n.size === "small" && n.variant === "text" && {
+    padding: "4px 5px",
+    fontSize: o.typography.pxToRem(13)
+  }, n.size === "large" && n.variant === "text" && {
+    padding: "8px 11px",
+    fontSize: o.typography.pxToRem(15)
+  }, n.size === "small" && n.variant === "outlined" && {
+    padding: "3px 9px",
+    fontSize: o.typography.pxToRem(13)
+  }, n.size === "large" && n.variant === "outlined" && {
+    padding: "7px 21px",
+    fontSize: o.typography.pxToRem(15)
+  }, n.size === "small" && n.variant === "contained" && {
+    padding: "4px 10px",
+    fontSize: o.typography.pxToRem(13)
+  }, n.size === "large" && n.variant === "contained" && {
+    padding: "8px 22px",
+    fontSize: o.typography.pxToRem(15)
+  }, n.fullWidth && {
+    width: "100%"
+  });
+}, ({
+  ownerState: o
+}) => o.disableElevation && {
+  boxShadow: "none",
+  "&:hover": {
+    boxShadow: "none"
+  },
+  [`&.${R.focusVisible}`]: {
+    boxShadow: "none"
+  },
+  "&:active": {
+    boxShadow: "none"
+  },
+  [`&.${R.disabled}`]: {
+    boxShadow: "none"
+  }
+}), co = f("span", {
+  name: "MuiButton",
+  slot: "StartIcon",
+  overridesResolver: (o, n) => {
+    const {
+      ownerState: t
+    } = o;
+    return [n.startIcon, n[`iconSize${l(t.size)}`]];
+  }
+})(({
+  ownerState: o
+}) => a({
+  display: "inherit",
+  marginRight: 8,
+  marginLeft: -4
+}, o.size === "small" && {
+  marginLeft: -2
+}, S(o))), uo = f("span", {
+  name: "MuiButton",
+  slot: "EndIcon",
+  overridesResolver: (o, n) => {
+    const {
+      ownerState: t
+    } = o;
+    return [n.endIcon, n[`iconSize${l(t.size)}`]];
+  }
+})(({
+  ownerState: o
+}) => a({
+  display: "inherit",
+  marginRight: -4,
+  marginLeft: 8
+}, o.size === "small" && {
+  marginRight: -2
+}, S(o))), H = /* @__PURE__ */ p.forwardRef(function(n, t) {
+  const s = p.useContext(U), r = p.useContext(ro), e = V(s, n), d = _({
+    props: e,
+    name: "MuiButton"
+  }), {
+    children: g,
+    color: x = "primary",
+    component: v = "button",
+    className: h,
+    disabled: z = !1,
+    disableElevation: $ = !1,
+    disableFocusRipple: B = !1,
+    endIcon: I,
+    focusVisibleClassName: m,
+    fullWidth: u = !1,
+    size: P = "medium",
+    startIcon: y,
+    type: T,
+    variant: q = "text"
+  } = d, J = j(d, so), L = a({}, d, {
+    color: x,
+    component: v,
+    disabled: z,
+    disableElevation: $,
+    disableFocusRipple: B,
+    fullWidth: u,
+    size: P,
+    type: T,
+    variant: q
+  }), C = lo(L), K = y && /* @__PURE__ */ b(co, {
+    className: C.startIcon,
+    ownerState: L,
+    children: y
+  }), Q = I && /* @__PURE__ */ b(uo, {
+    className: C.endIcon,
+    ownerState: L,
+    children: I
+  }), X = r || "";
+  return /* @__PURE__ */ O(eo, a({
+    ownerState: L,
+    className: k(s.className, C.root, h, X),
+    component: v,
+    disabled: z,
+    focusRipple: !B,
+    focusVisibleClassName: k(C.focusVisible, m),
+    ref: t,
+    type: T
+  }, J, {
+    classes: C,
+    children: [K, g, Q]
+  }));
+});
+process.env.NODE_ENV !== "production" && (H.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: i.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: i.object,
+  /**
+   * @ignore
+   */
+  className: i.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color: i.oneOfType([i.oneOf(["inherit", "primary", "secondary", "success", "error", "info", "warning"]), i.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: i.elementType,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: i.bool,
+  /**
+   * If `true`, no elevation is used.
+   * @default false
+   */
+  disableElevation: i.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: i.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: i.bool,
+  /**
+   * Element placed after the children.
+   */
+  endIcon: i.node,
+  /**
+   * @ignore
+   */
+  focusVisibleClassName: i.string,
+  /**
+   * If `true`, the button will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: i.bool,
+  /**
+   * The URL to link to when the button is clicked.
+   * If defined, an `a` element will be used as the root node.
+   */
+  href: i.string,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense button styling.
+   * @default 'medium'
+   */
+  size: i.oneOfType([i.oneOf(["small", "medium", "large"]), i.string]),
+  /**
+   * Element placed before the children.
+   */
+  startIcon: i.node,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: i.oneOfType([i.arrayOf(i.oneOfType([i.func, i.object, i.bool])), i.func, i.object]),
+  /**
+   * @ignore
+   */
+  type: i.oneOfType([i.oneOf(["button", "reset", "submit"]), i.string]),
+  /**
+   * The variant to use.
+   * @default 'text'
+   */
+  variant: i.oneOfType([i.oneOf(["contained", "outlined", "text"]), i.string])
+});
+const po = H;
+function go(o) {
+  return M("MuiLoadingButton", o);
+}
+const vo = W("MuiLoadingButton", ["root", "loading", "loadingIndicator", "loadingIndicatorCenter", "loadingIndicatorStart", "loadingIndicatorEnd", "endIconLoadingEnd", "startIconLoadingStart"]), c = vo, bo = ["children", "disabled", "id", "loading", "loadingIndicator", "loadingPosition", "variant"], fo = (o) => {
+  const {
+    loading: n,
+    loadingPosition: t,
+    classes: s
+  } = o, r = {
+    root: ["root", n && "loading"],
+    startIcon: [n && `startIconLoading${l(t)}`],
+    endIcon: [n && `endIconLoading${l(t)}`],
+    loadingIndicator: ["loadingIndicator", n && `loadingIndicator${l(t)}`]
+  }, e = F(r, go, s);
+  return a({}, s, e);
+}, xo = (o) => o !== "ownerState" && o !== "theme" && o !== "sx" && o !== "as" && o !== "classes", Io = f(po, {
+  shouldForwardProp: (o) => xo(o) || o === "classes",
   name: "MuiLoadingButton",
   slot: "Root",
-  overridesResolver: (n, o) => [o.root, o.startIconLoadingStart && {
-    [`& .${a.startIconLoadingStart}`]: o.startIconLoadingStart
-  }, o.endIconLoadingEnd && {
-    [`& .${a.endIconLoadingEnd}`]: o.endIconLoadingEnd
+  overridesResolver: (o, n) => [n.root, n.startIconLoadingStart && {
+    [`& .${c.startIconLoadingStart}`]: n.startIconLoadingStart
+  }, n.endIconLoadingEnd && {
+    [`& .${c.endIconLoadingEnd}`]: n.endIconLoadingEnd
   }]
 })(({
-  ownerState: n,
-  theme: o
-}) => l({
-  [`& .${a.startIconLoadingStart}, & .${a.endIconLoadingEnd}`]: {
-    transition: o.transitions.create(["opacity"], {
-      duration: o.transitions.duration.short
+  ownerState: o,
+  theme: n
+}) => a({
+  [`& .${c.startIconLoadingStart}, & .${c.endIconLoadingEnd}`]: {
+    transition: n.transitions.create(["opacity"], {
+      duration: n.transitions.duration.short
     }),
     opacity: 0
   }
-}, n.loadingPosition === "center" && {
-  transition: o.transitions.create(["background-color", "box-shadow", "border-color"], {
-    duration: o.transitions.duration.short
+}, o.loadingPosition === "center" && {
+  transition: n.transitions.create(["background-color", "box-shadow", "border-color"], {
+    duration: n.transitions.duration.short
   }),
-  [`&.${a.loading}`]: {
+  [`&.${c.loading}`]: {
     color: "transparent"
   }
-}, n.loadingPosition === "start" && n.fullWidth && {
-  [`& .${a.startIconLoadingStart}, & .${a.endIconLoadingEnd}`]: {
-    transition: o.transitions.create(["opacity"], {
-      duration: o.transitions.duration.short
+}, o.loadingPosition === "start" && o.fullWidth && {
+  [`& .${c.startIconLoadingStart}, & .${c.endIconLoadingEnd}`]: {
+    transition: n.transitions.create(["opacity"], {
+      duration: n.transitions.duration.short
     }),
     opacity: 0,
     marginRight: -8
   }
-}, n.loadingPosition === "end" && n.fullWidth && {
-  [`& .${a.startIconLoadingStart}, & .${a.endIconLoadingEnd}`]: {
-    transition: o.transitions.create(["opacity"], {
-      duration: o.transitions.duration.short
+}, o.loadingPosition === "end" && o.fullWidth && {
+  [`& .${c.startIconLoadingStart}, & .${c.endIconLoadingEnd}`]: {
+    transition: n.transitions.create(["opacity"], {
+      duration: n.transitions.duration.short
     }),
     opacity: 0,
     marginLeft: -8
   }
-})), K = f("span", {
+})), yo = f("span", {
   name: "MuiLoadingButton",
   slot: "LoadingIndicator",
-  overridesResolver: (n, o) => {
+  overridesResolver: (o, n) => {
     const {
-      ownerState: i
-    } = n;
-    return [o.loadingIndicator, o[`loadingIndicator${c(i.loadingPosition)}`]];
+      ownerState: t
+    } = o;
+    return [n.loadingIndicator, n[`loadingIndicator${l(t.loadingPosition)}`]];
   }
 })(({
-  theme: n,
-  ownerState: o
-}) => l({
+  theme: o,
+  ownerState: n
+}) => a({
   position: "absolute",
   visibility: "visible",
   display: "flex"
-}, o.loadingPosition === "start" && (o.variant === "outlined" || o.variant === "contained") && {
-  left: o.size === "small" ? 10 : 14
-}, o.loadingPosition === "start" && o.variant === "text" && {
+}, n.loadingPosition === "start" && (n.variant === "outlined" || n.variant === "contained") && {
+  left: n.size === "small" ? 10 : 14
+}, n.loadingPosition === "start" && n.variant === "text" && {
   left: 6
-}, o.loadingPosition === "center" && {
+}, n.loadingPosition === "center" && {
   left: "50%",
   transform: "translate(-50%)",
-  color: (n.vars || n).palette.action.disabled
-}, o.loadingPosition === "end" && (o.variant === "outlined" || o.variant === "contained") && {
-  right: o.size === "small" ? 10 : 14
-}, o.loadingPosition === "end" && o.variant === "text" && {
+  color: (o.vars || o).palette.action.disabled
+}, n.loadingPosition === "end" && (n.variant === "outlined" || n.variant === "contained") && {
+  right: n.size === "small" ? 10 : 14
+}, n.loadingPosition === "end" && n.variant === "text" && {
   right: 6
-}, o.loadingPosition === "start" && o.fullWidth && {
+}, n.loadingPosition === "start" && n.fullWidth && {
   position: "relative",
   left: -10
-}, o.loadingPosition === "end" && o.fullWidth && {
+}, n.loadingPosition === "end" && n.fullWidth && {
   position: "relative",
   right: -10
-})), x = /* @__PURE__ */ C.forwardRef(function(o, i) {
-  const r = C.useContext(z), s = M(r, o), d = O({
-    props: s,
+})), A = /* @__PURE__ */ p.forwardRef(function(n, t) {
+  const s = p.useContext(U), r = V(s, n), e = _({
+    props: r,
     name: "MuiLoadingButton"
   }), {
-    children: I,
-    disabled: p = !1,
-    id: $,
-    loading: u = !1,
+    children: d,
+    disabled: g = !1,
+    id: x,
+    loading: v = !1,
     loadingIndicator: h,
-    loadingPosition: E = "center",
-    variant: m = "text"
-  } = d, T = W(d, V), L = D($), P = h ?? /* @__PURE__ */ g(N, {
-    "aria-labelledby": L,
+    loadingPosition: z = "center",
+    variant: $ = "text"
+  } = e, B = j(e, bo), I = w(x), m = h ?? /* @__PURE__ */ b(no, {
+    "aria-labelledby": I,
     color: "inherit",
     size: 16
-  }), e = l({}, d, {
-    disabled: p,
-    loading: u,
-    loadingIndicator: P,
-    loadingPosition: E,
-    variant: m
-  }), b = q(e), v = u ? /* @__PURE__ */ g(K, {
-    className: b.loadingIndicator,
-    ownerState: e,
-    children: P
+  }), u = a({}, e, {
+    disabled: g,
+    loading: v,
+    loadingIndicator: m,
+    loadingPosition: z,
+    variant: $
+  }), P = fo(u), y = v ? /* @__PURE__ */ b(yo, {
+    className: P.loadingIndicator,
+    ownerState: u,
+    children: m
   }) : null;
-  return /* @__PURE__ */ y(J, l({
-    disabled: p || u,
-    id: L,
-    ref: i
-  }, T, {
-    variant: m,
-    classes: b,
-    ownerState: e,
-    children: [e.loadingPosition === "end" ? I : v, e.loadingPosition === "end" ? v : I]
+  return /* @__PURE__ */ O(Io, a({
+    disabled: g || v,
+    id: I,
+    ref: t
+  }, B, {
+    variant: $,
+    classes: P,
+    ownerState: u,
+    children: [u.loadingPosition === "end" ? d : y, u.loadingPosition === "end" ? y : d]
   }));
 });
-process.env.NODE_ENV !== "production" && (x.propTypes = {
+process.env.NODE_ENV !== "production" && (A.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -144,50 +492,50 @@ process.env.NODE_ENV !== "production" && (x.propTypes = {
   /**
    * The content of the component.
    */
-  children: t.node,
+  children: i.node,
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: t.object,
+  classes: i.object,
   /**
    * If `true`, the component is disabled.
    * @default false
    */
-  disabled: t.bool,
+  disabled: i.bool,
   /**
    * @ignore
    */
-  id: t.string,
+  id: i.string,
   /**
    * If `true`, the loading indicator is shown and the button becomes disabled.
    * @default false
    */
-  loading: t.bool,
+  loading: i.bool,
   /**
    * Element placed before the children if the button is in loading state.
    * The node should contain an element with `role="progressbar"` with an accessible name.
    * By default we render a `CircularProgress` that is labelled by the button itself.
    * @default <CircularProgress color="inherit" size={16} />
    */
-  loadingIndicator: t.node,
+  loadingIndicator: i.node,
   /**
    * The loading indicator can be positioned on the start, end, or the center of the button.
    * @default 'center'
    */
-  loadingPosition: F(t.oneOf(["start", "end", "center"]), (n) => n.loadingPosition === "start" && !n.startIcon ? new Error('MUI: The loadingPosition="start" should be used in combination with startIcon.') : n.loadingPosition === "end" && !n.endIcon ? new Error('MUI: The loadingPosition="end" should be used in combination with endIcon.') : null),
+  loadingPosition: oo(i.oneOf(["start", "end", "center"]), (o) => o.loadingPosition === "start" && !o.startIcon ? new Error('MUI: The loadingPosition="start" should be used in combination with startIcon.') : o.loadingPosition === "end" && !o.endIcon ? new Error('MUI: The loadingPosition="end" should be used in combination with endIcon.') : null),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object]),
+  sx: i.oneOfType([i.arrayOf(i.oneOfType([i.func, i.object, i.bool])), i.func, i.object]),
   /**
    * The variant to use.
    * @default 'text'
    */
-  variant: t.oneOfType([t.oneOf(["contained", "outlined", "text"]), t.string])
+  variant: i.oneOfType([i.oneOf(["contained", "outlined", "text"]), i.string])
 });
-const Q = x, X = f(Q, {
-  shouldForwardProp: (n) => n !== "contentColor" && n !== "hoverColor"
-})(({ contentColor: n, hoverColor: o, theme: i }) => ({
+const Co = A, ho = f(Co, {
+  shouldForwardProp: (o) => o !== "contentColor" && o !== "hoverColor"
+})(({ contentColor: o, hoverColor: n, theme: t }) => ({
   justifyContent: "center",
   alignItems: "center",
   columnGap: 8,
@@ -195,37 +543,37 @@ const Q = x, X = f(Q, {
   paddingLeft: 12,
   paddingRight: 12,
   textTransform: "none",
-  color: n,
-  borderColor: n,
+  color: o,
+  borderColor: o,
   borderRadius: 5,
   borderWidth: 2,
   "&:hover": {
-    color: i.palette.common.white,
-    backgroundColor: o,
-    borderColor: o,
+    color: t.palette.common.white,
+    backgroundColor: n,
+    borderColor: n,
     borderWidth: 2
   }
-})), ao = ({
-  icon: n,
-  text: o,
-  ...i
+})), Oo = ({
+  icon: o,
+  text: n,
+  ...t
 }) => {
-  const r = k(), s = i.contentColor ?? r.palette.primary.main;
-  return /* @__PURE__ */ y(
-    X,
+  const s = io(), r = t.contentColor ?? s.palette.primary.main;
+  return /* @__PURE__ */ O(
+    ho,
     {
-      ...i,
+      ...t,
       variant: "outlined",
-      contentColor: s,
-      hoverColor: i.hoverColor ?? s,
+      contentColor: r,
+      hoverColor: t.hoverColor ?? r,
       children: [
-        (n == null ? void 0 : n.position) === "left" ? /* @__PURE__ */ g(B, { ...n }) : null,
-        o,
-        (n == null ? void 0 : n.position) === "right" ? /* @__PURE__ */ g(B, { ...n }) : null
+        (o == null ? void 0 : o.position) === "left" ? /* @__PURE__ */ b(N, { ...o }) : null,
+        n,
+        (o == null ? void 0 : o.position) === "right" ? /* @__PURE__ */ b(N, { ...o }) : null
       ]
     }
   );
 };
 export {
-  ao as default
+  Oo as default
 };