@auraxy/react-datepicker/lib/es/index.js

React date-picker, time-picker, date-time-picker

/**
 * Bundle of @auraxy/react-datepicker
 * Generated: 2022-01-14
 * Version: 2.2.2
 * License: MIT
 * Author: 2631541504@qq.com
 */

import ReactPopper from '@livelybone/react-popper';
import classNames from 'classnames';
import React, { useMemo, useReducer, useState, useCallback, useImperativeHandle, useRef, useEffect } from 'react';
import ReactDOM from 'react-dom';
import useStateTrackProp from 'use-state-track-prop';
import useWatch from 'use-watch';
import { parseDate, fillTo, parseTime, compareDates, getMonthByStep, getMonthLen, nowDate, gntYear, gntMonth, gntCalendar, getDateByStep, DateCompare, nowTime, getHour, getMinute, getSecond } from '@livelybone/date-generator';
import ScrollBar from 'react-perfect-scrollbar';

function _arrayWithHoles(arr) {
  if (Array.isArray(arr)) return arr;
}

function _iterableToArrayLimit(arr, i) {
  if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
  var _arr = [];
  var _n = true;
  var _d = false;
  var _e = undefined;

  try {
    for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
      _arr.push(_s.value);

      if (i && _arr.length === i) break;
    }
  } catch (err) {
    _d = true;
    _e = err;
  } finally {
    try {
      if (!_n && _i["return"] != null) _i["return"]();
    } finally {
      if (_d) throw _e;
    }
  }

  return _arr;
}

function _arrayLikeToArray(arr, len) {
  if (len == null || len > arr.length) len = arr.length;

  for (var i = 0, arr2 = new Array(len); i < len; i++) {
    arr2[i] = arr[i];
  }

  return arr2;
}

function _unsupportedIterableToArray(o, minLen) {
  if (!o) return;
  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
  var n = Object.prototype.toString.call(o).slice(8, -1);
  if (n === "Object" && o.constructor) n = o.constructor.name;
  if (n === "Map" || n === "Set") return Array.from(n);
  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
}

function _nonIterableRest() {
  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}

function _slicedToArray(arr, i) {
  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
}

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

function _arrayWithoutHoles(arr) {
  if (Array.isArray(arr)) return _arrayLikeToArray(arr);
}

function _iterableToArray(iter) {
  if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
}

function _nonIterableSpread() {
  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}

function _toConsumableArray(arr) {
  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
}

function ownKeys(object, enumerableOnly) {
  var keys = Object.keys(object);

  if (Object.getOwnPropertySymbols) {
    var symbols = Object.getOwnPropertySymbols(object);
    if (enumerableOnly) symbols = symbols.filter(function (sym) {
      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
    });
    keys.push.apply(keys, symbols);
  }

  return keys;
}

function _objectSpread2(target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = arguments[i] != null ? arguments[i] : {};

    if (i % 2) {
      ownKeys(Object(source), true).forEach(function (key) {
        _defineProperty(target, key, source[key]);
      });
    } else if (Object.getOwnPropertyDescriptors) {
      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
    } else {
      ownKeys(Object(source)).forEach(function (key) {
        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
      });
    }
  }

  return target;
}

var _DatePickerTypeRef;

var DatePickerType;

(function (DatePickerType) {
  DatePickerType["Year"] = "year";
  DatePickerType["Month"] = "month";
  DatePickerType["Date"] = "date";
  DatePickerType["Time"] = "time";
})(DatePickerType || (DatePickerType = {}));

var TimePickerType;

(function (TimePickerType) {
  TimePickerType["Second"] = "second";
  TimePickerType["Minute"] = "minute";
  TimePickerType["Hour"] = "hour";
})(TimePickerType || (TimePickerType = {}));

var Compare;

(function (Compare) {
  Compare[Compare["GreaterThan"] = 1] = "GreaterThan";
  Compare[Compare["Equal"] = 0] = "Equal";
  Compare[Compare["LessThan"] = -1] = "LessThan";
})(Compare || (Compare = {}));

var DatePickerTypeRef = (_DatePickerTypeRef = {}, _defineProperty(_DatePickerTypeRef, DatePickerType.Time, {
  placeholder: '请选择时间'
}), _defineProperty(_DatePickerTypeRef, DatePickerType.Date, {
  placeholder: '请选择日期'
}), _defineProperty(_DatePickerTypeRef, DatePickerType.Month, {
  placeholder: '请选择月份'
}), _defineProperty(_DatePickerTypeRef, DatePickerType.Year, {
  placeholder: '请选择年份'
}), _DatePickerTypeRef);

var PickerHead = function PickerHead(_ref) {
  var choseType = _ref.choseType,
      currDateObj = _ref.currDateObj,
      setChoseType = _ref.setChoseType,
      showBtn = _ref.showBtn,
      onPrev = _ref.onPrev,
      onNext = _ref.onNext;
  var tenYears = useMemo(function () {
    var tenYear = Math.floor(+currDateObj.year / 10 - 0.1);
    return "".concat(tenYear * 10 + 1, " - ").concat((tenYear + 1) * 10);
  }, [currDateObj.year]);
  return /*#__PURE__*/React.createElement("div", {
    className: "picker-head"
  }, /*#__PURE__*/React.createElement("span", {
    className: classNames('prev', {
      disabled: !showBtn.prev
    }),
    onClick: function onClick() {
      return showBtn.prev && onPrev();
    }
  }, "<"), /*#__PURE__*/React.createElement("span", {
    className: "picker-h"
  }, choseType !== DatePickerType.Year ? /*#__PURE__*/React.createElement("span", {
    className: "year",
    onClick: function onClick() {
      return setChoseType(DatePickerType.Year);
    }
  }, currDateObj.year) : choseType === DatePickerType.Year && /*#__PURE__*/React.createElement("span", null, tenYears), (choseType === DatePickerType.Date || choseType === DatePickerType.Time) && /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0-\xA0", /*#__PURE__*/React.createElement("span", {
    className: "month",
    onClick: function onClick() {
      return setChoseType(DatePickerType.Month);
    }
  }, currDateObj.month)), choseType === DatePickerType.Time && /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0-\xA0", /*#__PURE__*/React.createElement("span", {
    className: "date",
    onClick: function onClick() {
      return setChoseType(DatePickerType.Date);
    }
  }, currDateObj.date))), /*#__PURE__*/React.createElement("span", {
    className: classNames('next', {
      disabled: !showBtn.next
    }),
    onClick: function onClick() {
      return showBtn.next && onNext();
    }
  }, ">"));
};

