v-datepicker-lite 0.1.4 → 0.1.6

package/index.js

@@ -1,70 +1,70 @@
-import { defineComponent as B, computed as $, createElementBlock as k, openBlock as h, createElementVNode as f, Fragment as C, renderList as P, unref as v, toDisplayString as x, normalizeClass as I, ref as H, watch as G, nextTick as W, onMounted as K, createBlock as z, createCommentVNode as q, normalizeStyle as se, createVNode as R, renderSlot as Q, normalizeProps as X, guardReactiveProps as ee, withCtx as U } from "vue";
-import oe from "v-tooltip-lite";
-const J = (l, o = "YYYY-MM-DD") => {
-  const e = l.getFullYear(), i = String(l.getMonth() + 1).padStart(2, "0"), t = String(l.getDate()).padStart(2, "0"), d = String(l.getHours()).padStart(2, "0"), c = String(l.getMinutes()).padStart(2, "0"), s = String(l.getSeconds()).padStart(2, "0"), n = String(l.getMilliseconds()).padStart(3, "0");
-  return o.replace("YYYY", e.toString()).replace("MM", i).replace("DD", t).replace("HH", d).replace("mm", c).replace("ss", s).replace("sss", n);
+import { defineComponent as B, computed as $, createElementBlock as k, openBlock as p, createElementVNode as v, Fragment as P, renderList as F, unref as g, toDisplayString as A, normalizeClass as H, ref as C, watch as O, nextTick as R, onMounted as se, createCommentVNode as q, createBlock as W, createVNode as G, renderSlot as K, normalizeProps as Q, guardReactiveProps as X, withCtx as U } from "vue";
+import ne from "v-tooltip-lite";
+const J = (l, n = "YYYY-MM-DD") => {
+  const e = l.getFullYear(), u = String(l.getMonth() + 1).padStart(2, "0"), t = String(l.getDate()).padStart(2, "0"), c = String(l.getHours()).padStart(2, "0"), r = String(l.getMinutes()).padStart(2, "0"), i = String(l.getSeconds()).padStart(2, "0"), s = String(l.getMilliseconds()).padStart(3, "0");
+  return n.replace("YYYY", e.toString()).replace("MM", u).replace("DD", t).replace("HH", c).replace("mm", r).replace("ss", i).replace("sss", s);
 }, Z = (l) => {
   if (!l) return null;
-  const o = new Date(l);
-  return isNaN(o.getTime()) ? null : o;
-}, L = (l, o) => l.getFullYear() === o.getFullYear() && l.getMonth() === o.getMonth() && l.getDate() === o.getDate(), re = (l, o) => l.getFullYear() === o.getFullYear() && l.getMonth() === o.getMonth(), ie = (l) => {
-  const o = new Date(l.getFullYear(), 0, 1), e = (l.getTime() - o.getTime()) / 864e5;
-  return Math.ceil((e + o.getDay() + 1) / 7);
-}, te = (l, o) => {
-  const e = new Date(l, o, 1), t = new Date(l, o + 1, 0).getDate(), d = e.getDay(), c = [], s = /* @__PURE__ */ new Date(), n = o === 0 ? 11 : o - 1, p = o === 0 ? l - 1 : l, y = new Date(p, n + 1, 0).getDate();
-  for (let m = d - 1; m >= 0; m--) {
-    const a = new Date(p, n, y - m);
-    c.push({
+  const n = new Date(l);
+  return isNaN(n.getTime()) ? null : n;
+}, L = (l, n) => l.getFullYear() === n.getFullYear() && l.getMonth() === n.getMonth() && l.getDate() === n.getDate(), oe = (l, n) => l.getFullYear() === n.getFullYear() && l.getMonth() === n.getMonth(), re = (l) => {
+  const n = new Date(l.getFullYear(), 0, 1), e = (l.getTime() - n.getTime()) / 864e5;
+  return Math.ceil((e + n.getDay() + 1) / 7);
+}, ee = (l, n) => {
+  const e = new Date(l, n, 1), t = new Date(l, n + 1, 0).getDate(), c = e.getDay(), r = [], i = /* @__PURE__ */ new Date(), s = n === 0 ? 11 : n - 1, h = n === 0 ? l - 1 : l, b = new Date(h, s + 1, 0).getDate();
+  for (let d = c - 1; d >= 0; d--) {
+    const a = new Date(h, s, b - d);
+    r.push({
       date: a,
-      day: y - m,
-      month: n,
-      year: p,
+      day: b - d,
+      month: s,
+      year: h,
       isCurrentMonth: !1,
-      isToday: L(a, s),
+      isToday: L(a, i),
       isSelected: !1,
       isDisabled: !1
     });
   }
-  for (let m = 1; m <= t; m++) {
-    const a = new Date(l, o, m);
-    c.push({
+  for (let d = 1; d <= t; d++) {
+    const a = new Date(l, n, d);
+    r.push({
       date: a,
-      day: m,
-      month: o,
+      day: d,
+      month: n,
       year: l,
       isCurrentMonth: !0,
-      isToday: L(a, s),
+      isToday: L(a, i),
       isSelected: !1,
       isDisabled: !1
     });
   }
-  const u = 42 - c.length, M = o === 11 ? 0 : o + 1, b = o === 11 ? l + 1 : l;
-  for (let m = 1; m <= u; m++) {
-    const a = new Date(b, M, m);
-    c.push({
+  const m = 42 - r.length, S = n === 11 ? 0 : n + 1, y = n === 11 ? l + 1 : l;
+  for (let d = 1; d <= m; d++) {
+    const a = new Date(y, S, d);
+    r.push({
       date: a,
-      day: m,
-      month: M,
-      year: b,
+      day: d,
+      month: S,
+      year: y,
       isCurrentMonth: !1,
-      isToday: L(a, s),
+      isToday: L(a, i),
       isSelected: !1,
       isDisabled: !1
     });
   }
-  return c;
-}, ce = (l, o) => {
-  const e = te(l, o), i = [];
+  return r;
+}, ie = (l, n) => {
+  const e = ee(l, n), u = [];
   for (let t = 0; t < e.length; t += 7) {
-    const d = e.slice(t, t + 7), c = ie(d[0].date);
-    i.push({
-      weekNumber: c,
-      days: d,
+    const c = e.slice(t, t + 7), r = re(c[0].date);
+    u.push({
+      weekNumber: r,
+      days: c,
       isSelected: !1
     });
   }
-  return i;
-}, le = (l) => [
+  return u;
+}, te = (l) => [
   "January",
   "February",
   "March",
@@ -77,15 +77,15 @@ const J = (l, o = "YYYY-MM-DD") => {
   "October",
   "November",
   "December"
-].map((e, i) => ({
-  month: i,
+].map((e, u) => ({
+  month: u,
   year: l,
   name: e,
   isSelected: !1,
   isDisabled: !1
-})), ne = (l, o, e, i) => {
+})), le = (l, n, e, u) => {
   const t = J(l, "YYYY-MM-DD");
-  return o && t < o || e && t > e ? !0 : i ? i.some((d) => d.end ? t >= d.start && t <= d.end : t === d.start) : !1;
+  return n && t < n || e && t > e ? !0 : u ? u.some((c) => c.end ? t >= c.start && t <= c.end : t === c.start) : !1;
 }, E = [
   "January",
   "February",
@@ -99,7 +99,7 @@ const J = (l, o = "YYYY-MM-DD") => {
   "October",
   "November",
   "December"
-], ae = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], ue = { class: "date-picker-content" }, de = { class: "date-picker-table" }, me = { class: "date-picker-weekdays-row" }, ve = { class: "date-picker-days-body" }, pe = ["onClick", "disabled"], he = /* @__PURE__ */ B({
+], ae = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], ce = { class: "date-picker-content dates" }, ue = { class: "date-picker-table" }, de = { class: "date-picker-weekdays-row" }, me = { class: "date-picker-days-body" }, ve = ["onClick", "disabled"], pe = /* @__PURE__ */ B({
   __name: "DateView",
   props: {
     currentDate: {},
@@ -109,197 +109,197 @@ const J = (l, o = "YYYY-MM-DD") => {
     disabledDates: {}
   },
   emits: ["select"],
-  setup(l, { emit: o }) {
-    const e = l, i = o, t = $(() => te(e.currentDate.getFullYear(), e.currentDate.getMonth()).map((n) => ({
-      ...n,
-      isSelected: e.selectedDate ? L(n.date, e.selectedDate) : !1,
-      isDisabled: ne(n.date, e.minDate, e.maxDate, e.disabledDates)
-    }))), d = $(() => {
-      const s = [];
-      for (let n = 0; n < t.value.length; n += 7)
-        s.push(t.value.slice(n, n + 7));
-      return s;
-    }), c = (s) => {
-      s.isDisabled || i("select", s.date);
+  setup(l, { emit: n }) {
+    const e = l, u = n, t = $(() => ee(e.currentDate.getFullYear(), e.currentDate.getMonth()).map((s) => ({
+      ...s,
+      isSelected: e.selectedDate ? L(s.date, e.selectedDate) : !1,
+      isDisabled: le(s.date, e.minDate, e.maxDate, e.disabledDates)
+    }))), c = $(() => {
+      const i = [];
+      for (let s = 0; s < t.value.length; s += 7)
+        i.push(t.value.slice(s, s + 7));
+      return i.filter((s) => s.some((h) => h.isCurrentMonth));
+    }), r = (i) => {
+      i.isDisabled || u("select", i.date);
     };
-    return (s, n) => (h(), k("div", ue, [
-      f("table", de, [
-        f("thead", null, [
-          f("tr", me, [
-            (h(!0), k(C, null, P(v(ae), (p) => (h(), k("th", { key: p }, x(p), 1))), 128))
+    return (i, s) => (p(), k("div", ce, [
+      v("table", ue, [
+        v("thead", null, [
+          v("tr", de, [
+            (p(!0), k(P, null, F(g(ae), (h) => (p(), k("th", { key: h }, A(h), 1))), 128))
           ])
         ]),
-        f("tbody", ve, [
-          (h(!0), k(C, null, P(d.value, (p, y) => (h(), k("tr", {
-            key: y,
+        v("tbody", me, [
+          (p(!0), k(P, null, F(c.value, (h, b) => (p(), k("tr", {
+            key: b,
             class: "date-picker-week-row"
           }, [
-            (h(!0), k(C, null, P(p, (u) => (h(), k("td", {
-              key: `${u.year}-${u.month}-${u.day}`,
+            (p(!0), k(P, null, F(h, (m) => (p(), k("td", {
+              key: `${m.year}-${m.month}-${m.day}`,
               class: "date-picker-day-cell"
             }, [
-              f("button", {
-                class: I([
+              v("button", {
+                class: H([
                   "date-picker-day",
                   {
-                    "other-month": !u.isCurrentMonth,
-                    today: u.isToday,
-                    selected: u.isSelected,
-                    disabled: u.isDisabled
+                    "other-month": !m.isCurrentMonth,
+                    today: m.isToday,
+                    selected: m.isSelected,
+                    disabled: m.isDisabled
                   }
                 ]),
-                onClick: (M) => c(u),
-                disabled: u.isDisabled
-              }, x(u.day), 11, pe)
+                onClick: (S) => r(m),
+                disabled: m.isDisabled
+              }, A(m.day), 11, ve)
             ]))), 128))
           ]))), 128))
         ])
       ])
     ]));
   }
-}), fe = { class: "date-picker-content" }, ge = {
+}), he = { class: "date-picker-content" }, fe = {
   class: "date-picker-table date-picker-week-table",
   cellpadding: "0",
   cellspacing: "0"
-}, ke = { class: "date-picker-weekdays-row" }, De = { class: "date-picker-weeks-body" }, ye = ["onClick"], be = { class: "date-picker-week-number-cell" }, Me = { class: "date-picker-week-number" }, Se = /* @__PURE__ */ B({
+}, ge = { class: "date-picker-weekdays-row" }, ke = { class: "date-picker-weeks-body" }, De = ["onClick"], ye = { class: "date-picker-week-number-cell" }, be = { class: "date-picker-week-number" }, Me = /* @__PURE__ */ B({
   __name: "WeekView",
   props: {
     currentDate: {},
     selectedDate: {}
   },
   emits: ["select"],
-  setup(l, { emit: o }) {
-    const e = l, i = o, t = $(() => ce(e.currentDate.getFullYear(), e.currentDate.getMonth()).map((s) => {
-      const n = e.selectedDate ? s.days.some((p) => L(p.date, e.selectedDate)) : !1;
+  setup(l, { emit: n }) {
+    const e = l, u = n, t = $(() => ie(e.currentDate.getFullYear(), e.currentDate.getMonth()).map((i) => {
+      const s = e.selectedDate ? i.days.some((h) => L(h.date, e.selectedDate)) : !1;
       return {
-        ...s,
-        isSelected: n
+        ...i,
+        isSelected: s
       };
-    })), d = (c) => {
-      var n;
-      const s = ((n = c.days.find((p) => p.isCurrentMonth)) == null ? void 0 : n.date) || c.days[0].date;
-      i("select", s);
+    })), c = (r) => {
+      var s;
+      const i = ((s = r.days.find((h) => h.isCurrentMonth)) == null ? void 0 : s.date) || r.days[0].date;
+      u("select", i);
     };
-    return (c, s) => (h(), k("div", fe, [
-      f("table", ge, [
-        f("thead", null, [
-          f("tr", ke, [
-            s[0] || (s[0] = f("th", { class: "date-picker-weekday date-picker-week-header" }, "Wk", -1)),
-            (h(!0), k(C, null, P(v(ae), (n) => (h(), k("th", { key: n }, x(n), 1))), 128))
+    return (r, i) => (p(), k("div", he, [
+      v("table", fe, [
+        v("thead", null, [
+          v("tr", ge, [
+            i[0] || (i[0] = v("th", { class: "date-picker-weekday date-picker-week-header" }, "Wk", -1)),
+            (p(!0), k(P, null, F(g(ae), (s) => (p(), k("th", { key: s }, A(s), 1))), 128))
           ])
         ]),
-        f("tbody", De, [
-          (h(!0), k(C, null, P(t.value, (n) => (h(), k("tr", {
-            key: n.weekNumber,
-            class: I([
+        v("tbody", ke, [
+          (p(!0), k(P, null, F(t.value, (s) => (p(), k("tr", {
+            key: s.weekNumber,
+            class: H([
               "date-picker-week-row",
               {
-                selected: n.isSelected
+                selected: s.isSelected
               }
             ]),
-            onClick: (p) => d(n)
+            onClick: (h) => c(s)
           }, [
-            f("td", be, [
-              f("div", Me, x(n.weekNumber), 1)
+            v("td", ye, [
+              v("div", be, A(s.weekNumber), 1)
             ]),
-            (h(!0), k(C, null, P(n.days, (p) => (h(), k("td", {
-              key: `${p.year}-${p.month}-${p.day}`,
+            (p(!0), k(P, null, F(s.days, (h) => (p(), k("td", {
+              key: `${h.year}-${h.month}-${h.day}`,
               class: "date-picker-day-cell"
             }, [
-              f("button", {
-                class: I([
+              v("button", {
+                class: H([
                   "date-picker-day",
                   {
-                    "other-month": !p.isCurrentMonth,
-                    today: p.isToday
+                    "other-month": !h.isCurrentMonth,
+                    today: h.isToday
                   }
                 ])
-              }, x(p.day), 3)
+              }, A(h.day), 3)
             ]))), 128))
-          ], 10, ye))), 128))
+          ], 10, De))), 128))
         ])
       ])
     ]));
   }
 });
-function _e(l, o = "24h", e = 1, i) {
-  const t = H(0), d = H(0), c = H([]), s = H(!1), n = $(() => o === "12h"), p = () => {
+function Se(l, n = "24h", e = 1, u) {
+  const t = C(0), c = C(0), r = C([]), i = C(!1), s = $(() => n === "12h"), h = () => {
     if (l)
-      t.value = l.getHours(), d.value = l.getMinutes(), s.value = !0;
+      t.value = l.getHours(), c.value = l.getMinutes(), i.value = !0;
     else {
-      const r = /* @__PURE__ */ new Date();
-      t.value = r.getHours(), d.value = r.getMinutes(), s.value = !1;
+      const o = /* @__PURE__ */ new Date();
+      t.value = o.getHours(), c.value = o.getMinutes(), i.value = !1;
     }
-    u();
-  }, y = (r) => {
-    r ? (t.value = r.getHours(), d.value = r.getMinutes(), s.value = !0) : s.value = !1;
-  }, u = () => {
-    const r = [], D = n.value ? 1 : 0;
-    for (let S = 0; S < (n.value ? 2 : 1); S++) {
-      const V = n.value ? S === 0 ? " AM" : " PM" : "";
-      for (let T = D; T <= (n.value ? 12 : 23); T++)
-        for (let F = 0; F < 60; F += e) {
-          const N = (n.value, T), g = n.value ? T === 12 ? S === 0 ? 0 : 12 : T + S * 12 : T, _ = `${String(N).padStart(2, "0")}:${String(F).padStart(2, "0")}` + V;
-          r.push({
-            display: _,
-            value: `${String(g).padStart(2, "0")}:${String(F).padStart(2, "0")}`,
-            hour: g,
-            minute: F
+    m();
+  }, b = (o) => {
+    o ? (t.value = o.getHours(), c.value = o.getMinutes(), i.value = !0) : i.value = !1;
+  }, m = () => {
+    const o = [], D = s.value ? 1 : 0;
+    for (let M = 0; M < (s.value ? 2 : 1); M++) {
+      const N = s.value ? M === 0 ? " AM" : " PM" : "";
+      for (let T = D; T <= (s.value ? 12 : 23); T++)
+        for (let I = 0; I < 60; I += e) {
+          const V = (s.value, T), f = s.value ? T === 12 ? M === 0 ? 0 : 12 : T + M * 12 : T, w = `${String(V).padStart(2, "0")}:${String(I).padStart(2, "0")}` + N;
+          o.push({
+            display: w,
+            value: `${String(f).padStart(2, "0")}:${String(I).padStart(2, "0")}`,
+            hour: f,
+            minute: I
           });
         }
     }
-    n.value ? c.value = r.map((S) => S.display) : c.value = r.map((S) => S.value);
-  }, M = () => {
-    if (!s.value) return "";
-    if (n.value) {
-      const r = t.value === 0 ? 12 : t.value > 12 ? t.value - 12 : t.value, D = t.value < 12 ? " AM" : " PM";
-      return `${String(r).padStart(2, "0")}:${String(d.value).padStart(
+    s.value ? r.value = o.map((M) => M.display) : r.value = o.map((M) => M.value);
+  }, S = () => {
+    if (!i.value) return "";
+    if (s.value) {
+      const o = t.value === 0 ? 12 : t.value > 12 ? t.value - 12 : t.value, D = t.value < 12 ? " AM" : " PM";
+      return `${String(o).padStart(2, "0")}:${String(c.value).padStart(
         2,
         "0"
       )}${D}`;
     }
-    return `${String(t.value).padStart(2, "0")}:${String(d.value).padStart(2, "0")}`;
+    return `${String(t.value).padStart(2, "0")}:${String(c.value).padStart(2, "0")}`;
   };
   return {
     hours: t,
-    minutes: d,
-    timeOptions: c,
-    is12HourFormat: n,
-    initializeTime: p,
-    updateTime: y,
-    generateTimeOptions: u,
-    getCurrentTimeString: M,
-    selectTime: (r) => {
-      let D, S;
-      if (n.value) {
-        const [T, F] = r.split(" "), [N, g] = T.split(":");
-        D = parseInt(N), S = parseInt(g), F === "AM" ? D === 12 && (D = 0) : D !== 12 && (D += 12);
+    minutes: c,
+    timeOptions: r,
+    is12HourFormat: s,
+    initializeTime: h,
+    updateTime: b,
+    generateTimeOptions: m,
+    getCurrentTimeString: S,
+    selectTime: (o) => {
+      let D, M;
+      if (s.value) {
+        const [T, I] = o.split(" "), [V, f] = T.split(":");
+        D = parseInt(V), M = parseInt(f), I === "AM" ? D === 12 && (D = 0) : D !== 12 && (D += 12);
       } else {
-        const [T, F] = r.split(":");
-        D = parseInt(T), S = parseInt(F);
+        const [T, I] = o.split(":");
+        D = parseInt(T), M = parseInt(I);
       }
-      if (s.value && t.value === D && d.value === S) {
-        s.value = !1, i("update", null);
+      if (i.value && t.value === D && c.value === M) {
+        i.value = !1, u("update", null);
         return;
       }
-      t.value = D, d.value = S, s.value = !0;
-      const V = l ? new Date(l.getTime()) : /* @__PURE__ */ new Date();
-      V.setHours(D, S, 0, 0), i("update", V);
+      t.value = D, c.value = M, i.value = !0;
+      const N = l ? new Date(l.getTime()) : /* @__PURE__ */ new Date();
+      N.setHours(D, M, 0, 0), u("update", N);
     },
-    scrollToSelected: (r) => {
-      if (!r || !s.value) return;
-      const D = c.value.findIndex((S) => S === M());
+    scrollToSelected: (o) => {
+      if (!o || !i.value) return;
+      const D = r.value.findIndex((M) => M === S());
       if (D >= 0) {
-        const V = r.clientHeight, T = D * 30 - V / 2 + 30 / 2;
-        r.scrollTop = Math.max(0, T);
+        const N = o.clientHeight, T = D * 30 - N / 2 + 30 / 2;
+        o.scrollTop = Math.max(0, T);
       }
     },
-    onTimeUpdate: (r) => {
-      t.value = r.getHours(), d.value = r.getMinutes(), s.value = !0, i("update", r);
+    onTimeUpdate: (o) => {
+      t.value = o.getHours(), c.value = o.getMinutes(), i.value = !0, u("update", o);
     }
   };
 }
-const we = { class: "time-picker-container" }, $e = ["aria-selected", "onClick"], j = /* @__PURE__ */ B({
+const _e = { class: "time-picker-container" }, we = ["aria-selected", "onClick"], j = /* @__PURE__ */ B({
   __name: "TimeView",
   props: {
     selectedTime: {},
@@ -307,121 +307,121 @@ const we = { class: "time-picker-container" }, $e = ["aria-selected", "onClick"]
     minuteInterval: { default: 1 }
   },
   emits: ["update"],
-  setup(l, { emit: o }) {
-    const e = l, i = o, t = H(null), { timeOptions: d, initializeTime: c, updateTime: s, getCurrentTimeString: n, selectTime: p, scrollToSelected: y } = _e(e.selectedTime, e.timeFormat, e.minuteInterval, i);
-    return G(
+  setup(l, { emit: n }) {
+    const e = l, u = n, t = C(null), { timeOptions: c, initializeTime: r, updateTime: i, getCurrentTimeString: s, selectTime: h, scrollToSelected: b } = Se(e.selectedTime, e.timeFormat, e.minuteInterval, u);
+    return O(
       () => e.selectedTime,
-      (u) => {
-        s(u), W(() => {
-          y(t.value);
+      (m) => {
+        i(m), R(() => {
+          b(t.value);
         });
       },
       { immediate: !0 }
-    ), G(
+    ), O(
       () => e.timeFormat,
       () => {
-        c(), W(() => {
-          y(t.value);
+        r(), R(() => {
+          b(t.value);
         });
       }
-    ), G(
+    ), O(
       () => e.minuteInterval,
       () => {
-        c(), W(() => {
-          y(t.value);
+        r(), R(() => {
+          b(t.value);
         });
       }
-    ), K(() => {
-      c(), W(() => {
+    ), se(() => {
+      r(), R(() => {
         setTimeout(() => {
-          y(t.value);
+          b(t.value);
         }, 3);
       });
-    }), (u, M) => (h(), k("div", we, [
-      f("div", {
+    }), (m, S) => (p(), k("div", _e, [
+      v("div", {
         ref_key: "timeListRef",
         ref: t,
         class: "time-wheel",
         role: "listbox",
         "aria-label": "Time Selection"
       }, [
-        (h(!0), k(C, null, P(v(d), (b) => (h(), k("div", {
-          key: b,
-          class: I(["time-option", {
-            selected: b === v(n)()
+        (p(!0), k(P, null, F(g(c), (y) => (p(), k("div", {
+          key: y,
+          class: H(["time-option", {
+            selected: y === g(s)()
           }]),
           role: "option",
-          "aria-selected": b === v(n)(),
-          onClick: (m) => v(p)(b)
-        }, x(b), 11, $e))), 128))
+          "aria-selected": y === g(s)(),
+          onClick: (d) => g(h)(y)
+        }, A(y), 11, we))), 128))
       ], 512)
     ]));
   }
-}), Te = { class: "year-view-layout" }, Ye = { class: "years-section" }, He = { class: "years-list" }, Ce = ["onClick"], Pe = { class: "months-section" }, Fe = { class: "date-picker-table date-picker-months-table" }, Ie = { class: "date-picker-months-body" }, xe = ["onClick", "disabled"], Ae = /* @__PURE__ */ B({
+}), $e = { class: "year-view-layout" }, Te = { class: "years-section" }, Ye = { class: "years-list" }, He = ["onClick"], Ce = { class: "months-section" }, Pe = { class: "date-picker-table date-picker-months-table" }, Fe = { class: "date-picker-months-body" }, Ie = ["onClick", "disabled"], Ae = /* @__PURE__ */ B({
   __name: "YearView",
   props: {
     currentDate: {},
     selectedDate: {}
   },
   emits: ["select", "month-select"],
-  setup(l, { emit: o }) {
-    const e = l, i = o, t = $(() => e.currentDate.getFullYear()), d = $(() => {
-      var u;
-      return (u = e.selectedDate) == null ? void 0 : u.getFullYear();
-    }), c = $(() => {
-      const u = Math.floor(t.value / 10) * 10;
-      return Array.from({ length: 12 }, (M, b) => u + b - 1);
-    }), s = $(() => le(t.value).map((u) => ({
-      ...u,
-      isSelected: e.selectedDate ? u.month === e.selectedDate.getMonth() && u.year === e.selectedDate.getFullYear() : !1
-    }))), n = $(() => {
-      const u = [];
-      for (let M = 0; M < s.value.length; M += 3)
-        u.push(s.value.slice(M, M + 3));
-      return u;
-    }), p = (u) => {
-      i("select", u);
-    }, y = (u) => {
-      i("month-select", u.month);
+  setup(l, { emit: n }) {
+    const e = l, u = n, t = $(() => e.currentDate.getFullYear()), c = $(() => {
+      var m;
+      return (m = e.selectedDate) == null ? void 0 : m.getFullYear();
+    }), r = $(() => {
+      const m = Math.floor(t.value / 10) * 10;
+      return Array.from({ length: 12 }, (S, y) => m + y - 1);
+    }), i = $(() => te(t.value).map((m) => ({
+      ...m,
+      isSelected: e.selectedDate ? m.month === e.selectedDate.getMonth() && m.year === e.selectedDate.getFullYear() : !1
+    }))), s = $(() => {
+      const m = [];
+      for (let S = 0; S < i.value.length; S += 3)
+        m.push(i.value.slice(S, S + 3));
+      return m;
+    }), h = (m) => {
+      u("select", m);
+    }, b = (m) => {
+      u("month-select", m.month);
     };
-    return (u, M) => (h(), k("div", Te, [
-      f("div", Ye, [
-        f("div", He, [
-          (h(!0), k(C, null, P(c.value, (b) => (h(), k("button", {
-            key: b,
-            class: I([
+    return (m, S) => (p(), k("div", $e, [
+      v("div", Te, [
+        v("div", Ye, [
+          (p(!0), k(P, null, F(r.value, (y) => (p(), k("button", {
+            key: y,
+            class: H([
               "year-item",
               {
-                selected: b === d.value,
-                current: b === t.value
+                selected: y === c.value,
+                current: y === t.value
               }
             ]),
-            onClick: (m) => p(b)
-          }, x(b), 11, Ce))), 128))
+            onClick: (d) => h(y)
+          }, A(y), 11, He))), 128))
         ])
       ]),
-      f("div", Pe, [
-        f("table", Fe, [
-          f("tbody", Ie, [
-            (h(!0), k(C, null, P(n.value, (b, m) => (h(), k("tr", {
-              key: m,
+      v("div", Ce, [
+        v("table", Pe, [
+          v("tbody", Fe, [
+            (p(!0), k(P, null, F(s.value, (y, d) => (p(), k("tr", {
+              key: d,
               class: "date-picker-months-row"
             }, [
-              (h(!0), k(C, null, P(b, (a) => (h(), k("td", {
+              (p(!0), k(P, null, F(y, (a) => (p(), k("td", {
                 key: a.month,
                 class: "date-picker-month-cell"
               }, [
-                f("button", {
-                  class: I([
+                v("button", {
+                  class: H([
                     "date-picker-month",
                     {
                       selected: a.isSelected,
                       disabled: a.isDisabled
                     }
                   ]),
-                  onClick: (r) => y(a),
+                  onClick: (o) => b(a),
                   disabled: a.isDisabled
-                }, x(a.name.substring(0, 3)), 11, xe)
+                }, A(a.name.substring(0, 3)), 11, Ie)
               ]))), 128))
             ]))), 128))
           ])
@@ -429,234 +429,192 @@ const we = { class: "time-picker-container" }, $e = ["aria-selected", "onClick"]
       ])
     ]));
   }
-}), Ne = { class: "date-picker-content months" }, Ve = { class: "date-picker-table date-picker-months-table" }, Be = { class: "date-picker-months-body" }, qe = ["onClick", "disabled"], Le = /* @__PURE__ */ B({
+}), Ve = { class: "date-picker-content months" }, Ne = { class: "date-picker-table date-picker-months-table" }, xe = { class: "date-picker-months-body" }, Be = ["onClick", "disabled"], qe = /* @__PURE__ */ B({
   __name: "MonthView",
   props: {
     currentDate: {},
     selectedDate: {}
   },
   emits: ["select"],
-  setup(l, { emit: o }) {
-    const e = l, i = o, t = $(() => le(e.currentDate.getFullYear()).map((n) => ({
-      ...n,
-      isSelected: e.selectedDate ? n.month === e.selectedDate.getMonth() && n.year === e.selectedDate.getFullYear() : !1
-    }))), d = $(() => {
-      const s = [];
-      for (let n = 0; n < t.value.length; n += 3)
-        s.push(t.value.slice(n, n + 3));
-      return s;
-    }), c = (s) => {
-      i("select", s.month);
+  setup(l, { emit: n }) {
+    const e = l, u = n, t = $(() => te(e.currentDate.getFullYear()).map((s) => ({
+      ...s,
+      isSelected: e.selectedDate ? s.month === e.selectedDate.getMonth() && s.year === e.selectedDate.getFullYear() : !1
+    }))), c = $(() => {
+      const i = [];
+      for (let s = 0; s < t.value.length; s += 3)
+        i.push(t.value.slice(s, s + 3));
+      return i;
+    }), r = (i) => {
+      u("select", i.month);
     };
-    return (s, n) => (h(), k("div", Ne, [
-      f("table", Ve, [
-        f("tbody", Be, [
-          (h(!0), k(C, null, P(d.value, (p, y) => (h(), k("tr", {
-            key: y,
+    return (i, s) => (p(), k("div", Ve, [
+      v("table", Ne, [
+        v("tbody", xe, [
+          (p(!0), k(P, null, F(c.value, (h, b) => (p(), k("tr", {
+            key: b,
             class: "date-picker-months-row"
           }, [
-            (h(!0), k(C, null, P(p, (u) => (h(), k("td", {
-              key: u.month,
+            (p(!0), k(P, null, F(h, (m) => (p(), k("td", {
+              key: m.month,
               class: "date-picker-month-cell"
             }, [
-              f("button", {
-                class: I([
+              v("button", {
+                class: H([
                   "date-picker-month",
                   {
-                    selected: u.isSelected,
-                    disabled: u.isDisabled
+                    selected: m.isSelected,
+                    disabled: m.isDisabled
                   }
                 ]),
-                onClick: (M) => c(u),
-                disabled: u.isDisabled
-              }, x(u.name), 11, qe)
+                onClick: (S) => r(m),
+                disabled: m.isDisabled
+              }, A(m.name), 11, Be)
             ]))), 128))
           ]))), 128))
         ])
       ])
     ]));
   }
-}), ze = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" fill-rule="evenodd"><path d="M24 0v24H0V0zM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.019-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z"/><path fill="currentColor" d="M8.293 12.707a1 1 0 0 1 0-1.414l5.657-5.657a1 1 0 1 1 1.414 1.414L10.414 12l4.95 4.95a1 1 0 0 1-1.414 1.414z"/></g></svg>', Ge = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" fill-rule="evenodd"><path d="M24 0v24H0V0zM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.019-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z"/><path fill="currentColor" d="M15.707 11.293a1 1 0 0 1 0 1.414l-5.657 5.657a1 1 0 1 1-1.414-1.414l4.95-4.95l-4.95-4.95a1 1 0 0 1 1.414-1.414z"/></g></svg>', Oe = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M12 18a6 6 0 1 1 0-12a6 6 0 0 1 0 12m0-1.5a4.5 4.5 0 1 0 0-9a4.5 4.5 0 0 0 0 9"/></svg>', We = { class: "date-picker-header" }, Re = ["disabled"], Je = ["innerHTML"], Ue = ["innerHTML"], Ze = ["disabled"], Ee = ["innerHTML"], je = /* @__PURE__ */ B({
+}), Le = /* @__PURE__ */ B({
   __name: "DatePickerHeader",
   props: {
     currentDate: {},
-    viewMode: {},
-    canGoPrev: { type: Boolean },
-    canGoNext: { type: Boolean }
+    viewMode: {}
   },
-  emits: ["prev", "next", "header-click", "current-date"],
-  setup(l, { emit: o }) {
-    const e = l, i = o, t = $(() => {
-      const p = e.currentDate.getFullYear(), y = e.currentDate.getMonth();
+  emits: ["header-click"],
+  setup(l, { emit: n }) {
+    const e = l, u = n, t = $(() => {
+      const r = e.currentDate.getFullYear(), i = e.currentDate.getMonth();
       switch (e.viewMode) {
         case "date":
-          return `${E[y]} ${p}`;
+          return `${E[i]} ${r}`;
         case "year":
-          const u = Math.floor(p / 10) * 10, M = u + 9;
-          return `${u}–${M}`;
+          const s = Math.floor(r / 10) * 10, h = s + 9;
+          return `${s}–${h}`;
         default:
-          return `${E[y]} ${p}`;
+          return `${E[i]} ${r}`;
       }
-    }), d = () => {
-      i("prev");
-    }, c = () => {
-      i("next");
-    }, s = () => {
-      i("header-click");
-    }, n = () => {
-      i("current-date");
+    }), c = () => {
+      u("header-click");
     };
-    return (p, y) => (h(), k("div", We, [
-      f("button", {
-        class: "date-picker-title",
-        onClick: s,
-        type: "button"
-      }, x(t.value), 1),
-      f("button", {
-        class: "date-picker-nav-button ml-auto",
-        disabled: !p.canGoPrev,
-        onClick: d,
-        type: "button",
-        "aria-label": "Previous"
-      }, [
-        f("span", {
-          class: "date-picker-nav-icon",
-          innerHTML: v(ze)
-        }, null, 8, Je)
-      ], 8, Re),
-      f("button", {
-        class: "date-picker-nav-button",
-        onClick: n,
-        type: "button",
-        "aria-label": "Current Date"
-      }, [
-        f("span", {
-          class: "date-picker-nav-icon",
-          innerHTML: v(Oe)
-        }, null, 8, Ue)
-      ]),
-      f("button", {
-        class: "date-picker-nav-button",
-        disabled: !p.canGoNext,
-        onClick: c,
-        type: "button",
-        "aria-label": "Next"
-      }, [
-        f("span", {
-          class: "date-picker-nav-icon",
-          innerHTML: v(Ge)
-        }, null, 8, Ee)
-      ], 8, Ze)
-    ]));
+    return (r, i) => (p(), k("button", {
+      class: "date-picker-title",
+      onClick: c,
+      type: "button"
+    }, A(t.value), 1));
   }
 });
-function Ke(l, o) {
-  const e = H(/* @__PURE__ */ new Date()), i = H("date"), t = $(() => l.value ? l.value instanceof Date ? l.value : Z(l.value) : null), d = (g) => {
-    const Y = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.\d{3})?Z?$/, _ = /^\d{4}-\d{2}-\d{2}$/;
-    return Y.test(g) ? g.includes(".") ? "YYYY-MM-DDTHH:mm:ss.sssZ" : "YYYY-MM-DDTHH:mm:ssZ" : _.test(g) ? "YYYY-MM-DD" : l.format || "YYYY-MM-DD";
-  }, c = $(() => {
+function Oe(l, n) {
+  const e = C(/* @__PURE__ */ new Date()), u = C("date"), t = $(() => l.value ? l.value instanceof Date ? l.value : Z(l.value) : null), c = (f) => {
+    const Y = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.\d{3})?Z?$/, w = /^\d{4}-\d{2}-\d{2}$/;
+    return Y.test(f) ? f.includes(".") ? "YYYY-MM-DDTHH:mm:ss.sssZ" : "YYYY-MM-DDTHH:mm:ssZ" : w.test(f) ? "YYYY-MM-DD" : l.format || "YYYY-MM-DD";
+  }, r = $(() => {
     if (!l.value) return !1;
     if (l.value instanceof Date) return !0;
-    const g = d(l.value);
-    return g.includes("H") || g.includes("h") || g.includes("m") || g.includes("T");
-  }), s = $(() => {
+    const f = c(l.value);
+    return f.includes("H") || f.includes("h") || f.includes("m") || f.includes("T");
+  }), i = $(() => {
     if (!l.minDate) return !0;
-    const g = Z(l.minDate);
-    if (!g) return !0;
-    const Y = e.value.getFullYear(), _ = e.value.getMonth();
-    return new Date(Y, _, 1) > g;
-  }), n = $(() => {
+    const f = Z(l.minDate);
+    if (!f) return !0;
+    const Y = e.value.getFullYear(), w = e.value.getMonth();
+    return new Date(Y, w, 1) > f;
+  }), s = $(() => {
     if (!l.maxDate) return !0;
-    const g = Z(l.maxDate);
-    if (!g) return !0;
-    const Y = e.value.getFullYear(), _ = e.value.getMonth();
-    return new Date(Y, _ + 1, 0) < g;
-  }), p = () => {
-    s.value && (e.value = new Date(e.value.getFullYear(), e.value.getMonth() - 1, 1));
-  }, y = () => {
-    n.value && (e.value = new Date(e.value.getFullYear(), e.value.getMonth() + 1, 1));
-  }, u = () => {
+    const f = Z(l.maxDate);
+    if (!f) return !0;
+    const Y = e.value.getFullYear(), w = e.value.getMonth();
+    return new Date(Y, w + 1, 0) < f;
+  }), h = () => {
+    i.value && (e.value = new Date(e.value.getFullYear(), e.value.getMonth() - 1, 1));
+  }, b = () => {
+    s.value && (e.value = new Date(e.value.getFullYear(), e.value.getMonth() + 1, 1));
+  }, m = () => {
     e.value = new Date(e.value.getFullYear() - 1, e.value.getMonth(), 1);
-  }, M = () => {
+  }, S = () => {
     e.value = new Date(e.value.getFullYear() + 1, e.value.getMonth(), 1);
-  }, b = () => {
+  }, y = () => {
     e.value = new Date(e.value.getFullYear() - 10, e.value.getMonth(), 1);
-  }, m = () => {
+  }, d = () => {
     e.value = new Date(e.value.getFullYear() + 10, e.value.getMonth(), 1);
   }, a = () => {
-    e.value = /* @__PURE__ */ new Date(), i.value = "date";
-  }, r = () => {
-    switch (i.value) {
+    e.value = /* @__PURE__ */ new Date(), u.value = "date";
+  }, o = () => {
+    switch (u.value) {
       case "date":
-        i.value = "year";
+        u.value = "year";
         break;
       case "year":
-        i.value = "date";
+        u.value = "date";
         break;
     }
-  }, D = (g) => {
-    if (!ne(g, l.minDate, l.maxDate, l.disabledDates)) {
-      if (t.value && L(t.value, g)) {
-        o("update:value", null), o("change", null), o("select", null);
+  }, D = (f) => {
+    if (!le(f, l.minDate, l.maxDate, l.disabledDates)) {
+      if (t.value && L(t.value, f)) {
+        n("update:value", null), n("change", null), n("select", null);
         return;
       }
-      l.mode === "dateTime" && t.value && g.setHours(t.value.getHours(), t.value.getMinutes()), N(g);
+      l.mode === "dateTime" && t.value && f.setHours(t.value.getHours(), t.value.getMinutes()), V(f);
     }
-  }, S = (g) => {
-    if (t.value && L(t.value, g)) {
-      o("update:value", null), o("change", null), o("select", null);
+  }, M = (f) => {
+    if (t.value && L(t.value, f)) {
+      n("update:value", null), n("change", null), n("select", null);
       return;
     }
-    N(g);
-  }, V = (g) => {
-    const Y = new Date(e.value.getFullYear(), g, 1);
-    if (e.value = Y, i.value = "date", l.mode === "month") {
-      if (t.value && re(t.value, Y)) {
-        o("update:value", null), o("change", null), o("select", null);
+    V(f);
+  }, N = (f) => {
+    const Y = new Date(e.value.getFullYear(), f, 1);
+    if (e.value = Y, u.value = "date", l.mode === "month") {
+      if (t.value && oe(t.value, Y)) {
+        n("update:value", null), n("change", null), n("select", null);
         return;
       }
-      N(Y);
+      V(Y);
     }
-  }, T = (g) => {
-    e.value = new Date(g, e.value.getMonth(), 1), i.value = "date";
-  }, F = (g, Y) => {
-    const _ = d(Y);
-    return _.includes("T") ? _.includes(".sss") ? g.toISOString() : g.toISOString().replace(/\.\d{3}Z$/, "Z") : J(g, _);
-  }, N = (g, Y = !1) => {
-    let _;
+  }, T = (f) => {
+    e.value = new Date(f, e.value.getMonth(), 1), u.value = "date";
+  }, I = (f, Y) => {
+    const w = c(Y);
+    return w.includes("T") ? w.includes(".sss") ? f.toISOString() : f.toISOString().replace(/\.\d{3}Z$/, "Z") : J(f, w);
+  }, V = (f, Y = !1) => {
+    let w;
     if (typeof l.value == "string")
       if (Y) {
-        const A = l.format && (l.format.includes("H") || l.format.includes("h") || l.format.includes("m")) ? l.format : "YYYY-MM-DDTHH:mm:ss";
-        _ = J(g, A);
+        const x = l.format && (l.format.includes("H") || l.format.includes("h") || l.format.includes("m")) ? l.format : "YYYY-MM-DDTHH:mm:ss";
+        w = J(f, x);
       } else
-        _ = F(g, l.value);
+        w = I(f, l.value);
     else
-      _ = g;
-    o("update:value", _), o("change", _), o("select", _);
+      w = f;
+    n("update:value", w), n("change", w), n("select", w);
   };
   return {
     currentDate: e,
-    viewMode: i,
+    viewMode: u,
     selectedDate: t,
-    canGoPrev: s,
-    canGoNext: n,
-    hasTime: c,
-    goToPrevMonth: p,
-    goToNextMonth: y,
-    goToPrevYear: u,
-    goToNextYear: M,
-    goToPrevDecade: b,
-    goToNextDecade: m,
+    canGoPrev: i,
+    canGoNext: s,
+    hasTime: r,
+    goToPrevMonth: h,
+    goToNextMonth: b,
+    goToPrevYear: m,
+    goToNextYear: S,
+    goToPrevDecade: y,
+    goToNextDecade: d,
     goToCurrentDate: a,
-    onHeaderClick: r,
+    onHeaderClick: o,
     onDateSelect: D,
-    onWeekSelect: S,
-    onMonthSelect: V,
+    onWeekSelect: M,
+    onMonthSelect: N,
     onYearSelect: T,
-    emitValue: N
+    emitValue: V
   };
 }
-const Qe = { class: "date-picker" }, Xe = {
+const ze = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" fill-rule="evenodd"><path d="M24 0v24H0V0zM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.019-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z"/><path fill="currentColor" d="M8.293 12.707a1 1 0 0 1 0-1.414l5.657-5.657a1 1 0 1 1 1.414 1.414L10.414 12l4.95 4.95a1 1 0 0 1-1.414 1.414z"/></g></svg>', We = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" fill-rule="evenodd"><path d="M24 0v24H0V0zM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.019-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z"/><path fill="currentColor" d="M15.707 11.293a1 1 0 0 1 0 1.414l-5.657 5.657a1 1 0 1 1-1.414-1.414l4.95-4.95l-4.95-4.95a1 1 0 0 1 1.414-1.414z"/></g></svg>', Ge = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M12 18a6 6 0 1 1 0-12a6 6 0 0 1 0 12m0-1.5a4.5 4.5 0 1 0 0-9a4.5 4.5 0 0 0 0 9"/></svg>', Re = {
+  key: 0,
+  class: "date-picker-header"
+}, Je = { class: "date-picker-nav ml-auto" }, Ue = ["disabled"], Ze = ["innerHTML"], Ee = ["innerHTML"], je = ["disabled"], Ke = ["innerHTML"], Qe = { class: "date-picker-date-section" }, Xe = {
   key: 0,
   class: "date-picker-time-section"
 }, pt = /* @__PURE__ */ B({
@@ -674,123 +632,152 @@ const Qe = { class: "date-picker" }, Xe = {
     minuteInterval: { default: 1 }
   },
   emits: ["update:value", "change", "select"],
-  setup(l, { emit: o }) {
-    const e = l, i = o, t = H(null), d = H(0), {
-      currentDate: c,
-      viewMode: s,
-      selectedDate: n,
-      canGoPrev: p,
-      canGoNext: y,
-      hasTime: u,
-      goToPrevMonth: M,
-      goToNextMonth: b,
-      goToPrevYear: m,
-      goToNextYear: a,
-      goToPrevDecade: r,
-      goToNextDecade: D,
-      goToCurrentDate: S,
-      onHeaderClick: V,
-      onDateSelect: T,
-      onWeekSelect: F,
-      onMonthSelect: N,
-      onYearSelect: g,
-      emitValue: Y
-    } = Ke(e, i), _ = (w) => {
-      if (w === null) {
-        if (n.value) {
-          const A = new Date(n.value);
-          A.setHours(0, 0, 0, 0);
-          const O = J(A, "YYYY-MM-DD");
-          i("update:value", O), i("change", O), i("select", O);
+  setup(l, { emit: n }) {
+    const e = l, u = n, {
+      currentDate: t,
+      viewMode: c,
+      selectedDate: r,
+      canGoPrev: i,
+      canGoNext: s,
+      hasTime: h,
+      goToPrevMonth: b,
+      goToNextMonth: m,
+      goToPrevYear: S,
+      goToNextYear: y,
+      goToPrevDecade: d,
+      goToNextDecade: a,
+      goToCurrentDate: o,
+      onHeaderClick: D,
+      onDateSelect: M,
+      onWeekSelect: N,
+      onMonthSelect: T,
+      onYearSelect: I,
+      emitValue: V
+    } = Oe(e, u), f = (_) => {
+      if (_ === null) {
+        if (r.value) {
+          const x = new Date(r.value);
+          x.setHours(0, 0, 0, 0);
+          const z = J(x, "YYYY-MM-DD");
+          u("update:value", z), u("change", z), u("select", z);
         }
         return;
       }
-      if (e.mode === "dateTime" && n.value) {
-        const A = new Date(n.value.getTime());
-        A.setHours(w.getHours(), w.getMinutes(), 0, 0), Y(A, !0);
+      if (e.mode === "dateTime" && r.value) {
+        const x = new Date(r.value.getTime());
+        x.setHours(_.getHours(), _.getMinutes(), 0, 0), V(x, !0);
       } else
-        Y(w, !0);
+        V(_, !0);
+    }, Y = () => {
+      c.value === "year" ? d() : c.value === "month" ? S() : b();
+    }, w = () => {
+      c.value === "year" ? a() : c.value === "month" ? y() : m();
     };
-    return K(async () => {
-      W(() => {
-        t.value && (d.value = t.value.clientHeight);
-      });
-    }), (w, A) => (h(), k("div", Qe, [
-      w.mode !== "time" ? (h(), z(je, {
-        key: 0,
-        "current-date": v(c),
-        "view-mode": v(s),
-        "can-go-prev": v(p),
-        "can-go-next": v(y),
-        onPrev: A[0] || (A[0] = (O) => v(s) === "year" ? v(r)() : v(s) === "month" ? v(m)() : v(M)()),
-        onNext: A[1] || (A[1] = (O) => v(s) === "year" ? v(D)() : v(s) === "month" ? v(a)() : v(b)()),
-        onHeaderClick: v(V),
-        onCurrentDate: v(S)
-      }, null, 8, ["current-date", "view-mode", "can-go-prev", "can-go-next", "onHeaderClick", "onCurrentDate"])) : q("", !0),
-      f("div", {
-        class: I({
-          "date-picker-datetime-layout": w.mode === "dateTime" && v(s) === "date"
-        }),
-        style: se({
-          height: d.value !== 0 ? d.value + "px" : "100%"
+    return (_, x) => (p(), k("div", {
+      class: H(["date-picker", _.mode == "dateTime" && "date-picker-container-wide"])
+    }, [
+      _.mode !== "time" ? (p(), k("div", Re, [
+        G(Le, {
+          "current-date": g(t),
+          "view-mode": g(c),
+          onHeaderClick: g(D)
+        }, null, 8, ["current-date", "view-mode", "onHeaderClick"]),
+        v("div", Je, [
+          v("button", {
+            class: "date-picker-nav-button",
+            disabled: !g(i),
+            onClick: Y,
+            type: "button",
+            "aria-label": "Previous"
+          }, [
+            v("span", {
+              class: "date-picker-nav-icon",
+              innerHTML: g(ze)
+            }, null, 8, Ze)
+          ], 8, Ue),
+          v("button", {
+            class: "date-picker-nav-button",
+            onClick: x[0] || (x[0] = //@ts-ignore
+            (...z) => g(o) && g(o)(...z)),
+            type: "button",
+            "aria-label": "Current Date"
+          }, [
+            v("span", {
+              class: "date-picker-nav-icon",
+              innerHTML: g(Ge)
+            }, null, 8, Ee)
+          ]),
+          v("button", {
+            class: "date-picker-nav-button",
+            disabled: !g(s),
+            onClick: w,
+            type: "button",
+            "aria-label": "Next"
+          }, [
+            v("span", {
+              class: "date-picker-nav-icon",
+              innerHTML: g(We)
+            }, null, 8, Ke)
+          ], 8, je)
+        ])
+      ])) : q("", !0),
+      v("div", {
+        class: H({
+          "date-picker-datetime-layout": _.mode === "dateTime" && g(c) === "date"
         })
       }, [
-        f("div", {
-          class: "date-picker-date-section",
-          ref_key: "datePickerContent",
-          ref: t
-        }, [
-          v(s) === "date" && (w.mode === "date" || w.mode === "dateTime") ? (h(), z(he, {
+        v("div", Qe, [
+          g(c) === "date" && (_.mode === "date" || _.mode === "dateTime") ? (p(), W(pe, {
             key: 0,
-            "current-date": v(c),
-            "selected-date": v(n),
-            "min-date": w.minDate,
-            "max-date": w.maxDate,
-            "disabled-dates": w.disabledDates,
-            onSelect: v(T)
+            "current-date": g(t),
+            "selected-date": g(r),
+            "min-date": _.minDate,
+            "max-date": _.maxDate,
+            "disabled-dates": _.disabledDates,
+            onSelect: g(M)
           }, null, 8, ["current-date", "selected-date", "min-date", "max-date", "disabled-dates", "onSelect"])) : q("", !0),
-          w.mode === "week" && v(s) === "date" ? (h(), z(Se, {
+          _.mode === "week" && g(c) === "date" ? (p(), W(Me, {
             key: 1,
-            "current-date": v(c),
-            "selected-date": v(n),
-            onSelect: v(F)
+            "current-date": g(t),
+            "selected-date": g(r),
+            onSelect: g(N)
           }, null, 8, ["current-date", "selected-date", "onSelect"])) : q("", !0),
-          v(s) !== "year" && (v(s) === "month" || w.mode === "month") ? (h(), z(Le, {
+          g(c) !== "year" && (g(c) === "month" || _.mode === "month") ? (p(), W(qe, {
             key: 2,
-            "current-date": v(c),
-            "selected-date": v(n),
-            onSelect: v(N)
+            "current-date": g(t),
+            "selected-date": g(r),
+            onSelect: g(T)
           }, null, 8, ["current-date", "selected-date", "onSelect"])) : q("", !0),
-          v(s) === "year" ? (h(), z(Ae, {
+          g(c) === "year" ? (p(), W(Ae, {
             key: 3,
-            "current-date": v(c),
-            "selected-date": v(n),
-            onSelect: v(g),
-            onMonthSelect: v(N)
+            "current-date": g(t),
+            "selected-date": g(r),
+            onSelect: g(I),
+            onMonthSelect: g(T)
           }, null, 8, ["current-date", "selected-date", "onSelect", "onMonthSelect"])) : q("", !0)
-        ], 512),
-        w.mode === "dateTime" && v(s) === "date" ? (h(), k("div", Xe, [
-          R(j, {
-            "selected-time": v(u) ? v(n) : null,
-            "time-format": w.timeFormat,
-            "minute-interval": w.minuteInterval,
-            onUpdate: _
+        ]),
+        _.mode === "dateTime" && g(c) === "date" ? (p(), k("div", Xe, [
+          G(j, {
+            "selected-time": g(h) ? g(r) : null,
+            "time-format": _.timeFormat,
+            "minute-interval": _.minuteInterval,
+            onUpdate: f
           }, null, 8, ["selected-time", "time-format", "minute-interval"])
         ])) : q("", !0)
-      ], 6),
-      w.mode === "time" ? (h(), z(j, {
+      ], 2),
+      _.mode === "time" ? (p(), W(j, {
         key: 1,
-        "selected-time": v(n),
-        "time-format": w.timeFormat,
-        "minute-interval": w.minuteInterval,
-        onUpdate: _
+        "selected-time": g(r),
+        "time-format": _.timeFormat,
+        "minute-interval": _.minuteInterval,
+        onUpdate: f
       }, null, 8, ["selected-time", "time-format", "minute-interval"])) : q("", !0)
-    ]));
+    ], 2));
   }
 }), et = {
   ref: "dropdownRef",
   class: "time-picker-dropdown"
-}, tt = { class: "time-picker-sections" }, lt = { class: "time-picker-time-section" }, nt = ["onClick"], at = { class: "time-picker-time-section" }, st = ["onClick"], ot = {
+}, tt = { class: "time-picker-sections" }, lt = { class: "time-picker-time-section" }, at = ["onClick"], st = { class: "time-picker-time-section" }, nt = ["onClick"], ot = {
   key: 0,
   class: "time-picker-time-section time-picker-period-section"
 }, rt = /* @__PURE__ */ B({
@@ -803,75 +790,75 @@ const Qe = { class: "date-picker" }, Xe = {
     minuteInterval: { default: 1 }
   },
   emits: ["select-hour", "select-minute", "select-period", "close"],
-  setup(l, { expose: o, emit: e }) {
-    const i = l, t = e, d = H(null), c = H(null), s = H(null), n = $(() => i.is12Hour ? Array.from({ length: 12 }, (m, a) => a + 1) : Array.from({ length: 24 }, (m, a) => a)), p = $(() => {
-      const m = i.minuteInterval, a = Math.floor(60 / m);
-      return Array.from({ length: a }, (r, D) => D * m);
-    }), y = () => {
-      if (d.value) {
-        const m = d.value.querySelectorAll(".time-picker-option-button"), a = Array.from(m).findIndex((r) => r.classList.contains("selected"));
-        a !== -1 && m[a].scrollIntoView({ block: "center", behavior: "auto" });
-      }
+  setup(l, { expose: n, emit: e }) {
+    const u = l, t = e, c = C(null), r = C(null), i = C(null), s = $(() => u.is12Hour ? Array.from({ length: 12 }, (d, a) => a + 1) : Array.from({ length: 24 }, (d, a) => a)), h = $(() => {
+      const d = u.minuteInterval, a = Math.floor(60 / d);
+      return Array.from({ length: a }, (o, D) => D * d);
+    }), b = () => {
       if (c.value) {
-        const m = c.value.querySelectorAll(".time-picker-option-button"), a = Array.from(m).findIndex((r) => r.classList.contains("selected"));
-        a !== -1 && m[a].scrollIntoView({ block: "center", behavior: "auto" });
+        const d = c.value.querySelectorAll(".time-picker-option-button"), a = Array.from(d).findIndex((o) => o.classList.contains("selected"));
+        a !== -1 && d[a].scrollIntoView({ block: "center", behavior: "auto" });
       }
-      if (i.is12Hour && s.value) {
-        const m = s.value.querySelectorAll(".time-picker-option-button"), a = Array.from(m).findIndex((r) => r.classList.contains("selected"));
-        a !== -1 && m[a].scrollIntoView({ block: "center", behavior: "auto" });
+      if (r.value) {
+        const d = r.value.querySelectorAll(".time-picker-option-button"), a = Array.from(d).findIndex((o) => o.classList.contains("selected"));
+        a !== -1 && d[a].scrollIntoView({ block: "center", behavior: "auto" });
       }
-    }, u = (m) => {
-      t("select-hour", m);
-    }, M = (m) => {
-      t("select-minute", m);
-    }, b = (m) => {
-      t("select-period", m);
+      if (u.is12Hour && i.value) {
+        const d = i.value.querySelectorAll(".time-picker-option-button"), a = Array.from(d).findIndex((o) => o.classList.contains("selected"));
+        a !== -1 && d[a].scrollIntoView({ block: "center", behavior: "auto" });
+      }
+    }, m = (d) => {
+      t("select-hour", d);
+    }, S = (d) => {
+      t("select-minute", d);
+    }, y = (d) => {
+      t("select-period", d);
     };
-    return o({ scrollToSelected: y }), (m, a) => (h(), k("div", et, [
-      f("div", tt, [
-        f("div", lt, [
-          f("div", {
+    return n({ scrollToSelected: b }), (d, a) => (p(), k("div", et, [
+      v("div", tt, [
+        v("div", lt, [
+          v("div", {
             ref_key: "hourScroll",
-            ref: d,
+            ref: c,
             class: "time-picker-options-scroll"
           }, [
-            (h(!0), k(C, null, P(n.value, (r) => (h(), k("button", {
-              key: r,
+            (p(!0), k(P, null, F(s.value, (o) => (p(), k("button", {
+              key: o,
               type: "button",
-              class: I(["time-picker-option-button", { selected: r === m.selectedHour }]),
-              onClick: (D) => u(r)
-            }, x(String(r).padStart(2, "0")), 11, nt))), 128))
+              class: H(["time-picker-option-button", { selected: o === d.selectedHour }]),
+              onClick: (D) => m(o)
+            }, A(String(o).padStart(2, "0")), 11, at))), 128))
           ], 512)
         ]),
-        f("div", at, [
-          f("div", {
+        v("div", st, [
+          v("div", {
             ref_key: "minuteScroll",
-            ref: c,
+            ref: r,
             class: "time-picker-options-scroll"
           }, [
-            (h(!0), k(C, null, P(p.value, (r) => (h(), k("button", {
-              key: r,
+            (p(!0), k(P, null, F(h.value, (o) => (p(), k("button", {
+              key: o,
               type: "button",
-              class: I(["time-picker-option-button", { selected: r === m.selectedMinute }]),
-              onClick: (D) => M(r)
-            }, x(String(r).padStart(2, "0")), 11, st))), 128))
+              class: H(["time-picker-option-button", { selected: o === d.selectedMinute }]),
+              onClick: (D) => S(o)
+            }, A(String(o).padStart(2, "0")), 11, nt))), 128))
           ], 512)
         ]),
-        m.is12Hour ? (h(), k("div", ot, [
-          f("div", {
+        d.is12Hour ? (p(), k("div", ot, [
+          v("div", {
             ref_key: "periodScroll",
-            ref: s,
+            ref: i,
             class: "time-picker-options-scroll"
           }, [
-            f("button", {
+            v("button", {
               type: "button",
-              class: I(["time-picker-option-button", { selected: m.selectedPeriod === "AM" }]),
-              onClick: a[0] || (a[0] = (r) => b("AM"))
+              class: H(["time-picker-option-button", { selected: d.selectedPeriod === "AM" }]),
+              onClick: a[0] || (a[0] = (o) => y("AM"))
             }, " AM ", 2),
-            f("button", {
+            v("button", {
               type: "button",
-              class: I(["time-picker-option-button", { selected: m.selectedPeriod === "PM" }]),
-              onClick: a[1] || (a[1] = (r) => b("PM"))
+              class: H(["time-picker-option-button", { selected: d.selectedPeriod === "PM" }]),
+              onClick: a[1] || (a[1] = (o) => y("PM"))
             }, " PM ", 2)
           ], 512)
         ])) : q("", !0)
@@ -890,22 +877,22 @@ const Qe = { class: "date-picker" }, Xe = {
     readonly: { type: Boolean }
   },
   setup(l) {
-    const o = l, e = $(() => {
-      const i = String(o.minute).padStart(2, "0");
-      if (o.is12Hour) {
-        let t = o.hour % 12;
-        return t === 0 && (t = 12), `${String(t).padStart(2, "0")}:${i} ${o.period}`;
+    const n = l, e = $(() => {
+      const u = String(n.minute).padStart(2, "0");
+      if (n.is12Hour) {
+        let t = n.hour % 12;
+        return t === 0 && (t = 12), `${String(t).padStart(2, "0")}:${u} ${n.period}`;
       } else
-        return `${String(o.hour).padStart(2, "0")}:${i}`;
+        return `${String(n.hour).padStart(2, "0")}:${u}`;
     });
-    return (i, t) => Q(i.$slots, "default", X(ee({ displayTime: e.value })), () => [
-      f("button", {
+    return (u, t) => K(u.$slots, "default", Q(X({ displayTime: e.value })), () => [
+      v("button", {
         type: "button",
-        class: I(["time-picker-input", [i.triggerClass, { "is-disabled": i.disabled, "is-readonly": i.readonly }]]),
-        disabled: i.disabled || i.readonly
+        class: H(["time-picker-input", [u.triggerClass, { "is-disabled": u.disabled, "is-readonly": u.readonly }]]),
+        disabled: u.disabled || u.readonly
       }, [
-        f("span", ct, x(e.value), 1),
-        t[0] || (t[0] = f("svg", {
+        v("span", ct, A(e.value), 1),
+        t[0] || (t[0] = v("svg", {
           class: "time-picker-clock-icon",
           xmlns: "http://www.w3.org/2000/svg",
           width: "18",
@@ -917,12 +904,12 @@ const Qe = { class: "date-picker" }, Xe = {
           "stroke-linecap": "round",
           "stroke-linejoin": "round"
         }, [
-          f("circle", {
+          v("circle", {
             cx: "12",
             cy: "12",
             r: "10"
           }),
-          f("polyline", { points: "12,6 12,12 16,14" })
+          v("polyline", { points: "12,6 12,12 16,14" })
         ], -1))
       ], 10, it)
     ]);
@@ -943,44 +930,44 @@ const Qe = { class: "date-picker" }, Xe = {
     readonly: { type: Boolean, default: !1 }
   },
   emits: ["update:modelValue"],
-  setup(l, { emit: o }) {
-    const e = l, i = o, t = H(12), d = H(0), c = H("AM"), s = H(null), n = $(() => e.timeFormat === "12h"), p = () => {
+  setup(l, { emit: n }) {
+    const e = l, u = n, t = C(12), c = C(0), r = C("AM"), i = C(null), s = $(() => e.timeFormat === "12h"), h = () => {
       if (e.modelValue) {
-        let a = 0, r = 0;
+        let a = 0, o = 0;
         if (e.modelValue instanceof Date)
-          a = e.modelValue.getHours(), r = e.modelValue.getMinutes();
+          a = e.modelValue.getHours(), o = e.modelValue.getMinutes();
         else if (typeof e.modelValue == "string") {
-          const [D, S] = e.modelValue.split(":");
-          a = parseInt(D), r = parseInt(S);
+          const [D, M] = e.modelValue.split(":");
+          a = parseInt(D), o = parseInt(M);
         } else {
           const D = /* @__PURE__ */ new Date();
-          a = D.getHours(), r = D.getMinutes();
+          a = D.getHours(), o = D.getMinutes();
         }
-        d.value = r, n.value ? a === 0 ? (t.value = 12, c.value = "AM") : a === 12 ? (t.value = 12, c.value = "PM") : a > 12 ? (t.value = a - 12, c.value = "PM") : (t.value = a, c.value = "AM") : t.value = a;
+        c.value = o, s.value ? a === 0 ? (t.value = 12, r.value = "AM") : a === 12 ? (t.value = 12, r.value = "PM") : a > 12 ? (t.value = a - 12, r.value = "PM") : (t.value = a, r.value = "AM") : t.value = a;
       } else {
-        const a = /* @__PURE__ */ new Date(), r = a.getHours(), D = a.getMinutes();
-        d.value = D, n.value ? r === 0 ? (t.value = 12, c.value = "AM") : r === 12 ? (t.value = 12, c.value = "PM") : r > 12 ? (t.value = r - 12, c.value = "PM") : (t.value = r, c.value = "AM") : t.value = r;
+        const a = /* @__PURE__ */ new Date(), o = a.getHours(), D = a.getMinutes();
+        c.value = D, s.value ? o === 0 ? (t.value = 12, r.value = "AM") : o === 12 ? (t.value = 12, r.value = "PM") : o > 12 ? (t.value = o - 12, r.value = "PM") : (t.value = o, r.value = "AM") : t.value = o;
       }
-    }, y = () => {
+    }, b = () => {
       let a = t.value;
-      n.value && (c.value === "AM" && a === 12 ? a = 0 : c.value === "PM" && a !== 12 && (a += 12));
-      const r = `${String(a).padStart(2, "0")}:${String(d.value).padStart(2, "0")}`;
-      i("update:modelValue", r);
-    }, u = (a) => {
-      t.value = a, y();
-    }, M = (a) => {
-      d.value = a, y();
-    }, b = (a) => {
-      c.value = a, y();
-    }, m = () => {
+      s.value && (r.value === "AM" && a === 12 ? a = 0 : r.value === "PM" && a !== 12 && (a += 12));
+      const o = `${String(a).padStart(2, "0")}:${String(c.value).padStart(2, "0")}`;
+      u("update:modelValue", o);
+    }, m = (a) => {
+      t.value = a, b();
+    }, S = (a) => {
+      c.value = a, b();
+    }, y = (a) => {
+      r.value = a, b();
+    }, d = () => {
       var a;
-      (a = s == null ? void 0 : s.value) == null || a.scrollToSelected();
+      (a = i == null ? void 0 : i.value) == null || a.scrollToSelected();
     };
-    return G(() => e.modelValue, p, { immediate: !0 }), G(() => e.timeFormat, p), G(() => e.minuteInterval, p), (a, r) => (h(), k("div", dt, [
-      R(v(oe), {
+    return O(() => e.modelValue, h, { immediate: !0 }), O(() => e.timeFormat, h), O(() => e.minuteInterval, h), (a, o) => (p(), k("div", dt, [
+      G(g(ne), {
         trigger: "click",
         placement: "bottom-start",
-        onOnShow: m,
+        onOnShow: d,
         teleport: "",
         arrow: !1,
         offset: a.offset,
@@ -992,33 +979,33 @@ const Qe = { class: "date-picker" }, Xe = {
         }
       }, {
         trigger: U(() => [
-          R(ut, {
+          G(ut, {
             hour: t.value,
-            minute: d.value,
-            period: c.value,
-            "is12-hour": n.value,
+            minute: c.value,
+            period: r.value,
+            "is12-hour": s.value,
             "trigger-class": a.triggerClass,
             disabled: a.disabled,
             readonly: a.readonly
           }, {
             default: U(({ displayTime: D }) => [
-              Q(a.$slots, "default", X(ee({ displayTime: D })))
+              K(a.$slots, "default", Q(X({ displayTime: D })))
             ]),
             _: 3
           }, 8, ["hour", "minute", "period", "is12-hour", "trigger-class", "disabled", "readonly"])
         ]),
         default: U(() => [
-          R(rt, {
+          G(rt, {
             ref_key: "dropdownRef",
-            ref: s,
+            ref: i,
             "selected-hour": t.value,
-            "selected-minute": d.value,
-            "selected-period": c.value,
-            "is12-hour": n.value,
+            "selected-minute": c.value,
+            "selected-period": r.value,
+            "is12-hour": s.value,
             "minute-interval": a.minuteInterval,
-            onSelectHour: u,
-            onSelectMinute: M,
-            onSelectPeriod: b
+            onSelectHour: m,
+            onSelectMinute: S,
+            onSelectPeriod: y
           }, null, 8, ["selected-hour", "selected-minute", "selected-period", "is12-hour", "minute-interval"])
         ]),
         _: 3