react-vant-nova 1.0.0-test

package/lib/calendar/CalendarHeader.js

@@ -0,0 +1,89 @@
+"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 _jsxRuntime() {
+  const data = require("react/jsx-runtime");
+  _jsxRuntime = function () {
+    return data;
+  };
+  return data;
+}
+function _clsx() {
+  const data = _interopRequireDefault(require("clsx"));
+  _clsx = function () {
+    return data;
+  };
+  return data;
+}
+var _ConfigProviderContext = _interopRequireDefault(require("../config-provider/ConfigProviderContext"));
+var _utils = require("../utils");
+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); }
+const [bem] = (0, _utils.createNamespace)('calendar');
+const CalenderHeader = props => {
+  const {
+    locale
+  } = (0, _react().useContext)(_ConfigProviderContext.default);
+  const renderTitle = () => {
+    if (props.showTitle) {
+      const text = props.title || locale.vanCalendar.title;
+      return (0, _jsxRuntime().jsx)("div", Object.assign({
+        className: (0, _clsx().default)(bem('header-title'))
+      }, {
+        children: text
+      }));
+    }
+    return null;
+  };
+  const onClickSubtitle = event => {
+    var _a;
+    (_a = props.onClickSubtitle) === null || _a === void 0 ? void 0 : _a.call(props, event);
+  };
+  const renderSubtitle = () => {
+    if (props.showSubtitle) {
+      return (0, _jsxRuntime().jsx)("div", Object.assign({
+        className: (0, _clsx().default)(bem('header-subtitle')),
+        onClick: onClickSubtitle
+      }, {
+        children: props.subtitle
+      }));
+    }
+    return null;
+  };
+  const renderWeekDays = () => {
+    const {
+      weekdays: customWeekdays,
+      firstDayOfWeek
+    } = props;
+    const defaultWeekdays = locale.vanCalendar.weekdays;
+    const weekdays = customWeekdays ? defaultWeekdays.map((wk, i) => customWeekdays[i] || wk) : defaultWeekdays;
+    const renderWeekDaysContent = [...weekdays.slice(firstDayOfWeek, 7), ...weekdays.slice(0, firstDayOfWeek)];
+    return (0, _jsxRuntime().jsx)("div", Object.assign({
+      className: (0, _clsx().default)(bem('weekdays'))
+    }, {
+      children: renderWeekDaysContent.map((text, i) =>
+      // eslint-disable-next-line react/no-array-index-key
+      (0, _jsxRuntime().jsx)("span", Object.assign({
+        className: (0, _clsx().default)(bem('weekday'))
+      }, {
+        children: text
+      }), i))
+    }));
+  };
+  return (0, _jsxRuntime().jsxs)("div", Object.assign({
+    className: (0, _clsx().default)(bem('header'))
+  }, {
+    children: [renderTitle(), renderSubtitle(), renderWeekDays()]
+  }));
+};
+var _default = exports.default = CalenderHeader;

package/lib/calendar/CalendarMonth.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { CalendarMonthProps } from './PropsType';
+declare const CalenderMonth: React.ForwardRefExoticComponent<CalendarMonthProps & React.RefAttributes<unknown>>;
+export default CalenderMonth;

package/lib/calendar/CalendarMonth.js

