@cgi-learning-hub/ui 0.0.1-dev.1709567324 → 0.0.1-dev.1709568003

package/dist/Tabs-DiWeNGD4.js

@@ -0,0 +1,1167 @@
+import { u as st, g as me, c as ke, _ as u, a as Q, P as o } from "./clamp-BGJvJ0FN.js";
+import * as f from "react";
+import { g as ve, s as at, u as it, c as P, b as Se, r as ct } from "./styled-BU8dAebc.js";
+import { jsxs as J, jsx as N } from "react/jsx-runtime";
+import { B as dt } from "./ButtonBase-V1pwsMMs.js";
+import { u as ut } from "./unsupportedProp-BuVD30Gh.js";
+import { s as X } from "./styled-DP6LeBLQ.js";
+import { T as ft, d as pt, u as $e } from "./useThemeProps-63SNG58r.js";
+import { a as bt, u as ht } from "./useForkRef-CQ5u1_mH.js";
+import { d as Fe, a as Le, o as mt } from "./ownerWindow-C7EH1lr6.js";
+import { a as be } from "./useTimeout-C7IkLqZ9.js";
+import { r as vt } from "./refType-CoCfCK--.js";
+import { c as Ae } from "./createSvgIcon-DeRU4e-L.js";
+import { B as St } from "./ButtonBase-aujiNoUb.js";
+let U;
+function De() {
+  if (U)
+    return U;
+  const e = document.createElement("div"), t = document.createElement("div");
+  return t.style.width = "10px", t.style.height = "1px", e.appendChild(t), e.dir = "rtl", e.style.fontSize = "14px", e.style.width = "4px", e.style.height = "1px", e.style.position = "absolute", e.style.top = "-1000px", e.style.overflow = "scroll", document.body.appendChild(e), U = "reverse", e.scrollLeft > 0 ? U = "default" : (e.scrollLeft = 1, e.scrollLeft === 0 && (U = "negative")), document.body.removeChild(e), U;
+}
+function yt(e, t) {
+  const n = e.scrollLeft;
+  if (t !== "rtl")
+    return n;
+  switch (De()) {
+    case "negative":
+      return e.scrollWidth - e.clientWidth + n;
+    case "reverse":
+      return e.scrollWidth - e.clientWidth - n;
+    default:
+      return n;
+  }
+}
+function _e() {
+  const e = st(pt);
+  return process.env.NODE_ENV !== "production" && f.useDebugValue(e), e[ft] || e;
+}
+function gt(e) {
+  return me("MuiTab", e);
+}
+const Tt = ve("MuiTab", ["root", "labelIcon", "textColorInherit", "textColorPrimary", "textColorSecondary", "selected", "disabled", "fullWidth", "wrapped", "iconWrapper"]), _ = Tt, xt = ["className", "disabled", "disableFocusRipple", "fullWidth", "icon", "iconPosition", "indicator", "label", "onChange", "onClick", "onFocus", "selected", "selectionFollowsFocus", "textColor", "value", "wrapped"], Bt = (e) => {
+  const {
+    classes: t,
+    textColor: n,
+    fullWidth: s,
+    wrapped: a,
+    icon: i,
+    label: v,
+    selected: b,
+    disabled: p
+  } = e, h = {
+    root: ["root", i && v && "labelIcon", `textColor${ke(n)}`, s && "fullWidth", a && "wrapped", b && "selected", p && "disabled"],
+    iconWrapper: ["iconWrapper"]
+  };
+  return Se(h, gt, t);
+}, Ct = at(dt, {
+  name: "MuiTab",
+  slot: "Root",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: n
+    } = e;
+    return [t.root, n.label && n.icon && t.labelIcon, t[`textColor${ke(n.textColor)}`], n.fullWidth && t.fullWidth, n.wrapped && t.wrapped];
+  }
+})(({
+  theme: e,
+  ownerState: t
+}) => u({}, e.typography.button, {
+  maxWidth: 360,
+  minWidth: 90,
+  position: "relative",
+  minHeight: 48,
+  flexShrink: 0,
+  padding: "12px 16px",
+  overflow: "hidden",
+  whiteSpace: "normal",
+  textAlign: "center"
+}, t.label && {
+  flexDirection: t.iconPosition === "top" || t.iconPosition === "bottom" ? "column" : "row"
+}, {
+  lineHeight: 1.25
+}, t.icon && t.label && {
+  minHeight: 72,
+  paddingTop: 9,
+  paddingBottom: 9,
+  [`& > .${_.iconWrapper}`]: u({}, t.iconPosition === "top" && {
+    marginBottom: 6
+  }, t.iconPosition === "bottom" && {
+    marginTop: 6
+  }, t.iconPosition === "start" && {
+    marginRight: e.spacing(1)
+  }, t.iconPosition === "end" && {
+    marginLeft: e.spacing(1)
+  })
+}, t.textColor === "inherit" && {
+  color: "inherit",
+  opacity: 0.6,
+  // same opacity as theme.palette.text.secondary
+  [`&.${_.selected}`]: {
+    opacity: 1
+  },
+  [`&.${_.disabled}`]: {
+    opacity: (e.vars || e).palette.action.disabledOpacity
+  }
+}, t.textColor === "primary" && {
+  color: (e.vars || e).palette.text.secondary,
+  [`&.${_.selected}`]: {
+    color: (e.vars || e).palette.primary.main
+  },
+  [`&.${_.disabled}`]: {
+    color: (e.vars || e).palette.text.disabled
+  }
+}, t.textColor === "secondary" && {
+  color: (e.vars || e).palette.text.secondary,
+  [`&.${_.selected}`]: {
+    color: (e.vars || e).palette.secondary.main
+  },
+  [`&.${_.disabled}`]: {
+    color: (e.vars || e).palette.text.disabled
+  }
+}, t.fullWidth && {
+  flexShrink: 1,
+  flexGrow: 1,
+  flexBasis: 0,
+  maxWidth: "none"
+}, t.wrapped && {
+  fontSize: e.typography.pxToRem(12)
+})), He = /* @__PURE__ */ f.forwardRef(function(t, n) {
+  const s = it({
+    props: t,
+    name: "MuiTab"
+  }), {
+    className: a,
+    disabled: i = !1,
+    disableFocusRipple: v = !1,
+    // eslint-disable-next-line react/prop-types
+    fullWidth: b,
+    icon: p,
+    iconPosition: h = "top",
+    // eslint-disable-next-line react/prop-types
+    indicator: g,
+    label: x,
+    onChange: S,
+    onClick: y,
+    onFocus: R,
+    // eslint-disable-next-line react/prop-types
+    selected: B,
+    // eslint-disable-next-line react/prop-types
+    selectionFollowsFocus: C,
+    // eslint-disable-next-line react/prop-types
+    textColor: H = "inherit",
+    value: w,
+    wrapped: ie = !1
+  } = s, j = Q(s, xt), Y = u({}, s, {
+    disabled: i,
+    disableFocusRipple: v,
+    selected: B,
+    icon: !!p,
+    iconPosition: h,
+    label: !!x,
+    fullWidth: b,
+    textColor: H,
+    wrapped: ie
+  }), V = Bt(Y), F = p && x && /* @__PURE__ */ f.isValidElement(p) ? /* @__PURE__ */ f.cloneElement(p, {
+    className: P(V.iconWrapper, p.props.className)
+  }) : p, ee = (M) => {
+    !B && S && S(M, w), y && y(M);
+  }, z = (M) => {
+    C && !B && S && S(M, w), R && R(M);
+  };
+  return /* @__PURE__ */ J(Ct, u({
+    focusRipple: !v,
+    className: P(V.root, a),
+    ref: n,
+    role: "tab",
+    "aria-selected": B,
+    disabled: i,
+    onClick: ee,
+    onFocus: z,
+    ownerState: Y,
+    tabIndex: B ? 0 : -1
+  }, j, {
+    children: [h === "top" || h === "start" ? /* @__PURE__ */ J(f.Fragment, {
+      children: [F, x]
+    }) : /* @__PURE__ */ J(f.Fragment, {
+      children: [x, F]
+    }), g]
+  }));
+});
+process.env.NODE_ENV !== "production" && (He.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * This prop isn't supported.
+   * Use the `component` prop if you need to change the children structure.
+   */
+  children: ut,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.string,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: o.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: 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,
+  /**
+   * The icon to display.
+   */
+  icon: o.oneOfType([o.element, o.string]),
+  /**
+   * The position of the icon relative to the label.
+   * @default 'top'
+   */
+  iconPosition: o.oneOf(["bottom", "end", "start", "top"]),
+  /**
+   * The label element.
+   */
+  label: o.node,
+  /**
+   * @ignore
+   */
+  onChange: o.func,
+  /**
+   * @ignore
+   */
+  onClick: o.func,
+  /**
+   * @ignore
+   */
+  onFocus: 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]),
+  /**
+   * You can provide your own value. Otherwise, we fallback to the child position index.
+   */
+  value: o.any,
+  /**
+   * Tab labels appear in a single row.
+   * They can use a second line if needed.
+   * @default false
+   */
+  wrapped: o.bool
+});
+const po = He;
+function wt(e) {
+  return typeof e == "string";
+}
+function Et(e, t, n) {
+  return e === void 0 || wt(e) ? t : u({}, t, {
+    ownerState: u({}, t.ownerState, n)
+  });
+}
+function It(e, t = []) {
+  if (e === void 0)
+    return {};
+  const n = {};
+  return Object.keys(e).filter((s) => s.match(/^on[A-Z]/) && typeof e[s] == "function" && !t.includes(s)).forEach((s) => {
+    n[s] = e[s];
+  }), n;
+}
+function Nt(e, t, n) {
+  return typeof e == "function" ? e(t, n) : e;
+}
+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 Ot(e) {
+  const {
+    getSlotProps: t,
+    additionalProps: n,
+    externalSlotProps: s,
+    externalForwardedProps: a,
+    className: i
+  } = e;
+  if (!t) {
+    const y = P(n == null ? void 0 : n.className, i, a == null ? void 0 : a.className, s == null ? void 0 : s.className), R = u({}, n == null ? void 0 : n.style, a == null ? void 0 : a.style, s == null ? void 0 : s.style), B = u({}, n, a, s);
+    return y.length > 0 && (B.className = y), Object.keys(R).length > 0 && (B.style = R), {
+      props: B,
+      internalRef: void 0
+    };
+  }
+  const v = It(u({}, a, s)), b = Pe(s), p = Pe(a), h = t(v), g = P(h == null ? void 0 : h.className, n == null ? void 0 : n.className, i, a == null ? void 0 : a.className, s == null ? void 0 : s.className), x = u({}, h == null ? void 0 : h.style, n == null ? void 0 : n.style, a == null ? void 0 : a.style, s == null ? void 0 : s.style), S = u({}, h, n, p, b);
+  return g.length > 0 && (S.className = g), Object.keys(x).length > 0 && (S.style = x), {
+    props: S,
+    internalRef: h.ref
+  };
+}
+const Pt = ["elementType", "externalSlotProps", "ownerState", "skipResolvingSlotProps"];
+function ae(e) {
+  var t;
+  const {
+    elementType: n,
+    externalSlotProps: s,
+    ownerState: a,
+    skipResolvingSlotProps: i = !1
+  } = e, v = Q(e, Pt), b = i ? {} : Nt(s, a), {
+    props: p,
+    internalRef: h
+  } = Ot(u({}, v, {
+    externalSlotProps: b
+  })), g = bt(h, b == null ? void 0 : b.ref, (t = e.additionalProps) == null ? void 0 : t.ref);
+  return Et(n, u({}, p, {
+    ref: g
+  }), a);
+}
+function Rt(e) {
+  return (1 + Math.sin(Math.PI * e - Math.PI / 2)) / 2;
+}
+function Mt(e, t, n, s = {}, a = () => {
+}) {
+  const {
+    ease: i = Rt,
+    duration: v = 300
+    // standard
+  } = s;
+  let b = null;
+  const p = t[e];
+  let h = !1;
+  const g = () => {
+    h = !0;
+  }, x = (S) => {
+    if (h) {
+      a(new Error("Animation cancelled"));
+      return;
+    }
+    b === null && (b = S);
+    const y = Math.min(1, (S - b) / v);
+    if (t[e] = i(y) * (n - p) + p, y >= 1) {
+      requestAnimationFrame(() => {
+        a(null);
+      });
+      return;
+    }
+    requestAnimationFrame(x);
+  };
+  return p === n ? (a(new Error("Element already at target position")), g) : (requestAnimationFrame(x), g);
+}
+const Wt = ["onChange"], zt = {
+  width: 99,
+  height: 99,
+  position: "absolute",
+  top: -9999,
+  overflow: "scroll"
+};
+function je(e) {
+  const {
+    onChange: t
+  } = e, n = Q(e, Wt), s = f.useRef(), a = f.useRef(null), i = () => {
+    s.current = a.current.offsetHeight - a.current.clientHeight;
+  };
+  return ht(() => {
+    const v = Fe(() => {
+      const p = s.current;
+      i(), p !== s.current && t(s.current);
+    }), b = Le(a.current);
+    return b.addEventListener("resize", v), () => {
+      v.clear(), b.removeEventListener("resize", v);
+    };
+  }, [t]), f.useEffect(() => {
+    i(), t(s.current);
+  }, [t]), /* @__PURE__ */ N("div", u({
+    style: zt,
+    ref: a
+  }, n));
+}
+process.env.NODE_ENV !== "production" && (je.propTypes = {
+  onChange: o.func.isRequired
+});
+const kt = Ae(/* @__PURE__ */ N("path", {
+  d: "M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"
+}), "KeyboardArrowLeft"), $t = Ae(/* @__PURE__ */ N("path", {
+  d: "M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"
+}), "KeyboardArrowRight");
+function Ft(e) {
+  return me("MuiTabScrollButton", e);
+}
+const Lt = ve("MuiTabScrollButton", ["root", "vertical", "horizontal", "disabled"]), At = Lt, Dt = ["className", "slots", "slotProps", "direction", "orientation", "disabled"], _t = (e) => {
+  const {
+    classes: t,
+    orientation: n,
+    disabled: s
+  } = e;
+  return Se({
+    root: ["root", n, s && "disabled"]
+  }, Ft, t);
+}, Ht = X(St, {
+  name: "MuiTabScrollButton",
+  slot: "Root",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: n
+    } = e;
+    return [t.root, n.orientation && t[n.orientation]];
+  }
+})(({
+  ownerState: e
+}) => u({
+  width: 40,
+  flexShrink: 0,
+  opacity: 0.8,
+  [`&.${At.disabled}`]: {
+    opacity: 0
+  }
+}, e.orientation === "vertical" && {
+  width: "100%",
+  height: 40,
+  "& svg": {
+    transform: `rotate(${e.isRtl ? -90 : 90}deg)`
+  }
+})), Ve = /* @__PURE__ */ f.forwardRef(function(t, n) {
+  var s, a;
+  const i = $e({
+    props: t,
+    name: "MuiTabScrollButton"
+  }), {
+    className: v,
+    slots: b = {},
+    slotProps: p = {},
+    direction: h
+  } = i, g = Q(i, Dt), S = _e().direction === "rtl", y = u({
+    isRtl: S
+  }, i), R = _t(y), B = (s = b.StartScrollButtonIcon) != null ? s : kt, C = (a = b.EndScrollButtonIcon) != null ? a : $t, H = ae({
+    elementType: B,
+    externalSlotProps: p.startScrollButtonIcon,
+    additionalProps: {
+      fontSize: "small"
+    },
+    ownerState: y
+  }), w = ae({
+    elementType: C,
+    externalSlotProps: p.endScrollButtonIcon,
+    additionalProps: {
+      fontSize: "small"
+    },
+    ownerState: y
+  });
+  return /* @__PURE__ */ N(Ht, u({
+    component: "div",
+    className: P(R.root, v),
+    ref: n,
+    role: null,
+    ownerState: y,
+    tabIndex: null
+  }, g, {
+    children: h === "left" ? /* @__PURE__ */ N(B, u({}, H)) : /* @__PURE__ */ N(C, u({}, w))
+  }));
+});
+process.env.NODE_ENV !== "production" && (Ve.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: o.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.string,
+  /**
+   * The direction the button should indicate.
+   */
+  direction: o.oneOf(["left", "right"]).isRequired,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: o.bool,
+  /**
+   * The component orientation (layout flow direction).
+   */
+  orientation: o.oneOf(["horizontal", "vertical"]).isRequired,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   * @default {}
+   */
+  slotProps: o.shape({
+    endScrollButtonIcon: o.oneOfType([o.func, o.object]),
+    startScrollButtonIcon: o.oneOfType([o.func, o.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: o.shape({
+    EndScrollButtonIcon: o.elementType,
+    StartScrollButtonIcon: o.elementType
+  }),
+  /**
+   * 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])
+});
+const jt = Ve;
+function Vt(e) {
+  return me("MuiTabs", e);
+}
+const Ut = ve("MuiTabs", ["root", "vertical", "flexContainer", "flexContainerVertical", "centered", "scroller", "fixed", "scrollableX", "scrollableY", "hideScrollbar", "scrollButtons", "scrollButtonsHideMobile", "indicator"]), he = Ut, Xt = ["aria-label", "aria-labelledby", "action", "centered", "children", "className", "component", "allowScrollButtonsMobile", "indicatorColor", "onChange", "orientation", "ScrollButtonComponent", "scrollButtons", "selectionFollowsFocus", "slots", "slotProps", "TabIndicatorProps", "TabScrollButtonProps", "textColor", "value", "variant", "visibleScrollbar"], Re = (e, t) => e === t ? e.firstChild : t && t.nextElementSibling ? t.nextElementSibling : e.firstChild, Me = (e, t) => e === t ? e.lastChild : t && t.previousElementSibling ? t.previousElementSibling : e.lastChild, se = (e, t, n) => {
+  let s = !1, a = n(e, t);
+  for (; a; ) {
+    if (a === e.firstChild) {
+      if (s)
+        return;
+      s = !0;
+    }
+    const i = a.disabled || a.getAttribute("aria-disabled") === "true";
+    if (!a.hasAttribute("tabindex") || i)
+      a = n(e, a);
+    else {
+      a.focus();
+      return;
+    }
+  }
+}, Yt = (e) => {
+  const {
+    vertical: t,
+    fixed: n,
+    hideScrollbar: s,
+    scrollableX: a,
+    scrollableY: i,
+    centered: v,
+    scrollButtonsHideMobile: b,
+    classes: p
+  } = e;
+  return Se({
+    root: ["root", t && "vertical"],
+    scroller: ["scroller", n && "fixed", s && "hideScrollbar", a && "scrollableX", i && "scrollableY"],
+    flexContainer: ["flexContainer", t && "flexContainerVertical", v && "centered"],
+    indicator: ["indicator"],
+    scrollButtons: ["scrollButtons", b && "scrollButtonsHideMobile"],
+    scrollableX: [a && "scrollableX"],
+    hideScrollbar: [s && "hideScrollbar"]
+  }, Vt, p);
+}, Kt = X("div", {
+  name: "MuiTabs",
+  slot: "Root",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: n
+    } = e;
+    return [{
+      [`& .${he.scrollButtons}`]: t.scrollButtons
+    }, {
+      [`& .${he.scrollButtons}`]: n.scrollButtonsHideMobile && t.scrollButtonsHideMobile
+    }, t.root, n.vertical && t.vertical];
+  }
+})(({
+  ownerState: e,
+  theme: t
+}) => u({
+  overflow: "hidden",
+  minHeight: 48,
+  // Add iOS momentum scrolling for iOS < 13.0
+  WebkitOverflowScrolling: "touch",
+  display: "flex"
+}, e.vertical && {
+  flexDirection: "column"
+}, e.scrollButtonsHideMobile && {
+  [`& .${he.scrollButtons}`]: {
+    [t.breakpoints.down("sm")]: {
+      display: "none"
+    }
+  }
+})), qt = X("div", {
+  name: "MuiTabs",
+  slot: "Scroller",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: n
+    } = e;
+    return [t.scroller, n.fixed && t.fixed, n.hideScrollbar && t.hideScrollbar, n.scrollableX && t.scrollableX, n.scrollableY && t.scrollableY];
+  }
+})(({
+  ownerState: e
+}) => u({
+  position: "relative",
+  display: "inline-block",
+  flex: "1 1 auto",
+  whiteSpace: "nowrap"
+}, e.fixed && {
+  overflowX: "hidden",
+  width: "100%"
+}, e.hideScrollbar && {
+  // Hide dimensionless scrollbar on macOS
+  scrollbarWidth: "none",
+  // Firefox
+  "&::-webkit-scrollbar": {
+    display: "none"
+    // Safari + Chrome
+  }
+}, e.scrollableX && {
+  overflowX: "auto",
+  overflowY: "hidden"
+}, e.scrollableY && {
+  overflowY: "auto",
+  overflowX: "hidden"
+})), Zt = X("div", {
+  name: "MuiTabs",
+  slot: "FlexContainer",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: n
+    } = e;
+    return [t.flexContainer, n.vertical && t.flexContainerVertical, n.centered && t.centered];
+  }
+})(({
+  ownerState: e
+}) => u({
+  display: "flex"
+}, e.vertical && {
+  flexDirection: "column"
+}, e.centered && {
+  justifyContent: "center"
+})), Gt = X("span", {
+  name: "MuiTabs",
+  slot: "Indicator",
+  overridesResolver: (e, t) => t.indicator
+})(({
+  ownerState: e,
+  theme: t
+}) => u({
+  position: "absolute",
+  height: 2,
+  bottom: 0,
+  width: "100%",
+  transition: t.transitions.create()
+}, e.indicatorColor === "primary" && {
+  backgroundColor: (t.vars || t).palette.primary.main
+}, e.indicatorColor === "secondary" && {
+  backgroundColor: (t.vars || t).palette.secondary.main
+}, e.vertical && {
+  height: "100%",
+  width: 2,
+  right: 0
+})), Jt = X(je)({
+  overflowX: "auto",
+  overflowY: "hidden",
+  // Hide dimensionless scrollbar on macOS
+  scrollbarWidth: "none",
+  // Firefox
+  "&::-webkit-scrollbar": {
+    display: "none"
+    // Safari + Chrome
+  }
+}), We = {};
+let ze = !1;
+const Ue = /* @__PURE__ */ f.forwardRef(function(t, n) {
+  const s = $e({
+    props: t,
+    name: "MuiTabs"
+  }), a = _e(), i = a.direction === "rtl", {
+    "aria-label": v,
+    "aria-labelledby": b,
+    action: p,
+    centered: h = !1,
+    children: g,
+    className: x,
+    component: S = "div",
+    allowScrollButtonsMobile: y = !1,
+    indicatorColor: R = "primary",
+    onChange: B,
+    orientation: C = "horizontal",
+    ScrollButtonComponent: H = jt,
+    scrollButtons: w = "auto",
+    selectionFollowsFocus: ie,
+    slots: j = {},
+    slotProps: Y = {},
+    TabIndicatorProps: V = {},
+    TabScrollButtonProps: F = {},
+    textColor: ee = "primary",
+    value: z,
+    variant: M = "standard",
+    visibleScrollbar: ce = !1
+  } = s, Xe = Q(s, Xt), E = M === "scrollable", I = C === "vertical", K = I ? "scrollTop" : "scrollLeft", te = I ? "top" : "left", oe = I ? "bottom" : "right", de = I ? "clientHeight" : "clientWidth", q = I ? "height" : "width", L = u({}, s, {
+    component: S,
+    allowScrollButtonsMobile: y,
+    indicatorColor: R,
+    orientation: C,
+    vertical: I,
+    scrollButtons: w,
+    textColor: ee,
+    variant: M,
+    visibleScrollbar: ce,
+    fixed: !E,
+    hideScrollbar: E && !ce,
+    scrollableX: E && !I,
+    scrollableY: E && I,
+    centered: h && !E,
+    scrollButtonsHideMobile: !y
+  }), k = Yt(L), Ye = ae({
+    elementType: j.StartScrollButtonIcon,
+    externalSlotProps: Y.startScrollButtonIcon,
+    ownerState: L
+  }), Ke = ae({
+    elementType: j.EndScrollButtonIcon,
+    externalSlotProps: Y.endScrollButtonIcon,
+    ownerState: L
+  });
+  process.env.NODE_ENV !== "production" && h && E && console.error('MUI: You can not use the `centered={true}` and `variant="scrollable"` properties at the same time on a `Tabs` component.');
+  const [ye, qe] = f.useState(!1), [A, ge] = f.useState(We), [Te, Ze] = f.useState(!1), [xe, Ge] = f.useState(!1), [Be, Je] = f.useState(!1), [Ce, Qe] = f.useState({
+    overflow: "hidden",
+    scrollbarWidth: 0
+  }), ne = /* @__PURE__ */ new Map(), W = f.useRef(null), D = f.useRef(null), we = () => {
+    const l = W.current;
+    let r;
+    if (l) {
+      const d = l.getBoundingClientRect();
+      r = {
+        clientWidth: l.clientWidth,
+        scrollLeft: l.scrollLeft,
+        scrollTop: l.scrollTop,
+        scrollLeftNormalized: yt(l, a.direction),
+        scrollWidth: l.scrollWidth,
+        top: d.top,
+        bottom: d.bottom,
+        left: d.left,
+        right: d.right
+      };
+    }
+    let c;
+    if (l && z !== !1) {
+      const d = D.current.children;
+      if (d.length > 0) {
+        const m = d[ne.get(z)];
+        process.env.NODE_ENV !== "production" && (m || console.error(["MUI: The `value` provided to the Tabs component is invalid.", `None of the Tabs' children match with "${z}".`, ne.keys ? `You can provide one of the following values: ${Array.from(ne.keys()).join(", ")}.` : null].join(`
+`))), c = m ? m.getBoundingClientRect() : null, process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "test" && !ze && c && c.width === 0 && c.height === 0 && // if the whole Tabs component is hidden, don't warn
+        r.clientWidth !== 0 && (r = null, console.error(["MUI: The `value` provided to the Tabs component is invalid.", `The Tab with this \`value\` ("${z}") is not part of the document layout.`, "Make sure the tab item is present in the document or that it's not `display: none`."].join(`
+`)), ze = !0);
+      }
+    }
+    return {
+      tabsMeta: r,
+      tabMeta: c
+    };
+  }, Z = be(() => {
+    const {
+      tabsMeta: l,
+      tabMeta: r
+    } = we();
+    let c = 0, d;
+    if (I)
+      d = "top", r && l && (c = r.top - l.top + l.scrollTop);
+    else if (d = i ? "right" : "left", r && l) {
+      const T = i ? l.scrollLeftNormalized + l.clientWidth - l.scrollWidth : l.scrollLeft;
+      c = (i ? -1 : 1) * (r[d] - l[d] + T);
+    }
+    const m = {
+      [d]: c,
+      // May be wrong until the font is loaded.
+      [q]: r ? r[q] : 0
+    };
+    if (isNaN(A[d]) || isNaN(A[q]))
+      ge(m);
+    else {
+      const T = Math.abs(A[d] - m[d]), O = Math.abs(A[q] - m[q]);
+      (T >= 1 || O >= 1) && ge(m);
+    }
+  }), ue = (l, {
+    animation: r = !0
+  } = {}) => {
+    r ? Mt(K, W.current, l, {
+      duration: a.transitions.duration.standard
+    }) : W.current[K] = l;
+  }, Ee = (l) => {
+    let r = W.current[K];
+    I ? r += l : (r += l * (i ? -1 : 1), r *= i && De() === "reverse" ? -1 : 1), ue(r);
+  }, Ie = () => {
+    const l = W.current[de];
+    let r = 0;
+    const c = Array.from(D.current.children);
+    for (let d = 0; d < c.length; d += 1) {
+      const m = c[d];
+      if (r + m[de] > l) {
+        d === 0 && (r = l);
+        break;
+      }
+      r += m[de];
+    }
+    return r;
+  }, et = () => {
+    Ee(-1 * Ie());
+  }, tt = () => {
+    Ee(Ie());
+  }, ot = f.useCallback((l) => {
+    Qe({
+      overflow: null,
+      scrollbarWidth: l
+    });
+  }, []), nt = () => {
+    const l = {};
+    l.scrollbarSizeListener = E ? /* @__PURE__ */ N(Jt, {
+      onChange: ot,
+      className: P(k.scrollableX, k.hideScrollbar)
+    }) : null;
+    const c = E && (w === "auto" && (Te || xe) || w === !0);
+    return l.scrollButtonStart = c ? /* @__PURE__ */ N(H, u({
+      slots: {
+        StartScrollButtonIcon: j.StartScrollButtonIcon
+      },
+      slotProps: {
+        startScrollButtonIcon: Ye
+      },
+      orientation: C,
+      direction: i ? "right" : "left",
+      onClick: et,
+      disabled: !Te
+    }, F, {
+      className: P(k.scrollButtons, F.className)
+    })) : null, l.scrollButtonEnd = c ? /* @__PURE__ */ N(H, u({
+      slots: {
+        EndScrollButtonIcon: j.EndScrollButtonIcon
+      },
+      slotProps: {
+        endScrollButtonIcon: Ke
+      },
+      orientation: C,
+      direction: i ? "left" : "right",
+      onClick: tt,
+      disabled: !xe
+    }, F, {
+      className: P(k.scrollButtons, F.className)
+    })) : null, l;
+  }, Ne = be((l) => {
+    const {
+      tabsMeta: r,
+      tabMeta: c
+    } = we();
+    if (!(!c || !r)) {
+      if (c[te] < r[te]) {
+        const d = r[K] + (c[te] - r[te]);
+        ue(d, {
+          animation: l
+        });
+      } else if (c[oe] > r[oe]) {
+        const d = r[K] + (c[oe] - r[oe]);
+        ue(d, {
+          animation: l
+        });
+      }
+    }
+  }), le = be(() => {
+    E && w !== !1 && Je(!Be);
+  });
+  f.useEffect(() => {
+    const l = Fe(() => {
+      W.current && Z();
+    });
+    let r;
+    const c = (T) => {
+      T.forEach((O) => {
+        O.removedNodes.forEach((G) => {
+          var $;
+          ($ = r) == null || $.unobserve(G);
+        }), O.addedNodes.forEach((G) => {
+          var $;
+          ($ = r) == null || $.observe(G);
+        });
+      }), l(), le();
+    }, d = Le(W.current);
+    d.addEventListener("resize", l);
+    let m;
+    return typeof ResizeObserver < "u" && (r = new ResizeObserver(l), Array.from(D.current.children).forEach((T) => {
+      r.observe(T);
+    })), typeof MutationObserver < "u" && (m = new MutationObserver(c), m.observe(D.current, {
+      childList: !0
+    })), () => {
+      var T, O;
+      l.clear(), d.removeEventListener("resize", l), (T = m) == null || T.disconnect(), (O = r) == null || O.disconnect();
+    };
+  }, [Z, le]), f.useEffect(() => {
+    const l = Array.from(D.current.children), r = l.length;
+    if (typeof IntersectionObserver < "u" && r > 0 && E && w !== !1) {
+      const c = l[0], d = l[r - 1], m = {
+        root: W.current,
+        threshold: 0.99
+      }, T = (pe) => {
+        Ze(!pe[0].isIntersecting);
+      }, O = new IntersectionObserver(T, m);
+      O.observe(c);
+      const G = (pe) => {
+        Ge(!pe[0].isIntersecting);
+      }, $ = new IntersectionObserver(G, m);
+      return $.observe(d), () => {
+        O.disconnect(), $.disconnect();
+      };
+    }
+  }, [E, w, Be, g == null ? void 0 : g.length]), f.useEffect(() => {
+    qe(!0);
+  }, []), f.useEffect(() => {
+    Z();
+  }), f.useEffect(() => {
+    Ne(We !== A);
+  }, [Ne, A]), f.useImperativeHandle(p, () => ({
+    updateIndicator: Z,
+    updateScrollButtons: le
+  }), [Z, le]);
+  const Oe = /* @__PURE__ */ N(Gt, u({}, V, {
+    className: P(k.indicator, V.className),
+    ownerState: L,
+    style: u({}, A, V.style)
+  }));
+  let re = 0;
+  const lt = f.Children.map(g, (l) => {
+    if (!/* @__PURE__ */ f.isValidElement(l))
+      return null;
+    process.env.NODE_ENV !== "production" && ct.isFragment(l) && console.error(["MUI: The Tabs component doesn't accept a Fragment as a child.", "Consider providing an array instead."].join(`
+`));
+    const r = l.props.value === void 0 ? re : l.props.value;
+    ne.set(r, re);
+    const c = r === z;
+    return re += 1, /* @__PURE__ */ f.cloneElement(l, u({
+      fullWidth: M === "fullWidth",
+      indicator: c && !ye && Oe,
+      selected: c,
+      selectionFollowsFocus: ie,
+      onChange: B,
+      textColor: ee,
+      value: r
+    }, re === 1 && z === !1 && !l.props.tabIndex ? {
+      tabIndex: 0
+    } : {}));
+  }), rt = (l) => {
+    const r = D.current, c = mt(r).activeElement;
+    if (c.getAttribute("role") !== "tab")
+      return;
+    let m = C === "horizontal" ? "ArrowLeft" : "ArrowUp", T = C === "horizontal" ? "ArrowRight" : "ArrowDown";
+    switch (C === "horizontal" && i && (m = "ArrowRight", T = "ArrowLeft"), l.key) {
+      case m:
+        l.preventDefault(), se(r, c, Me);
+        break;
+      case T:
+        l.preventDefault(), se(r, c, Re);
+        break;
+      case "Home":
+        l.preventDefault(), se(r, null, Re);
+        break;
+      case "End":
+        l.preventDefault(), se(r, null, Me);
+        break;
+    }
+  }, fe = nt();
+  return /* @__PURE__ */ J(Kt, u({
+    className: P(k.root, x),
+    ownerState: L,
+    ref: n,
+    as: S
+  }, Xe, {
+    children: [fe.scrollButtonStart, fe.scrollbarSizeListener, /* @__PURE__ */ J(qt, {
+      className: k.scroller,
+      ownerState: L,
+      style: {
+        overflow: Ce.overflow,
+        [I ? `margin${i ? "Left" : "Right"}` : "marginBottom"]: ce ? void 0 : -Ce.scrollbarWidth
+      },
+      ref: W,
+      children: [/* @__PURE__ */ N(Zt, {
+        "aria-label": v,
+        "aria-labelledby": b,
+        "aria-orientation": C === "vertical" ? "vertical" : null,
+        className: k.flexContainer,
+        ownerState: L,
+        onKeyDown: rt,
+        ref: D,
+        role: "tablist",
+        children: lt
+      }), ye && Oe]
+    }), fe.scrollButtonEnd]
+  }));
+});
+process.env.NODE_ENV !== "production" && (Ue.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Callback fired when the component mounts.
+   * This is useful when you want to trigger an action programmatically.
+   * It supports two actions: `updateIndicator()` and `updateScrollButtons()`
+   *
+   * @param {object} actions This object contains all possible actions
+   * that can be triggered programmatically.
+   */
+  action: vt,
+  /**
+   * If `true`, the scroll buttons aren't forced hidden on mobile.
+   * By default the scroll buttons are hidden on mobile and takes precedence over `scrollButtons`.
+   * @default false
+   */
+  allowScrollButtonsMobile: o.bool,
+  /**
+   * The label for the Tabs as a string.
+   */
+  "aria-label": o.string,
+  /**
+   * An id or list of ids separated by a space that label the Tabs.
+   */
+  "aria-labelledby": o.string,
+  /**
+   * If `true`, the tabs are centered.
+   * This prop is intended for large views.
+   * @default false
+   */
+  centered: 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: o.elementType,
+  /**
+   * Determines the color of the indicator.
+   * @default 'primary'
+   */
+  indicatorColor: o.oneOfType([o.oneOf(["primary", "secondary"]), o.string]),
+  /**
+   * Callback fired when the value changes.
+   *
+   * @param {React.SyntheticEvent} event The event source of the callback. **Warning**: This is a generic event not a change event.
+   * @param {any} value We default to the index of the child (number)
+   */
+  onChange: o.func,
+  /**
+   * The component orientation (layout flow direction).
+   * @default 'horizontal'
+   */
+  orientation: o.oneOf(["horizontal", "vertical"]),
+  /**
+   * The component used to render the scroll buttons.
+   * @default TabScrollButton
+   */
+  ScrollButtonComponent: o.elementType,
+  /**
+   * Determine behavior of scroll buttons when tabs are set to scroll:
+   *
+   * - `auto` will only present them when not all the items are visible.
+   * - `true` will always present them.
+   * - `false` will never present them.
+   *
+   * By default the scroll buttons are hidden on mobile.
+   * This behavior can be disabled with `allowScrollButtonsMobile`.
+   * @default 'auto'
+   */
+  scrollButtons: o.oneOf(["auto", !1, !0]),
+  /**
+   * If `true` the selected tab changes on focus. Otherwise it only
+   * changes on activation.
+   */
+  selectionFollowsFocus: o.bool,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   * @default {}
+   */
+  slotProps: o.shape({
+    endScrollButtonIcon: o.oneOfType([o.func, o.object]),
+    startScrollButtonIcon: o.oneOfType([o.func, o.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: o.shape({
+    EndScrollButtonIcon: o.elementType,
+    StartScrollButtonIcon: o.elementType
+  }),
+  /**
+   * 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]),
+  /**
+   * Props applied to the tab indicator element.
+   * @default  {}
+   */
+  TabIndicatorProps: o.object,
+  /**
+   * Props applied to the [`TabScrollButton`](/material-ui/api/tab-scroll-button/) element.
+   * @default {}
+   */
+  TabScrollButtonProps: o.object,
+  /**
+   * Determines the color of the `Tab`.
+   * @default 'primary'
+   */
+  textColor: o.oneOf(["inherit", "primary", "secondary"]),
+  /**
+   * The value of the currently selected `Tab`.
+   * If you don't want any selected `Tab`, you can set this prop to `false`.
+   */
+  value: o.any,
+  /**
+   * Determines additional display behavior of the tabs:
+   *
+   *  - `scrollable` will invoke scrolling properties and allow for horizontally
+   *  scrolling (or swiping) of the tab bar.
+   *  - `fullWidth` will make the tabs grow to use all the available space,
+   *  which should be used for small views, like on mobile.
+   *  - `standard` will render the default state.
+   * @default 'standard'
+   */
+  variant: o.oneOf(["fullWidth", "scrollable", "standard"]),
+  /**
+   * If `true`, the scrollbar is visible. It can be useful when displaying
+   * a long vertical list of tabs.
+   * @default false
+   */
+  visibleScrollbar: o.bool
+});
+const bo = Ue;
+export {
+  po as T,
+  bo as a,
+  yt as b,
+  ae as c,
+  De as d,
+  It as e,
+  he as f,
+  gt as g,
+  wt as i,
+  Nt as r,
+  _ as t,
+  _e as u
+};