var dateReg = /^((\d{4})-?(\d{1,2})?-?(\d{1,2})?)/; // flag：
//    -1 - 如果 d1 小于等于 d2，返回 true
//    1 - 如果 d1 大于等于 d2，返回 true
//    0 - 如果 d1 等于 d2，返回 true

function dateCompare(date, targetDate) {
  var flag = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : Compare.GreaterThan;
  var type = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : DatePickerType.Date;
  var $date = typeof date === 'string' ? parseDate(date) : date ? _objectSpread2({}, date) : undefined;
  var $targetDate = typeof targetDate === 'string' ? parseDate(targetDate) : targetDate ? _objectSpread2({}, targetDate) : undefined;
  if (!$date) return false;
  if (!$targetDate) return true;

  if (type === DatePickerType.Year) {
    $date.month = '01';
    $date.date = '01';
    $targetDate.month = '01';
    $targetDate.date = '01';
  } else if (type === DatePickerType.Month) {
    $date.date = '01';
    $targetDate.date = '01';
  }

  var compare = compareDates($date, $targetDate);
  return flag === Compare.Equal ? compare === 0 : compare * flag >= 0;
}
var timeReg = /^((\d{1,2}):?(\d{1,2})?:?(\d{1,2})?)/; // flag：
//    -1 - 如果 t1 小于等于 t2，返回 true
//    1 - 如果 t1 大于等于 t2，返回 true
//    0 - 如果 t1 等于 t2，返回 true

