zent
Version:
一套前端设计语言和基于React的实现
50 lines (49 loc) • 3.25 kB
JavaScript
import { __assign } from "tslib";
import { jsx as _jsx } from "react/jsx-runtime";
import { useCallback, useMemo, useState } from 'react';
import PanelContext from './context/PanelContext';
import useCombinedDisabledDate from './hooks/useCombinedDisabledDate';
import useRangeMergedProps from './hooks/useRangeMergedProps';
import useHoverRange from './hooks/useHoverRange';
import useNormalizeDisabledDate from './hooks/useNormalizeDisabledDate';
import { getRangeValuesWithValueType } from './utils/getValueInRangePicker';
import { DATE_FORMAT } from './constants';
import CombinedDatePanel from './panels/combined-date-range-panel';
import { RangeTypeMap, } from './types';
import { dateConfig } from './utils/dateUtils';
var START = RangeTypeMap.START, END = RangeTypeMap.END;
var PanelContextProvider = PanelContext.Provider;
export var CombinedPanelRangePicker = function (_a) {
var value = _a.value, onChange = _a.onChange, disabledDateProps = _a.disabledDate, valueType = _a.valueType, defaultDate = _a.defaultDate, format = _a.format, className = _a.className, rightClassName = _a.rightClassName, leftClassName = _a.leftClassName, footerClassName = _a.footerClassName, dateSpan = _a.dateSpan, hideConfirm = _a.hideConfirm, showTime = _a.showTime, disabledTime = _a.disabledTime;
var _b = useRangeMergedProps({
value: value,
format: format,
defaultDate: defaultDate,
addMonthNum: 1,
}), selected = _b.selected, setSelected = _b.setSelected, defaultPanelDate = _b.defaultPanelDate;
var disabledDate = useNormalizeDisabledDate(format, disabledDateProps);
var disabledCombinedDate = useCombinedDisabledDate(selected, disabledDate, dateConfig.date, dateSpan);
var _c = useState(), hoverDate = _c[0], setHoverDate = _c[1];
var hoverRangeDate = useHoverRange(selected, hoverDate);
var rangeDate = useMemo(function () {
var startRangeDate = selected[0], endRangeDate = selected[1];
return startRangeDate && endRangeDate
? [startRangeDate, endRangeDate]
: null;
}, [selected]);
var onSelected = useCallback(function (val, finish) {
if (finish === void 0) { finish = false; }
setSelected(val);
if (hideConfirm || finish) {
onChange(getRangeValuesWithValueType(valueType, format, val));
}
}, [format, hideConfirm, onChange, setSelected, valueType]);
return (_jsx("div", __assign({ className: className, "data-zv": '10.0.17' }, { children: _jsx(PanelContextProvider, __assign({ value: { onHover: setHoverDate } }, { children: _jsx(CombinedDatePanel, { selected: selected, defaultPanelDate: defaultPanelDate, onSelected: onSelected, disabledStartDate: disabledCombinedDate(START), disabledEndDate: disabledCombinedDate(END), hoverDate: hoverDate, hoverRangeDate: hoverRangeDate, rangeDate: rangeDate, rightClassName: rightClassName, leftClassName: leftClassName, footerClassName: footerClassName, showTime: showTime, hideConfirm: hideConfirm, disabledTime: disabledTime }, void 0) }), void 0) }), void 0));
};
CombinedPanelRangePicker.defaultProps = {
format: DATE_FORMAT,
dateSpan: 0,
hideConfirm: false,
valueType: 'string',
};
export default CombinedPanelRangePicker;