mainstack-design-system 1.14.3 → 1.15.1

package/dist/mainstack-design-system525.js

@@ -1,17 +1,47 @@
-'use client';
-import { jsxs as t, jsx as r } from "react/jsx-runtime";
-import { forwardRef as c } from "react";
-import { TimePickerRoot as p } from "./mainstack-design-system528.js";
-import { TimePickerInputField as f } from "./mainstack-design-system526.js";
-import { TimePickerPortal as P } from "./mainstack-design-system527.js";
-import { TimePickerCalendar as a } from "./mainstack-design-system617.js";
-const d = c(
-  ({ placeholder: i, id: e, ...m }, o) => /* @__PURE__ */ t(p, { ...m, ref: o, children: [
-    /* @__PURE__ */ r(f, { placeholder: i, id: e }),
-    /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(a, {}) })
-  ] })
+import { jsx as c } from "react/jsx-runtime";
+import { forwardRef as f } from "react";
+import "./mainstack-design-system400.js";
+import "./mainstack-design-system401.js";
+import "./mainstack-design-system402.js";
+import "./mainstack-design-system403.js";
+import { Button as p } from "./mainstack-design-system404.js";
+import { useDateRangeContext as l } from "./mainstack-design-system612.js";
+import { c as g } from "./utils-BWBRqOem.js";
+const v = f(
+  ({ onClick: t, className: n, actionData: e, ...i }, a) => {
+    const {
+      activeMenu: m,
+      onOpenChange: o,
+      closeOnRangeSelect: s,
+      onValueChange: r,
+      setActiveMenu: u
+    } = l();
+    return /* @__PURE__ */ c(
+      p,
+      {
+        "data-slot": "date-range-menu-action",
+        ref: a,
+        variant: "outline",
+        rounded: "sm",
+        size: "sm",
+        "data-active": e.id === m,
+        className: g(
+          "mds:data-[active=true]:outline-2 mds:data-[active=true]:outline-border-interactive-neutral-pressed",
+          n
+        ),
+        onClick: (d) => {
+          t && t(d), u(e?.id), r && r({
+            from: e.from,
+            to: e.to,
+            menuAction: e
+          }), s && o && o(!1);
+        },
+        ...i
+      }
+    );
+  }
 );
-d.displayName = "TimePicker";
+v.displayName = "DateRangeMenuAction";
 export {
-  d as TimePicker
+  v as DateRangeMenuAction
 };

package/dist/mainstack-design-system526.cjs

@@ -1,2 +1,2 @@
 'use client';
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react"),a=require("./mainstack-design-system440.cjs"),m=require("./mainstack-design-system441.cjs");require("./mainstack-design-system439.cjs");require("./mainstack-design-system357.cjs");const p=require("./mainstack-design-system264.cjs");require("./player-BBiZ5mNK.cjs");const q=require("./index-4R9KShCu.cjs"),I=require("./mainstack-design-system606.cjs"),x=require("./isValid-Bxc_vb9Y.cjs"),P=require("./format-CIZZXwxT.cjs"),r=d.forwardRef(({placeholder:t="Choose time",...s},n)=>{const{value:i,isDisabled:o,isError:c,isSuccess:u}=I.useTimePickerContext(),l=x.isValid(i)?P.format(i,"hh : mm a"):"";return e.jsx(q.PopoverTrigger,{className:"mds:w-full",children:e.jsxs(a.InputRoot,{"data-slot":"time-picker-input-field",children:[e.jsx(m.InputField,{...s,value:l,placeholder:t,isError:c,isSuccess:u,disabled:o,ref:n,readOnly:!0}),e.jsx(p,{className:"mds:size-20 mds:text-secondary"})]})})});r.displayName="TimePickerInputField";exports.TimePickerInputField=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),i=require("./utils-Dp-J9Ksy.cjs");require("./index-hyBpqx_X.cjs");require("./mainstack-design-system613.cjs");const l=require("./mainstack-design-system630.cjs"),p=require("./mainstack-design-system539.cjs"),v=require("./mainstack-design-system628.cjs");require("./mainstack-design-system541.cjs");const r=n.forwardRef(({children:o,className:s,...a},t)=>e.jsxs(v.ResponsivePopoverDrawerPortal,{children:[e.jsx(l.ResponsivePopoverDrawerContent,{sideOffset:6,"data-slot":"date-range-portal",role:"listbox",className:i.cn("mds:flex mds:flex-col mds:gap-16 mds:bg-surface-neutral-l1 z-100 mds:rounded-20 mds:p-16 mds:border mds:border-border-interactive-neutral mds:shadow-600 mds:min-[900px]:p-24",s),ref:t,...a,children:o}),e.jsx(p.ResponsivePopoverDrawerOverlay,{})]}));r.displayName="DateRangePortal";exports.DateRangePortal=r;

