acud 0.0.60

package/lib/date-picker/src/panels/TimePanel/TimeHeader.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _Header = _interopRequireDefault(require("../Header"));
+
+var _PanelContext = _interopRequireDefault(require("../../PanelContext"));
+
+var _dateUtil = require("../../utils/dateUtil");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function TimeHeader(props) {
+  var _React$useContext = React.useContext(_PanelContext["default"]),
+      hideHeader = _React$useContext.hideHeader;
+
+  if (hideHeader) {
+    return null;
+  }
+
+  var prefixCls = props.prefixCls,
+      generateConfig = props.generateConfig,
+      locale = props.locale,
+      value = props.value,
+      format = props.format;
+  var headerPrefixCls = "".concat(prefixCls, "-header");
+  return /*#__PURE__*/React.createElement(_Header["default"], {
+    prefixCls: headerPrefixCls
+  }, value ? (0, _dateUtil.formatValue)(value, {
+    locale: locale,
+    format: format,
+    generateConfig: generateConfig
+  }) : '时间选择器');
+}
+
+var _default = TimeHeader;
+exports["default"] = _default;

package/lib/date-picker/src/panels/TimePanel/TimeUnitColumn.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+export declare type Unit = {
+    label: React.ReactText;
+    value: number;
+    disabled: boolean;
+};
+export declare type TimeUnitColumnProps = {
+    prefixCls?: string;
+    units?: Unit[];
+    value?: number;
+    active?: boolean;
+    hideDisabledOptions?: boolean;
+    onSelect?: (value: number) => void;
+};
+declare function TimeUnitColumn(props: TimeUnitColumnProps): JSX.Element;
+export default TimeUnitColumn;

package/lib/date-picker/src/panels/TimePanel/TimeUnitColumn.js

@@ -0,0 +1,99 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _uiUtil = require("../../utils/uiUtil");
+
+var _PanelContext = _interopRequireDefault(require("../../PanelContext"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function TimeUnitColumn(props) {
+  var prefixCls = props.prefixCls,
+      units = props.units,
+      onSelect = props.onSelect,
+      value = props.value,
+      active = props.active,
+      hideDisabledOptions = props.hideDisabledOptions;
+  var cellPrefixCls = "".concat(prefixCls, "-cell");
+
+  var _React$useContext = React.useContext(_PanelContext["default"]),
+      open = _React$useContext.open;
+
+  var ulRef = (0, React.useRef)(null);
+  var liRefs = (0, React.useRef)(new Map());
+  var scrollRef = (0, React.useRef)(); // `useLayoutEffect` here to avoid blink by duration is 0
+
+  (0, React.useLayoutEffect)(function () {
+    var li = liRefs.current.get(value);
+
+    if (li && open !== false) {
+      (0, _uiUtil.scrollTo)(ulRef.current, li.offsetTop, 120);
+    }
+  }, [value]);
+  (0, React.useLayoutEffect)(function () {
+    if (open) {
+      var li = liRefs.current.get(value);
+
+      if (li) {
+        scrollRef.current = (0, _uiUtil.waitElementReady)(li, function () {
+          (0, _uiUtil.scrollTo)(ulRef.current, li.offsetTop, 0);
+        });
+      }
+    }
+
+    return function () {
+      var _a;
+
+      (_a = scrollRef.current) === null || _a === void 0 ? void 0 : _a.call(scrollRef);
+    };
+  }, [open]);
+  return /*#__PURE__*/React.createElement("ul", {
+    className: (0, _classnames["default"])("".concat(prefixCls, "-column"), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "-column-active"), active)),
+    ref: ulRef,
+    style: {
+      position: 'relative'
+    }
+  }, units.map(function (unit) {
+    var _classNames2;
+
+    if (hideDisabledOptions && unit.disabled) {
+      return null;
+    }
+
+    return /*#__PURE__*/React.createElement("li", {
+      key: unit.value,
+      ref: function ref(element) {
+        liRefs.current.set(unit.value, element);
+      },
+      className: (0, _classnames["default"])(cellPrefixCls, (_classNames2 = {}, (0, _defineProperty2["default"])(_classNames2, "".concat(cellPrefixCls, "-disabled"), unit.disabled), (0, _defineProperty2["default"])(_classNames2, "".concat(cellPrefixCls, "-selected"), value === unit.value), _classNames2)),
+      onClick: function onClick() {
+        if (unit.disabled) {
+          return;
+        }
+
+        onSelect(unit.value);
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "".concat(cellPrefixCls, "-inner")
+    }, unit.label));
+  }));
+}
+
+var _default = TimeUnitColumn;
+exports["default"] = _default;

