add all frontend files

This commit is contained in:
2026-01-17 15:16:36 -05:00
parent ff16ae7858
commit e40287e4aa
25704 changed files with 1935289 additions and 0 deletions

View File

@@ -0,0 +1,19 @@
import * as React from 'react';
import type { GenerateConfig } from '../../generate';
import type { DisabledDate, InternalMode, PanelMode, SharedPickerProps } from '../../interface';
import type { PopupShowTimeConfig } from '.';
export interface FooterProps<DateType extends object = any> {
mode: PanelMode;
internalMode: InternalMode;
renderExtraFooter?: SharedPickerProps['renderExtraFooter'];
showNow: boolean;
generateConfig: GenerateConfig<DateType>;
disabledDate: DisabledDate<DateType>;
showTime?: PopupShowTimeConfig<DateType>;
/** From Footer component used only. Check if can OK button click */
invalid?: boolean;
onSubmit: (date?: DateType) => void;
needConfirm: boolean;
onNow: (now: DateType) => void;
}
export default function Footer(props: FooterProps): React.JSX.Element;

81
node_modules/rc-picker/lib/PickerInput/Popup/Footer.js generated vendored Normal file
View File

@@ -0,0 +1,81 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = Footer;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _classnames = _interopRequireDefault(require("classnames"));
var React = _interopRequireWildcard(require("react"));
var _useTimeInfo3 = _interopRequireDefault(require("../../hooks/useTimeInfo"));
var _context = _interopRequireDefault(require("../context"));
function Footer(props) {
var mode = props.mode,
internalMode = props.internalMode,
renderExtraFooter = props.renderExtraFooter,
showNow = props.showNow,
showTime = props.showTime,
onSubmit = props.onSubmit,
onNow = props.onNow,
invalid = props.invalid,
needConfirm = props.needConfirm,
generateConfig = props.generateConfig,
disabledDate = props.disabledDate;
var _React$useContext = React.useContext(_context.default),
prefixCls = _React$useContext.prefixCls,
locale = _React$useContext.locale,
_React$useContext$but = _React$useContext.button,
Button = _React$useContext$but === void 0 ? 'button' : _React$useContext$but;
// >>> Now
var now = generateConfig.getNow();
var _useTimeInfo = (0, _useTimeInfo3.default)(generateConfig, showTime, now),
_useTimeInfo2 = (0, _slicedToArray2.default)(_useTimeInfo, 1),
getValidTime = _useTimeInfo2[0];
// ======================== Extra =========================
var extraNode = renderExtraFooter === null || renderExtraFooter === void 0 ? void 0 : renderExtraFooter(mode);
// ======================== Ranges ========================
var nowDisabled = disabledDate(now, {
type: mode
});
var onInternalNow = function onInternalNow() {
if (!nowDisabled) {
var validateNow = getValidTime(now);
onNow(validateNow);
}
};
var nowPrefixCls = "".concat(prefixCls, "-now");
var nowBtnPrefixCls = "".concat(nowPrefixCls, "-btn");
var presetNode = showNow && /*#__PURE__*/React.createElement("li", {
className: nowPrefixCls
}, /*#__PURE__*/React.createElement("a", {
className: (0, _classnames.default)(nowBtnPrefixCls, nowDisabled && "".concat(nowBtnPrefixCls, "-disabled")),
"aria-disabled": nowDisabled,
onClick: onInternalNow
}, internalMode === 'date' ? locale.today : locale.now));
// >>> OK
var okNode = needConfirm && /*#__PURE__*/React.createElement("li", {
className: "".concat(prefixCls, "-ok")
}, /*#__PURE__*/React.createElement(Button, {
disabled: invalid,
onClick: onSubmit
}, locale.ok));
var rangeNode = (presetNode || okNode) && /*#__PURE__*/React.createElement("ul", {
className: "".concat(prefixCls, "-ranges")
}, presetNode, okNode);
// ======================== Render ========================
if (!extraNode && !rangeNode) {
return null;
}
return /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-footer")
}, extraNode && /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-footer-extra")
}, extraNode), rangeNode);
}

View File

@@ -0,0 +1,10 @@
import * as React from 'react';
import { type PickerPanelProps } from '../../PickerPanel';
import { type FooterProps } from './Footer';
export type MustProp<DateType extends object> = Required<Pick<PickerPanelProps<DateType>, 'mode' | 'onPanelChange'>>;
export type PopupPanelProps<DateType extends object = any> = MustProp<DateType> & Omit<PickerPanelProps<DateType>, 'onPickerValueChange' | 'showTime'> & FooterProps<DateType> & {
multiplePanel?: boolean;
range?: boolean;
onPickerValueChange: (date: DateType) => void;
};
export default function PopupPanel<DateType extends object = any>(props: PopupPanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,87 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = PopupPanel;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var React = _interopRequireWildcard(require("react"));
var _PickerPanel = _interopRequireDefault(require("../../PickerPanel"));
var _context = require("../../PickerPanel/context");
var _context2 = _interopRequireDefault(require("../context"));
var _useRangePickerValue = require("../hooks/useRangePickerValue");
function PopupPanel(props) {
var picker = props.picker,
multiplePanel = props.multiplePanel,
pickerValue = props.pickerValue,
onPickerValueChange = props.onPickerValueChange,
needConfirm = props.needConfirm,
onSubmit = props.onSubmit,
range = props.range,
hoverValue = props.hoverValue;
var _React$useContext = React.useContext(_context2.default),
prefixCls = _React$useContext.prefixCls,
generateConfig = _React$useContext.generateConfig;
// ======================== Offset ========================
var internalOffsetDate = React.useCallback(function (date, offset) {
return (0, _useRangePickerValue.offsetPanelDate)(generateConfig, picker, date, offset);
}, [generateConfig, picker]);
var nextPickerValue = React.useMemo(function () {
return internalOffsetDate(pickerValue, 1);
}, [pickerValue, internalOffsetDate]);
// Outside
var onSecondPickerValueChange = function onSecondPickerValueChange(nextDate) {
onPickerValueChange(internalOffsetDate(nextDate, -1));
};
// ======================= Context ========================
var sharedContext = {
onCellDblClick: function onCellDblClick() {
if (needConfirm) {
onSubmit();
}
}
};
var hideHeader = picker === 'time';
// ======================== Props =========================
var pickerProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
hoverValue: null,
hoverRangeValue: null,
hideHeader: hideHeader
});
if (range) {
pickerProps.hoverRangeValue = hoverValue;
} else {
pickerProps.hoverValue = hoverValue;
}
// ======================== Render ========================
// Multiple
if (multiplePanel) {
return /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-panels")
}, /*#__PURE__*/React.createElement(_context.PickerHackContext.Provider, {
value: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, sharedContext), {}, {
hideNext: true
})
}, /*#__PURE__*/React.createElement(_PickerPanel.default, pickerProps)), /*#__PURE__*/React.createElement(_context.PickerHackContext.Provider, {
value: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, sharedContext), {}, {
hidePrev: true
})
}, /*#__PURE__*/React.createElement(_PickerPanel.default, (0, _extends2.default)({}, pickerProps, {
pickerValue: nextPickerValue,
onPickerValueChange: onSecondPickerValueChange
}))));
}
// Single
return /*#__PURE__*/React.createElement(_context.PickerHackContext.Provider, {
value: (0, _objectSpread2.default)({}, sharedContext)
}, /*#__PURE__*/React.createElement(_PickerPanel.default, pickerProps));
}

View File

@@ -0,0 +1,9 @@
import * as React from 'react';
import type { ValueDate } from '../../interface';
export interface PresetPanelProps<ValueType = any> {
prefixCls: string;
presets: ValueDate<ValueType>[];
onClick: (value: ValueType) => void;
onHover: (value: ValueType) => void;
}
export default function PresetPanel<DateType extends object = any>(props: PresetPanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,38 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = PresetPanel;
var React = _interopRequireWildcard(require("react"));
function executeValue(value) {
return typeof value === 'function' ? value() : value;
}
function PresetPanel(props) {
var prefixCls = props.prefixCls,
presets = props.presets,
_onClick = props.onClick,
onHover = props.onHover;
if (!presets.length) {
return null;
}
return /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-presets")
}, /*#__PURE__*/React.createElement("ul", null, presets.map(function (_ref, index) {
var label = _ref.label,
value = _ref.value;
return /*#__PURE__*/React.createElement("li", {
key: index,
onClick: function onClick() {
_onClick(executeValue(value));
},
onMouseEnter: function onMouseEnter() {
onHover(executeValue(value));
},
onMouseLeave: function onMouseLeave() {
onHover(null);
}
}, label);
})));
}

View File

@@ -0,0 +1,20 @@
import * as React from 'react';
import type { RangeTimeProps, SharedPickerProps, SharedTimeProps, ValueDate } from '../../interface';
import { type FooterProps } from './Footer';
import { type PopupPanelProps } from './PopupPanel';
export type PopupShowTimeConfig<DateType extends object = any> = Omit<RangeTimeProps<DateType>, 'defaultValue' | 'defaultOpenValue' | 'disabledTime'> & Pick<SharedTimeProps<DateType>, 'disabledTime'>;
export interface PopupProps<DateType extends object = any, PresetValue = DateType> extends Pick<React.InputHTMLAttributes<HTMLDivElement>, 'onFocus' | 'onBlur'>, FooterProps<DateType>, PopupPanelProps<DateType> {
panelRender?: SharedPickerProps['panelRender'];
presets: ValueDate<DateType>[];
onPresetHover: (presetValue: PresetValue) => void;
onPresetSubmit: (presetValue: PresetValue) => void;
activeInfo?: [activeInputLeft: number, activeInputRight: number, selectorWidth: number];
direction?: 'ltr' | 'rtl';
/** TimePicker or showTime only */
defaultOpenValue: DateType;
needConfirm: boolean;
isInvalid: (date: DateType | DateType[]) => boolean;
onOk: VoidFunction;
onPanelMouseDown?: React.MouseEventHandler<HTMLDivElement>;
}
export default function Popup<DateType extends object = any>(props: PopupProps<DateType>): React.JSX.Element;

198
node_modules/rc-picker/lib/PickerInput/Popup/index.js generated vendored Normal file
View File

@@ -0,0 +1,198 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = Popup;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _classnames = _interopRequireDefault(require("classnames"));
var _rcResizeObserver = _interopRequireDefault(require("rc-resize-observer"));
var React = _interopRequireWildcard(require("react"));
var _miscUtil = require("../../utils/miscUtil");
var _context = _interopRequireDefault(require("../context"));
var _Footer = _interopRequireDefault(require("./Footer"));
var _PopupPanel = _interopRequireDefault(require("./PopupPanel"));
var _PresetPanel = _interopRequireDefault(require("./PresetPanel"));
function Popup(props) {
var panelRender = props.panelRender,
internalMode = props.internalMode,
picker = props.picker,
showNow = props.showNow,
range = props.range,
multiple = props.multiple,
_props$activeInfo = props.activeInfo,
activeInfo = _props$activeInfo === void 0 ? [0, 0, 0] : _props$activeInfo,
presets = props.presets,
onPresetHover = props.onPresetHover,
onPresetSubmit = props.onPresetSubmit,
onFocus = props.onFocus,
onBlur = props.onBlur,
onPanelMouseDown = props.onPanelMouseDown,
direction = props.direction,
value = props.value,
onSelect = props.onSelect,
isInvalid = props.isInvalid,
defaultOpenValue = props.defaultOpenValue,
onOk = props.onOk,
onSubmit = props.onSubmit;
var _React$useContext = React.useContext(_context.default),
prefixCls = _React$useContext.prefixCls;
var panelPrefixCls = "".concat(prefixCls, "-panel");
var rtl = direction === 'rtl';
// ========================= Refs =========================
var arrowRef = React.useRef(null);
var wrapperRef = React.useRef(null);
// ======================== Offset ========================
var _React$useState = React.useState(0),
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
containerWidth = _React$useState2[0],
setContainerWidth = _React$useState2[1];
var _React$useState3 = React.useState(0),
_React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
containerOffset = _React$useState4[0],
setContainerOffset = _React$useState4[1];
var _React$useState5 = React.useState(0),
_React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
arrowOffset = _React$useState6[0],
setArrowOffset = _React$useState6[1];
var onResize = function onResize(info) {
if (info.width) {
setContainerWidth(info.width);
}
};
var _activeInfo = (0, _slicedToArray2.default)(activeInfo, 3),
activeInputLeft = _activeInfo[0],
activeInputRight = _activeInfo[1],
selectorWidth = _activeInfo[2];
var _React$useState7 = React.useState(0),
_React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
retryTimes = _React$useState8[0],
setRetryTimes = _React$useState8[1];
React.useEffect(function () {
setRetryTimes(10);
}, [activeInputLeft]);
React.useEffect(function () {
// `activeOffset` is always align with the active input element
// So we need only check container contains the `activeOffset`
if (range && wrapperRef.current) {
var _arrowRef$current;
// Offset in case container has border radius
var arrowWidth = ((_arrowRef$current = arrowRef.current) === null || _arrowRef$current === void 0 ? void 0 : _arrowRef$current.offsetWidth) || 0;
// Arrow Offset
var wrapperRect = wrapperRef.current.getBoundingClientRect();
if (!wrapperRect.height || wrapperRect.right < 0) {
setRetryTimes(function (times) {
return Math.max(0, times - 1);
});
return;
}
var nextArrowOffset = (rtl ? activeInputRight - arrowWidth : activeInputLeft) - wrapperRect.left;
setArrowOffset(nextArrowOffset);
// Container Offset
if (containerWidth && containerWidth < selectorWidth) {
var offset = rtl ? wrapperRect.right - (activeInputRight - arrowWidth + containerWidth) : activeInputLeft + arrowWidth - wrapperRect.left - containerWidth;
var safeOffset = Math.max(0, offset);
setContainerOffset(safeOffset);
} else {
setContainerOffset(0);
}
}
}, [retryTimes, rtl, containerWidth, activeInputLeft, activeInputRight, selectorWidth, range]);
// ======================== Custom ========================
function filterEmpty(list) {
return list.filter(function (item) {
return item;
});
}
var valueList = React.useMemo(function () {
return filterEmpty((0, _miscUtil.toArray)(value));
}, [value]);
var isTimePickerEmptyValue = picker === 'time' && !valueList.length;
var footerSubmitValue = React.useMemo(function () {
if (isTimePickerEmptyValue) {
return filterEmpty([defaultOpenValue]);
}
return valueList;
}, [isTimePickerEmptyValue, valueList, defaultOpenValue]);
var popupPanelValue = isTimePickerEmptyValue ? defaultOpenValue : valueList;
var disableSubmit = React.useMemo(function () {
// Empty is invalid
if (!footerSubmitValue.length) {
return true;
}
return footerSubmitValue.some(function (val) {
return isInvalid(val);
});
}, [footerSubmitValue, isInvalid]);
var onFooterSubmit = function onFooterSubmit() {
// For TimePicker, we will additional trigger the value update
if (isTimePickerEmptyValue) {
onSelect(defaultOpenValue);
}
onOk();
onSubmit();
};
var mergedNodes = /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-panel-layout")
}, /*#__PURE__*/React.createElement(_PresetPanel.default, {
prefixCls: prefixCls,
presets: presets,
onClick: onPresetSubmit,
onHover: onPresetHover
}), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_PopupPanel.default, (0, _extends2.default)({}, props, {
value: popupPanelValue
})), /*#__PURE__*/React.createElement(_Footer.default, (0, _extends2.default)({}, props, {
showNow: multiple ? false : showNow,
invalid: disableSubmit,
onSubmit: onFooterSubmit
}))));
if (panelRender) {
mergedNodes = panelRender(mergedNodes);
}
// ======================== Render ========================
var containerPrefixCls = "".concat(panelPrefixCls, "-container");
var marginLeft = 'marginLeft';
var marginRight = 'marginRight';
// Container
var renderNode = /*#__PURE__*/React.createElement("div", {
onMouseDown: onPanelMouseDown,
tabIndex: -1,
className: (0, _classnames.default)(containerPrefixCls, // Used for Today Button style, safe to remove if no need
"".concat(prefixCls, "-").concat(internalMode, "-panel-container")),
style: (0, _defineProperty2.default)((0, _defineProperty2.default)({}, rtl ? marginRight : marginLeft, containerOffset), rtl ? marginLeft : marginRight, 'auto')
// Still wish not to lose focus on mouse down
// onMouseDown={(e) => {
// // e.preventDefault();
// }}
,
onFocus: onFocus,
onBlur: onBlur
}, mergedNodes);
if (range) {
renderNode = /*#__PURE__*/React.createElement("div", {
onMouseDown: onPanelMouseDown,
ref: wrapperRef,
className: (0, _classnames.default)("".concat(prefixCls, "-range-wrapper"), "".concat(prefixCls, "-").concat(picker, "-range-wrapper"))
}, /*#__PURE__*/React.createElement("div", {
ref: arrowRef,
className: "".concat(prefixCls, "-range-arrow"),
style: {
left: arrowOffset
}
}), /*#__PURE__*/React.createElement(_rcResizeObserver.default, {
onResize: onResize
}, renderNode));
}
return renderNode;
}

View File

@@ -0,0 +1,54 @@
import * as React from 'react';
import type { BaseInfo, PanelMode, RangePickerRef, RangeTimeProps, SharedPickerProps, ValueDate } from '../interface';
import { type SelectorIdType } from './Selector/RangeSelector';
export type RangeValueType<DateType> = [
start: DateType | null | undefined,
end: DateType | null | undefined
];
/** Used for change event, it should always be not undefined */
export type NoUndefinedRangeValueType<DateType> = [start: DateType | null, end: DateType | null];
export interface BaseRangePickerProps<DateType extends object> extends Omit<SharedPickerProps<DateType>, 'showTime' | 'id'> {
id?: SelectorIdType;
separator?: React.ReactNode;
value?: RangeValueType<DateType> | null;
defaultValue?: RangeValueType<DateType>;
onChange?: (dates: NoUndefinedRangeValueType<DateType> | null, dateStrings: [string, string]) => void;
onCalendarChange?: (dates: NoUndefinedRangeValueType<DateType>, dateStrings: [string, string], info: BaseInfo) => void;
onOk?: (values: NoUndefinedRangeValueType<DateType>) => void;
placeholder?: [string, string];
/**
* Config the popup panel date.
* Every time active the input to open popup will reset with `defaultPickerValue`.
*
* Note: `defaultPickerValue` priority is higher than `value` for the first open.
*/
defaultPickerValue?: [DateType, DateType] | DateType | null;
/**
* Config each start & end field popup panel date.
* When config `pickerValue`, you must also provide `onPickerValueChange` to handle changes.
*/
pickerValue?: [DateType, DateType] | DateType | null;
/**
* Each popup panel `pickerValue` includes `mode` change will trigger the callback.
* @param date The changed picker value
* @param info.source `panel` from the panel click. `reset` from popup open or field typing
* @param info.mode Next `mode` panel
*/
onPickerValueChange?: (date: [DateType, DateType], info: BaseInfo & {
source: 'reset' | 'panel';
mode: [PanelMode, PanelMode];
}) => void;
presets?: ValueDate<Exclude<RangeValueType<DateType>, null>>[];
/** @deprecated Please use `presets` instead */
ranges?: Record<string, Exclude<RangeValueType<DateType>, null> | (() => Exclude<RangeValueType<DateType>, null>)>;
disabled?: boolean | [boolean, boolean];
allowEmpty?: boolean | [boolean, boolean];
showTime?: boolean | RangeTimeProps<DateType>;
mode?: [startMode: PanelMode, endMode: PanelMode];
/** Trigger on each `mode` or `pickerValue` changed. */
onPanelChange?: (values: NoUndefinedRangeValueType<DateType>, modes: [startMode: PanelMode, endMode: PanelMode]) => void;
}
export interface RangePickerProps<DateType extends object> extends BaseRangePickerProps<DateType>, Omit<RangeTimeProps<DateType>, 'format' | 'defaultValue' | 'defaultOpenValue'> {
}
declare const RefRangePicker: <DateType extends object = any>(props: RangePickerProps<DateType> & React.RefAttributes<RangePickerRef>) => React.ReactElement;
export default RefRangePicker;

636
node_modules/rc-picker/lib/PickerInput/RangePicker.js generated vendored Normal file
View File