package/dist/mainstack-design-system526.js

@@ -1,38 +1,34 @@
 'use client';
-import { jsx as r, jsxs as l } from "react/jsx-runtime";
-import { forwardRef as d } from "react";
-import { InputRoot as c } from "./mainstack-design-system440.js";
-import { InputField as n } from "./mainstack-design-system441.js";
-import "./mainstack-design-system439.js";
-import "./mainstack-design-system357.js";
-import f from "./mainstack-design-system264.js";
-import "./player-Cs7wtvrg.js";
-import { a as u } from "./index-RoCFhqzC.js";
-import { useTimePickerContext as h } from "./mainstack-design-system606.js";
-import { i as x } from "./isValid-C--KzKY8.js";
-import { f as I } from "./format-Dy4oaflK.js";
-const k = d(
-  ({ placeholder: e = "Choose time", ...o }, m) => {
-    const { value: i, isDisabled: t, isError: s, isSuccess: a } = h(), p = x(i) ? I(i, "hh : mm a") : "";
-    return /* @__PURE__ */ r(u, { className: "mds:w-full", children: /* @__PURE__ */ l(c, { "data-slot": "time-picker-input-field", children: [
-      /* @__PURE__ */ r(
-        n,
-        {
-          ...o,
-          value: p,
-          placeholder: e,
-          isError: s,
-          isSuccess: a,
-          disabled: t,
-          ref: m,
-          readOnly: !0
-        }
-      ),
-      /* @__PURE__ */ r(f, { className: "mds:size-20 mds:text-secondary" })
-    ] }) });
-  }
+import { jsxs as a, jsx as r } from "react/jsx-runtime";
+import { forwardRef as m } from "react";
+import { c as d } from "./utils-BWBRqOem.js";
+import "./index-eeqUt-Tb.js";
+import "./mainstack-design-system613.js";
+import { ResponsivePopoverDrawerContent as p } from "./mainstack-design-system630.js";
+import { ResponsivePopoverDrawerOverlay as i } from "./mainstack-design-system539.js";
+import { ResponsivePopoverDrawerPortal as l } from "./mainstack-design-system628.js";
+import "./mainstack-design-system541.js";
+const n = m(
+  ({ children: o, className: e, ...s }, t) => /* @__PURE__ */ a(l, { children: [
+    /* @__PURE__ */ r(
+      p,
+      {
+        sideOffset: 6,
+        "data-slot": "date-range-portal",
+        role: "listbox",
+        className: d(
+          "mds:flex mds:flex-col mds:gap-16 mds:bg-surface-neutral-l1 z-100 mds:rounded-20 mds:p-16 mds:border mds:border-border-interactive-neutral mds:shadow-600 mds:min-[900px]:p-24",
+          e
+        ),
+        ref: t,
+        ...s,
+        children: o
+      }
+    ),
+    /* @__PURE__ */ r(i, {})
+  ] })
 );
-k.displayName = "TimePickerInputField";
+n.displayName = "DateRangePortal";
 export {
-  k as TimePickerInputField
+  n as DateRangePortal
 };

package/dist/mainstack-design-system527.cjs

@@ -1,2 +1 @@
-'use client';
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),i=require("./index-4R9KShCu.cjs"),l=require("react"),u=require("./utils-Bdd5vx6a.cjs"),p=require("./mainstack-design-system606.cjs"),a=l.forwardRef(({children:n,onWheel:t,onTouchMove:r,className:s,...d},c)=>{const{open:m}=p.useTimePickerContext();return o.jsx(i.PopoverPortal,{children:o.jsx(i.PopoverContent,{"data-slot":"time-picker-portal",role:"listbox",sideOffset:6,"data-date-picker-calendar-opened":m,className:u.cn(" mds:will-change-transform mds:data-[state=open]:animate-content-fade-in mds:z-100 mds:animate-content-fade-out mds:w-310 mds:p-8 mds:rounded-18 mds:bg-surface-neutral-l1 mds:border-border-interactive-neutral mds:border mds:shadow-200 ",s),ref:c,onWheel:e=>{e.stopPropagation(),t&&t(e)},onTouchMove:e=>{e.stopPropagation(),r&&r(e)},...d,children:n})})});a.displayName="TimePickerPortal";exports.TimePickerPortal=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),r=require("react"),a=require("./utils-Dp-J9Ksy.cjs"),p=require("./index-C8aODXfJ.cjs"),j=require("./mainstack-design-system612.cjs");require("./index-hyBpqx_X.cjs");require("./mainstack-design-system613.cjs");require("./mainstack-design-system400.cjs");require("./mainstack-design-system401.cjs");require("./mainstack-design-system402.cjs");require("./mainstack-design-system403.cjs");require("./mainstack-design-system404.cjs");const S=require("./mainstack-design-system540.cjs");require("./mainstack-design-system541.cjs");const y=require("./mainstack-design-system399.cjs"),g=r.forwardRef(({open:R,onOpenChange:f,value:n,onValueChange:m,isDisabled:v=!1,defaultValue:t={from:void 0,to:void 0},closeOnRangeSelect:q=!0,startOfAllTimeDate:o=new Date("2021-10-16"),children:M,className:l,...h},A)=>{const[c,d]=p.useControllableState({prop:R,defaultProp:!1,onChange:f}),C=r.useMemo(()=>{const e=a.getDefaultDateRangeMenuAction(o).find(u=>u.id===n?.menuAction?.id);return e?{from:e.from,to:e.to,menuAction:e}:n},[n,o]),i=r.useMemo(()=>{const e=a.getDefaultDateRangeMenuAction(o).find(u=>u.id===t?.menuAction?.id);return e?{from:e.from,to:e.to,menuAction:e}:t},[t,o]),[D,x]=p.useControllableState({prop:C,defaultProp:i,onChange:m}),[_]=y.useMatchMedia("(min-width: 900px)"),[P,b]=r.useState(()=>n?.menuAction?.id?n?.menuAction?.id:i?.menuAction?.id?i?.menuAction?.id:null);return s.jsx(j.DateRangeContext.Provider,{value:{open:c,isDisabled:v,defaultValue:t,value:D,closeOnRangeSelect:q,activeMenu:P,startOfAllTimeDate:o,setActiveMenu:b,onValueChange:x,onOpenChange:d},children:s.jsx(S.ResponsivePopoverDrawerRoot,{open:c,onOpenChange:d,isDesktop:_,children:s.jsx("div",{...h,ref:A,className:a.cn(l),"data-slot":"date-range-root",children:M})})})});g.displayName="DateRangeRoot";exports.DateRangeRoot=g;

