@douyinfe/semi-ui 2.12.0-alpha.0 → 2.12.0-beta.2

package/lib/es/rating/item.js

@@ -98,8 +98,7 @@ export default class Item extends PureComponent {
         width: "".concat(firstWidth * 100, "%")
       }
     }, content), /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-second"),
-      "x-semi-prop": "character"
+      className: "".concat(prefixCls, "-second")
     }, content)));
   }
 

package/lib/es/scrollList/index.js

@@ -35,19 +35,16 @@ class ScrollList extends BaseComponent {
     }, header ? /*#__PURE__*/React.createElement("div", {
       className: clsHeader
     }, /*#__PURE__*/React.createElement("div", {
-      className: "".concat(clsHeader, "-title"),
-      "x-semi-prop": this.props['x-semi-header-alias'] || "header"
+      className: "".concat(clsHeader, "-title")
     }, header), /*#__PURE__*/React.createElement("div", {
       className: "".concat(clsWrapper, "-line")
     })) : null, /*#__PURE__*/React.createElement("div", {
       className: "".concat(clsWrapper, "-body"),
       style: {
         height: bodyHeight ? bodyHeight : ''
-      },
-      "x-semi-prop": "children"
+      }
     }, children), footer ? /*#__PURE__*/React.createElement("div", {
-      className: "".concat(clsWrapper, "-footer"),
-      "x-semi-prop": this.props['x-semi-footer-alias'] || "footer"
+      className: "".concat(clsWrapper, "-footer")
     }, footer) : null);
   }
 

package/lib/es/select/index.js

@@ -663,8 +663,7 @@ class Select extends BaseComponent {
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
       className: contentWrapperCls
     }, /*#__PURE__*/React.createElement("span", {
-      className: spanCls,
-      "x-semi-prop": "placeholder"
+      className: spanCls
     }, renderText || renderText === 0 ? renderText : placeholder), filterable && showInput ? this.renderInput() : null));
   }
 
@@ -826,8 +825,7 @@ class Select extends BaseComponent {
       ["".concat(prefixcls, "-suffix-icon")]: isSemiIcon(suffix)
     });
     return /*#__PURE__*/React.createElement("div", {
-      className: suffixWrapperCls,
-      "x-semi-prop": "suffix"
+      className: suffixWrapperCls
     }, suffix);
   }
 
@@ -846,8 +844,7 @@ class Select extends BaseComponent {
     });
     return /*#__PURE__*/React.createElement("div", {
       className: prefixWrapperCls,
-      id: insetLabelId,
-      "x-semi-prop": "prefix,insetLabel"
+      id: insetLabelId
     }, labelNode);
   }
 
@@ -899,8 +896,7 @@ class Select extends BaseComponent {
     });
     const showClear = this.props.showClear && (selections.size || inputValue) && !disabled && (isHovering || isOpen);
     const arrowContent = showArrow ? /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixcls, "-arrow"),
-      "x-semi-prop": "arrowIcon"
+      className: "".concat(prefixcls, "-arrow")
     }, arrowIcon) : /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixcls, "-arrow-empty")
     });

package/lib/es/select/option.js

@@ -100,8 +100,7 @@ class Option extends PureComponent {
       return /*#__PURE__*/React.createElement(LocaleConsumer, {
         componentName: "Select"
       }, locale => /*#__PURE__*/React.createElement("div", {
-        className: optionClassName,
-        "x-semi-prop": "emptyContent"
+        className: optionClassName
       }, emptyContent || locale.emptyText));
     } // Since there are empty, locale and other logic, the custom renderOptionItem is directly converged to the internal option instead of being placed in Select/index
 

package/lib/es/sideSheet/SideSheetContent.js

@@ -79,8 +79,7 @@ export default class SideSheetContent extends React.PureComponent {
 
     if (title) {
       header = /*#__PURE__*/React.createElement("div", {
-        className: "".concat(prefixCls, "-title"),
-        "x-semi-prop": "title"
+        className: "".concat(prefixCls, "-title")
       }, this.props.title);
     }
 
@@ -135,11 +134,9 @@ export default class SideSheetContent extends React.PureComponent {
       className: "".concat(prefixCls, "-content")
     }, header, /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixCls, "-body"),