@@ -0,0 +1,636 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _rcUtil = require("rc-util");
var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
var _omit = _interopRequireDefault(require("rc-util/lib/omit"));
var _pickAttrs = _interopRequireDefault(require("rc-util/lib/pickAttrs"));
var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
var React = _interopRequireWildcard(require("react"));
var _PickerTrigger = _interopRequireDefault(require("../PickerTrigger"));
var _util = require("../PickerTrigger/util");
var _miscUtil = require("../utils/miscUtil");
var _context = _interopRequireDefault(require("./context"));
var _useCellRender = _interopRequireDefault(require("./hooks/useCellRender"));
var _useFieldsInvalidate3 = _interopRequireDefault(require("./hooks/useFieldsInvalidate"));
var _useFilledProps3 = _interopRequireDefault(require("./hooks/useFilledProps"));
var _useOpen3 = _interopRequireDefault(require("./hooks/useOpen"));
var _usePickerRef = _interopRequireDefault(require("./hooks/usePickerRef"));
var _usePresets = _interopRequireDefault(require("./hooks/usePresets"));
var _useRangeActive3 = _interopRequireDefault(require("./hooks/useRangeActive"));
var _useRangeDisabledDate = _interopRequireDefault(require("./hooks/useRangeDisabledDate"));
var _useRangePickerValue3 = _interopRequireDefault(require("./hooks/useRangePickerValue"));
var _useRangeValue3 = _interopRequireWildcard(require("./hooks/useRangeValue"));
var _useShowNow = _interopRequireDefault(require("./hooks/useShowNow"));
var _Popup = _interopRequireDefault(require("./Popup"));
var _RangeSelector = _interopRequireDefault(require("./Selector/RangeSelector"));
function separateConfig(config, defaultConfig) {
var singleConfig = config !== null && config !== void 0 ? config : defaultConfig;
if (Array.isArray(singleConfig)) {
return singleConfig;
}
return [singleConfig, singleConfig];
}
/** Used for change event, it should always be not undefined */
function getActiveRange(activeIndex) {
return activeIndex === 1 ? 'end' : 'start';
}
function RangePicker(props, ref) {
// ========================= Prop =========================
var _useFilledProps = (0, _useFilledProps3.default)(props, function () {
var disabled = props.disabled,
allowEmpty = props.allowEmpty;
var mergedDisabled = separateConfig(disabled, false);
var mergedAllowEmpty = separateConfig(allowEmpty, false);
return {
disabled: mergedDisabled,
allowEmpty: mergedAllowEmpty
};
}),
_useFilledProps2 = (0, _slicedToArray2.default)(_useFilledProps, 6),
filledProps = _useFilledProps2[0],
internalPicker = _useFilledProps2[1],
complexPicker = _useFilledProps2[2],
formatList = _useFilledProps2[3],
maskFormat = _useFilledProps2[4],
isInvalidateDate = _useFilledProps2[5];
var prefixCls = filledProps.prefixCls,
styles = filledProps.styles,
classNames = filledProps.classNames,
defaultValue = filledProps.defaultValue,
value = filledProps.value,
needConfirm = filledProps.needConfirm,
onKeyDown = filledProps.onKeyDown,
disabled = filledProps.disabled,
allowEmpty = filledProps.allowEmpty,
disabledDate = filledProps.disabledDate,
minDate = filledProps.minDate,
maxDate = filledProps.maxDate,
defaultOpen = filledProps.defaultOpen,
open = filledProps.open,
onOpenChange = filledProps.onOpenChange,
locale = filledProps.locale,
generateConfig = filledProps.generateConfig,
picker = filledProps.picker,
showNow = filledProps.showNow,
showToday = filledProps.showToday,
showTime = filledProps.showTime,
mode = filledProps.mode,
onPanelChange = filledProps.onPanelChange,
onCalendarChange = filledProps.onCalendarChange,
onOk = filledProps.onOk,
defaultPickerValue = filledProps.defaultPickerValue,
pickerValue = filledProps.pickerValue,
onPickerValueChange = filledProps.onPickerValueChange,
inputReadOnly = filledProps.inputReadOnly,
suffixIcon = filledProps.suffixIcon,
onFocus = filledProps.onFocus,
onBlur = filledProps.onBlur,
presets = filledProps.presets,
ranges = filledProps.ranges,
components = filledProps.components,
cellRender = filledProps.cellRender,
dateRender = filledProps.dateRender,
monthCellRender = filledProps.monthCellRender,
onClick = filledProps.onClick;
// ========================= Refs =========================
var selectorRef = (0, _usePickerRef.default)(ref);
// ========================= Open =========================
var _useOpen = (0, _useOpen3.default)(open, defaultOpen, disabled, onOpenChange),
_useOpen2 = (0, _slicedToArray2.default)(_useOpen, 2),
mergedOpen = _useOpen2[0],
setMergeOpen = _useOpen2[1];
var triggerOpen = function triggerOpen(nextOpen, config) {
// No need to open if all disabled
if (disabled.some(function (fieldDisabled) {
return !fieldDisabled;
}) || !nextOpen) {
setMergeOpen(nextOpen, config);
}
};
// ======================== Values ========================
var _useInnerValue = (0, _useRangeValue3.useInnerValue)(generateConfig, locale, formatList, true, false, defaultValue, value, onCalendarChange, onOk),
_useInnerValue2 = (0, _slicedToArray2.default)(_useInnerValue, 5),
mergedValue = _useInnerValue2[0],
setInnerValue = _useInnerValue2[1],
getCalendarValue = _useInnerValue2[2],
triggerCalendarChange = _useInnerValue2[3],
triggerOk = _useInnerValue2[4];
var calendarValue = getCalendarValue();
// ======================== Active ========================
var _useRangeActive = (0, _useRangeActive3.default)(disabled, allowEmpty, mergedOpen),
_useRangeActive2 = (0, _slicedToArray2.default)(_useRangeActive, 9),
focused = _useRangeActive2[0],
triggerFocus = _useRangeActive2[1],
lastOperation = _useRangeActive2[2],
activeIndex = _useRangeActive2[3],
setActiveIndex = _useRangeActive2[4],
nextActiveIndex = _useRangeActive2[5],
activeIndexList = _useRangeActive2[6],
updateSubmitIndex = _useRangeActive2[7],
hasActiveSubmitValue = _useRangeActive2[8];
var onSharedFocus = function onSharedFocus(event, index) {
triggerFocus(true);
onFocus === null || onFocus === void 0 || onFocus(event, {
range: getActiveRange(index !== null && index !== void 0 ? index : activeIndex)
});
};
var onSharedBlur = function onSharedBlur(event, index) {
triggerFocus(false);
onBlur === null || onBlur === void 0 || onBlur(event, {
range: getActiveRange(index !== null && index !== void 0 ? index : activeIndex)
});
};
// ======================= ShowTime =======================
/** Used for Popup panel */
var mergedShowTime = React.useMemo(function () {
if (!showTime) {
return null;
}
var disabledTime = showTime.disabledTime;
var proxyDisabledTime = disabledTime ? function (date) {
var range = getActiveRange(activeIndex);
var fromDate = (0, _miscUtil.getFromDate)(calendarValue, activeIndexList, activeIndex);
return disabledTime(date, range, {
from: fromDate
});
} : undefined;
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, showTime), {}, {
disabledTime: proxyDisabledTime
});
}, [showTime, activeIndex, calendarValue, activeIndexList]);
// ========================= Mode =========================
var _useMergedState = (0, _rcUtil.useMergedState)([picker, picker], {
value: mode
}),
_useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
modes = _useMergedState2[0],
setModes = _useMergedState2[1];
var mergedMode = modes[activeIndex] || picker;
/** Extends from `mergedMode` to patch `datetime` mode */
var internalMode = mergedMode === 'date' && mergedShowTime ? 'datetime' : mergedMode;
// ====================== PanelCount ======================
var multiplePanel = internalMode === picker && internalMode !== 'time';
// ======================= Show Now =======================
var mergedShowNow = (0, _useShowNow.default)(picker, mergedMode, showNow, showToday, true);
// ======================== Value =========================
var _useRangeValue = (0, _useRangeValue3.default)(filledProps, mergedValue, setInnerValue, getCalendarValue, triggerCalendarChange, disabled, formatList, focused, mergedOpen, isInvalidateDate),
_useRangeValue2 = (0, _slicedToArray2.default)(_useRangeValue, 2),
/** Trigger `onChange` by check `disabledDate` */
flushSubmit = _useRangeValue2[0],
/** Trigger `onChange` directly without check `disabledDate` */
triggerSubmitChange = _useRangeValue2[1];
// ===================== DisabledDate =====================
var mergedDisabledDate = (0, _useRangeDisabledDate.default)(calendarValue, disabled, activeIndexList, generateConfig, locale, disabledDate);
// ======================= Validate =======================
var _useFieldsInvalidate = (0, _useFieldsInvalidate3.default)(calendarValue, isInvalidateDate, allowEmpty),
_useFieldsInvalidate2 = (0, _slicedToArray2.default)(_useFieldsInvalidate, 2),
submitInvalidates = _useFieldsInvalidate2[0],
onSelectorInvalid = _useFieldsInvalidate2[1];
// ===================== Picker Value =====================
var _useRangePickerValue = (0, _useRangePickerValue3.default)(generateConfig, locale, calendarValue, modes, mergedOpen, activeIndex, internalPicker, multiplePanel, defaultPickerValue, pickerValue, mergedShowTime === null || mergedShowTime === void 0 ? void 0 : mergedShowTime.defaultOpenValue, onPickerValueChange, minDate, maxDate),
_useRangePickerValue2 = (0, _slicedToArray2.default)(_useRangePickerValue, 2),
currentPickerValue = _useRangePickerValue2[0],
setCurrentPickerValue = _useRangePickerValue2[1];
// >>> Mode need wait for `pickerValue`
var triggerModeChange = (0, _rcUtil.useEvent)(function (nextPickerValue, nextMode, triggerEvent) {
var clone = (0, _miscUtil.fillIndex)(modes, activeIndex, nextMode);
if (clone[0] !== modes[0] || clone[1] !== modes[1]) {
setModes(clone);
}
// Compatible with `onPanelChange`
if (onPanelChange && triggerEvent !== false) {
var clonePickerValue = (0, _toConsumableArray2.default)(calendarValue);
if (nextPickerValue) {
clonePickerValue[activeIndex] = nextPickerValue;
}
onPanelChange(clonePickerValue, clone);
}
});
// ======================== Change ========================
var fillCalendarValue = function fillCalendarValue(date, index) {
return (
// Trigger change only when date changed
(0, _miscUtil.fillIndex)(calendarValue, index, date)
);
};
// ======================== Submit ========================
/**
* Trigger by confirm operation.
* This function has already handle the `needConfirm` check logic.
* - Selector: enter key
* - Panel: OK button
*/
var triggerPartConfirm = function triggerPartConfirm(date, skipFocus) {
var nextValue = calendarValue;
if (date) {
nextValue = fillCalendarValue(date, activeIndex);
}
updateSubmitIndex(activeIndex);
// Get next focus index
var nextIndex = nextActiveIndex(nextValue);
// Change calendar value and tell flush it
triggerCalendarChange(nextValue);
flushSubmit(activeIndex, nextIndex === null);
if (nextIndex === null) {
triggerOpen(false, {
force: true
});
} else if (!skipFocus) {
selectorRef.current.focus({
index: nextIndex
});
}
};
// ======================== Click =========================
var onSelectorClick = function onSelectorClick(event) {
var _activeElement;
var rootNode = event.target.getRootNode();
if (!selectorRef.current.nativeElement.contains((_activeElement = rootNode.activeElement) !== null && _activeElement !== void 0 ? _activeElement : document.activeElement)) {
// Click to focus the enabled input
var enabledIndex = disabled.findIndex(function (d) {
return !d;
});
if (enabledIndex >= 0) {
selectorRef.current.focus({
index: enabledIndex
});
}
}
triggerOpen(true);
onClick === null || onClick === void 0 || onClick(event);
};
var onSelectorClear = function onSelectorClear() {
triggerSubmitChange(null);
triggerOpen(false, {
force: true
});
};
// ======================== Hover =========================
var _React$useState = React.useState(null),
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
hoverSource = _React$useState2[0],
setHoverSource = _React$useState2[1];
var _React$useState3 = React.useState(null),
_React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
internalHoverValues = _React$useState4[0],
setInternalHoverValues = _React$useState4[1];
var hoverValues = React.useMemo(function () {
return internalHoverValues || calendarValue;
}, [calendarValue, internalHoverValues]);
// Clean up `internalHoverValues` when closed
React.useEffect(function () {
if (!mergedOpen) {
setInternalHoverValues(null);
}
}, [mergedOpen]);
// ========================================================
// == Panels ==
// ========================================================
// Save the offset with active bar position
// const [activeOffset, setActiveOffset] = React.useState(0);
var _React$useState5 = React.useState([0, 0, 0]),
_React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
activeInfo = _React$useState6[0],
setActiveInfo = _React$useState6[1];
// ======================= Presets ========================
var presetList = (0, _usePresets.default)(presets, ranges);
var onPresetHover = function onPresetHover(nextValues) {
setInternalHoverValues(nextValues);
setHoverSource('preset');
};
var onPresetSubmit = function onPresetSubmit(nextValues) {
var passed = triggerSubmitChange(nextValues);
if (passed) {
triggerOpen(false, {
force: true
});
}
};
var onNow = function onNow(now) {
triggerPartConfirm(now);
};
// ======================== Panel =========================
var onPanelHover = function onPanelHover(date) {
setInternalHoverValues(date ? fillCalendarValue(date, activeIndex) : null);
setHoverSource('cell');
};
// >>> Focus
var onPanelFocus = function onPanelFocus(event) {
triggerOpen(true);
onSharedFocus(event);
};
// >>> MouseDown
var onPanelMouseDown = function onPanelMouseDown() {
lastOperation('panel');
};
// >>> Calendar
var onPanelSelect = function onPanelSelect(date) {
var clone = (0, _miscUtil.fillIndex)(calendarValue, activeIndex, date);
// Only trigger calendar event but not update internal `calendarValue` state
triggerCalendarChange(clone);
// >>> Trigger next active if !needConfirm
// Fully logic check `useRangeValue` hook
if (!needConfirm && !complexPicker && internalPicker === internalMode) {
triggerPartConfirm(date);
}
};
// >>> Close
var onPopupClose = function onPopupClose() {
// Close popup
triggerOpen(false);
};
// >>> cellRender
var onInternalCellRender = (0, _useCellRender.default)(cellRender, dateRender, monthCellRender, getActiveRange(activeIndex));
// >>> Value
var panelValue = calendarValue[activeIndex] || null;
// >>> invalid
var isPopupInvalidateDate = (0, _rcUtil.useEvent)(function (date) {
return isInvalidateDate(date, {
activeIndex: activeIndex
});
});
var panelProps = React.useMemo(function () {
var domProps = (0, _pickAttrs.default)(filledProps, false);
var restProps = (0, _omit.default)(filledProps, [].concat((0, _toConsumableArray2.default)(Object.keys(domProps)), ['onChange', 'onCalendarChange', 'style', 'className', 'onPanelChange', 'disabledTime']));
return restProps;
}, [filledProps]);
// >>> Render
var panel = /*#__PURE__*/React.createElement(_Popup.default, (0, _extends2.default)({}, panelProps, {
showNow: mergedShowNow,
showTime: mergedShowTime
// Range
,
range: true,
multiplePanel: multiplePanel,
activeInfo: activeInfo
// Disabled
,
disabledDate: mergedDisabledDate
// Focus
,
onFocus: onPanelFocus,
onBlur: onSharedBlur,
onPanelMouseDown: onPanelMouseDown
// Mode
,
picker: picker,
mode: mergedMode,
internalMode: internalMode,
onPanelChange: triggerModeChange
// Value
,
format: maskFormat,
value: panelValue,
isInvalid: isPopupInvalidateDate,
onChange: null,
onSelect: onPanelSelect
// PickerValue
,
pickerValue: currentPickerValue,
defaultOpenValue: (0, _miscUtil.toArray)(showTime === null || showTime === void 0 ? void 0 : showTime.defaultOpenValue)[activeIndex],
onPickerValueChange: setCurrentPickerValue
// Hover
,
hoverValue: hoverValues,
onHover: onPanelHover
// Submit
,
needConfirm: needConfirm,
onSubmit: triggerPartConfirm,
onOk: triggerOk
// Preset
,
presets: presetList,
onPresetHover: onPresetHover,
onPresetSubmit: onPresetSubmit
// Now
,
onNow: onNow
// Render
,
cellRender: onInternalCellRender
}));
// ========================================================
// == Selector ==
// ========================================================
// ======================== Change ========================
var onSelectorChange = function onSelectorChange(date, index) {
var clone = fillCalendarValue(date, index);
triggerCalendarChange(clone);
};
var onSelectorInputChange = function onSelectorInputChange() {
lastOperation('input');
};
// ======================= Selector =======================
var onSelectorFocus = function onSelectorFocus(event, index) {
// Check if `needConfirm` but user not submit yet
var activeListLen = activeIndexList.length;
var lastActiveIndex = activeIndexList[activeListLen - 1];
if (activeListLen && lastActiveIndex !== index && needConfirm &&
// Not change index if is not filled
!allowEmpty[lastActiveIndex] && !hasActiveSubmitValue(lastActiveIndex) && calendarValue[lastActiveIndex]) {
selectorRef.current.focus({
index: lastActiveIndex
});
return;
}
lastOperation('input');
triggerOpen(true, {
inherit: true
});
// When click input to switch the field, it will not trigger close.
// Which means it will lose the part confirm and we need fill back.
// ref: https://github.com/ant-design/ant-design/issues/49512
if (activeIndex !== index && mergedOpen && !needConfirm && complexPicker) {
triggerPartConfirm(null, true);
}
setActiveIndex(index);
onSharedFocus(event, index);
};
var onSelectorBlur = function onSelectorBlur(event, index) {
triggerOpen(false);
if (!needConfirm && lastOperation() === 'input') {
var nextIndex = nextActiveIndex(calendarValue);
flushSubmit(activeIndex, nextIndex === null);
}
onSharedBlur(event, index);
};
var onSelectorKeyDown = function onSelectorKeyDown(event, preventDefault) {
if (event.key === 'Tab') {
triggerPartConfirm(null, true);
}
onKeyDown === null || onKeyDown === void 0 || onKeyDown(event, preventDefault);
};
// ======================= Context ========================
var context = React.useMemo(function () {
return {
prefixCls: prefixCls,
locale: locale,
generateConfig: generateConfig,
button: components.button,
input: components.input
};
}, [prefixCls, locale, generateConfig, components.button, components.input]);
// ======================== Effect ========================
// >>> Mode
// Reset for every active
(0, _useLayoutEffect.default)(function () {
if (mergedOpen && activeIndex !== undefined) {
// Legacy compatible. This effect update should not trigger `onPanelChange`
triggerModeChange(null, picker, false);
}
}, [mergedOpen, activeIndex, picker]);
// >>> For complex picker, we need check if need to focus next one
(0, _useLayoutEffect.default)(function () {
var lastOp = lastOperation();
// Trade as confirm on field leave
if (!mergedOpen && lastOp === 'input') {
triggerOpen(false);
triggerPartConfirm(null, true);
}
// Submit with complex picker
if (!mergedOpen && complexPicker && !needConfirm && lastOp === 'panel') {
triggerOpen(true);
triggerPartConfirm();
}
}, [mergedOpen]);
// ====================== DevWarning ======================
if (process.env.NODE_ENV !== 'production') {
var isIndexEmpty = function isIndexEmpty(index) {
return (
// Value is empty
!(value !== null && value !== void 0 && value[index]) &&
// DefaultValue is empty
!(defaultValue !== null && defaultValue !== void 0 && defaultValue[index])
);
};
if (disabled.some(function (fieldDisabled, index) {
return fieldDisabled && isIndexEmpty(index) && !allowEmpty[index];
})) {
(0, _warning.default)(false, '`disabled` should not set with empty `value`. You should set `allowEmpty` or `value` instead.');
}
}
// ======================== Render ========================
return /*#__PURE__*/React.createElement(_context.default.Provider, {
value: context
}, /*#__PURE__*/React.createElement(_PickerTrigger.default, (0, _extends2.default)({}, (0, _util.pickTriggerProps)(filledProps), {
popupElement: panel,
popupStyle: styles.popup,
popupClassName: classNames.popup
// Visible
,
visible: mergedOpen,
onClose: onPopupClose
// Range
,
range: true
}), /*#__PURE__*/React.createElement(_RangeSelector.default
// Shared
, (0, _extends2.default)({}, filledProps, {
// Ref
ref: selectorRef
// Icon
,
suffixIcon: suffixIcon
// Active
,
activeIndex: focused || mergedOpen ? activeIndex : null,
activeHelp: !!internalHoverValues,
allHelp: !!internalHoverValues && hoverSource === 'preset',
focused: focused,
onFocus: onSelectorFocus,
onBlur: onSelectorBlur,
onKeyDown: onSelectorKeyDown,
onSubmit: triggerPartConfirm
// Change
,
value: hoverValues,
maskFormat: maskFormat,
onChange: onSelectorChange,
onInputChange: onSelectorInputChange
// Format
,
format: formatList,
inputReadOnly: inputReadOnly
// Disabled
,
disabled: disabled
// Open
,
open: mergedOpen,
onOpenChange: triggerOpen
// Click
,
onClick: onSelectorClick,
onClear: onSelectorClear
// Invalid
,
invalid: submitInvalidates,
onInvalid: onSelectorInvalid
// Offset
,
onActiveInfo: setActiveInfo
}))));
}
var RefRangePicker = /*#__PURE__*/React.forwardRef(RangePicker);
if (process.env.NODE_ENV !== 'production') {
RefRangePicker.displayName = 'RefRangePicker';
}
var _default = exports.default = RefRangePicker;

View File

@@ -0,0 +1,10 @@
import * as React from 'react';
export interface IconProps extends React.HtmlHTMLAttributes<HTMLElement> {
icon?: React.ReactNode;
type: 'suffix' | 'clear';
}
export default function Icon(props: IconProps): React.JSX.Element;
export interface ClearIconProps extends Omit<IconProps, 'type'> {
onClear: VoidFunction;
}
export declare function ClearIcon({ onClear, ...restProps }: ClearIconProps): React.JSX.Element;

View File

@@ -0,0 +1,40 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ClearIcon = ClearIcon;
exports.default = Icon;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var React = _interopRequireWildcard(require("react"));
var _context = _interopRequireDefault(require("../context"));
var _excluded = ["icon", "type"],
_excluded2 = ["onClear"];
function Icon(props) {
var icon = props.icon,
type = props.type,
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
var _React$useContext = React.useContext(_context.default),
prefixCls = _React$useContext.prefixCls;
return icon ? /*#__PURE__*/React.createElement("span", (0, _extends2.default)({
className: "".concat(prefixCls, "-").concat(type)
}, restProps), icon) : null;
}
function ClearIcon(_ref) {
var onClear = _ref.onClear,
restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded2);
return /*#__PURE__*/React.createElement(Icon, (0, _extends2.default)({}, restProps, {
type: "clear",
role: "button",
onMouseDown: function onMouseDown(e) {
e.preventDefault();
},
onClick: function onClick(e) {
e.stopPropagation();
onClear();
}
}));
}

View File

@@ -0,0 +1,28 @@
import * as React from 'react';
import type { PickerRef } from '../../interface';
export interface InputRef extends PickerRef {
inputElement: HTMLInputElement;
}
export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange'> {
format?: string;
validateFormat: (value: string) => boolean;
active?: boolean;
/** Used for single picker only */
showActiveCls?: boolean;
suffixIcon?: React.ReactNode;
value?: string;
onChange: (value: string) => void;
onSubmit: VoidFunction;
/** Meaning current is from the hover cell getting the placeholder text */
helped?: boolean;
/**
* Trigger when input need additional help.
* Like open the popup for interactive.
*/
onHelp: () => void;
preserveInvalidOnBlur?: boolean;
invalid?: boolean;
clearIcon?: React.ReactNode;
}
declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<InputRef>>;
export default Input;

View File

@@ -0,0 +1,375 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _classnames = _interopRequireDefault(require("classnames"));
var _rcUtil = require("rc-util");
var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
var React = _interopRequireWildcard(require("react"));
var _miscUtil = require("../../utils/miscUtil");
var _context = _interopRequireDefault(require("../context"));
var _useLockEffect = _interopRequireDefault(require("../hooks/useLockEffect"));
var _Icon = _interopRequireDefault(require("./Icon"));
var _MaskFormat = _interopRequireDefault(require("./MaskFormat"));
var _util = require("./util");
var _excluded = ["active", "showActiveCls", "suffixIcon", "format", "validateFormat", "onChange", "onInput", "helped", "onHelp", "onSubmit", "onKeyDown", "preserveInvalidOnBlur", "invalid", "clearIcon"];
// Format logic
//
// First time on focus:
// 1. check if the text is valid, if not fill with format
// 2. set highlight cell to the first cell
// Cells
// 1. Selection the index cell, set inner `cacheValue` to ''
// 2. Key input filter non-number char, patch after the `cacheValue`
// 1. Replace the `cacheValue` with input align the cell length
// 2. Re-selection the mask cell
// 3. If `cacheValue` match the limit length or cell format (like 1 ~ 12 month), go to next cell
var Input = /*#__PURE__*/React.forwardRef(function (props, ref) {
var active = props.active,
_props$showActiveCls = props.showActiveCls,
showActiveCls = _props$showActiveCls === void 0 ? true : _props$showActiveCls,
suffixIcon = props.suffixIcon,
format = props.format,
validateFormat = props.validateFormat,
onChange = props.onChange,
onInput = props.onInput,
helped = props.helped,
onHelp = props.onHelp,
onSubmit = props.onSubmit,
onKeyDown = props.onKeyDown,
_props$preserveInvali = props.preserveInvalidOnBlur,
preserveInvalidOnBlur = _props$preserveInvali === void 0 ? false : _props$preserveInvali,
invalid = props.invalid,
clearIcon = props.clearIcon,
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
var value = props.value,
onFocus = props.onFocus,
onBlur = props.onBlur,
onMouseUp = props.onMouseUp;
var _React$useContext = React.useContext(_context.default),
prefixCls = _React$useContext.prefixCls,
_React$useContext$inp = _React$useContext.input,
Component = _React$useContext$inp === void 0 ? 'input' : _React$useContext$inp;
var inputPrefixCls = "".concat(prefixCls, "-input");
// ======================== Value =========================
var _React$useState = React.useState(false),
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
focused = _React$useState2[0],
setFocused = _React$useState2[1];
var _React$useState3 = React.useState(value),
_React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
internalInputValue = _React$useState4[0],
setInputValue = _React$useState4[1];
var _React$useState5 = React.useState(''),
_React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
focusCellText = _React$useState6[0],
setFocusCellText = _React$useState6[1];
var _React$useState7 = React.useState(null),
_React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
focusCellIndex = _React$useState8[0],
setFocusCellIndex = _React$useState8[1];
var _React$useState9 = React.useState(null),
_React$useState10 = (0, _slicedToArray2.default)(_React$useState9, 2),
forceSelectionSyncMark = _React$useState10[0],
forceSelectionSync = _React$useState10[1];
var inputValue = internalInputValue || '';
// Sync value if needed
React.useEffect(function () {
setInputValue(value);
}, [value]);
// ========================= Refs =========================
var holderRef = React.useRef();
var inputRef = React.useRef();
React.useImperativeHandle(ref, function () {
return {
nativeElement: holderRef.current,
inputElement: inputRef.current,
focus: function focus(options) {
inputRef.current.focus(options);
},
blur: function blur() {
inputRef.current.blur();
}
};
});
// ======================== Format ========================
var maskFormat = React.useMemo(function () {
return new _MaskFormat.default(format || '');
}, [format]);
var _React$useMemo = React.useMemo(function () {
if (helped) {
return [0, 0];
}
return maskFormat.getSelection(focusCellIndex);
}, [maskFormat, focusCellIndex, helped]),
_React$useMemo2 = (0, _slicedToArray2.default)(_React$useMemo, 2),
selectionStart = _React$useMemo2[0],
selectionEnd = _React$useMemo2[1];
// ======================== Modify ========================
// When input modify content, trigger `onHelp` if is not the format
var onModify = function onModify(text) {
if (text && text !== format && text !== value) {
onHelp();
}
};
// ======================== Change ========================
/**
* Triggered by paste, keyDown and focus to show format
*/
var triggerInputChange = (0, _rcUtil.useEvent)(function (text) {
if (validateFormat(text)) {
onChange(text);
}
setInputValue(text);
onModify(text);
});
// Directly trigger `onChange` if `format` is empty
var onInternalChange = function onInternalChange(event) {
// Hack `onChange` with format to do nothing
if (!format) {
var text = event.target.value;
onModify(text);
setInputValue(text);
onChange(text);
}
};
var onFormatPaste = function onFormatPaste(event) {
// Get paste text
var pasteText = event.clipboardData.getData('text');
if (validateFormat(pasteText)) {
triggerInputChange(pasteText);
}
};
// ======================== Mouse =========================
// When `mouseDown` get focus, it's better to not to change the selection
// Since the up position maybe not is the first cell
var mouseDownRef = React.useRef(false);
var onFormatMouseDown = function onFormatMouseDown() {
mouseDownRef.current = true;
};
var onFormatMouseUp = function onFormatMouseUp(event) {
var _ref = event.target,
start = _ref.selectionStart;
var closeMaskIndex = maskFormat.getMaskCellIndex(start);
setFocusCellIndex(closeMaskIndex);
// Force update the selection
forceSelectionSync({});
onMouseUp === null || onMouseUp === void 0 || onMouseUp(event);
mouseDownRef.current = false;
};
// ====================== Focus Blur ======================
var onFormatFocus = function onFormatFocus(event) {
setFocused(true);
setFocusCellIndex(0);
setFocusCellText('');
onFocus(event);
};
var onSharedBlur = function onSharedBlur(event) {
onBlur(event);
};
var onFormatBlur = function onFormatBlur(event) {
setFocused(false);
onSharedBlur(event);
};
// ======================== Active ========================
// Check if blur need reset input value
(0, _useLockEffect.default)(active, function () {
if (!active && !preserveInvalidOnBlur) {
setInputValue(value);
}
});
// ======================= Keyboard =======================
var onSharedKeyDown = function onSharedKeyDown(event) {
if (event.key === 'Enter' && validateFormat(inputValue)) {
onSubmit();
}
onKeyDown === null || onKeyDown === void 0 || onKeyDown(event);
};
var onFormatKeyDown = function onFormatKeyDown(event) {
onSharedKeyDown(event);
var key = event.key;
// Save the cache with cell text
var nextCellText = null;
// Fill in the input
var nextFillText = null;
var maskCellLen = selectionEnd - selectionStart;
var cellFormat = format.slice(selectionStart, selectionEnd);
// Cell Index
var offsetCellIndex = function offsetCellIndex(offset) {
setFocusCellIndex(function (idx) {
var nextIndex = idx + offset;
nextIndex = Math.max(nextIndex, 0);
nextIndex = Math.min(nextIndex, maskFormat.size() - 1);
return nextIndex;
});
};
// Range
var offsetCellValue = function offsetCellValue(offset) {
var _getMaskRange = (0, _util.getMaskRange)(cellFormat),
_getMaskRange2 = (0, _slicedToArray2.default)(_getMaskRange, 3),
rangeStart = _getMaskRange2[0],
rangeEnd = _getMaskRange2[1],
rangeDefault = _getMaskRange2[2];
var currentText = inputValue.slice(selectionStart, selectionEnd);
var currentTextNum = Number(currentText);
if (isNaN(currentTextNum)) {
return String(rangeDefault ? rangeDefault : offset > 0 ? rangeStart : rangeEnd);
}
var num = currentTextNum + offset;
var range = rangeEnd - rangeStart + 1;
return String(rangeStart + (range + num - rangeStart) % range);
};
switch (key) {
// =============== Remove ===============
case 'Backspace':
case 'Delete':
nextCellText = '';
nextFillText = cellFormat;
break;
// =============== Arrows ===============
// Left key
case 'ArrowLeft':
nextCellText = '';
offsetCellIndex(-1);
break;
// Right key
case 'ArrowRight':
nextCellText = '';
offsetCellIndex(1);
break;
// Up key
case 'ArrowUp':
nextCellText = '';
nextFillText = offsetCellValue(1);
break;
// Down key
case 'ArrowDown':
nextCellText = '';
nextFillText = offsetCellValue(-1);
break;
// =============== Number ===============
default:
if (!isNaN(Number(key))) {
nextCellText = focusCellText + key;
nextFillText = nextCellText;
}
break;
}
// Update cell text
if (nextCellText !== null) {
setFocusCellText(nextCellText);
if (nextCellText.length >= maskCellLen) {
// Go to next cell
offsetCellIndex(1);
setFocusCellText('');
}
}
// Update the input text
if (nextFillText !== null) {
// Replace selection range with `nextCellText`
var nextFocusValue =
// before
inputValue.slice(0, selectionStart) +
// replace
(0, _miscUtil.leftPad)(nextFillText, maskCellLen) +
// after
inputValue.slice(selectionEnd);
triggerInputChange(nextFocusValue.slice(0, format.length));
}
// Always trigger selection sync after key down
forceSelectionSync({});
};
// ======================== Format ========================
var rafRef = React.useRef();
(0, _useLayoutEffect.default)(function () {
if (!focused || !format || mouseDownRef.current) {
return;
}
// Reset with format if not match
if (!maskFormat.match(inputValue)) {
triggerInputChange(format);
return;
}
// Match the selection range
inputRef.current.setSelectionRange(selectionStart, selectionEnd);
// Chrome has the bug anchor position looks not correct but actually correct
rafRef.current = (0, _raf.default)(function () {
inputRef.current.setSelectionRange(selectionStart, selectionEnd);
});
return function () {
_raf.default.cancel(rafRef.current);
};
}, [maskFormat, format, focused, inputValue, focusCellIndex, selectionStart, selectionEnd, forceSelectionSyncMark, triggerInputChange]);
// ======================== Render ========================
// Input props for format
var inputProps = format ? {
onFocus: onFormatFocus,
onBlur: onFormatBlur,
onKeyDown: onFormatKeyDown,
onMouseDown: onFormatMouseDown,
onMouseUp: onFormatMouseUp,
onPaste: onFormatPaste
} : {};
return /*#__PURE__*/React.createElement("div", {
ref: holderRef,
className: (0, _classnames.default)(inputPrefixCls, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(inputPrefixCls, "-active"), active && showActiveCls), "".concat(inputPrefixCls, "-placeholder"), helped))
}, /*#__PURE__*/React.createElement(Component, (0, _extends2.default)({
ref: inputRef,
"aria-invalid": invalid,
autoComplete: "off"
}, restProps, {
onKeyDown: onSharedKeyDown,
onBlur: onSharedBlur
// Replace with format
}, inputProps, {
// Value
value: inputValue,
onChange: onInternalChange
})), /*#__PURE__*/React.createElement(_Icon.default, {
type: "suffix",
icon: suffixIcon
}), clearIcon);
});
if (process.env.NODE_ENV !== 'production') {
Input.displayName = 'Input';
}
var _default = exports.default = Input;

View File

@@ -0,0 +1,22 @@
declare const FORMAT_KEYS: string[];
export type FormatKey = (typeof FORMAT_KEYS)[number];
export interface Cell {
text: string;
mask: boolean;
start: number;
end: number;
}
export default class MaskFormat {
format: string;
maskFormat: string;
cells: Cell[];
maskCells: Cell[];
constructor(format: string);
getSelection(maskCellIndex: number): [start: number, end: number];
/** Check given text match format */
match(text: string): boolean;
/** Get mask cell count */
size(): number;
getMaskCellIndex(anchorIndex: number): number;
}
export {};

View File

@@ -0,0 +1,109 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var FORMAT_KEYS = ['YYYY', 'MM', 'DD', 'HH', 'mm', 'ss', 'SSS'];
// Use Chinese character to avoid conflict with the mask format
var REPLACE_KEY = '顧';
var MaskFormat = exports.default = /*#__PURE__*/function () {
function MaskFormat(format) {
(0, _classCallCheck2.default)(this, MaskFormat);
(0, _defineProperty2.default)(this, "format", void 0);
(0, _defineProperty2.default)(this, "maskFormat", void 0);
(0, _defineProperty2.default)(this, "cells", void 0);
(0, _defineProperty2.default)(this, "maskCells", void 0);
this.format = format;
// Generate mask format
var replaceKeys = FORMAT_KEYS.map(function (key) {
return "(".concat(key, ")");
}).join('|');
var replaceReg = new RegExp(replaceKeys, 'g');
this.maskFormat = format.replace(replaceReg,
// Use Chinese character to avoid user use it in format
function (key) {
return REPLACE_KEY.repeat(key.length);
});
// Generate cells
var cellReg = new RegExp("(".concat(FORMAT_KEYS.join('|'), ")"));
var strCells = (format.split(cellReg) || []).filter(function (str) {
return str;
});
var offset = 0;
this.cells = strCells.map(function (text) {
var mask = FORMAT_KEYS.includes(text);
var start = offset;
var end = offset + text.length;
offset = end;
return {
text: text,
mask: mask,
start: start,
end: end
};
});
// Mask cells
this.maskCells = this.cells.filter(function (cell) {
return cell.mask;
});
}
(0, _createClass2.default)(MaskFormat, [{
key: "getSelection",
value: function getSelection(maskCellIndex) {
var _ref = this.maskCells[maskCellIndex] || {},
start = _ref.start,
end = _ref.end;
return [start || 0, end || 0];
}
/** Check given text match format */
}, {
key: "match",
value: function match(text) {
for (var i = 0; i < this.maskFormat.length; i += 1) {
var maskChar = this.maskFormat[i];
var textChar = text[i];
if (!textChar || maskChar !== REPLACE_KEY && maskChar !== textChar) {
return false;
}
}
return true;
}
/** Get mask cell count */
}, {
key: "size",
value: function size() {
return this.maskCells.length;
}
}, {
key: "getMaskCellIndex",
value: function getMaskCellIndex(anchorIndex) {
var closetDist = Number.MAX_SAFE_INTEGER;
var closetIndex = 0;
for (var i = 0; i < this.maskCells.length; i += 1) {
var _this$maskCells$i = this.maskCells[i],
start = _this$maskCells$i.start,
end = _this$maskCells$i.end;
if (anchorIndex >= start && anchorIndex <= end) {
return i;
}
var dist = Math.min(Math.abs(anchorIndex - start), Math.abs(anchorIndex - end));
if (dist < closetDist) {
closetDist = dist;
closetIndex = i;
}
}
return closetIndex;
}
}]);
return MaskFormat;
}();

View File

