@nutui/nutui-react 2.7.9 → 2.7.11

package/dist/nutui.react.es.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v2.7.9 Fri Feb 21 2025 17:10:51 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.7.11 Fri Mar 28 2025 13:38:10 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -594,7 +594,7 @@ const ComponentDefaults = {
   style: {}
 };
 const prefixCls$2 = "nut-button";
-const defaultProps$1t = {
+const defaultProps$1u = {
   ...ComponentDefaults,
   color: "",
   type: "default",
@@ -630,7 +630,7 @@ const Button = React__default.forwardRef(
       onClick,
       ...rest
     } = {
-      ...defaultProps$1t,
+      ...defaultProps$1u,
       ...props
     };
     const getStyle = useCallback(() => {
@@ -689,7 +689,7 @@ const Button = React__default.forwardRef(
 );
 Button.displayName = "NutButton";
 const CellGroupContext = createContext(null);
-const defaultProps$1s = {
+const defaultProps$1t = {
   ...ComponentDefaults,
   title: "",
   description: "",
@@ -698,7 +698,7 @@ const defaultProps$1s = {
 const classPrefix$r = "nut-cell-group";
 const CellGroup = (props) => {
   const { children, className, title, description, divider, ...rest } = {
-    ...defaultProps$1s,
+    ...defaultProps$1t,
     ...props
   };
   return /* @__PURE__ */ React__default.createElement("div", { className: classNames(classPrefix$r, className), ...rest }, title ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$r}-title` }, title) : null, description ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$r}-description` }, description) : null, /* @__PURE__ */ React__default.createElement(
@@ -710,7 +710,7 @@ const CellGroup = (props) => {
   ));
 };
 CellGroup.displayName = "NutCellGroup";
-const defaultProps$1r = {
+const defaultProps$1s = {
   ...ComponentDefaults,
   title: null,
   description: null,
@@ -737,7 +737,7 @@ const Cell = (props) => {
     style,
     ...rest
   } = {
-    ...defaultProps$1r,
+    ...defaultProps$1s,
     ...props
   };
   const handleClick2 = (event) => {
@@ -1750,6 +1750,10 @@ const zhCN = {
     start: "开始",
     confirm: "确认",
     title: "日历选择",
+    week: "周",
+    month: "月",
+    year: "年",
+    quarter: "季度",
     monthTitle: (year, month) => `${year}年${Number(month) < 10 ? `0${Number(month)}` : month}月`,
     today: "今天",
     loadPreviousMonth: "加载上一个月",
@@ -1940,7 +1944,7 @@ ConfigProvider.displayName = "NutConfigProvider";
 const pxCheck = (value) => {
   return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
 };
-const defaultProps$1q = {
+const defaultProps$1r = {
   ...ComponentDefaults,
   fit: "fill",
   position: "center",
@@ -1970,7 +1974,7 @@ const Image$1 = (props) => {
     onClick,
     onLoad,
     onError
-  } = { ...defaultProps$1q, ...props };
+  } = { ...defaultProps$1r, ...props };
   const [innerLoading, setInnerLoading] = useState(false);
   const [isError, setIsError] = useState(false);
   const [complete, setComplete] = useState(false);
@@ -2833,7 +2837,7 @@ const Overlay = (props) => {
 };
 Overlay.displayName = "NutOverlay";
 const DataContext$1 = createContext({});
-const defaultProps$1p = {
+const defaultProps$1q = {
   ...ComponentDefaults,
   span: "24",
   offset: "0",
@@ -2841,7 +2845,7 @@ const defaultProps$1p = {
 };
 const Col = (props) => {
   const { className, style, span, offset, children, onClick } = {
-    ...defaultProps$1p,
+    ...defaultProps$1q,
     ...props
   };
   const [colName, setColName] = useState("");
@@ -2874,7 +2878,7 @@ const Col = (props) => {
   );
 };
 Col.displayName = "NutCol";
-const defaultProps$1o = {
+const defaultProps$1p = {
   ...ComponentDefaults,
   contentPosition: "center",
   direction: "horizontal"
@@ -2882,7 +2886,7 @@ const defaultProps$1o = {
 const classPrefix$n = `nut-divider`;
 const Divider = (props) => {
   const { children, contentPosition, style, className, direction, ...rest } = {
-    ...defaultProps$1o,
+    ...defaultProps$1p,
     ...props
   };
   const classes = direction === "horizontal" ? classNames({
@@ -2903,7 +2907,7 @@ const gridContext = {
   }
 };
 const GridContext = React__default.createContext(gridContext);
-const defaultProps$1n = {
+const defaultProps$1o = {
   text: "",
   columns: 4,
   gap: 0,
@@ -2928,7 +2932,7 @@ const GridItem = (props) => {
     onClick,
     ...rest
   } = {
-    ...defaultProps$1n,
+    ...defaultProps$1o,
     ...props
   };
   const classPrefix2 = "nut-grid-item";
@@ -2987,7 +2991,7 @@ const GridItem = (props) => {
   );
 };
 GridItem.displayName = "NutGridItem";
-const defaultProps$1m = {
+const defaultProps$1n = {
   columns: 4,
   gap: 0,
   center: true,
@@ -3008,7 +3012,7 @@ const Grid = (props) => {
     className,
     onClick,
     ...rest
-  } = { ...defaultProps$1m, ...props };
+  } = { ...defaultProps$1n, ...props };
   const childrenDom = React__default.Children.toArray(children);
   const classPrefix2 = "nut-grid";
   const rootClass = () => {
@@ -3049,7 +3053,7 @@ const Layout = () => {
 };
 Layout.displayName = "NutLayout";
 const classPrefix$m = "nut-row";
-const defaultProps$1l = {
+const defaultProps$1m = {
   ...ComponentDefaults,
   type: "",
   justify: "start",
@@ -3069,7 +3073,7 @@ const Row = (props) => {
     gutter,
     onClick
   } = {
-    ...defaultProps$1l,
+    ...defaultProps$1m,
     ...props
   };
   const getClass = (prefix2, type22) => {
@@ -3103,12 +3107,12 @@ const Row = (props) => {
 };
 Row.displayName = "NutRow";
 const prefixCls$1 = "nut-space";
-const defaultProps$1k = {
+const defaultProps$1l = {
   direction: "horizontal"
 };
 const Space = (props) => {
   const { className, style, children, wrap, align, direction, justify } = {
-    ...defaultProps$1k,
+    ...defaultProps$1l,
     ...props
   };
   const cls = classNames(
@@ -3176,7 +3180,7 @@ function useWatch$1(dep, callback, config2 = { immediate: false }) {
     stop2.current = true;
   };
 }
-const defaultProps$1j = {
+const defaultProps$1k = {
   ...ComponentDefaults,
   position: "top",
   threshold: 0,
@@ -3194,7 +3198,7 @@ const Sticky = (props) => {
     threshold,
     onChange,
     ...rest
-  } = { ...defaultProps$1j, ...props };
+  } = { ...defaultProps$1k, ...props };
   const stickyRef = useRef(null);
   const rootRef = useRef(null);
   const [isFixed, setIsFixed] = useState(false);
@@ -3318,7 +3322,7 @@ const SafeArea = (props) => {
   );
 };
 SafeArea.displayName = "NutSafeArea";
-const defaultProps$1i = {
+const defaultProps$1j = {
   ...ComponentDefaults,
   target: "",
   threshold: 200,
@@ -3337,7 +3341,7 @@ const BackTop = (props) => {
     style,
     onClick
   } = {
-    ...defaultProps$1i,
+    ...defaultProps$1j,
     ...props
   };
   const classPrefix2 = "nut-backtop";
@@ -8230,7 +8234,7 @@ const host = createHost(primitives, {
 });
 const animated = host.animated;
 const elevatorContext = createContext({});
-const defaultProps$1h = {
+const defaultProps$1i = {
   ...ComponentDefaults,
   height: "200px",
   floorKey: "title",
@@ -8256,7 +8260,7 @@ const Elevator = (props) => {
     children,
     ...rest
   } = {
-    ...defaultProps$1h,
+    ...defaultProps$1i,
     ...props
   };
   const classPrefix2 = "nut-elevator";
@@ -8434,7 +8438,7 @@ const Elevator = (props) => {
 };
 Elevator.displayName = "NutElevator";
 Elevator.Context = elevatorContext;
-const defaultProps$1g = {
+const defaultProps$1h = {
   ...ComponentDefaults,
   activeText: "",
   inactiveText: "",
@@ -8462,7 +8466,7 @@ const FixedNav = (props) => {
     content,
     ...rest
   } = {
-    ...defaultProps$1g,
+    ...defaultProps$1h,
     ...props
   };
   const classPrefix2 = "nut-fixednav";
@@ -8515,7 +8519,7 @@ const FixedNav = (props) => {
   );
 };
 FixedNav.displayName = "NutFixedNav";
-const defaultProps$1f = {
+const defaultProps$1g = {
   ...ComponentDefaults,
   left: "",
   right: "",
@@ -8540,7 +8544,7 @@ const NavBar = (props) => {
     zIndex,
     onBackClick
   } = {
-    ...defaultProps$1f,
+    ...defaultProps$1g,
     ...props
   };
   const classPrefix2 = "nut-navbar";
@@ -8616,7 +8620,7 @@ const NavBar = (props) => {
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, safeAreaInsetTop && /* @__PURE__ */ React__default.createElement(SafeArea, { position: "top" }), fixed && placeholder ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-placeholder` }, renderWrapper()) : renderWrapper());
 };
 NavBar.displayName = "NutNavBar";
-const defaultProps$1e = {
+const defaultProps$1f = {
   ...ComponentDefaults,
   position: "center",
   transition: "",
@@ -8669,7 +8673,7 @@ const Popup = (props) => {
     afterShow,
     afterClose,
     onClick
-  } = { ...defaultProps$1e, ...props };
+  } = { ...defaultProps$1f, ...props };
   const nodeRef = React__default.useRef(null);
   let innerIndex = zIndex || _zIndex;
   const [index, setIndex] = useState(innerIndex);
@@ -8826,7 +8830,7 @@ const handleClick = (e) => {
   }
 };
 const OffsetContext = createContext(20);
-const defaultProps$1d = {
+const defaultProps$1e = {
   ...ComponentDefaults,
   position: "left",
   width: "80%"
@@ -8844,7 +8848,7 @@ const SideNavBar = (props) => {
     indent,
     ...rest
   } = {
-    ...defaultProps$1d,
+    ...defaultProps$1e,
     ...props
   };
   const innerIndent = indent ? Number(indent) : 20;
@@ -8894,13 +8898,13 @@ const SideNavBarItem = (props) => {
     title
   );
 };
-const defaultProps$1c = {
+const defaultProps$1d = {
   open: true
 };
 const SubSideNavBar = (props) => {
   const classPrefix2 = "nut-subsidenavbar";
   const { title, value, children, onClick, open, ...rest } = {
-    ...defaultProps$1c,
+    ...defaultProps$1d,
     ...props
   };
   const offset = useContext(OffsetContext);
@@ -8977,7 +8981,7 @@ function usePropsValue({
   );
   return [stateRef.current, setState];
 }
-const defaultProps$1b = {
+const defaultProps$1c = {
   ...ComponentDefaults,
   value: "",
   dot: false,
@@ -9002,7 +9006,7 @@ const Badge = (props) => {
     color,
     fill
   } = {
-    ...defaultProps$1b,
+    ...defaultProps$1c,
     ...props
   };
   const classPrefix2 = "nut-badge";
@@ -9056,7 +9060,7 @@ const Badge = (props) => {
 };
 Badge.displayName = "NutBadge";
 const TabbarContext = React__default.createContext(null);
-const defaultProps$1a = {
+const defaultProps$1b = {
   ...ComponentDefaults,
   title: "",
   icon: null,
@@ -9082,7 +9086,7 @@ const TabbarItem = (props) => {
     index,
     ...rest
   } = {
-    ...defaultProps$1a,
+    ...defaultProps$1b,
     ...props
   };
   const active = index === (ctx2 == null ? void 0 : ctx2.selectIndex);
@@ -9120,7 +9124,7 @@ const TabbarItem = (props) => {
     icon ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Badge, { ...badgeProps }, /* @__PURE__ */ React__default.createElement("div", { className: boxPrefix }, icon)), /* @__PURE__ */ React__default.createElement("div", { className: titleClass }, title)) : /* @__PURE__ */ React__default.createElement(Badge, { ...badgeProps }, /* @__PURE__ */ React__default.createElement("div", { className: titleClass }, title))
   );
 };
-const defaultProps$19 = {
+const defaultProps$1a = {
   ...ComponentDefaults,
   defaultValue: 0,
   fixed: false,
@@ -9143,7 +9147,7 @@ const Tabbar = (props) => {
     style,
     onSwitch
   } = {
-    ...defaultProps$19,
+    ...defaultProps$1a,
     ...props
   };
   const classPrefix2 = "nut-tabbar";
@@ -9185,14 +9189,14 @@ const Tabbar = (props) => {
 };
 Tabbar.displayName = "NutTabbar";
 Tabbar.Item = TabbarItem;
-const defaultProps$18 = {
+const defaultProps$19 = {
   title: "",
   value: "",
   disabled: false
 };
 const TabPane = (props) => {
   const { children, autoHeightClassName, className, disabled } = {
-    ...defaultProps$18,
+    ...defaultProps$19,
     ...props
   };
   const classPrefix2 = "nut-tabpane";
@@ -9206,7 +9210,7 @@ const TabPane = (props) => {
   );
   return children && /* @__PURE__ */ React__default.createElement("div", { className: classes }, !disabled && children);
 };
-const defaultProps$17 = {
+const defaultProps$18 = {
   ...ComponentDefaults,
   tabStyle: {},
   activeColor: "",
@@ -9234,7 +9238,7 @@ const Tabs = (props) => {
     value: outerValue,
     defaultValue: outerDefaultValue,
     ...rest
-  } = { ...defaultProps$17, ...props };
+  } = { ...defaultProps$18, ...props };
   const [value, setValue] = usePropsValue({
     value: outerValue,
     defaultValue: outerDefaultValue,
@@ -9515,7 +9519,7 @@ class Tree {
     return pathNodes;
   }
 }
-const defaultProps$16 = {
+const defaultProps$17 = {
   ...ComponentDefaults,
   activeColor: "",
   activeIcon: "checklist",
@@ -9561,7 +9565,7 @@ const InternalCascader = (props, ref) => {
     onClose,
     onChange,
     onPathChange
-  } = { ...defaultProps$16, ...props };
+  } = { ...defaultProps$17, ...props };
   const [tabvalue, setTabvalue] = useState("c1");
   const [optionsData, setOptionsData] = useState([]);
   const isLazy = () => state.configs.lazy && Boolean(state.configs.onLoad);
@@ -9871,7 +9875,7 @@ const InternalCascader = (props, ref) => {
 };
 const Cascader = React__default.forwardRef(InternalCascader);
 Cascader.displayName = "NutCascader";
-const defaultProps$15 = {
+const defaultProps$16 = {
   ...ComponentDefaults,
   visible: false,
   type: "custom",
@@ -9898,7 +9902,7 @@ const CustomRender = (props) => {
     onPathChange,
     ...rest
   } = {
-    ...defaultProps$15,
+    ...defaultProps$16,
     ...props
   };
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, type4 === "custom" && /* @__PURE__ */ React__default.createElement(
@@ -9923,7 +9927,7 @@ const CustomRender = (props) => {
     }
   ));
 };
-const defaultProps$14 = {
+const defaultProps$15 = {
   type: "custom",
   existList: [],
   defaultIcon: null,
@@ -9942,7 +9946,7 @@ const ExistRender = (props) => {
     onSelect,
     onSwitch,
     ...rest
-  } = { ...defaultProps$14, ...props };
+  } = { ...defaultProps$15, ...props };
   const classPrefix2 = "nut-address";
   const selectedExist = (item) => {
     existList.forEach((list, index) => {
@@ -9971,7 +9975,7 @@ const ExistRender = (props) => {
     );
   })), (custom || custom && locale.address.chooseAnotherAddress) && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-footer`, onClick }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-footer-btn` }, custom)));
 };
-const defaultProps$13 = {
+const defaultProps$14 = {
   ...ComponentDefaults,
   defaultValue: [],
   type: "custom",
@@ -10013,7 +10017,7 @@ const InternalAddress = (props, ref) => {
     onSwitch,
     ...rest
   } = {
-    ...defaultProps$13,
+    ...defaultProps$14,
     ...props
   };
   const classPrefix2 = "nut-address";
@@ -10170,33 +10174,6 @@ const isEqual = (date1, date22) => {
   const endTime = new Date(date22.replace(/-/g, "/")).getTime();
   return startTime === endTime;
 };
-const getWeekDate = (year, month, date4, firstDayOfWeek = 0) => {
-  const dateNow = new Date(Number(year), parseInt(month) - 1, Number(date4));
-  const nowTime = dateNow.getTime();
-  let day = dateNow.getDay();
-  if (firstDayOfWeek === 0) {
-    const oneDayTime2 = 24 * 60 * 60 * 1e3;
-    const SundayTime2 = nowTime - day * oneDayTime2;
-    const SaturdayTime = nowTime + (6 - day) * oneDayTime2;
-    const sunday2 = date2Str(new Date(SundayTime2));
-    const saturday = date2Str(new Date(SaturdayTime));
-    return [sunday2, saturday];
-  }
-  day = day === 0 ? 7 : day;
-  const oneDayTime = 24 * 60 * 60 * 1e3;
-  const MondayTime = nowTime - (day - 1) * oneDayTime;
-  const SundayTime = nowTime + (7 - day) * oneDayTime;
-  const monday = date2Str(new Date(MondayTime));
-  const sunday = date2Str(new Date(SundayTime));
-  return [monday, sunday];
-};
-const formatResultDate = (date4) => {
-  const [year, month, day] = [...date4.split("-")];
-  const formatterDay = getNumTwoBit(Number(day));
-  const formatterDate = `${year}-${month}-${day}`;
-  const dayOfWeek = getWhatDay(Number(year), Number(month), Number(day));
-  return [year, month, formatterDay, formatterDate, dayOfWeek];
-};
 const getCurrMonthData = (type4, year, month) => {
   {
     month === 12 && (year += 1);
@@ -10238,6 +10215,74 @@ const getPreMonthDates = (type4, year, month, firstDayOfWeek) => {
   });
   return months.slice(preDates - days);
 };
+const getWeekDate = (year, month, date4, firstDayOfWeek = 0) => {
+  const dateNow = new Date(Number(year), parseInt(month) - 1, Number(date4));
+  const nowTime = dateNow.getTime();
+  let day = dateNow.getDay();
+  if (firstDayOfWeek === 0) {
+    const oneDayTime2 = 24 * 60 * 60 * 1e3;
+    const SundayTime2 = nowTime - day * oneDayTime2;
+    const SaturdayTime = nowTime + (6 - day) * oneDayTime2;
+    const sunday2 = date2Str(new Date(SundayTime2));
+    const saturday = date2Str(new Date(SaturdayTime));
+    return [sunday2, saturday];
+  }
+  day = day === 0 ? 7 : day;
+  const oneDayTime = 24 * 60 * 60 * 1e3;
+  const MondayTime = nowTime - (day - 1) * oneDayTime;
+  const SundayTime = nowTime + (7 - day) * oneDayTime;
+  const monday = date2Str(new Date(MondayTime));
+  const sunday = date2Str(new Date(SundayTime));
+  return [monday, sunday];
+};
+const formatResultDate = (date4) => {
+  const [year, month, day] = [...date4.split("-")];
+  const formatterDay = getNumTwoBit(Number(day));
+  const formatterDate = `${year}-${month}-${day}`;
+  const dayOfWeek = getWhatDay(Number(year), Number(month), Number(day));
+  return [year, month, formatterDay, formatterDate, dayOfWeek];
+};
+const getWeekOfYearByYMD = (year, month, date4, firstDayOfWeek = 0) => {
+  const MILLISECONDS_PER_DAY = 864e5;
+  const dateNow = new Date(year, month - 1, date4);
+  const dateFirst = new Date(year, 0, 1);
+  const dayOfYear = Math.round(
+    (dateNow.valueOf() - dateFirst.valueOf()) / MILLISECONDS_PER_DAY
+  );
+  const DAYS_OF_FIRST_WEEK = 3;
+  let dayOfWeek = dateNow.getDay();
+  let remainder = 6 - dayOfWeek - DAYS_OF_FIRST_WEEK;
+  if (firstDayOfWeek !== 0) {
+    dayOfWeek = dayOfWeek === 0 ? 7 : dayOfWeek;
+    remainder = 7 - dayOfWeek - DAYS_OF_FIRST_WEEK;
+  }
+  let weekNo = Math.ceil((dayOfYear + remainder + 1) / 7);
+  if (weekNo === 0) {
+    weekNo = getWeekOfYearByYMD(year - 1, 12, 31, firstDayOfWeek);
+  } else if (weekNo === 53) {
+    const remainder2 = 7 - dayOfWeek - DAYS_OF_FIRST_WEEK;
+    weekNo = remainder2 > 0 ? 1 : weekNo;
+  }
+  return weekNo;
+};
+const getWeekNosOfYear = (year, month, firstDayOfWeek) => {
+  const startWeekNo = getWeekOfYearByYMD(year, month, 1, firstDayOfWeek);
+  const endWeekNo = getWeekOfYearByYMD(
+    year,
+    month,
+    getMonthDays(`${year}`, `${month}`),
+    firstDayOfWeek
+  );
+  return Array.from(
+    {
+      length: (endWeekNo === 1 ? 53 : endWeekNo) - (startWeekNo === 53 || startWeekNo === 52 ? 0 : startWeekNo) + 1
+    },
+    (_, i2) => {
+      const lastIndex = (endWeekNo === 1 ? 53 : endWeekNo) - startWeekNo;
+      return `${endWeekNo === 1 && i2 === lastIndex ? 1 : ((startWeekNo === 53 || startWeekNo === 52) && i2 !== 0 ? 0 : startWeekNo) + i2}`;
+    }
+  );
+};
 const splitDate = (date4) => {
   const split = date4.indexOf("-") !== -1 ? "-" : "/";
   return date4.split(split);
@@ -10266,7 +10311,89 @@ const isEnd = (day, days) => {
 const isStartAndEnd = (days) => {
   return days.length >= 2 && isEqual(days[0], days[1]);
 };
-const defaultProps$12 = {
+const getPreMonths = (type4, year, month) => {
+  const preMonth = +month - 1;
+  const months = Array.from(Array(preMonth), (v, k) => {
+    return {
+      year,
+      month: k + 1,
+      yearAndMonth: formatMonth(year, k + 1),
+      type: type4
+    };
+  });
+  return months;
+};
+const getMonths = (type4, year, month, endMonth = 12) => {
+  const nextMonth = endMonth - month + 1;
+  const months = Array.from(Array(nextMonth), (v, k) => {
+    return {
+      year,
+      month: k + month,
+      yearAndMonth: formatMonth(year, k + month),
+      type: type4
+    };
+  });
+  return months;
+};
+const formatMonth = (year, month) => {
+  return `${year}-${String(month).padStart(2, "0")}`;
+};
+const formatQuarter = (year, quarter) => {
+  return `${year}-Q${quarter}`;
+};
+const getQuarter = (month) => {
+  if (month < 1 || month > 12) {
+    throw new Error("月份必须在 1 到 12 之间");
+  }
+  const quarter = Math.floor((month - 1) / 3) + 1;
+  return quarter;
+};
+const getQuarters = (type4, year, month, endMonth = 12) => {
+  const quarters = [];
+  const startIndex = month;
+  const endIndex = endMonth;
+  for (let index = startIndex; index <= endIndex; index += 3) {
+    const quarter = getQuarter(index);
+    quarters.push({
+      year,
+      quarter,
+      yearAndQuarter: formatQuarter(year, quarter),
+      type: type4
+    });
+  }
+  return quarters;
+};
+const getPreQuarters = (type4, year, month) => {
+  const quarters = [];
+  const startIndex = 1;
+  const endIndex = month - 3;
+  for (let index = startIndex; index <= endIndex; index += 3) {
+    const quarter = getQuarter(index);
+    quarters.push({
+      year,
+      quarter,
+      yearAndQuarter: formatQuarter(year, quarter),
+      type: type4
+    });
+  }
+  return quarters;
+};
+const getNextQuarters = (type4, year, month, endMonth = 12) => {
+  const quarters = [];
+  const startIndex = month + 3;
+  const endIndex = endMonth;
+  for (let index = startIndex; index <= endIndex; index += 3) {
+    const quarter = getQuarter(index);
+    quarters.push({
+      year,
+      quarter,
+      yearAndQuarter: formatQuarter(year, quarter),
+      type: type4
+    });
+  }
+  return quarters;
+};
+const defaultProps$13 = {
   ...ComponentDefaults,
   type: "single",
   autoBackfill: false,
@@ -10280,6 +10407,7 @@ const defaultProps$12 = {
   confirmText: "",
   showTitle: true,
   showSubTitle: true,
+  showMonthNumber: false,
   scrollAnimation: true,
   firstDayOfWeek: 0,
   disableDate: (date4) => false,
@@ -10306,6 +10434,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     type: type4,
     autoBackfill,
     title,
+    value,
     defaultValue,
     startDate,
     endDate,
@@ -10315,6 +10444,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     confirmText,
     showTitle,
     showSubTitle,
+    showMonthNumber,
     scrollAnimation,
     firstDayOfWeek,
     disableDate,
@@ -10323,12 +10453,11 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     renderDay,
     renderDayTop,
     renderDayBottom,
-    value,
     onConfirm,
     onUpdate,
     onDayClick,
     onPageChange
-  } = { ...defaultProps$12, ...props };
+  } = { ...defaultProps$13, ...props };
   const classPrefix2 = "nut-calendar";
   const dayPrefix = "nut-calendar-day";
   const weekdays = locale.calendaritem.weekdays;
@@ -10353,7 +10482,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     if (defaultValue || Array.isArray(defaultValue) && defaultValue.length > 0) {
       return type4 !== "single" ? [...defaultValue] : defaultValue;
     }
-    return void 0;
+    return type4 === "single" ? "" : [];
   };
   const [currentDate, setCurrentDate] = usePropsValue({
     value,
@@ -10379,15 +10508,16 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
         ...getPreMonthDates("prev", y, m2, firstDayOfWeek),
         ...getDaysStatus("active", y, m2)
       ];
-      const cssHeight = 39 + (days.length > 35 ? 384 : 320);
       let scrollTop = 0;
       if (monthData.length > 0) {
         const monthEle = monthData[monthData.length - 1];
         scrollTop = monthEle.scrollTop + monthEle.cssHeight;
       }
+      const cssHeight = 39 + (days.length > 35 ? 384 : 320);
       const monthInfo = {
         curData: date4,
         title: monthTitle(y, m2),
+        weekNo: getWeekNosOfYear(y, m2, firstDayOfWeek),
         monthData: days,
         cssHeight,
         scrollTop
@@ -10409,7 +10539,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     const currentMonthsData = monthsData[current];
     if (currentMonthsData.title === yearMonthTitle) return;
     const [year, month] = currentMonthsData.curData;
-    onPageChange && onPageChange([year, month, `${year}-${month}`]);
+    onPageChange == null ? void 0 : onPageChange([year, month, `${year}-${month}`]);
     setYearMonthTitle(currentMonthsData.title);
   };
   const setDefaultRange = (monthNum, current) => {
@@ -10513,9 +10643,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
       const index = monthsData.findIndex((item) => {
         return +item.curData[0] === year && +item.curData[1] === month;
       });
-      if (index > -1) {
-        current = index;
-      }
+      if (index > -1) current = index;
     }
     return {
       current,
@@ -10570,12 +10698,8 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
   const getMonthNum = () => {
     let monthNum = Number(endDates[1]) - Number(startDates[1]);
     const yearNum = Number(endDates[0]) - Number(startDates[0]);
-    if (yearNum > 0) {
-      monthNum += 12 * yearNum;
-    }
-    if (monthNum <= 0) {
-      monthNum = 1;
-    }
+    if (yearNum > 0) monthNum += 12 * yearNum;
+    if (monthNum <= 0) monthNum = 1;
     setMonthsNum(monthNum);
     return monthNum;
   };
@@ -10598,7 +10722,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     initData();
   };
   useEffect(() => {
-    setCurrentDate(resetDefaultValue() || []);
+    setCurrentDate(resetDefaultValue());
   }, [defaultValue]);
   useEffect(() => {
     popup && resetRender();
@@ -10751,7 +10875,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
       state.currDateArray = [...days];
     }
     if (!isFirst) {
-      onDayClick && onDayClick(state.currDateArray);
+      onDayClick == null ? void 0 : onDayClick(state.currDateArray);
       if (autoBackfill || !popup) {
         confirm2();
       }
@@ -10761,9 +10885,9 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
   const confirm2 = () => {
     if (type4 === "range" && state.currDateArray.length === 2 || type4 !== "range") {
       const chooseData = state.currDateArray.slice(0);
-      onConfirm && onConfirm(chooseData);
+      onConfirm == null ? void 0 : onConfirm(chooseData);
       if (popup) {
-        onUpdate && onUpdate();
+        onUpdate == null ? void 0 : onUpdate();
       }
     }
   };
@@ -10786,7 +10910,14 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     return currentDate.length >= 2 && (type4 === "range" || type4 === "week") && day.type === "active" && isEnd(getCurrDate(day, month), currentDate);
   };
   const renderHeader = () => {
-    return /* @__PURE__ */ React__default.createElement("div", { className: headerClasses }, showTitle && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-title` }, title || locale.calendaritem.title), renderHeaderButtons && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-header-buttons` }, renderHeaderButtons()), showSubTitle && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-sub-title` }, yearMonthTitle), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-weeks`, ref: weeksPanel }, weeks.map((item) => /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-week-item`, key: item }, item))));
+    return /* @__PURE__ */ React__default.createElement("div", { className: headerClasses }, showTitle && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-title` }, title || locale.calendaritem.title), renderHeaderButtons && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-header-buttons` }, renderHeaderButtons()), showSubTitle && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-sub-title` }, yearMonthTitle), /* @__PURE__ */ React__default.createElement(
+      "div",
+      {
+        className: `${classPrefix2}-weeks ${showMonthNumber ? `${classPrefix2}-weeks-shrink` : ""}`,
+        ref: weeksPanel
+      },
+      weeks.map((item) => /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-week-item`, key: item }, item))
+    ));
   };
   const renderItem = (month, day, index) => {
     const startTip = isStartTip(day, month);
@@ -10795,7 +10926,7 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     return /* @__PURE__ */ React__default.createElement(
       "div",
       {
-        className: [`${classPrefix2}-day`, getClasses(day, month)].join(" "),
+        className: classNames("nut-calendar-day", getClasses(day, month)),
         onClick: () => handleDayClick(day, month, false),
         key: index
       },
@@ -10806,7 +10937,11 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
       startTip && /* @__PURE__ */ React__default.createElement(
         "div",
         {
-          className: `${classPrefix2}-day-info ${isStartAndEnd(currentDate) ? `${classPrefix2}-day-info-top` : ""}`
+          className: classNames("nut-calendar-day-info", {
+            "nut-calendar-day-info-top": isStartAndEnd(
+              currentDate
+            )
+          })
         },
         startText || locale.calendaritem.start
       ),
@@ -10814,9 +10949,9 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
     );
   };
   const renderPanel = (month, key) => {
-    return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-month`, key }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-month-title` }, month.title), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-days` }, month.monthData.map(
+    return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-month`, key }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-month-title` }, month.title), /* @__PURE__ */ React__default.createElement("div", { className: `${showMonthNumber ? "shrink" : ""}` }, showMonthNumber && /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-weeknumber` }, month.weekNo.map((item, index) => /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-weeknumber-index`, key: index }, item))), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-days` }, month.monthData.map(
       (day, i2) => renderItem(month, day, i2)
-    )));
+    ))));
   };
   const renderContent = () => {
     return /* @__PURE__ */ React__default.createElement(
@@ -10829,7 +10964,6 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
       /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-pannel`, ref: monthsPanel }, /* @__PURE__ */ React__default.createElement(
         "div",
         {
-          className: "viewArea",
           ref: viewAreaRef,
           style: { transform: `translateY(${translateY}px)` }
         },
@@ -10845,13 +10979,295 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
   return /* @__PURE__ */ React__default.createElement("div", { className: classes, style }, renderHeader(), renderContent(), popup && !autoBackfill ? renderFooter() : "");
 });
 CalendarItem.displayName = "NutCalendarItem";
+const YearMonthPanelHeight = 231;
+const YearQuarterPanelHeight = 103;
+const defaultProps$12 = {
+  ...ComponentDefaults,
+  type: "single",
+  viewMode: "month",
+  title: "",
+  startDate: getDateString(0),
+  endDate: getDateString(365),
+  showToday: true,
+  showTitle: true,
+  scrollAnimation: true,
+  renderDay: void 0,
+  onItemClick: () => {
+  }
+};
+const CalendarViewModeItem = React__default.forwardRef((props) => {
+  const { locale } = useConfig();
+  const {
+    style,
+    className,
+    viewMode,
+    title,
+    value,
+    defaultValue,
+    startDate,
+    endDate,
+    showTitle,
+    renderDay,
+    onItemClick
+  } = { ...defaultProps$12, ...props };
+  const classPrefix2 = "nut-calendar-viewmode";
+  const [panelDate, setPanelDate] = useState({
+    months: [
+      {
+        year: (/* @__PURE__ */ new Date()).getFullYear(),
+        months: [],
+        cssHeight: 0,
+        scrollTop: 0,
+        currYear: false
+      }
+    ],
+    quarters: [
+      {
+        year: (/* @__PURE__ */ new Date()).getFullYear(),
+        quarters: [],
+        cssHeight: 0,
+        scrollTop: 0,
+        currYear: false
+      }
+    ]
+  });
+  const propStartDate = startDate || getDateString(0);
+  const propEndDate = endDate || getDateString(365);
+  const startDates = splitDate(propStartDate);
+  const endDates = splitDate(propEndDate);
+  const [innerValue, setInnerValue] = usePropsValue({
+    value,
+    defaultValue,
+    finalValue: [],
+    onChange: (val) => {
+    }
+  });
+  const monthsRef = useRef(null);
+  const monthsPanel = useRef(null);
+  const viewAreaRef = useRef(null);
+  const getMonthsPanel = () => {
+    return monthsPanel.current;
+  };
+  const getMonthsRef = () => {
+    return monthsRef.current;
+  };
+  const requestAniFrameFunc = (viewMode2) => {
+    switch (viewMode2) {
+      case "month":
+        {
+          const lastItem = panelDate.months[panelDate.months.length - 1];
+          const containerHeight = lastItem.cssHeight + lastItem.scrollTop;
+          const currentIndex = panelDate.months.findIndex(
+            (item) => item.currYear === true
+          );
+          requestAniFrame$1(() => {
+            if (monthsRef && monthsPanel && viewAreaRef) {
+              getMonthsRef().clientHeight;
+              getMonthsPanel().style.height = `${containerHeight}px`;
+              getMonthsRef().scrollTop = panelDate.months[currentIndex].scrollTop;
+            }
+          });
+        }
+        break;
+      case "quarter":
+        {
+          const lastItem = panelDate.quarters[panelDate.quarters.length - 1];
+          const containerHeight = lastItem.cssHeight + lastItem.scrollTop;
+          const currentIndex = panelDate.quarters.findIndex(
+            (item) => item.currYear === true
+          );
+          requestAniFrame$1(() => {
+            if (monthsRef && monthsPanel && viewAreaRef) {
+              getMonthsRef().clientHeight;
+              getMonthsPanel().style.height = `${containerHeight}px`;
+              getMonthsRef().scrollTop = panelDate.quarters[currentIndex].scrollTop;
+            }
+          });
+        }
+        break;
+    }
+  };
+  const isCurrYear = (year) => {
+    return innerValue.split("-")[0] === `${year}`;
+  };
+  const getMonthsData = () => {
+    const startYear = Number(startDates[0]);
+    const startMonth = Number(startDates[1]);
+    const endYear = Number(endDates[0]);
+    const endMonth = Number(endDates[1]);
+    const panelData = [];
+    const addPanelData = (year, months, scrollTop) => {
+      panelData.push({
+        year,
+        months,
+        scrollTop,
+        cssHeight: YearMonthPanelHeight,
+        currYear: isCurrYear(year)
+      });
+    };
+    if (startYear === endYear) {
+      addPanelData(
+        startYear,
+        [
+          ...getPreMonths("prev", startYear, startMonth),
+          ...getMonths("curr", startYear, startMonth, endMonth),
+          ...getMonths("next", endYear, endMonth + 1)
+        ],
+        0
+      );
+    } else {
+      let scrollTop = panelData.length * YearMonthPanelHeight;
+      const startMonths = [
+        ...getPreMonths("prev", startYear, startMonth),
+        ...getMonths("curr", startYear, startMonth)
+      ];
+      addPanelData(startYear, startMonths, scrollTop);
+      for (let i2 = startYear + 1; i2 < endYear; i2++) {
+        scrollTop = panelData.length * YearMonthPanelHeight;
+        const midMonths = [...getMonths("curr", i2, 1)];
+        addPanelData(i2, midMonths, scrollTop);
+      }
+      const lastMonths = [
+        ...getPreMonths("curr", endYear, endMonth + 1),
+        ...getMonths("next", endYear, endMonth + 1)
+      ];
+      scrollTop = panelData.length * YearMonthPanelHeight;
+      addPanelData(endYear, lastMonths, scrollTop);
+    }
+    return panelData;
+  };
+  const getQuartersData = () => {
+    const startYear = Number(startDates[0]);
+    const startMonth = Number(startDates[1]);
+    const endYear = Number(endDates[0]);
+    const endMonth = Number(endDates[1]);
+    const panelData = [];
+    const addPanelData = (year, quarters, scrollTop) => {
+      panelData.push({
+        year,
+        quarters,
+        scrollTop,
+        cssHeight: YearQuarterPanelHeight,
+        currYear: isCurrYear(year)
+      });
+    };
+    if (startYear === endYear) {
+      const quarters = [
+        ...getPreQuarters("prev", startYear, startMonth),
+        ...getQuarters("curr", startYear, startMonth, endMonth),
+        ...getNextQuarters("next", endYear, endMonth)
+      ];
+      addPanelData(startYear, quarters, 0);
+    } else {
+      let scrollTop = panelData.length * YearQuarterPanelHeight;
+      const startQuarters = [
+        ...getPreQuarters("prev", startYear, startMonth),
+        ...getQuarters("curr", startYear, startMonth)
+      ];
+      addPanelData(startYear, startQuarters, scrollTop);
+      for (let i2 = startYear + 1; i2 < endYear; i2++) {
+        scrollTop = panelData.length * YearQuarterPanelHeight;
+        const midQuarters = [...getQuarters("curr", i2, 1)];
+        addPanelData(i2, midQuarters, scrollTop);
+      }
+      const lastQuarters = [
+        ...getQuarters("curr", endYear, 1, endMonth),
+        ...getNextQuarters("next", endYear, endMonth)
+      ];
+      scrollTop = panelData.length * YearQuarterPanelHeight;
+      addPanelData(endYear, lastQuarters, scrollTop);
+    }
+    return panelData;
+  };
+  const initData = () => {
+    const data = (
+      // eslint-disable-next-line no-nested-ternary
+      viewMode === "month" ? getMonthsData() : viewMode === "quarter" ? getQuartersData() : null
+    );
+    setPanelDate({ ...panelDate, [`${viewMode}s`]: data });
+  };
+  useEffect(() => {
+    requestAniFrameFunc(viewMode);
+  }, [panelDate]);
+  useEffect(() => {
+    initData();
+  }, []);
+  const handleItemClick = (item) => {
+    if (item.type !== "curr") return;
+    const val = viewMode === "month" ? item.yearAndMonth : item.yearAndQuarter;
+    setInnerValue(val);
+    onItemClick == null ? void 0 : onItemClick(val);
+  };
+  const isDisable = (item) => {
+    return item.type === "prev" || item.type === "next";
+  };
+  const isActive = (item) => {
+    const val = viewMode === "month" ? item.yearAndMonth : item.yearAndQuarter;
+    return val === innerValue;
+  };
+  const getClasses = (item) => {
+    if (isDisable(item)) {
+      return ["disabled"];
+    }
+    const res = [];
+    if (item.type === "curr") {
+      if (isActive(item)) {
+        res.push("active");
+      }
+    }
+    return res;
+  };
+  const classes = classNames(classPrefix2, className);
+  const renderHeader = () => {
+    return showTitle && /* @__PURE__ */ React__default.createElement(
+      "div",
+      {
+        className: classNames({
+          [`${classPrefix2}-header`]: true
+        })
+      },
+      /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-title` }, title)
+    );
+  };
+  const renderItem = (item, index) => {
+    const units = {
+      month: locale.calendaritem.month,
+      quarter: locale.calendaritem.quarter
+    };
+    return /* @__PURE__ */ React__default.createElement(
+      "div",
+      {
+        className: classNames(
+          `${classPrefix2}-item`,
+          item.type,
+          getClasses(item)
+        ),
+        onClick: () => handleItemClick(item),
+        key: index
+      },
+      /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-item-${item.type}` }, renderDay ? renderDay(item) : `${item[viewMode]}${units[viewMode]}`)
+    );
+  };
+  const renderPanel = () => {
+    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, panelDate[`${viewMode}s`].map((item, key) => /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-panel`, key }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-panel-title` }, item.year), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-content` }, item[`${viewMode}s`].map(
+      (item2, i2) => renderItem(item2, i2)
+    )))));
+  };
+  const renderContent = () => {
+    return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-content`, ref: monthsRef }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}-pannel`, ref: monthsPanel }, /* @__PURE__ */ React__default.createElement("div", { ref: viewAreaRef }, renderPanel())));
+  };
+  return /* @__PURE__ */ React__default.createElement("div", { className: classes, style }, renderHeader(), renderContent());
+});
+CalendarViewModeItem.displayName = "NutCalendarViewModeItem";
 const defaultProps$11 = {
   ...ComponentDefaults,
   type: "single",
+  viewMode: "day",
   autoBackfill: false,
   popup: true,
   visible: false,
   title: "",
+  value: "",
   defaultValue: "",
   startDate: getDateString(0),
   endDate: getDateString(365),
@@ -10861,6 +11277,7 @@ const defaultProps$11 = {
   confirmText: "",
   showTitle: true,
   showSubTitle: true,
+  showMonthNumber: false,
   scrollAnimation: true,
   firstDayOfWeek: 0,
   disableDate: (date4) => false,
@@ -10874,6 +11291,8 @@ const defaultProps$11 = {
   },
   onDayClick: (data) => {
   },
+  onItemClick: () => {
+  },
   onPageChange: (param) => {
   }
 };
@@ -10886,8 +11305,10 @@ const Calendar = React__default.forwardRef((props, ref) => {
     popup,
     visible,
     type: type4,
+    viewMode,
     autoBackfill,
     title,
+    value,
     defaultValue,
     startDate,
     endDate,
@@ -10897,6 +11318,7 @@ const Calendar = React__default.forwardRef((props, ref) => {
     confirmText,
     showTitle,
     showSubTitle,
+    showMonthNumber,
     scrollAnimation,
     firstDayOfWeek,
     closeIcon,
@@ -10909,6 +11331,7 @@ const Calendar = React__default.forwardRef((props, ref) => {
     onClose,
     onConfirm,
     onDayClick,
+    onItemClick,
     onPageChange
   } = { ...defaultProps$11, ...props };
   const calendarRef = useRef(null);
@@ -10922,9 +11345,6 @@ const Calendar = React__default.forwardRef((props, ref) => {
   const closePopup = () => {
     close();
   };
-  const select = (param) => {
-    onDayClick && onDayClick(param);
-  };
   const scrollToDate = (date4) => {
     var _a;
     (_a = calendarRef.current) == null ? void 0 : _a.scrollToDate(date4);
@@ -10936,7 +11356,25 @@ const Calendar = React__default.forwardRef((props, ref) => {
     scrollToDate
   }));
   const renderItem = () => {
-    return /* @__PURE__ */ React__default.createElement(
+    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, viewMode !== "day" ? /* @__PURE__ */ React__default.createElement(
+      CalendarViewModeItem,
+      {
+        ref: calendarRef,
+        style,
+        className,
+        type: type4,
+        viewMode,
+        title: title || locale.calendaritem.title,
+        value,
+        defaultValue,
+        startDate,
+        endDate,
+        showTitle,
+        scrollAnimation,
+        renderDay,
+        onItemClick
+      }
+    ) : /* @__PURE__ */ React__default.createElement(
       CalendarItem,
       {
         ref: calendarRef,
@@ -10957,6 +11395,7 @@ const Calendar = React__default.forwardRef((props, ref) => {
         confirmText: confirmText || locale.calendaritem.confirm,
         showTitle,
         showSubTitle,
+        showMonthNumber,
         scrollAnimation,
         firstDayOfWeek,
         disableDate,
@@ -10965,12 +11404,12 @@ const Calendar = React__default.forwardRef((props, ref) => {
         renderDayTop,
         renderDayBottom,
         onConfirm: choose,
-        onDayClick: select,
+        onDayClick: (param) => onDayClick && onDayClick(param),
         onPageChange: yearMonthChange
       }
-    );
+    ));
   };
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, popup ? /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, popup && viewMode === "day" ? /* @__PURE__ */ React__default.createElement(
     Popup,
     {
       className: "nut-calendar-popup",