package/dist/mainstack-design-system527.js

@@ -1,43 +1,100 @@
-'use client';
-import { jsx as t } from "react/jsx-runtime";
-import { b as n, c as p } from "./index-RoCFhqzC.js";
-import { forwardRef as c } from "react";
-import { c as l } from "./utils-D85wpvmd.js";
-import { useTimePickerContext as f } from "./mainstack-design-system606.js";
-const P = c(
+import { jsx as a } from "react/jsx-runtime";
+import { forwardRef as S, useMemo as p, useState as b } from "react";
+import { l as s, c as j } from "./utils-BWBRqOem.js";
+import { u as c } from "./index-437EL2iq.js";
+import { DateRangeContext as k } from "./mainstack-design-system612.js";
+import "./index-eeqUt-Tb.js";
+import "./mainstack-design-system613.js";
+import "./mainstack-design-system400.js";
+import "./mainstack-design-system401.js";
+import "./mainstack-design-system402.js";
+import "./mainstack-design-system403.js";
+import "./mainstack-design-system404.js";
+import { ResponsivePopoverDrawerRoot as y } from "./mainstack-design-system540.js";
+import "./mainstack-design-system541.js";
+import { useMatchMedia as q } from "./mainstack-design-system399.js";
+const z = S(
   ({
-    children: a,
-    onWheel: e,
-    onTouchMove: r,
-    className: s,
-    ...m
-  }, d) => {
-    const { open: i } = f();
-    return /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(
-      p,
+    open: d,
+    onOpenChange: f,
+    value: n,
+    onValueChange: g,
+    isDisabled: v = !1,
+    defaultValue: e = {
+      from: void 0,
+      to: void 0
+    },
+    closeOnRangeSelect: h = !0,
+    startOfAllTimeDate: t = /* @__PURE__ */ new Date("2021-10-16"),
+    children: A,
+    className: M,
+    ...C
+  }, R) => {
+    const [m, u] = c({
+      prop: d,
+      defaultProp: !1,
+      onChange: f
+    }), D = p(() => {
+      const o = s(t).find(
+        (r) => r.id === n?.menuAction?.id
+      );
+      return o ? {
+        from: o.from,
+        to: o.to,
+        menuAction: o
+      } : n;
+    }, [n, t]), i = p(() => {
+      const o = s(t).find(
+        (r) => r.id === e?.menuAction?.id
+      );
+      return o ? {
+        from: o.from,
+        to: o.to,
+        menuAction: o
+      } : e;
+    }, [e, t]), [l, w] = c({
+      prop: D,
+      defaultProp: i,
+      onChange: g
+    }), [x] = q("(min-width: 900px)"), [L, P] = b(() => n?.menuAction?.id ? n?.menuAction?.id : i?.menuAction?.id ? i?.menuAction?.id : null);
+    return /* @__PURE__ */ a(
+      k.Provider,
       {
-        "data-slot": "time-picker-portal",
-        role: "listbox",
-        sideOffset: 6,
-        "data-date-picker-calendar-opened": i,
-        className: l(
-          " mds:will-change-transform mds:data-[state=open]:animate-content-fade-in mds:z-100 mds:animate-content-fade-out mds:w-310 mds:p-8 mds:rounded-18 mds:bg-surface-neutral-l1 mds:border-border-interactive-neutral mds:border mds:shadow-200 ",
-          s
-        ),
-        ref: d,
-        onWheel: (o) => {
-          o.stopPropagation(), e && e(o);
+        value: {
+          open: m,
+          isDisabled: v,
+          defaultValue: e,
+          value: l,
+          closeOnRangeSelect: h,
+          activeMenu: L,
+          startOfAllTimeDate: t,
+          setActiveMenu: P,
+          onValueChange: w,
+          onOpenChange: u
         },
-        onTouchMove: (o) => {
-          o.stopPropagation(), r && r(o);
-        },
-        ...m,
-        children: a
+        children: /* @__PURE__ */ a(
+          y,
+          {
+            open: m,
+            onOpenChange: u,
+            isDesktop: x,
+            children: /* @__PURE__ */ a(
+              "div",
+              {
+                ...C,
+                ref: R,
+                className: j(M),
+                "data-slot": "date-range-root",
+                children: A
+              }
+            )
+          }
+        )
       }
-    ) });
+    );
   }
 );