@@ -0,0 +1,228 @@
+"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 _jsxRuntime() {
+  const data = require("react/jsx-runtime");
+  _jsxRuntime = function () {
+    return data;
+  };
+  return data;
+}
+function _clsx() {
+  const data = _interopRequireDefault(require("clsx"));
+  _clsx = function () {
+    return data;
+  };
+  return data;
+}
+var _utils = require("../utils");
+var _utils2 = require("./utils");
+var _utils3 = require("../datetime-picker/utils");
+var _CalendarDay = _interopRequireDefault(require("./CalendarDay"));
+var _useRect = require("../hooks/use-rect");
+var _ConfigProviderContext = _interopRequireDefault(require("../config-provider/ConfigProviderContext"));
+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); }
+const [bem] = (0, _utils.createNamespace)('calendar');
+const CalenderMonth = (0, _react().forwardRef)((props, ref) => {
+  const [visible, setVisible] = (0, _react().useState)();
+  const daysRef = (0, _react().useRef)();
+  const [monthRef, setMonthRef] = (0, _react().useState)();
+  const height = (0, _react().useRef)(0);
+  const {
+    locale
+  } = (0, _react().useContext)(_ConfigProviderContext.default);
+  (0, _react().useEffect)(() => {
+    if (monthRef) {
+      height.current = (0, _useRect.getRect)(monthRef).height;
+    }
+  }, [monthRef]);
+  const title = (0, _react().useMemo)(() => {
+    return props.formatMonthTitle ? props.formatMonthTitle(props.date) : locale.vanCalendar.monthTitle(...(0, _utils2.formatMonthTitle)(props.date));
+  }, [props.date, props.formatMonthTitle]);
+  const rowHeight = (0, _react().useMemo)(() => (0, _utils.addUnit)(props.rowHeight), [props.rowHeight]);
+  const offset = (0, _react().useMemo)(() => {
+    const realDay = props.date.getDay();
+    if (props.firstDayOfWeek) {
+      return (realDay + 7 - props.firstDayOfWeek) % 7;
+    }
+    return realDay;
+  }, [props.date, props.firstDayOfWeek]);
+  const totalDay = (0, _react().useMemo)(() => (0, _utils3.getMonthEndDay)(props.date.getFullYear(), props.date.getMonth() + 1), [props.date]);
+  const shouldRender = (0, _react().useMemo)(() => visible || !props.lazyRender, [visible]);
+  const getTitle = () => title;
+  const scrollIntoView = body => {
+    const el = props.showSubtitle ? daysRef.current : monthRef;
+    const scrollTop = (el === null || el === void 0 ? void 0 : el.getBoundingClientRect().top) - body.getBoundingClientRect().top + body.scrollTop;
+    (0, _utils.setScrollTop)(body, scrollTop);
+  };
+  const getMultipleDayType = day => {
+    const isSelected = date => props.currentDate.some(item => (0, _utils2.compareDay)(item, date) === 0);
+    if (isSelected(day)) {
+      const prevDay = (0, _utils2.getPrevDay)(day);
+      const nextDay = (0, _utils2.getNextDay)(day);
+      const prevSelected = isSelected(prevDay);
+      const nextSelected = isSelected(nextDay);
+      if (prevSelected && nextSelected) {
+        return 'multiple-middle';
+      }
+      if (prevSelected) {
+        return 'end';
+      }
+      if (nextSelected) {
+        return 'start';
+      }
+      return 'multiple-selected';
+    }
+    return '';
+  };
+  const getRangeDayType = day => {
+    const [startDay, endDay] = props.currentDate;
+    if (!startDay) {
+      return '';
+    }
+    const compareToStart = (0, _utils2.compareDay)(day, startDay);
+    if (!endDay) {
+      return compareToStart === 0 ? 'start' : '';
+    }
+    const compareToEnd = (0, _utils2.compareDay)(day, endDay);
+    if (props.allowSameDay && compareToStart === 0 && compareToEnd === 0) {
+      return 'start-end';
+    }
+    if (compareToStart === 0) {
+      return 'start';
+    }
+    if (compareToEnd === 0) {
+      return 'end';
+    }
+    if (compareToStart > 0 && compareToEnd < 0) {
+      return 'middle';
+    }
+    return '';
+  };
+  const getDayType = day => {
+    const {
+      type,
+      minDate,
+      maxDate,
+      currentDate
+    } = props;
+    if ((0, _utils2.compareDay)(day, minDate) < 0 || (0, _utils2.compareDay)(day, maxDate) > 0) {
+      return 'disabled';
+    }
+    if (currentDate === null) {
+      return '';
+    }
+    if (Array.isArray(currentDate)) {
+      if (type === 'multiple') {
+        return getMultipleDayType(day);
+      }
+      if (type === 'range') {
+        return getRangeDayType(day);
+      }
+    } else if (type === 'single') {
+      return (0, _utils2.compareDay)(day, currentDate) === 0 ? 'selected' : '';
+    }
+    return '';
+  };
+  const getBottomInfo = dayType => {
+    if (props.type === 'range') {
+      if (dayType === 'start') {
+        return locale.vanCalendar.start;
+      }
+      if (dayType === 'end') {
+        return locale.vanCalendar.end;
+      }
+      if (dayType === 'start-end') {
+        return locale.vanCalendar.startEnd;
+      }
+    }
+    return null;
+  };
+  const renderTitle = () => {
+    if (props.showMonthTitle) {
+      return (0, _jsxRuntime().jsx)("div", Object.assign({
+        className: (0, _clsx().default)(bem('month-title'))
+      }, {
+        children: title
+      }));
+    }
+    return null;
+  };
+  const renderMark = () => {
+    if (props.showMark && shouldRender) {
+      return (0, _jsxRuntime().jsx)("div", Object.assign({
+        className: (0, _clsx().default)(bem('month-mark'))
+      }, {
+        children: props.date.getMonth() + 1
+      }));
+    }
+    return null;
+  };
+  const placeholders = (0, _react().useMemo)(() => {
+    const count = Math.ceil((totalDay + offset) / 7);
+    return Array(count).fill({
+      type: 'placeholder'
+    });
+  }, [totalDay, offset]);
+  const days = (0, _react().useMemo)(() => {
+    const internalDays = [];
+    const year = props.date.getFullYear();
+    const month = props.date.getMonth();
+    for (let day = 1; day <= totalDay; day++) {
+      const date = new Date(year, month, day);
+      const type = getDayType(date);
+      let config = {
+        date,
+        type,
+        text: day,
+        bottomInfo: getBottomInfo(type)
+      };
+      if (props.formatter) {
+        config = props.formatter(config);
+      }
+      internalDays.push(config);
+    }
+    return internalDays;
+  }, [getDayType, props.date, props.formatter]);
+  const renderDay = (item, index) => (0, _jsxRuntime().jsx)(_CalendarDay.default, {
+    item: item,
+    index: index,
+    color: props.color,
+    offset: offset,
+    rowHeight: rowHeight,
+    onClick: props.onClick,
+    topInfoRender: props.topInfoRender,
+    bottomInfoRender: props.bottomInfoRender
+  }, index);
+  const renderDays = () => (0, _jsxRuntime().jsxs)("div", Object.assign({
+    ref: daysRef,
+    role: 'grid',
+    className: (0, _clsx().default)(bem('days'))
+  }, {
+    children: [renderMark(), (shouldRender ? days : placeholders).map(renderDay)]
+  }));
+  (0, _react().useImperativeHandle)(ref, () => ({
+    getTitle,
+    getHeight: () => height.current,
+    setVisible,
+    scrollIntoView
+  }));
+  return (0, _jsxRuntime().jsxs)("div", Object.assign({
+    className: (0, _clsx().default)(bem('month')),
+    ref: setMonthRef
+  }, {
+    children: [renderTitle(), renderDays()]
+  }));
+});
+var _default = exports.default = CalenderMonth;

