design-system-next 2.7.40 → 2.7.41

package/dist/design-system-next.js

@@ -1702,15 +1702,15 @@ function Jo(e, t = {}) {
     var w, M, j, G;
     if (!d)
       return;
-    const te = Le(e);
-    if (!te)
+    const ee = Le(e);
+    if (!ee)
       return;
-    (j = te instanceof Document ? d.document.body : te) == null || j.scrollTo({
+    (j = ee instanceof Document ? d.document.body : ee) == null || j.scrollTo({
       top: (w = Le(k)) != null ? w : f.value,
       left: (M = Le(x)) != null ? M : h.value,
       behavior: Le(u)
     });
-    const R = ((G = te == null ? void 0 : te.document) == null ? void 0 : G.documentElement) || (te == null ? void 0 : te.documentElement) || te;
+    const R = ((G = ee == null ? void 0 : ee.document) == null ? void 0 : G.documentElement) || (ee == null ? void 0 : ee.documentElement) || ee;
     h != null && (p.value = R.scrollLeft), f != null && (C.value = R.scrollTop);
   }
   const b = V(!1), m = H2({
@@ -1731,8 +1731,8 @@ function Jo(e, t = {}) {
       return;
     const w = ((k = x == null ? void 0 : x.document) == null ? void 0 : k.documentElement) || (x == null ? void 0 : x.documentElement) || Fe(x), { display: M, flexDirection: j } = getComputedStyle(w), G = w.scrollLeft;
     N.left = G < p.value, N.right = G > p.value;
-    const te = Math.abs(G) <= (o.left || 0), R = Math.abs(G) + w.clientWidth >= w.scrollWidth - (o.right || 0) - $r;
-    M === "flex" && j === "row-reverse" ? (m.left = R, m.right = te) : (m.left = te, m.right = R), p.value = G;
+    const ee = Math.abs(G) <= (o.left || 0), R = Math.abs(G) + w.clientWidth >= w.scrollWidth - (o.right || 0) - $r;
+    M === "flex" && j === "row-reverse" ? (m.left = R, m.right = ee) : (m.left = ee, m.right = R), p.value = G;
     let _ = w.scrollTop;
     x === d.document && !_ && (_ = d.document.body.scrollTop), N.top = _ < C.value, N.bottom = _ > C.value;
     const F = Math.abs(_) <= (o.top || 0), z = Math.abs(_) + w.clientHeight >= w.scrollHeight - (o.bottom || 0) - $r;
@@ -3272,7 +3272,7 @@ const l1 = (e) => ({
     }, h = Rt(s), f = Bt(h), v = await o.getDimensions(d), b = h === "y", m = b ? "top" : "left", N = b ? "bottom" : "right", D = b ? "clientHeight" : "clientWidth", S = a.reference[f] + a.reference[h] - C[h] - a.floating[f], L = C[h] - a.reference[h], $ = await (o.getOffsetParent == null ? void 0 : o.getOffsetParent(d));
     let x = $ ? $[D] : 0;
     (!x || !await (o.isElement == null ? void 0 : o.isElement($))) && (x = l.floating[D] || a.floating[f]);
-    const k = S / 2 - L / 2, w = x / 2 - v[f] / 2 - 1, M = W2(p[m], w), j = W2(p[N], w), G = M, te = x - v[f] - j, R = x / 2 - v[f] / 2 + k, _ = yt(G, R, te), F = !u.arrow && Be(s) != null && R !== _ && a.reference[f] / 2 - (R < G ? M : j) - v[f] / 2 < 0, z = F ? R < G ? R - G : R - te : 0;
+    const k = S / 2 - L / 2, w = x / 2 - v[f] / 2 - 1, M = W2(p[m], w), j = W2(p[N], w), G = M, ee = x - v[f] - j, R = x / 2 - v[f] / 2 + k, _ = yt(G, R, ee), F = !u.arrow && Be(s) != null && R !== _ && a.reference[f] / 2 - (R < G ? M : j) - v[f] / 2 < 0, z = F ? R < G ? R - G : R - ee : 0;
     return {
       [h]: C[h] + z,
       data: {
@@ -3335,7 +3335,7 @@ const u1 = function(e) {
         const j = Be(M.placement);
         return [M.placement, j && c ? (
           // Check along the mainAxis and main crossAxis side.
-          M.overflows.slice(0, 2).reduce((G, te) => G + te, 0)
+          M.overflows.slice(0, 2).reduce((G, ee) => G + ee, 0)
         ) : (
           // Check only the mainAxis.
           M.overflows[0]
@@ -3409,8 +3409,8 @@ const u1 = function(e) {
         if (!F)
           switch (h) {
             case "bestFit": {
-              var te;
-              const z = (te = M.filter((Y) => {
+              var ee;
+              const z = (ee = M.filter((Y) => {
                 if ($) {
                   const B = M2(Y.placement);
                   return B === N || // Create a bias to the `y` side axis due to horizontal
@@ -3418,7 +3418,7 @@ const u1 = function(e) {
                   B === "y";
                 }
                 return !0;
-              }).map((Y) => [Y.placement, Y.overflows.filter((B) => B > 0).reduce((B, J) => B + J, 0)]).sort((Y, B) => Y[1] - B[1])[0]) == null ? void 0 : te[0];
+              }).map((Y) => [Y.placement, Y.overflows.filter((B) => B > 0).reduce((B, J) => B + J, 0)]).sort((Y, B) => Y[1] - B[1])[0]) == null ? void 0 : ee[0];
               z && (F = z);
               break;
             }
@@ -3566,8 +3566,8 @@ const g1 = function(e) {
       const N = v - c.top - c.bottom, D = f - c.left - c.right, S = W2(v - c[b], N), L = W2(f - c[m], D), $ = !t.middlewareData.shift;
       let x = S, k = L;
       if ((r = t.middlewareData.shift) != null && r.enabled.x && (k = D), (n = t.middlewareData.shift) != null && n.enabled.y && (x = N), $ && !C) {
-        const M = p2(c.left, 0), j = p2(c.right, 0), G = p2(c.top, 0), te = p2(c.bottom, 0);
-        h ? k = f - 2 * (M !== 0 || j !== 0 ? M + j : p2(c.left, c.right)) : x = v - 2 * (G !== 0 || te !== 0 ? G + te : p2(c.top, c.bottom));
+        const M = p2(c.left, 0), j = p2(c.right, 0), G = p2(c.top, 0), ee = p2(c.bottom, 0);
+        h ? k = f - 2 * (M !== 0 || j !== 0 ? M + j : p2(c.left, c.right)) : x = v - 2 * (G !== 0 || ee !== 0 ? G + ee : p2(c.top, c.bottom));
       }
       await u({
         ...t,
@@ -5917,7 +5917,7 @@ const ze = F1, Y2 = B1, R1 = ["A-Z", "Z-A", "default"], Q1 = {
       var z;
       _ = ((z = _.find((Y) => F === Y.value)) == null ? void 0 : z.sublevel) ?? [];
     }), !(_.length > 0);
-  }, te = () => {
+  }, ee = () => {
     var z, Y;
     if (!h.value.length) return;
     const R = f.value;
@@ -5955,11 +5955,11 @@ const ze = F1, Y2 = B1, R1 = ["A-Z", "Z-A", "default"], Q1 = {
       }) : typeof B.value == "number" ? _.some((J) => J.original === B.value || J.string === String(B.value)) : F.includes(String(B.value)));
   };
   return Me(c, () => {
-    te();
+    ee();
   }), Me(h, () => {
-    te();
+    ee();
   }), e2(() => {
-    D(), f.value.length > 0 && te();
+    D(), f.value.length > 0 && ee();
   }), {
     dropdownPopperState: b,
     dropdownRef: p,
@@ -6609,9 +6609,9 @@ function a3() {
         }, _.toString = function() {
           return this.$d.toUTCString();
         }, R;
-      }(), te = G.prototype;
-      return M.prototype = te, [["$ms", a], ["$s", o], ["$m", l], ["$H", u], ["$W", d], ["$M", p], ["$y", h], ["$D", f]].forEach(function(R) {
-        te[R[1]] = function(_) {
+      }(), ee = G.prototype;
+      return M.prototype = ee, [["$ms", a], ["$s", o], ["$m", l], ["$H", u], ["$W", d], ["$M", p], ["$y", h], ["$D", f]].forEach(function(R) {
+        ee[R[1]] = function(_) {
           return this.$g(_, R[0], R[1]);
         };
       }), M.extend = function(R, _) {
@@ -6670,7 +6670,7 @@ const le = /* @__PURE__ */ B0(o3), i3 = (e, t) => {
   const k = P(() => {
     const w = O(" spr-border spr-border-color-weak spr-border-solid"), M = O(
       "spr-bg-color-weak spr-flex spr-w-full spr-items-center spr-justify-between spr-border-x-0 spr-border-b spr-border-t-0 spr-p-size-spacing-sm"
-    ), j = O("spr-divide-color-weak spr-divide-x-0 spr-divide-y spr-divide-solid"), G = O("spr-grid spr-grid-cols-4 spr-gap-size-spacing-2xs spr-p-size-spacing-xs"), te = O(
+    ), j = O("spr-divide-color-weak spr-divide-x-0 spr-divide-y spr-divide-solid"), G = O("spr-grid spr-grid-cols-4 spr-gap-size-spacing-2xs spr-p-size-spacing-xs"), ee = O(
       "spr-table spr-w-full spr-table-fixed spr-border-collapse spr-border-spacing-0 spr-overflow-hidden spr-rounded-border"
     ), R = O(
       "spr-body-xs-regular-medium spr-border-x spr-border-y spr-p-size-spacing-xs spr-text-left first:spr-border-l-0 spr-overflow-hidden"
@@ -6684,7 +6684,7 @@ const le = /* @__PURE__ */ B0(o3), i3 = (e, t) => {
       headerWrapper: M,
       contentWrapper: j,
       calendarFilter: G,
-      calendarTable: te,
+      calendarTable: ee,
       tableHeaderEmployeeName: R,
       tableHeader: _,
       headerContent: F,
@@ -6949,12 +6949,12 @@ const le = /* @__PURE__ */ B0(o3), i3 = (e, t) => {
                       i(c).borderClasses,
                       "spr-content-start spr-space-y-size-spacing-3xs spr-border-x spr-border-b-0 spr-border-t spr-p-size-spacing-sm last:spr-border-r-0"
                     ]),
-                    onMouseover: (te) => i(L)(!0, G, M.id),
-                    onMouseleave: (te) => i(L)(!1, G, M.id)
+                    onMouseover: (ee) => i(L)(!0, G, M.id),
+                    onMouseleave: (ee) => i(L)(!1, G, M.id)
                   }, [
                     M.schedule[i(v)(j, i(f))] && M.schedule[i(v)(j, i(f))].length > 0 ? (g(), y("section", v3, [
-                      (g(!0), y(q, null, de(M.schedule[i(v)(j, i(f))], (te, R) => (g(), y("div", { key: R }, [
-                        te.type === "restday" ? (g(), y("div", {
+                      (g(!0), y(q, null, de(M.schedule[i(v)(j, i(f))], (ee, R) => (g(), y("div", { key: R }, [
+                        ee.type === "restday" ? (g(), y("div", {
                           key: 0,
                           onClick: (_) => i(S)({
                             employeeId: M.id,
@@ -6968,14 +6968,14 @@ const le = /* @__PURE__ */ B0(o3), i3 = (e, t) => {
                           onClick: (_) => i(S)({
                             employeeId: M.id,
                             date: i(v)(j, i(f)),
-                            shift: te
+                            shift: ee
                           })
                         }, [
                           U(h0, {
                             "view-only": !1,
-                            title: `${te.startTime} - ${te.endTime}`,
-                            description: te.location,
-                            "sub-description": te.type
+                            title: `${ee.startTime} - ${ee.endTime}`,
+                            description: ee.location,
+                            "sub-description": ee.type
                           }, null, 8, ["title", "description", "sub-description"])
                         ], 8, b3))
                       ]))), 128))
@@ -6985,7 +6985,7 @@ const le = /* @__PURE__ */ B0(o3), i3 = (e, t) => {
                         status: "pending",
                         type: "exempt",
                         "view-only": !1,
-                        onOnClick: (te) => i(S)({ employeeId: M.id, date: i(v)(j, i(f)), shift: null })
+                        onOnClick: (ee) => i(S)({ employeeId: M.id, date: i(v)(j, i(f)), shift: null })
                       }, {
                         prefix: Q(() => [
                           U(i(Z), { icon: "ph:plus" })
@@ -7410,7 +7410,7 @@ const n4 = (e, t) => {
         // Readonly State
         "spr-cursor-default": s.value
       }
-    ), ee = O(
+    ), te = O(
       "spr-h-full spr-border-none spr-bg-transparent spr-outline-none",
       "spr-font-size-200",
       "placeholder:spr-text-color-weak",
@@ -7444,7 +7444,7 @@ const n4 = (e, t) => {
     return {
       labelClasses: E,
       datePickerBaseInputClasses: W,
-      datePickerInputClasses: ee,
+      datePickerInputClasses: te,
       datePickerInputHelperClasses: ce,
       calendarTabItemsBaseClasses: Ne,
       monthsTabItemsBaseClasses: Ae,
@@ -7470,9 +7470,9 @@ const n4 = (e, t) => {
     () => le().year(M.value.selectedYear).month(M.value.selectedMonth).isSame(le().year(l.value.min).month(0), "month")
   ), G = P(
     () => le().year(M.value.selectedYear).month(M.value.selectedMonth).isSame(le().year(l.value.max).month(11), "month")
-  ), te = () => {
-    const E = le().year(M.value.selectedYear).month(M.value.selectedMonth).startOf("month").day(), W = le().year(M.value.selectedYear).month(M.value.selectedMonth).endOf("month").date(), ee = E, ce = ee + W, Ne = ce % 7 === 0 ? 0 : 7 - ce % 7, Ae = [];
-    for (let je = ee; je > 0; je--) {
+  ), ee = () => {
+    const E = le().year(M.value.selectedYear).month(M.value.selectedMonth).startOf("month").day(), W = le().year(M.value.selectedYear).month(M.value.selectedMonth).endOf("month").date(), te = E, ce = te + W, Ne = ce % 7 === 0 ? 0 : 7 - ce % 7, Ae = [];
+    for (let je = te; je > 0; je--) {
       const k2 = le().year(M.value.selectedYear).month(M.value.selectedMonth).date(-je + 1);
       Ae.push({ date: k2, inactive: !0 });
     }
@@ -7488,29 +7488,29 @@ const n4 = (e, t) => {
   }, R = () => {
     if (j.value) return;
     const E = le().year(M.value.selectedYear).month(M.value.selectedMonth).subtract(1, "month");
-    M.value.selectedMonth = E.month(), M.value.selectedYear = E.year(), te();
+    M.value.selectedMonth = E.month(), M.value.selectedYear = E.year(), ee();
   }, _ = () => {
     if (G.value) return;
     const E = le().year(M.value.selectedYear).month(M.value.selectedMonth).add(1, "month");
-    M.value.selectedMonth = E.month(), M.value.selectedYear = E.year(), te();
+    M.value.selectedMonth = E.month(), M.value.selectedYear = E.year(), ee();
   }, F = (E) => {
-    const W = u.value.map((ee) => {
+    const W = u.value.map((te) => {
       var ce;
-      return (ce = S.value.find((Ne) => Ne.text.toLowerCase() === ee.toLowerCase())) == null ? void 0 : ce.dayValue;
+      return (ce = S.value.find((Ne) => Ne.text.toLowerCase() === te.toLowerCase())) == null ? void 0 : ce.dayValue;
     });
     return J(E) ? !1 : !!W.includes(E.date.getDay());
   }, z = (E) => E.date.toDateString() === D.value.format("ddd MMM DD YYYY"), Y = (E) => !E.inactive && !ue(E), B = (E) => !!(E.inactive && !ue(E)), J = (E) => {
-    var ee;
-    const W = (ee = a0("text", $.value)) == null ? void 0 : ee.monthValue;
+    var te;
+    const W = (te = a0("text", $.value)) == null ? void 0 : te.monthValue;
     return x.value && !$.value && !k.value && !ue(E) ? E.date.getDate() === Number(x.value) && !E.inactive : x.value && $ && !k.value && !ue(E) ? E.date.getDate() === Number(x.value) && E.date.getMonth() === W && !E.inactive : x.value && $.value && k.value && !ue(E) ? E.date.getDate() === Number(x.value) && E.date.getMonth() === W && E.date.getFullYear().toString() === k.value && !E.inactive : !1;
   }, ie = (E) => {
-    var ee;
-    const W = (ee = a0("text", $.value)) == null ? void 0 : ee.monthValue;
+    var te;
+    const W = (te = a0("text", $.value)) == null ? void 0 : te.monthValue;
     return x.value && !$.value && !ue(E) ? E.date.getDate() !== Number(x.value) : x.value && $ && !ue(E) ? E.date.getDate() !== Number(x.value) || E.date.getMonth() !== W : !!(!x.value && $.value && !ue(E) || !x.value && !$.value && !ue(E));
   }, ue = (E) => !!(ne(E) || se(E) || ge(E) || ve(E) || Ce(E) || De(E) || be(E)), ne = (E) => {
     if (d != null && d.value && d.value.from && d.value.to) {
-      const W = le(d.value.from, "MM-DD-YYYY").startOf("day"), ee = le(d.value.to, "MM-DD-YYYY").endOf("day"), ce = le(E.date);
-      return ce.isSameOrAfter(W, "day") && ce.isSameOrBefore(ee, "day");
+      const W = le(d.value.from, "MM-DD-YYYY").startOf("day"), te = le(d.value.to, "MM-DD-YYYY").endOf("day"), ce = le(E.date);
+      return ce.isSameOrAfter(W, "day") && ce.isSameOrBefore(te, "day");
     }
     return !1;
   }, se = (E) => {
@@ -7519,8 +7519,8 @@ const n4 = (e, t) => {
       if (typeof d.value.pastDates == "boolean")
         return W.isBefore(D.value.startOf("day"));
       {
-        const ee = le(d.value.pastDates);
-        return W.isBefore(le(ee, "MM-DD-YYYY").startOf("day"));
+        const te = le(d.value.pastDates);
+        return W.isBefore(le(te, "MM-DD-YYYY").startOf("day"));
       }
     }
     return !1;
@@ -7530,17 +7530,17 @@ const n4 = (e, t) => {
       if (typeof d.value.futureDates == "boolean")
         return W.isAfter(D.value.endOf("day"));
       {
-        const ee = le(d.value.futureDates);
-        return W.isAfter(le(ee, "MM-DD-YYYY").endOf("day"));
+        const te = le(d.value.futureDates);
+        return W.isAfter(le(te, "MM-DD-YYYY").endOf("day"));
       }
     }
     return !1;
   }, ve = (E) => {
     if (d != null && d.value && (d != null && d.value.selectedDates) && d.value.selectedDates.length > 0) {
       const W = le(E.date);
-      return d.value.selectedDates.forEach((ee) => {
-        le(ee).isValid() || console.error(`Error: disabledDates Props - Selected Dates - Invalid date format: "${ee}"`);
-      }), d.value.selectedDates.some((ee) => W.isSame(le(ee, "MM-DD-YYYY"), "day"));
+      return d.value.selectedDates.forEach((te) => {
+        le(te).isValid() || console.error(`Error: disabledDates Props - Selected Dates - Invalid date format: "${te}"`);
+      }), d.value.selectedDates.some((te) => W.isSame(le(te, "MM-DD-YYYY"), "day"));
     }
     return !1;
   }, Ce = (E) => {
@@ -7558,21 +7558,21 @@ const n4 = (e, t) => {
   }, be = (E) => {
     if (d != null && d.value && (d != null && d.value.selectedDays)) {
       const W = le(E.date);
-      return d.value.selectedDays.some((ee) => {
-        const ce = S.value.find((Ne) => Ne.text.toLowerCase() === ee.toLowerCase());
-        return ce || console.error(`Error: disabledDates Props - Selected Days - Invalid day: "${ee}"`), ce ? W.day() === S.value.indexOf(ce) : !1;
+      return d.value.selectedDays.some((te) => {
+        const ce = S.value.find((Ne) => Ne.text.toLowerCase() === te.toLowerCase());
+        return ce || console.error(`Error: disabledDates Props - Selected Days - Invalid day: "${te}"`), ce ? W.day() === S.value.indexOf(ce) : !1;
       });
     }
     return !1;
   }, ae = (E) => {
-    const W = le(E.date), ee = W.format("MM"), ce = W.format("DD"), Ne = W.format("YYYY");
-    $.value = ee, x.value = ce, k.value = Ne, p.value = W.format(c.value), M.value.selectedMonth = E.date.getMonth(), M.value.selectedYear = E.date.getFullYear(), L2(), te(), _2(), i0(), w.value = [], t("getDateErrors", w.value), setTimeout(() => {
+    const W = le(E.date), te = W.format("MM"), ce = W.format("DD"), Ne = W.format("YYYY");
+    $.value = te, x.value = ce, k.value = Ne, p.value = W.format(c.value), M.value.selectedMonth = E.date.getMonth(), M.value.selectedYear = E.date.getFullYear(), L2(), ee(), _2(), i0(), w.value = [], t("getDateErrors", w.value), setTimeout(() => {
       m.value = !1;
     }, 100);
   }, X = (E) => {
     N.value = "tab-calendar";
-    const W = E.monthValue + 1, ee = W < 10 ? `0${W}` : `${W}`;
-    $.value = ee, M.value.selectedMonth = E.monthValue, L2(), te(), _2(), w.value = [], t("getDateErrors", w.value);
+    const W = E.monthValue + 1, te = W < 10 ? `0${W}` : `${W}`;
+    $.value = te, M.value.selectedMonth = E.monthValue, L2(), ee(), _2(), w.value = [], t("getDateErrors", w.value);
   }, pe = V({
     currentPage: 0,
     itemsPerPage: 12,
@@ -7591,9 +7591,9 @@ const n4 = (e, t) => {
   }, Gs = () => {
     (pe.value.currentPage + 1) * pe.value.itemsPerPage < pe.value.yearsArray.length && pe.value.currentPage++;
   }, Ws = P(() => pe.value.currentPage === 0), Ks = P(() => (pe.value.currentPage + 1) * pe.value.itemsPerPage >= pe.value.yearsArray.length), Js = (E) => {
-    N.value = "tab-calendar", k.value = E, M.value.selectedYear = Number(E), L2(), te(), _2(), w.value = [], t("getDateErrors", w.value);
+    N.value = "tab-calendar", k.value = E, M.value.selectedYear = Number(E), L2(), ee(), _2(), w.value = [], t("getDateErrors", w.value);
   }, Xs = P(() => n.value || s.value), ir = (E) => {
-    var W, ee;
+    var W, te;
     switch (E) {
       case "MinMaxYear": {
         const ce = Number(o.value) || (/* @__PURE__ */ new Date()).getFullYear(), { min: Ne, max: Ae } = l.value;
@@ -7603,7 +7603,7 @@ const n4 = (e, t) => {
         break;
       }
       case "disabledDatesToFrom": {
-        if ((W = d == null ? void 0 : d.value) != null && W.from && ((ee = d == null ? void 0 : d.value) != null && ee.to)) {
+        if ((W = d == null ? void 0 : d.value) != null && W.from && ((te = d == null ? void 0 : d.value) != null && te.to)) {
           const ce = le(d.value.from, "MM-DD-YYYY"), Ne = le(d.value.to, "MM-DD-YYYY");
           ce.isAfter(Ne) && console.error('Error: disabledDates props - The "from" date cannot be later than the "to" date.'), Ne.isBefore(ce) && console.error('Error: disabledDates props - The "to" date cannot be earlier than the "from" date.');
         }
@@ -7615,8 +7615,8 @@ const n4 = (e, t) => {
       let E = le(p.value, c.value);
       if (E.isValid() || (E = le(p.value, "MM-DD-YYYY")), !E.isValid()) {
         const W = ["YYYY-MM-DD", "MM/DD/YYYY", "DD/MM/YYYY", "YYYY/MM/DD"];
-        for (const ee of W) {
-          const ce = le(p.value, ee);
+        for (const te of W) {
+          const ce = le(p.value, te);
           if (ce.isValid()) {
             E = ce;
             break;
@@ -7624,13 +7624,13 @@ const n4 = (e, t) => {
         }
       }
       if (E.isValid()) {
-        const W = E.format("MM"), ee = E.format("DD"), ce = E.format("YYYY");
-        o0(), $.value = W, x.value = ee, k.value = ce, p.value = E.format(c.value), M.value.selectedMonth = E.get("month"), M.value.selectedYear = E.get("year"), L2(), te(), _2(), t("getInputValue", E.format(c.value));
+        const W = E.format("MM"), te = E.format("DD"), ce = E.format("YYYY");
+        o0(), $.value = W, x.value = te, k.value = ce, p.value = E.format(c.value), M.value.selectedMonth = E.get("month"), M.value.selectedYear = E.get("year"), L2(), ee(), _2(), t("getInputValue", E.format(c.value));
       } else
         console.error(`Error: Could not parse date "${p.value}" with format "${c.value}"`);
     }
   }, a0 = (E, W) => L.value.find(
-    (ee) => ee[E].toString().toLowerCase() === W.toString().toLowerCase()
+    (te) => te[E].toString().toLowerCase() === W.toString().toLowerCase()
   ), qs = (E) => O(C.value.datePickerInputClasses, `spr-w-[${E}] spr-min-w-[${E}]`), ea = (E) => O("spr-cursor-pointer", {
     "spr-background-color-pressed !spr-shadow-button": N.value === E
   }), ta = () => {
@@ -7642,22 +7642,22 @@ const n4 = (e, t) => {
   }, L2 = () => {
     if ($.value.length >= 2)
       if (!isNaN(Number($.value)) && !isNaN(parseFloat($.value))) {
-        const W = $.value.replace(/\b0(\d)\b/g, "$1"), ee = Number(W), ce = L.value.find((Ne) => Ne.monthValue + 1 === ee);
+        const W = $.value.replace(/\b0(\d)\b/g, "$1"), te = Number(W), ce = L.value.find((Ne) => Ne.monthValue + 1 === te);
         ce && ($.value = ce.text.toUpperCase());
       } else {
         const W = L.value.find(
-          (ee) => ee.text.toLowerCase() === $.value.toLowerCase()
+          (te) => te.text.toLowerCase() === $.value.toLowerCase()
         );
         W && ($.value = W.text.toUpperCase());
       }
   }, o0 = Kn(() => {
     var E;
     if ($.value && x.value && k.value) {
-      const W = `${$.value}-${x.value}-${k.value}`, ee = le(W, "MM-DD-YYYY").isValid(), ce = Number(k.value) >= l.value.min && Number(k.value) <= l.value.max;
-      if (ee && ce) {
+      const W = `${$.value}-${x.value}-${k.value}`, te = le(W, "MM-DD-YYYY").isValid(), ce = Number(k.value) >= l.value.min && Number(k.value) <= l.value.max;
+      if (te && ce) {
         w.value = w.value.filter((Ae) => Ae.title !== "Invalid Date");
         const Ne = (E = a0("text", $.value)) == null ? void 0 : E.monthValue;
-        M.value.selectedMonth = Number(Ne), M.value.selectedYear = Number(k.value), te(), _2();
+        M.value.selectedMonth = Number(Ne), M.value.selectedYear = Number(k.value), ee(), _2();
       } else if (!w.value.some((Ae) => Ae.title === "Invalid Date")) {
         let Ae;
         ce ? Ae = `Invalid Date Format. Please use ${c.value}` : Ae = `Year must be between ${l.value.min} and ${l.value.max}.`, w.value.push({
@@ -7677,35 +7677,35 @@ const n4 = (e, t) => {
   }, _2 = () => {
     if ($.value && x.value && k.value) {
       const E = L.value.find(
-        (ee) => ee.text.toLowerCase() === $.value.toLowerCase()
-      ), W = pe.value.yearsArray.find((ee) => ee === Number(k.value));
+        (te) => te.text.toLowerCase() === $.value.toLowerCase()
+      ), W = pe.value.yearsArray.find((te) => te === Number(k.value));
       if (E && W) {
-        const ee = le(`${$.value}-${x.value}-${k.value}`, "MM-DD-YYYY"), ce = {
+        const te = le(`${$.value}-${x.value}-${k.value}`, "MM-DD-YYYY"), ce = {
           // Standard date formats
-          mmddyyyy: ee.format("MM-DD-YYYY"),
-          ddmmyyyy: ee.format("DD-MM-YYYY"),
-          yyyymmdd: ee.format("YYYY-MM-DD"),
-          yyyyMMdd: ee.format("YYYY-MM-DD"),
+          mmddyyyy: te.format("MM-DD-YYYY"),
+          ddmmyyyy: te.format("DD-MM-YYYY"),
+          yyyymmdd: te.format("YYYY-MM-DD"),
+          yyyyMMdd: te.format("YYYY-MM-DD"),
           // Date with slashes and shortened styles
-          mmddyyyyWithSlashes: ee.format("MM/DD/YYYY"),
-          yyyyMMddWithSlashes: ee.format("YYYY/MM/DD"),
+          mmddyyyyWithSlashes: te.format("MM/DD/YYYY"),
+          yyyyMMddWithSlashes: te.format("YYYY/MM/DD"),
           // Short date formats
-          shortDate: ee.format("MMM D, YYYY"),
-          shortDateWithPeriod: ee.format("MMM. D, YYYY"),
-          mmmdd: ee.format("MMM. DD"),
+          shortDate: te.format("MMM D, YYYY"),
+          shortDateWithPeriod: te.format("MMM. D, YYYY"),
+          mmmdd: te.format("MMM. DD"),
           // Full date format
-          fullDate: ee.format("dddd, MMMM D, YYYY"),
+          fullDate: te.format("dddd, MMMM D, YYYY"),
           // Month and year formats
-          monthYear: ee.format("MMMM YYYY"),
+          monthYear: te.format("MMMM YYYY"),
           // Miscellaneous formats
-          mmddyy: ee.format("MMDDYY"),
-          mm: ee.format("MM"),
-          yyyy: ee.format("YYYY"),
-          dd: ee.format("DD"),
+          mmddyy: te.format("MMDDYY"),
+          mm: te.format("MM"),
+          yyyy: te.format("YYYY"),
+          dd: te.format("DD"),
           // ISO format with timezone offset
-          isoDateWithTimeZone: ee.format("YYYY-MM-DDTHH:mm:ssZ"),
+          isoDateWithTimeZone: te.format("YYYY-MM-DDTHH:mm:ssZ"),
           // ISO format without timezone offset
-          isoDateWithoutTimeZone: ee.format("YYYY-MM-DDTHH:mm:ss")
+          isoDateWithoutTimeZone: te.format("YYYY-MM-DDTHH:mm:ss")
         };
         t("getDateFormats", ce);
       }
@@ -7718,8 +7718,8 @@ const n4 = (e, t) => {
       );
       ce && (E = ce.monthValue < 10 ? `0${ce.monthValue + 1}` : `${ce.monthValue + 1}`);
     }
-    const ee = le(`${E}-${x.value}-${k.value}`, "MM-DD-YYYY");
-    t("getInputValue", ee.format(c.value)), ee.isValid() && (p.value = ee.format(c.value));
+    const te = le(`${E}-${x.value}-${k.value}`, "MM-DD-YYYY");
+    t("getInputValue", te.format(c.value));
   }, oa = () => {
     t("getMonthList", L.value);
   }, ia = () => {
@@ -7735,9 +7735,9 @@ const n4 = (e, t) => {
     if (E) {
       const W = parseInt(E, 10);
       if (isNaN(W)) return;
-      const ee = pe.value.yearsArray.indexOf(W);
-      if (ee !== -1) {
-        const ce = Math.floor(ee / pe.value.itemsPerPage);
+      const te = pe.value.yearsArray.indexOf(W);
+      if (te !== -1) {
+        const ce = Math.floor(te / pe.value.itemsPerPage);
         pe.value.currentPage = ce;
       }
     }
@@ -7749,7 +7749,7 @@ const n4 = (e, t) => {
   }), Ut(h, () => {
     m.value = !1;
   }), e2(() => {
-    ir("MinMaxYear"), ir("disabledDatesToFrom"), lr(), te(), s0(), oa(), ia();
+    ir("MinMaxYear"), ir("disabledDatesToFrom"), lr(), ee(), s0(), oa(), ia();
   }), {
     datePickerClasses: C,
     datePickerRef: h,
@@ -7855,7 +7855,7 @@ const n4 = (e, t) => {
       calendarTabIsDateIsDisabled: M,
       calendarTabHandleDateInput: j,
       getMonthObject: G,
-      getTabClasses: te,
+      getTabClasses: ee,
       isDatePickerPopperDisabled: R,
       calendarTabPrevMonth: _,
       calendarTabNextMonth: F,
@@ -7898,7 +7898,7 @@ const n4 = (e, t) => {
             A("div", c4, [
               A("div", p4, [
                 U(me, {
-                  class: I(i(te)("tab-months")),
+                  class: I(i(ee)("tab-months")),
                   variant: "secondary",
                   size: "small",
                   onClick: ae[13] || (ae[13] = (X) => i(Ce)("tab-months"))
@@ -7912,7 +7912,7 @@ const n4 = (e, t) => {
                   _: 1
                 }, 8, ["class"]),
                 U(me, {
-                  class: I(i(te)("tab-years")),
+                  class: I(i(ee)("tab-years")),
                   variant: "secondary",
                   size: "small",
                   onClick: ae[14] || (ae[14] = (X) => i(Ce)("tab-years"))
@@ -8489,7 +8489,7 @@ const n4 = (e, t) => {
     return (ge = r.value) == null ? void 0 : ge.filter((ve, Ce) => (c.value.find((be) => be.value === ve.value && be.isSelected) && (r.value[Ce].isSelected = !0), ve.text.toLowerCase().includes(ne)));
   }), j = P(() => a.value ? s.value : s.value.filter((se, ge) => ($.value.find(
     (Ce) => Ce.value === se.value && Ce.isSelected
-  ) && (s.value[ge].isSelected = !0), se.text.toLowerCase().includes(v.value.toLowerCase())))), G = P(() => Object.values(D.value).some((ne) => ne.isFilterVisible)), te = P(() => j.value.filter((ne) => ne.isSelected)), R = (ne) => {
+  ) && (s.value[ge].isSelected = !0), se.text.toLowerCase().includes(v.value.toLowerCase())))), G = P(() => Object.values(D.value).some((ne) => ne.isFilterVisible)), ee = P(() => j.value.filter((ne) => ne.isSelected)), R = (ne) => {
     t("getFilterData", ne), w.value = ne;
   }, _ = (ne) => {
     Object.keys(D.value).forEach((se) => {
@@ -8589,7 +8589,7 @@ const n4 = (e, t) => {
     filterMenuList: L,
     getFiltereredOption: M,
     mappedMenuData: N,
-    getSelectedFilterMenuOption: te,
+    getSelectedFilterMenuOption: ee,
     getFiltereredMenuOption: j,
     filterMenuSearchvalue: v,
     mappedFilterMenuList: D,
@@ -14678,8 +14678,8 @@ function Ot(e, t, r = {}, n, s, a) {
   }
   const N = a ? function() {
     const { state: j } = r, G = j ? j() : {};
-    this.$patch((te) => {
-      Ee(te, G);
+    this.$patch((ee) => {
+      Ee(ee, G);
     });
   } : (
     /* istanbul ignore next */
@@ -14695,7 +14695,7 @@ function Ot(e, t, r = {}, n, s, a) {
       return M[it] = j, M;
     const G = function() {
       r0(n);
-      const te = Array.from(arguments), R = [], _ = [];
+      const ee = Array.from(arguments), R = [], _ = [];
       function F(B) {
         R.push(B);
       }
@@ -14703,7 +14703,7 @@ function Ot(e, t, r = {}, n, s, a) {
         _.push(B);
       }
       x2(C, {
-        args: te,
+        args: ee,
         name: G[it],
         store: x,
         after: F,
@@ -14711,7 +14711,7 @@ function Ot(e, t, r = {}, n, s, a) {
       });
       let Y;
       try {
-        Y = M.apply(this && this.$id === e ? this : x, te);
+        Y = M.apply(this && this.$id === e ? this : x, ee);
       } catch (B) {
         throw x2(_, B), B;
       }
@@ -14731,7 +14731,7 @@ function Ot(e, t, r = {}, n, s, a) {
     $patch: m,
     $reset: N,
     $subscribe(M, j = {}) {
-      const G = An(p, M, j.detached, () => te()), te = o.run(() => Me(() => n.state.value[e], (R) => {
+      const G = An(p, M, j.detached, () => ee()), ee = o.run(() => Me(() => n.state.value[e], (R) => {
         (j.flush === "sync" ? c : d) && M({
           storeId: e,
           type: Ge.direct,
@@ -14778,8 +14778,8 @@ function Ot(e, t, r = {}, n, s, a) {
   }), process.env.NODE_ENV !== "production" && (x._hotUpdate = f2((M) => {
     x._hotUpdating = !0, M._hmrPayload.state.forEach((j) => {
       if (j in x.$state) {
-        const G = M.$state[j], te = x.$state[j];
-        typeof G == "object" && m2(G) && m2(te) ? Fs(G, te) : M.$state[j] = te;
+        const G = M.$state[j], ee = x.$state[j];
+        typeof G == "object" && m2(G) && m2(ee) ? Fs(G, ee) : M.$state[j] = ee;
       }
       l0(x, j, c0(M.$state, j));
     }), Object.keys(x.$state).forEach((j) => {
@@ -14792,11 +14792,11 @@ function Ot(e, t, r = {}, n, s, a) {
       l0(x, j, S(G, j));
     }
     for (const j in M._hmrPayload.getters) {
-      const G = M._hmrPayload.getters[j], te = a ? (
+      const G = M._hmrPayload.getters[j], ee = a ? (
         // special handling of options api
         P(() => (r0(n), G.call(x, x)))
       ) : G;
-      l0(x, j, te);
+      l0(x, j, ee);
     }
     Object.keys(x._hmrPayload.getters).forEach((j) => {
       j in M._hmrPayload.getters || tt(x, j);
@@ -15837,7 +15837,7 @@ const y8 = (e) => ({
       emptyStateClasses: Ve,
       tableActionSlotClasses: s0
     };
-  }), j = (z, Y) => m.value[z][Y], G = (z) => typeof z == "object" && "title" in z, te = (z) => {
+  }), j = (z, Y) => m.value[z][Y], G = (z) => typeof z == "object" && "title" in z, ee = (z) => {
     if (!u.value || !(u.value in z)) return;
     const Y = f.value.findIndex((B) => {
       const J = B[u.value], ie = z[u.value];
@@ -15872,7 +15872,7 @@ const y8 = (e) => ({
     sortData: N,
     updateSearchField: L,
     handleRowClick: x,
-    handleSelect: te,
+    handleSelect: ee,
     handleSelectAll: R,
     sortedData: m,
     getHeaderCount: S,
@@ -16093,7 +16093,7 @@ const y8 = (e) => ({
                     ])) : T("", !0),
                     A("div", null, [
                       Array.isArray(i(S)(w, M.field).title) ? (g(), y("div", m7, [
-                        (g(!0), y(q, null, de(i(S)(w, M.field).title, (G, te) => (g(), y("div", { key: te }, [
+                        (g(!0), y(q, null, de(i(S)(w, M.field).title, (G, ee) => (g(), y("div", { key: ee }, [
                           M.hasLozengeTitle ? (g(), y("div", b7, [
                             U(Lt, {
                               cell: G

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "design-system-next",
   "private": false,
-  "version": "2.7.40",
+  "version": "2.7.41",
   "main": "./dist/design-system-next.js",
   "module": "./dist/design-system-next.js",
   "repository": {

package/src/components/date-picker/use-date-picker.ts

@@ -883,10 +883,6 @@ export const useDatePicker = (props: DatePickerPropTypes, emit: SetupContext<Dat
     // Use the specified format for the input value
     emit('getInputValue', dateObj.format(format.value));
     
-    // Update the model value with the formatted date
-    if (dateObj.isValid()) {
-      modelValue.value = dateObj.format(format.value);
-    }
   };
 
   const emitMonthList = () => {