@douyinfe/semi-foundation 2.24.2 → 2.25.0-alpha.0

package/lib/es/treeSelect/foundation.js

@@ -1,6 +1,5 @@
 import _difference from "lodash/difference";
 import _isEmpty from "lodash/isEmpty";
-import _cloneDeep from "lodash/cloneDeep";
 import _isString from "lodash/isString";
 import _isUndefined from "lodash/isUndefined";
 import _get from "lodash/get";
@@ -8,14 +7,24 @@ import _isFunction from "lodash/isFunction";
 import _isNumber from "lodash/isNumber";
 import { strings } from '../treeSelect/constants';
 import BaseFoundation from '../base/foundation';
-import { flattenTreeData, findDescendantKeys, findAncestorKeys, filter, normalizedArr, normalizeKeyList, getMotionKeys, calcCheckedKeysForChecked, calcCheckedKeys, calcCheckedKeysForUnchecked, getValueOrKey } from '../tree/treeUtil';
-import isEnterPress from '../utils/isEnterPress'; // eslint-disable-next-line max-len
-
+import { flattenTreeData, findDescendantKeys, findAncestorKeys, filter, normalizeKeyList, getMotionKeys, calcCheckedKeysForChecked, calcCheckedKeys, calcCheckedKeysForUnchecked, getValueOrKey } from '../tree/treeUtil';
+import isEnterPress from '../utils/isEnterPress';
 export default class TreeSelectFoundation extends BaseFoundation {
   constructor(adapter) {
     super(Object.assign({}, adapter));
+    this._registerClickOutsideHandler = e => {
+      this._adapter.registerClickOutsideHandler(e => {
+        this.handlerTriggerBlur(e);
+        this.close(e);
+      });
+    };
+    this.clearInputValue = () => {
+      const {
+        inputValue
+      } = this.getStates();
+      inputValue && this._adapter.updateInputValue('');
+    };
   }
-
   init() {
     const {
       searchAutoFocus,
@@ -24,28 +33,25 @@ export default class TreeSelectFoundation extends BaseFoundation {
     } = this.getProps();
     const triggerSearch = searchPosition === strings.SEARCH_POSITION_TRIGGER && filterTreeNode;
     const triggerSearchAutoFocus = searchAutoFocus && triggerSearch;
-
     this._setDropdownWidth();
-
     const isOpen = (this.getProp('defaultOpen') || triggerSearchAutoFocus) && !this._isDisabled();
-
     if (isOpen) {
       this.open();
     }
+    if (triggerSearchAutoFocus) {
+      this.handleTriggerFocus(null);
+    }
   }
-
   destroy() {
     // Ensure that event monitoring will be uninstalled, and the user may not trigger closePanel
     this._adapter.unregisterClickOutsideHandler();
   }
-
   _setDropdownWidth() {
     const {
       style,
       dropdownMatchSelectWidth
     } = this.getProps();
     let width;
-
     if (dropdownMatchSelectWidth) {
       if (style && _isNumber(style.width)) {
         width = style.width;
@@ -54,36 +60,28 @@ export default class TreeSelectFoundation extends BaseFoundation {
       } else {
         width = this._adapter.getTriggerWidth();
       }
-
       this._adapter.setOptionWrapperWidth(width);
     }
   }
-
   _isMultiple() {
     return this.getProp('multiple');
   }
-
   _isAnimated() {
     return this.getProp('motionExpand');
   }
-
   _isDisabled() {
     let treeNode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     return this.getProp('disabled') || treeNode.disabled;
   }
-
   _isExpandControlled() {
     return this.getProp('expandedKeys');
   }
-
   _isSelectToClose() {
     return !this.getProp('expandAction');
   }
-
   _isLoadControlled() {
     return this.getProp('loadedKeys');
   }
-
   _showFilteredOnly() {
     const {
       inputValue
@@ -93,15 +91,46 @@ export default class TreeSelectFoundation extends BaseFoundation {
     } = this.getProps();
     return Boolean(inputValue) && showFilteredOnly;
   }
-
-  getCopyFromState(items) {
-    const res = {};
-    normalizedArr(items).forEach(key => {
-      res[key] = _cloneDeep(this.getState(key));
+  findDataForValue(findValue) {
+    const {
+      value,
+      defaultValue,
+      keyMaps
+    } = this.getProps();
+    const realValueName = _get(keyMaps, 'value', 'value');
+    const realKeyName = _get(keyMaps, 'key', 'key');
+    let valueArr = [];
+    if (value) {
+      valueArr = Array.isArray(value) ? value : [value];
+    } else if (defaultValue) {
+      valueArr = Array.isArray(defaultValue) ? defaultValue : [defaultValue];
+    }
+    return valueArr.find(item => {
+      return item[realValueName] === findValue || item[realKeyName] === findValue;
     });
-    return res;
   }
-
+  constructDataForValue(value) {
+    const {
+      treeNodeLabelProp,
+      keyMaps
+    } = this.getProps();
+    const keyName = _get(keyMaps, 'key', 'key');
+    const labelName = _get(keyMaps, 'label', treeNodeLabelProp);
+    return {
+      [keyName]: value,
+      [labelName]: value
+    };
+  }
+  getDataForKeyNotInKeyEntities(value) {
+    const {
+      onChangeWithObject
+    } = this.getProps();
+    if (onChangeWithObject) {
+      return this.findDataForValue(value);
+    } else {
+      return this.constructDataForValue(value);
+    }
+  }
   getTreeNodeProps(key) {
     const {
       expandedKeys = new Set([]),
@@ -123,15 +152,12 @@ export default class TreeSelectFoundation extends BaseFoundation {
     } = this.getProps();
     const entity = keyEntities[key];
     const notExist = !entity;
-
     if (notExist) {
       return null;
-    } // if checkRelation is invalid, the checked status of node will be false
-
-
+    }
+    // if checkRelation is invalid, the checked status of node will be false
     let realChecked = false;
     let realHalfChecked = false;
-
     if (checkRelation === 'related') {
       realChecked = checkedKeys.has(key);
       realHalfChecked = halfCheckedKeys.has(key);
@@ -139,11 +165,10 @@ export default class TreeSelectFoundation extends BaseFoundation {
       realChecked = realCheckedKeys.has(key);
       realHalfChecked = false;
     }
-
     const isSearching = Boolean(inputValue);
     const treeNodeProps = {
       eventKey: key,
-      expanded: isSearching && !this._isExpandControlled() ? filteredExpandedKeys.has(key) : expandedKeys.has(key),
+      expanded: isSearching ? filteredExpandedKeys.has(key) : expandedKeys.has(key),
       selected: selectedKeys.includes(key),
       checked: realChecked,
       halfChecked: realHalfChecked,
@@ -155,14 +180,11 @@ export default class TreeSelectFoundation extends BaseFoundation {
       loading: loadingKeys.has(key) && !loadedKeys.has(key),
       loaded: loadedKeys.has(key)
     };
-
     if (this.getProp('disableStrictly') && disabledKeys.has(key)) {
       treeNodeProps.disabled = true;
     }
-
     return treeNodeProps;
   }
-
   handleNodeLoad(loadedKeys, loadingKeys, data, resolve) {
     const {
       loadData
@@ -170,32 +192,24 @@ export default class TreeSelectFoundation extends BaseFoundation {
     const {
       key
     } = data;
-
     if (!loadData || loadedKeys.has(key) || loadingKeys.has(key)) {
       return {};
     }
-
     loadData(data).then(() => {
-      const {
-        loadedKeys: prevLoadedKeys,
-        loadingKeys: prevLoadingKeys
-      } = this.getCopyFromState(['loadedKeys', 'loadingKeys']);
+      const prevLoadedKeys = new Set(this.getState('loadedKeys'));
+      const prevLoadingKeys = new Set(this.getState('loadingKeys'));
       const newLoadedKeys = prevLoadedKeys.add(key);
       const newLoadingKeys = new Set([...prevLoadingKeys]);
       newLoadingKeys.delete(key);
-
       this._adapter.notifyLoad(newLoadedKeys, data);
-
       if (!this._isLoadControlled()) {
         this._adapter.updateState({
           loadedKeys: newLoadedKeys
         });
       }
-
       this._adapter.setState({
         loadingKeys: newLoadingKeys
       });
-
       resolve();
     });
     return {
@@ -203,138 +217,124 @@ export default class TreeSelectFoundation extends BaseFoundation {
     };
   }
   /* istanbul ignore next */
-
-
   focusInput(bool) {
     this._adapter.updateInputFocus(bool);
   }
-
   _notifyMultipleChange(key, e) {
     const {
       keyEntities
     } = this.getStates();
     const {
       leafOnly,
-      checkRelation
+      checkRelation,
+      keyMaps
     } = this.getProps();
     let keyList = [];
-
     if (checkRelation === 'related') {
-      keyList = normalizeKeyList(key, keyEntities, leafOnly);
+      keyList = normalizeKeyList(key, keyEntities, leafOnly, true);
     } else if (checkRelation === 'unRelated') {
       keyList = key;
     }
-
-    const nodes = keyList.map(i => keyEntities[i].data);
-
+    const nodes = keyList.map(key => keyEntities[key] && keyEntities[key].key === key ? keyEntities[key].data : this.getDataForKeyNotInKeyEntities(key));
     if (this.getProp('onChangeWithObject')) {
       this._adapter.notifyChangeWithObject(nodes, e);
     } else {
-      const value = getValueOrKey(nodes);
-
+      const value = getValueOrKey(nodes, keyMaps);
       this._adapter.notifyChange(value, nodes, e);
     }
   }
-
   _notifyChange(key, e) {
     const {
       keyEntities
     } = this.getStates();
-
+    const {
+      keyMaps
+    } = this.getProps();
     if (this._isMultiple() && Array.isArray(key)) {
       this._notifyMultipleChange(key, e);
     } else {
       const nodes = _isUndefined(key) ? key : keyEntities[key].data;
-      const value = _isUndefined(key) ? key : getValueOrKey(nodes);
-
+      const value = _isUndefined(key) ? key : getValueOrKey(nodes, keyMaps);
       if (this.getProp('onChangeWithObject')) {
         this._adapter.notifyChangeWithObject(nodes, e);
       } else {
         this._adapter.notifyChange(value, nodes, e);
       }
     }
-  } // Scenes that may trigger focus:
+  }
+  // Scenes that may trigger focus:
   //  1、click selection
-
-
   _notifyFocus(e) {
     this._adapter.notifyFocus(e);
-  } // Scenes that may trigger blur
+  }
+  handleTriggerFocus(e) {
+    this._adapter.updateIsFocus(true);
+    this._notifyFocus(e);
+    this._registerClickOutsideHandler(e);
+  }
+  // Scenes that may trigger blur
   //  1、clickOutSide
   //  2、click option / press enter, and then select complete（when multiple is false
   //  3、press esc when dropdown list open
-
-
   _notifyBlur(e) {
     this._adapter.notifyBlur(e);
   }
-
+  handlerTriggerBlur(e) {
+    this._adapter.updateIsFocus(false);
+    this._notifyBlur(e);
+    this._adapter.unregisterClickOutsideHandler();
+  }
   toggleHoverState(bool) {
     this._adapter.toggleHovering(bool);
   }
-
   open() {
     this._adapter.openMenu();
-
     this._setDropdownWidth();
-
-    this._adapter.registerClickOutsideHandler(e => {
-      this.close(e);
-    });
   }
-
   close(e) {
     this._adapter.closeMenu();
-
-    this._adapter.unregisterClickOutsideHandler();
-
-    this._notifyBlur(e);
-
     if (this.getProp('motionExpand')) {
       this._adapter.updateState({
         motionKeys: new Set([])
       });
     }
   }
-
   handleClick(e) {
     const isDisabled = this._isDisabled();
-
     const {
       isOpen,
-      inputValue
+      inputValue,
+      isFocus
     } = this.getStates();
     const {
-      searchPosition
+      searchPosition,
+      clickTriggerToHide
     } = this.getProps();
-
     if (isDisabled) {
       return;
-    } else if (!isOpen) {
-      this.open();
-
-      this._notifyFocus(e);
-    } else if (isOpen) {
-      if (searchPosition === 'trigger' && inputValue) {
-        return;
+    } else {
+      if (!isFocus) {
+        this.handleTriggerFocus(e);
+      }
+      if (isOpen) {
+        if (searchPosition === 'trigger' && inputValue) {
+          return;
+        }
+        clickTriggerToHide && this.close(e);
+      } else {
+        this.open();
       }
-
-      this.close(e);
     }
   }
   /**
    * A11y: simulate selection click
    */
-
   /* istanbul ignore next */
-
-
   handleSelectionEnterPress(e) {
     if (isEnterPress(e)) {
       this.handleClick(e);
     }
   }
-
   handleClear(e) {
     const {
       searchPosition,
@@ -344,28 +344,21 @@ export default class TreeSelectFoundation extends BaseFoundation {
       inputValue,
       selectedKeys
     } = this.getStates();
-
     const isMultiple = this._isMultiple();
-
     const isControlled = this._isControlledComponent();
-
     const value = isMultiple ? [] : undefined;
-
     this._notifyChange(value, e);
-
     if (!isControlled) {
       // reposition dropdown when selected values change
       this._adapter.rePositionDropdown();
-
       this._adapter.updateState({
         selectedKeys: [],
         checkedKeys: new Set(),
         halfCheckedKeys: new Set(),
         realCheckedKeys: new Set([])
       });
-    } // When triggerSearch, clicking the clear button will trigger to clear Input
-
-
+    }
+    // When triggerSearch, clicking the clear button will trigger to clear Input
     if (filterTreeNode && searchPosition === strings.SEARCH_POSITION_TRIGGER) {
       if (inputValue !== '') {
         if (_isEmpty(selectedKeys)) {
@@ -375,47 +368,41 @@ export default class TreeSelectFoundation extends BaseFoundation {
         }
       }
     }
+    this._adapter.notifyClear(e);
   }
   /**
    * A11y: simulate clear button click
    */
-
   /* istanbul ignore next */
-
-
   handleClearEnterPress(e) {
     if (isEnterPress(e)) {
       this.handleClear(e);
     }
   }
-
   removeTag(eventKey) {
     const {
       disableStrictly,
-      checkRelation
+      checkRelation,
+      keyMaps
     } = this.getProps();
     const {
       keyEntities,
       disabledKeys,
       realCheckedKeys
     } = this.getStates();
-    const item = keyEntities[eventKey].data;
-
-    if (item.disabled || disableStrictly && disabledKeys.has(eventKey)) {
+    const item = keyEntities[eventKey] && keyEntities[eventKey].key === eventKey ? keyEntities[eventKey].data : this.getDataForKeyNotInKeyEntities(eventKey);
+    const disabledName = _get(keyMaps, 'disabled', 'disabled');
+    if (item[disabledName] || disableStrictly && disabledKeys.has(eventKey)) {
       return;
     }
-
     if (checkRelation === 'unRelated') {
       const newRealCheckedKeys = new Set(realCheckedKeys);
       newRealCheckedKeys.delete(eventKey);
-
       this._notifyChange([...newRealCheckedKeys], null);
-
       if (!this._isControlledComponent()) {
         this._adapter.updateState({
           realCheckedKeys: newRealCheckedKeys
         });
-
         this._adapter.rePositionDropdown();
       }
     } else if (checkRelation === 'related') {
@@ -423,25 +410,19 @@ export default class TreeSelectFoundation extends BaseFoundation {
         checkedKeys,
         halfCheckedKeys
       } = this.calcCheckedKeys(eventKey, false);
-
       this._notifyChange([...checkedKeys], null);
-
       if (!this._isControlledComponent()) {
         this._adapter.updateState({
           checkedKeys,
           halfCheckedKeys
         });
-
         this._adapter.rePositionDropdown();
       }
     }
-
-    this._adapter.notifySelect(eventKey, false, item); // reposition dropdown when selected values change
-
-
+    this._adapter.notifySelect(eventKey, false, item);
+    // reposition dropdown when selected values change
     this._adapter.rePositionDropdown();
   }
-
   clearInput() {
     const {
       flattenNodes,
@@ -450,17 +431,17 @@ export default class TreeSelectFoundation extends BaseFoundation {
       keyEntities,
       treeData
     } = this.getStates();
+    const {
+      keyMaps
+    } = this.getProps();
     const newExpandedKeys = new Set(expandedKeys);
-
     const isExpandControlled = this._isExpandControlled();
-
     const expandedOptsKeys = findAncestorKeys(selectedKeys, keyEntities);
     expandedOptsKeys.forEach(item => newExpandedKeys.add(item));
-    const newFlattenNodes = flattenTreeData(treeData, newExpandedKeys);
-
+    const newFlattenNodes = flattenTreeData(treeData, newExpandedKeys, keyMaps);
     this._adapter.updateState({
-      expandedKeys: isExpandControlled ? expandedKeys : newExpandedKeys,
-      flattenNodes: isExpandControlled ? flattenNodes : newFlattenNodes,
+      expandedKeys: newExpandedKeys,
+      flattenNodes: newFlattenNodes,
       inputValue: '',
       motionKeys: new Set([]),
       filteredKeys: new Set([]),
@@ -468,11 +449,9 @@ export default class TreeSelectFoundation extends BaseFoundation {
       filteredShownKeys: new Set([])
     });
   }
-
   handleInputChange(sugInput) {
     // Input is used as controlled component
     this._adapter.updateInputValue(sugInput);
-
     const {
       flattenNodes,
       expandedKeys,
@@ -483,63 +462,55 @@ export default class TreeSelectFoundation extends BaseFoundation {
     const {
       showFilteredOnly,
       filterTreeNode,
-      treeNodeFilterProp
+      treeNodeFilterProp,
+      keyMaps
     } = this.getProps();
+    const realFilterProp = treeNodeFilterProp !== 'label' ? treeNodeFilterProp : _get(keyMaps, 'label', 'label');
     const newExpandedKeys = new Set(expandedKeys);
     let filteredOptsKeys = [];
     let expandedOptsKeys = [];
     let newFlattenNodes = [];
     let filteredShownKeys = new Set([]);
-
     if (!sugInput) {
       expandedOptsKeys = findAncestorKeys(selectedKeys, keyEntities);
       expandedOptsKeys.forEach(item => newExpandedKeys.add(item));
-      newFlattenNodes = flattenTreeData(treeData, newExpandedKeys);
+      newFlattenNodes = flattenTreeData(treeData, newExpandedKeys, keyMaps);
     } else {
       filteredOptsKeys = Object.values(keyEntities).filter(item => {
         const {
           data
         } = item;
-        return filter(sugInput, data, filterTreeNode, treeNodeFilterProp);
+        return filter(sugInput, data, filterTreeNode, realFilterProp);
       }).map(item => item.key);
       expandedOptsKeys = findAncestorKeys(filteredOptsKeys, keyEntities, false);
       const shownChildKeys = findDescendantKeys(filteredOptsKeys, keyEntities, true);
       filteredShownKeys = new Set([...shownChildKeys, ...expandedOptsKeys]);
-      newFlattenNodes = flattenTreeData(treeData, new Set(expandedOptsKeys), showFilteredOnly && filteredShownKeys);
+      newFlattenNodes = flattenTreeData(treeData, new Set(expandedOptsKeys), keyMaps, showFilteredOnly && filteredShownKeys);
     }
-
     const newFilteredExpandedKeys = new Set(expandedOptsKeys);
-
     this._adapter.notifySearch(sugInput, Array.from(newFilteredExpandedKeys));
-
     this._adapter.updateState({
-      expandedKeys: this._isExpandControlled() ? expandedKeys : newExpandedKeys,
-      flattenNodes: this._isExpandControlled() ? flattenNodes : newFlattenNodes,
+      expandedKeys: newExpandedKeys,
+      flattenNodes: newFlattenNodes,
       motionKeys: new Set([]),
       filteredKeys: new Set(filteredOptsKeys),
       filteredExpandedKeys: newFilteredExpandedKeys,
       filteredShownKeys
     });
   }
-
   handleNodeSelect(e, treeNode) {
     const isDisabled = this._isDisabled(treeNode);
-
     if (isDisabled) {
       return;
     }
-
     if (!this._isMultiple()) {
       this.handleSingleSelect(e, treeNode);
     } else {
       this.handleMultipleSelect(e, treeNode);
     }
   }
-
   handleSingleSelect(e, treeNode) {
-    let {
-      selectedKeys
-    } = this.getCopyFromState('selectedKeys');
+    let selectedKeys = [...this.getState('selectedKeys')];
     const {
       clickToHide
     } = this.getProps();
@@ -548,42 +519,33 @@ export default class TreeSelectFoundation extends BaseFoundation {
       eventKey,
       data
     } = treeNode;
-
     this._adapter.notifySelect(eventKey, true, data);
-
     if (!selectedKeys.includes(eventKey) && !selected) {
       selectedKeys = [eventKey];
-
       this._notifyChange(eventKey, e);
-
       if (!this._isControlledComponent()) {
         this._adapter.updateState({
           selectedKeys
         });
       }
     }
-
     if (clickToHide && (this._isSelectToClose() || !data.children)) {
       this.close(e);
+      this.handlerTriggerBlur(e);
     }
   }
-
   calcCheckedKeys(eventKey, targetStatus) {
     const {
       keyEntities
     } = this.getStates();
-    const {
-      checkedKeys,
-      halfCheckedKeys
-    } = this.getCopyFromState(['checkedKeys', 'halfCheckedKeys']);
-
+    const checkedKeys = new Set(this.getState('checkedKeys'));
+    const halfCheckedKeys = new Set(this.getState('halfCheckedKeys'));
     if (targetStatus) {
       return calcCheckedKeysForChecked(eventKey, keyEntities, checkedKeys, halfCheckedKeys);
     } else {
       return calcCheckedKeysForUnchecked(eventKey, keyEntities, checkedKeys, halfCheckedKeys);
     }
   }
-
   handleMultipleSelect(e, treeNode) {
     const {
       searchPosition,
@@ -599,30 +561,24 @@ export default class TreeSelectFoundation extends BaseFoundation {
       eventKey,
       data
     } = treeNode;
-
     if (checkRelation === 'related') {
       const targetStatus = disableStrictly ? this.calcCheckedStatus(!checked, eventKey) : !checked;
       const {
         checkedKeys,
         halfCheckedKeys
       } = disableStrictly ? this.calcNonDisabledCheckedKeys(eventKey, targetStatus) : this.calcCheckedKeys(eventKey, targetStatus);
-
       this._adapter.notifySelect(eventKey, targetStatus, data);
-
       this._notifyChange([...checkedKeys], e);
-
       if (!this._isControlledComponent()) {
         this._adapter.updateState({
           checkedKeys,
           halfCheckedKeys
         });
-
         this._adapter.rePositionDropdown();
       }
     } else if (checkRelation === 'unRelated') {
       const newRealCheckedKeys = new Set(realCheckedKeys);
       let targetStatus;
-
       if (realCheckedKeys.has(eventKey)) {
         newRealCheckedKeys.delete(eventKey);
         targetStatus = false;
@@ -630,52 +586,40 @@ export default class TreeSelectFoundation extends BaseFoundation {
         newRealCheckedKeys.add(eventKey);
         targetStatus = true;
       }
-
       this._adapter.notifySelect(eventKey, targetStatus, data);
-
       this._notifyChange([...newRealCheckedKeys], e);
-
       if (!this._isControlledComponent()) {
         this._adapter.updateState({
           realCheckedKeys: newRealCheckedKeys
         });
-
         this._adapter.rePositionDropdown();
       }
     }
-
     if (searchPosition === strings.SEARCH_POSITION_TRIGGER && inputValue !== '') {
       this._adapter.updateState({
         inputValue: ''
       });
     }
   }
-
   calcNonDisabledCheckedKeys(eventKey, targetStatus) {
     const {
       keyEntities,
       disabledKeys
     } = this.getStates();
-    const {
-      checkedKeys
-    } = this.getCopyFromState(['checkedKeys']);
+    const checkedKeys = new Set(this.getState('checkedKeys'));
     const descendantKeys = normalizeKeyList(findDescendantKeys([eventKey], keyEntities, false), keyEntities, true);
     const hasDisabled = descendantKeys.some(key => disabledKeys.has(key));
-
     if (!hasDisabled) {
       return this.calcCheckedKeys(eventKey, targetStatus);
     }
-
     const nonDisabled = descendantKeys.filter(key => !disabledKeys.has(key));
-    const newCheckedKeys = targetStatus ? [...nonDisabled, ...checkedKeys] : _difference(normalizeKeyList([...checkedKeys], keyEntities, true), nonDisabled);
+    const newCheckedKeys = targetStatus ? [...nonDisabled, ...checkedKeys] : _difference(normalizeKeyList([...checkedKeys], keyEntities, true, true), nonDisabled);
     return calcCheckedKeys(newCheckedKeys, keyEntities);
   }
-
   calcCheckedStatus(targetStatus, eventKey) {
     if (!targetStatus) {
       return targetStatus;
     }
-
     const {
       checkedKeys,
       keyEntities,
@@ -683,49 +627,41 @@ export default class TreeSelectFoundation extends BaseFoundation {
     } = this.getStates();
     const descendantKeys = normalizeKeyList(findDescendantKeys([eventKey], keyEntities, false), keyEntities, true);
     const hasDisabled = descendantKeys.some(key => disabledKeys.has(key));
-
     if (!hasDisabled) {
       return targetStatus;
     }
-
     const nonDisabledKeys = descendantKeys.filter(key => !disabledKeys.has(key));
     const allChecked = nonDisabledKeys.every(key => checkedKeys.has(key));
     return !allChecked;
   }
-
   handleNodeExpandInSearch(e, treeNode) {
     const {
       treeData,
       filteredShownKeys,
-      keyEntities
+      keyEntities,
+      keyMaps
     } = this.getStates();
-
-    const showFilteredOnly = this._showFilteredOnly(); // clone otherwise will be modified unexpectedly
-
-
-    const {
-      filteredExpandedKeys
-    } = this.getCopyFromState('filteredExpandedKeys');
+    const showFilteredOnly = this._showFilteredOnly();
+    // clone otherwise will be modified unexpectedly
+    const filteredExpandedKeys = new Set(this.getState('filteredExpandedKeys'));
     let motionType = 'show';
     const {
       eventKey,
       expanded,
       data
-    } = treeNode; // debugger;
-
+    } = treeNode;
+    // debugger;
     if (!expanded) {
       filteredExpandedKeys.add(eventKey);
     } else if (filteredExpandedKeys.has(eventKey)) {
       filteredExpandedKeys.delete(eventKey);
       motionType = 'hide';
-    } // cache prev flattenNodes, otherwise the calculation will remove hidden items
-
-
+    }
+    // cache prev flattenNodes, otherwise the calculation will remove hidden items
     this._adapter.cacheFlattenNodes(motionType === 'hide' && this._isAnimated());
-
     if (!this._isExpandControlled()) {
       // debugger;
-      const flattenNodes = flattenTreeData(treeData, filteredExpandedKeys, showFilteredOnly && filteredShownKeys);
+      const flattenNodes = flattenTreeData(treeData, filteredExpandedKeys, keyMaps, showFilteredOnly && filteredShownKeys);
       const motionKeys = this._isAnimated() ? getMotionKeys(eventKey, filteredExpandedKeys, keyEntities) : [];
       const newState = {
         filteredExpandedKeys,
@@ -733,64 +669,53 @@ export default class TreeSelectFoundation extends BaseFoundation {
         motionKeys: new Set(motionKeys),
         motionType
       };
-
       this._adapter.updateState(newState);
     }
-
     this._adapter.notifyExpand(filteredExpandedKeys, {
       expanded: !expanded,
       node: data
     });
   }
-
   handleNodeExpand(e, treeNode) {
     // debugger;
     const {
-      loadData
+      loadData,
+      keyMaps
     } = this.getProps();
     const {
       inputValue,
       keyEntities
     } = this.getStates();
     const isSearching = Boolean(inputValue);
-
     if (!loadData && (!treeNode.children || !treeNode.children.length)) {
       return;
     }
-
     const isExpandControlled = this._isExpandControlled();
-
-    if (isSearching && !isExpandControlled) {
+    if (isSearching) {
       this.handleNodeExpandInSearch(e, treeNode);
       return;
     }
-
     const {
       treeData
-    } = this.getStates(); // clone otherwise will be modified unexpectedly
-
-    const {
-      expandedKeys
-    } = this.getCopyFromState('expandedKeys');
+    } = this.getStates();
+    // clone otherwise will be modified unexpectedly
+    const expandedKeys = new Set(this.getState('expandedKeys'));
     let motionType = 'show';
     const {
       eventKey,
       expanded,
       data
     } = treeNode;
-
     if (!expanded) {
       expandedKeys.add(eventKey);
     } else if (expandedKeys.has(eventKey)) {
       expandedKeys.delete(eventKey);
       motionType = 'hide';
     }
-
     this._adapter.cacheFlattenNodes(motionType === 'hide' && this._isAnimated());
-
     if (!isExpandControlled) {
       // debugger;
-      const flattenNodes = flattenTreeData(treeData, expandedKeys);
+      const flattenNodes = flattenTreeData(treeData, expandedKeys, keyMaps);
       const motionKeys = this._isAnimated() ? getMotionKeys(eventKey, expandedKeys, keyEntities) : [];
       const newState = {
         expandedKeys,
@@ -798,10 +723,8 @@ export default class TreeSelectFoundation extends BaseFoundation {
         motionKeys: new Set(motionKeys),
         motionType
       };
-
       this._adapter.updateState(newState);
     }
-
     this._adapter.notifyExpand(expandedKeys, {
       expanded: !expanded,
       node: data
@@ -810,27 +733,29 @@ export default class TreeSelectFoundation extends BaseFoundation {
   /**
    * The selected items that need to be displayed in the search box when obtaining a single selection
    */
-
-
   getRenderTextInSingle() {
     const {
       renderSelectedItem: propRenderSelectedItem,
-      treeNodeLabelProp
+      treeNodeLabelProp,
+      keyMaps
     } = this.getProps();
     const {
       selectedKeys,
       keyEntities
     } = this.getStates();
-    const renderSelectedItem = _isFunction(propRenderSelectedItem) ? propRenderSelectedItem : item => _get(item, treeNodeLabelProp, null);
-    const item = selectedKeys.length && keyEntities[selectedKeys[0]] ? keyEntities[selectedKeys[0]].data : undefined;
-    const renderText = item && treeNodeLabelProp in item ? renderSelectedItem(item) : null;
+    const realLabelName = _get(keyMaps, 'label', treeNodeLabelProp);
+    const renderSelectedItem = _isFunction(propRenderSelectedItem) ? propRenderSelectedItem : item => _get(item, realLabelName, null);
+    let item;
+    if (selectedKeys.length) {
+      const key = selectedKeys[0];
+      item = keyEntities[key] && keyEntities[key].key === key ? keyEntities[key].data : this.getDataForKeyNotInKeyEntities(key);
+    }
+    const renderText = item ? renderSelectedItem(item) : null;
     return renderText;
   }
   /**
    * When the search box is on the trigger, the blur event handling method
    */
-
-
   handleInputTriggerBlur() {
     this._adapter.updateState({
       inputTriggerFocus: false
@@ -839,18 +764,13 @@ export default class TreeSelectFoundation extends BaseFoundation {
   /**
    * When the search box is on the trigger, the focus event processing method
    */
-
-
   handleInputTriggerFocus() {
     this.clearInput();
-
     this._adapter.updateState({
       inputTriggerFocus: true
     });
   }
-
   setLoadKeys(data, resolve) {
     this._adapter.updateLoadKeys(data, resolve);
   }
-
 }