UNPKG

tdesign-react

Version:
596 lines (588 loc) 23.3 kB
/** * tdesign v1.11.6 * (c) 2025 tdesign * @license MIT */ 'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var defineProperty = require('../_chunks/dep-56a79f9c.js'); var toConsumableArray = require('../_chunks/dep-f500d2b7.js'); var slicedToArray = require('../_chunks/dep-48e1db8c.js'); var React = require('react'); var classNames = require('classnames'); var dayjs = require('dayjs'); var format = require('../_chunks/dep-bcbfaefb.js'); var utils = require('../_chunks/dep-e1b3724f.js'); var log = require('../_chunks/dep-fca46a1f.js'); var hooks_useConfig = require('../hooks/useConfig.js'); var rangeInput_index = require('../range-input/index.js'); var datePicker_panel_RangePanel = require('./panel/RangePanel.js'); var datePicker_hooks_useRange = require('./hooks/useRange.js'); var datePicker_defaultProps = require('./defaultProps.js'); var hooks_useDefaultProps = require('../hooks/useDefaultProps.js'); var datePicker_utils = require('./utils.js'); require('../_chunks/dep-5b35215f.js'); require('../_chunks/dep-6b4846c3.js'); require('../_chunks/dep-f6f16bd8.js'); require('../_chunks/dep-3c8023f1.js'); require('../_chunks/dep-6e34d7d7.js'); require('../_chunks/dep-ec3beb8d.js'); require('../_chunks/dep-d45b3350.js'); require('../_chunks/dep-3c040a0c.js'); require('../_chunks/dep-a817745a.js'); require('../_chunks/dep-1d022321.js'); require('../_chunks/dep-02a1b59c.js'); require('../_chunks/dep-8d4e8f1c.js'); require('../_chunks/dep-4546f1ae.js'); require('../_chunks/dep-d11b328f.js'); require('../_chunks/dep-346ac5f4.js'); require('../_chunks/dep-73937edb.js'); require('../_chunks/dep-9df70348.js'); require('../config-provider/ConfigContext.js'); require('../_chunks/dep-fa2097c1.js'); require('../_chunks/dep-59bb0827.js'); require('../_chunks/dep-68f8743f.js'); require('../_chunks/dep-a8d0483a.js'); require('../_chunks/dep-b7e21379.js'); require('../_chunks/dep-ab08e148.js'); require('../_chunks/dep-af16359b.js'); require('../_chunks/dep-e11afe29.js'); require('../_chunks/dep-612ec5c9.js'); require('../_chunks/dep-4d25d6c0.js'); require('../_chunks/dep-496c0353.js'); require('../_chunks/dep-1f530d81.js'); require('../_chunks/dep-a4bc3144.js'); require('../_chunks/dep-535a3b69.js'); require('../range-input/RangeInput.js'); require('../_chunks/dep-da07bc8c.js'); require('tdesign-icons-react'); require('../input/index.js'); require('../input/Input.js'); require('../hooks/useLayoutEffect.js'); require('../_util/dom.js'); require('raf'); require('../_util/easing.js'); require('../_util/forwardRefWithStatics.js'); require('hoist-non-react-statics'); require('../hooks/useGlobalIcon.js'); require('../input/InputGroup.js'); require('../hooks/useControlled.js'); require('../_util/noop.js'); require('../_chunks/dep-35df84a1.js'); require('../_chunks/dep-fe42fca8.js'); require('../_chunks/dep-dc26f226.js'); require('../locale/LocalReceiver.js'); require('../config-provider/ConfigProvider.js'); require('../_chunks/dep-48ac011e.js'); require('../_chunks/dep-c4eb94d2.js'); require('../_chunks/dep-d5a77c7c.js'); require('../_chunks/dep-b7847924.js'); require('../_chunks/dep-0d35f53a.js'); require('../_chunks/dep-d8727aa2.js'); require('../_chunks/dep-440a0ba0.js'); require('../input/defaultProps.js'); require('../_util/parseTNode.js'); require('../input/useLengthLimit.js'); require('../_chunks/dep-9ecc1939.js'); require('../_chunks/dep-82a8b824.js'); require('../range-input/defaultProps.js'); require('../range-input/RangeInputPopup.js'); require('../popup/index.js'); require('../popup/Popup.js'); require('react-transition-group'); require('react-popper'); require('../hooks/useAnimation.js'); require('../common/Portal.js'); require('react-dom'); require('../popup/hooks/useTrigger.js'); require('react-is'); require('../popup/utils/ref.js'); require('../_util/composeRefs.js'); require('../popup/utils/transition.js'); require('../hooks/useMutationObserver.js'); require('../hooks/useLatest.js'); require('../_chunks/dep-4dcb7805.js'); require('../_chunks/dep-3d31346e.js'); require('../_chunks/dep-bf176c49.js'); require('../_chunks/dep-30d1d019.js'); require('../hooks/useWindowSize.js'); require('../popup/defaultProps.js'); require('../hooks/useAttach.js'); require('../popup/PopupPlugin.js'); require('../_chunks/dep-e9660f30.js'); require('@popperjs/core'); require('../_util/react-render.js'); require('../select-input/useOverlayInnerStyle.js'); require('./panel/PanelContent.js'); require('./base/Header.js'); require('../select/index.js'); require('../select/base/Select.js'); require('../_util/helper.js'); require('../_chunks/dep-3b342ce7.js'); require('../select/util/helper.js'); require('../select/base/OptionGroup.js'); require('../select/defaultProps.js'); require('../select/base/Option.js'); require('../hooks/useDomRefCallback.js'); require('../hooks/useRipple.js'); require('../_util/setStyle.js'); require('../_chunks/dep-32cacffb.js'); require('../_chunks/dep-476b268c.js'); require('../common/FakeArrow.js'); require('../loading/index.js'); require('../loading/Loading.js'); require('../_chunks/dep-c43c91af.js'); require('../loading/defaultProps.js'); require('../loading/plugin.js'); require('../common/PluginContainer.js'); require('../select-input/index.js'); require('../select-input/SelectInput.js'); require('../select-input/useSingle.js'); require('../_chunks/dep-42a29965.js'); require('../_chunks/dep-1edabb9f.js'); require('../_chunks/dep-6dccca61.js'); require('../_chunks/dep-345a6333.js'); require('../_chunks/dep-53a1df7e.js'); require('../select-input/useMultiple.js'); require('../tag-input/index.js'); require('../tag-input/TagInput.js'); require('../hooks/useDragSorter.js'); require('../hooks/useEventCallback.js'); require('../tag-input/useTagScroll.js'); require('../tag-input/useTagList.js'); require('../tag/index.js'); require('../tag/Tag.js'); require('tinycolor2'); require('../tag/defaultProps.js'); require('../tag/CheckTag.js'); require('../_chunks/dep-90f4ef78.js'); require('../tag/CheckTagGroup.js'); require('../tag-input/useHover.js'); require('../tag-input/defaultProps.js'); require('../select-input/defaultProps.js'); require('../select/base/PopupContent.js'); require('../select/hooks/usePanelVirtualScroll.js'); require('../hooks/useVirtualScroll.js'); require('../hooks/useResizeObserver.js'); require('../select/hooks/useOptions.js'); require('../pagination/index.js'); require('../pagination/Pagination.js'); require('../input-number/index.js'); require('../input-number/InputNumber.js'); require('../button/index.js'); require('../button/Button.js'); require('../button/defaultProps.js'); require('../input-number/useInputNumber.js'); require('../_chunks/dep-8b01d649.js'); require('../hooks/useCommonClassName.js'); require('../input-number/defaultProps.js'); require('../input-adornment/InputAdornment.js'); require('../pagination/hooks/useBoundaryJumper.js'); require('../pagination/hooks/usePrevNextJumper.js'); require('../pagination/hooks/usePageNumber.js'); require('../pagination/hooks/useTotal.js'); require('../pagination/validators.js'); require('../pagination/defaultProps.js'); require('../_chunks/dep-fec02fc8.js'); require('../_chunks/dep-775c9851.js'); require('../pagination/PaginationMini.js'); require('./base/Table.js'); require('./base/Cell.js'); require('../time-picker/index.js'); require('../time-picker/TimePicker.js'); require('../_chunks/dep-df84738c.js'); require('../time-picker/hooks/useTimePickerTextConfig.js'); require('../hooks/useDebounce.js'); require('../hooks/usePersistFn.js'); require('../hooks/usePropsRef.js'); require('../time-picker/TimeRangePicker.js'); require('../time-picker/panel/TimePickerPanel.js'); require('../time-picker/defaultProps.js'); require('./panel/ExtraContent.js'); require('./base/Footer.js'); require('./hooks/useTableData.js'); require('./hooks/useDisableDate.js'); require('./hooks/useRangeValue.js'); require('../_chunks/dep-6830f3a8.js'); function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } var React__default = /*#__PURE__*/_interopDefaultLegacy(React); var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames); var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs); function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { defineProperty._defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } var DateRangePicker = /*#__PURE__*/React.forwardRef(function (originalProps, ref) { var _useConfig = hooks_useConfig["default"](), classPrefix = _useConfig.classPrefix, globalDatePickerConfig = _useConfig.datePicker; var props = hooks_useDefaultProps["default"](originalProps, datePicker_defaultProps.dateRangePickerDefaultProps); var className = props.className, style = props.style, disabled = props.disabled, mode = props.mode, enableTimePicker = props.enableTimePicker, disableDate = props.disableDate, _props$firstDayOfWeek = props.firstDayOfWeek, firstDayOfWeek = _props$firstDayOfWeek === void 0 ? globalDatePickerConfig.firstDayOfWeek : _props$firstDayOfWeek, presets = props.presets, timePickerProps = props.timePickerProps, presetsPlacement = props.presetsPlacement, panelPreselection = props.panelPreselection, cancelRangeSelectLimit = props.cancelRangeSelectLimit, onPick = props.onPick, disableTime = props.disableTime; var _useRange = datePicker_hooks_useRange["default"](props), inputValue = _useRange.inputValue, popupVisible = _useRange.popupVisible, rangeInputProps = _useRange.rangeInputProps, popupProps = _useRange.popupProps, value = _useRange.value, year = _useRange.year, month = _useRange.month, time = _useRange.time, activeIndex = _useRange.activeIndex, isHoverCell = _useRange.isHoverCell, setActiveIndex = _useRange.setActiveIndex, onChange = _useRange.onChange, setIsHoverCell = _useRange.setIsHoverCell, setInputValue = _useRange.setInputValue, setPopupVisible = _useRange.setPopupVisible, setTime = _useRange.setTime, setYear = _useRange.setYear, setMonth = _useRange.setMonth, isFirstValueSelected = _useRange.isFirstValueSelected, setIsFirstValueSelected = _useRange.setIsFirstValueSelected, cacheValue = _useRange.cacheValue, setCacheValue = _useRange.setCacheValue; var _getDefaultFormat = format.getDefaultFormat({ mode: mode, enableTimePicker: enableTimePicker, format: props.format, valueType: props.valueType }), format$1 = _getDefaultFormat.format, timeFormat = _getDefaultFormat.timeFormat, valueType = _getDefaultFormat.valueType; var _useState = React.useState(false), _useState2 = slicedToArray._slicedToArray(_useState, 2), isSelected = _useState2[0], setIsSelected = _useState2[1]; React.useEffect(function () { if (popupVisible) { setIsSelected(false); setCacheValue(format.formatDate(value || [], { format: format$1 })); setTime(format.formatTime(value || [dayjs__default["default"]().format(timeFormat), dayjs__default["default"]().format(timeFormat)], format$1, timeFormat, props.defaultTime)); if (!value.length) { var _initYearMonthTime = format.initYearMonthTime({ value: value, mode: mode, format: format$1, enableTimePicker: enableTimePicker }), defaultYear = _initYearMonthTime.year, defaultMonth = _initYearMonthTime.month; setYear(defaultYear); setMonth(defaultMonth); } else if (value.length === 2 && !enableTimePicker) { var nextMonth = value.map(function (v) { return format.parseToDayjs(v, format$1).month(); }); if (year[0] === year[1] && nextMonth[0] === nextMonth[1]) { nextMonth[0] === 11 ? nextMonth[0] -= 1 : nextMonth[1] += 1; } setYear(value.map(function (v) { return format.parseToDayjs(v, format$1).year(); })); setMonth(nextMonth); } else { setYear(value.map(function (v) { return format.parseToDayjs(v, format$1).year(); })); setMonth(value.map(function (v) { return format.parseToDayjs(v, format$1).month(); })); } } else { setActiveIndex(0); setIsHoverCell(false); setIsFirstValueSelected(false); setInputValue(format.formatDate(value || [], { format: format$1 })); } }, [popupVisible]); function onCellMouseEnter(date) { setIsHoverCell(true); var nextValue = toConsumableArray._toConsumableArray(inputValue); nextValue[activeIndex] = format.formatDate(date, { format: format$1 }); setInputValue(nextValue); } function onCellMouseLeave() { setIsHoverCell(false); setInputValue(cacheValue); } function onCellClick(date, _ref) { var e = _ref.e; onPick === null || onPick === void 0 || onPick(date, { e: e, partial: activeIndex ? "end" : "start" }); setIsHoverCell(false); setIsSelected(true); var nextValue = toConsumableArray._toConsumableArray(inputValue); nextValue[activeIndex] = format.formatDate(date, { format: format$1 }); setCacheValue(nextValue); setInputValue(nextValue); if (enableTimePicker) return; var notValidIndex = nextValue.findIndex(function (v) { return !v || !format.isValidDate(v, format$1); }); if (notValidIndex === -1 && nextValue.length === 2) { if (!isFirstValueSelected && format.parseToDayjs(nextValue[0], format$1).isAfter(format.parseToDayjs(nextValue[1], format$1))) { nextValue[activeIndex ? 0 : 1] = ""; setCacheValue(nextValue); setInputValue(nextValue); } else { onChange(format.formatDate(nextValue, { format: format$1, targetFormat: valueType, autoSwap: true }), { dayjsValue: nextValue.map(function (v) { return format.parseToDayjs(v, format$1); }), trigger: "pick" }); } } if (!isFirstValueSelected || !activeIndex) { var nextIndex = notValidIndex; if (nextIndex === -1) nextIndex = activeIndex ? 0 : 1; setActiveIndex(nextIndex); setIsFirstValueSelected(!!nextValue[0]); } else { setPopupVisible(false); } } function onJumperClick(_ref2) { var trigger = _ref2.trigger, partial = _ref2.partial; var partialIndex = partial === "start" ? 0 : 1; var monthCountMap = { date: 1, week: 1, month: 12, quarter: 12, year: 120 }; var monthCount = monthCountMap[mode] || 0; var current = new Date(year[partialIndex], month[partialIndex]); var next = null; if (trigger === "prev") { next = utils.subtractMonth(current, monthCount); } else if (trigger === "current") { next = new Date(); } else if (trigger === "next") { next = utils.addMonth(current, monthCount); } var nextYear = toConsumableArray._toConsumableArray(year); nextYear[partialIndex] = next.getFullYear(); var nextMonth = toConsumableArray._toConsumableArray(month); nextMonth[partialIndex] = next.getMonth(); var onlyYearSelect = ["year", "quarter", "month"].includes(mode); var correctedDate = datePicker_utils.dateCorrection(partialIndex, nextYear, nextMonth, onlyYearSelect); nextYear = correctedDate.nextYear; nextMonth = correctedDate.nextMonth; setYear(nextYear); setMonth(nextMonth); } function onTimePickerChange(val) { var _extractTimeObj = utils.extractTimeObj(val), hours = _extractTimeObj.hours, minutes = _extractTimeObj.minutes, seconds = _extractTimeObj.seconds, milliseconds = _extractTimeObj.milliseconds, meridiem = _extractTimeObj.meridiem; var nextInputValue = toConsumableArray._toConsumableArray(inputValue); var changedInputValue = inputValue[activeIndex]; var currentDate = !dayjs__default["default"](changedInputValue, format$1).isValid() ? dayjs__default["default"]().year(year[activeIndex]).month(month[activeIndex]) : dayjs__default["default"](changedInputValue, format$1); var nextHours = hours; if (/am/i.test(meridiem) && nextHours === 12) nextHours -= 12; if (/pm/i.test(meridiem) && nextHours < 12) nextHours += 12; var nextDate = currentDate.hour(nextHours).minute(minutes).second(seconds).millisecond(milliseconds).toDate(); nextInputValue[activeIndex] = nextDate; var nextTime = toConsumableArray._toConsumableArray(time); nextTime[activeIndex] = val; setTime(nextTime); setIsSelected(true); setInputValue(format.formatDate(nextInputValue, { format: format$1 })); setCacheValue(format.formatDate(nextInputValue, { format: format$1 })); } function onConfirmClick(_ref3) { var _props$onConfirm; var e = _ref3.e; var nextValue = toConsumableArray._toConsumableArray(inputValue); props === null || props === void 0 || (_props$onConfirm = props.onConfirm) === null || _props$onConfirm === void 0 || _props$onConfirm.call(props, { e: e, date: nextValue, partial: activeIndex ? "end" : "start" }); var notValidIndex = nextValue.findIndex(function (v) { return !v || !format.isValidDate(v, format$1); }); if (notValidIndex === -1 && nextValue.length === 2) { if (!isFirstValueSelected && format.parseToDayjs(nextValue[0], format$1).isAfter(format.parseToDayjs(nextValue[1], format$1))) { nextValue[activeIndex ? 0 : 1] = ""; setCacheValue(nextValue); setInputValue(nextValue); } else { onChange(format.formatDate(nextValue, { format: format$1, targetFormat: valueType, autoSwap: true }), { dayjsValue: nextValue.map(function (v) { return format.parseToDayjs(v, format$1); }), trigger: "confirm" }); } } if (!isFirstValueSelected || !activeIndex) { var nextIndex = notValidIndex; if (nextIndex === -1) nextIndex = activeIndex ? 0 : 1; setActiveIndex(nextIndex); setIsFirstValueSelected(!!nextValue[0]); } else if (nextValue.length === 2) { setPopupVisible(false); } } function onPresetClick(preset, context) { var presetValue = preset; if (typeof preset === "function") { presetValue = preset(); } if (!Array.isArray(presetValue)) { log.log.error("DateRangePicker", "preset: ".concat(preset, " must be Array!")); } else { var _props$onPresetClick; onChange(format.formatDate(presetValue, { format: format$1, targetFormat: valueType, autoSwap: true }), { dayjsValue: presetValue.map(function (p) { return format.parseToDayjs(p, format$1); }), trigger: "preset" }); (_props$onPresetClick = props.onPresetClick) === null || _props$onPresetClick === void 0 || _props$onPresetClick.call(props, context); setPopupVisible(false); } } function onYearChange(nextVal, _ref4) { var partial = _ref4.partial; var partialIndex = partial === "start" ? 0 : 1; if (enableTimePicker) partialIndex = activeIndex; var nextYear = toConsumableArray._toConsumableArray(year); var nextMonth = toConsumableArray._toConsumableArray(month); nextYear[partialIndex] = nextVal; var onlyYearSelect = ["year", "quarter", "month"].includes(mode); var correctedDate = datePicker_utils.dateCorrection(partialIndex, nextYear, nextMonth, onlyYearSelect); nextYear = correctedDate.nextYear; nextMonth = correctedDate.nextMonth; setYear(nextYear); !onlyYearSelect && setMonth(nextMonth); } function onMonthChange(nextVal, _ref5) { var partial = _ref5.partial; var partialIndex = partial === "start" ? 0 : 1; if (enableTimePicker) partialIndex = activeIndex; setMonth(function (currentMonth) { var nextMonth = toConsumableArray._toConsumableArray(currentMonth); nextMonth[partialIndex] = nextVal; if (year[0] === year[1]) { if (partialIndex === 0) { if (nextMonth[1] <= nextMonth[0]) { nextMonth[1] = nextMonth[0] + 1; if (nextMonth[1] === 12) { nextMonth[1] = 0; setYear(function (currentYear) { return [currentYear[0], currentYear[1] + 1]; }); } } } if (partialIndex === 1) { nextMonth[0] = Math.min(nextMonth[0], nextMonth[1]); if (nextMonth[0] >= nextMonth[1]) { nextMonth[0] -= 1; if (nextMonth[0] === -1) { nextMonth[0] = 11; setYear(function (currentYear) { return [currentYear[0] - 1, currentYear[1]]; }); } } } } return nextMonth; }); } var panelProps = { hoverValue: isHoverCell ? inputValue : [], value: isSelected ? cacheValue : value, isFirstValueSelected: isFirstValueSelected, panelPreselection: panelPreselection, year: year, month: month, mode: mode, format: format$1, presets: presets, time: time, disableDate: disableDate, firstDayOfWeek: firstDayOfWeek, timePickerProps: timePickerProps, enableTimePicker: enableTimePicker, presetsPlacement: presetsPlacement, activeIndex: activeIndex, popupVisible: popupVisible, cancelRangeSelectLimit: cancelRangeSelectLimit, onCellClick: onCellClick, onCellMouseEnter: onCellMouseEnter, onCellMouseLeave: onCellMouseLeave, onJumperClick: onJumperClick, onConfirmClick: onConfirmClick, onPresetClick: onPresetClick, onYearChange: onYearChange, onMonthChange: onMonthChange, onTimePickerChange: onTimePickerChange, disableTime: disableTime }; return /* @__PURE__ */React__default["default"].createElement("div", { className: classNames__default["default"]("".concat(classPrefix, "-date-range-picker"), className), style: style, ref: ref }, /* @__PURE__ */React__default["default"].createElement(rangeInput_index.RangeInputPopup, { disabled: disabled, status: props.status, tips: props.tips, inputValue: inputValue, popupProps: popupProps, rangeInputProps: rangeInputProps, popupVisible: popupVisible, panel: /* @__PURE__ */React__default["default"].createElement(datePicker_panel_RangePanel["default"], _objectSpread({}, panelProps)) })); }); DateRangePicker.displayName = "DateRangePicker"; exports["default"] = DateRangePicker; //# sourceMappingURL=DateRangePicker.js.map