@douyinfe/semi-ui 2.48.0-beta.0 → 2.49.0-beta.0

package/lib/es/table/Body/index.js

@@ -301,7 +301,8 @@ class Body extends BaseComponent {
         expanded,
         index,
         rowKey,
-        virtualized
+        virtualized,
+        displayNone
       } = props;
       let key = getRecordKey(record, rowKey);
       if (key == null) {
@@ -327,7 +328,8 @@ class Body extends BaseComponent {
         index: index,
         virtualized: virtualized,
         key: genExpandedRowKey(key),
-        cellWidths: _this.cellWidths
+        cellWidths: _this.cellWidths,
+        displayNone: displayNone
       });
     };
     /**
@@ -339,7 +341,8 @@ class Body extends BaseComponent {
         groups,
         dataSource: data,
         rowKey,
-        expandedRowKeys
+        expandedRowKeys,
+        keepDOM
       } = this.props;
       const {
         flattenedColumns
@@ -374,7 +377,7 @@ class Body extends BaseComponent {
           expanded
         })));
         // Render the grouped content when the group is expanded
-        if (expanded) {
+        if (expanded || keepDOM) {
           const dataInGroup = [];
           group.forEach(recordKey => {
             const record = getRecord(data, recordKey, rowKey);
@@ -385,7 +388,7 @@ class Body extends BaseComponent {
           /**
            * Render the contents of the group row
            */
-          renderedRows.push(this.renderBodyRows(dataInGroup));
+          renderedRows.push(this.renderBodyRows(dataInGroup, undefined, [], !expanded));
         }
       });
       return renderedRows;
