@douyinfe/semi-ui 2.1.0-beta.2 → 2.1.0-next.2

package/lib/cjs/datePicker/navigation.d.ts

@@ -0,0 +1,44 @@
+import React, { PureComponent } from 'react';
+import PropTypes from 'prop-types';
+import { PanelType } from '@douyinfe/semi-foundation/lib/cjs/datePicker/monthsGridFoundation';
+interface NavigationProps {
+    forwardRef?: React.Ref<HTMLDivElement>;
+    monthText?: string;
+    density?: string;
+    onMonthClick?: (e: React.MouseEvent) => void;
+    onNextMonth?: () => void;
+    onPrevMonth?: () => void;
+    onNextYear?: () => void;
+    onPrevYear?: () => void;
+    navPrev?: React.ReactNode;
+    navNext?: React.ReactNode;
+    shouldBimonthSwitch?: boolean;
+    panelType?: PanelType;
+}
+export default class Navigation extends PureComponent<NavigationProps> {
+    static propTypes: {
+        monthText: PropTypes.Requireable<string>;
+        density: PropTypes.Requireable<string>;
+        onMonthClick: PropTypes.Requireable<(...args: any[]) => any>;
+        onNextMonth: PropTypes.Requireable<(...args: any[]) => any>;
+        onPrevMonth: PropTypes.Requireable<(...args: any[]) => any>;
+        onNextYear: PropTypes.Requireable<(...args: any[]) => any>;
+        onPrevYear: PropTypes.Requireable<(...args: any[]) => any>;
+        navPrev: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        navNext: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        shouldBimonthSwitch: PropTypes.Requireable<boolean>;
+        panelType: PropTypes.Requireable<"left" | "right">;
+    };
+    static defaultProps: {
+        monthText: string;
+        onMonthClick: (...args: any[]) => void;
+        onNextMonth: (...args: any[]) => void;
+        onPrevMonth: (...args: any[]) => void;
+        onNextYear: (...args: any[]) => void;
+        onPrevYear: (...args: any[]) => void;
+    };
+    navRef: React.RefObject<HTMLDivElement>;
+    constructor(props: NavigationProps);
+    render(): JSX.Element;
+}
+export {};

package/lib/cjs/datePicker/navigation.js

@@ -0,0 +1,117 @@
+"use strict";
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _noop2 = _interopRequireDefault(require("lodash/noop"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _iconButton = _interopRequireDefault(require("../iconButton"));
+
+var _button = _interopRequireDefault(require("../button"));
+
+var _constants = require("@douyinfe/semi-foundation/lib/cjs/datePicker/constants");
+
+var _semiIcons = require("@douyinfe/semi-icons");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function (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; }
+
+// import cls from 'classnames';
+const prefixCls = _constants.cssClasses.NAVIGATION;
+
+class Navigation extends _react.PureComponent {
+  constructor(props) {
+    super(props);
+    this.navRef = /*#__PURE__*/_react.default.createRef();
+  }
+
+  render() {
+    const {
+      forwardRef,
+      monthText,
+      onMonthClick,
+      onNextMonth,
+      onPrevMonth,
+      density,
+      shouldBimonthSwitch,
+      panelType
+    } = this.props;
+    const btnTheme = 'borderless';
+    const iconBtnSize = density === 'compact' ? 'default' : 'large';
+    const btnNoHorizontalPadding = true;
+    const buttonSize = density === 'compact' ? 'small' : 'default'; // Enable dual-panel synchronous switching, and the current panel is the left panel
+
+    const bimonthSwitchWithLeftPanel = shouldBimonthSwitch && panelType === _constants.strings.PANEL_TYPE_LEFT; // Enable dual-panel synchronous switching, and the current panel is the right panel
+
+    const bimonthSwitchWithRightPanel = shouldBimonthSwitch && panelType === _constants.strings.PANEL_TYPE_RIGHT;
+    const ref = forwardRef || this.navRef;
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: prefixCls,
+      ref: ref
+    }, !bimonthSwitchWithRightPanel && /*#__PURE__*/_react.default.createElement(_iconButton.default, {
+      icon: /*#__PURE__*/_react.default.createElement(_semiIcons.IconChevronLeft, {
+        size: iconBtnSize
+      }),
+      size: buttonSize,
+      onClick: onPrevMonth,
+      theme: btnTheme,
+      noHorizontalPadding: btnNoHorizontalPadding
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(prefixCls, "-month")
+    }, /*#__PURE__*/_react.default.createElement(_button.default, {
+      onClick: onMonthClick,
+      theme: btnTheme,
+      size: buttonSize
+    }, /*#__PURE__*/_react.default.createElement("span", null, monthText))), !bimonthSwitchWithLeftPanel && /*#__PURE__*/_react.default.createElement(_iconButton.default, {
+      icon: /*#__PURE__*/_react.default.createElement(_semiIcons.IconChevronRight, {
+        size: iconBtnSize
+      }),
+      size: buttonSize,
+      onClick: onNextMonth,
+      theme: btnTheme,
+      noHorizontalPadding: btnNoHorizontalPadding
+    }));
+  }
+
+}
+
+exports.default = Navigation;
+Navigation.propTypes = {
+  monthText: _propTypes.default.string,
+  density: _propTypes.default.string,
+  onMonthClick: _propTypes.default.func,
+  onNextMonth: _propTypes.default.func,
+  onPrevMonth: _propTypes.default.func,
+  onNextYear: _propTypes.default.func,
+  onPrevYear: _propTypes.default.func,
+  navPrev: _propTypes.default.node,
+  navNext: _propTypes.default.node,
+  // Whether to switch synchronously for two panels
+  shouldBimonthSwitch: _propTypes.default.bool,
+  // Panel type, divided into left panel and right panel
+  panelType: _propTypes.default.oneOf([_constants.strings.PANEL_TYPE_LEFT, _constants.strings.PANEL_TYPE_RIGHT])
+};
+Navigation.defaultProps = {
+  monthText: '',
+  onMonthClick: _noop2.default,
+  onNextMonth: _noop2.default,
+  onPrevMonth: _noop2.default,
+  onNextYear: _noop2.default,
+  onPrevYear: _noop2.default
+};

