@douyinfe/semi-ui 2.30.1 → 2.31.0-beta.0

package/dist/umd/semi-ui.js

@@ -18209,6 +18209,10 @@ class foundation_Tooltip extends foundation {
       this._adapter.removePortal();
     };
 
+    this.setDisplayNone = (displayNone, cb) => {
+      this._adapter.setDisplayNone(displayNone, cb);
+    };
+
     this.onResize = () => {
       // this.log('resize');
       // rePosition when window resize
@@ -18234,9 +18238,14 @@ class foundation_Tooltip extends foundation {
       const trigger = this.getProp('trigger');
       const clickTriggerToHide = this.getProp('clickTriggerToHide');
       const {
-        visible
+        visible,
+        displayNone
       } = this.getStates();
 
+      if (displayNone) {
+        this.setDisplayNone(false);
+      }
+
       if (visible) {
         return;
       }
@@ -20009,7 +20018,12 @@ class tooltip_Tooltip extends baseComponent_BaseComponent {
 
 
     this.didLeave = () => {
-      this.foundation.removePortal();
+      if (this.props.keepDOM) {
+        this.foundation.setDisplayNone(true);
+      } else {
+        this.foundation.removePortal();
+      }
+
       this.foundation.unBindEvent();
     };
 
@@ -20079,6 +20093,7 @@ class tooltip_Tooltip extends baseComponent_BaseComponent {
         visible,
         portalEventSet,
         placement,
+        displayNone,
         transitionState,
         id,
         isPositionUpdated
@@ -20133,7 +20148,9 @@ class tooltip_Tooltip extends baseComponent_BaseComponent {
         } = _ref;
         return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", Object.assign({
           className: classnames_default()(className, animationClassName),
-          style: Object.assign(Object.assign(Object.assign(Object.assign({}, animationStyle), {
+          style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, animationStyle), displayNone ? {
+            display: "none"
+          } : {}), {
             transformOrigin
           }), style), {
             opacity: isPositionUpdated ? opacity : "0"
@@ -20223,8 +20240,8 @@ class tooltip_Tooltip extends baseComponent_BaseComponent {
       placement: props.position || 'top',
       transitionStyle: {},
       isPositionUpdated: false,
-      id: props.wrapperId // auto generate id, will be used by children.aria-describedby & content.id, improve a11y
-
+      id: props.wrapperId,
+      displayNone: false
     };
     this.foundation = new foundation_Tooltip(this.adapter);
     this.eventManager = new Event_Event();
@@ -20348,6 +20365,11 @@ class tooltip_Tooltip extends baseComponent_BaseComponent {
           this.eventManager.emit('positionUpdated');
         });
       },
+      setDisplayNone: (displayNone, cb) => {
+        this.setState({
+          displayNone
+        }, cb);
+      },
       updatePlacementAttr: placement => {
         this.setState({
           placement
@@ -20654,7 +20676,8 @@ tooltip_Tooltip.propTypes = {
   wrapWhenSpecial: prop_types_default.a.bool,
   guardFocus: prop_types_default.a.bool,
   returnFocusOnClose: prop_types_default.a.bool,
-  preventScroll: prop_types_default.a.bool
+  preventScroll: prop_types_default.a.bool,
+  keepDOM: prop_types_default.a.bool
 };
 tooltip_Tooltip.defaultProps = {
   arrowBounding: numbers.ARROW_BOUNDING,
@@ -20680,7 +20703,8 @@ tooltip_Tooltip.defaultProps = {
   returnFocusOnClose: false,
   onEscKeyDown: noop_default.a,
   disableFocusListener: false,
-  disableArrowKeyDown: false
+  disableArrowKeyDown: false,
+  keepDOM: false
 };
 // EXTERNAL MODULE: /home/runner/work/semi-design/semi-design/node_modules/copy-text-to-clipboard/index.js
 var copy_text_to_clipboard = __webpack_require__("HDX/");
@@ -23807,6 +23831,31 @@ class copyable_Copyable extends external_root_React_commonjs2_react_commonjs_rea
       }, locale => /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("span", null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconTick, null), locale.copied));
     };
 
+    this.renderCopyIcon = () => {
+      const {
+        icon
+      } = this.props;
+      const copyProps = {
+        role: "button",
+        tabIndex: 0,
+        onClick: this.copy,
+        onKeyPress: e => utils_isEnterPress(e) && this.copy(e)
+      };
+      {
+        /* TODO: replace `a` tag with `span` in next major version
+          NOTE: may have effect on style */
+      }
+      const defaultIcon =
+      /*#__PURE__*/
+      // eslint-disable-next-line jsx-a11y/anchor-is-valid
+      external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("a", {
+        className: `${copyable_prefixCls}-action-copy-icon`
+      }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconCopy, Object.assign({
+        onClick: this.copy
+      }, copyProps)));
+      return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.isValidElement(icon) ? /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.cloneElement(icon, copyProps) : defaultIcon;
+    };
+
     this.state = {
       copied: false,
       item: ''
@@ -23844,14 +23893,7 @@ class copyable_Copyable extends external_root_React_commonjs2_react_commonjs_rea
       ref: forwardRef
     }, copied ? this.renderSuccessTip() : /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(tooltip_Tooltip, {
       content: typeof copyTip !== 'undefined' ? copyTip : locale.copy
-    }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("a", {
-      className: `${copyable_prefixCls}-action-copy-icon`
-    }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconCopy, {
-      role: "button",
-      tabIndex: 0,
-      onClick: this.copy,
-      onKeyPress: e => utils_isEnterPress(e) && this.copy(e)
-    })))));
+    }, this.renderCopyIcon())));
   }
 
 }