package/lib/date-picker/src/panels/TimePanel/index.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import type { PanelSharedProps, DisabledTimes } from '../../interface';
+export declare type SharedTimeProps<DateType> = {
+    format?: string;
+    showNow?: boolean;
+    showHour?: boolean;
+    showMinute?: boolean;
+    showSecond?: boolean;
+    use12Hours?: boolean;
+    hourStep?: number;
+    minuteStep?: number;
+    secondStep?: number;
+    hideDisabledOptions?: boolean;
+    defaultValue?: DateType;
+} & DisabledTimes;
+export declare type TimePanelProps<DateType> = {
+    format?: string;
+    active?: boolean;
+} & PanelSharedProps<DateType> & SharedTimeProps<DateType>;
+declare function TimePanel<DateType>(props: TimePanelProps<DateType>): JSX.Element;
+export default TimePanel;

package/lib/date-picker/src/panels/TimePanel/index.js

@@ -0,0 +1,97 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _TimeHeader = _interopRequireDefault(require("./TimeHeader"));
+
+var _TimeBody = _interopRequireDefault(require("./TimeBody"));
+
+var _uiUtil = require("../../utils/uiUtil");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var countBoolean = function countBoolean(boolList) {
+  return boolList.filter(function (bool) {
+    return bool !== false;
+  }).length;
+};
+
+function TimePanel(props) {
+  var generateConfig = props.generateConfig,
+      _props$format = props.format,
+      format = _props$format === void 0 ? 'HH:mm:ss' : _props$format,
+      prefixCls = props.prefixCls,
+      active = props.active,
+      operationRef = props.operationRef,
+      showHour = props.showHour,
+      showMinute = props.showMinute,
+      showSecond = props.showSecond,
+      _props$use12Hours = props.use12Hours,
+      use12Hours = _props$use12Hours === void 0 ? false : _props$use12Hours,
+      onSelect = props.onSelect,
+      value = props.value;
+  var panelPrefixCls = "".concat(prefixCls, "-time-panel");
+  var bodyOperationRef = React.useRef(); // ======================= Keyboard =======================
+
+  var _React$useState = React.useState(-1),
+      _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+      activeColumnIndex = _React$useState2[0],
+      setActiveColumnIndex = _React$useState2[1];
+
+  var columnsCount = countBoolean([showHour, showMinute, showSecond, use12Hours]);
+  operationRef.current = {
+    onKeyDown: function onKeyDown(event) {
+      return (0, _uiUtil.createKeyDownHandler)(event, {
+        onLeftRight: function onLeftRight(diff) {
+          setActiveColumnIndex((activeColumnIndex + diff + columnsCount) % columnsCount);
+        },
+        onUpDown: function onUpDown(diff) {
+          if (activeColumnIndex === -1) {
+            setActiveColumnIndex(0);
+          } else if (bodyOperationRef.current) {
+            bodyOperationRef.current.onUpDown(diff);
+          }
+        },
+        onEnter: function onEnter() {
+          onSelect(value || generateConfig.getNow(), 'key');
+          setActiveColumnIndex(-1);
+        }
+      });
+    },
+    onBlur: function onBlur() {
+      setActiveColumnIndex(-1);
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: (0, _classnames["default"])(panelPrefixCls, (0, _defineProperty2["default"])({}, "".concat(panelPrefixCls, "-active"), active))
+  }, /*#__PURE__*/React.createElement(_TimeHeader["default"], (0, _extends2["default"])({}, props, {
+    format: format,
+    prefixCls: prefixCls
+  })), /*#__PURE__*/React.createElement(_TimeBody["default"], (0, _extends2["default"])({}, props, {
+    prefixCls: prefixCls,
+    activeColumnIndex: activeColumnIndex,
+    operationRef: bodyOperationRef
+  })));
+}
+
+var _default = TimePanel;
+exports["default"] = _default;

