@douyinfe/semi-ui 2.29.0 → 2.30.0-alpha.0

package/lib/es/collapsible/index.js

@@ -117,10 +117,10 @@ class Collapsible extends BaseComponent {
       overflow: 'hidden',
       height: this.props.isOpen ? this.state.domHeight : this.props.collapseHeight,
       opacity: this.props.isOpen || !this.props.fade || this.props.collapseHeight !== 0 ? 1 : 0,
-      transitionDuration: `${this.props.motion && this.state.isTransitioning ? this.props.duration : 0}ms`
+      transitionDuration: "".concat(this.props.motion && this.state.isTransitioning ? this.props.duration : 0, "ms")
     }, this.props.style);
-    const wrapperCls = cls(`${cssClasses.PREFIX}-wrapper`, {
-      [`${cssClasses.PREFIX}-transition`]: this.props.motion && this.state.isTransitioning
+    const wrapperCls = cls("".concat(cssClasses.PREFIX, "-wrapper"), {
+      ["".concat(cssClasses.PREFIX, "-transition")]: this.props.motion && this.state.isTransitioning
     }, this.props.className);
     return /*#__PURE__*/React.createElement("div", {
       className: wrapperCls,

package/lib/es/configProvider/index.js

@@ -23,7 +23,7 @@ export default class ConfigProvider extends React.Component {
 
     if (direction === 'rtl') {
       return /*#__PURE__*/React.createElement("div", {
-        className: `${BASE_CLASS_PREFIX}-rtl`
+        className: "".concat(BASE_CLASS_PREFIX, "-rtl")
       }, children);
     }
 

package/lib/es/datePicker/dateInput.js

@@ -75,7 +75,7 @@ export default class DateInput extends BaseComponent {
       const {
         rangeSeparator
       } = this.props;
-      const rangeInputValue = `${rangeStart}${rangeSeparator}${rangeEnd}`;
+      const rangeInputValue = "".concat(rangeStart).concat(rangeSeparator).concat(rangeEnd);
       return rangeInputValue;
     };
 
@@ -143,7 +143,7 @@ export default class DateInput extends BaseComponent {
     } = this.props;
     const labelNode = prefix || insetLabel;
     return labelNode ? /*#__PURE__*/React.createElement("div", {
-      className: `${prefixCls}-range-input-prefix`,
+      className: "".concat(prefixCls, "-range-input-prefix"),
       onClick: e => !disabled && !rangeInputFocus && this.handleRangeStartFocus(e),
       "x-semi-prop": "prefix,insetLabel"
     }, labelNode) : null;
@@ -155,8 +155,8 @@ export default class DateInput extends BaseComponent {
       rangeSeparator
     } = this.props;
     const separatorCls = cls({
-      [`${cssClasses.PREFIX}-range-input-separator`]: true,
-      [`${cssClasses.PREFIX}-range-input-separator-active`]: (rangeStart || rangeEnd) && !disabled
+      ["".concat(cssClasses.PREFIX, "-range-input-separator")]: true,
+      ["".concat(cssClasses.PREFIX, "-range-input-separator-active")]: (rangeStart || rangeEnd) && !disabled
     });
     return /*#__PURE__*/React.createElement("span", {
       onClick: e => !disabled && this.handleRangeStartFocus(e),
@@ -176,7 +176,7 @@ export default class DateInput extends BaseComponent {
       role: "button",
       tabIndex: 0,
       "aria-label": "Clear range input value",
-      className: `${prefixCls}-range-input-clearbtn`,
+      className: "".concat(prefixCls, "-range-input-clearbtn"),
       onMouseDown: e => !disabled && this.handleRangeInputClear(e)
     }, clearIcon ? clearIcon : /*#__PURE__*/React.createElement(IconClear, {
       "aria-hidden": true
@@ -190,7 +190,7 @@ export default class DateInput extends BaseComponent {
       rangeInputFocus
     } = this.props;
     const rangeSuffix = suffix ? /*#__PURE__*/React.createElement("div", {
-      className: `${prefixCls}-range-input-suffix`,
+      className: "".concat(prefixCls, "-range-input-suffix"),
       onClick: e => !disabled && !rangeInputFocus && this.handleRangeStartFocus(e)
     }, suffix) : null;
     return rangeSuffix;
@@ -220,16 +220,16 @@ export default class DateInput extends BaseComponent {
     const rangeSize = size === 'large' ? 'default' : 'small';
     const rangePlaceholder = Array.isArray(placeholder) ? placeholder : [placeholder, placeholder];
     const [rangeStartPlaceholder, rangeEndPlaceholder] = rangePlaceholder;
-    const inputLeftWrapperCls = cls(`${prefixCls}-range-input-wrapper-start`, `${prefixCls}-range-input-wrapper`, {
-      [`${prefixCls}-range-input-wrapper-active`]: rangeInputFocus === 'rangeStart' && !disabled,
-      [`${prefixCls}-range-input-wrapper-start-with-prefix`]: this.props.prefix || this.props.insetLabel
+    const inputLeftWrapperCls = cls("".concat(prefixCls, "-range-input-wrapper-start"), "".concat(prefixCls, "-range-input-wrapper"), {
+      ["".concat(prefixCls, "-range-input-wrapper-active")]: rangeInputFocus === 'rangeStart' && !disabled,
+      ["".concat(prefixCls, "-range-input-wrapper-start-with-prefix")]: this.props.prefix || this.props.insetLabel
     });
-    const inputRightWrapperCls = cls(`${prefixCls}-range-input-wrapper-end`, `${prefixCls}-range-input-wrapper`, {
-      [`${prefixCls}-range-input-wrapper-active`]: rangeInputFocus === 'rangeEnd' && !disabled
+    const inputRightWrapperCls = cls("".concat(prefixCls, "-range-input-wrapper-end"), "".concat(prefixCls, "-range-input-wrapper"), {
+      ["".concat(prefixCls, "-range-input-wrapper-active")]: rangeInputFocus === 'rangeEnd' && !disabled
     });
     return /*#__PURE__*/React.createElement(React.Fragment, null, this.renderRangePrefix(), /*#__PURE__*/React.createElement("div", {
       onClick: e => !disabled && this.handleRangeInputFocus(e, 'rangeStart'),
-      className: `${inputCls} ${inputLeftWrapperCls}`
+      className: "".concat(inputCls, " ").concat(inputLeftWrapperCls)
     }, /*#__PURE__*/React.createElement(Input, {
       size: rangeSize,
       style: inputStyle,
@@ -245,7 +245,7 @@ export default class DateInput extends BaseComponent {
       autofocus: autofocus,
       ref: rangeInputStartRef
     })), this.renderRangeSeparator(rangeStart, rangeEnd), /*#__PURE__*/React.createElement("div", {
-      className: `${inputCls} ${inputRightWrapperCls}`,
+      className: "".concat(inputCls, " ").concat(inputRightWrapperCls),
       onClick: e => !disabled && this.handleRangeInputFocus(e, 'rangeEnd')
     }, /*#__PURE__*/React.createElement(Input, {
       size: rangeSize,
@@ -296,8 +296,8 @@ export default class DateInput extends BaseComponent {
       datePlaceholder,
       timePlaceholder
     } = this.foundation.getInsetInputPlaceholder();
-    const insetInputWrapperCls = `${prefixCls}-inset-input-wrapper`;
-    const separatorCls = `${prefixCls}-inset-input-separator`;
+    const insetInputWrapperCls = "".concat(prefixCls, "-inset-input-wrapper");
+    const separatorCls = "".concat(prefixCls, "-inset-input-separator");
     return /*#__PURE__*/React.createElement("div", {
       className: insetInputWrapperCls,
       "x-type": type
@@ -391,7 +391,7 @@ export default class DateInput extends BaseComponent {
     }
 
     const inputCls = cls({
-      [`${prefixCls}-input-readonly`]: inputReadOnly
+      ["".concat(prefixCls, "-input-readonly")]: inputReadOnly
     });
     const isRangeType = /range/i.test(type);
     const rangeProps = Object.assign(Object.assign({}, this.props), {

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

@@ -62,7 +62,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
         max: PropTypes.Requireable<number>;
         placeholder: PropTypes.Requireable<NonNullable<string | any[]>>;
         presets: PropTypes.Requireable<any[]>;
-        presetPosition: PropTypes.Requireable<"left" | "top" | "right" | "bottom">;
+        presetPosition: PropTypes.Requireable<"top" | "left" | "right" | "bottom">;
         onChange: PropTypes.Requireable<(...args: any[]) => any>;
         onChangeWithDateFirst: PropTypes.Requireable<boolean>;
         weekStartsOn: PropTypes.Requireable<number>;
@@ -79,7 +79,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
         insetLabel: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         insetLabelId: PropTypes.Requireable<string>;
         zIndex: PropTypes.Requireable<number>;
-        position: PropTypes.Requireable<"left" | "top" | "right" | "bottom" | "topLeft" | "topRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom" | "bottomLeft" | "bottomRight" | "leftTopOver" | "rightTopOver">;
+        position: PropTypes.Requireable<"top" | "topLeft" | "topRight" | "left" | "leftTop" | "leftBottom" | "right" | "rightTop" | "rightBottom" | "bottom" | "bottomLeft" | "bottomRight" | "leftTopOver" | "rightTopOver">;
         getPopupContainer: PropTypes.Requireable<(...args: any[]) => any>;
         onCancel: PropTypes.Requireable<(...args: any[]) => any>;
         onConfirm: PropTypes.Requireable<(...args: any[]) => any>;

package/lib/es/datePicker/datePicker.js

@@ -147,17 +147,17 @@ export default class DatePicker extends BaseComponent {
       } = this.props;
       const wrapCls = classnames(cssClasses.PREFIX, {
         [cssClasses.PANEL_YAM]: this.adapter.typeIsYearOrMonth(),
-        [`${cssClasses.PREFIX}-compact`]: density === 'compact'
+        ["".concat(cssClasses.PREFIX, "-compact")]: density === 'compact'
       }, dropdownClassName);
       return /*#__PURE__*/React.createElement("div", {
         ref: this.panelRef,
         className: wrapCls,
         style: dropdownStyle
       }, topSlot && /*#__PURE__*/React.createElement("div", {
-        className: `${cssClasses.PREFIX}-topSlot`,
+        className: "".concat(cssClasses.PREFIX, "-topSlot"),
         "x-semi-prop": "topSlot"
       }, topSlot), presetPosition === "top" && this.renderQuickControls(), this.adapter.typeIsYearOrMonth() ? this.renderYearMonthPanel(locale, localeCode) : this.renderMonthGrid(locale, localeCode, dateFnsLocale), presetPosition === "bottom" && this.renderQuickControls(), bottomSlot && /*#__PURE__*/React.createElement("div", {
-        className: `${cssClasses.PREFIX}-bottomSlot`,
+        className: "".concat(cssClasses.PREFIX, "-bottomSlot"),
         "x-semi-prop": "bottomSlot"
       }, bottomSlot), this.renderFooter(locale, localeCode));
     };
@@ -655,12 +655,12 @@ export default class DatePicker extends BaseComponent {
 
     const isRangeType = this.isRangeType(type, triggerRender);
     const inputDisabled = disabled || insetInput && triggerDisabled;
-    const inputCls = classnames(`${cssClasses.PREFIX}-input`, {
-      [`${cssClasses.PREFIX}-range-input`]: isRangeType,
-      [`${cssClasses.PREFIX}-range-input-${size}`]: isRangeType && size,
-      [`${cssClasses.PREFIX}-range-input-active`]: isRangeType && rangeInputFocus && !inputDisabled,
-      [`${cssClasses.PREFIX}-range-input-disabled`]: isRangeType && inputDisabled,
-      [`${cssClasses.PREFIX}-range-input-${validateStatus}`]: isRangeType && validateStatus
+    const inputCls = classnames("".concat(cssClasses.PREFIX, "-input"), {
+      ["".concat(cssClasses.PREFIX, "-range-input")]: isRangeType,
+      ["".concat(cssClasses.PREFIX, "-range-input-").concat(size)]: isRangeType && size,
+      ["".concat(cssClasses.PREFIX, "-range-input-active")]: isRangeType && rangeInputFocus && !inputDisabled,
+      ["".concat(cssClasses.PREFIX, "-range-input-disabled")]: isRangeType && inputDisabled,
+      ["".concat(cssClasses.PREFIX, "-range-input-").concat(validateStatus)]: isRangeType && validateStatus
     });
     const phText = placeholder || locale.placeholder[type]; // i18n
     // These values should be passed to triggerRender, do not delete any key if it is not necessary

package/lib/es/datePicker/footer.js

@@ -10,7 +10,7 @@ export default function Footer() {
     onCancelClick,
     onConfirmClick
   } = props;
-  const wrapCls = classnames(`${prefixCls}-footer`);
+  const wrapCls = classnames("".concat(prefixCls, "-footer"));
   return /*#__PURE__*/React.createElement("div", {
     className: wrapCls
   }, /*#__PURE__*/React.createElement(Button, {

package/lib/es/datePicker/index.js

@@ -24,7 +24,7 @@ export default forwardStatics( /*#__PURE__*/React.forwardRef((props, ref) => {
 
 
   if (rangeSeparator && typeof rangeSeparator === 'string') {
-    propsObj.rangeSeparator = ` ${rangeSeparator.trim()} `;
+    propsObj.rangeSeparator = " ".concat(rangeSeparator.trim(), " ");
   }
 
   if (propsObj.insetInput) {

package/lib/es/datePicker/month.js

@@ -321,7 +321,7 @@ export default class Month extends BaseComponent {
       locale
     } = this.props;
     const weekdayCls = classNames(cssClasses.WEEKDAY);
-    const weekdayItemCls = classNames(`${prefixCls}-weekday-item`);
+    const weekdayItemCls = classNames("".concat(prefixCls, "-weekday-item"));
     const {
       weekdays
     } = this.state; // i18n
@@ -419,7 +419,7 @@ export default class Month extends BaseComponent {
       [cssClasses.DAY_HOVER_DAY_AROUND_SINGLE_SELECTED]: dayStatus.isHoverDayAroundOneSelected
     });
     const dayMainCls = classNames({
-      [`${cssClasses.DAY}-main`]: true
+      ["".concat(cssClasses.DAY, "-main")]: true
     });
     const fullDateArgs = [dayNumber, fullDate, dayStatus];
 

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

@@ -51,7 +51,7 @@ export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGri
         onPanelChange: PropTypes.Requireable<(...args: any[]) => any>;
         focusRecordsRef: PropTypes.Requireable<object>;
         triggerRender: PropTypes.Requireable<(...args: any[]) => any>;
-        presetPosition: PropTypes.Requireable<"left" | "top" | "right" | "bottom">;
+        presetPosition: PropTypes.Requireable<"top" | "left" | "right" | "bottom">;
         renderQuickControls: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         renderDateInput: PropTypes.Requireable<PropTypes.ReactNodeLike>;
     };
@@ -86,7 +86,7 @@ export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGri
     renderMonth(month: Date, panelType: PanelType): JSX.Element;
     handleWeeksRowNumChange: (weeksRowNum: number, panelType: PanelType) => void;
     reselect: () => void;
-    getYAMOpenType: () => "both" | "none" | "left" | "right";
+    getYAMOpenType: () => "left" | "right" | "none" | "both";
     renderTimePicker(panelType: PanelType, panelDetail: MonthInfo): JSX.Element;
     renderYearAndMonth(panelType: PanelType, panelDetail: MonthInfo): JSX.Element;
     renderSwitch(panelType: PanelType): JSX.Element;

package/lib/es/datePicker/monthsGrid.js

@@ -65,10 +65,10 @@ export default class MonthsGrid extends BaseComponent {
 
 
     this.calcScrollListHeight = () => {
-      const wrapLeft = this.adapter.getCache(`wrap-${strings.PANEL_TYPE_LEFT}`);
-      const wrapRight = this.adapter.getCache(`wrap-${strings.PANEL_TYPE_RIGHT}`);
-      const switchLeft = this.adapter.getCache(`switch-${strings.PANEL_TYPE_LEFT}`);
-      const switchRight = this.adapter.getCache(`switch-${strings.PANEL_TYPE_RIGHT}`);
+      const wrapLeft = this.adapter.getCache("wrap-".concat(strings.PANEL_TYPE_LEFT));
+      const wrapRight = this.adapter.getCache("wrap-".concat(strings.PANEL_TYPE_RIGHT));
+      const switchLeft = this.adapter.getCache("switch-".concat(strings.PANEL_TYPE_LEFT));
+      const switchRight = this.adapter.getCache("switch-".concat(strings.PANEL_TYPE_RIGHT));
       const leftRect = wrapLeft && wrapLeft.getBoundingClientRect();
       const rightRect = wrapRight && wrapRight.getBoundingClientRect();
       let leftHeight = leftRect && leftRect.height || 0;
@@ -104,7 +104,7 @@ export default class MonthsGrid extends BaseComponent {
     };
 
     this.reselect = () => {
-      const refKeys = [`timepicker-${strings.PANEL_TYPE_LEFT}`, `timepicker-${strings.PANEL_TYPE_RIGHT}`, `yam-${strings.PANEL_TYPE_LEFT}`, `yam-${strings.PANEL_TYPE_RIGHT}`];
+      const refKeys = ["timepicker-".concat(strings.PANEL_TYPE_LEFT), "timepicker-".concat(strings.PANEL_TYPE_RIGHT), "yam-".concat(strings.PANEL_TYPE_LEFT), "yam-".concat(strings.PANEL_TYPE_RIGHT)];
       refKeys.forEach(key => {
         const current = this.adapter.getCache(key);
 
@@ -247,7 +247,7 @@ export default class MonthsGrid extends BaseComponent {
   }
 
   renderPanel(month, panelType) {
-    let monthCls = classnames(`${prefixCls}-month-grid-${panelType}`);
+    let monthCls = classnames("".concat(prefixCls, "-month-grid-").concat(panelType));
     const {
       monthLeft,
       monthRight,
@@ -263,14 +263,14 @@ export default class MonthsGrid extends BaseComponent {
     } = panelDetail;
     const panelContent = this.renderMonth(month, panelType);
     const yearAndMonthLayer = isYearPickerOpen ? /*#__PURE__*/React.createElement("div", {
-      className: `${prefixCls}-yam`
+      className: "".concat(prefixCls, "-yam")
     }, this.renderYearAndMonth(panelType, panelDetail)) : null;
     const timePickerLayer = isTimePickerOpen ? /*#__PURE__*/React.createElement("div", {
-      className: `${prefixCls}-tpk`
+      className: "".concat(prefixCls, "-tpk")
     }, this.renderTimePicker(panelType, panelDetail)) : null;
     const style = {};
-    const wrapLeft = this.adapter.getCache(`wrap-${strings.PANEL_TYPE_LEFT}`);
-    const wrapRight = this.adapter.getCache(`wrap-${strings.PANEL_TYPE_RIGHT}`);
+    const wrapLeft = this.adapter.getCache("wrap-".concat(strings.PANEL_TYPE_LEFT));
+    const wrapRight = this.adapter.getCache("wrap-".concat(strings.PANEL_TYPE_RIGHT));
     const wrap = panelType === strings.PANEL_TYPE_RIGHT ? wrapRight : wrapLeft;
 
     if (this.foundation.isRangeType()) {
@@ -293,7 +293,7 @@ export default class MonthsGrid extends BaseComponent {
         style.minHeight = currentPanelHeight ? currentPanelHeight : this.calcScrollListHeight();
       }
     } else if (this.props.type !== 'year' && this.props.type !== 'month' && (isTimePickerOpen || isYearPickerOpen)) {
-      monthCls = classnames(monthCls, `${prefixCls}-yam-showing`);
+      monthCls = classnames(monthCls, "".concat(prefixCls, "-yam-showing"));
     }
 
     const _isDatePanelOpen = !(isYearPickerOpen || isTimePickerOpen);
@@ -372,10 +372,10 @@ export default class MonthsGrid extends BaseComponent {
     }
 
     return /*#__PURE__*/React.createElement("div", {
-      ref: current => this.cacheRefCurrent(`wrap-${panelType}`, current),
+      ref: current => this.cacheRefCurrent("wrap-".concat(panelType), current),
       style: style
     }, /*#__PURE__*/React.createElement(Navigation, {
-      forwardRef: current => this.cacheRefCurrent(`nav-${panelType}`, current),
+      forwardRef: current => this.cacheRefCurrent("nav-".concat(panelType), current),
       monthText: monthText,
       density: density,
       onMonthClick: e => this.showYearPicker(panelType, e),
@@ -388,7 +388,7 @@ export default class MonthsGrid extends BaseComponent {
     }), /*#__PURE__*/React.createElement(Month, {
       locale: locale,
       localeCode: localeCode,
-      forwardRef: current => this.cacheRefCurrent(`month-${panelType}`, current),
+      forwardRef: current => this.cacheRefCurrent("month-".concat(panelType), current),
       disabledDate: disabledDate,
       weekStartsOn: weekStartsOn,
       month: month,
@@ -424,7 +424,7 @@ export default class MonthsGrid extends BaseComponent {
     const {
       pickerDate
     } = panelDetail;
-    const timePanelCls = classnames(`${prefixCls}-time`);
+    const timePanelCls = classnames("".concat(prefixCls, "-time"));
     const restProps = Object.assign(Object.assign({}, timePickerOpts), {
       hideDisabledOptions
     });
@@ -458,7 +458,7 @@ export default class MonthsGrid extends BaseComponent {
     return /*#__PURE__*/React.createElement("div", {
       className: timePanelCls
     }, /*#__PURE__*/React.createElement(Combobox, Object.assign({
-      ref: current => this.cacheRefCurrent(`timepicker-${panelType}`, current),
+      ref: current => this.cacheRefCurrent("timepicker-".concat(panelType), current),
       panelHeader: placeholder,
       format: format || strings.FORMAT_TIME_PICKER,
       timeStampValue: pickerDate,
@@ -479,7 +479,7 @@ export default class MonthsGrid extends BaseComponent {
     const y = pickerDate.getFullYear();
     const m = pickerDate.getMonth() + 1;
     return /*#__PURE__*/React.createElement(YearAndMonth, {
-      ref: current => this.cacheRefCurrent(`yam-${panelType}`, current),
+      ref: current => this.cacheRefCurrent("yam-".concat(panelType), current),
       locale: locale,
       localeCode: localeCode,
       currentYear: y,
@@ -487,7 +487,7 @@ export default class MonthsGrid extends BaseComponent {
       onSelect: item => this.foundation.toYearMonth(panelType, new Date(item.currentYear, item.currentMonth - 1)),
       onBackToMain: () => {
         this.foundation.showDatePanel(panelType);
-        const wrapCurrent = this.adapter.getCache(`wrap-${panelType}`);
+        const wrapCurrent = this.adapter.getCache("wrap-".concat(panelType));
 
         if (wrapCurrent) {
           wrapCurrent.style.height = 'auto';
@@ -544,20 +544,20 @@ export default class MonthsGrid extends BaseComponent {
     const monthText = showDate ? formatFn(showDate, FORMAT_SWITCH_DATE) : '';
     const timeText = showDate ? formatFn(showDate, formatTimePicker) : '';
     const showSwitchIcon = ['default'].includes(density);
-    const switchCls = classnames(`${prefixCls}-switch`);
+    const switchCls = classnames("".concat(prefixCls, "-switch"));
     const dateCls = classnames({
-      [`${prefixCls}-switch-date`]: true,
-      [`${prefixCls}-switch-date-active`]: !isTimePickerOpen
+      ["".concat(prefixCls, "-switch-date")]: true,
+      ["".concat(prefixCls, "-switch-date-active")]: !isTimePickerOpen
     });
     const timeCls = classnames({
-      [`${prefixCls}-switch-time`]: true,
-      [`${prefixCls}-switch-time-disabled`]: disabledTimePicker,
-      [`${prefixCls}-switch-date-active`]: isTimePickerOpen
+      ["".concat(prefixCls, "-switch-time")]: true,
+      ["".concat(prefixCls, "-switch-time-disabled")]: disabledTimePicker,
+      ["".concat(prefixCls, "-switch-date-active")]: isTimePickerOpen
     });
-    const textCls = classnames(`${prefixCls}-switch-text`);
+    const textCls = classnames("".concat(prefixCls, "-switch-text"));
     return /*#__PURE__*/React.createElement("div", {
       className: switchCls,
-      ref: current => this.adapter.setCache(`switch-${panelType}`, current)
+      ref: current => this.adapter.setCache("switch-".concat(panelType), current)
     }, /*#__PURE__*/React.createElement("div", {
       role: "button",
       "aria-label": "Switch to date panel",
@@ -592,7 +592,7 @@ export default class MonthsGrid extends BaseComponent {
       renderDateInput
     } = this.props;
     const monthGridCls = classnames({
-      [`${prefixCls}-month-grid`]: true
+      ["".concat(prefixCls, "-month-grid")]: true
     });
     const panelTypeLeft = strings.PANEL_TYPE_LEFT;
     const panelTypeRight = strings.PANEL_TYPE_RIGHT;

package/lib/es/datePicker/navigation.js

@@ -77,7 +77,7 @@ export default class Navigation extends PureComponent {
       noHorizontalPadding: btnNoHorizontalPadding,
       style: leftButtonStyle
     }), /*#__PURE__*/React.createElement("div", {
-      className: `${prefixCls}-month`
+      className: "".concat(prefixCls, "-month")
     }, /*#__PURE__*/React.createElement(Button, {
       onClick: onMonthClick,
       theme: btnTheme,

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

@@ -14,7 +14,7 @@ export interface QuickControlProps {
 declare class QuickControl extends PureComponent<QuickControlProps> {
     static propTypes: {
         presets: PropTypes.Requireable<any[]>;
-        presetPosition: PropTypes.Requireable<"left" | "top" | "right" | "bottom">;
+        presetPosition: PropTypes.Requireable<"top" | "left" | "right" | "bottom">;
         onPresetClick: PropTypes.Requireable<(...args: any[]) => any>;
         type: PropTypes.Requireable<string>;
         insetInput: PropTypes.Requireable<NonNullable<boolean | object>>;

package/lib/es/datePicker/quickControl.js

@@ -25,30 +25,30 @@ class QuickControl extends PureComponent {
     const isMonth = type === 'month';
     const isTopAndBottomRange = isPanelTopAndBottom && isTypeRange;
     const isTopAndBottomMonth = isPanelTopAndBottom && isMonth;
-    const wrapperCls = classNames(`${prefixCls}-quick-control`, {
-      [`${prefixCls}-quick-control-${type}`]: type,
-      [`${prefixCls}-quick-control-${presetPosition}`]: true
+    const wrapperCls = classNames("".concat(prefixCls, "-quick-control"), {
+      ["".concat(prefixCls, "-quick-control-").concat(type)]: type,
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition)]: true
     });
     const headerCls = classNames({
-      [`${prefixCls}-quick-control-header`]: true
+      ["".concat(prefixCls, "-quick-control-header")]: true
     });
     const contentWrapperCls = classNames({
-      [`${prefixCls}-quick-control-${presetPosition}-content-wrapper`]: true
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-content-wrapper")]: true
     });
     const contentCls = classNames({
-      [`${prefixCls}-quick-control-${presetPosition}-content`]: !isTopAndBottomRange && !isTopAndBottomMonth,
-      [`${prefixCls}-quick-control-${presetPosition}-range-content`]: isTopAndBottomRange,
-      [`${prefixCls}-quick-control-${presetPosition}-month-content`]: isTopAndBottomMonth
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-content")]: !isTopAndBottomRange && !isTopAndBottomMonth,
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-range-content")]: isTopAndBottomRange,
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-month-content")]: isTopAndBottomMonth
     });
     const itemCls = classNames({
-      [`${prefixCls}-quick-control-${presetPosition}-content-item`]: !isTopAndBottomRange && !isTopAndBottomMonth,
-      [`${prefixCls}-quick-control-${presetPosition}-range-content-item`]: isTopAndBottomRange,
-      [`${prefixCls}-quick-control-${presetPosition}-month-content-item`]: isTopAndBottomMonth
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-content-item")]: !isTopAndBottomRange && !isTopAndBottomMonth,
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-range-content-item")]: isTopAndBottomRange,
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-month-content-item")]: isTopAndBottomMonth
     });
     const ellipsisCls = classNames({
-      [`${prefixCls}-quick-control-${presetPosition}-content-item-ellipsis`]: !isTopAndBottomRange && !isTopAndBottomMonth,
-      [`${prefixCls}-quick-control-${presetPosition}-range-content-item-ellipsis`]: isTopAndBottomRange,
-      [`${prefixCls}-quick-control-${presetPosition}-month-content-item-ellipsis`]: isTopAndBottomMonth
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-content-item-ellipsis")]: !isTopAndBottomRange && !isTopAndBottomMonth,
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-range-content-item-ellipsis")]: isTopAndBottomRange,
+      ["".concat(prefixCls, "-quick-control-").concat(presetPosition, "-month-content-item-ellipsis")]: isTopAndBottomMonth
     });
 
     if (!presets.length) {

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

@@ -20,7 +20,7 @@ declare class YearAndMonth extends BaseComponent<YearAndMonthProps, YearAndMonth
         noBackBtn: PropTypes.Requireable<boolean>;
         disabledDate: PropTypes.Requireable<(...args: any[]) => any>;
         density: PropTypes.Requireable<string>;
-        presetPosition: PropTypes.Requireable<"left" | "top" | "right" | "bottom">;
+        presetPosition: PropTypes.Requireable<"top" | "left" | "right" | "bottom">;
         renderQuickControls: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         renderDateInput: PropTypes.Requireable<PropTypes.ReactNodeLike>;
     };

package/lib/es/datePicker/yearAndMonth.js

@@ -15,7 +15,7 @@ import { IconChevronLeft } from '@douyinfe/semi-icons';
 import { BASE_CLASS_PREFIX } from '@douyinfe/semi-foundation/lib/es/base/constants';
 import { setYear, setMonth, set } from 'date-fns';
 import { strings } from '@douyinfe/semi-foundation/lib/es/datePicker/constants';
-const prefixCls = `${BASE_CLASS_PREFIX}-datepicker`;
+const prefixCls = "".concat(BASE_CLASS_PREFIX, "-datepicker");
 
 class YearAndMonth extends BaseComponent {
   constructor(props) {
@@ -145,7 +145,7 @@ class YearAndMonth extends BaseComponent {
 
     if (localeCode === 'zh-CN' || localeCode === 'zh-TW') {
       // Only Chinese needs to add [year] after the selected year
-      transform = val => `${val}年`;
+      transform = val => "".concat(val, "\u5E74");
     }
 
     return /*#__PURE__*/React.createElement(ScrollItem, Object.assign({
@@ -180,7 +180,7 @@ class YearAndMonth extends BaseComponent {
 
     if (localeCode === 'zh-CN' || localeCode === 'zh-TW') {
       // Only Chinese needs to add [month] after the selected month
-      transform = val => `${val}月`;
+      transform = val => "".concat(val, "\u6708");
     } // i18n
 
 
@@ -218,7 +218,7 @@ class YearAndMonth extends BaseComponent {
       renderQuickControls,
       renderDateInput
     } = this.props;
-    const prefix = `${prefixCls}-yearmonth-header`; // i18n
+    const prefix = "".concat(prefixCls, "-yearmonth-header"); // i18n
 
     const selectDateText = locale.selectDate;
     const iconSize = density === 'compact' ? 'default' : 'large';

package/lib/es/descriptions/index.js

@@ -20,9 +20,9 @@ class Descriptions extends PureComponent {
       data
     } = this.props;
     const classNames = cls(prefixCls, className, {
-      [`${prefixCls}-${align}`]: !row,
-      [`${prefixCls}-double`]: row,
-      [`${prefixCls}-double-${size}`]: row
+      ["".concat(prefixCls, "-").concat(align)]: !row,
+      ["".concat(prefixCls, "-double")]: row,
+      ["".concat(prefixCls, "-double-").concat(size)]: row
     });
     const childrenList = data && data.length ? data.map((item, index) => _isPlainObject(item) ? /*#__PURE__*/React.createElement(Item, Object.assign({
       itemKey: item.key

package/lib/es/descriptions/item.js

@@ -4,8 +4,8 @@ import { cssClasses } from '@douyinfe/semi-foundation/lib/es/descriptions/consta
 import '@douyinfe/semi-foundation/lib/es/descriptions/descriptions.css';
 import DescriptionsContext from './descriptions-context';
 const prefixCls = cssClasses.PREFIX;
-const keyCls = `${prefixCls}-key`;
-const valCls = `${prefixCls}-value`;
+const keyCls = "".concat(prefixCls, "-key");
+const valCls = "".concat(prefixCls, "-value");
 export default class Item extends PureComponent {
   render() {
     const {
@@ -27,7 +27,7 @@ export default class Item extends PureComponent {
       className: className,
       style: style
     }, /*#__PURE__*/React.createElement("td", {
-      className: `${prefixCls}-item`
+      className: "".concat(prefixCls, "-item")
     }, /*#__PURE__*/React.createElement("span", {
       className: keyCls
     }, itemKey, ":"), /*#__PURE__*/React.createElement("span", {
@@ -36,11 +36,11 @@ export default class Item extends PureComponent {
       className: className,
       style: style
     }, /*#__PURE__*/React.createElement("th", {
-      className: `${prefixCls}-item ${prefixCls}-item-th`
+      className: "".concat(prefixCls, "-item ").concat(prefixCls, "-item-th")
     }, /*#__PURE__*/React.createElement("span", {
       className: keyCls
     }, itemKey)), /*#__PURE__*/React.createElement("td", {
-      className: `${prefixCls}-item ${prefixCls}-item-td`
+      className: "".concat(prefixCls, "-item ").concat(prefixCls, "-item-td")
     }, /*#__PURE__*/React.createElement("span", {
       className: valCls
     }, typeof children === 'function' ? children() : children)));

package/lib/es/divider/index.js

@@ -27,12 +27,12 @@ const Divider = props => {
   } = props,
         rest = __rest(props, ["layout", "dashed", "align", "className", "margin", "style", "children"]);
 
-  const dividerClassNames = cls(`${prefixCls}-divider`, className, {
-    [`${prefixCls}-divider-horizontal`]: layout === 'horizontal',
-    [`${prefixCls}-divider-vertical`]: layout === 'vertical',
-    [`${prefixCls}-divider-dashed`]: !!dashed,
-    [`${prefixCls}-divider-with-text`]: children && layout === 'horizontal',
-    [`${prefixCls}-divider-with-text-${align}`]: children && layout === 'horizontal'
+  const dividerClassNames = cls("".concat(prefixCls, "-divider"), className, {
+    ["".concat(prefixCls, "-divider-horizontal")]: layout === 'horizontal',
+    ["".concat(prefixCls, "-divider-vertical")]: layout === 'vertical',
+    ["".concat(prefixCls, "-divider-dashed")]: !!dashed,
+    ["".concat(prefixCls, "-divider-with-text")]: children && layout === 'horizontal',
+    ["".concat(prefixCls, "-divider-with-text-").concat(align)]: children && layout === 'horizontal'
   });
   let overrideDefaultStyle = {};
 
@@ -54,7 +54,7 @@ const Divider = props => {
     className: dividerClassNames,
     style: Object.assign(Object.assign({}, overrideDefaultStyle), style)
   }), children && layout === 'horizontal' ? typeof children === 'string' ? /*#__PURE__*/React.createElement("span", {
-    className: `${prefixCls}-divider_inner-text`,
+    className: "".concat(prefixCls, "-divider_inner-text"),
     "x-semi-prop": "children"
   }, children) : children : null);
 };

package/lib/es/dropdown/dropdownDivider.js

@@ -11,7 +11,7 @@ const DropdownDivider = function () {
     className
   } = props;
   return /*#__PURE__*/React.createElement("div", {
-    className: classnames(`${prefixCls}-divider`, className),
+    className: classnames("".concat(prefixCls, "-divider"), className),
     style: style
   });
 };