@@ -23862,7 +23904,8 @@ copyable_Copyable.propTypes = {
   copyTip: prop_types_default.a.node,
   duration: prop_types_default.a.number,
   style: prop_types_default.a.object,
-  className: prop_types_default.a.string
+  className: prop_types_default.a.string,
+  icon: prop_types_default.a.node
 };
 copyable_Copyable.defaultProps = {
   content: '',
@@ -39235,7 +39278,11 @@ class foundation_CascaderFoundation extends foundation {
         if (filterable && !multiple) {
           const displayText = this.renderDisplayText(selectedKey, keyEntities);
           updateStates.inputPlaceHolder = displayText;
-          updateStates.inputValue = displayText;
+          /*
+           *  displayText should not be assign to inputValue,
+           *  cause inputValue should only change by user enter
+           */
+          // updateStates.inputValue = displayText;
         }
         /**
          * If selectedKeys does not meet the update conditions,
@@ -39269,7 +39316,11 @@ class foundation_CascaderFoundation extends foundation {
         const displayText = this._defaultRenderText(valuePath);
 
         updateStates.inputPlaceHolder = displayText;
-        updateStates.inputValue = displayText;
+        /*
+         *  displayText should not be assign to inputValue,
+         *  cause inputValue should only change by user enter
+         */
+        // updateStates.inputValue = displayText;
       }
 
       keyEntities[key] = optionNotExist; // Fix: 1155, if the data is loaded asynchronously to update treeData, the emptying operation should not be done when entering the updateSelectedKey method
@@ -41239,6 +41290,7 @@ var tag_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
+
 const tag_prefixCls = tag_constants_cssClasses.PREFIX;
 const tagColors = tag_constants_strings.TAG_COLOR;
 const tagSize = tag_constants_strings.TAG_SIZE;
@@ -41357,11 +41409,12 @@ class tag_Tag extends external_root_React_commonjs2_react_commonjs_react_amd_rea
 
     const a11yProps = {
       role: 'button',
-      tabIndex: tabIndex | 0,
+      tabIndex: tabIndex || 0,
       onKeyDown: this.handleKeyDown
     };
     const baseProps = Object.assign(Object.assign({}, attr), {
       onClick,
+      tabIndex: tabIndex,
       className: classnames_default()(tag_prefixCls, {
         [`${tag_prefixCls}-default`]: size === 'default',
         [`${tag_prefixCls}-small`]: size === 'small',
@@ -41385,10 +41438,14 @@ class tag_Tag extends external_root_React_commonjs2_react_commonjs_react_amd_rea
     }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconClose, {
       size: "small"
     })) : null;
+
+    const stringChild = isString_default()(children);
+
+    const contentCls = classnames_default()(`${tag_prefixCls}-content`, `${tag_prefixCls}-content-${stringChild ? 'ellipsis' : 'center'}`);
     return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", Object.assign({
-      "aria-label": this.props['aria-label'] || isString_default()(children) ? `${closable ? 'Closable ' : ''}Tag: ${children}` : ''
+      "aria-label": this.props['aria-label'] || stringChild ? `${closable ? 'Closable ' : ''}Tag: ${children}` : ''
     }, wrapProps), avatarSrc ? this.renderAvatar() : null, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-      className: `${tag_prefixCls}-content`
