@douyinfe/semi-ui 2.11.0 → 2.12.0-alpha.0

package/lib/cjs/space/index.js

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

package/lib/cjs/spin/index.js

@@ -89,8 +89,11 @@ class Spin extends _baseComponent.default {
     return loading ? /*#__PURE__*/_react.default.createElement("div", {
       className: "".concat(prefixCls, "-wrapper")
     }, indicator ? /*#__PURE__*/_react.default.createElement("div", {
-      className: spinIconCls
-    }, indicator) : /*#__PURE__*/_react.default.createElement(_icon.default, null), tip ? /*#__PURE__*/_react.default.createElement("div", null, tip) : null) : null;
+      className: spinIconCls,
+      "x-semi-prop": "indicator"
+    }, indicator) : /*#__PURE__*/_react.default.createElement(_icon.default, null), tip ? /*#__PURE__*/_react.default.createElement("div", {
+      "x-semi-prop": "tip"
+    }, tip) : null) : null;
   }
 
   render() {
@@ -117,7 +120,8 @@ class Spin extends _baseComponent.default {
       style: style
     }, this.renderSpin(), /*#__PURE__*/_react.default.createElement("div", {
       className: "".concat(prefixCls, "-children"),
-      style: childStyle
+      style: childStyle,
+      "x-semi-prop": "children"
     }, children));
   }
 

package/lib/cjs/switch/index.js

@@ -139,19 +139,21 @@ class Switch extends _baseComponent.default {
       className: _constants.cssClasses.KNOB,
       "aria-hidden": true
     }), showCheckedText ? /*#__PURE__*/_react.default.createElement("div", {
-      className: _constants.cssClasses.CHECKED_TEXT
+      className: _constants.cssClasses.CHECKED_TEXT,
+      "x-semi-prop": "checkedText"
     }, checkedText) : null, showUncheckedText ? /*#__PURE__*/_react.default.createElement("div", {
-      className: _constants.cssClasses.UNCHECKED_TEXT
+      className: _constants.cssClasses.UNCHECKED_TEXT,
+      "x-semi-prop": "uncheckedText"
     }, uncheckedText) : null, /*#__PURE__*/_react.default.createElement("input", (0, _assign.default)({}, 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/cjs/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?: "top" | "bottom" | "both";
+        position?: "both" | "top" | "bottom";
         formatPageText?: import("./interface").FormatPageText;
         style?: React.CSSProperties;
         className?: string;

package/lib/cjs/table/Table.js

@@ -642,7 +642,8 @@ class Table extends _baseComponent.default {
       }
 
       return /*#__PURE__*/(0, _react.isValidElement)(title) || typeof title === 'string' ? /*#__PURE__*/_react.default.createElement("div", {
-        className: "".concat(prefixCls, "-title")
+        className: "".concat(prefixCls, "-title"),
+        "x-semi-prop": "title"
       }, title) : null;
     };
 
@@ -667,7 +668,8 @@ class Table extends _baseComponent.default {
       }, (locale, localeCode) => /*#__PURE__*/_react.default.createElement("div", {
         className: wrapCls
       }, /*#__PURE__*/_react.default.createElement("div", {
-        className: "".concat(prefixCls, "-empty")
+        className: "".concat(prefixCls, "-empty"),
+        "x-semi-prop": "empty"
       }, empty || locale.emptyText)));
     };
 
@@ -687,7 +689,8 @@ class Table extends _baseComponent.default {
 
       return /*#__PURE__*/(0, _react.isValidElement)(footer) || typeof footer === 'string' ? /*#__PURE__*/_react.default.createElement("div", {
         className: "".concat(prefixCls, "-footer"),
-        key: "footer"
+        key: "footer",
+        "x-semi-prop": "footer"
       }, footer) : null;
     };
 

package/lib/cjs/tabs/TabBar.d.ts

