tuikit-atomicx-vue3 3.3.3 → 3.4.1

package/dist/components/Search/SearchAdvanced/DateRangePicker/DateRangePicker.js

@@ -1,537 +1,412 @@
-import { defineComponent, ref, watch, onMounted, onUnmounted, createElementBlock, unref, openBlock, normalizeClass, createElementVNode, withModifiers, toDisplayString, createCommentVNode, Fragment, renderList } from "vue";
-import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
-import { isH5 } from "../../../../utils/env.js";
-import { _ as _export_sfc } from "../../../../_plugin-vue_export-helper-1tPrXgE0.js";
-const _hoisted_1 = ["onClick"];
-const _hoisted_2 = ["onClick"];
-const _hoisted_3 = ["onClick"];
-const _hoisted_4 = ["onClick"];
-const _hoisted_5 = ["onClick"];
-const _hoisted_6 = ["onClick"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
+import { defineComponent as Q, ref as g, watch as X, onMounted as Z, onUnmounted as x, createElementBlock as i, unref as L, openBlock as k, normalizeClass as r, createElementVNode as c, withModifiers as ee, toDisplayString as l, createCommentVNode as W, Fragment as P, renderList as y } from "vue";
+import { useUIKit as ae } from "@tencentcloud/uikit-base-component-vue3";
+import { isH5 as te } from "../../../../utils/env.js";
+import { _ as re } from "../../../../_plugin-vue_export-helper-CHgC5LLL.js";
+const ne = ["onClick"], ce = ["onClick"], se = ["onClick"], le = ["onClick"], ie = ["onClick"], ke = ["onClick"], oe = /* @__PURE__ */ Q({
   __name: "DateRangePicker",
   props: {
     value: {},
     onChange: { type: Function },
     className: {}
   },
-  setup(__props) {
-    const props = __props;
-    const { t } = useUIKit();
-    const leftDate = ref(/* @__PURE__ */ new Date());
-    const rightDate = ref(
+  setup(B) {
+    const v = B, { t: s } = ae(), u = g(/* @__PURE__ */ new Date()), h = g(
       (() => {
-        const date = /* @__PURE__ */ new Date();
-        date.setMonth(date.getMonth() + 1);
-        return date;
+        const e = /* @__PURE__ */ new Date();
+        return e.setMonth(e.getMonth() + 1), e;
       })()
-    );
-    const internalDates = ref([null, null]);
-    const isPickerOpenLeft = ref(false);
-    const isPickerOpenRight = ref(false);
-    const pickerYearLeft = ref(leftDate.value.getFullYear());
-    const pickerYearRight = ref(rightDate.value.getFullYear());
-    const pickerRefLeft = ref();
-    const pickerRefRight = ref();
-    const isUpdatingRef = ref(false);
-    const MONTH_NAMES = [
-      t("DateRangePicker.January"),
-      t("DateRangePicker.February"),
-      t("DateRangePicker.March"),
-      t("DateRangePicker.April"),
-      t("DateRangePicker.May"),
-      t("DateRangePicker.June"),
-      t("DateRangePicker.July"),
-      t("DateRangePicker.August"),
-      t("DateRangePicker.September"),
-      t("DateRangePicker.October"),
-      t("DateRangePicker.November"),
-      t("DateRangePicker.December")
-    ];
-    const WEEK_DAYS = [
-      t("DateRangePicker.Monday"),
-      t("DateRangePicker.Tuesday"),
-      t("DateRangePicker.Wednesday"),
-      t("DateRangePicker.Thursday"),
-      t("DateRangePicker.Friday"),
-      t("DateRangePicker.Saturday"),
-      t("DateRangePicker.Sunday")
-    ];
-    const setStartOfDay = (date) => {
-      const newDate = new Date(date);
-      newDate.setHours(0, 0, 0, 0);
-      return newDate;
-    };
-    const setEndOfDay = (date) => {
-      const newDate = new Date(date);
-      newDate.setHours(23, 59, 59, 999);
-      return newDate;
+    ), d = g([null, null]), S = g(!1), p = g(!1), R = g(u.value.getFullYear()), $ = g(h.value.getFullYear()), C = g(), Y = g(), K = g(!1), f = [
+      s("DateRangePicker.January"),
+      s("DateRangePicker.February"),
+      s("DateRangePicker.March"),
+      s("DateRangePicker.April"),
+      s("DateRangePicker.May"),
+      s("DateRangePicker.June"),
+      s("DateRangePicker.July"),
+      s("DateRangePicker.August"),
+      s("DateRangePicker.September"),
+      s("DateRangePicker.October"),
+      s("DateRangePicker.November"),
+      s("DateRangePicker.December")
+    ], T = [
+      s("DateRangePicker.Monday"),
+      s("DateRangePicker.Tuesday"),
+      s("DateRangePicker.Wednesday"),
+      s("DateRangePicker.Thursday"),
+      s("DateRangePicker.Friday"),
+      s("DateRangePicker.Saturday"),
+      s("DateRangePicker.Sunday")
+    ], F = (e) => {
+      const a = new Date(e);
+      return a.setHours(0, 0, 0, 0), a;
+    }, V = (e) => {
+      const a = new Date(e);
+      return a.setHours(23, 59, 59, 999), a;
     };
-    watch(
-      () => props.value,
-      (newValue) => {
-        internalDates.value = newValue || [null, null];
+    X(
+      () => v.value,
+      (e) => {
+        d.value = e || [null, null];
       },
-      { immediate: true }
+      { immediate: !0 }
     );
-    const handleClickOutside = (event) => {
-      if (pickerRefLeft.value && !pickerRefLeft.value.contains(event.target)) {
-        isPickerOpenLeft.value = false;
-      }
-      if (pickerRefRight.value && !pickerRefRight.value.contains(event.target)) {
-        isPickerOpenRight.value = false;
-      }
+    const I = (e) => {
+      C.value && !C.value.contains(e.target) && (S.value = !1), Y.value && !Y.value.contains(e.target) && (p.value = !1);
     };
-    onMounted(() => {
-      document.addEventListener("mousedown", handleClickOutside);
+    Z(() => {
+      document.addEventListener("mousedown", I);
+    }), x(() => {
+      document.removeEventListener("mousedown", I);
     });
-    onUnmounted(() => {
-      document.removeEventListener("mousedown", handleClickOutside);
-    });
-    const getMonthData = (date) => {
-      const year = date.getFullYear();
-      const month = date.getMonth();
-      const firstDay = new Date(year, month, 1);
-      const lastDay = new Date(year, month + 1, 0);
-      const days = [];
-      const firstDayWeek = firstDay.getDay() === 0 ? 6 : firstDay.getDay() - 1;
-      for (let i = firstDayWeek; i > 0; i -= 1) {
-        const prevDate = new Date(year, month, 1 - i);
-        days.push({ date: prevDate, isCurrentMonth: false });
-      }
-      for (let i = 1; i <= lastDay.getDate(); i += 1) {
-        days.push({ date: new Date(year, month, i), isCurrentMonth: true });
-      }
-      for (let i = 1; days.length < 42; i += 1) {
-        const nextDate = new Date(year, month + 1, i);
-        days.push({ date: nextDate, isCurrentMonth: false });
-      }
-      return days;
-    };
-    const handleDateClick = (date) => {
-      var _a;
-      let newDates;
-      if (!internalDates.value[0] || internalDates.value[0] && internalDates.value[1]) {
-        newDates = [setStartOfDay(date), null];
-      } else {
-        const [start] = internalDates.value;
-        if (start && date < start) {
-          newDates = [setStartOfDay(date), setEndOfDay(start)];
-        } else {
-          newDates = [setStartOfDay(start), setEndOfDay(date)];
-        }
-      }
-      isUpdatingRef.value = true;
-      internalDates.value = newDates;
-      (_a = props.onChange) == null ? void 0 : _a.call(props, newDates);
-      isUpdatingRef.value = false;
-    };
-    const updateDate = (newDate, isLeft) => {
-      const otherDate = isLeft ? rightDate.value : leftDate.value;
-      const normalizedNewDate = new Date(newDate.getFullYear(), newDate.getMonth(), 1);
-      const normalizedOtherDate = new Date(otherDate.getFullYear(), otherDate.getMonth(), 1);
-      if (isLeft && normalizedNewDate >= normalizedOtherDate) {
-        return;
-      }
-      if (!isLeft && normalizedNewDate <= normalizedOtherDate) {
-        return;
-      }
-      if (isLeft) {
-        leftDate.value = newDate;
-      } else {
-        rightDate.value = newDate;
+    const H = (e) => {
+      const a = e.getFullYear(), t = e.getMonth(), n = new Date(a, t, 1), o = new Date(a, t + 1, 0), _ = [], G = n.getDay() === 0 ? 6 : n.getDay() - 1;
+      for (let D = G; D > 0; D -= 1) {
+        const J = new Date(a, t, 1 - D);
+        _.push({ date: J, isCurrentMonth: !1 });
       }
-    };
-    const handleMonthChange = (isLeft, increment) => {
-      const currentDate = isLeft ? leftDate.value : rightDate.value;
-      const newDate = new Date(currentDate);
-      newDate.setMonth(newDate.getMonth() + (increment ? 1 : -1));
-      updateDate(newDate, isLeft);
-    };
-    const handleYearChange = (isLeft, increment) => {
-      const currentDate = isLeft ? leftDate.value : rightDate.value;
-      const newDate = new Date(currentDate);
-      newDate.setFullYear(newDate.getFullYear() + (increment ? 1 : -1));
-      updateDate(newDate, isLeft);
-    };
-    const handlePickerToggle = (isLeft) => {
-      if (isLeft) {
-        pickerYearLeft.value = leftDate.value.getFullYear();
-        isPickerOpenLeft.value = !isPickerOpenLeft.value;
-        isPickerOpenRight.value = false;
-      } else {
-        pickerYearRight.value = rightDate.value.getFullYear();
-        isPickerOpenRight.value = !isPickerOpenRight.value;
-        isPickerOpenLeft.value = false;
+      for (let D = 1; D <= o.getDate(); D += 1)
+        _.push({ date: new Date(a, t, D), isCurrentMonth: !0 });
+      for (let D = 1; _.length < 42; D += 1) {
+        const J = new Date(a, t + 1, D);
+        _.push({ date: J, isCurrentMonth: !1 });
       }
-    };
-    const handlePickerYearChange = (isLeft, year) => {
-      if (isLeft) {
-        pickerYearLeft.value = year;
-      } else {
-        pickerYearRight.value = year;
+      return _;
+    }, M = (e) => {
+      var t;
+      let a;
+      if (!d.value[0] || d.value[0] && d.value[1])
+        a = [F(e), null];
+      else {
+        const [n] = d.value;
+        n && e < n ? a = [F(e), V(n)] : a = [F(n), V(e)];
       }
+      K.value = !0, d.value = a, (t = v.onChange) == null || t.call(v, a), K.value = !1;
+    }, E = (e, a) => {
+      const t = a ? h.value : u.value, n = new Date(e.getFullYear(), e.getMonth(), 1), o = new Date(t.getFullYear(), t.getMonth(), 1);
+      a && n >= o || !a && n <= o || (a ? u.value = e : h.value = e);
+    }, m = (e, a) => {
+      const t = e ? u.value : h.value, n = new Date(t);
+      n.setMonth(n.getMonth() + (a ? 1 : -1)), E(n, e);
+    }, b = (e, a) => {
+      const t = e ? u.value : h.value, n = new Date(t);
+      n.setFullYear(n.getFullYear() + (a ? 1 : -1)), E(n, e);
+    }, O = (e) => {
+      e ? (R.value = u.value.getFullYear(), S.value = !S.value, p.value = !1) : ($.value = h.value.getFullYear(), p.value = !p.value, S.value = !1);
+    }, w = (e, a) => {
+      e ? R.value = a : $.value = a;
+    }, q = (e, a) => {
+      const t = e ? R.value : $.value, n = new Date(t, a, 1);
+      E(n, e), e ? S.value = !1 : p.value = !1;
+    }, U = (e) => {
+      const [a, t] = d.value;
+      if (!a || !t)
+        return !1;
+      const n = e.setHours(0, 0, 0, 0), o = new Date(a).setHours(0, 0, 0, 0), _ = new Date(t).setHours(0, 0, 0, 0);
+      return n >= o && n <= _;
+    }, N = (e) => {
+      const [a] = d.value;
+      if (!a)
+        return !1;
+      const t = e.setHours(0, 0, 0, 0);
+      return new Date(a).setHours(0, 0, 0, 0) === t;
+    }, A = (e) => {
+      const [, a] = d.value;
+      if (!a)
+        return !1;
+      const t = e.setHours(0, 0, 0, 0);
+      return new Date(a).setHours(0, 0, 0, 0) === t;
+    }, z = (e) => {
+      const a = /* @__PURE__ */ new Date(), t = e.setHours(0, 0, 0, 0), n = a.setHours(0, 0, 0, 0);
+      return t === n;
+    }, j = () => {
+      var e;
+      (e = v.onChange) == null || e.call(v, [null, null]);
     };
-    const handlePickerMonthSelect = (isLeft, month) => {
-      const currentYear = isLeft ? pickerYearLeft.value : pickerYearRight.value;
-      const newDate = new Date(currentYear, month, 1);
-      updateDate(newDate, isLeft);
-      if (isLeft) {
-        isPickerOpenLeft.value = false;
-      } else {
-        isPickerOpenRight.value = false;
-      }
-    };
-    const isDateSelected = (date) => {
-      const [start, end] = internalDates.value;
-      if (!start || !end) {
-        return false;
-      }
-      const dayTime = date.setHours(0, 0, 0, 0);
-      const startTime = new Date(start).setHours(0, 0, 0, 0);
-      const endTime = new Date(end).setHours(0, 0, 0, 0);
-      return dayTime >= startTime && dayTime <= endTime;
-    };
-    const isStartDate = (date) => {
-      const [start] = internalDates.value;
-      if (!start) {
-        return false;
-      }
-      const dayTime = date.setHours(0, 0, 0, 0);
-      const startTime = new Date(start).setHours(0, 0, 0, 0);
-      return startTime === dayTime;
-    };
-    const isEndDate = (date) => {
-      const [, end] = internalDates.value;
-      if (!end) {
-        return false;
-      }
-      const dayTime = date.setHours(0, 0, 0, 0);
-      const endTime = new Date(end).setHours(0, 0, 0, 0);
-      return endTime === dayTime;
-    };
-    const isToday = (date) => {
-      const today = /* @__PURE__ */ new Date();
-      const dayTime = date.setHours(0, 0, 0, 0);
-      const todayTime = today.setHours(0, 0, 0, 0);
-      return dayTime === todayTime;
-    };
-    const handleH5Cancel = () => {
-      var _a;
-      (_a = props.onChange) == null ? void 0 : _a.call(props, [null, null]);
-    };
-    return (_ctx, _cache) => {
-      return unref(isH5) ? (openBlock(), createElementBlock("div", {
-        key: 0,
-        class: normalizeClass(_ctx.$style["SearchDateRangePicker__h5-mask"]),
-        onClick: handleH5Cancel
+    return (e, a) => L(te) ? (k(), i("div", {
+      key: 0,
+      class: r(e.$style["SearchDateRangePicker__h5-mask"]),
+      onClick: j
+    }, [
+      c("div", {
+        class: r(e.$style["SearchDateRangePicker__h5-panel"]),
+        onClick: a[7] || (a[7] = ee(() => {
+        }, ["stop"]))
       }, [
-        createElementVNode("div", {
-          class: normalizeClass(_ctx.$style["SearchDateRangePicker__h5-panel"]),
-          onClick: _cache[7] || (_cache[7] = withModifiers(() => {
-          }, ["stop"]))
+        c("div", {
+          class: r(e.$style["SearchDateRangePicker__h5-header"])
+        }, l(L(s)("DateRangePicker.Time")), 3),
+        c("div", {
+          class: r(e.$style.SearchDateRangePicker__calendar)
         }, [
-          createElementVNode("div", {
-            class: normalizeClass(_ctx.$style["SearchDateRangePicker__h5-header"])
-          }, toDisplayString(unref(t)("DateRangePicker.Time")), 3),
-          createElementVNode("div", {
-            class: normalizeClass(_ctx.$style.SearchDateRangePicker__calendar)
+          c("div", {
+            class: r(e.$style["SearchDateRangePicker__calendar-header"])
           }, [
-            createElementVNode("div", {
-              class: normalizeClass(_ctx.$style["SearchDateRangePicker__calendar-header"])
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[0] || (a[0] = (t) => b(!0, !1))
+            }, " << ", 2),
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[1] || (a[1] = (t) => m(!0, !1))
+            }, " < ", 2),
+            c("span", {
+              class: r(e.$style["SearchDateRangePicker__current-month-year"]),
+              onClick: a[2] || (a[2] = (t) => O(!0))
+            }, l(u.value.getFullYear()) + " " + l(f[u.value.getMonth()]), 3),
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[3] || (a[3] = (t) => m(!0, !0))
+            }, " > ", 2),
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[4] || (a[4] = (t) => b(!0, !0))
+            }, " >> ", 2),
+            S.value ? (k(), i("div", {
+              key: 0,
+              ref_key: "pickerRefLeft",
+              ref: C,
+              class: r(e.$style["SearchDateRangePicker__picker-dropdown"])
             }, [
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[0] || (_cache[0] = ($event) => handleYearChange(true, false))
-              }, " << ", 2),
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[1] || (_cache[1] = ($event) => handleMonthChange(true, false))
-              }, " < ", 2),
-              createElementVNode("span", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__current-month-year"]),
-                onClick: _cache[2] || (_cache[2] = ($event) => handlePickerToggle(true))
-              }, toDisplayString(leftDate.value.getFullYear()) + " " + toDisplayString(MONTH_NAMES[leftDate.value.getMonth()]), 3),
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[3] || (_cache[3] = ($event) => handleMonthChange(true, true))
-              }, " > ", 2),
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[4] || (_cache[4] = ($event) => handleYearChange(true, true))
-              }, " >> ", 2),
-              isPickerOpenLeft.value ? (openBlock(), createElementBlock("div", {
-                key: 0,
-                ref_key: "pickerRefLeft",
-                ref: pickerRefLeft,
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-dropdown"])
+              c("div", {
+                class: r(e.$style["SearchDateRangePicker__picker-header"])
               }, [
-                createElementVNode("div", {
-                  class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-header"])
-                }, [
-                  createElementVNode("button", {
-                    class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-nav-button"]),
-                    onClick: _cache[5] || (_cache[5] = ($event) => handlePickerYearChange(true, pickerYearLeft.value - 1))
-                  }, " < ", 2),
-                  createElementVNode("span", {
-                    class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-year-text"])
-                  }, toDisplayString(pickerYearLeft.value), 3),
-                  createElementVNode("button", {
-                    class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-nav-button"]),
-                    onClick: _cache[6] || (_cache[6] = ($event) => handlePickerYearChange(true, pickerYearLeft.value + 1))
-                  }, " > ", 2)
-                ], 2),
-                createElementVNode("div", {
-                  class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-months"])
-                }, [
-                  (openBlock(), createElementBlock(Fragment, null, renderList(MONTH_NAMES, (monthName, index) => {
-                    return createElementVNode("button", {
-                      key: monthName,
-                      class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-month-button"]),
-                      onClick: ($event) => handlePickerMonthSelect(true, index)
-                    }, toDisplayString(monthName), 11, _hoisted_1);
-                  }), 64))
-                ], 2)
-              ], 2)) : createCommentVNode("", true)
-            ], 2),
-            createElementVNode("div", {
-              class: normalizeClass(_ctx.$style["SearchDateRangePicker__week-days"])
-            }, [
-              (openBlock(), createElementBlock(Fragment, null, renderList(WEEK_DAYS, (day) => {
-                return createElementVNode("div", {
-                  key: day,
-                  class: normalizeClass(_ctx.$style["SearchDateRangePicker__week-day"])
-                }, toDisplayString(day), 3);
-              }), 64))
-            ], 2),
-            createElementVNode("div", {
-              class: normalizeClass(_ctx.$style.SearchDateRangePicker__days)
-            }, [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(getMonthData(leftDate.value), ({ date: day, isCurrentMonth }, index) => {
-                return openBlock(), createElementBlock("div", {
-                  key: index,
-                  class: normalizeClass([
-                    _ctx.$style.SearchDateRangePicker__day,
-                    {
-                      [_ctx.$style["SearchDateRangePicker__day--selected"]]: isDateSelected(day),
-                      [_ctx.$style["SearchDateRangePicker__day--start"]]: isStartDate(day) && isCurrentMonth,
-                      [_ctx.$style["SearchDateRangePicker__day--end"]]: isEndDate(day) && isCurrentMonth,
-                      [_ctx.$style["SearchDateRangePicker__day--other-month"]]: !isCurrentMonth,
-                      [_ctx.$style["SearchDateRangePicker__day--today"]]: isToday(day) && isCurrentMonth
-                    }
-                  ]),
-                  onClick: ($event) => isCurrentMonth && handleDateClick(day)
-                }, toDisplayString(day.getDate()), 11, _hoisted_2);
-              }), 128))
-            ], 2)
+                c("button", {
+                  class: r(e.$style["SearchDateRangePicker__picker-nav-button"]),
+                  onClick: a[5] || (a[5] = (t) => w(!0, R.value - 1))
+                }, " < ", 2),
+                c("span", {
+                  class: r(e.$style["SearchDateRangePicker__picker-year-text"])
+                }, l(R.value), 3),
+                c("button", {
+                  class: r(e.$style["SearchDateRangePicker__picker-nav-button"]),
+                  onClick: a[6] || (a[6] = (t) => w(!0, R.value + 1))
+                }, " > ", 2)
+              ], 2),
+              c("div", {
+                class: r(e.$style["SearchDateRangePicker__picker-months"])
+              }, [
+                (k(), i(P, null, y(f, (t, n) => c("button", {
+                  key: t,
+                  class: r(e.$style["SearchDateRangePicker__picker-month-button"]),
+                  onClick: (o) => q(!0, n)
+                }, l(t), 11, ne)), 64))
+              ], 2)
+            ], 2)) : W("", !0)
+          ], 2),
+          c("div", {
+            class: r(e.$style["SearchDateRangePicker__week-days"])
+          }, [
+            (k(), i(P, null, y(T, (t) => c("div", {
+              key: t,
+              class: r(e.$style["SearchDateRangePicker__week-day"])
+            }, l(t), 3)), 64))
+          ], 2),
+          c("div", {
+            class: r(e.$style.SearchDateRangePicker__days)
+          }, [
+            (k(!0), i(P, null, y(H(u.value), ({ date: t, isCurrentMonth: n }, o) => (k(), i("div", {
+              key: o,
+              class: r([
+                e.$style.SearchDateRangePicker__day,
+                {
+                  [e.$style["SearchDateRangePicker__day--selected"]]: U(t),
+                  [e.$style["SearchDateRangePicker__day--start"]]: N(t) && n,
+                  [e.$style["SearchDateRangePicker__day--end"]]: A(t) && n,
+                  [e.$style["SearchDateRangePicker__day--other-month"]]: !n,
+                  [e.$style["SearchDateRangePicker__day--today"]]: z(t) && n
+                }
+              ]),
+              onClick: (_) => n && M(t)
+            }, l(t.getDate()), 11, ce))), 128))
           ], 2)
         ], 2)
-      ], 2)) : (openBlock(), createElementBlock("div", {
-        key: 1,
-        class: normalizeClass([_ctx.$style.SearchDateRangePicker, _ctx.className])
+      ], 2)
+    ], 2)) : (k(), i("div", {
+      key: 1,
+      class: r([e.$style.SearchDateRangePicker, B.className])
+    }, [
+      c("div", {
+        class: r(e.$style.SearchDateRangePicker__calendars)
       }, [
-        createElementVNode("div", {
-          class: normalizeClass(_ctx.$style.SearchDateRangePicker__calendars)
+        c("div", {
+          class: r(e.$style.SearchDateRangePicker__calendar)
         }, [
-          createElementVNode("div", {
-            class: normalizeClass(_ctx.$style.SearchDateRangePicker__calendar)
+          c("div", {
+            class: r(e.$style["SearchDateRangePicker__calendar-header"])
           }, [
-            createElementVNode("div", {
-              class: normalizeClass(_ctx.$style["SearchDateRangePicker__calendar-header"])
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[8] || (a[8] = (t) => b(!0, !1))
+            }, " << ", 2),
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[9] || (a[9] = (t) => m(!0, !1))
+            }, " < ", 2),
+            c("span", {
+              class: r(e.$style["SearchDateRangePicker__current-month-year"]),
+              onClick: a[10] || (a[10] = (t) => O(!0))
+            }, l(u.value.getFullYear()) + " " + l(f[u.value.getMonth()]), 3),
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[11] || (a[11] = (t) => m(!0, !0))
+            }, " > ", 2),
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[12] || (a[12] = (t) => b(!0, !0))
+            }, " >> ", 2),
+            S.value ? (k(), i("div", {
+              key: 0,
+              ref_key: "pickerRefLeft",
+              ref: C,
+              class: r(e.$style["SearchDateRangePicker__picker-dropdown"])
             }, [
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[8] || (_cache[8] = ($event) => handleYearChange(true, false))
-              }, " << ", 2),
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[9] || (_cache[9] = ($event) => handleMonthChange(true, false))
-              }, " < ", 2),
-              createElementVNode("span", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__current-month-year"]),
-                onClick: _cache[10] || (_cache[10] = ($event) => handlePickerToggle(true))
-              }, toDisplayString(leftDate.value.getFullYear()) + " " + toDisplayString(MONTH_NAMES[leftDate.value.getMonth()]), 3),
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[11] || (_cache[11] = ($event) => handleMonthChange(true, true))
-              }, " > ", 2),
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[12] || (_cache[12] = ($event) => handleYearChange(true, true))
-              }, " >> ", 2),
-              isPickerOpenLeft.value ? (openBlock(), createElementBlock("div", {
-                key: 0,
-                ref_key: "pickerRefLeft",
-                ref: pickerRefLeft,
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-dropdown"])
+              c("div", {
+                class: r(e.$style["SearchDateRangePicker__picker-header"])
               }, [
-                createElementVNode("div", {
-                  class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-header"])
-                }, [
-                  createElementVNode("button", {
-                    class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-nav-button"]),
-                    onClick: _cache[13] || (_cache[13] = ($event) => handlePickerYearChange(true, pickerYearLeft.value - 1))
-                  }, " < ", 2),
-                  createElementVNode("span", {
-                    class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-year-text"])
-                  }, toDisplayString(pickerYearLeft.value), 3),
-                  createElementVNode("button", {
-                    class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-nav-button"]),
-                    onClick: _cache[14] || (_cache[14] = ($event) => handlePickerYearChange(true, pickerYearLeft.value + 1))
-                  }, " > ", 2)
-                ], 2),
-                createElementVNode("div", {
-                  class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-months"])
-                }, [
-                  (openBlock(), createElementBlock(Fragment, null, renderList(MONTH_NAMES, (monthName, index) => {
-                    return createElementVNode("button", {
-                      key: monthName,
-                      class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-month-button"]),
-                      onClick: ($event) => handlePickerMonthSelect(true, index)
-                    }, toDisplayString(monthName), 11, _hoisted_3);
-                  }), 64))
-                ], 2)
-              ], 2)) : createCommentVNode("", true)
-            ], 2),
-            createElementVNode("div", {
-              class: normalizeClass(_ctx.$style["SearchDateRangePicker__week-days"])
-            }, [
-              (openBlock(), createElementBlock(Fragment, null, renderList(WEEK_DAYS, (day) => {
-                return createElementVNode("div", {
-                  key: day,
-                  class: normalizeClass(_ctx.$style["SearchDateRangePicker__week-day"])
-                }, toDisplayString(day), 3);
-              }), 64))
-            ], 2),
-            createElementVNode("div", {
-              class: normalizeClass(_ctx.$style.SearchDateRangePicker__days)
-            }, [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(getMonthData(leftDate.value), ({ date: day, isCurrentMonth }, index) => {
-                return openBlock(), createElementBlock("div", {
-                  key: index,
-                  class: normalizeClass([
-                    _ctx.$style.SearchDateRangePicker__day,
-                    {
-                      [_ctx.$style["SearchDateRangePicker__day--selected"]]: isDateSelected(day),
-                      [_ctx.$style["SearchDateRangePicker__day--start"]]: isStartDate(day) && isCurrentMonth,
-                      [_ctx.$style["SearchDateRangePicker__day--end"]]: isEndDate(day) && isCurrentMonth,
-                      [_ctx.$style["SearchDateRangePicker__day--other-month"]]: !isCurrentMonth,
-                      [_ctx.$style["SearchDateRangePicker__day--today"]]: isToday(day) && isCurrentMonth
-                    }
-                  ]),
-                  onClick: ($event) => isCurrentMonth && handleDateClick(day)
-                }, toDisplayString(day.getDate()), 11, _hoisted_4);
-              }), 128))
-            ], 2)
+                c("button", {
+                  class: r(e.$style["SearchDateRangePicker__picker-nav-button"]),
+                  onClick: a[13] || (a[13] = (t) => w(!0, R.value - 1))
+                }, " < ", 2),
+                c("span", {
+                  class: r(e.$style["SearchDateRangePicker__picker-year-text"])
+                }, l(R.value), 3),
+                c("button", {
+                  class: r(e.$style["SearchDateRangePicker__picker-nav-button"]),
+                  onClick: a[14] || (a[14] = (t) => w(!0, R.value + 1))
+                }, " > ", 2)
+              ], 2),
+              c("div", {
+                class: r(e.$style["SearchDateRangePicker__picker-months"])
+              }, [
+                (k(), i(P, null, y(f, (t, n) => c("button", {
+                  key: t,
+                  class: r(e.$style["SearchDateRangePicker__picker-month-button"]),
+                  onClick: (o) => q(!0, n)
+                }, l(t), 11, se)), 64))
+              ], 2)
+            ], 2)) : W("", !0)
+          ], 2),
+          c("div", {
+            class: r(e.$style["SearchDateRangePicker__week-days"])
+          }, [
+            (k(), i(P, null, y(T, (t) => c("div", {
+              key: t,
+              class: r(e.$style["SearchDateRangePicker__week-day"])
+            }, l(t), 3)), 64))
           ], 2),
