@douyinfe/semi-foundation 2.71.1 → 2.72.0-beta.0

package/carousel/foundation.ts

@@ -7,7 +7,8 @@ export interface CarouselAdapter<P = Record<string, any>, S = Record<string, any
     setNewActiveIndex: (activeIndex: number) => void;
     setPreActiveIndex: (activeIndex: number) => void;
     setIsReverse: (isReverse: boolean) => void;   
-    setIsInit: (isInit: boolean) => void   
+    setIsInit: (isInit: boolean) => void;
+    getChildren: () => any[]  
 }
 
 class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<CarouselAdapter<P, S>, P, S> {
@@ -102,7 +103,7 @@ class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> exten
     }
 
     getValidIndex(index: number): number {
-        const { children } = this.getStates();
+        const children = this._adapter.getChildren();
         return (index + children.length) % children.length;
     }
 
@@ -124,7 +125,7 @@ class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> exten
 
     handleAutoPlay(): void { 
         const { autoPlay } = this.getProps(); 
-        const { children } = this.getStates();
+        const children = this._adapter.getChildren();
         const autoPlayType = typeof autoPlay;
         // when user manually call the play function, force play
         // only when carousel children length > 1 to start play

package/image/image.scss

@@ -204,6 +204,12 @@ $module: #{$prefix}-image;
             // transition: transform $transition_duration-image_preview_image_img  $transition_delay-image_preview_image_img;
             z-index: 0;
             user-select: none;
+            /**
+             * In tailwind, the max-width of img/video is set to 100%, 
+             * which will affect the amplification effect of the picture.
+             * So we need to set max-width to none.
+            */
+            max-width: none;
         }
 
         &-spin {

package/lib/cjs/carousel/foundation.d.ts

@@ -5,6 +5,7 @@ export interface CarouselAdapter<P = Record<string, any>, S = Record<string, any
     setPreActiveIndex: (activeIndex: number) => void;
     setIsReverse: (isReverse: boolean) => void;
     setIsInit: (isInit: boolean) => void;
+    getChildren: () => any[];
 }
 declare class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<CarouselAdapter<P, S>, P, S> {
     constructor(adapter: CarouselAdapter<P, S>);

package/lib/cjs/carousel/foundation.js

@@ -97,9 +97,7 @@ class CarouselFoundation extends _foundation.default {
     }
   }
   getValidIndex(index) {
-    const {
-      children
-    } = this.getStates();
+    const children = this._adapter.getChildren();
     return (index + children.length) % children.length;
   }
   getSwitchingTime() {
@@ -123,9 +121,7 @@ class CarouselFoundation extends _foundation.default {
     const {
       autoPlay
     } = this.getProps();
-    const {
-      children
-    } = this.getStates();
+    const children = this._adapter.getChildren();
     const autoPlayType = typeof autoPlay;
     // when user manually call the play function, force play
     // only when carousel children length > 1 to start play

package/lib/cjs/image/image.css

@@ -177,6 +177,12 @@
   transform: scale3d(1, 1, 1) var(--semi-transform-rotate-none);
   z-index: 0;
   user-select: none;
+  /**
+   * In tailwind, the max-width of img/video is set to 100%, 
+   * which will affect the amplification effect of the picture.
+   * So we need to set max-width to none.
+  */
+  max-width: none;
 }
 .semi-image-preview-image-spin {
   position: absolute;

package/lib/cjs/image/image.scss

@@ -204,6 +204,12 @@ $module: #{$prefix}-image;
             // transition: transform $transition_duration-image_preview_image_img  $transition_delay-image_preview_image_img;
             z-index: 0;
             user-select: none;
+            /**
+             * In tailwind, the max-width of img/video is set to 100%, 
+             * which will affect the amplification effect of the picture.
+             * So we need to set max-width to none.
+            */
+            max-width: none;
         }
 
         &-spin {

package/lib/cjs/table/foundation.d.ts

@@ -34,6 +34,9 @@ export interface BaseColumnProps<RecordType> {
     width?: string | number;
     ellipsis?: BaseEllipsis;
 }
+export interface OnChangeExtra {
+    changeType?: 'sorter' | 'filter' | 'pagination';
+}
 export interface TableAdapter<RecordType> extends DefaultAdapter {
     resetScrollY: () => void;
     setSelectedRowKeys: (selectedRowKeys: BaseRowKeyType[]) => void;
@@ -63,7 +66,7 @@ export interface TableAdapter<RecordType> extends DefaultAdapter {
         pagination: BasePagination;
         filters: BaseChangeInfoFilter<RecordType>[];
         sorter: BaseChangeInfoSorter<RecordType>;
-        extra: any;
+        extra: OnChangeExtra;
     }) => void;
     notifyExpand: (expanded?: boolean, record?: BaseIncludeGroupRecord<RecordType>, mouseEvent?: any) => void;
     notifyExpandedRowsChange: (expandedRows: BaseIncludeGroupRecord<RecordType>[]) => void;
@@ -173,7 +176,7 @@ declare class TableFoundation<RecordType> extends BaseFoundation<TableAdapter<Re
      * Add non-repeating elements to the array itself
      */
     _addNoDuplicatedItemsToArr(srcArr?: any[], ...objArrs: any[][]): any[];
-    _notifyChange(pagination: BasePagination, filters?: BaseChangeInfoFilter<RecordType>[], sorter?: BaseChangeInfoSorter<RecordType>, extra?: RecordType): void;
+    _notifyChange(pagination: BasePagination, filters?: BaseChangeInfoFilter<RecordType>[], sorter?: BaseChangeInfoSorter<RecordType>, extra?: OnChangeExtra): void;
     _rowExpansionIsControlled(): boolean;
     _pagerIsControlled(): boolean;
     _selectionIsControlled(): boolean;

package/lib/cjs/table/foundation.js

@@ -92,7 +92,9 @@ class TableFoundation extends _foundation.default {
         this._adapter.setPagination(pagination);
         this._adapter.setDataSource(dataSource);
       }
-      this._notifyChange(pagination);
+      this._notifyChange(pagination, undefined, undefined, {
+        changeType: 'pagination'
+      });
     };
     /**
      * Cache related data when initializing or updating the calculated dataSource
@@ -864,7 +866,9 @@ class TableFoundation extends _foundation.default {
       this._adapter.setQueries(queries);
       this.handleClickFilterOrSorter(queries);
     }
-    this._notifyChange(null, filters);
+    this._notifyChange(null, filters, undefined, {
+      changeType: 'filter'
+    });
   }
   /**
    * Click the sort button to call
@@ -912,7 +916,9 @@ class TableFoundation extends _foundation.default {
       this.handleClickFilterOrSorter(queries);
     }
     // notify sort event
-    this._notifyChange(null, null, curQuery, null);
+    this._notifyChange(null, null, curQuery, {
+      changeType: 'sorter'
+    });
   }
   /**
    * Recalculate the cached data after clicking filter or sorter

package/lib/cjs/tooltip/foundation.js

@@ -416,7 +416,8 @@ class Tooltip extends _foundation.default {
   }
   _togglePortalVisible(isVisible) {
     const nowVisible = this.getState('visible');
-    if (nowVisible !== isVisible) {
+    const isInsert = this.getState("isInsert");
+    if (nowVisible !== isVisible || isInsert !== isVisible) {
       this._adapter.togglePortalVisible(isVisible, () => {
         if (isVisible) {
           this._adapter.setInitialFocus();

package/lib/es/carousel/foundation.d.ts

@@ -5,6 +5,7 @@ export interface CarouselAdapter<P = Record<string, any>, S = Record<string, any
     setPreActiveIndex: (activeIndex: number) => void;
     setIsReverse: (isReverse: boolean) => void;
     setIsInit: (isInit: boolean) => void;
+    getChildren: () => any[];
 }
 declare class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<CarouselAdapter<P, S>, P, S> {
     constructor(adapter: CarouselAdapter<P, S>);

package/lib/es/carousel/foundation.js

@@ -90,9 +90,7 @@ class CarouselFoundation extends BaseFoundation {
     }
   }
   getValidIndex(index) {
-    const {
-      children
-    } = this.getStates();
+    const children = this._adapter.getChildren();
     return (index + children.length) % children.length;
   }
   getSwitchingTime() {
@@ -116,9 +114,7 @@ class CarouselFoundation extends BaseFoundation {
     const {
       autoPlay
     } = this.getProps();
-    const {
-      children
-    } = this.getStates();
+    const children = this._adapter.getChildren();
     const autoPlayType = typeof autoPlay;
     // when user manually call the play function, force play
     // only when carousel children length > 1 to start play

package/lib/es/image/image.css

@@ -177,6 +177,12 @@
   transform: scale3d(1, 1, 1) var(--semi-transform-rotate-none);
   z-index: 0;
   user-select: none;
+  /**
+   * In tailwind, the max-width of img/video is set to 100%, 
+   * which will affect the amplification effect of the picture.
+   * So we need to set max-width to none.
+  */
+  max-width: none;
 }
 .semi-image-preview-image-spin {
   position: absolute;

package/lib/es/image/image.scss

@@ -204,6 +204,12 @@ $module: #{$prefix}-image;
             // transition: transform $transition_duration-image_preview_image_img  $transition_delay-image_preview_image_img;
             z-index: 0;
             user-select: none;
+            /**
+             * In tailwind, the max-width of img/video is set to 100%, 
+             * which will affect the amplification effect of the picture.
+             * So we need to set max-width to none.
+            */
+            max-width: none;
         }
 
         &-spin {

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

@@ -34,6 +34,9 @@ export interface BaseColumnProps<RecordType> {
     width?: string | number;
     ellipsis?: BaseEllipsis;
 }
+export interface OnChangeExtra {
+    changeType?: 'sorter' | 'filter' | 'pagination';
+}
 export interface TableAdapter<RecordType> extends DefaultAdapter {
     resetScrollY: () => void;
     setSelectedRowKeys: (selectedRowKeys: BaseRowKeyType[]) => void;
@@ -63,7 +66,7 @@ export interface TableAdapter<RecordType> extends DefaultAdapter {
         pagination: BasePagination;
         filters: BaseChangeInfoFilter<RecordType>[];
         sorter: BaseChangeInfoSorter<RecordType>;
-        extra: any;
+        extra: OnChangeExtra;
     }) => void;
     notifyExpand: (expanded?: boolean, record?: BaseIncludeGroupRecord<RecordType>, mouseEvent?: any) => void;
     notifyExpandedRowsChange: (expandedRows: BaseIncludeGroupRecord<RecordType>[]) => void;
@@ -173,7 +176,7 @@ declare class TableFoundation<RecordType> extends BaseFoundation<TableAdapter<Re
      * Add non-repeating elements to the array itself
      */
     _addNoDuplicatedItemsToArr(srcArr?: any[], ...objArrs: any[][]): any[];
-    _notifyChange(pagination: BasePagination, filters?: BaseChangeInfoFilter<RecordType>[], sorter?: BaseChangeInfoSorter<RecordType>, extra?: RecordType): void;
+    _notifyChange(pagination: BasePagination, filters?: BaseChangeInfoFilter<RecordType>[], sorter?: BaseChangeInfoSorter<RecordType>, extra?: OnChangeExtra): void;
     _rowExpansionIsControlled(): boolean;
     _pagerIsControlled(): boolean;
     _selectionIsControlled(): boolean;

package/lib/es/table/foundation.js

@@ -85,7 +85,9 @@ class TableFoundation extends BaseFoundation {
         this._adapter.setPagination(pagination);
         this._adapter.setDataSource(dataSource);
       }
-      this._notifyChange(pagination);
+      this._notifyChange(pagination, undefined, undefined, {
+        changeType: 'pagination'
+      });
     };
     /**
      * Cache related data when initializing or updating the calculated dataSource
@@ -857,7 +859,9 @@ class TableFoundation extends BaseFoundation {
       this._adapter.setQueries(queries);
       this.handleClickFilterOrSorter(queries);
     }
-    this._notifyChange(null, filters);
+    this._notifyChange(null, filters, undefined, {
+      changeType: 'filter'
+    });
   }
   /**
    * Click the sort button to call
@@ -905,7 +909,9 @@ class TableFoundation extends BaseFoundation {
       this.handleClickFilterOrSorter(queries);
     }
     // notify sort event
-    this._notifyChange(null, null, curQuery, null);
+    this._notifyChange(null, null, curQuery, {
+      changeType: 'sorter'
+    });
   }
   /**
    * Recalculate the cached data after clicking filter or sorter

package/lib/es/tooltip/foundation.js

@@ -409,7 +409,8 @@ export default class Tooltip extends BaseFoundation {
   }
   _togglePortalVisible(isVisible) {
     const nowVisible = this.getState('visible');
-    if (nowVisible !== isVisible) {
+    const isInsert = this.getState("isInsert");
+    if (nowVisible !== isVisible || isInsert !== isVisible) {
       this._adapter.togglePortalVisible(isVisible, () => {
         if (isVisible) {
           this._adapter.setInitialFocus();

package/package.json

@@ -1,14 +1,14 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.71.1",
+    "version": "2.72.0-beta.0",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
         "prepublishOnly": "npm run build:lib"
     },
     "dependencies": {
-        "@douyinfe/semi-animation": "2.71.1",
-        "@douyinfe/semi-json-viewer-core": "2.71.1",
+        "@douyinfe/semi-animation": "2.72.0-beta.0",
+        "@douyinfe/semi-json-viewer-core": "2.72.0-beta.0",
         "@mdx-js/mdx": "^3.0.1",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
@@ -29,7 +29,7 @@
         "*.scss",
         "*.css"
     ],
-    "gitHead": "e109344a9a8f3aff3e4c5ac020c90dc134b8ea7f",
+    "gitHead": "229a05b561c1c65c7df4ec7031cda4c52d6df631",
     "devDependencies": {
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",

package/table/foundation.ts

@@ -55,6 +55,10 @@ export interface BaseColumnProps<RecordType> {
     ellipsis?: BaseEllipsis
 }
 
+export interface OnChangeExtra {
+    changeType?: 'sorter' | 'filter' | 'pagination'
+}
+
 export interface TableAdapter<RecordType> extends DefaultAdapter {
     resetScrollY: () => void;
     setSelectedRowKeys: (selectedRowKeys: BaseRowKeyType[]) => void;
@@ -80,7 +84,7 @@ export interface TableAdapter<RecordType> extends DefaultAdapter {
     getAllDisabledRowKeys: () => BaseRowKeyType[];
     getAllDisabledRowKeysSet: () => Set<BaseRowKeyType>;
     notifyFilterDropdownVisibleChange: (visible: boolean, dataIndex: string) => void;
-    notifyChange: (changeInfo: { pagination: BasePagination; filters: BaseChangeInfoFilter<RecordType>[]; sorter: BaseChangeInfoSorter<RecordType>; extra: any }) => void;
+    notifyChange: (changeInfo: { pagination: BasePagination; filters: BaseChangeInfoFilter<RecordType>[]; sorter: BaseChangeInfoSorter<RecordType>; extra: OnChangeExtra }) => void;
     notifyExpand: (expanded?: boolean, record?: BaseIncludeGroupRecord<RecordType>, mouseEvent?: any) => void;
     notifyExpandedRowsChange: (expandedRows: BaseIncludeGroupRecord<RecordType>[]) => void;
     notifySelect: (record?: BaseIncludeGroupRecord<RecordType>, selected?: boolean, selectedRows?: BaseIncludeGroupRecord<RecordType>[], nativeEvent?: any) => void;
@@ -400,7 +404,7 @@ class TableFoundation<RecordType> extends BaseFoundation<TableAdapter<RecordType
             this._adapter.setDataSource(dataSource);
         }
 
-        this._notifyChange(pagination);
+        this._notifyChange(pagination, undefined, undefined, { changeType: 'pagination' });
     };
 
     /**
@@ -579,7 +583,7 @@ class TableFoundation<RecordType> extends BaseFoundation<TableAdapter<RecordType
         return srcArr;
     }
 
-    _notifyChange(pagination: BasePagination, filters?: BaseChangeInfoFilter<RecordType>[], sorter?: BaseChangeInfoSorter<RecordType>, extra?: RecordType) {
+    _notifyChange(pagination: BasePagination, filters?: BaseChangeInfoFilter<RecordType>[], sorter?: BaseChangeInfoSorter<RecordType>, extra?: OnChangeExtra) {
         pagination = pagination == null ? this._getPagination() : pagination;
         filters = filters == null ? this._getAllFilters() : filters;
         sorter = sorter == null ? this._getAllSorters()[0] as BaseChangeInfoSorter<RecordType> : sorter;
@@ -1067,7 +1071,7 @@ class TableFoundation<RecordType> extends BaseFoundation<TableAdapter<RecordType
             this.handleClickFilterOrSorter(queries);
         }
 
-        this._notifyChange(null, filters);
+        this._notifyChange(null, filters, undefined, { changeType: 'filter' });
     }
 
     /**
@@ -1120,7 +1124,7 @@ class TableFoundation<RecordType> extends BaseFoundation<TableAdapter<RecordType
         }
 
         // notify sort event
-        this._notifyChange(null, null, curQuery, null);
+        this._notifyChange(null, null, curQuery, { changeType: 'sorter' });
     }
 
     /**

package/tooltip/foundation.ts

@@ -383,7 +383,8 @@ export default class Tooltip<P = Record<string, any>, S = Record<string, any>> e
 
     _togglePortalVisible(isVisible: boolean) {
         const nowVisible = this.getState('visible');
-        if (nowVisible !== isVisible) {
+        const isInsert = this.getState("isInsert");
+        if (nowVisible !== isVisible || isInsert !== isVisible) {
             this._adapter.togglePortalVisible(isVisible, () => {
                 if (isVisible) {
                     this._adapter.setInitialFocus();