+      className: contentCls
     }, children), closeIcon);
   }
 
@@ -43830,15 +43887,13 @@ class tagInput_TagInput extends baseComponent_BaseComponent {
             key: elementKey,
             visible: true,
             "aria-label": `${!disabled ? 'Closable ' : ''}Tag: ${value}`
-          }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
-            className: `${tagInput_prefixCls}-tag-content-wrapper`
           }, showIconHandler && /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(DragHandle, null), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(paragraph_Paragraph, {
             className: typoCls,
             ellipsis: {
               showTooltip: showContentTooltip,
               rows: 1
             }
-          }, value)));
+          }, value));
         }
       });
     };
@@ -45199,7 +45254,8 @@ class cascader_Cascader extends baseComponent_BaseComponent {
       onChange: this.handleInputChange
     };
     const wrappercls = classnames_default()({
-      [`${cascader_prefixcls}-search-wrapper`]: true
+      [`${cascader_prefixcls}-search-wrapper`]: true,
+      [`${cascader_prefixcls}-search-wrapper-${size}`]: size !== 'default'
     });
     const displayText = this.renderDisplayText();
     const spanCls = classnames_default()({
@@ -60158,6 +60214,7 @@ const ConfirmModal = props => {
 
 
 
+
 function confirm_confirm(props) {
   // create a dom in adapter?
   const div = document.createElement('div');
@@ -60236,8 +60293,11 @@ function withWarning(props) {
 function withError(props) {
   return Object.assign({
     type: 'error',
-    icon: /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconAlertCircle, null)
-  }, props);
+    icon: /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(IconAlertCircle, null),
+    okButtonProps: Object.assign({
+      type: 'danger'
+    }, props.okButtonProps)
+  }, omit_default()(props, ['okButtonProps']));
 }
 function withConfirm(props) {
   return Object.assign({
@@ -80401,14 +80461,14 @@ function isAnyFixed(columns) {
 function isAnyFixedRight(columns) {
   return some_default()(columns, col => col.fixed === 'right');
 }
-function isFixedLeft(column) {
+function utils_isFixedLeft(column) {
   return ['left', true].includes(get_default()(column, 'fixed'));
 }
-function isFixedRight(column) {
+function utils_isFixedRight(column) {
   return ['right'].includes(get_default()(column, 'fixed'));
 }
 function isFixed(column) {
-  return isFixedLeft(column) || isFixedRight(column);
+  return utils_isFixedLeft(column) || utils_isFixedRight(column);
 }
 function isInnerColumnKey(key) {
   return [table_constants_strings.DEFAULT_KEY_COLUMN_EXPAND, table_constants_strings.DEFAULT_KEY_COLUMN_SCROLLBAR, table_constants_strings.DEFAULT_KEY_COLUMN_SELECTION].includes(key);
@@ -80797,6 +80857,22 @@ function isTreeTable(_ref2) {
 
   return flag;
 }
+function getRTLAlign(align, direction) {
+  if (direction === 'rtl') {
+    switch (align) {
+      case 'left':
+        return 'right';
+
+      case 'right':
+        return 'left';
+
+      default:
+        return align;
+    }
+  }
+
+  return align;
+}
 // CONCATENATED MODULE: ../semi-foundation/utils/Store.ts
 /* istanbul ignore next */
 class Store {
@@ -82215,7 +82291,8 @@ const TableContextProvider = _ref => {
     renderExpandIcon,
     renderSelection,
     getVirtualizedListRef,
-    setBodyHasScrollbar
+    setBodyHasScrollbar,
+    direction
   } = _ref;
   const tableContextValue = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_["useMemo"])(() => ({
     anyColumnFixed,
@@ -82229,8 +82306,9 @@ const TableContextProvider = _ref => {
     tableWidth,
     handleRowExpanded,
     getVirtualizedListRef,
-    setBodyHasScrollbar
-  }), [anyColumnFixed, flattenedColumns, renderExpandIcon, renderSelection, setHeadWidths, getHeadWidths, getCellWidths, headWidths, tableWidth, handleRowExpanded, getVirtualizedListRef, setBodyHasScrollbar]);
+    setBodyHasScrollbar,
+    direction
+  }), [anyColumnFixed, flattenedColumns, renderExpandIcon, renderSelection, setHeadWidths, getHeadWidths, getCellWidths, headWidths, tableWidth, handleRowExpanded, getVirtualizedListRef, setBodyHasScrollbar, direction]);
   return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(table_context.Provider, {
     value: tableContextValue
   }, children);
@@ -82827,8 +82905,10 @@ class TableHeaderRow_TableHeaderRow extends baseComponent_BaseComponent {
       columns
     } = this.props;
     const {
-      getCellWidths
+      getCellWidths,
+      direction
     } = this.context;
+    const isRTL = direction === 'rtl';
     const slicedColumns = sliceColumnsByLevel(columns, index);
     const headWidths = getCellWidths(slicedColumns);
 
@@ -82850,35 +82930,52 @@ class TableHeaderRow_TableHeaderRow extends baseComponent_BaseComponent {
       let cellStyle = Object.assign({}, customProps.style);
 
       if (column.align) {
+        const textAlign = getRTLAlign(column.align, direction);
         cellStyle = Object.assign(Object.assign({}, cellStyle), {
-          textAlign: column.align
+          textAlign
         });
         customProps.className = classnames_default()(customProps.className, column.className, {
-          [`${prefixCls}-align-${column.align}`]: Boolean(column.align)
+          [`${prefixCls}-align-${textAlign}`]: Boolean(textAlign)
         });
       }
 
+      let fixedLeft, fixedRight, fixedLeftLast, fixedRightFirst;
+
+      if (isRTL) {
+        fixedLeft = utils_isFixedRight(column);
+        fixedRight = utils_isFixedLeft(column);
+        fixedLeftLast = isFirstFixedRight(slicedColumns, column);
+        fixedRightFirst = isLastLeftFixed(slicedColumns, column);
+      } else {
+        fixedLeft = utils_isFixedLeft(column);
+        fixedRight = utils_isFixedRight(column);
+        fixedLeftLast = isLastLeftFixed(slicedColumns, column);
+        fixedRightFirst = isFirstFixedRight(slicedColumns, column);
+      }
+
       customProps.className = classnames_default()(`${prefixCls}-row-head`, column.className, customProps.className, // `${prefixCls}-fixed-columns`,
       {
-        [`${prefixCls}-cell-fixed-left`]: isFixedLeft(column),
-        [`${prefixCls}-cell-fixed-left-last`]: isLastLeftFixed(slicedColumns, column),
-        [`${prefixCls}-cell-fixed-right`]: isFixedRight(column),
-        [`${prefixCls}-cell-fixed-right-first`]: isFirstFixedRight(slicedColumns, column)
+        [`${prefixCls}-cell-fixed-left`]: fixedLeft,
+        [`${prefixCls}-cell-fixed-left-last`]: fixedLeftLast,
+        [`${prefixCls}-cell-fixed-right`]: fixedRight,
+        [`${prefixCls}-cell-fixed-right-first`]: fixedRightFirst
       });
 
       if (headWidths.length && slicedColumns.length) {
         const indexOfSlicedColumns = findIndex_default()(slicedColumns, item => item && item.key != null && item.key === column.key);
 
         if (indexOfSlicedColumns > -1) {
-          if (isFixedLeft(column)) {
+          if (utils_isFixedLeft(column)) {
+            const xPositionKey = isRTL ? 'right' : 'left';
             cellStyle = Object.assign(Object.assign({}, cellStyle), {
               position: 'sticky',
-              left: arrayAdd(headWidths, 0, indexOfSlicedColumns)
+              [xPositionKey]: arrayAdd(headWidths, 0, indexOfSlicedColumns)
             });
-          } else if (isFixedRight(column)) {
+          } else if (utils_isFixedRight(column)) {
+            const xPositionKey = isRTL ? 'left' : 'right';
             cellStyle = Object.assign(Object.assign({}, cellStyle), {
               position: 'sticky',
-              right: arrayAdd(headWidths, indexOfSlicedColumns + 1)
+              [xPositionKey]: arrayAdd(headWidths, indexOfSlicedColumns + 1)
             });
           }
         }
@@ -83660,13 +83757,17 @@ class TableCell_TableCell extends baseComponent_BaseComponent {
     } = this.props;
     let tdProps = {};
     let customCellProps = {};
+    const {
+      direction
+    } = this.context;
+    const isRTL = direction === 'rtl';
     const fixedLeftFlag = fixedLeft || typeof fixedLeft === 'number';
     const fixedRightFlag = fixedRight || typeof fixedRight === 'number';
 
     if (fixedLeftFlag) {
-      set_default()(tdProps, 'style.left', typeof fixedLeft === 'number' ? fixedLeft : 0);
+      set_default()(tdProps, isRTL ? 'style.right' : 'style.left', typeof fixedLeft === 'number' ? fixedLeft : 0);
     } else if (fixedRightFlag) {
-      set_default()(tdProps, 'style.right', typeof fixedRight === 'number' ? fixedRight : 0);
+      set_default()(tdProps, isRTL ? 'style.left' : 'style.right', typeof fixedRight === 'number' ? fixedRight : 0);
     }
 
     if (width != null) {
@@ -83686,8 +83787,9 @@ class TableCell_TableCell extends baseComponent_BaseComponent {
     }
 
     if (column.align) {
+      const textAlign = getRTLAlign(column.align, direction);
       tdProps.style = Object.assign(Object.assign({}, tdProps.style), {
-        textAlign: column.align
+        textAlign
       });
     }
 
@@ -83825,6 +83927,10 @@ class TableCell_TableCell extends baseComponent_BaseComponent {
       firstFixedRight,
       colIndex
     } = this.props;
+    const {
+      direction
+    } = this.context;
+    const isRTL = direction === 'rtl';
     const {
       className
     } = column;
@@ -83855,11 +83961,25 @@ class TableCell_TableCell extends baseComponent_BaseComponent {
     }
 
     const inner = this.renderInner(text, indentText, realExpandIcon);
+    let isFixedLeft, isFixedLeftLast, isFixedRight, isFixedRightFirst;
+
+    if (isRTL) {
+      isFixedLeft = fixedRightFlag;
+      isFixedLeftLast = firstFixedRight;
+      isFixedRight = fixedLeftFlag;
+      isFixedRightFirst = lastFixedLeft;
+    } else {
+      isFixedLeft = fixedLeftFlag;
+      isFixedLeftLast = lastFixedLeft;
+      isFixedRight = fixedRightFlag;
+      isFixedRightFirst = firstFixedRight;
+    }
+
     const columnCls = classnames_default()(className, `${prefixCls}-row-cell`, get_default()(customCellProps, 'className'), {
-      [`${prefixCls}-cell-fixed-left`]: fixedLeftFlag,
-      [`${prefixCls}-cell-fixed-left-last`]: lastFixedLeft,
-      [`${prefixCls}-cell-fixed-right`]: fixedRightFlag,
-      [`${prefixCls}-cell-fixed-right-first`]: firstFixedRight
+      [`${prefixCls}-cell-fixed-left`]: isFixedLeft,
+      [`${prefixCls}-cell-fixed-left-last`]: isFixedLeftLast,
+      [`${prefixCls}-cell-fixed-right`]: isFixedRight,
+      [`${prefixCls}-cell-fixed-right-first`]: isFixedRightFirst
     });
     return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(BodyCell, Object.assign({
       role: "gridcell",
@@ -84132,9 +84252,9 @@ class BaseRow_TableRow extends baseComponent_BaseComponent {
           index: index,
           record: record,
           component: BodyCell,
-          fixedLeft: isFixedLeft(column) && arrayAdd(cellWidths, 0, columnIndex),
+          fixedLeft: utils_isFixedLeft(column) && arrayAdd(cellWidths, 0, columnIndex),
           lastFixedLeft: isLastLeftFixed(columns, column),
-          fixedRight: isFixedRight(column) && arrayAdd(cellWidths, columnIndex + 1),
+          fixedRight: utils_isFixedRight(column) && arrayAdd(cellWidths, columnIndex + 1),
           firstFixedRight: isFirstFixedRight(columns, column),
           selected: selected,
           expanded: expanded,
@@ -84678,7 +84798,6 @@ var Body_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-
 class Body_Body extends baseComponent_BaseComponent {
   constructor(props, context) {
     var _this;
@@ -85442,12 +85561,10 @@ class Body_Body extends baseComponent_BaseComponent {
     const {
       virtualized
     } = this.props;
-    return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(configProvider_context.Consumer, null, _ref => {
-      let {
-        direction
-      } = _ref;
-      return virtualized ? this.renderVirtualizedBody(direction) : this.renderBody(direction);
-    });
+    const {
+      direction
+    } = this.context;
+    return virtualized ? this.renderVirtualizedBody(direction) : this.renderBody(direction);
   }
 
 }
@@ -85760,8 +85877,9 @@ class Table_Table extends baseComponent_BaseComponent {
       const node = this.bodyWrapRef.current;
 
       if (node && node.children && node.children.length) {
-        const scrollToLeft = node.scrollLeft === 0;
-        const scrollToRight = node.scrollLeft + 1 >= node.children[0].getBoundingClientRect().width - node.getBoundingClientRect().width;
+        const scrollToLeft = node.scrollLeft === 0; // why use Math.abs? @see https://bugzilla.mozilla.org/show_bug.cgi?id=1447743
+
+        const scrollToRight = Math.abs(node.scrollLeft) + 1 >= node.children[0].getBoundingClientRect().width - node.getBoundingClientRect().width;
 
         if (scrollToLeft && scrollToRight) {
           this.setScrollPosition('both');
@@ -86952,11 +87070,13 @@ class Table_Table extends baseComponent_BaseComponent {
     });
     return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
       ref: this.rootWrapRef,
-      className: classnames_default()(className, `${prefixCls}-wrapper`),
+      className: classnames_default()(className, `${prefixCls}-wrapper`, `${prefixCls}-wrapper-${props.direction}`),
       "data-column-fixed": anyColumnFixed,
       style: wrapStyle,
       id: id
-    }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(table_TableContextProvider, Object.assign({}, tableContextValue), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(spin_0, {
+    }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(table_TableContextProvider, Object.assign({}, tableContextValue, {
+      direction: props.direction
+    }), /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(spin_0, {
       spinning: loading,
       size: "large"
     }, /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
@@ -87344,6 +87464,7 @@ const ResizableTable = function () {
 
 
 
+
 class table_Table_0 extends external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.PureComponent {
   constructor(props) {
     super(props);
@@ -87354,16 +87475,21 @@ class table_Table_0 extends external_root_React_commonjs2_react_commonjs_react_a
   }
 
   render() {
-    // eslint-disable-next-line prefer-destructuring
+    var _a; // eslint-disable-next-line prefer-destructuring
+
+
     const props = this.props;
+    const direction = (_a = this.props.direction) !== null && _a !== void 0 ? _a : this.context.direction;
 
     if (props.resizable) {
       return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(table_ResizableTable, Object.assign({}, props, {
-        ref: this.tableRef
+        ref: this.tableRef,
+        direction: direction
       }));
     } else {
       return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(table_Table, Object.assign({}, props, {
-        ref: this.tableRef
+        ref: this.tableRef,
+        direction: direction
       }));
     }
   }
@@ -87379,6 +87505,7 @@ table_Table_0.propTypes = Object.assign(Object.assign({}, table_Table.propTypes)
 table_Table_0.defaultProps = {
   hideExpandedColumn: true
 };
+table_Table_0.contextType = configProvider_context;
 
 /* harmony default export */ var table_0 = (table_Table_0);
 // CONCATENATED MODULE: ../semi-foundation/tabs/constants.ts
@@ -101256,7 +101383,11 @@ class baseForm_Form extends baseComponent_BaseComponent {
         const {
           formId
         } = this.state;
-        return document.querySelectorAll(`form[x-form-id="${formId}"] .${form_constants_cssClasses.PREFIX}-field-error-message`);
+        const {
+          id
+        } = this.props;
+        const xId = id ? id : formId;
+        return document.querySelectorAll(`form[x-form-id="${xId}"] .${form_constants_cssClasses.PREFIX}-field-error-message`);
       },
       getFieldDOM: field => document.querySelector(`.${form_constants_cssClasses.PREFIX}-field[x-field-id="${field}"]`)
     });
@@ -101331,9 +101462,10 @@ class baseForm_Form extends baseComponent_BaseComponent {
       allowEmpty,
       autoScrollToError,
       showValidateIcon,
-      extraTextPosition
+      extraTextPosition,
+      id
     } = _a,
-          rest = baseForm_rest(_a, ["children", "getFormApi", "onChange", "onSubmit", "onSubmitFail", "onValueChange", "component", "render", "validateFields", "initValues", "layout", "style", "className", "labelPosition", "labelWidth", "labelAlign", "labelCol", "wrapperCol", "allowEmpty", "autoScrollToError", "showValidateIcon", "extraTextPosition"]);
+          rest = baseForm_rest(_a, ["children", "getFormApi", "onChange", "onSubmit", "onSubmitFail", "onValueChange", "component", "render", "validateFields", "initValues", "layout", "style", "className", "labelPosition", "labelWidth", "labelAlign", "labelCol", "wrapperCol", "allowEmpty", "autoScrollToError", "showValidateIcon", "extraTextPosition", "id"]);
 
     const formCls = classnames_default()(baseForm_prefix, className, {
       [baseForm_prefix + '-vertical']: layout === 'vertical',
@@ -101346,7 +101478,7 @@ class baseForm_Form extends baseComponent_BaseComponent {
       onReset: this.reset,
       onSubmit: this.submit,
       className: formCls,
-      "x-form-id": formId
+      "x-form-id": id ? id : formId
     }), this.content);
     const withRowForm = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(grid_row, null, formContent);
     return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(FormUpdaterContext.Provider, {