@douyinfe/semi-foundation 2.62.0-beta.0 → 2.62.1

package/carousel/foundation.ts

@@ -7,7 +7,7 @@ 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   
 }
 
 class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<CarouselAdapter<P, S>, P, S> {
@@ -124,9 +124,11 @@ class CarouselFoundation<P = Record<string, any>, S = Record<string, any>> exten
 
     handleAutoPlay(): void { 
         const { autoPlay } = this.getProps(); 
+        const { children } = this.getStates();
         const autoPlayType = typeof autoPlay;
         // when user manually call the play function, force play
-        if ((autoPlayType === 'boolean' && autoPlay) || isObject(autoPlay) || this._forcePlay) {
+        // only when carousel children length > 1 to start play
+        if (children.length > 1 && ((autoPlay === true) || isObject(autoPlay) || this._forcePlay)) {
             this.play(this.getSwitchingTime());
         }
     }

package/lib/cjs/carousel/foundation.js

@@ -123,9 +123,13 @@ class CarouselFoundation extends _foundation.default {
     const {
       autoPlay
     } = this.getProps();
+    const {
+      children
+    } = this.getStates();
     const autoPlayType = typeof autoPlay;
     // when user manually call the play function, force play
-    if (autoPlayType === 'boolean' && autoPlay || (0, _isObject2.default)(autoPlay) || this._forcePlay) {
+    // only when carousel children length > 1 to start play
+    if (children.length > 1 && (autoPlay === true || (0, _isObject2.default)(autoPlay) || this._forcePlay)) {
       this.play(this.getSwitchingTime());
     }
   }

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

@@ -34,7 +34,7 @@ export interface SliderProps {
     handleDot?: {
         size?: string;
         color?: string;
-    } & ({
+    } | ({
         size?: string;
         color?: string;
     }[]);

package/lib/cjs/table/table.css

@@ -441,7 +441,6 @@
   text-align: center;
   background: transparent;
   border-bottom: 1px solid var(--semi-color-border);
-  border-radius: 0 0 4px 4px;
 }
 .semi-table-fixed {
   table-layout: fixed;

package/lib/cjs/table/table.scss

@@ -541,7 +541,6 @@ $module: #{$prefix}-table;
         text-align: center;
         background: $color-table_pl-bg-default;
         border-bottom: $width-table_base_border $border-table_base-borderStyle $color-table-border-default;
-        border-radius: 0 0 #{$radius-table_base} #{$radius-table_base};
     }
 
     &-fixed {

package/lib/cjs/table/variables.scss

@@ -32,7 +32,7 @@ $spacing-table_panel_operation-paddingY: $spacing-tight;
 $width-table_base_border: 1px; // 表格单元格分割线宽度
 $width-table_header_border: 2px; // 表格表头分割线宽度
 $width-table_resizer_border: 2px; // 表格拉伸列标示线宽度
-$radius-table_base: 4px;
+// $radius-table_base: 4px;
 $width-table_column_selection: 48px; // 表格默认列宽
 $width-table_column_sorter-icon: 16px; // 表格排序按钮宽度
 $height-table_column_sorter-icon: 16px; // 表格排序按钮高度

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

@@ -107,8 +107,6 @@ export interface TreeSelectAdapter<P = Record<string, any>, S = Record<string, a
     updateInputFocus: (bool: boolean) => void;
     updateLoadKeys: (data: BasicTreeNodeData, resolve: (value?: any) => void) => void;
     updateIsFocus: (bool: boolean) => void;
-    setClearInputFlag: (flag: boolean) => void;
-    getClearInputFlag: () => boolean;
 }
 export default class TreeSelectFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<TreeSelectAdapter<P, S>, P, S> {
     constructor(adapter: TreeSelectAdapter<P, S>);
@@ -164,7 +162,9 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
     handleSingleSelect(e: any, treeNode: BasicTreeNodeProps): void;
     calcCheckedKeys(eventKey: BasicTreeNodeProps['eventKey'], targetStatus: boolean): {
         checkedKeys: Set<string>;
-        halfCheckedKeys: Set<string>;
+        halfCheckedKeys: Set<string>; /**
+         * A11y: simulate selection click
+         */
     };
     handleMultipleSelect(e: any, treeNode: BasicTreeNodeProps): void;
     calcNonDisabledCheckedKeys(eventKey: string, targetStatus: boolean): {

package/lib/cjs/treeSelect/foundation.js

@@ -794,8 +794,7 @@ class TreeSelectFoundation extends _foundation.default {
    * When the search box is on the trigger, the focus event processing method
    */
   handleInputTriggerFocus() {
-    const inputValue = this.getState('inputValue');
-    inputValue && this.clearInput();
+    this.clearInput();
     this._adapter.updateState({
       inputTriggerFocus: true
     });
@@ -809,11 +808,9 @@ class TreeSelectFoundation extends _foundation.default {
       searchAutoFocus,
       searchPosition
     } = this.getProps();
-    const inputValue = this.getState('inputValue');
     // 将 inputValue 清空，如果有选中值的话，选中项能够快速回显
     // Clear the inputValue. If there is a selected value, the selected item can be quickly echoed.
     if (isVisible === false && filterTreeNode) {
-      inputValue && this._adapter.setClearInputFlag(true);
       this.clearInputValue();
     }
     if (filterTreeNode && searchPosition === _constants.strings.SEARCH_POSITION_DROPDOWN && isVisible && searchAutoFocus) {
@@ -830,8 +827,7 @@ class TreeSelectFoundation extends _foundation.default {
     const {
       filterTreeNode
     } = this.getProps();
-    const shouldClear = this._adapter.getClearInputFlag();
-    filterTreeNode && shouldClear && this.clearInput();
+    filterTreeNode && this.clearInput();
   }
 }
 exports.default = TreeSelectFoundation;

package/lib/cjs/upload/upload.css

@@ -291,6 +291,10 @@
   object-fit: cover;
   border-radius: var(--semi-border-radius-small);
 }
+.semi-upload-picture-file-card-custom-thumbnail .semi-image img {
+  width: inherit;
+  height: inherit;
+}
 .semi-upload-picture-file-card-close {
   visibility: hidden;
   display: inline-flex;

package/lib/cjs/upload/upload.scss

@@ -358,6 +358,15 @@ $module: #{$prefix}-upload;
                 border-radius: $radius-upload_picture_file_card_img;
             }
 
+            &-custom-thumbnail {
+                .#{$prefix}-image {
+                    img {
+                        width: inherit;
+                        height: inherit;
+                    }
+                }
+            }
+
             &-close {
                 visibility: hidden;
                 display: inline-flex;

package/lib/es/carousel/foundation.js

@@ -116,9 +116,13 @@ class CarouselFoundation extends BaseFoundation {
     const {
       autoPlay
     } = this.getProps();
+    const {
+      children
+    } = this.getStates();
     const autoPlayType = typeof autoPlay;
     // when user manually call the play function, force play
-    if (autoPlayType === 'boolean' && autoPlay || _isObject(autoPlay) || this._forcePlay) {
+    // only when carousel children length > 1 to start play
+    if (children.length > 1 && (autoPlay === true || _isObject(autoPlay) || this._forcePlay)) {
       this.play(this.getSwitchingTime());
     }
   }

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

@@ -34,7 +34,7 @@ export interface SliderProps {
     handleDot?: {
         size?: string;
         color?: string;
-    } & ({
+    } | ({
         size?: string;
         color?: string;
     }[]);

package/lib/es/table/table.css

@@ -441,7 +441,6 @@
   text-align: center;
   background: transparent;
   border-bottom: 1px solid var(--semi-color-border);
-  border-radius: 0 0 4px 4px;
 }
 .semi-table-fixed {
   table-layout: fixed;

package/lib/es/table/table.scss

@@ -541,7 +541,6 @@ $module: #{$prefix}-table;
         text-align: center;
         background: $color-table_pl-bg-default;
         border-bottom: $width-table_base_border $border-table_base-borderStyle $color-table-border-default;
-        border-radius: 0 0 #{$radius-table_base} #{$radius-table_base};
     }
 
     &-fixed {

package/lib/es/table/variables.scss

@@ -32,7 +32,7 @@ $spacing-table_panel_operation-paddingY: $spacing-tight;
 $width-table_base_border: 1px; // 表格单元格分割线宽度
 $width-table_header_border: 2px; // 表格表头分割线宽度
 $width-table_resizer_border: 2px; // 表格拉伸列标示线宽度
-$radius-table_base: 4px;
+// $radius-table_base: 4px;
 $width-table_column_selection: 48px; // 表格默认列宽
 $width-table_column_sorter-icon: 16px; // 表格排序按钮宽度
 $height-table_column_sorter-icon: 16px; // 表格排序按钮高度

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

@@ -107,8 +107,6 @@ export interface TreeSelectAdapter<P = Record<string, any>, S = Record<string, a
     updateInputFocus: (bool: boolean) => void;
     updateLoadKeys: (data: BasicTreeNodeData, resolve: (value?: any) => void) => void;
     updateIsFocus: (bool: boolean) => void;
-    setClearInputFlag: (flag: boolean) => void;
-    getClearInputFlag: () => boolean;
 }
 export default class TreeSelectFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<TreeSelectAdapter<P, S>, P, S> {
     constructor(adapter: TreeSelectAdapter<P, S>);
@@ -164,7 +162,9 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
     handleSingleSelect(e: any, treeNode: BasicTreeNodeProps): void;
     calcCheckedKeys(eventKey: BasicTreeNodeProps['eventKey'], targetStatus: boolean): {
         checkedKeys: Set<string>;
-        halfCheckedKeys: Set<string>;
+        halfCheckedKeys: Set<string>; /**
+         * A11y: simulate selection click
+         */
     };
     handleMultipleSelect(e: any, treeNode: BasicTreeNodeProps): void;
     calcNonDisabledCheckedKeys(eventKey: string, targetStatus: boolean): {

package/lib/es/treeSelect/foundation.js

@@ -787,8 +787,7 @@ export default class TreeSelectFoundation extends BaseFoundation {
    * When the search box is on the trigger, the focus event processing method
    */
   handleInputTriggerFocus() {
-    const inputValue = this.getState('inputValue');
-    inputValue && this.clearInput();
+    this.clearInput();
     this._adapter.updateState({
       inputTriggerFocus: true
     });
@@ -802,11 +801,9 @@ export default class TreeSelectFoundation extends BaseFoundation {
       searchAutoFocus,
       searchPosition
     } = this.getProps();
-    const inputValue = this.getState('inputValue');
     // 将 inputValue 清空，如果有选中值的话，选中项能够快速回显
     // Clear the inputValue. If there is a selected value, the selected item can be quickly echoed.
     if (isVisible === false && filterTreeNode) {
-      inputValue && this._adapter.setClearInputFlag(true);
       this.clearInputValue();
     }
     if (filterTreeNode && searchPosition === strings.SEARCH_POSITION_DROPDOWN && isVisible && searchAutoFocus) {
@@ -823,7 +820,6 @@ export default class TreeSelectFoundation extends BaseFoundation {
     const {
       filterTreeNode
     } = this.getProps();
-    const shouldClear = this._adapter.getClearInputFlag();
-    filterTreeNode && shouldClear && this.clearInput();
+    filterTreeNode && this.clearInput();
   }
 }

package/lib/es/upload/upload.css

@@ -291,6 +291,10 @@
   object-fit: cover;
   border-radius: var(--semi-border-radius-small);
 }
+.semi-upload-picture-file-card-custom-thumbnail .semi-image img {
+  width: inherit;
+  height: inherit;
+}
 .semi-upload-picture-file-card-close {
   visibility: hidden;
   display: inline-flex;

package/lib/es/upload/upload.scss

@@ -358,6 +358,15 @@ $module: #{$prefix}-upload;
                 border-radius: $radius-upload_picture_file_card_img;
             }
 
+            &-custom-thumbnail {
+                .#{$prefix}-image {
+                    img {
+                        width: inherit;
+                        height: inherit;
+                    }
+                }
+            }
+
             &-close {
                 visibility: hidden;
                 display: inline-flex;

package/package.json

@@ -1,13 +1,13 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.62.0-beta.0",
+    "version": "2.62.1",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
         "prepublishOnly": "npm run build:lib"
     },
     "dependencies": {
-        "@douyinfe/semi-animation": "2.62.0-beta.0",
+        "@douyinfe/semi-animation": "2.62.1",
         "@mdx-js/mdx": "^3.0.1",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
@@ -28,7 +28,7 @@
         "*.scss",
         "*.css"
     ],
-    "gitHead": "aa6b83e5efc6705625be251749aa45a182c5eac3",
+    "gitHead": "99b473508df61ea87098d68db7d0d8a07c8c42b8",
     "devDependencies": {
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",

package/slider/foundation.ts

@@ -40,7 +40,7 @@ export interface SliderProps{
     handleDot?: {
         size?: string;
         color?: string
-    } & ({
+    } | ({
         size?: string;
         color?: string
     }[])

package/table/table.scss

@@ -541,7 +541,6 @@ $module: #{$prefix}-table;
         text-align: center;
         background: $color-table_pl-bg-default;
         border-bottom: $width-table_base_border $border-table_base-borderStyle $color-table-border-default;
-        border-radius: 0 0 #{$radius-table_base} #{$radius-table_base};
     }
 
     &-fixed {

package/table/variables.scss

@@ -32,7 +32,7 @@ $spacing-table_panel_operation-paddingY: $spacing-tight;
 $width-table_base_border: 1px; // 表格单元格分割线宽度
 $width-table_header_border: 2px; // 表格表头分割线宽度
 $width-table_resizer_border: 2px; // 表格拉伸列标示线宽度
-$radius-table_base: 4px;
+// $radius-table_base: 4px;
 $width-table_column_selection: 48px; // 表格默认列宽
 $width-table_column_sorter-icon: 16px; // 表格排序按钮宽度
 $height-table_column_sorter-icon: 16px; // 表格排序按钮高度

package/treeSelect/foundation.ts

@@ -200,9 +200,7 @@ export interface TreeSelectAdapter<P = Record<string, any>, S = Record<string, a
     notifyLoad: (newLoadedKeys: Set<string>, data: BasicTreeNodeData) => void;
     updateInputFocus: (bool: boolean) => void;
     updateLoadKeys: (data: BasicTreeNodeData, resolve: (value?: any) => void) => void;
-    updateIsFocus: (bool: boolean) => void;
-    setClearInputFlag: (flag: boolean) => void;
-    getClearInputFlag: () => boolean
+    updateIsFocus: (bool: boolean) => void
 }
 
 export default class TreeSelectFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<TreeSelectAdapter<P, S>, P, S> {
@@ -895,8 +893,7 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
      * When the search box is on the trigger, the focus event processing method
      */
     handleInputTriggerFocus() {
-        const inputValue = this.getState('inputValue');
-        inputValue && this.clearInput();
+        this.clearInput();
         this._adapter.updateState({
             inputTriggerFocus: true
         });
@@ -908,11 +905,9 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
 
     handlePopoverVisibleChange(isVisible: boolean) {
         const { filterTreeNode, searchAutoFocus, searchPosition } = this.getProps();
-        const inputValue = this.getState('inputValue');
         // 将 inputValue 清空，如果有选中值的话，选中项能够快速回显
         // Clear the inputValue. If there is a selected value, the selected item can be quickly echoed.
         if (isVisible === false && filterTreeNode) {
-            inputValue && this._adapter.setClearInputFlag(true);
             this.clearInputValue(); 
         }
         if (filterTreeNode && searchPosition === strings.SEARCH_POSITION_DROPDOWN && isVisible && searchAutoFocus) {
@@ -928,7 +923,6 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
         // After the pop-up layer is completely closed, recalculate the expandedKey and flattenNode in the state through clearInput.
         // Prevent the pop-up layer from flickering visually due to changes in the number of options in the pop-up panel when the pop-up layer is not collapsed.
         const { filterTreeNode } = this.getProps();
-        const shouldClear = this._adapter.getClearInputFlag();
-        filterTreeNode && shouldClear && this.clearInput();
+        filterTreeNode && this.clearInput();
     }
 }

package/upload/upload.scss

@@ -358,6 +358,15 @@ $module: #{$prefix}-upload;
                 border-radius: $radius-upload_picture_file_card_img;
             }
 
+            &-custom-thumbnail {
+                .#{$prefix}-image {
+                    img {
+                        width: inherit;
+                        height: inherit;
+                    }
+                }
+            }
+
             &-close {
                 visibility: hidden;
                 display: inline-flex;