@cgi-learning-hub/ui 1.5.0 → 1.5.1-dev.1744639457

package/dist/{Switch-Bn8zlIOf.js → Switch-CNfK1N1c.js}

@@ -1,43 +1,43 @@
-import * as k from "react";
-import { G as S, H as y, I as $, n as v, s as C, q as x, P as a } from "./generateUtilityClasses-CqzQXpT_.js";
-import { c as z } from "./createSimplePaletteValueFilter-B7--0ryQ.js";
-import { S as O } from "./SwitchBase-QwOXoy8f.js";
-import { m as l } from "./memoTheme-B0xVysYu.js";
-import { jsxs as T, jsx as w } from "react/jsx-runtime";
-import { u as R, s as d, c as B } from "./DefaultPropsProvider-CXfMJdg8.js";
-import { c as r } from "./capitalize-Bs7Xs33U.js";
-import { r as j } from "./refType-BvSJNaoq.js";
-function M(t) {
-  return y("MuiSwitch", t);
+import * as P from "react";
+import { F as R, G as j, H as M, K as n, n as S, s as N, q as D, P as e } from "./identifier-BJqC6EXa.js";
+import { c as I } from "./createSimplePaletteValueFilter-B7--0ryQ.js";
+import { S as U } from "./SwitchBase-BHC3uchj.js";
+import { m as d } from "./memoTheme-D_Qap2ZW.js";
+import { u as y } from "./useSlot-DhC6EPU2.js";
+import { jsx as v, jsxs as E } from "react/jsx-runtime";
+import { u as F, s as u, c as q } from "./DefaultPropsProvider-Bg-6nX-u.js";
+import { r as A } from "./refType-DRBJ18fO.js";
+function V(t) {
+  return j("MuiSwitch", t);
 }
-const o = S("MuiSwitch", ["root", "edgeStart", "edgeEnd", "switchBase", "colorPrimary", "colorSecondary", "sizeSmall", "sizeMedium", "checked", "disabled", "input", "thumb", "track"]), N = (t) => {
+const a = R("MuiSwitch", ["root", "edgeStart", "edgeEnd", "switchBase", "colorPrimary", "colorSecondary", "sizeSmall", "sizeMedium", "checked", "disabled", "input", "thumb", "track"]), X = (t) => {
   const {
-    classes: e,
+    classes: o,
     edge: s,
-    size: c,
-    color: p,
-    checked: u,
-    disabled: g
-  } = t, h = {
-    root: ["root", s && `edge${r(s)}`, `size${r(c)}`],
-    switchBase: ["switchBase", `color${r(p)}`, u && "checked", g && "disabled"],
+    size: p,
+    color: h,
+    checked: f,
+    disabled: b
+  } = t, g = {
+    root: ["root", s && `edge${n(s)}`, `size${n(p)}`],
+    switchBase: ["switchBase", `color${n(h)}`, f && "checked", b && "disabled"],
     thumb: ["thumb"],
     track: ["track"],
     input: ["input"]
-  }, b = B(h, M, e);
+  }, w = q(g, V, o);
   return {
-    ...e,
+    ...o,
     // forward the disabled and checked classes to the SwitchBase
-    ...b
+    ...w
   };
-}, I = d("span", {
+}, G = u("span", {
   name: "MuiSwitch",
   slot: "Root",
-  overridesResolver: (t, e) => {
+  overridesResolver: (t, o) => {
     const {
       ownerState: s
     } = t;
-    return [e.root, s.edge && e[`edge${r(s.edge)}`], e[`size${r(s.size)}`]];
+    return [o.root, s.edge && o[`edge${n(s.edge)}`], o[`size${n(s.size)}`]];
   }
 })({
   display: "inline-flex",
@@ -77,30 +77,30 @@ const o = S("MuiSwitch", ["root", "edgeStart", "edgeEnd", "switchBase", "colorPr
       width: 40,
       height: 24,
       padding: 7,
-      [`& .${o.thumb}`]: {
+      [`& .${a.thumb}`]: {
         width: 16,
         height: 16
       },
-      [`& .${o.switchBase}`]: {
+      [`& .${a.switchBase}`]: {
         padding: 4,
-        [`&.${o.checked}`]: {
+        [`&.${a.checked}`]: {
           transform: "translateX(16px)"
         }
       }
     }
   }]
-}), P = d(O, {
+}), H = u(U, {
   name: "MuiSwitch",
   slot: "SwitchBase",
-  overridesResolver: (t, e) => {
+  overridesResolver: (t, o) => {
     const {
       ownerState: s
     } = t;
-    return [e.switchBase, {
-      [`& .${o.input}`]: e.input
-    }, s.color !== "default" && e[`color${r(s.color)}`]];
+    return [o.switchBase, {
+      [`& .${a.input}`]: o.input
+    }, s.color !== "default" && o[`color${n(s.color)}`]];
   }
-})(l(({
+})(d(({
   theme: t
 }) => ({
   position: "absolute",
@@ -112,59 +112,59 @@ const o = S("MuiSwitch", ["root", "edgeStart", "edgeEnd", "switchBase", "colorPr
   transition: t.transitions.create(["left", "transform"], {
     duration: t.transitions.duration.shortest
   }),
-  [`&.${o.checked}`]: {
+  [`&.${a.checked}`]: {
     transform: "translateX(20px)"
   },
-  [`&.${o.disabled}`]: {
+  [`&.${a.disabled}`]: {
     color: t.vars ? t.vars.palette.Switch.defaultDisabledColor : `${t.palette.mode === "light" ? t.palette.grey[100] : t.palette.grey[600]}`
   },
-  [`&.${o.checked} + .${o.track}`]: {
+  [`&.${a.checked} + .${a.track}`]: {
     opacity: 0.5
   },
-  [`&.${o.disabled} + .${o.track}`]: {
+  [`&.${a.disabled} + .${a.track}`]: {
     opacity: t.vars ? t.vars.opacity.switchTrackDisabled : `${t.palette.mode === "light" ? 0.12 : 0.2}`
   },
-  [`& .${o.input}`]: {
+  [`& .${a.input}`]: {
     left: "-100%",
     width: "300%"
   }
-})), l(({
+})), d(({
   theme: t
 }) => ({
   "&:hover": {
-    backgroundColor: t.vars ? `rgba(${t.vars.palette.action.activeChannel} / ${t.vars.palette.action.hoverOpacity})` : v(t.palette.action.active, t.palette.action.hoverOpacity),
+    backgroundColor: t.vars ? `rgba(${t.vars.palette.action.activeChannel} / ${t.vars.palette.action.hoverOpacity})` : S(t.palette.action.active, t.palette.action.hoverOpacity),
     // Reset on touch devices, it doesn't add specificity
     "@media (hover: none)": {
       backgroundColor: "transparent"
     }
   },
-  variants: [...Object.entries(t.palette).filter(z(["light"])).map(([e]) => ({
+  variants: [...Object.entries(t.palette).filter(I(["light"])).map(([o]) => ({
     props: {
-      color: e
+      color: o
     },
     style: {
-      [`&.${o.checked}`]: {
-        color: (t.vars || t).palette[e].main,
+      [`&.${a.checked}`]: {
+        color: (t.vars || t).palette[o].main,
         "&:hover": {
-          backgroundColor: t.vars ? `rgba(${t.vars.palette[e].mainChannel} / ${t.vars.palette.action.hoverOpacity})` : v(t.palette[e].main, t.palette.action.hoverOpacity),
+          backgroundColor: t.vars ? `rgba(${t.vars.palette[o].mainChannel} / ${t.vars.palette.action.hoverOpacity})` : S(t.palette[o].main, t.palette.action.hoverOpacity),
           "@media (hover: none)": {
             backgroundColor: "transparent"
           }
         },
-        [`&.${o.disabled}`]: {
-          color: t.vars ? t.vars.palette.Switch[`${e}DisabledColor`] : `${t.palette.mode === "light" ? C(t.palette[e].main, 0.62) : x(t.palette[e].main, 0.55)}`
+        [`&.${a.disabled}`]: {
+          color: t.vars ? t.vars.palette.Switch[`${o}DisabledColor`] : `${t.palette.mode === "light" ? N(t.palette[o].main, 0.62) : D(t.palette[o].main, 0.55)}`
         }
       },
-      [`&.${o.checked} + .${o.track}`]: {
-        backgroundColor: (t.vars || t).palette[e].main
+      [`&.${a.checked} + .${a.track}`]: {
+        backgroundColor: (t.vars || t).palette[o].main
       }
     }
   }))]
-}))), D = d("span", {
+}))), K = u("span", {
   name: "MuiSwitch",
   slot: "Track",
-  overridesResolver: (t, e) => e.track
-})(l(({
+  overridesResolver: (t, o) => o.track
+})(d(({
   theme: t
 }) => ({
   height: "100%",
@@ -176,11 +176,11 @@ const o = S("MuiSwitch", ["root", "edgeStart", "edgeEnd", "switchBase", "colorPr
   }),
   backgroundColor: t.vars ? t.vars.palette.common.onBackground : `${t.palette.mode === "light" ? t.palette.common.black : t.palette.common.white}`,
   opacity: t.vars ? t.vars.opacity.switchTrack : `${t.palette.mode === "light" ? 0.38 : 0.3}`
-}))), U = d("span", {
+}))), L = u("span", {
   name: "MuiSwitch",
   slot: "Thumb",
-  overridesResolver: (t, e) => e.thumb
-})(l(({
+  overridesResolver: (t, o) => o.thumb
+})(d(({
   theme: t
 }) => ({
   boxShadow: (t.vars || t).shadows[1],
@@ -188,48 +188,83 @@ const o = S("MuiSwitch", ["root", "edgeStart", "edgeEnd", "switchBase", "colorPr
   width: 20,
   height: 20,
   borderRadius: "50%"
-}))), E = /* @__PURE__ */ k.forwardRef(function(e, s) {
-  const c = R({
-    props: e,
+}))), _ = /* @__PURE__ */ P.forwardRef(function(o, s) {
+  const p = F({
+    props: o,
     name: "MuiSwitch"
   }), {
-    className: p,
-    color: u = "primary",
-    edge: g = !1,
-    size: h = "medium",
-    sx: b,
-    ...m
-  } = c, i = {
-    ...c,
-    color: u,
-    edge: g,
-    size: h
-  }, n = N(i), f = /* @__PURE__ */ w(U, {
-    className: n.thumb,
+    className: h,
+    color: f = "primary",
+    edge: b = !1,
+    size: g = "medium",
+    sx: w,
+    slots: c = {},
+    slotProps: r = {},
+    ...$
+  } = p, i = {
+    ...p,
+    color: f,
+    edge: b,
+    size: g
+  }, l = X(i), m = {
+    slots: c,
+    slotProps: r
+  }, [T, C] = y("root", {
+    className: M(l.root, h),
+    elementType: G,
+    externalForwardedProps: m,
+    ownerState: i,
+    additionalProps: {
+      sx: w
+    }
+  }), [x, O] = y("thumb", {
+    className: l.thumb,
+    elementType: L,
+    externalForwardedProps: m,
+    ownerState: i
+  }), k = /* @__PURE__ */ v(x, {
+    ...O
+  }), [B, z] = y("track", {
+    className: l.track,
+    elementType: K,
+    externalForwardedProps: m,
     ownerState: i
   });
-  return /* @__PURE__ */ T(I, {
-    className: $(n.root, p),
-    sx: b,
-    ownerState: i,
-    children: [/* @__PURE__ */ w(P, {
+  return /* @__PURE__ */ E(T, {
+    ...C,
+    children: [/* @__PURE__ */ v(H, {
       type: "checkbox",
-      icon: f,
-      checkedIcon: f,
+      icon: k,
+      checkedIcon: k,
       ref: s,
       ownerState: i,
-      ...m,
+      ...$,
       classes: {
-        ...n,
-        root: n.switchBase
+        ...l,
+        root: l.switchBase
+      },
+      slots: {
+        ...c.switchBase && {
+          root: c.switchBase
+        },
+        ...c.input && {
+          input: c.input
+        }
+      },
+      slotProps: {
+        ...r.switchBase && {
+          root: typeof r.switchBase == "function" ? r.switchBase(i) : r.switchBase
+        },
+        ...r.input && {
+          input: typeof r.input == "function" ? r.input(i) : r.input
+        }
       }
-    }), /* @__PURE__ */ w(D, {
-      className: n.track,
-      ownerState: i
+    }), /* @__PURE__ */ v(B, {
+      ...z
     })]
   });
 });
-process.env.NODE_ENV !== "production" && (E.propTypes = {
+process.env.NODE_ENV !== "production" && (_.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -237,39 +272,39 @@ process.env.NODE_ENV !== "production" && (E.propTypes = {
   /**
    * If `true`, the component is checked.
    */
-  checked: a.bool,
+  checked: e.bool,
   /**
    * The icon to display when the component is checked.
    */
-  checkedIcon: a.node,
+  checkedIcon: e.node,
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: a.object,
+  classes: e.object,
   /**
    * @ignore
    */
-  className: a.string,
+  className: e.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: a.oneOfType([a.oneOf(["default", "primary", "secondary", "error", "info", "success", "warning"]), a.string]),
+  color: e.oneOfType([e.oneOf(["default", "primary", "secondary", "error", "info", "success", "warning"]), e.string]),
   /**
    * The default checked state. Use when the component is not controlled.
    */
-  defaultChecked: a.bool,
+  defaultChecked: e.bool,
   /**
    * If `true`, the component is disabled.
    */
-  disabled: a.bool,
+  disabled: e.bool,
   /**
    * If `true`, the ripple effect is disabled.
    * @default false
    */
-  disableRipple: a.bool,
+  disableRipple: e.bool,
   /**
    * If given, uses a negative margin to counteract the padding on one
    * side (this is often helpful for aligning the left or right
@@ -277,23 +312,25 @@ process.env.NODE_ENV !== "production" && (E.propTypes = {
    * size and shape).
    * @default false
    */
-  edge: a.oneOf(["end", "start", !1]),
+  edge: e.oneOf(["end", "start", !1]),
   /**
    * The icon to display when the component is unchecked.
    */
-  icon: a.node,
+  icon: e.node,
   /**
    * The id of the `input` element.
    */
-  id: a.string,
+  id: e.string,
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   * @deprecated Use `slotProps.input` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
-  inputProps: a.object,
+  inputProps: e.object,
   /**
    * Pass a ref to the `input` element.
+   * @deprecated Use `slotProps.input.ref` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
-  inputRef: j,
+  inputRef: A,
   /**
    * Callback fired when the state is changed.
    *
@@ -301,30 +338,52 @@ process.env.NODE_ENV !== "production" && (E.propTypes = {
    * You can pull out the new value by accessing `event.target.value` (string).
    * You can pull out the new checked state by accessing `event.target.checked` (boolean).
    */
-  onChange: a.func,
+  onChange: e.func,
   /**
    * If `true`, the `input` element is required.
    * @default false
    */
-  required: a.bool,
+  required: e.bool,
   /**
    * The size of the component.
    * `small` is equivalent to the dense switch styling.
    * @default 'medium'
    */
-  size: a.oneOfType([a.oneOf(["medium", "small"]), a.string]),
+  size: e.oneOfType([e.oneOf(["medium", "small"]), e.string]),
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: e.shape({
+    input: e.oneOfType([e.func, e.object]),
+    root: e.oneOfType([e.func, e.object]),
+    switchBase: e.oneOfType([e.func, e.object]),
+    thumb: e.oneOfType([e.func, e.object]),
+    track: e.oneOfType([e.func, e.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: e.shape({
+    input: e.elementType,
+    root: e.elementType,
+    switchBase: e.elementType,
+    thumb: e.elementType,
+    track: e.elementType
+  }),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: a.oneOfType([a.arrayOf(a.oneOfType([a.func, a.object, a.bool])), a.func, a.object]),
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
   /**
    * The value of the component. The DOM API casts this to a string.
    * The browser uses "on" as the default value.
    */
-  value: a.any
+  value: e.any
 });
 export {
-  E as S,
-  M as g,
-  o as s
+  _ as S,
+  V as g,
+  a as s
 };