-P.displayName = "TimePickerPortal";
+z.displayName = "DateRangeRoot";
 export {
-  P as TimePickerPortal
+  z as DateRangeRoot
 };

package/dist/mainstack-design-system528.cjs

@@ -1,2 +1 @@
-'use client';
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),k=require("react"),v=require("./mainstack-design-system606.cjs"),f=require("./index-4R9KShCu.cjs"),t=require("./index-C8aODXfJ.cjs"),i=k.forwardRef(({open:a,onOpenChange:c,value:s,onValueChange:l,isDisabled:u=!1,isError:p,isSuccess:d,timeRange:m,defaultValue:o,children:P,...C},g)=>{const[n,r]=t.useControllableState({prop:a,defaultProp:!1,onChange:c}),[h,x]=t.useControllableState({prop:s,defaultProp:o,onChange:l});return e.jsx(v.TimePickerContext.Provider,{value:{open:n,isDisabled:u,isError:p,isSuccess:d,timeRange:m,defaultValue:o,value:h,onValueChange:x,onOpenChange:r},children:e.jsx(f.Popover,{open:n,onOpenChange:r,children:e.jsx("div",{"data-slot":"time-picker-root",ref:g,...C,children:P})})})});i.displayName="TimePickerRoot";exports.TimePickerRoot=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),o=require("react"),s=require("./utils-Dp-J9Ksy.cjs");require("./index-hyBpqx_X.cjs");require("./mainstack-design-system613.cjs");require("./mainstack-design-system400.cjs");require("./mainstack-design-system401.cjs");require("./mainstack-design-system402.cjs");require("./mainstack-design-system403.cjs");require("./mainstack-design-system404.cjs");const n=require("./mainstack-design-system541.cjs"),e=o.forwardRef(({className:r,...i},t)=>a.jsx(n.ResponsivePopoverDrawerTrigger,{ref:t,"data-slot":"date-range-trigger",className:s.cn("",r),...i}));e.displayName="DateRangeTrigger";exports.DateRangeTrigger=e;

package/dist/mainstack-design-system528.js

@@ -1,52 +1,26 @@
-'use client';
-import { jsx as o } from "react/jsx-runtime";
-import { forwardRef as g } from "react";
-import { TimePickerContext as v } from "./mainstack-design-system606.js";
-import { P as k } from "./index-RoCFhqzC.js";
-import { u as a } from "./index-437EL2iq.js";
-const x = g(
-  ({
-    open: t,
-    onOpenChange: p,
-    value: i,
-    onValueChange: m,
-    isDisabled: l = !1,
-    isError: s,
-    isSuccess: f,
-    timeRange: c,
-    defaultValue: e,
-    children: d,
-    ...h
-  }, u) => {
-    const [r, n] = a({
-      prop: t,
-      defaultProp: !1,
-      onChange: p
-    }), [C, P] = a({
-      prop: i,
-      defaultProp: e,
-      onChange: m
-    });
-    return /* @__PURE__ */ o(
-      v.Provider,
-      {
-        value: {
-          open: r,
-          isDisabled: l,
-          isError: s,
-          isSuccess: f,
-          timeRange: c,
-          defaultValue: e,
-          value: C,
-          onValueChange: P,
-          onOpenChange: n
-        },
-        children: /* @__PURE__ */ o(k, { open: r, onOpenChange: n, children: /* @__PURE__ */ o("div", { "data-slot": "time-picker-root", ref: u, ...h, children: d }) })
-      }
-    );
-  }
+import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as i } from "react";
+import { c as m } from "./utils-BWBRqOem.js";
+import "./index-eeqUt-Tb.js";
+import "./mainstack-design-system613.js";
+import "./mainstack-design-system400.js";
+import "./mainstack-design-system401.js";
+import "./mainstack-design-system402.js";
+import "./mainstack-design-system403.js";
+import "./mainstack-design-system404.js";
+import { ResponsivePopoverDrawerTrigger as a } from "./mainstack-design-system541.js";
+const p = i(
+  ({ className: r, ...o }, t) => /* @__PURE__ */ e(
+    a,
+    {
+      ref: t,
+      "data-slot": "date-range-trigger",
+      className: m("", r),
+      ...o
+    }
+  )
 );
