v-datepicker-lite 0.0.5 → 0.0.6

package/index.js

@@ -1,69 +1,69 @@
-import { defineComponent as q, computed as Y, createElementBlock as D, openBlock as v, createElementVNode as p, Fragment as C, renderList as H, unref as o, toDisplayString as x, normalizeClass as I, ref as N, watch as O, nextTick as B, onMounted as R, createBlock as z, createCommentVNode as G, normalizeStyle as Q, createVNode as X } from "vue";
-const U = (t, r = "YYYY-MM-DD") => {
-  const e = t.getFullYear(), u = String(t.getMonth() + 1).padStart(2, "0"), s = String(t.getDate()).padStart(2, "0"), d = String(t.getHours()).padStart(2, "0"), i = String(t.getMinutes()).padStart(2, "0"), a = String(t.getSeconds()).padStart(2, "0"), n = String(t.getMilliseconds()).padStart(3, "0");
-  return r.replace("YYYY", e.toString()).replace("MM", u).replace("DD", s).replace("HH", d).replace("mm", i).replace("ss", a).replace("sss", n);
-}, W = (t) => {
-  if (!t) return null;
-  const r = new Date(t);
-  return isNaN(r.getTime()) ? null : r;
-}, L = (t, r) => t.getFullYear() === r.getFullYear() && t.getMonth() === r.getMonth() && t.getDate() === r.getDate(), ee = (t) => {
-  const r = new Date(t.getFullYear(), 0, 1), e = (t.getTime() - r.getTime()) / 864e5;
-  return Math.ceil((e + r.getDay() + 1) / 7);
-}, Z = (t, r) => {
-  const e = new Date(t, r, 1), s = new Date(t, r + 1, 0).getDate(), d = e.getDay(), i = [], a = /* @__PURE__ */ new Date(), n = r === 0 ? 11 : r - 1, m = r === 0 ? t - 1 : t, g = new Date(m, n + 1, 0).getDate();
-  for (let f = d - 1; f >= 0; f--) {
-    const c = new Date(m, n, g - f);
+import { defineComponent as N, computed as $, createElementBlock as f, openBlock as p, createElementVNode as g, Fragment as P, renderList as x, unref as v, toDisplayString as F, normalizeClass as I, ref as Y, watch as G, nextTick as B, onMounted as R, createBlock as q, createCommentVNode as V, normalizeStyle as X, createVNode as U, onUnmounted as ee } from "vue";
+const Z = (n, c = "YYYY-MM-DD") => {
+  const e = n.getFullYear(), h = String(n.getMonth() + 1).padStart(2, "0"), s = String(n.getDate()).padStart(2, "0"), o = String(n.getHours()).padStart(2, "0"), i = String(n.getMinutes()).padStart(2, "0"), t = String(n.getSeconds()).padStart(2, "0"), a = String(n.getMilliseconds()).padStart(3, "0");
+  return c.replace("YYYY", e.toString()).replace("MM", h).replace("DD", s).replace("HH", o).replace("mm", i).replace("ss", t).replace("sss", a);
+}, z = (n) => {
+  if (!n) return null;
+  const c = new Date(n);
+  return isNaN(c.getTime()) ? null : c;
+}, O = (n, c) => n.getFullYear() === c.getFullYear() && n.getMonth() === c.getMonth() && n.getDate() === c.getDate(), te = (n) => {
+  const c = new Date(n.getFullYear(), 0, 1), e = (n.getTime() - c.getTime()) / 864e5;
+  return Math.ceil((e + c.getDay() + 1) / 7);
+}, E = (n, c) => {
+  const e = new Date(n, c, 1), s = new Date(n, c + 1, 0).getDate(), o = e.getDay(), i = [], t = /* @__PURE__ */ new Date(), a = c === 0 ? 11 : c - 1, m = c === 0 ? n - 1 : n, y = new Date(m, a + 1, 0).getDate();
+  for (let M = o - 1; M >= 0; M--) {
+    const u = new Date(m, a, y - M);
     i.push({
-      date: c,
-      day: g - f,
-      month: n,
+      date: u,
+      day: y - M,
+      month: a,
       year: m,
       isCurrentMonth: !1,
-      isToday: L(c, a),
+      isToday: O(u, t),
       isSelected: !1,
       isDisabled: !1
     });
   }
-  for (let f = 1; f <= s; f++) {
-    const c = new Date(t, r, f);
+  for (let M = 1; M <= s; M++) {
+    const u = new Date(n, c, M);
     i.push({
-      date: c,
-      day: f,
-      month: r,
-      year: t,
+      date: u,
+      day: M,
+      month: c,
+      year: n,
       isCurrentMonth: !0,
-      isToday: L(c, a),
+      isToday: O(u, t),
       isSelected: !1,
       isDisabled: !1
     });
   }
-  const l = 42 - i.length, b = r === 11 ? 0 : r + 1, k = r === 11 ? t + 1 : t;
-  for (let f = 1; f <= l; f++) {
-    const c = new Date(k, b, f);
+  const r = 42 - i.length, S = c === 11 ? 0 : c + 1, _ = c === 11 ? n + 1 : n;
+  for (let M = 1; M <= r; M++) {
+    const u = new Date(_, S, M);
     i.push({
-      date: c,
-      day: f,
-      month: b,
-      year: k,
+      date: u,
+      day: M,
+      month: S,
+      year: _,
       isCurrentMonth: !1,
-      isToday: L(c, a),
+      isToday: O(u, t),
       isSelected: !1,
       isDisabled: !1
     });
   }
   return i;
-}, te = (t, r) => {
-  const e = Z(t, r), u = [];
+}, ne = (n, c) => {
+  const e = E(n, c), h = [];
   for (let s = 0; s < e.length; s += 7) {
-    const d = e.slice(s, s + 7), i = ee(d[0].date);
-    u.push({
+    const o = e.slice(s, s + 7), i = te(o[0].date);
+    h.push({
       weekNumber: i,
-      days: d,
+      days: o,
       isSelected: !1
     });
   }
-  return u;
-}, E = (t) => [
+  return h;
+}, j = (n) => [
   "January",
   "February",
   "March",
@@ -76,16 +76,16 @@ const U = (t, r = "YYYY-MM-DD") => {
   "October",
   "November",
   "December"
-].map((e, u) => ({
-  month: u,
-  year: t,
+].map((e, h) => ({
+  month: h,
+  year: n,
   name: e,
   isSelected: !1,
   isDisabled: !1
-})), ae = (t, r, e, u) => {
-  const s = U(t, "YYYY-MM-DD");
-  return r && s < r || e && s > e ? !0 : u ? u.some((d) => d.end ? s >= d.start && s <= d.end : s === d.start) : !1;
-}, A = [
+})), se = (n, c, e, h) => {
+  const s = Z(n, "YYYY-MM-DD");
+  return c && s < c || e && s > e ? !0 : h ? h.some((o) => o.end ? s >= o.start && s <= o.end : s === o.start) : !1;
+}, W = [
   "January",
   "February",
   "March",
@@ -98,7 +98,7 @@ const U = (t, r = "YYYY-MM-DD") => {
   "October",
   "November",
   "December"
-], j = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], ne = { class: "date-picker-content" }, se = { class: "date-picker-table" }, le = { class: "date-picker-weekdays-row" }, re = { class: "date-picker-days-body" }, oe = ["onClick", "disabled"], ce = /* @__PURE__ */ q({
+], K = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], ae = { class: "date-picker-content" }, le = { class: "date-picker-table" }, oe = { class: "date-picker-weekdays-row" }, re = { class: "date-picker-days-body" }, ce = ["onClick", "disabled"], ie = /* @__PURE__ */ N({
   __name: "DateView",
   props: {
     currentDate: {},
@@ -108,104 +108,104 @@ const U = (t, r = "YYYY-MM-DD") => {
     disabledDates: {}
   },
   emits: ["select"],
-  setup(t, { emit: r }) {
-    const e = t, u = r, s = Y(() => Z(e.currentDate.getFullYear(), e.currentDate.getMonth()).map((n) => ({
-      ...n,
-      isSelected: e.selectedDate ? L(n.date, e.selectedDate) : !1,
-      isDisabled: ae(n.date, e.minDate, e.maxDate, e.disabledDates)
-    }))), d = Y(() => {
-      const a = [];
-      for (let n = 0; n < s.value.length; n += 7)
-        a.push(s.value.slice(n, n + 7));
-      return a;
-    }), i = (a) => {
-      a.isDisabled || u("select", a.date);
+  setup(n, { emit: c }) {
+    const e = n, h = c, s = $(() => E(e.currentDate.getFullYear(), e.currentDate.getMonth()).map((a) => ({
+      ...a,
+      isSelected: e.selectedDate ? O(a.date, e.selectedDate) : !1,
+      isDisabled: se(a.date, e.minDate, e.maxDate, e.disabledDates)
+    }))), o = $(() => {
+      const t = [];
+      for (let a = 0; a < s.value.length; a += 7)
+        t.push(s.value.slice(a, a + 7));
+      return t;
+    }), i = (t) => {
+      t.isDisabled || h("select", t.date);
     };
-    return (a, n) => (v(), D("div", ne, [
-      p("table", se, [
-        p("thead", null, [
-          p("tr", le, [
-            (v(!0), D(C, null, H(o(j), (m) => (v(), D("th", { key: m }, x(m), 1))), 128))
+    return (t, a) => (p(), f("div", ae, [
+      g("table", le, [
+        g("thead", null, [
+          g("tr", oe, [
+            (p(!0), f(P, null, x(v(K), (m) => (p(), f("th", { key: m }, F(m), 1))), 128))
           ])
         ]),
-        p("tbody", re, [
-          (v(!0), D(C, null, H(d.value, (m, g) => (v(), D("tr", {
-            key: g,
+        g("tbody", re, [
+          (p(!0), f(P, null, x(o.value, (m, y) => (p(), f("tr", {
+            key: y,
             class: "date-picker-week-row"
           }, [
-            (v(!0), D(C, null, H(m, (l) => (v(), D("td", {
-              key: `${l.year}-${l.month}-${l.day}`,
+            (p(!0), f(P, null, x(m, (r) => (p(), f("td", {
+              key: `${r.year}-${r.month}-${r.day}`,
               class: "date-picker-day-cell"
             }, [
-              p("button", {
+              g("button", {
                 class: I([
                   "date-picker-day",
                   {
-                    "other-month": !l.isCurrentMonth,
-                    today: l.isToday,
-                    selected: l.isSelected,
-                    disabled: l.isDisabled
+                    "other-month": !r.isCurrentMonth,
+                    today: r.isToday,
+                    selected: r.isSelected,
+                    disabled: r.isDisabled
                   }
                 ]),
-                onClick: (b) => i(l),
-                disabled: l.isDisabled
-              }, x(l.day), 11, oe)
+                onClick: (S) => i(r),
+                disabled: r.isDisabled
+              }, F(r.day), 11, ce)
             ]))), 128))
           ]))), 128))
         ])
       ])
     ]));
   }
-}), ie = { class: "date-picker-content" }, ue = {
+}), ue = { class: "date-picker-content" }, de = {
   class: "date-picker-table date-picker-week-table",
   cellpadding: "0",
   cellspacing: "0"
-}, de = { class: "date-picker-weekdays-row" }, me = { class: "date-picker-weeks-body" }, ve = ["onClick"], he = { class: "date-picker-week-number-cell" }, pe = { class: "date-picker-week-number" }, De = /* @__PURE__ */ q({
+}, me = { class: "date-picker-weekdays-row" }, ve = { class: "date-picker-weeks-body" }, pe = ["onClick"], he = { class: "date-picker-week-number-cell" }, ke = { class: "date-picker-week-number" }, ge = /* @__PURE__ */ N({
   __name: "WeekView",
   props: {
     currentDate: {},
     selectedDate: {}
   },
   emits: ["select"],
-  setup(t, { emit: r }) {
-    const e = t, u = r, s = Y(() => te(e.currentDate.getFullYear(), e.currentDate.getMonth()).map((a) => {
-      const n = e.selectedDate ? a.days.some((m) => L(m.date, e.selectedDate)) : !1;
+  setup(n, { emit: c }) {
+    const e = n, h = c, s = $(() => ne(e.currentDate.getFullYear(), e.currentDate.getMonth()).map((t) => {
+      const a = e.selectedDate ? t.days.some((m) => O(m.date, e.selectedDate)) : !1;
       return {
-        ...a,
-        isSelected: n
+        ...t,
+        isSelected: a
       };
-    })), d = (i) => {
-      var n;
-      const a = ((n = i.days.find((m) => m.isCurrentMonth)) == null ? void 0 : n.date) || i.days[0].date;
-      u("select", a);
+    })), o = (i) => {
+      var a;
+      const t = ((a = i.days.find((m) => m.isCurrentMonth)) == null ? void 0 : a.date) || i.days[0].date;
+      h("select", t);
     };
-    return (i, a) => (v(), D("div", ie, [
-      p("table", ue, [
-        p("thead", null, [
-          p("tr", de, [
-            a[0] || (a[0] = p("th", { class: "date-picker-weekday date-picker-week-header" }, "Wk", -1)),
-            (v(!0), D(C, null, H(o(j), (n) => (v(), D("th", { key: n }, x(n), 1))), 128))
+    return (i, t) => (p(), f("div", ue, [
+      g("table", de, [
+        g("thead", null, [
+          g("tr", me, [
+            t[0] || (t[0] = g("th", { class: "date-picker-weekday date-picker-week-header" }, "Wk", -1)),
+            (p(!0), f(P, null, x(v(K), (a) => (p(), f("th", { key: a }, F(a), 1))), 128))
           ])
         ]),
-        p("tbody", me, [
-          (v(!0), D(C, null, H(s.value, (n) => (v(), D("tr", {
-            key: n.weekNumber,
+        g("tbody", ve, [
+          (p(!0), f(P, null, x(s.value, (a) => (p(), f("tr", {
+            key: a.weekNumber,
             class: I([
               "date-picker-week-row",
               {
-                selected: n.isSelected
+                selected: a.isSelected
               }
             ]),
-            onClick: (m) => d(n)
+            onClick: (m) => o(a)
           }, [
-            p("td", he, [
-              p("div", pe, x(n.weekNumber), 1)
+            g("td", he, [
+              g("div", ke, F(a.weekNumber), 1)
             ]),
-            (v(!0), D(C, null, H(n.days, (m) => (v(), D("td", {
+            (p(!0), f(P, null, x(a.days, (m) => (p(), f("td", {
               key: `${m.year}-${m.month}-${m.day}`,
               class: "date-picker-day-cell"
             }, [
-              p("button", {
+              g("button", {
                 class: I([
                   "date-picker-day",
                   {
@@ -213,87 +213,87 @@ const U = (t, r = "YYYY-MM-DD") => {
                     today: m.isToday
                   }
                 ])
-              }, x(m.day), 3)
+              }, F(m.day), 3)
             ]))), 128))
-          ], 10, ve))), 128))
+          ], 10, pe))), 128))
         ])
       ])
     ]));
   }
 });
-function ge(t, r = "24h", e = 15, u) {
-  const s = N(0), d = N(0), i = N([]), a = Y(() => r === "12h"), n = () => {
-    if (t)
-      s.value = t.getHours(), d.value = t.getMinutes();
+function fe(n, c = "24h", e = 15, h) {
+  const s = Y(0), o = Y(0), i = Y([]), t = $(() => c === "12h"), a = () => {
+    if (n)
+      s.value = n.getHours(), o.value = n.getMinutes();
     else {
-      const c = /* @__PURE__ */ new Date();
-      s.value = c.getHours(), d.value = c.getMinutes();
+      const u = /* @__PURE__ */ new Date();
+      s.value = u.getHours(), o.value = u.getMinutes();
     }
-    g();
-  }, m = (c) => {
-    c && (s.value = c.getHours(), d.value = c.getMinutes());
-  }, g = () => {
-    const c = [], y = a.value ? 1 : 0;
-    for (let M = 0; M < (a.value ? 2 : 1); M++) {
-      const P = a.value ? M === 0 ? " AM" : " PM" : "";
-      for (let w = y; w <= (a.value ? 12 : 23); w++)
-        for (let T = 0; T < 60; T += e) {
-          const F = (a.value, w), h = a.value ? w === 12 ? M === 0 ? 0 : 12 : w + M * 12 : w, $ = `${String(F).padStart(2, "0")}:${String(T).padStart(2, "0")}` + P;
-          c.push({
-            display: $,
-            value: `${String(h).padStart(2, "0")}:${String(T).padStart(2, "0")}`,
-            hour: h,
-            minute: T
+    y();
+  }, m = (u) => {
+    u && (s.value = u.getHours(), o.value = u.getMinutes());
+  }, y = () => {
+    const u = [], d = t.value ? 1 : 0;
+    for (let l = 0; l < (t.value ? 2 : 1); l++) {
+      const k = t.value ? l === 0 ? " AM" : " PM" : "";
+      for (let b = d; b <= (t.value ? 12 : 23); b++)
+        for (let C = 0; C < 60; C += e) {
+          const A = (t.value, b), D = t.value ? b === 12 ? l === 0 ? 0 : 12 : b + l * 12 : b, H = `${String(A).padStart(2, "0")}:${String(C).padStart(2, "0")}` + k;
+          u.push({
+            display: H,
+            value: `${String(D).padStart(2, "0")}:${String(C).padStart(2, "0")}`,
+            hour: D,
+            minute: C
           });
         }
     }
-    a.value ? i.value = c.map((M) => M.display) : i.value = c.map((M) => M.value);
-  }, l = () => {
-    if (a.value) {
-      const c = s.value === 0 ? 12 : s.value > 12 ? s.value - 12 : s.value, y = s.value < 12 ? " AM" : " PM";
-      return `${String(c).padStart(2, "0")}:${String(d.value).padStart(
+    t.value ? i.value = u.map((l) => l.display) : i.value = u.map((l) => l.value);
+  }, r = () => {
+    if (t.value) {
+      const u = s.value === 0 ? 12 : s.value > 12 ? s.value - 12 : s.value, d = s.value < 12 ? " AM" : " PM";
+      return `${String(u).padStart(2, "0")}:${String(o.value).padStart(
         2,
         "0"
-      )}${y}`;
+      )}${d}`;
     }
-    return `${String(s.value).padStart(2, "0")}:${String(d.value).padStart(2, "0")}`;
+    return `${String(s.value).padStart(2, "0")}:${String(o.value).padStart(2, "0")}`;
   };
   return {
     hours: s,
-    minutes: d,
+    minutes: o,
     timeOptions: i,
-    is12HourFormat: a,
-    initializeTime: n,
+    is12HourFormat: t,
+    initializeTime: a,
     updateTime: m,
-    generateTimeOptions: g,
-    getCurrentTimeString: l,
-    selectTime: (c) => {
-      let y, M;
-      if (a.value) {
-        const [w, T] = c.split(" "), [F, h] = w.split(":");
-        y = parseInt(F), M = parseInt(h), T === "AM" ? y === 12 && (y = 0) : y !== 12 && (y += 12);
+    generateTimeOptions: y,
+    getCurrentTimeString: r,
+    selectTime: (u) => {
+      let d, l;
+      if (t.value) {
+        const [b, C] = u.split(" "), [A, D] = b.split(":");
+        d = parseInt(A), l = parseInt(D), C === "AM" ? d === 12 && (d = 0) : d !== 12 && (d += 12);
       } else {
-        const [w, T] = c.split(":");
-        y = parseInt(w), M = parseInt(T);
+        const [b, C] = u.split(":");
+        d = parseInt(b), l = parseInt(C);
       }
-      s.value = y, d.value = M;
-      const P = t ? new Date(t.getTime()) : /* @__PURE__ */ new Date();
-      P.setHours(y, M, 0, 0), u("update", P);
+      s.value = d, o.value = l;
+      const k = n ? new Date(n.getTime()) : /* @__PURE__ */ new Date();
+      k.setHours(d, l, 0, 0), h("update", k);
     },
-    scrollToSelected: (c) => {
-      if (!c) return;
-      const y = i.value.findIndex((M) => M === l());
-      if (y >= 0) {
-        const P = c.clientHeight, w = y * 30 - P / 2 + 30 / 2;
-        c.scrollTop = Math.max(0, w);
+    scrollToSelected: (u) => {
+      if (!u) return;
+      const d = i.value.findIndex((l) => l === r());
+      if (d >= 0) {
+        const k = u.clientHeight, b = d * 30 - k / 2 + 30 / 2;
+        u.scrollTop = Math.max(0, b);
       }
     },
-    onTimeUpdate: (c) => {
-      s.value = c.getHours(), d.value = c.getMinutes(), u("update", c);
+    onTimeUpdate: (u) => {
+      s.value = u.getHours(), o.value = u.getMinutes(), h("update", u);
     }
   };
 }
-const ke = { class: "time-picker-container" }, fe = ["aria-selected", "onClick"], J = /* @__PURE__ */ q({
+const De = { class: "time-picker-container" }, ye = ["aria-selected", "onClick"], J = /* @__PURE__ */ N({
   __name: "TimeView",
   props: {
     selectedTime: {},
@@ -301,121 +301,121 @@ const ke = { class: "time-picker-container" }, fe = ["aria-selected", "onClick"]
     timeInterval: { default: 15 }
   },
   emits: ["update"],
-  setup(t, { emit: r }) {
-    const e = t, u = r, s = N(null), { timeOptions: d, initializeTime: i, updateTime: a, getCurrentTimeString: n, selectTime: m, scrollToSelected: g } = ge(e.selectedTime, e.timeFormat, e.timeInterval, u);
-    return O(
+  setup(n, { emit: c }) {
+    const e = n, h = c, s = Y(null), { timeOptions: o, initializeTime: i, updateTime: t, getCurrentTimeString: a, selectTime: m, scrollToSelected: y } = fe(e.selectedTime, e.timeFormat, e.timeInterval, h);
+    return G(
       () => e.selectedTime,
-      (l) => {
-        a(l), B(() => {
-          g(s.value);
+      (r) => {
+        t(r), B(() => {
+          y(s.value);
         });
       },
       { immediate: !0 }
-    ), O(
+    ), G(
       () => e.timeFormat,
       () => {
         i(), B(() => {
-          g(s.value);
+          y(s.value);
         });
       }
-    ), O(
+    ), G(
       () => e.timeInterval,
       () => {
         i(), B(() => {
-          g(s.value);
+          y(s.value);
         });
       }
     ), R(() => {
       i(), B(() => {
         setTimeout(() => {
-          g(s.value);
+          y(s.value);
         }, 3);
       });
-    }), (l, b) => (v(), D("div", ke, [
-      p("div", {
+    }), (r, S) => (p(), f("div", De, [
+      g("div", {
         ref_key: "timeListRef",
         ref: s,
         class: "time-wheel",
         role: "listbox",
         "aria-label": "Time Selection"
       }, [
-        (v(!0), D(C, null, H(o(d), (k) => (v(), D("div", {
-          key: k,
+        (p(!0), f(P, null, x(v(o), (_) => (p(), f("div", {
+          key: _,
           class: I(["time-option", {
-            selected: k === o(n)()
+            selected: _ === v(a)()
           }]),
           role: "option",
-          "aria-selected": k === o(n)(),
-          onClick: (f) => o(m)(k)
-        }, x(k), 11, fe))), 128))
+          "aria-selected": _ === v(a)(),
+          onClick: (M) => v(m)(_)
+        }, F(_), 11, ye))), 128))
       ], 512)
     ]));
   }
-}), Me = { class: "year-view-layout" }, ye = { class: "years-section" }, be = { class: "years-list" }, _e = ["onClick"], we = { class: "months-section" }, Se = { class: "date-picker-table date-picker-months-table" }, Ye = { class: "date-picker-months-body" }, $e = ["onClick", "disabled"], Te = /* @__PURE__ */ q({
+}), Me = { class: "year-view-layout" }, be = { class: "years-section" }, _e = { class: "years-list" }, Se = ["onClick"], we = { class: "months-section" }, $e = { class: "date-picker-table date-picker-months-table" }, Te = { class: "date-picker-months-body" }, Ye = ["onClick", "disabled"], Ce = /* @__PURE__ */ N({
   __name: "YearView",
   props: {
     currentDate: {},
     selectedDate: {}
   },
   emits: ["select", "month-select"],
-  setup(t, { emit: r }) {
-    const e = t, u = r, s = Y(() => e.currentDate.getFullYear()), d = Y(() => {
-      var l;
-      return (l = e.selectedDate) == null ? void 0 : l.getFullYear();
-    }), i = Y(() => {
-      const l = Math.floor(s.value / 10) * 10;
-      return Array.from({ length: 12 }, (b, k) => l + k - 1);
-    }), a = Y(() => E(s.value).map((l) => ({
-      ...l,
-      isSelected: e.selectedDate ? l.month === e.selectedDate.getMonth() && l.year === e.selectedDate.getFullYear() : !1
-    }))), n = Y(() => {
-      const l = [];
-      for (let b = 0; b < a.value.length; b += 3)
-        l.push(a.value.slice(b, b + 3));
-      return l;
-    }), m = (l) => {
-      u("select", l);
-    }, g = (l) => {
-      u("month-select", l.month);
+  setup(n, { emit: c }) {
+    const e = n, h = c, s = $(() => e.currentDate.getFullYear()), o = $(() => {
+      var r;
+      return (r = e.selectedDate) == null ? void 0 : r.getFullYear();
+    }), i = $(() => {
+      const r = Math.floor(s.value / 10) * 10;
+      return Array.from({ length: 12 }, (S, _) => r + _ - 1);
+    }), t = $(() => j(s.value).map((r) => ({
+      ...r,
+      isSelected: e.selectedDate ? r.month === e.selectedDate.getMonth() && r.year === e.selectedDate.getFullYear() : !1
+    }))), a = $(() => {
+      const r = [];
+      for (let S = 0; S < t.value.length; S += 3)
+        r.push(t.value.slice(S, S + 3));
+      return r;
+    }), m = (r) => {
+      h("select", r);
+    }, y = (r) => {
+      h("month-select", r.month);
     };
-    return (l, b) => (v(), D("div", Me, [
-      p("div", ye, [
-        p("div", be, [
-          (v(!0), D(C, null, H(i.value, (k) => (v(), D("button", {
-            key: k,
+    return (r, S) => (p(), f("div", Me, [
+      g("div", be, [
+        g("div", _e, [
+          (p(!0), f(P, null, x(i.value, (_) => (p(), f("button", {
+            key: _,
             class: I([
               "year-item",
               {
-                selected: k === d.value,
-                current: k === s.value
+                selected: _ === o.value,
+                current: _ === s.value
               }
             ]),
-            onClick: (f) => m(k)
-          }, x(k), 11, _e))), 128))
+            onClick: (M) => m(_)
+          }, F(_), 11, Se))), 128))
         ])
       ]),
-      p("div", we, [
-        p("table", Se, [
-          p("tbody", Ye, [
-            (v(!0), D(C, null, H(n.value, (k, f) => (v(), D("tr", {
-              key: f,
+      g("div", we, [
+        g("table", $e, [
+          g("tbody", Te, [
+            (p(!0), f(P, null, x(a.value, (_, M) => (p(), f("tr", {
+              key: M,
               class: "date-picker-months-row"
             }, [
-              (v(!0), D(C, null, H(k, (c) => (v(), D("td", {
-                key: c.month,
+              (p(!0), f(P, null, x(_, (u) => (p(), f("td", {
+                key: u.month,
                 class: "date-picker-month-cell"
               }, [
-                p("button", {
+                g("button", {
                   class: I([
                     "date-picker-month",
                     {
-                      selected: c.isSelected,
-                      disabled: c.isDisabled
+                      selected: u.isSelected,
+                      disabled: u.isDisabled
                     }
                   ]),
-                  onClick: (y) => g(c),
-                  disabled: c.isDisabled
-                }, x(c.name.substring(0, 3)), 11, $e)
+                  onClick: (d) => y(u),
+                  disabled: u.isDisabled
+                }, F(u.name.substring(0, 3)), 11, Ye)
               ]))), 128))
             ]))), 128))
           ])
@@ -423,54 +423,54 @@ const ke = { class: "time-picker-container" }, fe = ["aria-selected", "onClick"]
       ])
     ]));
   }
-}), Ce = { class: "date-picker-content" }, He = { class: "date-picker-table date-picker-months-table" }, Fe = { class: "date-picker-months-body" }, Pe = ["onClick", "disabled"], xe = /* @__PURE__ */ q({
+}), He = { class: "date-picker-content" }, Pe = { class: "date-picker-table date-picker-months-table" }, xe = { class: "date-picker-months-body" }, Fe = ["onClick", "disabled"], Ie = /* @__PURE__ */ N({
   __name: "MonthView",
   props: {
     currentDate: {},
     selectedDate: {}
   },
   emits: ["select"],
-  setup(t, { emit: r }) {
-    const e = t, u = r, s = Y(() => E(e.currentDate.getFullYear()).map((n) => ({
-      ...n,
-      isSelected: e.selectedDate ? n.month === e.selectedDate.getMonth() && n.year === e.selectedDate.getFullYear() : !1
-    }))), d = Y(() => {
-      const a = [];
-      for (let n = 0; n < s.value.length; n += 3)
-        a.push(s.value.slice(n, n + 3));
-      return a;
-    }), i = (a) => {
-      u("select", a.month);
+  setup(n, { emit: c }) {
+    const e = n, h = c, s = $(() => j(e.currentDate.getFullYear()).map((a) => ({
+      ...a,
+      isSelected: e.selectedDate ? a.month === e.selectedDate.getMonth() && a.year === e.selectedDate.getFullYear() : !1
+    }))), o = $(() => {
+      const t = [];
+      for (let a = 0; a < s.value.length; a += 3)
+        t.push(s.value.slice(a, a + 3));
+      return t;
+    }), i = (t) => {
+      h("select", t.month);
     };
-    return (a, n) => (v(), D("div", Ce, [
-      p("table", He, [
-        p("tbody", Fe, [
-          (v(!0), D(C, null, H(d.value, (m, g) => (v(), D("tr", {
-            key: g,
+    return (t, a) => (p(), f("div", He, [
+      g("table", Pe, [
+        g("tbody", xe, [
+          (p(!0), f(P, null, x(o.value, (m, y) => (p(), f("tr", {
+            key: y,
             class: "date-picker-months-row"
           }, [
-            (v(!0), D(C, null, H(m, (l) => (v(), D("td", {
-              key: l.month,
+            (p(!0), f(P, null, x(m, (r) => (p(), f("td", {
+              key: r.month,
               class: "date-picker-month-cell"
             }, [
-              p("button", {
+              g("button", {
                 class: I([
                   "date-picker-month",
                   {
-                    selected: l.isSelected,
-                    disabled: l.isDisabled
+                    selected: r.isSelected,
+                    disabled: r.isDisabled
                   }
                 ]),
-                onClick: (b) => i(l),
-                disabled: l.isDisabled
-              }, x(l.name), 11, Pe)
+                onClick: (S) => i(r),
+                disabled: r.isDisabled
+              }, F(r.name), 11, Fe)
             ]))), 128))
           ]))), 128))
         ])
       ])
     ]));
   }
-}), Ne = '<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>', Ie = '<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>', Ve = '<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>', Ge = { class: "date-picker-header" }, qe = ["disabled"], ze = ["innerHTML"], Be = ["innerHTML"], Le = ["disabled"], Oe = ["innerHTML"], We = /* @__PURE__ */ q({
+}), Ae = '<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>', Ne = '<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>', Ve = '<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>', Le = { class: "date-picker-header" }, qe = ["disabled"], Be = ["innerHTML"], Ge = ["innerHTML"], Oe = ["disabled"], ze = ["innerHTML"], Re = /* @__PURE__ */ N({
   __name: "DatePickerHeader",
   props: {
     currentDate: {},
@@ -479,150 +479,150 @@ const ke = { class: "time-picker-container" }, fe = ["aria-selected", "onClick"]
     canGoNext: { type: Boolean }
   },
   emits: ["prev", "next", "header-click", "current-date"],
-  setup(t, { emit: r }) {
-    const e = t, u = r, s = Y(() => {
-      const m = e.currentDate.getFullYear(), g = e.currentDate.getMonth();
+  setup(n, { emit: c }) {
+    const e = n, h = c, s = $(() => {
+      const m = e.currentDate.getFullYear(), y = e.currentDate.getMonth();
       switch (e.viewMode) {
         case "date":
-          return `${A[g]} ${m}`;
+          return `${W[y]} ${m}`;
         case "year":
-          const l = Math.floor(m / 10) * 10, b = l + 9;
-          return `${l}–${b}`;
+          const r = Math.floor(m / 10) * 10, S = r + 9;
+          return `${r}–${S}`;
         default:
-          return `${A[g]} ${m}`;
+          return `${W[y]} ${m}`;
       }
-    }), d = () => {
-      u("prev");
+    }), o = () => {
+      h("prev");
     }, i = () => {
-      u("next");
+      h("next");
+    }, t = () => {
+      h("header-click");
     }, a = () => {
-      u("header-click");
-    }, n = () => {
-      u("current-date");
+      h("current-date");
     };
-    return (m, g) => (v(), D("div", Ge, [
-      p("button", {
+    return (m, y) => (p(), f("div", Le, [
+      g("button", {
         class: "date-picker-title",
-        onClick: a,
+        onClick: t,
         type: "button"
-      }, x(s.value), 1),
-      p("button", {
+      }, F(s.value), 1),
+      g("button", {
         class: "date-picker-nav-button ml-auto",
         disabled: !m.canGoPrev,
-        onClick: d,
+        onClick: o,
         type: "button",
         "aria-label": "Previous"
       }, [
-        p("span", {
+        g("span", {
           class: "date-picker-nav-icon",
-          innerHTML: o(Ne)
-        }, null, 8, ze)
+          innerHTML: v(Ae)
+        }, null, 8, Be)
       ], 8, qe),
-      p("button", {
+      g("button", {
         class: "date-picker-nav-button",
-        onClick: n,
+        onClick: a,
         type: "button",
         "aria-label": "Current Date"
       }, [
-        p("span", {
+        g("span", {
           class: "date-picker-nav-icon",
-          innerHTML: o(Ve)
-        }, null, 8, Be)
+          innerHTML: v(Ve)
+        }, null, 8, Ge)
       ]),
-      p("button", {
+      g("button", {
         class: "date-picker-nav-button",
         disabled: !m.canGoNext,
         onClick: i,
         type: "button",
         "aria-label": "Next"
       }, [
-        p("span", {
+        g("span", {
           class: "date-picker-nav-icon",
-          innerHTML: o(Ie)
-        }, null, 8, Oe)
-      ], 8, Le)
+          innerHTML: v(Ne)
+        }, null, 8, ze)
+      ], 8, Oe)
     ]));
   }
 });
-function Ae(t, r) {
-  const e = N(/* @__PURE__ */ new Date()), u = N("date"), s = Y(() => t.value ? t.value instanceof Date ? t.value : W(t.value) : null), d = Y(() => {
-    if (!t.minDate) return !0;
-    const h = W(t.minDate);
-    if (!h) return !0;
-    const S = e.value.getFullYear(), $ = e.value.getMonth();
-    return new Date(S, $, 1) > h;
-  }), i = Y(() => {
-    if (!t.maxDate) return !0;
-    const h = W(t.maxDate);
-    if (!h) return !0;
-    const S = e.value.getFullYear(), $ = e.value.getMonth();
-    return new Date(S, $ + 1, 0) < h;
-  }), a = () => {
-    d.value && (e.value = new Date(e.value.getFullYear(), e.value.getMonth() - 1, 1));
-  }, n = () => {
+function We(n, c) {
+  const e = Y(/* @__PURE__ */ new Date()), h = Y("date"), s = $(() => n.value ? n.value instanceof Date ? n.value : z(n.value) : null), o = $(() => {
+    if (!n.minDate) return !0;
+    const D = z(n.minDate);
+    if (!D) return !0;
+    const T = e.value.getFullYear(), H = e.value.getMonth();
+    return new Date(T, H, 1) > D;
+  }), i = $(() => {
+    if (!n.maxDate) return !0;
+    const D = z(n.maxDate);
+    if (!D) return !0;
+    const T = e.value.getFullYear(), H = e.value.getMonth();
+    return new Date(T, H + 1, 0) < D;
+  }), t = () => {
+    o.value && (e.value = new Date(e.value.getFullYear(), e.value.getMonth() - 1, 1));
+  }, a = () => {
     i.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);
-  }, g = () => {
+  }, y = () => {
     e.value = new Date(e.value.getFullYear() + 1, e.value.getMonth(), 1);
-  }, l = () => {
+  }, r = () => {
     e.value = new Date(e.value.getFullYear() - 10, e.value.getMonth(), 1);
-  }, b = () => {
+  }, S = () => {
     e.value = new Date(e.value.getFullYear() + 10, e.value.getMonth(), 1);
-  }, k = () => {
-    e.value = /* @__PURE__ */ new Date(), u.value = "date";
-  }, f = () => {
-    switch (u.value) {
+  }, _ = () => {
+    e.value = /* @__PURE__ */ new Date(), h.value = "date";
+  }, M = () => {
+    switch (h.value) {
       case "date":
-        u.value = "year";
+        h.value = "year";
         break;
       case "year":
-        u.value = "date";
+        h.value = "date";
         break;
     }
-  }, c = (h) => {
-    t.mode === "dateTime" && s.value && h.setHours(s.value.getHours(), s.value.getMinutes()), F(h);
-  }, y = (h) => {
-    F(h);
-  }, M = (h) => {
-    e.value = new Date(e.value.getFullYear(), h, 1), u.value = "date", t.mode === "month" && F(new Date(e.value.getFullYear(), h, 1));
-  }, P = (h) => {
-    e.value = new Date(h, e.value.getMonth(), 1), u.value = "date";
-  }, w = (h) => {
-    const S = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.\d{3})?Z?$/, $ = /^\d{4}-\d{2}-\d{2}$/;
-    return S.test(h) ? h.includes(".") ? "YYYY-MM-DDTHH:mm:ss.sssZ" : "YYYY-MM-DDTHH:mm:ssZ" : $.test(h) ? "YYYY-MM-DD" : t.format || "YYYY-MM-DD";
-  }, T = (h, S) => {
-    const $ = w(S);
-    return $.includes("T") ? $.includes(".sss") ? h.toISOString() : h.toISOString().replace(/\.\d{3}Z$/, "Z") : U(h, $);
-  }, F = (h) => {
-    let S;
-    typeof t.value == "string" ? S = T(h, t.value) : S = h, r("update:value", S), r("change", S), r("select", S);
+  }, u = (D) => {
+    n.mode === "dateTime" && s.value && D.setHours(s.value.getHours(), s.value.getMinutes()), A(D);
+  }, d = (D) => {
+    A(D);
+  }, l = (D) => {
+    e.value = new Date(e.value.getFullYear(), D, 1), h.value = "date", n.mode === "month" && A(new Date(e.value.getFullYear(), D, 1));
+  }, k = (D) => {
+    e.value = new Date(D, e.value.getMonth(), 1), h.value = "date";
+  }, b = (D) => {
+    const T = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.\d{3})?Z?$/, H = /^\d{4}-\d{2}-\d{2}$/;
+    return T.test(D) ? D.includes(".") ? "YYYY-MM-DDTHH:mm:ss.sssZ" : "YYYY-MM-DDTHH:mm:ssZ" : H.test(D) ? "YYYY-MM-DD" : n.format || "YYYY-MM-DD";
+  }, C = (D, T) => {
+    const H = b(T);
+    return H.includes("T") ? H.includes(".sss") ? D.toISOString() : D.toISOString().replace(/\.\d{3}Z$/, "Z") : Z(D, H);
+  }, A = (D) => {
+    let T;
+    typeof n.value == "string" ? T = C(D, n.value) : T = D, c("update:value", T), c("change", T), c("select", T);
   };
   return {
     currentDate: e,
-    viewMode: u,
+    viewMode: h,
     selectedDate: s,
-    canGoPrev: d,
+    canGoPrev: o,
     canGoNext: i,
-    goToPrevMonth: a,
-    goToNextMonth: n,
+    goToPrevMonth: t,
+    goToNextMonth: a,
     goToPrevYear: m,
-    goToNextYear: g,
-    goToPrevDecade: l,
-    goToNextDecade: b,
-    goToCurrentDate: k,
-    onHeaderClick: f,
-    onDateSelect: c,
-    onWeekSelect: y,
-    onMonthSelect: M,
-    onYearSelect: P,
-    emitValue: F
+    goToNextYear: y,
+    goToPrevDecade: r,
+    goToNextDecade: S,
+    goToCurrentDate: _,
+    onHeaderClick: M,
+    onDateSelect: u,
+    onWeekSelect: d,
+    onMonthSelect: l,
+    onYearSelect: k,
+    emitValue: A
   };
 }
-const Je = { class: "date-picker" }, Re = {
+const Je = { class: "date-picker" }, Ue = {
   key: 0,
   class: "date-picker-time-section"
-}, Ze = /* @__PURE__ */ q({
+}, lt = /* @__PURE__ */ N({
   __name: "DatePicker",
   props: {
     value: {},
@@ -637,110 +637,306 @@ const Je = { class: "date-picker" }, Re = {
     timeInterval: { default: 15 }
   },
   emits: ["update:value", "change", "select"],
-  setup(t, { emit: r }) {
-    const e = t, u = r, s = N(null), d = N(0), {
+  setup(n, { emit: c }) {
+    const e = n, h = c, s = Y(null), o = Y(0), {
       currentDate: i,
-      viewMode: a,
-      selectedDate: n,
+      viewMode: t,
+      selectedDate: a,
       canGoPrev: m,
-      canGoNext: g,
-      goToPrevMonth: l,
-      goToNextMonth: b,
-      goToPrevYear: k,
-      goToNextYear: f,
-      goToPrevDecade: c,
-      goToNextDecade: y,
-      goToCurrentDate: M,
-      onHeaderClick: P,
-      onDateSelect: w,
-      onWeekSelect: T,
-      onMonthSelect: F,
-      onYearSelect: h,
-      emitValue: S
-    } = Ae(e, u), $ = (_) => {
-      if (e.mode === "dateTime" && n.value) {
-        const V = new Date(n.value.getTime());
-        V.setHours(_.getHours(), _.getMinutes(), 0, 0), S(V);
+      canGoNext: y,
+      goToPrevMonth: r,
+      goToNextMonth: S,
+      goToPrevYear: _,
+      goToNextYear: M,
+      goToPrevDecade: u,
+      goToNextDecade: d,
+      goToCurrentDate: l,
+      onHeaderClick: k,
+      onDateSelect: b,
+      onWeekSelect: C,
+      onMonthSelect: A,
+      onYearSelect: D,
+      emitValue: T
+    } = We(e, h), H = (w) => {
+      if (e.mode === "dateTime" && a.value) {
+        const L = new Date(a.value.getTime());
+        L.setHours(w.getHours(), w.getMinutes(), 0, 0), T(L);
       } else
-        S(_);
+        T(w);
     };
     return R(async () => {
       B(() => {
-        s.value && (d.value = s.value.clientHeight);
+        s.value && (o.value = s.value.clientHeight);
       });
-    }), (_, V) => (v(), D("div", Je, [
-      _.mode !== "time" ? (v(), z(We, {
+    }), (w, L) => (p(), f("div", Je, [
+      w.mode !== "time" ? (p(), q(Re, {
         key: 0,
-        "current-date": o(i),
-        "view-mode": o(a),
-        "can-go-prev": o(m),
-        "can-go-next": o(g),
-        onPrev: V[0] || (V[0] = (K) => o(a) === "year" ? o(c)() : o(a) === "month" ? o(k)() : o(l)()),
-        onNext: V[1] || (V[1] = (K) => o(a) === "year" ? o(y)() : o(a) === "month" ? o(f)() : o(b)()),
-        onHeaderClick: o(P),
-        onCurrentDate: o(M)
-      }, null, 8, ["current-date", "view-mode", "can-go-prev", "can-go-next", "onHeaderClick", "onCurrentDate"])) : G("", !0),
-      p("div", {
+        "current-date": v(i),
+        "view-mode": v(t),
+        "can-go-prev": v(m),
+        "can-go-next": v(y),
+        onPrev: L[0] || (L[0] = (Q) => v(t) === "year" ? v(u)() : v(t) === "month" ? v(_)() : v(r)()),
+        onNext: L[1] || (L[1] = (Q) => v(t) === "year" ? v(d)() : v(t) === "month" ? v(M)() : v(S)()),
+        onHeaderClick: v(k),
+        onCurrentDate: v(l)
+      }, null, 8, ["current-date", "view-mode", "can-go-prev", "can-go-next", "onHeaderClick", "onCurrentDate"])) : V("", !0),
+      g("div", {
         class: I({
-          "date-picker-datetime-layout": _.mode === "dateTime" && o(a) === "date"
+          "date-picker-datetime-layout": w.mode === "dateTime" && v(t) === "date"
         }),
-        style: Q({
-          height: d.value !== 0 ? d.value + "px" : "100%"
+        style: X({
+          height: o.value !== 0 ? o.value + "px" : "100%"
         })
       }, [
-        p("div", {
+        g("div", {
           class: "date-picker-date-section",
           ref_key: "datePickerContent",
           ref: s
         }, [
-          o(a) === "date" && (_.mode === "date" || _.mode === "dateTime") ? (v(), z(ce, {
+          v(t) === "date" && (w.mode === "date" || w.mode === "dateTime") ? (p(), q(ie, {
             key: 0,
-            "current-date": o(i),
-            "selected-date": o(n),
-            "min-date": _.minDate,
-            "max-date": _.maxDate,
-            "disabled-dates": _.disabledDates,
-            onSelect: o(w)
-          }, null, 8, ["current-date", "selected-date", "min-date", "max-date", "disabled-dates", "onSelect"])) : G("", !0),
-          _.mode === "week" && o(a) === "date" ? (v(), z(De, {
+            "current-date": v(i),
+            "selected-date": v(a),
+            "min-date": w.minDate,
+            "max-date": w.maxDate,
+            "disabled-dates": w.disabledDates,
+            onSelect: v(b)
+          }, null, 8, ["current-date", "selected-date", "min-date", "max-date", "disabled-dates", "onSelect"])) : V("", !0),
+          w.mode === "week" && v(t) === "date" ? (p(), q(ge, {
             key: 1,
-            "current-date": o(i),
-            "selected-date": o(n),
-            onSelect: o(T)
-          }, null, 8, ["current-date", "selected-date", "onSelect"])) : G("", !0),
-          o(a) !== "year" && (o(a) === "month" || _.mode === "month") ? (v(), z(xe, {
+            "current-date": v(i),
+            "selected-date": v(a),
+            onSelect: v(C)
+          }, null, 8, ["current-date", "selected-date", "onSelect"])) : V("", !0),
+          v(t) !== "year" && (v(t) === "month" || w.mode === "month") ? (p(), q(Ie, {
             key: 2,
-            "current-date": o(i),
-            "selected-date": o(n),
-            onSelect: o(F)
-          }, null, 8, ["current-date", "selected-date", "onSelect"])) : G("", !0),
-          o(a) === "year" ? (v(), z(Te, {
+            "current-date": v(i),
+            "selected-date": v(a),
+            onSelect: v(A)
+          }, null, 8, ["current-date", "selected-date", "onSelect"])) : V("", !0),
+          v(t) === "year" ? (p(), q(Ce, {
             key: 3,
-            "current-date": o(i),
-            "selected-date": o(n),
-            onSelect: o(h),
-            onMonthSelect: o(F)
-          }, null, 8, ["current-date", "selected-date", "onSelect", "onMonthSelect"])) : G("", !0)
+            "current-date": v(i),
+            "selected-date": v(a),
+            onSelect: v(D),
+            onMonthSelect: v(A)
+          }, null, 8, ["current-date", "selected-date", "onSelect", "onMonthSelect"])) : V("", !0)
         ], 512),
-        _.mode === "dateTime" && o(a) === "date" ? (v(), D("div", Re, [
-          X(J, {
-            "selected-time": o(n),
-            "time-format": _.timeFormat,
-            "time-interval": _.timeInterval,
-            onUpdate: $
+        w.mode === "dateTime" && v(t) === "date" ? (p(), f("div", Ue, [
+          U(J, {
+            "selected-time": v(a),
+            "time-format": w.timeFormat,
+            "time-interval": w.timeInterval,
+            onUpdate: H
           }, null, 8, ["selected-time", "time-format", "time-interval"])
-        ])) : G("", !0)
+        ])) : V("", !0)
       ], 6),
-      _.mode === "time" ? (v(), z(J, {
+      w.mode === "time" ? (p(), q(J, {
         key: 1,
-        "selected-time": o(n),
-        "time-format": _.timeFormat,
-        "time-interval": _.timeInterval,
-        onUpdate: $
-      }, null, 8, ["selected-time", "time-format", "time-interval"])) : G("", !0)
+        "selected-time": v(a),
+        "time-format": w.timeFormat,
+        "time-interval": w.timeInterval,
+        onUpdate: H
+      }, null, 8, ["selected-time", "time-format", "time-interval"])) : V("", !0)
+    ]));
+  }
+}), Ze = { class: "time-picker-sections" }, Ee = { class: "time-picker-time-section" }, je = ["onClick"], Ke = { class: "time-picker-time-section" }, Qe = ["onClick"], Xe = {
+  key: 0,
+  class: "time-picker-time-section time-picker-period-section"
+}, et = /* @__PURE__ */ N({
+  __name: "TimePickerDropdown",
+  props: {
+    selectedHour: {},
+    selectedMinute: {},
+    selectedPeriod: {},
+    is12Hour: { type: Boolean }
+  },
+  emits: ["select-hour", "select-minute", "select-period", "close"],
+  setup(n, { expose: c, emit: e }) {
+    const h = n, s = e, o = Y(null), i = Y(null), t = Y(null), a = Y(null), m = $(() => h.is12Hour ? Array.from({ length: 12 }, (d, l) => l + 1) : Array.from({ length: 24 }, (d, l) => l)), y = $(() => Array.from({ length: 60 }, (d, l) => l)), r = () => {
+      if (i.value) {
+        const d = i.value.querySelectorAll(".time-picker-option-button"), l = Array.from(d).findIndex((k) => k.classList.contains("selected"));
+        l !== -1 && d[l].scrollIntoView({ block: "center", behavior: "auto" });
+      }
+      if (t.value) {
+        const d = t.value.querySelectorAll(".time-picker-option-button"), l = Array.from(d).findIndex((k) => k.classList.contains("selected"));
+        l !== -1 && d[l].scrollIntoView({ block: "center", behavior: "auto" });
+      }
+      if (h.is12Hour && a.value) {
+        const d = a.value.querySelectorAll(".time-picker-option-button"), l = Array.from(d).findIndex((k) => k.classList.contains("selected"));
+        l !== -1 && d[l].scrollIntoView({ block: "center", behavior: "auto" });
+      }
+    }, S = (d) => {
+      s("select-hour", d);
+    }, _ = (d) => {
+      s("select-minute", d);
+    }, M = (d) => {
+      s("select-period", d);
+    }, u = (d) => {
+      o.value && !o.value.contains(d.target) && s("close");
+    };
+    return R(() => {
+      document.addEventListener("mousedown", u);
+    }), ee(() => {
+      document.removeEventListener("mousedown", u);
+    }), c({ scrollToSelected: r }), (d, l) => (p(), f("div", {
+      ref_key: "dropdownRef",
+      ref: o,
+      class: "time-picker-dropdown"
+    }, [
+      g("div", Ze, [
+        g("div", Ee, [
+          g("div", {
+            ref_key: "hourScroll",
+            ref: i,
+            class: "time-picker-options-scroll"
+          }, [
+            (p(!0), f(P, null, x(m.value, (k) => (p(), f("button", {
+              key: k,
+              type: "button",
+              class: I(["time-picker-option-button", { selected: k === d.selectedHour }]),
+              onClick: (b) => S(k)
+            }, F(String(k).padStart(2, "0")), 11, je))), 128))
+          ], 512)
+        ]),
+        g("div", Ke, [
+          g("div", {
+            ref_key: "minuteScroll",
+            ref: t,
+            class: "time-picker-options-scroll"
+          }, [
+            (p(!0), f(P, null, x(y.value, (k) => (p(), f("button", {
+              key: k,
+              type: "button",
+              class: I(["time-picker-option-button", { selected: k === d.selectedMinute }]),
+              onClick: (b) => _(k)
+            }, F(String(k).padStart(2, "0")), 11, Qe))), 128))
+          ], 512)
+        ]),
+        d.is12Hour ? (p(), f("div", Xe, [
+          g("div", {
+            ref_key: "periodScroll",
+            ref: a,
+            class: "time-picker-options-scroll"
+          }, [
+            g("button", {
+              type: "button",
+              class: I(["time-picker-option-button", { selected: d.selectedPeriod === "AM" }]),
+              onClick: l[0] || (l[0] = (k) => M("AM"))
+            }, " AM ", 2),
+            g("button", {
+              type: "button",
+              class: I(["time-picker-option-button", { selected: d.selectedPeriod === "PM" }]),
+              onClick: l[1] || (l[1] = (k) => M("PM"))
+            }, " PM ", 2)
+          ], 512)
+        ])) : V("", !0)
+      ])
+    ], 512));
+  }
+}), tt = { class: "time-display" }, nt = /* @__PURE__ */ N({
+  __name: "TimePickerInput",
+  props: {
+    hour: {},
+    minute: {},
+    period: {},
+    is12Hour: { type: Boolean }
+  },
+  emits: ["toggle"],
+  setup(n, { emit: c }) {
+    const e = n, h = c, s = $(() => {
+      const i = String(e.hour).padStart(2, "0"), t = String(e.minute).padStart(2, "0");
+      return `${i}:${t}`;
+    }), o = () => {
+      h("toggle");
+    };
+    return (i, t) => (p(), f("button", {
+      type: "button",
+      class: "time-picker-input",
+      onClick: o
+    }, [
+      g("span", tt, F(s.value), 1),
+      t[0] || (t[0] = g("svg", {
+        class: "time-picker-clock-icon",
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "18",
+        height: "18",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        "stroke-width": "2",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      }, [
+        g("circle", {
+          cx: "12",
+          cy: "12",
+          r: "10"
+        }),
+        g("polyline", { points: "12,6 12,12 16,14" })
+      ], -1))
+    ]));
+  }
+}), st = { class: "v-time-picker" }, ot = /* @__PURE__ */ N({
+  __name: "TimePicker",
+  props: {
+    modelValue: { default: null },
+    timeFormat: { default: "12h" }
+  },
+  emits: ["update:modelValue"],
+  setup(n, { emit: c }) {
+    const e = n, h = c, s = Y(!1), o = Y(12), i = Y(0), t = Y("AM"), a = Y(null), m = $(() => e.timeFormat === "12h"), y = () => {
+      if (e.modelValue) {
+        const [l, k] = e.modelValue.split(":"), b = parseInt(l), C = parseInt(k);
+        i.value = C, m.value ? b === 0 ? (o.value = 12, t.value = "AM") : b === 12 ? (o.value = 12, t.value = "PM") : b > 12 ? (o.value = b - 12, t.value = "PM") : (o.value = b, t.value = "AM") : o.value = b;
+      } else {
+        const l = /* @__PURE__ */ new Date(), k = l.getHours(), b = l.getMinutes();
+        i.value = b, m.value ? k === 0 ? (o.value = 12, t.value = "AM") : k === 12 ? (o.value = 12, t.value = "PM") : k > 12 ? (o.value = k - 12, t.value = "PM") : (o.value = k, t.value = "AM") : o.value = k;
+      }
+    }, r = () => {
+      let l = o.value;
+      m.value && (t.value === "AM" && l === 12 ? l = 0 : t.value === "PM" && l !== 12 && (l += 12));
+      const k = `${String(l).padStart(2, "0")}:${String(i.value).padStart(2, "0")}`;
+      h("update:modelValue", k);
+    }, S = (l) => {
+      o.value = l, r();
+    }, _ = (l) => {
+      i.value = l, r();
+    }, M = (l) => {
+      t.value = l, r();
+    }, u = () => {
+      s.value = !s.value;
+    }, d = () => {
+      s.value = !1;
+    };
+    return G(s, async (l) => {
+      var k;
+      l && (await B(), (k = a.value) == null || k.scrollToSelected());
+    }), G(() => e.modelValue, y, { immediate: !0 }), G(() => e.timeFormat, y), (l, k) => (p(), f("div", st, [
+      U(nt, {
+        hour: o.value,
+        minute: i.value,
+        period: t.value,
+        "is12-hour": m.value,
+        onToggle: u
+      }, null, 8, ["hour", "minute", "period", "is12-hour"]),
+      s.value ? (p(), q(et, {
+        key: 0,
+        ref_key: "dropdownRef",
+        ref: a,
+        "selected-hour": o.value,
+        "selected-minute": i.value,
+        "selected-period": t.value,
+        "is12-hour": m.value,
+        onSelectHour: S,
+        onSelectMinute: _,
+        onSelectPeriod: M,
+        onClose: d
+      }, null, 8, ["selected-hour", "selected-minute", "selected-period", "is12-hour"])) : V("", !0)
     ]));
   }
 });
 export {
-  Ze as default
+  ot as TimePicker,
+  lt as default
 };