choerodon-ui/es/rc-components/calendar/RangeCalendar.js

An enterprise-class UI design language and React-based implementation

import _extends from "@babel/runtime/helpers/extends";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import React from 'react';
import createReactClass from 'create-react-class';
import moment from 'moment';
import classnames from 'classnames';
import noop from 'lodash/noop';
import KeyCode from '../../_util/KeyCode';
import CalendarPart from './range-calendar/CalendarPart';
import TodayButton from './calendar/TodayButton';
import OkButton from './calendar/OkButton';
import TimePickerButton from './calendar/TimePickerButton';
import CommonMixin from './mixin/CommonMixin';
import { getTodayTime, isAllowedDate, syncTime } from './util';
import { goTime, goStartMonth, goEndMonth, includesTime } from './util/toTime';

function isEmptyArray(arr) {
  return Array.isArray(arr) && (arr.length === 0 || arr.every(function (i) {
    return !i;
  }));
}

function isArraysEqual(a, b) {
  if (a === b) return true;

  if (a === null || typeof a === 'undefined' || b === null || typeof b === 'undefined') {
    return false;
  }

  if (a.length !== b.length) return false;

  for (var i = 0; i < a.length; ++i) {
    if (a[i] !== b[i]) return false;
  }

  return true;
}

function getValueFromSelectedValue(selectedValue) {
  var _selectedValue = _slicedToArray(selectedValue, 2),
      start = _selectedValue[0],
      end = _selectedValue[1];

  var newEnd = end && end.isSame(start, 'month') ? end.clone().add(1, 'month') : end;
  return [start, newEnd];
}

function normalizeAnchor(props, init) {
  var selectedValue = props.selectedValue || init && props.defaultSelectedValue;
  var value = props.value || init && props.defaultValue;
  var normalizedValue = value ? getValueFromSelectedValue(value) : getValueFromSelectedValue(selectedValue);
  return !isEmptyArray(normalizedValue) ? normalizedValue : init && [moment(), moment().add(1, 'months')];
}

function generateOptions(length, extraOptionGen) {
  var arr = extraOptionGen ? extraOptionGen().concat() : [];

  for (var value = 0; value < length; value++) {
    if (arr.indexOf(value) === -1) {
      arr.push(value);
    }
  }

  return arr;
}

function onInputSelect(direction, value) {
  if (!value) {
    return;
  }

  var originalValue = this.state.selectedValue;
  var selectedValue = originalValue.concat();
  var index = direction === 'left' ? 0 : 1;
  selectedValue[index] = value;

  if (selectedValue[0] && this.compare(selectedValue[0], selectedValue[1]) > 0) {
    selectedValue[1 - index] = this.state.showTimePicker ? selectedValue[index] : undefined;
  }

  this.props.onInputSelect(selectedValue);
  this.fireSelectValueChange(selectedValue);
}

