@douyinfe/semi-ui 2.56.0-beta.0 → 2.56.0

package/dist/umd/semi-ui.js

@@ -22963,9 +22963,32 @@ class Base extends external_root_React_commonjs2_react_commonjs_react_amd_react_
       if (!rows || rows < 1) {
         return false;
       }
-      const updateOverflow = rows <= 1 ? this.wrapperRef.current.scrollWidth > this.wrapperRef.current.offsetWidth : this.wrapperRef.current.scrollHeight > this.wrapperRef.current.offsetHeight;
+      const updateOverflow = rows <= 1 ? this.compareSingleRow() : this.wrapperRef.current.scrollHeight > this.wrapperRef.current.offsetHeight;
       return updateOverflow;
     };
+    /**
+     * 通过将 content 给到 Range 对象，借助 Range 的 getBoundingClientRect 拿到 content 的准确 width
+     * 不受 css ellipsis 与否的影响
+     * By giving the content to the Range object, get the exact width of the content with the help of Range's getBoundingClientRect
+     * Not affected by css ellipsis or not
+     * https://github.com/DouyinFE/semi-design/issues/1731
+     */
+    this.compareSingleRow = () => {
+      if (!(document && document.createRange)) {
+        return false;
+      }
+      const containerNode = this.wrapperRef.current;
+      const containerWidth = containerNode.getBoundingClientRect().width;
+      const childNodes = Array.from(containerNode.childNodes);
+      const range = document.createRange();
+      const contentWidth = childNodes.reduce((acc, node) => {
+        var _a;
+        range.selectNodeContents(node);
+        return acc + ((_a = range.getBoundingClientRect().width) !== null && _a !== void 0 ? _a : 0);
+      }, 0);
+      range.detach();
+      return contentWidth > containerWidth;
+    };
     this.showTooltip = () => {
       var _a, _b;
       const {
@@ -23072,14 +23095,15 @@ class Base extends external_root_React_commonjs2_react_commonjs_react_amd_react_
         expand: this.expandRef.current,
         copy: this.copyRef && this.copyRef.current
       };
-      const content = util(this.wrapperRef.current, rows,
       // Perform type conversion on children to prevent component crash due to non-string type of children
-      String(children), extraNode, ELLIPSIS_STR, suffix, pos);
+      // https://github.com/DouyinFE/semi-design/issues/2167
+      const realChildren = Array.isArray(children) ? children.join('') : String(children);
+      const content = util(this.wrapperRef.current, rows, realChildren, extraNode, ELLIPSIS_STR, suffix, pos);
       return new Promise(resolve => {
         this.setState({
           isOverflowed: false,
           ellipsisContent: content,
-          isTruncated: children !== content
+          isTruncated: realChildren !== content
         }, resolve);
       });
     });
@@ -36720,7 +36744,7 @@ class CascaderFoundation extends foundation {
     } else if (!isEmpty_default()(keyEntities)) {
       cacheValue = this._getCacheValue(keyEntities);
     }
-    const selectedValue = !this._isControlledComponent() ? cacheValue : value;
+    const selectedValue = !this._isControlledComponent() ? cacheValue : isUndefined_default()(value) ? [] : value;
     if (util_isValid(selectedValue)) {
       this.updateSelectedKey(selectedValue, keyEntities);
     } else {
@@ -36734,10 +36758,7 @@ class CascaderFoundation extends foundation {
     const {
       keyEntities
     } = this.getStates();
-    const {
-      multiple
-    } = this.getProps();
-    !multiple && this.updateSelectedKey(value, keyEntities);
+    this.updateSelectedKey(value, keyEntities);
   }
   /**
    * When single selection, the clear objects of
@@ -47756,9 +47777,9 @@ class Cascader extends BaseComponent {
       }, []);
       return formatKeys;
     };
-    const needUpdateTreeData = needUpdate('treeData') || needUpdateData();
-    const needUpdateValue = needUpdate('value') || isEmpty_default()(prevProps) && defaultValue;
     if (multiple) {
+      const needUpdateTreeData = needUpdate('treeData') || needUpdateData();
+      const needUpdateValue = needUpdate('value') || isEmpty_default()(prevProps) && defaultValue;
       // when value and treedata need updated
       if (needUpdateTreeData || needUpdateValue) {
         // update state.keyEntities
@@ -47806,8 +47827,11 @@ class Cascader extends BaseComponent {
     this.foundation.destroy();
   }
   componentDidUpdate(prevProps) {
+    if (this.props.multiple) {
+      return;
+    }
     let isOptionsChanged = false;
-    if (!isEqual_default()(prevProps.treeData, this.props.treeData) && !this.props.multiple) {
+    if (!isEqual_default()(prevProps.treeData, this.props.treeData)) {
       isOptionsChanged = true;
       this.foundation.collectOptions();
     }