rsuite 5.71.0 → 5.73.0

package/cjs/Calendar/{TimeDropdown.js → TimeDropdown/TimeDropdown.js}

@@ -4,89 +4,20 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
 exports.default = void 0;
-exports.getMeridianHours = getMeridianHours;
-exports.getRanges = getRanges;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _react = _interopRequireWildcard(require("react"));
-var _getPosition = _interopRequireDefault(require("dom-lib/getPosition"));
-var _scrollTop = _interopRequireDefault(require("dom-lib/scrollTop"));
 var _partial = _interopRequireDefault(require("lodash/partial"));
 var _camelCase = _interopRequireDefault(require("lodash/camelCase"));
 var _isNumber = _interopRequireDefault(require("lodash/isNumber"));
-var _utils = require("../internals/utils");
-var _hooks = require("../internals/hooks");
-var DateUtils = _interopRequireWildcard(require("../internals/utils/date"));
-var _CalendarContext = require("./CalendarContext");
-var _excluded = ["as", "className", "classPrefix", "show", "showMeridian"];
+var _hooks = require("../../internals/hooks");
+var _date = require("../../internals/utils/date");
+var _hooks2 = require("../hooks");
+var _TimeColumn = _interopRequireDefault(require("./TimeColumn"));
+var _utils = require("./utils");
+var _excluded = ["as", "className", "classPrefix", "show", "showMeridiem"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-/**
- * Get the effective range of hours, minutes and seconds
- * @param meridian
- */
-function getRanges(meridian) {
-  return {
-    hours: {
-      start: 0,
-      end: meridian ? 11 : 23
-    },
-    minutes: {
-      start: 0,
-      end: 59
-    },
-    seconds: {
-      start: 0,
-      end: 59
-    }
-  };
-}
-
-/**
- * Convert the 24-hour clock to the 12-hour clock
- * @param hours
- */
-function getMeridianHours(hours) {
-  return hours >= 12 ? hours - 12 : hours;
-}
-var getTime = function getTime(props) {
-  var format = props.format,
-    date = props.date,
-    showMeridian = props.showMeridian;
-  var time = date || new Date();
-  var nextTime = {};
-  if (!format) {
-    return nextTime;
-  }
-  if (/(H|h)/.test(format)) {
-    var hours = DateUtils.getHours(time);
-    nextTime.hours = showMeridian ? getMeridianHours(hours) : hours;
-  }
-  if (/m/.test(format)) {
-    nextTime.minutes = DateUtils.getMinutes(time);
-  }
-  if (/s/.test(format)) {
-    nextTime.seconds = DateUtils.getSeconds(time);
-  }
-  return nextTime;
-};
-var scrollTo = function scrollTo(time, row) {
-  if (!row) {
-    return;
-  }
-  Object.entries(time).forEach(function (_ref) {
-    var type = _ref[0],
-      value = _ref[1];
-    var container = row.querySelector("[data-type=\"" + type + "\"]");
-    var node = container === null || container === void 0 ? void 0 : container.querySelector("[data-key=\"" + type + "-" + value + "\"]");
-    if (node && container) {
-      var position = (0, _getPosition.default)(node, container);
-      if (position) {
-        (0, _utils.scrollTopAnimation)(container, position.top, (0, _scrollTop.default)(container) !== 0);
-      }
-    }
-  });
-};
 var TimeDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var _props$as = props.as,
     Component = _props$as === void 0 ? 'div' : _props$as,
@@ -94,53 +25,67 @@ var TimeDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     _props$classPrefix = props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'calendar-time-dropdown' : _props$classPrefix,
     show = props.show,
-    _props$showMeridian = props.showMeridian,
-    showMeridian = _props$showMeridian === void 0 ? false : _props$showMeridian,
+    _props$showMeridiem = props.showMeridiem,
+    showMeridiem = _props$showMeridiem === void 0 ? false : _props$showMeridiem,
     rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  var _useCalendarContext = (0, _CalendarContext.useCalendarContext)(),
-    locale = _useCalendarContext.locale,
-    format = _useCalendarContext.format,
-    date = _useCalendarContext.date,
-    onSelect = _useCalendarContext.onChangeTime,
-    targetId = _useCalendarContext.targetId;
+  var _useCalendar = (0, _hooks2.useCalendar)(),
+    locale = _useCalendar.locale,
+    format = _useCalendar.format,
+    date = _useCalendar.date,
+    onSelect = _useCalendar.onChangeTime,
+    targetId = _useCalendar.targetId;
   var rowRef = (0, _react.useRef)(null);
   (0, _react.useEffect)(function () {
-    var time = getTime({
+    var time = (0, _utils.getClockTime)({
       format: format,
       date: date,
-      showMeridian: showMeridian
+      showMeridiem: showMeridiem
     });
     // The currently selected time scrolls to the visible range.
     if (show && rowRef.current) {
-      scrollTo(time, rowRef.current);
+      (0, _utils.scrollToTime)(time, rowRef.current);
     }
-  }, [date, format, show, showMeridian]);
-  var handleClick = function handleClick(type, d, event) {
-    var nextDate = date || new Date();
+  }, [date, format, show, showMeridiem]);
+  var handleClick = (0, _hooks.useEventCallback)(function (type, d, event) {
+    var nextDate = date || (0, _date.startOfToday)();
     switch (type) {
       case 'hours':
-        nextDate = DateUtils.setHours(date, showMeridian && DateUtils.getHours(nextDate) >= 12 ? d + 12 : d);
+        nextDate = (0, _date.setHours)(nextDate, showMeridiem && (0, _date.getHours)(nextDate) >= 12 ? d + 12 : d);
         break;
       case 'minutes':
-        nextDate = DateUtils.setMinutes(date, d);
+        nextDate = (0, _date.setMinutes)(nextDate, d);
         break;
       case 'seconds':
-        nextDate = DateUtils.setSeconds(date, d);
+        nextDate = (0, _date.setSeconds)(nextDate, d);
         break;
     }
     onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextDate, event);
-  };
+  });
+  var handleClickMeridiem = (0, _hooks.useEventCallback)(function (meridiem, event) {
+    var tempDate = date || (0, _date.startOfToday)();
+    var hours = (0, _date.getHours)(tempDate);
+    var isAM = hours < 12;
+    var adjustHours = function adjustHours(meridiem, hours) {
+      if (meridiem === 'AM') {
+        return isAM ? hours : hours - 12;
+      }
+      return isAM ? hours + 12 : hours;
+    };
+    var nextHours = adjustHours(meridiem, hours);
+    var nextDate = (0, _date.setHours)(tempDate, nextHours);
+    onSelect === null || onSelect === void 0 ? void 0 : onSelect(nextDate, event);
+  });
   var _useClassNames = (0, _hooks.useClassNames)(classPrefix),
     prefix = _useClassNames.prefix,
     rootPrefix = _useClassNames.rootPrefix,
     merge = _useClassNames.merge;