@@ -0,0 +1,26 @@
import * as React from 'react';
import type { RangePickerRef, SelectorProps } from '../../interface';
export type SelectorIdType = string | {
start?: string;
end?: string;
};
export interface RangeSelectorProps<DateType = any> extends SelectorProps<DateType> {
id?: SelectorIdType;
activeIndex: number | null;
separator?: React.ReactNode;
value?: [DateType?, DateType?];
onChange: (date: DateType, index?: number) => void;
disabled: [boolean, boolean];
/** All the field show as `placeholder` */
allHelp: boolean;
placeholder?: string | [string, string];
invalid: [boolean, boolean];
placement?: string;
/**
* Trigger when the active bar offset position changed.
* This is used for popup panel offset.
*/
onActiveInfo: (info: [activeInputLeft: number, activeInputRight: number, selectorWidth: number]) => void;
}
declare const RefRangeSelector: React.ForwardRefExoticComponent<RangeSelectorProps<object> & React.RefAttributes<RangePickerRef>>;
export default RefRangeSelector;

View File

@@ -0,0 +1,217 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _classnames = _interopRequireDefault(require("classnames"));
var _rcResizeObserver = _interopRequireDefault(require("rc-resize-observer"));
var _rcUtil = require("rc-util");
var React = _interopRequireWildcard(require("react"));
var _context = _interopRequireDefault(require("../context"));
var _useInputProps3 = _interopRequireDefault(require("./hooks/useInputProps"));
var _useRootProps = _interopRequireDefault(require("./hooks/useRootProps"));
var _Icon = _interopRequireWildcard(require("./Icon"));
var _Input = _interopRequireDefault(require("./Input"));
var _excluded = ["id", "prefix", "clearIcon", "suffixIcon", "separator", "activeIndex", "activeHelp", "allHelp", "focused", "onFocus", "onBlur", "onKeyDown", "locale", "generateConfig", "placeholder", "className", "style", "onClick", "onClear", "value", "onChange", "onSubmit", "onInputChange", "format", "maskFormat", "preserveInvalidOnBlur", "onInvalid", "disabled", "invalid", "inputReadOnly", "direction", "onOpenChange", "onActiveInfo", "placement", "onMouseDown", "required", "aria-required", "autoFocus", "tabIndex"],
_excluded2 = ["index"];
function RangeSelector(props, ref) {
var id = props.id,
prefix = props.prefix,
clearIcon = props.clearIcon,
suffixIcon = props.suffixIcon,
_props$separator = props.separator,
separator = _props$separator === void 0 ? '~' : _props$separator,
activeIndex = props.activeIndex,
activeHelp = props.activeHelp,
allHelp = props.allHelp,
focused = props.focused,
onFocus = props.onFocus,
onBlur = props.onBlur,
onKeyDown = props.onKeyDown,
locale = props.locale,
generateConfig = props.generateConfig,
placeholder = props.placeholder,
className = props.className,
style = props.style,
onClick = props.onClick,
onClear = props.onClear,
value = props.value,
onChange = props.onChange,
onSubmit = props.onSubmit,
onInputChange = props.onInputChange,
format = props.format,
maskFormat = props.maskFormat,
preserveInvalidOnBlur = props.preserveInvalidOnBlur,
onInvalid = props.onInvalid,
disabled = props.disabled,
invalid = props.invalid,
inputReadOnly = props.inputReadOnly,
direction = props.direction,
onOpenChange = props.onOpenChange,
onActiveInfo = props.onActiveInfo,
placement = props.placement,
_onMouseDown = props.onMouseDown,
required = props.required,
ariaRequired = props['aria-required'],
autoFocus = props.autoFocus,
tabIndex = props.tabIndex,
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
var rtl = direction === 'rtl';
// ======================== Prefix ========================
var _React$useContext = React.useContext(_context.default),
prefixCls = _React$useContext.prefixCls;
// ========================== Id ==========================
var ids = React.useMemo(function () {
if (typeof id === 'string') {
return [id];
}
var mergedId = id || {};
return [mergedId.start, mergedId.end];
}, [id]);
// ========================= Refs =========================
var rootRef = React.useRef();
var inputStartRef = React.useRef();
var inputEndRef = React.useRef();
var getInput = function getInput(index) {
var _index;
return (_index = [inputStartRef, inputEndRef][index]) === null || _index === void 0 ? void 0 : _index.current;
};
React.useImperativeHandle(ref, function () {
return {
nativeElement: rootRef.current,
focus: function focus(options) {
if ((0, _typeof2.default)(options) === 'object') {
var _getInput;
var _ref = options || {},
_ref$index = _ref.index,
_index2 = _ref$index === void 0 ? 0 : _ref$index,
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded2);
(_getInput = getInput(_index2)) === null || _getInput === void 0 || _getInput.focus(rest);
} else {
var _getInput2;
(_getInput2 = getInput(options !== null && options !== void 0 ? options : 0)) === null || _getInput2 === void 0 || _getInput2.focus();
}
},
blur: function blur() {
var _getInput3, _getInput4;
(_getInput3 = getInput(0)) === null || _getInput3 === void 0 || _getInput3.blur();
(_getInput4 = getInput(1)) === null || _getInput4 === void 0 || _getInput4.blur();
}
};
});
// ======================== Props =========================
var rootProps = (0, _useRootProps.default)(restProps);
// ===================== Placeholder ======================
var mergedPlaceholder = React.useMemo(function () {
return Array.isArray(placeholder) ? placeholder : [placeholder, placeholder];
}, [placeholder]);
// ======================== Inputs ========================
var _useInputProps = (0, _useInputProps3.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
id: ids,
placeholder: mergedPlaceholder
})),
_useInputProps2 = (0, _slicedToArray2.default)(_useInputProps, 1),
getInputProps = _useInputProps2[0];
// ====================== ActiveBar =======================
var _React$useState = React.useState({
position: 'absolute',
width: 0
}),
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
activeBarStyle = _React$useState2[0],
setActiveBarStyle = _React$useState2[1];
var syncActiveOffset = (0, _rcUtil.useEvent)(function () {
var input = getInput(activeIndex);
if (input) {
var inputRect = input.nativeElement.getBoundingClientRect();
var parentRect = rootRef.current.getBoundingClientRect();
var rectOffset = inputRect.left - parentRect.left;
setActiveBarStyle(function (ori) {
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, ori), {}, {
width: inputRect.width,
left: rectOffset
});
});
onActiveInfo([inputRect.left, inputRect.right, parentRect.width]);
}
});
React.useEffect(function () {
syncActiveOffset();
}, [activeIndex]);
// ======================== Clear =========================
var showClear = clearIcon && (value[0] && !disabled[0] || value[1] && !disabled[1]);
// ======================= Disabled =======================
var startAutoFocus = autoFocus && !disabled[0];
var endAutoFocus = autoFocus && !startAutoFocus && !disabled[1];
// ======================== Render ========================
return /*#__PURE__*/React.createElement(_rcResizeObserver.default, {
onResize: syncActiveOffset
}, /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, rootProps, {
className: (0, _classnames.default)(prefixCls, "".concat(prefixCls, "-range"), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(prefixCls, "-focused"), focused), "".concat(prefixCls, "-disabled"), disabled.every(function (i) {
return i;
})), "".concat(prefixCls, "-invalid"), invalid.some(function (i) {
return i;
})), "".concat(prefixCls, "-rtl"), rtl), className),
style: style,
ref: rootRef,
onClick: onClick
// Not lose current input focus
,
onMouseDown: function onMouseDown(e) {
var target = e.target;
if (target !== inputStartRef.current.inputElement && target !== inputEndRef.current.inputElement) {
e.preventDefault();
}
_onMouseDown === null || _onMouseDown === void 0 || _onMouseDown(e);
}
}), prefix && /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-prefix")
}, prefix), /*#__PURE__*/React.createElement(_Input.default, (0, _extends2.default)({
ref: inputStartRef
}, getInputProps(0), {
autoFocus: startAutoFocus,
tabIndex: tabIndex,
"date-range": "start"
})), /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-range-separator")
}, separator), /*#__PURE__*/React.createElement(_Input.default, (0, _extends2.default)({
ref: inputEndRef
}, getInputProps(1), {
autoFocus: endAutoFocus,
tabIndex: tabIndex,
"date-range": "end"
})), /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-active-bar"),
style: activeBarStyle
}), /*#__PURE__*/React.createElement(_Icon.default, {
type: "suffix",
icon: suffixIcon
}), showClear && /*#__PURE__*/React.createElement(_Icon.ClearIcon, {
icon: clearIcon,
onClear: onClear
})));
}
var RefRangeSelector = /*#__PURE__*/React.forwardRef(RangeSelector);
if (process.env.NODE_ENV !== 'production') {
RefRangeSelector.displayName = 'RangeSelector';
}
var _default = exports.default = RefRangeSelector;

View File

@@ -0,0 +1,12 @@
import * as React from 'react';
import type { PickerProps } from '../../SinglePicker';
export interface MultipleDatesProps<DateType extends object = any> extends Pick<PickerProps, 'maxTagCount'> {
prefixCls: string;
value: DateType[];
onRemove: (value: DateType) => void;
removeIcon?: React.ReactNode;
formatDate: (date: DateType) => string;
disabled?: boolean;
placeholder?: React.ReactNode;
}
export default function MultipleDates<DateType extends object = any>(props: MultipleDatesProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,74 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = MultipleDates;
var _classnames = _interopRequireDefault(require("classnames"));
var _rcOverflow = _interopRequireDefault(require("rc-overflow"));
var React = _interopRequireWildcard(require("react"));
function MultipleDates(props) {
var prefixCls = props.prefixCls,
value = props.value,
onRemove = props.onRemove,
_props$removeIcon = props.removeIcon,
removeIcon = _props$removeIcon === void 0 ? '×' : _props$removeIcon,
formatDate = props.formatDate,
disabled = props.disabled,
maxTagCount = props.maxTagCount,
placeholder = props.placeholder;
var selectorCls = "".concat(prefixCls, "-selector");
var selectionCls = "".concat(prefixCls, "-selection");
var overflowCls = "".concat(selectionCls, "-overflow");
// ========================= Item =========================
function renderSelector(content, onClose) {
return /*#__PURE__*/React.createElement("span", {
className: (0, _classnames.default)("".concat(selectionCls, "-item")),
title: typeof content === 'string' ? content : null
}, /*#__PURE__*/React.createElement("span", {
className: "".concat(selectionCls, "-item-content")
}, content), !disabled && onClose && /*#__PURE__*/React.createElement("span", {
onMouseDown: function onMouseDown(e) {
e.preventDefault();
},
onClick: onClose,
className: "".concat(selectionCls, "-item-remove")
}, removeIcon));
}
function renderItem(date) {
var displayLabel = formatDate(date);
var onClose = function onClose(event) {
if (event) event.stopPropagation();
onRemove(date);
};
return renderSelector(displayLabel, onClose);
}
// ========================= Rest =========================
function renderRest(omittedValues) {
var content = "+ ".concat(omittedValues.length, " ...");
return renderSelector(content);
}
// ======================== Render ========================
return /*#__PURE__*/React.createElement("div", {
className: selectorCls
}, /*#__PURE__*/React.createElement(_rcOverflow.default, {
prefixCls: overflowCls,
data: value,
renderItem: renderItem,
renderRest: renderRest
// suffix={inputNode}
,
itemKey: function itemKey(date) {
return formatDate(date);
},
maxCount: maxTagCount
}), !value.length && /*#__PURE__*/React.createElement("span", {
className: "".concat(prefixCls, "-selection-placeholder")
}, placeholder));
}

View File

@@ -0,0 +1,18 @@
import * as React from 'react';
import type { InternalMode, PickerRef, SelectorProps } from '../../../interface';
import type { PickerProps } from '../../SinglePicker';
export interface SingleSelectorProps<DateType extends object = any> extends SelectorProps<DateType>, Pick<PickerProps, 'multiple' | 'maxTagCount'> {
id?: string;
value?: DateType[];
onChange: (date: DateType[]) => void;
internalPicker: InternalMode;
disabled: boolean;
/** All the field show as `placeholder` */
allHelp: boolean;
placeholder?: string;
invalid: boolean;
onInvalid: (valid: boolean) => void;
removeIcon?: React.ReactNode;
}
declare const RefSingleSelector: React.ForwardRefExoticComponent<SingleSelectorProps<object> & React.RefAttributes<PickerRef>>;
export default RefSingleSelector;

View File

@@ -0,0 +1,185 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _classnames = _interopRequireDefault(require("classnames"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../../utils/dateUtil");
var _context = _interopRequireDefault(require("../../context"));
var _Icon = _interopRequireWildcard(require("../Icon"));
var _Input = _interopRequireDefault(require("../Input"));
var _useInputProps3 = _interopRequireDefault(require("../hooks/useInputProps"));
var _useRootProps = _interopRequireDefault(require("../hooks/useRootProps"));
var _MultipleDates = _interopRequireDefault(require("./MultipleDates"));
var _excluded = ["id", "open", "prefix", "clearIcon", "suffixIcon", "activeHelp", "allHelp", "focused", "onFocus", "onBlur", "onKeyDown", "locale", "generateConfig", "placeholder", "className", "style", "onClick", "onClear", "internalPicker", "value", "onChange", "onSubmit", "onInputChange", "multiple", "maxTagCount", "format", "maskFormat", "preserveInvalidOnBlur", "onInvalid", "disabled", "invalid", "inputReadOnly", "direction", "onOpenChange", "onMouseDown", "required", "aria-required", "autoFocus", "tabIndex", "removeIcon"];
function SingleSelector(props, ref) {
var id = props.id,
open = props.open,
prefix = props.prefix,
clearIcon = props.clearIcon,
suffixIcon = props.suffixIcon,
activeHelp = props.activeHelp,
allHelp = props.allHelp,
focused = props.focused,
onFocus = props.onFocus,
onBlur = props.onBlur,
onKeyDown = props.onKeyDown,
locale = props.locale,
generateConfig = props.generateConfig,
placeholder = props.placeholder,
className = props.className,
style = props.style,
onClick = props.onClick,
onClear = props.onClear,
internalPicker = props.internalPicker,
value = props.value,
onChange = props.onChange,
onSubmit = props.onSubmit,
onInputChange = props.onInputChange,
multiple = props.multiple,
maxTagCount = props.maxTagCount,
format = props.format,
maskFormat = props.maskFormat,
preserveInvalidOnBlur = props.preserveInvalidOnBlur,
onInvalid = props.onInvalid,
disabled = props.disabled,
invalid = props.invalid,
inputReadOnly = props.inputReadOnly,
direction = props.direction,
onOpenChange = props.onOpenChange,
_onMouseDown = props.onMouseDown,
required = props.required,
ariaRequired = props['aria-required'],
autoFocus = props.autoFocus,
tabIndex = props.tabIndex,
removeIcon = props.removeIcon,
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
var rtl = direction === 'rtl';
// ======================== Prefix ========================
var _React$useContext = React.useContext(_context.default),
prefixCls = _React$useContext.prefixCls;
// ========================= Refs =========================
var rootRef = React.useRef();
var inputRef = React.useRef();
React.useImperativeHandle(ref, function () {
return {
nativeElement: rootRef.current,
focus: function focus(options) {
var _inputRef$current;
(_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus(options);
},
blur: function blur() {
var _inputRef$current2;
(_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 || _inputRef$current2.blur();
}
};
});
// ======================== Props =========================
var rootProps = (0, _useRootProps.default)(restProps);
// ======================== Change ========================
var onSingleChange = function onSingleChange(date) {
onChange([date]);
};
var onMultipleRemove = function onMultipleRemove(date) {
var nextValues = value.filter(function (oriDate) {
return oriDate && !(0, _dateUtil.isSame)(generateConfig, locale, oriDate, date, internalPicker);
});
onChange(nextValues);
// When `open`, it means user is operating the
if (!open) {
onSubmit();
}
};
// ======================== Inputs ========================
var _useInputProps = (0, _useInputProps3.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
onChange: onSingleChange
}), function (_ref) {
var valueTexts = _ref.valueTexts;
return {
value: valueTexts[0] || '',
active: focused
};
}),
_useInputProps2 = (0, _slicedToArray2.default)(_useInputProps, 2),
getInputProps = _useInputProps2[0],
getText = _useInputProps2[1];
// ======================== Clear =========================
var showClear = !!(clearIcon && value.length && !disabled);
// ======================= Multiple =======================
var selectorNode = multiple ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_MultipleDates.default, {
prefixCls: prefixCls,
value: value,
onRemove: onMultipleRemove,
formatDate: getText,
maxTagCount: maxTagCount,
disabled: disabled,
removeIcon: removeIcon,
placeholder: placeholder
}), /*#__PURE__*/React.createElement("input", {
className: "".concat(prefixCls, "-multiple-input"),
value: value.map(getText).join(','),
ref: inputRef,
readOnly: true,
autoFocus: autoFocus,
tabIndex: tabIndex
}), /*#__PURE__*/React.createElement(_Icon.default, {
type: "suffix",
icon: suffixIcon
}), showClear && /*#__PURE__*/React.createElement(_Icon.ClearIcon, {
icon: clearIcon,
onClear: onClear
})) : /*#__PURE__*/React.createElement(_Input.default, (0, _extends2.default)({
ref: inputRef
}, getInputProps(), {
autoFocus: autoFocus,
tabIndex: tabIndex,
suffixIcon: suffixIcon,
clearIcon: showClear && /*#__PURE__*/React.createElement(_Icon.ClearIcon, {
icon: clearIcon,
onClear: onClear
}),
showActiveCls: false
}));
// ======================== Render ========================
return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({}, rootProps, {
className: (0, _classnames.default)(prefixCls, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(prefixCls, "-multiple"), multiple), "".concat(prefixCls, "-focused"), focused), "".concat(prefixCls, "-disabled"), disabled), "".concat(prefixCls, "-invalid"), invalid), "".concat(prefixCls, "-rtl"), rtl), className),
style: style,
ref: rootRef,
onClick: onClick
// Not lose current input focus
,
onMouseDown: function onMouseDown(e) {
var _inputRef$current3;
var target = e.target;
if (target !== ((_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.inputElement)) {
e.preventDefault();
}
_onMouseDown === null || _onMouseDown === void 0 || _onMouseDown(e);
}
}), prefix && /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-prefix")
}, prefix), selectorNode);
}
var RefSingleSelector = /*#__PURE__*/React.forwardRef(SingleSelector);
if (process.env.NODE_ENV !== 'production') {
RefSingleSelector.displayName = 'SingleSelector';
}
var _default = exports.default = RefSingleSelector;

View File

@@ -0,0 +1,8 @@
import type { ReactNode } from 'react';
import * as React from 'react';
/**
* Used for `useFilledProps` since it already in the React.useMemo
*/
export declare function fillClearIcon(prefixCls: string, allowClear?: boolean | {
clearIcon?: ReactNode;
}, clearIcon?: ReactNode): string | number | true | Iterable<ReactNode> | React.JSX.Element;

View File

@@ -0,0 +1,26 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.fillClearIcon = fillClearIcon;
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
var React = _interopRequireWildcard(require("react"));
/**
* Used for `useFilledProps` since it already in the React.useMemo
*/
function fillClearIcon(prefixCls, allowClear, clearIcon) {
if (process.env.NODE_ENV !== 'production' && clearIcon) {
(0, _warning.default)(false, '`clearIcon` will be removed in future. Please use `allowClear` instead.');
}
if (allowClear === false) {
return null;
}
var config = allowClear && (0, _typeof2.default)(allowClear) === 'object' ? allowClear : {};
return config.clearIcon || clearIcon || /*#__PURE__*/React.createElement("span", {
className: "".concat(prefixCls, "-clear-btn")
});
}

View File

@@ -0,0 +1,16 @@
import type { SelectorProps } from '../../../interface';
import type { InputProps } from '../Input';
export default function useInputProps<DateType extends object = any>(props: Pick<SelectorProps, 'maskFormat' | 'format' | 'generateConfig' | 'locale' | 'preserveInvalidOnBlur' | 'inputReadOnly' | 'required' | 'aria-required' | 'onSubmit' | 'onFocus' | 'onBlur' | 'onInputChange' | 'onInvalid' | 'onOpenChange' | 'onKeyDown' | 'activeHelp' | 'name' | 'autoComplete' | 'open' | 'picker'> & {
id?: string | string[];
value?: DateType[];
invalid?: boolean | [boolean, boolean];
placeholder?: string | [string, string];
disabled?: boolean | [boolean, boolean];
onChange: (value: DateType | null, index?: number) => void;
allHelp: boolean;
activeIndex?: number | null;
},
/** Used for SinglePicker */
postProps?: (info: {
valueTexts: string[];
}) => Partial<InputProps>): readonly [(index?: number) => InputProps, (date: DateType) => string];

View File

@@ -0,0 +1,181 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useInputProps;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _rcUtil = require("rc-util");
var _pickAttrs = _interopRequireDefault(require("rc-util/lib/pickAttrs"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../../utils/dateUtil");
function useInputProps(props, /** Used for SinglePicker */
postProps) {
var format = props.format,
maskFormat = props.maskFormat,
generateConfig = props.generateConfig,
locale = props.locale,
preserveInvalidOnBlur = props.preserveInvalidOnBlur,
inputReadOnly = props.inputReadOnly,
required = props.required,
ariaRequired = props['aria-required'],
onSubmit = props.onSubmit,
_onFocus = props.onFocus,
_onBlur = props.onBlur,
onInputChange = props.onInputChange,
onInvalid = props.onInvalid,
open = props.open,
onOpenChange = props.onOpenChange,
_onKeyDown = props.onKeyDown,
_onChange = props.onChange,
activeHelp = props.activeHelp,
name = props.name,
autoComplete = props.autoComplete,
id = props.id,
value = props.value,
invalid = props.invalid,
placeholder = props.placeholder,
disabled = props.disabled,
activeIndex = props.activeIndex,
allHelp = props.allHelp,
picker = props.picker;
// ======================== Parser ========================
var parseDate = function parseDate(str, formatStr) {
var parsed = generateConfig.locale.parse(locale.locale, str, [formatStr]);
return parsed && generateConfig.isValidate(parsed) ? parsed : null;
};
// ========================= Text =========================
var firstFormat = format[0];
var getText = React.useCallback(function (date) {
return (0, _dateUtil.formatValue)(date, {
locale: locale,
format: firstFormat,
generateConfig: generateConfig
});
}, [locale, generateConfig, firstFormat]);
var valueTexts = React.useMemo(function () {
return value.map(getText);
}, [value, getText]);
// ========================= Size =========================
var size = React.useMemo(function () {
var defaultSize = picker === 'time' ? 8 : 10;
var length = typeof firstFormat === 'function' ? firstFormat(generateConfig.getNow()).length : firstFormat.length;
return Math.max(defaultSize, length) + 2;
}, [firstFormat, picker, generateConfig]);
// ======================= Validate =======================
var _validateFormat = function validateFormat(text) {
for (var i = 0; i < format.length; i += 1) {
var singleFormat = format[i];
// Only support string type
if (typeof singleFormat === 'string') {
var parsed = parseDate(text, singleFormat);
if (parsed) {
return parsed;
}
}
}
return false;
};
// ======================== Input =========================
var getInputProps = function getInputProps(index) {
function getProp(propValue) {
return index !== undefined ? propValue[index] : propValue;
}
var pickedAttrs = (0, _pickAttrs.default)(props, {
aria: true,
data: true
});
var inputProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, pickedAttrs), {}, {
// ============== Shared ==============
format: maskFormat,
validateFormat: function validateFormat(text) {
return !!_validateFormat(text);
},
preserveInvalidOnBlur: preserveInvalidOnBlur,
readOnly: inputReadOnly,
required: required,
'aria-required': ariaRequired,
name: name,
autoComplete: autoComplete,
size: size,
// ============= By Index =============
id: getProp(id),
value: getProp(valueTexts) || '',
invalid: getProp(invalid),
placeholder: getProp(placeholder),
active: activeIndex === index,
helped: allHelp || activeHelp && activeIndex === index,
disabled: getProp(disabled),
onFocus: function onFocus(event) {
_onFocus(event, index);
},
onBlur: function onBlur(event) {
// Blur do not trigger close
// Since it may focus to the popup panel
_onBlur(event, index);
},
onSubmit: onSubmit,
// Get validate text value
onChange: function onChange(text) {
onInputChange();
var parsed = _validateFormat(text);
if (parsed) {
onInvalid(false, index);
_onChange(parsed, index);
return;
}
// Tell outer that the value typed is invalid.
// If text is empty, it means valid.
onInvalid(!!text, index);
},
onHelp: function onHelp() {
onOpenChange(true, {
index: index
});
},
onKeyDown: function onKeyDown(event) {
var prevented = false;
_onKeyDown === null || _onKeyDown === void 0 || _onKeyDown(event, function () {
if (process.env.NODE_ENV !== 'production') {
(0, _rcUtil.warning)(false, '`preventDefault` callback is deprecated. Please call `event.preventDefault` directly.');
}
prevented = true;
});
if (!event.defaultPrevented && !prevented) {
switch (event.key) {
case 'Escape':
onOpenChange(false, {
index: index
});
break;
case 'Enter':
if (!open) {
onOpenChange(true);
}
break;
}
}
}
}, postProps === null || postProps === void 0 ? void 0 : postProps({
valueTexts: valueTexts
}));
// ============== Clean Up ==============
Object.keys(inputProps).forEach(function (key) {
if (inputProps[key] === undefined) {
delete inputProps[key];
}
});
return inputProps;
};
return [getInputProps, getText];
}

View File

@@ -0,0 +1,2 @@
import * as React from 'react';
export default function useRootProps(props: React.HTMLAttributes<any>): React.HTMLAttributes<any>;

View File

@@ -0,0 +1,15 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useRootProps;
var React = _interopRequireWildcard(require("react"));
var _miscUtil = require("../../../utils/miscUtil");
var propNames = ['onMouseEnter', 'onMouseLeave'];
function useRootProps(props) {
return React.useMemo(function () {
return (0, _miscUtil.pickProps)(props, propNames);
}, [props]);
}

View File

@@ -0,0 +1 @@
export declare function getMaskRange(key: string): [startVal: number, endVal: number, defaultVal?: number];

View File

@@ -0,0 +1,18 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.getMaskRange = getMaskRange;
function getMaskRange(key) {
var PresetRange = {
YYYY: [0, 9999, new Date().getFullYear()],
MM: [1, 12],
DD: [1, 31],
HH: [0, 23],
mm: [0, 59],
ss: [0, 59],
SSS: [0, 999]
};
return PresetRange[key];
}

View File

@@ -0,0 +1,51 @@
import * as React from 'react';
import type { BaseInfo, PanelMode, PickerRef, SharedPickerProps, SharedTimeProps, ValueDate } from '../interface';
export interface BasePickerProps<DateType extends object = any> extends SharedPickerProps<DateType> {
id?: string;
/** Not support `time` or `datetime` picker */
multiple?: boolean;
removeIcon?: React.ReactNode;
/** Only work when `multiple` is in used */
maxTagCount?: number | 'responsive';
value?: DateType | DateType[] | null;
defaultValue?: DateType | DateType[];
onChange?: (date: DateType | DateType[], dateString: string | string[]) => void;
onCalendarChange?: (date: DateType | DateType[], dateString: string | string[], info: BaseInfo) => void;
/** */
onOk?: (value?: DateType | DateType[]) => void;
placeholder?: string;
/**
* Config the popup panel date.
* Every time active the input to open popup will reset with `defaultPickerValue`.
*
* Note: `defaultPickerValue` priority is higher than `value` for the first open.
*/
defaultPickerValue?: DateType | null;
/**
* Config each start & end field popup panel date.
* When config `pickerValue`, you must also provide `onPickerValueChange` to handle changes.
*/
pickerValue?: DateType | null;
/**
* Each popup panel `pickerValue` change will trigger the callback.
* @param date The changed picker value
* @param info.source `panel` from the panel click. `reset` from popup open or field typing.
*/
onPickerValueChange?: (date: DateType, info: {
source: 'reset' | 'panel';
mode: PanelMode;
}) => void;
presets?: ValueDate<DateType>[];
disabled?: boolean;
mode?: PanelMode;
onPanelChange?: (values: DateType, modes: PanelMode) => void;
}
export interface PickerProps<DateType extends object = any> extends BasePickerProps<DateType>, Omit<SharedTimeProps<DateType>, 'format' | 'defaultValue'> {
}
/** Internal usage. For cross function get same aligned props */
export type ReplacedPickerProps<DateType extends object = any> = {
onChange?: (date: DateType | DateType[], dateString: string | string[]) => void;
onCalendarChange?: (date: DateType | DateType[], dateString: string | string[], info: BaseInfo) => void;
};
declare const RefPicker: <DateType extends object = any>(props: PickerProps<DateType> & React.RefAttributes<PickerRef>) => React.ReactElement;
export default RefPicker;

538
node_modules/rc-picker/lib/PickerInput/SinglePicker.js generated vendored Normal file
View File

