@nutui/nutui-react-taro 2.0.0-alpha.4 → 2.0.0-alpha.6

package/dist/esm/calendaritem.taro-3e5f114e.js

@@ -0,0 +1,732 @@
+import React, { useState, useRef, useEffect } from "react";
+import classNames from "classnames";
+import { ScrollView } from "@tarojs/components";
+import { nextTick } from "@tarojs/taro";
+import { c as cn } from "./bem-cdccae08.js";
+import { u as useConfig } from "./configprovider.taro-25758d9f.js";
+const Utils = {
+  /**
+   * 是否为闫年
+   * @return {Boolse} true|false
+   */
+  isLeapYear(y) {
+    return y % 4 == 0 && y % 100 != 0 || y % 400 == 0;
+  },
+  /**
+   * 返回星期数
+   * @return {String}
+   */
+  getWhatDay(year, month, day) {
+    const date = /* @__PURE__ */ new Date(`${year}/${month}/${day}`);
+    const index = date.getDay();
+    const dayNames = [
+      "星期日",
+      "星期一",
+      "星期二",
+      "星期三",
+      "星期四",
+      "星期五",
+      "星期六"
+    ];
+    return dayNames[index];
+  },
+  /**
+   * 返回星期数
+   * @return {Number}
+   */
+  getMonthPreDay(year, month) {
+    const date = /* @__PURE__ */ new Date(`${year}/${month}/01`);
+    let day = date.getDay();
+    if (day == 0) {
+      day = 7;
+    }
+    return day;
+  },
+  /**
+   * 返回月份天数
+   * @return {Number}
+   */
+  getMonthDays(year, month) {
+    if (/^0/.test(month)) {
+      month = month.split("")[1];
+    }
+    return [
+      0,
+      31,
+      this.isLeapYear(Number(year)) ? 29 : 28,
+      31,
+      30,
+      31,
+      30,
+      31,
+      31,
+      30,
+      31,
+      30,
+      31
+    ][month];
+  },
+  /**
+   * 补齐数字位数
+   * @return {string}
+   */
+  getNumTwoBit(n) {
+    n = Number(n);
+    return (n > 9 ? "" : "0") + n;
+  },
+  /**
+   * 日期对象转成字符串
+   * @return {string}
+   */
+  date2Str(date, split) {
+    split = split || "-";
+    const y = date.getFullYear();
+    const m = this.getNumTwoBit(date.getMonth() + 1);
+    const d = this.getNumTwoBit(date.getDate());
+    return [y, m, d].join(split);
+  },
+  /**
+   * 返回日期格式字符串
+   * @param {Number} 0返回今天的日期、1返回明天的日期，2返回后天得日期，依次类推
+   * @return {string} '2014-12-31'
+   */
+  getDay(i) {
+    i = i || 0;
+    let date = /* @__PURE__ */ new Date();
+    const diff = i * (1e3 * 60 * 60 * 24);
+    date = new Date(date.getTime() + diff);
+    return this.date2Str(date);
+  },
+  /**
+   * 时间比较
+   * @return {Boolean}
+   */
+  compareDate(date1, date2) {
+    const startTime = new Date(date1.replace("-", "/").replace("-", "/"));
+    const endTime = new Date(date2.replace("-", "/").replace("-", "/"));
+    if (startTime >= endTime) {
+      return false;
+    }
+    return true;
+  },
+  /**
+   * 时间是否相等
+   * @return {Boolean}
+   */
+  isEqual(date1, date2) {
+    const startTime = new Date(date1).getTime();
+    const endTime = new Date(date2).getTime();
+    if (startTime == endTime) {
+      return true;
+    }
+    return false;
+  }
+};
+const _window = window;
+function requestAniFrame() {
+  if (typeof _window !== "undefined") {
+    return _window.requestAnimationFrame || _window.webkitRequestAnimationFrame || function(callback) {
+      _window.setTimeout(callback, 1e3 / 60);
+    };
+  } else {
+    return function(callback) {
+      setTimeout(callback, 1e3 / 60);
+    };
+  }
+}
+const requestAniFrame$1 = requestAniFrame();
+const defaultProps = {
+  type: "one",
+  isAutoBackFill: false,
+  poppable: true,
+  visible: false,
+  title: "日历选择",
+  defaultValue: "",
+  startDate: Utils.getDay(0),
+  endDate: Utils.getDay(365),
+  showToday: true,
+  startText: "开始",
+  endText: "结束",
+  confirmText: "确认",
+  showTitle: true,
+  showSubTitle: true,
+  toDateAnimation: true,
+  onBtn: void 0,
+  onDay: void 0,
+  onTopInfo: void 0,
+  onBottomInfo: void 0,
+  onChoose: (data) => {
+  },
+  onUpdate: () => {
+  },
+  onSelected: (data) => {
+  },
+  onYearMonthChange: (data) => {
+  }
+};
+const CalendarItem = React.forwardRef((props, ref) => {
+  const { locale } = useConfig();
+  const { type, isAutoBackFill, poppable, title, defaultValue, showToday, startText, endText, confirmText, showTitle, showSubTitle, toDateAnimation, onBtn, onDay, onTopInfo, onBottomInfo, onChoose, onUpdate, onSelected, onYearMonthChange } = { ...defaultProps, ...props };
+  const weeks = locale.calendaritem.weekdays;
+  const [yearMonthTitle, setYearMonthTitle] = useState("");
+  const [monthsData, setMonthsData] = useState([]);
+  const [translateY, setTranslateY] = useState(0);
+  const [monthDefaultRange, setMonthDefaultRange] = useState([]);
+  const [scrollTop, setScrollTop] = useState(0);
+  const [scrollWithAnimation, setScrollWithAnimation] = useState(false);
+  const [state] = useState({
+    currDate: "",
+    propStartDate: "",
+    propEndDate: "",
+    unLoadPrev: false,
+    touchParams: {
+      startY: 0,
+      endY: 0,
+      startTime: 0,
+      endTime: 0,
+      lastY: 0,
+      lastTime: 0
+    },
+    transformY: 0,
+    scrollDistance: 0,
+    defaultData: [],
+    chooseData: [],
+    monthsData: [],
+    dayPrefix: "calendar-month-day",
+    startData: "",
+    endData: "",
+    isRange: props.type === "range",
+    timer: 0,
+    currentIndex: 0,
+    avgHeight: 0,
+    monthsNum: 0
+  });
+  const weeksPanel = useRef(null);
+  const months = useRef(null);
+  const monthsPanel = useRef(null);
+  const viewArea = useRef(null);
+  let viewHeight = 0;
+  const b = cn("calendar");
+  const classes = classNames({
+    [`${b("")}-tile`]: !poppable,
+    [`${b("")}-nofooter`]: !!isAutoBackFill
+  }, b(""));
+  const headerClasses = classNames({
+    [`${b("")}-header`]: true,
+    [`${b("")}-header-tile`]: !poppable
+  });
+  const monthitemclasses = classNames({
+    "calendar-month-item": true,
+    [`${type === "range" ? "month-item-range" : ""}`]: true
+  });
+  const splitDate = (date) => {
+    return date.split("-");
+  };
+  const isStart = (currDate) => {
+    return Utils.isEqual(state.currDate[0], currDate);
+  };
+  const isEnd = (currDate) => {
+    return Utils.isEqual(state.currDate[1], currDate);
+  };
+  const isMultiple = (currDate) => {
+    if (state.currDate.length > 0) {
+      return state.currDate.some((item) => {
+        return Utils.isEqual(item, currDate);
+      });
+    }
+    return false;
+  };
+  const getCurrDate = (day, month) => {
+    return `${month.curData[0]}-${month.curData[1]}-${Utils.getNumTwoBit(+day.day)}`;
+  };
+  const getClass = (day, month) => {
+    const currDate = getCurrDate(day, month);
+    if (day.type === "curr") {
+      if (Utils.isEqual(state.currDate, currDate) || type === "range" && (isStart(currDate) || isEnd(currDate)) || type === "multiple" && isMultiple(currDate)) {
+        return `${state.dayPrefix}-active`;
+      }
+      if (state.propStartDate && Utils.compareDate(currDate, state.propStartDate) || state.propEndDate && Utils.compareDate(state.propEndDate, currDate)) {
+        return `${state.dayPrefix}-disabled`;
+      }
+      if (type === "range" && Array.isArray(state.currDate) && Object.values(state.currDate).length === 2 && Utils.compareDate(state.currDate[0], currDate) && Utils.compareDate(currDate, state.currDate[1])) {
+        return `${state.dayPrefix}-choose`;
+      }
+      return null;
+    }
+    return `${state.dayPrefix}-disabled`;
+  };
+  const isActive = (day, month) => {
+    return state.isRange && day.type === "curr" && getClass(day, month) === "calendar-month-day-active";
+  };
+  const isCurrDay = (month, day) => {
+    const date = `${month.curData[0]}-${month.curData[1]}-${day}`;
+    return Utils.isEqual(date, Utils.date2Str(/* @__PURE__ */ new Date()));
+  };
+  const confirm = () => {
+    const { type: type2 } = props;
+    if (type2 === "range" && state.chooseData.length === 2 || type2 !== "range") {
+      const chooseData = state.chooseData.slice(0);
+      onChoose && onChoose(chooseData);
+      if (poppable) {
+        onUpdate && onUpdate();
+      }
+    }
+  };
+  const chooseDay = (day, month, isFirst) => {
+    if (getClass(day, month) !== `${state.dayPrefix}-disabled`) {
+      const { type: type2 } = props;
+      const days = [...month.curData];
+      days[2] = typeof day.day === "number" ? Utils.getNumTwoBit(day.day) : day.day;
+      days[3] = `${days[0]}-${days[1]}-${days[2]}`;
+      days[4] = Utils.getWhatDay(+days[0], +days[1], +days[2]);
+      if (type2 === "multiple") {
+        if (state.currDate.length > 0) {
+          let hasIndex = "";
+          state.currDate.forEach((item, index) => {
+            if (item === days[3]) {
+              hasIndex = index;
+            }
+          });
+          if (isFirst) {
+            state.chooseData.push([...days]);
+          } else if (hasIndex !== "") {
+            state.currDate.splice(hasIndex, 1);
+            state.chooseData.splice(hasIndex, 1);
+          } else {
+            state.currDate.push(days[3]);
+            state.chooseData.push([...days]);
+          }
+        } else {
+          state.currDate = [days[3]];
+          state.chooseData = [[...days]];
+        }
+      } else if (type2 === "range") {
+        const curDataLength = Object.values(state.currDate).length;
+        if (curDataLength === 2 || curDataLength === 0) {
+          state.currDate = [days[3]];
+        } else if (Utils.compareDate(state.currDate[0], days[3])) {
+          Array.isArray(state.currDate) && state.currDate.push(days[3]);
+        } else {
+          Array.isArray(state.currDate) && state.currDate.unshift(days[3]);
+        }
+        if (state.chooseData.length === 2 || !state.chooseData.length) {
+          state.chooseData = [[...days]];
+        } else if (Utils.compareDate(state.chooseData[0][3], days[3])) {
+          state.chooseData = [...state.chooseData, [...days]];
+        } else {
+          state.chooseData = [[...days], ...state.chooseData];
+        }
+      } else {
+        state.currDate = days[3];
+        state.chooseData = [...days];
+      }
+      if (!isFirst) {
+        onSelected && onSelected(state.chooseData);
+        if (isAutoBackFill || !poppable) {
+          confirm();
+        }
+      }
+      setMonthsData(state.monthsData.slice());
+    }
+  };
+  const isStartTip = (day, month) => {
+    return isActive(day, month) && isStart(getCurrDate(day, month));
+  };
+  const isEndTip = (day, month) => {
+    if (state.currDate.length >= 2 && isEnd(getCurrDate(day, month))) {
+      return isActive(day, month);
+    }
+    return false;
+  };
+  const rangeTip = () => {
+    if (state.currDate.length >= 2) {
+      return Utils.isEqual(state.currDate[0], state.currDate[1]);
+    }
+    return false;
+  };
+  const getCurrData = (type2) => {
+    const monthData = type2 === "prev" ? state.monthsData[0] : state.monthsData[state.monthsData.length - 1];
+    let year = parseInt(monthData.curData[0]);
+    let month = parseInt(monthData.curData[1].toString().replace(/^0/, ""));
+    switch (type2) {
+      case "prev":
+        month === 1 && (year -= 1);
+        month = month === 1 ? 12 : --month;
+        break;
+      case "next":
+        month === 12 && (year += 1);
+        month = month === 12 ? 1 : ++month;
+        break;
+    }
+    return [
+      year,
+      Utils.getNumTwoBit(month),
+      Utils.getMonthDays(String(year), String(month))
+    ];
+  };
+  const getDaysStatus = (days, type2, dateInfo) => {
+    const { year, month } = dateInfo;
+    if (type2 === "prev" && days >= 7) {
+      days -= 7;
+    }
+    return Array.from(Array(days), (v, k) => {
+      return {
+        day: k + 1,
+        type: type2,
+        year,
+        month
+      };
+    });
+  };
+  const getPreDaysStatus = (days, type2, dateInfo, preCurrMonthDays) => {
+    const { year, month } = dateInfo;
+    if (type2 === "prev" && days >= 7) {
+      days -= 7;
+    }
+    const months2 = Array.from(Array(preCurrMonthDays), (v, k) => {
+      return {
+        day: k + 1,
+        type: type2,
+        year,
+        month
+      };
+    });
+    return months2.slice(preCurrMonthDays - days);
+  };
+  const getMonth = (curData, type2) => {
+    const preMonthDays = Utils.getMonthPreDay(+curData[0], +curData[1]);
+    let preMonth = +curData[1] - 1;
+    let preYear = curData[0];
+    if (preMonth <= 0) {
+      preMonth = 12;
+      preYear += 1;
+    }
+    const currMonthDays = Utils.getMonthDays(curData[0], curData[1]);
+    const preCurrMonthDays = Utils.getMonthDays(`${preYear}`, `${preMonth}`);
+    const title2 = {
+      year: curData[0],
+      month: curData[1]
+    };
+    const monthInfo = {
+      curData,
+      title: locale.calendaritem.monthTitle(title2.year, title2.month),
+      monthData: [
+        ...getPreDaysStatus(preMonthDays, "prev", { month: preMonth, year: preYear }, preCurrMonthDays),
+        ...getDaysStatus(currMonthDays, "curr", title2)
+      ]
+    };
+    monthInfo.cssHeight = 39 + (monthInfo.monthData.length > 35 ? 384 : 320);
+    let cssScrollHeight = 0;
+    if (state.monthsData.length > 0) {
+      cssScrollHeight = state.monthsData[state.monthsData.length - 1].cssScrollHeight + state.monthsData[state.monthsData.length - 1].cssHeight;
+    }
+    monthInfo.cssScrollHeight = cssScrollHeight;
+    if (type2 === "next") {
+      if (!state.endData || !Utils.compareDate(`${state.endData[0]}-${state.endData[1]}-${Utils.getMonthDays(state.endData[0], state.endData[1])}`, `${curData[0]}-${curData[1]}-${curData[2]}`)) {
+        state.monthsData.push(monthInfo);
+      }
+    } else if (!state.startData || !Utils.compareDate(`${curData[0]}-${curData[1]}-${curData[2]}`, `${state.startData[0]}-${state.startData[1]}-01`)) {
+      state.monthsData.unshift(monthInfo);
+    }
+    setMonthsData(state.monthsData);
+  };
+  const setReachedYearMonthInfo = () => {
+    const currentMonthsData = state.monthsData[state.currentIndex];
+    const [year, month] = currentMonthsData.curData;
+    if (currentMonthsData.title === yearMonthTitle)
+      return;
+    onYearMonthChange && onYearMonthChange([year, month, `${year}-${month}`]);
+    setYearMonthTitle(currentMonthsData.title);
+  };
+  const setDefaultRange = (monthsNum, current) => {
+    let start = 0;
+    let end = 0;
+    if (monthsNum >= 3) {
+      if (current > 0 && current < monthsNum) {
+        start = current - 1;
+        end = current + 3;
+      } else if (current === 0) {
+        start = current;
+        end = current + 4;
+      } else if (current === monthsNum) {
+        start = current - 2;
+        end = current + 2;
+      }
+    } else {
+      start = 0;
+      end = monthsNum + 2;
+    }
+    setMonthDefaultRange([start, end]);
+    setTranslateY(state.monthsData[start].cssScrollHeight);
+  };
+  const monthsViewScroll = (e) => {
+    if (state.monthsData.length <= 1) {
+      return;
+    }
+    const target = e.target;
+    const currentScrollTop = target.scrollTop;
+    let current = Math.floor(currentScrollTop / state.avgHeight);
+    if (current === 0) {
+      if (currentScrollTop >= state.monthsData[current + 1].cssScrollHeight) {
+        current += 1;
+      }
+    } else if (current > 0 && current < state.monthsNum - 1) {
+      if (currentScrollTop >= state.monthsData[current + 1].cssScrollHeight) {
+        current += 1;
+      }
+      if (currentScrollTop < state.monthsData[current].cssScrollHeight) {
+        current -= 1;
+      }
+    } else {
+      const viewPosition = Math.round(currentScrollTop + viewHeight);
+      if (viewPosition < state.monthsData[current].cssScrollHeight + state.monthsData[current].cssHeight && currentScrollTop > state.monthsData[current - 1].cssScrollHeight) {
+        current -= 1;
+      }
+      if (current + 1 <= state.monthsNum && viewPosition >= state.monthsData[current + 1].cssScrollHeight + state.monthsData[current + 1].cssHeight) {
+        current += 1;
+      }
+      if (current >= 1 && currentScrollTop < state.monthsData[current - 1].cssScrollHeight) {
+        current -= 1;
+      }
+    }
+    if (state.currentIndex !== current) {
+      state.currentIndex = current;
+      setDefaultRange(state.monthsNum, current);
+    }
+    setReachedYearMonthInfo();
+  };
+  const initData = () => {
+    const propStartDate = props.startDate ? props.startDate : Utils.getDay(0);
+    const propEndDate = props.endDate ? props.endDate : Utils.getDay(365);
+    state.propStartDate = propStartDate;
+    state.propEndDate = propEndDate;
+    state.startData = splitDate(propStartDate);
+    state.endData = splitDate(propEndDate);
+    if (defaultValue || Array.isArray(defaultValue) && defaultValue.length > 0) {
+      state.currDate = props.type !== "one" ? [...props.defaultValue] : props.defaultValue;
+    }
+    const startDate = {
+      year: Number(state.startData[0]),
+      month: Number(state.startData[1])
+    };
+    const endDate = {
+      year: Number(state.endData[0]),
+      month: Number(state.endData[1])
+    };
+    let monthsNum = endDate.month - startDate.month;
+    if (endDate.year - startDate.year > 0) {
+      monthsNum += 12 * (endDate.year - startDate.year);
+    }
+    if (monthsNum <= 0) {
+      monthsNum = 1;
+    }
+    getMonth(state.startData, "next");
+    let i = 1;
+    do {
+      getMonth(getCurrData("next"), "next");
+    } while (i++ < monthsNum);
+    state.monthsNum = monthsNum;
+    if (type === "range" && Array.isArray(state.currDate)) {
+      if (state.currDate.length > 0) {
+        if (propStartDate && Utils.compareDate(state.currDate[0], propStartDate)) {
+          state.currDate.splice(0, 1, propStartDate);
+        }
+        if (propEndDate && Utils.compareDate(propEndDate, state.currDate[1])) {
+          state.currDate.splice(1, 1, propEndDate);
+        }
+        state.defaultData = [
+          ...splitDate(state.currDate[0]),
+          ...splitDate(state.currDate[1])
+        ];
+      }
+    } else if (props.type === "multiple" && Array.isArray(state.currDate)) {
+      if (state.currDate.length > 0) {
+        const defaultArr = [];
+        const obj = {};
+        state.currDate.forEach((item) => {
+          if (propStartDate && !Utils.compareDate(item, propStartDate) && propEndDate && !Utils.compareDate(propEndDate, item)) {
+            if (!Object.hasOwnProperty.call(obj, item)) {
+              defaultArr.push(item);
+              obj[item] = item;
+            }
+          }
+        });
+        state.currDate = [...defaultArr];
+        state.defaultData = [...splitDate(defaultArr[0])];
+      }
+    } else if (state.currDate) {
+      if (propStartDate && Utils.compareDate(state.currDate, propStartDate)) {
+        state.currDate = propStartDate;
+      } else if (propEndDate && !Utils.compareDate(state.currDate, propEndDate)) {
+        state.currDate = propEndDate;
+      }
+      state.defaultData = [...splitDate(state.currDate)];
+    }
+    let current = 0;
+    let lastCurrent = 0;
+    if (state.defaultData.length > 0) {
+      state.monthsData.forEach((item, index) => {
+        if (item.title === locale.calendaritem.monthTitle(state.defaultData[0], state.defaultData[1])) {
+          current = index;
+        }
+        if (props.type === "range") {
+          if (item.title === locale.calendaritem.monthTitle(state.defaultData[3], state.defaultData[4])) {
+            lastCurrent = index;
+          }
+        }
+      });
+    } else {
+      const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
+      const currentMonth = (/* @__PURE__ */ new Date()).getMonth() + 1;
+      const currentYearMonthIndex = state.monthsData.findIndex((item) => {
+        return +item.curData[0] === currentYear && +item.curData[1] === currentMonth;
+      });
+      if (currentYearMonthIndex > -1) {
+        current = currentYearMonthIndex;
+      }
+    }
+    setDefaultRange(monthsNum, current);
+    state.currentIndex = current;
+    setReachedYearMonthInfo();
+    if (state.defaultData.length > 0) {
+      if (type === "range") {
+        chooseDay({ day: state.defaultData[2], type: "curr" }, state.monthsData[state.currentIndex], true);
+        chooseDay({ day: state.defaultData[5], type: "curr" }, state.monthsData[lastCurrent], true);
+      } else if (type === "multiple") {
+        [...state.currDate].forEach((item) => {
+          const dateArr = splitDate(item);
+          let current2 = state.currentIndex;
+          state.monthsData.forEach((item2, index) => {
+            if (item2.title === locale.calendaritem.monthTitle(dateArr[0], dateArr[1])) {
+              current2 = index;
+            }
+          });
+          chooseDay({ day: dateArr[2], type: "curr" }, state.monthsData[current2], true);
+        });
+      } else {
+        chooseDay({ day: state.defaultData[2], type: "curr" }, state.monthsData[state.currentIndex], true);
+      }
+    }
+    const lastItem = state.monthsData[state.monthsData.length - 1];
+    const containerHeight = lastItem.cssHeight + lastItem.cssScrollHeight;
+    requestAniFrame$1(() => {
+      if (months && monthsPanel && viewArea) {
+        viewHeight = months.current.clientHeight;
+        monthsPanel.current.style.height = `${containerHeight}px`;
+        setScrollTop(state.monthsData[state.currentIndex].cssScrollHeight);
+        nextTick(() => setScrollWithAnimation(true));
+      }
+    });
+    state.avgHeight = Math.floor(containerHeight / (monthsNum + 1));
+  };
+  const resetRender = () => {
+    state.chooseData.splice(0);
+    state.monthsData.splice(0);
+    initData();
+  };
+  const scrollToDate = (date) => {
+    if (Utils.compareDate(date, state.propStartDate)) {
+      date = state.propStartDate;
+    } else if (!Utils.compareDate(date, state.propEndDate)) {
+      date = state.propEndDate;
+    }
+    const dateArr = splitDate(date);
+    state.monthsData.forEach((item, index) => {
+      if (item.title === locale.calendaritem.monthTitle(dateArr[0], dateArr[1])) {
+        if (months.current) {
+          const distance = state.monthsData[index].cssScrollHeight - months.current.scrollTop;
+          if (toDateAnimation) {
+            let flag = 0;
+            const interval = setInterval(() => {
+              flag++;
+              if (months.current) {
+                const offset = distance / 10;
+                months.current.scrollTop += offset;
+              }
+              if (flag >= 10) {
+                clearInterval(interval);
+                if (months.current) {
+                  months.current.scrollTop = state.monthsData[index].cssScrollHeight;
+                  setScrollTop(months.current.scrollTop);
+                }
+              }
+            }, 40);
+          } else {
+            months.current.scrollTop = state.monthsData[index].cssScrollHeight;
+            setScrollTop(months.current.scrollTop);
+          }
+        }
+      }
+    });
+  };
+  useEffect(() => {
+    initData();
+  }, []);
+  useEffect(() => {
+    poppable && resetRender();
+  }, [defaultValue]);
+  React.useImperativeHandle(ref, () => ({
+    scrollToDate
+  }));
+  return React.createElement(
+    React.Fragment,
+    null,
+    React.createElement(
+      "div",
+      { className: classes },
+      React.createElement(
+        "div",
+        { className: headerClasses },
+        showTitle && React.createElement("div", { className: "calendar-title" }, title || locale.calendaritem.title),
+        onBtn && React.createElement("div", { className: "calendar-top-slot" }, onBtn()),
+        showSubTitle && React.createElement("div", { className: "calendar-curr-month" }, yearMonthTitle),
+        React.createElement("div", { className: "calendar-weeks", ref: weeksPanel }, weeks.map((item) => React.createElement("div", { className: "calendar-week-item", key: item }, item)))
+      ),
+      React.createElement(
+        ScrollView,
+        { scrollTop, scrollY: true, type: "list", scrollWithAnimation, className: "nut-calendar-content", onScroll: monthsViewScroll, ref: months },
+        React.createElement(
+          "div",
+          { className: "calendar-months-panel", ref: monthsPanel },
+          React.createElement("div", { className: "viewArea", ref: viewArea, style: { transform: `translateY(${translateY}px)` } }, state.monthsData.slice(monthDefaultRange[0], monthDefaultRange[1]).map((month, key) => {
+            return React.createElement(
+              "div",
+              { className: "calendar-month", key },
+              React.createElement("div", { className: "calendar-month-title" }, month.title),
+              React.createElement(
+                "div",
+                { className: "calendar-month-con" },
+                React.createElement("div", { className: monthitemclasses }, month.monthData.map((day, i) => React.createElement(
+                  "div",
+                  { className: [
+                    "calendar-month-day",
+                    getClass(day, month)
+                  ].join(" "), onClick: () => {
+                    chooseDay(day, month);
+                  }, key: i },
+                  React.createElement("div", { className: "calendar-day" }, onDay ? onDay(day) : day.day),
+                  onTopInfo && React.createElement("div", { className: "calendar-curr-tips calendar-curr-tips-top" }, onTopInfo(day)),
+                  onBottomInfo && React.createElement("div", { className: "calendar-curr-tips calendar-curr-tips-bottom" }, onBottomInfo(day)),
+                  !onBottomInfo && showToday && isCurrDay(month, day.day) && React.createElement("div", { className: "calendar-curr-tip-curr" }, locale.calendaritem.today),
+                  isStartTip(day, month) && React.createElement("div", { className: `calendar-day-tip ${rangeTip() ? "calendar-curr-tips-top" : ""}` }, startText || locale.calendaritem.start),
+                  isEndTip(day, month) && React.createElement("div", { className: "calendar-day-tip" }, endText || locale.calendaritem.end)
+                )))
+              )
+            );
+          }))
+        )
+      ),
+      poppable && !isAutoBackFill ? React.createElement(
+        "div",
+        { className: "nut-calendar-footer" },
+        React.createElement("div", { className: "calendar-confirm-btn", onClick: confirm }, confirmText || locale.confirm)
+      ) : ""
+    )
+  );
+});
+CalendarItem.defaultProps = defaultProps;
+CalendarItem.displayName = "NutCalendarItem";
+export {
+  CalendarItem as C,
+  Utils as U
+};