-  var renderColumn = function renderColumn(type, active) {
-    if (!(0, _isNumber.default)(active)) {
+  var renderColumn = function renderColumn(type, value) {
+    if (!(0, _isNumber.default)(value)) {
       return null;
     }
-    var _getRanges$type = getRanges(showMeridian)[type],
-      start = _getRanges$type.start,
-      end = _getRanges$type.end;
+    var _getTimeLimits$type = (0, _utils.getTimeLimits)(showMeridiem)[type],
+      start = _getTimeLimits$type.start,
+      end = _getTimeLimits$type.end;
     var items = [];
     var hideFunc = props[(0, _camelCase.default)("hide_" + type)];
     var disabledFunc = props[(0, _camelCase.default)("disabled_" + type)];
@@ -148,7 +93,7 @@ var TimeDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
       if (!(hideFunc !== null && hideFunc !== void 0 && hideFunc(i, date))) {
         var disabled = disabledFunc === null || disabledFunc === void 0 ? void 0 : disabledFunc(i, date);
         var itemClasses = prefix('cell', {
-          'cell-active': active === i,
+          'cell-active': value === i,
           'cell-disabled': disabled
         });
         items.push( /*#__PURE__*/_react.default.createElement("li", {
@@ -156,29 +101,51 @@ var TimeDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
           role: "option",
           tabIndex: -1,
           "aria-label": i + " " + type,
-          "aria-selected": active === i,
+          "aria-selected": value === i,
           "aria-disabled": disabled,
           "data-key": type + "-" + i,
           onClick: !disabled ? (0, _partial.default)(handleClick, type, i) : undefined
         }, /*#__PURE__*/_react.default.createElement("span", {
           className: itemClasses
-        }, showMeridian && type === 'hours' && i === 0 ? '12' : i)));
+        }, showMeridiem && type === 'hours' && i === 0 ? 12 : (0, _utils.formatWithLeadingZero)(i))));
       }
     }
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: prefix('column')
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: prefix('column-title')
-    }, locale === null || locale === void 0 ? void 0 : locale[type]), /*#__PURE__*/_react.default.createElement("ul", {
+    return /*#__PURE__*/_react.default.createElement(_TimeColumn.default, {
+      prefix: prefix,
+      title: locale === null || locale === void 0 ? void 0 : locale[type],
       "data-type": type,
-      role: "listbox",
       "aria-label": "Select " + type
-    }, items));
+    }, items);
+  };
+  var renderMeridiemColumn = function renderMeridiemColumn() {
+    var columns = ['AM', 'PM'];
+    return /*#__PURE__*/_react.default.createElement(_TimeColumn.default, {
+      prefix: prefix,
+      title: 'AM/PM',
+      "data-type": "meridiem",
+      "aria-label": "Select meridiem"
+    }, columns.map(function (meridiem, index) {
+      var ampm = date && ((0, _date.getHours)(date) >= 12 ? 'PM' : 'AM');
+      var itemClasses = prefix('cell', {
+        'cell-active': ampm === meridiem
+      });
+      return /*#__PURE__*/_react.default.createElement("li", {
+        key: index,
+        role: "option",
+        tabIndex: -1,
+        "aria-label": meridiem,
+        "aria-selected": ampm === meridiem,
+        "data-key": "meridiem-" + meridiem,
+        onClick: (0, _partial.default)(handleClickMeridiem, meridiem)
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        className: itemClasses
+      }, meridiem));
+    }));
   };