@@ -0,0 +1,538 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _rcUtil = require("rc-util");
var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
var _omit = _interopRequireDefault(require("rc-util/lib/omit"));
var _pickAttrs = _interopRequireDefault(require("rc-util/lib/pickAttrs"));
var React = _interopRequireWildcard(require("react"));
var _useToggleDates = _interopRequireDefault(require("../hooks/useToggleDates"));
var _PickerTrigger = _interopRequireDefault(require("../PickerTrigger"));
var _util = require("../PickerTrigger/util");
var _miscUtil = require("../utils/miscUtil");
var _context = _interopRequireDefault(require("./context"));
var _useCellRender = _interopRequireDefault(require("./hooks/useCellRender"));
var _useFieldsInvalidate3 = _interopRequireDefault(require("./hooks/useFieldsInvalidate"));
var _useFilledProps3 = _interopRequireDefault(require("./hooks/useFilledProps"));
var _useOpen3 = _interopRequireDefault(require("./hooks/useOpen"));
var _usePickerRef = _interopRequireDefault(require("./hooks/usePickerRef"));
var _usePresets = _interopRequireDefault(require("./hooks/usePresets"));
var _useRangeActive3 = _interopRequireDefault(require("./hooks/useRangeActive"));
var _useRangePickerValue3 = _interopRequireDefault(require("./hooks/useRangePickerValue"));
var _useRangeValue3 = _interopRequireWildcard(require("./hooks/useRangeValue"));
var _useShowNow = _interopRequireDefault(require("./hooks/useShowNow"));
var _Popup = _interopRequireDefault(require("./Popup"));
var _SingleSelector = _interopRequireDefault(require("./Selector/SingleSelector"));
// TODO: isInvalidateDate with showTime.disabledTime should not provide `range` prop
/** Internal usage. For cross function get same aligned props */
function Picker(props, ref) {
// ========================= Prop =========================
var _useFilledProps = (0, _useFilledProps3.default)(props),
_useFilledProps2 = (0, _slicedToArray2.default)(_useFilledProps, 6),
filledProps = _useFilledProps2[0],
internalPicker = _useFilledProps2[1],
complexPicker = _useFilledProps2[2],
formatList = _useFilledProps2[3],
maskFormat = _useFilledProps2[4],
isInvalidateDate = _useFilledProps2[5];
var _ref = filledProps,
prefixCls = _ref.prefixCls,
styles = _ref.styles,
classNames = _ref.classNames,
order = _ref.order,
defaultValue = _ref.defaultValue,
value = _ref.value,
needConfirm = _ref.needConfirm,
onChange = _ref.onChange,
onKeyDown = _ref.onKeyDown,
disabled = _ref.disabled,
disabledDate = _ref.disabledDate,
minDate = _ref.minDate,
maxDate = _ref.maxDate,
defaultOpen = _ref.defaultOpen,
open = _ref.open,
onOpenChange = _ref.onOpenChange,
locale = _ref.locale,
generateConfig = _ref.generateConfig,
picker = _ref.picker,
showNow = _ref.showNow,
showToday = _ref.showToday,
showTime = _ref.showTime,
mode = _ref.mode,
onPanelChange = _ref.onPanelChange,
onCalendarChange = _ref.onCalendarChange,
onOk = _ref.onOk,
multiple = _ref.multiple,
defaultPickerValue = _ref.defaultPickerValue,
pickerValue = _ref.pickerValue,
onPickerValueChange = _ref.onPickerValueChange,
inputReadOnly = _ref.inputReadOnly,
suffixIcon = _ref.suffixIcon,
removeIcon = _ref.removeIcon,
onFocus = _ref.onFocus,
onBlur = _ref.onBlur,
presets = _ref.presets,
components = _ref.components,
cellRender = _ref.cellRender,
dateRender = _ref.dateRender,
monthCellRender = _ref.monthCellRender,
onClick = _ref.onClick;
// ========================= Refs =========================
var selectorRef = (0, _usePickerRef.default)(ref);
// ========================= Util =========================
function pickerParam(values) {
if (values === null) {
return null;
}
return multiple ? values : values[0];
}
var toggleDates = (0, _useToggleDates.default)(generateConfig, locale, internalPicker);
// ========================= Open =========================
var _useOpen = (0, _useOpen3.default)(open, defaultOpen, [disabled], onOpenChange),
_useOpen2 = (0, _slicedToArray2.default)(_useOpen, 2),
mergedOpen = _useOpen2[0],
triggerOpen = _useOpen2[1];
// ======================= Calendar =======================
var onInternalCalendarChange = function onInternalCalendarChange(dates, dateStrings, info) {
if (onCalendarChange) {
var filteredInfo = (0, _objectSpread2.default)({}, info);
delete filteredInfo.range;
onCalendarChange(pickerParam(dates), pickerParam(dateStrings), filteredInfo);
}
};
var onInternalOk = function onInternalOk(dates) {
onOk === null || onOk === void 0 || onOk(pickerParam(dates));
};
// ======================== Values ========================
var _useInnerValue = (0, _useRangeValue3.useInnerValue)(generateConfig, locale, formatList, false, order, defaultValue, value, onInternalCalendarChange, onInternalOk),
_useInnerValue2 = (0, _slicedToArray2.default)(_useInnerValue, 5),
mergedValue = _useInnerValue2[0],
setInnerValue = _useInnerValue2[1],
getCalendarValue = _useInnerValue2[2],
triggerCalendarChange = _useInnerValue2[3],
triggerOk = _useInnerValue2[4];
var calendarValue = getCalendarValue();
// ======================== Active ========================
// In SinglePicker, we will always get `activeIndex` is 0.
var _useRangeActive = (0, _useRangeActive3.default)([disabled]),
_useRangeActive2 = (0, _slicedToArray2.default)(_useRangeActive, 4),
focused = _useRangeActive2[0],
triggerFocus = _useRangeActive2[1],
lastOperation = _useRangeActive2[2],
activeIndex = _useRangeActive2[3];
var onSharedFocus = function onSharedFocus(event) {
triggerFocus(true);
onFocus === null || onFocus === void 0 || onFocus(event, {});
};
var onSharedBlur = function onSharedBlur(event) {
triggerFocus(false);
onBlur === null || onBlur === void 0 || onBlur(event, {});
};
// ========================= Mode =========================
var _useMergedState = (0, _rcUtil.useMergedState)(picker, {
value: mode
}),
_useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
mergedMode = _useMergedState2[0],
setMode = _useMergedState2[1];
/** Extends from `mergedMode` to patch `datetime` mode */
var internalMode = mergedMode === 'date' && showTime ? 'datetime' : mergedMode;
// ======================= Show Now =======================
var mergedShowNow = (0, _useShowNow.default)(picker, mergedMode, showNow, showToday);
// ======================== Value =========================
var onInternalChange = onChange && function (dates, dateStrings) {
onChange(pickerParam(dates), pickerParam(dateStrings));
};
var _useRangeValue = (0, _useRangeValue3.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, filledProps), {}, {
onChange: onInternalChange
}), mergedValue, setInnerValue, getCalendarValue, triggerCalendarChange, [],
//disabled,
formatList, focused, mergedOpen, isInvalidateDate),
_useRangeValue2 = (0, _slicedToArray2.default)(_useRangeValue, 2),
/** Trigger `onChange` directly without check `disabledDate` */
triggerSubmitChange = _useRangeValue2[1];
// ======================= Validate =======================
var _useFieldsInvalidate = (0, _useFieldsInvalidate3.default)(calendarValue, isInvalidateDate),
_useFieldsInvalidate2 = (0, _slicedToArray2.default)(_useFieldsInvalidate, 2),
submitInvalidates = _useFieldsInvalidate2[0],
onSelectorInvalid = _useFieldsInvalidate2[1];
var submitInvalidate = React.useMemo(function () {
return submitInvalidates.some(function (invalidated) {
return invalidated;
});
}, [submitInvalidates]);
// ===================== Picker Value =====================
// Proxy to single pickerValue
var onInternalPickerValueChange = function onInternalPickerValueChange(dates, info) {
if (onPickerValueChange) {
var cleanInfo = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, info), {}, {
mode: info.mode[0]
});
delete cleanInfo.range;
onPickerValueChange(dates[0], cleanInfo);
}
};
var _useRangePickerValue = (0, _useRangePickerValue3.default)(generateConfig, locale, calendarValue, [mergedMode], mergedOpen, activeIndex, internalPicker, false,
// multiplePanel,
defaultPickerValue, pickerValue, (0, _miscUtil.toArray)(showTime === null || showTime === void 0 ? void 0 : showTime.defaultOpenValue), onInternalPickerValueChange, minDate, maxDate),
_useRangePickerValue2 = (0, _slicedToArray2.default)(_useRangePickerValue, 2),
currentPickerValue = _useRangePickerValue2[0],
setCurrentPickerValue = _useRangePickerValue2[1];
// >>> Mode need wait for `pickerValue`
var triggerModeChange = (0, _rcUtil.useEvent)(function (nextPickerValue, nextMode, triggerEvent) {
setMode(nextMode);
// Compatible with `onPanelChange`
if (onPanelChange && triggerEvent !== false) {
var lastPickerValue = nextPickerValue || calendarValue[calendarValue.length - 1];
onPanelChange(lastPickerValue, nextMode);
}
});
// ======================== Submit ========================
/**
* Different with RangePicker, confirm should check `multiple` logic.
* This will never provide `date` instead.
*/
var triggerConfirm = function triggerConfirm() {
triggerSubmitChange(getCalendarValue());
triggerOpen(false, {
force: true
});
};
// ======================== Click =========================
var onSelectorClick = function onSelectorClick(event) {
if (!disabled && !selectorRef.current.nativeElement.contains(document.activeElement)) {
// Click to focus the enabled input
selectorRef.current.focus();
}
triggerOpen(true);
onClick === null || onClick === void 0 || onClick(event);
};
var onSelectorClear = function onSelectorClear() {
triggerSubmitChange(null);
triggerOpen(false, {
force: true
});
};
// ======================== Hover =========================
var _React$useState = React.useState(null),
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
hoverSource = _React$useState2[0],
setHoverSource = _React$useState2[1];
var _React$useState3 = React.useState(null),
_React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
internalHoverValue = _React$useState4[0],
setInternalHoverValue = _React$useState4[1];
var hoverValues = React.useMemo(function () {
var values = [internalHoverValue].concat((0, _toConsumableArray2.default)(calendarValue)).filter(function (date) {
return date;
});
return multiple ? values : values.slice(0, 1);
}, [calendarValue, internalHoverValue, multiple]);
// Selector values is different with RangePicker
// which can not use `hoverValue` directly
var selectorValues = React.useMemo(function () {
if (!multiple && internalHoverValue) {
return [internalHoverValue];
}
return calendarValue.filter(function (date) {
return date;
});
}, [calendarValue, internalHoverValue, multiple]);
// Clean up `internalHoverValues` when closed
React.useEffect(function () {
if (!mergedOpen) {
setInternalHoverValue(null);
}
}, [mergedOpen]);
// ========================================================
// == Panels ==
// ========================================================
// ======================= Presets ========================
var presetList = (0, _usePresets.default)(presets);
var onPresetHover = function onPresetHover(nextValue) {
setInternalHoverValue(nextValue);
setHoverSource('preset');
};
// TODO: handle this
var onPresetSubmit = function onPresetSubmit(nextValue) {
var nextCalendarValues = multiple ? toggleDates(getCalendarValue(), nextValue) : [nextValue];
var passed = triggerSubmitChange(nextCalendarValues);
if (passed && !multiple) {
triggerOpen(false, {
force: true
});
}
};
var onNow = function onNow(now) {
onPresetSubmit(now);
};
// ======================== Panel =========================
var onPanelHover = function onPanelHover(date) {
setInternalHoverValue(date);
setHoverSource('cell');
};
// >>> Focus
var onPanelFocus = function onPanelFocus(event) {
triggerOpen(true);
onSharedFocus(event);
};
// >>> Calendar
var onPanelSelect = function onPanelSelect(date) {
lastOperation('panel');
// Not change values if multiple and current panel is to match with picker
if (multiple && internalMode !== picker) {
return;
}
var nextValues = multiple ? toggleDates(getCalendarValue(), date) : [date];
// Only trigger calendar event but not update internal `calendarValue` state
triggerCalendarChange(nextValues);
// >>> Trigger next active if !needConfirm
// Fully logic check `useRangeValue` hook
if (!needConfirm && !complexPicker && internalPicker === internalMode) {
triggerConfirm();
}
};
// >>> Close
var onPopupClose = function onPopupClose() {
// Close popup
triggerOpen(false);
};
// >>> cellRender
var onInternalCellRender = (0, _useCellRender.default)(cellRender, dateRender, monthCellRender);
// >>> invalid
var panelProps = React.useMemo(function () {
var domProps = (0, _pickAttrs.default)(filledProps, false);
var restProps = (0, _omit.default)(filledProps, [].concat((0, _toConsumableArray2.default)(Object.keys(domProps)), ['onChange', 'onCalendarChange', 'style', 'className', 'onPanelChange']));
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), {}, {
multiple: filledProps.multiple
});
}, [filledProps]);
// >>> Render
var panel = /*#__PURE__*/React.createElement(_Popup.default, (0, _extends2.default)({}, panelProps, {
showNow: mergedShowNow,
showTime: showTime
// Disabled
,
disabledDate: disabledDate
// Focus
,
onFocus: onPanelFocus,
onBlur: onSharedBlur
// Mode
,
picker: picker,
mode: mergedMode,
internalMode: internalMode,
onPanelChange: triggerModeChange
// Value
,
format: maskFormat,
value: calendarValue,
isInvalid: isInvalidateDate,
onChange: null,
onSelect: onPanelSelect
// PickerValue
,
pickerValue: currentPickerValue,
defaultOpenValue: showTime === null || showTime === void 0 ? void 0 : showTime.defaultOpenValue,
onPickerValueChange: setCurrentPickerValue
// Hover
,
hoverValue: hoverValues,
onHover: onPanelHover
// Submit
,
needConfirm: needConfirm,
onSubmit: triggerConfirm,
onOk: triggerOk
// Preset
,
presets: presetList,
onPresetHover: onPresetHover,
onPresetSubmit: onPresetSubmit,
onNow: onNow
// Render
,
cellRender: onInternalCellRender
}));
// ========================================================
// == Selector ==
// ========================================================
// ======================== Change ========================
var onSelectorChange = function onSelectorChange(date) {
triggerCalendarChange(date);
};
var onSelectorInputChange = function onSelectorInputChange() {
lastOperation('input');
};
// ======================= Selector =======================
var onSelectorFocus = function onSelectorFocus(event) {
lastOperation('input');
triggerOpen(true, {
inherit: true
});
// setActiveIndex(index);
onSharedFocus(event);
};
var onSelectorBlur = function onSelectorBlur(event) {
triggerOpen(false);
onSharedBlur(event);
};
var onSelectorKeyDown = function onSelectorKeyDown(event, preventDefault) {
if (event.key === 'Tab') {
triggerConfirm();
}
onKeyDown === null || onKeyDown === void 0 || onKeyDown(event, preventDefault);
};
// ======================= Context ========================
var context = React.useMemo(function () {
return {
prefixCls: prefixCls,
locale: locale,
generateConfig: generateConfig,
button: components.button,
input: components.input
};
}, [prefixCls, locale, generateConfig, components.button, components.input]);
// ======================== Effect ========================
// >>> Mode
// Reset for every active
(0, _useLayoutEffect.default)(function () {
if (mergedOpen && activeIndex !== undefined) {
// Legacy compatible. This effect update should not trigger `onPanelChange`
triggerModeChange(null, picker, false);
}
}, [mergedOpen, activeIndex, picker]);
// >>> For complex picker, we need check if need to focus next one
(0, _useLayoutEffect.default)(function () {
var lastOp = lastOperation();
// Trade as confirm on field leave
if (!mergedOpen && lastOp === 'input') {
triggerOpen(false);
triggerConfirm();
}
// Submit with complex picker
if (!mergedOpen && complexPicker && !needConfirm && lastOp === 'panel') {
triggerConfirm();
}
}, [mergedOpen]);
// ======================== Render ========================
return /*#__PURE__*/React.createElement(_context.default.Provider, {
value: context
}, /*#__PURE__*/React.createElement(_PickerTrigger.default, (0, _extends2.default)({}, (0, _util.pickTriggerProps)(filledProps), {
popupElement: panel,
popupStyle: styles.popup,
popupClassName: classNames.popup
// Visible
,
visible: mergedOpen,
onClose: onPopupClose
}), /*#__PURE__*/React.createElement(_SingleSelector.default
// Shared
, (0, _extends2.default)({}, filledProps, {
// Ref
ref: selectorRef
// Icon
,
suffixIcon: suffixIcon,
removeIcon: removeIcon
// Active
,
activeHelp: !!internalHoverValue,
allHelp: !!internalHoverValue && hoverSource === 'preset',
focused: focused,
onFocus: onSelectorFocus,
onBlur: onSelectorBlur,
onKeyDown: onSelectorKeyDown,
onSubmit: triggerConfirm
// Change
,
value: selectorValues,
maskFormat: maskFormat,
onChange: onSelectorChange,
onInputChange: onSelectorInputChange,
internalPicker: internalPicker
// Format
,
format: formatList,
inputReadOnly: inputReadOnly
// Disabled
,
disabled: disabled
// Open
,
open: mergedOpen,
onOpenChange: triggerOpen
// Click
,
onClick: onSelectorClick,
onClear: onSelectorClear
// Invalid
,
invalid: submitInvalidate,
onInvalid: function onInvalid(invalid) {
// Only `single` mode support type date.
// `multiple` mode can not typing.
onSelectorInvalid(invalid, 0);
}
}))));
}
var RefPicker = /*#__PURE__*/React.forwardRef(Picker);
if (process.env.NODE_ENV !== 'production') {
RefPicker.displayName = 'RefPicker';
}
var _default = exports.default = RefPicker;

13
node_modules/rc-picker/lib/PickerInput/context.d.ts generated vendored Normal file
View File

@@ -0,0 +1,13 @@
import * as React from 'react';
import type { GenerateConfig } from '../generate';
import type { Components, Locale } from '../interface';
export interface PickerContextProps<DateType = any> {
prefixCls: string;
locale: Locale;
generateConfig: GenerateConfig<DateType>;
/** Customize button component */
button?: Components['button'];
input?: Components['input'];
}
declare const PickerContext: React.Context<PickerContextProps<any>>;
export default PickerContext;

10
node_modules/rc-picker/lib/PickerInput/context.js generated vendored Normal file
View File

@@ -0,0 +1,10 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var React = _interopRequireWildcard(require("react"));
var PickerContext = /*#__PURE__*/React.createContext(null);
var _default = exports.default = PickerContext;

View File

@@ -0,0 +1,2 @@
import type { CellRender, CellRenderInfo, SharedPickerProps } from '../../interface';
export default function useCellRender<DateType extends object = any>(cellRender: SharedPickerProps<DateType>['cellRender'], dateRender?: SharedPickerProps<DateType>['dateRender'], monthCellRender?: SharedPickerProps<DateType>['monthCellRender'], range?: CellRenderInfo<DateType>['range']): CellRender<DateType>;

View File

@@ -0,0 +1,44 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useCellRender;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _rcUtil = require("rc-util");
var React = _interopRequireWildcard(require("react"));
function useCellRender(cellRender, dateRender, monthCellRender, range) {
// ========================= Warn =========================
if (process.env.NODE_ENV !== 'production') {
(0, _rcUtil.warning)(!dateRender, "'dateRender' is deprecated. Please use 'cellRender' instead.");
(0, _rcUtil.warning)(!monthCellRender, "'monthCellRender' is deprecated. Please use 'cellRender' instead.");
}
// ======================== Render ========================
// Merged render
var mergedCellRender = React.useMemo(function () {
if (cellRender) {
return cellRender;
}
return function (current, info) {
var date = current;
if (dateRender && info.type === 'date') {
return dateRender(date, info.today);
}
if (monthCellRender && info.type === 'month') {
return monthCellRender(date, info.locale);
}
return info.originNode;
};
}, [cellRender, monthCellRender, dateRender]);
// Cell render
var onInternalCellRender = React.useCallback(function (date, info) {
return mergedCellRender(date, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, info), {}, {
range: range
}));
}, [mergedCellRender, range]);
return onInternalCellRender;
}

View File

@@ -0,0 +1,5 @@
/**
* Will be `true` immediately for next effect.
* But will be `false` for a delay of effect.
*/
export default function useDelayState<T>(value: T, defaultValue?: T, onChange?: (next: T) => void): [state: T, setState: (nextState: T, immediately?: boolean) => void];

View File

@@ -0,0 +1,49 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useDelayState;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _rcUtil = require("rc-util");
var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
var _react = _interopRequireDefault(require("react"));
/**
* Will be `true` immediately for next effect.
* But will be `false` for a delay of effect.
*/
function useDelayState(value, defaultValue, onChange) {
var _useMergedState = (0, _rcUtil.useMergedState)(defaultValue, {
value: value
}),
_useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
state = _useMergedState2[0],
setState = _useMergedState2[1];
var nextValueRef = _react.default.useRef(value);
// ============================= Update =============================
var rafRef = _react.default.useRef();
var cancelRaf = function cancelRaf() {
_raf.default.cancel(rafRef.current);
};
var doUpdate = (0, _rcUtil.useEvent)(function () {
setState(nextValueRef.current);
if (onChange && state !== nextValueRef.current) {
onChange(nextValueRef.current);
}
});
var updateValue = (0, _rcUtil.useEvent)(function (next, immediately) {
cancelRaf();
nextValueRef.current = next;
if (next || immediately) {
doUpdate();
} else {
rafRef.current = (0, _raf.default)(doUpdate);
}
});
_react.default.useEffect(function () {
return cancelRaf;
}, []);
return [state, updateValue];
}

View File

@@ -0,0 +1,7 @@
import type { GenerateConfig } from '../../generate';
import type { DisabledDate, InternalMode, Locale } from '../../interface';
export type IsInvalidBoundary<DateType> = (currentDate: DateType, type: InternalMode, fromDate?: DateType) => boolean;
/**
* Merge `disabledDate` with `minDate` & `maxDate`.
*/
export default function useDisabledBoundary<DateType extends object = any>(generateConfig: GenerateConfig<DateType>, locale: Locale, disabledDate?: DisabledDate<DateType>, minDate?: DateType, maxDate?: DateType): DisabledDate<DateType>;

View File

@@ -0,0 +1,26 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useDisabledBoundary;
var _rcUtil = require("rc-util");
var _dateUtil = require("../../utils/dateUtil");
/**
* Merge `disabledDate` with `minDate` & `maxDate`.
*/
function useDisabledBoundary(generateConfig, locale, disabledDate, minDate, maxDate) {
var mergedDisabledDate = (0, _rcUtil.useEvent)(function (date, info) {
if (disabledDate && disabledDate(date, info)) {
return true;
}
if (minDate && generateConfig.isAfter(minDate, date) && !(0, _dateUtil.isSame)(generateConfig, locale, minDate, date, info.type)) {
return true;
}
if (maxDate && generateConfig.isAfter(date, maxDate) && !(0, _dateUtil.isSame)(generateConfig, locale, maxDate, date, info.type)) {
return true;
}
return false;
});
return mergedDisabledDate;
}

View File

@@ -0,0 +1,2 @@
import type { FormatType, InternalMode, Locale, SharedPickerProps } from '../../interface';
export declare function useFieldFormat<DateType = any>(picker: InternalMode, locale: Locale, format?: SharedPickerProps['format']): [formatList: FormatType<DateType>[], maskFormat?: string];

View File

@@ -0,0 +1,26 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.useFieldFormat = useFieldFormat;
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var React = _interopRequireWildcard(require("react"));
var _miscUtil = require("../../utils/miscUtil");
function useFieldFormat(picker, locale, format) {
return React.useMemo(function () {
var rawFormat = (0, _miscUtil.getRowFormat)(picker, locale, format);
var formatList = (0, _miscUtil.toArray)(rawFormat);
var firstFormat = formatList[0];
var maskFormat = (0, _typeof2.default)(firstFormat) === 'object' && firstFormat.type === 'mask' ? firstFormat.format : null;
return [
// Format list
formatList.map(function (config) {
return typeof config === 'string' || typeof config === 'function' ? config : config.format;
}),
// Mask Format
maskFormat];
}, [picker, locale, format]);
}

View File

@@ -0,0 +1,5 @@
import type useInvalidate from './useInvalidate';
/**
* Used to control each fields invalidate status
*/
export default function useFieldsInvalidate<DateType extends object, ValueType extends DateType[]>(calendarValue: ValueType, isInvalidateDate: ReturnType<typeof useInvalidate<DateType>>, allowEmpty?: boolean[]): readonly [[boolean, boolean], (invalid: boolean, index: number) => void];

View File

@@ -0,0 +1,58 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useFieldsInvalidate;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _miscUtil = require("../../utils/miscUtil");
var React = _interopRequireWildcard(require("react"));
/**
* Used to control each fields invalidate status
*/
function useFieldsInvalidate(calendarValue, isInvalidateDate) {
var allowEmpty = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
var _React$useState = React.useState([false, false]),
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
fieldsInvalidates = _React$useState2[0],
setFieldsInvalidates = _React$useState2[1];
var onSelectorInvalid = function onSelectorInvalid(invalid, index) {
setFieldsInvalidates(function (ori) {
return (0, _miscUtil.fillIndex)(ori, index, invalid);
});
};
/**
* For the Selector Input to mark as `aria-disabled`
*/
var submitInvalidates = React.useMemo(function () {
return fieldsInvalidates.map(function (invalid, index) {
// If typing invalidate
if (invalid) {
return true;
}
var current = calendarValue[index];
// Not check if all empty
if (!current) {
return false;
}
// Not allow empty
if (!allowEmpty[index] && !current) {
return true;
}
// Invalidate
if (current && isInvalidateDate(current, {
activeIndex: index
})) {
return true;
}
return false;
});
}, [calendarValue, fieldsInvalidates, isInvalidateDate, allowEmpty]);
return [submitInvalidates, onSelectorInvalid];
}

View File

@@ -0,0 +1,37 @@
import type { FormatType, InternalMode, PickerMode } from '../../interface';
import type { RangePickerProps } from '../RangePicker';
import useInvalidate from './useInvalidate';
type UseInvalidate<DateType extends object = any> = typeof useInvalidate<DateType>;
type PickedProps<DateType extends object = any> = Pick<RangePickerProps<DateType>, 'generateConfig' | 'locale' | 'picker' | 'prefixCls' | 'styles' | 'classNames' | 'order' | 'components' | 'inputRender' | 'clearIcon' | 'allowClear' | 'needConfirm' | 'format' | 'inputReadOnly' | 'disabledDate' | 'minDate' | 'maxDate' | 'defaultOpenValue'> & {
multiple?: boolean;
showTime?: any;
value?: any;
defaultValue?: any;
pickerValue?: any;
defaultPickerValue?: any;
};
type ExcludeBooleanType<T> = T extends boolean ? never : T;
type GetGeneric<T> = T extends PickedProps<infer U> ? U : never;
type ToArrayType<T, DateType> = T extends any[] ? T : DateType[];
/**
* Align the outer props with unique typed and fill undefined props.
* This is shared with both RangePicker and Picker. This will do:
* - Convert `value` & `defaultValue` to array
* - handle the legacy props fill like `clearIcon` + `allowClear` = `clearIcon`
*/
export default function useFilledProps<InProps extends PickedProps, DateType extends GetGeneric<InProps>, UpdaterProps extends object>(props: InProps, updater?: () => UpdaterProps): [
filledProps: Omit<InProps, keyof UpdaterProps | 'showTime' | 'value' | 'defaultValue'> & UpdaterProps & {
picker: PickerMode;
showTime?: ExcludeBooleanType<InProps['showTime']>;
value?: ToArrayType<InProps['value'], DateType>;
defaultValue?: ToArrayType<InProps['value'], DateType>;
pickerValue?: ToArrayType<InProps['value'], DateType>;
defaultPickerValue?: ToArrayType<InProps['value'], DateType>;
},
internalPicker: InternalMode,
complexPicker: boolean,
formatList: FormatType<DateType>[],
maskFormat: string,
isInvalidateDate: ReturnType<UseInvalidate<DateType>>
];
export {};

View File