function timeCompare(time, targetTime) {
  var flag = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : Compare.GreaterThan;
  var type = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : TimePickerType.Second;
  var $time = typeof time === 'string' ? parseTime(time) : time ? _objectSpread2({}, time) : undefined;
  var $targetTime = typeof targetTime === 'string' ? parseTime(targetTime) : targetTime ? _objectSpread2({}, targetTime) : undefined;
  if (!$time) return false;
  if (!$targetTime) return true;

  if (type === TimePickerType.Hour) {
    $time.minute = '00';
    $time.second = '00';
    $targetTime.minute = '00';
    $targetTime.second = '00';
  } else if (type === TimePickerType.Minute) {
    $time.second = '00';
    $targetTime.second = '00';
  }

  var get = function get(t) {
    return +"".concat(fillTo(2, t.hour)).concat(fillTo(2, t.minute)).concat(fillTo(2, t.second));
  };

  var compare = get($time) - get($targetTime);
  return flag === Compare.Equal ? compare === 0 : compare * flag >= 0;
}
function datetimeCompare(datetime, targetDatetime) {
  var flag = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : Compare.GreaterThan;
  if (!datetime) return false;
  if (!targetDatetime) return true;
  if (flag === Compare.Equal) return dateCompare(datetime, targetDatetime, flag) && (datetime.hour === undefined || timeCompare(datetime, targetDatetime, flag));
  var compare = dateCompare(datetime, targetDatetime, flag);
  if (!compare) return false;
  var compareReverse = dateCompare(datetime, targetDatetime, -flag);
  if (compareReverse) return datetime.hour === undefined || timeCompare(datetime, targetDatetime, flag);
  return true;
}
function usePopperProps(popperProps) {
  return useMemo(function () {
    return _objectSpread2(_objectSpread2({}, popperProps), {}, {
      placement: 'bottom-start',
      arrowPosition: 'start'
    });
  }, [popperProps]);
}
function getDateIndex(item, currDateObjs, choseType) {
  return Object.keys(currDateObjs).find(function ($index) {
    var currDateObj = currDateObjs[+$index];

    if (choseType === DatePickerType.Date) {
      return +item.year === +currDateObj.year && +item.month === +currDateObj.month && +item.date === +currDateObj.date;
    }

    if (choseType === DatePickerType.Month) {
      return +item.year === +currDateObj.year && +item.month === +currDateObj.month;
    }

    return +item.year === +currDateObj.year;
  });
}
function updateArr(action, pre) {
  var arr = _toConsumableArray(pre);

  Object.entries(action).forEach(function (_ref) {
    var _ref2 = _slicedToArray(_ref, 2),
        index = _ref2[0],
        value = _ref2[1];

    arr[+index] = value;
  });
  return arr.filter(function (it) {
    return it !== undefined;
  });
}
function useStateArr(initialValue) {
  var _useReducer = useReducer(function (pre, action) {
    return updateArr(action, pre);
  }, initialValue),
      _useReducer2 = _slicedToArray(_useReducer, 2),
      state = _useReducer2[0],
      setState = _useReducer2[1];

  return [state, setState];
}
function fillDate(item, fallbackDate) {
  return {
    year: item && item.year || fallbackDate && fallbackDate.year || '0000',
    month: item && item.month || fallbackDate && fallbackDate.month || '01',
    date: item && item.date || fallbackDate && fallbackDate.date || '01'
  };
}
function fillTime(item, fallbackTime) {
  return {
    hour: item && item.hour || fallbackTime && fallbackTime.hour || '00',
    minute: item && item.minute || fallbackTime && fallbackTime.minute || '00',
    second: item && item.second || fallbackTime && fallbackTime.second || '00'
  };
}
function useDealDateLimit(min, max) {
  return useMemo(function () {
    var minDate = min && parseDate(min) || undefined;
    var maxDate = max && parseDate(max) || undefined;
    return {
      minDate: fillDate(minDate, {
        year: '0000',
        month: '01',
        date: '01'
      }),
      maxDate: fillDate(maxDate, {
        year: '9999',
        month: '12',
        date: '31'
      })
    };
  }, [min, max]);
}
function useDealTimeLimit(min, max) {
  return useMemo(function () {
    var minTime = min && parseTime(min) || undefined;
    var maxTime = max && parseTime(max) || undefined;
    return {
      minTime: fillTime(minTime, {
        hour: '00',
        minute: '00',
        second: '00'
      }),
      maxTime: fillTime(maxTime, {
        hour: '23',
        minute: '59',
        second: '59'
      })
    };
  }, [min, max]);
}
function useDealDatetimeLimit(min, max, selectedDate) {
  var minArr = useMemo(function () {
    return (min || '').trim().split(/\s+/);
  }, [min]);
  var maxArr = useMemo(function () {
    return (max || '').trim().split(/\s+/);
  }, [max]);

  var _useDealDateLimit = useDealDateLimit(minArr[0], maxArr[0]),
      minDate = _useDealDateLimit.minDate,
      maxDate = _useDealDateLimit.maxDate;

  var compare = useMemo(function () {
    return {
      toMin: minDate && selectedDate ? compareDates(selectedDate, minDate) : 1,
      toMax: maxDate && selectedDate ? compareDates(selectedDate, maxDate) : -1
    };
  }, [selectedDate, minDate, maxDate]);

  var _useDealTimeLimit = useDealTimeLimit(minArr[1], maxArr[1]),
      $minTime = _useDealTimeLimit.minTime,
      $maxTime = _useDealTimeLimit.maxTime;

  var minDatetime = useMemo(function () {
    return minDate ? _objectSpread2(_objectSpread2({}, minDate), $minTime) : undefined;
  }, [$minTime, minDate]);
  var maxDatetime = useMemo(function () {
    return maxDate ? _objectSpread2(_objectSpread2({}, maxDate), $maxTime) : undefined;
  }, [$maxTime, maxDate]);
  var minTime = useMemo(function () {
    if (compare.toMin === 0) return $minTime;
    if (compare.toMin < 0) return {
      hour: '23',
      minute: '59',
      second: '59'
    };
    return {
      hour: '00',
      minute: '00',
      second: '00'
    };
  }, [compare, $minTime]);
  var maxTime = useMemo(function () {
    if (compare.toMax === 0) return $maxTime;
    if (compare.toMax > 0) return {
      hour: '00',
      minute: '00',
      second: '00'
    };
    return {
      hour: '23',
      minute: '59',
      second: '59'
    };
  }, [compare, $maxTime]);
  return {
    minArr: minArr,
    maxArr: maxArr,
    minDate: minDate,
    maxDate: maxDate,
    minTime: minTime,
    maxTime: maxTime,
    minDatetime: minDatetime,
    maxDatetime: maxDatetime
  };
}
function getNextMonthFirstDate(dateInfo) {
  if (!dateInfo) return undefined;
  var month = getMonthByStep(dateInfo, 1);
  return _objectSpread2(_objectSpread2({}, month), {}, {
    date: fillTo(2, 1)
  });
}
function getPreMonthLastDate(dateInfo) {
  if (!dateInfo) return undefined;
  var month = getMonthByStep(dateInfo, -1);
  return _objectSpread2(_objectSpread2({}, month), {}, {
    date: fillTo(2, getMonthLen(month.year, month.month))
  });
}
function formatDate(dateObj) {
  var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DatePickerType.Date;
  if (!dateObj) return '';
  var year = dateObj.year,
      month = dateObj.month,
      date = dateObj.date;
  if (type === DatePickerType.Year) return "".concat(fillTo(4, +year));
  if (type === DatePickerType.Month) return "".concat(fillTo(4, +year), "-").concat(fillTo(2, +month || 1));
  return "".concat(fillTo(4, +year), "-").concat(fillTo(2, +month || 1), "-").concat(fillTo(2, +date || 1));
}
function formatTime(timeObj) {
  var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : TimePickerType.Second;
  if (!timeObj) return '';
  var hour = timeObj.hour,
      minute = timeObj.minute,
      second = timeObj.second;
  if (type === TimePickerType.Hour) return "".concat(fillTo(2, +hour || 0));
  if (type === TimePickerType.Minute) return "".concat(fillTo(2, +hour || 0), ":").concat(fillTo(2, +minute || 0));
  return "".concat(fillTo(2, +hour), ":").concat(fillTo(2, +minute || 0), ":").concat(fillTo(2, +second || 0));
}
function timeEqual(time1, time2, type) {
  if (time1 === time2) return true;

  if (time1 && time2) {
    var equal = time1.hour === time2.hour;
    if (equal && type !== TimePickerType.Hour) equal = time1.minute === time2.minute;
    if (equal && type === TimePickerType.Second) equal = time1.second === time2.second;
    return equal;
  }

  return false;
}
function dateEqual(date1, date2, type) {
  if (date1 === date2) return true;

  if (date1 && date2) {
    var equal = date1.year === date2.year;
    if (equal && type !== DatePickerType.Year) equal = date1.month === date2.month;
    if (equal && type === DatePickerType.Date) equal = date1.date === date2.date;
    return equal;
  }

  return false;
}
function datesEqual(dates1, dates2, type) {
  return dates1.length === dates2.length && Object.keys(dates1).every(function (key) {
    return dateEqual(dates1[+key], dates2[+key], type);
  });
}
function dealDateValue(valArr, type, onError, maxDate, minDate) {
  return valArr.map(function (v) {
    return v && v.trim().split(/\s+/)[0];
  }).filter(Boolean).filter(function ($val) {
    var arr = $val.match(dateReg);
    if (!arr) onError(new Error("Value of date string `".concat($val, "` is invalid")));
    return !!arr;
  }).map(function ($val) {
    var $value = parseDate($val);
    var inRange = dateCompare($value, maxDate, Compare.LessThan, type) && dateCompare($value, minDate, Compare.GreaterThan, type);

    if (!inRange) {
      onError(new Error("Value of date string `".concat($val, "` is out of range")));
      return null;
    }

    return $value;
  }).filter(Boolean).sort(function (a, b) {
    return dateCompare(a, b, Compare.LessThan, type) ? -1 : 1;
  });
}
function dealTimeValue(val, type, onError, maxTime, minTime) {
  val = val && val.trim().split(/\s+/)[0];
  if (!val) return undefined;

  var _ref3 = val && val.match(timeReg) || [],
      _ref4 = _slicedToArray(_ref3, 4),
      matchStr = _ref4[1],
      _hour = _ref4[2],
      _minute = _ref4[3];

  if (!matchStr) {
    onError(new Error("Value of time string `".concat(val, "` is invalid")));
    return undefined;
  }

  var obj = parseTime(type === TimePickerType.Hour ? _hour : type === TimePickerType.Minute ? "".concat(_hour, ":").concat(_minute || '') : matchStr) || undefined;

  if (!timeCompare(obj, minTime, 1, type) || !timeCompare(obj, maxTime, -1, type)) {
    onError(new Error("Value of time string `".concat(val, "` is out of range")));
    return undefined;
  }

  return obj;
}
function dealDatetimeValue(val, onError, max, min) {
  val = val && val.trim();
  if (!val) return {
    date: null,
    time: null
  };
  var arr = val.trim().split(/\s+/);

  if (!dateReg.test(arr[0]) || arr[1] && !timeReg.test(arr[1])) {
    onError(new Error("Value of datetime string `".concat(val, "` is invalid")));
    return {
      date: null,
      time: null
    };
  }

  var date = parseDate(arr[0]);
  var time = parseTime(arr[1]);
  var datetime = date ? _objectSpread2(_objectSpread2({}, date), time) : undefined;

  if (!datetimeCompare(datetime, min, 1) || !datetimeCompare(datetime, max, -1)) {
    onError(new Error("Value of datetime string `".concat(val, "` is out of range")));
    return {
      date: null,
      time: null
    };
  }

  return {
    date: date,
    time: time
  };
}
function useDateWatch(value, type, setSelectedDates, onError, maxDate, minDate, isRange) {
  useWatch(value || '', function (val) {
    setSelectedDates(function (prevDates) {
      if (prevDates && prevDates.map(function (v) {
        return formatDate(v, type);
      }).join(',') === val) {
        return prevDates;
      }

      var dates = val ? dealDateValue(val.split(','), type, onError, maxDate, minDate) : [];
      dates = isRange ? dates.slice(0, 2) : dates;
      return !prevDates || !datesEqual(dates, prevDates, type) ? dates : prevDates;
    });
  }, {
    immediate: true
  });
}
function useSelectedDatesBase(type, watcher) {
  var _useState = useState([]),
      _useState2 = _slicedToArray(_useState, 2),
      selectedDates = _useState2[0],
      set = _useState2[1];

  var setSelectedDates = useCallback(function (action) {
    var equal = false;
    set(function (pre) {
      var dates = (typeof action === 'function' ? action(pre) : action).filter(Boolean);
      var $pre = pre.filter(Boolean);
      equal = datesEqual(dates, $pre, type);
      return equal ? pre : dates;
    });
    return equal;
  }, [set, type]);
  useWatch(selectedDates, function () {
    return watcher && watcher.apply(void 0, arguments);
  });
  return [selectedDates, setSelectedDates];
}
function useSelectedDates(value, type, onError, watcher, maxDate, minDate, isRange) {
  var arr = useSelectedDatesBase(type, watcher);
  useDateWatch(value, type, arr[1], onError, maxDate, minDate, isRange);
  return arr;
}
function getVal(val, fallbackVal) {
  return val !== undefined ? val : fallbackVal;
}
function shouldToggle(inputWrapRef, clearIconRef, toVisible, context, ev) {
  var el = ev && ev.target;

  if (el) {
    if (clearIconRef.current && clearIconRef.current.contains(el)) return false;
    if (!toVisible && inputWrapRef.current && inputWrapRef.current.contains(el)) return false;
  }

  return true;
}
function getPrevYearLastDate(year) {
  return {
    year: fillTo(4, +year - 1),
    month: '12',
    date: '31'
  };
}
function getPrevTenYearLastDate(year) {
  return {
    year: fillTo(4, (Math.ceil(+year / 10) - 1) * 10),
    month: '12',
    date: '31'
  };
}
function getNextYearFirstDate(year) {
  return {
    year: fillTo(4, +year + 1),
    month: '01',
    date: '01'
  };
}
function getNextTenYearFirstDate(year) {
  return {
    year: fillTo(4, Math.ceil(+year / 10) * 10 + 1),
    month: '01',
    date: '01'
  };
}
function useTimeObjBase(type, watcher) {
  var _useState3 = useState(),
      _useState4 = _slicedToArray(_useState3, 2),
      timeObj = _useState4[0],
      set = _useState4[1];

  var setTimeObj = useCallback(function (action) {
    var equal = false;
    set(function (pre) {
      var $time = typeof action === 'function' ? action(pre) : action;
      equal = timeEqual($time, pre, type);
      if (equal) return pre;
      return $time;
    });
    return equal;
  }, [type]);
  useWatch(timeObj, function () {
    return watcher && watcher.apply(void 0, arguments);
  });
  return [timeObj, setTimeObj];
}
function useTimeWatch(value, type, setTimeObj, onError, maxTime, minTime) {
  useWatch(value || '', function (val) {
    setTimeObj(function (prev) {
      if (prev && formatTime(prev, type) === val) return prev;
      var obj = dealTimeValue(val, type, onError, maxTime, minTime);
      return obj || prev;
    });
  }, {
    immediate: true
  });
}
function useTimeObj(value, type, onError, watcher, maxTime, minTime) {
  var arr = useTimeObjBase(type, watcher);
  useTimeWatch(value, type, arr[1], onError, maxTime, minTime);
  return arr;
}