-  var time = getTime({
+  var time = (0, _utils.getClockTime)({
     format: format,
     date: date,
-    showMeridian: showMeridian
+    showMeridiem: showMeridiem
   });
   var classes = merge(className, rootPrefix(classPrefix), {
     show: show
@@ -187,7 +154,7 @@ var TimeDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     role: "group",
     tabIndex: -1,
     id: targetId ? targetId + "-" + classPrefix : undefined
-  }, DateUtils.omitHideDisabledProps(rest), {
+  }, (0, _date.omitHideDisabledProps)(rest), {
     ref: ref,
     className: classes
   }), /*#__PURE__*/_react.default.createElement("div", {
@@ -195,7 +162,7 @@ var TimeDropdown = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: prefix('row'),
     ref: rowRef
-  }, renderColumn('hours', time.hours), renderColumn('minutes', time.minutes), renderColumn('seconds', time.seconds))));
+  }, renderColumn('hours', time.hours), renderColumn('minutes', time.minutes), renderColumn('seconds', time.seconds), showMeridiem && renderMeridiemColumn())));
 });
 TimeDropdown.displayName = 'TimeDropdown';
 var _default = exports.default = TimeDropdown;

package/cjs/Calendar/TimeDropdown/index.d.ts

@@ -0,0 +1,2 @@
+import TimeDropdown from './TimeDropdown';
+export default TimeDropdown;