@@ -0,0 +1,153 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useFilledProps;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _rcUtil = require("rc-util");
var React = _interopRequireWildcard(require("react"));
var _useLocale = _interopRequireDefault(require("../../hooks/useLocale"));
var _useTimeConfig = require("../../hooks/useTimeConfig");
var _miscUtil = require("../../utils/miscUtil");
var _useClearIcon = require("../Selector/hooks/useClearIcon");
var _useDisabledBoundary = _interopRequireDefault(require("./useDisabledBoundary"));
var _useFieldFormat3 = require("./useFieldFormat");
var _useInputReadOnly = _interopRequireDefault(require("./useInputReadOnly"));
var _useInvalidate = _interopRequireDefault(require("./useInvalidate"));
function useList(value) {
var fillMode = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var values = React.useMemo(function () {
var list = value ? (0, _miscUtil.toArray)(value) : value;
if (fillMode && list) {
list[1] = list[1] || list[0];
}
return list;
}, [value, fillMode]);
return values;
}
/**
* Align the outer props with unique typed and fill undefined props.
* This is shared with both RangePicker and Picker. This will do:
* - Convert `value` & `defaultValue` to array
* - handle the legacy props fill like `clearIcon` + `allowClear` = `clearIcon`
*/
function useFilledProps(props, updater) {
var generateConfig = props.generateConfig,
locale = props.locale,
_props$picker = props.picker,
picker = _props$picker === void 0 ? 'date' : _props$picker,
_props$prefixCls = props.prefixCls,
prefixCls = _props$prefixCls === void 0 ? 'rc-picker' : _props$prefixCls,
_props$styles = props.styles,
styles = _props$styles === void 0 ? {} : _props$styles,
_props$classNames = props.classNames,
classNames = _props$classNames === void 0 ? {} : _props$classNames,
_props$order = props.order,
order = _props$order === void 0 ? true : _props$order,
_props$components = props.components,
components = _props$components === void 0 ? {} : _props$components,
inputRender = props.inputRender,
allowClear = props.allowClear,
clearIcon = props.clearIcon,
needConfirm = props.needConfirm,
multiple = props.multiple,
format = props.format,
inputReadOnly = props.inputReadOnly,
disabledDate = props.disabledDate,
minDate = props.minDate,
maxDate = props.maxDate,
showTime = props.showTime,
value = props.value,
defaultValue = props.defaultValue,
pickerValue = props.pickerValue,
defaultPickerValue = props.defaultPickerValue;
var values = useList(value);
var defaultValues = useList(defaultValue);
var pickerValues = useList(pickerValue);
var defaultPickerValues = useList(defaultPickerValue);
// ======================== Picker ========================
/** Almost same as `picker`, but add `datetime` for `date` with `showTime` */
var internalPicker = picker === 'date' && showTime ? 'datetime' : picker;
/** The picker is `datetime` or `time` */
var multipleInteractivePicker = internalPicker === 'time' || internalPicker === 'datetime';
var complexPicker = multipleInteractivePicker || multiple;
var mergedNeedConfirm = needConfirm !== null && needConfirm !== void 0 ? needConfirm : multipleInteractivePicker;
// ========================== Time ==========================
// Auto `format` need to check `showTime.showXXX` first.
// And then merge the `locale` into `mergedShowTime`.
var _getTimeProps = (0, _useTimeConfig.getTimeProps)(props),
_getTimeProps2 = (0, _slicedToArray2.default)(_getTimeProps, 4),
timeProps = _getTimeProps2[0],
localeTimeProps = _getTimeProps2[1],
showTimeFormat = _getTimeProps2[2],
propFormat = _getTimeProps2[3];
// ======================= Locales ========================
var mergedLocale = (0, _useLocale.default)(locale, localeTimeProps);
var mergedShowTime = React.useMemo(function () {
return (0, _useTimeConfig.fillShowTimeConfig)(internalPicker, showTimeFormat, propFormat, timeProps, mergedLocale);
}, [internalPicker, showTimeFormat, propFormat, timeProps, mergedLocale]);
// ======================= Warning ========================
if (process.env.NODE_ENV !== 'production' && picker === 'time') {
if (['disabledHours', 'disabledMinutes', 'disabledSeconds'].some(function (key) {
return props[key];
})) {
(0, _rcUtil.warning)(false, "'disabledHours', 'disabledMinutes', 'disabledSeconds' will be removed in the next major version, please use 'disabledTime' instead.");
}
}
// ======================== Props =========================
var filledProps = React.useMemo(function () {
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
prefixCls: prefixCls,
locale: mergedLocale,
picker: picker,
styles: styles,
classNames: classNames,
order: order,
components: (0, _objectSpread2.default)({
input: inputRender
}, components),
clearIcon: (0, _useClearIcon.fillClearIcon)(prefixCls, allowClear, clearIcon),
showTime: mergedShowTime,
value: values,
defaultValue: defaultValues,
pickerValue: pickerValues,
defaultPickerValue: defaultPickerValues
}, updater === null || updater === void 0 ? void 0 : updater());
}, [props]);
// ======================== Format ========================
var _useFieldFormat = (0, _useFieldFormat3.useFieldFormat)(internalPicker, mergedLocale, format),
_useFieldFormat2 = (0, _slicedToArray2.default)(_useFieldFormat, 2),
formatList = _useFieldFormat2[0],
maskFormat = _useFieldFormat2[1];
// ======================= ReadOnly =======================
var mergedInputReadOnly = (0, _useInputReadOnly.default)(formatList, inputReadOnly, multiple);
// ======================= Boundary =======================
var disabledBoundaryDate = (0, _useDisabledBoundary.default)(generateConfig, locale, disabledDate, minDate, maxDate);
// ====================== Invalidate ======================
var isInvalidateDate = (0, _useInvalidate.default)(generateConfig, picker, disabledBoundaryDate, mergedShowTime);
// ======================== Merged ========================
var mergedProps = React.useMemo(function () {
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, filledProps), {}, {
needConfirm: mergedNeedConfirm,
inputReadOnly: mergedInputReadOnly,
disabledDate: disabledBoundaryDate
});
}, [filledProps, mergedNeedConfirm, mergedInputReadOnly, disabledBoundaryDate]);
return [mergedProps, internalPicker, complexPicker, formatList, maskFormat, isInvalidateDate];
}

View File

@@ -0,0 +1,2 @@
import type { FormatType } from '../../interface';
export default function useInputReadOnly<DateType = any>(formatList: FormatType<DateType>[], inputReadOnly?: boolean, multiple?: boolean): boolean;

View File

@@ -0,0 +1,12 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useInputReadOnly;
function useInputReadOnly(formatList, inputReadOnly, multiple) {
if (typeof formatList[0] === 'function' || multiple) {
return true;
}
return inputReadOnly;
}

View File

@@ -0,0 +1,9 @@
import type { GenerateConfig } from '../../generate';
import type { PanelMode, RangeTimeProps, SharedPickerProps, SharedTimeProps } from '../../interface';
/**
* Check if provided date is valid for the `disabledDate` & `showTime.disabledTime`.
*/
export default function useInvalidate<DateType extends object = any>(generateConfig: GenerateConfig<DateType>, picker: PanelMode, disabledDate?: SharedPickerProps<DateType>['disabledDate'], showTime?: SharedTimeProps<DateType> | RangeTimeProps<DateType>): (date: DateType, info?: {
from?: DateType;
activeIndex: number;
}) => boolean;

View File

@@ -0,0 +1,63 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useInvalidate;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _rcUtil = require("rc-util");
/**
* Check if provided date is valid for the `disabledDate` & `showTime.disabledTime`.
*/
function useInvalidate(generateConfig, picker, disabledDate, showTime) {
// Check disabled date
var isInvalidate = (0, _rcUtil.useEvent)(function (date, info) {
var outsideInfo = (0, _objectSpread2.default)({
type: picker
}, info);
delete outsideInfo.activeIndex;
if (
// Date object is invalid
!generateConfig.isValidate(date) ||
// Date is disabled by `disabledDate`
disabledDate && disabledDate(date, outsideInfo)) {
return true;
}
if ((picker === 'date' || picker === 'time') && showTime) {
var _showTime$disabledTim;
var range = info && info.activeIndex === 1 ? 'end' : 'start';
var _ref = ((_showTime$disabledTim = showTime.disabledTime) === null || _showTime$disabledTim === void 0 ? void 0 : _showTime$disabledTim.call(showTime, date, range, {
from: outsideInfo.from
})) || {},
disabledHours = _ref.disabledHours,
disabledMinutes = _ref.disabledMinutes,
disabledSeconds = _ref.disabledSeconds,
disabledMilliseconds = _ref.disabledMilliseconds;
var legacyDisabledHours = showTime.disabledHours,
legacyDisabledMinutes = showTime.disabledMinutes,
legacyDisabledSeconds = showTime.disabledSeconds;
var mergedDisabledHours = disabledHours || legacyDisabledHours;
var mergedDisabledMinutes = disabledMinutes || legacyDisabledMinutes;
var mergedDisabledSeconds = disabledSeconds || legacyDisabledSeconds;
var hour = generateConfig.getHour(date);
var minute = generateConfig.getMinute(date);
var second = generateConfig.getSecond(date);
var millisecond = generateConfig.getMillisecond(date);
if (mergedDisabledHours && mergedDisabledHours().includes(hour)) {
return true;
}
if (mergedDisabledMinutes && mergedDisabledMinutes(hour).includes(minute)) {
return true;
}
if (mergedDisabledSeconds && mergedDisabledSeconds(hour, minute).includes(second)) {
return true;
}
if (disabledMilliseconds && disabledMilliseconds(hour, minute, second).includes(millisecond)) {
return true;
}
}
return false;
});
return isInvalidate;
}

View File

@@ -0,0 +1,5 @@
/**
* Trigger `callback` immediately when `condition` is `true`.
* But trigger `callback` in next frame when `condition` is `false`.
*/
export default function useLockEffect(condition: boolean, callback: (next: boolean) => void, delayFrames?: number): void;

View File

@@ -0,0 +1,32 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useLockEffect;
var _useLayoutEffect = require("rc-util/lib/hooks/useLayoutEffect");
var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
var React = _interopRequireWildcard(require("react"));
/**
* Trigger `callback` immediately when `condition` is `true`.
* But trigger `callback` in next frame when `condition` is `false`.
*/
function useLockEffect(condition, callback) {
var delayFrames = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
var callbackRef = React.useRef(callback);
callbackRef.current = callback;
(0, _useLayoutEffect.useLayoutUpdateEffect)(function () {
if (condition) {
callbackRef.current(condition);
} else {
var id = (0, _raf.default)(function () {
callbackRef.current(condition);
}, delayFrames);
return function () {
_raf.default.cancel(id);
};
}
}, [condition]);
}

View File

@@ -0,0 +1,6 @@
import type { OpenConfig } from '../../interface';
/**
* Control the open state.
* Will not close if activeElement is on the popup.
*/
export default function useOpen(open?: boolean, defaultOpen?: boolean, disabledList?: boolean[], onOpenChange?: (open: boolean) => void): [open: boolean, setOpen: (open: boolean, config?: OpenConfig) => void];

View File

@@ -0,0 +1,34 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useOpen;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _useDelayState3 = _interopRequireDefault(require("./useDelayState"));
/**
* Control the open state.
* Will not close if activeElement is on the popup.
*/
function useOpen(open, defaultOpen) {
var disabledList = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
var onOpenChange = arguments.length > 3 ? arguments[3] : undefined;
var mergedOpen = disabledList.every(function (disabled) {
return disabled;
}) ? false : open;
// Delay for handle the open state, in case fast shift from `open` -> `close` -> `open`
// const [rafOpen, setRafOpen] = useLockState(open, defaultOpen || false, onOpenChange);
var _useDelayState = (0, _useDelayState3.default)(mergedOpen, defaultOpen || false, onOpenChange),
_useDelayState2 = (0, _slicedToArray2.default)(_useDelayState, 2),
rafOpen = _useDelayState2[0],
setRafOpen = _useDelayState2[1];
function setOpen(next) {
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
if (!config.inherit || rafOpen) {
setRafOpen(next, config.force);
}
}
return [rafOpen, setOpen];
}

View File

@@ -0,0 +1,7 @@
import * as React from 'react';
import type { PickerRef } from '../../interface';
type PickerRefType<OptionType> = Omit<PickerRef, 'focus'> & {
focus: (options?: OptionType) => void;
};
export default function usePickerRef<OptionType>(ref: React.Ref<PickerRefType<OptionType>>): React.MutableRefObject<PickerRefType<OptionType>>;
export {};

View File

@@ -0,0 +1,26 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = usePickerRef;
var React = _interopRequireWildcard(require("react"));
function usePickerRef(ref) {
var selectorRef = React.useRef();
React.useImperativeHandle(ref, function () {
var _selectorRef$current;
return {
nativeElement: (_selectorRef$current = selectorRef.current) === null || _selectorRef$current === void 0 ? void 0 : _selectorRef$current.nativeElement,
focus: function focus(options) {
var _selectorRef$current2;
(_selectorRef$current2 = selectorRef.current) === null || _selectorRef$current2 === void 0 || _selectorRef$current2.focus(options);
},
blur: function blur() {
var _selectorRef$current3;
(_selectorRef$current3 = selectorRef.current) === null || _selectorRef$current3 === void 0 || _selectorRef$current3.blur();
}
};
});
return selectorRef;
}

View File

@@ -0,0 +1,2 @@
import type { ValueDate } from '../../interface';
export default function usePresets<DateType = any>(presets?: ValueDate<DateType>[], legacyRanges?: Record<string, DateType | (() => DateType)>): ValueDate<DateType>[];

View File

@@ -0,0 +1,31 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = usePresets;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
function usePresets(presets, legacyRanges) {
return React.useMemo(function () {
if (presets) {
return presets;
}
if (legacyRanges) {
(0, _warning.default)(false, '`ranges` is deprecated. Please use `presets` instead.');
return Object.entries(legacyRanges).map(function (_ref) {
var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
label = _ref2[0],
value = _ref2[1];
return {
label: label,
value: value
};
});
}
return [];
}, [presets, legacyRanges]);
}

View File

@@ -0,0 +1,19 @@
import type { RangeValueType } from '../RangePicker';
export type OperationType = 'input' | 'panel';
export type NextActive<DateType> = (nextValue: RangeValueType<DateType>) => number | null;
/**
* When user first focus one input, any submit will trigger focus another one.
* When second time focus one input, submit will not trigger focus again.
* When click outside to close the panel, trigger event if it can trigger onChange.
*/
export default function useRangeActive<DateType>(disabled: boolean[], empty?: boolean[], mergedOpen?: boolean): [
focused: boolean,
triggerFocus: (focused: boolean) => void,
lastOperation: (type?: OperationType) => OperationType,
activeIndex: number,
setActiveIndex: (index: number) => void,
nextActiveIndex: NextActive<DateType>,
activeList: number[],
updateSubmitIndex: (index: number | null) => void,
hasActiveSubmitValue: (index: number) => boolean
];

View File

@@ -0,0 +1,77 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useRangeActive;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _useLockEffect = _interopRequireDefault(require("./useLockEffect"));
/**
* When user first focus one input, any submit will trigger focus another one.
* When second time focus one input, submit will not trigger focus again.
* When click outside to close the panel, trigger event if it can trigger onChange.
*/
function useRangeActive(disabled) {
var empty = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
var mergedOpen = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
var _React$useState = React.useState(0),
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
activeIndex = _React$useState2[0],
setActiveIndex = _React$useState2[1];
var _React$useState3 = React.useState(false),
_React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
focused = _React$useState4[0],
setFocused = _React$useState4[1];
var activeListRef = React.useRef([]);
var submitIndexRef = React.useRef(null);
var lastOperationRef = React.useRef(null);
var updateSubmitIndex = function updateSubmitIndex(index) {
submitIndexRef.current = index;
};
var hasActiveSubmitValue = function hasActiveSubmitValue(index) {
return submitIndexRef.current === index;
};
var triggerFocus = function triggerFocus(nextFocus) {
setFocused(nextFocus);
};
// ============================= Record =============================
var lastOperation = function lastOperation(type) {
if (type) {
lastOperationRef.current = type;
}
return lastOperationRef.current;
};
// ============================ Strategy ============================
// Trigger when input enter or input blur or panel close
var nextActiveIndex = function nextActiveIndex(nextValue) {
var list = activeListRef.current;
var filledActiveSet = new Set(list.filter(function (index) {
return nextValue[index] || empty[index];
}));
var nextIndex = list[list.length - 1] === 0 ? 1 : 0;
if (filledActiveSet.size >= 2 || disabled[nextIndex]) {
return null;
}
return nextIndex;
};
// ============================= Effect =============================
// Wait in case it's from the click outside to blur
(0, _useLockEffect.default)(focused || mergedOpen, function () {
if (!focused) {
activeListRef.current = [];
updateSubmitIndex(null);
}
});
React.useEffect(function () {
if (focused) {
activeListRef.current.push(activeIndex);
}
}, [focused, activeIndex]);
return [focused, triggerFocus, lastOperation, activeIndex, setActiveIndex, nextActiveIndex, activeListRef.current, updateSubmitIndex, hasActiveSubmitValue];
}

View File

@@ -0,0 +1,8 @@
import type { GenerateConfig } from '../../generate';
import type { DisabledDate, Locale } from '../../interface';
import type { RangeValueType } from '../RangePicker';
/**
* RangePicker need additional logic to handle the `disabled` case. e.g.
* [disabled, enabled] should end date not before start date
*/
export default function useRangeDisabledDate<DateType extends object = any>(values: RangeValueType<DateType>, disabled: [boolean, boolean], activeIndexList: number[], generateConfig: GenerateConfig<DateType>, locale: Locale, disabledDate?: DisabledDate<DateType>): DisabledDate<DateType>;

View File

@@ -0,0 +1,49 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useRangeDisabledDate;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _dateUtil = require("../../utils/dateUtil");
var _miscUtil = require("../../utils/miscUtil");
/**
* RangePicker need additional logic to handle the `disabled` case. e.g.
* [disabled, enabled] should end date not before start date
*/
function useRangeDisabledDate(values, disabled, activeIndexList, generateConfig, locale, disabledDate) {
var activeIndex = activeIndexList[activeIndexList.length - 1];
var rangeDisabledDate = function rangeDisabledDate(date, info) {
var _values = (0, _slicedToArray2.default)(values, 2),
start = _values[0],
end = _values[1];
var mergedInfo = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, info), {}, {
from: (0, _miscUtil.getFromDate)(values, activeIndexList)
});
// ============================ Disabled ============================
// Should not select days before the start date
if (activeIndex === 1 && disabled[0] && start &&
// Same date isOK
!(0, _dateUtil.isSame)(generateConfig, locale, start, date, mergedInfo.type) &&
// Before start date
generateConfig.isAfter(start, date)) {
return true;
}
// Should not select days after the end date
if (activeIndex === 0 && disabled[1] && end &&
// Same date isOK
!(0, _dateUtil.isSame)(generateConfig, locale, end, date, mergedInfo.type) &&
// After end date
generateConfig.isAfter(date, end)) {
return true;
}
// ============================= Origin =============================
return disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date, mergedInfo);
};
return rangeDisabledDate;
}

View File

@@ -0,0 +1,5 @@
import type { GenerateConfig } from '../../generate';
import type { InternalMode, Locale, PanelMode } from '../../interface';
import type { RangePickerProps } from '../RangePicker';
export declare function offsetPanelDate<DateType = any>(generateConfig: GenerateConfig<DateType>, picker: InternalMode, date: DateType, offset: number): DateType;
export default function useRangePickerValue<DateType extends object, ValueType extends DateType[]>(generateConfig: GenerateConfig<DateType>, locale: Locale, calendarValue: ValueType, modes: PanelMode[], open: boolean, activeIndex: number, pickerMode: InternalMode, multiplePanel: boolean, defaultPickerValue?: ValueType, pickerValue?: ValueType, timeDefaultValue?: ValueType, onPickerValueChange?: RangePickerProps<DateType>['onPickerValueChange'], minDate?: DateType, maxDate?: DateType): [currentIndexPickerValue: DateType, setCurrentIndexPickerValue: (value: DateType) => void];

View File

@@ -0,0 +1,196 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useRangePickerValue;
exports.offsetPanelDate = offsetPanelDate;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _rcUtil = require("rc-util");
var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../utils/dateUtil");
function offsetPanelDate(generateConfig, picker, date, offset) {
switch (picker) {
case 'date':
case 'week':
return generateConfig.addMonth(date, offset);
case 'month':
case 'quarter':
return generateConfig.addYear(date, offset);
case 'year':
return generateConfig.addYear(date, offset * 10);
case 'decade':
return generateConfig.addYear(date, offset * 100);
default:
return date;
}
}
var EMPTY_LIST = [];
function useRangePickerValue(generateConfig, locale, calendarValue, modes, open, activeIndex, pickerMode, multiplePanel) {
var defaultPickerValue = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : EMPTY_LIST;
var pickerValue = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : EMPTY_LIST;
var timeDefaultValue = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : EMPTY_LIST;
var onPickerValueChange = arguments.length > 11 ? arguments[11] : undefined;
var minDate = arguments.length > 12 ? arguments[12] : undefined;
var maxDate = arguments.length > 13 ? arguments[13] : undefined;
var isTimePicker = pickerMode === 'time';
// ======================== Active ========================
// `activeIndex` must be valid to avoid getting empty `pickerValue`
var mergedActiveIndex = activeIndex || 0;
// ===================== Picker Value =====================
var getDefaultPickerValue = function getDefaultPickerValue(index) {
var now = generateConfig.getNow();
if (isTimePicker) {
now = (0, _dateUtil.fillTime)(generateConfig, now);
}
return defaultPickerValue[index] || calendarValue[index] || now;
};
// Align `pickerValue` with `showTime.defaultValue`
var _pickerValue = (0, _slicedToArray2.default)(pickerValue, 2),
startPickerValue = _pickerValue[0],
endPickerValue = _pickerValue[1];
// PickerValue state
var _useMergedState = (0, _rcUtil.useMergedState)(function () {
return getDefaultPickerValue(0);
}, {
value: startPickerValue
}),
_useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
mergedStartPickerValue = _useMergedState2[0],
setStartPickerValue = _useMergedState2[1];
var _useMergedState3 = (0, _rcUtil.useMergedState)(function () {
return getDefaultPickerValue(1);
}, {
value: endPickerValue
}),
_useMergedState4 = (0, _slicedToArray2.default)(_useMergedState3, 2),
mergedEndPickerValue = _useMergedState4[0],
setEndPickerValue = _useMergedState4[1];
// Current PickerValue
var currentPickerValue = React.useMemo(function () {
var current = [mergedStartPickerValue, mergedEndPickerValue][mergedActiveIndex];
// Merge the `showTime.defaultValue` into `pickerValue`
return isTimePicker ? current : (0, _dateUtil.fillTime)(generateConfig, current, timeDefaultValue[mergedActiveIndex]);
}, [isTimePicker, mergedStartPickerValue, mergedEndPickerValue, mergedActiveIndex, generateConfig, timeDefaultValue]);
var setCurrentPickerValue = function setCurrentPickerValue(nextPickerValue) {
var source = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'panel';
var updater = [setStartPickerValue, setEndPickerValue][mergedActiveIndex];
updater(nextPickerValue);
var clone = [mergedStartPickerValue, mergedEndPickerValue];
clone[mergedActiveIndex] = nextPickerValue;
if (onPickerValueChange && (!(0, _dateUtil.isSame)(generateConfig, locale, mergedStartPickerValue, clone[0], pickerMode) || !(0, _dateUtil.isSame)(generateConfig, locale, mergedEndPickerValue, clone[1], pickerMode))) {
onPickerValueChange(clone, {
source: source,
range: mergedActiveIndex === 1 ? 'end' : 'start',
mode: modes
});
}
};
// ======================== Effect ========================
/**
* EndDate pickerValue is little different. It should be:
* - If date picker (without time), endDate is not same year & month as startDate
* - pickerValue minus one month
* - Else pass directly
*/
var getEndDatePickerValue = function getEndDatePickerValue(startDate, endDate) {
if (multiplePanel) {
// Basic offset
var SAME_CHECKER = {
date: 'month',
week: 'month',
month: 'year',
quarter: 'year'
};
var mode = SAME_CHECKER[pickerMode];
if (mode && !(0, _dateUtil.isSame)(generateConfig, locale, startDate, endDate, mode)) {
return offsetPanelDate(generateConfig, pickerMode, endDate, -1);
}
// Year offset
if (pickerMode === 'year' && startDate) {
var srcYear = Math.floor(generateConfig.getYear(startDate) / 10);
var tgtYear = Math.floor(generateConfig.getYear(endDate) / 10);
if (srcYear !== tgtYear) {
return offsetPanelDate(generateConfig, pickerMode, endDate, -1);
}
}
}
return endDate;
};
// >>> When switch field, reset the picker value as prev field picker value
var prevActiveIndexRef = React.useRef(null);
(0, _useLayoutEffect.default)(function () {
if (open) {
if (!defaultPickerValue[mergedActiveIndex]) {
var nextPickerValue = isTimePicker ? null : generateConfig.getNow();
/**
* 1. If has prevActiveIndex, use it to avoid panel jump
* 2. If current field has value
* - If `activeIndex` is 1 and `calendarValue[0]` is not same panel as `calendarValue[1]`,
* offset `calendarValue[1]` and set it
* - Else use `calendarValue[activeIndex]`
* 3. If current field has no value but another field has value, use another field value
* 4. Else use now (not any `calendarValue` can ref)
*/
if (prevActiveIndexRef.current !== null && prevActiveIndexRef.current !== mergedActiveIndex) {
// If from another field, not jump picker value
nextPickerValue = [mergedStartPickerValue, mergedEndPickerValue][mergedActiveIndex ^ 1];
} else if (calendarValue[mergedActiveIndex]) {
// Current field has value
nextPickerValue = mergedActiveIndex === 0 ? calendarValue[0] : getEndDatePickerValue(calendarValue[0], calendarValue[1]);
} else if (calendarValue[mergedActiveIndex ^ 1]) {
// Current field has no value but another field has value
nextPickerValue = calendarValue[mergedActiveIndex ^ 1];
}
// Only sync when has value, this will sync in the `min-max` logic
if (nextPickerValue) {
// nextPickerValue < minDate
if (minDate && generateConfig.isAfter(minDate, nextPickerValue)) {
nextPickerValue = minDate;
}
// maxDate < nextPickerValue
var offsetPickerValue = multiplePanel ? offsetPanelDate(generateConfig, pickerMode, nextPickerValue, 1) : nextPickerValue;
if (maxDate && generateConfig.isAfter(offsetPickerValue, maxDate)) {
nextPickerValue = multiplePanel ? offsetPanelDate(generateConfig, pickerMode, maxDate, -1) : maxDate;
}
setCurrentPickerValue(nextPickerValue, 'reset');
}
}
}
}, [open, mergedActiveIndex, calendarValue[mergedActiveIndex]]);
// >>> Reset prevActiveIndex when panel closed
React.useEffect(function () {
if (open) {
prevActiveIndexRef.current = mergedActiveIndex;
} else {
prevActiveIndexRef.current = null;
}
}, [open, mergedActiveIndex]);
// >>> defaultPickerValue: Resync to `defaultPickerValue` for each panel focused
(0, _useLayoutEffect.default)(function () {
if (open && defaultPickerValue) {
if (defaultPickerValue[mergedActiveIndex]) {
setCurrentPickerValue(defaultPickerValue[mergedActiveIndex], 'reset');
}
}
}, [open, mergedActiveIndex]);
return [currentPickerValue, setCurrentPickerValue];
}

View File

@@ -0,0 +1,28 @@
import type { GenerateConfig } from '../../generate';
import type { BaseInfo, FormatType, Locale, ReplaceListType } from '../../interface';
import type { RangePickerProps } from '../RangePicker';
import type { ReplacedPickerProps } from '../SinglePicker';
type TriggerCalendarChange<ValueType extends object[]> = (calendarValues: ValueType) => void;
/**
* Control the internal `value` align with prop `value` and provide a temp `calendarValue` for ui.
* `calendarValue` will be reset when blur & focus & open.
*/
export declare function useInnerValue<ValueType extends DateType[], DateType extends object = any>(generateConfig: GenerateConfig<DateType>, locale: Locale, formatList: FormatType[],
/** Used for RangePicker. `true` means [DateType, DateType] or will be DateType[] */
rangeValue: boolean,
/**
* Trigger order when trigger calendar value change.
* This should only used in SinglePicker with `multiple` mode.
* So when `rangeValue` is `true`, order will be ignored.
*/
order: boolean, defaultValue?: ValueType, value?: ValueType, onCalendarChange?: (dates: ValueType, dateStrings: ReplaceListType<Required<ValueType>, string>, info: BaseInfo) => void, onOk?: (dates: ValueType) => void): readonly [ValueType, (updater: ValueType | ((origin: ValueType) => ValueType), ignoreDestroy?: boolean) => void, (useControlledValueFirst?: boolean) => ValueType, TriggerCalendarChange<ValueType>, () => void];
export default function useRangeValue<ValueType extends DateType[], DateType extends object = any>(info: Pick<RangePickerProps<DateType>, 'generateConfig' | 'locale' | 'allowEmpty' | 'order' | 'picker'> & ReplacedPickerProps<DateType>, mergedValue: ValueType, setInnerValue: (nextValue: ValueType) => void, getCalendarValue: () => ValueType, triggerCalendarChange: TriggerCalendarChange<ValueType>, disabled: ReplaceListType<Required<ValueType>, boolean>, formatList: FormatType[], focused: boolean, open: boolean, isInvalidateDate: (date: DateType, info?: {
from?: DateType;
activeIndex: number;
}) => boolean): [
/** Trigger `onChange` by check `disabledDate` */
flushSubmit: (index: number, needTriggerChange: boolean) => void,
/** Trigger `onChange` directly without check `disabledDate` */
triggerSubmitChange: (value: ValueType) => boolean
];
export {};

View File

