@kdcloudjs/kdesign 1.0.2

package/es/date-picker/panel/time/time.js

@@ -0,0 +1,252 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
+import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import * as React from 'react';
+import classNames from 'classnames';
+import TimeColumn from './time-column';
+import { formatDate, newDate, setTime as utilSetTime } from '../../utils/date-fns';
+import Context from '../../context';
+import useStateMemo from '../../hooks/use-state-memo';
+import { leftPad } from '../../utils';
+import Header from '../header/header'; // export interface TimePanelProps extends SharedTimeProps {
+//   format?: string
+//   // active?: boolean
+// }
+
+function shouldUnitsUpdate(prevUnits, nextUnits) {
+  if (prevUnits.length !== nextUnits.length) return true;
+
+  for (var i = 0; i < prevUnits.length; i += 1) {
+    if (prevUnits[i].disabled !== nextUnits[i].disabled) return true;
+  }
+
+  return false;
+}
+
+function TimePanel(props) {
+  var context = React.useContext(Context);
+  var prefixCls = context.prefixCls,
+      dateValue = context.dateValue,
+      onSelect = context.onSelect,
+      _context$originHour = context.originHour,
+      originHour = _context$originHour === void 0 ? -1 : _context$originHour,
+      _context$minute = context.minute,
+      minute = _context$minute === void 0 ? -1 : _context$minute,
+      _context$second = context.second,
+      second = _context$second === void 0 ? -1 : _context$second,
+      _context$hours = context.hours,
+      rawHours = _context$hours === void 0 ? [] : _context$hours,
+      _context$minutes = context.minutes,
+      minutes = _context$minutes === void 0 ? [] : _context$minutes,
+      _context$seconds = context.seconds,
+      seconds = _context$seconds === void 0 ? [] : _context$seconds,
+      disabledTimePanel = context.disabledTimePanel;
+  var picker = props.picker,
+      _props$format = props.format,
+      format = _props$format === void 0 ? 'HH:mm:ss' : _props$format,
+      showHour = props.showHour,
+      showMinute = props.showMinute,
+      showSecond = props.showSecond,
+      _props$use12Hours = props.use12Hours,
+      use12Hours = _props$use12Hours === void 0 ? false : _props$use12Hours,
+      hideDisabledOptions = props.hideDisabledOptions; // console.log(rawHours)
+
+  if (disabledTimePanel) {
+    originHour = -1;
+    minute = -1;
+    second = -1;
+  } // const bodyOperationRef = React.useRef<BodyOperationRef>()
+  // ======================= Keyboard =======================
+  // const [activeColumnIndex, setActiveColumnIndex] = React.useState(-1)
+  // debugger
+
+
+  var value = dateValue; // if (mergedActivePickerIndex === 0) {
+  //   value = rangeValue![0]
+  // } else if (mergedActivePickerIndex === 1) {
+  //   value = rangeValue![1]
+  // }
+
+  var columns = [];
+  var columnPrefixCls = "".concat(prefixCls, "-time");
+  var isPM; // const originHour = value ? getHours(value) : -1
+
+  var hour = originHour; // const minute = value ? getMinutes(value) : -1
+  // const second = value ? getSeconds(value) : -1
+
+  var setTime = function setTime(isPM, newHour, newMinute, newSecond) {
+    var _a, _b, _c;
+
+    var date = value || newDate();
+
+    var _hour = newHour > -1 ? newHour : (_a = _findInstanceProperty(rawHours).call(rawHours, function (n) {
+      return !n.disabled;
+    })) === null || _a === void 0 ? void 0 : _a.value;
+
+    var _minute = newMinute > -1 ? newMinute : (_b = _findInstanceProperty(minutes).call(minutes, function (n) {
+      return !n.disabled;
+    })) === null || _b === void 0 ? void 0 : _b.value;
+
+    var _second = newSecond > -1 ? newSecond : (_c = _findInstanceProperty(seconds).call(seconds, function (n) {
+      return !n.disabled;
+    })) === null || _c === void 0 ? void 0 : _c.value;
+
+    if (!_hour && _hour !== 0) {
+      _hour = -1;
+    }
+
+    if (!_minute && _minute !== 0) {
+      _minute = -1;
+    }
+
+    if (!_second && _second !== 0) {
+      _second = -1;
+    } // 所有时或分或秒 disabled 时，返回空（date-time）
+
+
+    if (_hour > -1 && _minute > -1 && _second > -1) {
+      date = utilSetTime(date, {
+        hour: !use12Hours || !isPM ? _hour : _hour + 12,
+        minute: _minute,
+        second: _second
+      });
+      return date;
+    }
+
+    return null;
+  }; // const rawHours = generateUnits(0, 23, hourStep, disabledHours && disabledHours())
+
+
+  var memorizedRawHours = useStateMemo(function () {
+    return rawHours;
+  }, rawHours, shouldUnitsUpdate);
+
+  if (use12Hours) {
+    isPM = hour >= 12;
+    hour %= 12;
+  }
+
+  var _React$useMemo = React.useMemo(function () {
+    if (!use12Hours) {
+      return [false, false];
+    }
+
+    var AMPMDisabled = [true, true];
+    memorizedRawHours.forEach(function (_ref) {
+      var disabled = _ref.disabled,
+          hourValue = _ref.value;
+      if (disabled) return;
+
+      if (hourValue >= 12) {
+        AMPMDisabled[1] = false;
+      } else {
+        AMPMDisabled[0] = false;
+      }
+    });
+    return AMPMDisabled;
+  }, [use12Hours, memorizedRawHours]),
+      _React$useMemo2 = _slicedToArray(_React$useMemo, 2),
+      AMDisabled = _React$useMemo2[0],
+      PMDisabled = _React$useMemo2[1];
+
+  var hours = React.useMemo(function () {
+    var _context;
+
+    if (!use12Hours) return memorizedRawHours;
+    return _mapInstanceProperty(_context = _filterInstanceProperty(memorizedRawHours).call(memorizedRawHours, isPM ? function (hourMeta) {
+      return hourMeta.value >= 12;
+    } : function (hourMeta) {
+      return hourMeta.value < 12;
+    })).call(_context, function (hourMeta) {
+      var hourValue = hourMeta.value % 12;
+      var hourLabel = hourValue === 0 ? '12' : leftPad(hourValue, 2);
+      return _extends(_extends({}, hourMeta), {
+        label: hourLabel,
+        value: hourValue
+      });
+    });
+  }, [use12Hours, memorizedRawHours, isPM]); // const minutes = generateUnits(0, 59, minuteStep, disabledMinutes && disabledMinutes(originHour))
+  // const seconds = generateUnits(0, 59, secondStep, disabledSeconds && disabledSeconds(originHour, minute))
+
+  function addColumnNode(condition, node, columnValue, units, onColumnSelect) {
+    if (condition !== false) {
+      columns.push({
+        node: /*#__PURE__*/React.cloneElement(node, {
+          prefixCls: columnPrefixCls,
+          value: columnValue,
+          onSelect: onColumnSelect,
+          units: units,
+          selectValue: value,
+          hideDisabledOptions: hideDisabledOptions
+        })
+      });
+    }
+  }
+
+  addColumnNode(showHour, /*#__PURE__*/React.createElement(TimeColumn, {
+    key: "hour"
+  }), hour, hours, function (num) {
+    var time = setTime(isPM, num, minute, second);
+
+    if (time) {
+      onSelect(time, 'mouse');
+    }
+  });
+  addColumnNode(showMinute, /*#__PURE__*/React.createElement(TimeColumn, {
+    key: "minute"
+  }), minute, minutes, function (num) {
+    var time = setTime(isPM, hour, num, second);
+
+    if (time) {
+      onSelect(time, 'mouse');
+    }
+  });
+  addColumnNode(showSecond, /*#__PURE__*/React.createElement(TimeColumn, {
+    key: "second"
+  }), second, seconds, function (num) {
+    var time = setTime(isPM, hour, minute, num);
+
+    if (time) {
+      onSelect(time, 'mouse');
+    }
+  });
+  var PMIndex = -1;
+
+  if (typeof isPM === 'boolean') {
+    PMIndex = isPM ? 1 : 0;
+  }
+
+  addColumnNode(use12Hours === true, /*#__PURE__*/React.createElement(TimeColumn, {
+    key: "12hours"
+  }), PMIndex, [{
+    label: 'AM',
+    value: 0,
+    disabled: AMDisabled
+  }, {
+    label: 'PM',
+    value: 1,
+    disabled: PMDisabled
+  }], function (num) {
+    var time = setTime(!!num, hour, minute, second);
+
+    if (time) {
+      onSelect(time, 'mouse');
+    }
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(prefixCls, "-time"), {// [`${panelPrefixCls}-active`]: active,
+    })
+  }, picker !== 'time' ? /*#__PURE__*/React.createElement(Header, {
+    className: "".concat(prefixCls, "-time-header")
+  }, !disabledTimePanel && value ? formatDate(value, format) : null) : null, /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(prefixCls, "-content"), {// [`${panelPrefixCls}-active`]: active,
+    })
+  }, _mapInstanceProperty(columns).call(columns, function (_ref2) {
+    var node = _ref2.node;
+    return node;
+  })));
+}
+
+export default TimePanel;

