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

package/lib/es/radio/radio.js

@@ -174,29 +174,29 @@ class Radio extends BaseComponent {
     const prefix = realPrefixCls || css.PREFIX;
     const focusOuter = isCardRadioGroup || isPureCardRadioGroup || isButtonRadio;
     const wrapper = cls(prefix, {
-      ["".concat(prefix, "-disabled")]: isDisabled,
-      ["".concat(prefix, "-checked")]: realChecked,
-      ["".concat(prefix, "-").concat(displayMode)]: Boolean(displayMode),
-      ["".concat(prefix, "-buttonRadioComponent")]: isButtonRadioComponent,
-      ["".concat(prefix, "-buttonRadioGroup")]: isButtonRadioGroup,
-      ["".concat(prefix, "-buttonRadioGroup-").concat(buttonSize)]: isButtonRadioGroup && buttonSize,
-      ["".concat(prefix, "-cardRadioGroup")]: isCardRadioGroup,
-      ["".concat(prefix, "-cardRadioGroup_disabled")]: isDisabled && isCardRadioGroup,
-      ["".concat(prefix, "-cardRadioGroup_checked")]: isCardRadioGroup && realChecked && !isDisabled,
-      ["".concat(prefix, "-cardRadioGroup_checked_disabled")]: isCardRadioGroup && realChecked && isDisabled,
-      ["".concat(prefix, "-cardRadioGroup_hover")]: isCardRadioGroup && !realChecked && isHover && !isDisabled,
+      [`${prefix}-disabled`]: isDisabled,
+      [`${prefix}-checked`]: realChecked,
+      [`${prefix}-${displayMode}`]: Boolean(displayMode),
+      [`${prefix}-buttonRadioComponent`]: isButtonRadioComponent,
+      [`${prefix}-buttonRadioGroup`]: isButtonRadioGroup,
+      [`${prefix}-buttonRadioGroup-${buttonSize}`]: isButtonRadioGroup && buttonSize,
+      [`${prefix}-cardRadioGroup`]: isCardRadioGroup,
+      [`${prefix}-cardRadioGroup_disabled`]: isDisabled && isCardRadioGroup,
+      [`${prefix}-cardRadioGroup_checked`]: isCardRadioGroup && realChecked && !isDisabled,
+      [`${prefix}-cardRadioGroup_checked_disabled`]: isCardRadioGroup && realChecked && isDisabled,
+      [`${prefix}-cardRadioGroup_hover`]: isCardRadioGroup && !realChecked && isHover && !isDisabled,
       [className]: Boolean(className),
-      ["".concat(prefix, "-focus")]: focusVisible && (isCardRadioGroup || isPureCardRadioGroup)
+      [`${prefix}-focus`]: focusVisible && (isCardRadioGroup || isPureCardRadioGroup)
     });
     const groupName = this.isInGroup() && this.context.radioGroup.name;
     const addonCls = cls({
-      ["".concat(prefix, "-addon")]: !isButtonRadio,
-      ["".concat(prefix, "-addon-buttonRadio")]: isButtonRadio,
-      ["".concat(prefix, "-addon-buttonRadio-checked")]: isButtonRadio && realChecked,
-      ["".concat(prefix, "-addon-buttonRadio-disabled")]: isButtonRadio && isDisabled,
-      ["".concat(prefix, "-addon-buttonRadio-hover")]: isButtonRadio && !realChecked && !isDisabled && isHover,
-      ["".concat(prefix, "-addon-buttonRadio-").concat(buttonSize)]: isButtonRadio && buttonSize,
-      ["".concat(prefix, "-focus")]: focusVisible && isButtonRadio
+      [`${prefix}-addon`]: !isButtonRadio,
+      [`${prefix}-addon-buttonRadio`]: isButtonRadio,
+      [`${prefix}-addon-buttonRadio-checked`]: isButtonRadio && realChecked,
+      [`${prefix}-addon-buttonRadio-disabled`]: isButtonRadio && isDisabled,
+      [`${prefix}-addon-buttonRadio-hover`]: isButtonRadio && !realChecked && !isDisabled && isHover,
+      [`${prefix}-addon-buttonRadio-${buttonSize}`]: isButtonRadio && buttonSize,
+      [`${prefix}-focus`]: focusVisible && isButtonRadio
     }, addonClassName);
 
     const renderContent = () => {
@@ -205,8 +205,8 @@ class Radio extends BaseComponent {
       }
 
       return /*#__PURE__*/React.createElement("div", {
-        className: cls(["".concat(prefix, "-content"), {
-          ["".concat(prefix, "-isCardRadioGroup_content")]: isCardRadioGroup
+        className: cls([`${prefix}-content`, {
+          [`${prefix}-isCardRadioGroup_content`]: isCardRadioGroup
         }])
       }, children ? /*#__PURE__*/React.createElement("span", {
         className: addonCls,
@@ -214,7 +214,7 @@ class Radio extends BaseComponent {
         id: addonId,
         "x-semi-prop": "children"
       }, children) : null, extra && !isButtonRadio ? /*#__PURE__*/React.createElement("div", {
-        className: "".concat(prefix, "-extra"),
+        className: `${prefix}-extra`,
         id: extraId,
         "x-semi-prop": "extra"
       }, extra) : null);

package/lib/es/radio/radioGroup.d.ts

@@ -48,7 +48,7 @@ declare class RadioGroup extends BaseComponent<RadioGroupProps, RadioGroupState>
         disabled: PropTypes.Requireable<boolean>;
         name: PropTypes.Requireable<string>;
         options: PropTypes.Requireable<any[]>;
-        buttonSize: PropTypes.Requireable<"small" | "middle" | "large">;
+        buttonSize: PropTypes.Requireable<"small" | "large" | "middle">;
         type: PropTypes.Requireable<"default" | "button" | "card" | "pureCard">;
         value: PropTypes.Requireable<any>;
         onChange: PropTypes.Requireable<(...args: any[]) => any>;

package/lib/es/radio/radioGroup.js

@@ -79,11 +79,11 @@ class RadioGroup extends BaseComponent {
     const prefix = prefixCls || css.PREFIX;
     const prefixClsDisplay = classnames(className, {
       [prefix]: true,
-      ["".concat(prefix, "-wrapper")]: true,
-      ["".concat(prefix, "-").concat(direction)]: direction && !isButtonRadio,
-      ["".concat(prefix, "-").concat(direction, "-default")]: direction && isDefaultRadio,
-      ["".concat(prefix, "-").concat(direction, "-card")]: direction && isCardRadio,
-      ["".concat(prefix, "-buttonRadio")]: isButtonRadio
+      [`${prefix}-wrapper`]: true,
+      [`${prefix}-${direction}`]: direction && !isButtonRadio,
+      [`${prefix}-${direction}-default`]: direction && isDefaultRadio,
+      [`${prefix}-${direction}-card`]: direction && isCardRadio,
+      [`${prefix}-buttonRadio`]: isButtonRadio
     });
     const realValue = this.state.value;
     let inner;

package/lib/es/radio/radioInner.js

@@ -82,15 +82,15 @@ class RadioInner extends BaseComponent {
     } = this.state;
     const prefix = this.props.prefixCls || css.PREFIX;
     const wrapper = classnames({
-      ["".concat(prefix, "-inner")]: true,
-      ["".concat(prefix, "-inner-checked")]: Boolean(checked),
-      ["".concat(prefix, "-inner-buttonRadio")]: isButtonRadio,
-      ["".concat(prefix, "-inner-pureCardRadio")]: isPureCardRadioGroup
+      [`${prefix}-inner`]: true,
+      [`${prefix}-inner-checked`]: Boolean(checked),
+      [`${prefix}-inner-buttonRadio`]: isButtonRadio,
+      [`${prefix}-inner-pureCardRadio`]: isPureCardRadioGroup
     });
     const inner = classnames({
-      ["".concat(prefix, "-focus")]: focusInner,
-      ["".concat(prefix, "-focus-border")]: focusInner && !checked,
-      ["".concat(prefix, "-inner-display")]: !isButtonRadio
+      [`${prefix}-focus`]: focusInner,
+      [`${prefix}-focus-border`]: focusInner && !checked,
+      [`${prefix}-inner-display`]: !isButtonRadio
     });
     return /*#__PURE__*/React.createElement("span", {
       className: wrapper

package/lib/es/rating/index.js

@@ -119,7 +119,7 @@ export default class Rating extends BaseComponent {
           ref: this.saveRef(ind),
           index: ind,
           count: count,
-          prefixCls: "".concat(prefixCls, "-star"),
+          prefixCls: `${prefixCls}-star`,
           allowHalf: allowHalf,
           value: hoverValue === undefined ? value : hoverValue,
           onClick: disabled ? noop : this.onClick,
@@ -141,7 +141,7 @@ export default class Rating extends BaseComponent {
             visible: showTips,
             trigger: "custom",
             content: text,
-            key: "".concat(ind, "-").concat(showTips)
+            key: `${ind}-${showTips}`
           }, content);
         }
 
@@ -279,11 +279,11 @@ export default class Rating extends BaseComponent {
       emptyStarFocusVisible
     } = this.state;
     const ariaLabelPrefix = this.getAriaLabelPrefix();
-    const ariaLabel = "Rating: ".concat(value, " of ").concat(count, " ").concat(ariaLabelPrefix).concat(value === 1 ? '' : 's', ",");
+    const ariaLabel = `Rating: ${value} of ${count} ${ariaLabelPrefix}${value === 1 ? '' : 's'},`;
     const itemList = this.getItemList(ariaLabelPrefix);
     const listCls = cls(prefixCls, {
-      ["".concat(prefixCls, "-disabled")]: disabled,
-      ["".concat(prefixCls, "-focus")]: emptyStarFocusVisible
+      [`${prefixCls}-disabled`]: disabled,
+      [`${prefixCls}-focus`]: emptyStarFocusVisible
     }, className);
     return (
       /*#__PURE__*/

package/lib/es/rating/item.js

@@ -128,9 +128,9 @@ export default class Item extends BaseComponent {
     const isFull = starValue <= value;
     const isCustomSize = typeof size === 'number';
     const starCls = cls(prefixCls, {
-      ["".concat(prefixCls, "-half")]: isHalf,
-      ["".concat(prefixCls, "-full")]: isFull,
-      ["".concat(prefixCls, "-").concat(size)]: !isCustomSize
+      [`${prefixCls}-half`]: isHalf,
+      [`${prefixCls}-full`]: isFull,
+      [`${prefixCls}-${size}`]: !isCustomSize
     });
     const sizeStyle = isCustomSize ? {
       width: size,
@@ -145,9 +145,9 @@ export default class Item extends BaseComponent {
       }
     });
     const isEmpty = index === count;
-    const starWrapCls = cls("".concat(prefixCls, "-wrapper"), {
-      ["".concat(prefixCls, "-disabled")]: disabled,
-      ["".concat(cssClasses.PREFIX, "-focus")]: (firstStarFocus || secondStarFocus) && value !== 0
+    const starWrapCls = cls(`${prefixCls}-wrapper`, {
+      [`${prefixCls}-disabled`]: disabled,
+      [`${cssClasses.PREFIX}-focus`]: (firstStarFocus || secondStarFocus) && value !== 0
     });
     const starWrapProps = {
       onClick: disabled ? null : this.onClick,
@@ -163,10 +163,10 @@ export default class Item extends BaseComponent {
       'aria-posinset': 2 * index + 1,
       'aria-setsize': AriaSetSize,
       'aria-disabled': disabled,
-      'aria-label': "".concat(index + 0.5, " ").concat(ariaLabelPrefix, "s"),
+      'aria-label': `${index + 0.5} ${ariaLabelPrefix}s`,
       'aria-labelledby': this.props['aria-describedby'],
       'aria-describedby': this.props['aria-describedby'],
-      className: cls("".concat(prefixCls, "-first"), "".concat(cssClasses.PREFIX, "-no-focus")),
+      className: cls(`${prefixCls}-first`, `${cssClasses.PREFIX}-no-focus`),
       tabIndex: !disabled && value === index + 0.5 ? 0 : -1,
       onFocus: e => {
         this.onFocus(e, 'first');
@@ -183,10 +183,10 @@ export default class Item extends BaseComponent {
       'aria-posinset': allowHalf ? 2 * (index + 1) : index + 1,
       'aria-setsize': AriaSetSize,
       'aria-disabled': disabled,
-      'aria-label': "".concat(isEmpty ? 0 : index + 1, " ").concat(ariaLabelPrefix).concat(index === 0 ? '' : 's'),
+      'aria-label': `${isEmpty ? 0 : index + 1} ${ariaLabelPrefix}${index === 0 ? '' : 's'}`,
       'aria-labelledby': this.props['aria-describedby'],
       'aria-describedby': this.props['aria-describedby'],
-      className: cls("".concat(prefixCls, "-second"), "".concat(cssClasses.PREFIX, "-no-focus")),
+      className: cls(`${prefixCls}-second`, `${cssClasses.PREFIX}-no-focus`),
       tabIndex: secondStarTabIndex,
       onFocus: e => {
         this.onFocus(e, 'second');
@@ -201,7 +201,7 @@ export default class Item extends BaseComponent {
       key: index
     }, /*#__PURE__*/React.createElement("div", Object.assign({}, starWrapProps), allowHalf && !isEmpty && /*#__PURE__*/React.createElement("div", Object.assign({}, firstStarProps, {
       style: {
-        width: "".concat(firstWidth * 100, "%")
+        width: `${firstWidth * 100}%`
       }
     }), content), /*#__PURE__*/React.createElement("div", Object.assign({}, secondStarProps, {
       "x-semi-prop": "character"

package/lib/es/scrollList/index.js

@@ -27,7 +27,7 @@ class ScrollList extends BaseComponent {
       [prefixCls || cssClasses.PREFIX]: true
     });
     const clsHeader = classnames({
-      ["".concat(prefixCls || cssClasses.PREFIX, "-header")]: true
+      [`${prefixCls || cssClasses.PREFIX}-header`]: true
     });
     return /*#__PURE__*/React.createElement("div", {
       className: clsWrapper,
@@ -35,18 +35,18 @@ class ScrollList extends BaseComponent {
     }, header ? /*#__PURE__*/React.createElement("div", {
       className: clsHeader
     }, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(clsHeader, "-title"),
+      className: `${clsHeader}-title`,
       "x-semi-prop": this.props['x-semi-header-alias'] || "header"
     }, header), /*#__PURE__*/React.createElement("div", {
-      className: "".concat(clsWrapper, "-line")
+      className: `${clsWrapper}-line`
     })) : null, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(clsWrapper, "-body"),
+      className: `${clsWrapper}-body`,
       style: {
         height: bodyHeight ? bodyHeight : ''
       },
       "x-semi-prop": "children"
     }, children), footer ? /*#__PURE__*/React.createElement("div", {
-      className: "".concat(clsWrapper, "-footer"),
+      className: `${clsWrapper}-footer`,
       "x-semi-prop": this.props['x-semi-footer-alias'] || "footer"
     }, footer) : null);
   }

package/lib/es/scrollList/scrollItem.js

@@ -127,7 +127,7 @@ export default class ScrollItem extends BaseComponent {
         const {
           children
         } = list;
-        const reg = new RegExp("\\s*".concat(selectedCls, "\\s*"), 'g');
+        const reg = new RegExp(`\\s*${selectedCls}\\s*`, 'g');
 
         _map(children, node => {
           node.className = node.className && node.className.replace(reg, ' ');
@@ -138,7 +138,7 @@ export default class ScrollItem extends BaseComponent {
         });
 
         if (selectedNode.className && !blankReg.test(selectedNode.className)) {
-          selectedNode.className += " ".concat(selectedCls);
+          selectedNode.className += ` ${selectedCls}`;
         } else {
           selectedNode.className = selectedCls;
         }
@@ -276,8 +276,8 @@ export default class ScrollItem extends BaseComponent {
         const transform = typeof itemTrans === 'function' ? itemTrans : commonTrans;
         const selected = selectedIndex === index;
         const cls = classnames({
-          ["".concat(cssClasses.PREFIX, "-item-sel")]: selected && mode !== wheelMode,
-          ["".concat(cssClasses.PREFIX, "-item-disabled")]: Boolean(item.disabled)
+          [`${cssClasses.PREFIX}-item-sel`]: selected && mode !== wheelMode,
+          [`${cssClasses.PREFIX}-item-disabled`]: Boolean(item.disabled)
         });
         let text = '';
 
@@ -321,7 +321,7 @@ export default class ScrollItem extends BaseComponent {
         style
       } = this.props;
       const inner = this.renderItemList();
-      const wrapperCls = classnames("".concat(cssClasses.PREFIX, "-item"), className);
+      const wrapperCls = classnames(`${cssClasses.PREFIX}-item`, className);
       return /*#__PURE__*/React.createElement("div", {
         style: style,
         className: wrapperCls,
@@ -351,25 +351,25 @@ export default class ScrollItem extends BaseComponent {
       } = this.state;
 
       const prependList = _times(prependCount).reduce((arr, num) => {
-        const items = this.renderItemList("pre_".concat(num, "_"));
+        const items = this.renderItemList(`pre_${num}_`);
         arr.unshift(...items);
         return arr;
       }, []);
 
       const appendList = _times(appendCount).reduce((arr, num) => {
-        const items = this.renderItemList("app_".concat(num, "_"));
+        const items = this.renderItemList(`app_${num}_`);
         arr.push(...items);
         return arr;
       }, []);
 
       const inner = this.renderItemList();
-      const listWrapperCls = classnames("".concat(cssClasses.PREFIX, "-list-outer"), {
-        ["".concat(cssClasses.PREFIX, "-list-outer-nocycle")]: !cycled
+      const listWrapperCls = classnames(`${cssClasses.PREFIX}-list-outer`, {
+        [`${cssClasses.PREFIX}-list-outer-nocycle`]: !cycled
       });
-      const wrapperCls = classnames("".concat(cssClasses.PREFIX, "-item-wheel"), className);
-      const selectorCls = classnames("".concat(cssClasses.PREFIX, "-selector"));
-      const preShadeCls = classnames("".concat(cssClasses.PREFIX, "-shade"), "".concat(cssClasses.PREFIX, "-shade-pre"));
-      const postShadeCls = classnames("".concat(cssClasses.PREFIX, "-shade"), "".concat(cssClasses.PREFIX, "-shade-post"));
+      const wrapperCls = classnames(`${cssClasses.PREFIX}-item-wheel`, className);
+      const selectorCls = classnames(`${cssClasses.PREFIX}-selector`);
+      const preShadeCls = classnames(`${cssClasses.PREFIX}-shade`, `${cssClasses.PREFIX}-shade-pre`);
+      const postShadeCls = classnames(`${cssClasses.PREFIX}-shade`, `${cssClasses.PREFIX}-shade-post`);
       return /*#__PURE__*/React.createElement("div", {
         className: wrapperCls,
         style: style

package/lib/es/select/index.d.ts

@@ -181,7 +181,7 @@ declare class Select extends BaseComponent<SelectProps, SelectState> {
         expandRestTagsOnClick: PropTypes.Requireable<boolean>;
         onDropdownVisibleChange: PropTypes.Requireable<(...args: any[]) => any>;
         zIndex: PropTypes.Requireable<number>;
-        position: PropTypes.Requireable<"top" | "topLeft" | "topRight" | "left" | "leftTop" | "leftBottom" | "right" | "rightTop" | "rightBottom" | "bottom" | "bottomLeft" | "bottomRight" | "leftTopOver" | "rightTopOver" | "leftBottomOver" | "rightBottomOver">;
+        position: PropTypes.Requireable<"left" | "top" | "right" | "bottom" | "topLeft" | "topRight" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom" | "bottomLeft" | "bottomRight" | "leftTopOver" | "rightTopOver" | "leftBottomOver" | "rightBottomOver">;
         onSearch: PropTypes.Requireable<(...args: any[]) => any>;
         getPopupContainer: PropTypes.Requireable<(...args: any[]) => any>;
         dropdownClassName: PropTypes.Requireable<string>;