package/cjs/Calendar/TimeDropdown/index.js

@@ -0,0 +1,8 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _TimeDropdown = _interopRequireDefault(require("./TimeDropdown"));
+var _default = exports.default = _TimeDropdown.default;

package/cjs/Calendar/TimeDropdown/utils/formatWithLeadingZero.d.ts

@@ -0,0 +1 @@
+export declare const formatWithLeadingZero: (number: number) => string;

package/cjs/Calendar/TimeDropdown/utils/formatWithLeadingZero.js

@@ -0,0 +1,8 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.formatWithLeadingZero = void 0;
+var formatWithLeadingZero = exports.formatWithLeadingZero = function formatWithLeadingZero(number) {
+  return String(number).padStart(2, '0');
+};

package/cjs/Calendar/TimeDropdown/utils/getClockTime.d.ts

@@ -0,0 +1,11 @@
+export interface ClockTime {
+    hours?: number | null;
+    minutes?: number | null;
+    seconds?: number | null;
+    meridiem?: 'AM' | 'PM' | null;
+}
+export declare function getClockTime(props: {
+    date?: Date;
+    format?: string;
+    showMeridiem: boolean;
+}): ClockTime;

package/cjs/Calendar/TimeDropdown/utils/getClockTime.js

@@ -0,0 +1,43 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.getClockTime = getClockTime;
+var _date = require("../../../internals/utils/date");
+/**
+ * Convert the 24-hour clock to the 12-hour clock
+ * @param hours
+ */
+function getMeridiemHours(hours) {
+  return hours >= 12 ? hours - 12 : hours;
+}
+function getClockTime(props) {
+  var format = props.format,
+    date = props.date,
+    showMeridiem = props.showMeridiem;
+  var clockTime = {
+    hours: null,
+    minutes: null,
+    seconds: null,
+    meridiem: null
+  };
+  if (!format) {
+    return clockTime;
+  }
+
+  // If date is provided, extract hours and meridiem
+  if (/(H|h)/.test(format) && date) {
+    var hours = (0, _date.getHours)(date);
+    clockTime.hours = showMeridiem ? getMeridiemHours(hours) : hours;
+    clockTime.meridiem = hours >= 12 ? 'PM' : 'AM';
+  }
+  // Extract minutes if 'm' is present in format and date is provided
+  if (/m/.test(format) && date) {
+    clockTime.minutes = (0, _date.getMinutes)(date);
+  }
+  // // Extract seconds if 's' is present in format and date is provided
+  if (/s/.test(format) && date) {
+    clockTime.seconds = (0, _date.getSeconds)(date);
+  }
+  return clockTime;
+}

package/cjs/Calendar/TimeDropdown/utils/getTimeLimits.d.ts

@@ -0,0 +1,11 @@
+interface TimeRange {
+    start: number;
+    end: number;
+}
+interface TimeLimits {
+    hours: TimeRange;
+    minutes: TimeRange;
+    seconds: TimeRange;
+}
+export declare function getTimeLimits(isMeridiem: boolean): TimeLimits;
+export {};

package/cjs/Calendar/TimeDropdown/utils/getTimeLimits.js

@@ -0,0 +1,24 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.getTimeLimits = getTimeLimits;
+function getTimeLimits(isMeridiem) {
+  var HOURS_24H = {
+    start: 0,
+    end: 23
+  };
+  var HOURS_12H = {
+    start: 0,
+    end: 11
+  };
+  var MINUTES_SECONDS = {
+    start: 0,
+    end: 59
+  };
+  return {
+    hours: isMeridiem ? HOURS_12H : HOURS_24H,
+    minutes: MINUTES_SECONDS,
+    seconds: MINUTES_SECONDS
+  };
+}

package/cjs/Calendar/TimeDropdown/utils/index.d.ts

