@douyinfe/semi-ui 2.31.4 → 2.32.0

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

@@ -4,14 +4,15 @@ import YearAndMonthFoundation, { MonthScrollItem, YearAndMonthAdapter, YearAndMo
 import BaseComponent, { BaseProps } from '../_base/baseComponent';
 import ScrollItem from '../scrollList/scrollItem';
 import { Locale } from '../locale/interface';
+import { PanelType } from '@douyinfe/semi-foundation/lib/es/datePicker/monthsGridFoundation';
 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>;
+        currentYear: PropTypes.Requireable<object>;
+        currentMonth: PropTypes.Requireable<object>;
         onSelect: PropTypes.Requireable<(...args: any[]) => any>;
         locale: PropTypes.Requireable<object>;
         localeCode: PropTypes.Requireable<string>;
@@ -23,6 +24,7 @@ declare class YearAndMonth extends BaseComponent<YearAndMonthProps, YearAndMonth
         presetPosition: PropTypes.Requireable<"left" | "top" | "right" | "bottom">;
         renderQuickControls: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         renderDateInput: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "monthRange" | "dateTimeRange">;
     };
     static defaultProps: {
         disabledDate: {
@@ -33,6 +35,7 @@ declare class YearAndMonth extends BaseComponent<YearAndMonthProps, YearAndMonth
         yearCycled: boolean;
         noBackBtn: boolean;
         onSelect: (...args: any[]) => void;
+        type: string;
     };
     foundation: YearAndMonthFoundation;
     yearRef: React.RefObject<ScrollItem<YearScrollItem>>;
@@ -40,12 +43,13 @@ declare class YearAndMonth extends BaseComponent<YearAndMonthProps, YearAndMonth
     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;
+    renderColYear(panelType: PanelType): JSX.Element;
+    selectYear: (item: YearScrollItem, panelType?: PanelType) => void;
+    selectMonth: (item: MonthScrollItem, panelType?: PanelType) => void;
     reselect: () => void;
-    renderColMonth(): JSX.Element;
+    renderColMonth(panelType: PanelType): JSX.Element;
     backToMain: React.MouseEventHandler<HTMLButtonElement>;
+    renderPanel(panelType: PanelType): JSX.Element;
     render(): JSX.Element;
 }
 export default YearAndMonth;

package/lib/es/datePicker/yearAndMonth.js

@@ -1,3 +1,4 @@
+import _isEqual from "lodash/isEqual";
 import _stubFalse from "lodash/stubFalse";
 import _noop from "lodash/noop";
 
@@ -9,7 +10,6 @@ import BaseComponent from '../_base/baseComponent';
 import ScrollList from '../scrollList/index';
 import ScrollItem from '../scrollList/scrollItem';
 import { getYears } from '@douyinfe/semi-foundation/lib/es/datePicker/_utils/index';
-import isNullOrUndefined from '@douyinfe/semi-foundation/lib/es/utils/isNullOrUndefined';
 import IconButton from '../iconButton';
 import { IconChevronLeft } from '@douyinfe/semi-icons';
 import { BASE_CLASS_PREFIX } from '@douyinfe/semi-foundation/lib/es/base/constants';