var PickerItems = function PickerItems(_ref) {
  var currDateObj = _ref.currDateObj,
      selectedDates = _ref.selectedDates,
      onClick = _ref.onClick,
      hoverDateObj = _ref.hoverDateObj,
      setHoverObj = _ref.setHoverObj,
      choseType = _ref.choseType,
      isRange = _ref.isRange,
      minDate = _ref.minDate,
      maxDate = _ref.maxDate,
      setShowBtn = _ref.setShowBtn;
  var years = useMemo(function () {
    if (!currDateObj.year) return [];
    return gntYear((Math.ceil(+currDateObj.year / 10) - 1) * 10 + 1, 10, {
      min: minDate && +minDate.year,
      max: maxDate && +maxDate.year
    });
  }, [currDateObj.year, minDate, maxDate]);
  var months = useMemo(function () {
    if (!currDateObj.year) return [];
    return gntMonth(+currDateObj.year, {
      min: minDate,
      max: maxDate
    });
  }, [currDateObj.year, minDate, maxDate]);
  var dates = useMemo(function () {
    if (!currDateObj.year || !currDateObj.month) return [];
    return gntCalendar({
      year: currDateObj.year,
      month: currDateObj.month
    }, {
      min: minDate,
      max: maxDate
    });
  }, [currDateObj.year, currDateObj.month, minDate, maxDate]);
  var pickerItems = useMemo(function () {
    if (choseType === DatePickerType.Year) {
      return years;
    }

    if (choseType === DatePickerType.Month) {
      return months;
    }

    return dates;
  }, [choseType, years, months, dates]);
  useWatch(pickerItems, function () {
    var prev;
    var next;

    if (choseType === DatePickerType.Date) {
      prev = getPreMonthLastDate(currDateObj);
      next = getNextMonthFirstDate(currDateObj);
    } else if (choseType === DatePickerType.Month) {
      prev = getPrevYearLastDate(currDateObj.year);
      next = getNextYearFirstDate(currDateObj.year);
    } else if (choseType === DatePickerType.Year) {
      prev = getPrevTenYearLastDate(currDateObj.year);
      next = getNextTenYearFirstDate(currDateObj.year);
    } else {
      prev = getDateByStep(currDateObj, -1);
      next = getDateByStep(currDateObj, 1);
    }

    setShowBtn({
      prev: dateCompare(prev, minDate, Compare.GreaterThan, choseType),
      next: dateCompare(next, maxDate, Compare.LessThan, choseType)
    });
  }, {
    immediate: true
  });
  var hoverDate = selectedDates[1] || hoverDateObj;

  var renderItem = function renderItem(item, j) {
    var selectedIndex = getDateIndex(item, selectedDates, choseType);
    var inRange = isRange && hoverDate && hoverDateObj && compareDates(fillDate(item, hoverDateObj), fillDate(hoverDateObj)) === DateCompare.Equal;

    if (isRange && hoverDate && !inRange) {
      var compareToHoverDate = hoverDate ? compareDates(fillDate(item, hoverDate), fillDate(hoverDate)) : 0;
      var compareToFirstSelectedDate = selectedDates[0] ? compareDates(fillDate(item, selectedDates[0]), fillDate(selectedDates[0])) : 0;
      inRange = compareToHoverDate > 0 && compareToFirstSelectedDate < 0 || compareToHoverDate < 0 && compareToFirstSelectedDate > 0;
    }

    return /*#__PURE__*/React.createElement("span", {
      className: classNames('item', choseType, {
        'not-in-month': choseType === DatePickerType.Date && !item.isInThisMonth,
        disabled: !item.canBeChose,
        'is-now': item.isNow,
        'is-in-range': inRange,
        selected: selectedIndex !== undefined
      }),
      key: "".concat(choseType, "-").concat(j),
      onClick: function (_onClick) {
        function onClick() {
          return _onClick.apply(this, arguments);
        }

        onClick.toString = function () {
          return _onClick.toString();
        };

        return onClick;
      }(function () {
        return onClick(item, selectedIndex);
      }),
      onMouseEnter: isRange && selectedDates.length === 1 ? function () {
        return setHoverObj && setHoverObj(_objectSpread2(_objectSpread2({}, item), {}, {
          month: item.month || '01',
          date: item.date || '01'
        }));
      } : undefined
    }, item[choseType]);
  };

  var renderYears = years.map(function (yearRow, i) {
    return /*#__PURE__*/React.createElement("div", {
      className: "row-item",
      key: i
    }, yearRow.map(renderItem));
  });
  var renderMonths = months.map(function (monthRow, i) {
    return /*#__PURE__*/React.createElement("div", {
      className: "row-item",
      key: i
    }, monthRow.map(renderItem));
  });
  var renderDates = dates.map(function (dateRow, i) {
    return /*#__PURE__*/React.createElement("div", {
      className: "row-item",
      key: i
    }, dateRow.map(renderItem));
  });

  if (choseType === DatePickerType.Year) {
    return /*#__PURE__*/React.createElement(React.Fragment, null, renderYears);
  }

  if (choseType === DatePickerType.Month) {
    return /*#__PURE__*/React.createElement(React.Fragment, null, renderMonths);
  }

  return /*#__PURE__*/React.createElement(React.Fragment, null, renderDates);
};