package/lib/cjs/datePicker/quickControl.d.ts

@@ -0,0 +1,22 @@
+import React, { PureComponent } from 'react';
+import PropTypes from 'prop-types';
+import { noop } from '@douyinfe/semi-foundation/lib/cjs/utils/function';
+import { PresetsType, PresetType } from '@douyinfe/semi-foundation/lib/cjs/datePicker/foundation';
+export interface QuickControlProps {
+    presets: PresetsType;
+    onPresetClick: (preset: PresetType, e: React.MouseEvent) => void;
+    type: string;
+}
+declare class QuickControl extends PureComponent<QuickControlProps> {
+    static propTypes: {
+        presets: PropTypes.Requireable<any[]>;
+        onPresetClick: PropTypes.Requireable<(...args: any[]) => any>;
+        type: PropTypes.Requireable<string>;
+    };
+    static defaultProps: {
+        presets: PresetsType;
+        onPresetClick: typeof noop;
+    };
+    render(): JSX.Element;
+}
+export default QuickControl;

package/lib/cjs/datePicker/quickControl.js

@@ -0,0 +1,86 @@
+"use strict";
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _constants = require("@douyinfe/semi-foundation/lib/cjs/datePicker/constants");
+
+var _index = _interopRequireDefault(require("../button/index"));
+
+var _function = require("@douyinfe/semi-foundation/lib/cjs/utils/function");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function (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; }
+
+const prefixCls = _constants.cssClasses.PREFIX;
+
+class QuickControl extends _react.PureComponent {
+  render() {
+    var _context;
+
+    const {
+      presets,
+      onPresetClick,
+      type
+    } = this.props;
+    const wrapperCls = (0, _classnames.default)("".concat(prefixCls, "-quick-control"), {
+      [(0, _concat.default)(_context = "".concat(prefixCls, "-quick-control-")).call(_context, type)]: type
+    });
+    const itemCls = (0, _classnames.default)("".concat(prefixCls, "-quick-control-item"));
+
+    if (!presets.length) {
+      return null;
+    }
+
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: wrapperCls
+    }, (0, _map.default)(presets).call(presets, (item, index) => {
+      const _item = typeof item === 'function' ? item() : item;
+
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: itemCls,
+        onClick: e => onPresetClick(_item, e),
+        key: index
+      }, /*#__PURE__*/_react.default.createElement(_index.default, {
+        size: "small",
+        theme: "borderless",
+        type: "primary"
+      }, /*#__PURE__*/_react.default.createElement("span", null, _item.text)));
+    }));
+  }
+
+}
+
+QuickControl.propTypes = {
+  presets: _propTypes.default.array,
+  onPresetClick: _propTypes.default.func,
+  type: _propTypes.default.string
+};
+QuickControl.defaultProps = {
+  presets: [],
+  onPresetClick: _function.noop
+};
+var _default = QuickControl;
+exports.default = _default;