-      style: props.bodyStyle,
-      "x-semi-prop": "children"
+      style: props.bodyStyle
     }, props.children), props.footer ? /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-footer"),
-      "x-semi-prop": "footer"
+      className: "".concat(prefixCls, "-footer")
     }, props.footer) : null));
     return dialogElement;
   }

package/lib/es/skeleton/index.js

@@ -43,9 +43,7 @@ class Skeleton extends PureComponent {
       content = /*#__PURE__*/React.createElement("div", _Object$assign({
         className: skCls,
         style: style
-      }, others, {
-        "x-semi-prop": "placeholder"
-      }), placeholder);
+      }, others), placeholder);
     } else {
       content = children;
     }

package/lib/es/space/index.js

@@ -66,8 +66,7 @@ class Space extends PureComponent {
     const childrenNodes = flatten(children);
     return /*#__PURE__*/React.createElement("div", {
       className: classNames,
-      style: realStyle,
-      "x-semi-prop": "children"
+      style: realStyle
     }, childrenNodes);
   }
 

package/lib/es/spin/index.js

@@ -67,11 +67,8 @@ class Spin extends BaseComponent {
     return loading ? /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixCls, "-wrapper")
     }, indicator ? /*#__PURE__*/React.createElement("div", {
-      className: spinIconCls,
-      "x-semi-prop": "indicator"
-    }, indicator) : /*#__PURE__*/React.createElement(SpinIcon, null), tip ? /*#__PURE__*/React.createElement("div", {
-      "x-semi-prop": "tip"
-    }, tip) : null) : null;
+      className: spinIconCls
+    }, indicator) : /*#__PURE__*/React.createElement(SpinIcon, null), tip ? /*#__PURE__*/React.createElement("div", null, tip) : null) : null;
   }
 
   render() {
@@ -98,8 +95,7 @@ class Spin extends BaseComponent {
       style: style
     }, this.renderSpin(), /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixCls, "-children"),
-      style: childStyle,
-      "x-semi-prop": "children"
+      style: childStyle
     }, children));
   }
 

package/lib/es/switch/index.js