-          createElementVNode("div", {
-            class: normalizeClass(_ctx.$style.SearchDateRangePicker__calendar)
+          c("div", {
+            class: r(e.$style.SearchDateRangePicker__days)
           }, [
-            createElementVNode("div", {
-              class: normalizeClass(_ctx.$style["SearchDateRangePicker__calendar-header"])
+            (k(!0), i(P, null, y(H(u.value), ({ date: t, isCurrentMonth: n }, o) => (k(), i("div", {
+              key: o,
+              class: r([
+                e.$style.SearchDateRangePicker__day,
+                {
+                  [e.$style["SearchDateRangePicker__day--selected"]]: U(t),
+                  [e.$style["SearchDateRangePicker__day--start"]]: N(t) && n,
+                  [e.$style["SearchDateRangePicker__day--end"]]: A(t) && n,
+                  [e.$style["SearchDateRangePicker__day--other-month"]]: !n,
+                  [e.$style["SearchDateRangePicker__day--today"]]: z(t) && n
+                }
+              ]),
+              onClick: (_) => n && M(t)
+            }, l(t.getDate()), 11, le))), 128))
+          ], 2)
+        ], 2),
+        c("div", {
+          class: r(e.$style.SearchDateRangePicker__calendar)
+        }, [
+          c("div", {
+            class: r(e.$style["SearchDateRangePicker__calendar-header"])
+          }, [
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[15] || (a[15] = (t) => b(!1, !1))
+            }, " << ", 2),
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[16] || (a[16] = (t) => m(!1, !1))
+            }, " < ", 2),
+            c("span", {
+              class: r(e.$style["SearchDateRangePicker__current-month-year"]),
+              onClick: a[17] || (a[17] = (t) => O(!1))
+            }, l(h.value.getFullYear()) + " " + l(f[h.value.getMonth()]), 3),
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[18] || (a[18] = (t) => m(!1, !0))
+            }, " > ", 2),
+            c("button", {
+              class: r(e.$style["SearchDateRangePicker__nav-button"]),
+              onClick: a[19] || (a[19] = (t) => b(!1, !0))
+            }, " >> ", 2),
+            p.value ? (k(), i("div", {
+              key: 0,
+              ref_key: "pickerRefRight",
+              ref: Y,
+              class: r(e.$style["SearchDateRangePicker__picker-dropdown"])
             }, [
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[15] || (_cache[15] = ($event) => handleYearChange(false, false))
-              }, " << ", 2),
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[16] || (_cache[16] = ($event) => handleMonthChange(false, false))
-              }, " < ", 2),
-              createElementVNode("span", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__current-month-year"]),
-                onClick: _cache[17] || (_cache[17] = ($event) => handlePickerToggle(false))
-              }, toDisplayString(rightDate.value.getFullYear()) + " " + toDisplayString(MONTH_NAMES[rightDate.value.getMonth()]), 3),
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[18] || (_cache[18] = ($event) => handleMonthChange(false, true))
-              }, " > ", 2),
-              createElementVNode("button", {
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__nav-button"]),
-                onClick: _cache[19] || (_cache[19] = ($event) => handleYearChange(false, true))
-              }, " >> ", 2),
-              isPickerOpenRight.value ? (openBlock(), createElementBlock("div", {
-                key: 0,
-                ref_key: "pickerRefRight",
-                ref: pickerRefRight,
-                class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-dropdown"])
+              c("div", {
+                class: r(e.$style["SearchDateRangePicker__picker-header"])
               }, [
-                createElementVNode("div", {
-                  class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-header"])
-                }, [
-                  createElementVNode("button", {
-                    class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-nav-button"]),
-                    onClick: _cache[20] || (_cache[20] = ($event) => handlePickerYearChange(false, pickerYearRight.value - 1))
-                  }, " < ", 2),
-                  createElementVNode("span", {
-                    class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-year-text"])
-                  }, toDisplayString(pickerYearRight.value), 3),
-                  createElementVNode("button", {
-                    class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-nav-button"]),
-                    onClick: _cache[21] || (_cache[21] = ($event) => handlePickerYearChange(false, pickerYearRight.value + 1))
-                  }, " > ", 2)
-                ], 2),
-                createElementVNode("div", {
-                  class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-months"])
-                }, [
-                  (openBlock(), createElementBlock(Fragment, null, renderList(MONTH_NAMES, (monthName, index) => {
-                    return createElementVNode("button", {
-                      key: monthName,
-                      class: normalizeClass(_ctx.$style["SearchDateRangePicker__picker-month-button"]),
-                      onClick: ($event) => handlePickerMonthSelect(false, index)
-                    }, toDisplayString(monthName), 11, _hoisted_5);
-                  }), 64))
-                ], 2)
-              ], 2)) : createCommentVNode("", true)
-            ], 2),
-            createElementVNode("div", {
-              class: normalizeClass(_ctx.$style["SearchDateRangePicker__week-days"])
-            }, [
-              (openBlock(), createElementBlock(Fragment, null, renderList(WEEK_DAYS, (day) => {
-                return createElementVNode("div", {
-                  key: day,
-                  class: normalizeClass(_ctx.$style["SearchDateRangePicker__week-day"])
-                }, toDisplayString(day), 3);
-              }), 64))
-            ], 2),
-            createElementVNode("div", {
-              class: normalizeClass(_ctx.$style.SearchDateRangePicker__days)
-            }, [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(getMonthData(rightDate.value), ({ date: day, isCurrentMonth }, index) => {
-                return openBlock(), createElementBlock("div", {
-                  key: index,
-                  class: normalizeClass([
-                    _ctx.$style.SearchDateRangePicker__day,
-                    {
-                      [_ctx.$style["SearchDateRangePicker__day--selected"]]: isDateSelected(day),
-                      [_ctx.$style["SearchDateRangePicker__day--start"]]: isStartDate(day) && isCurrentMonth,
-                      [_ctx.$style["SearchDateRangePicker__day--end"]]: isEndDate(day) && isCurrentMonth,
-                      [_ctx.$style["SearchDateRangePicker__day--other-month"]]: !isCurrentMonth,
-                      [_ctx.$style["SearchDateRangePicker__day--today"]]: isToday(day) && isCurrentMonth
-                    }
-                  ]),
-                  onClick: ($event) => isCurrentMonth && handleDateClick(day)
-                }, toDisplayString(day.getDate()), 11, _hoisted_6);
-              }), 128))
-            ], 2)
+                c("button", {
+                  class: r(e.$style["SearchDateRangePicker__picker-nav-button"]),
+                  onClick: a[20] || (a[20] = (t) => w(!1, $.value - 1))
+                }, " < ", 2),
+                c("span", {
+                  class: r(e.$style["SearchDateRangePicker__picker-year-text"])
+                }, l($.value), 3),
+                c("button", {
+                  class: r(e.$style["SearchDateRangePicker__picker-nav-button"]),
+                  onClick: a[21] || (a[21] = (t) => w(!1, $.value + 1))
+                }, " > ", 2)
+              ], 2),
+              c("div", {
+                class: r(e.$style["SearchDateRangePicker__picker-months"])
+              }, [
+                (k(), i(P, null, y(f, (t, n) => c("button", {
+                  key: t,
+                  class: r(e.$style["SearchDateRangePicker__picker-month-button"]),
+                  onClick: (o) => q(!1, n)
+                }, l(t), 11, ie)), 64))
+              ], 2)
+            ], 2)) : W("", !0)
+          ], 2),
+          c("div", {
+            class: r(e.$style["SearchDateRangePicker__week-days"])
+          }, [
+            (k(), i(P, null, y(T, (t) => c("div", {
+              key: t,
+              class: r(e.$style["SearchDateRangePicker__week-day"])
+            }, l(t), 3)), 64))
+          ], 2),
+          c("div", {
+            class: r(e.$style.SearchDateRangePicker__days)
+          }, [
+            (k(!0), i(P, null, y(H(h.value), ({ date: t, isCurrentMonth: n }, o) => (k(), i("div", {
+              key: o,
+              class: r([
+                e.$style.SearchDateRangePicker__day,
+                {
+                  [e.$style["SearchDateRangePicker__day--selected"]]: U(t),
+                  [e.$style["SearchDateRangePicker__day--start"]]: N(t) && n,
+                  [e.$style["SearchDateRangePicker__day--end"]]: A(t) && n,
+                  [e.$style["SearchDateRangePicker__day--other-month"]]: !n,
+                  [e.$style["SearchDateRangePicker__day--today"]]: z(t) && n
+                }
+              ]),
+              onClick: (_) => n && M(t)
+            }, l(t.getDate()), 11, ke))), 128))
           ], 2)
         ], 2)