@@ -0,0 +1,298 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useRangeValue;
exports.useInnerValue = useInnerValue;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _rcUtil = require("rc-util");
var React = _interopRequireWildcard(require("react"));
var _useSyncState5 = _interopRequireDefault(require("../../hooks/useSyncState"));
var _dateUtil = require("../../utils/dateUtil");
var _miscUtil = require("../../utils/miscUtil");
var _useLockEffect = _interopRequireDefault(require("./useLockEffect"));
var EMPTY_VALUE = [];
// Submit Logic:
// * ✅ Value:
// * merged value using controlled value, if not, use stateValue
// * When merged value change, [1] resync calendar value and submit value
// * ✅ Calender Value:
// * 💻 When user typing is validate, change the calendar value
// * 🌅 When user click on the panel, change the calendar value
// * Submit Value:
// * 💻 When user blur the input, flush calendar value to submit value
// * 🌅 When user click on the panel is no needConfirm, flush calendar value to submit value
// * 🌅 When user click on the panel is needConfirm and click OK, flush calendar value to submit value
// * Blur logic & close logic:
// * ✅ For value, always try flush submit
// * ✅ If `needConfirm`, reset as [1]
// * Else (`!needConfirm`)
// * If has another index field, active another index
// * ✅ Flush submit:
// * If all the start & end field is confirmed or all blur or panel closed
// * Update `needSubmit` mark to true
// * trigger onChange by `needSubmit` and update stateValue
function useUtil(generateConfig, locale, formatList) {
var getDateTexts = function getDateTexts(dates) {
return dates.map(function (date) {
return (0, _dateUtil.formatValue)(date, {
generateConfig: generateConfig,
locale: locale,
format: formatList[0]
});
});
};
var isSameDates = function isSameDates(source, target) {
var maxLen = Math.max(source.length, target.length);
var diffIndex = -1;
for (var i = 0; i < maxLen; i += 1) {
var prev = source[i] || null;
var next = target[i] || null;
if (prev !== next && !(0, _dateUtil.isSameTimestamp)(generateConfig, prev, next)) {
diffIndex = i;
break;
}
}
return [diffIndex < 0, diffIndex !== 0];
};
return [getDateTexts, isSameDates];
}
function orderDates(dates, generateConfig) {
return (0, _toConsumableArray2.default)(dates).sort(function (a, b) {
return generateConfig.isAfter(a, b) ? 1 : -1;
});
}
/**
* Used for internal value management.
* It should always use `mergedValue` in render logic
*/
function useCalendarValue(mergedValue) {
var _useSyncState = (0, _useSyncState5.default)(mergedValue),
_useSyncState2 = (0, _slicedToArray2.default)(_useSyncState, 2),
calendarValue = _useSyncState2[0],
setCalendarValue = _useSyncState2[1];
/** Sync calendarValue & submitValue back with value */
var syncWithValue = (0, _rcUtil.useEvent)(function () {
setCalendarValue(mergedValue);
});
React.useEffect(function () {
syncWithValue();
}, [mergedValue]);
return [calendarValue, setCalendarValue];
}
/**
* Control the internal `value` align with prop `value` and provide a temp `calendarValue` for ui.
* `calendarValue` will be reset when blur & focus & open.
*/
function useInnerValue(generateConfig, locale, formatList, /** Used for RangePicker. `true` means [DateType, DateType] or will be DateType[] */
rangeValue,
/**
* Trigger order when trigger calendar value change.
* This should only used in SinglePicker with `multiple` mode.
* So when `rangeValue` is `true`, order will be ignored.
*/
order, defaultValue, value, onCalendarChange, onOk) {
// This is the root value which will sync with controlled or uncontrolled value
var _useMergedState = (0, _rcUtil.useMergedState)(defaultValue, {
value: value
}),
_useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
innerValue = _useMergedState2[0],
setInnerValue = _useMergedState2[1];
var mergedValue = innerValue || EMPTY_VALUE;
// ========================= Inner Values =========================
var _useCalendarValue = useCalendarValue(mergedValue),
_useCalendarValue2 = (0, _slicedToArray2.default)(_useCalendarValue, 2),
calendarValue = _useCalendarValue2[0],
setCalendarValue = _useCalendarValue2[1];
// ============================ Change ============================
var _useUtil = useUtil(generateConfig, locale, formatList),
_useUtil2 = (0, _slicedToArray2.default)(_useUtil, 2),
getDateTexts = _useUtil2[0],
isSameDates = _useUtil2[1];
var triggerCalendarChange = (0, _rcUtil.useEvent)(function (nextCalendarValues) {
var clone = (0, _toConsumableArray2.default)(nextCalendarValues);
if (rangeValue) {
for (var i = 0; i < 2; i += 1) {
clone[i] = clone[i] || null;
}
} else if (order) {
clone = orderDates(clone.filter(function (date) {
return date;
}), generateConfig);
}
// Update merged value
var _isSameDates = isSameDates(calendarValue(), clone),
_isSameDates2 = (0, _slicedToArray2.default)(_isSameDates, 2),
isSameMergedDates = _isSameDates2[0],
isSameStart = _isSameDates2[1];
if (!isSameMergedDates) {
setCalendarValue(clone);
// Trigger calendar change event
if (onCalendarChange) {
var cellTexts = getDateTexts(clone);
onCalendarChange(clone, cellTexts, {
range: isSameStart ? 'end' : 'start'
});
}
}
});
var triggerOk = function triggerOk() {
if (onOk) {
onOk(calendarValue());
}
};
return [mergedValue, setInnerValue, calendarValue, triggerCalendarChange, triggerOk];
}
function useRangeValue(info, mergedValue, setInnerValue, getCalendarValue, triggerCalendarChange, disabled, formatList, focused, open, isInvalidateDate) {
var generateConfig = info.generateConfig,
locale = info.locale,
picker = info.picker,
onChange = info.onChange,
allowEmpty = info.allowEmpty,
order = info.order;
var orderOnChange = disabled.some(function (d) {
return d;
}) ? false : order;
// ============================= Util =============================
var _useUtil3 = useUtil(generateConfig, locale, formatList),
_useUtil4 = (0, _slicedToArray2.default)(_useUtil3, 2),
getDateTexts = _useUtil4[0],
isSameDates = _useUtil4[1];
// ============================ Values ============================
// Used for trigger `onChange` event.
// Record current value which is wait for submit.
var _useSyncState3 = (0, _useSyncState5.default)(mergedValue),
_useSyncState4 = (0, _slicedToArray2.default)(_useSyncState3, 2),
submitValue = _useSyncState4[0],
setSubmitValue = _useSyncState4[1];
/** Sync calendarValue & submitValue back with value */
var syncWithValue = (0, _rcUtil.useEvent)(function () {
setSubmitValue(mergedValue);
});
React.useEffect(function () {
syncWithValue();
}, [mergedValue]);
// ============================ Submit ============================
var triggerSubmit = (0, _rcUtil.useEvent)(function (nextValue) {
var isNullValue = nextValue === null;
var clone = (0, _toConsumableArray2.default)(nextValue || submitValue());
// Fill null value
if (isNullValue) {
var maxLen = Math.max(disabled.length, clone.length);
for (var i = 0; i < maxLen; i += 1) {
if (!disabled[i]) {
clone[i] = null;
}
}
}
// Only when exist value to sort
if (orderOnChange && clone[0] && clone[1]) {
clone = orderDates(clone, generateConfig);
}
// Sync `calendarValue`
triggerCalendarChange(clone);
// ========= Validate check =========
var _clone = clone,
_clone2 = (0, _slicedToArray2.default)(_clone, 2),
start = _clone2[0],
end = _clone2[1];
// >>> Empty
var startEmpty = !start;
var endEmpty = !end;
var validateEmptyDateRange = allowEmpty ?
// Validate empty start
(!startEmpty || allowEmpty[0]) && (
// Validate empty end
!endEmpty || allowEmpty[1]) : true;
// >>> Order
var validateOrder = !order || startEmpty || endEmpty || (0, _dateUtil.isSame)(generateConfig, locale, start, end, picker) || generateConfig.isAfter(end, start);
// >>> Invalid
var validateDates =
// Validate start
(disabled[0] || !start || !isInvalidateDate(start, {
activeIndex: 0
})) && (
// Validate end
disabled[1] || !end || !isInvalidateDate(end, {
from: start,
activeIndex: 1
}));
// >>> Result
var allPassed =
// Null value is from clear button
isNullValue ||
// Normal check
validateEmptyDateRange && validateOrder && validateDates;
if (allPassed) {
// Sync value with submit value
setInnerValue(clone);
var _isSameDates3 = isSameDates(clone, mergedValue),
_isSameDates4 = (0, _slicedToArray2.default)(_isSameDates3, 1),
isSameMergedDates = _isSameDates4[0];
// Trigger `onChange` if needed
if (onChange && !isSameMergedDates) {
onChange(
// Return null directly if all date are empty
isNullValue && clone.every(function (val) {
return !val;
}) ? null : clone, getDateTexts(clone));
}
}
return allPassed;
});
// ========================= Flush Submit =========================
var flushSubmit = (0, _rcUtil.useEvent)(function (index, needTriggerChange) {
var nextSubmitValue = (0, _miscUtil.fillIndex)(submitValue(), index, getCalendarValue()[index]);
setSubmitValue(nextSubmitValue);
if (needTriggerChange) {
triggerSubmit();
}
});
// ============================ Effect ============================
// All finished action trigger after 2 frames
var interactiveFinished = !focused && !open;
(0, _useLockEffect.default)(!interactiveFinished, function () {
if (interactiveFinished) {
// Always try to trigger submit first
triggerSubmit();
// Trigger calendar change since this is a effect reset
// https://github.com/ant-design/ant-design/issues/22351
triggerCalendarChange(mergedValue);
// Sync with value anyway
syncWithValue();
}
}, 2);
// ============================ Return ============================
return [flushSubmit, triggerSubmit];
}

View File

@@ -0,0 +1,2 @@
import type { InternalMode, PanelMode } from '../../interface';
export default function useShowNow(picker: InternalMode, mode: PanelMode, showNow?: boolean, showToday?: boolean, rangePicker?: boolean): boolean;

View File

@@ -0,0 +1,20 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useShowNow;
function useShowNow(picker, mode, showNow, showToday, rangePicker) {
if (mode !== 'date' && mode !== 'time') {
return false;
}
if (showNow !== undefined) {
return showNow;
}
// Compatible with old version `showToday`
if (showToday !== undefined) {
return showToday;
}
return !rangePicker && (picker === 'date' || picker === 'time');
}

View File

@@ -0,0 +1,10 @@
import * as React from 'react';
import type { PanelMode, SharedPanelProps } from '../../interface';
export interface DatePanelProps<DateType extends object> extends SharedPanelProps<DateType> {
panelName?: PanelMode;
rowClassName?: (date: DateType) => string;
/** Used for `WeekPanel` */
mode?: PanelMode;
cellSelection?: boolean;
}
export default function DatePanel<DateType extends object = any>(props: DatePanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,190 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = DatePanel;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _classnames = _interopRequireDefault(require("classnames"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../utils/dateUtil");
var _context = require("../context");
var _PanelBody = _interopRequireDefault(require("../PanelBody"));
var _PanelHeader = _interopRequireDefault(require("../PanelHeader"));
function DatePanel(props) {
var prefixCls = props.prefixCls,
_props$panelName = props.panelName,
panelName = _props$panelName === void 0 ? 'date' : _props$panelName,
locale = props.locale,
generateConfig = props.generateConfig,
pickerValue = props.pickerValue,
onPickerValueChange = props.onPickerValueChange,
onModeChange = props.onModeChange,
_props$mode = props.mode,
mode = _props$mode === void 0 ? 'date' : _props$mode,
disabledDate = props.disabledDate,
onSelect = props.onSelect,
onHover = props.onHover,
showWeek = props.showWeek;
var panelPrefixCls = "".concat(prefixCls, "-").concat(panelName, "-panel");
var cellPrefixCls = "".concat(prefixCls, "-cell");
var isWeek = mode === 'week';
// ========================== Base ==========================
var _useInfo = (0, _context.useInfo)(props, mode),
_useInfo2 = (0, _slicedToArray2.default)(_useInfo, 2),
info = _useInfo2[0],
now = _useInfo2[1];
var weekFirstDay = generateConfig.locale.getWeekFirstDay(locale.locale);
var monthStartDate = generateConfig.setDate(pickerValue, 1);
var baseDate = (0, _dateUtil.getWeekStartDate)(locale.locale, generateConfig, monthStartDate);
var month = generateConfig.getMonth(pickerValue);
// =========================== PrefixColumn ===========================
var showPrefixColumn = showWeek === undefined ? isWeek : showWeek;
var prefixColumn = showPrefixColumn ? function (date) {
// >>> Additional check for disabled
var disabled = disabledDate === null || disabledDate === void 0 ? void 0 : disabledDate(date, {
type: 'week'
});
return /*#__PURE__*/React.createElement("td", {
key: "week",
className: (0, _classnames.default)(cellPrefixCls, "".concat(cellPrefixCls, "-week"), (0, _defineProperty2.default)({}, "".concat(cellPrefixCls, "-disabled"), disabled))
// Operation: Same as code in PanelBody
,
onClick: function onClick() {
if (!disabled) {
onSelect(date);
}
},
onMouseEnter: function onMouseEnter() {
if (!disabled) {
onHover === null || onHover === void 0 || onHover(date);
}
},
onMouseLeave: function onMouseLeave() {
if (!disabled) {
onHover === null || onHover === void 0 || onHover(null);
}
}
}, /*#__PURE__*/React.createElement("div", {
className: "".concat(cellPrefixCls, "-inner")
}, generateConfig.locale.getWeek(locale.locale, date)));
} : null;
// ========================= Cells ==========================
// >>> Header Cells
var headerCells = [];
var weekDaysLocale = locale.shortWeekDays || (generateConfig.locale.getShortWeekDays ? generateConfig.locale.getShortWeekDays(locale.locale) : []);
if (prefixColumn) {
headerCells.push( /*#__PURE__*/React.createElement("th", {
key: "empty"
}, /*#__PURE__*/React.createElement("span", {
style: {
width: 0,
height: 0,
position: 'absolute',
overflow: 'hidden',
opacity: 0
}
}, locale.week)));
}
for (var i = 0; i < _dateUtil.WEEK_DAY_COUNT; i += 1) {
headerCells.push( /*#__PURE__*/React.createElement("th", {
key: i
}, weekDaysLocale[(i + weekFirstDay) % _dateUtil.WEEK_DAY_COUNT]));
}
// >>> Body Cells
var getCellDate = function getCellDate(date, offset) {
return generateConfig.addDate(date, offset);
};
var getCellText = function getCellText(date) {
return (0, _dateUtil.formatValue)(date, {
locale: locale,
format: locale.cellDateFormat,
generateConfig: generateConfig
});
};
var getCellClassName = function getCellClassName(date) {
var classObj = (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(prefixCls, "-cell-in-view"), (0, _dateUtil.isSameMonth)(generateConfig, date, pickerValue)), "".concat(prefixCls, "-cell-today"), (0, _dateUtil.isSameDate)(generateConfig, date, now));
return classObj;
};
// ========================= Header =========================
var monthsLocale = locale.shortMonths || (generateConfig.locale.getShortMonths ? generateConfig.locale.getShortMonths(locale.locale) : []);
var yearNode = /*#__PURE__*/React.createElement("button", {
type: "button",
"aria-label": locale.yearSelect,
key: "year",
onClick: function onClick() {
onModeChange('year', pickerValue);
},
tabIndex: -1,
className: "".concat(prefixCls, "-year-btn")
}, (0, _dateUtil.formatValue)(pickerValue, {
locale: locale,
format: locale.yearFormat,
generateConfig: generateConfig
}));
var monthNode = /*#__PURE__*/React.createElement("button", {
type: "button",
"aria-label": locale.monthSelect,
key: "month",
onClick: function onClick() {
onModeChange('month', pickerValue);
},
tabIndex: -1,
className: "".concat(prefixCls, "-month-btn")
}, locale.monthFormat ? (0, _dateUtil.formatValue)(pickerValue, {
locale: locale,
format: locale.monthFormat,
generateConfig: generateConfig
}) : monthsLocale[month]);
var monthYearNodes = locale.monthBeforeYear ? [monthNode, yearNode] : [yearNode, monthNode];
// ========================= Render =========================
return /*#__PURE__*/React.createElement(_context.PanelContext.Provider, {
value: info
}, /*#__PURE__*/React.createElement("div", {
className: (0, _classnames.default)(panelPrefixCls, showWeek && "".concat(panelPrefixCls, "-show-week"))
}, /*#__PURE__*/React.createElement(_PanelHeader.default, {
offset: function offset(distance) {
return generateConfig.addMonth(pickerValue, distance);
},
superOffset: function superOffset(distance) {
return generateConfig.addYear(pickerValue, distance);
},
onChange: onPickerValueChange
// Limitation
,
getStart: function getStart(date) {
return generateConfig.setDate(date, 1);
},
getEnd: function getEnd(date) {
var clone = generateConfig.setDate(date, 1);
clone = generateConfig.addMonth(clone, 1);
return generateConfig.addDate(clone, -1);
}
}, monthYearNodes), /*#__PURE__*/React.createElement(_PanelBody.default, (0, _extends2.default)({
titleFormat: locale.fieldDateFormat
}, props, {
colNum: _dateUtil.WEEK_DAY_COUNT,
rowNum: 6,
baseDate: baseDate
// Header
,
headerCells: headerCells
// Body
,
getCellDate: getCellDate,
getCellText: getCellText,
getCellClassName: getCellClassName,
prefixColumn: prefixColumn,
cellSelection: !isWeek
}))));
}

View File

@@ -0,0 +1,3 @@
import * as React from 'react';
import type { SharedPanelProps } from '../../interface';
export default function DateTimePanel<DateType extends object = any>(props: SharedPanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,58 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = DateTimePanel;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _useTimeInfo3 = _interopRequireDefault(require("../../hooks/useTimeInfo"));
var _dateUtil = require("../../utils/dateUtil");
var _DatePanel = _interopRequireDefault(require("../DatePanel"));
var _TimePanel = _interopRequireDefault(require("../TimePanel"));
function DateTimePanel(props) {
var prefixCls = props.prefixCls,
generateConfig = props.generateConfig,
showTime = props.showTime,
onSelect = props.onSelect,
value = props.value,
pickerValue = props.pickerValue,
onHover = props.onHover;
var panelPrefixCls = "".concat(prefixCls, "-datetime-panel");
// =============================== Time ===============================
var _useTimeInfo = (0, _useTimeInfo3.default)(generateConfig, showTime),
_useTimeInfo2 = (0, _slicedToArray2.default)(_useTimeInfo, 1),
getValidTime = _useTimeInfo2[0];
// Merge the time info from `value` or `pickerValue`
var mergeTime = function mergeTime(date) {
if (value) {
return (0, _dateUtil.fillTime)(generateConfig, date, value);
}
return (0, _dateUtil.fillTime)(generateConfig, date, pickerValue);
};
// ============================== Hover ===============================
var onDateHover = function onDateHover(date) {
onHover === null || onHover === void 0 || onHover(date ? mergeTime(date) : date);
};
// ============================== Select ==============================
var onDateSelect = function onDateSelect(date) {
// Merge with current time
var cloneDate = mergeTime(date);
onSelect(getValidTime(cloneDate, cloneDate));
};
// ============================== Render ==============================
return /*#__PURE__*/React.createElement("div", {
className: panelPrefixCls
}, /*#__PURE__*/React.createElement(_DatePanel.default, (0, _extends2.default)({}, props, {
onSelect: onDateSelect,
onHover: onDateHover
})), /*#__PURE__*/React.createElement(_TimePanel.default, props));
}

View File

@@ -0,0 +1,3 @@
import * as React from 'react';
import type { SharedPanelProps } from '../../interface';
export default function DecadePanel<DateType extends object = any>(props: SharedPanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,113 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = DecadePanel;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../utils/dateUtil");
var _context = require("../context");
var _PanelBody = _interopRequireDefault(require("../PanelBody"));
var _PanelHeader = _interopRequireDefault(require("../PanelHeader"));
function DecadePanel(props) {
var prefixCls = props.prefixCls,
locale = props.locale,
generateConfig = props.generateConfig,
pickerValue = props.pickerValue,
disabledDate = props.disabledDate,
onPickerValueChange = props.onPickerValueChange;
var panelPrefixCls = "".concat(prefixCls, "-decade-panel");
// ========================== Base ==========================
var _useInfo = (0, _context.useInfo)(props, 'decade'),
_useInfo2 = (0, _slicedToArray2.default)(_useInfo, 1),
info = _useInfo2[0];
var getStartYear = function getStartYear(date) {
var startYear = Math.floor(generateConfig.getYear(date) / 100) * 100;
return generateConfig.setYear(date, startYear);
};
var getEndYear = function getEndYear(date) {
var startYear = getStartYear(date);
return generateConfig.addYear(startYear, 99);
};
var startYearDate = getStartYear(pickerValue);
var endYearDate = getEndYear(pickerValue);
var baseDate = generateConfig.addYear(startYearDate, -10);
// ========================= Cells ==========================
var getCellDate = function getCellDate(date, offset) {
return generateConfig.addYear(date, offset * 10);
};
var getCellText = function getCellText(date) {
var cellYearFormat = locale.cellYearFormat;
var startYearStr = (0, _dateUtil.formatValue)(date, {
locale: locale,
format: cellYearFormat,
generateConfig: generateConfig
});
var endYearStr = (0, _dateUtil.formatValue)(generateConfig.addYear(date, 9), {
locale: locale,
format: cellYearFormat,
generateConfig: generateConfig
});
return "".concat(startYearStr, "-").concat(endYearStr);
};
var getCellClassName = function getCellClassName(date) {
return (0, _defineProperty2.default)({}, "".concat(prefixCls, "-cell-in-view"), (0, _dateUtil.isSameDecade)(generateConfig, date, startYearDate) || (0, _dateUtil.isSameDecade)(generateConfig, date, endYearDate) || (0, _dateUtil.isInRange)(generateConfig, startYearDate, endYearDate, date));
};
// ======================== Disabled ========================
var mergedDisabledDate = disabledDate ? function (currentDate, disabledInfo) {
// Start
var baseStartDate = generateConfig.setDate(currentDate, 1);
var baseStartMonth = generateConfig.setMonth(baseStartDate, 0);
var baseStartYear = generateConfig.setYear(baseStartMonth, Math.floor(generateConfig.getYear(baseStartMonth) / 10) * 10);
// End
var baseEndYear = generateConfig.addYear(baseStartYear, 10);
var baseEndDate = generateConfig.addDate(baseEndYear, -1);
return disabledDate(baseStartYear, disabledInfo) && disabledDate(baseEndDate, disabledInfo);
} : null;
// ========================= Header =========================
var yearNode = "".concat((0, _dateUtil.formatValue)(startYearDate, {
locale: locale,
format: locale.yearFormat,
generateConfig: generateConfig
}), "-").concat((0, _dateUtil.formatValue)(endYearDate, {
locale: locale,
format: locale.yearFormat,
generateConfig: generateConfig
}));
// ========================= Render =========================
return /*#__PURE__*/React.createElement(_context.PanelContext.Provider, {
value: info
}, /*#__PURE__*/React.createElement("div", {
className: panelPrefixCls
}, /*#__PURE__*/React.createElement(_PanelHeader.default, {
superOffset: function superOffset(distance) {
return generateConfig.addYear(pickerValue, distance * 100);
},
onChange: onPickerValueChange
// Limitation
,
getStart: getStartYear,
getEnd: getEndYear
}, yearNode), /*#__PURE__*/React.createElement(_PanelBody.default, (0, _extends2.default)({}, props, {
disabledDate: mergedDisabledDate,
colNum: 3,
rowNum: 4,
baseDate: baseDate
// Body
,
getCellDate: getCellDate,
getCellText: getCellText,
getCellClassName: getCellClassName
}))));
}

View File

@@ -0,0 +1,3 @@
import * as React from 'react';
import type { SharedPanelProps } from '../../interface';
export default function MonthPanel<DateType extends object = any>(props: SharedPanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,106 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = MonthPanel;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../utils/dateUtil");
var _context = require("../context");
var _PanelBody = _interopRequireDefault(require("../PanelBody"));
var _PanelHeader = _interopRequireDefault(require("../PanelHeader"));
function MonthPanel(props) {
var prefixCls = props.prefixCls,
locale = props.locale,
generateConfig = props.generateConfig,
pickerValue = props.pickerValue,
disabledDate = props.disabledDate,
onPickerValueChange = props.onPickerValueChange,
onModeChange = props.onModeChange;
var panelPrefixCls = "".concat(prefixCls, "-month-panel");
// ========================== Base ==========================
var _useInfo = (0, _context.useInfo)(props, 'month'),
_useInfo2 = (0, _slicedToArray2.default)(_useInfo, 1),
info = _useInfo2[0];
var baseDate = generateConfig.setMonth(pickerValue, 0);
// ========================= Month ==========================
var monthsLocale = locale.shortMonths || (generateConfig.locale.getShortMonths ? generateConfig.locale.getShortMonths(locale.locale) : []);
// ========================= Cells ==========================
var getCellDate = function getCellDate(date, offset) {
return generateConfig.addMonth(date, offset);
};
var getCellText = function getCellText(date) {
var month = generateConfig.getMonth(date);
return locale.monthFormat ? (0, _dateUtil.formatValue)(date, {
locale: locale,
format: locale.monthFormat,
generateConfig: generateConfig
}) : monthsLocale[month];
};
var getCellClassName = function getCellClassName() {
return (0, _defineProperty2.default)({}, "".concat(prefixCls, "-cell-in-view"), true);
};
// ======================== Disabled ========================
var mergedDisabledDate = disabledDate ? function (currentDate, disabledInfo) {
var startDate = generateConfig.setDate(currentDate, 1);
var nextMonthStartDate = generateConfig.setMonth(startDate, generateConfig.getMonth(startDate) + 1);
var endDate = generateConfig.addDate(nextMonthStartDate, -1);
return disabledDate(startDate, disabledInfo) && disabledDate(endDate, disabledInfo);
} : null;
// ========================= Header =========================
var yearNode = /*#__PURE__*/React.createElement("button", {
type: "button",
key: "year",
"aria-label": locale.yearSelect,
onClick: function onClick() {
onModeChange('year');
},
tabIndex: -1,
className: "".concat(prefixCls, "-year-btn")
}, (0, _dateUtil.formatValue)(pickerValue, {
locale: locale,
format: locale.yearFormat,
generateConfig: generateConfig
}));
// ========================= Render =========================
return /*#__PURE__*/React.createElement(_context.PanelContext.Provider, {
value: info
}, /*#__PURE__*/React.createElement("div", {
className: panelPrefixCls
}, /*#__PURE__*/React.createElement(_PanelHeader.default, {
superOffset: function superOffset(distance) {
return generateConfig.addYear(pickerValue, distance);
},
onChange: onPickerValueChange
// Limitation
,
getStart: function getStart(date) {
return generateConfig.setMonth(date, 0);
},
getEnd: function getEnd(date) {
return generateConfig.setMonth(date, 11);
}
}, yearNode), /*#__PURE__*/React.createElement(_PanelBody.default, (0, _extends2.default)({}, props, {
disabledDate: mergedDisabledDate,
titleFormat: locale.fieldMonthFormat,
colNum: 3,
rowNum: 4,
baseDate: baseDate
// Body
,
getCellDate: getCellDate,
getCellText: getCellText,
getCellClassName: getCellClassName
}))));
}

17
node_modules/rc-picker/lib/PickerPanel/PanelBody.d.ts generated vendored Normal file
View File

@@ -0,0 +1,17 @@
import * as React from 'react';
import type { DisabledDate } from '../interface';
export interface PanelBodyProps<DateType = any> {
rowNum: number;
colNum: number;
baseDate: DateType;
titleFormat?: string;
getCellDate: (date: DateType, offset: number) => DateType;
getCellText: (date: DateType) => React.ReactNode;
getCellClassName: (date: DateType) => Record<string, any>;
disabledDate?: DisabledDate<DateType>;
headerCells?: React.ReactNode[];
prefixColumn?: (date: DateType) => React.ReactNode;
rowClassName?: (date: DateType) => string;
cellSelection?: boolean;
}
export default function PanelBody<DateType extends object = any>(props: PanelBodyProps<DateType>): React.JSX.Element;

152
node_modules/rc-picker/lib/PickerPanel/PanelBody.js generated vendored Normal file
View File

@@ -0,0 +1,152 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = PanelBody;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _classnames = _interopRequireDefault(require("classnames"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../utils/dateUtil");
var _context = require("./context");
function PanelBody(props) {
var rowNum = props.rowNum,
colNum = props.colNum,
baseDate = props.baseDate,
getCellDate = props.getCellDate,
prefixColumn = props.prefixColumn,
rowClassName = props.rowClassName,
titleFormat = props.titleFormat,
getCellText = props.getCellText,
getCellClassName = props.getCellClassName,
headerCells = props.headerCells,
_props$cellSelection = props.cellSelection,
cellSelection = _props$cellSelection === void 0 ? true : _props$cellSelection,
disabledDate = props.disabledDate;
var _usePanelContext = (0, _context.usePanelContext)(),
prefixCls = _usePanelContext.prefixCls,
type = _usePanelContext.panelType,
now = _usePanelContext.now,
contextDisabledDate = _usePanelContext.disabledDate,
cellRender = _usePanelContext.cellRender,
onHover = _usePanelContext.onHover,
hoverValue = _usePanelContext.hoverValue,
hoverRangeValue = _usePanelContext.hoverRangeValue,
generateConfig = _usePanelContext.generateConfig,
values = _usePanelContext.values,
locale = _usePanelContext.locale,
onSelect = _usePanelContext.onSelect;
var mergedDisabledDate = disabledDate || contextDisabledDate;
var cellPrefixCls = "".concat(prefixCls, "-cell");
// ============================= Context ==============================
var _React$useContext = React.useContext(_context.PickerHackContext),
onCellDblClick = _React$useContext.onCellDblClick;
// ============================== Value ===============================
var matchValues = function matchValues(date) {
return values.some(function (singleValue) {
return singleValue && (0, _dateUtil.isSame)(generateConfig, locale, date, singleValue, type);
});
};
// =============================== Body ===============================
var rows = [];
for (var row = 0; row < rowNum; row += 1) {
var rowNode = [];
var rowStartDate = void 0;
var _loop = function _loop() {
var offset = row * colNum + col;
var currentDate = getCellDate(baseDate, offset);
var disabled = mergedDisabledDate === null || mergedDisabledDate === void 0 ? void 0 : mergedDisabledDate(currentDate, {
type: type
});
// Row Start Cell
if (col === 0) {
rowStartDate = currentDate;
if (prefixColumn) {
rowNode.push(prefixColumn(rowStartDate));
}
}
// Range
var inRange = false;
var rangeStart = false;
var rangeEnd = false;
if (cellSelection && hoverRangeValue) {
var _hoverRangeValue = (0, _slicedToArray2.default)(hoverRangeValue, 2),
hoverStart = _hoverRangeValue[0],
hoverEnd = _hoverRangeValue[1];
inRange = (0, _dateUtil.isInRange)(generateConfig, hoverStart, hoverEnd, currentDate);
rangeStart = (0, _dateUtil.isSame)(generateConfig, locale, currentDate, hoverStart, type);
rangeEnd = (0, _dateUtil.isSame)(generateConfig, locale, currentDate, hoverEnd, type);
}
// Title
var title = titleFormat ? (0, _dateUtil.formatValue)(currentDate, {
locale: locale,
format: titleFormat,
generateConfig: generateConfig
}) : undefined;
// Render
var inner = /*#__PURE__*/React.createElement("div", {
className: "".concat(cellPrefixCls, "-inner")
}, getCellText(currentDate));
rowNode.push( /*#__PURE__*/React.createElement("td", {
key: col,
title: title,
className: (0, _classnames.default)(cellPrefixCls, (0, _objectSpread3.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(cellPrefixCls, "-disabled"), disabled), "".concat(cellPrefixCls, "-hover"), (hoverValue || []).some(function (date) {
return (0, _dateUtil.isSame)(generateConfig, locale, currentDate, date, type);
})), "".concat(cellPrefixCls, "-in-range"), inRange && !rangeStart && !rangeEnd), "".concat(cellPrefixCls, "-range-start"), rangeStart), "".concat(cellPrefixCls, "-range-end"), rangeEnd), "".concat(prefixCls, "-cell-selected"), !hoverRangeValue &&
// WeekPicker use row instead
type !== 'week' && matchValues(currentDate)), getCellClassName(currentDate))),
onClick: function onClick() {
if (!disabled) {
onSelect(currentDate);
}
},
onDoubleClick: function onDoubleClick() {
if (!disabled && onCellDblClick) {
onCellDblClick();
}
},
onMouseEnter: function onMouseEnter() {
if (!disabled) {
onHover === null || onHover === void 0 || onHover(currentDate);
}
},
onMouseLeave: function onMouseLeave() {
if (!disabled) {
onHover === null || onHover === void 0 || onHover(null);
}
}
}, cellRender ? cellRender(currentDate, {
prefixCls: prefixCls,
originNode: inner,
today: now,
type: type,
locale: locale
}) : inner));
};
for (var col = 0; col < colNum; col += 1) {
_loop();
}
rows.push( /*#__PURE__*/React.createElement("tr", {
key: row,
className: rowClassName === null || rowClassName === void 0 ? void 0 : rowClassName(rowStartDate)
}, rowNode));
}
// ============================== Render ==============================
return /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-body")
}, /*#__PURE__*/React.createElement("table", {
className: "".concat(prefixCls, "-content")
}, headerCells && /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, headerCells)), /*#__PURE__*/React.createElement("tbody", null, rows)));
}

