react-native-system-ui 1.0.1 → 1.0.3

package/dist/cjs/components/calendar/Calendar.js

@@ -1,452 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-function _react() {
-  const data = _interopRequireWildcard(require("react"));
-  _react = function () {
-    return data;
-  };
-  return data;
-}
-function _reactNative() {
-  const data = require("react-native");
-  _reactNative = function () {
-    return data;
-  };
-  return data;
-}
-var _hooks = require("../../hooks");
-var _utils = require("../../utils");
-var _validate = require("../../utils/validate");
-var _popup = _interopRequireDefault(require("../popup"));
-var _useLocale = require("../config-provider/useLocale");
-var _tokens = require("./tokens");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-const DAY_MS = 24 * 60 * 60 * 1000;
-const isSameDay = (a, b) => a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-const startOfDay = date => {
-  const newDate = new Date(date);
-  newDate.setHours(0, 0, 0, 0);
-  return newDate;
-};
-const daysBetween = (a, b) => Math.round(Math.abs(startOfDay(a).getTime() - startOfDay(b).getTime()) / DAY_MS);
-const toArrayValue = value => !value ? [] : Array.isArray(value) ? value.filter(Boolean).map(d => new Date(d)) : [new Date(value)];
-const DEFAULT_MIN = new Date(new Date().getFullYear() - 10, 0, 1);
-const DEFAULT_MAX = new Date(new Date().getFullYear() + 10, 11, 31);
-const CalendarImpl = props => {
-  const {
-    tokensOverride,
-    value: _value,
-    defaultValue: _defaultValue,
-    minDate = DEFAULT_MIN,
-    maxDate = DEFAULT_MAX,
-    type,
-    title,
-    showSubtitle,
-    showHeader,
-    showConfirm,
-    confirmText,
-    weekStartsOn,
-    weekdays,
-    formatMonthTitle,
-    allowSameDay,
-    maxRange,
-    onOverRange,
-    poppable,
-    visible: _visible,
-    defaultVisible: _defaultVisible,
-    onVisibleChange: _onVisibleChange,
-    closeOnClickOverlay,
-    closeOnConfirm,
-    popupPlacement,
-    popupRound,
-    popupProps,
-    onOpen,
-    onOpened,
-    onClose,
-    onClosed,
-    color,
-    onConfirm,
-    onSelect: _onSelect,
-    style,
-    ...rest
-  } = props;
-  const locale = (0, _useLocale.useLocale)();
-  const calLoc = locale?.vanCalendar;
-  const tokens = (0, _tokens.useCalendarTokens)(tokensOverride);
-  const resolvedTitle = title ?? calLoc?.title ?? tokens.defaults.title;
-  const resolvedShowSubtitle = showSubtitle ?? tokens.defaults.showSubtitle;
-  const resolvedShowHeader = showHeader ?? tokens.defaults.showHeader;
-  const resolvedConfirmText = confirmText ?? calLoc?.confirm ?? tokens.defaults.confirmText;
-  const resolvedWeekStartsOn = weekStartsOn ?? tokens.defaults.weekStartsOn;
-  const resolvedAllowSameDay = allowSameDay ?? tokens.defaults.allowSameDay;
-  const resolvedPoppable = poppable ?? tokens.defaults.poppable;
-  const resolvedCloseOnClickOverlay = closeOnClickOverlay ?? tokens.defaults.closeOnClickOverlay;
-  const resolvedCloseOnConfirm = closeOnConfirm ?? tokens.defaults.closeOnConfirm;
-  const resolvedPopupPlacement = popupPlacement ?? tokens.defaults.popupPlacement;
-  const resolvedPopupRound = popupRound ?? tokens.defaults.popupRound;
-  const resolvedType = type ?? tokens.defaults.type;
-  const resolvedShowConfirm = showConfirm ?? tokens.defaults.showConfirm[resolvedType];
-  const [popupVisible, setPopupVisible] = (0, _hooks.useControllableValue)(props, {
-    defaultValue: false,
-    valuePropName: 'visible',
-    defaultValuePropName: 'defaultVisible',
-    trigger: 'onVisibleChange'
-  });
-  const {
-    onClose: popupOnClose,
-    onClosed: popupOnClosed,
-    onOpen: popupOnOpen,
-    onOpened: popupOnOpened,
-    closeOnOverlayPress: overlayCloseOnPress,
-    overlay: popupOverlay,
-    ...popupRestProps
-  } = popupProps ?? {};
-  const cbRef = (0, _react().useRef)({
-    onConfirm,
-    onOverRange,
-    popupOnOpen,
-    onOpen,
-    popupOnOpened,
-    onOpened,
-    popupOnClose,
-    onClose,
-    popupOnClosed,
-    onClosed
-  });
-  cbRef.current.onConfirm = onConfirm;
-  cbRef.current.onOverRange = onOverRange;
-  cbRef.current.popupOnOpen = popupOnOpen;
-  cbRef.current.onOpen = onOpen;
-  cbRef.current.popupOnOpened = popupOnOpened;
-  cbRef.current.onOpened = onOpened;
-  cbRef.current.popupOnClose = popupOnClose;
-  cbRef.current.onClose = onClose;
-  cbRef.current.popupOnClosed = popupOnClosed;
-  cbRef.current.onClosed = onClosed;
-  const closePopup = (0, _react().useCallback)(() => {
-    if (!resolvedPoppable) return;
-    setPopupVisible(false);
-  }, [resolvedPoppable, setPopupVisible]);
-  const handlePopupOpen = (0, _react().useCallback)(() => {
-    cbRef.current.popupOnOpen?.();
-    cbRef.current.onOpen?.();
-  }, []);
-  const handlePopupOpened = (0, _react().useCallback)(() => {
-    cbRef.current.popupOnOpened?.();
-    cbRef.current.onOpened?.();
-  }, []);
-  const handlePopupClose = (0, _react().useCallback)(() => {
-    closePopup();
-    cbRef.current.popupOnClose?.();
-    cbRef.current.onClose?.();
-  }, [closePopup]);
-  const handlePopupClosed = (0, _react().useCallback)(() => {
-    cbRef.current.popupOnClosed?.();
-    cbRef.current.onClosed?.();
-  }, []);
-  const overlayCloseOnPressResolved = overlayCloseOnPress ?? resolvedCloseOnClickOverlay;
-  const overlayResolved = popupOverlay ?? true;
-  const [selectedValue, setSelectedValue] = (0, _hooks.useControllableValue)(props, {
-    defaultValue: null,
-    valuePropName: 'value',
-    defaultValuePropName: 'defaultValue',
-    trigger: 'onSelect'
-  });
-  const value = normalizeValue(toArrayValue(selectedValue), resolvedType);
-  const [currentMonth, setCurrentMonth] = (0, _react().useState)(() => clampMonth(value.length ? value[0] : new Date(), minDate, maxDate));
-  const firstValueTime = value.length ? value[0].getTime() : null;
-  const minDateTime = minDate.getTime();
-  const maxDateTime = maxDate.getTime();
-  (0, _react().useEffect)(() => {
-    if (!value.length) return;
-    const first = clampMonth(value[0], minDate, maxDate);
-    setCurrentMonth(prev => isSameMonth(first, prev) ? prev : first);
-  }, [firstValueTime, minDateTime, maxDateTime]);
-  const monthDays = (0, _react().useMemo)(() => buildMonth(currentMonth, resolvedWeekStartsOn), [currentMonth, resolvedWeekStartsOn]);
-  const monthDaysMapped = (0, _react().useMemo)(() => monthDays.map(day => day ? {
-    day,
-    key: day.toISOString(),
-    timeValue: startOfDay(day).getTime(),
-    dateValue: day.getDate()
-  } : null), [monthDays]);
-  const minDayTime = startOfDay(minDate).getTime();
-  const maxDayTime = startOfDay(maxDate).getTime();
-  const resolvedWeekdays = weekdays ?? calLoc?.weekdays ?? tokens.defaults.weekdays;
-  const weekLabels = (0, _react().useMemo)(() => reorderWeekdays(resolvedWeekdays, resolvedWeekStartsOn, tokens.defaults.weekdays), [resolvedWeekdays, tokens.defaults.weekdays, resolvedWeekStartsOn]);
-  const monthLabel = (0, _react().useMemo)(() => formatMonthTitle ? formatMonthTitle(currentMonth) : calLoc?.monthTitle ? calLoc.monthTitle(currentMonth.getFullYear(), currentMonth.getMonth() + 1) : formatMonth(currentMonth), [currentMonth, formatMonthTitle, calLoc]);
-  const minMonthStart = startOfMonth(minDate);
-  const maxMonthStart = startOfMonth(maxDate);
-  const canGoPrev = currentMonth.getTime() > minMonthStart.getTime();
-  const canGoNext = currentMonth.getTime() < maxMonthStart.getTime();
-  const goToMonth = (0, _react().useCallback)(delta => setCurrentMonth(prev => clampMonth(new Date(prev.getFullYear(), prev.getMonth() + delta, 1), minDate, maxDate)), [minDate, maxDate]);
-  const goPrev = (0, _react().useCallback)(() => goToMonth(-1), [goToMonth]);
-  const goNext = (0, _react().useCallback)(() => goToMonth(1), [goToMonth]);
-  const confirmDisabled = resolvedType === 'range' ? value.length < 2 : value.length === 0;
-  const columnPadding = tokens.spacing.column / 2;
-  const maybeAutoConfirm = (0, _react().useCallback)(next => {
-    if (resolvedShowConfirm) return;
-    if (resolvedType === 'range' && next.length < 2) return;
-    if (resolvedType === 'multiple' && next.length === 0) return;
-    if (!next.length) return;
-    cbRef.current.onConfirm?.(mapValue(next, resolvedType));
-    if (resolvedPoppable && resolvedCloseOnConfirm) closePopup();
-  }, [resolvedShowConfirm, resolvedType, resolvedPoppable, resolvedCloseOnConfirm, closePopup]);
-  const handleConfirm = (0, _react().useCallback)(() => {
-    if (resolvedShowConfirm && confirmDisabled) return;
-    cbRef.current.onConfirm?.(mapValue(value, resolvedType));
-    if (resolvedPoppable && resolvedCloseOnConfirm) closePopup();
-  }, [resolvedShowConfirm, confirmDisabled, value, resolvedType, resolvedPoppable, resolvedCloseOnConfirm, closePopup]);
-  const isSelectionAllowed = (0, _react().useCallback)(next => {
-    if (resolvedType === 'range' && next.length === 2) {
-      const [start, end] = next;
-      if (!resolvedAllowSameDay && isSameDay(start, end)) return false;
-      if (maxRange && daysBetween(start, end) + 1 > maxRange) {
-        cbRef.current.onOverRange?.(maxRange);
-        return false;
-      }
-    }
-    if (resolvedType === 'multiple' && maxRange && next.length > maxRange) {
-      cbRef.current.onOverRange?.(maxRange);
-      return false;
-    }
-    ;
-    return true;
-  }, [resolvedType, resolvedAllowSameDay, maxRange]);
-  const handleSelectDayRef = (0, _react().useRef)(undefined);
-  const handleSelectDay = (0, _react().useCallback)(date => {
-    const dateTime = startOfDay(date).getTime();
-    if (dateTime < minDayTime || dateTime > maxDayTime) return;
-    let next = [];
-    const nextValue = value;
-    switch (resolvedType) {
-      case 'single':
-        next = [date];
-        break;
-      case 'multiple':
-        {
-          const existing = nextValue.find(item => isSameDay(item, date));
-          next = existing ? nextValue.filter(item => !isSameDay(item, date)) : [...nextValue, date];
-          break;
-        }
-      case 'range':
-        {
-          if (nextValue.length < 1 || nextValue.length > 1) {
-            next = [date];
-          } else {
-            const first = nextValue[0];
-            if (isSameDay(first, date)) {
-              next = resolvedAllowSameDay ? [first, date] : [date];
-            } else {
-              next = [first, date].sort((a, b) => a.getTime() - b.getTime());
-            }
-          }
-          break;
-        }
-      default:
-        next = [date];
-    }
-    ;
-    const normalizedNextValue = normalizeValue(next, resolvedType);
-    if (!isSelectionAllowed(normalizedNextValue)) return;
-    setSelectedValue(mapValue(normalizedNextValue, resolvedType));
-    if (!resolvedShowConfirm) maybeAutoConfirm(normalizedNextValue);
-  }, [value, resolvedType, minDayTime, maxDayTime, resolvedAllowSameDay, isSelectionAllowed, setSelectedValue, resolvedShowConfirm, maybeAutoConfirm]);
-  handleSelectDayRef.current = handleSelectDay;
-  const selectDayPress = (0, _react().useCallback)(date => handleSelectDayRef.current?.(date), []);
-  const valueTimes = (0, _react().useMemo)(() => value.map(item => startOfDay(item).getTime()), [value]);
-  const selected = (0, _react().useMemo)(() => new Set(valueTimes), [valueTimes]);
-  const rangeBounds = resolvedType === 'range' && valueTimes.length === 2 ? [valueTimes[0], valueTimes[1]] : null;
-  const renderDay = (0, _react().useCallback)((mapped, index) => {
-    if (!mapped) return /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-      key: `p-${index}`,
-      style: [tokens.layout.dayPlaceholder, {
-        paddingVertical: tokens.spacing.dayPaddingVertical,
-        paddingHorizontal: columnPadding
-      }]
-    });
-    const {
-      day,
-      key,
-      timeValue,
-      dateValue
-    } = mapped;
-    const isDisabled = timeValue < minDayTime || timeValue > maxDayTime;
-    const isSelected = selected.has(timeValue);
-    const inRange = resolvedType === 'range' && rangeBounds && timeValue > rangeBounds[0] && timeValue < rangeBounds[1];
-    const dayStyles = [tokens.layout.dayText, {
-      borderRadius: tokens.radii.day,
-      color: tokens.colors.text,
-      minWidth: tokens.sizing.dayMinWidth
-    }];
-    if (isDisabled) dayStyles.push({
-      color: tokens.colors.disabled
-    });else if (inRange) dayStyles.push({
-      backgroundColor: tokens.colors.rangeBackground
-    });else if (isSelected) dayStyles.push({
-      backgroundColor: color ?? tokens.colors.selectedBackground,
-      color: tokens.colors.selectedText
-    });
-    const accessibility = `${day.getFullYear()}-${String(day.getMonth() + 1).padStart(2, '0')}-${String(day.getDate()).padStart(2, '0')}${isSelected ? ', selected' : ''}${isDisabled ? ', disabled' : ''}`;
-    return /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, {
-      key: key,
-      accessibilityRole: "button",
-      accessibilityLabel: accessibility,
-      accessibilityState: {
-        selected: isSelected,
-        disabled: isDisabled
-      },
-      style: [tokens.layout.dayButton, {
-        paddingVertical: tokens.spacing.dayPaddingVertical,
-        paddingHorizontal: columnPadding
-      }],
-      disabled: isDisabled,
-      onPress: () => selectDayPress(day),
-      testID: getCalendarDayTestId(day)
-    }, /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-      style: dayStyles
-    }, dateValue));
-  }, [selected, resolvedType, rangeBounds, minDayTime, maxDayTime, tokens, color, selectDayPress, columnPadding]);
-  const content = /*#__PURE__*/_react().default.createElement(_reactNative().View, _extends({
-    style: [{
-      backgroundColor: tokens.colors.background,
-      padding: tokens.spacing.containerPadding,
-      borderRadius: tokens.radii.container
-    }, style]
-  }, rest), resolvedShowHeader ? /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.header, {
-      marginBottom: tokens.spacing.headerMarginBottom
-    }]
-  }, /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, {
-    testID: "calendar-nav-prev",
-    accessibilityRole: "button",
-    accessibilityLabel: "previous month",
-    onPress: goPrev,
-    disabled: !canGoPrev
-  }, /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-    style: [tokens.layout.navText, {
-      fontSize: tokens.sizing.navButtonSize,
-      paddingHorizontal: tokens.spacing.navPaddingHorizontal
-    }, !canGoPrev && {
-      opacity: 0.3
-    }]
-  }, '<')), /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: tokens.layout.headerCenter
-  }, (0, _validate.isRenderable)(resolvedTitle) ? (0, _utils.renderTextOrNode)(resolvedTitle, [tokens.layout.headerTitle, {
-    color: tokens.colors.text,
-    fontSize: tokens.typography.headerTitleSize,
-    fontWeight: tokens.typography.headerTitleWeight
-  }]) : null, resolvedShowSubtitle ? (0, _utils.renderTextOrNode)(monthLabel, [tokens.layout.headerSubtitle, {
-    color: tokens.colors.headerSubtitle,
-    fontSize: tokens.typography.headerSubtitleSize
-  }]) : null), /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, {
-    testID: "calendar-nav-next",
-    accessibilityRole: "button",
-    accessibilityLabel: "next month",
-    onPress: goNext,
-    disabled: !canGoNext
-  }, /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-    style: [tokens.layout.navText, {
-      fontSize: tokens.sizing.navButtonSize,
-      paddingHorizontal: tokens.spacing.navPaddingHorizontal
-    }, !canGoNext && {
-      opacity: 0.3
-    }]
-  }, '>'))) : null, /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.weekRow, {
-      marginBottom: tokens.spacing.weekRowMarginBottom
-    }]
-  }, weekLabels.map((label, i) => /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    key: `w-${i}`,
-    style: [tokens.layout.weekLabelItem, {
-      paddingHorizontal: columnPadding
-    }]
-  }, (0, _utils.renderTextOrNode)(label, [tokens.layout.weekLabel, {
-    color: tokens.colors.text
-  }])))), /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.days, {
-      rowGap: tokens.spacing.row
-    }]
-  }, monthDaysMapped.map((mapped, i) => renderDay(mapped, i))), resolvedShowConfirm ? /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, {
-    style: [tokens.layout.confirmButton, {
-      backgroundColor: color ?? tokens.colors.selectedBackground,
-      opacity: confirmDisabled ? 0.5 : 1,
-      marginTop: tokens.spacing.confirmMarginTop,
-      paddingVertical: tokens.spacing.confirmPaddingVertical,
-      borderRadius: tokens.radii.confirmButton
-    }],
-    onPress: handleConfirm,
-    disabled: confirmDisabled
-  }, (0, _utils.renderTextOrNode)(resolvedConfirmText, [tokens.layout.confirmText, {
-    color: tokens.colors.confirmText,
-    fontWeight: tokens.typography.confirmTextWeight
-  }])) : null);
-  if (!resolvedPoppable) return content;
-  return /*#__PURE__*/_react().default.createElement(_popup.default, _extends({
-    visible: popupVisible,
-    placement: resolvedPopupPlacement,
-    round: resolvedPopupRound,
-    closeOnOverlayPress: overlayCloseOnPressResolved,
-    overlay: overlayResolved,
-    safeAreaInsetTop: popupRestProps?.safeAreaInsetTop != null ? popupRestProps.safeAreaInsetTop : resolvedShowHeader,
-    safeAreaInsetBottom: popupRestProps?.safeAreaInsetBottom != null ? popupRestProps.safeAreaInsetBottom : resolvedPopupPlacement === 'bottom',
-    onOpen: handlePopupOpen,
-    onOpened: handlePopupOpened,
-    onClose: handlePopupClose,
-    onClosed: handlePopupClosed
-  }, popupRestProps), content);
-};
-function mapValue(value, type) {
-  if (type === 'single') return value[0] ?? new Date();
-  if (type === 'range' && value.length === 2) return value;
-  return value;
-}
-function normalizeValue(value, type) {
-  if (type === 'single') return value.slice(0, 1);
-  if (type === 'range') return value.slice(0, 2).sort((a, b) => a.getTime() - b.getTime());
-  return value;
-}
-function formatMonth(date) {
-  return `${date.getFullYear()}/${date.getMonth() + 1}`;
-}
-function reorderWeekdays(labels, start, fallback) {
-  const normalizedStart = (start % 7 + 7) % 7;
-  const source = labels.length === 7 ? [...labels] : fallback;
-  return [...source.slice(normalizedStart), ...source.slice(0, normalizedStart)];
-}
-function buildMonth(month, weekStartsOn) {
-  const normalizedStart = (weekStartsOn % 7 + 7) % 7;
-  const firstDay = startOfMonth(month);
-  const startOffset = (firstDay.getDay() - normalizedStart + 7) % 7;
-  const daysInMonth = new Date(month.getFullYear(), month.getMonth() + 1, 0).getDate();
-  const calendar = [];
-  for (let i = 0; i < startOffset; i += 1) calendar.push(null);
-  for (let day = 1; day <= daysInMonth; day += 1) calendar.push(new Date(month.getFullYear(), month.getMonth(), day));
-  while (calendar.length < 42) calendar.push(null);
-  return calendar;
-}
-function getCalendarDayTestId(date) {
-  return `calendar-day-${date.getFullYear()}-${`${date.getMonth() + 1}`.padStart(2, '0')}-${`${date.getDate()}`.padStart(2, '0')}`;
-}
-function startOfMonth(date) {
-  return new Date(date.getFullYear(), date.getMonth(), 1);
-}
-function clampMonth(date, min, max) {
-  const month = startOfMonth(date);
-  const minMonth = startOfMonth(min);
-  const maxMonth = startOfMonth(max);
-  if (month.getTime() < minMonth.getTime()) return minMonth;
-  if (month.getTime() > maxMonth.getTime()) return max;
-  return month;
-}
-function isSameMonth(a, b) {
-  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();
-}
-const Calendar = /*#__PURE__*/_react().default.memo(CalendarImpl);
-Calendar.displayName = 'Calendar';
-var _default = exports.default = Calendar;
+"use strict";function _react(){const e=_interopRequireWildcard(require("react"));return _react=function(){return e},e}function _reactNative(){const e=require("react-native");return _reactNative=function(){return e},e}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _hooks=require("../../hooks"),_utils=require("../../utils"),_validate=require("../../utils/validate"),_popup=_interopRequireDefault(require("../popup")),_useLocale=require("../config-provider/useLocale"),_tokens=require("./tokens");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var a=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,l,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(n=t?r:a){if(n.has(e))return n.get(e);n.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((l=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(l.get||l.set)?n(o,t,l):o[t]=e[t]);return o})(e,t)}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)({}).hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},_extends.apply(null,arguments)}const DAY_MS=864e5,isSameDay=(e,t)=>e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate(),startOfDay=e=>{const t=new Date(e);return t.setHours(0,0,0,0),t},daysBetween=(e,t)=>Math.round(Math.abs(startOfDay(e).getTime()-startOfDay(t).getTime())/DAY_MS),toArrayValue=e=>e?Array.isArray(e)?e.filter(Boolean).map(e=>new Date(e)):[new Date(e)]:[],DEFAULT_MIN=new Date((new Date).getFullYear()-10,0,1),DEFAULT_MAX=new Date((new Date).getFullYear()+10,11,31),CalendarImpl=e=>{const{tokensOverride:t,value:a,defaultValue:r,minDate:n=DEFAULT_MIN,maxDate:l=DEFAULT_MAX,type:o,title:i,showSubtitle:s,showHeader:u,showConfirm:c,confirmText:d,weekStartsOn:p,weekdays:g,formatMonthTitle:f,allowSameDay:m,maxRange:y,onOverRange:_,poppable:h,visible:b,defaultVisible:O,onVisibleChange:C,closeOnClickOverlay:v,closeOnConfirm:k,popupPlacement:T,popupRound:M,popupProps:w,onOpen:D,onOpened:S,onClose:V,onClosed:x,color:P,onConfirm:N,onSelect:R,style:z,...E}=e,A=(0,_useLocale.useLocale)(),B=A?.vanCalendar,F=(0,_tokens.useCalendarTokens)(t),I=i??B?.title??F.defaults.title,Y=s??F.defaults.showSubtitle,W=u??F.defaults.showHeader,$=d??B?.confirm??F.defaults.confirmText,q=p??F.defaults.weekStartsOn,L=m??F.defaults.allowSameDay,H=h??F.defaults.poppable,j=v??F.defaults.closeOnClickOverlay,U=k??F.defaults.closeOnConfirm,X=T??F.defaults.popupPlacement,G=M??F.defaults.popupRound,J=o??F.defaults.type,K=c??F.defaults.showConfirm[J],[Q,Z]=(0,_hooks.useControllableValue)(e,{defaultValue:!1,valuePropName:"visible",defaultValuePropName:"defaultVisible",trigger:"onVisibleChange"}),{onClose:ee,onClosed:te,onOpen:ae,onOpened:re,closeOnOverlayPress:ne,overlay:le,...oe}=w??{},ie=(0,_react().useRef)({onConfirm:N,onOverRange:_,popupOnOpen:ae,onOpen:D,popupOnOpened:re,onOpened:S,popupOnClose:ee,onClose:V,popupOnClosed:te,onClosed:x});ie.current.onConfirm=N,ie.current.onOverRange=_,ie.current.popupOnOpen=ae,ie.current.onOpen=D,ie.current.popupOnOpened=re,ie.current.onOpened=S,ie.current.popupOnClose=ee,ie.current.onClose=V,ie.current.popupOnClosed=te,ie.current.onClosed=x;const se=(0,_react().useCallback)(()=>{H&&Z(!1)},[H,Z]),ue=(0,_react().useCallback)(()=>{ie.current.popupOnOpen?.(),ie.current.onOpen?.()},[]),ce=(0,_react().useCallback)(()=>{ie.current.popupOnOpened?.(),ie.current.onOpened?.()},[]),de=(0,_react().useCallback)(()=>{se(),ie.current.popupOnClose?.(),ie.current.onClose?.()},[se]),pe=(0,_react().useCallback)(()=>{ie.current.popupOnClosed?.(),ie.current.onClosed?.()},[]),ge=ne??j,fe=le??!0,[me,ye]=(0,_hooks.useControllableValue)(e,{defaultValue:null,valuePropName:"value",defaultValuePropName:"defaultValue",trigger:"onSelect"}),_e=normalizeValue(toArrayValue(me),J),[he,be]=(0,_react().useState)(()=>clampMonth(_e.length?_e[0]:new Date,n,l)),Oe=_e.length?_e[0].getTime():null,Ce=n.getTime(),ve=l.getTime();(0,_react().useEffect)(()=>{if(!_e.length)return;const e=clampMonth(_e[0],n,l);be(t=>isSameMonth(e,t)?t:e)},[Oe,Ce,ve]);const ke=(0,_react().useMemo)(()=>buildMonth(he,q),[he,q]),Te=(0,_react().useMemo)(()=>ke.map(e=>e?{day:e,key:e.toISOString(),timeValue:startOfDay(e).getTime(),dateValue:e.getDate()}:null),[ke]),Me=startOfDay(n).getTime(),we=startOfDay(l).getTime(),De=g??B?.weekdays??F.defaults.weekdays,Se=(0,_react().useMemo)(()=>reorderWeekdays(De,q,F.defaults.weekdays),[De,F.defaults.weekdays,q]),Ve=(0,_react().useMemo)(()=>f?f(he):B?.monthTitle?B.monthTitle(he.getFullYear(),he.getMonth()+1):formatMonth(he),[he,f,B]),xe=startOfMonth(n),Pe=startOfMonth(l),Ne=he.getTime()>xe.getTime(),Re=he.getTime()<Pe.getTime(),ze=(0,_react().useCallback)(e=>be(t=>clampMonth(new Date(t.getFullYear(),t.getMonth()+e,1),n,l)),[n,l]),Ee=(0,_react().useCallback)(()=>ze(-1),[ze]),Ae=(0,_react().useCallback)(()=>ze(1),[ze]),Be="range"===J?_e.length<2:0===_e.length,Fe=F.spacing.column/2,Ie=(0,_react().useCallback)(e=>{K||"range"===J&&e.length<2||"multiple"===J&&0===e.length||e.length&&(ie.current.onConfirm?.(mapValue(e,J)),H&&U&&se())},[K,J,H,U,se]),Ye=(0,_react().useCallback)(()=>{K&&Be||(ie.current.onConfirm?.(mapValue(_e,J)),H&&U&&se())},[K,Be,_e,J,H,U,se]),We=(0,_react().useCallback)(e=>{if("range"===J&&2===e.length){const[t,a]=e;if(!L&&isSameDay(t,a))return!1;if(y&&daysBetween(t,a)+1>y)return ie.current.onOverRange?.(y),!1}return!("multiple"===J&&y&&e.length>y)||(ie.current.onOverRange?.(y),!1)},[J,L,y]),$e=(0,_react().useRef)(void 0),qe=(0,_react().useCallback)(e=>{const t=startOfDay(e).getTime();if(t<Me||t>we)return;let a=[];const r=_e;switch(J){case"single":default:a=[e];break;case"multiple":a=r.find(t=>isSameDay(t,e))?r.filter(t=>!isSameDay(t,e)):[...r,e];break;case"range":if(r.length<1||r.length>1)a=[e];else{const t=r[0];a=isSameDay(t,e)?L?[t,e]:[e]:[t,e].sort((e,t)=>e.getTime()-t.getTime())}}const n=normalizeValue(a,J);We(n)&&(ye(mapValue(n,J)),K||Ie(n))},[_e,J,Me,we,L,We,ye,K,Ie]);$e.current=qe;const Le=(0,_react().useCallback)(e=>$e.current?.(e),[]),He=(0,_react().useMemo)(()=>_e.map(e=>startOfDay(e).getTime()),[_e]),je=(0,_react().useMemo)(()=>new Set(He),[He]),Ue="range"===J&&2===He.length?[He[0],He[1]]:null,Xe=(0,_react().useCallback)((e,t)=>{if(!e)return _react().default.createElement(_reactNative().View,{key:`p-${t}`,style:[F.layout.dayPlaceholder,{paddingVertical:F.spacing.dayPaddingVertical,paddingHorizontal:Fe}]});const{day:a,key:r,timeValue:n,dateValue:l}=e,o=n<Me||n>we,i=je.has(n),s="range"===J&&Ue&&n>Ue[0]&&n<Ue[1],u=[F.layout.dayText,{borderRadius:F.radii.day,color:F.colors.text,minWidth:F.sizing.dayMinWidth}];o?u.push({color:F.colors.disabled}):s?u.push({backgroundColor:F.colors.rangeBackground}):i&&u.push({backgroundColor:P??F.colors.selectedBackground,color:F.colors.selectedText});const c=`${a.getFullYear()}-${String(a.getMonth()+1).padStart(2,"0")}-${String(a.getDate()).padStart(2,"0")}${i?", selected":""}${o?", disabled":""}`;return _react().default.createElement(_reactNative().Pressable,{key:r,accessibilityRole:"button",accessibilityLabel:c,accessibilityState:{selected:i,disabled:o},style:[F.layout.dayButton,{paddingVertical:F.spacing.dayPaddingVertical,paddingHorizontal:Fe}],disabled:o,onPress:()=>Le(a),testID:getCalendarDayTestId(a)},_react().default.createElement(_reactNative().Text,{style:u},l))},[je,J,Ue,Me,we,F,P,Le,Fe]),Ge=_react().default.createElement(_reactNative().View,_extends({style:[{backgroundColor:F.colors.background,padding:F.spacing.containerPadding,borderRadius:F.radii.container},z]},E),W?_react().default.createElement(_reactNative().View,{style:[F.layout.header,{marginBottom:F.spacing.headerMarginBottom}]},_react().default.createElement(_reactNative().Pressable,{testID:"calendar-nav-prev",accessibilityRole:"button",accessibilityLabel:"previous month",onPress:Ee,disabled:!Ne},_react().default.createElement(_reactNative().Text,{style:[F.layout.navText,{fontSize:F.sizing.navButtonSize,paddingHorizontal:F.spacing.navPaddingHorizontal},!Ne&&{opacity:.3}]},"<")),_react().default.createElement(_reactNative().View,{style:F.layout.headerCenter},(0,_validate.isRenderable)(I)?(0,_utils.renderTextOrNode)(I,[F.layout.headerTitle,{color:F.colors.text,fontSize:F.typography.headerTitleSize,fontWeight:F.typography.headerTitleWeight}]):null,Y?(0,_utils.renderTextOrNode)(Ve,[F.layout.headerSubtitle,{color:F.colors.headerSubtitle,fontSize:F.typography.headerSubtitleSize}]):null),_react().default.createElement(_reactNative().Pressable,{testID:"calendar-nav-next",accessibilityRole:"button",accessibilityLabel:"next month",onPress:Ae,disabled:!Re},_react().default.createElement(_reactNative().Text,{style:[F.layout.navText,{fontSize:F.sizing.navButtonSize,paddingHorizontal:F.spacing.navPaddingHorizontal},!Re&&{opacity:.3}]},">"))):null,_react().default.createElement(_reactNative().View,{style:[F.layout.weekRow,{marginBottom:F.spacing.weekRowMarginBottom}]},Se.map((e,t)=>_react().default.createElement(_reactNative().View,{key:`w-${t}`,style:[F.layout.weekLabelItem,{paddingHorizontal:Fe}]},(0,_utils.renderTextOrNode)(e,[F.layout.weekLabel,{color:F.colors.text}])))),_react().default.createElement(_reactNative().View,{style:[F.layout.days,{rowGap:F.spacing.row}]},Te.map((e,t)=>Xe(e,t))),K?_react().default.createElement(_reactNative().Pressable,{style:[F.layout.confirmButton,{backgroundColor:P??F.colors.selectedBackground,opacity:Be?.5:1,marginTop:F.spacing.confirmMarginTop,paddingVertical:F.spacing.confirmPaddingVertical,borderRadius:F.radii.confirmButton}],onPress:Ye,disabled:Be},(0,_utils.renderTextOrNode)($,[F.layout.confirmText,{color:F.colors.confirmText,fontWeight:F.typography.confirmTextWeight}])):null);return H?_react().default.createElement(_popup.default,_extends({visible:Q,placement:X,round:G,closeOnOverlayPress:ge,overlay:fe,safeAreaInsetTop:null!=oe?.safeAreaInsetTop?oe.safeAreaInsetTop:W,safeAreaInsetBottom:null!=oe?.safeAreaInsetBottom?oe.safeAreaInsetBottom:"bottom"===X,onOpen:ue,onOpened:ce,onClose:de,onClosed:pe},oe),Ge):Ge};function mapValue(e,t){return"single"===t?e[0]??new Date:("range"===t&&e.length,e)}function normalizeValue(e,t){return"single"===t?e.slice(0,1):"range"===t?e.slice(0,2).sort((e,t)=>e.getTime()-t.getTime()):e}function formatMonth(e){return`${e.getFullYear()}/${e.getMonth()+1}`}function reorderWeekdays(e,t,a){const r=(t%7+7)%7,n=7===e.length?[...e]:a;return[...n.slice(r),...n.slice(0,r)]}function buildMonth(e,t){const a=(t%7+7)%7,r=(startOfMonth(e).getDay()-a+7)%7,n=new Date(e.getFullYear(),e.getMonth()+1,0).getDate(),l=[];for(let e=0;e<r;e+=1)l.push(null);for(let t=1;t<=n;t+=1)l.push(new Date(e.getFullYear(),e.getMonth(),t));for(;l.length<42;)l.push(null);return l}function getCalendarDayTestId(e){return`calendar-day-${e.getFullYear()}-${`${e.getMonth()+1}`.padStart(2,"0")}-${`${e.getDate()}`.padStart(2,"0")}`}function startOfMonth(e){return new Date(e.getFullYear(),e.getMonth(),1)}function clampMonth(e,t,a){const r=startOfMonth(e),n=startOfMonth(t),l=startOfMonth(a);return r.getTime()<n.getTime()?n:r.getTime()>l.getTime()?a:r}function isSameMonth(e,t){return e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()}const Calendar=_react().default.memo(CalendarImpl);Calendar.displayName="Calendar";var _default=exports.default=Calendar;