@@ -119,21 +119,19 @@ class Switch extends BaseComponent {
       className: cssClasses.KNOB,
       "aria-hidden": true
     }), showCheckedText ? /*#__PURE__*/React.createElement("div", {
-      className: cssClasses.CHECKED_TEXT,
-      "x-semi-prop": "checkedText"
+      className: cssClasses.CHECKED_TEXT
     }, checkedText) : null, showUncheckedText ? /*#__PURE__*/React.createElement("div", {
-      className: cssClasses.UNCHECKED_TEXT,
-      "x-semi-prop": "uncheckedText"
+      className: cssClasses.UNCHECKED_TEXT
     }, uncheckedText) : null, /*#__PURE__*/React.createElement("input", _Object$assign({}, switchProps, {
       ref: this.switchRef,
       id: id,
-      role: "switch",
+      role: 'switch',
       "aria-checked": nativeControlChecked,
       "aria-invalid": this.props['aria-invalid'],
       "aria-errormessage": this.props['aria-errormessage'],
       "aria-label": this.props['aria-label'],
       "aria-labelledby": this.props['aria-labelledby'],
-      "aria-describedby": this.props['aria-describedby'],
+      "aria-describedby": this.props["aria-describedby"],
       "aria-disabled": this.props['disabled'],
       onChange: e => this.foundation.handleChange(e.target.checked, e),
       onFocus: e => this.handleFocusVisible(e),

package/lib/es/table/Table.d.ts

@@ -280,7 +280,7 @@ declare class Table<RecordType extends Record<string, any>> extends BaseComponen
      * Combine pagination and table paging processing functions
      */
     mergePagination: (pagination: TablePaginationProps) => {
-        position?: "both" | "top" | "bottom";
+        position?: "top" | "bottom" | "both";
         formatPageText?: import("./interface").FormatPageText;
         style?: React.CSSProperties;
         className?: string;

package/lib/es/table/Table.js

@@ -582,8 +582,7 @@ class Table extends BaseComponent {
       }
 
       return /*#__PURE__*/isValidElement(title) || typeof title === 'string' ? /*#__PURE__*/React.createElement("div", {
-        className: "".concat(prefixCls, "-title"),
-        "x-semi-prop": "title"
+        className: "".concat(prefixCls, "-title")
       }, title) : null;
     };
 
@@ -608,8 +607,7 @@ class Table extends BaseComponent {
       }, (locale, localeCode) => /*#__PURE__*/React.createElement("div", {
         className: wrapCls
       }, /*#__PURE__*/React.createElement("div", {
-        className: "".concat(prefixCls, "-empty"),
-        "x-semi-prop": "empty"
+        className: "".concat(prefixCls, "-empty")
       }, empty || locale.emptyText)));
     };
 
@@ -629,8 +627,7 @@ class Table extends BaseComponent {
 
       return /*#__PURE__*/isValidElement(footer) || typeof footer === 'string' ? /*#__PURE__*/React.createElement("div", {
         className: "".concat(prefixCls, "-footer"),
-        key: "footer",
-        "x-semi-prop": "footer"
+        key: "footer"
       }, footer) : null;
     };
 

package/lib/es/tabs/TabBar.js

@@ -246,8 +246,7 @@ class TabBar extends React.Component {
 
       return /*#__PURE__*/React.createElement("div", {
         className: extraCls,
-        style: tabBarStyle,
-        "x-semi-prop": "tabBarExtraContent"
+        style: tabBarStyle
       }, tabBarExtraContent);
     }
 

package/lib/es/tabs/TabPane.js

@@ -116,17 +116,14 @@ class TabPane extends PureComponent {
       style: style,
       "aria-hidden": active ? 'false' : 'true',
       tabIndex: 0
-    }, getDataAttr(restProps), {
-      "x-semi-prop": "children"
-    }), motion ? /*#__PURE__*/React.createElement(TabPaneTransition, {
+    }, getDataAttr(restProps)), motion ? /*#__PURE__*/React.createElement(TabPaneTransition, {
       direction: this.getDirection(this.context.activeKey, itemKey, this.context.panes),
       motion: motion,
       mode: tabPosition === 'top' ? 'horizontal' : 'vertical',
       state: active ? 'enter' : 'leave'
     }, transitionStyle => /*#__PURE__*/React.createElement("div", {
       className: "".concat(cssClasses.TABS_PANE_MOTION_OVERLAY),
-      style: _Object$assign({}, transitionStyle),
-      "x-semi-prop": "children"
+      style: _Object$assign({}, transitionStyle)
     }, shouldRender ? children : null)) : shouldRender ? children : null);
   }
 

package/lib/es/tagInput/index.js

@@ -195,8 +195,7 @@ class TagInput extends BaseComponent {
       ["".concat(prefixCls, "-prefix-icon")]: /*#__PURE__*/React.isValidElement(prefix) && !(prefix && _isString(prefix))
     });
     return /*#__PURE__*/React.createElement("div", {
-      className: prefixWrapperCls,
-      "x-semi-prop": "prefix"
+      className: prefixWrapperCls
     }, prefix);
   }
 
@@ -215,8 +214,7 @@ class TagInput extends BaseComponent {
       ["".concat(prefixCls, "-suffix-icon")]: /*#__PURE__*/React.isValidElement(suffix) && !(suffix && _isString(suffix))
     });
     return /*#__PURE__*/React.createElement("div", {
-      className: suffixWrapperCls,
-      "x-semi-prop": "suffix"
+      className: suffixWrapperCls
     }, suffix);
   }
 

package/lib/es/timePicker/Combobox.js

