react-native-system-ui 0.0.1 → 0.0.2

package/dist/cjs/button/tokens.js

@@ -0,0 +1,187 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useButtonTokens = void 0;
+function _reactNative() {
+  const data = require("react-native");
+  _reactNative = function () {
+    return data;
+  };
+  return data;
+}
+var _designSystem = require("../../design-system");
+var _utils = require("../../utils");
+const isDarkThemeBackground = color => {
+  const rgb = (0, _utils.hexToRgb)(color);
+  return !!rgb && (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000 < 140;
+};
+const createButtonTokens = foundations => {
+  const {
+    palette,
+    spacing,
+    radii,
+    fontSize,
+    typography,
+    opacity
+  } = foundations;
+  const buildTone = (tone, text) => {
+    const ramp = palette[tone];
+    const baseBackground = ramp[500];
+    return {
+      background: baseBackground,
+      border: baseBackground,
+      text: text ?? ramp.foreground ?? '#ffffff',
+      tonalBackground: ramp[100],
+      tonalBorder: ramp[200],
+      tonalText: ramp[700] ?? ramp[800] ?? '#111111'
+    };
+  };
+  const darkTheme = isDarkThemeBackground(palette.default[50]);
+  const baseRadius = Math.max(0, Math.round(radii.xs / 2));
+  const defaultBackground = darkTheme ? palette.default[100] : '#ffffff';
+  const defaultBorder = darkTheme ? palette.default[300] : '#ebedf0';
+  const defaultText = darkTheme ? palette.default.foreground ?? '#f4f6fb' : '#323233';
+  return {
+    defaults: {
+      type: 'default',
+      size: 'normal',
+      plain: false,
+      block: false,
+      round: false,
+      square: false,
+      hairline: false,
+      iconPosition: 'left',
+      mode: 'contained',
+      loading: false,
+      loadingType: 'circular',
+      loadingSize: 'small',
+      disabled: false,
+      autoInsertSpace: true,
+      uppercase: false,
+      allowFontScaling: true
+    },
+    layout: {
+      base: {
+        borderStyle: 'solid',
+        alignItems: 'center',
+        justifyContent: 'center',
+        flexDirection: 'row',
+        alignSelf: 'flex-start'
+      },
+      block: {
+        alignSelf: 'stretch',
+        width: '100%'
+      },
+      content: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'center'
+      },
+      iconWrapper: {
+        alignItems: 'center',
+        justifyContent: 'center'
+      },
+      text: {
+        fontWeight: '400'
+      }
+    },
+    colors: {
+      ripple: 'rgba(255,255,255,0.35)',
+      backgroundTransparent: 'transparent',
+      backgroundPlain: defaultBackground,
+      textDark: '#ffffff',
+      textLight: '#111111',
+      tones: {
+        default: {
+          background: defaultBackground,
+          border: defaultBorder,
+          text: defaultText,
+          tonalBackground: darkTheme ? palette.default[200] : palette.default[100],
+          tonalBorder: defaultBorder,
+          tonalText: defaultText
+        },
+        primary: buildTone('primary'),
+        info: buildTone('info'),
+        success: buildTone('success'),
+        warning: buildTone('warning', palette.warning.foreground ?? '#ffffff'),
+        danger: buildTone('danger')
+      }
+    },
+    typography: {
+      fontFamily: typography.fontFamily,
+      lineHeightMultiplier: typography.lineHeightMultiplier,
+      fontWeight: typography.weight.medium
+    },
+    sizing: {
+      sizes: {
+        large: {
+          height: 50,
+          fontSize: fontSize.lg,
+          paddingHorizontal: fontSize.lg,
+          iconSize: fontSize.lg,
+          radius: baseRadius
+        },
+        normal: {
+          height: 44,
+          fontSize: fontSize.sm,
+          paddingHorizontal: fontSize.md,
+          iconSize: fontSize.sm,
+          radius: baseRadius
+        },
+        small: {
+          height: 32,
+          fontSize: fontSize.xs,
+          paddingHorizontal: fontSize.xs,
+          iconSize: fontSize.xs,
+          radius: baseRadius
+        },
+        mini: {
+          height: 24,
+          fontSize: fontSize.xxs,
+          paddingHorizontal: fontSize.xxs,
+          iconSize: fontSize.xxs,
+          radius: baseRadius
+        }
+      }
+    },
+    borders: {
+      width: 1,
+      hairlineWidth: _reactNative().StyleSheet.hairlineWidth
+    },
+    spacing: {
+      iconGap: spacing.sm,
+      groupGap: spacing.xs
+    },
+    states: {
+      disabledOpacity: opacity.disabled,
+      loadingOpacity: opacity.loading,
+      pressedOpacity: opacity.pressed
+    },
+    shadows: {
+      1: {
+        color: '#0f1a38',
+        opacity: 0.12,
+        radius: 2,
+        offsetY: 2,
+        elevation: 2
+      },
+      2: {
+        color: '#0f1a38',
+        opacity: 0.15,
+        radius: 4,
+        offsetY: 3,
+        elevation: 3
+      },
+      3: {
+        color: '#0f1a38',
+        opacity: 0.2,
+        radius: 6,
+        offsetY: 4,
+        elevation: 5
+      }
+    }
+  };
+};
+const useButtonTokens = exports.useButtonTokens = (0, _designSystem.createComponentTokensHook)('button', createButtonTokens);