package/es/date-picker/panel/week/week.d.ts

@@ -0,0 +1,10 @@
+import { DateType, PickerMode } from '../../interface';
+export interface WeekProps {
+    day: DateType;
+    picker: PickerMode;
+    showWeekNumber?: boolean;
+    showTime?: boolean;
+    disabledDate?: (date: DateType) => boolean;
+}
+declare function Week(props: WeekProps): JSX.Element;
+export default Week;

package/es/date-picker/panel/week/week.js

@@ -0,0 +1,250 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
+import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
+import React, { useContext } from 'react';
+import classnames from 'classnames';
+import Context from '../../context';
+import { getDate, getStartOfWeek, addDays, newDate, getWeek, getMonth, isAfter, isSameMonth, getEndOfWeek, setTime } from '../../utils/date-fns';
+import { getHours, getMinutes, getSeconds, isBefore, isSameDay, isSameWeek } from 'date-fns';
+import useRangeCls from '../../hooks/use-range-cls';
+
+var formatWeekNumber = function formatWeekNumber(date) {
+  return getWeek(date);
+};
+
+var isDisabledTime = function isDisabledTime(value, units) {
+  var _a;
+
+  return (_a = _findInstanceProperty(units).call(units, function (n) {
+    return n.value === value;
+  })) === null || _a === void 0 ? void 0 : _a.disabled;
+};
+
+function Week(props) {
+  var context = useContext(Context);
+  var prefixCls = context.prefixCls,
+      dateValue = context.dateValue,
+      rangeValue = context.rangeValue,
+      panelPosition = context.panelPosition,
+      hoverRangedValue = context.hoverRangedValue,
+      viewDate = context.viewDate,
+      _context$hours = context.hours,
+      hours = _context$hours === void 0 ? [] : _context$hours,
+      _context$minutes = context.minutes,
+      minutes = _context$minutes === void 0 ? [] : _context$minutes,
+      _context$seconds = context.seconds,
+      seconds = _context$seconds === void 0 ? [] : _context$seconds,
+      disabledTimePanel = context.disabledTimePanel,
+      onSelect = context.onSelect,
+      onDateMouseEnter = context.onDateMouseEnter,
+      onDateMouseLeave = context.onDateMouseLeave;
+  var showWeekNumber = props.showWeekNumber,
+      day = props.day,
+      picker = props.picker,
+      showTime = props.showTime,
+      disabledDate = props.disabledDate;
+  var currentMonth = getMonth(viewDate);
+
+  var _dateValue;
+
+  if (panelPosition) {
+    _dateValue = rangeValue;
+  } else {
+    _dateValue = dateValue;
+  }
+
+  var hasFindToday = false;
+  var hasFindSelected = false;
+
+  var getSelected = function getSelected(date) {
+    if (hasFindSelected) return false;
+
+    if (Array.isArray(_dateValue)) {
+      return _dateValue[0] && isSameDay(_dateValue[0], date) || _dateValue[1] && isSameDay(_dateValue[1], date);
+    } else {
+      if (_dateValue && isSameDay(_dateValue, date)) {
+        hasFindSelected = true;
+        return true;
+      }
+
+      return false;
+    }
+  };
+
+  var getToday = function getToday(date) {
+    if (hasFindToday) return false;
+    hasFindToday = isSameDay(date, newDate()); // 如果 today 被选中则返回 false
+
+    if (hasFindToday) {
+      if (Array.isArray(_dateValue)) {
+        return !(_dateValue[0] && isSameDay(_dateValue[0], date) || _dateValue[1] && isSameDay(_dateValue[1], date));
+      } else {
+        return _dateValue ? !isSameDay(_dateValue, date) : true;
+      }
+    }
+  };
+
+  var getWeekToday = function getWeekToday(date) {
+    if (hasFindToday) return false;
+    hasFindToday = isSameDay(date, newDate());
+    return hasFindToday;
+  };
+
+  var getWeekSelected = function getWeekSelected(date) {
+    if (hasFindSelected) return false;
+
+    if (Array.isArray(_dateValue)) {
+      // 如果是 endSelected 需要判断选中的周最后一天是否为本月
+      return _dateValue[0] && isSameWeek(_dateValue[0], date) || _dateValue[1] && isSameWeek(_dateValue[1], date) && isSameMonth(getEndOfWeek(_dateValue[1]), viewDate);
+    } else {
+      if (_dateValue && isSameWeek(_dateValue, date)) {
+        hasFindSelected = true;
+        return true;
+      }
+
+      return false;
+    }
+  };
+
+  var getDayClassNames = function getDayClassNames(date) {
+    var _classnames, _context, _context2;
+
+    return picker === 'date' ? classnames("".concat(prefixCls, "-calendar-text"), (_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-calendar-text-selected"), getSelected(date)), _defineProperty(_classnames, "".concat(prefixCls, "-calendar-text-today"), getToday(date)), _classnames)) : picker === 'week' ? classnames(_concatInstanceProperty(_context = "".concat(prefixCls, "-calendar-")).call(_context, picker, "-text"), _defineProperty({}, _concatInstanceProperty(_context2 = "".concat(prefixCls, "-calendar-")).call(_context2, picker, "-text-today"), getWeekToday(date))) : '';
+  };
+
+  var getRangeCls = useRangeCls({
+    prefixCls: prefixCls,
+    rangeValue: rangeValue,
+    hoverRangedValue: hoverRangedValue,
+    isRange: !!panelPosition,
+    isCurrentMonth: function isCurrentMonth(date) {
+      return isSameMonth(date, viewDate);
+    },
+    isAfterStart: function isAfterStart(date, rangedValue) {
+      return rangedValue[0] ? isAfter(date, rangedValue[0]) : false;
+    },
+    isBeforeEnd: function isBeforeEnd(date, rangedValue) {
+      return rangedValue[1] ? isBefore(date, rangedValue[1]) : false;
+    },
+    isStart: function isStart(date, rangedValue) {
+      return rangedValue[0] ? isSameDay(date, rangedValue[0]) : false;
+    },
+    isEnd: function isEnd(date, rangedValue) {
+      if (rangedValue[1] && isSameDay(date, rangedValue[1])) {
+        if (picker === 'date') {
+          return true;
+        } else {
+          return isSameMonth(getStartOfWeek(date), getEndOfWeek(date));
+        }
+      }
+
+      return false;
+    }
+  });
+
+  var getEffectTime = function getEffectTime(date) {
+    if (showTime && !disabledTimePanel) {
+      // debugger
+      var dateHour = getHours(date);
+      var dateMinute = getMinutes(date);
+      var dateSecond = getSeconds(date);
+      var hour = isDisabledTime(dateHour, hours) ? _findInstanceProperty(hours).call(hours, function (n) {
+        return !n.disabled;
+      }).value : dateHour;
+      var minute = isDisabledTime(dateMinute, minutes) ? _findInstanceProperty(minutes).call(minutes, function (n) {
+        return !n.disabled;
+      }).value : dateMinute;
+      var second = isDisabledTime(dateSecond, seconds) ? _findInstanceProperty(seconds).call(seconds, function (n) {
+        return !n.disabled;
+      }).value : dateSecond;
+      date = setTime(date, {
+        hour: hour,
+        minute: minute,
+        second: second
+      });
+    }
+
+    return date;
+  };
+
+  var handleDayClick = function handleDayClick(day) {
+    if (!(disabledDate && disabledDate(day))) {
+      onSelect(day, 'mouse');
+    }
+  };
+
+  var renderDays = function renderDays() {
+    var _context3, _classnames4;
+
+    var startOfWeek = getStartOfWeek(day);
+    var days = [];
+    var weekNumber = formatWeekNumber(startOfWeek);
+
+    if (showWeekNumber) {
+      var calenderWeekNumberCls = classnames("".concat(prefixCls, "-calendar-weeknumber"));
+      days.push( /*#__PURE__*/React.createElement("div", {
+        key: "W",
+        className: calenderWeekNumberCls
+      }, weekNumber));
+    }
+
+    var week = _concatInstanceProperty(days).call(days, _mapInstanceProperty(_context3 = [0, 1, 2, 3, 4, 5, 6]).call(_context3, function (offset) {
+      var _classnames3;
+
+      var day = addDays(startOfWeek, offset);
+      var date = getDate(day);
+      var now;
+
+      if (panelPosition === 'left') {
+        now = rangeValue && rangeValue[0] || viewDate;
+      } else if (panelPosition === 'right') {
+        now = rangeValue && rangeValue[1] || viewDate;
+      } else {
+        now = dateValue || viewDate;
+      } // if(hours) {
+      // }
+
+
+      var dayTime = setTime(day, {
+        hour: getHours(now),
+        minute: getMinutes(now),
+        second: getSeconds(now)
+      });
+      var _props = {
+        onClick: function onClick() {
+          return handleDayClick(getEffectTime(dayTime));
+        },
+        onMouseEnter: function onMouseEnter() {
+          if (onDateMouseEnter) {
+            if (!(disabledDate && disabledDate(dayTime))) {
+              picker === 'week' ? onDateMouseEnter(startOfWeek) : onDateMouseEnter(getEffectTime(dayTime));
+            }
+          }
+        },
+        onMouseLeave: function onMouseLeave() {
+          if (onDateMouseLeave) {
+            onDateMouseLeave();
+          }
+        }
+      }; // console.log('disabledDate', disabledDate)
+
+      return /*#__PURE__*/React.createElement("div", _extends({
+        key: day.valueOf(),
+        className: classnames("".concat(prefixCls, "-calendar-item"), (_classnames3 = {}, _defineProperty(_classnames3, "".concat(prefixCls, "-calendar-item-disabled"), disabledDate && disabledDate(day)), _defineProperty(_classnames3, "".concat(prefixCls, "-calendar-current"), currentMonth === getMonth(day)), _classnames3), getRangeCls(day))
+      }, _props), /*#__PURE__*/React.createElement("div", {
+        className: getDayClassNames(day)
+      }, date));
+    }));
+
+    var calenderLineCls = classnames((_classnames4 = {}, _defineProperty(_classnames4, "".concat(prefixCls, "-calendar-line"), picker !== 'week'), _defineProperty(_classnames4, "".concat(prefixCls, "-calendar-week-line"), picker === 'week'), _defineProperty(_classnames4, "".concat(prefixCls, "-calendar-week-selected"), picker === 'week' && getWeekSelected(startOfWeek)), _classnames4));
+    return /*#__PURE__*/React.createElement("div", {
+      className: calenderLineCls
+    }, week);
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, renderDays());
+}
+
+export default Week;

package/es/date-picker/panel/year/year.d.ts

@@ -0,0 +1,9 @@
+import { DateType } from '../../interface';
+export interface YearProps {
+    yearItemNumber: number;
+    minDate?: DateType;
+    maxDate?: DateType;
+    disabledDate?: (date: DateType) => boolean;
+}
+declare function Year(props: YearProps): JSX.Element;
+export default Year;

package/es/date-picker/panel/year/year.js

@@ -0,0 +1,142 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
+import React, { useContext } from 'react';
+import classnames from 'classnames';
+import Context from '../../context';
+import { getYearsPeriod, getYear, newDate, setYear, isAfter, getStartOfYear, isSameYear, isBefore } from '../../utils/date-fns';
+import useRangeCls from '../../hooks/use-range-cls';
+
+function Year(props) {
+  var context = useContext(Context);
+  var prefixCls = context.prefixCls,
+      dateValue = context.dateValue,
+      viewDate = context.viewDate,
+      onDateMouseEnter = context.onDateMouseEnter,
+      onDateMouseLeave = context.onDateMouseLeave,
+      onSelect = context.onSelect,
+      rangeValue = context.rangeValue,
+      panelPosition = context.panelPosition,
+      hoverRangedValue = context.hoverRangedValue;
+  var yearItemNumber = props.yearItemNumber,
+      disabledDate = props.disabledDate;
+
+  var _dateValue;
+
+  if (panelPosition) {
+    _dateValue = rangeValue;
+  } else {
+    _dateValue = dateValue;
+  }
+
+  var hasFindSelected = false;
+  var hasFindToday = false;
+
+  var getYearSelected = function getYearSelected(year) {
+    if (hasFindSelected) return false;
+
+    if (Array.isArray(_dateValue)) {
+      return _dateValue[0] && getYear(_dateValue[0]) === year || _dateValue[1] && getYear(_dateValue[1]) === year;
+    } else {
+      if (_dateValue && getYear(_dateValue) === year) {
+        hasFindSelected = true;
+        return true;
+      }
+
+      return false;
+    }
+  };
+
+  var getYearToday = function getYearToday(year) {
+    if (hasFindToday) return false;
+
+    if (year === getYear(newDate())) {
+      hasFindToday = true;
+
+      if (Array.isArray(_dateValue)) {
+        return _dateValue[0] ? getYear(_dateValue[0]) !== getYear(newDate()) : _dateValue[1] ? getYear(_dateValue[1]) !== getYear(newDate()) : true;
+      } else {
+        return _dateValue ? getYear(_dateValue) !== year : true;
+      }
+    }
+  };
+
+  function getYearClassNames(y) {
+    var _classnames;
+
+    return classnames("".concat(prefixCls, "-year-text"), (_classnames = {}, _defineProperty(_classnames, "".concat(prefixCls, "-year-text-selected"), getYearSelected(y)), _defineProperty(_classnames, "".concat(prefixCls, "-year-text-today"), getYearToday(y)), _classnames));
+  }
+
+  var getRangeCls = useRangeCls({
+    prefixCls: prefixCls,
+    rangeValue: rangeValue,
+    hoverRangedValue: hoverRangedValue,
+    isRange: !!panelPosition,
+    isAfterStart: function isAfterStart(date, rangedValue) {
+      return rangedValue[0] ? isAfter(getStartOfYear(date), getStartOfYear(rangedValue[0])) : false;
+    },
+    isBeforeEnd: function isBeforeEnd(date, rangedValue) {
+      return rangedValue[1] ? isBefore(getStartOfYear(date), getStartOfYear(rangedValue[1])) : false;
+    },
+    isStart: function isStart(date, rangedValue) {
+      return rangedValue[0] ? isSameYear(date, rangedValue[0]) : false;
+    },
+    isEnd: function isEnd(date, rangedValue) {
+      return rangedValue[1] ? isSameYear(date, rangedValue[1]) : false;
+    }
+  });
+
+  var handleClick = function handleClick(date) {
+    if (!(disabledDate && disabledDate(date))) {
+      onSelect(date, 'mouse');
+    }
+  };
+
+  function getYearList() {
+    var yearsList = [];
+
+    var _getYearsPeriod = getYearsPeriod(viewDate, yearItemNumber),
+        startPeriod = _getYearsPeriod.startPeriod,
+        endPeriod = _getYearsPeriod.endPeriod;
+
+    var _loop = function _loop(y) {
+      var year = setYear(viewDate, y);
+      var _props = {
+        onClick: function onClick() {
+          return handleClick(year);
+        },
+        onMouseEnter: function onMouseEnter() {
+          if (onDateMouseEnter && !(disabledDate && disabledDate(year))) {
+            onDateMouseEnter(year);
+          }
+        },
+        onMouseLeave: function onMouseLeave() {
+          if (onDateMouseLeave) {
+            onDateMouseLeave();
+          }
+        }
+      };
+      yearsList.push( /*#__PURE__*/React.createElement("div", _extends({
+        className: classnames("".concat(prefixCls, "-year-item"), _defineProperty({}, "".concat(prefixCls, "-year-item-disabled"), disabledDate && disabledDate(year)), getRangeCls(year)),
+        key: y
+      }, _props), /*#__PURE__*/React.createElement("span", {
+        className: getYearClassNames(y)
+      }, y)));
+    };
+
+    for (var y = startPeriod; y <= endPeriod; y++) {
+      _loop(y);
+    }
+
+    return yearsList;
+  }
+
+  var yearCls = classnames("".concat(prefixCls, "-year"));
+  var yearWarpperCls = classnames("".concat(prefixCls, "-year-warpper"));
+  return /*#__PURE__*/React.createElement("div", {
+    className: yearCls
+  }, /*#__PURE__*/React.createElement("div", {
+    className: yearWarpperCls
+  }, getYearList()));
+}
+
+export default Year;

package/es/date-picker/popper.d.ts

@@ -0,0 +1,15 @@
+import React, { RefObject } from 'react';
+import { OutPopperProps, PickerMode } from './interface';
+export interface PopperProps extends OutPopperProps {
+    prefixCls: string;
+    inputDivRef: RefObject<HTMLDivElement>;
+    children: React.ReactNode;
+    isRange?: boolean;
+    isShowTime?: boolean;
+    picker?: PickerMode;
+    arrowLeft?: number;
+    triggerInnerOpen: (open: boolean) => void;
+    onClickOutside?: () => void;
+}
+declare const _default: React.ForwardRefExoticComponent<PopperProps & React.RefAttributes<HTMLDivElement>>;
+export default _default;