@douyinfe/semi-foundation 2.6.0 → 2.7.1

package/lib/es/tooltip/foundation.js

@@ -520,25 +520,25 @@ export default class Tooltip extends BaseFoundation {
         break;
 
       case 'leftTopOver':
-        left = triggerRect.left;
-        top = triggerRect.top;
+        left = triggerRect.left - SPACING;
+        top = triggerRect.top - SPACING;
         break;
 
       case 'rightTopOver':
-        left = triggerRect.right;
-        top = triggerRect.top;
+        left = triggerRect.right + SPACING;
+        top = triggerRect.top - SPACING;
         translateX = -1;
         break;
 
       case 'leftBottomOver':
-        left = triggerRect.left;
-        top = triggerRect.bottom;
+        left = triggerRect.left - SPACING;
+        top = triggerRect.bottom + SPACING;
         translateY = -1;
         break;
 
       case 'rightBottomOver':
-        left = triggerRect.right;
-        top = triggerRect.bottom;
+        left = triggerRect.right + SPACING;
+        top = triggerRect.bottom + SPACING;
         translateX = -1;
         translateY = -1;
         break;

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

@@ -27,7 +27,7 @@ export interface BasicOnChange {
     (node: BasicTreeNodeData[] | BasicTreeNodeData, e: any): void;
     (value: BasicTreeNodeData['value'] | Array<BasicTreeNodeData['value']>, node: BasicTreeNodeData[] | BasicTreeNodeData, e: any): void;
 }
-export interface BasicTreeSelectProps extends Pick<BasicTreeProps, 'virtualize' | 'renderFullLabel' | 'renderLabel' | 'autoExpandParent' | 'className' | 'defaultExpandAll' | 'defaultExpandedKeys' | 'defaultValue' | 'disabled' | 'emptyContent' | 'expandAction' | 'expandedKeys' | 'filterTreeNode' | 'labelEllipsis' | 'leafOnly' | 'multiple' | 'onChangeWithObject' | 'showClear' | 'showFilteredOnly' | 'style' | 'treeData' | 'treeNodeFilterProp' | 'value' | 'onExpand' | 'onSearch' | 'expandAll' | 'disableStrictly' | 'aria-label' | 'checkRelation'> {
+export interface BasicTreeSelectProps extends Pick<BasicTreeProps, 'virtualize' | 'renderFullLabel' | 'renderLabel' | 'autoExpandParent' | 'className' | 'defaultExpandAll' | 'defaultExpandedKeys' | 'defaultValue' | 'disabled' | 'emptyContent' | 'expandAction' | 'expandedKeys' | 'filterTreeNode' | 'labelEllipsis' | 'leafOnly' | 'multiple' | 'onChangeWithObject' | 'showClear' | 'showFilteredOnly' | 'style' | 'treeData' | 'treeNodeFilterProp' | 'value' | 'onExpand' | 'expandAll' | 'disableStrictly' | 'aria-label' | 'checkRelation'> {
     motion?: Motion;
     mouseEnterDelay?: number;
     mouseLeaveDelay?: number;
@@ -63,6 +63,7 @@ export interface BasicTreeSelectProps extends Pick<BasicTreeProps, 'virtualize'
     renderSelectedItem?: BasicRenderSelectedItem;
     getPopupContainer?: () => HTMLElement;
     onBlur?: (e: any) => void;
+    onSearch?: (sunInput: string, filteredExpandedKeys: string[]) => void;
     onChange?: BasicOnChange;
     onFocus?: (e: any) => void;
     onVisibleChange?: (isVisible: boolean) => void;
@@ -84,7 +85,7 @@ export interface TreeSelectAdapter<P = Record<string, any>, S = Record<string, a
     rePositionDropdown: () => void;
     updateState: (states: Partial<BasicTreeSelectInnerData>) => void;
     notifySelect: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
-    notifySearch: (input: string) => void;
+    notifySearch: (input: string, filteredExpandedKeys: string[]) => void;
     cacheFlattenNodes: (bool: boolean) => void;
     openMenu: () => void;
     closeMenu: (cb?: () => void) => void;

package/lib/es/treeSelect/foundation.js

@@ -14,6 +14,7 @@ import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance
 import _Array$isArray from "@babel/runtime-corejs3/core-js-stable/array/is-array";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
 import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
+import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
 import _someInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/some";
 import _everyInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/every";
 import { strings } from '../treeSelect/constants';
@@ -159,7 +160,7 @@ export default class TreeSelectFoundation extends BaseFoundation {
     const isSearching = Boolean(inputValue);
     const treeNodeProps = {
       eventKey: key,
-      expanded: isSearching ? filteredExpandedKeys.has(key) : expandedKeys.has(key),
+      expanded: isSearching && !this._isExpandControlled() ? filteredExpandedKeys.has(key) : expandedKeys.has(key),
       selected: _includesInstanceProperty(selectedKeys).call(selectedKeys, key),
       checked: realChecked,
       halfChecked: realHalfChecked,
@@ -446,20 +447,25 @@ export default class TreeSelectFoundation extends BaseFoundation {
 
   clearInput() {
     const {
+      flattenNodes,
       expandedKeys,
       selectedKeys,
       keyEntities,
       treeData
     } = this.getStates();
+    const newExpandedKeys = new _Set(expandedKeys);
+
+    const isExpandControlled = this._isExpandControlled();
+
     const expandedOptsKeys = findAncestorKeys(selectedKeys, keyEntities);
 
-    _forEachInstanceProperty(expandedOptsKeys).call(expandedOptsKeys, item => expandedKeys.add(item));
+    _forEachInstanceProperty(expandedOptsKeys).call(expandedOptsKeys, item => newExpandedKeys.add(item));
 
-    const flattenNodes = flattenTreeData(treeData, expandedKeys);
+    const newFlattenNodes = flattenTreeData(treeData, newExpandedKeys);
 
     this._adapter.updateState({
-      expandedKeys,
-      flattenNodes,
+      expandedKeys: isExpandControlled ? expandedKeys : newExpandedKeys,
+      flattenNodes: isExpandControlled ? flattenNodes : newFlattenNodes,
       inputValue: '',
       motionKeys: new _Set([]),
       filteredKeys: new _Set([]),
@@ -473,6 +479,7 @@ export default class TreeSelectFoundation extends BaseFoundation {
     this._adapter.updateInputValue(sugInput);
 
     const {
+      flattenNodes,
       expandedKeys,
       selectedKeys,
       keyEntities,
@@ -483,17 +490,18 @@ export default class TreeSelectFoundation extends BaseFoundation {
       filterTreeNode,
       treeNodeFilterProp
     } = this.getProps();
+    const newExpandedKeys = new _Set(expandedKeys);
     let filteredOptsKeys = [];
     let expandedOptsKeys = [];
-    let flattenNodes = [];
+    let newFlattenNodes = [];
     let filteredShownKeys = new _Set([]);
 
     if (!sugInput) {
       expandedOptsKeys = findAncestorKeys(selectedKeys, keyEntities);
 
-      _forEachInstanceProperty(expandedOptsKeys).call(expandedOptsKeys, item => expandedKeys.add(item));
+      _forEachInstanceProperty(expandedOptsKeys).call(expandedOptsKeys, item => newExpandedKeys.add(item));
 
-      flattenNodes = flattenTreeData(treeData, expandedKeys);
+      newFlattenNodes = flattenTreeData(treeData, newExpandedKeys);
     } else {
       var _context3, _context4;
 
@@ -506,17 +514,19 @@ export default class TreeSelectFoundation extends BaseFoundation {
       expandedOptsKeys = findAncestorKeys(filteredOptsKeys, keyEntities, false);
       const shownChildKeys = findDescendantKeys(filteredOptsKeys, keyEntities, true);
       filteredShownKeys = new _Set([...shownChildKeys, ...expandedOptsKeys]);
-      flattenNodes = flattenTreeData(treeData, new _Set(expandedOptsKeys), showFilteredOnly && filteredShownKeys);
+      newFlattenNodes = flattenTreeData(treeData, new _Set(expandedOptsKeys), showFilteredOnly && filteredShownKeys);
     }
 
-    this._adapter.notifySearch(sugInput);
+    const newFilteredExpandedKeys = new _Set(expandedOptsKeys);
+
+    this._adapter.notifySearch(sugInput, _Array$from(newFilteredExpandedKeys));
 
     this._adapter.updateState({
-      expandedKeys,
-      flattenNodes,
+      expandedKeys: this._isExpandControlled() ? expandedKeys : newExpandedKeys,
+      flattenNodes: this._isExpandControlled() ? flattenNodes : newFlattenNodes,
       motionKeys: new _Set([]),
       filteredKeys: new _Set(filteredOptsKeys),
-      filteredExpandedKeys: new _Set(expandedOptsKeys),
+      filteredExpandedKeys: newFilteredExpandedKeys,
       filteredShownKeys
     });
   }
@@ -760,7 +770,9 @@ export default class TreeSelectFoundation extends BaseFoundation {
       return;
     }
 
-    if (isSearching) {
+    const isExpandControlled = this._isExpandControlled();
+
+    if (isSearching && !isExpandControlled) {
       this.handleNodeExpandInSearch(e, treeNode);
       return;
     }
@@ -788,7 +800,7 @@ export default class TreeSelectFoundation extends BaseFoundation {
 
     this._adapter.cacheFlattenNodes(motionType === 'hide' && this._isAnimated());
 
-    if (!this._isExpandControlled()) {
+    if (!isExpandControlled) {
       const flattenNodes = flattenTreeData(treeData, expandedKeys);
       const motionKeys = this._isAnimated() ? getMotionKeys(eventKey, expandedKeys, keyEntities) : [];
       const newState = {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.6.0",
+    "version": "2.7.1",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
@@ -8,7 +8,7 @@
     },
     "dependencies": {
         "@babel/runtime-corejs3": "^7.15.4",
-        "@douyinfe/semi-animation": "2.6.0",
+        "@douyinfe/semi-animation": "2.7.1",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "date-fns": "^2.9.0",
@@ -24,7 +24,7 @@
         "*.scss",
         "*.css"
     ],
-    "gitHead": "d3a844137fb02b81a93320eb5c183636b05a4a68",
+    "gitHead": "d0dbd6f932a74386b429dedbc32ae92d9e0af7b9",
     "devDependencies": {
         "@babel/plugin-proposal-decorators": "^7.15.8",
         "@babel/plugin-transform-runtime": "^7.15.8",

package/tooltip/foundation.ts

@@ -426,22 +426,22 @@ export default class Tooltip<P = Record<string, any>, S = Record<string, any>> e
                 translateY = -1;
                 break;
             case 'leftTopOver':
-                left = triggerRect.left;
-                top = triggerRect.top;
+                left = triggerRect.left - SPACING;
+                top = triggerRect.top - SPACING;
                 break;
             case 'rightTopOver':
-                left = triggerRect.right;
-                top = triggerRect.top;
+                left = triggerRect.right + SPACING;
+                top = triggerRect.top - SPACING;
                 translateX = -1;
                 break;
             case 'leftBottomOver':
-                left = triggerRect.left;
-                top = triggerRect.bottom;
+                left = triggerRect.left - SPACING;
+                top = triggerRect.bottom + SPACING;
                 translateY = -1;
                 break;
             case 'rightBottomOver':
-                left = triggerRect.right;
-                top = triggerRect.bottom;
+                left = triggerRect.right + SPACING;
+                top = triggerRect.bottom + SPACING;
                 translateX = -1;
                 translateY = -1;
                 break;

package/treeSelect/foundation.ts

@@ -91,7 +91,6 @@ export interface BasicTreeSelectProps extends Pick<BasicTreeProps,
 | 'treeNodeFilterProp'
 | 'value'
 | 'onExpand'
-| 'onSearch'
 | 'expandAll'
 | 'disableStrictly'
 | 'aria-label'
@@ -133,6 +132,7 @@ export interface BasicTreeSelectProps extends Pick<BasicTreeProps,
     getPopupContainer?: () => HTMLElement;
     // triggerRender?: (props: BasicTriggerRenderProps) => any;
     onBlur?: (e: any) => void;
+    onSearch?: (sunInput: string, filteredExpandedKeys: string[]) => void;
     onChange?: BasicOnChange;
     onFocus?: (e: any) => void;
     onVisibleChange?: (isVisible: boolean) => void;
@@ -175,7 +175,7 @@ export interface TreeSelectAdapter<P = Record<string, any>, S = Record<string, a
     rePositionDropdown: () => void;
     updateState: (states: Partial<BasicTreeSelectInnerData>) => void;
     notifySelect: (selectedKeys: string, selected: boolean, selectedNode: BasicTreeNodeData) => void;
-    notifySearch: (input: string) => void;
+    notifySearch: (input: string, filteredExpandedKeys: string[]) => void;
     cacheFlattenNodes: (bool: boolean) => void;
     openMenu: () => void;
     closeMenu: (cb?: () => void) => void;
@@ -302,7 +302,9 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
         const isSearching = Boolean(inputValue);
         const treeNodeProps: BasicTreeNodeProps = {
             eventKey: key,
-            expanded: isSearching ? filteredExpandedKeys.has(key) : expandedKeys.has(key),
+            expanded: isSearching && !this._isExpandControlled()
+                ? filteredExpandedKeys.has(key)
+                : expandedKeys.has(key),
             selected: selectedKeys.includes(key),
             checked: realChecked,
             halfChecked: realHalfChecked,
@@ -515,14 +517,16 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
     }
 
     clearInput() {
-        const { expandedKeys, selectedKeys, keyEntities, treeData } = this.getStates();
+        const { flattenNodes, expandedKeys, selectedKeys, keyEntities, treeData } = this.getStates();
+        const newExpandedKeys: Set<string> = new Set(expandedKeys);
+        const isExpandControlled = this._isExpandControlled();
         const expandedOptsKeys = findAncestorKeys(selectedKeys, keyEntities);
-        expandedOptsKeys.forEach(item => expandedKeys.add(item));
-        const flattenNodes = flattenTreeData(treeData, expandedKeys);
+        expandedOptsKeys.forEach(item => newExpandedKeys.add(item));
+        const newFlattenNodes = flattenTreeData(treeData, newExpandedKeys);
 
         this._adapter.updateState({
-            expandedKeys,
-            flattenNodes,
+            expandedKeys: isExpandControlled ? expandedKeys : newExpandedKeys,
+            flattenNodes: isExpandControlled ? flattenNodes : newFlattenNodes,
             inputValue: '',
             motionKeys: new Set([]),
             filteredKeys: new Set([]),
@@ -534,16 +538,17 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
     handleInputChange(sugInput: string) {
         // Input is used as controlled component
         this._adapter.updateInputValue(sugInput);
-        const { expandedKeys, selectedKeys, keyEntities, treeData } = this.getStates();
+        const { flattenNodes, expandedKeys, selectedKeys, keyEntities, treeData } = this.getStates();
         const { showFilteredOnly, filterTreeNode, treeNodeFilterProp } = this.getProps();
+        const newExpandedKeys: Set<string> = new Set(expandedKeys);
         let filteredOptsKeys: string[] = [];
         let expandedOptsKeys = [];
-        let flattenNodes = [];
+        let newFlattenNodes = [];
         let filteredShownKeys = new Set([]);
         if (!sugInput) {
             expandedOptsKeys = findAncestorKeys(selectedKeys, keyEntities);
-            expandedOptsKeys.forEach(item => expandedKeys.add(item));
-            flattenNodes = flattenTreeData(treeData, expandedKeys);
+            expandedOptsKeys.forEach(item => newExpandedKeys.add(item));
+            newFlattenNodes = flattenTreeData(treeData, newExpandedKeys);
         } else {
             filteredOptsKeys = Object.values(keyEntities)
                 .filter((item: BasicKeyEntity) => {
@@ -554,15 +559,16 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
             expandedOptsKeys = findAncestorKeys(filteredOptsKeys, keyEntities, false);
             const shownChildKeys = findDescendantKeys(filteredOptsKeys, keyEntities, true);
             filteredShownKeys = new Set([...shownChildKeys, ...expandedOptsKeys]);
-            flattenNodes = flattenTreeData(treeData, new Set(expandedOptsKeys), showFilteredOnly && filteredShownKeys);
+            newFlattenNodes = flattenTreeData(treeData, new Set(expandedOptsKeys), showFilteredOnly && filteredShownKeys);
         }
-        this._adapter.notifySearch(sugInput);
+        const newFilteredExpandedKeys = new Set(expandedOptsKeys);
+        this._adapter.notifySearch(sugInput, Array.from(newFilteredExpandedKeys));
         this._adapter.updateState({
-            expandedKeys,
-            flattenNodes,
+            expandedKeys: this._isExpandControlled() ? expandedKeys : newExpandedKeys,
+            flattenNodes: this._isExpandControlled() ? flattenNodes : newFlattenNodes,
             motionKeys: new Set([]),
             filteredKeys: new Set(filteredOptsKeys),
-            filteredExpandedKeys: new Set(expandedOptsKeys),
+            filteredExpandedKeys: newFilteredExpandedKeys,
             filteredShownKeys,
         });
     }
@@ -724,7 +730,8 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
             return;
         }
 
-        if (isSearching) {
+        const isExpandControlled = this._isExpandControlled();
+        if (isSearching && !isExpandControlled) {
             this.handleNodeExpandInSearch(e, treeNode);
             return;
         }
@@ -742,7 +749,7 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
         }
         this._adapter.cacheFlattenNodes(motionType === 'hide' && this._isAnimated());
 
-        if (!this._isExpandControlled()) {
+        if (!isExpandControlled) {
             const flattenNodes = flattenTreeData(treeData, expandedKeys);
             const motionKeys = this._isAnimated() ? getMotionKeys(eventKey, expandedKeys, keyEntities) : [];
             const newState = {