var DatePin = React.forwardRef(function (_ref2, ref) {
  var type = _ref2.type,
      selectedDates = _ref2.selectedDates,
      setSelectedDates = _ref2.setSelectedDates,
      multiple = _ref2.multiple,
      isRange = _ref2.isRange,
      hoverDateObj = _ref2.hoverDateObj,
      setHoverObj = _ref2.setHoverObj,
      minDate = _ref2.minDate,
      maxDate = _ref2.maxDate,
      dayStr = _ref2.dayStr,
      onCurrDateObjEmit = _ref2.onCurrDateObjEmit,
      timePickerItems = _ref2.timePickerItems,
      timePickerUpdateScroll = _ref2.timePickerUpdateScroll;

  var _useStateTrackProp = useStateTrackProp(type && type !== DatePickerType.Time ? type : DatePickerType.Date),
      _useStateTrackProp2 = _slicedToArray(_useStateTrackProp, 2),
      choseType = _useStateTrackProp2[0],
      setChoseType = _useStateTrackProp2[1];

  var $dayStr = useMemo(function () {
    return !dayStr || dayStr.length < 7 || dayStr.some(function (day) {
      return typeof day !== 'string';
    }) ? ['日', '一', '二', '三', '四', '五', '六'] : dayStr.slice(0, 7);
  }, [dayStr]);

  var _useState = useState(function () {
    var $value;
    var index = selectedDates.length - 1;
    var date = selectedDates[index];
    if (date) $value = date;else $value = nowDate();
    if (!dateCompare($value, minDate, Compare.GreaterThan, choseType)) return minDate;
    if (!dateCompare($value, maxDate, Compare.LessThan, choseType)) return maxDate;
    return $value;
  }),
      _useState2 = _slicedToArray(_useState, 2),
      currDateObj = _useState2[0],
      setCurrDateObj = _useState2[1];

  useImperativeHandle(ref, function () {
    return {
      updateLocation: function updateLocation(val) {
        val && setCurrDateObj(val);
        setChoseType(type && type !== DatePickerType.Time ? type : DatePickerType.Date);
      }
    };
  });
  useWatch(currDateObj, function (val) {
    return onCurrDateObjEmit && onCurrDateObjEmit(val);
  }, {
    immediate: true
  });

  var $onClick = function $onClick(item, selectedIndex) {
    if (item.canBeChose && (choseType !== DatePickerType.Date || choseType === DatePickerType.Date && item.isInThisMonth)) {
      var setDates = function setDates() {
        return setSelectedDates(isRange ? function (pre) {
          return pre.length > 1 ? [item] : [].concat(_toConsumableArray(pre), [item]).sort(function (a, b) {
            return dateCompare(a, b, Compare.LessThan, type) ? -1 : 1;
          });
        } : multiple ? function (pre) {
          return updateArr(selectedIndex ? _defineProperty({}, selectedIndex, undefined) : _defineProperty({}, selectedDates.length, item), pre);
        } : [item]);
      };

      if (choseType === DatePickerType.Date) {
        setCurrDateObj(function (pre) {
          return _objectSpread2(_objectSpread2({}, pre), {}, {
            date: item.date
          });
        });
        if (type === DatePickerType.Time) setChoseType(DatePickerType.Time);
        setDates();
      } else if (choseType === DatePickerType.Month) {
        setCurrDateObj(function (pre) {
          return _objectSpread2(_objectSpread2({}, pre), {}, {
            month: item.month
          });
        });

        if (type === DatePickerType.Date || type === DatePickerType.Time) {
          setChoseType(DatePickerType.Date);
        } else setDates();
      } else if (choseType === DatePickerType.Year) {
        setCurrDateObj(function (pre) {
          return _objectSpread2(_objectSpread2({}, pre), {}, {
            year: item.year
          });
        });
        if (type !== DatePickerType.Year) setChoseType(DatePickerType.Month);else setDates();
      }
    }
  };

  var _useState3 = useState({
    prev: true,
    next: true
  }),
      _useState4 = _slicedToArray(_useState3, 2),
      showBtn = _useState4[0],
      setShowBtn = _useState4[1];

  var to = function to() {
    var step = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;

    if (choseType === DatePickerType.Year) {
      setCurrDateObj(function (pre) {
        return _objectSpread2(_objectSpread2({}, pre), {}, {
          year: fillTo(4, +pre.year + 10 * step)
        });
      });
    } else if (choseType === DatePickerType.Month) {
      setCurrDateObj(function (pre) {
        return _objectSpread2(_objectSpread2({}, pre), {}, {
          year: fillTo(4, +pre.year + step)
        });
      });
    } else if (choseType === DatePickerType.Date) {
      setCurrDateObj(function (pre) {
        return _objectSpread2(_objectSpread2({}, pre), getMonthByStep(pre, step));
      });
    } else {
      var date = getDateByStep(currDateObj, step);

      if (date && dateCompare(date, minDate, Compare.GreaterThan) && dateCompare(date, maxDate, Compare.LessThan)) {
        setCurrDateObj(date);
      }
    }
  };

  useWatch(choseType, function (val) {
    if (val === DatePickerType.Time && timePickerUpdateScroll) {
      var timer = setTimeout(timePickerUpdateScroll);
      return function () {
        return clearTimeout(timer);
      };
    }
  }, {
    immediate: true
  });
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PickerHead, {
    choseType: choseType,
    setChoseType: setChoseType,
    currDateObj: currDateObj,
    showBtn: showBtn,
    onPrev: function onPrev() {
      return to(-1);
    },
    onNext: function onNext() {
      return to(1);
    }
  }), choseType !== DatePickerType.Time ? /*#__PURE__*/React.createElement("div", {
    className: "picker-items dates"
  }, choseType === DatePickerType.Date && /*#__PURE__*/React.createElement("div", {
    className: "row-item h"
  }, $dayStr.map(function (item, i) {
    return /*#__PURE__*/React.createElement("span", {
      className: "item date",
      key: i
    }, item);
  })), /*#__PURE__*/React.createElement(PickerItems, {
    currDateObj: currDateObj,
    choseType: choseType,
    selectedDates: selectedDates,
    hoverDateObj: hoverDateObj,
    setHoverObj: setHoverObj,
    onClick: $onClick,
    isRange: isRange,
    minDate: minDate,
    maxDate: maxDate,
    setShowBtn: setShowBtn
  })) : timePickerItems);
});

