mainstack-design-system 1.23.1 → 1.23.2

package/dist/mainstack-design-system627.js

@@ -1,154 +1,262 @@
 'use client';
-import { jsxs as I, jsx as i } from "react/jsx-runtime";
-import * as s from "react";
-import { forwardRef as M } from "react";
-import { c as H, P, a as j } from "./index-DMumqyNN.js";
-import { u as R } from "./index-DLcqcWxM.js";
-import { u as A } from "./index-437EL2iq.js";
+import { jsx as c, jsxs as L, Fragment as O } from "react/jsx-runtime";
+import * as d from "react";
+import { forwardRef as H } from "react";
+import { u as z } from "./index-DLcqcWxM.js";
+import { c as G, P, a as N } from "./index-DMumqyNN.js";
+import { u as K } from "./index-437EL2iq.js";
 import { u as U } from "./index-BZPx6jYI.js";
-import { u as q } from "./index-BGQepRFJ.js";
-import { c as C } from "./utils-C21jc49d.js";
-var h = "Switch", [z] = H(h), [L, O] = z(h), x = s.forwardRef(
-  (t, r) => {
+import { u as X } from "./index-BGQepRFJ.js";
+import { P as $ } from "./index-BpWB3aFK.js";
+import "./mainstack-design-system370.js";
+import J from "./mainstack-design-system106.js";
+import "./player-DRUnlXe4.js";
+import { c as Q } from "./utils-C21jc49d.js";
+var y = "Checkbox", [V] = G(y), [W, _] = V(y);
+function Y(r) {
+  const {
+    __scopeCheckbox: s,
+    checked: t,
+    children: l,
+    defaultChecked: a,
+    disabled: e,
+    form: p,
+    name: f,
+    onCheckedChange: i,
+    required: h,
+    value: k = "on",
+    // @ts-expect-error
+    internal_do_not_use_render: u
+  } = r, [m, x] = K({
+    prop: t,
+    defaultProp: a ?? !1,
+    onChange: i,
+    caller: y
+  }), [C, v] = d.useState(null), [g, o] = d.useState(null), n = d.useRef(!1), I = C ? !!p || !!C.closest("form") : (
+    // We set this to true by default so that events bubble to forms without JS (SSR)
+    !0
+  ), R = {
+    checked: m,
+    disabled: e,
+    setChecked: x,
+    control: C,
+    setControl: v,
+    name: f,
+    form: p,
+    value: k,
+    hasConsumerStoppedPropagationRef: n,
+    required: h,
+    defaultChecked: b(a) ? !1 : a,
+    isFormControl: I,
+    bubbleInput: g,
+    setBubbleInput: o
+  };
+  return /* @__PURE__ */ c(
+    W,
+    {
+      scope: s,
+      ...R,
+      children: Z(u) ? u(R) : l
+    }
+  );
+}
+var S = "CheckboxTrigger", w = d.forwardRef(
+  ({ __scopeCheckbox: r, onKeyDown: s, onClick: t, ...l }, a) => {
     const {
-      __scopeSwitch: e,
-      name: a,
-      checked: o,
-      defaultChecked: b,
-      required: d,
-      disabled: c,
-      value: u = "on",
-      onCheckedChange: w,
-      form: n,
-      ...v
-    } = t, [l, m] = s.useState(null), S = R(r, (p) => m(p)), g = s.useRef(!1), k = l ? n || !!l.closest("form") : !0, [f, T] = A({
-      prop: o,
-      defaultProp: b ?? !1,
-      onChange: w,
-      caller: h
-    });
-    return /* @__PURE__ */ I(L, { scope: e, checked: f, disabled: c, children: [
-      /* @__PURE__ */ i(
-        P.button,
-        {
-          type: "button",
-          role: "switch",
-          "aria-checked": f,
-          "aria-required": d,
-          "data-state": N(f),
-          "data-disabled": c ? "" : void 0,
-          disabled: c,
-          value: u,
-          ...v,
-          ref: S,
-          onClick: j(t.onClick, (p) => {
-            T((B) => !B), k && (g.current = p.isPropagationStopped(), g.current || p.stopPropagation());
-          })
-        }
-      ),
-      k && /* @__PURE__ */ i(
-        _,
-        {
-          control: l,
-          bubbles: !g.current,
-          name: a,
-          value: u,
-          checked: f,
-          required: d,
-          disabled: c,
-          form: n,
-          style: { transform: "translateX(-100%)" }
-        }
-      )
-    ] });
+      control: e,
+      value: p,
+      disabled: f,
+      checked: i,
+      required: h,
+      setControl: k,
+      setChecked: u,
+      hasConsumerStoppedPropagationRef: m,
+      isFormControl: x,
+      bubbleInput: C
+    } = _(S, r), v = z(a, k), g = d.useRef(i);
+    return d.useEffect(() => {
+      const o = e?.form;
+      if (o) {
+        const n = () => u(g.current);
+        return o.addEventListener("reset", n), () => o.removeEventListener("reset", n);
+      }
+    }, [e, u]), /* @__PURE__ */ c(
+      P.button,
+      {
+        type: "button",
+        role: "checkbox",
+        "aria-checked": b(i) ? "mixed" : i,
+        "aria-required": h,
+        "data-state": j(i),
+        "data-disabled": f ? "" : void 0,
+        disabled: f,
+        value: p,
+        ...l,
+        ref: v,
+        onKeyDown: N(s, (o) => {
+          o.key === "Enter" && o.preventDefault();
+        }),
+        onClick: N(t, (o) => {
+          u((n) => b(n) ? !0 : !n), C && x && (m.current = o.isPropagationStopped(), m.current || o.stopPropagation());
+        })
+      }
+    );
+  }
+);
+w.displayName = S;
+var B = d.forwardRef(
+  (r, s) => {
+    const {
+      __scopeCheckbox: t,
+      name: l,
+      checked: a,
+      defaultChecked: e,
+      required: p,
+      disabled: f,
+      value: i,
+      onCheckedChange: h,
+      form: k,
+      ...u
+    } = r;
+    return /* @__PURE__ */ c(
+      Y,
+      {
+        __scopeCheckbox: t,
+        checked: a,
+        defaultChecked: e,
+        disabled: f,
+        required: p,
+        onCheckedChange: h,
+        name: l,
+        form: k,
+        value: i,
+        internal_do_not_use_render: ({ isFormControl: m }) => /* @__PURE__ */ L(O, { children: [
+          /* @__PURE__ */ c(
+            w,
+            {
+              ...u,
+              ref: s,
+              __scopeCheckbox: t
+            }
+          ),
+          m && /* @__PURE__ */ c(
+            A,
+            {
+              __scopeCheckbox: t
+            }
+          )
+        ] })
+      }
+    );
   }
 );
-x.displayName = h;
-var y = "SwitchThumb", E = s.forwardRef(
-  (t, r) => {
-    const { __scopeSwitch: e, ...a } = t, o = O(y, e);
-    return /* @__PURE__ */ i(
-      P.span,
+B.displayName = y;
+var M = "CheckboxIndicator", T = d.forwardRef(
+  (r, s) => {
+    const { __scopeCheckbox: t, forceMount: l, ...a } = r, e = _(M, t);
+    return /* @__PURE__ */ c(
+      $,
       {
-        "data-state": N(o.checked),
-        "data-disabled": o.disabled ? "" : void 0,
-        ...a,
-        ref: r
+        present: l || b(e.checked) || e.checked === !0,
+        children: /* @__PURE__ */ c(
+          P.span,
+          {
+            "data-state": j(e.checked),
+            "data-disabled": e.disabled ? "" : void 0,
+            ...a,
+            ref: s,
+            style: { pointerEvents: "none", ...r.style }
+          }
+        )
       }
     );
   }
 );
-E.displayName = y;
-var D = "SwitchBubbleInput", _ = s.forwardRef(
-  ({
-    __scopeSwitch: t,
-    control: r,
-    checked: e,
-    bubbles: a = !0,
-    ...o
-  }, b) => {
-    const d = s.useRef(null), c = R(d, b), u = U(e), w = q(r);
-    return s.useEffect(() => {
-      const n = d.current;
+T.displayName = M;
+var q = "CheckboxBubbleInput", A = d.forwardRef(
+  ({ __scopeCheckbox: r, ...s }, t) => {
+    const {
+      control: l,
+      hasConsumerStoppedPropagationRef: a,
+      checked: e,
+      defaultChecked: p,
+      required: f,
+      disabled: i,
+      name: h,
+      value: k,
+      form: u,
+      bubbleInput: m,
+      setBubbleInput: x
+    } = _(q, r), C = z(t, x), v = U(e), g = X(l);
+    d.useEffect(() => {
+      const n = m;
       if (!n) return;
-      const v = window.HTMLInputElement.prototype, m = Object.getOwnPropertyDescriptor(
-        v,
+      const I = window.HTMLInputElement.prototype, E = Object.getOwnPropertyDescriptor(
+        I,
         "checked"
-      ).set;
-      if (u !== e && m) {
-        const S = new Event("click", { bubbles: a });
-        m.call(n, e), n.dispatchEvent(S);
+      ).set, D = !a.current;
+      if (v !== e && E) {
+        const F = new Event("click", { bubbles: D });
+        n.indeterminate = b(e), E.call(n, b(e) ? !1 : e), n.dispatchEvent(F);
       }
-    }, [u, e, a]), /* @__PURE__ */ i(
-      "input",
+    }, [m, v, e, a]);
+    const o = d.useRef(b(e) ? !1 : e);
+    return /* @__PURE__ */ c(
+      P.input,
       {
         type: "checkbox",
         "aria-hidden": !0,
-        defaultChecked: e,
-        ...o,
+        defaultChecked: p ?? o.current,
+        required: f,
+        disabled: i,
+        name: h,
+        value: k,
+        form: u,
+        ...s,
         tabIndex: -1,
-        ref: c,
+        ref: C,
         style: {
-          ...o.style,
-          ...w,
+          ...s.style,
+          ...g,
           position: "absolute",
           pointerEvents: "none",
           opacity: 0,
-          margin: 0
+          margin: 0,
+          // We transform because the input is absolutely positioned but we have
+          // rendered it **after** the button. This pulls it back to sit on top
+          // of the button.
+          transform: "translateX(-100%)"
         }
       }
     );
   }
 );
-_.displayName = D;
-function N(t) {
-  return t ? "checked" : "unchecked";
+A.displayName = q;
+function Z(r) {
+  return typeof r == "function";
+}
+function b(r) {
+  return r === "indeterminate";
 }
-var F = x, W = E;
-const $ = M(
-  ({ className: t, ...r }, e) => /* @__PURE__ */ i(
-    F,
+function j(r) {
+  return b(r) ? "indeterminate" : r ? "checked" : "unchecked";
+}
+const ee = H(
+  ({ className: r, ...s }, t) => /* @__PURE__ */ c(
+    B,
     {
-      "data-slot": "toggle-switch",
-      tabIndex: 0,
-      className: C(
-        "mds:inline-flex mds:items-center mds:shrink-0 mds:relative mds:bg-surface-neutral-l4 mds:rounded-full mds:hover:bg-surface-neutral-l5 mds:focus:outline-2  mds:focus:outline-border-surface-spread-focus mds:aria-checked:bg-interactive-neutral mds:checked:disabled:bg-surface-neutral-l5 mds:disabled:cursor-not-allowed ",
-        t
+      "data-slot": "checkbox-indicator",
+      className: Q(
+        "mds:peer mds:relative mds:flex mds:justify-center mds:items-center mds:cursor-pointer  mds:gap-12 mds:border mds:rounded-6 mds:border-border-interactive-primary mds:bg-on-primary mds:active:transition-transform mds:ease-out-cubic mds:duration-150 mds:active:scale-[0.85] mds:focus:ring-2 mds:active:ring-2 mds:focus:ring-border-surface-spread-neutral mds:active:ring-border-surface-spread-neutral mds:ring-offset-0 mds:size-20 mds:group-data-[checkbox-shape=full-radius]:rounded-full mds:group-data-[error=true]:border-border-surface-error-l1 mds:group-data-[checkbox-size=large]:size-32 mds:group-data-[checkbox-size=extra-small]:size-18 mds:disabled:cursor-not-allowed mds:disabled:bg-interactive-neutral-disabled mds:group-hover:border-border-interactive-neutral-active-hover mds:aria-checked:bg-interactive-neutral mds:disabled:aria-checked:bg-disabled mds:disabled:border-bg-interactive-neutral-disabled ",
+        r
       ),
-      ref: e,
-      ...r,
-      children: /* @__PURE__ */ i(
-        W,
-        {
-          "data-slot": "toggle-thumb",
-          className: C(
-            "mds:block mds:rounded-full mds:bg-surface-neutral-l1 mds:shrink-0 mds:transition-transform mds:shadow-50"
-          )
-        }
-      )
+      ref: t,
+      ...s,
+      children: /* @__PURE__ */ c(T, { children: /* @__PURE__ */ c(J, { className: "mds:size-24 mds:text-on-primary mds:group-data-[checkbox-size=small]:size-16 mds:group-data-[checkbox-size=extra-small]:size-14" }) })
     }
   )
 );
+ee.displayName = "CheckboxIndicator";
 export {
-  $ as ToggleSwitch
+  ee as CheckboxIndicator
 };

package/dist/mainstack-design-system628.cjs

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react/jsx-runtime"),R=require("react"),y=require("./utils-CpiHnfHs.cjs"),q=require("./mainstack-design-system616.cjs"),x=require("./mainstack-design-system403.cjs"),c=require("./DayPickerExtended-B99e0oRB.cjs"),C=require("./mainstack-design-system404.cjs"),i=require("./isValid-D2QhMu7v.cjs");function D(a,r,t){return c.addMonths(a,-1,t)}const u=R.forwardRef(({className:a,...r},t)=>{const[l]=C.useMatchMedia("(min-width: 900px)"),{ref:m,matches:f}=x.useContainerMatchMedia({query:{minWidth:660}}),{value:e,closeOnRangeSelect:h,setActiveMenu:M,onValueChange:o,onOpenChange:s}=q.useDateRangeContext(),g={from:i.isValid(e?.from)?e?.from:void 0,to:i.isValid(e?.to)?e?.to:void 0};return d.jsx("div",{"data-slot":"date-range-calendar",ref:n=>{m.current=n,typeof t=="function"?t(n):typeof t=="object"&&t!==null&&(t.current=n)},className:y.cn("mds:@container mds:min-w-auto mds:min-[900px]:min-w-670",a),children:d.jsx(c.DayPickerExtended,{...r,animate:!0,mode:"range",captionLayout:"dropdown",numberOfMonths:l||f?2:1,navLayout:"around",className:"ms-date-range",selected:g,defaultMonth:i.isValid(e?.from)?e?.from:D(new Date),onSelect:((n,p)=>{o&&(e?.from&&e.to||!e?.from?o({from:p}):(o(n),h&&s&&s(!1))),M(null)})})})});u.displayName="DateRangeCalendar";exports.DateRangeCalendar=u;
+'use client';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),P=require("react"),h=require("./index-5OKsHRWb.cjs"),y=require("./index-_XxjJPRD.cjs"),O=require("./index-C8aODXfJ.cjs"),B=require("./index-DYxWvftI.cjs"),I=require("./index-bSPhqlcX.cjs"),C=require("./utils-CpiHnfHs.cjs");function M(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(r,e,s.get?s:{enumerable:!0,get:()=>t[e]})}}return r.default=t,Object.freeze(r)}const c=M(P);var b="Switch",[H]=h.createContextScope(b),[$,z]=H(b),R=c.forwardRef((t,r)=>{const{__scopeSwitch:e,name:s,checked:o,defaultChecked:g,required:d,disabled:a,value:u="on",onCheckedChange:w,form:i,...v}=t,[l,f]=c.useState(null),S=y.useComposedRefs(r,p=>f(p)),x=c.useRef(!1),k=l?i||!!l.closest("form"):!0,[m,E]=O.useControllableState({prop:o,defaultProp:g??!1,onChange:w,caller:b});return n.jsxs($,{scope:e,checked:m,disabled:a,children:[n.jsx(h.Primitive.button,{type:"button",role:"switch","aria-checked":m,"aria-required":d,"data-state":q(m),"data-disabled":a?"":void 0,disabled:a,value:u,...v,ref:S,onClick:h.composeEventHandlers(t.onClick,p=>{E(N=>!N),k&&(x.current=p.isPropagationStopped(),x.current||p.stopPropagation())})}),k&&n.jsx(T,{control:l,bubbles:!x.current,name:s,value:u,checked:m,required:d,disabled:a,form:i,style:{transform:"translateX(-100%)"}})]})});R.displayName=b;var j="SwitchThumb",_=c.forwardRef((t,r)=>{const{__scopeSwitch:e,...s}=t,o=z(j,e);return n.jsx(h.Primitive.span,{"data-state":q(o.checked),"data-disabled":o.disabled?"":void 0,...s,ref:r})});_.displayName=j;var A="SwitchBubbleInput",T=c.forwardRef(({__scopeSwitch:t,control:r,checked:e,bubbles:s=!0,...o},g)=>{const d=c.useRef(null),a=y.useComposedRefs(d,g),u=B.usePrevious(e),w=I.useSize(r);return c.useEffect(()=>{const i=d.current;if(!i)return;const v=window.HTMLInputElement.prototype,f=Object.getOwnPropertyDescriptor(v,"checked").set;if(u!==e&&f){const S=new Event("click",{bubbles:s});f.call(i,e),i.dispatchEvent(S)}},[u,e,s]),n.jsx("input",{type:"checkbox","aria-hidden":!0,defaultChecked:e,...o,tabIndex:-1,ref:a,style:{...o.style,...w,position:"absolute",pointerEvents:"none",opacity:0,margin:0}})});T.displayName=A;function q(t){return t?"checked":"unchecked"}var D=R,U=_;const L=P.forwardRef(({className:t,...r},e)=>n.jsx(D,{"data-slot":"toggle-switch",tabIndex:0,className:C.cn("mds:inline-flex mds:items-center mds:shrink-0 mds:relative mds:bg-surface-neutral-l4 mds:rounded-full mds:hover:bg-surface-neutral-l5 mds:focus:outline-2  mds:focus:outline-border-surface-spread-focus mds:aria-checked:bg-interactive-neutral mds:checked:disabled:bg-surface-neutral-l5 mds:disabled:cursor-not-allowed ",t),ref:e,...r,children:n.jsx(U,{"data-slot":"toggle-thumb",className:C.cn("mds:block mds:rounded-full mds:bg-surface-neutral-l1 mds:shrink-0 mds:transition-transform mds:shadow-50")})}));exports.ToggleSwitch=L;

package/dist/mainstack-design-system628.js

@@ -1,63 +1,154 @@
-import { jsx as s } from "react/jsx-runtime";
+'use client';
+import { jsxs as I, jsx as i } from "react/jsx-runtime";
+import * as s from "react";
 import { forwardRef as M } from "react";
-import { c as g } from "./utils-C21jc49d.js";
-import { useDateRangeContext as v } from "./mainstack-design-system616.js";
-import { useContainerMatchMedia as y } from "./mainstack-design-system403.js";
-import { a as D, D as w } from "./DayPickerExtended-CE4LjNBz.js";
-import { useMatchMedia as x } from "./mainstack-design-system404.js";
-import { i as r } from "./isValid-BMkD2Abf.js";
-function C(a, m, o) {
-  return D(a, -1, o);
-}
-const R = M(
-  ({ className: a, ...m }, o) => {
-    const [d] = x("(min-width: 900px)"), { ref: f, matches: c } = y({
-      query: { minWidth: 660 }
-    }), {
-      value: e,
-      closeOnRangeSelect: l,
-      setActiveMenu: u,
-      onValueChange: n,
-      onOpenChange: i
-    } = v(), p = {
-      from: r(e?.from) ? e?.from : void 0,
-      to: r(e?.to) ? e?.to : void 0
-    };
-    return /* @__PURE__ */ s(
-      "div",
+import { c as H, P, a as j } from "./index-DMumqyNN.js";
+import { u as R } from "./index-DLcqcWxM.js";
+import { u as A } from "./index-437EL2iq.js";
+import { u as U } from "./index-BZPx6jYI.js";
+import { u as q } from "./index-BGQepRFJ.js";
+import { c as C } from "./utils-C21jc49d.js";
+var h = "Switch", [z] = H(h), [L, O] = z(h), x = s.forwardRef(
+  (t, r) => {
+    const {
+      __scopeSwitch: e,
+      name: a,
+      checked: o,
+      defaultChecked: b,
+      required: d,
+      disabled: c,
+      value: u = "on",
+      onCheckedChange: w,
+      form: n,
+      ...v
+    } = t, [l, m] = s.useState(null), S = R(r, (p) => m(p)), g = s.useRef(!1), k = l ? n || !!l.closest("form") : !0, [f, T] = A({
+      prop: o,
+      defaultProp: b ?? !1,
+      onChange: w,
+      caller: h
+    });
+    return /* @__PURE__ */ I(L, { scope: e, checked: f, disabled: c, children: [
+      /* @__PURE__ */ i(
+        P.button,
+        {
+          type: "button",
+          role: "switch",
+          "aria-checked": f,
+          "aria-required": d,
+          "data-state": N(f),
+          "data-disabled": c ? "" : void 0,
+          disabled: c,
+          value: u,
+          ...v,
+          ref: S,
+          onClick: j(t.onClick, (p) => {
+            T((B) => !B), k && (g.current = p.isPropagationStopped(), g.current || p.stopPropagation());
+          })
+        }
+      ),
+      k && /* @__PURE__ */ i(
+        _,
+        {
+          control: l,
+          bubbles: !g.current,
+          name: a,
+          value: u,
+          checked: f,
+          required: d,
+          disabled: c,
+          form: n,
+          style: { transform: "translateX(-100%)" }
+        }
+      )
+    ] });
+  }
+);
+x.displayName = h;
+var y = "SwitchThumb", E = s.forwardRef(
+  (t, r) => {
+    const { __scopeSwitch: e, ...a } = t, o = O(y, e);
+    return /* @__PURE__ */ i(
+      P.span,
       {
-        "data-slot": "date-range-calendar",
-        ref: (t) => {
-          f.current = t, typeof o == "function" ? o(t) : typeof o == "object" && o !== null && (o.current = t);
-        },
-        className: g(
-          "mds:@container mds:min-w-auto mds:min-[900px]:min-w-670",
-          a
-        ),
-        children: /* @__PURE__ */ s(
-          w,
-          {
-            ...m,
-            animate: !0,
-            mode: "range",
-            captionLayout: "dropdown",
-            numberOfMonths: d || c ? 2 : 1,
-            navLayout: "around",
-            className: "ms-date-range",
-            selected: p,
-            defaultMonth: r(e?.from) ? e?.from : C(/* @__PURE__ */ new Date()),
-            onSelect: ((t, h) => {
-              n && (e?.from && e.to || !e?.from ? n({
-                from: h
-              }) : (n(t), l && i && i(!1))), u(null);
-            })
-          }
-        )
+        "data-state": N(o.checked),
+        "data-disabled": o.disabled ? "" : void 0,
+        ...a,
+        ref: r
       }
     );
   }
 );
-R.displayName = "DateRangeCalendar";
+E.displayName = y;
+var D = "SwitchBubbleInput", _ = s.forwardRef(
+  ({
+    __scopeSwitch: t,
+    control: r,
+    checked: e,
+    bubbles: a = !0,
+    ...o
+  }, b) => {
+    const d = s.useRef(null), c = R(d, b), u = U(e), w = q(r);
+    return s.useEffect(() => {
+      const n = d.current;
+      if (!n) return;
+      const v = window.HTMLInputElement.prototype, m = Object.getOwnPropertyDescriptor(
+        v,
+        "checked"
+      ).set;
+      if (u !== e && m) {
+        const S = new Event("click", { bubbles: a });
+        m.call(n, e), n.dispatchEvent(S);
+      }
+    }, [u, e, a]), /* @__PURE__ */ i(
+      "input",
+      {
+        type: "checkbox",
+        "aria-hidden": !0,
+        defaultChecked: e,
+        ...o,
+        tabIndex: -1,
+        ref: c,
+        style: {
+          ...o.style,
+          ...w,
+          position: "absolute",
+          pointerEvents: "none",
+          opacity: 0,
+          margin: 0
+        }
+      }
+    );
+  }
+);
+_.displayName = D;
+function N(t) {
+  return t ? "checked" : "unchecked";
+}
+var F = x, W = E;
+const $ = M(
+  ({ className: t, ...r }, e) => /* @__PURE__ */ i(
+    F,
+    {
+      "data-slot": "toggle-switch",
+      tabIndex: 0,
+      className: C(
+        "mds:inline-flex mds:items-center mds:shrink-0 mds:relative mds:bg-surface-neutral-l4 mds:rounded-full mds:hover:bg-surface-neutral-l5 mds:focus:outline-2  mds:focus:outline-border-surface-spread-focus mds:aria-checked:bg-interactive-neutral mds:checked:disabled:bg-surface-neutral-l5 mds:disabled:cursor-not-allowed ",
+        t
+      ),
+      ref: e,
+      ...r,
+      children: /* @__PURE__ */ i(
+        W,
+        {
+          "data-slot": "toggle-thumb",
+          className: C(
+            "mds:block mds:rounded-full mds:bg-surface-neutral-l1 mds:shrink-0 mds:transition-transform mds:shadow-50"
+          )
+        }
+      )
+    }
+  )
+);
 export {
-  R as DateRangeCalendar
+  $ as ToggleSwitch
 };

package/dist/mainstack-design-system629.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const C=require("react/jsx-runtime"),G=require("./utils-CpiHnfHs.cjs");require("./mainstack-design-system370.cjs");const B=require("./mainstack-design-system251.cjs");require("react");require("./player-CWqTo6h8.cjs");const T=["AC","AD","AE","AF","AG","AI","AL","AM","AO","AQ","AR","AS","AT","AU","AW","AX","AZ","BA","BB","BD","BE","BF","BG","BH","BI","BJ","BL","BM","BN","BO","BQ-BO","BQ-SA","BQ-SE","BQ","BR","BS","BT","BV","BW","BY","BZ","CA","CC","CD","CF","CG","CH","CI","CK","CL","CM","CN","CO","CR","CU","CV","CW","CX","CY","CZ","DE","DJ","DK","DM","DO","DZ","EC","EE","EG","EH","ER","ES-CT","ES","ET","EU","FI","FJ","FK","FM","FO","FR","GA","GB-ENG","GB-NIR","GB-SCT","GB-WLS","GB","GD","GE","GF","GG","GH","GI","GL","GM","GN","GP","GQ","GR","GS","GT","GU","GW","GY","HK","HM","HN","HR","HT","HU","IC","ID","IE","IL","IM","IN","IO","IQ","IR","IS","IT","JE","JM","JO","JP","KE","KG","KH","KI","KM","KN","KP","KR","KW","KY","KZ","LA","LB","LC","LI","LK","LR","LS","LT","LU","LV","LY","MA","MC","MD","ME","MF","MG","MH","MK","ML","MM","MN","MO","MP","MQ","MR","MS","MT","MU","MV","MW","MX","MY","MZ","NA","NC","NE","NF","NG","NI","NL","NO","NP","NR","NU","NZ","OM","PA","PE","PF","PG","PH","PK","PL","PM","PN","PR","PS","PT","PW","PY","QA","RE","RO","RS","RU","RW","SA","SB","SC","SD","SE","SG","SH","SI","SJ","SK","SL","SM","SN","SO","SR","SS","ST","SV","SX","SY","SZ","TA","TC","TD","TF","TG","TH","TJ","TK","TL","TM","TN","TO","TR","TT","TV","TW","TZ","UA","UG","UM","US","UY","UZ","VA","VC","VE","VG","VI","VN","VU","WF","WS","XA","XC","XK","XO","YE","YT","ZA","ZM","ZW"];function A(M){return T.indexOf(M)>=0}const E=(M,S)=>{const e=C.jsx(B,{className:G.cn("mds:size-20",S)});return!M||!A(M)?e:C.jsx("span",{className:G.cn(`flag:${M}`,"mds:size-20! mds:min-w-20 mds:overflow-hidden mds:rounded-full",S)})};exports.getCountryFlagComp=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react/jsx-runtime"),R=require("react"),y=require("./utils-CpiHnfHs.cjs"),q=require("./mainstack-design-system616.cjs"),x=require("./mainstack-design-system403.cjs"),c=require("./DayPickerExtended-B99e0oRB.cjs"),C=require("./mainstack-design-system404.cjs"),i=require("./isValid-D2QhMu7v.cjs");function D(a,r,t){return c.addMonths(a,-1,t)}const u=R.forwardRef(({className:a,...r},t)=>{const[l]=C.useMatchMedia("(min-width: 900px)"),{ref:m,matches:f}=x.useContainerMatchMedia({query:{minWidth:660}}),{value:e,closeOnRangeSelect:h,setActiveMenu:M,onValueChange:o,onOpenChange:s}=q.useDateRangeContext(),g={from:i.isValid(e?.from)?e?.from:void 0,to:i.isValid(e?.to)?e?.to:void 0};return d.jsx("div",{"data-slot":"date-range-calendar",ref:n=>{m.current=n,typeof t=="function"?t(n):typeof t=="object"&&t!==null&&(t.current=n)},className:y.cn("mds:@container mds:min-w-auto mds:min-[900px]:min-w-670",a),children:d.jsx(c.DayPickerExtended,{...r,animate:!0,mode:"range",captionLayout:"dropdown",numberOfMonths:l||f?2:1,navLayout:"around",className:"ms-date-range",selected:g,defaultMonth:i.isValid(e?.from)?e?.from:D(new Date),onSelect:((n,p)=>{o&&(e?.from&&e.to||!e?.from?o({from:p}):(o(n),h&&s&&s(!1))),M(null)})})})});u.displayName="DateRangeCalendar";exports.DateRangeCalendar=u;