package/lib/date-picker/src/panels/WeekPanel/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { PanelSharedProps } from '../../interface';
+export declare type WeekPanelProps<DateType> = PanelSharedProps<DateType>;
+declare function WeekPanel<DateType>(props: WeekPanelProps<DateType>): JSX.Element;
+export default WeekPanel;

package/lib/date-picker/src/panels/WeekPanel/index.js

@@ -0,0 +1,61 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _DatePanel = _interopRequireDefault(require("../DatePanel"));
+
+var _dateUtil = require("../../utils/dateUtil");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function WeekPanel(props) {
+  var prefixCls = props.prefixCls,
+      generateConfig = props.generateConfig,
+      locale = props.locale,
+      value = props.value; // Render additional column
+
+  var cellPrefixCls = "".concat(prefixCls, "-cell");
+
+  var prefixColumn = function prefixColumn(date) {
+    return /*#__PURE__*/React.createElement("td", {
+      key: "week",
+      className: (0, _classnames["default"])(cellPrefixCls, "".concat(cellPrefixCls, "-week"))
+    }, generateConfig.locale.getWeek(locale.locale, date));
+  }; // Add row className
+
+
+  var rowPrefixCls = "".concat(prefixCls, "-week-panel-row");
+
+  var rowClassName = function rowClassName(date) {
+    return (0, _classnames["default"])(rowPrefixCls, (0, _defineProperty2["default"])({}, "".concat(rowPrefixCls, "-selected"), (0, _dateUtil.isSameWeek)(generateConfig, locale.locale, value, date)));
+  };
+
+  return /*#__PURE__*/React.createElement(_DatePanel["default"], (0, _extends2["default"])({}, props, {
+    panelName: "week",
+    prefixColumn: prefixColumn,
+    rowClassName: rowClassName,
+    keyboardConfig: {
+      onLeftRight: null
+    }
+  }));
+}
+
+var _default = WeekPanel;
+exports["default"] = _default;

package/lib/date-picker/src/panels/YearPanel/YearBody.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import type { GenerateConfig } from '../../generate';
+import type { Locale, NullableDateType } from '../../interface';
+export declare const YEAR_COL_COUNT = 3;
+export declare type YearBodyProps<DateType> = {
+    prefixCls: string;
+    locale: Locale;
+    generateConfig: GenerateConfig<DateType>;
+    value?: NullableDateType<DateType>;
+    viewDate: DateType;
+    disabledDate?: (date: DateType) => boolean;
+    onSelect: (value: DateType) => void;
+};
+declare function YearBody<DateType>(props: YearBodyProps<DateType>): JSX.Element;
+export default YearBody;

package/lib/date-picker/src/panels/YearPanel/YearBody.js