@@ -0,0 +1,4 @@
+export { getTimeLimits } from './getTimeLimits';
+export { formatWithLeadingZero } from './formatWithLeadingZero';
+export { scrollToTime } from './scrollToTime';
+export * from './getClockTime';

package/cjs/Calendar/TimeDropdown/utils/index.js

@@ -0,0 +1,23 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+var _exportNames = {
+  getTimeLimits: true,
+  formatWithLeadingZero: true,
+  scrollToTime: true
+};
+exports.scrollToTime = exports.getTimeLimits = exports.formatWithLeadingZero = void 0;
+var _getTimeLimits = require("./getTimeLimits");
+exports.getTimeLimits = _getTimeLimits.getTimeLimits;
+var _formatWithLeadingZero = require("./formatWithLeadingZero");
+exports.formatWithLeadingZero = _formatWithLeadingZero.formatWithLeadingZero;
+var _scrollToTime = require("./scrollToTime");
+exports.scrollToTime = _scrollToTime.scrollToTime;
+var _getClockTime = require("./getClockTime");
+Object.keys(_getClockTime).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _getClockTime[key]) return;
+  exports[key] = _getClockTime[key];
+});

package/cjs/Calendar/TimeDropdown/utils/scrollToTime.d.ts

@@ -0,0 +1,2 @@
+import type { ClockTime } from './getClockTime';
+export declare function scrollToTime(time: ClockTime, row: HTMLDivElement | null): void;

package/cjs/Calendar/TimeDropdown/utils/scrollToTime.js

@@ -0,0 +1,28 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.scrollToTime = scrollToTime;
+var _getPosition = _interopRequireDefault(require("dom-lib/getPosition"));
+var _scrollTop = _interopRequireDefault(require("dom-lib/scrollTop"));
+function scrollToTime(time, row) {
+  if (!row) return;
+  var scrollToPosition = function scrollToPosition(container, value, type) {
+    var node = container.querySelector("[data-key=\"" + type + "-" + value + "\"]");
+    if (node) {
+      var position = (0, _getPosition.default)(node, container);
+      if (position) {
+        (0, _scrollTop.default)(container, position.top);
+      }
+    }
+  };
+  Object.entries(time).forEach(function (_ref) {
+    var type = _ref[0],
+      value = _ref[1];
+    var container = row.querySelector("[data-type=\"" + type + "\"]");
+    if (container) {
+      scrollToPosition(container, value, type);
+    }
+  });
+}

package/cjs/Calendar/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export * from './useCalendarState';
+export * from './useCalendarDate';
+export { useCalendar } from './useCalendar';

package/cjs/Calendar/hooks/index.js

@@ -0,0 +1,24 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+var _exportNames = {
+  useCalendar: true
+};
+exports.useCalendar = void 0;
+var _useCalendarState = require("./useCalendarState");
+Object.keys(_useCalendarState).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _useCalendarState[key]) return;
+  exports[key] = _useCalendarState[key];
+});
+var _useCalendarDate = require("./useCalendarDate");
+Object.keys(_useCalendarDate).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _useCalendarDate[key]) return;
+  exports[key] = _useCalendarDate[key];
+});
+var _useCalendar = require("./useCalendar");
+exports.useCalendar = _useCalendar.useCalendar;

package/cjs/Calendar/hooks/useCalendar.d.ts

@@ -0,0 +1,2 @@
+import { CalendarContextValue } from '../CalendarProvider';
+export declare const useCalendar: () => CalendarContextValue;

package/cjs/Calendar/hooks/useCalendar.js

@@ -0,0 +1,10 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.useCalendar = void 0;
+var _react = require("react");
+var _CalendarProvider = require("../CalendarProvider");
+var useCalendar = exports.useCalendar = function useCalendar() {
+  return (0, _react.useContext)(_CalendarProvider.CalendarContext);
+};

package/cjs/Calendar/{useCalendarDate.d.ts → hooks/useCalendarDate.d.ts}