@@ -278,9 +278,7 @@ class Combobox extends BaseComponent {
       componentName: "TimePicker"
     }, (locale, localeCode) => /*#__PURE__*/React.createElement(ScrollList, {
       header: panelHeader,
-      footer: panelFooter,
-      "x-semi-header-alias": "panelHeader",
-      "x-semi-footer-alias": "panelFooter"
+      footer: panelFooter
     }, this.renderAMPMSelect(locale, localeCode), this.renderHourSelect(value.getHours(), locale), this.renderMinuteSelect(value.getMinutes(), locale), this.renderSecondSelect(value.getSeconds(), locale)));
   }
 

package/lib/es/toast/toast.js

@@ -111,7 +111,7 @@ class Toast extends BaseComponent {
     const btnTheme = 'borderless';
     const btnSize = 'small';
     return /*#__PURE__*/React.createElement("div", {
-      role: "alert",
+      role: 'alert',
       "aria-label": "".concat(type ? type : 'default', " type"),
       className: toastCls,
       style: style,
@@ -121,16 +121,13 @@ class Toast extends BaseComponent {
       className: "".concat(prefixCls, "-content")
     }, this.renderIcon(), /*#__PURE__*/React.createElement("span", {
       className: "".concat(prefixCls, "-content-text"),
-      style: textStyle,
-      "x-semi-prop": "content"
+      style: textStyle
     }, content), showClose && /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixCls, "-close-button")
     }, /*#__PURE__*/React.createElement(Button, {
       onClick: e => this.close(e),
       type: "tertiary",
-      icon: /*#__PURE__*/React.createElement(IconClose, {
-        "x-semi-prop": "icon"
-      }),
+      icon: /*#__PURE__*/React.createElement(IconClose, null),
       theme: btnTheme,
       size: btnSize
     }))));

package/lib/es/tooltip/TooltipStyledTransition.js

@@ -15,12 +15,15 @@ const TooltipTransition = function () {
   const {
     children
   } = props;
-  const motion = getMotionObjFromProps(props);
+  const motion = getMotionObjFromProps(props); //  add fillMode forward to fix issue 715, tooltip close will flashing under react 18
+
   return /*#__PURE__*/React.createElement(StyledTransition, _Object$assign({}, props, {
     enter: enterCls,
     leave: leaveCls,
     duration: '100ms'
-  }, motion), typeof children === 'function' ? _ref => {
+  }, motion, {
+    fillMode: 'forward'
+  }), typeof children === 'function' ? _ref => {
     let {
       animateCls,
       animateEvents,

package/lib/es/transfer/index.js

@@ -237,8 +237,7 @@ class Transfer extends BaseComponent {
       className: leftItemCls,
       checked: checked,
       role: "listitem",
-      onChange: () => this.onSelectOrRemove(item),
-      "x-semi-children-alias": "dataSource[".concat(index, "].label")
+      onChange: () => this.onSelectOrRemove(item)
     }, item.label);
   }
 

package/lib/es/tree/treeNode.js

@@ -373,8 +373,7 @@ export default class TreeNode extends PureComponent {
     return /*#__PURE__*/React.createElement("ul", {
       className: wrapperCls
     }, /*#__PURE__*/React.createElement("li", {
-      className: _concatInstanceProperty(_context2 = "".concat(prefixcls, "-label ")).call(_context2, prefixcls, "-label-empty"),
-      "x-semi-prop": "emptyContent"
+      className: _concatInstanceProperty(_context2 = "".concat(prefixcls, "-label ")).call(_context2, prefixcls, "-label-empty")
     }, emptyContent));
   } // eslint-disable-next-line max-lines-per-function
 

package/lib/es/treeSelect/index.js

@@ -59,8 +59,7 @@ class TreeSelect extends BaseComponent {
         ["".concat(prefixcls, "-suffix-icon")]: isSemiIcon(suffix)
       });
       return /*#__PURE__*/React.createElement("div", {
-        className: suffixWrapperCls,
-        "x-semi-prop": "suffix"
+        className: suffixWrapperCls
       }, suffix);
     };
 
@@ -80,8 +79,7 @@ class TreeSelect extends BaseComponent {
       });
       return /*#__PURE__*/React.createElement("div", {
         className: prefixWrapperCls,
-        id: insetLabelId,
-        "x-semi-prop": "prefix,insetLabel"
+        id: insetLabelId
       }, labelNode);
     };
 