@@ -0,0 +1,91 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.YEAR_COL_COUNT = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _ = require(".");
+
+var _useCellClassName = _interopRequireDefault(require("../../hooks/useCellClassName"));
+
+var _dateUtil = require("../../utils/dateUtil");
+
+var _RangeContext = _interopRequireDefault(require("../../RangeContext"));
+
+var _PanelBody = _interopRequireDefault(require("../PanelBody"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var YEAR_COL_COUNT = 3;
+exports.YEAR_COL_COUNT = YEAR_COL_COUNT;
+var YEAR_ROW_COUNT = 4;
+
+function YearBody(props) {
+  var prefixCls = props.prefixCls,
+      value = props.value,
+      viewDate = props.viewDate,
+      locale = props.locale,
+      generateConfig = props.generateConfig;
+
+  var _React$useContext = React.useContext(_RangeContext["default"]),
+      rangedValue = _React$useContext.rangedValue,
+      hoverRangedValue = _React$useContext.hoverRangedValue;
+
+  var yearPrefixCls = "".concat(prefixCls, "-cell"); // =============================== Year ===============================
+
+  var yearNumber = generateConfig.getYear(viewDate);
+
+  var startYear = Math.floor(yearNumber / _.YEAR_DECADE_COUNT) * _.YEAR_DECADE_COUNT;
+
+  var endYear = startYear + _.YEAR_DECADE_COUNT - 1;
+  var baseYear = generateConfig.setYear(viewDate, startYear - Math.ceil((YEAR_COL_COUNT * YEAR_ROW_COUNT - _.YEAR_DECADE_COUNT) / 2));
+
+  var isInView = function isInView(date) {
+    var currentYearNumber = generateConfig.getYear(date);
+    return startYear <= currentYearNumber && currentYearNumber <= endYear;
+  };
+
+  var getCellClassName = (0, _useCellClassName["default"])({
+    cellPrefixCls: yearPrefixCls,
+    value: value,
+    generateConfig: generateConfig,
+    rangedValue: rangedValue,
+    hoverRangedValue: hoverRangedValue,
+    isSameCell: function isSameCell(current, target) {
+      return (0, _dateUtil.isSameYear)(generateConfig, current, target);
+    },
+    isInView: isInView,
+    offsetCell: function offsetCell(date, offset) {
+      return generateConfig.addYear(date, offset);
+    }
+  });
+  return /*#__PURE__*/React.createElement(_PanelBody["default"], (0, _extends2["default"])({}, props, {
+    rowNum: YEAR_ROW_COUNT,
+    colNum: YEAR_COL_COUNT,
+    baseDate: baseYear,
+    getCellText: generateConfig.getYear,
+    getCellClassName: getCellClassName,
+    getCellDate: generateConfig.addYear,
+    titleCell: function titleCell(date) {
+      return (0, _dateUtil.formatValue)(date, {
+        locale: locale,
+        format: 'YYYY',
+        generateConfig: generateConfig
+      });
+    }
+  }));
+}
+
+var _default = YearBody;
+exports["default"] = _default;

package/lib/date-picker/src/panels/YearPanel/YearHeader.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import type { GenerateConfig } from '../../generate';
+export declare type YearHeaderProps<DateType> = {
+    prefixCls: string;
+    viewDate: DateType;
+    value?: DateType | null;
+    generateConfig: GenerateConfig<DateType>;
+    onPrevDecade: () => void;
+    onNextDecade: () => void;
+    onDecadeClick: () => void;
+};
+declare function YearHeader<DateType>(props: YearHeaderProps<DateType>): JSX.Element;
+export default YearHeader;

package/lib/date-picker/src/panels/YearPanel/YearHeader.js

@@ -0,0 +1,59 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _Header = _interopRequireDefault(require("../Header"));
+
+var _ = require(".");
+
+var _PanelContext = _interopRequireDefault(require("../../PanelContext"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function YearHeader(props) {
+  var prefixCls = props.prefixCls,
+      generateConfig = props.generateConfig,
+      viewDate = props.viewDate,
+      onPrevDecade = props.onPrevDecade,
+      onNextDecade = props.onNextDecade,
+      onDecadeClick = props.onDecadeClick;
+
+  var _React$useContext = React.useContext(_PanelContext["default"]),
+      hideHeader = _React$useContext.hideHeader;
+
+  if (hideHeader) {
+    return null;
+  }
+
+  var headerPrefixCls = "".concat(prefixCls, "-header");
+  var yearNumber = generateConfig.getYear(viewDate);
+
+  var startYear = Math.floor(yearNumber / _.YEAR_DECADE_COUNT) * _.YEAR_DECADE_COUNT;
+
+  var endYear = startYear + _.YEAR_DECADE_COUNT - 1;
+  return /*#__PURE__*/React.createElement(_Header["default"], (0, _extends2["default"])({}, props, {
+    prefixCls: headerPrefixCls,
+    onSuperPrev: onPrevDecade,
+    onSuperNext: onNextDecade
+  }), /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    onClick: onDecadeClick,
+    className: "".concat(prefixCls, "-decade-btn")
+  }, startYear, "-", endYear));
+}
+
+var _default = YearHeader;
+exports["default"] = _default;

package/lib/date-picker/src/panels/YearPanel/index.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import type { PanelSharedProps, PanelMode } from '../../interface';
+export declare type YearPanelProps<DateType> = {
+    sourceMode: PanelMode;
+} & PanelSharedProps<DateType>;
+export declare const YEAR_DECADE_COUNT = 10;
+declare function YearPanel<DateType>(props: YearPanelProps<DateType>): JSX.Element;
+export default YearPanel;

package/lib/date-picker/src/panels/YearPanel/index.js

@@ -0,0 +1,90 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.YEAR_DECADE_COUNT = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _YearHeader = _interopRequireDefault(require("./YearHeader"));
+
+var _YearBody = _interopRequireWildcard(require("./YearBody"));
+
+var _uiUtil = require("../../utils/uiUtil");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var YEAR_DECADE_COUNT = 10;
+exports.YEAR_DECADE_COUNT = YEAR_DECADE_COUNT;
+
+function YearPanel(props) {
+  var prefixCls = props.prefixCls,
+      operationRef = props.operationRef,
+      onViewDateChange = props.onViewDateChange,
+      generateConfig = props.generateConfig,
+      value = props.value,
+      viewDate = props.viewDate,
+      sourceMode = props.sourceMode,
+      _onSelect = props.onSelect,
+      onPanelChange = props.onPanelChange;
+  var panelPrefixCls = "".concat(prefixCls, "-year-panel"); // ======================= Keyboard =======================
+
+  operationRef.current = {
+    onKeyDown: function onKeyDown(event) {
+      return (0, _uiUtil.createKeyDownHandler)(event, {
+        onLeftRight: function onLeftRight(diff) {
+          _onSelect(generateConfig.addYear(value || viewDate, diff), 'key');
+        },
+        onCtrlLeftRight: function onCtrlLeftRight(diff) {
+          _onSelect(generateConfig.addYear(value || viewDate, diff * YEAR_DECADE_COUNT), 'key');
+        },
+        onUpDown: function onUpDown(diff) {
+          _onSelect(generateConfig.addYear(value || viewDate, diff * _YearBody.YEAR_COL_COUNT), 'key');
+        },
+        onEnter: function onEnter() {
+          onPanelChange(sourceMode === 'date' ? 'date' : 'month', value || viewDate);
+        }
+      });
+    }
+  }; // ==================== View Operation ====================
+
+  var onDecadeChange = function onDecadeChange(diff) {
+    var newDate = generateConfig.addYear(viewDate, diff * 10);
+    onViewDateChange(newDate);
+    onPanelChange(null, newDate);
+  };
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: panelPrefixCls
+  }, /*#__PURE__*/React.createElement(_YearHeader["default"], (0, _extends2["default"])({}, props, {
+    prefixCls: prefixCls,
+    onPrevDecade: function onPrevDecade() {
+      onDecadeChange(-1);
+    },
+    onNextDecade: function onNextDecade() {
+      onDecadeChange(1);
+    },
+    onDecadeClick: function onDecadeClick() {
+      onPanelChange('decade', viewDate);
+    }
+  })), /*#__PURE__*/React.createElement(_YearBody["default"], (0, _extends2["default"])({}, props, {
+    prefixCls: prefixCls,
+    onSelect: function onSelect(date) {
+      onPanelChange(sourceMode === 'date' ? 'date' : 'month', date);
+
+      _onSelect(date, 'mouse');
+    }
+  })));
+}
+
+var _default = YearPanel;
+exports["default"] = _default;