@expcat/tigercat-vue 2.1.1 → 2.1.3

package/dist/chunk-FWO7RNGI.mjs

@@ -1,892 +0,0 @@
-import {
-  createFilledIcon
-} from "./chunk-2TNZ4JNT.mjs";
-import {
-  renderVueOverlayTeleport,
-  useVueAnchoredOverlay
-} from "./chunk-Q7Y22OFX.mjs";
-import {
-  useTigerConfig
-} from "./chunk-UOJOJBEU.mjs";
-
-// src/components/DatePicker.ts
-import { defineComponent, computed, ref, nextTick, h, watch } from "vue";
-import {
-  classNames,
-  coerceClassValue,
-  mergeStyleValues,
-  parseDate,
-  formatDate,
-  formatMonthYear,
-  addDays,
-  addMonths,
-  isDateInRange,
-  getCalendarDays,
-  getShortDayNames,
-  getDatePickerCalendarCellState,
-  normalizeDate,
-  datePickerBaseClasses,
-  datePickerInputWrapperClasses,
-  getDatePickerInputClasses,
-  getDatePickerIconButtonClasses,
-  datePickerCalendarClasses,
-  datePickerMobileWheelClasses,
-  datePickerMobileWheelGridClasses,
-  datePickerMobileWheelSelectClasses,
-  datePickerCalendarHeaderClasses,
-  datePickerNavButtonClasses,
-  datePickerMonthYearClasses,
-  datePickerCalendarGridClasses,
-  datePickerDayNameClasses,
-  getDatePickerDayCellClasses,
-  datePickerClearButtonClasses,
-  datePickerFooterClasses,
-  datePickerFooterButtonClasses,
-  calendarSolidIcon20PathD,
-  closeSolidIcon20PathD,
-  chevronLeftSolidIcon20PathD,
-  chevronRightSolidIcon20PathD,
-  getDatePickerLocaleCode,
-  getDatePickerLabels,
-  getLocaleDirection,
-  mergeTigerLocale
-} from "@expcat/tigercat-core";
-var CalendarIcon = createFilledIcon(calendarSolidIcon20PathD, "w-5 h-5");
-var CloseIcon = createFilledIcon(closeSolidIcon20PathD, "w-4 h-4");
-var ChevronLeftIcon = createFilledIcon(chevronLeftSolidIcon20PathD, "w-5 h-5");
-var ChevronRightIcon = createFilledIcon(chevronRightSolidIcon20PathD, "w-5 h-5");
-function normalizeDatePickerLocale(locale) {
-  if (!locale) return void 0;
-  if (typeof locale === "string") return { locale };
-  if ("datePicker" in locale) return locale;
-  const preset = locale;
-  return {
-    locale: hasDatePickerLocaleCode(preset) ? preset.locale : void 0,
-    datePicker: preset
-  };
-}
-function hasDatePickerLocaleCode(locale) {
-  return typeof locale.locale === "string";
-}
-var isDateLike = (value) => value === null || value instanceof Date || typeof value === "string";
-var isModelValue = (value) => {
-  if (isDateLike(value)) return true;
-  if (Array.isArray(value) && value.length === 2) {
-    return isDateLike(value[0]) && isDateLike(value[1]);
-  }
-  return false;
-};
-var DatePicker = defineComponent({
-  name: "TigerDatePicker",
-  inheritAttrs: false,
-  props: {
-    /**
-     * Enable range selection (start/end).
-     * When true, v-model uses a tuple: [start, end].
-     * @default false
-     */
-    range: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Locale used for month/day names in the calendar UI.
-     * Example: 'zh-CN', 'en-US'
-     */
-    locale: {
-      type: [String, Object]
-    },
-    /**
-     * UI labels for i18n.
-     */
-    labels: {
-      type: Object,
-      default: void 0
-    },
-    /**
-     * Selected date value (for v-model)
-     */
-    modelValue: {
-      type: [Date, String, Array, null],
-      default: null
-    },
-    /**
-     * Date picker size
-     * @default 'md'
-     */
-    size: {
-      type: String,
-      default: "md"
-    },
-    /**
-     * Date format string
-     * @default 'yyyy-MM-dd'
-     */
-    format: {
-      type: String,
-      default: "yyyy-MM-dd"
-    },
-    /**
-     * Placeholder text
-     */
-    placeholder: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Whether the date picker is disabled
-     * @default false
-     */
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether the date picker is readonly
-     * @default false
-     */
-    readonly: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether the date picker is required
-     * @default false
-     */
-    required: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Minimum selectable date
-     */
-    minDate: {
-      type: [Date, String, null],
-      default: null
-    },
-    /**
-     * Maximum selectable date
-     */
-    maxDate: {
-      type: [Date, String, null],
-      default: null
-    },
-    /**
-     * Show clear button
-     * @default true
-     */
-    clearable: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Input name attribute
-     */
-    name: {
-      type: String
-    },
-    /**
-     * Input id attribute
-     */
-    id: {
-      type: String
-    },
-    /**
-     * Additional CSS classes
-     */
-    className: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Custom styles
-     */
-    style: {
-      type: Object,
-      default: void 0
-    },
-    /**
-     * Shortcut presets for quick date selection
-     */
-    shortcuts: {
-      type: Array,
-      default: void 0
-    }
-  },
-  emits: {
-    /**
-     * Emitted when date changes (for v-model)
-     */
-    "update:modelValue": (value) => {
-      return isModelValue(value);
-    },
-    /**
-     * Convenience event emitted alongside `update:modelValue` on every value
-     * change. This is an intentional, non-v-model event (the idiomatic Vue
-     * pattern); it always carries the same normalized value as
-     * `update:modelValue`. Prefer `v-model` for two-way binding and use
-     * `@change` only for side effects.
-     */
-    change: (value) => {
-      return isModelValue(value);
-    },
-    /**
-     * Emitted when clear button is clicked
-     */
-    clear: () => true
-  },
-  setup(props, { emit, attrs }) {
-    const config = useTigerConfig();
-    const isOpen = ref(false);
-    const calendarRef = ref(null);
-    const mobileCalendarRef = ref(null);
-    const inputWrapperRef = ref(null);
-    const inputRef = ref(null);
-    const panelRef = ref(null);
-    const overlay = useVueAnchoredOverlay({
-      enabled: isOpen,
-      referenceRef: inputWrapperRef,
-      floatingRef: panelRef,
-      placement: "bottom-start",
-      offset: 4,
-      layout: "bottom-sheet-sm",
-      dismissOnOutside: true,
-      dismissOnEscape: true,
-      onDismiss: closeCalendar
-    });
-    const activeDateIso = ref(null);
-    const activeRangePart = ref("start");
-    const pendingFocusIso = ref(null);
-    const restoreFocusEl = ref(null);
-    const isRangeMode = computed(() => props.range);
-    const selectedDate = computed(() => {
-      if (isRangeMode.value) return null;
-      return parseDate(props.modelValue);
-    });
-    const selectedRange = computed(() => {
-      if (!isRangeMode.value) return [null, null];
-      const raw = props.modelValue;
-      if (!raw || !Array.isArray(raw)) return [null, null];
-      return [parseDate(raw[0]), parseDate(raw[1])];
-    });
-    const minDateParsed = computed(() => parseDate(props.minDate));
-    const maxDateParsed = computed(() => parseDate(props.maxDate));
-    const mergedLocale = computed(
-      () => mergeTigerLocale(config.value.locale, normalizeDatePickerLocale(props.locale))
-    );
-    const localeCode = computed(() => getDatePickerLocaleCode(mergedLocale.value));
-    const viewingMonth = ref(
-      (selectedDate.value ?? selectedRange.value[0])?.getMonth() ?? (/* @__PURE__ */ new Date()).getMonth()
-    );
-    const viewingYear = ref(
-      (selectedDate.value ?? selectedRange.value[0])?.getFullYear() ?? (/* @__PURE__ */ new Date()).getFullYear()
-    );
-    const displayValue = computed(() => {
-      if (!isRangeMode.value) {
-        return selectedDate.value ? formatDate(selectedDate.value, props.format, localeCode.value) : "";
-      }
-      const [start, end] = selectedRange.value;
-      const startText = start ? formatDate(start, props.format, localeCode.value) : "";
-      const endText = end ? formatDate(end, props.format, localeCode.value) : "";
-      if (!startText && !endText) return "";
-      if (startText && endText) return `${startText} - ${endText}`;
-      return startText ? `${startText} - ` : ` - ${endText}`;
-    });
-    const showClearButton = computed(() => {
-      if (!props.clearable || props.disabled || props.readonly) return false;
-      if (!isRangeMode.value) return selectedDate.value !== null;
-      const [start, end] = selectedRange.value;
-      return start !== null || end !== null;
-    });
-    const calendarDays = computed(() => {
-      return getCalendarDays(viewingYear.value, viewingMonth.value);
-    });
-    const dayNames = computed(() => getShortDayNames(localeCode.value));
-    const isRtl = computed(() => getLocaleDirection(localeCode.value) === "rtl");
-    const previousMonthIcon = computed(() => isRtl.value ? ChevronRightIcon : ChevronLeftIcon);
-    const nextMonthIcon = computed(() => isRtl.value ? ChevronLeftIcon : ChevronRightIcon);
-    const labels = computed(() => getDatePickerLabels(mergedLocale.value, props.labels));
-    const placeholderText = computed(
-      () => props.placeholder ?? (props.range ? labels.value.rangePlaceholder : labels.value.placeholder)
-    );
-    const mobileDate = computed(() => {
-      if (!isRangeMode.value) return selectedDate.value ?? normalizeDate(/* @__PURE__ */ new Date());
-      const [start, end] = selectedRange.value;
-      return (activeRangePart.value === "start" ? start : end) ?? start ?? end ?? normalizeDate(/* @__PURE__ */ new Date());
-    });
-    const mobileYears = computed(() => {
-      const baseYear = mobileDate.value.getFullYear();
-      return Array.from({ length: 101 }, (_, index) => baseYear - 50 + index);
-    });
-    const mobileDays = computed(() => {
-      const date = mobileDate.value;
-      const daysInMonth = new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();
-      return Array.from({ length: daysInMonth }, (_, index) => index + 1);
-    });
-    const emitValue = (value) => {
-      emit("update:modelValue", value);
-      emit("change", value);
-    };
-    const focusDateButtonByIso = (iso) => {
-      const button = calendarRef.value?.querySelector(
-        `button[data-date="${iso}"]`
-      );
-      if (!button || button.disabled) return false;
-      button.focus();
-      activeDateIso.value = iso;
-      return true;
-    };
-    const getFirstEnabledIsoInView = () => {
-      for (const date of calendarDays.value) {
-        if (!date) continue;
-        const iso = formatDate(date, "yyyy-MM-dd");
-        if (!isDateDisabled(date)) return iso;
-      }
-      return null;
-    };
-    const getPreferredFocusIso = () => {
-      const focusDate = isRangeMode.value ? selectedRange.value[0] ?? selectedRange.value[1] : selectedDate.value;
-      if (focusDate) return formatDate(focusDate, "yyyy-MM-dd");
-      const today = normalizeDate(/* @__PURE__ */ new Date());
-      if (isDateInRange(today, minDateParsed.value, maxDateParsed.value)) {
-        return formatDate(today, "yyyy-MM-dd");
-      }
-      return getFirstEnabledIsoInView();
-    };
-    const restoreFocus = () => {
-      const target = restoreFocusEl.value ?? inputRef.value;
-      if (!target) return;
-      if (typeof target.focus === "function") {
-        ;
-        target.focus();
-      }
-    };
-    const moveFocus = async (deltaDays) => {
-      const activeEl = document.activeElement;
-      const currentIso = activeEl?.getAttribute("data-date") ?? activeDateIso.value ?? null;
-      const baseIso = currentIso ?? getPreferredFocusIso();
-      if (!baseIso) return;
-      const baseDate = parseDate(baseIso);
-      if (!baseDate) return;
-      let candidate = addDays(baseDate, deltaDays);
-      for (let attempts = 0; attempts < 42; attempts++) {
-        const iso = formatDate(candidate, "yyyy-MM-dd");
-        const el = calendarRef.value?.querySelector(
-          `button[data-date="${iso}"]`
-        );
-        if (el && !el.disabled) {
-          el.focus();
-          activeDateIso.value = iso;
-          return;
-        }
-        if (!el) {
-          pendingFocusIso.value = iso;
-          viewingYear.value = candidate.getFullYear();
-          viewingMonth.value = candidate.getMonth();
-          activeDateIso.value = iso;
-          await nextTick();
-          if (pendingFocusIso.value) {
-            const nextIso = pendingFocusIso.value;
-            pendingFocusIso.value = null;
-            if (focusDateButtonByIso(nextIso)) return;
-          }
-          const fallback = getFirstEnabledIsoInView();
-          if (fallback) focusDateButtonByIso(fallback);
-          return;
-        }
-        candidate = addDays(candidate, deltaDays);
-      }
-    };
-    const handleCalendarKeyDown = async (event) => {
-      if (!isOpen.value) return;
-      switch (event.key) {
-        case "Escape": {
-          event.preventDefault();
-          closeCalendar();
-          return;
-        }
-        case "ArrowRight": {
-          event.preventDefault();
-          await moveFocus(1);
-          return;
-        }
-        case "ArrowLeft": {
-          event.preventDefault();
-          await moveFocus(-1);
-          return;
-        }
-        case "ArrowDown": {
-          event.preventDefault();
-          await moveFocus(7);
-          return;
-        }
-        case "ArrowUp": {
-          event.preventDefault();
-          await moveFocus(-7);
-          return;
-        }
-        case "Enter":
-        case " ": {
-          const activeEl = document.activeElement;
-          if (activeEl?.tagName === "BUTTON" && activeEl.dataset.date) {
-            event.preventDefault();
-            if (!activeEl.disabled) activeEl.click();
-          }
-          return;
-        }
-      }
-    };
-    function toggleCalendar() {
-      if (!props.disabled && !props.readonly) {
-        isOpen.value = !isOpen.value;
-        if (isOpen.value) {
-          restoreFocusEl.value = inputRef.value ?? null;
-          const baseDate = selectedDate.value ?? selectedRange.value[0];
-          if (baseDate) {
-            viewingMonth.value = baseDate.getMonth();
-            viewingYear.value = baseDate.getFullYear();
-          }
-        }
-      }
-    }
-    function closeCalendar() {
-      isOpen.value = false;
-    }
-    function setToday() {
-      selectDate(/* @__PURE__ */ new Date());
-    }
-    function handleShortcut(shortcut) {
-      const val = typeof shortcut.value === "function" ? shortcut.value() : shortcut.value;
-      if (!isRangeMode.value) {
-        const date = val instanceof Date ? normalizeDate(val) : val ? normalizeDate(parseDate(val)) : null;
-        emitValue(date);
-      } else {
-        const range = val;
-        if (range && Array.isArray(range)) {
-          emitValue([
-            range[0] ? normalizeDate(range[0] instanceof Date ? range[0] : parseDate(range[0])) : null,
-            range[1] ? normalizeDate(range[1] instanceof Date ? range[1] : parseDate(range[1])) : null
-          ]);
-        }
-      }
-      closeCalendar();
-    }
-    function selectDate(date) {
-      if (!date) return;
-      const normalizedDate = normalizeDate(date);
-      if (!isDateInRange(normalizedDate, minDateParsed.value, maxDateParsed.value)) {
-        return;
-      }
-      if (!isRangeMode.value) {
-        emitValue(normalizedDate);
-        closeCalendar();
-        return;
-      }
-      const [start, end] = selectedRange.value;
-      if (!start || start && end) {
-        emitValue([normalizedDate, null]);
-        return;
-      }
-      emitValue([start, normalizedDate < start ? start : normalizedDate]);
-    }
-    function commitMobileDate(date) {
-      const normalized = normalizeDate(date);
-      if (!isDateInRange(normalized, minDateParsed.value, maxDateParsed.value)) return;
-      viewingYear.value = normalized.getFullYear();
-      viewingMonth.value = normalized.getMonth();
-      if (!isRangeMode.value) {
-        emitValue(normalized);
-        return;
-      }
-      const [start, end] = selectedRange.value;
-      if (activeRangePart.value === "start") {
-        emitValue([normalized, end && end < normalized ? normalized : end]);
-        activeRangePart.value = "end";
-        return;
-      }
-      emitValue([start ?? normalized, start && normalized < start ? start : normalized]);
-    }
-    function updateMobileDate(part, value) {
-      const base = mobileDate.value;
-      const nextYear = part === "year" ? value : base.getFullYear();
-      const nextMonth2 = part === "month" ? value : base.getMonth();
-      const maxDay = new Date(nextYear, nextMonth2 + 1, 0).getDate();
-      const nextDay = Math.min(part === "day" ? value : base.getDate(), maxDay);
-      commitMobileDate(new Date(nextYear, nextMonth2, nextDay));
-    }
-    function clearDate(event) {
-      event.stopPropagation();
-      emitValue(!isRangeMode.value ? null : [null, null]);
-      emit("clear");
-    }
-    function stepViewingMonth(delta) {
-      const next = addMonths(new Date(viewingYear.value, viewingMonth.value, 1), delta);
-      viewingYear.value = next.getFullYear();
-      viewingMonth.value = next.getMonth();
-    }
-    function previousMonth() {
-      stepViewingMonth(-1);
-    }
-    function nextMonth() {
-      stepViewingMonth(1);
-    }
-    function isDateDisabled(date) {
-      if (!date) return true;
-      return !isDateInRange(date, minDateParsed.value, maxDateParsed.value);
-    }
-    function isCurrentMonth(date) {
-      if (!date) return false;
-      return date.getMonth() === viewingMonth.value;
-    }
-    function handleInputClick() {
-      toggleCalendar();
-    }
-    watch(isOpen, (newValue) => {
-      if (newValue) {
-        const preferred = pendingFocusIso.value ?? getPreferredFocusIso();
-        pendingFocusIso.value = null;
-        nextTick().then(() => {
-          if (preferred && focusDateButtonByIso(preferred)) return;
-          const fallback = getFirstEnabledIsoInView();
-          if (fallback) focusDateButtonByIso(fallback);
-        });
-      } else {
-        nextTick().then(() => {
-          restoreFocus();
-        });
-      }
-    });
-    const rootClass = computed(
-      () => classNames(datePickerBaseClasses, props.className, coerceClassValue(attrs.class))
-    );
-    const rootStyle = computed(() => mergeStyleValues(attrs.style, props.style));
-    const forwardedAttrs = computed(() => {
-      const { class: _class, style: _style, ...rest } = attrs ?? {};
-      return rest;
-    });
-    return () => {
-      const inputClasses = getDatePickerInputClasses(
-        props.size,
-        props.disabled || props.readonly,
-        showClearButton.value
-      );
-      const iconButtonClasses = getDatePickerIconButtonClasses(props.size);
-      return h(
-        "div",
-        {
-          ...forwardedAttrs.value,
-          class: rootClass.value,
-          style: rootStyle.value
-        },
-        [
-          // Input wrapper
-          h(
-            "div",
-            {
-              ref: inputWrapperRef,
-              class: datePickerInputWrapperClasses
-            },
-            [
-              // Input field for date display
-              h("input", {
-                ref: inputRef,
-                type: "text",
-                class: inputClasses,
-                value: displayValue.value,
-                placeholder: placeholderText.value,
-                disabled: props.disabled,
-                readonly: true,
-                // Always readonly to prevent manual text input and ensure date selection via calendar only
-                required: props.required,
-                name: props.name,
-                id: props.id,
-                onClick: handleInputClick,
-                "aria-label": placeholderText.value
-              }),
-              // Clear button
-              showClearButton.value && h(
-                "button",
-                {
-                  type: "button",
-                  class: datePickerClearButtonClasses,
-                  onClick: clearDate,
-                  "aria-label": labels.value.clearDate
-                },
-                CloseIcon
-              ),
-              // Calendar icon button
-              h(
-                "button",
-                {
-                  type: "button",
-                  class: iconButtonClasses,
-                  disabled: props.disabled || props.readonly,
-                  onClick: toggleCalendar,
-                  "aria-label": labels.value.toggleCalendar
-                },
-                CalendarIcon
-              )
-            ]
-          ),
-          // Calendar dropdown
-          isOpen.value && renderVueOverlayTeleport(
-            h(
-              "div",
-              {
-                ref: panelRef,
-                class: overlay.floatingClasses.value,
-                style: overlay.floatingStyles.value,
-                "data-positioned": overlay.positioned.value
-              },
-              [
-                h(
-                  "div",
-                  {
-                    ref: mobileCalendarRef,
-                    class: datePickerMobileWheelClasses,
-                    role: "group",
-                    "aria-label": labels.value.calendar
-                  },
-                  [
-                    isRangeMode.value ? h("div", { class: "mb-3 flex items-center gap-2" }, [
-                      h(
-                        "button",
-                        {
-                          type: "button",
-                          class: datePickerFooterButtonClasses,
-                          "aria-selected": activeRangePart.value === "start",
-                          onClick: () => activeRangePart.value = "start"
-                        },
-                        "Start"
-                      ),
-                      h(
-                        "button",
-                        {
-                          type: "button",
-                          class: datePickerFooterButtonClasses,
-                          "aria-selected": activeRangePart.value === "end",
-                          onClick: () => activeRangePart.value = "end"
-                        },
-                        "End"
-                      )
-                    ]) : null,
-                    h("div", { class: datePickerMobileWheelGridClasses }, [
-                      h(
-                        "select",
-                        {
-                          class: datePickerMobileWheelSelectClasses,
-                          value: mobileDate.value.getFullYear(),
-                          "aria-label": labels.value.year,
-                          onChange: (event) => updateMobileDate(
-                            "year",
-                            Number(event.target.value)
-                          )
-                        },
-                        mobileYears.value.map((year) => h("option", { value: year }, year))
-                      ),
-                      h(
-                        "select",
-                        {
-                          class: datePickerMobileWheelSelectClasses,
-                          value: mobileDate.value.getMonth(),
-                          "aria-label": labels.value.month,
-                          onChange: (event) => updateMobileDate(
-                            "month",
-                            Number(event.target.value)
-                          )
-                        },
-                        Array.from(
-                          { length: 12 },
-                          (_, month) => h("option", { value: month }, month + 1)
-                        )
-                      ),
-                      h(
-                        "select",
-                        {
-                          class: datePickerMobileWheelSelectClasses,
-                          value: mobileDate.value.getDate(),
-                          "aria-label": labels.value.day,
-                          onChange: (event) => updateMobileDate(
-                            "day",
-                            Number(event.target.value)
-                          )
-                        },
-                        mobileDays.value.map((day) => h("option", { value: day }, day))
-                      )
-                    ]),
-                    h("div", { class: "mt-4 flex justify-end gap-2" }, [
-                      h(
-                        "button",
-                        {
-                          type: "button",
-                          class: datePickerFooterButtonClasses,
-                          "aria-label": `Mobile ${labels.value.ok}`,
-                          onClick: closeCalendar
-                        },
-                        labels.value.ok
-                      )
-                    ])
-                  ]
-                ),
-                h(
-                  "div",
-                  {
-                    ref: calendarRef,
-                    class: datePickerCalendarClasses,
-                    role: "dialog",
-                    "aria-modal": "true",
-                    "aria-label": labels.value.calendar,
-                    onKeydown: handleCalendarKeyDown
-                  },
-                  [
-                    // Calendar header
-                    h("div", { class: datePickerCalendarHeaderClasses }, [
-                      h(
-                        "button",
-                        {
-                          type: "button",
-                          class: datePickerNavButtonClasses,
-                          onClick: previousMonth,
-                          "aria-label": labels.value.previousMonth
-                        },
-                        previousMonthIcon.value
-                      ),
-                      h(
-                        "div",
-                        { class: datePickerMonthYearClasses },
-                        formatMonthYear(viewingYear.value, viewingMonth.value, localeCode.value)
-                      ),
-                      h(
-                        "button",
-                        {
-                          type: "button",
-                          class: datePickerNavButtonClasses,
-                          onClick: nextMonth,
-                          "aria-label": labels.value.nextMonth
-                        },
-                        nextMonthIcon.value
-                      )
-                    ]),
-                    // Day names header
-                    h("div", { class: datePickerCalendarGridClasses, role: "row" }, [
-                      ...dayNames.value.map(
-                        (day) => h(
-                          "div",
-                          {
-                            class: datePickerDayNameClasses,
-                            key: day,
-                            role: "columnheader"
-                          },
-                          day
-                        )
-                      )
-                    ]),
-                    // Calendar grid
-                    (() => {
-                      return h(
-                        "div",
-                        {
-                          class: datePickerCalendarGridClasses,
-                          role: "grid",
-                          "aria-rowcount": 6,
-                          "aria-colcount": 7
-                        },
-                        [
-                          ...calendarDays.value.map((date, index) => {
-                            if (!date) return null;
-                            const cell = getDatePickerCalendarCellState({
-                              date,
-                              selectedDate: selectedDate.value,
-                              selectedRange: selectedRange.value,
-                              isRangeMode: isRangeMode.value,
-                              isCurrentMonth,
-                              isDateDisabled
-                            });
-                            return h(
-                              "button",
-                              {
-                                key: index,
-                                type: "button",
-                                class: getDatePickerDayCellClasses(
-                                  cell.isCurrentMonthDay,
-                                  cell.isSelected,
-                                  cell.isTodayDay,
-                                  cell.isDisabled,
-                                  cell.isInRange,
-                                  cell.isRangeStart,
-                                  cell.isRangeEnd
-                                ),
-                                disabled: cell.isDisabled,
-                                onClick: () => selectDate(date),
-                                role: "gridcell",
-                                "data-date": cell.iso,
-                                onFocus: () => {
-                                  activeDateIso.value = cell.iso;
-                                },
-                                tabindex: activeDateIso.value === cell.iso && !cell.isDisabled ? 0 : -1,
-                                "aria-label": cell.iso,
-                                "aria-selected": cell.isSelected,
-                                "aria-current": cell.isTodayDay ? "date" : void 0
-                              },
-                              date.getDate()
-                            );
-                          })
-                        ]
-                      );
-                    })(),
-                    // Shortcuts panel
-                    props.shortcuts?.length ? h(
-                      "div",
-                      {
-                        class: "flex flex-wrap gap-1 px-3 py-2 border-t border-[var(--tiger-border,#e5e7eb)]"
-                      },
-                      props.shortcuts.map(
-                        (sc) => h(
-                          "button",
-                          {
-                            type: "button",
-                            class: datePickerFooterButtonClasses,
-                            onClick: () => handleShortcut(sc)
-                          },
-                          sc.label
-                        )
-                      )
-                    ) : null,
-                    // Footer (range mode only)
-                    isRangeMode.value ? h("div", { class: datePickerFooterClasses }, [
-                      h(
-                        "button",
-                        {
-                          type: "button",
-                          class: datePickerFooterButtonClasses,
-                          onClick: setToday
-                        },
-                        labels.value.today
-                      ),
-                      h(
-                        "button",
-                        {
-                          type: "button",
-                          class: datePickerFooterButtonClasses,
-                          onClick: closeCalendar
-                        },
-                        labels.value.ok
-                      )
-                    ]) : null
-                  ]
-                )
-              ]
-            ),
-            overlay.target.value
-          )
-        ]
-      );
-    };
-  }
-});
-var DatePicker_default = DatePicker;
-
-export {
-  DatePicker,
-  DatePicker_default
-};