package/lib/calendar/PropsType.d.ts

@@ -0,0 +1,118 @@
+import React from 'react';
+import { PickerPopupActions } from '../picker/PropsType';
+import { PopupPosition } from '../popup/PropsType';
+import { BaseTypeProps } from '../utils';
+export declare type CalendarValue = Date | Date[];
+export declare type CalendarType = 'single' | 'range' | 'multiple';
+export declare type CalendarDayType = '' | 'start' | 'start-end' | 'middle' | 'end' | 'selected' | 'multiple-middle' | 'multiple-selected' | 'disabled' | 'placeholder';
+export declare type CalendarDayItem = {
+    date?: Date;
+    text?: string | number;
+    type?: CalendarDayType;
+    topInfo?: string;
+    className?: unknown;
+    bottomInfo?: string;
+};
+export declare type CalendarExpose = {
+    reset: (date?: Date | Date[]) => void;
+    scrollToDate: (targetDate: Date) => void;
+} & PickerPopupActions;
+export declare type CalendarInstance = CalendarExpose;
+export declare type CalendarMonthInstance = {
+    showed?: boolean;
+    getTitle: () => string | React.ReactNode;
+    getHeight: () => number;
+    setVisible: (value?: boolean | undefined) => void;
+    scrollIntoView: (body: Element) => void;
+};
+export interface CalendarHeaderProps extends BaseTypeProps {
+    title?: string | React.ReactNode;
+    subtitle?: string | React.ReactNode;
+    weekdays?: React.ReactNode[];
+    showTitle?: boolean;
+    showSubtitle?: boolean;
+    firstDayOfWeek?: number;
+    onClickSubtitle?: (e: React.MouseEvent) => void;
+}
+export interface CalendarDayProps extends BaseTypeProps {
+    color?: string;
+    index?: number;
+    rowHeight?: string;
+    offset?: number;
+    item: CalendarDayItem;
+    onClick?: (item: CalendarDayItem) => void;
+    topInfoRender?: (day: CalendarDayItem) => React.ReactNode;
+    bottomInfoRender?: (day: CalendarDayItem) => React.ReactNode;
+}
+export interface CalendarMonthProps extends BaseTypeProps {
+    type?: CalendarType;
+    color?: string;
+    showMark?: boolean;
+    rowHeight?: number | string;
+    formatter?: (item: CalendarDayItem) => CalendarDayItem;
+    formatMonthTitle?: (date: Date) => React.ReactNode;
+    currentDate?: Date | Date[];
+    allowSameDay?: boolean;
+    showSubtitle?: boolean;
+    showMonthTitle?: boolean;
+    firstDayOfWeek?: number;
+    date: Date;
+    minDate?: Date;
+    maxDate?: Date;
+    lazyRender?: boolean;
+    topInfoRender?: (day: CalendarDayItem) => React.ReactNode;
+    bottomInfoRender?: (day: CalendarDayItem) => React.ReactNode;
+    onClick?: (item: CalendarDayItem) => void;
+}
+export interface CalendarProps extends Omit<BaseTypeProps, 'children'> {
+    visible?: boolean;
+    title?: string | React.ReactNode;
+    subtitle?: string | React.ReactNode;
+    /** 自定义星期文案 */
+    weekdays?: React.ReactNode[];
+    color?: string;
+    round?: boolean;
+    readOnly?: boolean;
+    poppable?: boolean;
+    showMark?: boolean;
+    showTitle?: boolean;
+    formatter?: (item: CalendarDayItem) => CalendarDayItem;
+    /** 自定义月标题 */
+    formatMonthTitle?: (date: Date) => React.ReactNode;
+    rowHeight?: number | string;
+    confirmText?: string;
+    rangePrompt?: string;
+    showConfirm?: boolean;
+    lazyRender?: boolean;
+    value?: CalendarValue | null;
+    defaultValue?: any;
+    allowSameDay?: boolean;
+    showSubtitle?: boolean;
+    closeOnPopstate?: boolean;
+    confirmDisabledText?: string;
+    closeOnClickOverlay?: boolean;
+    safeAreaInsetBottom?: boolean;
+    type?: CalendarType;
+    position?: PopupPosition;
+    maxRange?: number | string;
+    minDate?: Date;
+    maxDate?: Date;
+    firstDayOfWeek?: number | string;
+    showRangePrompt?: boolean;
+    footer?: React.ReactNode;
+    horizontal?: boolean;
+    topInfoRender?: (day: CalendarDayItem) => React.ReactNode;
+    bottomInfoRender?: (day: CalendarDayItem) => React.ReactNode;
+    onSelect?: (value: CalendarValue) => void;
+    onConfirm?: (value: CalendarValue) => void;
+    onClose?: () => void;
+    onClosed?: () => void;
+    onUnselect?: (value: Date) => void;
+    onMonthShow?: (value: {
+        date: Date;
+        title: string;
+    }) => void;
+    onOverRange?: () => void;
+    onClickSubtitle?: (e: React.MouseEvent) => void;
+    children?: (value: CalendarValue, actions: PickerPopupActions) => React.ReactNode;
+}