@@ -30,6 +30,7 @@ declare class TabBar extends React.Component<TabBarProps, TabBarState> {
     renderIcon(icon: ReactNode): ReactNode;
     renderExtra(): ReactNode;
     handleItemClick: (itemKey: string, e: MouseEvent<Element>) => void;
+    handleKeyDown: (event: React.KeyboardEvent, itemKey: string, closable: boolean) => void;
     renderTabItem: (panel: PlainTab) => ReactNode;
     renderTabComponents: (list: Array<PlainTab>) => Array<ReactNode>;
     handleArrowClick: (items: Array<OverflowItem>, pos: 'start' | 'end') => void;

package/lib/cjs/tabs/TabBar.js

@@ -75,6 +75,10 @@ class TabBar extends _react.default.Component {
       }
     };
 
+    this.handleKeyDown = (event, itemKey, closable) => {
+      this.props.handleKeyDown(event, itemKey, closable);
+    };
+
     this.renderTabItem = panel => {
       const {
         size,
@@ -108,9 +112,12 @@ class TabBar extends _react.default.Component {
       return /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({
         role: "tab",
         id: "semiTab".concat(key),
+        "data-tabkey": "semiTab".concat(key),
         "aria-controls": "semiTabPanel".concat(key),
         "aria-disabled": panel.disabled ? 'true' : 'false',
-        "aria-selected": isSelected ? 'true' : 'false'
+        "aria-selected": isSelected ? 'true' : 'false',
+        tabIndex: isSelected ? 0 : -1,
+        onKeyDown: e => this.handleKeyDown(e, key, panel.closable)
       }, events, {
         className: className,
         key: this._getItemKey(key)
@@ -264,7 +271,8 @@ class TabBar extends _react.default.Component {
       const tabBarStyle = (0, _assign.default)((0, _assign.default)({}, tabBarExtraContentDefaultStyle), tabBarExtraContentStyle);
       return /*#__PURE__*/_react.default.createElement("div", {
         className: extraCls,
-        style: tabBarStyle
+        style: tabBarStyle,
+        "x-semi-prop": "tabBarExtraContent"
       }, tabBarExtraContent);
     }
 

package/lib/cjs/tabs/TabPane.js

@@ -141,15 +141,19 @@ class TabPane extends _react.PureComponent {
       "aria-labelledby": "semiTab".concat(itemKey),
       className: classNames,
       style: style,
-      "aria-hidden": active ? 'false' : 'true'
-    }, (0, _getDataAttr.default)(restProps)), motion ? /*#__PURE__*/_react.default.createElement(_TabPaneTransition.default, {
+      "aria-hidden": active ? 'false' : 'true',
+      tabIndex: 0
+    }, (0, _getDataAttr.default)(restProps), {
+      "x-semi-prop": "children"
+    }), motion ? /*#__PURE__*/_react.default.createElement(_TabPaneTransition.default, {
       direction: this.getDirection(this.context.activeKey, itemKey, this.context.panes),
       motion: motion,
       mode: tabPosition === 'top' ? 'horizontal' : 'vertical',
       state: active ? 'enter' : 'leave'
     }, transitionStyle => /*#__PURE__*/_react.default.createElement("div", {
       className: "".concat(_constants.cssClasses.TABS_PANE_MOTION_OVERLAY),
-      style: (0, _assign.default)({}, transitionStyle)
+      style: (0, _assign.default)({}, transitionStyle),
+      "x-semi-prop": "children"
     }, shouldRender ? children : null)) : shouldRender ? children : null);
   }
 

package/lib/cjs/tabs/index.js

@@ -372,7 +372,8 @@ class Tabs extends _baseComponent.default {
       tabBarExtraContent,
       tabPosition,
       type,
-      deleteTabItem: this.deleteTabItem
+      deleteTabItem: this.deleteTabItem,
+      handleKeyDown: this.foundation.handleKeyDown
     };
     const tabBar = renderTabBar ? renderTabBar(tabBarProps, _TabBar.default) : /*#__PURE__*/_react.default.createElement(_TabBar.default, (0, _assign.default)({}, tabBarProps));
     const content = keepDOM ? children : this.getActiveItem();

package/lib/cjs/tabs/interface.d.ts

@@ -48,6 +48,7 @@ export interface TabBarProps {
     dropdownStyle?: CSSProperties;
     closable?: boolean;
     deleteTabItem?: (tabKey: string, event: MouseEvent<Element>) => void;
+    handleKeyDown?: (event: React.KeyboardEvent, itemKey: string, closable: boolean) => void;
 }
 export interface TabPaneProps {
     className?: string;

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

@@ -21,6 +21,7 @@ export default class Tag extends Component<TagProps, TagState> {
         className: PropTypes.Requireable<string>;
         avatarSrc: PropTypes.Requireable<string>;
         avatarShape: PropTypes.Requireable<string>;
+        'aria-label': PropTypes.Requireable<string>;
     };
     constructor(props: TagProps);
     static getDerivedStateFromProps(nextProps: TagProps): {
@@ -28,6 +29,7 @@ export default class Tag extends Component<TagProps, TagState> {
     };
     setVisible(visible: boolean): void;
     close(e: React.MouseEvent<HTMLElement>, value: React.ReactNode): void;
+    handleKeyDown(event: any): void;
     renderAvatar(): JSX.Element;
     render(): JSX.Element;
 }

package/lib/cjs/tag/index.js

@@ -1,6 +1,6 @@
 "use strict";
 
-var _context6;
+var _context8;
 
 var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
 
@@ -31,6 +31,8 @@ var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-sta
 
 var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
 
+var _isString2 = _interopRequireDefault(require("lodash/isString"));
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
@@ -43,11 +45,13 @@ var _index = _interopRequireDefault(require("../avatar/index"));
 
 var _semiIcons = require("@douyinfe/semi-icons");
 
+var _a11y = require("@douyinfe/semi-foundation/lib/cjs/utils/a11y");
+
 require("@douyinfe/semi-foundation/lib/cjs/tag/tag.css");
 
 var _interface = require("./interface");
 
-_forEachInstanceProperty(_context6 = _Object$keys(_interface)).call(_context6, function (key) {
+_forEachInstanceProperty(_context8 = _Object$keys(_interface)).call(_context8, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _interface[key]) return;
@@ -74,6 +78,8 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
   }
   return t;
 };
+/* eslint-disable jsx-a11y/no-static-element-interactions */
+
 /* eslint-disable no-unused-vars */
 
 /* eslint-disable max-len */
@@ -87,13 +93,14 @@ const avatarShapeSet = _constants.strings.AVATAR_SHAPE;
 
 class Tag extends _react.Component {
   constructor(props) {
-    var _context;
+    var _context, _context2;
 
     super(props);
     this.state = {
       visible: true
     };
     this.close = (0, _bind.default)(_context = this.close).call(_context, this);
+    this.handleKeyDown = (0, _bind.default)(_context2 = this.handleKeyDown).call(_context2, this);
   } // any other way to achieve this?
 
 
@@ -130,6 +137,33 @@ class Tag extends _react.Component {
     this.setVisible(false);
   }
 
+  handleKeyDown(event) {
+    const {
+      closable,
+      onClick
+    } = this.props;
+
+    switch (event.key) {
+      case "Backspace":
+      case "Delete":
+        closable && this.close(event, this.props.children);
+        (0, _a11y.handlePrevent)(event);
+        break;
+
+      case "Enter":
+        onClick(event);
+        (0, _a11y.handlePrevent)(event);
+        break;
+
+      case 'Escape':
+        event.target.blur();
+        break;
+
+      default:
+        break;
+    }
+  }
+
   renderAvatar() {
     const {
       avatarShape,
@@ -145,7 +179,7 @@ class Tag extends _react.Component {
   }
 
   render() {
-    var _context2, _context3, _context4, _context5;
+    var _context3, _context4, _context5, _context6, _context7;
 
     const _a = this.props,
           {
@@ -155,35 +189,49 @@ class Tag extends _react.Component {
       closable,
       visible,
       onClose,
+      onClick,
       className,
       type,
       avatarSrc,
       avatarShape
     } = _a,
-          attr = __rest(_a, ["children", "size", "color", "closable", "visible", "onClose", "className", "type", "avatarSrc", "avatarShape"]);
+          attr = __rest(_a, ["children", "size", "color", "closable", "visible", "onClose", "onClick", "className", "type", "avatarSrc", "avatarShape"]);
 
     const {
       visible: isVisible
     } = this.state;
+    const clickable = onClick !== Tag.defaultProps.onClick || closable;
+    const a11yProps = {
+      role: 'button',
+      tabIndex: 0,
+      onKeyDown: this.handleKeyDown
+    };
     const baseProps = (0, _assign.default)((0, _assign.default)({}, attr), {
+      onClick,
       className: (0, _classnames.default)(prefixCls, {
         ["".concat(prefixCls, "-default")]: size === 'default',
         ["".concat(prefixCls, "-small")]: size === 'small',
         ["".concat(prefixCls, "-large")]: size === 'large',
-        [(0, _concat.default)(_context2 = "".concat(prefixCls, "-")).call(_context2, type)]: type,
-        [(0, _concat.default)(_context3 = (0, _concat.default)(_context4 = "".concat(prefixCls, "-")).call(_context4, color, "-")).call(_context3, type)]: color && type,
+        [(0, _concat.default)(_context3 = "".concat(prefixCls, "-")).call(_context3, type)]: type,
+        [(0, _concat.default)(_context4 = (0, _concat.default)(_context5 = "".concat(prefixCls, "-")).call(_context5, color, "-")).call(_context4, type)]: color && type,
         ["".concat(prefixCls, "-closable")]: closable,
         ["".concat(prefixCls, "-invisible")]: !isVisible,
-        [(0, _concat.default)(_context5 = "".concat(prefixCls, "-avatar-")).call(_context5, avatarShape)]: avatarSrc
+        [(0, _concat.default)(_context6 = "".concat(prefixCls, "-avatar-")).call(_context6, avatarShape)]: avatarSrc
       }, className)
     });
-    const closeIcon = closable ? /*#__PURE__*/_react.default.createElement("div", {
+    const wrapProps = clickable ? (0, _assign.default)((0, _assign.default)({}, baseProps), a11yProps) : baseProps;
+    const closeIcon = closable ?
+    /*#__PURE__*/
+    // eslint-disable-next-line jsx-a11y/click-events-have-key-events
+    _react.default.createElement("div", {
       className: "".concat(prefixCls, "-close"),
       onClick: e => this.close(e, children)
     }, /*#__PURE__*/_react.default.createElement(_semiIcons.IconClose, {
       size: "small"
     })) : null;
-    return /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, baseProps), /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({
+      "aria-label": this.props['aria-label'] || (0, _isString2.default)(children) ? (0, _concat.default)(_context7 = "".concat(closable ? 'Closable ' : '', "Tag: ")).call(_context7, children) : ''
+    }, wrapProps), /*#__PURE__*/_react.default.createElement("div", {
       className: "".concat(prefixCls, "-content")
     }, avatarSrc ? this.renderAvatar() : null, children, closeIcon));
   }
@@ -215,5 +263,6 @@ Tag.propTypes = {
   style: _propTypes.default.object,
   className: _propTypes.default.string,
   avatarSrc: _propTypes.default.string,
-  avatarShape: _propTypes.default.oneOf(avatarShapeSet)
+  avatarShape: _propTypes.default.oneOf(avatarShapeSet),
+  'aria-label': _propTypes.default.string
 };

package/lib/cjs/tag/interface.d.ts

@@ -16,6 +16,7 @@ export interface TagProps {
     className?: string;
     avatarSrc?: string;
     avatarShape?: AvatarShape;
+    'aria-label'?: React.AriaAttributes['aria-label'];
 }
 export interface TagGroupProps {
     style?: React.CSSProperties;

package/lib/cjs/tagInput/index.js

@@ -228,7 +228,8 @@ class TagInput extends _baseComponent.default {
       ["".concat(prefixCls, "-prefix-icon")]: /*#__PURE__*/_react.default.isValidElement(prefix) && !(prefix && (0, _isString2.default)(prefix))
     });
     return /*#__PURE__*/_react.default.createElement("div", {
-      className: prefixWrapperCls
+      className: prefixWrapperCls,
+      "x-semi-prop": "prefix"
     }, prefix);
   }
 
@@ -247,7 +248,8 @@ class TagInput extends _baseComponent.default {
       ["".concat(prefixCls, "-suffix-icon")]: /*#__PURE__*/_react.default.isValidElement(suffix) && !(suffix && (0, _isString2.default)(suffix))
     });
     return /*#__PURE__*/_react.default.createElement("div", {
-      className: suffixWrapperCls
+      className: suffixWrapperCls,
+      "x-semi-prop": "suffix"
     }, suffix);
   }
 
@@ -283,7 +285,7 @@ class TagInput extends _baseComponent.default {
       if ((0, _isFunction2.default)(renderTagItem)) {
         item = renderTagItem(value, index);
       } else {
-        var _context2;
+        var _context2, _context3;
 
         item = /*#__PURE__*/_react.default.createElement(_tag.default, {
           className: tagCls,
@@ -295,7 +297,8 @@ class TagInput extends _baseComponent.default {
           },
           closable: !disabled,
           key: (0, _concat.default)(_context2 = "".concat(index)).call(_context2, value),
-          visible: true
+          visible: true,
+          "aria-label": (0, _concat.default)(_context3 = "".concat(!disabled ? 'Closable ' : '', "Tag: ")).call(_context3, value)
         }, /*#__PURE__*/_react.default.createElement(_paragraph.default, {
           className: typoCls,
           ellipsis: {

package/lib/cjs/timePicker/Combobox.js

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

package/lib/cjs/toast/toast.js

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

package/lib/cjs/transfer/index.js

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

package/lib/cjs/tree/treeNode.js

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

package/lib/cjs/treeSelect/index.js

@@ -16,6 +16,8 @@ exports.default = void 0;
 
 var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
 
+var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
+
 var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
 
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
@@ -28,8 +30,6 @@ var _set = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable
 
 var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
 
-var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
-
 var _isFunction2 = _interopRequireDefault(require("lodash/isFunction"));
 
 var _get2 = _interopRequireDefault(require("lodash/get"));
@@ -120,7 +120,8 @@ class TreeSelect extends _baseComponent.default {
         ["".concat(prefixcls, "-suffix-icon")]: (0, _utils.isSemiIcon)(suffix)
       });
       return /*#__PURE__*/_react.default.createElement("div", {
-        className: suffixWrapperCls
+        className: suffixWrapperCls,
+        "x-semi-prop": "suffix"
       }, suffix);
     };
 
@@ -140,7 +141,8 @@ class TreeSelect extends _baseComponent.default {
       });
       return /*#__PURE__*/_react.default.createElement("div", {
         className: prefixWrapperCls,
-        id: insetLabelId
+        id: insetLabelId,
+        "x-semi-prop": "prefix,insetLabel"
       }, labelNode);
     };
 
@@ -238,7 +240,7 @@ class TreeSelect extends _baseComponent.default {
 
       if (checkRelation === 'related') {
         renderKeys = (0, _treeUtil.normalizeKeyList)([...checkedKeys], keyEntities, leafOnly);
-      } else if (checkRelation === 'unRelated') {
+      } else if (checkRelation === 'unRelated' && (0, _keys.default)(keyEntities).length > 0) {
         renderKeys = [...realCheckedKeys];
       }
 
@@ -394,7 +396,8 @@ class TreeSelect extends _baseComponent.default {
       }
 
       return arrowIcon ? /*#__PURE__*/_react.default.createElement("div", {
-        className: (0, _classnames.default)("".concat(prefixcls, "-arrow"))
+        className: (0, _classnames.default)("".concat(prefixcls, "-arrow")),
+        "x-semi-prop": "arrowIcon"
       }, arrowIcon) : null;
     };
 

package/lib/cjs/typography/base.js

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

package/lib/cjs/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<1 | 2 | 3 | 4 | 5 | 6>;
+        heading: PropTypes.Requireable<4 | 1 | 2 | 3 | 5 | 6>;
         style: PropTypes.Requireable<object>;
         className: PropTypes.Requireable<string>;
         component: PropTypes.Requireable<string>;

package/lib/cjs/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/cjs/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/cjs/upload/index.js

@@ -256,7 +256,9 @@ class Upload extends _baseComponent.default {
         });
       }
 
-      const addContent = /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, addContentProps), children);
+      const addContent = /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, addContentProps, {
+        "x-semi-prop": "children"
+      }), children);
 
       if (!showUploadList || !fileList.length) {
         if (showAddTriggerInList) {
@@ -389,15 +391,18 @@ class Upload extends _baseComponent.default {
         onDragEnter: this.onDragEnter,
         onClick: this.onClick
       }, children ? children : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-        className: "".concat(dragAreaBaseCls, "-icon")
+        className: "".concat(dragAreaBaseCls, "-icon"),
+        "x-semi-prop": "dragIcon"
       }, dragIcon || /*#__PURE__*/_react.default.createElement(_semiIcons.IconUpload, {
         size: "extra-large"
       })), /*#__PURE__*/_react.default.createElement("div", {
         className: "".concat(dragAreaBaseCls, "-text")
       }, /*#__PURE__*/_react.default.createElement("div", {
-        className: "".concat(dragAreaBaseCls, "-main-text")
+        className: "".concat(dragAreaBaseCls, "-main-text"),
+        "x-semi-prop": "dragMainText"
       }, dragMainText || locale.mainText), /*#__PURE__*/_react.default.createElement("div", {
-        className: "".concat(dragAreaBaseCls, "-sub-text")
+        className: "".concat(dragAreaBaseCls, "-sub-text"),
+        "x-semi-prop": "dragSubText"
       }, dragSubText), /*#__PURE__*/_react.default.createElement("div", {
         className: "".concat(dragAreaBaseCls, "-tips")
       }, dragAreaStatus === _constants.strings.DRAG_AREA_LEGAL && /*#__PURE__*/_react.default.createElement("span", {
@@ -583,9 +588,11 @@ class Upload extends _baseComponent.default {
       className: inputReplaceCls,
       ref: this.replaceInputRef
     }), this.renderAddContent(), prompt ? /*#__PURE__*/_react.default.createElement("div", {
-      className: promptCls
+      className: promptCls,
+      "x-semi-prop": "prompt"
     }, prompt) : null, validateMessage ? /*#__PURE__*/_react.default.createElement("div", {
-      className: validateMsgCls
+      className: validateMsgCls,
+      "x-semi-prop": "validateMessage"
     }, validateMessage) : null, this.renderFileList());
   }
 

package/lib/es/avatar/index.js

@@ -156,7 +156,8 @@ export default class Avatar extends BaseComponent {
     }, className);
     let content = children;
     const hoverRender = hoverContent ? /*#__PURE__*/React.createElement("div", {
-      className: "".concat(prefixCls, "-hover")
+      className: "".concat(prefixCls, "-hover"),
+      "x-semi-prop": "hoverContent"
     }, hoverContent) : null;
 
     if (isImg) {
@@ -170,7 +171,8 @@ export default class Avatar extends BaseComponent {
       content = /*#__PURE__*/React.createElement("span", {
         className: "".concat(prefixCls, "-content")
       }, /*#__PURE__*/React.createElement("span", {
-        className: "".concat(prefixCls, "-label")
+        className: "".concat(prefixCls, "-label"),
+        "x-semi-prop": "children"
       }, children));
     }
 

package/lib/es/backtop/index.js

@@ -98,7 +98,8 @@ export default class BackTop extends BaseComponent {
     const content = visible ? /*#__PURE__*/React.createElement("div", _Object$assign({}, others, {
       className: preCls,
       style: style,
-      onClick: e => this.handleClick(e)
+      onClick: e => this.handleClick(e),
+      "x-semi-prop": "children"
     }), backtopBtn) : null;
     return content;
   }