@expcat/tigercat-react 2.1.2 → 2.1.3

package/dist/chunk-D3KP72UC.mjs

@@ -1,802 +0,0 @@
-import {
-  useControlledState
-} from "./chunk-MEFARVQI.mjs";
-import {
-  renderOverlayPortal,
-  useAnchoredOverlay
-} from "./chunk-HKAZXG74.mjs";
-import {
-  useTigerConfig
-} from "./chunk-YSIXURBW.mjs";
-
-// src/components/DatePicker.tsx
-import {
-  datePickerInputWrapperClasses,
-  datePickerClearButtonClasses,
-  calendarSolidIcon20PathD,
-  closeSolidIcon20PathD
-} from "@expcat/tigercat-core";
-
-// src/components/DatePicker/state.ts
-import { useState, useRef, useEffect, useMemo, useCallback } from "react";
-import {
-  classNames,
-  parseDate,
-  formatDate,
-  addDays,
-  addMonths,
-  isDateInRange,
-  getCalendarDays,
-  getShortDayNames,
-  normalizeDate,
-  datePickerBaseClasses,
-  getDatePickerInputClasses,
-  getDatePickerIconButtonClasses,
-  getDatePickerLocaleCode,
-  getDatePickerLabels,
-  getLocaleDirection,
-  mergeTigerLocale
-} from "@expcat/tigercat-core";
-
-// src/components/DatePicker/types.ts
-var isRangeDatePicker = (props) => props.range === true;
-
-// src/components/DatePicker/state.ts
-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";
-}
-function useDatePickerState(props) {
-  const config = useTigerConfig();
-  const {
-    size = "md",
-    disabled = false,
-    readonly = false,
-    required = false,
-    clearable = true,
-    format = "yyyy-MM-dd"
-  } = props;
-  const isRangeMode = isRangeDatePicker(props);
-  const divProps = (({
-    value: _value,
-    defaultValue: _defaultValue,
-    range: _range,
-    locale: _locale,
-    labels: _labels,
-    size: _size,
-    format: _format,
-    placeholder: _placeholder,
-    disabled: _disabled,
-    readonly: _readonly,
-    required: _required,
-    minDate: _minDate,
-    maxDate: _maxDate,
-    clearable: _clearable,
-    name: _name,
-    id: _id,
-    onChange: _onChange,
-    onClear: _onClear,
-    className: _className,
-    shortcuts: _shortcuts,
-    ...rest
-  }) => rest)(props);
-  const [isOpen, setIsOpen] = useState(false);
-  const [activeDateIso, setActiveDateIso] = useState(null);
-  const [activeRangePart, setActiveRangePart] = useState("start");
-  const singleProps = props;
-  const rangeProps = props;
-  const parseRangeTuple = (tuple) => {
-    if (!tuple || !Array.isArray(tuple)) return [null, null];
-    return [parseDate(tuple[0]), parseDate(tuple[1])];
-  };
-  const [singleValue, setSingleValue] = useControlledState(
-    !isRangeMode && singleProps.value !== void 0 ? parseDate(singleProps.value ?? null) : void 0,
-    parseDate(singleProps.defaultValue ?? null),
-    singleProps.onChange
-  );
-  const [rangeValue, setRangeValue] = useControlledState(
-    isRangeMode && rangeProps.value !== void 0 ? parseRangeTuple(rangeProps.value) : void 0,
-    parseRangeTuple(rangeProps.defaultValue),
-    rangeProps.onChange
-  );
-  const calendarRef = useRef(null);
-  const mobileCalendarRef = useRef(null);
-  const panelRef = useRef(null);
-  const inputWrapperRef = useRef(null);
-  const inputRef = useRef(null);
-  const pendingFocusIsoRef = useRef(null);
-  const restoreFocusRef = useRef(null);
-  const selectedDate = isRangeMode ? null : singleValue;
-  const selectedRange = useMemo(
-    () => isRangeMode ? rangeValue : [null, null],
-    [isRangeMode, rangeValue]
-  );
-  const minDateParsed = useMemo(() => parseDate(props.minDate ?? null), [props.minDate]);
-  const maxDateParsed = useMemo(() => parseDate(props.maxDate ?? null), [props.maxDate]);
-  const mergedLocale = useMemo(
-    () => mergeTigerLocale(config.locale, normalizeDatePickerLocale(props.locale)),
-    [config.locale, props.locale]
-  );
-  const localeCode = useMemo(() => getDatePickerLocaleCode(mergedLocale), [mergedLocale]);
-  const [viewingMonth, setViewingMonth] = useState(
-    (selectedDate ?? selectedRange[0])?.getMonth() ?? (/* @__PURE__ */ new Date()).getMonth()
-  );
-  const [viewingYear, setViewingYear] = useState(
-    (selectedDate ?? selectedRange[0])?.getFullYear() ?? (/* @__PURE__ */ new Date()).getFullYear()
-  );
-  const displayValue = (() => {
-    if (!isRangeMode) {
-      return selectedDate ? formatDate(selectedDate, format, localeCode) : "";
-    }
-    const [start, end] = selectedRange;
-    const startText = start ? formatDate(start, format, localeCode) : "";
-    const endText = end ? formatDate(end, format, localeCode) : "";
-    if (!startText && !endText) return "";
-    if (startText && endText) return `${startText} - ${endText}`;
-    return startText ? `${startText} - ` : ` - ${endText}`;
-  })();
-  const showClearButton = (() => {
-    if (!clearable || disabled || readonly) return false;
-    if (!isRangeMode) return selectedDate !== null;
-    return selectedRange[0] !== null || selectedRange[1] !== null;
-  })();
-  const calendarDays = useMemo(
-    () => getCalendarDays(viewingYear, viewingMonth),
-    [viewingYear, viewingMonth]
-  );
-  const selectedDateRef = useRef(selectedDate);
-  const selectedRangeRef = useRef(selectedRange);
-  const minDateParsedRef = useRef(minDateParsed);
-  const maxDateParsedRef = useRef(maxDateParsed);
-  const calendarDaysRef = useRef(calendarDays);
-  selectedDateRef.current = selectedDate;
-  selectedRangeRef.current = selectedRange;
-  minDateParsedRef.current = minDateParsed;
-  maxDateParsedRef.current = maxDateParsed;
-  calendarDaysRef.current = calendarDays;
-  const dayNames = useMemo(() => getShortDayNames(localeCode), [localeCode]);
-  const isRtl = getLocaleDirection(localeCode) === "rtl";
-  const labels = useMemo(
-    () => getDatePickerLabels(mergedLocale, props.labels),
-    [mergedLocale, props.labels]
-  );
-  const placeholder = props.placeholder ?? (isRangeMode ? labels.rangePlaceholder : labels.placeholder);
-  const mobileDate = useMemo(() => {
-    if (!isRangeMode) return selectedDate ?? normalizeDate(/* @__PURE__ */ new Date());
-    const [start, end] = selectedRange;
-    return (activeRangePart === "start" ? start : end) ?? start ?? end ?? normalizeDate(/* @__PURE__ */ new Date());
-  }, [activeRangePart, isRangeMode, selectedDate, selectedRange]);
-  const mobileYears = useMemo(() => {
-    const baseYear = mobileDate.getFullYear();
-    return Array.from({ length: 101 }, (_, index) => baseYear - 50 + index);
-  }, [mobileDate]);
-  const mobileDays = useMemo(() => {
-    const daysInMonth = new Date(mobileDate.getFullYear(), mobileDate.getMonth() + 1, 0).getDate();
-    return Array.from({ length: daysInMonth }, (_, index) => index + 1);
-  }, [mobileDate]);
-  const toggleCalendar = () => {
-    if (!disabled && !readonly) {
-      setIsOpen(!isOpen);
-      if (!isOpen) {
-        restoreFocusRef.current = inputRef.current ?? null;
-        const baseDate = selectedDate ?? selectedRange[0];
-        if (baseDate) {
-          setViewingMonth(baseDate.getMonth());
-          setViewingYear(baseDate.getFullYear());
-        }
-      }
-    }
-  };
-  const closeCalendar = useCallback(() => {
-    setIsOpen(false);
-  }, []);
-  const isDateDisabled = useCallback((date) => {
-    if (!date) return true;
-    return !isDateInRange(date, minDateParsedRef.current, maxDateParsedRef.current);
-  }, []);
-  const getFirstEnabledIsoInView = useCallback(() => {
-    for (const date of calendarDaysRef.current) {
-      if (!date) continue;
-      const iso = formatDate(date, "yyyy-MM-dd");
-      const isDisabled = isDateDisabled(date);
-      if (!isDisabled) return iso;
-    }
-    return null;
-  }, [isDateDisabled]);
-  const getPreferredFocusIso = useCallback(() => {
-    const focusDate = isRangeMode ? selectedRangeRef.current[0] ?? selectedRangeRef.current[1] : selectedDateRef.current;
-    if (focusDate) {
-      return formatDate(focusDate, "yyyy-MM-dd");
-    }
-    const today = normalizeDate(/* @__PURE__ */ new Date());
-    if (isDateInRange(today, minDateParsedRef.current, maxDateParsedRef.current)) {
-      return formatDate(today, "yyyy-MM-dd");
-    }
-    return getFirstEnabledIsoInView();
-  }, [isRangeMode, getFirstEnabledIsoInView]);
-  const focusDateButtonByIso = useCallback((iso) => {
-    const button = calendarRef.current?.querySelector(
-      `button[data-date="${iso}"]`
-    );
-    if (!button || button.disabled) return false;
-    button.focus();
-    setActiveDateIso(iso);
-    return true;
-  }, []);
-  const restoreFocus = useCallback(() => {
-    const target = restoreFocusRef.current ?? inputRef.current;
-    if (!target) return;
-    if (typeof target.focus === "function") {
-      ;
-      target.focus();
-    }
-  }, []);
-  const moveFocus = (deltaDays) => {
-    const activeEl = document.activeElement;
-    const currentIso = activeEl?.getAttribute("data-date") ?? activeDateIso ?? 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.current?.querySelector(
-        `button[data-date="${iso}"]`
-      );
-      if (el && !el.disabled) {
-        el.focus();
-        setActiveDateIso(iso);
-        return;
-      }
-      if (!el) {
-        pendingFocusIsoRef.current = iso;
-        setViewingYear(candidate.getFullYear());
-        setViewingMonth(candidate.getMonth());
-        setActiveDateIso(iso);
-        return;
-      }
-      candidate = addDays(candidate, deltaDays);
-    }
-  };
-  const handleCalendarKeyDown = (event) => {
-    if (!isOpen) return;
-    switch (event.key) {
-      case "Escape": {
-        event.preventDefault();
-        closeCalendar();
-        return;
-      }
-      case "ArrowRight": {
-        event.preventDefault();
-        moveFocus(1);
-        return;
-      }
-      case "ArrowLeft": {
-        event.preventDefault();
-        moveFocus(-1);
-        return;
-      }
-      case "ArrowDown": {
-        event.preventDefault();
-        moveFocus(7);
-        return;
-      }
-      case "ArrowUp": {
-        event.preventDefault();
-        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;
-      }
-    }
-  };
-  const selectDate = (date) => {
-    if (!date) return;
-    const normalizedDate = normalizeDate(date);
-    if (!isDateInRange(normalizedDate, minDateParsed, maxDateParsed)) {
-      return;
-    }
-    if (!isRangeMode) {
-      setSingleValue(normalizedDate);
-      closeCalendar();
-      return;
-    }
-    const [start, end] = selectedRange;
-    if (!start || start && end) {
-      setRangeValue([normalizedDate, null]);
-      return;
-    }
-    setRangeValue([start, normalizedDate < start ? start : normalizedDate]);
-  };
-  const setToday = () => {
-    selectDate(/* @__PURE__ */ new Date());
-  };
-  const commitMobileDate = (date) => {
-    const normalized = normalizeDate(date);
-    if (!isDateInRange(normalized, minDateParsed, maxDateParsed)) return;
-    setViewingYear(normalized.getFullYear());
-    setViewingMonth(normalized.getMonth());
-    if (!isRangeMode) {
-      setSingleValue(normalized);
-      return;
-    }
-    const [start, end] = selectedRange;
-    if (activeRangePart === "start") {
-      const next = [
-        normalized,
-        end && end < normalized ? normalized : end
-      ];
-      setRangeValue(next);
-      setActiveRangePart("end");
-      return;
-    }
-    setRangeValue([start ?? normalized, start && normalized < start ? start : normalized]);
-  };
-  const updateMobileDate = (part, value) => {
-    const nextYear = part === "year" ? value : mobileDate.getFullYear();
-    const nextMonth2 = part === "month" ? value : mobileDate.getMonth();
-    const maxDay = new Date(nextYear, nextMonth2 + 1, 0).getDate();
-    const nextDay = Math.min(part === "day" ? value : mobileDate.getDate(), maxDay);
-    commitMobileDate(new Date(nextYear, nextMonth2, nextDay));
-  };
-  const handleShortcut = (shortcut) => {
-    const val = typeof shortcut.value === "function" ? shortcut.value() : shortcut.value;
-    if (!isRangeMode) {
-      const date = val instanceof Date ? normalizeDate(val) : val ? normalizeDate(parseDate(val)) : null;
-      setSingleValue(date);
-    } else {
-      const range = val;
-      if (range && Array.isArray(range)) {
-        const parsed = [
-          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
-        ];
-        setRangeValue(parsed);
-      }
-    }
-    closeCalendar();
-  };
-  const clearDate = (event) => {
-    event.stopPropagation();
-    if (!isRangeMode) {
-      setSingleValue(null);
-    } else {
-      setRangeValue([null, null]);
-    }
-    props.onClear?.();
-  };
-  const stepViewingMonth = (delta) => {
-    const next = addMonths(new Date(viewingYear, viewingMonth, 1), delta);
-    setViewingYear(next.getFullYear());
-    setViewingMonth(next.getMonth());
-  };
-  const previousMonth = () => stepViewingMonth(-1);
-  const nextMonth = () => stepViewingMonth(1);
-  const isCurrentMonth = (date) => {
-    if (!date) return false;
-    return date.getMonth() === viewingMonth;
-  };
-  useEffect(() => {
-    if (isOpen) {
-      const preferred = pendingFocusIsoRef.current ?? getPreferredFocusIso();
-      pendingFocusIsoRef.current = null;
-      setTimeout(() => {
-        if (preferred && focusDateButtonByIso(preferred)) return;
-        const fallback = getFirstEnabledIsoInView();
-        if (fallback) focusDateButtonByIso(fallback);
-      }, 0);
-      return;
-    }
-    setTimeout(() => restoreFocus(), 0);
-  }, [
-    isOpen,
-    closeCalendar,
-    focusDateButtonByIso,
-    getFirstEnabledIsoInView,
-    getPreferredFocusIso,
-    restoreFocus
-  ]);
-  useEffect(() => {
-    if (!isOpen) return;
-    const pending = pendingFocusIsoRef.current;
-    if (!pending) return;
-    pendingFocusIsoRef.current = null;
-    setTimeout(() => {
-      if (focusDateButtonByIso(pending)) return;
-      const fallback = getFirstEnabledIsoInView();
-      if (fallback) focusDateButtonByIso(fallback);
-    }, 0);
-  }, [isOpen, focusDateButtonByIso, getFirstEnabledIsoInView]);
-  const inputClasses = useMemo(
-    () => getDatePickerInputClasses(size, disabled || readonly, showClearButton),
-    [size, disabled, readonly, showClearButton]
-  );
-  const iconButtonClasses = useMemo(() => getDatePickerIconButtonClasses(size), [size]);
-  return {
-    inputWrapperRef,
-    inputRef,
-    panelRef,
-    calendarRef,
-    mobileCalendarRef,
-    isOpen,
-    activeRangePart,
-    setActiveRangePart,
-    activeDateIso,
-    setActiveDateIso,
-    isRangeMode,
-    placeholder,
-    disabled,
-    readonly,
-    required,
-    name: props.name,
-    id: props.id,
-    shortcuts: props.shortcuts,
-    containerClasses: classNames(datePickerBaseClasses, props.className),
-    divProps,
-    displayValue,
-    showClearButton,
-    inputClasses,
-    iconButtonClasses,
-    labels,
-    localeCode,
-    isRtl,
-    dayNames,
-    calendarDays,
-    selectedDate,
-    selectedRange,
-    viewingMonth,
-    viewingYear,
-    mobileDate,
-    mobileYears,
-    mobileDays,
-    toggleCalendar,
-    closeCalendar,
-    clearDate,
-    selectDate,
-    setToday,
-    handleShortcut,
-    handleCalendarKeyDown,
-    previousMonth,
-    nextMonth,
-    updateMobileDate,
-    isCurrentMonth,
-    isDateDisabled
-  };
-}
-
-// src/components/DatePicker/render-mobile.tsx
-import {
-  datePickerMobileWheelClasses,
-  datePickerMobileWheelGridClasses,
-  datePickerMobileWheelSelectClasses,
-  datePickerFooterButtonClasses
-} from "@expcat/tigercat-core";
-import { jsx, jsxs } from "react/jsx-runtime";
-function renderDatePickerMobile(ctx) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: ctx.mobileCalendarRef,
-      className: datePickerMobileWheelClasses,
-      role: "group",
-      "aria-label": ctx.labels.calendar,
-      children: [
-        ctx.isRangeMode && /* @__PURE__ */ jsxs("div", { className: "mb-3 flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: datePickerFooterButtonClasses,
-              "aria-selected": ctx.activeRangePart === "start",
-              onClick: () => ctx.setActiveRangePart("start"),
-              children: "Start"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: datePickerFooterButtonClasses,
-              "aria-selected": ctx.activeRangePart === "end",
-              onClick: () => ctx.setActiveRangePart("end"),
-              children: "End"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: datePickerMobileWheelGridClasses, children: [
-          /* @__PURE__ */ jsx(
-            "select",
-            {
-              className: datePickerMobileWheelSelectClasses,
-              value: ctx.mobileDate.getFullYear(),
-              "aria-label": ctx.labels.year,
-              onChange: (event) => ctx.updateMobileDate("year", Number(event.target.value)),
-              children: ctx.mobileYears.map((year) => /* @__PURE__ */ jsx("option", { value: year, children: year }, year))
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "select",
-            {
-              className: datePickerMobileWheelSelectClasses,
-              value: ctx.mobileDate.getMonth(),
-              "aria-label": ctx.labels.month,
-              onChange: (event) => ctx.updateMobileDate("month", Number(event.target.value)),
-              children: Array.from({ length: 12 }, (_, month) => /* @__PURE__ */ jsx("option", { value: month, children: month + 1 }, month))
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "select",
-            {
-              className: datePickerMobileWheelSelectClasses,
-              value: ctx.mobileDate.getDate(),
-              "aria-label": ctx.labels.day,
-              onChange: (event) => ctx.updateMobileDate("day", Number(event.target.value)),
-              children: ctx.mobileDays.map((day) => /* @__PURE__ */ jsx("option", { value: day, children: day }, day))
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "mt-4 flex justify-end gap-2", children: /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: datePickerFooterButtonClasses,
-            "aria-label": `Mobile ${ctx.labels.ok}`,
-            onClick: ctx.closeCalendar,
-            children: ctx.labels.ok
-          }
-        ) })
-      ]
-    }
-  );
-}
-
-// src/components/DatePicker/render-calendar.tsx
-import {
-  formatMonthYear,
-  getDatePickerCalendarCellState,
-  datePickerCalendarClasses,
-  datePickerCalendarHeaderClasses,
-  datePickerNavButtonClasses,
-  datePickerMonthYearClasses,
-  datePickerCalendarGridClasses,
-  datePickerDayNameClasses,
-  getDatePickerDayCellClasses,
-  datePickerFooterClasses,
-  datePickerFooterButtonClasses as datePickerFooterButtonClasses2,
-  chevronLeftSolidIcon20PathD,
-  chevronRightSolidIcon20PathD
-} from "@expcat/tigercat-core";
-
-// src/components/DatePicker/icons.tsx
-import { icon20ViewBox } from "@expcat/tigercat-core";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var Icon = ({ path, className }) => /* @__PURE__ */ jsx2(
-  "svg",
-  {
-    className,
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: icon20ViewBox,
-    fill: "currentColor",
-    children: /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", d: path, clipRule: "evenodd" })
-  }
-);
-
-// src/components/DatePicker/render-calendar.tsx
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-function renderDatePickerCalendar(ctx) {
-  return /* @__PURE__ */ jsxs2(
-    "div",
-    {
-      ref: ctx.calendarRef,
-      className: datePickerCalendarClasses,
-      role: "dialog",
-      "aria-modal": "true",
-      "aria-label": ctx.labels.calendar,
-      onKeyDown: ctx.handleCalendarKeyDown,
-      children: [
-        /* @__PURE__ */ jsxs2("div", { className: datePickerCalendarHeaderClasses, children: [
-          /* @__PURE__ */ jsx3(
-            "button",
-            {
-              type: "button",
-              className: datePickerNavButtonClasses,
-              onClick: ctx.previousMonth,
-              "aria-label": ctx.labels.previousMonth,
-              children: /* @__PURE__ */ jsx3(
-                Icon,
-                {
-                  path: ctx.isRtl ? chevronRightSolidIcon20PathD : chevronLeftSolidIcon20PathD,
-                  className: "w-5 h-5"
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx3("div", { className: datePickerMonthYearClasses, children: formatMonthYear(ctx.viewingYear, ctx.viewingMonth, ctx.localeCode) }),
-          /* @__PURE__ */ jsx3(
-            "button",
-            {
-              type: "button",
-              className: datePickerNavButtonClasses,
-              onClick: ctx.nextMonth,
-              "aria-label": ctx.labels.nextMonth,
-              children: /* @__PURE__ */ jsx3(
-                Icon,
-                {
-                  path: ctx.isRtl ? chevronLeftSolidIcon20PathD : chevronRightSolidIcon20PathD,
-                  className: "w-5 h-5"
-                }
-              )
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx3("div", { className: datePickerCalendarGridClasses, role: "row", children: ctx.dayNames.map((day) => /* @__PURE__ */ jsx3("div", { className: datePickerDayNameClasses, role: "columnheader", children: day }, day)) }),
-        (() => {
-          return /* @__PURE__ */ jsx3(
-            "div",
-            {
-              className: datePickerCalendarGridClasses,
-              role: "grid",
-              "aria-rowcount": 6,
-              "aria-colcount": 7,
-              children: ctx.calendarDays.map((date, index) => {
-                if (!date) return null;
-                const cell = getDatePickerCalendarCellState({
-                  date,
-                  selectedDate: ctx.selectedDate,
-                  selectedRange: ctx.selectedRange,
-                  isRangeMode: ctx.isRangeMode,
-                  isCurrentMonth: ctx.isCurrentMonth,
-                  isDateDisabled: ctx.isDateDisabled
-                });
-                return /* @__PURE__ */ jsx3(
-                  "button",
-                  {
-                    type: "button",
-                    className: getDatePickerDayCellClasses(
-                      cell.isCurrentMonthDay,
-                      cell.isSelected,
-                      cell.isTodayDay,
-                      cell.isDisabled,
-                      cell.isInRange,
-                      cell.isRangeStart,
-                      cell.isRangeEnd
-                    ),
-                    disabled: cell.isDisabled,
-                    onClick: () => ctx.selectDate(date),
-                    role: "gridcell",
-                    "data-date": cell.iso,
-                    onFocus: () => ctx.setActiveDateIso(cell.iso),
-                    tabIndex: ctx.activeDateIso === cell.iso && !cell.isDisabled ? 0 : -1,
-                    "aria-label": cell.iso,
-                    "aria-selected": cell.isSelected,
-                    "aria-current": cell.isTodayDay ? "date" : void 0,
-                    children: date.getDate()
-                  },
-                  index
-                );
-              })
-            }
-          );
-        })(),
-        ctx.shortcuts && ctx.shortcuts.length > 0 && /* @__PURE__ */ jsx3("div", { className: "flex flex-wrap gap-1 px-3 py-2 border-t border-[var(--tiger-border,#e5e7eb)]", children: ctx.shortcuts.map((sc, i) => /* @__PURE__ */ jsx3(
-          "button",
-          {
-            type: "button",
-            className: datePickerFooterButtonClasses2,
-            onClick: () => ctx.handleShortcut(sc),
-            children: sc.label
-          },
-          i
-        )) }),
-        ctx.isRangeMode && /* @__PURE__ */ jsxs2("div", { className: datePickerFooterClasses, children: [
-          /* @__PURE__ */ jsx3("button", { type: "button", className: datePickerFooterButtonClasses2, onClick: ctx.setToday, children: ctx.labels.today }),
-          /* @__PURE__ */ jsx3(
-            "button",
-            {
-              type: "button",
-              className: datePickerFooterButtonClasses2,
-              onClick: ctx.closeCalendar,
-              children: ctx.labels.ok
-            }
-          )
-        ] })
-      ]
-    }
-  );
-}
-
-// src/components/DatePicker.tsx
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var DatePicker = (props) => {
-  const ctx = useDatePickerState(props);
-  const overlay = useAnchoredOverlay({
-    enabled: ctx.isOpen,
-    referenceRef: ctx.inputWrapperRef,
-    floatingRef: ctx.panelRef,
-    placement: "bottom-start",
-    offset: 4,
-    layout: "bottom-sheet-sm",
-    dismissOnOutside: true,
-    dismissOnEscape: true,
-    onDismiss: ctx.closeCalendar
-  });
-  return /* @__PURE__ */ jsxs3("div", { className: ctx.containerClasses, ...ctx.divProps, children: [
-    /* @__PURE__ */ jsxs3("div", { ref: ctx.inputWrapperRef, className: datePickerInputWrapperClasses, children: [
-      /* @__PURE__ */ jsx4(
-        "input",
-        {
-          ref: ctx.inputRef,
-          type: "text",
-          className: ctx.inputClasses,
-          value: ctx.displayValue,
-          placeholder: ctx.placeholder,
-          disabled: ctx.disabled,
-          readOnly: true,
-          required: ctx.required,
-          name: ctx.name,
-          id: ctx.id,
-          onClick: ctx.toggleCalendar,
-          "aria-label": ctx.placeholder || "Select date"
-        }
-      ),
-      ctx.showClearButton && /* @__PURE__ */ jsx4(
-        "button",
-        {
-          type: "button",
-          className: datePickerClearButtonClasses,
-          onClick: ctx.clearDate,
-          "aria-label": ctx.labels.clearDate,
-          children: /* @__PURE__ */ jsx4(Icon, { path: closeSolidIcon20PathD, className: "w-4 h-4" })
-        }
-      ),
-      /* @__PURE__ */ jsx4(
-        "button",
-        {
-          type: "button",
-          className: ctx.iconButtonClasses,
-          disabled: ctx.disabled || ctx.readonly,
-          onClick: ctx.toggleCalendar,
-          "aria-label": ctx.labels.toggleCalendar,
-          children: /* @__PURE__ */ jsx4(Icon, { path: calendarSolidIcon20PathD, className: "w-5 h-5" })
-        }
-      )
-    ] }),
-    renderOverlayPortal(
-      ctx.isOpen ? /* @__PURE__ */ jsxs3(
-        "div",
-        {
-          ref: ctx.panelRef,
-          className: overlay.floatingClasses,
-          style: overlay.floatingStyles,
-          "data-positioned": overlay.positioned,
-          children: [
-            renderDatePickerMobile(ctx),
-            renderDatePickerCalendar(ctx)
-          ]
-        }
-      ) : null,
-      overlay.target
-    )
-  ] });
-};
-
-export {
-  DatePicker
-};