package/lib/calendar/PropsType.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/lib/calendar/index.d.ts

@@ -0,0 +1,5 @@
+import './style/index.less';
+import Calendar from './Calendar';
+export default Calendar;
+export { Calendar };
+export type { CalendarProps, CalendarType, CalendarDayItem, CalendarDayType, CalendarInstance, } from './PropsType';

package/lib/calendar/index.js

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

package/lib/calendar/style/index.css

@@ -0,0 +1,186 @@
+:root {
+  --rv-calendar-background-color: var(--rv-white);
+  --rv-calendar-popup-height: 80%;
+  --rv-calendar-header-box-shadow: 0 2px 10px rgba(125, 126, 128, 0.16);
+  --rv-calendar-header-title-height: 44px;
+  --rv-calendar-header-title-font-size: var(--rv-font-size-lg);
+  --rv-calendar-header-subtitle-font-size: var(--rv-font-size-md);
+  --rv-calendar-weekdays-height: 30px;
+  --rv-calendar-weekdays-font-size: var(--rv-font-size-sm);
+  --rv-calendar-month-title-font-size: var(--rv-font-size-md);
+  --rv-calendar-month-mark-color: rgba(242, 243, 245, 0.8);
+  --rv-calendar-month-mark-font-size: 160px;
+  --rv-calendar-day-height: 64px;
+  --rv-calendar-day-font-size: var(--rv-font-size-lg);
+  --rv-calendar-range-edge-color: var(--rv-white);
+  --rv-calendar-range-edge-background-color: var(--rv-danger-color);
+  --rv-calendar-range-middle-color: var(--rv-danger-color);
+  --rv-calendar-range-middle-background-opacity: 0.1;
+  --rv-calendar-selected-day-size: 54px;
+  --rv-calendar-selected-day-color: var(--rv-white);
+  --rv-calendar-info-font-size: var(--rv-font-size-xs);
+  --rv-calendar-info-line-height: var(--rv-line-height-xs);
+  --rv-calendar-selected-day-background-color: var(--rv-danger-color);
+  --rv-calendar-day-disabled-color: var(--rv-gray-5);
+  --rv-calendar-confirm-button-height: 36px;
+  --rv-calendar-confirm-button-margin: 7px 0;
+}
+.rv-calendar {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  background-color: var(--rv-calendar-background-color);
+}
+.rv-calendar__popup.rv-popup--top,
+.rv-calendar__popup.rv-popup--bottom {
+  height: var(--rv-calendar-popup-height);
+}
+.rv-calendar__popup.rv-popup--left,
+.rv-calendar__popup.rv-popup--right {
+  height: 100%;
+}
+.rv-calendar__popup .rv-popup__close-icon {
+  top: 11px;
+}
+.rv-calendar__header {
+  flex-shrink: 0;
+  box-shadow: var(--rv-calendar-header-box-shadow);
+}
+.rv-calendar__month-title,
+.rv-calendar__header-title,
+.rv-calendar__header-subtitle {
+  height: var(--rv-calendar-header-title-height);
+  font-weight: var(--rv-font-weight-bold);
+  line-height: var(--rv-calendar-header-title-height);
+  text-align: center;
+}
+.rv-calendar__header-title {
+  font-size: var(--rv-calendar-header-title-font-size);
+}
+.rv-calendar__header-subtitle {
+  font-size: var(--rv-calendar-header-subtitle-font-size);
+}
+.rv-calendar__month-title {
+  font-size: var(--rv-calendar-month-title-font-size);
+}
+.rv-calendar__weekdays {
+  display: flex;
+}
+.rv-calendar__weekday {
+  flex: 1;
+  font-size: var(--rv-calendar-weekdays-font-size);
+  line-height: var(--rv-calendar-weekdays-height);
+  text-align: center;
+}
+.rv-calendar__body {
+  flex: 1;
+  overflow: auto;
+  -webkit-overflow-scrolling: touch;
+}
+.rv-calendar__horizontal-body {
+  flex: 1;
+  overflow-x: hidden;
+  overflow-y: scroll;
+}
+.rv-calendar__days {
+  position: relative;
+  display: flex;
+  flex-wrap: wrap;
+  user-select: none;
+}
+.rv-calendar__month-mark {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  z-index: 0;
+  color: var(--rv-calendar-month-mark-color);
+  font-size: var(--rv-calendar-month-mark-font-size);
+  transform: translate(-50%, -50%);
+  pointer-events: none;
+  white-space: nowrap;
+}
+.rv-calendar__day,
+.rv-calendar__selected-day {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+}
+.rv-calendar__day {
+  position: relative;
+  width: 14.285%;
+  height: var(--rv-calendar-day-height);
+  font-size: var(--rv-calendar-day-font-size);
+  cursor: pointer;
+}
+.rv-calendar__day--end,
+.rv-calendar__day--start,
+.rv-calendar__day--start-end,
+.rv-calendar__day--multiple-middle,
+.rv-calendar__day--multiple-selected {
+  color: var(--rv-calendar-range-edge-color);
+  background-color: var(--rv-calendar-range-edge-background-color);
+}
+.rv-calendar__day--start {
+  border-radius: var(--rv-border-radius-md) 0 0 var(--rv-border-radius-md);
+}
+.rv-calendar__day--end {
+  border-radius: 0 var(--rv-border-radius-md) var(--rv-border-radius-md) 0;
+}
+.rv-calendar__day--start-end,
+.rv-calendar__day--multiple-selected {
+  border-radius: var(--rv-border-radius-md);
+}
+.rv-calendar__day--middle {
+  color: var(--rv-calendar-range-middle-color);
+}
+.rv-calendar__day--middle::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  background-color: currentColor;
+  opacity: var(--rv-calendar-range-middle-background-opacity);
+  content: '';
+}
+.rv-calendar__day--disabled {
+  color: var(--rv-calendar-day-disabled-color);
+  cursor: default;
+}
+.rv-calendar__top-info,
+.rv-calendar__bottom-info {
+  position: absolute;
+  right: 0;
+  left: 0;
+  font-size: var(--rv-calendar-info-font-size);
+  line-height: var(--rv-calendar-info-line-height);
+}
+@media (max-width: 350px) {
+  .rv-calendar__top-info,
+  .rv-calendar__bottom-info {
+    font-size: 9px;
+  }
+}
+.rv-calendar__top-info {
+  top: 6px;
+}
+.rv-calendar__bottom-info {
+  bottom: 6px;
+}
+.rv-calendar__selected-day {
+  width: var(--rv-calendar-selected-day-size);
+  height: var(--rv-calendar-selected-day-size);
+  color: var(--rv-calendar-selected-day-color);
+  background-color: var(--rv-calendar-selected-day-background-color);
+  border-radius: var(--rv-border-radius-md);
+}
+.rv-calendar__footer {
+  flex-shrink: 0;
+  padding-right: var(--rv-padding-md);
+  padding-left: var(--rv-padding-md);
+}
+.rv-calendar__confirm.rv-button {
+  height: var(--rv-calendar-confirm-button-height);
+  margin: var(--rv-calendar-confirm-button-margin);
+}

package/lib/calendar/utils.d.ts

@@ -0,0 +1,10 @@
+export declare function formatMonthTitle(date: Date): [number, number];
+export declare function compareMonth(date1: Date, date2: Date): 0 | 1 | -1;
+export declare function compareDay(day1: Date, day2: Date): 0 | 1 | -1;
+export declare const cloneDate: (date: Date) => Date;
+export declare const cloneDates: (dates: Date | Date[]) => Date | Date[];
+export declare function getDayByOffset(date: Date, offset: number): Date;
+export declare const getPrevDay: (date: Date) => Date;
+export declare const getNextDay: (date: Date) => Date;
+export declare const getToday: () => Date;
+export declare function calcDateNum(date: [Date, Date]): number;