-      ], 2));
-    };
+      ], 2)
+    ], 2));
   }
-});
-const SearchDateRangePicker = "_SearchDateRangePicker_1pruk_295";
-const SearchDateRangePicker__calendars = "_SearchDateRangePicker__calendars_1pruk_304";
-const SearchDateRangePicker__calendar = "_SearchDateRangePicker__calendar_1pruk_304";
-const SearchDateRangePicker__days = "_SearchDateRangePicker__days_1pruk_429";
-const SearchDateRangePicker__day = "_SearchDateRangePicker__day_1pruk_429";
-const slideUp = "_slideUp_1pruk_1";
-const style0 = {
+}), ue = "_SearchDateRangePicker_1pruk_295", _e = "_SearchDateRangePicker__calendars_1pruk_304", De = "_SearchDateRangePicker__calendar_1pruk_304", ge = "_SearchDateRangePicker__days_1pruk_429", he = "_SearchDateRangePicker__day_1pruk_429", de = "_slideUp_1pruk_1", Re = {
   "tui-theme-dark": "_tui-theme-dark_1pruk_2",
   "tui-theme-light": "_tui-theme-light_1pruk_140",
-  SearchDateRangePicker,
-  SearchDateRangePicker__calendars,
-  SearchDateRangePicker__calendar,
+  SearchDateRangePicker: ue,
+  SearchDateRangePicker__calendars: _e,
+  SearchDateRangePicker__calendar: De,
   "SearchDateRangePicker__calendar-header": "_SearchDateRangePicker__calendar-header_1pruk_316",
   "SearchDateRangePicker__current-month-year": "_SearchDateRangePicker__current-month-year_1pruk_325",
   "SearchDateRangePicker__nav-button": "_SearchDateRangePicker__nav-button_1pruk_339",
@@ -543,8 +418,8 @@ const style0 = {
   "SearchDateRangePicker__picker-month-button": "_SearchDateRangePicker__picker-month-button_1pruk_400",
   "SearchDateRangePicker__week-days": "_SearchDateRangePicker__week-days_1pruk_416",
   "SearchDateRangePicker__week-day": "_SearchDateRangePicker__week-day_1pruk_416",
-  SearchDateRangePicker__days,
-  SearchDateRangePicker__day,
+  SearchDateRangePicker__days: ge,
+  SearchDateRangePicker__day: he,
   "SearchDateRangePicker__day--today": "_SearchDateRangePicker__day--today_1pruk_450",
   "SearchDateRangePicker__day--other-month": "_SearchDateRangePicker__day--other-month_1pruk_454",
   "SearchDateRangePicker__day--selected": "_SearchDateRangePicker__day--selected_1pruk_461",
@@ -552,7 +427,7 @@ const style0 = {
   "SearchDateRangePicker__day--end": "_SearchDateRangePicker__day--end_1pruk_466",
   "SearchDateRangePicker__h5-mask": "_SearchDateRangePicker__h5-mask_1pruk_498",
   "SearchDateRangePicker__h5-panel": "_SearchDateRangePicker__h5-panel_1pruk_511",
-  slideUp,
+  slideUp: de,
   "SearchDateRangePicker__h5-header": "_SearchDateRangePicker__h5-header_1pruk_524",
   "SearchDateRangePicker__h5-footer": "_SearchDateRangePicker__h5-footer_1pruk_532",
   "SearchDateRangePicker__h5-cancel": "_SearchDateRangePicker__h5-cancel_1pruk_540",
@@ -560,11 +435,9 @@ const style0 = {
   "SearchDateRangePicker__h5-quick-options": "_SearchDateRangePicker__h5-quick-options_1pruk_565",
   "SearchDateRangePicker__h5-quick-option": "_SearchDateRangePicker__h5-quick-option_1pruk_565",
   "SearchDateRangePicker__h5-quick-option--active": "_SearchDateRangePicker__h5-quick-option--active_1pruk_584"
-};
-const cssModules = {
-  "$style": style0
-};
-const DateRangePicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
+}, Pe = {
+  $style: Re
+}, $e = /* @__PURE__ */ re(oe, [["__cssModules", Pe]]);
 export {
-  DateRangePicker as default
+  $e as default
 };