@notificationapi/react 0.0.37 → 1.0.1

package/dist/assets/PreferenceInput.js

@@ -1,1470 +1,1649 @@
-import { jsx as D, Fragment as re, jsxs as L } from "react/jsx-runtime";
-import { g as ze, a as Pe } from "./channelUtils.js";
-import { F as Ne, u as ge, K as ae, T as Me } from "./index3.js";
-import * as d from "react";
-import Re, { forwardRef as je, useRef as le, useImperativeHandle as De } from "react";
-import { u as Y, W as be, T as Be, a as pe, C as _e, t as Te, b as He, c as We } from "./compact-item.js";
-import { e as fe, f as me, c as _, b as U, a as ve, _ as de } from "./presets.js";
-import { g as ne, m as oe, r as A, u as E, p as Ce, a as W, i as qe, f as Se, D as $e, q as Ve, T as Le } from "./reactNode.js";
-import { p as Ae } from "./pickAttrs.js";
-const ye = /* @__PURE__ */ d.createContext(null), Ge = ye.Provider, xe = /* @__PURE__ */ d.createContext(null), Fe = xe.Provider;
-var Xe = ["prefixCls", "className", "style", "checked", "disabled", "defaultChecked", "type", "title", "onChange"], Ke = /* @__PURE__ */ je(function(e, n) {
-  var i = e.prefixCls, t = i === void 0 ? "rc-checkbox" : i, o = e.className, s = e.style, a = e.checked, r = e.disabled, l = e.defaultChecked, c = l === void 0 ? !1 : l, g = e.type, u = g === void 0 ? "checkbox" : g, S = e.title, m = e.onChange, w = fe(e, Xe), y = le(null), b = le(null), k = Y(c, {
-    value: a
-  }), f = me(k, 2), v = f[0], x = f[1];
-  De(n, function() {
-    return {
-      focus: function(h) {
-        var $;
-        ($ = y.current) === null || $ === void 0 || $.focus(h);
-      },
-      blur: function() {
-        var h;
-        (h = y.current) === null || h === void 0 || h.blur();
-      },
-      input: y.current,
-      nativeElement: b.current
-    };
+import { jsx as d, jsxs as P, Fragment as ie } from "react/jsx-runtime";
+import { g as Oe, a as xe } from "./channelUtils.js";
+import { e as Te, T as _ } from "./Typography.js";
+import * as m from "react";
+import { y as Pe, w as $e, P as o, j as Ne, z as le, A as Q, B as Fe, D as Be, E as je, c as I, f as M, a as D, F as ce, g as G, s as v, v as oe, h as w, m as z, u as A, b as W, t as Ie, r as ze } from "./DefaultPropsProvider.js";
+import { c as Y } from "./createSimplePaletteValueFilter.js";
+import { B as Ee, r as H, u as Me } from "./ButtonBase.js";
+import { u as he, a as De, D as Ve } from "./Divider.js";
+import { u as Ge } from "./resolveComponentProps.js";
+import { u as Le } from "./useTheme2.js";
+import { c as be } from "./createSvgIcon.js";
+const qe = Pe();
+function Ue(e) {
+  const {
+    theme: t,
+    name: r,
+    props: n
+  } = e;
+  return !t || !t.components || !t.components[r] || !t.components[r].defaultProps ? n : $e(t.components[r].defaultProps, n);
+}
+function _e({
+  props: e,
+  name: t,
+  defaultTheme: r,
+  themeId: n
+}) {
+  let s = Le(r);
+  return n && (s = s[n] || s), Ue({
+    theme: s,
+    name: t,
+    props: e
   });
-  var I = _(t, o, U(U({}, "".concat(t, "-checked"), v), "".concat(t, "-disabled"), r)), p = function(h) {
-    r || ("checked" in e || x(h.target.checked), m == null || m({
-      target: de(de({}, e), {}, {
-        type: u,
-        checked: h.target.checked
-      }),
-      stopPropagation: function() {
-        h.stopPropagation();
-      },
-      preventDefault: function() {
-        h.preventDefault();
-      },
-      nativeEvent: h.nativeEvent
-    }));
-  };
-  return /* @__PURE__ */ d.createElement("span", {
-    className: I,
-    title: S,
-    style: s,
-    ref: b
-  }, /* @__PURE__ */ d.createElement("input", ve({}, w, {
-    className: "".concat(t, "-input"),
-    ref: y,
-    onChange: p,
-    disabled: r,
-    checked: !!v,
-    type: u
-  })), /* @__PURE__ */ d.createElement("span", {
-    className: "".concat(t, "-inner")
-  }));
+}
+function Ae(...e) {
+  return e.reduce((t, r) => r == null ? t : function(...s) {
+    t.apply(this, s), r.apply(this, s);
+  }, () => {
+  });
+}
+const We = Ne(), He = qe("div", {
+  name: "MuiStack",
+  slot: "Root",
+  overridesResolver: (e, t) => t.root
 });
-const Ue = (e) => {
-  const {
-    componentCls: n,
-    antCls: i
-  } = e, t = `${n}-group`;
-  return {
-    [t]: Object.assign(Object.assign({}, A(e)), {
-      display: "inline-block",
-      fontSize: 0,
-      // RTL
-      [`&${t}-rtl`]: {
-        direction: "rtl"
-      },
-      [`&${t}-block`]: {
-        display: "flex"
-      },
-      [`${i}-badge ${i}-badge-count`]: {
-        zIndex: 1
+function Xe(e) {
+  return _e({
+    props: e,
+    name: "MuiStack",
+    defaultTheme: We
+  });
+}
+function Ze(e, t) {
+  const r = m.Children.toArray(e).filter(Boolean);
+  return r.reduce((n, s, i) => (n.push(s), i < r.length - 1 && n.push(/* @__PURE__ */ m.cloneElement(t, {
+    key: `separator-${i}`
+  })), n), []);
+}
+const Je = (e) => ({
+  row: "Left",
+  "row-reverse": "Right",
+  column: "Top",
+  "column-reverse": "Bottom"
+})[e], Ke = ({
+  ownerState: e,
+  theme: t
+}) => {
+  let r = {
+    display: "flex",
+    flexDirection: "column",
+    ...le({
+      theme: t
+    }, Q({
+      values: e.direction,
+      breakpoints: t.breakpoints.values
+    }), (n) => ({
+      flexDirection: n
+    }))
+  };
+  if (e.spacing) {
+    const n = Fe(t), s = Object.keys(t.breakpoints.values).reduce((c, l) => ((typeof e.spacing == "object" && e.spacing[l] != null || typeof e.direction == "object" && e.direction[l] != null) && (c[l] = !0), c), {}), i = Q({
+      values: e.direction,
+      base: s
+    }), p = Q({
+      values: e.spacing,
+      base: s
+    });
+    typeof i == "object" && Object.keys(i).forEach((c, l, u) => {
+      if (!i[c]) {
+        const h = l > 0 ? i[u[l - 1]] : "column";
+        i[c] = h;
+      }
+    }), r = Be(r, le({
+      theme: t
+    }, p, (c, l) => e.useFlexGap ? {
+      gap: ce(n, c)
+    } : {
+      // The useFlexGap={false} implement relies on each child to give up control of the margin.
+      // We need to reset the margin to avoid double spacing.
+      "& > :not(style):not(style)": {
+        margin: 0
       },
-      [`> ${i}-badge:not(:first-child) > ${i}-button-wrapper`]: {
-        borderInlineStart: "none"
+      "& > :not(style) ~ :not(style)": {
+        [`margin${Je(l ? i[l] : e.direction)}`]: ce(n, c)
       }
-    })
-  };
-}, Qe = (e) => {
+    }));
+  }
+  return r = je(t.breakpoints, r), r;
+};
+function Qe(e = {}) {
   const {
-    componentCls: n,
-    wrapperMarginInlineEnd: i,
-    colorPrimary: t,
-    radioSize: o,
-    motionDurationSlow: s,
-    motionDurationMid: a,
-    motionEaseInOutCirc: r,
-    colorBgContainer: l,
-    colorBorder: c,
-    lineWidth: g,
-    colorBgContainerDisabled: u,
-    colorTextDisabled: S,
-    paddingXS: m,
-    dotColorDisabled: w,
-    lineType: y,
-    radioColor: b,
-    radioBgColor: k,
-    calc: f
-  } = e, v = `${n}-inner`, I = f(o).sub(f(4).mul(2)), p = f(1).mul(o).equal({
-    unit: !0
+    // This will allow adding custom styled fn (for example for custom sx style function)
+    createStyledComponent: t = He,
+    useThemeProps: r = Xe,
+    componentName: n = "MuiStack"
+  } = e, s = () => M({
+    root: ["root"]
+  }, (c) => D(n, c), {}), i = t(Ke), p = /* @__PURE__ */ m.forwardRef(function(c, l) {
+    const u = r(c), a = Te(u), {
+      component: h = "div",
+      direction: C = "column",
+      spacing: k = 0,
+      divider: O,
+      children: y,
+      className: x,
+      useFlexGap: b = !1,
+      ...T
+    } = a, S = {
+      direction: C,
+      spacing: k,
+      useFlexGap: b
+    }, B = s();
+    return /* @__PURE__ */ d(i, {
+      as: h,
+      ownerState: S,
+      ref: l,
+      className: I(B.root, x),
+      ...T,
+      children: O ? Ze(y, O) : y
+    });
   });
-  return {
-    [`${n}-wrapper`]: Object.assign(Object.assign({}, A(e)), {
-      display: "inline-flex",
-      alignItems: "baseline",
-      marginInlineStart: 0,
-      marginInlineEnd: i,
-      cursor: "pointer",
-      // RTL
-      [`&${n}-wrapper-rtl`]: {
-        direction: "rtl"
-      },
-      "&-disabled": {
-        cursor: "not-allowed",
-        color: e.colorTextDisabled
-      },
-      "&::after": {
-        display: "inline-block",
-        width: 0,
-        overflow: "hidden",
-        content: '"\\a0"'
-      },
-      "&-block": {
-        flex: 1,
-        justifyContent: "center"
-      },
-      // hashId 在 wrapper 上，只能铺平
-      [`${n}-checked::after`]: {
-        position: "absolute",
-        insetBlockStart: 0,
-        insetInlineStart: 0,
-        width: "100%",
-        height: "100%",
-        border: `${E(g)} ${y} ${t}`,
-        borderRadius: "50%",
-        visibility: "hidden",
-        opacity: 0,
-        content: '""'
-      },
-      [n]: Object.assign(Object.assign({}, A(e)), {
-        position: "relative",
-        display: "inline-block",
-        outline: "none",
-        cursor: "pointer",
-        alignSelf: "center",
-        borderRadius: "50%"
-      }),
-      [`${n}-wrapper:hover &,
-        &:hover ${v}`]: {
-        borderColor: t
-      },
-      [`${n}-input:focus-visible + ${v}`]: Object.assign({}, Ce(e)),
-      [`${n}:hover::after, ${n}-wrapper:hover &::after`]: {
-        visibility: "visible"
-      },
-      [`${n}-inner`]: {
-        "&::after": {
-          boxSizing: "border-box",
-          position: "absolute",
-          insetBlockStart: "50%",
-          insetInlineStart: "50%",
-          display: "block",
-          width: p,
-          height: p,
-          marginBlockStart: f(1).mul(o).div(-2).equal({
-            unit: !0
-          }),
-          marginInlineStart: f(1).mul(o).div(-2).equal({
-            unit: !0
-          }),
-          backgroundColor: b,
-          borderBlockStart: 0,
-          borderInlineStart: 0,
-          borderRadius: p,
-          transform: "scale(0)",
-          opacity: 0,
-          transition: `all ${s} ${r}`,
-          content: '""'
-        },
-        boxSizing: "border-box",
-        position: "relative",
-        insetBlockStart: 0,
-        insetInlineStart: 0,
-        display: "block",
-        width: p,
-        height: p,
-        backgroundColor: l,
-        borderColor: c,
-        borderStyle: "solid",
-        borderWidth: g,
-        borderRadius: "50%",
-        transition: `all ${a}`
-      },
-      [`${n}-input`]: {
-        position: "absolute",
-        inset: 0,
-        zIndex: 1,
-        cursor: "pointer",
-        opacity: 0
-      },
-      // 选中状态
-      [`${n}-checked`]: {
-        [v]: {
-          borderColor: t,
-          backgroundColor: k,
-          "&::after": {
-            transform: `scale(${e.calc(e.dotSize).div(o).equal()})`,
-            opacity: 1,
-            transition: `all ${s} ${r}`
-          }
-        }
-      },
-      [`${n}-disabled`]: {
-        cursor: "not-allowed",
-        [v]: {
-          backgroundColor: u,
-          borderColor: c,
-          cursor: "not-allowed",
-          "&::after": {
-            backgroundColor: w
-          }
-        },
-        [`${n}-input`]: {
-          cursor: "not-allowed"
-        },
-        [`${n}-disabled + span`]: {
-          color: S,
-          cursor: "not-allowed"
-        },
-        [`&${n}-checked`]: {
-          [v]: {
-            "&::after": {
-              transform: `scale(${f(I).div(o).equal()})`
-            }
-          }
-        }
-      },
-      [`span${n} + *`]: {
-        paddingInlineStart: m,
-        paddingInlineEnd: m
-      }
-    })
-  };
-}, Ye = (e) => {
+  return process.env.NODE_ENV !== "production" && (p.propTypes = {
+    children: o.node,
+    direction: o.oneOfType([o.oneOf(["column-reverse", "column", "row-reverse", "row"]), o.arrayOf(o.oneOf(["column-reverse", "column", "row-reverse", "row"])), o.object]),
+    divider: o.node,
+    spacing: o.oneOfType([o.arrayOf(o.oneOfType([o.number, o.string])), o.number, o.object, o.string]),
+    sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
+  }), p;
+}
+function ye({
+  props: e,
+  states: t,
+  muiFormControl: r
+}) {
+  return t.reduce((n, s) => (n[s] = e[s], r && typeof e[s] > "u" && (n[s] = r[s]), n), {});
+}
+const ge = /* @__PURE__ */ m.createContext(void 0);
+process.env.NODE_ENV !== "production" && (ge.displayName = "FormControlContext");
+function X() {
+  return m.useContext(ge);
+}
+function Ye(e) {
+  return D("PrivateSwitchBase", e);
+}
+G("PrivateSwitchBase", ["root", "checked", "disabled", "input", "edgeStart", "edgeEnd"]);
+const eo = (e) => {
   const {
-    buttonColor: n,
-    controlHeight: i,
-    componentCls: t,
-    lineWidth: o,
-    lineType: s,
-    colorBorder: a,
-    motionDurationSlow: r,
-    motionDurationMid: l,
-    buttonPaddingInline: c,
-    fontSize: g,
-    buttonBg: u,
-    fontSizeLG: S,
-    controlHeightLG: m,
-    controlHeightSM: w,
-    paddingXS: y,
-    borderRadius: b,
-    borderRadiusSM: k,
-    borderRadiusLG: f,
-    buttonCheckedBg: v,
-    buttonSolidCheckedColor: x,
-    colorTextDisabled: I,
-    colorBgContainerDisabled: p,
-    buttonCheckedBgDisabled: P,
-    buttonCheckedColorDisabled: h,
-    colorPrimary: $,
-    colorPrimaryHover: z,
-    colorPrimaryActive: C,
-    buttonSolidCheckedBg: R,
-    buttonSolidCheckedHoverBg: N,
-    buttonSolidCheckedActiveBg: j,
-    calc: M
-  } = e;
-  return {
-    [`${t}-button-wrapper`]: {
-      position: "relative",
-      display: "inline-block",
-      height: i,
-      margin: 0,
-      paddingInline: c,
-      paddingBlock: 0,
-      color: n,
-      fontSize: g,
-      lineHeight: E(M(i).sub(M(o).mul(2)).equal()),
-      background: u,
-      border: `${E(o)} ${s} ${a}`,
-      // strange align fix for chrome but works
-      // https://gw.alipayobjects.com/zos/rmsportal/VFTfKXJuogBAXcvfAUWJ.gif
-      borderBlockStartWidth: M(o).add(0.02).equal(),
-      borderInlineStartWidth: 0,
-      borderInlineEndWidth: o,
-      cursor: "pointer",
-      transition: [`color ${l}`, `background ${l}`, `box-shadow ${l}`].join(","),
-      a: {
-        color: n
-      },
-      [`> ${t}-button`]: {
-        position: "absolute",
-        insetBlockStart: 0,
-        insetInlineStart: 0,
-        zIndex: -1,
-        width: "100%",
-        height: "100%"
-      },
-      "&:not(:first-child)": {
-        "&::before": {
-          position: "absolute",
-          insetBlockStart: M(o).mul(-1).equal(),
-          insetInlineStart: M(o).mul(-1).equal(),
-          display: "block",
-          boxSizing: "content-box",
-          width: 1,
-          height: "100%",
-          paddingBlock: o,
-          paddingInline: 0,
-          backgroundColor: a,
-          transition: `background-color ${r}`,
-          content: '""'
-        }
-      },
-      "&:first-child": {
-        borderInlineStart: `${E(o)} ${s} ${a}`,
-        borderStartStartRadius: b,
-        borderEndStartRadius: b
-      },
-      "&:last-child": {
-        borderStartEndRadius: b,
-        borderEndEndRadius: b
-      },
-      "&:first-child:last-child": {
-        borderRadius: b
-      },
-      [`${t}-group-large &`]: {
-        height: m,
-        fontSize: S,
-        lineHeight: E(M(m).sub(M(o).mul(2)).equal()),
-        "&:first-child": {
-          borderStartStartRadius: f,
-          borderEndStartRadius: f
-        },
-        "&:last-child": {
-          borderStartEndRadius: f,
-          borderEndEndRadius: f
-        }
-      },
-      [`${t}-group-small &`]: {
-        height: w,
-        paddingInline: M(y).sub(o).equal(),
-        paddingBlock: 0,
-        lineHeight: E(M(w).sub(M(o).mul(2)).equal()),
-        "&:first-child": {
-          borderStartStartRadius: k,
-          borderEndStartRadius: k
-        },
-        "&:last-child": {
-          borderStartEndRadius: k,
-          borderEndEndRadius: k
-        }
-      },
-      "&:hover": {
-        position: "relative",
-        color: $
-      },
-      "&:has(:focus-visible)": Object.assign({}, Ce(e)),
-      [`${t}-inner, input[type='checkbox'], input[type='radio']`]: {
-        width: 0,
-        height: 0,
-        opacity: 0,
-        pointerEvents: "none"
-      },
-      [`&-checked:not(${t}-button-wrapper-disabled)`]: {
-        zIndex: 1,
-        color: $,
-        background: v,
-        borderColor: $,
-        "&::before": {
-          backgroundColor: $
-        },
-        "&:first-child": {
-          borderColor: $
-        },
-        "&:hover": {
-          color: z,
-          borderColor: z,
-          "&::before": {
-            backgroundColor: z
-          }
-        },
-        "&:active": {
-          color: C,
-          borderColor: C,
-          "&::before": {
-            backgroundColor: C
-          }
-        }
-      },
-      [`${t}-group-solid &-checked:not(${t}-button-wrapper-disabled)`]: {
-        color: x,
-        background: R,
-        borderColor: R,
-        "&:hover": {
-          color: x,
-          background: N,
-          borderColor: N
-        },
-        "&:active": {
-          color: x,
-          background: j,
-          borderColor: j
-        }
-      },
-      "&-disabled": {
-        color: I,
-        backgroundColor: p,
-        borderColor: a,
-        cursor: "not-allowed",
-        "&:first-child, &:hover": {
-          color: I,
-          backgroundColor: p,
-          borderColor: a
-        }
-      },
-      [`&-disabled${t}-button-wrapper-checked`]: {
-        color: h,
-        backgroundColor: P,
-        borderColor: a,
-        boxShadow: "none"
-      },
-      "&-block": {
-        flex: 1,
-        textAlign: "center"
-      }
-    }
+    classes: t,
+    checked: r,
+    disabled: n,
+    edge: s
+  } = e, i = {
+    root: ["root", r && "checked", n && "disabled", s && `edge${w(s)}`],
+    input: ["input"]
   };
-}, Je = (e) => {
+  return M(i, Ye, t);
+}, oo = v(Ee)({
+  padding: 9,
+  borderRadius: "50%",
+  variants: [{
+    props: {
+      edge: "start",
+      size: "small"
+    },
+    style: {
+      marginLeft: -3
+    }
+  }, {
+    props: ({
+      edge: e,
+      ownerState: t
+    }) => e === "start" && t.size !== "small",
+    style: {
+      marginLeft: -12
+    }
+  }, {
+    props: {
+      edge: "end",
+      size: "small"
+    },
+    style: {
+      marginRight: -3
+    }
+  }, {
+    props: ({
+      edge: e,
+      ownerState: t
+    }) => e === "end" && t.size !== "small",
+    style: {
+      marginRight: -12
+    }
+  }]
+}), to = v("input", {
+  shouldForwardProp: oe
+})({
+  cursor: "inherit",
+  position: "absolute",
+  opacity: 0,
+  width: "100%",
+  height: "100%",
+  top: 0,
+  left: 0,
+  margin: 0,
+  padding: 0,
+  zIndex: 1
+}), te = /* @__PURE__ */ m.forwardRef(function(t, r) {
   const {
-    wireframe: n,
-    padding: i,
-    marginXS: t,
-    lineWidth: o,
-    fontSizeLG: s,
-    colorText: a,
-    colorBgContainer: r,
-    colorTextDisabled: l,
-    controlItemBgActiveDisabled: c,
-    colorTextLightSolid: g,
-    colorPrimary: u,
-    colorPrimaryHover: S,
-    colorPrimaryActive: m,
-    colorWhite: w
-  } = e, y = 4, b = s, k = n ? b - y * 2 : b - (y + o) * 2;
-  return {
-    // Radio
-    radioSize: b,
-    dotSize: k,
-    dotColorDisabled: l,
-    // Radio buttons
-    buttonSolidCheckedColor: g,
-    buttonSolidCheckedBg: u,
-    buttonSolidCheckedHoverBg: S,
-    buttonSolidCheckedActiveBg: m,
-    buttonBg: r,
-    buttonCheckedBg: r,
-    buttonColor: a,
-    buttonCheckedBgDisabled: c,
-    buttonCheckedColorDisabled: l,
-    buttonPaddingInline: i - o,
-    wrapperMarginInlineEnd: t,
-    // internal
-    radioColor: n ? u : w,
-    radioBgColor: n ? r : u
+    autoFocus: n,
+    checked: s,
+    checkedIcon: i,
+    className: p,
+    defaultChecked: f,
+    disabled: c,
+    disableFocusRipple: l = !1,
+    edge: u = !1,
+    icon: a,
+    id: h,
+    inputProps: C,
+    inputRef: k,
+    name: O,
+    onBlur: y,
+    onChange: x,
+    onFocus: b,
+    readOnly: T,
+    required: S = !1,
+    tabIndex: B,
+    type: R,
+    value: L,
+    ...Z
+  } = t, [E, q] = he({
+    controlled: s,
+    default: !!f,
+    name: "SwitchBase",
+    state: "checked"
+  }), $ = X(), J = (F) => {
+    b && b(F), $ && $.onFocus && $.onFocus(F);
+  }, V = (F) => {
+    y && y(F), $ && $.onBlur && $.onBlur(F);
+  }, j = (F) => {
+    if (F.nativeEvent.defaultPrevented)
+      return;
+    const ae = F.target.checked;
+    q(ae), x && x(F, ae);
   };
-}, we = ne("Radio", (e) => {
-  const {
-    controlOutline: n,
-    controlOutlineWidth: i
-  } = e, t = `0 0 0 ${E(i)} ${n}`, s = oe(e, {
-    radioFocusShadow: t,
-    radioButtonFocusShadow: t
+  let N = c;
+  $ && typeof N > "u" && (N = $.disabled);
+  const Re = R === "checkbox" || R === "radio", K = {
+    ...t,
+    checked: E,
+    disabled: N,
+    disableFocusRipple: l,
+    edge: u
+  }, se = eo(K);
+  return /* @__PURE__ */ P(oo, {
+    component: "span",
+    className: I(se.root, p),
+    centerRipple: !0,
+    focusRipple: !l,
+    disabled: N,
+    tabIndex: null,
+    role: void 0,
+    onFocus: J,
+    onBlur: V,
+    ownerState: K,
+    ref: r,
+    ...Z,
+    children: [/* @__PURE__ */ d(to, {
+      autoFocus: n,
+      checked: s,
+      defaultChecked: f,
+      className: se.input,
+      disabled: N,
+      id: Re ? h : void 0,
+      name: O,
+      onChange: j,
+      readOnly: T,
+      ref: k,
+      required: S,
+      ownerState: K,
+      tabIndex: B,
+      type: R,
+      ...R === "checkbox" && L === void 0 ? {} : {
+        value: L
+      },
+      ...C
+    }), E ? i : a]
   });
-  return [Ue(s), Qe(s), Ye(s)];
-}, Je, {
-  unitless: {
-    radioSize: !0,
-    dotSize: !0
-  }
 });
-var Ze = function(e, n) {
-  var i = {};
-  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && n.indexOf(t) < 0 && (i[t] = e[t]);
-  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var o = 0, t = Object.getOwnPropertySymbols(e); o < t.length; o++)
-    n.indexOf(t[o]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[o]) && (i[t[o]] = e[t[o]]);
-  return i;
-};
-const et = (e, n) => {
-  var i, t;
-  const o = d.useContext(ye), s = d.useContext(xe), {
-    getPrefixCls: a,
-    direction: r,
-    radio: l
-  } = d.useContext(W), c = d.useRef(null), g = qe(n, c), {
-    isFormItemInput: u
-  } = d.useContext(Ne);
-  if (process.env.NODE_ENV !== "production") {
-    const j = Se("Radio");
-    process.env.NODE_ENV !== "production" && j(!("optionType" in e), "usage", "`optionType` is only support in Radio.Group.");
+process.env.NODE_ENV !== "production" && (te.propTypes = {
+  /**
+   * If `true`, the `input` element is focused during the first mount.
+   */
+  autoFocus: o.bool,
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: o.bool,
+  /**
+   * The icon to display when the component is checked.
+   */
+  checkedIcon: o.node.isRequired,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.string,
+  /**
+   * @ignore
+   */
+  defaultChecked: o.bool,
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: o.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: o.bool,
+  /**
+   * If given, uses a negative margin to counteract the padding on one
+   * side (this is often helpful for aligning the left or right
+   * side of the icon with content above or below, without ruining the border
+   * size and shape).
+   * @default false
+   */
+  edge: o.oneOf(["end", "start", !1]),
+  /**
+   * The icon to display when the component is unchecked.
+   */
+  icon: o.node.isRequired,
+  /**
+   * The id of the `input` element.
+   */
+  id: o.string,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: o.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: H,
+  /*
+   * @ignore
+   */
+  name: o.string,
+  /**
+   * @ignore
+   */
+  onBlur: o.func,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {object} event The event source of the callback.
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: o.func,
+  /**
+   * @ignore
+   */
+  onFocus: o.func,
+  /**
+   * It prevents the user from changing the value of the field
+   * (not from interacting with the field).
+   */
+  readOnly: o.bool,
+  /**
+   * If `true`, the `input` element is required.
+   */
+  required: o.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: o.object,
+  /**
+   * @ignore
+   */
+  tabIndex: o.oneOfType([o.number, o.string]),
+  /**
+   * The input component prop `type`.
+   */
+  type: o.string.isRequired,
+  /**
+   * The value of the component.
+   */
+  value: o.any
+});
+function ro(e) {
+  return D("MuiFormControlLabel", e);
+}
+const U = G("MuiFormControlLabel", ["root", "labelPlacementStart", "labelPlacementTop", "labelPlacementBottom", "disabled", "label", "error", "required", "asterisk"]), no = (e) => {
+  const {
+    classes: t,
+    disabled: r,
+    labelPlacement: n,
+    error: s,
+    required: i
+  } = e, p = {
+    root: ["root", r && "disabled", `labelPlacement${w(n)}`, s && "error", i && "required"],
+    label: ["label", r && "disabled"],
+    asterisk: ["asterisk", s && "error"]
+  };
+  return M(p, ro, t);
+}, so = v("label", {
+  name: "MuiFormControlLabel",
+  slot: "Root",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: r
+    } = e;
+    return [{
+      [`& .${U.label}`]: t.label
+    }, t.root, t[`labelPlacement${w(r.labelPlacement)}`]];
   }
-  const S = (j) => {
-    var M, T;
-    (M = e.onChange) === null || M === void 0 || M.call(e, j), (T = o == null ? void 0 : o.onChange) === null || T === void 0 || T.call(o, j);
+})(z(({
+  theme: e
+}) => ({
+  display: "inline-flex",
+  alignItems: "center",
+  cursor: "pointer",
+  // For correct alignment with the text.
+  verticalAlign: "middle",
+  WebkitTapHighlightColor: "transparent",
+  marginLeft: -11,
+  marginRight: 16,
+  // used for row presentation of radio/checkbox
+  [`&.${U.disabled}`]: {
+    cursor: "default"
+  },
+  [`& .${U.label}`]: {
+    [`&.${U.disabled}`]: {
+      color: (e.vars || e).palette.text.disabled
+    }
+  },
+  variants: [{
+    props: {
+      labelPlacement: "start"
+    },
+    style: {
+      flexDirection: "row-reverse",
+      marginRight: -11
+    }
   }, {
-    prefixCls: m,
-    className: w,
-    rootClassName: y,
-    children: b,
-    style: k,
-    title: f
-  } = e, v = Ze(e, ["prefixCls", "className", "rootClassName", "children", "style", "title"]), x = a("radio", m), I = ((o == null ? void 0 : o.optionType) || s) === "button", p = I ? `${x}-button` : x, P = ge(x), [h, $, z] = we(x, P), C = Object.assign({}, v), R = d.useContext($e);
-  o && (C.name = o.name, C.onChange = S, C.checked = e.value === o.value, C.disabled = (i = C.disabled) !== null && i !== void 0 ? i : o.disabled), C.disabled = (t = C.disabled) !== null && t !== void 0 ? t : R;
-  const N = _(`${p}-wrapper`, {
-    [`${p}-wrapper-checked`]: C.checked,
-    [`${p}-wrapper-disabled`]: C.disabled,
-    [`${p}-wrapper-rtl`]: r === "rtl",
-    [`${p}-wrapper-in-form-item`]: u,
-    [`${p}-wrapper-block`]: !!(o != null && o.block)
-  }, l == null ? void 0 : l.className, w, y, $, z, P);
-  return h(/* @__PURE__ */ d.createElement(be, {
-    component: "Radio",
-    disabled: C.disabled
-  }, /* @__PURE__ */ d.createElement("label", {
-    className: N,
-    style: Object.assign(Object.assign({}, l == null ? void 0 : l.style), k),
-    onMouseEnter: e.onMouseEnter,
-    onMouseLeave: e.onMouseLeave,
-    title: f
-  }, /* @__PURE__ */ d.createElement(Ke, Object.assign({}, C, {
-    className: _(C.className, {
-      [Be]: !I
-    }),
-    type: "radio",
-    prefixCls: p,
-    ref: g
-  })), b !== void 0 ? /* @__PURE__ */ d.createElement("span", null, b) : null)));
-}, G = /* @__PURE__ */ d.forwardRef(et);
-process.env.NODE_ENV !== "production" && (G.displayName = "Radio");
-const tt = /* @__PURE__ */ d.forwardRef((e, n) => {
-  const {
-    getPrefixCls: i,
-    direction: t
-  } = d.useContext(W), {
-    prefixCls: o,
-    className: s,
-    rootClassName: a,
-    options: r,
-    buttonStyle: l = "outline",
-    disabled: c,
-    children: g,
-    size: u,
-    style: S,
-    id: m,
-    optionType: w,
-    name: y,
-    defaultValue: b,
-    value: k,
-    block: f = !1,
-    onChange: v,
-    onMouseEnter: x,
-    onMouseLeave: I,
-    onFocus: p,
-    onBlur: P
-  } = e, [h, $] = Y(b, {
-    value: k
-  }), z = d.useCallback((O) => {
-    const H = h, B = O.target.value;
-    "value" in e || $(B), B !== H && (v == null || v(O));
-  }, [h, $, v]), C = i("radio", o), R = `${C}-group`, N = ge(C), [j, M, T] = we(C, N);
-  let X = g;
-  r && r.length > 0 && (X = r.map((O) => typeof O == "string" || typeof O == "number" ? /* @__PURE__ */ d.createElement(G, {
-    key: O.toString(),
-    prefixCls: C,
-    disabled: c,
-    value: O,
-    checked: h === O
-  }, O) : /* @__PURE__ */ d.createElement(G, {
-    key: `radio-group-value-options-${O.value}`,
-    prefixCls: C,
-    disabled: O.disabled || c,
-    value: O.value,
-    checked: h === O.value,
-    title: O.title,
-    style: O.style,
-    id: O.id,
-    required: O.required
-  }, O.label)));
-  const q = pe(u), V = _(R, `${R}-${l}`, {
-    [`${R}-${q}`]: q,
-    [`${R}-rtl`]: t === "rtl",
-    [`${R}-block`]: f
-  }, s, a, M, T, N), J = d.useMemo(() => ({
-    onChange: z,
-    value: h,
-    disabled: c,
-    name: y,
-    optionType: w,
-    block: f
-  }), [z, h, c, y, w, f]);
-  return j(/* @__PURE__ */ d.createElement("div", Object.assign({}, Ae(e, {
-    aria: !0,
-    data: !0
+    props: {
+      labelPlacement: "top"
+    },
+    style: {
+      flexDirection: "column-reverse"
+    }
+  }, {
+    props: {
+      labelPlacement: "bottom"
+    },
+    style: {
+      flexDirection: "column"
+    }
+  }, {
+    props: ({
+      labelPlacement: t
+    }) => t === "start" || t === "top" || t === "bottom",
+    style: {
+      marginLeft: 16
+      // used for row presentation of radio/checkbox
+    }
+  }]
+}))), ao = v("span", {
+  name: "MuiFormControlLabel",
+  slot: "Asterisk",
+  overridesResolver: (e, t) => t.asterisk
+})(z(({
+  theme: e
+}) => ({
+  [`&.${U.error}`]: {
+    color: (e.vars || e).palette.error.main
+  }
+}))), ve = /* @__PURE__ */ m.forwardRef(function(t, r) {
+  const n = A({
+    props: t,
+    name: "MuiFormControlLabel"
   }), {
-    className: V,
-    style: S,
-    onMouseEnter: x,
-    onMouseLeave: I,
-    onFocus: p,
-    onBlur: P,
-    id: m,
-    ref: n
-  }), /* @__PURE__ */ d.createElement(Ge, {
-    value: J
-  }, X)));
-}), nt = /* @__PURE__ */ d.memo(tt);
-var ot = function(e, n) {
-  var i = {};
-  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && n.indexOf(t) < 0 && (i[t] = e[t]);
-  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var o = 0, t = Object.getOwnPropertySymbols(e); o < t.length; o++)
-    n.indexOf(t[o]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[o]) && (i[t[o]] = e[t[o]]);
-  return i;
-};
-const it = (e, n) => {
-  const {
-    getPrefixCls: i
-  } = d.useContext(W), {
-    prefixCls: t
-  } = e, o = ot(e, ["prefixCls"]), s = i("radio", t);
-  return /* @__PURE__ */ d.createElement(Fe, {
-    value: "button"
-  }, /* @__PURE__ */ d.createElement(G, Object.assign({
-    prefixCls: s
-  }, o, {
-    type: "radio",
-    ref: n
-  })));
-}, rt = /* @__PURE__ */ d.forwardRef(it), F = G;
-F.Button = rt;
-F.Group = nt;
-F.__ANT_RADIO = !0;
-const at = (e) => {
-  const {
-    componentCls: n,
-    sizePaddingEdgeHorizontal: i,
-    colorSplit: t,
-    lineWidth: o,
-    textPaddingInline: s,
-    orientationMargin: a,
-    verticalMarginInline: r
-  } = e;
-  return {
-    [n]: Object.assign(Object.assign({}, A(e)), {
-      borderBlockStart: `${E(o)} solid ${t}`,
-      // vertical
-      "&-vertical": {
-        position: "relative",
-        top: "-0.06em",
-        display: "inline-block",
-        height: "0.9em",
-        marginInline: r,
-        marginBlock: 0,
-        verticalAlign: "middle",
-        borderTop: 0,
-        borderInlineStart: `${E(o)} solid ${t}`
-      },
-      "&-horizontal": {
-        display: "flex",
-        clear: "both",
-        width: "100%",
-        minWidth: "100%",
-        // Fix https://github.com/ant-design/ant-design/issues/10914
-        margin: `${E(e.dividerHorizontalGutterMargin)} 0`
-      },
-      [`&-horizontal${n}-with-text`]: {
-        display: "flex",
-        alignItems: "center",
-        margin: `${E(e.dividerHorizontalWithTextGutterMargin)} 0`,
-        color: e.colorTextHeading,
-        fontWeight: 500,
-        fontSize: e.fontSizeLG,
-        whiteSpace: "nowrap",
-        textAlign: "center",
-        borderBlockStart: `0 ${t}`,
-        "&::before, &::after": {
-          position: "relative",
-          width: "50%",
-          borderBlockStart: `${E(o)} solid transparent`,
-          // Chrome not accept `inherit` in `border-top`
-          borderBlockStartColor: "inherit",
-          borderBlockEnd: 0,
-          transform: "translateY(50%)",
-          content: "''"
-        }
-      },
-      [`&-horizontal${n}-with-text-left`]: {
-        "&::before": {
-          width: `calc(${a} * 100%)`
-        },
-        "&::after": {
-          width: `calc(100% - ${a} * 100%)`
-        }
-      },
-      [`&-horizontal${n}-with-text-right`]: {
-        "&::before": {
-          width: `calc(100% - ${a} * 100%)`
-        },
-        "&::after": {
-          width: `calc(${a} * 100%)`
-        }
-      },
-      [`${n}-inner-text`]: {
-        display: "inline-block",
-        paddingBlock: 0,
-        paddingInline: s
-      },
-      "&-dashed": {
-        background: "none",
-        borderColor: t,
-        borderStyle: "dashed",
-        borderWidth: `${E(o)} 0 0`
-      },
-      [`&-horizontal${n}-with-text${n}-dashed`]: {
-        "&::before, &::after": {
-          borderStyle: "dashed none none"
-        }
-      },
-      [`&-vertical${n}-dashed`]: {
-        borderInlineStartWidth: o,
-        borderInlineEnd: 0,
-        borderBlockStart: 0,
-        borderBlockEnd: 0
-      },
-      "&-dotted": {
-        background: "none",
-        borderColor: t,
-        borderStyle: "dotted",
-        borderWidth: `${E(o)} 0 0`
-      },
-      [`&-horizontal${n}-with-text${n}-dotted`]: {
-        "&::before, &::after": {
-          borderStyle: "dotted none none"
-        }
-      },
-      [`&-vertical${n}-dotted`]: {
-        borderInlineStartWidth: o,
-        borderInlineEnd: 0,
-        borderBlockStart: 0,
-        borderBlockEnd: 0
-      },
-      [`&-plain${n}-with-text`]: {
-        color: e.colorText,
-        fontWeight: "normal",
-        fontSize: e.fontSize
-      },
-      [`&-horizontal${n}-with-text-left${n}-no-default-orientation-margin-left`]: {
-        "&::before": {
-          width: 0
-        },
-        "&::after": {
-          width: "100%"
-        },
-        [`${n}-inner-text`]: {
-          paddingInlineStart: i
-        }
-      },
-      [`&-horizontal${n}-with-text-right${n}-no-default-orientation-margin-right`]: {
-        "&::before": {
-          width: "100%"
-        },
-        "&::after": {
-          width: 0
-        },
-        [`${n}-inner-text`]: {
-          paddingInlineEnd: i
-        }
-      }
-    })
+    checked: s,
+    className: i,
+    componentsProps: p = {},
+    control: f,
+    disabled: c,
+    disableTypography: l,
+    inputRef: u,
+    label: a,
+    labelPlacement: h = "end",
+    name: C,
+    onChange: k,
+    required: O,
+    slots: y = {},
+    slotProps: x = {},
+    value: b,
+    ...T
+  } = n, S = X(), B = c ?? f.props.disabled ?? (S == null ? void 0 : S.disabled), R = O ?? f.props.required, L = {
+    disabled: B,
+    required: R
   };
-}, lt = (e) => ({
-  textPaddingInline: "1em",
-  orientationMargin: 0.05,
-  verticalMarginInline: e.marginXS
-}), dt = ne("Divider", (e) => {
-  const n = oe(e, {
-    dividerHorizontalWithTextGutterMargin: e.margin,
-    dividerHorizontalGutterMargin: e.marginLG,
-    sizePaddingEdgeHorizontal: 0
+  ["checked", "name", "onChange", "value", "inputRef"].forEach((N) => {
+    typeof f.props[N] > "u" && typeof n[N] < "u" && (L[N] = n[N]);
   });
-  return [at(n)];
-}, lt, {
-  unitless: {
-    orientationMargin: !0
+  const Z = ye({
+    props: n,
+    muiFormControl: S,
+    states: ["error"]
+  }), E = {
+    ...n,
+    disabled: B,
+    labelPlacement: h,
+    required: R,
+    error: Z.error
+  }, q = no(E), $ = {
+    slots: y,
+    slotProps: {
+      ...p,
+      ...x
+    }
+  }, [J, V] = Me("typography", {
+    elementType: _,
+    externalForwardedProps: $,
+    ownerState: E
+  });
+  let j = a;
+  return j != null && j.type !== _ && !l && (j = /* @__PURE__ */ d(J, {
+    component: "span",
+    ...V,
+    className: I(q.label, V == null ? void 0 : V.className),
+    children: j
+  })), /* @__PURE__ */ P(so, {
+    className: I(q.root, i),
+    ownerState: E,
+    ref: r,
+    ...T,
+    children: [/* @__PURE__ */ m.cloneElement(f, L), R ? /* @__PURE__ */ P("div", {
+      children: [j, /* @__PURE__ */ P(ao, {
+        ownerState: E,
+        "aria-hidden": !0,
+        className: q.asterisk,
+        children: [" ", "*"]
+      })]
+    }) : j]
+  });
+});
+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`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the component appears selected.
+   */
+  checked: o.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.string,
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  componentsProps: o.shape({
+    typography: o.object
+  }),
+  /**
+   * A control element. For instance, it can be a `Radio`, a `Switch` or a `Checkbox`.
+   */
+  control: o.element.isRequired,
+  /**
+   * If `true`, the control is disabled.
+   */
+  disabled: o.bool,
+  /**
+   * If `true`, the label is rendered as it is passed without an additional typography node.
+   */
+  disableTypography: o.bool,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: H,
+  /**
+   * A text or an element to be used in an enclosing label element.
+   */
+  label: o.node,
+  /**
+   * The position of the label.
+   * @default 'end'
+   */
+  labelPlacement: o.oneOf(["bottom", "end", "start", "top"]),
+  /**
+   * @ignore
+   */
+  name: o.string,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.SyntheticEvent} event The event source of the callback.
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: o.func,
+  /**
+   * If `true`, the label will indicate that the `input` is required.
+   */
+  required: o.bool,
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: o.shape({
+    typography: o.oneOfType([o.func, o.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: o.shape({
+    typography: 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]),
+  /**
+   * The value of the component.
+   */
+  value: o.any
+});
+function io(e) {
+  return D("MuiFormGroup", e);
+}
+G("MuiFormGroup", ["root", "row", "error"]);
+const lo = (e) => {
+  const {
+    classes: t,
+    row: r,
+    error: n
+  } = e;
+  return M({
+    root: ["root", r && "row", n && "error"]
+  }, io, t);
+}, co = v("div", {
+  name: "MuiFormGroup",
+  slot: "Root",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: r
+    } = e;
+    return [t.root, r.row && t.row];
   }
+})({
+  display: "flex",
+  flexDirection: "column",
+  flexWrap: "wrap",
+  variants: [{
+    props: {
+      row: !0
+    },
+    style: {
+      flexDirection: "row"
+    }
+  }]
+}), Ce = /* @__PURE__ */ m.forwardRef(function(t, r) {
+  const n = A({
+    props: t,
+    name: "MuiFormGroup"
+  }), {
+    className: s,
+    row: i = !1,
+    ...p
+  } = n, f = X(), c = ye({
+    props: n,
+    muiFormControl: f,
+    states: ["error"]
+  }), l = {
+    ...n,
+    row: i,
+    error: c.error
+  }, u = lo(l);
+  return /* @__PURE__ */ d(co, {
+    className: I(u.root, s),
+    ownerState: l,
+    ref: r,
+    ...p
+  });
 });
-var st = function(e, n) {
-  var i = {};
-  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && n.indexOf(t) < 0 && (i[t] = e[t]);
-  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var o = 0, t = Object.getOwnPropertySymbols(e); o < t.length; o++)
-    n.indexOf(t[o]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[o]) && (i[t[o]] = e[t[o]]);
-  return i;
-};
-const ke = (e) => {
+process.env.NODE_ENV !== "production" && (Ce.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: o.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.string,
+  /**
+   * Display group of elements in a compact row.
+   * @default false
+   */
+  row: o.bool,
+  /**
+   * 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 po = be(/* @__PURE__ */ d("path", {
+  d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
+}), "RadioButtonUnchecked"), uo = be(/* @__PURE__ */ d("path", {
+  d: "M8.465 8.465C9.37 7.56 10.62 7 12 7C14.76 7 17 9.24 17 12C17 13.38 16.44 14.63 15.535 15.535C14.63 16.44 13.38 17 12 17C9.24 17 7 14.76 7 12C7 10.62 7.56 9.37 8.465 8.465Z"
+}), "RadioButtonChecked"), fo = v("span", {
+  shouldForwardProp: oe
+})({
+  position: "relative",
+  display: "flex"
+}), mo = v(po)({
+  // Scale applied to prevent dot misalignment in Safari
+  transform: "scale(1)"
+}), ho = v(uo)(z(({
+  theme: e
+}) => ({
+  left: 0,
+  position: "absolute",
+  transform: "scale(0)",
+  transition: e.transitions.create("transform", {
+    easing: e.transitions.easing.easeIn,
+    duration: e.transitions.duration.shortest
+  }),
+  variants: [{
+    props: {
+      checked: !0
+    },
+    style: {
+      transform: "scale(1)",
+      transition: e.transitions.create("transform", {
+        easing: e.transitions.easing.easeOut,
+        duration: e.transitions.duration.shortest
+      })
+    }
+  }]
+})));
+function re(e) {
   const {
-    getPrefixCls: n,
-    direction: i,
-    divider: t
-  } = d.useContext(W), {
-    prefixCls: o,
-    type: s = "horizontal",
-    orientation: a = "center",
-    orientationMargin: r,
-    className: l,
-    rootClassName: c,
-    children: g,
-    dashed: u,
-    variant: S = "solid",
-    plain: m,
-    style: w
-  } = e, y = st(e, ["prefixCls", "type", "orientation", "orientationMargin", "className", "rootClassName", "children", "dashed", "variant", "plain", "style"]), b = n("divider", o), [k, f, v] = dt(b), x = !!g, I = a === "left" && r != null, p = a === "right" && r != null, P = _(b, t == null ? void 0 : t.className, f, v, `${b}-${s}`, {
-    [`${b}-with-text`]: x,
-    [`${b}-with-text-${a}`]: x,
-    [`${b}-dashed`]: !!u,
-    [`${b}-${S}`]: S !== "solid",
-    [`${b}-plain`]: !!m,
-    [`${b}-rtl`]: i === "rtl",
-    [`${b}-no-default-orientation-margin-left`]: I,
-    [`${b}-no-default-orientation-margin-right`]: p
-  }, l, c), h = d.useMemo(() => typeof r == "number" ? r : /^\d+$/.test(r) ? Number(r) : r, [r]), $ = Object.assign(Object.assign({}, I && {
-    marginLeft: h
-  }), p && {
-    marginRight: h
+    checked: t = !1,
+    classes: r = {},
+    fontSize: n
+  } = e, s = {
+    ...e,
+    checked: t
+  };
+  return /* @__PURE__ */ P(fo, {
+    className: r.root,
+    ownerState: s,
+    children: [/* @__PURE__ */ d(mo, {
+      fontSize: n,
+      className: r.background,
+      ownerState: s
+    }), /* @__PURE__ */ d(ho, {
+      fontSize: n,
+      className: r.dot,
+      ownerState: s
+    })]
   });
-  if (process.env.NODE_ENV !== "production") {
-    const z = Se("Divider");
-    process.env.NODE_ENV !== "production" && z(!g || s !== "vertical", "usage", "`children` not working in `vertical` mode.");
-  }
-  return k(/* @__PURE__ */ d.createElement("div", Object.assign({
-    className: P,
-    style: Object.assign(Object.assign({}, t == null ? void 0 : t.style), w)
-  }, y, {
-    role: "separator"
-  }), g && s !== "vertical" && /* @__PURE__ */ d.createElement("span", {
-    className: `${b}-inner-text`,
-    style: $
-  }, g)));
-};
-process.env.NODE_ENV !== "production" && (ke.displayName = "Divider");
-function se(e) {
-  return ["small", "middle", "large"].includes(e);
 }
-function ce(e) {
-  return e ? typeof e == "number" && !Number.isNaN(e) : !1;
-}
-const Ie = /* @__PURE__ */ Re.createContext({
-  latestIndex: 0
-}), ct = Ie.Provider, ut = (e) => {
-  let {
-    className: n,
-    index: i,
-    children: t,
-    split: o,
-    style: s
-  } = e;
-  const {
-    latestIndex: a
-  } = d.useContext(Ie);
-  return t == null ? null : /* @__PURE__ */ d.createElement(d.Fragment, null, /* @__PURE__ */ d.createElement("div", {
-    className: n,
-    style: s
-  }, t), i < a && o && /* @__PURE__ */ d.createElement("span", {
-    className: `${n}-split`
-  }, o));
-};
-var ht = function(e, n) {
-  var i = {};
-  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && n.indexOf(t) < 0 && (i[t] = e[t]);
-  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var o = 0, t = Object.getOwnPropertySymbols(e); o < t.length; o++)
-    n.indexOf(t[o]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[o]) && (i[t[o]] = e[t[o]]);
-  return i;
-};
-const gt = /* @__PURE__ */ d.forwardRef((e, n) => {
-  var i, t, o;
-  const {
-    getPrefixCls: s,
-    space: a,
-    direction: r
-  } = d.useContext(W), {
-    size: l = (i = a == null ? void 0 : a.size) !== null && i !== void 0 ? i : "small",
-    align: c,
-    className: g,
-    rootClassName: u,
-    children: S,
-    direction: m = "horizontal",
-    prefixCls: w,
-    split: y,
-    style: b,
-    wrap: k = !1,
-    classNames: f,
-    styles: v
-  } = e, x = ht(e, ["size", "align", "className", "rootClassName", "children", "direction", "prefixCls", "split", "style", "wrap", "classNames", "styles"]), [I, p] = Array.isArray(l) ? l : [l, l], P = se(p), h = se(I), $ = ce(p), z = ce(I), C = Te(S, {
-    keepEmpty: !0
-  }), R = c === void 0 && m === "horizontal" ? "center" : c, N = s("space", w), [j, M, T] = He(N), X = _(N, a == null ? void 0 : a.className, M, `${N}-${m}`, {
-    [`${N}-rtl`]: r === "rtl",
-    [`${N}-align-${R}`]: R,
-    [`${N}-gap-row-${p}`]: P,
-    [`${N}-gap-col-${I}`]: h
-  }, g, u, T), q = _(`${N}-item`, (t = f == null ? void 0 : f.item) !== null && t !== void 0 ? t : (o = a == null ? void 0 : a.classNames) === null || o === void 0 ? void 0 : o.item);
-  let V = 0;
-  const J = C.map((B, Z) => {
-    var ee, te;
-    B != null && (V = Z);
-    const Oe = (B == null ? void 0 : B.key) || `${q}-${Z}`;
-    return /* @__PURE__ */ d.createElement(ut, {
-      className: q,
-      key: Oe,
-      index: Z,
-      split: y,
-      style: (ee = v == null ? void 0 : v.item) !== null && ee !== void 0 ? ee : (te = a == null ? void 0 : a.styles) === null || te === void 0 ? void 0 : te.item
-    }, B);
-  }), O = d.useMemo(() => ({
-    latestIndex: V
-  }), [V]);
-  if (C.length === 0)
-    return null;
-  const H = {};
-  return k && (H.flexWrap = "wrap"), !h && z && (H.columnGap = I), !P && $ && (H.rowGap = p), j(/* @__PURE__ */ d.createElement("div", Object.assign({
-    ref: n,
-    className: X,
-    style: Object.assign(Object.assign(Object.assign({}, H), a == null ? void 0 : a.style), b)
-  }, x), /* @__PURE__ */ d.createElement(ct, {
-    value: O
-  }, J)));
-}), ie = gt;
-ie.Compact = _e;
-process.env.NODE_ENV !== "production" && (ie.displayName = "Space");
-var bt = ["prefixCls", "className", "checked", "defaultChecked", "disabled", "loadingIcon", "checkedChildren", "unCheckedChildren", "onClick", "onChange", "onKeyDown"], Ee = /* @__PURE__ */ d.forwardRef(function(e, n) {
-  var i, t = e.prefixCls, o = t === void 0 ? "rc-switch" : t, s = e.className, a = e.checked, r = e.defaultChecked, l = e.disabled, c = e.loadingIcon, g = e.checkedChildren, u = e.unCheckedChildren, S = e.onClick, m = e.onChange, w = e.onKeyDown, y = fe(e, bt), b = Y(!1, {
-    value: a,
-    defaultValue: r
-  }), k = me(b, 2), f = k[0], v = k[1];
-  function x(h, $) {
-    var z = f;
-    return l || (z = h, v(z), m == null || m(z, $)), z;
-  }
-  function I(h) {
-    h.which === ae.LEFT ? x(!1, h) : h.which === ae.RIGHT && x(!0, h), w == null || w(h);
-  }
-  function p(h) {
-    var $ = x(!f, h);
-    S == null || S($, h);
-  }
-  var P = _(o, s, (i = {}, U(i, "".concat(o, "-checked"), f), U(i, "".concat(o, "-disabled"), l), i));
-  return /* @__PURE__ */ d.createElement("button", ve({}, y, {
-    type: "button",
-    role: "switch",
-    "aria-checked": f,
-    disabled: l,
-    className: P,
-    ref: n,
-    onKeyDown: I,
-    onClick: p
-  }), c, /* @__PURE__ */ d.createElement("span", {
-    className: "".concat(o, "-inner")
-  }, /* @__PURE__ */ d.createElement("span", {
-    className: "".concat(o, "-inner-checked")
-  }, g), /* @__PURE__ */ d.createElement("span", {
-    className: "".concat(o, "-inner-unchecked")
-  }, u)));
+process.env.NODE_ENV !== "production" && (re.propTypes = {
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: o.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense radio styling.
+   */
+  fontSize: o.oneOf(["small", "medium"])
 });
-Ee.displayName = "Switch";
-const pt = (e) => {
+const ne = /* @__PURE__ */ m.createContext(void 0);
+process.env.NODE_ENV !== "production" && (ne.displayName = "RadioGroupContext");
+function bo() {
+  return m.useContext(ne);
+}
+function yo(e) {
+  return D("MuiRadio", e);
+}
+const de = G("MuiRadio", ["root", "checked", "disabled", "colorPrimary", "colorSecondary", "sizeSmall"]), go = (e) => {
   const {
-    componentCls: n,
-    trackHeightSM: i,
-    trackPadding: t,
-    trackMinWidthSM: o,
-    innerMinMarginSM: s,
-    innerMaxMarginSM: a,
-    handleSizeSM: r,
-    calc: l
-  } = e, c = `${n}-inner`, g = E(l(r).add(l(t).mul(2)).equal()), u = E(l(a).mul(2).equal());
+    classes: t,
+    color: r,
+    size: n
+  } = e, s = {
+    root: ["root", `color${w(r)}`, n !== "medium" && `size${w(n)}`]
+  };
   return {
-    [n]: {
-      [`&${n}-small`]: {
-        minWidth: o,
-        height: i,
-        lineHeight: E(i),
-        [`${n}-inner`]: {
-          paddingInlineStart: a,
-          paddingInlineEnd: s,
-          [`${c}-checked, ${c}-unchecked`]: {
-            minHeight: i
-          },
-          [`${c}-checked`]: {
-            marginInlineStart: `calc(-100% + ${g} - ${u})`,
-            marginInlineEnd: `calc(100% - ${g} + ${u})`
-          },
-          [`${c}-unchecked`]: {
-            marginTop: l(i).mul(-1).equal(),
-            marginInlineStart: 0,
-            marginInlineEnd: 0
-          }
-        },
-        [`${n}-handle`]: {
-          width: r,
-          height: r
-        },
-        [`${n}-loading-icon`]: {
-          top: l(l(r).sub(e.switchLoadingIconSize)).div(2).equal(),
-          fontSize: e.switchLoadingIconSize
-        },
-        [`&${n}-checked`]: {
-          [`${n}-inner`]: {
-            paddingInlineStart: s,
-            paddingInlineEnd: a,
-            [`${c}-checked`]: {
-              marginInlineStart: 0,
-              marginInlineEnd: 0
-            },
-            [`${c}-unchecked`]: {
-              marginInlineStart: `calc(100% - ${g} + ${u})`,
-              marginInlineEnd: `calc(-100% + ${g} - ${u})`
-            }
-          },
-          [`${n}-handle`]: {
-            insetInlineStart: `calc(100% - ${E(l(r).add(t).equal())})`
-          }
-        },
-        [`&:not(${n}-disabled):active`]: {
-          [`&:not(${n}-checked) ${c}`]: {
-            [`${c}-unchecked`]: {
-              marginInlineStart: l(e.marginXXS).div(2).equal(),
-              marginInlineEnd: l(e.marginXXS).mul(-1).div(2).equal()
-            }
-          },
-          [`&${n}-checked ${c}`]: {
-            [`${c}-checked`]: {
-              marginInlineStart: l(e.marginXXS).mul(-1).div(2).equal(),
-              marginInlineEnd: l(e.marginXXS).div(2).equal()
-            }
-          }
+    ...t,
+    ...M(s, yo, t)
+  };
+}, vo = v(te, {
+  shouldForwardProp: (e) => oe(e) || e === "classes",
+  name: "MuiRadio",
+  slot: "Root",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: r
+    } = e;
+    return [t.root, r.size !== "medium" && t[`size${w(r.size)}`], t[`color${w(r.color)}`]];
+  }
+})(z(({
+  theme: e
+}) => ({
+  color: (e.vars || e).palette.text.secondary,
+  [`&.${de.disabled}`]: {
+    color: (e.vars || e).palette.action.disabled
+  },
+  variants: [{
+    props: {
+      color: "default",
+      disabled: !1,
+      disableRipple: !1
+    },
+    style: {
+      "&:hover": {
+        backgroundColor: e.vars ? `rgba(${e.vars.palette.action.activeChannel} / ${e.vars.palette.action.hoverOpacity})` : W(e.palette.action.active, e.palette.action.hoverOpacity)
+      }
+    }
+  }, ...Object.entries(e.palette).filter(Y()).map(([t]) => ({
+    props: {
+      color: t,
+      disabled: !1,
+      disableRipple: !1
+    },
+    style: {
+      "&:hover": {
+        backgroundColor: e.vars ? `rgba(${e.vars.palette[t].mainChannel} / ${e.vars.palette.action.hoverOpacity})` : W(e.palette[t].main, e.palette.action.hoverOpacity)
+      }
+    }
+  })), ...Object.entries(e.palette).filter(Y()).map(([t]) => ({
+    props: {
+      color: t,
+      disabled: !1
+    },
+    style: {
+      [`&.${de.checked}`]: {
+        color: (e.vars || e).palette[t].main
+      }
+    }
+  })), {
+    // Should be last to override other colors
+    props: {
+      disableRipple: !1
+    },
+    style: {
+      // Reset on touch devices, it doesn't add specificity
+      "&:hover": {
+        "@media (hover: none)": {
+          backgroundColor: "transparent"
         }
       }
     }
-  };
-}, ft = (e) => {
+  }]
+})));
+function Co(e, t) {
+  return typeof t == "object" && t !== null ? e === t : String(e) === String(t);
+}
+const pe = /* @__PURE__ */ d(re, {
+  checked: !0
+}), ue = /* @__PURE__ */ d(re, {}), ke = /* @__PURE__ */ m.forwardRef(function(t, r) {
+  const n = A({
+    props: t,
+    name: "MuiRadio"
+  }), {
+    checked: s,
+    checkedIcon: i = pe,
+    color: p = "primary",
+    icon: f = ue,
+    name: c,
+    onChange: l,
+    size: u = "medium",
+    className: a,
+    disabled: h,
+    disableRipple: C = !1,
+    ...k
+  } = n, O = X();
+  let y = h;
+  O && typeof y > "u" && (y = O.disabled), y ?? (y = !1);
+  const x = {
+    ...n,
+    disabled: y,
+    disableRipple: C,
+    color: p,
+    size: u
+  }, b = go(x), T = bo();
+  let S = s;
+  const B = Ae(l, T && T.onChange);
+  let R = c;
+  return T && (typeof S > "u" && (S = Co(T.value, n.value)), typeof R > "u" && (R = T.name)), /* @__PURE__ */ d(vo, {
+    type: "radio",
+    icon: /* @__PURE__ */ m.cloneElement(f, {
+      fontSize: ue.props.fontSize ?? u
+    }),
+    checkedIcon: /* @__PURE__ */ m.cloneElement(i, {
+      fontSize: pe.props.fontSize ?? u
+    }),
+    disabled: y,
+    ownerState: x,
+    classes: b,
+    name: R,
+    checked: S,
+    onChange: B,
+    ref: r,
+    className: I(b.root, a),
+    ...k
+  });
+});
+process.env.NODE_ENV !== "production" && (ke.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: o.bool,
+  /**
+   * The icon to display when the component is checked.
+   * @default <RadioButtonIcon checked />
+   */
+  checkedIcon: o.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.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: o.oneOfType([o.oneOf(["default", "primary", "secondary", "error", "info", "success", "warning"]), o.string]),
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: o.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   * @default false
+   */
+  disableRipple: o.bool,
+  /**
+   * The icon to display when the component is unchecked.
+   * @default <RadioButtonIcon />
+   */
+  icon: o.node,
+  /**
+   * The id of the `input` element.
+   */
+  id: o.string,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: o.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: H,
+  /**
+   * Name attribute of the `input` element.
+   */
+  name: o.string,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * 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: o.func,
+  /**
+   * If `true`, the `input` element is required.
+   * @default false
+   */
+  required: o.bool,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense radio styling.
+   * @default 'medium'
+   */
+  size: o.oneOfType([o.oneOf(["medium", "small"]), o.string]),
+  /**
+   * 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]),
+  /**
+   * The value of the component. The DOM API casts this to a string.
+   */
+  value: o.any
+});
+function ko(e) {
+  return D("MuiRadioGroup", e);
+}
+G("MuiRadioGroup", ["root", "row", "error"]);
+const wo = (e) => {
   const {
-    componentCls: n,
-    handleSize: i,
-    calc: t
+    classes: t,
+    row: r,
+    error: n
   } = e;
-  return {
-    [n]: {
-      [`${n}-loading-icon${e.iconCls}`]: {
-        position: "relative",
-        top: t(t(i).sub(e.fontSize)).div(2).equal(),
-        color: e.switchLoadingIconColor,
-        verticalAlign: "top"
-      },
-      [`&${n}-checked ${n}-loading-icon`]: {
-        color: e.switchColor
-      }
+  return M({
+    root: ["root", r && "row", n && "error"]
+  }, ko, t);
+}, we = /* @__PURE__ */ m.forwardRef(function(t, r) {
+  const {
+    // private
+    // eslint-disable-next-line react/prop-types
+    actions: n,
+    children: s,
+    className: i,
+    defaultValue: p,
+    name: f,
+    onChange: c,
+    value: l,
+    ...u
+  } = t, a = m.useRef(null), h = wo(t), [C, k] = he({
+    controlled: l,
+    default: p,
+    name: "RadioGroup"
+  });
+  m.useImperativeHandle(n, () => ({
+    focus: () => {
+      let b = a.current.querySelector("input:not(:disabled):checked");
+      b || (b = a.current.querySelector("input:not(:disabled)")), b && b.focus();
     }
-  };
-}, mt = (e) => {
+  }), []);
+  const O = Ge(r, a), y = De(f), x = m.useMemo(() => ({
+    name: y,
+    onChange(b) {
+      k(b.target.value), c && c(b, b.target.value);
+    },
+    value: C
+  }), [y, c, k, C]);
+  return /* @__PURE__ */ d(ne.Provider, {
+    value: x,
+    children: /* @__PURE__ */ d(Ce, {
+      role: "radiogroup",
+      ref: O,
+      className: I(h.root, i),
+      ...u,
+      children: s
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (we.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,
+  /**
+   * @ignore
+   */
+  className: o.string,
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: o.any,
+  /**
+   * The name used to reference the value of the control.
+   * If you don't provide this prop, it falls back to a randomly generated name.
+   */
+  name: o.string,
+  /**
+   * Callback fired when a radio button is selected.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * @param {string} value The value of the selected radio button.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange: o.func,
+  /**
+   * Value of the selected radio button. The DOM API casts this to a string.
+   */
+  value: o.any
+});
+const Se = Qe({
+  createStyledComponent: v("div", {
+    name: "MuiStack",
+    slot: "Root",
+    overridesResolver: (e, t) => t.root
+  }),
+  useThemeProps: (e) => A({
+    props: e,
+    name: "MuiStack"
+  })
+});
+process.env.NODE_ENV !== "production" && (Se.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,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: o.elementType,
+  /**
+   * Defines the `flex-direction` style property.
+   * It is applied for all screen sizes.
+   * @default 'column'
+   */
+  direction: o.oneOfType([o.oneOf(["column-reverse", "column", "row-reverse", "row"]), o.arrayOf(o.oneOf(["column-reverse", "column", "row-reverse", "row"])), o.object]),
+  /**
+   * Add an element between each child.
+   */
+  divider: o.node,
+  /**
+   * Defines the space between immediate children.
+   * @default 0
+   */
+  spacing: o.oneOfType([o.arrayOf(o.oneOfType([o.number, o.string])), o.number, o.object, o.string]),
+  /**
+   * The system prop, which 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]),
+  /**
+   * If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
+   *
+   * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),
+   * it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
+   *
+   * To enable this flag globally, follow the [theme's default props](https://mui.com/material-ui/customization/theme-components/#default-props) configuration.
+   * @default false
+   */
+  useFlexGap: o.bool
+});
+function So(e) {
+  return D("MuiSwitch", e);
+}
+const g = G("MuiSwitch", ["root", "edgeStart", "edgeEnd", "switchBase", "colorPrimary", "colorSecondary", "sizeSmall", "sizeMedium", "checked", "disabled", "input", "thumb", "track"]), Ro = (e) => {
   const {
-    componentCls: n,
-    trackPadding: i,
-    handleBg: t,
-    handleShadow: o,
-    handleSize: s,
-    calc: a
-  } = e, r = `${n}-handle`;
+    classes: t,
+    edge: r,
+    size: n,
+    color: s,
+    checked: i,
+    disabled: p
+  } = e, f = {
+    root: ["root", r && `edge${w(r)}`, `size${w(n)}`],
+    switchBase: ["switchBase", `color${w(s)}`, i && "checked", p && "disabled"],
+    thumb: ["thumb"],
+    track: ["track"],
+    input: ["input"]
+  }, c = M(f, So, t);
   return {
-    [n]: {
-      [r]: {
-        position: "absolute",
-        top: i,
-        insetInlineStart: i,
-        width: s,
-        height: s,
-        transition: `all ${e.switchDuration} ease-in-out`,
-        "&::before": {
-          position: "absolute",
-          top: 0,
-          insetInlineEnd: 0,
-          bottom: 0,
-          insetInlineStart: 0,
-          backgroundColor: t,
-          borderRadius: a(s).div(2).equal(),
-          boxShadow: o,
-          transition: `all ${e.switchDuration} ease-in-out`,
-          content: '""'
-        }
-      },
-      [`&${n}-checked ${r}`]: {
-        insetInlineStart: `calc(100% - ${E(a(s).add(i).equal())})`
+    ...t,
+    // forward the disabled and checked classes to the SwitchBase
+    ...c
+  };
+}, Oo = v("span", {
+  name: "MuiSwitch",
+  slot: "Root",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: r
+    } = e;
+    return [t.root, r.edge && t[`edge${w(r.edge)}`], t[`size${w(r.size)}`]];
+  }
+})({
+  display: "inline-flex",
+  width: 34 + 12 * 2,
+  height: 14 + 12 * 2,
+  overflow: "hidden",
+  padding: 12,
+  boxSizing: "border-box",
+  position: "relative",
+  flexShrink: 0,
+  zIndex: 0,
+  // Reset the stacking context.
+  verticalAlign: "middle",
+  // For correct alignment with the text.
+  "@media print": {
+    colorAdjust: "exact"
+  },
+  variants: [{
+    props: {
+      edge: "start"
+    },
+    style: {
+      marginLeft: -8
+    }
+  }, {
+    props: {
+      edge: "end"
+    },
+    style: {
+      marginRight: -8
+    }
+  }, {
+    props: {
+      size: "small"
+    },
+    style: {
+      width: 40,
+      height: 24,
+      padding: 7,
+      [`& .${g.thumb}`]: {
+        width: 16,
+        height: 16
       },
-      [`&:not(${n}-disabled):active`]: {
-        [`${r}::before`]: {
-          insetInlineEnd: e.switchHandleActiveInset,
-          insetInlineStart: 0
-        },
-        [`&${n}-checked ${r}::before`]: {
-          insetInlineEnd: 0,
-          insetInlineStart: e.switchHandleActiveInset
+      [`& .${g.switchBase}`]: {
+        padding: 4,
+        [`&.${g.checked}`]: {
+          transform: "translateX(16px)"
         }
       }
     }
-  };
-}, vt = (e) => {
-  const {
-    componentCls: n,
-    trackHeight: i,
-    trackPadding: t,
-    innerMinMargin: o,
-    innerMaxMargin: s,
-    handleSize: a,
-    calc: r
-  } = e, l = `${n}-inner`, c = E(r(a).add(r(t).mul(2)).equal()), g = E(r(s).mul(2).equal());
-  return {
-    [n]: {
-      [l]: {
-        display: "block",
-        overflow: "hidden",
-        borderRadius: 100,
-        height: "100%",
-        paddingInlineStart: s,
-        paddingInlineEnd: o,
-        transition: `padding-inline-start ${e.switchDuration} ease-in-out, padding-inline-end ${e.switchDuration} ease-in-out`,
-        [`${l}-checked, ${l}-unchecked`]: {
-          display: "block",
-          color: e.colorTextLightSolid,
-          fontSize: e.fontSizeSM,
-          transition: `margin-inline-start ${e.switchDuration} ease-in-out, margin-inline-end ${e.switchDuration} ease-in-out`,
-          pointerEvents: "none",
-          minHeight: i
-        },
-        [`${l}-checked`]: {
-          marginInlineStart: `calc(-100% + ${c} - ${g})`,
-          marginInlineEnd: `calc(100% - ${c} + ${g})`
-        },
-        [`${l}-unchecked`]: {
-          marginTop: r(i).mul(-1).equal(),
-          marginInlineStart: 0,
-          marginInlineEnd: 0
-        }
-      },
-      [`&${n}-checked ${l}`]: {
-        paddingInlineStart: o,
-        paddingInlineEnd: s,
-        [`${l}-checked`]: {
-          marginInlineStart: 0,
-          marginInlineEnd: 0
-        },
-        [`${l}-unchecked`]: {
-          marginInlineStart: `calc(100% - ${c} + ${g})`,
-          marginInlineEnd: `calc(-100% + ${c} - ${g})`
-        }
-      },
-      [`&:not(${n}-disabled):active`]: {
-        [`&:not(${n}-checked) ${l}`]: {
-          [`${l}-unchecked`]: {
-            marginInlineStart: r(t).mul(2).equal(),
-            marginInlineEnd: r(t).mul(-1).mul(2).equal()
+  }]
+}), xo = v(te, {
+  name: "MuiSwitch",
+  slot: "SwitchBase",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: r
+    } = e;
+    return [t.switchBase, {
+      [`& .${g.input}`]: t.input
+    }, r.color !== "default" && t[`color${w(r.color)}`]];
+  }
+})(z(({
+  theme: e
+}) => ({
+  position: "absolute",
+  top: 0,
+  left: 0,
+  zIndex: 1,
+  // Render above the focus ripple.
+  color: e.vars ? e.vars.palette.Switch.defaultColor : `${e.palette.mode === "light" ? e.palette.common.white : e.palette.grey[300]}`,
+  transition: e.transitions.create(["left", "transform"], {
+    duration: e.transitions.duration.shortest
+  }),
+  [`&.${g.checked}`]: {
+    transform: "translateX(20px)"
+  },
+  [`&.${g.disabled}`]: {
+    color: e.vars ? e.vars.palette.Switch.defaultDisabledColor : `${e.palette.mode === "light" ? e.palette.grey[100] : e.palette.grey[600]}`
+  },
+  [`&.${g.checked} + .${g.track}`]: {
+    opacity: 0.5
+  },
+  [`&.${g.disabled} + .${g.track}`]: {
+    opacity: e.vars ? e.vars.opacity.switchTrackDisabled : `${e.palette.mode === "light" ? 0.12 : 0.2}`
+  },
+  [`& .${g.input}`]: {
+    left: "-100%",
+    width: "300%"
+  }
+})), z(({
+  theme: e
+}) => ({
+  "&:hover": {
+    backgroundColor: e.vars ? `rgba(${e.vars.palette.action.activeChannel} / ${e.vars.palette.action.hoverOpacity})` : W(e.palette.action.active, e.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    "@media (hover: none)": {
+      backgroundColor: "transparent"
+    }
+  },
+  variants: [...Object.entries(e.palette).filter(Y(["light"])).map(([t]) => ({
+    props: {
+      color: t
+    },
+    style: {
+      [`&.${g.checked}`]: {
+        color: (e.vars || e).palette[t].main,
+        "&:hover": {
+          backgroundColor: e.vars ? `rgba(${e.vars.palette[t].mainChannel} / ${e.vars.palette.action.hoverOpacity})` : W(e.palette[t].main, e.palette.action.hoverOpacity),
+          "@media (hover: none)": {
+            backgroundColor: "transparent"
           }
         },
-        [`&${n}-checked ${l}`]: {
-          [`${l}-checked`]: {
-            marginInlineStart: r(t).mul(-1).mul(2).equal(),
-            marginInlineEnd: r(t).mul(2).equal()
-          }
+        [`&.${g.disabled}`]: {
+          color: e.vars ? e.vars.palette.Switch[`${t}DisabledColor`] : `${e.palette.mode === "light" ? Ie(e.palette[t].main, 0.62) : ze(e.palette[t].main, 0.55)}`
         }
+      },
+      [`&.${g.checked} + .${g.track}`]: {
+        backgroundColor: (e.vars || e).palette[t].main
       }
     }
-  };
-}, Ct = (e) => {
-  const {
-    componentCls: n,
-    trackHeight: i,
-    trackMinWidth: t
-  } = e;
-  return {
-    [n]: Object.assign(Object.assign(Object.assign(Object.assign({}, A(e)), {
-      position: "relative",
-      display: "inline-block",
-      boxSizing: "border-box",
-      minWidth: t,
-      height: i,
-      lineHeight: E(i),
-      verticalAlign: "middle",
-      background: e.colorTextQuaternary,
-      border: "0",
-      borderRadius: 100,
-      cursor: "pointer",
-      transition: `all ${e.motionDurationMid}`,
-      userSelect: "none",
-      [`&:hover:not(${n}-disabled)`]: {
-        background: e.colorTextTertiary
-      }
-    }), Ve(e)), {
-      [`&${n}-checked`]: {
-        background: e.switchColor,
-        [`&:hover:not(${n}-disabled)`]: {
-          background: e.colorPrimaryHover
-        }
-      },
-      [`&${n}-loading, &${n}-disabled`]: {
-        cursor: "not-allowed",
-        opacity: e.switchDisabledOpacity,
-        "*": {
-          boxShadow: "none",
-          cursor: "not-allowed"
-        }
-      },
-      // rtl style
-      [`&${n}-rtl`]: {
-        direction: "rtl"
+  }))]
+}))), To = v("span", {
+  name: "MuiSwitch",
+  slot: "Track",
+  overridesResolver: (e, t) => t.track
+})(z(({
+  theme: e
+}) => ({
+  height: "100%",
+  width: "100%",
+  borderRadius: 14 / 2,
+  zIndex: -1,
+  transition: e.transitions.create(["opacity", "background-color"], {
+    duration: e.transitions.duration.shortest
+  }),
+  backgroundColor: e.vars ? e.vars.palette.common.onBackground : `${e.palette.mode === "light" ? e.palette.common.black : e.palette.common.white}`,
+  opacity: e.vars ? e.vars.opacity.switchTrack : `${e.palette.mode === "light" ? 0.38 : 0.3}`
+}))), Po = v("span", {
+  name: "MuiSwitch",
+  slot: "Thumb",
+  overridesResolver: (e, t) => t.thumb
+})(z(({
+  theme: e
+}) => ({
+  boxShadow: (e.vars || e).shadows[1],
+  backgroundColor: "currentColor",
+  width: 20,
+  height: 20,
+  borderRadius: "50%"
+}))), ee = /* @__PURE__ */ m.forwardRef(function(t, r) {
+  const n = A({
+    props: t,
+    name: "MuiSwitch"
+  }), {
+    className: s,
+    color: i = "primary",
+    edge: p = !1,
+    size: f = "medium",
+    sx: c,
+    ...l
+  } = n, u = {
+    ...n,
+    color: i,
+    edge: p,
+    size: f
+  }, a = Ro(u), h = /* @__PURE__ */ d(Po, {
+    className: a.thumb,
+    ownerState: u
+  });
+  return /* @__PURE__ */ P(Oo, {
+    className: I(a.root, s),
+    sx: c,
+    ownerState: u,
+    children: [/* @__PURE__ */ d(xo, {
+      type: "checkbox",
+      icon: h,
+      checkedIcon: h,
+      ref: r,
+      ownerState: u,
+      ...l,
+      classes: {
+        ...a,
+        root: a.switchBase
       }
-    })
-  };
-}, St = (e) => {
-  const {
-    fontSize: n,
-    lineHeight: i,
-    controlHeight: t,
-    colorWhite: o
-  } = e, s = n * i, a = t / 2, r = 2, l = s - r * 2, c = a - r * 2;
-  return {
-    trackHeight: s,
-    trackHeightSM: a,
-    trackMinWidth: l * 2 + r * 4,
-    trackMinWidthSM: c * 2 + r * 2,
-    trackPadding: r,
-    // Fixed value
-    handleBg: o,
-    handleSize: l,
-    handleSizeSM: c,
-    handleShadow: `0 2px 4px 0 ${new Le("#00230b").setAlpha(0.2).toRgbString()}`,
-    innerMinMargin: l / 2,
-    innerMaxMargin: l + r + r * 2,
-    innerMinMarginSM: c / 2,
-    innerMaxMarginSM: c + r + r * 2
-  };
-}, $t = ne("Switch", (e) => {
-  const n = oe(e, {
-    switchDuration: e.motionDurationMid,
-    switchColor: e.colorPrimary,
-    switchDisabledOpacity: e.opacityLoading,
-    switchLoadingIconSize: e.calc(e.fontSizeIcon).mul(0.75).equal(),
-    switchLoadingIconColor: `rgba(0, 0, 0, ${e.opacityLoading})`,
-    switchHandleActiveInset: "-30%"
+    }), /* @__PURE__ */ d(To, {
+      className: a.track,
+      ownerState: u
+    })]
   });
-  return [
-    Ct(n),
-    // inner style
-    vt(n),
-    // handle style
-    mt(n),
-    // loading style
-    ft(n),
-    // small style
-    pt(n)
-  ];
-}, St);
-var yt = function(e, n) {
-  var i = {};
-  for (var t in e) Object.prototype.hasOwnProperty.call(e, t) && n.indexOf(t) < 0 && (i[t] = e[t]);
-  if (e != null && typeof Object.getOwnPropertySymbols == "function") for (var o = 0, t = Object.getOwnPropertySymbols(e); o < t.length; o++)
-    n.indexOf(t[o]) < 0 && Object.prototype.propertyIsEnumerable.call(e, t[o]) && (i[t[o]] = e[t[o]]);
-  return i;
-};
-const xt = /* @__PURE__ */ d.forwardRef((e, n) => {
-  const {
-    prefixCls: i,
-    size: t,
-    disabled: o,
-    loading: s,
-    className: a,
-    rootClassName: r,
-    style: l,
-    checked: c,
-    value: g,
-    defaultChecked: u,
-    defaultValue: S,
-    onChange: m
-  } = e, w = yt(e, ["prefixCls", "size", "disabled", "loading", "className", "rootClassName", "style", "checked", "value", "defaultChecked", "defaultValue", "onChange"]), [y, b] = Y(!1, {
-    value: c ?? g,
-    defaultValue: u ?? S
-  }), {
-    getPrefixCls: k,
-    direction: f,
-    switch: v
-  } = d.useContext(W), x = d.useContext($e), I = (o ?? x) || s, p = k("switch", i), P = /* @__PURE__ */ d.createElement("div", {
-    className: `${p}-handle`
-  }, s && /* @__PURE__ */ d.createElement(We, {
-    className: `${p}-loading-icon`
-  })), [h, $, z] = $t(p), C = pe(t), R = _(v == null ? void 0 : v.className, {
-    [`${p}-small`]: C === "small",
-    [`${p}-loading`]: s,
-    [`${p}-rtl`]: f === "rtl"
-  }, a, r, $, z), N = Object.assign(Object.assign({}, v == null ? void 0 : v.style), l), j = function() {
-    b(arguments.length <= 0 ? void 0 : arguments[0]), m == null || m.apply(void 0, arguments);
-  };
-  return h(/* @__PURE__ */ d.createElement(be, {
-    component: "Switch"
-  }, /* @__PURE__ */ d.createElement(Ee, Object.assign({}, w, {
-    checked: y,
-    onChange: j,
-    prefixCls: p,
-    className: R,
-    style: N,
-    disabled: I,
-    ref: n,
-    loadingIcon: P
-  }))));
-}), Q = xt;
-Q.__ANT_SWITCH = !0;
-process.env.NODE_ENV !== "production" && (Q.displayName = "Switch");
-const K = Me.Text, wt = (e, n) => {
-  const i = ["EMAIL", "INAPP_WEB", "SMS", "CALL", "PUSH", "WEB_PUSH"];
-  return i.indexOf(e) - i.indexOf(n);
-}, ue = (e, n) => {
-  const i = ["off", "instant", "hourly", "daily", "weekly", "monthly"];
-  return i.indexOf(e) - i.indexOf(n);
-}, he = (e) => ({
+});
+process.env.NODE_ENV !== "production" && (ee.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: o.bool,
+  /**
+   * The icon to display when the component is checked.
+   */
+  checkedIcon: o.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.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: o.oneOfType([o.oneOf(["default", "primary", "secondary", "error", "info", "success", "warning"]), o.string]),
+  /**
+   * The default checked state. Use when the component is not controlled.
+   */
+  defaultChecked: o.bool,
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: o.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   * @default false
+   */
+  disableRipple: o.bool,
+  /**
+   * If given, uses a negative margin to counteract the padding on one
+   * side (this is often helpful for aligning the left or right
+   * side of the icon with content above or below, without ruining the border
+   * size and shape).
+   * @default false
+   */
+  edge: o.oneOf(["end", "start", !1]),
+  /**
+   * The icon to display when the component is unchecked.
+   */
+  icon: o.node,
+  /**
+   * The id of the `input` element.
+   */
+  id: o.string,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: o.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: H,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * 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: o.func,
+  /**
+   * If `true`, the `input` element is required.
+   * @default false
+   */
+  required: o.bool,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense switch styling.
+   * @default 'medium'
+   */
+  size: o.oneOfType([o.oneOf(["medium", "small"]), o.string]),
+  /**
+   * 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]),
+  /**
+   * The value of the component. The DOM API casts this to a string.
+   * The browser uses "on" as the default value.
+   */
+  value: o.any
+});
+const $o = (e, t) => {
+  const r = ["EMAIL", "INAPP_WEB", "SMS", "CALL", "PUSH", "WEB_PUSH"];
+  return r.indexOf(e) - r.indexOf(t);
+}, fe = (e, t) => {
+  const r = ["off", "instant", "hourly", "daily", "weekly", "monthly"];
+  return r.indexOf(e) - r.indexOf(t);
+}, me = (e) => ({
   off: "Off",
   instant: "Instant",
   hourly: "Hourly",
   daily: "Daily",
   weekly: "Weekly",
   monthly: "Monthly"
-})[e], Rt = ({
+})[e], Go = ({
   notification: e,
-  preferences: n,
-  updateDelivery: i,
-  subNotificationId: t
-}) => /* @__PURE__ */ D(re, { children: e.channels.sort(wt).map((o, s) => {
-  const a = n.find(
-    (u) => u.notificationId === e.notificationId && u.channel === o
+  preferences: t,
+  updateDelivery: r,
+  subNotificationId: n
+}) => /* @__PURE__ */ d(ie, { children: e.channels.sort($o).map((s, i) => {
+  const p = t.find(
+    (a) => a.notificationId === e.notificationId && a.channel === s
   );
-  if (!a)
+  if (!p)
     return null;
-  const r = ze(o), l = Pe(o), c = Object.keys(
-    e.options[o]
+  const f = Oe(s), c = xe(s), l = Object.keys(
+    e.options[s]
   ).filter(
-    (u) => u !== "defaultDeliveryOption" && u !== "defaultDeliverOption"
+    (a) => a !== "defaultDeliveryOption" && a !== "defaultDeliverOption"
   );
-  let g;
-  return c.length === 1 ? g = /* @__PURE__ */ D(K, { children: he(a.delivery) }) : c.length === 2 && c.includes("off") ? g = /* @__PURE__ */ D(
-    Q,
+  let u;
+  return l.length === 1 ? u = /* @__PURE__ */ d(_, { variant: "body1", children: me(p.delivery) }) : l.length === 2 && l.includes("off") ? u = /* @__PURE__ */ d(
+    ee,
     {
-      checked: a.delivery !== "off",
-      onChange: (u) => {
-        if (u) {
-          const S = c.find((m) => m !== "off");
-          i(
+      checked: p.delivery !== "off",
+      onChange: (a, h) => {
+        if (h) {
+          const C = l.find((k) => k !== "off");
+          r(
             e.notificationId,
-            o,
-            S,
-            t
+            s,
+            C,
+            n
           );
         } else
-          i(
+          r(
             e.notificationId,
-            o,
+            s,
             "off",
-            t
+            n
           );
       }
     }
-  ) : g = /* @__PURE__ */ L(re, { children: [
-    /* @__PURE__ */ D(
-      Q,
+  ) : u = /* @__PURE__ */ P(ie, { children: [
+    /* @__PURE__ */ d(
+      ee,
       {
-        checked: a.delivery !== "off",
-        onChange: (u) => {
-          if (u) {
-            const S = c.sort(ue).find((m) => m !== "off");
-            i(
+        checked: p.delivery !== "off",
+        onChange: (a, h) => {
+          if (h) {
+            const C = l.sort(fe).find((k) => k !== "off");
+            r(
               e.notificationId,
-              o,
-              S,
-              t
+              s,
+              C,
+              n
             );
           } else
-            i(
+            r(
               e.notificationId,
-              o,
+              s,
               "off",
-              t
+              n
             );
         }
       }
     ),
-    /* @__PURE__ */ D(
+    /* @__PURE__ */ d(
       "div",
       {
         style: {
           width: "100%",
           marginTop: 8,
-          maxHeight: a.delivery !== "off" ? 1e3 : 0,
+          maxHeight: p.delivery !== "off" ? 1e3 : 0,
           overflow: "hidden",
           transition: "max-height 0.3s ease"
         },
-        children: /* @__PURE__ */ L("div", { children: [
-          /* @__PURE__ */ D("div", { style: { marginTop: 20 }, children: /* @__PURE__ */ D(K, { strong: !0, children: "Choose frequency:" }) }),
-          /* @__PURE__ */ D(
-            F.Group,
+        children: /* @__PURE__ */ P("div", { children: [
+          /* @__PURE__ */ d("div", { style: { marginTop: 20 }, children: /* @__PURE__ */ d(_, { variant: "body1", fontWeight: 600, children: "Choose frequency:" }) }),
+          /* @__PURE__ */ d(
+            we,
             {
-              value: a.delivery,
-              onChange: (u) => {
-                i(
+              value: p.delivery,
+              onChange: (a) => {
+                r(
                   e.notificationId,
-                  o,
-                  u.target.value,
-                  t
+                  s,
+                  a.target.value,
+                  n
                 );
               },
-              children: /* @__PURE__ */ D(ie, { direction: "vertical", style: { paddingTop: 10 }, children: c.filter((u) => u !== "off").sort(ue).map((u) => /* @__PURE__ */ D(F, { value: u, children: /* @__PURE__ */ D(K, { children: he(u) }) }, u)) })
+              children: /* @__PURE__ */ d(Se, { direction: "column", style: { paddingTop: 10 }, children: l.filter((a) => a !== "off").sort(fe).map((a) => /* @__PURE__ */ d(
+                ve,
+                {
+                  control: /* @__PURE__ */ d(ke, {}),
+                  value: a,
+                  label: me(a)
+                },
+                a
+              )) })
             }
           )
         ] })
       }
     )
-  ] }), /* @__PURE__ */ L("div", { children: [
-    /* @__PURE__ */ L(
+  ] }), /* @__PURE__ */ P("div", { children: [
+    /* @__PURE__ */ P(
       "div",
       {
         style: {
           display: "flex",
           justifyContent: "space-between",
           flexWrap: "wrap",
-          marginTop: s === 0 ? 12 : 0,
-          marginBottom: s === e.channels.length - 1 ? 12 : 0
+          marginTop: i === 0 ? 0 : 12,
+          marginBottom: i === e.channels.length - 1 ? 0 : 12
         },
         children: [
-          /* @__PURE__ */ L(K, { children: [
-            l,
-            " ",
-            r
-          ] }),
-          g
+          /* @__PURE__ */ P(
+            "div",
+            {
+              style: {
+                display: "flex",
+                alignItems: "center",
+                gap: 8
+              },
+              children: [
+                c,
+                /* @__PURE__ */ d(_, { variant: "body1", children: f })
+              ]
+            }
+          ),
+          u
         ]
-      },
-      o
+      }
     ),
-    s !== e.channels.length - 1 && /* @__PURE__ */ D(ke, {})
-  ] }, o);
+    i !== e.channels.length - 1 && /* @__PURE__ */ d(Ve, {})
+  ] }, s);
 }) });
 export {
-  ke as D,
-  Rt as P
+  Go as P,
+  Ae as c
 };