-x.displayName = "TimePickerRoot";
+p.displayName = "DateRangeTrigger";
 export {
-  x as TimePickerRoot
+  p as DateRangeTrigger
 };

package/dist/mainstack-design-system529.cjs

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),s=require("./index-hyBpqx_X.cjs"),t=require("./index-4R9KShCu.cjs"),n=require("./mainstack-design-system604.cjs"),i=({...e})=>{const{isDesktop:r}=n.useResponsivePopoverDrawerContext();return r?o.jsx(t.PopoverClose,{"data-slot":"responsive-popover-drawer-close",...e}):o.jsx(s.Drawer.Close,{"data-slot":"responsive-popover-drawer-close",...e})};exports.ResponsivePopoverDrawerClose=i;
+'use client';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),n=require("./mainstack-design-system533.cjs"),s=require("./mainstack-design-system531.cjs"),P=require("./mainstack-design-system532.cjs"),k=require("./mainstack-design-system530.cjs"),r=o.forwardRef(({placeholder:t,id:c,...i},a)=>e.jsxs(n.DatePickerRoot,{...i,ref:a,children:[e.jsx(s.DatePickerInputField,{placeholder:t,id:c}),e.jsx(P.DatePickerPortal,{children:e.jsx(k.DatePickerCalendar,{})})]}));r.displayName="DatePicker";exports.DatePicker=r;

package/dist/mainstack-design-system529.js

@@ -1,19 +1,17 @@
-import { jsx as e } from "react/jsx-runtime";
-import { D as s } from "./index-eeqUt-Tb.js";
-import { e as t } from "./index-RoCFhqzC.js";
-import { useResponsivePopoverDrawerContext as p } from "./mainstack-design-system604.js";
-const m = ({
-  ...o
-}) => {
-  const { isDesktop: r } = p();
-  return r ? /* @__PURE__ */ e(t, { "data-slot": "responsive-popover-drawer-close", ...o }) : /* @__PURE__ */ e(
-    s.Close,
-    {
-      "data-slot": "responsive-popover-drawer-close",
-      ...o
-    }
-  );
-};
+'use client';
+import { jsxs as m, jsx as r } from "react/jsx-runtime";
+import { forwardRef as a } from "react";
+import { DatePickerRoot as c } from "./mainstack-design-system533.js";
+import { DatePickerInputField as p } from "./mainstack-design-system531.js";
+import { DatePickerPortal as f } from "./mainstack-design-system532.js";
+import { DatePickerCalendar as P } from "./mainstack-design-system530.js";
+const d = a(
+  ({ placeholder: e, id: o, ...t }, i) => /* @__PURE__ */ m(c, { ...t, ref: i, children: [
+    /* @__PURE__ */ r(p, { placeholder: e, id: o }),
+    /* @__PURE__ */ r(f, { children: /* @__PURE__ */ r(P, {}) })
+  ] })
+);
+d.displayName = "DatePicker";
 export {
-  m as ResponsivePopoverDrawerClose
+  d as DatePicker
 };

package/dist/mainstack-design-system53.cjs