@@ -21,12 +21,12 @@ class YearAndMonth extends BaseComponent {
   constructor(props) {
     super(props);
 
-    this.selectYear = item => {
-      this.foundation.selectYear(item);
+    this.selectYear = (item, panelType) => {
+      this.foundation.selectYear(item, panelType);
     };
 
-    this.selectMonth = item => {
-      this.foundation.selectMonth(item);
+    this.selectMonth = (item, panelType) => {
+      this.foundation.selectMonth(item, panelType);
     };
 
     this.reselect = () => {
@@ -50,8 +50,16 @@ class YearAndMonth extends BaseComponent {
       currentYear,
       currentMonth
     } = props;
-    currentYear = currentYear || now.getFullYear();
-    currentMonth = currentMonth || now.getMonth() + 1;
+    const currentLeftYear = currentYear.left || now.getFullYear();
+    const currentLeftMonth = currentMonth.left || now.getMonth() + 1;
+    currentYear = {
+      left: currentLeftYear,
+      right: currentLeftYear
+    };
+    currentMonth = {
+      left: currentLeftMonth,
+      right: currentMonth.right || currentLeftMonth + 1
+    };
     this.state = {
       years: getYears().map(year => ({
         value: year,
@@ -79,6 +87,10 @@ class YearAndMonth extends BaseComponent {
       setCurrentMonth: currentMonth => this.setState({
         currentMonth
       }),
+      setCurrentYearAndMonth: (currentYear, currentMonth) => this.setState({
+        currentYear,
+        currentMonth
+      }),
       notifySelectYear: year => this.props.onSelect({
         currentMonth: this.state.currentMonth,
         currentYear: year
@@ -87,26 +99,29 @@ class YearAndMonth extends BaseComponent {
         currentYear: this.state.currentYear,
         currentMonth: month
       }),
+      notifySelectYearAndMonth: (year, month) => this.props.onSelect({
+        currentYear: year,
+        currentMonth: month
+      }),
       notifyBackToMain: () => this.props.onBackToMain()
     });
   }
 
   static getDerivedStateFromProps(props, state) {
     const willUpdateStates = {};
-    const now = new Date();
 
-    if (!isNullOrUndefined(props.currentMonth) && props.currentMonth !== state.currentMonth && props.currentMonth !== 0) {
-      willUpdateStates.currentMonth = props.currentMonth || now.getMonth() + 1;
+    if (!_isEqual(props.currentYear, state.currentYear) && props.currentYear.left !== 0) {
+      willUpdateStates.currentYear = props.currentYear;
     }
 
-    if (isNullOrUndefined(props.currentYear) && props.currentYear !== state.currentYear && props.currentYear !== 0) {
-      willUpdateStates.currentYear = props.currentYear || now.getFullYear();
+    if (!_isEqual(props.currentMonth, state.currentMonth) && props.currentMonth.left !== 0) {
+      willUpdateStates.currentMonth = props.currentMonth;
     }
 
     return willUpdateStates;
   }
 
-  renderColYear() {
+  renderColYear(panelType) {
     const {
       years,
       currentYear,
@@ -119,7 +134,22 @@ class YearAndMonth extends BaseComponent {
       yearCycled,
       yearAndMonthOpts
     } = this.props;
-    const currentDate = setMonth(Date.now(), currentMonth - 1);
+    const currentDate = setMonth(Date.now(), currentMonth[panelType] - 1);
+    const left = strings.PANEL_TYPE_LEFT;
+    const right = strings.PANEL_TYPE_RIGHT;
+
+    const needDisabled = year => {
+      if (panelType === right && currentYear[left]) {
+        if (currentMonth[left] <= currentMonth[right]) {
+          return currentYear[left] > year;
+        } else {
+          return currentYear[left] >= year;
+        }
+      }
+
+      return false;
+    };
+
     const list = years.map(_ref => {
       let {
         value,
@@ -134,10 +164,11 @@ class YearAndMonth extends BaseComponent {
           month: month - 1
         }));
       });
+      const isRightPanelDisabled = needDisabled(year);
       return {
         year,
         value,
-        disabled: isAllMonthDisabled
+        disabled: isAllMonthDisabled || isRightPanelDisabled
       };
     });
 
@@ -153,14 +184,14 @@ class YearAndMonth extends BaseComponent {
       cycled: yearCycled,
       list: list,
       transform: transform,
-      selectedIndex: years.findIndex(item => item.value === currentYear),
+      selectedIndex: years.findIndex(item => item.value === currentYear[panelType]),
       type: "year",
-      onSelect: this.selectYear,
+      onSelect: item => this.selectYear(item, panelType),
       mode: "normal"
     }, yearAndMonthOpts));
   }
 
-  renderColMonth() {
+  renderColMonth(panelType) {
     const {
       months,
       currentMonth,
@@ -176,7 +207,9 @@ class YearAndMonth extends BaseComponent {
 
     let transform = val => val;
 
-    const currentDate = setYear(Date.now(), currentYear);
+    const currentDate = setYear(Date.now(), currentYear[panelType]);
+    const left = strings.PANEL_TYPE_LEFT;
+    const right = strings.PANEL_TYPE_RIGHT;
 
     if (localeCode === 'zh-CN' || localeCode === 'zh-TW') {
       // Only Chinese needs to add [month] after the selected month
@@ -189,14 +222,15 @@ class YearAndMonth extends BaseComponent {
         value,
         month
       } = _ref3;
+      const isRightPanelDisabled = panelType === right && currentMonth[left] && currentYear[left] === currentYear[right] && currentMonth[left] > month;
       return {
         month,
-        disabled: disabledDate(setMonth(currentDate, month - 1)),
+        disabled: disabledDate(setMonth(currentDate, month - 1)) || isRightPanelDisabled,
         value: locale.fullMonths[value] // Actual rendered text
 
       };
     });
-    const selectedIndex = list.findIndex(item => item.month === currentMonth);
+    const selectedIndex = list.findIndex(item => item.month === currentMonth[panelType]);
     return /*#__PURE__*/React.createElement(ScrollItem, Object.assign({
       ref: this.monthRef,
       cycled: monthCycled,
@@ -204,11 +238,15 @@ class YearAndMonth extends BaseComponent {
       transform: transform,
       selectedIndex: selectedIndex,
       type: "month",
-      onSelect: this.selectMonth,
+      onSelect: item => this.selectMonth(item, panelType),
       mode: 'normal'
     }, yearAndMonthOpts));
   }
 
+  renderPanel(panelType) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ScrollList, null, this.renderColYear(panelType), this.renderColMonth(panelType)));
+  }
+
   render() {
     const {
       locale,
@@ -216,13 +254,27 @@ class YearAndMonth extends BaseComponent {
       density,
       presetPosition,
       renderQuickControls,
-      renderDateInput
+      renderDateInput,
+      type
     } = this.props;
-    const prefix = `${prefixCls}-yearmonth-header`; // i18n
+    const prefix = `${prefixCls}-yearmonth-header`;
+    const bodyCls = `${prefixCls}-yearmonth-body`; // i18n
 
     const selectDateText = locale.selectDate;
     const iconSize = density === 'compact' ? 'default' : 'large';
     const buttonSize = density === 'compact' ? 'small' : 'default';
+    const panelTypeLeft = strings.PANEL_TYPE_LEFT;
+    const panelTypeRight = strings.PANEL_TYPE_RIGHT;
+    let content = null;
+
+    if (type === 'month') {
+      content = this.renderPanel(panelTypeLeft);
+    } else {
+      content = /*#__PURE__*/React.createElement("div", {
+        className: bodyCls
+      }, this.renderPanel(panelTypeLeft), this.renderPanel(panelTypeRight));
+    }
+
     return /*#__PURE__*/React.createElement(React.Fragment, null, noBackBtn ? null : /*#__PURE__*/React.createElement("div", {
       className: prefix
     }, /*#__PURE__*/React.createElement(IconButton, {
@@ -237,14 +289,14 @@ class YearAndMonth extends BaseComponent {
       style: {
         display: 'flex'
       }
-    }, presetPosition === "left" && renderQuickControls, /*#__PURE__*/React.createElement("div", null, renderDateInput, /*#__PURE__*/React.createElement(ScrollList, null, this.renderColYear(), this.renderColMonth())), presetPosition === "right" && renderQuickControls) : /*#__PURE__*/React.createElement(React.Fragment, null, renderDateInput, /*#__PURE__*/React.createElement(ScrollList, null, this.renderColYear(), this.renderColMonth())));
+    }, presetPosition === "left" && type !== 'monthRange' && renderQuickControls, /*#__PURE__*/React.createElement("div", null, renderDateInput, content), presetPosition === "right" && type !== 'monthRange' && renderQuickControls) : /*#__PURE__*/React.createElement(React.Fragment, null, renderDateInput, content));
   }
 
 }
 
 YearAndMonth.propTypes = {
-  currentYear: PropTypes.number,
-  currentMonth: PropTypes.number,
+  currentYear: PropTypes.object,
+  currentMonth: PropTypes.object,
   onSelect: PropTypes.func,
   locale: PropTypes.object,
   localeCode: PropTypes.string,
@@ -255,13 +307,15 @@ YearAndMonth.propTypes = {
   density: PropTypes.string,
   presetPosition: PropTypes.oneOf(strings.PRESET_POSITION_SET),
   renderQuickControls: PropTypes.node,
-  renderDateInput: PropTypes.node
+  renderDateInput: PropTypes.node,
+  type: PropTypes.oneOf(strings.TYPE_SET)
 };
 YearAndMonth.defaultProps = {
   disabledDate: _stubFalse,
   monthCycled: false,
   yearCycled: false,
   noBackBtn: false,
-  onSelect: _noop
+  onSelect: _noop,
+  type: 'month'
 };
 export default YearAndMonth;

package/lib/es/form/baseForm.d.ts

@@ -127,7 +127,7 @@ declare class Form<Values extends Record<string, any> = any> extends BaseCompone
         onDeselect?: (value: string | number | any[] | Record<string, any>, option: Record<string, any>) => void;
         onSelect?: (value: string | number | any[] | Record<string, any>, option: Record<string, any>) => void;
         allowCreate?: boolean;
-        triggerRender?: (props?: any) => React.ReactNode;
+        triggerRender?: (props?: import("../select").TriggerRenderProps) => React.ReactNode;
         onClear?: () => void;
         virtualize?: import("../select").virtualListProps;
         onFocus?: (e: React.FocusEvent<Element, Element>) => void;
@@ -142,7 +142,7 @@ declare class Form<Values extends Record<string, any> = any> extends BaseCompone
     static CheckboxGroup: React.ComponentType<import("utility-types").Subtract<import("../checkbox").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;
     static Radio: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../radio").RadioProps & import("./interface").RCIncludeType>;
     static RadioGroup: React.ComponentType<import("utility-types").Subtract<import("../radio").RadioGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;
-    static DatePicker: React.ComponentType<import("utility-types").Subtract<import("../datePicker").DatePickerProps & React.RefAttributes<import("../datePicker/datePicker").default>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;
+    static DatePicker: React.ComponentType<import("utility-types").Subtract<import("../datePicker").DatePickerProps & React.RefAttributes<import("../datePicker").BaseDatePicker>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;
     static TimePicker: React.ComponentType<import("utility-types").Subtract<import("../timePicker").TimePickerProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;
     static Switch: React.ComponentType<import("utility-types").Subtract<import("../switch").SwitchProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;
     static Slider: React.ComponentType<import("utility-types").Subtract<import("../slider").SliderProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps & React.RefAttributes<any>>;

package/lib/es/form/field.d.ts

@@ -75,7 +75,7 @@ declare const FormSelect: import("react").ComponentType<import("utility-types").
     onDeselect?: (value: string | number | any[] | Record<string, any>, option: Record<string, any>) => void;
     onSelect?: (value: string | number | any[] | Record<string, any>, option: Record<string, any>) => void;
     allowCreate?: boolean;
-    triggerRender?: (props?: any) => import("react").ReactNode;
+    triggerRender?: (props?: import("../select/index").TriggerRenderProps) => import("react").ReactNode;
     onClear?: () => void;
     virtualize?: import("../select/index").virtualListProps;
     onFocus?: (e: import("react").FocusEvent<Element, Element>) => void;

package/lib/es/locale/interface.d.ts

@@ -31,6 +31,7 @@ export interface Locale {
             dateTime: string;
             dateRange: [string, string];
             dateTimeRange: [string, string];
+            monthRange: [string, string];
         };
         footer: {
             confirm: string;

package/lib/es/locale/source/ar.js

@@ -30,7 +30,8 @@ const local = {
       date: 'حدد تاريخ',
       dateTime: 'حدد التاريخ والوقت',
       dateRange: ['تاريخ البدء', 'تاريخ النهاية'],
-      dateTimeRange: ['تاريخ البدء', 'تاريخ النهاية']
+      dateTimeRange: ['تاريخ البدء', 'تاريخ النهاية'],
+      monthRange: ['الشهر الأول', 'الشهر الأخير']
     },
     footer: {
       confirm: 'تؤكد',

package/lib/es/locale/source/de.js

@@ -30,7 +30,8 @@ const local = {
       date: 'Datum auswählen',
       dateTime: 'Datum und Uhrzeit auswählen',
       dateRange: ['Startdatum', 'Enddatum'],
-      dateTimeRange: ['Startdatum', 'Enddatum']
+      dateTimeRange: ['Startdatum', 'Enddatum'],
+      monthRange: ['Startmonat', 'Endmonat']
     },
     footer: {
       confirm: 'Bestätigen',

package/lib/es/locale/source/en_GB.js

@@ -30,7 +30,8 @@ const local = {
       date: 'Select date',
       dateTime: 'Select date and time',
       dateRange: ['Start date', 'End date'],
-      dateTimeRange: ['Start date', 'End date']
+      dateTimeRange: ['Start date', 'End date'],
+      monthRange: ['Start month', 'End month']
     },
     footer: {
       confirm: 'Confirm',

package/lib/es/locale/source/en_US.js

@@ -30,7 +30,8 @@ const local = {
       date: 'Select date',
       dateTime: 'Select date and time',
       dateRange: ['Start date', 'End date'],
-      dateTimeRange: ['Start date', 'End date']
+      dateTimeRange: ['Start date', 'End date'],
+      monthRange: ['Start month', 'End month']
     },
     footer: {
       confirm: 'Confirm',

package/lib/es/locale/source/es.js

@@ -35,7 +35,8 @@ const locale = {
       date: 'Seleccionar fecha',
       dateTime: 'Seleccionar hora y fecha',
       dateRange: ['Fecha inicial', 'Fecha final'],
-      dateTimeRange: ['Fecha inicial', 'Fecha final']
+      dateTimeRange: ['Fecha inicial', 'Fecha final'],
+      monthRange: ['Mes inicial', 'Mes final']
     },
     footer: {
       confirm: 'Aceptar',

package/lib/es/locale/source/fr.js

@@ -30,7 +30,8 @@ const local = {
       date: 'Sélectionner date',
       dateTime: 'Sélectionner date et temps',
       dateRange: ['Date de début', 'Date de fin'],
-      dateTimeRange: ['Date de début', 'Date de fin']
+      dateTimeRange: ['Date de début', 'Date de fin'],
+      monthRange: ['Mois de début', 'Mois de fin']
     },
     footer: {
       confirm: 'Confirmer',

package/lib/es/locale/source/id_ID.js

@@ -30,7 +30,8 @@ const local = {
       date: 'Pilih tanggal',
       dateTime: 'Pilih tanggal dan waktu',
       dateRange: ['Tanggal mulai', 'Tanggal akhir'],
-      dateTimeRange: ['Tanggal mulai', 'Tanggal akhir']
+      dateTimeRange: ['Tanggal mulai', 'Tanggal akhir'],
+      monthRange: ['Bulan pertama', 'Bulan terakhir']
     },
     footer: {
       confirm: 'Konfirmasi',

package/lib/es/locale/source/it.js

@@ -30,7 +30,8 @@ const local = {
       date: 'Seleziona data',
       dateTime: 'Seleziona data e ora',
       dateRange: ['Data inizio', 'Data fine'],
-      dateTimeRange: ['Data inizio', 'Data fine']
+      dateTimeRange: ['Data inizio', 'Data fine'],
+      monthRange: ['Mese inizio', 'Mese fine']
     },
     footer: {
       confirm: 'Conferma',

package/lib/es/locale/source/ja_JP.js

@@ -30,7 +30,8 @@ const local = {
       date: '日付を選択してください',
       dateTime: '日時を選択してください',
       dateRange: ['開始日', '終了日'],
-      dateTimeRange: ['開始日', '終了日']
+      dateTimeRange: ['開始日', '終了日'],
+      monthRange: ['開始月', '終了月']
     },
     footer: {
       confirm: '確認する',

package/lib/es/locale/source/ko_KR.js

@@ -31,7 +31,8 @@ const local = {
       date: '날짜 선택',
       dateTime: '날짜 및 시간 선택',
       dateRange: ['시작 날짜', '종료일'],
-      dateTimeRange: ['시작 날짜', '종료일']
+      dateTimeRange: ['시작 날짜', '종료일'],
+      monthRange: ['시작 월', '종료 월']
     },
     footer: {
       confirm: '확인',

package/lib/es/locale/source/ms_MY.js

@@ -30,7 +30,8 @@ const local = {
       date: 'Pilih tarikh',
       dateTime: 'Pilih tarikh dan masa',
       dateRange: ['Tarikh mula', 'Tarikh akhir'],
-      dateTimeRange: ['Tarikh mula', 'Tarikh akhir']
+      dateTimeRange: ['Tarikh mula', 'Tarikh akhir'],
+      monthRange: ['Bulan mula', 'Bulan akhir']
     },
     footer: {
       confirm: 'Sahkan',

package/lib/es/locale/source/nl_NL.js

@@ -36,7 +36,8 @@ const local = {
       date: 'Datum selecteren',
       dateTime: 'Datum en tijd selecteren',
       dateRange: ['Begindatum', 'Einddatum'],
-      dateTimeRange: ['Begindatum', 'Einddatum']
+      dateTimeRange: ['Begindatum', 'Einddatum'],
+      monthRange: ['Begindatum', 'Einddatum']
     },
     footer: {
       confirm: 'Bevestigen',

package/lib/es/locale/source/pl_PL.js

@@ -36,7 +36,8 @@ const local = {
       date: 'Wybierz datę',
       dateTime: 'Wybierz datę i godzinę',
       dateRange: ['Data rozpoczęcia', 'Data zakończenia'],
-      dateTimeRange: ['Data rozpoczęcia', 'Data zakończenia']
+      dateTimeRange: ['Data rozpoczęcia', 'Data zakończenia'],
+      monthRange: ['Miesiąc rozpoczęcia', 'Miesiąc zakończenia']
     },
     footer: {
       confirm: 'Potwierdź',

package/lib/es/locale/source/pt_BR.js

@@ -30,7 +30,8 @@ const local = {
       date: 'Por favor selecione uma data',
       dateTime: 'Selecione a data e hora',
       dateRange: ['Data de início', 'Data de fim'],
-      dateTimeRange: ['Data de início', 'Data de fim']
+      dateTimeRange: ['Data de início', 'Data de fim'],
+      monthRange: ['Mês de início', 'Mês de fim']
     },
     footer: {
       confirm: 'OK',

package/lib/es/locale/source/ro.d.ts

@@ -33,6 +33,7 @@ declare const _default: {
             dateTime: string;
             dateRange: string[];
             dateTimeRange: string[];
+            monthRange: string[];
         };
         footer: {
             confirm: string;

package/lib/es/locale/source/ro.js

@@ -34,7 +34,8 @@ export default {
       date: 'Selectează data',
       dateTime: 'Selectează data și ora',
       dateRange: ['Data de început', 'Data de sfârșit'],
-      dateTimeRange: ['Data de început', 'Data de sfârșit']
+      dateTimeRange: ['Data de început', 'Data de sfârșit'],
+      monthRange: ['Luna de început', 'Luna de sfârșit']
     },
     footer: {
       confirm: 'Confirmă',

package/lib/es/locale/source/ru_RU.js

@@ -33,7 +33,8 @@ const local = {
       date: 'Выбрать дату',
       dateTime: 'Выбрать дату и время',
       dateRange: ['Дата начала', 'Дата окончания'],
-      dateTimeRange: ['Дата начала', 'Дата окончания']
+      dateTimeRange: ['Дата начала', 'Дата окончания'],
+      monthRange: ['Начальный месяц', 'Конечный месяц']
     },
     footer: {
       confirm: 'подтвердить',

package/lib/es/locale/source/sv_SE.js

@@ -35,7 +35,8 @@ const local = {
       date: 'Välj datum',
       dateTime: 'Välj datum och tid',
       dateRange: ['Startdatum', 'Slutdatum'],
-      dateTimeRange: ['Startdatum', 'Slutdatum']
+      dateTimeRange: ['Startdatum', 'Slutdatum'],
+      monthRange: ['Startmånad', 'Slutmånad']
     },
     footer: {
       confirm: 'Bekräfta',

package/lib/es/locale/source/th_TH.js

@@ -33,7 +33,8 @@ const local = {
       date: 'โปรดเลือกวันที่',
       dateTime: 'โปรดเลือกวันที่และเวลา',
       dateRange: ['วันที่เริ่มต้น', 'วันที่สิ้นสุด'],
-      dateTimeRange: ['วันที่เริ่มต้น', 'วันที่สิ้นสุด']
+      dateTimeRange: ['วันที่เริ่มต้น', 'วันที่สิ้นสุด'],
+      monthRange: ['เดือนเริ่มต้น', 'เดือนสิ้นสุด']
     },
     footer: {
       confirm: 'ตกลง',

package/lib/es/locale/source/tr_TR.js

@@ -33,7 +33,8 @@ const local = {
       date: 'Lütfen bir tarih seçin',
       dateTime: 'Lütfen bir tarih ve saat seçin',
       dateRange: ['Başlangıç tarihi', 'Bitiş tarihi'],
-      dateTimeRange: ['Başlangıç tarihi', 'Bitiş tarihi']
+      dateTimeRange: ['Başlangıç tarihi', 'Bitiş tarihi'],
+      monthRange: ['Başlangıç ​​ayı', 'Bitiş ayı']
     },
     footer: {
       confirm: 'Tamam',

package/lib/es/locale/source/vi_VN.js

@@ -33,7 +33,8 @@ const local = {
       date: 'Chọn ngày',
       dateTime: 'Chọn ngày và giờ',
       dateRange: ['Ngày bắt đầu', 'Ngày kết thúc'],
-      dateTimeRange: ['Ngày bắt đầu', 'Ngày kết thúc']
+      dateTimeRange: ['Ngày bắt đầu', 'Ngày kết thúc'],
+      monthRange: ['Tháng bắt đầu', 'Tháng kết thúc']
     },
     footer: {
       confirm: 'Xác nhận',

package/lib/es/locale/source/zh_CN.js

@@ -30,7 +30,8 @@ const local = {
       date: '请选择日期',
       dateTime: '请选择日期及时间',
       dateRange: ['开始日期', '结束日期'],
-      dateTimeRange: ['开始日期', '结束日期']
+      dateTimeRange: ['开始日期', '结束日期'],
+      monthRange: ['开始月份', '结束月份']
     },
     footer: {
       confirm: '确定',

package/lib/es/locale/source/zh_TW.js

@@ -30,7 +30,8 @@ const local = {
       date: '請選擇日期',
       dateTime: '請選擇日期及時間',
       dateRange: ['開始日期', '結束日期'],
-      dateTimeRange: ['開始日期', '結束日期']
+      dateTimeRange: ['開始日期', '結束日期'],
+      monthRange: ['開始月份', '結束月份']
     },
     footer: {
       confirm: '確定',

package/lib/es/modal/Modal.js

@@ -135,10 +135,7 @@ class Modal extends BaseComponent {
         this._haveRendered = true;
       }
 
-      return /*#__PURE__*/React.createElement(Portal, {
-        style: wrapperStyle,
-        getPopupContainer: getPopupContainer
-      }, /*#__PURE__*/React.createElement(CSSAnimation, {
+      return /*#__PURE__*/React.createElement(CSSAnimation, {
         motion: this.props.motion,
         animationState: visible ? 'enter' : 'leave',
         startClassName: visible ? `${cssClasses.DIALOG}-content-animate-show` : `${cssClasses.DIALOG}-content-animate-hide`,
@@ -162,7 +159,10 @@ class Modal extends BaseComponent {
             animationClassName: maskAnimationClassName,
             animationEventsNeedBind: maskAnimationEventsNeedBind
           } = _ref2;
-          return shouldRender ? /*#__PURE__*/React.createElement(ModalContent, Object.assign({}, restProps, {
+          return shouldRender ? /*#__PURE__*/React.createElement(Portal, {
+            style: wrapperStyle,
+            getPopupContainer: getPopupContainer
+          }, " ", /*#__PURE__*/React.createElement(ModalContent, Object.assign({}, restProps, {
             contentExtraProps: animationEventsNeedBind,
             maskExtraProps: maskAnimationEventsNeedBind,
             isFullScreen: this.state.isFullScreen,
@@ -175,9 +175,9 @@ class Modal extends BaseComponent {
             ref: this.modalRef,
             footer: renderFooter,
             onClose: this.handleCancel
-          })) : /*#__PURE__*/React.createElement(React.Fragment, null);
+          }))) : /*#__PURE__*/React.createElement(React.Fragment, null);
         });
-      }));
+      });
     };
 
     this.state = {