@@ -338,8 +336,7 @@ class TreeSelect extends BaseComponent {
       }
 
       return arrowIcon ? /*#__PURE__*/React.createElement("div", {
-        className: cls("".concat(prefixcls, "-arrow")),
-        "x-semi-prop": "arrowIcon"
+        className: cls("".concat(prefixcls, "-arrow"))
       }, arrowIcon) : null;
     };
 

package/lib/es/typography/base.js

@@ -536,8 +536,7 @@ export default class Base extends Component {
 
     const iconSize = size === 'small' ? 'small' : 'default';
     return /*#__PURE__*/React.createElement("span", {
-      className: "".concat(prefixCls, "-icon"),
-      "x-semi-prop": "icon"
+      className: "".concat(prefixCls, "-icon")
     }, isSemiIcon(icon) ? /*#__PURE__*/React.cloneElement(icon, {
       size: iconSize
     }) : icon);

package/lib/es/typography/title.d.ts

@@ -37,7 +37,7 @@ export default class Title extends PureComponent<TitleProps> {
         underline: PropTypes.Requireable<boolean>;
         strong: PropTypes.Requireable<boolean>;
         type: PropTypes.Requireable<"warning" | "success" | "primary" | "tertiary" | "secondary" | "danger" | "quaternary">;
-        heading: PropTypes.Requireable<4 | 1 | 2 | 3 | 5 | 6>;
+        heading: PropTypes.Requireable<1 | 2 | 3 | 4 | 5 | 6>;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;
         component: PropTypes.Requireable<string>;

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

@@ -6,7 +6,7 @@ import BaseComponent, { ValidateStatus } from '../_base/baseComponent';
 import { FileItem, RenderFileItemProps, UploadListType, PromptPositionType, BeforeUploadProps, AfterUploadProps, OnChangeProps, customRequestArgs, CustomError } from './interface';
 import { Locale } from '../locale/interface';
 import '@douyinfe/semi-foundation/lib/es/upload/upload.css';
-export { FileItem, RenderFileItemProps, UploadListType, PromptPositionType, BeforeUploadProps, AfterUploadProps, OnChangeProps, customRequestArgs, CustomError, BeforeUploadObjectResult, AfterUploadResult, };
+export { FileItem, RenderFileItemProps, UploadListType, PromptPositionType, BeforeUploadProps, AfterUploadProps, OnChangeProps, customRequestArgs, CustomError, BeforeUploadObjectResult, AfterUploadResult };
 export interface UploadProps {
     accept?: string;
     action: string;

package/lib/es/upload/index.js

@@ -230,9 +230,7 @@ class Upload extends BaseComponent {
         });
       }
 
-      const addContent = /*#__PURE__*/React.createElement("div", _Object$assign({}, addContentProps, {
-        "x-semi-prop": "children"
-      }), children);
+      const addContent = /*#__PURE__*/React.createElement("div", _Object$assign({}, addContentProps), children);
 
       if (!showUploadList || !fileList.length) {
         if (showAddTriggerInList) {
@@ -365,18 +363,15 @@ class Upload extends BaseComponent {
         onDragEnter: this.onDragEnter,
         onClick: this.onClick
       }, children ? children : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-        className: "".concat(dragAreaBaseCls, "-icon"),
-        "x-semi-prop": "dragIcon"
+        className: "".concat(dragAreaBaseCls, "-icon")
       }, dragIcon || /*#__PURE__*/React.createElement(IconUpload, {
         size: "extra-large"
       })), /*#__PURE__*/React.createElement("div", {
         className: "".concat(dragAreaBaseCls, "-text")
       }, /*#__PURE__*/React.createElement("div", {
-        className: "".concat(dragAreaBaseCls, "-main-text"),
-        "x-semi-prop": "dragMainText"
+        className: "".concat(dragAreaBaseCls, "-main-text")
       }, dragMainText || locale.mainText), /*#__PURE__*/React.createElement("div", {
-        className: "".concat(dragAreaBaseCls, "-sub-text"),
-        "x-semi-prop": "dragSubText"
+        className: "".concat(dragAreaBaseCls, "-sub-text")
       }, dragSubText), /*#__PURE__*/React.createElement("div", {
         className: "".concat(dragAreaBaseCls, "-tips")
       }, dragAreaStatus === strings.DRAG_AREA_LEGAL && /*#__PURE__*/React.createElement("span", {
@@ -562,11 +557,9 @@ class Upload extends BaseComponent {
       className: inputReplaceCls,
       ref: this.replaceInputRef
     }), this.renderAddContent(), prompt ? /*#__PURE__*/React.createElement("div", {
-      className: promptCls,
-      "x-semi-prop": "prompt"
+      className: promptCls
     }, prompt) : null, validateMessage ? /*#__PURE__*/React.createElement("div", {
-      className: validateMsgCls,
-      "x-semi-prop": "validateMessage"
+      className: validateMsgCls
     }, validateMessage) : null, this.renderFileList());
   }
 

package/list/index.tsx

@@ -71,11 +71,7 @@ class List<T = any> extends BaseComponent<ListProps<T>> {
     renderEmpty = () => {
         const { emptyContent } = this.props;
         if (emptyContent) {
-            return (
-                <div className={`${cssClasses.PREFIX}-empty`} x-semi-prop="emptyContent">
-                    {emptyContent}
-                </div>
-            );
+            return (<div className={`${cssClasses.PREFIX}-empty`}>{emptyContent}</div>);
         } else {
             return (
                 <LocaleConsumer componentName="List">
@@ -156,27 +152,19 @@ class List<T = any> extends BaseComponent<ListProps<T>> {
         }
         return (
             <div className={wrapperCls} style={style}>
-                {header ? (
-                    <div className={`${cssClasses.PREFIX}-header`} x-semi-prop="header">
-                        {header}
-                    </div>
-                ) : null}
+                {header ? <div className={`${cssClasses.PREFIX}-header`}>{header}</div> : null}
                 <ListContext.Provider
                     value={{
                         grid,
                         onRightClick,
-                        onClick,
+                        onClick
                     }}
                 >
                     <Spin spinning={loading} size="large">
                         {this.wrapChildren(childrenList, children)}
                     </Spin>
                 </ListContext.Provider>
-                {footer ? (
-                    <div className={`${cssClasses.PREFIX}-footer`} x-semi-prop="footer">
-                        {footer}
-                    </div>
-                ) : null}
+                {footer ? <div className={`${cssClasses.PREFIX}-footer`}>{footer}</div> : null}
                 {loadMore ? loadMore : null}
             </div>
         );

package/modal/ConfirmModal.tsx

@@ -81,7 +81,7 @@ const ConfirmModal = (props: ConfirmProps) => {
             visible={visible}
             {...rest}
         >
-            <div className={contentCls} x-semi-prop="content">{content}</div>
+            <div className={contentCls}>{content}</div>
         </Modal>
     );
 };

package/modal/Modal.tsx

@@ -103,7 +103,7 @@ class Modal extends BaseComponent<ModalReactProps, ModalState> {
         onOk: noop,
         afterClose: noop,
         maskFixed: false,
-        closeOnEsc: false,
+        closeOnEsc: true,
         size: 'small',
         keepDOM: false,
         lazyRender: true,
@@ -290,8 +290,8 @@ class Modal extends BaseComponent<ModalReactProps, ModalState> {
                         onClick={this.handleCancel}
                         loading={cancelLoading}
                         type="tertiary"
+                        autoFocus={true}
                         {...this.props.cancelButtonProps}
-                        x-semi-children-alias="cancelText"
                     >
                         {cancelText || locale.cancel}
                     </Button>
@@ -311,7 +311,6 @@ class Modal extends BaseComponent<ModalReactProps, ModalState> {
                             loading={confirmLoading}
                             onClick={this.handleOk}
                             {...this.props.okButtonProps}
-                            x-semi-children-alias="okText"
                         >
                             {okText || locale.confirm}
                         </Button>