@nori-ui/core 0.0.5 → 1.0.2

package/dist/chunk-X7APG7G2.js

@@ -0,0 +1,1566 @@
+import { Select } from './chunk-ZQMNGPLE.js';
+import { useTranslation } from './chunk-RFW5SRZA.js';
+import { useThemeColors } from './chunk-R5JMDDCB.js';
+import { __name } from './chunk-WCQVDF3K.js';
+import { today, getLocalTimeZone, CalendarDate, startOfMonth } from '@internationalized/date';
+import { createContext, useState, useCallback, useContext, useRef, useLayoutEffect, useMemo, useEffect } from 'react';
+import { View, Text, Pressable } from 'react-native';
+import { jsx, Fragment, jsxs } from 'nativewind/jsx-runtime';
+
+var detectLocale = /* @__PURE__ */ __name(() => {
+  try {
+    return new Intl.DateTimeFormat().resolvedOptions().locale;
+  } catch {
+    return "en-US";
+  }
+}, "detectLocale");
+var toTag = /* @__PURE__ */ __name((input) => input === void 0 ? detectLocale() : typeof input === "string" ? input : input.toString(), "toTag");
+var LocaleContext = createContext(null);
+LocaleContext.displayName = "LocaleContext";
+var LocaleProvider = /* @__PURE__ */ __name(({ locale, children }) => {
+  const value = useMemo(() => toTag(locale), [locale]);
+  return /* @__PURE__ */ jsx(LocaleContext.Provider, { value, children });
+}, "LocaleProvider");
+var useLocale = /* @__PURE__ */ __name(() => {
+  const ctx = useContext(LocaleContext);
+  return ctx ?? detectLocale();
+}, "useLocale");
+
+// src/components/Calendar/state/locale-utils.ts
+var getFirstDayOfWeek = /* @__PURE__ */ __name((locale) => {
+  try {
+    const loc = new Intl.Locale(locale);
+    const info = loc.getWeekInfo?.() ?? loc.weekInfo;
+    if (typeof info?.firstDay === "number") {
+      return info.firstDay === 7 ? 0 : info.firstDay;
+    }
+  } catch {
+  }
+  return FIRST_DAY_FALLBACK[locale] ?? FIRST_DAY_FALLBACK[locale.split("-")[0] ?? ""] ?? 1;
+}, "getFirstDayOfWeek");
+var FIRST_DAY_FALLBACK = {
+  en: 0,
+  "en-US": 0,
+  "en-CA": 0,
+  "en-GB": 1,
+  "en-AU": 1,
+  de: 1,
+  fr: 1,
+  ja: 0,
+  ar: 0,
+  he: 0,
+  fa: 6
+};
+var getWeekendDays = /* @__PURE__ */ __name((locale) => {
+  try {
+    const loc = new Intl.Locale(locale);
+    const info = loc.getWeekInfo?.() ?? loc.weekInfo;
+    if (info?.weekend && Array.isArray(info.weekend) && info.weekend.length === 2) {
+      const [a, b] = info.weekend.map((d) => d === 7 ? 0 : d);
+      return [a, b];
+    }
+  } catch {
+  }
+  return WEEKEND_FALLBACK[locale] ?? WEEKEND_FALLBACK[locale.split("-")[0] ?? ""] ?? [6, 0];
+}, "getWeekendDays");
+var WEEKEND_FALLBACK = {
+  "en-US": [6, 0],
+  "de-DE": [6, 0],
+  "fr-FR": [6, 0],
+  "ja-JP": [6, 0],
+  "ar-SA": [5, 6],
+  "ar-AE": [5, 6],
+  "he-IL": [5, 6],
+  "fa-IR": [4, 5],
+  en: [6, 0],
+  de: [6, 0],
+  fr: [6, 0],
+  ar: [5, 6],
+  he: [5, 6]
+};
+var formatWeekdayNames = /* @__PURE__ */ __name((locale, format = "short") => {
+  const fmt = new Intl.DateTimeFormat(locale, { weekday: format });
+  const start = getFirstDayOfWeek(locale);
+  return Array.from({ length: 7 }, (_, i) => {
+    const d = new Date(Date.UTC(2026, 0, 4 + (start + i) % 7));
+    return fmt.format(d);
+  });
+}, "formatWeekdayNames");
+var formatMonthYearTitle = /* @__PURE__ */ __name((date, locale) => {
+  const fmt = new Intl.DateTimeFormat(locale, { month: "long", year: "numeric" });
+  return fmt.format(date.toDate("UTC"));
+}, "formatMonthYearTitle");
+var formatMonthNames = /* @__PURE__ */ __name((locale) => {
+  const fmt = new Intl.DateTimeFormat(locale, { month: "long" });
+  return Array.from({ length: 12 }, (_, m) => fmt.format(new Date(Date.UTC(2026, m, 15))));
+}, "formatMonthNames");
+var useCalendarKeyboard = /* @__PURE__ */ __name((props) => {
+  const { focusedDate, moveFocus, selectDate, firstDayOfWeek = 0 } = props;
+  const onKeyDown = useCallback(
+    (event) => {
+      const focusedDow = focusedDate.toDate("UTC").getUTCDay();
+      switch (event.key) {
+        case "ArrowLeft":
+          event.preventDefault();
+          moveFocus({ days: -1 });
+          return;
+        case "ArrowRight":
+          event.preventDefault();
+          moveFocus({ days: 1 });
+          return;
+        case "ArrowUp":
+          event.preventDefault();
+          moveFocus({ weeks: -1 });
+          return;
+        case "ArrowDown":
+          event.preventDefault();
+          moveFocus({ weeks: 1 });
+          return;
+        case "PageUp":
+          event.preventDefault();
+          moveFocus(event.shiftKey ? { years: -1 } : { months: -1 });
+          return;
+        case "PageDown":
+          event.preventDefault();
+          moveFocus(event.shiftKey ? { years: 1 } : { months: 1 });
+          return;
+        case "Home": {
+          event.preventDefault();
+          const back = (focusedDow - firstDayOfWeek + 7) % 7;
+          moveFocus({ days: -back });
+          return;
+        }
+        case "End": {
+          event.preventDefault();
+          const back = (focusedDow - firstDayOfWeek + 7) % 7;
+          const forward = 6 - back;
+          moveFocus({ days: forward });
+          return;
+        }
+        case "Enter":
+        case " ":
+          event.preventDefault();
+          selectDate(focusedDate, "keyboard");
+          return;
+        default:
+          return;
+      }
+    },
+    [focusedDate, firstDayOfWeek, moveFocus, selectDate]
+  );
+  return { onKeyDown };
+}, "useCalendarKeyboard");
+
+// src/components/Calendar/state/constraints.ts
+var cmp = /* @__PURE__ */ __name((a, b) => a.compare(b), "cmp");
+var isOutOfRange = /* @__PURE__ */ __name((date, bounds = {}) => {
+  if (bounds.minValue && cmp(date, bounds.minValue) < 0) {
+    return true;
+  }
+  if (bounds.maxValue && cmp(date, bounds.maxValue) > 0) {
+    return true;
+  }
+  return false;
+}, "isOutOfRange");
+var composeUnavailable = /* @__PURE__ */ __name((c) => (date) => {
+  if (isOutOfRange(date, c)) {
+    return true;
+  }
+  if (c.isDateUnavailable?.(date)) {
+    return true;
+  }
+  return false;
+}, "composeUnavailable");
+
+// src/components/Calendar/state/use-calendar-state.ts
+var initialFocus = /* @__PURE__ */ __name((mode, value, fallback) => {
+  if (!value) {
+    return fallback;
+  }
+  if (mode === "single") {
+    return value ?? fallback;
+  }
+  if (mode === "range") {
+    const r = value;
+    return r?.start ?? fallback;
+  }
+  const arr = value;
+  return arr[0] ?? fallback;
+}, "initialFocus");
+var useCalendarState = /* @__PURE__ */ __name((props) => {
+  const mode = props.mode ?? "single";
+  const fallback = today(getLocalTimeZone());
+  const [internalValue, setInternalValue] = useState(() => {
+    if (props.value !== void 0) {
+      return props.value;
+    }
+    if (props.defaultValue !== void 0) {
+      return props.defaultValue;
+    }
+    return mode === "multiple" ? [] : null;
+  });
+  const isControlled = props.value !== void 0;
+  const value = isControlled ? props.value : internalValue;
+  const [internalView, setInternalView] = useState(props.defaultView ?? "day");
+  const isViewControlled = props.view !== void 0;
+  const view = isViewControlled ? props.view : internalView;
+  const [focusedDate, setFocusedDate] = useState(() => initialFocus(mode, value, fallback));
+  const isUnavailable = useMemo(
+    () => composeUnavailable({
+      ...props.minValue !== void 0 ? { minValue: props.minValue } : {},
+      ...props.maxValue !== void 0 ? { maxValue: props.maxValue } : {},
+      ...props.isDateUnavailable !== void 0 ? { isDateUnavailable: props.isDateUnavailable } : {}
+    }),
+    [props.minValue, props.maxValue, props.isDateUnavailable]
+  );
+  const setView = useCallback(
+    (next) => {
+      if (!isViewControlled) {
+        setInternalView(next);
+      }
+      props.onViewChange?.(next);
+    },
+    [isViewControlled, props.onViewChange]
+  );
+  const moveFocus = useCallback(
+    (delta) => {
+      setFocusedDate((cur) => {
+        let next = cur;
+        if (delta.days) {
+          next = next.add({ days: delta.days });
+        }
+        if (delta.weeks) {
+          next = next.add({ weeks: delta.weeks });
+        }
+        if (delta.months) {
+          next = next.add({ months: delta.months });
+        }
+        if (delta.years) {
+          next = next.add({ years: delta.years });
+        }
+        if (!isUnavailable(next)) {
+          return next;
+        }
+        const totalDelta = (delta.days ?? 0) + (delta.weeks ?? 0) * 7 + (delta.months ?? 0) * 30 + (delta.years ?? 0) * 365;
+        const sign = totalDelta >= 0 ? 1 : -1;
+        for (let i = 1; i <= 100; i++) {
+          const candidate = next.add({ days: sign * i });
+          if (!isUnavailable(candidate)) {
+            return candidate;
+          }
+        }
+        return cur;
+      });
+    },
+    [isUnavailable]
+  );
+  const selectDate = useCallback(
+    (date, source) => {
+      if (isUnavailable(date)) {
+        return;
+      }
+      const meta = { view, source };
+      let next;
+      if (mode === "single") {
+        next = date;
+      } else if (mode === "multiple") {
+        const arr = value ?? [];
+        const exists = arr.some((d) => d.compare(date) === 0);
+        next = exists ? arr.filter((d) => d.compare(date) !== 0) : [...arr, date];
+      } else {
+        return;
+      }
+      if (!isControlled) {
+        setInternalValue(next);
+      }
+      props.onChange?.(next, meta);
+      setFocusedDate(date);
+    },
+    [isControlled, isUnavailable, mode, props.onChange, value, view]
+  );
+  return {
+    value,
+    view,
+    focusedDate,
+    setView,
+    moveFocus,
+    setFocusedDate,
+    selectDate,
+    isUnavailable
+  };
+}, "useCalendarState");
+var order = /* @__PURE__ */ __name((a, b) => a.compare(b) <= 0 ? [a, b] : [b, a], "order");
+var nightsBetween = /* @__PURE__ */ __name((a, b) => {
+  const [first, last] = order(a, b);
+  return Math.round((last.toDate("UTC").getTime() - first.toDate("UTC").getTime()) / 864e5);
+}, "nightsBetween");
+var useRangeState = /* @__PURE__ */ __name((props) => {
+  const [internal, setInternal] = useState(props.defaultValue ?? null);
+  const isControlled = props.value !== void 0;
+  const value = isControlled ? props.value ?? null : internal;
+  const [hoveredDate, setHoveredDate] = useState(null);
+  const isUnavailable = useMemo(
+    () => composeUnavailable({
+      ...props.minValue !== void 0 ? { minValue: props.minValue } : {},
+      ...props.maxValue !== void 0 ? { maxValue: props.maxValue } : {},
+      ...props.isDateUnavailable !== void 0 ? { isDateUnavailable: props.isDateUnavailable } : {}
+    }),
+    [props.minValue, props.maxValue, props.isDateUnavailable]
+  );
+  const commit = useCallback(
+    (next, source) => {
+      if (!isControlled) {
+        setInternal(next);
+      }
+      props.onChange?.(next, { view: "day", source });
+    },
+    [isControlled, props.onChange]
+  );
+  const selectDate = useCallback(
+    (date, source = "click") => {
+      if (isUnavailable(date)) {
+        return;
+      }
+      if (!value || value.end !== null) {
+        commit({ start: date, end: null }, source);
+        setHoveredDate(null);
+        return;
+      }
+      const nights = nightsBetween(value.start, date);
+      if (props.minNights !== void 0 && nights < props.minNights) {
+        return;
+      }
+      if (props.maxNights !== void 0 && nights > props.maxNights) {
+        return;
+      }
+      const [start, end] = order(value.start, date);
+      commit({ start, end }, source);
+      setHoveredDate(null);
+    },
+    [commit, isUnavailable, props.maxNights, props.minNights, value]
+  );
+  const previewRange = useMemo(() => {
+    if (!value || value.end !== null || !hoveredDate) {
+      return null;
+    }
+    const [start, end] = order(value.start, hoveredDate);
+    return { start, end };
+  }, [hoveredDate, value]);
+  return {
+    value,
+    previewRange,
+    hoveredDate,
+    selectDate,
+    setHoveredDate,
+    isUnavailable
+  };
+}, "useRangeState");
+var CaptionContext = createContext(null);
+CaptionContext.displayName = "CalendarCaptionContext";
+var CaptionProvider = /* @__PURE__ */ __name(({ value, children }) => /* @__PURE__ */ jsx(CaptionContext.Provider, { value, children }), "CaptionProvider");
+var useCalendarCaption = /* @__PURE__ */ __name(() => {
+  const ctx = useContext(CaptionContext);
+  if (!ctx) {
+    throw new Error('useCalendarCaption must be called inside a <Calendar caption="custom"> subtree.');
+  }
+  return ctx;
+}, "useCalendarCaption");
+var ARROW_BUTTON_GAP = 8;
+var NavButton = /* @__PURE__ */ __name(({ label, onPress, children }) => {
+  const colors = useThemeColors();
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: label,
+      onPress,
+      style: ({ pressed, hovered, focused }) => {
+        const base = {
+          width: 32,
+          height: 32,
+          alignItems: "center",
+          justifyContent: "center",
+          borderRadius: 8
+        };
+        const transition = {
+          transitionProperty: "background-color, border-color, transform",
+          transitionDuration: "140ms",
+          transitionTimingFunction: "cubic-bezier(0.2, 0, 0, 1)",
+          outlineStyle: "none"
+        };
+        const bg = pressed ? colors.color.primary["200"] : hovered ? colors.color.primary["100"] : "transparent";
+        const border = focused ? { borderWidth: 2, borderColor: colors.semantic.interactive.primary } : { borderWidth: 0 };
+        return [base, transition, { backgroundColor: bg, transform: [{ scale: pressed ? 0.94 : 1 }] }, border];
+      },
+      children: /* @__PURE__ */ jsx(Text, { style: { color: colors.semantic.text.default, fontSize: 16, lineHeight: 16, fontWeight: "500" }, children })
+    }
+  );
+}, "NavButton");
+var TitleButton = /* @__PURE__ */ __name(({
+  text,
+  ariaLabel,
+  onPress,
+  drilldown
+}) => {
+  const colors = useThemeColors();
+  if (!onPress) {
+    return /* @__PURE__ */ jsx(View, { style: { paddingHorizontal: 12, paddingVertical: 6, alignItems: "center" }, children: /* @__PURE__ */ jsx(
+      Text,
+      {
+        style: {
+          color: colors.semantic.text.default,
+          fontSize: 15,
+          fontWeight: "600",
+          letterSpacing: -0.1
+        },
+        children: text
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsxs(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityLabel: ariaLabel,
+      onPress,
+      style: ({ pressed, hovered, focused }) => {
+        const base = {
+          flexDirection: "row",
+          alignItems: "center",
+          gap: 6,
+          paddingHorizontal: 12,
+          paddingVertical: 6,
+          borderRadius: 8
+        };
+        const transition = {
+          transitionProperty: "background-color, transform",
+          transitionDuration: "140ms",
+          transitionTimingFunction: "cubic-bezier(0.2, 0, 0, 1)",
+          outlineStyle: "none"
+        };
+        const bg = pressed ? colors.color.primary["200"] : hovered ? colors.color.primary["100"] : "transparent";
+        const border = focused ? { borderWidth: 2, borderColor: colors.semantic.interactive.primary } : { borderWidth: 0 };
+        return [base, transition, { backgroundColor: bg, transform: [{ scale: pressed ? 0.97 : 1 }] }, border];
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: colors.semantic.text.default,
+              fontSize: 15,
+              fontWeight: "600",
+              letterSpacing: -0.1
+            },
+            children: text
+          }
+        ),
+        drilldown ? /* @__PURE__ */ jsx(Text, { "aria-hidden": true, style: { color: colors.semantic.text.muted, fontSize: 10, opacity: 0.7 }, children: "\u25BE" }) : null
+      ]
+    }
+  );
+}, "TitleButton");
+var Caption = /* @__PURE__ */ __name(({
+  months,
+  locale,
+  view,
+  caption,
+  gridWidth,
+  monthGap,
+  yearRange,
+  isMonthDisabled,
+  isYearDisabled,
+  onPrev,
+  onNext,
+  onTitlePress,
+  onSetMonth,
+  onSetYear,
+  children
+}) => {
+  const { t } = useTranslation();
+  const titleText = /* @__PURE__ */ __name((m) => {
+    if (view === "day") {
+      return formatMonthYearTitle(m, locale);
+    }
+    if (view === "month") {
+      return String(m.year);
+    }
+    const start = m.year - m.year % 10;
+    return `${start} \u2013 ${start + 11}`;
+  }, "titleText");
+  const titleAriaKey = view === "day" ? "calendar.header.openMonthView" : view === "month" ? "calendar.header.openYearView" : "calendar.header.openDayView";
+  const showMultiTitles = view === "day" && months.length > 1;
+  const titleRowWidth = showMultiTitles ? months.length * gridWidth + (months.length - 1) * monthGap : gridWidth;
+  const monthNames = useMemo(() => formatMonthNames(locale), [locale]);
+  const focused = months[0] ?? void 0;
+  if (!focused) {
+    return null;
+  }
+  const ctxValue = {
+    month: focused.month,
+    year: focused.year,
+    visibleMonth: focused,
+    monthOptions: monthNames.map((label, i) => ({
+      value: i + 1,
+      label,
+      disabled: isMonthDisabled?.(focused.year, i + 1) ?? false
+    })),
+    yearOptions: Array.from({ length: yearRange[1] - yearRange[0] + 1 }, (_, i) => ({
+      value: yearRange[0] + i,
+      label: String(yearRange[0] + i),
+      disabled: isYearDisabled?.(yearRange[0] + i) ?? false
+    })),
+    setMonth: /* @__PURE__ */ __name((m) => onSetMonth(0, m), "setMonth"),
+    setYear: /* @__PURE__ */ __name((y) => onSetYear(0, y), "setYear"),
+    goPrev: onPrev,
+    goNext: onNext
+  };
+  if (caption === "custom") {
+    return /* @__PURE__ */ jsx(
+      View,
+      {
+        style: {
+          flexDirection: "row",
+          alignItems: "center",
+          paddingBottom: 10,
+          gap: ARROW_BUTTON_GAP,
+          alignSelf: "center"
+        },
+        children: /* @__PURE__ */ jsx(CaptionProvider, { value: ctxValue, children })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: {
+        flexDirection: "row",
+        alignItems: "center",
+        paddingBottom: 10,
+        gap: ARROW_BUTTON_GAP,
+        alignSelf: "center"
+      },
+      children: [
+        /* @__PURE__ */ jsx(NavButton, { label: t("calendar.header.previous", { defaultValue: "Previous" }), onPress: onPrev, children: "\u2039" }),
+        /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", gap: monthGap, width: titleRowWidth }, children: showMultiTitles ? months.map((m, i) => /* @__PURE__ */ jsx(View, { style: { width: gridWidth, alignItems: "center" }, children: caption === "dropdown" && view === "day" ? /* @__PURE__ */ jsx(
+          DropdownPair,
+          {
+            month: m.month,
+            year: m.year,
+            monthOptions: monthNames.map((label, j) => ({
+              value: j + 1,
+              label,
+              disabled: isMonthDisabled?.(m.year, j + 1) ?? false
+            })),
+            yearOptions: makeYearOptions(yearRange, isYearDisabled),
+            onMonthChange: (next) => onSetMonth(i, next),
+            onYearChange: (next) => onSetYear(i, next)
+          }
+        ) : /* @__PURE__ */ jsx(
+          TitleButton,
+          {
+            text: titleText(m),
+            ariaLabel: t(titleAriaKey, { defaultValue: "Change view" }),
+            onPress: () => onTitlePress(m),
+            drilldown: true
+          }
+        ) }, `${m.year}-${m.month}`)) : /* @__PURE__ */ jsx(View, { style: { width: gridWidth, alignItems: "center" }, children: caption === "dropdown" && view === "day" ? /* @__PURE__ */ jsx(
+          DropdownPair,
+          {
+            month: focused.month,
+            year: focused.year,
+            monthOptions: monthNames.map((label, j) => ({
+              value: j + 1,
+              label,
+              disabled: isMonthDisabled?.(focused.year, j + 1) ?? false
+            })),
+            yearOptions: makeYearOptions(yearRange, isYearDisabled),
+            onMonthChange: (next) => onSetMonth(0, next),
+            onYearChange: (next) => onSetYear(0, next)
+          }
+        ) : /* @__PURE__ */ jsx(
+          TitleButton,
+          {
+            text: titleText(focused),
+            ariaLabel: t(titleAriaKey, { defaultValue: "Change view" }),
+            onPress: () => onTitlePress(focused),
+            drilldown: true
+          }
+        ) }) }),
+        /* @__PURE__ */ jsx(NavButton, { label: t("calendar.header.next", { defaultValue: "Next" }), onPress: onNext, children: "\u203A" })
+      ]
+    }
+  );
+}, "Caption");
+var makeYearOptions = /* @__PURE__ */ __name((yearRange, isYearDisabled) => Array.from({ length: yearRange[1] - yearRange[0] + 1 }, (_, i) => ({
+  value: yearRange[0] + i,
+  label: String(yearRange[0] + i),
+  disabled: isYearDisabled?.(yearRange[0] + i) ?? false
+})), "makeYearOptions");
+var DropdownPair = /* @__PURE__ */ __name(({ month, year, monthOptions, yearOptions, onMonthChange, onYearChange }) => {
+  return /* @__PURE__ */ jsxs(View, { style: { flexDirection: "row", gap: 6 }, children: [
+    /* @__PURE__ */ jsx(
+      Select,
+      {
+        value: String(month),
+        onChange: (v) => onMonthChange(Number(v)),
+        options: monthOptions.map((o) => ({
+          value: String(o.value),
+          label: o.label,
+          disabled: o.disabled
+        })),
+        "aria-label": "Month",
+        searchable: false
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Select,
+      {
+        value: String(year),
+        onChange: (v) => onYearChange(Number(v)),
+        options: yearOptions.map((o) => ({
+          value: String(o.value),
+          label: o.label,
+          disabled: o.disabled
+        })),
+        "aria-label": "Year",
+        searchable: false
+      }
+    )
+  ] });
+}, "DropdownPair");
+var CELL_SIZE = 40;
+var DayCell = /* @__PURE__ */ __name(({ ctx, onPress, onHoverIn, onHoverOut, renderDay }) => {
+  const colors = useThemeColors();
+  const isSelectedLike = ctx.isSelected || ctx.isRangeStart || ctx.isRangeEnd;
+  const isInsideRange = ctx.isInRange || ctx.isInPreviewRange;
+  const isRangeMiddle = isInsideRange && !isSelectedLike;
+  const dataState = ctx.isSelected ? "selected" : ctx.isRangeStart ? "range-start" : ctx.isRangeEnd ? "range-end" : ctx.isInPreviewRange ? "preview" : ctx.isInRange ? "in-range" : void 0;
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      accessibilityRole: "button",
+      accessibilityState: { disabled: ctx.isUnavailable },
+      disabled: ctx.isUnavailable,
+      onPress,
+      ...onHoverIn ? { onHoverIn } : {},
+      ...onHoverOut ? { onHoverOut } : {},
+      style: ({ pressed, hovered, focused }) => {
+        const base = {
+          width: CELL_SIZE,
+          height: CELL_SIZE,
+          alignItems: "center",
+          justifyContent: "center",
+          borderRadius: 999,
+          // perfect circle for endpoints/selected
+          position: "relative"
+        };
+        if (ctx.isUnavailable) {
+          return [base, { opacity: 0.28 }];
+        }
+        let backgroundColor;
+        let transform;
+        let borderWidth;
+        let borderColor;
+        if (isSelectedLike) {
+          backgroundColor = colors.semantic.interactive.primary;
+          if (pressed) {
+            backgroundColor = colors.semantic.interactive.primaryPressed;
+          } else if (hovered) {
+            backgroundColor = colors.semantic.interactive.primaryHover;
+          }
+          transform = [{ scale: pressed ? 0.94 : 1 }];
+        } else if (isRangeMiddle) {
+          backgroundColor = hovered ? colors.color.primary["200"] : "transparent";
+          transform = [{ scale: pressed ? 0.94 : 1 }];
+        } else {
+          if (pressed) {
+            backgroundColor = colors.color.primary["200"];
+          } else if (hovered) {
+            backgroundColor = colors.color.primary["100"];
+          } else {
+            backgroundColor = "transparent";
+          }
+          transform = [{ scale: pressed ? 0.94 : 1 }];
+        }
+        if ((ctx.isFocused || focused) && !isSelectedLike) {
+          borderWidth = 2;
+          borderColor = colors.semantic.interactive.primary;
+        }
+        const transition = {
+          transitionProperty: "background-color, transform, border-color, opacity",
+          transitionDuration: "140ms",
+          transitionTimingFunction: "cubic-bezier(0.2, 0, 0, 1)",
+          outlineStyle: "none"
+        };
+        return [
+          base,
+          transition,
+          {
+            backgroundColor,
+            ...transform ? { transform } : {},
+            ...borderWidth ? { borderWidth, borderColor } : {}
+          }
+        ];
+      },
+      ...{
+        dataSet: {
+          dayKey: `${ctx.date.year}-${ctx.date.month}-${ctx.date.day}`,
+          ...dataState ? { state: dataState } : {}
+        }
+      },
+      children: renderDay ? renderDay(ctx) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: isSelectedLike ? colors.semantic.text.inverted : ctx.isOutsideMonth ? colors.semantic.text.muted : colors.semantic.text.default,
+              fontSize: 14,
+              fontWeight: ctx.isToday ? "600" : "400",
+              opacity: ctx.isOutsideMonth ? 0.55 : 1,
+              transitionProperty: "color",
+              transitionDuration: "140ms"
+            },
+            children: ctx.date.day
+          }
+        ),
+        ctx.isToday ? /* @__PURE__ */ jsx(
+          View,
+          {
+            style: {
+              position: "absolute",
+              bottom: 5,
+              width: 4,
+              height: 4,
+              borderRadius: 999,
+              backgroundColor: isSelectedLike ? colors.semantic.text.inverted : colors.semantic.interactive.primary
+            }
+          }
+        ) : null
+      ] })
+    }
+  );
+}, "DayCell");
+var isInRange = /* @__PURE__ */ __name((date, range) => {
+  if (!range?.end) {
+    return false;
+  }
+  return date.compare(range.start) >= 0 && date.compare(range.end) <= 0;
+}, "isInRange");
+var buildContext = /* @__PURE__ */ __name((date, args) => {
+  const isOutsideMonth = date.month !== args.visibleMonth.month;
+  const isToday = date.compare(args.todayDate) === 0;
+  const dow = date.toDate("UTC").getUTCDay();
+  const isWeekend = args.weekendDays.includes(dow);
+  let isSelected = false;
+  let isRangeStart = false;
+  let isRangeEnd = false;
+  let inRange = false;
+  if (args.mode === "single") {
+    const v = args.value;
+    isSelected = !!v && v.compare(date) === 0;
+  } else if (args.mode === "range") {
+    const r = args.value;
+    if (r) {
+      isRangeStart = r.start.compare(date) === 0;
+      isRangeEnd = r.end !== null && r.end.compare(date) === 0;
+      inRange = isInRange(date, r);
+    }
+  } else {
+    const arr = args.value;
+    isSelected = arr.some((x) => x.compare(date) === 0);
+  }
+  return {
+    date,
+    isOutsideMonth,
+    isToday,
+    isSelected,
+    isRangeStart,
+    isRangeEnd,
+    isInRange: inRange,
+    isInPreviewRange: isInRange(date, args.previewRange ?? null),
+    isUnavailable: args.isUnavailable(date),
+    isFocused: args.focusedDate.compare(date) === 0,
+    isWeekend
+  };
+}, "buildContext");
+var ROW_KEYS = ["row-0", "row-1", "row-2", "row-3", "row-4", "row-5"];
+var DayGrid = /* @__PURE__ */ __name((props) => {
+  const {
+    visibleMonth,
+    locale,
+    mode,
+    value,
+    previewRange,
+    focusedDate,
+    isUnavailable,
+    weekendDays,
+    firstDayOfWeek,
+    onDayPress,
+    onDayHover,
+    renderDay
+  } = props;
+  const colors = useThemeColors();
+  const fdow = firstDayOfWeek ?? getFirstDayOfWeek(locale);
+  const cells = useMemo(() => {
+    const start = startOfMonth(visibleMonth);
+    const startDow = start.toDate("UTC").getUTCDay();
+    const back = (startDow - fdow + 7) % 7;
+    const first = start.subtract({ days: back });
+    const total = 42;
+    return Array.from({ length: total }, (_, i) => first.add({ days: i }));
+  }, [visibleMonth, fdow]);
+  const weekdayNames = useMemo(() => formatWeekdayNames(locale), [locale]);
+  const todayDate = useMemo(() => today(getLocalTimeZone()), []);
+  const gridWidth = 7 * CELL_SIZE;
+  return /* @__PURE__ */ jsxs(View, { role: "grid", style: { width: gridWidth }, children: [
+    /* @__PURE__ */ jsx(View, { role: "row", style: { flexDirection: "row", marginBottom: 4 }, children: weekdayNames.map((name) => /* @__PURE__ */ jsx(
+      View,
+      {
+        role: "columnheader",
+        style: { width: CELL_SIZE, alignItems: "center", paddingVertical: 6 },
+        children: /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              fontSize: 11,
+              fontWeight: "500",
+              letterSpacing: 0.6,
+              color: colors.semantic.text.muted,
+              textTransform: "uppercase"
+            },
+            children: name
+          }
+        )
+      },
+      name
+    )) }),
+    ROW_KEYS.map((rowKey, row) => /* @__PURE__ */ jsx(View, { role: "row", style: { flexDirection: "row" }, children: cells.slice(row * 7, row * 7 + 7).map((date) => {
+      const ctx = buildContext(date, {
+        visibleMonth,
+        mode,
+        value,
+        ...previewRange !== void 0 ? { previewRange } : {},
+        focusedDate,
+        isUnavailable,
+        weekendDays,
+        todayDate
+      });
+      const isSelectedLike = ctx.isSelected || ctx.isRangeStart || ctx.isRangeEnd;
+      const isInsideRange = ctx.isInRange || ctx.isInPreviewRange;
+      const wrapperStyle = {
+        width: CELL_SIZE,
+        height: CELL_SIZE,
+        position: "relative"
+      };
+      const rangeFillTint = colors.color.primary["100"];
+      let rangeFillStyle = null;
+      if (ctx.isRangeStart && !ctx.isRangeEnd) {
+        rangeFillStyle = {
+          position: "absolute",
+          top: 0,
+          bottom: 0,
+          left: "50%",
+          right: 0,
+          backgroundColor: rangeFillTint
+        };
+      } else if (ctx.isRangeEnd && !ctx.isRangeStart) {
+        rangeFillStyle = {
+          position: "absolute",
+          top: 0,
+          bottom: 0,
+          left: 0,
+          right: "50%",
+          backgroundColor: rangeFillTint
+        };
+      } else if (isInsideRange && !isSelectedLike) {
+        rangeFillStyle = {
+          position: "absolute",
+          top: 0,
+          bottom: 0,
+          left: 0,
+          right: 0,
+          backgroundColor: rangeFillTint
+        };
+      }
+      const gridcellProps = {
+        role: "gridcell",
+        ...isSelectedLike ? { "aria-selected": true } : {}
+      };
+      return /* @__PURE__ */ jsxs(
+        View,
+        {
+          ...gridcellProps,
+          style: wrapperStyle,
+          children: [
+            rangeFillStyle ? /* @__PURE__ */ jsx(View, { style: rangeFillStyle }) : null,
+            /* @__PURE__ */ jsx(
+              DayCell,
+              {
+                ctx,
+                onPress: () => onDayPress(date),
+                ...onDayHover ? {
+                  onHoverIn: /* @__PURE__ */ __name(() => onDayHover(date), "onHoverIn"),
+                  onHoverOut: /* @__PURE__ */ __name(() => onDayHover(null), "onHoverOut")
+                } : {},
+                ...renderDay ? { renderDay } : {}
+              }
+            )
+          ]
+        },
+        `${date.year}-${date.month}-${date.day}`
+      );
+    }) }, rowKey))
+  ] });
+}, "DayGrid");
+var Footer = /* @__PURE__ */ __name(({ children }) => /* @__PURE__ */ jsx(View, { style: { paddingTop: 12 }, children }), "Footer");
+var ROW_KEYS2 = ["r0", "r1", "r2", "r3"];
+var MonthGrid = /* @__PURE__ */ __name(({ visibleMonth, locale, availableWidth, onSelect }) => {
+  const colors = useThemeColors();
+  const names = formatMonthNames(locale);
+  const cellHeight = 56;
+  return /* @__PURE__ */ jsx(View, { style: { width: availableWidth, paddingVertical: 8 }, children: ROW_KEYS2.map((rowKey, row) => /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", marginBottom: 4 }, children: [0, 1, 2].map((col) => {
+    const idx = row * 3 + col;
+    const monthNumber = idx + 1;
+    const isCurrent = monthNumber === visibleMonth.month;
+    const name = names[idx] ?? "";
+    return /* @__PURE__ */ jsx(View, { style: { flex: 1, paddingHorizontal: 4 }, children: /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        accessibilityRole: "button",
+        accessibilityLabel: name,
+        onPress: () => onSelect(monthNumber),
+        style: ({
+          pressed,
+          hovered,
+          focused
+        }) => {
+          const base = {
+            height: cellHeight,
+            alignItems: "center",
+            justifyContent: "center",
+            borderRadius: 10
+          };
+          const transition = {
+            transitionProperty: "background-color, transform, border-color",
+            transitionDuration: "140ms",
+            transitionTimingFunction: "cubic-bezier(0.2, 0, 0, 1)",
+            outlineStyle: "none"
+          };
+          let bg;
+          if (isCurrent) {
+            bg = pressed ? colors.semantic.interactive.primaryPressed : hovered ? colors.semantic.interactive.primaryHover : colors.semantic.interactive.primary;
+          } else if (pressed) {
+            bg = colors.color.primary["200"];
+          } else if (hovered) {
+            bg = colors.color.primary["100"];
+          } else {
+            bg = "transparent";
+          }
+          const border = focused && !isCurrent ? { borderWidth: 2, borderColor: colors.semantic.interactive.primary } : { borderWidth: 0 };
+          return [
+            base,
+            transition,
+            { backgroundColor: bg, transform: [{ scale: pressed ? 0.96 : 1 }] },
+            border
+          ];
+        },
+        children: /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: isCurrent ? colors.semantic.text.inverted : colors.semantic.text.default,
+              fontSize: 14,
+              fontWeight: isCurrent ? "600" : "500"
+            },
+            children: name
+          }
+        )
+      }
+    ) }, monthNumber);
+  }) }, rowKey)) });
+}, "MonthGrid");
+var ROW_KEYS3 = ["r0", "r1", "r2"];
+var YearGrid = /* @__PURE__ */ __name(({ visibleMonth, availableWidth, onSelect }) => {
+  const colors = useThemeColors();
+  const decadeStart = visibleMonth.year - visibleMonth.year % 10;
+  const years = Array.from({ length: 12 }, (_, i) => decadeStart + i - 1);
+  const cellHeight = 60;
+  return /* @__PURE__ */ jsx(View, { style: { width: availableWidth, paddingVertical: 8 }, children: ROW_KEYS3.map((rowKey, row) => /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", marginBottom: 4 }, children: [0, 1, 2, 3].map((col) => {
+    const year = years[row * 4 + col];
+    if (year === void 0) {
+      return null;
+    }
+    const isCurrent = year === visibleMonth.year;
+    const isAdjacentDecade = year < decadeStart || year >= decadeStart + 10;
+    return /* @__PURE__ */ jsx(View, { style: { flex: 1, paddingHorizontal: 4 }, children: /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        accessibilityRole: "button",
+        accessibilityLabel: String(year),
+        onPress: () => onSelect(year),
+        style: ({
+          pressed,
+          hovered,
+          focused
+        }) => {
+          const base = {
+            height: cellHeight,
+            alignItems: "center",
+            justifyContent: "center",
+            borderRadius: 10
+          };
+          const transition = {
+            transitionProperty: "background-color, transform, border-color",
+            transitionDuration: "140ms",
+            transitionTimingFunction: "cubic-bezier(0.2, 0, 0, 1)",
+            outlineStyle: "none"
+          };
+          let bg;
+          if (isCurrent) {
+            bg = pressed ? colors.semantic.interactive.primaryPressed : hovered ? colors.semantic.interactive.primaryHover : colors.semantic.interactive.primary;
+          } else if (pressed) {
+            bg = colors.color.primary["200"];
+          } else if (hovered) {
+            bg = colors.color.primary["100"];
+          } else {
+            bg = "transparent";
+          }
+          const border = focused && !isCurrent ? { borderWidth: 2, borderColor: colors.semantic.interactive.primary } : { borderWidth: 0 };
+          return [
+            base,
+            transition,
+            { backgroundColor: bg, transform: [{ scale: pressed ? 0.96 : 1 }] },
+            border
+          ];
+        },
+        children: /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              color: isCurrent ? colors.semantic.text.inverted : colors.semantic.text.default,
+              fontSize: 14,
+              fontWeight: isCurrent ? "600" : "500",
+              opacity: isAdjacentDecade ? 0.45 : 1
+            },
+            children: year
+          }
+        )
+      }
+    ) }, year);
+  }) }, rowKey)) });
+}, "YearGrid");
+var GRID_WIDTH = 7 * CELL_SIZE;
+var MONTH_GAP = 16;
+var ARROW_AREA = 32 + 8;
+var SURFACE_PADDING = 16;
+var SURFACE_BORDER = 1;
+var requiredOuterWidth = /* @__PURE__ */ __name((n) => 2 * (ARROW_AREA + SURFACE_PADDING + SURFACE_BORDER) + n * GRID_WIDTH + (n - 1) * MONTH_GAP, "requiredOuterWidth");
+var focusDayCell = /* @__PURE__ */ __name((root, date, force) => {
+  if (!root) {
+    return;
+  }
+  if (!force && !root.contains(document.activeElement)) {
+    return;
+  }
+  const sel = `[data-day-key="${date.year}-${date.month}-${date.day}"]`;
+  const cell = root.querySelector(sel);
+  const isDisabled = cell?.disabled === true;
+  if (cell && !isDisabled) {
+    if (cell !== document.activeElement) {
+      cell.focus();
+    }
+    return;
+  }
+  if (force && !root.contains(document.activeElement)) {
+    root.focus();
+  }
+}, "focusDayCell");
+var FadeIn = /* @__PURE__ */ __name(({ children }) => {
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => {
+    const id = requestAnimationFrame(() => setMounted(true));
+    return () => cancelAnimationFrame(id);
+  }, []);
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      style: {
+        opacity: mounted ? 1 : 0,
+        transform: [{ translateY: mounted ? 0 : 4 }],
+        transitionProperty: "opacity, transform",
+        transitionDuration: "220ms",
+        transitionTimingFunction: "cubic-bezier(0.2, 0, 0, 1)"
+      },
+      children
+    }
+  );
+}, "FadeIn");
+var resolveYearRange = /* @__PURE__ */ __name((input, minValue, maxValue, focusedYear) => {
+  if (input) {
+    return input;
+  }
+  if (minValue && maxValue) {
+    return [minValue.year, maxValue.year];
+  }
+  if (minValue) {
+    return [minValue.year, Math.max(minValue.year, focusedYear + 10)];
+  }
+  if (maxValue) {
+    return [Math.min(maxValue.year, focusedYear - 100), maxValue.year];
+  }
+  return [focusedYear - 100, focusedYear + 10];
+}, "resolveYearRange");
+var pickVisibleMonths = /* @__PURE__ */ __name((input, measuredWidth) => {
+  const target = typeof input === "number" ? input : 2;
+  if (measuredWidth == null || measuredWidth === 0) {
+    return typeof input === "number" ? input : 1;
+  }
+  for (let n = target; n >= 1; n--) {
+    if (measuredWidth >= requiredOuterWidth(n)) {
+      return n;
+    }
+  }
+  return 1;
+}, "pickVisibleMonths");
+var CalendarRoot = /* @__PURE__ */ __name((props) => {
+  const [containerWidth, setContainerWidth] = useState(null);
+  const onLayout = useCallback((e) => {
+    const next = e.nativeEvent.layout.width;
+    setContainerWidth((prev) => prev === next ? prev : next);
+  }, []);
+  return /* @__PURE__ */ jsx(View, { onLayout, style: { width: "100%" }, children: /* @__PURE__ */ jsx(CalendarSurface, { containerWidth: containerWidth ?? 0, ...props }) });
+}, "CalendarRoot");
+var CalendarSurface = /* @__PURE__ */ __name((props) => {
+  const providerLocale = useLocale();
+  const locale = props.locale ?? providerLocale;
+  if ((props.mode ?? "single") === "range") {
+    return /* @__PURE__ */ jsx(
+      RangeCalendar,
+      {
+        ...props,
+        locale
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    SingleOrMultiCalendar,
+    {
+      ...props,
+      locale
+    }
+  );
+}, "CalendarSurface");
+var surfaceMetrics = /* @__PURE__ */ __name((visibleMonths) => {
+  const innerWidth = 2 * ARROW_AREA + visibleMonths * GRID_WIDTH + (visibleMonths - 1) * MONTH_GAP;
+  return {
+    innerWidth,
+    // Body grids row width (excludes arrow area)
+    gridsRowWidth: visibleMonths * GRID_WIDTH + (visibleMonths - 1) * MONTH_GAP
+  };
+}, "surfaceMetrics");
+var SingleOrMultiCalendar = /* @__PURE__ */ __name((props) => {
+  const { locale, renderDay, containerWidth } = props;
+  const colors = useThemeColors();
+  const firstDayOfWeek = props.firstDayOfWeek ?? getFirstDayOfWeek(locale);
+  const weekendDays = props.weekendDays ?? getWeekendDays(locale);
+  const visibleMonths = pickVisibleMonths(props.visibleMonths, containerWidth);
+  const { innerWidth, gridsRowWidth } = surfaceMetrics(visibleMonths);
+  const containerRef = useRef(null);
+  const state = useCalendarState({
+    ...props.mode !== void 0 ? { mode: props.mode } : {},
+    locale,
+    ...props.value !== void 0 ? { value: props.value } : {},
+    ...props.defaultValue !== void 0 ? { defaultValue: props.defaultValue } : {},
+    ...props.onChange !== void 0 ? { onChange: props.onChange } : {},
+    ...props.view !== void 0 ? { view: props.view } : {},
+    ...props.defaultView !== void 0 ? { defaultView: props.defaultView } : {},
+    ...props.onViewChange !== void 0 ? { onViewChange: props.onViewChange } : {},
+    ...props.minValue !== void 0 ? { minValue: props.minValue } : {},
+    ...props.maxValue !== void 0 ? { maxValue: props.maxValue } : {},
+    ...props.isDateUnavailable !== void 0 ? { isDateUnavailable: props.isDateUnavailable } : {}
+  });
+  const [anchor, setAnchor] = useState(state.focusedDate);
+  const anchorRef = useRef(anchor);
+  useEffect(() => {
+    anchorRef.current = anchor;
+  }, [anchor]);
+  useEffect(() => {
+    const start = anchorRef.current;
+    const end = start.add({ months: visibleMonths });
+    if (state.focusedDate.compare(start) < 0 || state.focusedDate.compare(end) >= 0) {
+      setAnchor(state.focusedDate);
+    }
+  }, [state.focusedDate, visibleMonths]);
+  const keyboardNavRef = useRef(false);
+  useLayoutEffect(() => {
+    focusDayCell(containerRef.current, state.focusedDate, keyboardNavRef.current);
+    keyboardNavRef.current = false;
+  }, [state.focusedDate, state.value]);
+  const months = useMemo(
+    () => Array.from({ length: visibleMonths }, (_, i) => anchor.add({ months: i })),
+    [anchor, visibleMonths]
+  );
+  const keyboard = useCalendarKeyboard({
+    focusedDate: state.focusedDate,
+    moveFocus: /* @__PURE__ */ __name((delta) => {
+      state.moveFocus(delta);
+      if (delta.months || delta.years) {
+        setAnchor((a) => {
+          let next = a;
+          if (delta.months) {
+            next = next.add({ months: delta.months });
+          }
+          if (delta.years) {
+            next = next.add({ years: delta.years });
+          }
+          return next;
+        });
+      }
+    }, "moveFocus"),
+    selectDate: state.selectDate,
+    setView: state.setView,
+    view: state.view,
+    firstDayOfWeek
+  });
+  const onPrev = /* @__PURE__ */ __name(() => {
+    if (state.view === "year") {
+      setAnchor((a) => a.add({ years: -10 }));
+    } else if (state.view === "month") {
+      setAnchor((a) => a.add({ years: -1 }));
+    } else {
+      setAnchor((a) => a.add({ months: -1 }));
+    }
+  }, "onPrev");
+  const onNext = /* @__PURE__ */ __name(() => {
+    if (state.view === "year") {
+      setAnchor((a) => a.add({ years: 10 }));
+    } else if (state.view === "month") {
+      setAnchor((a) => a.add({ years: 1 }));
+    } else {
+      setAnchor((a) => a.add({ months: 1 }));
+    }
+  }, "onNext");
+  const onTitlePress = /* @__PURE__ */ __name(() => state.setView(state.view === "day" ? "month" : state.view === "month" ? "year" : "day"), "onTitlePress");
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      ref: (node) => {
+        containerRef.current = node;
+        if (typeof props.ref === "function") {
+          props.ref(node);
+        } else if (props.ref) {
+          props.ref.current = node;
+        }
+      },
+      ...props.testID !== void 0 ? { testID: props.testID } : {},
+      onKeyDown: (e) => {
+        keyboardNavRef.current = true;
+        keyboard.onKeyDown(e);
+      },
+      tabIndex: 0,
+      style: {
+        padding: SURFACE_PADDING,
+        backgroundColor: colors.semantic.background.elevated,
+        borderRadius: 16,
+        borderWidth: SURFACE_BORDER,
+        borderColor: colors.semantic.border.default,
+        shadowColor: "#000",
+        shadowOpacity: 0.04,
+        shadowRadius: 12,
+        shadowOffset: { width: 0, height: 4 },
+        width: innerWidth + 2 * SURFACE_PADDING + 2 * SURFACE_BORDER,
+        maxWidth: "100%",
+        alignSelf: "center"
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          Caption,
+          {
+            months,
+            locale,
+            view: state.view,
+            caption: props.caption ?? "title",
+            gridWidth: GRID_WIDTH,
+            monthGap: MONTH_GAP,
+            yearRange: resolveYearRange(props.yearRange, props.minValue, props.maxValue, anchor.year),
+            onPrev,
+            onNext,
+            onTitlePress,
+            onSetMonth: (slot, m) => {
+              const picked = (months[slot] ?? anchor).set({ month: m, day: 1 });
+              setAnchor(picked.subtract({ months: slot }));
+            },
+            onSetYear: (slot, y) => {
+              const picked = (months[slot] ?? anchor).set({ year: y, day: 1 });
+              setAnchor(picked.subtract({ months: slot }));
+            },
+            children: props.children
+          }
+        ),
+        /* @__PURE__ */ jsxs(FadeIn, { children: [
+          state.view === "day" && /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", gap: MONTH_GAP, alignSelf: "center", width: gridsRowWidth }, children: months.map((m) => /* @__PURE__ */ jsx(
+            DayGrid,
+            {
+              visibleMonth: m,
+              locale,
+              mode: props.mode ?? "single",
+              value: state.value,
+              focusedDate: state.focusedDate,
+              isUnavailable: state.isUnavailable,
+              weekendDays,
+              firstDayOfWeek,
+              onDayPress: (date) => state.selectDate(date, "click"),
+              ...renderDay ? { renderDay } : {}
+            },
+            `${m.year}-${m.month}`
+          )) }),
+          state.view === "month" && /* @__PURE__ */ jsx(View, { style: { alignItems: "center" }, children: /* @__PURE__ */ jsx(
+            MonthGrid,
+            {
+              visibleMonth: anchor,
+              locale,
+              availableWidth: gridsRowWidth,
+              onSelect: (month) => {
+                setAnchor(new CalendarDate(anchor.year, month, 1));
+                state.setView("day");
+              }
+            }
+          ) }),
+          state.view === "year" && /* @__PURE__ */ jsx(View, { style: { alignItems: "center" }, children: /* @__PURE__ */ jsx(
+            YearGrid,
+            {
+              visibleMonth: anchor,
+              availableWidth: gridsRowWidth,
+              onSelect: (year) => {
+                setAnchor(new CalendarDate(year, anchor.month, 1));
+                state.setView("month");
+              }
+            }
+          ) }),
+          props.children && (props.caption ?? "title") !== "custom" ? /* @__PURE__ */ jsx(Footer, { children: props.children }) : null
+        ] }, `smc-${state.view}`)
+      ]
+    }
+  );
+}, "SingleOrMultiCalendar");
+var RangeCalendar = /* @__PURE__ */ __name((props) => {
+  const { locale, renderDay, containerWidth } = props;
+  const colors = useThemeColors();
+  const firstDayOfWeek = props.firstDayOfWeek ?? getFirstDayOfWeek(locale);
+  const weekendDays = props.weekendDays ?? getWeekendDays(locale);
+  const visibleMonths = pickVisibleMonths(props.visibleMonths, containerWidth);
+  const { innerWidth, gridsRowWidth } = surfaceMetrics(visibleMonths);
+  const containerRef = useRef(null);
+  const range = useRangeState({
+    ...props.value !== void 0 ? { value: props.value } : {},
+    ...props.defaultValue !== void 0 ? { defaultValue: props.defaultValue } : {},
+    ...props.onChange !== void 0 ? { onChange: props.onChange } : {},
+    ...props.minValue !== void 0 ? { minValue: props.minValue } : {},
+    ...props.maxValue !== void 0 ? { maxValue: props.maxValue } : {},
+    ...props.isDateUnavailable !== void 0 ? { isDateUnavailable: props.isDateUnavailable } : {},
+    ...props.minNights !== void 0 ? { minNights: props.minNights } : {},
+    ...props.maxNights !== void 0 ? { maxNights: props.maxNights } : {}
+  });
+  const initialFocus2 = range.value?.start ?? today(getLocalTimeZone());
+  const [focusedDate, setFocusedDate] = useState(initialFocus2);
+  const keyboardNavRef = useRef(false);
+  useLayoutEffect(() => {
+    focusDayCell(containerRef.current, focusedDate, keyboardNavRef.current);
+    keyboardNavRef.current = false;
+  }, [focusedDate, range.value]);
+  const [anchor, setAnchor] = useState(initialFocus2);
+  const [internalView, setInternalView] = useState(props.defaultView ?? "day");
+  const isViewControlled = props.view !== void 0;
+  const view = isViewControlled ? props.view : internalView;
+  const setView = useCallback(
+    (next) => {
+      if (!isViewControlled) {
+        setInternalView(next);
+      }
+      props.onViewChange?.(next);
+    },
+    [isViewControlled, props.onViewChange]
+  );
+  const months = useMemo(
+    () => Array.from({ length: visibleMonths }, (_, i) => anchor.add({ months: i })),
+    [anchor, visibleMonths]
+  );
+  const keyboard = useCalendarKeyboard({
+    focusedDate,
+    moveFocus: /* @__PURE__ */ __name((delta) => {
+      setFocusedDate((f) => {
+        let next = f;
+        if (delta.days) {
+          next = next.add({ days: delta.days });
+        }
+        if (delta.weeks) {
+          next = next.add({ weeks: delta.weeks });
+        }
+        if (delta.months) {
+          next = next.add({ months: delta.months });
+        }
+        if (delta.years) {
+          next = next.add({ years: delta.years });
+        }
+        return next;
+      });
+      if (delta.months || delta.years) {
+        setAnchor((a) => {
+          let next = a;
+          if (delta.months) {
+            next = next.add({ months: delta.months });
+          }
+          if (delta.years) {
+            next = next.add({ years: delta.years });
+          }
+          return next;
+        });
+      }
+    }, "moveFocus"),
+    selectDate: /* @__PURE__ */ __name((date) => range.selectDate(date, "keyboard"), "selectDate"),
+    setView,
+    view,
+    firstDayOfWeek
+  });
+  const onPrev = /* @__PURE__ */ __name(() => {
+    if (view === "year") {
+      setAnchor((a) => a.add({ years: -10 }));
+    } else if (view === "month") {
+      setAnchor((a) => a.add({ years: -1 }));
+    } else {
+      setAnchor((a) => a.add({ months: -1 }));
+    }
+  }, "onPrev");
+  const onNext = /* @__PURE__ */ __name(() => {
+    if (view === "year") {
+      setAnchor((a) => a.add({ years: 10 }));
+    } else if (view === "month") {
+      setAnchor((a) => a.add({ years: 1 }));
+    } else {
+      setAnchor((a) => a.add({ months: 1 }));
+    }
+  }, "onNext");
+  const [drilldownSlot, setDrilldownSlot] = useState(0);
+  const onTitlePress = /* @__PURE__ */ __name((clicked) => {
+    const slot = months.findIndex((m) => m.year === clicked.year && m.month === clicked.month);
+    setDrilldownSlot(slot >= 0 ? slot : 0);
+    if (clicked.compare(anchor) !== 0) {
+      setAnchor(clicked);
+    }
+    setView(view === "day" ? "month" : view === "month" ? "year" : "day");
+  }, "onTitlePress");
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      ref: (node) => {
+        containerRef.current = node;
+        if (typeof props.ref === "function") {
+          props.ref(node);
+        } else if (props.ref) {
+          props.ref.current = node;
+        }
+      },
+      ...props.testID !== void 0 ? { testID: props.testID } : {},
+      onKeyDown: (e) => {
+        keyboardNavRef.current = true;
+        keyboard.onKeyDown(e);
+      },
+      tabIndex: 0,
+      style: {
+        padding: SURFACE_PADDING,
+        backgroundColor: colors.semantic.background.elevated,
+        borderRadius: 16,
+        borderWidth: SURFACE_BORDER,
+        borderColor: colors.semantic.border.default,
+        shadowColor: "#000",
+        shadowOpacity: 0.04,
+        shadowRadius: 12,
+        shadowOffset: { width: 0, height: 4 },
+        width: innerWidth + 2 * SURFACE_PADDING + 2 * SURFACE_BORDER,
+        maxWidth: "100%",
+        alignSelf: "center"
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          Caption,
+          {
+            months,
+            locale,
+            view,
+            caption: props.caption ?? "title",
+            gridWidth: GRID_WIDTH,
+            monthGap: MONTH_GAP,
+            yearRange: resolveYearRange(props.yearRange, props.minValue, props.maxValue, anchor.year),
+            onPrev,
+            onNext,
+            onTitlePress,
+            onSetMonth: (slot, m) => {
+              const picked = (months[slot] ?? anchor).set({ month: m, day: 1 });
+              setAnchor(picked.subtract({ months: slot }));
+            },
+            onSetYear: (slot, y) => {
+              const picked = (months[slot] ?? anchor).set({ year: y, day: 1 });
+              setAnchor(picked.subtract({ months: slot }));
+            },
+            children: props.children
+          }
+        ),
+        /* @__PURE__ */ jsxs(FadeIn, { children: [
+          view === "day" && /* @__PURE__ */ jsx(View, { style: { flexDirection: "row", gap: MONTH_GAP, alignSelf: "center", width: gridsRowWidth }, children: months.map((m) => /* @__PURE__ */ jsx(
+            DayGrid,
+            {
+              visibleMonth: m,
+              locale,
+              mode: "range",
+              value: range.value,
+              previewRange: range.previewRange,
+              focusedDate,
+              isUnavailable: range.isUnavailable,
+              weekendDays,
+              firstDayOfWeek,
+              onDayPress: (date) => range.selectDate(date),
+              onDayHover: (date) => range.setHoveredDate(date),
+              ...renderDay ? { renderDay } : {}
+            },
+            `${m.year}-${m.month}`
+          )) }),
+          view === "month" && /* @__PURE__ */ jsx(View, { style: { alignItems: "center" }, children: /* @__PURE__ */ jsx(
+            MonthGrid,
+            {
+              visibleMonth: anchor,
+              locale,
+              availableWidth: gridsRowWidth,
+              onSelect: (month) => {
+                const picked = new CalendarDate(anchor.year, month, 1);
+                setAnchor(picked.subtract({ months: drilldownSlot }));
+                setView("day");
+              }
+            }
+          ) }),
+          view === "year" && /* @__PURE__ */ jsx(View, { style: { alignItems: "center" }, children: /* @__PURE__ */ jsx(
+            YearGrid,
+            {
+              visibleMonth: anchor,
+              availableWidth: gridsRowWidth,
+              onSelect: (year) => {
+                const picked = new CalendarDate(year, anchor.month, 1);
+                setAnchor(picked.subtract({ months: drilldownSlot }));
+                setView("month");
+              }
+            }
+          ) }),
+          props.children && (props.caption ?? "title") !== "custom" ? /* @__PURE__ */ jsx(Footer, { children: props.children }) : null
+        ] }, `range-${view}`)
+      ]
+    }
+  );
+}, "RangeCalendar");
+var CalendarCaption = /* @__PURE__ */ __name(({ children }) => /* @__PURE__ */ jsx(Fragment, { children }), "CalendarCaption");
+CalendarCaption.displayName = "CalendarCaption";
+var Calendar = CalendarRoot;
+Calendar.Caption = CalendarCaption;
+
+export { Calendar, LocaleProvider, detectLocale, useCalendarCaption, useLocale };
+//# sourceMappingURL=chunk-X7APG7G2.js.map
+//# sourceMappingURL=chunk-X7APG7G2.js.map