@@ -1 +1 @@
-"use strict";const C=require("react/jsx-runtime"),s=require("./mainstack-design-system357.cjs"),e=({...r})=>C.jsx(s,{...r,children:C.jsx("g",{mask:"url(#mask0_392_1415)",children:C.jsx("path",{d:"M11.25 12.75H6.25C6.0375 12.75 5.85942 12.6781 5.71575 12.5342C5.57192 12.3904 5.5 12.2122 5.5 11.9997C5.5 11.7871 5.57192 11.609 5.71575 11.4655C5.85942 11.3218 6.0375 11.25 6.25 11.25H11.25V6.25C11.25 6.0375 11.3219 5.85942 11.4658 5.71575C11.6096 5.57192 11.7878 5.5 12.0003 5.5C12.2129 5.5 12.391 5.57192 12.5345 5.71575C12.6782 5.85942 12.75 6.0375 12.75 6.25V11.25H17.75C17.9625 11.25 18.1406 11.3219 18.2843 11.4658C18.4281 11.6096 18.5 11.7878 18.5 12.0003C18.5 12.2129 18.4281 12.391 18.2843 12.5345C18.1406 12.6782 17.9625 12.75 17.75 12.75H12.75V17.75C12.75 17.9625 12.6781 18.1406 12.5342 18.2843C12.3904 18.4281 12.2122 18.5 11.9997 18.5C11.7871 18.5 11.609 18.4281 11.4655 18.2843C11.3218 18.1406 11.25 17.9625 11.25 17.75V12.75Z",fill:"currentColor"})})});module.exports=e;
+"use strict";const C=require("react/jsx-runtime"),s=require("./mainstack-design-system366.cjs"),e=({...r})=>C.jsx(s,{...r,children:C.jsx("g",{mask:"url(#mask0_392_1415)",children:C.jsx("path",{d:"M11.25 12.75H6.25C6.0375 12.75 5.85942 12.6781 5.71575 12.5342C5.57192 12.3904 5.5 12.2122 5.5 11.9997C5.5 11.7871 5.57192 11.609 5.71575 11.4655C5.85942 11.3218 6.0375 11.25 6.25 11.25H11.25V6.25C11.25 6.0375 11.3219 5.85942 11.4658 5.71575C11.6096 5.57192 11.7878 5.5 12.0003 5.5C12.2129 5.5 12.391 5.57192 12.5345 5.71575C12.6782 5.85942 12.75 6.0375 12.75 6.25V11.25H17.75C17.9625 11.25 18.1406 11.3219 18.2843 11.4658C18.4281 11.6096 18.5 11.7878 18.5 12.0003C18.5 12.2129 18.4281 12.391 18.2843 12.5345C18.1406 12.6782 17.9625 12.75 17.75 12.75H12.75V17.75C12.75 17.9625 12.6781 18.1406 12.5342 18.2843C12.3904 18.4281 12.2122 18.5 11.9997 18.5C11.7871 18.5 11.609 18.4281 11.4655 18.2843C11.3218 18.1406 11.25 17.9625 11.25 17.75V12.75Z",fill:"currentColor"})})});module.exports=e;

package/dist/mainstack-design-system53.js

@@ -1,5 +1,5 @@
 import { jsx as C } from "react/jsx-runtime";
