@douyinfe/semi-foundation 2.38.0 → 2.38.2-alpha.1

package/anchor/foundation.ts

@@ -171,7 +171,7 @@ export default class AnchorFoundation<P = Record<string, any>, S = Record<string
                  *      2. There is a scroll axis (clientHeight < scrollHeight | | clientWidth < scrollWidth)
                  *      3.overflowX or overflowY has a value and is not visible or clip
                  *       For details, please see https://github.com/stipsan/compute-scroll-into-view
-                 * 
+                 *
                  * behavior定义滚动行为
                  *  - 可选 'auto' | 'smooth' | Function
                  *  - Function 自定义滚动行为
@@ -184,9 +184,12 @@ export default class AnchorFoundation<P = Record<string, any>, S = Record<string
                  */
                 behavior: actions => {
                     // We just need to scroll the innermost target container
-                    const innermostAction = get(actions, '0');
-                    const el = get(innermostAction, 'el');
-                    const top = get(innermostAction, 'top');
+                    const verticalScrollAction = actions.find(action => {
+                        const { el } = action;
+                        return el.scrollHeight > el.clientHeight;
+                    });
+                    const el = get(verticalScrollAction, 'el');
+                    const top = get(verticalScrollAction, 'top');
                     if (el) {
                         const offsetTop = top - targetOffset;
                         if (el.scroll && canSmoothScroll) {

package/autoComplete/foundation.ts

@@ -39,7 +39,9 @@ export interface AutoCompleteAdapter<P = Record<string, any>, S = Record<string,
     notifyFocus: (event?: any) => void;
     notifyBlur: (event?: any) => void;
     rePositionDropdown: () => void;
-    persistEvent: (event: any) => void
+    persistEvent: (event: any) => void;
+    registerClickOutsideHandler: (cb: (e: any) => void) => void;
+    unregisterClickOutsideHandler: () => void
 }
 
 class AutoCompleteFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<AutoCompleteAdapter<P, S>, P, S> {
@@ -79,7 +81,7 @@ class AutoCompleteFoundation<P = Record<string, any>, S = Record<string, any>> e
     }
 
     destroy(): void {
-        // this._adapter.unregisterClickOutsideHandler();
+        this._adapter.unregisterClickOutsideHandler();
         // this.unBindKeyBoardEvent();
     }
 
@@ -114,7 +116,7 @@ class AutoCompleteFoundation<P = Record<string, any>, S = Record<string, any>> e
         this.isPanelOpen = true;
         this._adapter.toggleListVisible(true);
         this._setDropdownWidth();
-        // this._adapter.registerClickOutsideHandler(e => this.closeDropdown(e));
+        this._adapter.registerClickOutsideHandler(e => this.closeDropdown(e));
         this._adapter.notifyDropdownVisibleChange(true);
         this._modifyFocusIndexOnPanelOpen();
     }
@@ -122,7 +124,7 @@ class AutoCompleteFoundation<P = Record<string, any>, S = Record<string, any>> e
     closeDropdown(e?: any): void {
         this.isPanelOpen = false;
         this._adapter.toggleListVisible(false);
-        // this._adapter.unregisterClickOutsideHandler();
+        this._adapter.unregisterClickOutsideHandler();
         this._adapter.notifyDropdownVisibleChange(false);
         // After closing the panel, you can still open the panel by pressing the enter key
         // this.unBindKeyBoardEvent();

package/lib/cjs/anchor/foundation.js

@@ -165,9 +165,14 @@ class AnchorFoundation extends _foundation.default {
            */
           behavior: actions => {
             // We just need to scroll the innermost target container
-            const innermostAction = (0, _get2.default)(actions, '0');
-            const el = (0, _get2.default)(innermostAction, 'el');
-            const top = (0, _get2.default)(innermostAction, 'top');
+            const verticalScrollAction = actions.find(action => {
+              const {
+                el
+              } = action;
+              return el.scrollHeight > el.clientHeight;
+            });
+            const el = (0, _get2.default)(verticalScrollAction, 'el');
+            const top = (0, _get2.default)(verticalScrollAction, 'top');
             if (el) {
               const offsetTop = top - targetOffset;
               if (el.scroll && canSmoothScroll) {

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

@@ -31,6 +31,8 @@ export interface AutoCompleteAdapter<P = Record<string, any>, S = Record<string,
     notifyBlur: (event?: any) => void;
     rePositionDropdown: () => void;
     persistEvent: (event: any) => void;
+    registerClickOutsideHandler: (cb: (e: any) => void) => void;
+    unregisterClickOutsideHandler: () => void;
 }
 declare class AutoCompleteFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<AutoCompleteAdapter<P, S>, P, S> {
     private _keydownHandler;

package/lib/cjs/autoComplete/foundation.js

@@ -47,9 +47,10 @@ class AutoCompleteFoundation extends _foundation.default {
     }
   }
   destroy() {
-    // this._adapter.unregisterClickOutsideHandler();
+    this._adapter.unregisterClickOutsideHandler();
     // this.unBindKeyBoardEvent();
   }
+
   _setDropdownWidth() {
     const {
       style,
@@ -86,14 +87,14 @@ class AutoCompleteFoundation extends _foundation.default {
     this.isPanelOpen = true;
     this._adapter.toggleListVisible(true);
     this._setDropdownWidth();
-    // this._adapter.registerClickOutsideHandler(e => this.closeDropdown(e));
+    this._adapter.registerClickOutsideHandler(e => this.closeDropdown(e));
     this._adapter.notifyDropdownVisibleChange(true);
     this._modifyFocusIndexOnPanelOpen();
   }
   closeDropdown(e) {
     this.isPanelOpen = false;
     this._adapter.toggleListVisible(false);
-    // this._adapter.unregisterClickOutsideHandler();
+    this._adapter.unregisterClickOutsideHandler();
     this._adapter.notifyDropdownVisibleChange(false);
     // After closing the panel, you can still open the panel by pressing the enter key
     // this.unBindKeyBoardEvent();

package/lib/es/anchor/foundation.js

@@ -158,9 +158,14 @@ export default class AnchorFoundation extends BaseFoundation {
            */
           behavior: actions => {
             // We just need to scroll the innermost target container
-            const innermostAction = _get(actions, '0');
-            const el = _get(innermostAction, 'el');
-            const top = _get(innermostAction, 'top');
+            const verticalScrollAction = actions.find(action => {
+              const {
+                el
+              } = action;
+              return el.scrollHeight > el.clientHeight;
+            });
+            const el = _get(verticalScrollAction, 'el');
+            const top = _get(verticalScrollAction, 'top');
             if (el) {
               const offsetTop = top - targetOffset;
               if (el.scroll && canSmoothScroll) {

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

@@ -31,6 +31,8 @@ export interface AutoCompleteAdapter<P = Record<string, any>, S = Record<string,
     notifyBlur: (event?: any) => void;
     rePositionDropdown: () => void;
     persistEvent: (event: any) => void;
+    registerClickOutsideHandler: (cb: (e: any) => void) => void;
+    unregisterClickOutsideHandler: () => void;
 }
 declare class AutoCompleteFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<AutoCompleteAdapter<P, S>, P, S> {
     private _keydownHandler;

package/lib/es/autoComplete/foundation.js

@@ -39,9 +39,10 @@ class AutoCompleteFoundation extends BaseFoundation {
     }
   }
   destroy() {
-    // this._adapter.unregisterClickOutsideHandler();
+    this._adapter.unregisterClickOutsideHandler();
     // this.unBindKeyBoardEvent();
   }
+
   _setDropdownWidth() {
     const {
       style,
@@ -78,14 +79,14 @@ class AutoCompleteFoundation extends BaseFoundation {
     this.isPanelOpen = true;
     this._adapter.toggleListVisible(true);
     this._setDropdownWidth();
-    // this._adapter.registerClickOutsideHandler(e => this.closeDropdown(e));
+    this._adapter.registerClickOutsideHandler(e => this.closeDropdown(e));
     this._adapter.notifyDropdownVisibleChange(true);
     this._modifyFocusIndexOnPanelOpen();
   }
   closeDropdown(e) {
     this.isPanelOpen = false;
     this._adapter.toggleListVisible(false);
-    // this._adapter.unregisterClickOutsideHandler();
+    this._adapter.unregisterClickOutsideHandler();
     this._adapter.notifyDropdownVisibleChange(false);
     // After closing the panel, you can still open the panel by pressing the enter key
     // this.unBindKeyBoardEvent();

package/package.json

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