package/lib/cjs/datePicker/yearAndMonth.d.ts

@@ -0,0 +1,48 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import YearAndMonthFoundation, { MonthScrollItem, YearAndMonthAdapter, YearAndMonthFoundationProps, YearAndMonthFoundationState, YearScrollItem } from '@douyinfe/semi-foundation/lib/cjs/datePicker/yearAndMonthFoundation';
+import BaseComponent, { BaseProps } from '../_base/baseComponent';
+import ScrollItem from '../scrollList/scrollItem';
+import { Locale } from '../locale/interface';
+export interface YearAndMonthProps extends YearAndMonthFoundationProps, BaseProps {
+    locale?: Locale['DatePicker'];
+}
+export declare type YearAndMonthState = YearAndMonthFoundationState;
+declare class YearAndMonth extends BaseComponent<YearAndMonthProps, YearAndMonthState> {
+    static propTypes: {
+        currentYear: PropTypes.Requireable<number>;
+        currentMonth: PropTypes.Requireable<number>;
+        onSelect: PropTypes.Requireable<(...args: any[]) => any>;
+        locale: PropTypes.Requireable<object>;
+        localeCode: PropTypes.Requireable<string>;
+        monthCycled: PropTypes.Requireable<boolean>;
+        yearCycled: PropTypes.Requireable<boolean>;
+        noBackBtn: PropTypes.Requireable<boolean>;
+        disabledDate: PropTypes.Requireable<(...args: any[]) => any>;
+        density: PropTypes.Requireable<string>;
+    };
+    static defaultProps: {
+        disabledDate: {
+            (): false;
+            (): false;
+        };
+        monthCycled: boolean;
+        yearCycled: boolean;
+        noBackBtn: boolean;
+        onSelect: (...args: any[]) => void;
+    };
+    foundation: YearAndMonthFoundation;
+    yearRef: React.RefObject<ScrollItem<YearScrollItem>>;
+    monthRef: React.RefObject<ScrollItem<MonthScrollItem>>;
+    constructor(props: YearAndMonthProps);
+    get adapter(): YearAndMonthAdapter;
+    static getDerivedStateFromProps(props: YearAndMonthProps, state: YearAndMonthState): Partial<YearAndMonthFoundationState>;
+    renderColYear(): JSX.Element;
+    selectYear: (item: YearScrollItem) => void;
+    selectMonth: (item: MonthScrollItem) => void;
+    reselect: () => void;
+    renderColMonth(): JSX.Element;
+    backToMain: React.MouseEventHandler<HTMLButtonElement>;
+    render(): JSX.Element;
+}
+export default YearAndMonth;

package/lib/cjs/datePicker/yearAndMonth.js