var DateIcon = function DateIcon() {
  return /*#__PURE__*/React.createElement("svg", {
    viewBox: "0 0 1024 1024",
    xmlns: "http://www.w3.org/2000/svg",
    width: "200",
    height: "200"
  }, /*#__PURE__*/React.createElement("path", {
    d: "M555.62352313 447.01489666L468.34822999 447.01489666 468.34822999 534.2901898 555.62352313 534.2901898 555.62352313 447.01489666ZM555.62352313 599.73960073L468.34822999 599.73960073 468.34822999 687.01489386 555.62352313 687.01489386 555.62352313 599.73960073ZM904.72469469 97.94195979L817.44940156 97.94195979 817.44940156 32.49254886C817.44940156 20.43607855 807.67999063 10.66666667 795.62352031 10.66666667 783.56704906 10.66666667 773.82587281 20.43607855 773.82587281 32.49254886L773.82587281 97.94195979 250.174115 97.94195979 250.174115 32.49254886C250.174115 20.43607855 240.40470313 10.66666667 228.34823281 10.66666667 216.2917625 10.66666667 206.55058625 20.43607855 206.55058625 32.49254886L206.55058625 97.94195979 119.27529312 97.94195979C71.07764656 97.94195979 32 137.01960636 32 185.21725292L32 316.11607479 32 359.76783917 32 883.39136136C32 931.58900792 71.07764656 970.66665448 119.27529312 970.66665448L904.72469469 970.66665448C952.92234125 970.66665448 991.99998781 931.58900792 991.99998781 883.39136136L991.99998781 359.76783917 991.99998781 316.11607479 991.99998781 185.21725292C991.99998781 137.01960636 952.92234125 97.94195979 904.72469469 97.94195979ZM948.34822345 883.39136136C948.34822345 907.4760673 928.80940063 927.01489012 904.72469469 927.01489012L119.27529312 927.01489012C95.1623525 927.01489012 75.62352875 907.4760673 75.62352875 883.39136136L75.62352875 359.76783917 948.34822345 359.76783917 948.34822345 883.39136136ZM948.34822345 316.11607479L75.62352875 316.11607479 75.62352875 185.21725292C75.62352875 161.10431229 95.1623525 141.56548855 119.27529312 141.56548855L206.55058625 141.56548855 206.55058625 207.01489948C206.55058625 219.0713698 216.2917625 228.84078167 228.34823281 228.84078167 240.40470313 228.84078167 250.174115 219.0713698 250.174115 207.01489948L250.174115 141.56548855 773.82587281 141.56548855 773.82587281 207.01489948C773.82587281 219.0713698 783.56704906 228.84078167 795.62352031 228.84078167 807.67999063 228.84078167 817.44940156 219.0713698 817.44940156 207.01489948L817.44940156 141.56548855 904.72469469 141.56548855C928.80940063 141.56548855 948.34822345 161.10431229 948.34822345 185.21725292L948.34822345 316.11607479ZM773.82587281 599.73960073L686.55057969 599.73960073 686.55057969 687.01489386 773.82587281 687.01489386 773.82587281 599.73960073ZM773.82587281 447.01489666L686.55057969 447.01489666 686.55057969 534.2901898 773.82587281 534.2901898 773.82587281 447.01489666ZM555.62352313 752.49253948L468.34822999 752.49253948 468.34822999 839.76783261 555.62352313 839.76783261 555.62352313 752.49253948ZM337.44940812 752.49253948L250.174115 752.49253948 250.174115 839.76783261 337.44940812 839.76783261 337.44940812 752.49253948ZM337.44940812 447.01489666L250.174115 447.01489666 250.174115 534.2901898 337.44940812 534.2901898 337.44940812 447.01489666ZM337.44940812 599.73960073L250.174115 599.73960073 250.174115 687.01489386 337.44940812 687.01489386 337.44940812 599.73960073Z",
    fill: "currentColor"
  }));
};
var TimeIcon = function TimeIcon() {
  return /*#__PURE__*/React.createElement("svg", {
    viewBox: "0 0 1024 1024",
    xmlns: "http://www.w3.org/2000/svg",
    width: "200",
    height: "200"
  }, /*#__PURE__*/React.createElement("path", {
    d: "M512 997.45185223C245.0014811 997.45185223 26.54814777 778.9985189 26.54814777 512 26.54814777 245.0014811 245.0014811 26.54814777 512 26.54814777s485.45185223 218.45333333 485.45185223 485.45185223C997.45185223 778.9985189 778.9985189 997.45185223 512 997.45185223zM512 75.09333333C271.70133333 75.09333333 75.09333333 271.70133333 75.09333333 512c0 240.29866667 196.608 436.90666667 436.90666667 436.90666667 240.29866667 0 436.90666667-196.608 436.90666667-436.90666667C948.90666667 271.70133333 752.29866667 75.09333333 512 75.09333333zM681.90814777 701.32622222c-12.13629667 7.28177778-26.69985223 2.42725888-33.98163001-9.70903665l-157.77185223-182.04444445c-2.42725888-7.28177778-4.8545189-12.13629667-2.42725888-19.41807445 0 0 0 0 0-2.42725888L487.72740779 220.72888889c0-14.56355555 9.70903666-24.27259221 24.27259221-24.27259222s24.27259221 9.70903666 24.27259221 24.27259222l0 266.9985189c0 0 0 0 0 2.42725888l152.91733334 177.18992554C696.47170333 679.48088889 691.61718557 694.04444445 681.90814777 701.32622222z",
    fill: "currentColor"
  }));
};