package/dist/cjs/calendar/Calendar.js

@@ -0,0 +1,452 @@
+"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 _validate = require("../../utils/validate");
+var _popup = _interopRequireDefault(require("../popup"));
+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 next = new Date(date);
+  next.setHours(0, 0, 0, 0);
+  return next;
+};
+const daysBetween = (a, b) => Math.round(Math.abs(startOfDay(a).getTime() - startOfDay(b).getTime()) / DAY_MS);
+const toArrayValue = value => {
+  if (!value) return [];
+  return Array.isArray(value) ? value.filter(Boolean).map(date => new Date(date)) : [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 Calendar = props => {
+  const {
+    tokensOverride,
+    value: _value,
+    defaultValue: _defaultValue,
+    minDate = DEFAULT_MIN,
+    maxDate = DEFAULT_MAX,
+    type: typeProp,
+    title: titleProp,
+    showSubtitle: showSubtitleProp,
+    showHeader: showHeaderProp,
+    showConfirm: showConfirmProp,
+    confirmText: confirmTextProp,
+    weekStartsOn: weekStartsOnProp,
+    weekdays,
+    formatMonthTitle,
+    allowSameDay: allowSameDayProp,
+    maxRange,
+    onOverRange,
+    poppable: poppableProp,
+    visible: _visible,
+    defaultVisible: _defaultVisible,
+    onVisibleChange: _onVisibleChange,
+    closeOnClickOverlay: closeOnClickOverlayProp,
+    closeOnConfirm: closeOnConfirmProp,
+    popupPlacement: popupPlacementProp,
+    popupRound: popupRoundProp,
+    popupProps: popupPropsOverrides,
+    onOpen,
+    onOpened,
+    onClose,
+    onClosed,
+    color,
+    onConfirm,
+    onSelect: _onSelect,
+    style,
+    ...rest
+  } = props;
+  const tokens = (0, _tokens.useCalendarTokens)(tokensOverride);
+  const title = titleProp ?? tokens.defaults.title;
+  const showSubtitle = showSubtitleProp ?? tokens.defaults.showSubtitle;
+  const showHeader = showHeaderProp ?? tokens.defaults.showHeader;
+  const confirmText = confirmTextProp ?? tokens.defaults.confirmText;
+  const weekStartsOn = weekStartsOnProp ?? tokens.defaults.weekStartsOn;
+  const allowSameDay = allowSameDayProp ?? tokens.defaults.allowSameDay;
+  const poppable = poppableProp ?? tokens.defaults.poppable;
+  const closeOnClickOverlay = closeOnClickOverlayProp ?? tokens.defaults.closeOnClickOverlay;
+  const closeOnConfirm = closeOnConfirmProp ?? tokens.defaults.closeOnConfirm;
+  const popupPlacement = popupPlacementProp ?? tokens.defaults.popupPlacement;
+  const popupRound = popupRoundProp ?? tokens.defaults.popupRound;
+  const type = typeProp ?? tokens.defaults.type;
+  const showConfirm = showConfirmProp ?? tokens.defaults.showConfirm[type];
+  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: overrideCloseOnOverlayPress,
+    overlay: popupOverlay,
+    ...popupRestProps
+  } = popupPropsOverrides ?? {};
+  const closePopup = (0, _react().useCallback)(() => {
+    if (!poppable) return;
+    setPopupVisible(false);
+  }, [poppable, setPopupVisible]);
+  const handlePopupOpen = (0, _react().useCallback)(() => {
+    popupOnOpen?.();
+    onOpen?.();
+  }, [popupOnOpen, onOpen]);
+  const handlePopupOpened = (0, _react().useCallback)(() => {
+    popupOnOpened?.();
+    onOpened?.();
+  }, [popupOnOpened, onOpened]);
+  const handlePopupClose = (0, _react().useCallback)(() => {
+    closePopup();
+    popupOnClose?.();
+    onClose?.();
+  }, [closePopup, popupOnClose, onClose]);
+  const handlePopupClosed = (0, _react().useCallback)(() => {
+    popupOnClosed?.();
+    onClosed?.();
+  }, [popupOnClosed, onClosed]);
+  const resolvedCloseOnOverlayPress = overrideCloseOnOverlayPress ?? closeOnClickOverlay;
+  const resolvedOverlay = popupOverlay ?? true;
+  const [selectedValue, setSelectedValue] = (0, _hooks.useControllableValue)(props, {
+    defaultValue: null,
+    valuePropName: 'value',
+    defaultValuePropName: 'defaultValue',
+    trigger: 'onSelect'
+  });
+  const value = (0, _react().useMemo)(() => normalizeValue(toArrayValue(selectedValue), type), [selectedValue, type]);
+  const [currentMonth, setCurrentMonth] = (0, _react().useState)(() => {
+    const initial = value.length ? value[0] : new Date();
+    return clampMonth(initial, 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, weekStartsOn), [currentMonth, weekStartsOn]);
+  const minDay = (0, _react().useMemo)(() => startOfDay(minDate).getTime(), [minDate]);
+  const maxDay = (0, _react().useMemo)(() => startOfDay(maxDate).getTime(), [maxDate]);
+  const weekLabels = (0, _react().useMemo)(() => reorderWeekdays(weekdays ?? tokens.defaults.weekdays, weekStartsOn, tokens.defaults.weekdays), [tokens.defaults.weekdays, weekdays, weekStartsOn]);
+  const monthLabel = (0, _react().useMemo)(() => formatMonthTitle ? formatMonthTitle(currentMonth) : formatMonth(currentMonth), [formatMonthTitle, currentMonth]);
+  const minMonthStart = (0, _react().useMemo)(() => startOfMonth(minDate), [minDate]);
+  const maxMonthStart = (0, _react().useMemo)(() => startOfMonth(maxDate), [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 confirmDisabled = type === 'range' ? value.length < 2 : value.length === 0;
+  const columnPadding = tokens.spacing.column / 2;
+  const maybeAutoConfirm = (0, _react().useCallback)(next => {
+    if (showConfirm) return;
+    if (type === 'range' && next.length < 2) return;
+    if (type === 'multiple' && next.length === 0) return;
+    if (!next.length) return;
+    onConfirm?.(mapValue(next, type));
+    if (poppable && closeOnConfirm) {
+      closePopup();
+    }
+  }, [showConfirm, type, onConfirm, poppable, closeOnConfirm, closePopup]);
+  const handleConfirm = (0, _react().useCallback)(() => {
+    if (showConfirm && confirmDisabled) {
+      return;
+    }
+    onConfirm?.(mapValue(value, type));
+    if (poppable && closeOnConfirm) {
+      closePopup();
+    }
+  }, [showConfirm, confirmDisabled, onConfirm, value, type, poppable, closeOnConfirm, closePopup]);
+  const isSelectionAllowed = (0, _react().useCallback)(next => {
+    if (type === 'range' && next.length === 2) {
+      const [start, end] = next;
+      if (!allowSameDay && isSameDay(start, end)) {
+        return false;
+      }
+      if (maxRange && daysBetween(start, end) + 1 > maxRange) {
+        onOverRange?.(maxRange);
+        return false;
+      }
+    }
+    if (type === 'multiple' && maxRange && next.length > maxRange) {
+      onOverRange?.(maxRange);
+      return false;
+    }
+    return true;
+  }, [type, allowSameDay, maxRange, onOverRange]);
+  const handleSelectDay = (0, _react().useCallback)(day => {
+    const dayTime = startOfDay(day).getTime();
+    if (dayTime < minDay || dayTime > maxDay) {
+      return;
+    }
+    let next = [];
+    const normalized = value;
+    switch (type) {
+      case 'single':
+        {
+          next = [day];
+          break;
+        }
+      case 'multiple':
+        {
+          const exists = normalized.find(item => isSameDay(item, day));
+          next = exists ? normalized.filter(item => !isSameDay(item, day)) : [...normalized, day];
+          break;
+        }
+      case 'range':
+        {
+          if (normalized.length < 1 || normalized.length > 1) {
+            next = [day];
+          } else {
+            const first = normalized[0];
+            if (isSameDay(first, day)) {
+              next = allowSameDay ? [first, day] : [day];
+            } else {
+              next = [first, day].sort((a, b) => a.getTime() - b.getTime());
+            }
+          }
+          break;
+        }
+      default:
+        next = [day];
+    }
+    const normalizedNext = normalizeValue(next, type);
+    if (!isSelectionAllowed(normalizedNext)) {
+      return;
+    }
+    setSelectedValue(mapValue(normalizedNext, type));
+    if (!showConfirm) {
+      maybeAutoConfirm(normalizedNext);
+    }
+  }, [value, type, minDay, maxDay, allowSameDay, isSelectionAllowed, setSelectedValue, showConfirm, maybeAutoConfirm]);
+  const valueTimes = (0, _react().useMemo)(() => value.map(item => startOfDay(item).getTime()), [value]);
+  const selectedSet = (0, _react().useMemo)(() => new Set(valueTimes), [valueTimes]);
+  const rangeBounds = type === 'range' && valueTimes.length === 2 ? [valueTimes[0], valueTimes[1]] : null;
+  const renderDay = (0, _react().useCallback)((day, index) => {
+    if (!day) {
+      return /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+        key: `placeholder-${index}`,
+        style: [tokens.layout.dayPlaceholder, {
+          paddingVertical: tokens.spacing.dayPaddingVertical,
+          paddingHorizontal: columnPadding
+        }]
+      });
+    }
+    const timeValue = startOfDay(day).getTime();
+    const isDisabled = timeValue < minDay || timeValue > maxDay;
+    const isSelected = selectedSet.has(timeValue);
+    const inRange = type === 'range' && rangeBounds && timeValue > rangeBounds[0] && timeValue < rangeBounds[1];
+    const dayStyle = [tokens.layout.dayText, {
+      borderRadius: tokens.radii.day,
+      color: tokens.colors.text,
+      minWidth: tokens.sizing.dayMinWidth
+    }];
+    if (isDisabled) {
+      dayStyle.push({
+        color: tokens.colors.disabled
+      });
+    } else if (inRange) {
+      dayStyle.push({
+        backgroundColor: tokens.colors.rangeBackground
+      });
+    } else if (isSelected) {
+      dayStyle.push({
+        backgroundColor: color ?? tokens.colors.selectedBackground,
+        color: tokens.colors.selectedText
+      });
+    }
+    return /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, {
+      key: day.toISOString(),
+      style: [tokens.layout.dayButton, {
+        paddingVertical: tokens.spacing.dayPaddingVertical,
+        paddingHorizontal: columnPadding
+      }],
+      disabled: isDisabled,
+      onPress: () => handleSelectDay(day),
+      testID: getCalendarDayTestId(day)
+    }, /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
+      style: dayStyle
+    }, day.getDate()));
+  }, [selectedSet, type, rangeBounds, minDay, maxDay, tokens, color, handleSelectDay, 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), showHeader ? /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+    style: [tokens.layout.header, {
+      marginBottom: tokens.spacing.headerMarginBottom
+    }]
+  }, /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, {
+    testID: "calendar-nav-prev",
+    onPress: () => canGoPrev && goToMonth(-1),
+    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
+  }, title !== undefined && title !== null && title !== false ? (0, _validate.isText)(title) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
+    style: [tokens.layout.headerTitle, {
+      color: tokens.colors.text,
+      fontSize: tokens.typography.headerTitleSize,
+      fontWeight: tokens.typography.headerTitleWeight
+    }]
+  }, title) : title : null, showSubtitle ? (0, _validate.isText)(monthLabel) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
+    style: [tokens.layout.headerSubtitle, {
+      color: tokens.colors.headerSubtitle,
+      fontSize: tokens.typography.headerSubtitleSize
+    }]
+  }, monthLabel) : monthLabel : null), /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, {
+    testID: "calendar-nav-next",
+    onPress: () => canGoNext && goToMonth(1),
+    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, index) => /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+    key: `weekday-${index}`,
+    style: [tokens.layout.weekLabelItem, {
+      paddingHorizontal: columnPadding
+    }]
+  }, (0, _validate.isText)(label) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
+    style: [tokens.layout.weekLabel, {
+      color: tokens.colors.text
+    }]
+  }, label) : label))), /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+    style: [tokens.layout.days, {
+      rowGap: tokens.spacing.row
+    }]
+  }, monthDays.map((day, index) => renderDay(day, index))), showConfirm ? /*#__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, _validate.isText)(confirmText) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
+    style: [tokens.layout.confirmText, {
+      color: tokens.colors.confirmText,
+      fontWeight: tokens.typography.confirmTextWeight
+    }]
+  }, confirmText) : confirmText) : null);
+  if (!poppable) {
+    return content;
+  }
+  return /*#__PURE__*/_react().default.createElement(_popup.default, _extends({
+    visible: popupVisible,
+    placement: popupPlacement,
+    round: popupRound,
+    closeOnOverlayPress: resolvedCloseOnOverlayPress,
+    overlay: resolvedOverlay,
+    safeAreaInsetTop: popupRestProps?.safeAreaInsetTop !== undefined ? popupRestProps.safeAreaInsetTop : showHeader,
+    safeAreaInsetBottom: popupRestProps?.safeAreaInsetBottom !== undefined ? popupRestProps.safeAreaInsetBottom : popupPlacement === '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 cells = [];
+  for (let i = 0; i < startOffset; i += 1) {
+    cells.push(null);
+  }
+  for (let day = 1; day <= daysInMonth; day += 1) {
+    cells.push(new Date(month.getFullYear(), month.getMonth(), day));
+  }
+  while (cells.length < 42) {
+    cells.push(null);
+  }
+  return cells;
+}
+function getCalendarDayTestId(day) {
+  return `calendar-day-${day.getFullYear()}-${`${day.getMonth() + 1}`.padStart(2, '0')}-${`${day.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 maxMonth;
+  return month;
+}
+function isSameMonth(a, b) {
+  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth();
+}
+var _default = exports.default = Calendar;