@@ -0,0 +1,281 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
+
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+
+var _fill = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/fill"));
+
+var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
+
+var _now = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/date/now"));
+
+var _findIndex = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/find-index"));
+
+var _stubFalse2 = _interopRequireDefault(require("lodash/stubFalse"));
+
+var _noop2 = _interopRequireDefault(require("lodash/noop"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _yearAndMonthFoundation = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/datePicker/yearAndMonthFoundation"));
+
+var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
+
+var _index = _interopRequireDefault(require("../scrollList/index"));
+
+var _scrollItem = _interopRequireDefault(require("../scrollList/scrollItem"));
+
+var _index2 = require("@douyinfe/semi-foundation/lib/cjs/datePicker/_utils/index");
+
+var _isNullOrUndefined = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/utils/isNullOrUndefined"));
+
+var _iconButton = _interopRequireDefault(require("../iconButton"));
+
+var _semiIcons = require("@douyinfe/semi-icons");
+
+var _constants = require("@douyinfe/semi-foundation/lib/cjs/base/constants");
+
+var _dateFns = require("date-fns");
+
+/* eslint-disable max-len */
+const prefixCls = "".concat(_constants.BASE_CLASS_PREFIX, "-datepicker");
+
+class YearAndMonth extends _baseComponent.default {
+  constructor(props) {
+    var _context, _context2, _context3;
+
+    super(props);
+
+    this.selectYear = item => {
+      this.foundation.selectYear(item);
+    };
+
+    this.selectMonth = item => {
+      this.foundation.selectMonth(item);
+    };
+
+    this.reselect = () => {
+      const refKeys = ['yearRef', 'monthRef'];
+      (0, _forEach.default)(refKeys).call(refKeys, key => {
+        const ref = this[key];
+
+        if (ref && ref.current && ref.current.scrollToIndex) {
+          ref.current.scrollToIndex();
+        }
+      });
+    };
+
+    this.backToMain = e => {
+      e.nativeEvent.stopImmediatePropagation();
+      this.foundation.backToMain();
+    };
+
+    const now = new Date();
+    let {
+      currentYear,
+      currentMonth
+    } = props;
+    currentYear = currentYear || now.getFullYear();
+    currentMonth = currentMonth || now.getMonth() + 1;
+    this.state = {
+      years: (0, _map.default)(_context = (0, _index2.getYears)()).call(_context, year => ({
+        value: year,
+        year
+      })),
+      months: (0, _map.default)(_context2 = (0, _fill.default)(_context3 = Array(12)).call(_context3, 0)).call(_context2, (v, idx) => ({
+        value: idx + 1,
+        month: idx + 1
+      })),
+      currentYear,
+      currentMonth
+    };
+    this.yearRef = /*#__PURE__*/_react.default.createRef();
+    this.monthRef = /*#__PURE__*/_react.default.createRef();
+    this.foundation = new _yearAndMonthFoundation.default(this.adapter);
+  }
+
+  get adapter() {
+    return (0, _assign.default)((0, _assign.default)({}, super.adapter), {
+      // updateYears: years => this.setState({ years }),
+      // updateMonths: months => this.setState({ months }),
+      setCurrentYear: currentYear => this.setState({
+        currentYear
+      }),
+      setCurrentMonth: currentMonth => this.setState({
+        currentMonth
+      }),
+      notifySelectYear: year => this.props.onSelect({
+        currentMonth: this.state.currentMonth,
+        currentYear: year
+      }),
+      notifySelectMonth: month => this.props.onSelect({
+        currentYear: this.state.currentYear,
+        currentMonth: month
+      }),
+      notifyBackToMain: () => this.props.onBackToMain()
+    });
+  }
+
+  static getDerivedStateFromProps(props, state) {
+    const willUpdateStates = {};
+    const now = new Date();
+
+    if (!(0, _isNullOrUndefined.default)(props.currentMonth) && props.currentMonth !== state.currentMonth && props.currentMonth !== 0) {
+      willUpdateStates.currentMonth = props.currentMonth || now.getMonth() + 1;
+    }
+
+    if ((0, _isNullOrUndefined.default)(props.currentYear) && props.currentYear !== state.currentYear && props.currentYear !== 0) {
+      willUpdateStates.currentYear = props.currentYear || now.getFullYear();
+    }
+
+    return willUpdateStates;
+  }
+
+  renderColYear() {
+    const {
+      years,
+      currentYear,
+      currentMonth
+    } = this.state;
+    const {
+      disabledDate,
+      localeCode,
+      yearCycled
+    } = this.props;
+    const currentDate = (0, _dateFns.setMonth)((0, _now.default)(), currentMonth - 1);
+    const list = (0, _map.default)(years).call(years, _ref => {
+      let {
+        value,
+        year
+      } = _ref;
+      return {
+        year,
+        value,
+        disabled: disabledDate((0, _dateFns.setYear)(currentDate, year))
+      };
+    });
+
+    let transform = val => val;
+
+    if (localeCode === 'zh-CN' || localeCode === 'zh-TW') {
+      // Only Chinese needs to add [year] after the selected year
+      transform = val => "".concat(val, "\u5E74");
+    }
+
+    return /*#__PURE__*/_react.default.createElement(_scrollItem.default, {
+      ref: this.yearRef,
+      cycled: yearCycled,
+      list: list,
+      transform: transform,
+      selectedIndex: (0, _findIndex.default)(years).call(years, item => item.value === currentYear),
+      type: "year",
+      onSelect: this.selectYear
+    });
+  }
+
+  renderColMonth() {
+    const {
+      months,
+      currentMonth,
+      currentYear
+    } = this.state;
+    const {
+      locale,
+      localeCode,
+      monthCycled,
+      disabledDate
+    } = this.props;
+
+    let transform = val => val;
+
+    const currentDate = (0, _dateFns.setYear)((0, _now.default)(), currentYear);
+
+    if (localeCode === 'zh-CN' || localeCode === 'zh-TW') {
+      // Only Chinese needs to add [month] after the selected month
+      transform = val => "".concat(val, "\u6708");
+    } // i18n
+
+
+    const list = (0, _map.default)(months).call(months, _ref2 => {
+      let {
+        value,
+        month
+      } = _ref2;
+      return {
+        month,
+        disabled: disabledDate((0, _dateFns.setMonth)(currentDate, month - 1)),
+        value: locale.fullMonths[value] // Actual rendered text
+
+      };
+    });
+    const selectedIndex = (0, _findIndex.default)(list).call(list, item => item.month === currentMonth);
+    return /*#__PURE__*/_react.default.createElement(_scrollItem.default, {
+      ref: this.monthRef,
+      cycled: monthCycled,
+      list: list,
+      transform: transform,
+      selectedIndex: selectedIndex,
+      type: "month",
+      onSelect: this.selectMonth
+    });
+  }
+
+  render() {
+    const {
+      locale,
+      noBackBtn,
+      density
+    } = this.props;
+    const prefix = "".concat(prefixCls, "-yearmonth-header"); // i18n
+
+    const selectDateText = locale.selectDate;
+    const iconSize = density === 'compact' ? 'default' : 'large';
+    const buttonSize = density === 'compact' ? 'small' : 'default';
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, noBackBtn ? null : /*#__PURE__*/_react.default.createElement("div", {
+      className: prefix
+    }, /*#__PURE__*/_react.default.createElement(_iconButton.default, {
+      noHorizontalPadding: false,
+      icon: /*#__PURE__*/_react.default.createElement(_semiIcons.IconChevronLeft, {
+        size: iconSize
+      }),
+      size: buttonSize,
+      onClick: this.backToMain
+    }, /*#__PURE__*/_react.default.createElement("span", null, selectDateText))), /*#__PURE__*/_react.default.createElement(_index.default, null, this.renderColYear(), this.renderColMonth()));
+  }
+
+}
+
+YearAndMonth.propTypes = {
+  currentYear: _propTypes.default.number,
+  currentMonth: _propTypes.default.number,
+  onSelect: _propTypes.default.func,
+  locale: _propTypes.default.object,
+  localeCode: _propTypes.default.string,
+  monthCycled: _propTypes.default.bool,
+  yearCycled: _propTypes.default.bool,
+  noBackBtn: _propTypes.default.bool,
+  disabledDate: _propTypes.default.func,
+  density: _propTypes.default.string
+};
+YearAndMonth.defaultProps = {
+  disabledDate: _stubFalse2.default,
+  monthCycled: false,
+  yearCycled: false,
+  noBackBtn: false,
+  onSelect: _noop2.default
+};
+var _default = YearAndMonth;
+exports.default = _default;

package/lib/cjs/descriptions/descriptions-context.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export declare type DescriptionsAlign = 'center' | 'justify' | 'left' | 'plain';
+export interface DescriptionsContextValue {
+    align?: DescriptionsAlign;
+}
+declare const DescriptionsContext: React.Context<DescriptionsContextValue>;
+export default DescriptionsContext;

package/lib/cjs/descriptions/descriptions-context.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+const DescriptionsContext = /*#__PURE__*/_react.default.createContext(null);
+
+var _default = DescriptionsContext;
+exports.default = _default;

package/lib/cjs/descriptions/index.d.ts

@@ -0,0 +1,47 @@
+import React, { PureComponent } from 'react';
+import PropTypes from 'prop-types';
+import '@douyinfe/semi-foundation/lib/cjs/descriptions/descriptions.css';
+import { DescriptionsAlign } from './descriptions-context';
+import Item from './item';
+export { DescriptionsItemProps } from './item';
+export declare type DescriptionsSize = 'small' | 'medium' | 'large';
+export interface Data {
+    [x: string]: any;
+    key?: string | number;
+    value?: (() => React.ReactNode) | React.ReactNode;
+    hidden?: boolean;
+}
+export interface DescriptionsProps {
+    align?: DescriptionsAlign;
+    row?: boolean;
+    size?: DescriptionsSize;
+    style?: React.CSSProperties;
+    className?: string;
+    data?: Data[];
+}
+declare class Descriptions extends PureComponent<DescriptionsProps> {
+    static Item: typeof Item;
+    static contextType: React.Context<import("./descriptions-context").DescriptionsContextValue>;
+    static propTypes: {
+        align: PropTypes.Requireable<string>;
+        row: PropTypes.Requireable<boolean>;
+        size: PropTypes.Requireable<string>;
+        style: PropTypes.Requireable<object>;
+        className: PropTypes.Requireable<string>;
+        data: PropTypes.Requireable<PropTypes.InferProps<{
+            key: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+            value: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+            hidden: PropTypes.Requireable<boolean>;
+            className: PropTypes.Requireable<string>;
+            style: PropTypes.Requireable<object>;
+        }>[]>;
+    };
+    static defaultProps: {
+        align: string;
+        row: boolean;
+        size: string;
+        data: Data[];
+    };
+    render(): JSX.Element;
+}
+export default Descriptions;