package/dist/cjs/components/calendar/index.js

@@ -1,9 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _Calendar = _interopRequireDefault(require("./Calendar"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = _Calendar.default;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _Calendar=_interopRequireDefault(require("./Calendar"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=_Calendar.default;

package/dist/cjs/components/calendar/tokens.js

@@ -1,129 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useCalendarTokens = exports.createCalendarTokens = void 0;
-var _designSystem = require("../../design-system");
-const createCalendarTokens = foundations => {
-  const {
-    palette,
-    spacing,
-    radii,
-    fontSize,
-    typography
-  } = foundations;
-  const onPrimary = palette.primary.foreground ?? "#ffffff";
-  return {
-    defaults: {
-      type: "single",
-      title: "Select Date",
-      showSubtitle: true,
-      showHeader: true,
-      showConfirm: {
-        single: false,
-        range: true,
-        multiple: true
-      },
-      confirmText: "Confirm",
-      weekStartsOn: 0,
-      weekdays: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
-      allowSameDay: false,
-      poppable: false,
-      closeOnClickOverlay: true,
-      closeOnConfirm: true,
-      popupPlacement: "bottom",
-      popupRound: true
-    },
-    layout: {
-      header: {
-        flexDirection: "row",
-        alignItems: "center",
-        justifyContent: "space-between"
-      },
-      headerCenter: {
-        alignItems: "center",
-        flex: 1
-      },
-      navText: {
-        textAlign: "center"
-      },
-      headerTitle: {
-        textAlign: "center"
-      },
-      headerSubtitle: {
-        textAlign: "center"
-      },
-      weekRow: {
-        flexDirection: "row",
-        justifyContent: "space-between"
-      },
-      weekLabelItem: {
-        width: `${100 / 7}%`,
-        alignItems: "center"
-      },
-      weekLabel: {
-        textAlign: "center"
-      },
-      days: {
-        flexDirection: "row",
-        flexWrap: "wrap"
-      },
-      dayButton: {
-        width: `${100 / 7}%`,
-        alignItems: "center"
-      },
-      dayText: {
-        textAlign: "center"
-      },
-      dayPlaceholder: {
-        width: `${100 / 7}%`
-      },
-      confirmButton: {
-        alignItems: "center"
-      },
-      confirmText: {
-        textAlign: "center"
-      }
-    },
-    colors: {
-      text: palette.default[800],
-      weekend: palette.danger[500],
-      disabled: palette.default[300],
-      background: "#ffffff",
-      selectedBackground: palette.primary[500],
-      selectedText: onPrimary,
-      rangeBackground: palette.primary[100],
-      headerSubtitle: palette.default[600],
-      confirmText: onPrimary
-    },
-    typography: {
-      headerTitleSize: fontSize.md,
-      headerTitleWeight: typography.weight.semiBold,
-      headerSubtitleSize: fontSize.sm,
-      confirmTextWeight: typography.weight.semiBold
-    },
-    sizing: {
-      dayMinWidth: 32,
-      navButtonSize: fontSize.md
-    },
-    radii: {
-      day: radii.sm,
-      container: radii.lg,
-      confirmButton: 20
-    },
-    spacing: {
-      row: spacing.xs,
-      column: spacing.xs,
-      containerPadding: spacing.lg,
-      headerMarginBottom: spacing.md,
-      weekRowMarginBottom: spacing.sm,
-      navPaddingHorizontal: spacing.sm,
-      dayPaddingVertical: 6,
-      confirmMarginTop: spacing.lg,
-      confirmPaddingVertical: 10
-    }
-  };
-};
-exports.createCalendarTokens = createCalendarTokens;
-const useCalendarTokens = exports.useCalendarTokens = (0, _designSystem.createComponentTokensHook)("calendar", createCalendarTokens);
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useCalendarTokens=exports.createCalendarTokens=void 0;var _designSystem=require("../../design-system");const createCalendarTokens=e=>{const{palette:t,spacing:n,radii:a,fontSize:r,typography:i}=e,o=t.primary.foreground??"#ffffff";return{defaults:{type:"single",title:"Select Date",showSubtitle:!0,showHeader:!0,showConfirm:{single:!1,range:!0,multiple:!0},confirmText:"Confirm",weekStartsOn:0,weekdays:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],allowSameDay:!1,poppable:!1,closeOnClickOverlay:!0,closeOnConfirm:!0,popupPlacement:"bottom",popupRound:!0},layout:{header:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},headerCenter:{alignItems:"center",flex:1},navText:{textAlign:"center"},headerTitle:{textAlign:"center"},headerSubtitle:{textAlign:"center"},weekRow:{flexDirection:"row",justifyContent:"space-between"},weekLabelItem:{width:100/7+"%",alignItems:"center"},weekLabel:{textAlign:"center"},days:{flexDirection:"row",flexWrap:"wrap"},dayButton:{width:100/7+"%",alignItems:"center"},dayText:{textAlign:"center"},dayPlaceholder:{width:100/7+"%"},confirmButton:{alignItems:"center"},confirmText:{textAlign:"center"}},colors:{text:t.default[800],weekend:t.danger[500],disabled:t.default[300],background:"#ffffff",selectedBackground:t.primary[500],selectedText:o,rangeBackground:t.primary[100],headerSubtitle:t.default[600],confirmText:o},typography:{headerTitleSize:r.md,headerTitleWeight:i.weight.semiBold,headerSubtitleSize:r.sm,confirmTextWeight:i.weight.semiBold},sizing:{dayMinWidth:32,navButtonSize:r.md},radii:{day:a.sm,container:a.lg,confirmButton:20},spacing:{row:n.xs,column:n.xs,containerPadding:n.lg,headerMarginBottom:n.md,weekRowMarginBottom:n.sm,navPaddingHorizontal:n.sm,dayPaddingVertical:6,confirmMarginTop:n.lg,confirmPaddingVertical:10}}};exports.createCalendarTokens=createCalendarTokens;const useCalendarTokens=exports.useCalendarTokens=(0,_designSystem.createComponentTokensHook)("calendar",createCalendarTokens);