@xaui/native 0.9.1-alpha.9 → 0.9.1-alpha.91

package/dist/chunk-UEW3GAP5.cjs

@@ -0,0 +1,866 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+
+
+
+
+
+
+
+
+
+var _chunkISHMSP6Pcjs = require('./chunk-ISHMSP6P.cjs');
+
+
+var _chunkWFEMJCXOcjs = require('./chunk-WFEMJCXO.cjs');
+
+
+var _chunk7EIHHOHPcjs = require('./chunk-7EIHHOHP.cjs');
+
+
+var _chunkOW4N2C3Mcjs = require('./chunk-OW4N2C3M.cjs');
+
+
+var _chunk7DPL3ZDScjs = require('./chunk-7DPL3ZDS.cjs');
+
+
+
+
+var _chunkGSZDN6EZcjs = require('./chunk-GSZDN6EZ.cjs');
+
+
+
+var _chunkSL3V7R2Ycjs = require('./chunk-SL3V7R2Y.cjs');
+
+
+
+var _chunkCDRGTUYFcjs = require('./chunk-CDRGTUYF.cjs');
+
+
+var _chunkIIAQISBGcjs = require('./chunk-IIAQISBG.cjs');
+
+
+var _chunkTK44VBIEcjs = require('./chunk-TK44VBIE.cjs');
+
+// src/components/calendar/calendar-day.tsx
+var _react = require('react');
+var _reactnative = require('react-native');
+
+// src/components/calendar/calendar.context.ts
+var [CalendarProvider, useCalendar] = _chunkCDRGTUYFcjs.createSlotContext.call(void 0, "Calendar");
+
+// src/components/calendar/calendar-day.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var CalendarDay = _react.forwardRef.call(void 0, function CalendarDay2({
+  date,
+  children,
+  isDisabled,
+  accessibilityRole,
+  accessibilityState,
+  accessibilityLabel,
+  style,
+  onPress,
+  onPressIn,
+  onPressOut,
+  ...props
+}, ref) {
+  const {
+    dayStyle,
+    daySelectedStyle,
+    dayLabelStyle,
+    dayLabelSelectedStyle,
+    dayLabelMutedStyle,
+    dotStyle,
+    dotSelectedStyle,
+    month,
+    value,
+    locale,
+    isDayEnabled,
+    select
+  } = useCalendar();
+  const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+  const [isPressed, press] = _chunk7DPL3ZDScjs.usePressState.call(void 0, { onPressIn, onPressOut });
+  const isSelected = value !== void 0 && _chunkISHMSP6Pcjs.isSameDay.call(void 0, date, value);
+  const isOutside = !_chunkISHMSP6Pcjs.isSameMonth.call(void 0, date, month);
+  const isToday = _chunkISHMSP6Pcjs.isSameDay.call(void 0, date, /* @__PURE__ */ new Date());
+  const disabled = _nullishCoalesce(isDisabled, () => ( !isDayEnabled(date)));
+  const handlePress = _react.useCallback.call(void 0, 
+    (event) => {
+      select(date);
+      _optionalChain([onPress, 'optionalCall', _2 => _2(event)]);
+    },
+    [date, onPress, select]
+  );
+  const label = _react.useMemo.call(void 0, () => fullDate(date, locale), [date, locale]);
+  const content = _nullishCoalesce(children, () => ( /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _reactnative.Text,
+      {
+        style: [
+          dayLabelStyle,
+          // Order is the reading order: muted for a day that is not this month's or is
+          // out of bounds, then the chosen colour, which outranks both — a chosen day
+          // outside the month is still the chosen day.
+          (isOutside || disabled) && dayLabelMutedStyle,
+          isSelected && dayLabelSelectedStyle
+        ],
+        children: date.getDate()
+      }
+    ),
+    isToday ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { style: isSelected ? dotSelectedStyle : dotStyle }) : null
+  ] })));
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkOW4N2C3Mcjs.PressableFeedback,
+    {
+      ref,
+      isPressed,
+      isDisabled: disabled,
+      accessibilityRole: _nullishCoalesce(accessibilityRole, () => ( "button")),
+      accessibilityLabel: _nullishCoalesce(accessibilityLabel, () => ( label)),
+      accessibilityState: {
+        disabled,
+        selected: isSelected,
+        ...accessibilityState
+      },
+      ...rest,
+      style: [
+        dayStyle,
+        isSelected && daySelectedStyle,
+        styleProps,
+        // R9 — `style` may be `Pressable`'s function form. This slot owns the press state,
+        // so it resolves the function here rather than forwarding it and losing the rest.
+        typeof style === "function" ? style({ pressed: isPressed }) : style
+      ],
+      onPress: handlePress,
+      onPressIn: press.onPressIn,
+      onPressOut: press.onPressOut,
+      children: content
+    }
+  );
+});
+CalendarDay.displayName = "XAUI.Calendar.Day";
+function fullDate(date, locale) {
+  try {
+    return new Intl.DateTimeFormat(locale, {
+      weekday: "long",
+      day: "numeric",
+      month: "long",
+      year: "numeric"
+    }).format(date);
+  } catch (e) {
+    return `${date.getDate()} ${_chunkISHMSP6Pcjs.monthLabel.call(void 0, date, locale)}`;
+  }
+}
+
+// src/components/calendar/calendar-grid.tsx
+
+
+
+var CalendarGrid = _react.forwardRef.call(void 0, 
+  function CalendarGrid2({ children, style, ...props }, ref) {
+    const { gridStyle, month, firstDayOfWeek } = useCalendar();
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    const days = _react.useMemo.call(void 0, 
+      () => _chunkISHMSP6Pcjs.monthGrid.call(void 0, month, firstDayOfWeek),
+      [month, firstDayOfWeek]
+    );
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { ref, ...rest, style: [gridStyle, styleProps, style], children: days.map((date) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { style: CELL, children: typeof children === "function" ? children(date) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CalendarDay, { date }) }, date.getTime())) });
+  }
+);
+CalendarGrid.displayName = "XAUI.Calendar.Grid";
+var CELL = { width: "14.2857%", alignItems: "center" };
+
+// src/components/calendar/calendar-header.tsx
+
+
+
+var CalendarHeader = _react.forwardRef.call(void 0, 
+  function CalendarHeader2({ children, style, ...props }, ref) {
+    const { headerStyle, glyph } = useCalendar();
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkGSZDN6EZcjs.IconContext.Provider, { value: glyph, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { ref, ...rest, style: [headerStyle, styleProps, style], children }) });
+  }
+);
+CalendarHeader.displayName = "XAUI.Calendar.Header";
+
+// src/components/calendar/calendar-month-picker.tsx
+
+
+var _reactnativereanimated = require('react-native-reanimated'); var _reactnativereanimated2 = _interopRequireDefault(_reactnativereanimated);
+
+var AnimatedView = _reactnativereanimated2.default.createAnimatedComponent(_reactnative.View);
+var OPEN_MS = 200;
+var CalendarMonthPicker = _react.forwardRef.call(void 0, 
+  function CalendarMonthPicker2({ format = "long", style, ...props }, ref) {
+    const {
+      monthPickerStyle,
+      monthStyle,
+      monthSelectedStyle,
+      monthLabelStyle,
+      monthLabelSelectedStyle,
+      month,
+      locale,
+      canGoToMonth,
+      goToMonthInYear,
+      setView
+    } = useCalendar();
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    const names = _react.useMemo.call(void 0, () => _chunkISHMSP6Pcjs.monthNames.call(void 0, locale, format), [locale, format]);
+    const shownMonth = month.getMonth();
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      AnimatedView,
+      {
+        ref,
+        ...rest,
+        style: [monthPickerStyle, styleProps, style],
+        entering: _reactnativereanimated.FadeInDown.duration(OPEN_MS),
+        children: names.map((name, index) => {
+          const disabled = !canGoToMonth(index - shownMonth);
+          const isSelected = index === shownMonth;
+          return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkOW4N2C3Mcjs.PressableFeedback,
+            {
+              isDisabled: disabled,
+              accessibilityRole: "button",
+              accessibilityLabel: name,
+              accessibilityState: { selected: isSelected, disabled },
+              style: [monthStyle, isSelected && monthSelectedStyle],
+              onPress: () => {
+                goToMonthInYear(index);
+                setView("grid");
+              },
+              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _reactnative.Text,
+                {
+                  numberOfLines: 1,
+                  style: [
+                    monthLabelStyle,
+                    isSelected && monthLabelSelectedStyle
+                  ],
+                  children: name
+                }
+              )
+            },
+            name
+          );
+        })
+      }
+    );
+  }
+);
+CalendarMonthPicker.displayName = "XAUI.Calendar.MonthPicker";
+
+// src/components/calendar/calendar-nav-button.tsx
+
+
+
+var sheet = _reactnative.StyleSheet.create({
+  back: { transform: [{ rotate: "90deg" }] },
+  forward: { transform: [{ rotate: "-90deg" }] }
+});
+function navButton(step, name, rotation) {
+  const Component = _react.forwardRef.call(void 0, function NavButton({
+    children,
+    step: overrideStep,
+    accessibilityRole,
+    accessibilityState,
+    style,
+    onPress,
+    onPressIn,
+    onPressOut,
+    ...props
+  }, ref) {
+    const { navStyle, goToMonth, canGoToMonth, isDisabled } = useCalendar();
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    const [isPressed, press] = _chunk7DPL3ZDScjs.usePressState.call(void 0, { onPressIn, onPressOut });
+    const months = _nullishCoalesce(overrideStep, () => ( step));
+    const disabled = isDisabled || !canGoToMonth(months);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkOW4N2C3Mcjs.PressableFeedback,
+      {
+        ref,
+        isPressed,
+        isDisabled: disabled,
+        accessibilityRole: _nullishCoalesce(accessibilityRole, () => ( "button")),
+        accessibilityState: { disabled, ...accessibilityState },
+        ...rest,
+        style: [navStyle, styleProps, style],
+        onPress: (event) => {
+          _optionalChain([onPress, 'optionalCall', _3 => _3(event)]);
+          goToMonth(months);
+        },
+        onPressIn: press.onPressIn,
+        onPressOut: press.onPressOut,
+        children: _nullishCoalesce(children, () => ( /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { style: rotation, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkGSZDN6EZcjs.Icon, { as: _chunkGSZDN6EZcjs.ChevronDownIcon }) })))
+      }
+    );
+  });
+  Component.displayName = name;
+  return Component;
+}
+var CalendarPreviousButton = navButton(
+  -1,
+  "XAUI.Calendar.PreviousButton",
+  sheet.back
+);
+var CalendarNextButton = navButton(
+  1,
+  "XAUI.Calendar.NextButton",
+  sheet.forward
+);
+
+// src/components/calendar/calendar.tsx
+
+
+
+// src/components/calendar/calendar.recipe.ts
+var SLOTS = [
+  "root",
+  "header",
+  "title",
+  "nav",
+  "weekdays",
+  "weekday",
+  "grid",
+  "day",
+  "daySelected",
+  "dayLabel",
+  "dayLabelSelected",
+  "dayLabelMuted",
+  "dot",
+  "dotSelected",
+  "yearPicker",
+  "year",
+  "yearSelected",
+  "yearLabel",
+  "yearLabelSelected",
+  "monthPicker",
+  "month",
+  "monthSelected",
+  "monthLabel",
+  "monthLabelSelected"
+];
+var VARIANT_TOKENS = {
+  primary: { bgSelected: "accent", fgSelected: "accentForeground" },
+  secondary: { bgSelected: "accentSoft", fgSelected: "accentSoftForeground" },
+  tertiary: { bgSelected: "default", fgSelected: "defaultForeground" },
+  ghost: { bgSelected: "foreground", fgSelected: "background" }
+};
+var SIZES = {
+  sm: { cell: 36, label: "sm", title: "md", weekday: "xs" },
+  md: { cell: 40, label: "md", title: "lg", weekday: "sm" },
+  lg: { cell: 44, label: "lg", title: "xl", weekday: "md" }
+};
+var DOT_RATIO = 3.5 / 40;
+function sizeAxis(step) {
+  const { cell, label, title, weekday } = step;
+  return (theme) => {
+    const dot = Math.round(cell * DOT_RATIO);
+    return {
+      // A day is a circle by default, and `radius` overrides it — the one shape decision
+      // this component makes, and the same one the `Radio` makes.
+      day: { width: cell, height: cell, borderRadius: cell / 2 },
+      daySelected: { borderRadius: cell / 2 },
+      dayLabel: { fontSize: theme.fontSizes[label] },
+      title: {
+        fontSize: theme.fontSizes[title],
+        lineHeight: theme.lineHeights[title]
+      },
+      weekday: {
+        height: theme.spacing(6),
+        lineHeight: theme.spacing(6),
+        fontSize: theme.fontSizes[weekday]
+      },
+      nav: { width: cell, height: cell, borderRadius: cell / 2 },
+      dot: { width: dot, height: dot, borderRadius: dot / 2 },
+      // Six rows on screen and everything else out of sight, like the grid it replaces:
+      // a year list as tall as a page of months reads as a different control. The picker
+      // is a scroll, and its own content travels.
+      yearPicker: { height: cell * 6 + theme.spacing(2) * 5 },
+      year: { height: cell, borderRadius: cell / 2 },
+      yearLabel: { fontSize: theme.fontSizes[label] },
+      // The same cell as a year, and no fixed picker height: twelve months are four rows,
+      // which fit where six weeks did without a scroll of their own.
+      month: { height: cell, borderRadius: cell / 2 },
+      monthLabel: { fontSize: theme.fontSizes[label] }
+    };
+  };
+}
+var calendarRecipe = _chunkSL3V7R2Ycjs.createRecipe.call(void 0, {
+  slots: SLOTS,
+  base: (theme) => ({
+    root: { width: "100%", gap: theme.spacing(2) },
+    header: {
+      flexDirection: "row",
+      alignItems: "center",
+      justifyContent: "space-between",
+      gap: theme.spacing(2)
+    },
+    title: {
+      fontFamily: theme.fontFamilies.body,
+      fontWeight: theme.fontWeights.semibold,
+      color: theme.colors.foreground
+    },
+    nav: { alignItems: "center", justifyContent: "center" },
+    // Seven columns, and the cells inside them are centred rather than stretched: a cell
+    // is a circle, and a circle stretched to a seventh of a phone is an ellipse.
+    weekdays: { flexDirection: "row" },
+    weekday: {
+      flex: 1,
+      fontFamily: theme.fontFamilies.body,
+      textAlign: "center",
+      color: theme.colors.muted
+    },
+    grid: { flexDirection: "row", flexWrap: "wrap" },
+    day: {
+      // A seventh of the row, and the box inside it centred. `width` on the cell is what
+      // makes the circle a circle; this is what makes seven of them fill the line.
+      alignItems: "center",
+      justifyContent: "center",
+      alignSelf: "center"
+    },
+    // Under the number rather than over it, and laid out by the day so the number does not
+    // move when it appears: absolute, tucked just below the digit rather than down on the
+    // cell's edge.
+    dot: { position: "absolute", bottom: 5 },
+    dayLabel: {
+      fontFamily: theme.fontFamilies.body,
+      fontWeight: theme.fontWeights.medium,
+      color: theme.colors.foreground,
+      textAlign: "center"
+    },
+    // A day outside the month, or outside the bounds. It is a slot rather than an axis
+    // because forty-two cells share one resolution and only some of them are muted.
+    dayLabelMuted: { color: theme.colors.muted },
+    // Three columns of a third'd and a bit: a year takes the width its calendar's parent
+    // gives, and three of them fill a phone's width wherever four fixed cells would have
+    // to be measured. The row direction, the wrap and the gap between rows are the
+    // scroll's `contentContainerStyle` — a `ScrollView` refuses child layout on its own
+    // style, RN throws by invariant.
+    yearPicker: { width: "100%" },
+    year: { width: "31%", alignItems: "center", justifyContent: "center" },
+    yearLabel: {
+      fontFamily: theme.fontFamilies.body,
+      fontWeight: theme.fontWeights.medium,
+      textAlign: "center",
+      color: theme.colors.foreground
+    },
+    // The month grid is a plain `View`, so its own layout lives here rather than on a
+    // content container: three columns like the years, wrapping to four rows, centred so
+    // a short final row does not hang off the left.
+    monthPicker: {
+      width: "100%",
+      flexDirection: "row",
+      flexWrap: "wrap",
+      justifyContent: "center",
+      gap: theme.spacing(2)
+    },
+    month: { width: "31%", alignItems: "center", justifyContent: "center" },
+    monthLabel: {
+      fontFamily: theme.fontFamilies.body,
+      fontWeight: theme.fontWeights.medium,
+      textAlign: "center",
+      color: theme.colors.foreground
+    }
+  }),
+  variantTokens: VARIANT_TOKENS,
+  paint: (theme, colors) => ({
+    daySelected: { backgroundColor: colors.bgSelected },
+    dayLabelSelected: { color: colors.fgSelected },
+    // The mark on an unchosen today is the soft accent — enough colour to read as "today"
+    // without competing with the chosen day's full disc. On the chosen day it has to read
+    // against that disc instead, which is what `fgSelected` is for.
+    dot: { backgroundColor: theme.colors.accentSoftForeground },
+    dotSelected: { backgroundColor: colors.fgSelected },
+    // The year on screen wears the same pair as the chosen day: one resolution, and the
+    // colour of the disc the header's redrawn years sit on.
+    yearSelected: { backgroundColor: colors.bgSelected },
+    yearLabelSelected: { color: colors.fgSelected },
+    // The month on screen, the same again — the grid the year picker drills into.
+    monthSelected: { backgroundColor: colors.bgSelected },
+    monthLabelSelected: { color: colors.fgSelected }
+  }),
+  variants: {
+    size: {
+      sm: sizeAxis(SIZES.sm),
+      md: sizeAxis(SIZES.md),
+      lg: sizeAxis(SIZES.lg)
+    },
+    /** Both the disc and the cell it sits in, or a squared-off day holds a round disc. */
+    radius: _chunkSL3V7R2Ycjs.radiusAxis.call(void 0, 
+      "day",
+      "daySelected",
+      "year",
+      "yearSelected",
+      "month",
+      "monthSelected"
+    )
+  },
+  states: {
+    disabled: (theme) => ({ root: { opacity: theme.opacity.disabled } })
+  },
+  defaultVariants: { variant: "primary", size: "md" }
+});
+
+// src/components/calendar/calendar.tsx
+
+var DEFAULT_YEAR_SPAN = 50;
+var CalendarRoot = _react.forwardRef.call(void 0, function Calendar({
+  children,
+  variant,
+  size,
+  radius,
+  color,
+  value: controlledValue,
+  defaultValue,
+  onValueChange,
+  month: controlledMonth,
+  defaultMonth,
+  onMonthChange,
+  view: controlledView,
+  defaultView,
+  onViewChange,
+  minValue,
+  maxValue,
+  firstDayOfWeek,
+  locale,
+  isDisabled = false,
+  asChild = false,
+  style,
+  ...props
+}, ref) {
+  const theme = _chunkIIAQISBGcjs.useXAUITheme.call(void 0, );
+  const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+  const [value, setValue] = _chunk7EIHHOHPcjs.useControllableState.call(void 0, {
+    value: controlledValue,
+    defaultValue,
+    onChange: onValueChange
+  });
+  const [fallbackMonth] = _react.useState.call(void 0, () => firstOfMonth(_nullishCoalesce(defaultValue, () => ( /* @__PURE__ */ new Date()))));
+  const [month, setMonth] = _chunk7EIHHOHPcjs.useControllableState.call(void 0, {
+    value: controlledMonth,
+    defaultValue: defaultMonth ? firstOfMonth(defaultMonth) : fallbackMonth,
+    onChange: onMonthChange
+  });
+  const [view, setView] = _chunk7EIHHOHPcjs.useControllableState.call(void 0, {
+    value: controlledView,
+    defaultValue: _nullishCoalesce(defaultView, () => ( "grid")),
+    onChange: onViewChange
+  });
+  const resolvedLocale = _nullishCoalesce(locale, () => ( deviceLocale()));
+  const weekStart = _nullishCoalesce(firstDayOfWeek, () => ( _chunkISHMSP6Pcjs.firstDayOfWeekFor.call(void 0, resolvedLocale)));
+  const selection = { variant, size, radius };
+  const styles = calendarRecipe.resolve({
+    theme,
+    selection,
+    states: { disabled: isDisabled }
+  });
+  const tint = color ? calendarRecipe.tint({ theme, color, selection }) : void 0;
+  const bounds = _react.useMemo.call(void 0, 
+    () => ({ min: minValue, max: maxValue }),
+    [minValue, maxValue]
+  );
+  const isDayEnabled = _react.useCallback.call(void 0, 
+    (date) => !isDisabled && _chunkISHMSP6Pcjs.isWithinBounds.call(void 0, date, bounds),
+    [bounds, isDisabled]
+  );
+  const select = _react.useCallback.call(void 0, 
+    (date) => {
+      if (!_chunkISHMSP6Pcjs.isWithinBounds.call(void 0, date, bounds)) return;
+      setValue(_chunkISHMSP6Pcjs.startOfDay.call(void 0, date));
+    },
+    [bounds, setValue]
+  );
+  const goToMonth = _react.useCallback.call(void 0, 
+    (step) => {
+      if (step === 0) return;
+      setMonth((current) => firstOfMonth(_chunkISHMSP6Pcjs.addMonths.call(void 0, current, step)));
+    },
+    [setMonth]
+  );
+  const canGoToMonth = _react.useCallback.call(void 0, 
+    (step) => {
+      const target = firstOfMonth(_chunkISHMSP6Pcjs.addMonths.call(void 0, month, step));
+      const lastDay = new Date(target.getFullYear(), target.getMonth() + 1, 0);
+      return _chunkISHMSP6Pcjs.isWithinBounds.call(void 0, target, { max: bounds.max }) && _chunkISHMSP6Pcjs.isWithinBounds.call(void 0, lastDay, { min: bounds.min });
+    },
+    [bounds, month]
+  );
+  const currentYear = month.getFullYear();
+  const goToYear = _react.useCallback.call(void 0, 
+    (year) => {
+      goToMonth((year - currentYear) * 12);
+    },
+    [goToMonth, currentYear]
+  );
+  const currentMonthIndex = month.getMonth();
+  const goToMonthInYear = _react.useCallback.call(void 0, 
+    (monthIndex) => {
+      goToMonth(monthIndex - currentMonthIndex);
+    },
+    [goToMonth, currentMonthIndex]
+  );
+  const yearRange = _react.useMemo.call(void 0, () => {
+    const now = (/* @__PURE__ */ new Date()).getFullYear();
+    return {
+      first: _nullishCoalesce(_optionalChain([bounds, 'access', _4 => _4.min, 'optionalAccess', _5 => _5.getFullYear, 'call', _6 => _6()]), () => ( now - DEFAULT_YEAR_SPAN)),
+      last: _nullishCoalesce(_optionalChain([bounds, 'access', _7 => _7.max, 'optionalAccess', _8 => _8.getFullYear, 'call', _9 => _9()]), () => ( now + DEFAULT_YEAR_SPAN))
+    };
+  }, [bounds.min, bounds.max]);
+  const context = _react.useMemo.call(void 0, () => {
+    const title = _reactnative.StyleSheet.flatten([styles.title]);
+    return {
+      headerStyle: styles.header,
+      titleStyle: styles.title,
+      navStyle: styles.nav,
+      weekdaysStyle: styles.weekdays,
+      weekdayStyle: styles.weekday,
+      gridStyle: styles.grid,
+      dayStyle: styles.day,
+      daySelectedStyle: tint ? [styles.daySelected, tint.daySelected] : styles.daySelected,
+      dayLabelStyle: styles.dayLabel,
+      dayLabelSelectedStyle: tint ? [styles.dayLabelSelected, tint.dayLabelSelected] : styles.dayLabelSelected,
+      dayLabelMutedStyle: styles.dayLabelMuted,
+      dotStyle: styles.dot,
+      // `dot` first in both branches, and that is not tidiness: the size axis puts the
+      // mark's width, height and corner on `dot` alone, so a `dotSelected` handed over on
+      // its own is a coloured node with no size — which renders nothing at all.
+      dotSelectedStyle: [styles.dot, tint ? tint.dotSelected : styles.dotSelected],
+      yearPickerStyle: styles.yearPicker,
+      yearStyle: styles.year,
+      yearSelectedStyle: tint ? [styles.yearSelected, tint.yearSelected] : styles.yearSelected,
+      yearLabelStyle: styles.yearLabel,
+      yearLabelSelectedStyle: tint ? [styles.yearLabelSelected, tint.yearLabelSelected] : styles.yearLabelSelected,
+      monthPickerStyle: styles.monthPicker,
+      monthStyle: styles.month,
+      monthSelectedStyle: tint ? [styles.monthSelected, tint.monthSelected] : styles.monthSelected,
+      monthLabelStyle: styles.monthLabel,
+      monthLabelSelectedStyle: tint ? [styles.monthLabelSelected, tint.monthLabelSelected] : styles.monthLabelSelected,
+      glyph: {
+        size: title.fontSize,
+        color: typeof title.color === "string" ? title.color : void 0
+      },
+      month,
+      value,
+      locale: resolvedLocale,
+      firstDayOfWeek: weekStart,
+      isDisabled,
+      view,
+      setView,
+      isDayEnabled,
+      select,
+      goToMonth,
+      canGoToMonth,
+      goToYear,
+      goToMonthInYear,
+      yearRange
+    };
+  }, [
+    styles,
+    tint,
+    month,
+    value,
+    resolvedLocale,
+    weekStart,
+    isDisabled,
+    view,
+    setView,
+    isDayEnabled,
+    select,
+    goToMonth,
+    canGoToMonth,
+    goToYear,
+    goToMonthInYear,
+    yearRange
+  ]);
+  const rootStyle = [styles.root, styleProps, style];
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CalendarProvider, { value: context, children: asChild ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCDRGTUYFcjs.Slot, { ref, ...rest, style: rootStyle, children }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.View, { ref, ...rest, style: rootStyle, children }) });
+});
+CalendarRoot.displayName = "XAUI.Calendar.Root";
+function firstOfMonth(date) {
+  return new Date(date.getFullYear(), date.getMonth(), 1);
+}
+function deviceLocale() {
+  try {
+    return new Intl.DateTimeFormat().resolvedOptions().locale;
+  } catch (e2) {
+    return "en";
+  }
+}
+
+// src/components/calendar/calendar-title.tsx
+
+
+
+var CalendarTitle = _react.forwardRef.call(void 0, 
+  function CalendarTitle2({ children, accessibilityRole, style, ...props }, ref) {
+    const { titleStyle, month, locale } = useCalendar();
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _reactnative.Text,
+      {
+        ref,
+        accessibilityRole: _nullishCoalesce(accessibilityRole, () => ( "header")),
+        style: [titleStyle, styleProps, style],
+        ...rest,
+        children: _nullishCoalesce(children, () => ( _chunkISHMSP6Pcjs.monthLabel.call(void 0, month, locale)))
+      }
+    );
+  }
+);
+CalendarTitle.displayName = "XAUI.Calendar.Title";
+
+// src/components/calendar/calendar-weekdays.tsx
+
+
+
+var CalendarWeekdays = _react.forwardRef.call(void 0, 
+  function CalendarWeekdays2({ children, style, ...props }, ref) {
+    const { weekdaysStyle, weekdayStyle, locale, firstDayOfWeek } = useCalendar();
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _reactnative.View,
+      {
+        ref,
+        accessibilityElementsHidden: true,
+        importantForAccessibility: "no-hide-descendants",
+        ...rest,
+        style: [weekdaysStyle, styleProps, style],
+        children: _nullishCoalesce(children, () => ( _chunkISHMSP6Pcjs.weekdayNames.call(void 0, locale, firstDayOfWeek).map((name) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactnative.Text, { style: weekdayStyle, children: name }, name))))
+      }
+    );
+  }
+);
+CalendarWeekdays.displayName = "XAUI.Calendar.Weekdays";
+
+// src/components/calendar/calendar-year-picker.tsx
+
+
+
+
+var AnimatedScrollView = _reactnativereanimated2.default.createAnimatedComponent(_reactnative.ScrollView);
+var COLUMNS = 3;
+var OPEN_MS2 = 200;
+var CalendarYearPicker = _react.forwardRef.call(void 0, function CalendarYearPicker2({ firstYear, lastYear, style, onLayout, contentContainerStyle, ...props }, ref) {
+  const {
+    yearPickerStyle,
+    yearStyle,
+    yearSelectedStyle,
+    yearLabelStyle,
+    yearLabelSelectedStyle,
+    month,
+    yearRange: defaultRange,
+    goToYear,
+    canGoToMonth,
+    setView
+  } = useCalendar();
+  const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+  const theme = _chunkIIAQISBGcjs.useXAUITheme.call(void 0, );
+  const first = _nullishCoalesce(firstYear, () => ( defaultRange.first));
+  const last = _nullishCoalesce(lastYear, () => ( defaultRange.last));
+  const shownYear = month.getFullYear();
+  const years = _react.useMemo.call(void 0, 
+    () => Array.from({ length: last - first + 1 }, (_, index) => first + index),
+    [first, last]
+  );
+  const initialRow = Math.floor((shownYear - first) / COLUMNS);
+  const gap = theme.spacing(2);
+  const cell = _nullishCoalesce(_optionalChain([_reactnative.StyleSheet, 'access', _10 => _10.flatten, 'call', _11 => _11([yearStyle]), 'optionalAccess', _12 => _12.height]), () => ( 0));
+  const rowHeight = (typeof cell === "number" ? cell : 0) + gap;
+  const scroller = _react.useRef.call(void 0, null);
+  const refs = _chunkWFEMJCXOcjs.useMergedRef.call(void 0, scroller, ref);
+  const [isPlaced, setIsPlaced] = _react.useState.call(void 0, false);
+  const scrollToRow = (animated) => {
+    if (initialRow === 0 || isPlaced) return;
+    _optionalChain([scroller, 'access', _13 => _13.current, 'optionalAccess', _14 => _14.scrollTo, 'call', _15 => _15({ y: initialRow * rowHeight, animated })]);
+  };
+  const place = (event) => {
+    _optionalChain([onLayout, 'optionalCall', _16 => _16(event)]);
+    if (isPlaced) return;
+    scrollToRow(false);
+    setIsPlaced(true);
+  };
+  _react.useEffect.call(void 0, () => {
+    scrollToRow(false);
+  });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    AnimatedScrollView,
+    {
+      ref: refs,
+      ...rest,
+      style: [yearPickerStyle, styleProps, style],
+      contentContainerStyle: [
+        {
+          flexDirection: "row",
+          flexWrap: "wrap",
+          justifyContent: "center",
+          gap
+        },
+        contentContainerStyle
+      ],
+      onLayout: place,
+      entering: _reactnativereanimated.FadeInDown.duration(OPEN_MS2),
+      showsVerticalScrollIndicator: false,
+      children: years.map((year) => {
+        const disabled = !canGoToMonth((year - shownYear) * 12);
+        const isSelected = year === shownYear;
+        return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunkOW4N2C3Mcjs.PressableFeedback,
+          {
+            isDisabled: disabled,
+            accessibilityRole: "button",
+            accessibilityLabel: `${year}`,
+            accessibilityState: { selected: isSelected, disabled },
+            style: [yearStyle, isSelected && yearSelectedStyle],
+            onPress: () => {
+              goToYear(year);
+              setView("month");
+            },
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _reactnative.Text,
+              {
+                style: [
+                  yearLabelStyle,
+                  isSelected && yearLabelSelectedStyle
+                ],
+                children: year
+              }
+            )
+          },
+          year
+        );
+      })
+    }
+  );
+});
+CalendarYearPicker.displayName = "XAUI.Calendar.YearPicker";
+
+// src/components/calendar/index.ts
+var Calendar2 = Object.assign(CalendarRoot, {
+  Header: CalendarHeader,
+  Title: CalendarTitle,
+  PreviousButton: CalendarPreviousButton,
+  NextButton: CalendarNextButton,
+  Weekdays: CalendarWeekdays,
+  Grid: CalendarGrid,
+  Day: CalendarDay,
+  YearPicker: CalendarYearPicker,
+  MonthPicker: CalendarMonthPicker
+});
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.useCalendar = useCalendar; exports.CalendarDay = CalendarDay; exports.CalendarGrid = CalendarGrid; exports.CalendarHeader = CalendarHeader; exports.CalendarMonthPicker = CalendarMonthPicker; exports.CalendarPreviousButton = CalendarPreviousButton; exports.CalendarNextButton = CalendarNextButton; exports.SIZES = SIZES; exports.calendarRecipe = calendarRecipe; exports.CalendarRoot = CalendarRoot; exports.CalendarTitle = CalendarTitle; exports.CalendarWeekdays = CalendarWeekdays; exports.CalendarYearPicker = CalendarYearPicker; exports.Calendar = Calendar2;