var InputType;

(function (InputType) {
  InputType["Single"] = "single";
  InputType["Range"] = "range";
})(InputType || (InputType = {}));

var Input = function Input(_ref) {
  var inputRef = _ref.inputRef,
      clearIconWrapRef = _ref.clearIconWrapRef,
      preIcon = _ref.preIcon,
      type = _ref.type,
      id = _ref.id,
      placeholder = _ref.placeholder,
      secondPlaceholder = _ref.secondPlaceholder,
      isFocus = _ref.isFocus,
      readonly = _ref.readonly,
      clearIcon = _ref.clearIcon,
      rangeSeparator = _ref.rangeSeparator,
      onClear = _ref.onClear,
      onPressEnterWhenAllInputHasValue = _ref.onPressEnterWhenAllInputHasValue;

  var onKeyDown = function onKeyDown(index, ev) {
    if (ev.keyCode === 13) {
      var i = Object.keys(inputRef.current).find(function ($i) {
        return !inputRef.current[+$i].value;
      });
      var allEmpty = Object.keys(inputRef.current).every(function ($i) {
        return !inputRef.current[+$i].value;
      });

      if (i && !allEmpty) {
        if (+i > index) inputRef.current[+i].focus();else onPressEnterWhenAllInputHasValue();
      } else {
        onPressEnterWhenAllInputHasValue(true);
        inputRef.current[index].blur();
      }
    }
  };

  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
    className: "picker-icon"
  }, preIcon), /*#__PURE__*/React.createElement("div", {
    className: classNames('picker-input-wrap', {
      'is-focus': isFocus
    })
  }, /*#__PURE__*/React.createElement("input", {
    className: classNames('picker-input', {
      'range-picker-input': type === InputType.Range
    }),
    id: id,
    placeholder: placeholder,
    readOnly: readonly,
    onKeyDown: onKeyDown.bind(null, 0),
    ref: function ref(_ref2) {
      return inputRef.current[0] = _ref2;
    }
  }), type === InputType.Range && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
    className: "range-separator"
  }, rangeSeparator || '至'), /*#__PURE__*/React.createElement("input", {
    className: "picker-input range-picker-input",
    id: id,
    placeholder: secondPlaceholder || placeholder,
    readOnly: readonly,
    onKeyDown: onKeyDown.bind(null, 1),
    ref: function ref(_ref3) {
      return inputRef.current[1] = _ref3;
    }
  }))), /*#__PURE__*/React.createElement("div", {
    className: "icon-clear-wrapper",
    onClick: onClear,
    ref: clearIconWrapRef
  }, clearIcon || /*#__PURE__*/React.createElement("span", {
    style: {
      fontSize: '0.8em',
      color: '#d3d3d3'
    }
  }, "X")));
};