var RangeCalendar = createReactClass({
  displayName: "RangeCalendar",
  mixins: [CommonMixin],
  getDefaultProps: function getDefaultProps() {
    return {
      type: 'both',
      defaultSelectedValue: [],
      onValueChange: noop,
      onHoverChange: noop,
      onPanelChange: noop,
      disabledTime: noop,
      onInputSelect: noop,
      showToday: true,
      showDateInput: true
    };
  },
  getInitialState: function getInitialState() {
    var props = this.props;
    var selectedValue = props.selectedValue || props.defaultSelectedValue;
    var value = normalizeAnchor(props, 1);
    return {
      selectedValue: selectedValue,
      prevSelectedValue: selectedValue,
      firstSelectedValue: null,
      hoverValue: props.hoverValue || [],
      value: value,
      showTimePicker: false,
      mode: props.mode || ['date', 'date']
    };
  },
  componentWillReceiveProps: function componentWillReceiveProps(nextProps) {
    var state = this.state;
    var newState = {};

    if ('value' in nextProps) {
      newState.value = normalizeAnchor(nextProps, 0);
      this.setState(newState);
    }

    if ('hoverValue' in nextProps && !isArraysEqual(state.hoverValue, nextProps.hoverValue)) {
      this.setState({
        hoverValue: nextProps.hoverValue
      });
    }

    if ('selectedValue' in nextProps) {
      newState.selectedValue = nextProps.selectedValue;
      newState.prevSelectedValue = nextProps.selectedValue;
      this.setState(newState);
    }

    if ('mode' in nextProps && !isArraysEqual(state.mode, nextProps.mode)) {
      this.setState({
        mode: nextProps.mode
      });
    }
  },
  onDatePanelEnter: function onDatePanelEnter() {
    if (this.hasSelectedValue()) {
      this.fireHoverValueChange(this.state.selectedValue.concat());
    }
  },
  onDatePanelLeave: function onDatePanelLeave() {
    if (this.hasSelectedValue()) {
      this.fireHoverValueChange([]);
    }
  },
  onSelect: function onSelect(value) {
    var type = this.props.type;
    var _this$state = this.state,
        selectedValue = _this$state.selectedValue,
        prevSelectedValue = _this$state.prevSelectedValue,
        firstSelectedValue = _this$state.firstSelectedValue;
    var nextSelectedValue;

    if (type === 'both') {
      if (!firstSelectedValue) {
        syncTime(prevSelectedValue[0], value);
        nextSelectedValue = [value];
      } else if (this.compare(firstSelectedValue, value) < 0) {
        syncTime(prevSelectedValue[1], value);
        nextSelectedValue = [firstSelectedValue, value];
      } else {
        syncTime(prevSelectedValue[0], value);
        syncTime(prevSelectedValue[1], firstSelectedValue);
        nextSelectedValue = [value, firstSelectedValue];
      }
    } else if (type === 'start') {
      syncTime(prevSelectedValue[0], value);
      var endValue = selectedValue[1];
      nextSelectedValue = endValue && this.compare(endValue, value) > 0 ? [value, endValue] : [value];
    } else {
      // type === 'end'
      var startValue = selectedValue[0];

      if (startValue && this.compare(startValue, value) <= 0) {
        syncTime(prevSelectedValue[1], value);
        nextSelectedValue = [startValue, value];
      } else {
        syncTime(prevSelectedValue[0], value);
        nextSelectedValue = [value];
      }
    }

    this.fireSelectValueChange(nextSelectedValue);
  },
  onKeyDown: function onKeyDown(event) {
    var _this = this;

    if (event.target.nodeName.toLowerCase() === 'input') {
      return;
    }

    var keyCode = event.keyCode;
    var ctrlKey = event.ctrlKey || event.metaKey;
    var _this$state2 = this.state,
        selectedValue = _this$state2.selectedValue,
        hoverValue = _this$state2.hoverValue,
        firstSelectedValue = _this$state2.firstSelectedValue,
        value = _this$state2.value;
    var _this$props = this.props,
        onKeyDown = _this$props.onKeyDown,
        disabledDate = _this$props.disabledDate; // Update last time of the picker

    var updateHoverPoint = function updateHoverPoint(func) {
      // Change hover to make focus in UI
      var currentHoverTime;
      var nextHoverTime;
      var nextHoverValue;

      if (!firstSelectedValue) {
        currentHoverTime = hoverValue[0] || selectedValue[0] || value[0] || moment();
        nextHoverTime = func(currentHoverTime);
        nextHoverValue = [nextHoverTime];

        _this.fireHoverValueChange(nextHoverValue);
      } else {
        if (hoverValue.length === 1) {
          currentHoverTime = hoverValue[0].clone();
          nextHoverTime = func(currentHoverTime);
          nextHoverValue = _this.onDayHover(nextHoverTime);
        } else {
          currentHoverTime = hoverValue[0].isSame(firstSelectedValue, 'day') ? hoverValue[1] : hoverValue[0];
          nextHoverTime = func(currentHoverTime);
          nextHoverValue = _this.onDayHover(nextHoverTime);
        }
      } // Find origin hover time on value index


      if (nextHoverValue.length >= 2) {
        var miss = nextHoverValue.some(function (ht) {
          return !includesTime(value, ht, 'month');
        });

        if (miss) {
          var newValue = nextHoverValue.slice().sort(function (t1, t2) {
            return t1.valueOf() - t2.valueOf();
          });

          if (newValue[0].isSame(newValue[1], 'month')) {
            newValue[1] = newValue[0].clone().add(1, 'month');
          }

          _this.fireValueChange(newValue);
        }
      } else if (nextHoverValue.length === 1) {
        // If only one value, let's keep the origin panel
        var oriValueIndex = value.findIndex(function (time) {
          return time.isSame(currentHoverTime, 'month');
        });
        if (oriValueIndex === -1) oriValueIndex = 0;

        if (value.every(function (time) {
          return !time.isSame(nextHoverTime, 'month');
        })) {
          var _newValue = value.slice();

          _newValue[oriValueIndex] = nextHoverTime.clone();

          _this.fireValueChange(_newValue);
        }
      }

      event.preventDefault();
      return nextHoverTime;
    };

    switch (keyCode) {
      case KeyCode.DOWN:
        updateHoverPoint(function (time) {
          return goTime(time, 1, 'weeks');
        });
        return;

      case KeyCode.UP:
        updateHoverPoint(function (time) {
          return goTime(time, -1, 'weeks');
        });
        return;

      case KeyCode.LEFT:
        if (ctrlKey) {
          updateHoverPoint(function (time) {
            return goTime(time, -1, 'years');
          });
        } else {
          updateHoverPoint(function (time) {
            return goTime(time, -1, 'days');
          });
        }

        return;

      case KeyCode.RIGHT:
        if (ctrlKey) {
          updateHoverPoint(function (time) {
            return goTime(time, 1, 'years');
          });
        } else {
          updateHoverPoint(function (time) {
            return goTime(time, 1, 'days');
          });
        }

        return;

      case KeyCode.HOME:
        updateHoverPoint(function (time) {
          return goStartMonth(time);
        });
        return;

      case KeyCode.END:
        updateHoverPoint(function (time) {
          return goEndMonth(time);
        });
        return;

      case KeyCode.PAGE_DOWN:
        updateHoverPoint(function (time) {
          return goTime(time, 1, 'month');
        });
        return;

      case KeyCode.PAGE_UP:
        updateHoverPoint(function (time) {
          return goTime(time, -1, 'month');
        });
        return;

      case KeyCode.ENTER:
        {
          var lastValue;

          if (hoverValue.length === 0) {
            lastValue = updateHoverPoint(function (time) {
              return time;
            });
          } else if (hoverValue.length === 1) {
            lastValue = hoverValue[0];
          } else {
            lastValue = hoverValue[0].isSame(firstSelectedValue, 'day') ? hoverValue[1] : hoverValue[0];
          }

          if (lastValue && (!disabledDate || !disabledDate(lastValue))) {
            this.onSelect(lastValue);
          }

          event.preventDefault();
          return;
        }

      default:
        if (onKeyDown) {
          onKeyDown(event);
        }

    }
  },
  onDayHover: function onDayHover(value) {
    var hoverValue = [];
    var _this$state3 = this.state,
        selectedValue = _this$state3.selectedValue,
        firstSelectedValue = _this$state3.firstSelectedValue;
    var type = this.props.type;

    if (type === 'start' && selectedValue[1]) {
      hoverValue = this.compare(value, selectedValue[1]) < 0 ? [value, selectedValue[1]] : [value];
    } else if (type === 'end' && selectedValue[0]) {
      hoverValue = this.compare(value, selectedValue[0]) > 0 ? [selectedValue[0], value] : [];
    } else {
      if (!firstSelectedValue) {
        if (this.state.hoverValue.length) {
          this.setState({
            hoverValue: []
          });
        }

        return hoverValue;
      }

      hoverValue = this.compare(value, firstSelectedValue) < 0 ? [value, firstSelectedValue] : [firstSelectedValue, value];
    }

    this.fireHoverValueChange(hoverValue);
    return hoverValue;
  },
  onToday: function onToday() {
    var startValue = getTodayTime(this.state.value[0]);
    var endValue = startValue.clone().add(1, 'months');
    this.setState({
      value: [startValue, endValue]
    });
  },
  onOpenTimePicker: function onOpenTimePicker() {
    this.setState({
      showTimePicker: true
    });
  },
  onCloseTimePicker: function onCloseTimePicker() {
    this.setState({
      showTimePicker: false
    });
  },
  onOk: function onOk() {
    var selectedValue = this.state.selectedValue;

    if (this.isAllowedDateAndTime(selectedValue)) {
      this.props.onOk(this.state.selectedValue);
    }
  },
  onStartInputSelect: function onStartInputSelect() {
    for (var _len = arguments.length, oargs = new Array(_len), _key = 0; _key < _len; _key++) {
      oargs[_key] = arguments[_key];
    }

    var args = ['left'].concat(oargs);
    return onInputSelect.apply(this, args);
  },
  onEndInputSelect: function onEndInputSelect() {
    for (var _len2 = arguments.length, oargs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
      oargs[_key2] = arguments[_key2];
    }

    var args = ['right'].concat(oargs);
    return onInputSelect.apply(this, args);
  },
  onStartValueChange: function onStartValueChange(leftValue) {
    var value = _toConsumableArray(this.state.value);

    value[0] = leftValue;
    return this.fireValueChange(value);
  },
  onEndValueChange: function onEndValueChange(rightValue) {
    var value = _toConsumableArray(this.state.value);

    value[1] = rightValue;
    return this.fireValueChange(value);
  },
  onStartPanelChange: function onStartPanelChange(value, mode) {
    var props = this.props,
        state = this.state;
    var newMode = [mode, state.mode[1]];

    if (!('mode' in props)) {
      this.setState({
        mode: newMode
      });
    }

    var newValue = [value || state.value[0], state.value[1]];
    props.onPanelChange(newValue, newMode);
  },
  onEndPanelChange: function onEndPanelChange(value, mode) {
    var props = this.props,
        state = this.state;
    var newMode = [state.mode[0], mode];

    if (!('mode' in props)) {
      this.setState({
        mode: newMode
      });
    }

    var newValue = [state.value[0], value || state.value[1]];
    props.onPanelChange(newValue, newMode);
  },
  getStartValue: function getStartValue() {
    var value = this.state.value[0];
    var selectedValue = this.state.selectedValue; // keep selectedTime when select date

    if (selectedValue[0] && this.props.timePicker) {
      value = value.clone();
      syncTime(selectedValue[0], value);
    }

    if (this.state.showTimePicker && selectedValue[0]) {
      return selectedValue[0];
    }

    return value;
  },
  getEndValue: function getEndValue() {
    var _this$state4 = this.state,
        value = _this$state4.value,
        selectedValue = _this$state4.selectedValue,
        showTimePicker = _this$state4.showTimePicker;
    var endValue = value[1] ? value[1].clone() : value[0].clone().add(1, 'month'); // keep selectedTime when select date

    if (selectedValue[1] && this.props.timePicker) {
      syncTime(selectedValue[1], endValue);
    }

    if (showTimePicker) {
      return selectedValue[1] ? selectedValue[1] : this.getStartValue();
    }

    return endValue;
  },
  // get disabled hours for second picker
  getEndDisableTime: function getEndDisableTime() {
    var _this$state5 = this.state,
        selectedValue = _this$state5.selectedValue,
        value = _this$state5.value;
    var disabledTime = this.props.disabledTime;
    var userSettingDisabledTime = disabledTime(selectedValue, 'end') || {};
    var startValue = selectedValue && selectedValue[0] || value[0].clone(); // if startTime and endTime is same day..
    // the second time picker will not able to pick time before first time picker

    if (!selectedValue[1] || startValue.isSame(selectedValue[1], 'day')) {
      var hours = startValue.hour();
      var minutes = startValue.minute();
      var second = startValue.second();
      var _disabledHours = userSettingDisabledTime.disabledHours,
          _disabledMinutes = userSettingDisabledTime.disabledMinutes,
          _disabledSeconds = userSettingDisabledTime.disabledSeconds;
      var oldDisabledMinutes = _disabledMinutes ? _disabledMinutes() : [];
      var olddisabledSeconds = _disabledSeconds ? _disabledSeconds() : [];
      _disabledHours = generateOptions(hours, _disabledHours);
      _disabledMinutes = generateOptions(minutes, _disabledMinutes);
      _disabledSeconds = generateOptions(second, _disabledSeconds);
      return {
        disabledHours: function disabledHours() {
          return _disabledHours;
        },
        disabledMinutes: function disabledMinutes(hour) {
          if (hour === hours) {
            return _disabledMinutes;
          }

          return oldDisabledMinutes;
        },
        disabledSeconds: function disabledSeconds(hour, minute) {
          if (hour === hours && minute === minutes) {
            return _disabledSeconds;
          }

          return olddisabledSeconds;
        }
      };
    }

    return userSettingDisabledTime;
  },
  isAllowedDateAndTime: function isAllowedDateAndTime(selectedValue) {
    return isAllowedDate(selectedValue[0], this.props.disabledDate, this.disabledStartTime) && isAllowedDate(selectedValue[1], this.props.disabledDate, this.disabledEndTime);
  },
  isMonthYearPanelShow: function isMonthYearPanelShow(mode) {
    return ['month', 'year', 'decade'].indexOf(mode) > -1;
  },
  hasSelectedValue: function hasSelectedValue() {
    var selectedValue = this.state.selectedValue;
    return !!selectedValue[1] && !!selectedValue[0];
  },
  compare: function compare(v1, v2) {
    if (this.props.timePicker) {
      return v1.diff(v2);
    }

    return v1.diff(v2, 'days');
  },
  fireSelectValueChange: function fireSelectValueChange(selectedValue, direct) {
    var timePicker = this.props.timePicker;
    var prevSelectedValue = this.state.prevSelectedValue;

    if (timePicker && timePicker.props.defaultValue) {
      var timePickerDefaultValue = timePicker.props.defaultValue;

      if (!prevSelectedValue[0] && selectedValue[0]) {
        syncTime(timePickerDefaultValue[0], selectedValue[0]);
      }

      if (!prevSelectedValue[1] && selectedValue[1]) {
        syncTime(timePickerDefaultValue[1], selectedValue[1]);
      }
    }

    if (!('selectedValue' in this.props)) {
      this.setState({
        selectedValue: selectedValue
      });
    } // 尚未选择过时间，直接输入的话


    if (!this.state.selectedValue[0] || !this.state.selectedValue[1]) {
      var startValue = selectedValue[0] || moment();
      var endValue = selectedValue[1] || startValue.clone().add(1, 'months');
      this.setState({
        selectedValue: selectedValue,
        value: getValueFromSelectedValue([startValue, endValue])
      });
    }

    if (selectedValue[0] && !selectedValue[1]) {
      this.setState({
        firstSelectedValue: selectedValue[0]
      });
      this.fireHoverValueChange(selectedValue.concat());
    }

    this.props.onChange(selectedValue);

    if (direct || selectedValue[0] && selectedValue[1]) {
      this.setState({
        prevSelectedValue: selectedValue,
        firstSelectedValue: null
      });
      this.fireHoverValueChange([]);
      this.props.onSelect(selectedValue);
    }
  },
  fireValueChange: function fireValueChange(value) {
    var props = this.props;

    if (!('value' in props)) {
      this.setState({
        value: value
      });
    }

    props.onValueChange(value);
  },
  fireHoverValueChange: function fireHoverValueChange(hoverValue) {
    var props = this.props;

    if (!('hoverValue' in props)) {
      this.setState({
        hoverValue: hoverValue
      });
    }

    props.onHoverChange(hoverValue);
  },
  clear: function clear() {
    this.fireSelectValueChange([], true);
    this.props.onClear();
  },
  disabledStartTime: function disabledStartTime(time) {
    return this.props.disabledTime(time, 'start');
  },
  disabledEndTime: function disabledEndTime(time) {
    return this.props.disabledTime(time, 'end');
  },
  disabledStartMonth: function disabledStartMonth(month) {
    var value = this.state.value;
    return month.isSameOrAfter(value[1], 'month');
  },
  disabledEndMonth: function disabledEndMonth(month) {
    var value = this.state.value;
    return month.isSameOrBefore(value[0], 'month');
  },
  render: function render() {
    var _className, _classnames;

    var props = this.props,
        state = this.state;
    var prefixCls = props.prefixCls,
        dateInputPlaceholder = props.dateInputPlaceholder,
        timePicker = props.timePicker,
        showOk = props.showOk,
        locale = props.locale,
        showClear = props.showClear,
        showToday = props.showToday,
        type = props.type,
        clearIcon = props.clearIcon;
    var hoverValue = state.hoverValue,
        selectedValue = state.selectedValue,
        mode = state.mode,
        showTimePicker = state.showTimePicker;
    var className = (_className = {}, _defineProperty(_className, props.className, !!props.className), _defineProperty(_className, prefixCls, 1), _defineProperty(_className, "".concat(prefixCls, "-hidden"), !props.visible), _defineProperty(_className, "".concat(prefixCls, "-range"), 1), _defineProperty(_className, "".concat(prefixCls, "-show-time-picker"), showTimePicker), _defineProperty(_className, "".concat(prefixCls, "-week-number"), props.showWeekNumber), _className);
    var classes = classnames(className);
    var newProps = {
      selectedValue: state.selectedValue,
      onSelect: this.onSelect,
      onDayHover: type === 'start' && selectedValue[1] || type === 'end' && selectedValue[0] || !!hoverValue.length ? this.onDayHover : undefined
    };
    var placeholder1;
    var placeholder2;

    if (dateInputPlaceholder) {
      if (Array.isArray(dateInputPlaceholder)) {
        var _dateInputPlaceholder = _slicedToArray(dateInputPlaceholder, 2);

        placeholder1 = _dateInputPlaceholder[0];
        placeholder2 = _dateInputPlaceholder[1];
      } else {
        placeholder1 = placeholder2 = dateInputPlaceholder;
      }
    }

    var showOkButton = showOk === true || showOk !== false && !!timePicker;
    var cls = classnames((_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-footer"), true), _defineProperty(_classnames, "".concat(prefixCls, "-range-bottom"), true), _defineProperty(_classnames, "".concat(prefixCls, "-footer-show-ok"), showOkButton), _classnames));
    var startValue = this.getStartValue();
    var endValue = this.getEndValue();
    var todayTime = getTodayTime(startValue);
    var thisMonth = todayTime.month();
    var thisYear = todayTime.year();
    var isTodayInView = startValue.year() === thisYear && startValue.month() === thisMonth || endValue.year() === thisYear && endValue.month() === thisMonth;
    var nextMonthOfStart = startValue.clone().add(1, 'months');
    var isClosestMonths = nextMonthOfStart.year() === endValue.year() && nextMonthOfStart.month() === endValue.month();
    return /*#__PURE__*/React.createElement("div", {
      ref: this.saveRoot,
      className: classes,
      style: props.style,
      tabIndex: "0",
      onKeyDown: this.onKeyDown
    }, props.renderSidebar(), /*#__PURE__*/React.createElement("div", {
      className: "".concat(prefixCls, "-panel")
    }, showClear && selectedValue[0] && selectedValue[1] ? /*#__PURE__*/React.createElement("a", {
      role: "button",
      title: locale.clear,
      onClick: this.clear
    }, clearIcon || /*#__PURE__*/React.createElement("span", {
      className: "".concat(prefixCls, "-clear-btn")
    })) : null, /*#__PURE__*/React.createElement("div", {
      className: "".concat(prefixCls, "-date-panel"),
      onMouseLeave: type !== 'both' ? this.onDatePanelLeave : undefined,
      onMouseEnter: type !== 'both' ? this.onDatePanelEnter : undefined
    }, /*#__PURE__*/React.createElement(CalendarPart, _extends({}, props, newProps, {
      hoverValue: hoverValue,
      direction: "left",
      disabledTime: this.disabledStartTime,
      disabledMonth: this.disabledStartMonth,
      format: this.getFormat(),
      value: startValue,
      mode: mode[0],
      placeholder: placeholder1,
      onInputSelect: this.onStartInputSelect,
      onValueChange: this.onStartValueChange,
      onPanelChange: this.onStartPanelChange,
      showDateInput: this.props.showDateInput,
      timePicker: timePicker,
      showTimePicker: showTimePicker,
      enablePrev: true,
      enableNext: !isClosestMonths || this.isMonthYearPanelShow(mode[1]),
      clearIcon: clearIcon
    })), /*#__PURE__*/React.createElement("span", {
      className: "".concat(prefixCls, "-range-middle")
    }, "~"), /*#__PURE__*/React.createElement(CalendarPart, _extends({}, props, newProps, {
      hoverValue: hoverValue,
      direction: "right",
      format: this.getFormat(),
      timePickerDisabledTime: this.getEndDisableTime(),
      placeholder: placeholder2,
      value: endValue,
      mode: mode[1],
      onInputSelect: this.onEndInputSelect,
      onValueChange: this.onEndValueChange,
      onPanelChange: this.onEndPanelChange,
      showDateInput: this.props.showDateInput,
      timePicker: timePicker,
      showTimePicker: showTimePicker,
      disabledTime: this.disabledEndTime,
      disabledMonth: this.disabledEndMonth,
      enablePrev: !isClosestMonths || this.isMonthYearPanelShow(mode[0]),
      enableNext: true,
      clearIcon: clearIcon
    }))), /*#__PURE__*/React.createElement("div", {
      className: cls
    }, props.renderFooter(), showToday || props.timePicker || showOkButton ? /*#__PURE__*/React.createElement("div", {
      className: "".concat(prefixCls, "-footer-btn")
    }, showToday ? /*#__PURE__*/React.createElement(TodayButton, _extends({}, props, {
      disabled: isTodayInView,
      value: state.value[0],
      onToday: this.onToday,
      text: locale.backToToday
    })) : null, props.timePicker ? /*#__PURE__*/React.createElement(TimePickerButton, _extends({}, props, {
      showTimePicker: showTimePicker,
      onOpenTimePicker: this.onOpenTimePicker,
      onCloseTimePicker: this.onCloseTimePicker,
      timePickerDisabled: !this.hasSelectedValue() || hoverValue.length
    })) : null, showOkButton ? /*#__PURE__*/React.createElement(OkButton, _extends({}, props, {
      onOk: this.onOk,
      okDisabled: !this.isAllowedDateAndTime(selectedValue) || !this.hasSelectedValue() || hoverValue.length
    })) : null) : null)));
  }
});
export default RangeCalendar;
//# sourceMappingURL=RangeCalendar.js.map