@@ -629,12 +632,14 @@ class Body extends BaseComponent {
     let data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
     let level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
     let renderedRows = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+    let displayNone = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
     const {
       rowKey,
       expandedRowRender,
       expandedRowKeys,
       childrenRecordName,
-      rowExpandable
+      rowExpandable,
+      keepDOM
     } = this.props;
     const hasExpandedRowRender = typeof expandedRowRender === 'function';
     const expandBtnShouldInRow = this.state.cachedExpandBtnShouldInRow;
@@ -651,6 +656,7 @@ class Body extends BaseComponent {
       renderedRows.push(this.renderBaseRow(Object.assign(Object.assign({}, this.props), {
         columns: flattenedColumns,
         expandBtnShouldInRow,
+        displayNone,
         record,
         key,
         level,
@@ -658,13 +664,15 @@ class Body extends BaseComponent {
       })));
       // render expand row
       const expanded = isExpanded(expandedRowKeys, key);
-      if (hasExpandedRowRender && rowExpandable && rowExpandable(record) && expanded) {
+      const shouldRenderExpandedRows = expanded || keepDOM;
+      if (hasExpandedRowRender && rowExpandable && rowExpandable(record) && shouldRenderExpandedRows) {
         const currentExpandRow = this.renderExpandedRow(Object.assign(Object.assign({}, this.props), {
           columns: flattenedColumns,
           level,
           index,
           record,
-          expanded
+          expanded,
+          displayNone: displayNone || !expanded
         }));
         /**
           * If expandedRowRender returns falsy, this expanded row will not be rendered
@@ -675,8 +683,8 @@ class Body extends BaseComponent {
         }
       }
       // render tree data
-      if (recordHasChildren && expanded) {
-        const nestedRows = this.renderBodyRows(recordChildren, level + 1);
+      if (recordHasChildren && shouldRenderExpandedRows) {
+        const nestedRows = this.renderBodyRows(recordChildren, level + 1, [], displayNone || !expanded);
         renderedRows.push(...nestedRows);
       }
     });

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

@@ -34,6 +34,7 @@ export interface TableProps<RecordType extends Record<string, any> = any> extend
     hideExpandedColumn?: boolean;
     id?: string;
     indentSize?: number;
+    keepDOM?: boolean;
     loading?: boolean;
     pagination?: TablePagination;
     prefixCls?: string;

package/lib/es/timePicker/TimePicker.d.ts

@@ -63,6 +63,7 @@ export type TimePickerProps = {
     secondStep?: number;
     showClear?: boolean;
     size?: InputSize;
+    stopPropagation: boolean;
     style?: React.CSSProperties;
     timeZone?: string | number;
     triggerRender?: (props?: any) => React.ReactNode;
@@ -133,6 +134,7 @@ export default class TimePicker extends BaseComponent<TimePickerProps, TimePicke
         focusOnOpen: PropTypes.Requireable<boolean>;
         autoFocus: PropTypes.Requireable<boolean>;
         size: PropTypes.Requireable<"default" | "small" | "large">;
+        stopPropagation: PropTypes.Requireable<boolean>;
         panels: PropTypes.Requireable<PropTypes.InferProps<{
             panelHeader: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
             panelFooter: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
@@ -166,6 +168,7 @@ export default class TimePicker extends BaseComponent<TimePickerProps, TimePicke
         prefixCls: string;
         inputReadOnly: boolean;
         style: {};
+        stopPropagation: boolean;
         className: string;
         popupClassName: string;
         popupStyle: {

package/lib/es/timePicker/TimePicker.js

@@ -262,9 +262,10 @@ export default class TimePicker extends BaseComponent {
         scrollItemProps,
         triggerRender,
         motion,
-        autoAdjustOverflow
+        autoAdjustOverflow,
+        stopPropagation
       } = _a,
-      rest = __rest(_a, ["prefixCls", "placeholder", "disabled", "defaultValue", "dropdownMargin", "className", "popupStyle", "size", "style", "locale", "localeCode", "zIndex", "getPopupContainer", "insetLabel", "insetLabelId", "inputStyle", "showClear", "panelHeader", "panelFooter", "rangeSeparator", "onOpenChange", "onChangeWithDateFirst", "popupClassName", "hideDisabledOptions", "use12Hours", "minuteStep", "hourStep", "secondStep", "scrollItemProps", "triggerRender", "motion", "autoAdjustOverflow"]);
+      rest = __rest(_a, ["prefixCls", "placeholder", "disabled", "defaultValue", "dropdownMargin", "className", "popupStyle", "size", "style", "locale", "localeCode", "zIndex", "getPopupContainer", "insetLabel", "insetLabelId", "inputStyle", "showClear", "panelHeader", "panelFooter", "rangeSeparator", "onOpenChange", "onChangeWithDateFirst", "popupClassName", "hideDisabledOptions", "use12Hours", "minuteStep", "hourStep", "secondStep", "scrollItemProps", "triggerRender", "motion", "autoAdjustOverflow", "stopPropagation"]);
     const format = this.foundation.getDefaultFormatIfNeed();
     const position = this.foundation.getPosition();
     const useCustomTrigger = typeof triggerRender === 'function';
@@ -322,7 +323,8 @@ export default class TimePicker extends BaseComponent {
       visible: disabled ? false : Boolean(open),
       motion: motion,
       margin: dropdownMargin,
-      autoAdjustOverflow: autoAdjustOverflow
+      autoAdjustOverflow: autoAdjustOverflow,
+      stopPropagation: stopPropagation
     }, useCustomTrigger ? /*#__PURE__*/React.createElement(Trigger, {
       triggerRender: triggerRender,
       disabled: disabled,
@@ -377,6 +379,7 @@ TimePicker.propTypes = Object.assign(Object.assign({
   focusOnOpen: PropTypes.bool,
   autoFocus: PropTypes.bool,
   size: PropTypes.oneOf(strings.SIZE),
+  stopPropagation: PropTypes.bool,
   panels: PropTypes.arrayOf(PropTypes.shape(PanelShape)),
   onFocus: PropTypes.func,
   onBlur: PropTypes.func,
@@ -410,6 +413,7 @@ TimePicker.defaultProps = Object.assign({
   prefixCls: cssClasses.PREFIX,
   inputReadOnly: false,
   style: {},
+  stopPropagation: true,
   className: '',
   popupClassName: '',
   popupStyle: {

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

@@ -50,6 +50,7 @@ export default class LocaleTimePicker extends React.PureComponent<LocalePickerPr
         focusOnOpen: import("prop-types").Requireable<boolean>;
         autoFocus: import("prop-types").Requireable<boolean>;
         size: import("prop-types").Requireable<"default" | "small" | "large">;
+        stopPropagation: import("prop-types").Requireable<boolean>;
         panels: import("prop-types").Requireable<import("prop-types").InferProps<{
             panelHeader: import("prop-types").Requireable<NonNullable<import("prop-types").ReactNodeLike>>;
             panelFooter: import("prop-types").Requireable<NonNullable<import("prop-types").ReactNodeLike>>;
@@ -83,6 +84,7 @@ export default class LocaleTimePicker extends React.PureComponent<LocalePickerPr
         prefixCls: string;
         inputReadOnly: boolean;
         style: {};
+        stopPropagation: boolean;
         className: string;
         popupClassName: string;
         popupStyle: {

package/lib/es/toast/toast.d.ts

@@ -32,7 +32,7 @@ declare class Toast extends BaseComponent<ToastReactProps, ToastState> {
         showClose: PropTypes.Requireable<boolean>;
         stack: PropTypes.Requireable<boolean>;
         stackExpanded: PropTypes.Requireable<boolean>;
-        icon: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
+        icon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         direction: PropTypes.Requireable<string>;
     };
     static defaultProps: {

package/lib/es/toast/toast.js

@@ -150,7 +150,7 @@ Toast.propTypes = {
   showClose: PropTypes.bool,
   stack: PropTypes.bool,
   stackExpanded: PropTypes.bool,
-  icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+  icon: PropTypes.node,
   direction: PropTypes.oneOf(strings.directions)
 };
 Toast.defaultProps = {

package/lib/es/typography/util.js

@@ -42,7 +42,6 @@ const getRenderText = function (originEle, rows) {
   const lineHeight = pxToNumber(originStyle.lineHeight);
   const maxHeight = Math.round(lineHeight * (rows + 1) + pxToNumber(originStyle.paddingTop) + pxToNumber(originStyle.paddingBottom));
   // Set shadow
-  const maxWidth = parseInt(originStyle.width);
   ellipsisContainer.setAttribute('style', originCSS);
   ellipsisContainer.style.position = 'fixed';
   ellipsisContainer.style.left = '0';
@@ -54,12 +53,12 @@ const getRenderText = function (originEle, rows) {
   ellipsisContainer.style.webkitLineClamp = 'none';
   // Render fake container
   ReactDOM.render( /*#__PURE__*/React.createElement(React.Fragment, null), ellipsisContainer);
-  // Check if ellipsis in measure div is height enough for content
+  // Check if ellipsis in measure div is enough for content
   function inRange() {
-    if (originStyle.whiteSpace === 'nowrap') {
-      return ellipsisContainer.scrollWidth <= maxWidth;
-    }
-    return ellipsisContainer.scrollHeight < maxHeight;
+    // If content does not wrap due to line break strategy, width should be judged to determine whether it's in range
+    const widthInRange = ellipsisContainer.scrollWidth <= ellipsisContainer.offsetWidth;
+    const heightInRange = ellipsisContainer.scrollHeight < maxHeight;
+    return rows === 1 ? widthInRange && heightInRange : heightInRange;
   }
   // ========================= Find match ellipsis content =========================
   // Create origin content holder

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-ui",
-    "version": "2.48.0-beta.0",
+    "version": "2.49.0-beta.0",
     "description": "A modern, comprehensive, flexible design system and UI library. Connect DesignOps & DevOps. Quickly build beautiful React apps. Maintained by Douyin-fe team.",
     "main": "lib/cjs/index.js",
     "module": "lib/es/index.js",
@@ -20,12 +20,12 @@
         "@dnd-kit/core": "^6.0.8",
         "@dnd-kit/sortable": "^7.0.2",
         "@dnd-kit/utilities": "^3.2.1",
-        "@douyinfe/semi-animation": "2.48.0-beta.0",
-        "@douyinfe/semi-animation-react": "2.48.0-beta.0",
-        "@douyinfe/semi-foundation": "2.48.0-beta.0",
-        "@douyinfe/semi-icons": "2.48.0-beta.0",
-        "@douyinfe/semi-illustrations": "2.48.0-beta.0",
-        "@douyinfe/semi-theme-default": "2.48.0-beta.0",
+        "@douyinfe/semi-animation": "2.49.0-beta.0",
+        "@douyinfe/semi-animation-react": "2.49.0-beta.0",
+        "@douyinfe/semi-foundation": "2.49.0-beta.0",
+        "@douyinfe/semi-icons": "2.49.0-beta.0",
+        "@douyinfe/semi-illustrations": "2.49.0-beta.0",
+        "@douyinfe/semi-theme-default": "2.49.0-beta.0",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "copy-text-to-clipboard": "^2.1.1",
@@ -75,7 +75,7 @@
     ],
     "author": "",
     "license": "MIT",
-    "gitHead": "2eb75459ef1df87a83949a2f609da9468cd200c6",
+    "gitHead": "aa959f0cd22894b27c019eb78254ba9b991f80b3",
     "devDependencies": {
         "@babel/plugin-proposal-decorators": "^7.15.8",
         "@babel/plugin-transform-runtime": "^7.15.8",