var DatePicker = function DatePicker(_ref) {
  var id = _ref.id,
      value = _ref.value,
      _ref$type = _ref.type,
      type = _ref$type === void 0 ? DatePickerType.Date : _ref$type,
      placeholder = _ref.placeholder,
      _ref$min = _ref.min,
      min = _ref$min === void 0 ? '' : _ref$min,
      _ref$max = _ref.max,
      max = _ref$max === void 0 ? '' : _ref$max,
      readonly = _ref.readonly,
      dayStr = _ref.dayStr,
      popperProps = _ref.popperProps,
      clearIcon = _ref.clearIcon,
      preIcon = _ref.preIcon,
      multiple = _ref.multiple,
      confirmBtnStr = _ref.confirmBtnStr,
      onChange = _ref.onChange,
      onError = _ref.onError;

  var $onError = onError || function (err) {
    return console.warn(err);
  };

  var $popperProps = usePopperProps(popperProps);
  var popperRef = useRef(null);
  var clearIconWrapRef = useRef(null);
  var inputWrapRef = useRef(null);
  var inputRef = useRef([]);

  var _useState = useState(false),
      _useState2 = _slicedToArray(_useState, 2),
      isFocus = _useState2[0],
      setFocus = _useState2[1];

  var myValue = useRef(value || '');
  useWatch(value, function (val) {
    return myValue.current = val || '';
  });

  var _useDealDateLimit = useDealDateLimit(min, max),
      minDate = _useDealDateLimit.minDate,
      maxDate = _useDealDateLimit.maxDate;

  var updateInputValue = function updateInputValue(val) {
    return inputRef.current[0] && (inputRef.current[0].value = val);
  };

  var hidePopper = function hidePopper() {
    return popperRef.current && popperRef.current.hide();
  };

  var $onChange = function $onChange(val) {
    onChange && onChange(val);
    updateInputValue(val);
    myValue.current = val;
    if (val) hidePopper();
  };

  var getValue = function getValue($selectedDates) {
    return multiple ? $selectedDates.map(function (val) {
      return formatDate(val, type);
    }).join(',') : formatDate($selectedDates[0], type);
  };

  var onChose = function onChose($selectedDates) {
    return $onChange(getValue($selectedDates));
  };

  var _useSelectedDates = useSelectedDates(value, type, $onError, function (val) {
    return onChose(val);
  }, maxDate, minDate),
      _useSelectedDates2 = _slicedToArray(_useSelectedDates, 2),
      selectedDates = _useSelectedDates2[0],
      setSelectedDates = _useSelectedDates2[1];

  var _useStateTrackProp = useStateTrackProp(selectedDates),
      _useStateTrackProp2 = _slicedToArray(_useStateTrackProp, 2),
      tempDates = _useStateTrackProp2[0],
      setTempDates = _useStateTrackProp2[1];

  var inputCorrect = function inputCorrect() {
    var shouldPopperHide = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
    var $value = inputRef.current[0] && inputRef.current[0].value;
    var dates = $value !== myValue.current ? dealDateValue($value.split(','), type, $onError, maxDate, minDate) : selectedDates;
    if (shouldPopperHide) hidePopper();
    updateInputValue(getValue(dates));
    setSelectedDates(dates);
  };

  var datePinRef = useRef(null);
  return /*#__PURE__*/React.createElement("div", {
    className: "date-picker",
    ref: inputWrapRef
  }, /*#__PURE__*/React.createElement(Input, {
    id: id,
    placeholder: placeholder || DatePickerTypeRef[type].placeholder,
    readonly: readonly,
    isFocus: isFocus,
    inputRef: inputRef,
    clearIconWrapRef: clearIconWrapRef,
    preIcon: preIcon || /*#__PURE__*/React.createElement(DateIcon, null),
    clearIcon: clearIcon,
    onPressEnterWhenAllInputHasValue: inputCorrect,
    onClear: function onClear() {
      return setSelectedDates([]);
    }
  }), !readonly && ReactDOM.createPortal( /*#__PURE__*/React.createElement(ReactPopper, Object.assign({}, $popperProps, {
    className: classNames('date-picker-popper', $popperProps.className),
    referenceRef: function referenceRef() {
      return inputWrapRef.current;
    },
    ref: popperRef,
    shouldToggle: shouldToggle.bind(null, inputWrapRef, clearIconWrapRef),
    afterToggle: function afterToggle(visible, context) {
      if (visible) {
        datePinRef.current.updateLocation(selectedDates[selectedDates.length - 1]);
      } else inputCorrect();

      setFocus(visible);
      $popperProps.afterToggle && $popperProps.afterToggle(visible, context);
    }
  }), /*#__PURE__*/React.createElement("div", {
    className: "picker"
  }, /*#__PURE__*/React.createElement(DatePin, {
    type: type,
    minDate: minDate,
    maxDate: maxDate,
    dayStr: dayStr,
    selectedDates: multiple ? tempDates : selectedDates,
    setSelectedDates: multiple ? setTempDates : setSelectedDates,
    multiple: multiple,
    ref: datePinRef
  }), multiple && /*#__PURE__*/React.createElement("div", {
    className: "btns"
  }, /*#__PURE__*/React.createElement("span", {
    className: "btn btn-sure",
    onClick: function onClick() {
      setSelectedDates(tempDates);
      hidePopper();
    }
  }, confirmBtnStr || '确定')))), document.body));
};

var DateRangePicker = function DateRangePicker(_ref) {
  var id = _ref.id,
      value = _ref.value,
      _ref$type = _ref.type,
      type = _ref$type === void 0 ? DatePickerType.Date : _ref$type,
      placeholder = _ref.placeholder,
      secondPlaceholder = _ref.secondPlaceholder,
      _ref$min = _ref.min,
      min = _ref$min === void 0 ? '' : _ref$min,
      _ref$max = _ref.max,
      max = _ref$max === void 0 ? '' : _ref$max,
      readonly = _ref.readonly,
      dayStr = _ref.dayStr,
      popperProps = _ref.popperProps,
      clearIcon = _ref.clearIcon,
      preIcon = _ref.preIcon,
      onChange = _ref.onChange,
      rangeSeparator = _ref.rangeSeparator,
      onError = _ref.onError,
      onSelectStartDate = _ref.onSelectStartDate;

  var $onError = onError || function (err) {
    return console.warn(err);
  };

  var $popperProps = usePopperProps(popperProps);
  var popperRef = useRef(null);
  var clearIconWrapRef = useRef(null);
  var inputWrapRef = useRef(null);
  var inputRef = useRef([]);

  var _useState = useState(false),
      _useState2 = _slicedToArray(_useState, 2),
      isFocus = _useState2[0],
      setFocus = _useState2[1];

  var myValue = useRef(value || ['', '']);
  useWatch(value, function (val) {
    return myValue.current = ['', ''].map(function (v, i) {
      return val && val[i] || '';
    });
  });

  var hidePopper = function hidePopper() {
    return popperRef.current && popperRef.current.hide();
  };

  var _useDealDateLimit = useDealDateLimit(min, max),
      minDate = _useDealDateLimit.minDate,
      maxDate = _useDealDateLimit.maxDate;

  var updateInputValue = function updateInputValue(val) {
    val.slice(0, 2).forEach(function (v, i) {
      if (inputRef.current[i]) inputRef.current[i].value = v;
    });
  };

  var $onChange = function $onChange(val) {
    var $val = [getVal(val[0], myValue.current[0]), getVal(val[1], myValue.current[1])];

    if (!dateCompare($val[0], $val[1], Compare.LessThan)) {
      $val.reverse();
    }

    updateInputValue($val);
    myValue.current = $val;
    var allFill = myValue.current.every(Boolean);

    if (allFill || myValue.current.every(function (v) {
      return !v;
    })) {
      onChange && onChange(_toConsumableArray(myValue.current));
      if (allFill) hidePopper();
    }
  };

  var getValue = function getValue($selectedDates) {
    return ['', ''].map(function (v, i) {
      return formatDate($selectedDates[i], type);
    });
  };

  var onChose = function onChose($selectedDates) {
    $onChange(getValue($selectedDates));
  };

  var _useSelectedDates = useSelectedDates(value && value.join(','), type, $onError, function (val) {
    return onChose(val);
  }, maxDate, minDate, true),
      _useSelectedDates2 = _slicedToArray(_useSelectedDates, 2),
      selectedDates = _useSelectedDates2[0],
      setSelectedDates = _useSelectedDates2[1];

  var inputCorrect = function inputCorrect() {
    var shouldPopperHide = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
    var $value = inputRef.current.map(function (input) {
      return input ? input.value : '';
    });
    var dates = $value.some(function (v, i) {
      return v !== myValue.current[i];
    }) ? dealDateValue($value, type, $onError, maxDate, minDate) : selectedDates;
    if (shouldPopperHide) hidePopper();
    updateInputValue(getValue(da