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

package/cascader/foundation.ts

@@ -391,7 +391,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
             cacheValue = this._getCacheValue(keyEntities);
         }
 
-        const selectedValue = !this._isControlledComponent() ? cacheValue : value;
+        const selectedValue = !this._isControlledComponent() ? cacheValue : (isUndefined(value) ? [] : value);
         if (isValid(selectedValue)) {
             this.updateSelectedKey(selectedValue, keyEntities);
         } else {
@@ -402,8 +402,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
     // call when props.value change
     handleValueChange(value: BasicValue) {
         const { keyEntities } = this.getStates();
-        const { multiple } = this.getProps();
-        !multiple && this.updateSelectedKey(value, keyEntities);
+        this.updateSelectedKey(value, keyEntities);
     }
 
     /**

package/lib/cjs/cascader/foundation.js

@@ -188,7 +188,7 @@ class CascaderFoundation extends _foundation.default {
     } else if (!(0, _isEmpty2.default)(keyEntities)) {
       cacheValue = this._getCacheValue(keyEntities);
     }
-    const selectedValue = !this._isControlledComponent() ? cacheValue : value;
+    const selectedValue = !this._isControlledComponent() ? cacheValue : (0, _isUndefined2.default)(value) ? [] : value;
     if ((0, _util.isValid)(selectedValue)) {
       this.updateSelectedKey(selectedValue, keyEntities);
     } else {
@@ -202,10 +202,7 @@ class CascaderFoundation extends _foundation.default {
     const {
       keyEntities
     } = this.getStates();
-    const {
-      multiple
-    } = this.getProps();
-    !multiple && this.updateSelectedKey(value, keyEntities);
+    this.updateSelectedKey(value, keyEntities);
   }
   /**
    * When single selection, the clear objects of

package/lib/cjs/select/select.css

@@ -378,18 +378,21 @@
   overflow: hidden;
   position: relative;
 }
+.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
+  height: 24px;
+  line-height: 24px;
+}
+.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-default {
+  height: 24px;
+}
 .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper {
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
 }
-.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper .semi-input-wrapper {
-  height: 24px;
-  line-height: 24px;
-}
-.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper .semi-input-wrapper .semi-input-default {
-  height: 24px;
+.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper .semi-input-default {
+  height: 100%;
 }
 .semi-select-multiple.semi-select-filterable .semi-input-wrapper {
   height: 100%;
@@ -405,19 +408,19 @@
   padding-right: 0;
 }
 
-.semi-select-multiple.semi-select-filterable.semi-select-large .semi-input-wrapper-large {
+.semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large {
   height: 24px;
   line-height: 24px;
 }
-.semi-select-multiple.semi-select-filterable.semi-select-large .semi-input-wrapper-large .semi-input-large {
+.semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large .semi-input-large {
   height: 24px;
 }
 
-.semi-select-multiple.semi-select-filterable.semi-select-small .semi-input-wrapper {
+.semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
   height: 20px;
   line-height: 20px;
 }
-.semi-select-multiple.semi-select-filterable.semi-select-small .semi-input-wrapper .semi-input-small {
+.semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-small {
   height: 20px;
 }
 

package/lib/cjs/select/select.scss

@@ -392,22 +392,29 @@ $overflowList: #{$prefix}-overflow-list;
         height: 100%;
         overflow: hidden;
         position: relative;
+
+        &:not(.#{$module}-content-wrapper-empty) {
+            .#{$prefix}-input-wrapper {
+                height: $height-select_multiple_input_default;
+                line-height: $height-select_multiple_input_default;
+                .#{$prefix}-input-default {
+                    height: $height-select_multiple_input_default;
+                }
+            }
+        }
+
         &-empty {
             .#{$prefix}-input-wrapper {
                 position: absolute;
                 top: 0;
                 left: 0;
                 height: 100%;
+                .#{$prefix}-input-default {
+                    height: 100%;
+                }
                 // width: 100%; // no need to set width here, will calcuate inline style by js
             }
         }
-        .#{$prefix}-input-wrapper {
-            height: $height-select_multiple_input_default;
-            line-height: $height-select_multiple_input_default;
-            .#{$prefix}-input-default {
-                height: $height-select_multiple_input_default;
-            }
-        }
     }
     .#{$prefix}-input-wrapper {
         // position: absolute;
@@ -430,20 +437,29 @@ $overflowList: #{$prefix}-overflow-list;
 }
 
 .#{$multiple}.#{$filterable}.#{$module}-large {
-    .#{$prefix}-input-wrapper-large {
-        height: $height-select_multiple_input_large;
-        line-height: $height-select_multiple_input_large;
-        .#{$prefix}-input-large {
-            height: $height-select_multiple_input_large
+    .#{$module}-content-wrapper {
+        &:not(.#{$module}-content-wrapper-empty) {
+            .#{$prefix}-input-wrapper-large {
+                height: $height-select_multiple_input_large;
+                line-height: $height-select_multiple_input_large;
+                .#{$prefix}-input-large {
+                    height: $height-select_multiple_input_large
+                }
+            }
         }
     }
 }
+
 .#{$multiple}.#{$filterable}.#{$module}-small {
-    .#{$prefix}-input-wrapper {
-        height: $height-select_multiple_input_small;
-        line-height: $height-select_multiple_input_small;
-        .#{$prefix}-input-small {
-            height: $height-select_multiple_input_small;
+    .#{$module}-content-wrapper {
+        &:not(.#{$module}-content-wrapper-empty) {
+            .#{$prefix}-input-wrapper {
+                height: $height-select_multiple_input_small;
+                line-height: $height-select_multiple_input_small;
+                .#{$prefix}-input-small {
+                    height: $height-select_multiple_input_small;
+                }
+            }
         }
     }
 }

package/lib/es/cascader/foundation.js

@@ -181,7 +181,7 @@ export default class CascaderFoundation extends BaseFoundation {
     } else if (!_isEmpty(keyEntities)) {
       cacheValue = this._getCacheValue(keyEntities);
     }
-    const selectedValue = !this._isControlledComponent() ? cacheValue : value;
+    const selectedValue = !this._isControlledComponent() ? cacheValue : _isUndefined(value) ? [] : value;
     if (isValid(selectedValue)) {
       this.updateSelectedKey(selectedValue, keyEntities);
     } else {
@@ -195,10 +195,7 @@ export default class CascaderFoundation extends BaseFoundation {
     const {
       keyEntities
     } = this.getStates();
-    const {
-      multiple
-    } = this.getProps();
-    !multiple && this.updateSelectedKey(value, keyEntities);
+    this.updateSelectedKey(value, keyEntities);
   }
   /**
    * When single selection, the clear objects of

package/lib/es/select/select.css

@@ -378,18 +378,21 @@
   overflow: hidden;
   position: relative;
 }
+.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
+  height: 24px;
+  line-height: 24px;
+}
+.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-default {
+  height: 24px;
+}
 .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper {
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
 }
-.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper .semi-input-wrapper {
-  height: 24px;
-  line-height: 24px;
-}
-.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper .semi-input-wrapper .semi-input-default {
-  height: 24px;
+.semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper .semi-input-default {
+  height: 100%;
 }
 .semi-select-multiple.semi-select-filterable .semi-input-wrapper {
   height: 100%;
@@ -405,19 +408,19 @@
   padding-right: 0;
 }
 
-.semi-select-multiple.semi-select-filterable.semi-select-large .semi-input-wrapper-large {
+.semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large {
   height: 24px;
   line-height: 24px;
 }
-.semi-select-multiple.semi-select-filterable.semi-select-large .semi-input-wrapper-large .semi-input-large {
+.semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large .semi-input-large {
   height: 24px;
 }
 
-.semi-select-multiple.semi-select-filterable.semi-select-small .semi-input-wrapper {
+.semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
   height: 20px;
   line-height: 20px;
 }
-.semi-select-multiple.semi-select-filterable.semi-select-small .semi-input-wrapper .semi-input-small {
+.semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-small {
   height: 20px;
 }
 

package/lib/es/select/select.scss

@@ -392,22 +392,29 @@ $overflowList: #{$prefix}-overflow-list;
         height: 100%;
         overflow: hidden;
         position: relative;
+
+        &:not(.#{$module}-content-wrapper-empty) {
+            .#{$prefix}-input-wrapper {
+                height: $height-select_multiple_input_default;
+                line-height: $height-select_multiple_input_default;
+                .#{$prefix}-input-default {
+                    height: $height-select_multiple_input_default;
+                }
+            }
+        }
+
         &-empty {
             .#{$prefix}-input-wrapper {
                 position: absolute;
                 top: 0;
                 left: 0;
                 height: 100%;
+                .#{$prefix}-input-default {
+                    height: 100%;
+                }
                 // width: 100%; // no need to set width here, will calcuate inline style by js
             }
         }
-        .#{$prefix}-input-wrapper {
-            height: $height-select_multiple_input_default;
-            line-height: $height-select_multiple_input_default;
-            .#{$prefix}-input-default {
-                height: $height-select_multiple_input_default;
-            }
-        }
     }
     .#{$prefix}-input-wrapper {
         // position: absolute;
@@ -430,20 +437,29 @@ $overflowList: #{$prefix}-overflow-list;
 }
 
 .#{$multiple}.#{$filterable}.#{$module}-large {
-    .#{$prefix}-input-wrapper-large {
-        height: $height-select_multiple_input_large;
-        line-height: $height-select_multiple_input_large;
-        .#{$prefix}-input-large {
-            height: $height-select_multiple_input_large
+    .#{$module}-content-wrapper {
+        &:not(.#{$module}-content-wrapper-empty) {
+            .#{$prefix}-input-wrapper-large {
+                height: $height-select_multiple_input_large;
+                line-height: $height-select_multiple_input_large;
+                .#{$prefix}-input-large {
+                    height: $height-select_multiple_input_large
+                }
+            }
         }
     }
 }
+
 .#{$multiple}.#{$filterable}.#{$module}-small {
-    .#{$prefix}-input-wrapper {
-        height: $height-select_multiple_input_small;
-        line-height: $height-select_multiple_input_small;
-        .#{$prefix}-input-small {
-            height: $height-select_multiple_input_small;
+    .#{$module}-content-wrapper {
+        &:not(.#{$module}-content-wrapper-empty) {
+            .#{$prefix}-input-wrapper {
+                height: $height-select_multiple_input_small;
+                line-height: $height-select_multiple_input_small;
+                .#{$prefix}-input-small {
+                    height: $height-select_multiple_input_small;
+                }
+            }
         }
     }
 }

package/package.json

@@ -1,13 +1,13 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.56.0-beta.0",
+    "version": "2.56.0",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
         "prepublishOnly": "npm run build:lib"
     },
     "dependencies": {
-        "@douyinfe/semi-animation": "2.56.0-beta.0",
+        "@douyinfe/semi-animation": "2.56.0",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "date-fns": "^2.29.3",
@@ -24,7 +24,7 @@
         "*.scss",
         "*.css"
     ],
-    "gitHead": "ae4502e3075a19370e9f4ed32fbfb1292acd06c2",
+    "gitHead": "df0bd1db35dc3e9fc6b78202ea2eb5d5d60e2256",
     "devDependencies": {
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",

package/select/select.scss

@@ -392,22 +392,29 @@ $overflowList: #{$prefix}-overflow-list;
         height: 100%;
         overflow: hidden;
         position: relative;
+
+        &:not(.#{$module}-content-wrapper-empty) {
+            .#{$prefix}-input-wrapper {
+                height: $height-select_multiple_input_default;
+                line-height: $height-select_multiple_input_default;
+                .#{$prefix}-input-default {
+                    height: $height-select_multiple_input_default;
+                }
+            }
+        }
+
         &-empty {
             .#{$prefix}-input-wrapper {
                 position: absolute;
                 top: 0;
                 left: 0;
                 height: 100%;
+                .#{$prefix}-input-default {
+                    height: 100%;
+                }
                 // width: 100%; // no need to set width here, will calcuate inline style by js
             }
         }
-        .#{$prefix}-input-wrapper {
-            height: $height-select_multiple_input_default;
-            line-height: $height-select_multiple_input_default;
-            .#{$prefix}-input-default {
-                height: $height-select_multiple_input_default;
-            }
-        }
     }
     .#{$prefix}-input-wrapper {
         // position: absolute;
@@ -430,20 +437,29 @@ $overflowList: #{$prefix}-overflow-list;
 }
 
 .#{$multiple}.#{$filterable}.#{$module}-large {
-    .#{$prefix}-input-wrapper-large {
-        height: $height-select_multiple_input_large;
-        line-height: $height-select_multiple_input_large;
-        .#{$prefix}-input-large {
-            height: $height-select_multiple_input_large
+    .#{$module}-content-wrapper {
+        &:not(.#{$module}-content-wrapper-empty) {
+            .#{$prefix}-input-wrapper-large {
+                height: $height-select_multiple_input_large;
+                line-height: $height-select_multiple_input_large;
+                .#{$prefix}-input-large {
+                    height: $height-select_multiple_input_large
+                }
+            }
         }
     }
 }
+
 .#{$multiple}.#{$filterable}.#{$module}-small {
-    .#{$prefix}-input-wrapper {
-        height: $height-select_multiple_input_small;
-        line-height: $height-select_multiple_input_small;
-        .#{$prefix}-input-small {
-            height: $height-select_multiple_input_small;
+    .#{$module}-content-wrapper {
+        &:not(.#{$module}-content-wrapper-empty) {
+            .#{$prefix}-input-wrapper {
+                height: $height-select_multiple_input_small;
+                line-height: $height-select_multiple_input_small;
+                .#{$prefix}-input-small {
+                    height: $height-select_multiple_input_small;
+                }
+            }
         }
     }
 }