View File

@@ -0,0 +1,11 @@
import * as React from 'react';
export interface HeaderProps<DateType extends object> {
offset?: (distance: number, date: DateType) => DateType;
superOffset?: (distance: number, date: DateType) => DateType;
onChange?: (date: DateType) => void;
getStart?: (date: DateType) => DateType;
getEnd?: (date: DateType) => DateType;
children?: React.ReactNode;
}
declare function PanelHeader<DateType extends object>(props: HeaderProps<DateType>): React.JSX.Element;
export default PanelHeader;

141
node_modules/rc-picker/lib/PickerPanel/PanelHeader.js generated vendored Normal file
View File

@@ -0,0 +1,141 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _classnames = _interopRequireDefault(require("classnames"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../utils/dateUtil");
var _context = require("./context");
var HIDDEN_STYLE = {
visibility: 'hidden'
};
function PanelHeader(props) {
var offset = props.offset,
superOffset = props.superOffset,
onChange = props.onChange,
getStart = props.getStart,
getEnd = props.getEnd,
children = props.children;
var _usePanelContext = (0, _context.usePanelContext)(),
prefixCls = _usePanelContext.prefixCls,
_usePanelContext$prev = _usePanelContext.prevIcon,
prevIcon = _usePanelContext$prev === void 0 ? "\u2039" : _usePanelContext$prev,
_usePanelContext$next = _usePanelContext.nextIcon,
nextIcon = _usePanelContext$next === void 0 ? "\u203A" : _usePanelContext$next,
_usePanelContext$supe = _usePanelContext.superPrevIcon,
superPrevIcon = _usePanelContext$supe === void 0 ? "\xAB" : _usePanelContext$supe,
_usePanelContext$supe2 = _usePanelContext.superNextIcon,
superNextIcon = _usePanelContext$supe2 === void 0 ? "\xBB" : _usePanelContext$supe2,
minDate = _usePanelContext.minDate,
maxDate = _usePanelContext.maxDate,
generateConfig = _usePanelContext.generateConfig,
locale = _usePanelContext.locale,
pickerValue = _usePanelContext.pickerValue,
type = _usePanelContext.panelType;
var headerPrefixCls = "".concat(prefixCls, "-header");
var _React$useContext = React.useContext(_context.PickerHackContext),
hidePrev = _React$useContext.hidePrev,
hideNext = _React$useContext.hideNext,
hideHeader = _React$useContext.hideHeader;
// ======================= Limitation =======================
var disabledOffsetPrev = React.useMemo(function () {
if (!minDate || !offset || !getEnd) {
return false;
}
var prevPanelLimitDate = getEnd(offset(-1, pickerValue));
return !(0, _dateUtil.isSameOrAfter)(generateConfig, locale, prevPanelLimitDate, minDate, type);
}, [minDate, offset, pickerValue, getEnd, generateConfig, locale, type]);
var disabledSuperOffsetPrev = React.useMemo(function () {
if (!minDate || !superOffset || !getEnd) {
return false;
}
var prevPanelLimitDate = getEnd(superOffset(-1, pickerValue));
return !(0, _dateUtil.isSameOrAfter)(generateConfig, locale, prevPanelLimitDate, minDate, type);
}, [minDate, superOffset, pickerValue, getEnd, generateConfig, locale, type]);
var disabledOffsetNext = React.useMemo(function () {
if (!maxDate || !offset || !getStart) {
return false;
}
var nextPanelLimitDate = getStart(offset(1, pickerValue));
return !(0, _dateUtil.isSameOrAfter)(generateConfig, locale, maxDate, nextPanelLimitDate, type);
}, [maxDate, offset, pickerValue, getStart, generateConfig, locale, type]);
var disabledSuperOffsetNext = React.useMemo(function () {
if (!maxDate || !superOffset || !getStart) {
return false;
}
var nextPanelLimitDate = getStart(superOffset(1, pickerValue));
return !(0, _dateUtil.isSameOrAfter)(generateConfig, locale, maxDate, nextPanelLimitDate, type);
}, [maxDate, superOffset, pickerValue, getStart, generateConfig, locale, type]);
// ========================= Offset =========================
var onOffset = function onOffset(distance) {
if (offset) {
onChange(offset(distance, pickerValue));
}
};
var onSuperOffset = function onSuperOffset(distance) {
if (superOffset) {
onChange(superOffset(distance, pickerValue));
}
};
// ========================= Render =========================
if (hideHeader) {
return null;
}
var prevBtnCls = "".concat(headerPrefixCls, "-prev-btn");
var nextBtnCls = "".concat(headerPrefixCls, "-next-btn");
var superPrevBtnCls = "".concat(headerPrefixCls, "-super-prev-btn");
var superNextBtnCls = "".concat(headerPrefixCls, "-super-next-btn");
return /*#__PURE__*/React.createElement("div", {
className: headerPrefixCls
}, superOffset && /*#__PURE__*/React.createElement("button", {
type: "button",
"aria-label": locale.previousYear,
onClick: function onClick() {
return onSuperOffset(-1);
},
tabIndex: -1,
className: (0, _classnames.default)(superPrevBtnCls, disabledSuperOffsetPrev && "".concat(superPrevBtnCls, "-disabled")),
disabled: disabledSuperOffsetPrev,
style: hidePrev ? HIDDEN_STYLE : {}
}, superPrevIcon), offset && /*#__PURE__*/React.createElement("button", {
type: "button",
"aria-label": locale.previousMonth,
onClick: function onClick() {
return onOffset(-1);
},
tabIndex: -1,
className: (0, _classnames.default)(prevBtnCls, disabledOffsetPrev && "".concat(prevBtnCls, "-disabled")),
disabled: disabledOffsetPrev,
style: hidePrev ? HIDDEN_STYLE : {}
}, prevIcon), /*#__PURE__*/React.createElement("div", {
className: "".concat(headerPrefixCls, "-view")
}, children), offset && /*#__PURE__*/React.createElement("button", {
type: "button",
"aria-label": locale.nextMonth,
onClick: function onClick() {
return onOffset(1);
},
tabIndex: -1,
className: (0, _classnames.default)(nextBtnCls, disabledOffsetNext && "".concat(nextBtnCls, "-disabled")),
disabled: disabledOffsetNext,
style: hideNext ? HIDDEN_STYLE : {}
}, nextIcon), superOffset && /*#__PURE__*/React.createElement("button", {
type: "button",
"aria-label": locale.nextYear,
onClick: function onClick() {
return onSuperOffset(1);
},
tabIndex: -1,
className: (0, _classnames.default)(superNextBtnCls, disabledSuperOffsetNext && "".concat(superNextBtnCls, "-disabled")),
disabled: disabledSuperOffsetNext,
style: hideNext ? HIDDEN_STYLE : {}
}, superNextIcon));
}
var _default = exports.default = PanelHeader;

View File

@@ -0,0 +1,3 @@
import * as React from 'react';
import type { SharedPanelProps } from '../../interface';
export default function QuarterPanel<DateType extends object = any>(props: SharedPanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,92 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = QuarterPanel;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../utils/dateUtil");
var _context = require("../context");
var _PanelBody = _interopRequireDefault(require("../PanelBody"));
var _PanelHeader = _interopRequireDefault(require("../PanelHeader"));
function QuarterPanel(props) {
var prefixCls = props.prefixCls,
locale = props.locale,
generateConfig = props.generateConfig,
pickerValue = props.pickerValue,
onPickerValueChange = props.onPickerValueChange,
onModeChange = props.onModeChange;
var panelPrefixCls = "".concat(prefixCls, "-quarter-panel");
// ========================== Base ==========================
var _useInfo = (0, _context.useInfo)(props, 'quarter'),
_useInfo2 = (0, _slicedToArray2.default)(_useInfo, 1),
info = _useInfo2[0];
var baseDate = generateConfig.setMonth(pickerValue, 0);
// ========================= Cells ==========================
var getCellDate = function getCellDate(date, offset) {
return generateConfig.addMonth(date, offset * 3);
};
var getCellText = function getCellText(date) {
return (0, _dateUtil.formatValue)(date, {
locale: locale,
format: locale.cellQuarterFormat,
generateConfig: generateConfig
});
};
var getCellClassName = function getCellClassName() {
return (0, _defineProperty2.default)({}, "".concat(prefixCls, "-cell-in-view"), true);
};
// ========================= Header =========================
var yearNode = /*#__PURE__*/React.createElement("button", {
type: "button",
key: "year",
"aria-label": locale.yearSelect,
onClick: function onClick() {
onModeChange('year');
},
tabIndex: -1,
className: "".concat(prefixCls, "-year-btn")
}, (0, _dateUtil.formatValue)(pickerValue, {
locale: locale,
format: locale.yearFormat,
generateConfig: generateConfig
}));
// ========================= Render =========================
return /*#__PURE__*/React.createElement(_context.PanelContext.Provider, {
value: info
}, /*#__PURE__*/React.createElement("div", {
className: panelPrefixCls
}, /*#__PURE__*/React.createElement(_PanelHeader.default, {
superOffset: function superOffset(distance) {
return generateConfig.addYear(pickerValue, distance);
},
onChange: onPickerValueChange
// Limitation
,
getStart: function getStart(date) {
return generateConfig.setMonth(date, 0);
},
getEnd: function getEnd(date) {
return generateConfig.setMonth(date, 11);
}
}, yearNode), /*#__PURE__*/React.createElement(_PanelBody.default, (0, _extends2.default)({}, props, {
titleFormat: locale.fieldQuarterFormat,
colNum: 4,
rowNum: 1,
baseDate: baseDate
// Body
,
getCellDate: getCellDate,
getCellText: getCellText,
getCellClassName: getCellClassName
}))));
}

View File

@@ -0,0 +1,17 @@
import * as React from 'react';
export type Unit<ValueType = number | string> = {
label: React.ReactText;
value: ValueType;
disabled?: boolean;
};
export interface TimeUnitColumnProps {
units: Unit[];
value: number | string;
optionalValue?: number | string;
type: 'hour' | 'minute' | 'second' | 'millisecond' | 'meridiem';
onChange: (value: number | string) => void;
onHover: (value: number | string) => void;
onDblClick?: VoidFunction;
changeOnScroll?: boolean;
}
export default function TimeColumn<DateType extends object>(props: TimeUnitColumnProps): React.JSX.Element;

View File

@@ -0,0 +1,146 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = TimeColumn;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _classnames = _interopRequireDefault(require("classnames"));
var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
var React = _interopRequireWildcard(require("react"));
var _context = require("../../context");
var _useScrollTo3 = _interopRequireDefault(require("./useScrollTo"));
var SCROLL_DELAY = 300;
// Not use JSON.stringify to avoid dead loop
function flattenUnits(units) {
return units.map(function (_ref) {
var value = _ref.value,
label = _ref.label,
disabled = _ref.disabled;
return [value, label, disabled].join(',');
}).join(';');
}
function TimeColumn(props) {
var units = props.units,
value = props.value,
optionalValue = props.optionalValue,
type = props.type,
onChange = props.onChange,
onHover = props.onHover,
onDblClick = props.onDblClick,
changeOnScroll = props.changeOnScroll;
var _usePanelContext = (0, _context.usePanelContext)(),
prefixCls = _usePanelContext.prefixCls,
cellRender = _usePanelContext.cellRender,
now = _usePanelContext.now,
locale = _usePanelContext.locale;
var panelPrefixCls = "".concat(prefixCls, "-time-panel");
var cellPrefixCls = "".concat(prefixCls, "-time-panel-cell");
// ========================== Refs ==========================
var ulRef = React.useRef(null);
// ========================= Scroll =========================
var checkDelayRef = React.useRef();
var clearDelayCheck = function clearDelayCheck() {
clearTimeout(checkDelayRef.current);
};
// ========================== Sync ==========================
var _useScrollTo = (0, _useScrollTo3.default)(ulRef, value !== null && value !== void 0 ? value : optionalValue),
_useScrollTo2 = (0, _slicedToArray2.default)(_useScrollTo, 3),
syncScroll = _useScrollTo2[0],
stopScroll = _useScrollTo2[1],
isScrolling = _useScrollTo2[2];
// Effect sync value scroll
(0, _useLayoutEffect.default)(function () {
syncScroll();
clearDelayCheck();
return function () {
stopScroll();
clearDelayCheck();
};
}, [value, optionalValue, flattenUnits(units)]);
// ========================= Change =========================
// Scroll event if sync onScroll
var onInternalScroll = function onInternalScroll(event) {
clearDelayCheck();
var target = event.target;
if (!isScrolling() && changeOnScroll) {
checkDelayRef.current = setTimeout(function () {
var ul = ulRef.current;
var firstLiTop = ul.querySelector("li").offsetTop;
var liList = Array.from(ul.querySelectorAll("li"));
var liTopList = liList.map(function (li) {
return li.offsetTop - firstLiTop;
});
var liDistList = liTopList.map(function (top, index) {
if (units[index].disabled) {
return Number.MAX_SAFE_INTEGER;
}
return Math.abs(top - target.scrollTop);
});
// Find min distance index
var minDist = Math.min.apply(Math, (0, _toConsumableArray2.default)(liDistList));
var minDistIndex = liDistList.findIndex(function (dist) {
return dist === minDist;
});
var targetUnit = units[minDistIndex];
if (targetUnit && !targetUnit.disabled) {
onChange(targetUnit.value);
}
}, SCROLL_DELAY);
}
};
// ========================= Render =========================
var columnPrefixCls = "".concat(panelPrefixCls, "-column");
return /*#__PURE__*/React.createElement("ul", {
className: columnPrefixCls,
ref: ulRef,
"data-type": type,
onScroll: onInternalScroll
}, units.map(function (_ref2) {
var label = _ref2.label,
unitValue = _ref2.value,
disabled = _ref2.disabled;
var inner = /*#__PURE__*/React.createElement("div", {
className: "".concat(cellPrefixCls, "-inner")
}, label);
return /*#__PURE__*/React.createElement("li", {
key: unitValue,
className: (0, _classnames.default)(cellPrefixCls, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(cellPrefixCls, "-selected"), value === unitValue), "".concat(cellPrefixCls, "-disabled"), disabled)),
onClick: function onClick() {
if (!disabled) {
onChange(unitValue);
}
},
onDoubleClick: function onDoubleClick() {
if (!disabled && onDblClick) {
onDblClick();
}
},
onMouseEnter: function onMouseEnter() {
onHover(unitValue);
},
onMouseLeave: function onMouseLeave() {
onHover(null);
},
"data-value": unitValue
}, cellRender ? cellRender(unitValue, {
prefixCls: prefixCls,
originNode: inner,
today: now,
type: 'time',
subType: type,
locale: locale
}) : inner);
}));
}

View File

@@ -0,0 +1,4 @@
import * as React from 'react';
import type { SharedPanelProps, SharedTimeProps } from '../../../interface';
export type TimePanelBodyProps<DateType extends object = any> = SharedPanelProps<DateType>;
export default function TimePanelBody<DateType extends object = any>(props: SharedTimeProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,286 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = TimePanelBody;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _useTimeInfo3 = _interopRequireDefault(require("../../../hooks/useTimeInfo"));
var _dateUtil = require("../../../utils/dateUtil");
var _context = require("../../context");
var _TimeColumn = _interopRequireDefault(require("./TimeColumn"));
function isAM(hour) {
return hour < 12;
}
function TimePanelBody(props) {
var showHour = props.showHour,
showMinute = props.showMinute,
showSecond = props.showSecond,
showMillisecond = props.showMillisecond,
showMeridiem = props.use12Hours,
changeOnScroll = props.changeOnScroll;
var _usePanelContext = (0, _context.usePanelContext)(),
prefixCls = _usePanelContext.prefixCls,
values = _usePanelContext.values,
generateConfig = _usePanelContext.generateConfig,
locale = _usePanelContext.locale,
onSelect = _usePanelContext.onSelect,
_usePanelContext$onHo = _usePanelContext.onHover,
onHover = _usePanelContext$onHo === void 0 ? function () {} : _usePanelContext$onHo,
pickerValue = _usePanelContext.pickerValue;
var value = (values === null || values === void 0 ? void 0 : values[0]) || null;
var _React$useContext = React.useContext(_context.PickerHackContext),
onCellDblClick = _React$useContext.onCellDblClick;
// ========================== Info ==========================
var _useTimeInfo = (0, _useTimeInfo3.default)(generateConfig, props, value),
_useTimeInfo2 = (0, _slicedToArray2.default)(_useTimeInfo, 5),
getValidTime = _useTimeInfo2[0],
rowHourUnits = _useTimeInfo2[1],
getMinuteUnits = _useTimeInfo2[2],
getSecondUnits = _useTimeInfo2[3],
getMillisecondUnits = _useTimeInfo2[4];
// ========================= Value ==========================
// PickerValue will tell which one to align on the top
var getUnitValue = function getUnitValue(func) {
var valueUnitVal = value && generateConfig[func](value);
var pickerUnitValue = pickerValue && generateConfig[func](pickerValue);
return [valueUnitVal, pickerUnitValue];
};
var _getUnitValue = getUnitValue('getHour'),
_getUnitValue2 = (0, _slicedToArray2.default)(_getUnitValue, 2),
hour = _getUnitValue2[0],
pickerHour = _getUnitValue2[1];
var _getUnitValue3 = getUnitValue('getMinute'),
_getUnitValue4 = (0, _slicedToArray2.default)(_getUnitValue3, 2),
minute = _getUnitValue4[0],
pickerMinute = _getUnitValue4[1];
var _getUnitValue5 = getUnitValue('getSecond'),
_getUnitValue6 = (0, _slicedToArray2.default)(_getUnitValue5, 2),
second = _getUnitValue6[0],
pickerSecond = _getUnitValue6[1];
var _getUnitValue7 = getUnitValue('getMillisecond'),
_getUnitValue8 = (0, _slicedToArray2.default)(_getUnitValue7, 2),
millisecond = _getUnitValue8[0],
pickerMillisecond = _getUnitValue8[1];
var meridiem = hour === null ? null : isAM(hour) ? 'am' : 'pm';
// ========================= Column =========================
// Hours
var hourUnits = React.useMemo(function () {
if (!showMeridiem) {
return rowHourUnits;
}
return isAM(hour) ? rowHourUnits.filter(function (h) {
return isAM(h.value);
}) : rowHourUnits.filter(function (h) {
return !isAM(h.value);
});
}, [hour, rowHourUnits, showMeridiem]);
// >>> Pick Fallback
var getEnabled = function getEnabled(units, val) {
var _enabledUnits$;
var enabledUnits = units.filter(function (unit) {
return !unit.disabled;
});
return val !== null && val !== void 0 ? val : // Fallback to enabled value
enabledUnits === null || enabledUnits === void 0 || (_enabledUnits$ = enabledUnits[0]) === null || _enabledUnits$ === void 0 ? void 0 : _enabledUnits$.value;
};
// >>> Minutes
var validHour = getEnabled(rowHourUnits, hour);
var minuteUnits = React.useMemo(function () {
return getMinuteUnits(validHour);
}, [getMinuteUnits, validHour]);
// >>> Seconds
var validMinute = getEnabled(minuteUnits, minute);
var secondUnits = React.useMemo(function () {
return getSecondUnits(validHour, validMinute);
}, [getSecondUnits, validHour, validMinute]);
// >>> Milliseconds
var validSecond = getEnabled(secondUnits, second);
var millisecondUnits = React.useMemo(function () {
return getMillisecondUnits(validHour, validMinute, validSecond);
}, [getMillisecondUnits, validHour, validMinute, validSecond]);
var validMillisecond = getEnabled(millisecondUnits, millisecond);
// Meridiem
var meridiemUnits = React.useMemo(function () {
if (!showMeridiem) {
return [];
}
var base = generateConfig.getNow();
var amDate = generateConfig.setHour(base, 6);
var pmDate = generateConfig.setHour(base, 18);
var formatMeridiem = function formatMeridiem(date, defaultLabel) {
var cellMeridiemFormat = locale.cellMeridiemFormat;
return cellMeridiemFormat ? (0, _dateUtil.formatValue)(date, {
generateConfig: generateConfig,
locale: locale,
format: cellMeridiemFormat
}) : defaultLabel;
};
return [{
label: formatMeridiem(amDate, 'AM'),
value: 'am',
disabled: rowHourUnits.every(function (h) {
return h.disabled || !isAM(h.value);
})
}, {
label: formatMeridiem(pmDate, 'PM'),
value: 'pm',
disabled: rowHourUnits.every(function (h) {
return h.disabled || isAM(h.value);
})
}];
}, [rowHourUnits, showMeridiem, generateConfig, locale]);
// ========================= Change =========================
/**
* Check if time is validate or will match to validate one
*/
var triggerChange = function triggerChange(nextDate) {
var validateDate = getValidTime(nextDate);
onSelect(validateDate);
};
// ========================= Column =========================
// Create a template date for the trigger change event
var triggerDateTmpl = React.useMemo(function () {
var tmpl = value || pickerValue || generateConfig.getNow();
var isNotNull = function isNotNull(num) {
return num !== null && num !== undefined;
};
if (isNotNull(hour)) {
tmpl = generateConfig.setHour(tmpl, hour);
tmpl = generateConfig.setMinute(tmpl, minute);
tmpl = generateConfig.setSecond(tmpl, second);
tmpl = generateConfig.setMillisecond(tmpl, millisecond);
} else if (isNotNull(pickerHour)) {
tmpl = generateConfig.setHour(tmpl, pickerHour);
tmpl = generateConfig.setMinute(tmpl, pickerMinute);
tmpl = generateConfig.setSecond(tmpl, pickerSecond);
tmpl = generateConfig.setMillisecond(tmpl, pickerMillisecond);
} else if (isNotNull(validHour)) {
tmpl = generateConfig.setHour(tmpl, validHour);
tmpl = generateConfig.setMinute(tmpl, validMinute);
tmpl = generateConfig.setSecond(tmpl, validSecond);
tmpl = generateConfig.setMillisecond(tmpl, validMillisecond);
}
return tmpl;
}, [value, pickerValue, hour, minute, second, millisecond, validHour, validMinute, validSecond, validMillisecond, pickerHour, pickerMinute, pickerSecond, pickerMillisecond, generateConfig]);
// ===================== Columns Change =====================
var fillColumnValue = function fillColumnValue(val, func) {
if (val === null) {
return null;
}
return generateConfig[func](triggerDateTmpl, val);
};
var getNextHourTime = function getNextHourTime(val) {
return fillColumnValue(val, 'setHour');
};
var getNextMinuteTime = function getNextMinuteTime(val) {
return fillColumnValue(val, 'setMinute');
};
var getNextSecondTime = function getNextSecondTime(val) {
return fillColumnValue(val, 'setSecond');
};
var getNextMillisecondTime = function getNextMillisecondTime(val) {
return fillColumnValue(val, 'setMillisecond');
};
var getMeridiemTime = function getMeridiemTime(val) {
if (val === null) {
return null;
}
if (val === 'am' && !isAM(hour)) {
return generateConfig.setHour(triggerDateTmpl, hour - 12);
} else if (val === 'pm' && isAM(hour)) {
return generateConfig.setHour(triggerDateTmpl, hour + 12);
}
return triggerDateTmpl;
};
var onHourChange = function onHourChange(val) {
triggerChange(getNextHourTime(val));
};
var onMinuteChange = function onMinuteChange(val) {
triggerChange(getNextMinuteTime(val));
};
var onSecondChange = function onSecondChange(val) {
triggerChange(getNextSecondTime(val));
};
var onMillisecondChange = function onMillisecondChange(val) {
triggerChange(getNextMillisecondTime(val));
};
var onMeridiemChange = function onMeridiemChange(val) {
triggerChange(getMeridiemTime(val));
};
// ====================== Column Hover ======================
var onHourHover = function onHourHover(val) {
onHover(getNextHourTime(val));
};
var onMinuteHover = function onMinuteHover(val) {
onHover(getNextMinuteTime(val));
};
var onSecondHover = function onSecondHover(val) {
onHover(getNextSecondTime(val));
};
var onMillisecondHover = function onMillisecondHover(val) {
onHover(getNextMillisecondTime(val));
};
var onMeridiemHover = function onMeridiemHover(val) {
onHover(getMeridiemTime(val));
};
// ========================= Render =========================
var sharedColumnProps = {
onDblClick: onCellDblClick,
changeOnScroll: changeOnScroll
};
return /*#__PURE__*/React.createElement("div", {
className: "".concat(prefixCls, "-content")
}, showHour && /*#__PURE__*/React.createElement(_TimeColumn.default, (0, _extends2.default)({
units: hourUnits,
value: hour,
optionalValue: pickerHour,
type: "hour",
onChange: onHourChange,
onHover: onHourHover
}, sharedColumnProps)), showMinute && /*#__PURE__*/React.createElement(_TimeColumn.default, (0, _extends2.default)({
units: minuteUnits,
value: minute,
optionalValue: pickerMinute,
type: "minute",
onChange: onMinuteChange,
onHover: onMinuteHover
}, sharedColumnProps)), showSecond && /*#__PURE__*/React.createElement(_TimeColumn.default, (0, _extends2.default)({
units: secondUnits,
value: second,
optionalValue: pickerSecond,
type: "second",
onChange: onSecondChange,
onHover: onSecondHover
}, sharedColumnProps)), showMillisecond && /*#__PURE__*/React.createElement(_TimeColumn.default, (0, _extends2.default)({
units: millisecondUnits,
value: millisecond,
optionalValue: pickerMillisecond,
type: "millisecond",
onChange: onMillisecondChange,
onHover: onMillisecondHover
}, sharedColumnProps)), showMeridiem && /*#__PURE__*/React.createElement(_TimeColumn.default, (0, _extends2.default)({
units: meridiemUnits,
value: meridiem,
type: "meridiem",
onChange: onMeridiemChange,
onHover: onMeridiemHover
}, sharedColumnProps)));
}

View File

@@ -0,0 +1,2 @@
import * as React from 'react';
export default function useScrollTo(ulRef: React.RefObject<HTMLUListElement>, value: number | string): [syncScroll: VoidFunction, clearScroll: VoidFunction, isScrolling: () => boolean];

View File

@@ -0,0 +1,80 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useScrollTo;
var _rcUtil = require("rc-util");
var _raf = _interopRequireDefault(require("rc-util/lib/raf"));
var _isVisible = _interopRequireDefault(require("rc-util/lib/Dom/isVisible"));
var React = _interopRequireWildcard(require("react"));
var SPEED_PTG = 1 / 3;
function useScrollTo(ulRef, value) {
// ========================= Scroll =========================
var scrollingRef = React.useRef(false);
var scrollRafRef = React.useRef(null);
var scrollDistRef = React.useRef(null);
var isScrolling = function isScrolling() {
return scrollingRef.current;
};
var stopScroll = function stopScroll() {
_raf.default.cancel(scrollRafRef.current);
scrollingRef.current = false;
};
var scrollRafTimesRef = React.useRef();
var startScroll = function startScroll() {
var ul = ulRef.current;
scrollDistRef.current = null;
scrollRafTimesRef.current = 0;
if (ul) {
var targetLi = ul.querySelector("[data-value=\"".concat(value, "\"]"));
var firstLi = ul.querySelector("li");
var doScroll = function doScroll() {
stopScroll();
scrollingRef.current = true;
scrollRafTimesRef.current += 1;
var currentTop = ul.scrollTop;
var firstLiTop = firstLi.offsetTop;
var targetLiTop = targetLi.offsetTop;
var targetTop = targetLiTop - firstLiTop;
// Wait for element exist. 5 frames is enough
if (targetLiTop === 0 && targetLi !== firstLi || !(0, _isVisible.default)(ul)) {
if (scrollRafTimesRef.current <= 5) {
scrollRafRef.current = (0, _raf.default)(doScroll);
}
return;
}
var nextTop = currentTop + (targetTop - currentTop) * SPEED_PTG;
var dist = Math.abs(targetTop - nextTop);
// Break if dist get larger, which means user is scrolling
if (scrollDistRef.current !== null && scrollDistRef.current < dist) {
stopScroll();
return;
}
scrollDistRef.current = dist;
// Stop when dist is less than 1
if (dist <= 1) {
ul.scrollTop = targetTop;
stopScroll();
return;
}
// IE not support `scrollTo`
ul.scrollTop = nextTop;
scrollRafRef.current = (0, _raf.default)(doScroll);
};
if (targetLi && firstLi) {
doScroll();
}
}
};
// ======================== Trigger =========================
var syncScroll = (0, _rcUtil.useEvent)(startScroll);
return [syncScroll, stopScroll, isScrolling];
}

View File

@@ -0,0 +1,3 @@
import type { GenerateConfig } from '../../../generate';
import type { Unit } from './TimeColumn';
export declare function findValidateTime<DateType>(date: DateType, getHourUnits: () => Unit<number>[], getMinuteUnits: (hour: number) => Unit<number>[], getSecondUnits: (hour: number, minute: number) => Unit<number>[], getMillisecondUnits: (hour: number, minute: number, second: number) => Unit<number>[], generateConfig: GenerateConfig<DateType>): DateType;

View File

@@ -0,0 +1,45 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.findValidateTime = findValidateTime;
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
function findValidateTime(date, getHourUnits, getMinuteUnits, getSecondUnits, getMillisecondUnits, generateConfig) {
var nextDate = date;
function alignValidate(getUnitValue, setUnitValue, units) {
var nextValue = generateConfig[getUnitValue](nextDate);
var nextUnit = units.find(function (unit) {
return unit.value === nextValue;
});
if (!nextUnit || nextUnit.disabled) {
// Find most closest unit
var validateUnits = units.filter(function (unit) {
return !unit.disabled;
});
var reverseEnabledUnits = (0, _toConsumableArray2.default)(validateUnits).reverse();
var validateUnit = reverseEnabledUnits.find(function (unit) {
return unit.value <= nextValue;
}) || validateUnits[0];
if (validateUnit) {
nextValue = validateUnit.value;
nextDate = generateConfig[setUnitValue](nextDate, nextValue);
}
}
return nextValue;
}
// Find validate hour
var nextHour = alignValidate('getHour', 'setHour', getHourUnits());
// Find validate minute
var nextMinute = alignValidate('getMinute', 'setMinute', getMinuteUnits(nextHour));
// Find validate second
var nextSecond = alignValidate('getSecond', 'setSecond', getSecondUnits(nextHour, nextMinute));
// Find validate millisecond
alignValidate('getMillisecond', 'setMillisecond', getMillisecondUnits(nextHour, nextMinute, nextSecond));
return nextDate;
}

View File

@@ -0,0 +1,4 @@
import * as React from 'react';
import type { SharedPanelProps } from '../../interface';
export type TimePanelProps<DateType extends object> = SharedPanelProps<DateType>;
export default function TimePanel<DateType extends object = any>(props: TimePanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,41 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = TimePanel;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _classnames = _interopRequireDefault(require("classnames"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../utils/dateUtil");
var _context = require("../context");
var _PanelHeader = _interopRequireDefault(require("../PanelHeader"));
var _TimePanelBody = _interopRequireDefault(require("./TimePanelBody"));
function TimePanel(props) {
var prefixCls = props.prefixCls,
value = props.value,
locale = props.locale,
generateConfig = props.generateConfig,
showTime = props.showTime;
var _ref = showTime || {},
format = _ref.format;
var panelPrefixCls = "".concat(prefixCls, "-time-panel");
// ========================== Base ==========================
var _useInfo = (0, _context.useInfo)(props, 'time'),
_useInfo2 = (0, _slicedToArray2.default)(_useInfo, 1),
info = _useInfo2[0];
// ========================= Render =========================
return /*#__PURE__*/React.createElement(_context.PanelContext.Provider, {
value: info
}, /*#__PURE__*/React.createElement("div", {
className: (0, _classnames.default)(panelPrefixCls)
}, /*#__PURE__*/React.createElement(_PanelHeader.default, null, value ? (0, _dateUtil.formatValue)(value, {
locale: locale,
format: format,
generateConfig: generateConfig
}) : "\xA0"), /*#__PURE__*/React.createElement(_TimePanelBody.default, showTime)));
}

View File

@@ -0,0 +1,3 @@
import * as React from 'react';
import type { SharedPanelProps } from '../../interface';
export default function WeekPanel<DateType extends object = any>(props: SharedPanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,55 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = WeekPanel;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _classnames = _interopRequireDefault(require("classnames"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../utils/dateUtil");
var _DatePanel = _interopRequireDefault(require("../DatePanel"));
function WeekPanel(props) {
var prefixCls = props.prefixCls,
generateConfig = props.generateConfig,
locale = props.locale,
value = props.value,
hoverValue = props.hoverValue,
hoverRangeValue = props.hoverRangeValue;
// =============================== Row ================================
var localeName = locale.locale;
var rowPrefixCls = "".concat(prefixCls, "-week-panel-row");
var rowClassName = function rowClassName(currentDate) {
var rangeCls = {};
if (hoverRangeValue) {
var _hoverRangeValue = (0, _slicedToArray2.default)(hoverRangeValue, 2),
rangeStart = _hoverRangeValue[0],
rangeEnd = _hoverRangeValue[1];
var isRangeStart = (0, _dateUtil.isSameWeek)(generateConfig, localeName, rangeStart, currentDate);
var isRangeEnd = (0, _dateUtil.isSameWeek)(generateConfig, localeName, rangeEnd, currentDate);
rangeCls["".concat(rowPrefixCls, "-range-start")] = isRangeStart;
rangeCls["".concat(rowPrefixCls, "-range-end")] = isRangeEnd;
rangeCls["".concat(rowPrefixCls, "-range-hover")] = !isRangeStart && !isRangeEnd && (0, _dateUtil.isInRange)(generateConfig, rangeStart, rangeEnd, currentDate);
}
if (hoverValue) {
rangeCls["".concat(rowPrefixCls, "-hover")] = hoverValue.some(function (date) {
return (0, _dateUtil.isSameWeek)(generateConfig, localeName, currentDate, date);
});
}
return (0, _classnames.default)(rowPrefixCls, (0, _defineProperty2.default)({}, "".concat(rowPrefixCls, "-selected"), !hoverRangeValue && (0, _dateUtil.isSameWeek)(generateConfig, localeName, value, currentDate)),
// Patch for hover range
rangeCls);
};
// ============================== Render ==============================
return /*#__PURE__*/React.createElement(_DatePanel.default, (0, _extends2.default)({}, props, {
mode: "week",
panelName: "week",
rowClassName: rowClassName
}));
}

View File

@@ -0,0 +1,3 @@
import * as React from 'react';
import type { SharedPanelProps } from '../../interface';
export default function YearPanel<DateType extends object = any>(props: SharedPanelProps<DateType>): React.JSX.Element;

View File

@@ -0,0 +1,116 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = YearPanel;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var React = _interopRequireWildcard(require("react"));
var _dateUtil = require("../../utils/dateUtil");
var _context = require("../context");
var _PanelBody = _interopRequireDefault(require("../PanelBody"));
var _PanelHeader = _interopRequireDefault(require("../PanelHeader"));
function YearPanel(props) {
var prefixCls = props.prefixCls,
locale = props.locale,
generateConfig = props.generateConfig,
pickerValue = props.pickerValue,
disabledDate = props.disabledDate,
onPickerValueChange = props.onPickerValueChange,
onModeChange = props.onModeChange;
var panelPrefixCls = "".concat(prefixCls, "-year-panel");
// ========================== Base ==========================
var _useInfo = (0, _context.useInfo)(props, 'year'),
_useInfo2 = (0, _slicedToArray2.default)(_useInfo, 1),
info = _useInfo2[0];
var getStartYear = function getStartYear(date) {
var startYear = Math.floor(generateConfig.getYear(date) / 10) * 10;
return generateConfig.setYear(date, startYear);
};
var getEndYear = function getEndYear(date) {
var startYear = getStartYear(date);
return generateConfig.addYear(startYear, 9);
};
var startYearDate = getStartYear(pickerValue);
var endYearDate = getEndYear(pickerValue);
var baseDate = generateConfig.addYear(startYearDate, -1);
// ========================= Cells ==========================
var getCellDate = function getCellDate(date, offset) {
return generateConfig.addYear(date, offset);
};
var getCellText = function getCellText(date) {
return (0, _dateUtil.formatValue)(date, {
locale: locale,
format: locale.cellYearFormat,
generateConfig: generateConfig
});
};
var getCellClassName = function getCellClassName(date) {
return (0, _defineProperty2.default)({}, "".concat(prefixCls, "-cell-in-view"), (0, _dateUtil.isSameYear)(generateConfig, date, startYearDate) || (0, _dateUtil.isSameYear)(generateConfig, date, endYearDate) || (0, _dateUtil.isInRange)(generateConfig, startYearDate, endYearDate, date));
};
// ======================== Disabled ========================
var mergedDisabledDate = disabledDate ? function (currentDate, disabledInfo) {
// Start
var startMonth = generateConfig.setMonth(currentDate, 0);
var startDate = generateConfig.setDate(startMonth, 1);
// End
var endMonth = generateConfig.addYear(startDate, 1);
var endDate = generateConfig.addDate(endMonth, -1);
return disabledDate(startDate, disabledInfo) && disabledDate(endDate, disabledInfo);
} : null;
// ========================= Header =========================
var yearNode = /*#__PURE__*/React.createElement("button", {
type: "button",
key: "decade",
"aria-label": locale.decadeSelect,
onClick: function onClick() {
onModeChange('decade');
},
tabIndex: -1,
className: "".concat(prefixCls, "-decade-btn")
}, (0, _dateUtil.formatValue)(startYearDate, {
locale: locale,
format: locale.yearFormat,
generateConfig: generateConfig
}), "-", (0, _dateUtil.formatValue)(endYearDate, {
locale: locale,
format: locale.yearFormat,
generateConfig: generateConfig
}));
// ========================= Render =========================
return /*#__PURE__*/React.createElement(_context.PanelContext.Provider, {
value: info
}, /*#__PURE__*/React.createElement("div", {
className: panelPrefixCls
}, /*#__PURE__*/React.createElement(_PanelHeader.default, {
superOffset: function superOffset(distance) {
return generateConfig.addYear(pickerValue, distance * 10);
},
onChange: onPickerValueChange
// Limitation
,
getStart: getStartYear,
getEnd: getEndYear
}, yearNode), /*#__PURE__*/React.createElement(_PanelBody.default, (0, _extends2.default)({}, props, {
disabledDate: mergedDisabledDate,
titleFormat: locale.fieldYearFormat,
colNum: 3,
rowNum: 4,
baseDate: baseDate
// Body
,
getCellDate: getCellDate,
getCellText: getCellText,
getCellClassName: getCellClassName
}))));
}

24
node_modules/rc-picker/lib/PickerPanel/context.d.ts generated vendored Normal file
View File

@@ -0,0 +1,24 @@
import * as React from 'react';
import type { PanelMode, SharedPanelProps } from '../interface';
export interface PanelContextProps<DateType extends object = any> extends Pick<SharedPanelProps<DateType>, 'prefixCls' | 'cellRender' | 'generateConfig' | 'locale' | 'onSelect' | 'hoverValue' | 'hoverRangeValue' | 'onHover' | 'values' | 'pickerValue' | 'disabledDate' | 'minDate' | 'maxDate' | 'prevIcon' | 'nextIcon' | 'superPrevIcon' | 'superNextIcon'> {
/** Tell current panel type */
panelType: PanelMode;
now: DateType;
}
/** Used for each single Panel. e.g. DatePanel */
export declare const PanelContext: React.Context<PanelContextProps<any>>;
export declare function usePanelContext<DateType extends object = any>(): PanelContextProps<DateType>;
/**
* Get shared props for the SharedPanelProps interface.
*/
export declare function useInfo<DateType extends object = any>(props: SharedPanelProps<DateType>, panelType: PanelMode): [sharedProps: PanelContextProps<DateType>, now: DateType];
export interface PickerHackContextProps {
hidePrev?: boolean;
hideNext?: boolean;
hideHeader?: boolean;
onCellDblClick?: () => void;
}
/**
* Internal usage for RangePicker to not to show the operation arrow
*/
export declare const PickerHackContext: React.Context<PickerHackContextProps>;

76
node_modules/rc-picker/lib/PickerPanel/context.js generated vendored Normal file
View File

@@ -0,0 +1,76 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.PickerHackContext = exports.PanelContext = void 0;
exports.useInfo = useInfo;
exports.usePanelContext = usePanelContext;
var React = _interopRequireWildcard(require("react"));
/** Used for each single Panel. e.g. DatePanel */
var PanelContext = exports.PanelContext = /*#__PURE__*/React.createContext(null);
function usePanelContext() {
return React.useContext(PanelContext);
}
/**
* Get shared props for the SharedPanelProps interface.
*/
function useInfo(props, panelType) {
var prefixCls = props.prefixCls,
generateConfig = props.generateConfig,
locale = props.locale,
disabledDate = props.disabledDate,
minDate = props.minDate,
maxDate = props.maxDate,
cellRender = props.cellRender,
hoverValue = props.hoverValue,
hoverRangeValue = props.hoverRangeValue,
onHover = props.onHover,
values = props.values,
pickerValue = props.pickerValue,
onSelect = props.onSelect,
prevIcon = props.prevIcon,
nextIcon = props.nextIcon,
superPrevIcon = props.superPrevIcon,
superNextIcon = props.superNextIcon;
// ========================= MISC =========================
var now = generateConfig.getNow();
// ========================= Info =========================
var info = {
now: now,
values: values,
pickerValue: pickerValue,
prefixCls: prefixCls,
disabledDate: disabledDate,
minDate: minDate,
maxDate: maxDate,
cellRender: cellRender,
hoverValue: hoverValue,
hoverRangeValue: hoverRangeValue,
onHover: onHover,
locale: locale,
generateConfig: generateConfig,
onSelect: onSelect,
panelType: panelType,
// Icons
prevIcon: prevIcon,
nextIcon: nextIcon,
superPrevIcon: superPrevIcon,
superNextIcon: superNextIcon
};
return [info, now];
}
// ============================== Internal ==============================
/**
* Internal usage for RangePicker to not to show the operation arrow
*/
var PickerHackContext = exports.PickerHackContext = /*#__PURE__*/React.createContext({});
if (process.env.NODE_ENV !== 'production') {
PickerHackContext.displayName = 'PickerHackContext';
}

60
node_modules/rc-picker/lib/PickerPanel/index.d.ts generated vendored Normal file
View File

@@ -0,0 +1,60 @@
import * as React from 'react';
import type { CellRender, Components, Locale, OnPanelChange, PanelMode, PickerMode, SharedPanelProps, SharedTimeProps } from '../interface';
export interface PickerPanelRef {
nativeElement: HTMLDivElement;
}
export interface BasePickerPanelProps<DateType extends object = any> extends Pick<SharedPanelProps<DateType>, 'locale' | 'generateConfig' | 'disabledDate' | 'minDate' | 'maxDate' | 'prevIcon' | 'nextIcon' | 'superPrevIcon' | 'superNextIcon'>, SharedTimeProps<DateType>, Pick<React.HTMLAttributes<HTMLDivElement>, 'tabIndex'> {
prefixCls?: string;
direction?: 'ltr' | 'rtl';
onSelect?: (date: DateType) => void;
defaultPickerValue?: DateType | null;
pickerValue?: DateType | null;
onPickerValueChange?: (date: DateType) => void;
mode?: PanelMode;
/**
* Compatible with origin API.
* Not mean the PickerPanel `onChange` event.
*/
onPanelChange?: OnPanelChange<DateType>;
picker?: PickerMode;
showTime?: true | SharedTimeProps<DateType>;
/**
* Only worked in `date` mode. Show the current week
*/
showWeek?: boolean;
cellRender?: CellRender<DateType>;
/** @deprecated use cellRender instead of dateRender */
dateRender?: (currentDate: DateType, today: DateType) => React.ReactNode;
/** @deprecated use cellRender instead of monthCellRender */
monthCellRender?: (currentDate: DateType, locale: Locale) => React.ReactNode;
/** @private Used for Picker passing */
hoverValue?: DateType[];
/** @private Used for Picker passing */
hoverRangeValue?: [start: DateType, end: DateType];
/** @private Used for Picker passing */
onHover?: (date: DateType) => void;
components?: Components;
/** @private This is internal usage. Do not use in your production env */
hideHeader?: boolean;
}
export interface SinglePickerPanelProps<DateType extends object = any> extends BasePickerPanelProps<DateType> {
multiple?: false;
defaultValue?: DateType | null;
value?: DateType | null;
onChange?: (date: DateType) => void;
}
export type PickerPanelProps<DateType extends object = any> = BasePickerPanelProps<DateType> & {
/** multiple selection. Not support time or datetime picker */
multiple?: boolean;
defaultValue?: DateType | DateType[] | null;
value?: DateType | DateType[] | null;
onChange?: (date: DateType | DateType[]) => void;
};
declare const _default: <DateType extends object = any>(props: BasePickerPanelProps<DateType> & {
/** multiple selection. Not support time or datetime picker */
multiple?: boolean;
defaultValue?: DateType | DateType[];
value?: DateType | DateType[];
onChange?: (date: DateType | DateType[]) => void;
} & React.RefAttributes<PickerPanelRef>) => React.ReactElement;
export default _default;

311
node_modules/rc-picker/lib/PickerPanel/index.js generated vendored Normal file
View File

@@ -0,0 +1,311 @@
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _classnames = _interopRequireDefault(require("classnames"));
var _rcUtil = require("rc-util");
var React = _interopRequireWildcard(require("react"));
var _useLocale = _interopRequireDefault(require("../hooks/useLocale"));
var _useTimeConfig = require("../hooks/useTimeConfig");
var _useToggleDates = _interopRequireDefault(require("../hooks/useToggleDates"));
var _context = _interopRequireDefault(require("../PickerInput/context"));
var _useCellRender = _interopRequireDefault(require("../PickerInput/hooks/useCellRender"));
var _dateUtil = require("../utils/dateUtil");
var _miscUtil = require("../utils/miscUtil");
var _context2 = require("./context");
var _DatePanel = _interopRequireDefault(require("./DatePanel"));
var _DateTimePanel = _interopRequireDefault(require("./DateTimePanel"));
var _DecadePanel = _interopRequireDefault(require("./DecadePanel"));
var _MonthPanel = _interopRequireDefault(require("./MonthPanel"));
var _QuarterPanel = _interopRequireDefault(require("./QuarterPanel"));
var _TimePanel = _interopRequireDefault(require("./TimePanel"));
var _WeekPanel = _interopRequireDefault(require("./WeekPanel"));
var _YearPanel = _interopRequireDefault(require("./YearPanel"));
var DefaultComponents = {
date: _DatePanel.default,
datetime: _DateTimePanel.default,
week: _WeekPanel.default,
month: _MonthPanel.default,
quarter: _QuarterPanel.default,
year: _YearPanel.default,
decade: _DecadePanel.default,
time: _TimePanel.default
};
function PickerPanel(props, ref) {
var _React$useContext;
var locale = props.locale,
generateConfig = props.generateConfig,
direction = props.direction,
prefixCls = props.prefixCls,
_props$tabIndex = props.tabIndex,
tabIndex = _props$tabIndex === void 0 ? 0 : _props$tabIndex,
multiple = props.multiple,
defaultValue = props.defaultValue,
value = props.value,
onChange = props.onChange,
onSelect = props.onSelect,
defaultPickerValue = props.defaultPickerValue,
pickerValue = props.pickerValue,
onPickerValueChange = props.onPickerValueChange,
mode = props.mode,
onPanelChange = props.onPanelChange,
_props$picker = props.picker,
picker = _props$picker === void 0 ? 'date' : _props$picker,
showTime = props.showTime,
hoverValue = props.hoverValue,
hoverRangeValue = props.hoverRangeValue,
cellRender = props.cellRender,
dateRender = props.dateRender,
monthCellRender = props.monthCellRender,
_props$components = props.components,
components = _props$components === void 0 ? {} : _props$components,
hideHeader = props.hideHeader;
var mergedPrefixCls = ((_React$useContext = React.useContext(_context.default)) === null || _React$useContext === void 0 ? void 0 : _React$useContext.prefixCls) || prefixCls || 'rc-picker';
// ========================== Refs ==========================
var rootRef = React.useRef();
React.useImperativeHandle(ref, function () {
return {
nativeElement: rootRef.current
};
});
// ========================== Time ==========================
// Auto `format` need to check `showTime.showXXX` first.
// And then merge the `locale` into `mergedShowTime`.
var _getTimeProps = (0, _useTimeConfig.getTimeProps)(props),
_getTimeProps2 = (0, _slicedToArray2.default)(_getTimeProps, 4),
timeProps = _getTimeProps2[0],
localeTimeProps = _getTimeProps2[1],
showTimeFormat = _getTimeProps2[2],
propFormat = _getTimeProps2[3];
// ========================= Locale =========================
var filledLocale = (0, _useLocale.default)(locale, localeTimeProps);
// ========================= Picker =========================
var internalPicker = picker === 'date' && showTime ? 'datetime' : picker;
// ======================== ShowTime ========================
var mergedShowTime = React.useMemo(function () {
return (0, _useTimeConfig.fillShowTimeConfig)(internalPicker, showTimeFormat, propFormat, timeProps, filledLocale);
}, [internalPicker, showTimeFormat, propFormat, timeProps, filledLocale]);
// ========================== Now ===========================
var now = generateConfig.getNow();
// ========================== Mode ==========================
var _useMergedState = (0, _rcUtil.useMergedState)(picker, {
value: mode,
postState: function postState(val) {
return val || 'date';
}
}),
_useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
mergedMode = _useMergedState2[0],
setMergedMode = _useMergedState2[1];
var internalMode = mergedMode === 'date' && mergedShowTime ? 'datetime' : mergedMode;
// ========================= Toggle =========================
var toggleDates = (0, _useToggleDates.default)(generateConfig, locale, internalPicker);
// ========================= Value ==========================
// >>> Real value
// Interactive with `onChange` event which only trigger when the `mode` is `picker`
var _useMergedState3 = (0, _rcUtil.useMergedState)(defaultValue, {
value: value
}),
_useMergedState4 = (0, _slicedToArray2.default)(_useMergedState3, 2),
innerValue = _useMergedState4[0],
setMergedValue = _useMergedState4[1];
var mergedValue = React.useMemo(function () {
// Clean up `[null]`
var values = (0, _miscUtil.toArray)(innerValue).filter(function (val) {
return val;
});
return multiple ? values : values.slice(0, 1);
}, [innerValue, multiple]);
// Sync value and only trigger onChange event when changed
var triggerChange = (0, _rcUtil.useEvent)(function (nextValue) {
setMergedValue(nextValue);
if (onChange && (nextValue === null || mergedValue.length !== nextValue.length || mergedValue.some(function (ori, index) {
return !(0, _dateUtil.isSame)(generateConfig, locale, ori, nextValue[index], internalPicker);
}))) {
onChange === null || onChange === void 0 || onChange(multiple ? nextValue : nextValue[0]);
}
});
// >>> CalendarValue
// CalendarValue is a temp value for user operation
// which will only trigger `onCalendarChange` but not `onChange`
var onInternalSelect = (0, _rcUtil.useEvent)(function (newDate) {
onSelect === null || onSelect === void 0 || onSelect(newDate);
if (mergedMode === picker) {
var nextValues = multiple ? toggleDates(mergedValue, newDate) : [newDate];
triggerChange(nextValues);
}
});
// >>> PickerValue
// PickerValue is used to control the current displaying panel
var _useMergedState5 = (0, _rcUtil.useMergedState)(defaultPickerValue || mergedValue[0] || now, {
value: pickerValue
}),
_useMergedState6 = (0, _slicedToArray2.default)(_useMergedState5, 2),
mergedPickerValue = _useMergedState6[0],
setInternalPickerValue = _useMergedState6[1];
React.useEffect(function () {
if (mergedValue[0] && !pickerValue) {
setInternalPickerValue(mergedValue[0]);
}
}, [mergedValue[0]]);
// Both trigger when manually pickerValue or mode change
var triggerPanelChange = function triggerPanelChange(viewDate, nextMode) {
onPanelChange === null || onPanelChange === void 0 || onPanelChange(viewDate || pickerValue, nextMode || mergedMode);
};
var setPickerValue = function setPickerValue(nextPickerValue) {
var triggerPanelEvent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
setInternalPickerValue(nextPickerValue);
onPickerValueChange === null || onPickerValueChange === void 0 || onPickerValueChange(nextPickerValue);
if (triggerPanelEvent) {
triggerPanelChange(nextPickerValue);
}
};
var triggerModeChange = function triggerModeChange(nextMode, viewDate) {
setMergedMode(nextMode);
if (viewDate) {
setPickerValue(viewDate);
}
triggerPanelChange(viewDate, nextMode);
};
var onPanelValueSelect = function onPanelValueSelect(nextValue) {
onInternalSelect(nextValue);
setPickerValue(nextValue);
// Update mode if needed
if (mergedMode !== picker) {
var decadeYearQueue = ['decade', 'year'];
var decadeYearMonthQueue = [].concat(decadeYearQueue, ['month']);
var pickerQueue = {
quarter: [].concat(decadeYearQueue, ['quarter']),
week: [].concat((0, _toConsumableArray2.default)(decadeYearMonthQueue), ['week']),
date: [].concat((0, _toConsumableArray2.default)(decadeYearMonthQueue), ['date'])
};
var queue = pickerQueue[picker] || decadeYearMonthQueue;
var index = queue.indexOf(mergedMode);
var nextMode = queue[index + 1];
if (nextMode) {
triggerModeChange(nextMode, nextValue);
}
}
};
// ======================= Hover Date =======================
var hoverRangeDate = React.useMemo(function () {
var start;
var end;
if (Array.isArray(hoverRangeValue)) {
var _hoverRangeValue = (0, _slicedToArray2.default)(hoverRangeValue, 2);
start = _hoverRangeValue[0];
end = _hoverRangeValue[1];
} else {
start = hoverRangeValue;
}
// Return for not exist
if (!start && !end) {
return null;
}
// Fill if has empty
start = start || end;
end = end || start;
return generateConfig.isAfter(start, end) ? [end, start] : [start, end];
}, [hoverRangeValue, generateConfig]);
// ======================= Components =======================
// >>> cellRender
var onInternalCellRender = (0, _useCellRender.default)(cellRender, dateRender, monthCellRender);
// ======================= Components =======================
var PanelComponent = components[internalMode] || DefaultComponents[internalMode] || _DatePanel.default;
// ======================== Context =========================
var parentHackContext = React.useContext(_context2.PickerHackContext);
var pickerPanelContext = React.useMemo(function () {
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, parentHackContext), {}, {
hideHeader: hideHeader
});
}, [parentHackContext, hideHeader]);
// ======================== Warnings ========================
if (process.env.NODE_ENV !== 'production') {
(0, _rcUtil.warning)(!mergedValue || mergedValue.every(function (val) {
return generateConfig.isValidate(val);
}), 'Invalidate date pass to `value` or `defaultValue`.');
}
// ========================= Render =========================
var panelCls = "".concat(mergedPrefixCls, "-panel");
var panelProps = (0, _miscUtil.pickProps)(props, [
// Week
'showWeek',
// Icons
'prevIcon', 'nextIcon', 'superPrevIcon', 'superNextIcon',
// Disabled
'disabledDate', 'minDate', 'maxDate',
// Hover
'onHover']);
return /*#__PURE__*/React.createElement(_context2.PickerHackContext.Provider, {
value: pickerPanelContext
}, /*#__PURE__*/React.createElement("div", {
ref: rootRef,
tabIndex: tabIndex,
className: (0, _classnames.default)(panelCls, (0, _defineProperty2.default)({}, "".concat(panelCls, "-rtl"), direction === 'rtl'))
}, /*#__PURE__*/React.createElement(PanelComponent, (0, _extends2.default)({}, panelProps, {
// Time
showTime: mergedShowTime
// MISC
,
prefixCls: mergedPrefixCls,
locale: filledLocale,
generateConfig: generateConfig
// Mode
,
onModeChange: triggerModeChange
// Value
,
pickerValue: mergedPickerValue,
onPickerValueChange: function onPickerValueChange(nextPickerValue) {
setPickerValue(nextPickerValue, true);
},
value: mergedValue[0],
onSelect: onPanelValueSelect,
values: mergedValue
// Render
,
cellRender: onInternalCellRender
// Hover
,
hoverRangeValue: hoverRangeDate,
hoverValue: hoverValue
}))));
}
var RefPanelPicker = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(PickerPanel));
if (process.env.NODE_ENV !== 'production') {
RefPanelPicker.displayName = 'PanelPicker';
}
// Make support generic
var _default = exports.default = RefPanelPicker;

Some files were not shown because too many files have changed in this diff Show More