@@ -1,6 +1,5 @@
-declare const useCalendarDate: (value: Date | null | undefined, defaultDate: Date | undefined) => {
+export declare const useCalendarDate: (value: Date | null | undefined, defaultDate: Date | undefined) => {
     calendarDate: Date;
     setCalendarDate: (date: React.SetStateAction<Date> | undefined) => void;
     resetCalendarDate: (nextValue?: any) => void;
 };
-export default useCalendarDate;

package/cjs/Calendar/{useCalendarDate.js → hooks/useCalendarDate.js}

@@ -2,13 +2,14 @@
 "use strict";
 
 exports.__esModule = true;
-exports.default = void 0;
+exports.useCalendarDate = void 0;
 var _react = require("react");
-var _hooks = require("../internals/hooks");
-var useCalendarDate = function useCalendarDate(value, defaultDate) {
+var _hooks = require("../../internals/hooks");
+var _date = require("../../internals/utils/date");
+var useCalendarDate = exports.useCalendarDate = function useCalendarDate(value, defaultDate) {
   var _ref;
   var valueRef = (0, _react.useRef)(value);
-  var _useState = (0, _react.useState)((_ref = value !== null && value !== void 0 ? value : defaultDate) !== null && _ref !== void 0 ? _ref : new Date()),
+  var _useState = (0, _react.useState)((_ref = value !== null && value !== void 0 ? value : defaultDate) !== null && _ref !== void 0 ? _ref : (0, _date.startOfToday)()),
     calendarDate = _useState[0],
     setValue = _useState[1];
   var setCalendarDate = (0, _react.useCallback)(function (date) {
@@ -21,13 +22,13 @@ var useCalendarDate = function useCalendarDate(value, defaultDate) {
     if (nextValue === void 0) {
       nextValue = value;
     }
-    setValue((_ref2 = (_nextValue = nextValue) !== null && _nextValue !== void 0 ? _nextValue : defaultDate) !== null && _ref2 !== void 0 ? _ref2 : new Date());
+    setValue((_ref2 = (_nextValue = nextValue) !== null && _nextValue !== void 0 ? _nextValue : defaultDate) !== null && _ref2 !== void 0 ? _ref2 : (0, _date.startOfToday)());
   }, [defaultDate, value]);
   (0, _hooks.useUpdateEffect)(function () {
     var _valueRef$current;
     if ((value === null || value === void 0 ? void 0 : value.valueOf()) !== ((_valueRef$current = valueRef.current) === null || _valueRef$current === void 0 ? void 0 : _valueRef$current.valueOf())) {
       var _ref3;
-      setCalendarDate((_ref3 = value !== null && value !== void 0 ? value : defaultDate) !== null && _ref3 !== void 0 ? _ref3 : new Date());
+      setCalendarDate((_ref3 = value !== null && value !== void 0 ? value : defaultDate) !== null && _ref3 !== void 0 ? _ref3 : (0, _date.startOfToday)());
       valueRef.current = value;
     }
   }, [value, defaultDate]);
@@ -36,5 +37,4 @@ var useCalendarDate = function useCalendarDate(value, defaultDate) {
     setCalendarDate: setCalendarDate,
     resetCalendarDate: resetCalendarDate
   };
-};
-var _default = exports.default = useCalendarDate;
+};

package/cjs/Calendar/hooks/useCalendarState.d.ts

@@ -0,0 +1,22 @@
+export declare enum CalendarState {
+    'TIME' = "TIME",
+    'MONTH' = "MONTH"
+}
+export interface CalendarStateProps {
+    defaultState?: CalendarState;
+    calendarDate: Date;
+    onMoveForward?: (date: Date) => void;
+    onMoveBackward?: (date: Date) => void;
+    onToggleTimeDropdown?: (toggle: boolean) => void;
+    onToggleMonthDropdown?: (toggle: boolean) => void;
+}
+export declare const useCalendarState: (props: CalendarStateProps) => {
+    calendarState: CalendarState | undefined;
+    handlers: {
+        onMoveForward: (...args: any[]) => any;
+        onMoveBackward: (...args: any[]) => any;
+        onToggleTimeDropdown: (...args: any[]) => any;
+        onToggleMonthDropdown: (...args: any[]) => any;
+    };
+    reset: () => void;
+};

package/cjs/Calendar/hooks/useCalendarState.js

@@ -0,0 +1,60 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.useCalendarState = exports.CalendarState = void 0;
+var _react = require("react");
+var _date = require("../../internals/utils/date");
+var _hooks = require("../../internals/hooks");
+var CalendarState = exports.CalendarState = /*#__PURE__*/function (CalendarState) {
+  CalendarState["TIME"] = "TIME";
+  CalendarState["MONTH"] = "MONTH";
+  return CalendarState;
+}({});
+var useCalendarState = exports.useCalendarState = function useCalendarState(props) {
+  var _useState = (0, _react.useState)(props.defaultState),
+    calendarState = _useState[0],
+    setCalendarState = _useState[1];
+  var reset = (0, _react.useCallback)(function () {
+    setCalendarState(undefined);
+  }, []);
+  var onMoveForward = (0, _hooks.useEventCallback)(function () {
+    var _props$onMoveForward;
+    (_props$onMoveForward = props.onMoveForward) === null || _props$onMoveForward === void 0 ? void 0 : _props$onMoveForward.call(props, (0, _date.addMonths)(props.calendarDate, 1));
+  });
+  var onMoveBackward = (0, _hooks.useEventCallback)(function () {
+    var _props$onMoveBackward;
+    (_props$onMoveBackward = props.onMoveBackward) === null || _props$onMoveBackward === void 0 ? void 0 : _props$onMoveBackward.call(props, (0, _date.addMonths)(props.calendarDate, -1));
+  });
+  var onToggleTimeDropdown = (0, _hooks.useEventCallback)(function () {
+    var _props$onToggleTimeDr;
+    if (calendarState === CalendarState.TIME) {
+      reset();
+    } else {
+      setCalendarState(CalendarState.TIME);
+    }
+    (_props$onToggleTimeDr = props.onToggleTimeDropdown) === null || _props$onToggleTimeDr === void 0 ? void 0 : _props$onToggleTimeDr.call(props, calendarState !== CalendarState.TIME);
+  });
+  var onToggleMonthDropdown = (0, _hooks.useEventCallback)(function () {
+    var _props$onToggleMonthD;
+    if (calendarState === CalendarState.MONTH) {
+      reset();
+    } else {
+      setCalendarState(CalendarState.MONTH);
+    }
+    (_props$onToggleMonthD = props.onToggleMonthDropdown) === null || _props$onToggleMonthD === void 0 ? void 0 : _props$onToggleMonthD.call(props, calendarState !== CalendarState.MONTH);
+  });
+  var handlers = (0, _react.useMemo)(function () {
+    return {
+      onMoveForward: onMoveForward,
+      onMoveBackward: onMoveBackward,
+      onToggleTimeDropdown: onToggleTimeDropdown,
+      onToggleMonthDropdown: onToggleMonthDropdown
+    };
+  }, [onMoveBackward, onMoveForward, onToggleMonthDropdown, onToggleTimeDropdown]);
+  return {
+    calendarState: calendarState,
+    handlers: handlers,
+    reset: reset
+  };
+};

package/cjs/Calendar/index.d.ts

@@ -1,8 +1,6 @@
 import Calendar from './Calendar';
 import CalendarContainer from './CalendarContainer';
-import { CalendarState } from './useCalendarState';
-import CalendarContext, { CalendarContextValue } from './CalendarContext';
-export { CalendarContainer, CalendarContext, CalendarState };
-export type { CalendarContextValue };
+import { CalendarState } from './hooks';
+export { CalendarContainer, CalendarState };
 export type { CalendarProps } from './Calendar';
 export default Calendar;