-import o from "./mainstack-design-system357.js";
+import o from "./mainstack-design-system366.js";
 const l = ({ ...r }) => /* @__PURE__ */ C(o, { ...r, children: /* @__PURE__ */ C("g", { mask: "url(#mask0_392_1415)", children: /* @__PURE__ */ C(
   "path",
   {

package/dist/mainstack-design-system530.cjs

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("./index-hyBpqx_X.cjs"),a=require("./mainstack-design-system604.cjs"),n=require("./utils-Bdd5vx6a.cjs"),i=({className:e,...s})=>{const{isDesktop:r}=a.useResponsivePopoverDrawerContext();return r?null:t.jsx(o.Drawer.Overlay,{"data-slot":"responsive-popover-drawer-overlay",className:n.cn("mds:data-[state=open]:animate-content-fade-in mds:data-[state=closed]:animate-content-fade-out mds:data-[state=closed]:fade-out-0 mds:data-[state=open]:fade-in-0 mds:fixed mds:inset-0 mds:z-50 mds:bg-primary/50",e),...s})};exports.ResponsivePopoverDrawerOverlay=i;
+'use client';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),u=require("react"),k=require("./utils-Dp-J9Ksy.cjs"),m=require("./mainstack-design-system614.cjs"),p=require("./DayPickerExtended-jGF2z2wR.cjs"),n=require("./isValid-C_6xxmQu.cjs"),i=u.forwardRef(({className:r,...s},o)=>{const{value:e,isDisabled:c,onValueChange:a,onOpenChange:d}=m.useDatePickerContext();return t.jsx("div",{"data-slot":"date-picker-calendar",className:k.cn("@container",r),ref:o,children:t.jsx(p.DayPickerExtended,{animate:!0,mode:"single",captionLayout:"dropdown",numberOfMonths:1,navLayout:"around",disabled:c,defaultMonth:n.isValid(e)?e:void 0,className:"ms-single-date-picker",selected:n.isValid(e)?e:void 0,onSelect:(l=>{a&&a(l),d(!1)}),...s})})});i.displayName="DatePickerCalendar";exports.DatePickerCalendar=i;

package/dist/mainstack-design-system530.js

@@ -1,24 +1,42 @@
+'use client';
 import { jsx as o } from "react/jsx-runtime";
-import { D as s } from "./index-eeqUt-Tb.js";
-import { useResponsivePopoverDrawerContext as r } from "./mainstack-design-system604.js";
-import { c as d } from "./utils-D85wpvmd.js";
-const f = ({
-  className: e,
-  ...t
-}) => {
-  const { isDesktop: a } = r();
-  return a ? null : /* @__PURE__ */ o(
-    s.Overlay,
-    {
-      "data-slot": "responsive-popover-drawer-overlay",
-      className: d(
-        "mds:data-[state=open]:animate-content-fade-in mds:data-[state=closed]:animate-content-fade-out mds:data-[state=closed]:fade-out-0 mds:data-[state=open]:fade-in-0 mds:fixed mds:inset-0 mds:z-50 mds:bg-primary/50",
-        e
-      ),
-      ...t
-    }
-  );
-};
+import { forwardRef as m } from "react";
+import { c } from "./utils-BWBRqOem.js";
+import { useDatePickerContext as p } from "./mainstack-design-system614.js";
+import { D as f } from "./DayPickerExtended-MILNFejG.js";
+import { i as r } from "./isValid-CCvavKVT.js";
+const u = m(
+  ({ className: t, ...i }, n) => {
+    const { value: e, isDisabled: d, onValueChange: a, onOpenChange: s } = p();
+    return /* @__PURE__ */ o(
+      "div",
+      {
+        "data-slot": "date-picker-calendar",
+        className: c("@container", t),
+        ref: n,
+        children: /* @__PURE__ */ o(
+          f,
+          {
+            animate: !0,
+            mode: "single",
+            captionLayout: "dropdown",
+            numberOfMonths: 1,
+            navLayout: "around",
+            disabled: d,
+            defaultMonth: r(e) ? e : void 0,
+            className: "ms-single-date-picker",
+            selected: r(e) ? e : void 0,
+            onSelect: ((l) => {
+              a && a(l), s(!1);
+            }),
+            ...i
+          }
+        )
+      }
+    );
+  }
+);
+u.displayName = "DatePickerCalendar";
 export {
-  f as ResponsivePopoverDrawerOverlay
+  u as DatePickerCalendar
 };

package/dist/mainstack-design-system531.cjs

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),l=require("./index-C8aODXfJ.cjs"),c=require("./index-hyBpqx_X.cjs"),d=require("./index-4R9KShCu.cjs"),t=require("./mainstack-design-system604.cjs");require("react");const x=require("./mainstack-design-system390.cjs"),P=({open:i,onOpenChange:p,isDesktop:a=null,breakpoint:v,...n})=>{const[u]=x.useMatchMedia(v||"(min-width: 768px)"),s=a??u,[e,o]=l.useControllableState({prop:i,defaultProp:!1,onChange:p});return s?r.jsx(t.ResponsivePopoverDrawerContext.Provider,{value:{open:e,onOpenChange:o,isDesktop:s},children:r.jsx(d.Popover,{"data-slot":"responsive-popover-drawer-root",open:e,onOpenChange:o,...n})}):r.jsx(t.ResponsivePopoverDrawerContext.Provider,{value:{open:e,onOpenChange:o,isDesktop:s},children:r.jsx(c.Root,{"data-slot":"responsive-popover-drawer-root",open:e,onOpenChange:o,...n})})};exports.ResponsivePopoverDrawerRoot=P;
+'use client';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react"),l=require("./mainstack-design-system449.cjs"),p=require("./mainstack-design-system450.cjs");require("./mainstack-design-system448.cjs");require("./mainstack-design-system366.cjs");const m=require("./mainstack-design-system86.cjs");require("./player-BoD_1Mo-.cjs");const q=require("./index-4R9KShCu.cjs"),I=require("./mainstack-design-system614.cjs"),x=require("./isValid-C_6xxmQu.cjs"),y=require("./format-55eCeDIa.cjs"),r=d.forwardRef(({placeholder:s="Choose a date",...i},n)=>{const{value:t,isDisabled:o,isError:c,isSuccess:u}=I.useDatePickerContext(),a=x.isValid(t)?y.format(t,"dd - MM - yyyy"):"";return e.jsx(q.PopoverTrigger,{className:"mds:w-full",children:e.jsxs(l.InputRoot,{"data-slot":"date-picker-input-field",children:[e.jsx(p.InputField,{value:a,placeholder:s,isError:c,isSuccess:u,disabled:o,readOnly:!0,ref:n,...i}),e.jsx(m,{className:"mds:size-20 mds:text-secondary"})]})})});r.displayName="DatePickerInputField";exports.DatePickerInputField=r;

package/dist/mainstack-design-system531.js

@@ -1,52 +1,38 @@
-import { jsx as r } from "react/jsx-runtime";
-import { u as v } from "./index-437EL2iq.js";
-import { R as d } from "./index-eeqUt-Tb.js";
-import { P as f } from "./index-RoCFhqzC.js";
-import { ResponsivePopoverDrawerContext as n } from "./mainstack-design-system604.js";
-import "react";
-import { useMatchMedia as u } from "./mainstack-design-system390.js";
-const k = ({
-  open: s,
-  onOpenChange: a,
-  isDesktop: i = null,
-  breakpoint: m,
-  ...p
-}) => {
-  const [l] = u(m || "(min-width: 768px)"), t = i ?? l, [o, e] = v({
-    prop: s,
-    defaultProp: !1,
-    onChange: a
-  });
-  return t ? /* @__PURE__ */ r(
-    n.Provider,
-    {
-      value: { open: o, onOpenChange: e, isDesktop: t },
-      children: /* @__PURE__ */ r(
-        f,
+'use client';
+import { jsx as r, jsxs as p } from "react/jsx-runtime";
+import { forwardRef as l } from "react";
+import { InputRoot as n } from "./mainstack-design-system449.js";
+import { InputField as c } from "./mainstack-design-system450.js";
+import "./mainstack-design-system448.js";
+import "./mainstack-design-system366.js";
+import f from "./mainstack-design-system86.js";
+import "./player-DtDfxekb.js";
+import { a as u } from "./index-RoCFhqzC.js";
+import { useDatePickerContext as y } from "./mainstack-design-system614.js";
+import { i as x } from "./isValid-CCvavKVT.js";
+import { f as I } from "./format-BmhnB-4s.js";
+const h = l(
+  ({ placeholder: e = "Choose a date", ...t }, i) => {
+    const { value: o, isDisabled: a, isError: s, isSuccess: m } = y(), d = x(o) ? I(o, "dd - MM - yyyy") : "";
+    return /* @__PURE__ */ r(u, { className: "mds:w-full", children: /* @__PURE__ */ p(n, { "data-slot": "date-picker-input-field", children: [
+      /* @__PURE__ */ r(
+        c,
         {
-          "data-slot": "responsive-popover-drawer-root",
-          open: o,
-          onOpenChange: e,
-          ...p
+          value: d,
+          placeholder: e,
+          isError: s,
+          isSuccess: m,
+          disabled: a,
+          readOnly: !0,
+          ref: i,
+          ...t
         }
-      )
-    }
-  ) : /* @__PURE__ */ r(
-    n.Provider,
-    {
-      value: { open: o, onOpenChange: e, isDesktop: t },
-      children: /* @__PURE__ */ r(
-        d,
-        {
-          "data-slot": "responsive-popover-drawer-root",
-          open: o,
-          onOpenChange: e,
-          ...p
-        }
-      )
-    }
-  );
-};
+      ),
+      /* @__PURE__ */ r(f, { className: "mds:size-20 mds:text-secondary" })
+    ] }) });
+  }
+);
+h.displayName = "DatePickerInputField";
 export {
-  k as ResponsivePopoverDrawerRoot
+  h as DatePickerInputField
 };

package/dist/mainstack-design-system532.cjs

@@ -1 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),t=require("./index-hyBpqx_X.cjs"),n=require("./index-4R9KShCu.cjs"),p=require("react"),a=require("./mainstack-design-system604.cjs"),s=p.forwardRef(({...e},r)=>{const{isDesktop:i}=a.useResponsivePopoverDrawerContext();return i?o.jsx(n.PopoverTrigger,{"data-slot":"responsive-popover-drawer-trigger",ref:r,...e}):o.jsx(t.Drawer.Trigger,{"data-slot":"responsive-popover-drawer-trigger",ref:r,...e})});s.displayName="ResponsivePopoverDrawerTrigger";exports.ResponsivePopoverDrawerTrigger=s;
+'use client';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),o=require("./index-4R9KShCu.cjs"),m=require("react"),u=require("./utils-Dp-J9Ksy.cjs"),p=require("./mainstack-design-system614.cjs"),n=m.forwardRef(({children:s,onWheel:t,onTouchMove:r,className:d,...i},c)=>{const{open:l}=p.useDatePickerContext();return a.jsx(o.PopoverPortal,{children:a.jsx(o.PopoverContent,{"data-slot":"date-picker-portal",role:"listbox",sideOffset:6,"data-date-picker-calendar-opened":l,className:u.cn(" mds:will-change-transform mds:data-[state=open]:animate-content-fade-in mds:z-100 mds:animate-content-fade-out mds:w-310 mds:p-8 mds:rounded-18 mds:bg-surface-neutral-l1 mds:border-border-interactive-neutral mds:border mds:shadow-200 ",d),onWheel:e=>{e.stopPropagation(),t&&t(e)},onTouchMove:e=>{e.stopPropagation(),r&&r(e)},ref:c,...i,children:s})})});n.displayName="DatePickerPortal";exports.DatePickerPortal=n;