@douyinfe/semi-foundation 2.46.1 → 2.47.0-beta.0

package/lib/es/tree/treeUtil.js

@@ -1,3 +1,4 @@
+import _omit from "lodash/omit";
 import _get from "lodash/get";
 import _pick from "lodash/pick";
 import _isEmpty from "lodash/isEmpty";
@@ -25,17 +26,27 @@ function isValid(val) {
  * @param filteredShownKeys
  * need expanded keys, provides `true` means all expanded
  */
-export function flattenTreeData(treeNodeList, expandedKeys) {
-  let filteredShownKeys = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+export function flattenTreeData(treeNodeList, expandedKeys, keyMaps) {
+  let filteredShownKeys = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
   const flattenList = [];
   const filterSearch = Boolean(filteredShownKeys);
+  const realKeyName = _get(keyMaps, 'key', 'key');
+  const realChildrenName = _get(keyMaps, 'children', 'children');
   function flatten(list) {
     let parent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
     return list.map((treeNode, index) => {
       const pos = getPosition(parent ? parent.pos : '0', index);
-      const mergedKey = treeNode.key;
+      const mergedKey = treeNode[realKeyName];
+      const otherData = {};
+      if (keyMaps) {
+        Object.entries(_omit(keyMaps, 'children')).forEach(_ref => {
+          let [key, value] = _ref;
+          const result = treeNode[value];
+          !_isUndefined(result) && (otherData[key] = result);
+        });
+      }
       // Add FlattenDataNode into list
-      const flattenNode = Object.assign(Object.assign({}, _pick(treeNode, ['key', 'label', 'value', 'icon', 'disabled', 'isLeaf'])), {
+      const flattenNode = Object.assign(Object.assign(Object.assign({}, _pick(treeNode, ['key', 'label', 'value', 'icon', 'disabled', 'isLeaf'])), otherData), {
         parent,
         pos,
         children: null,
@@ -48,7 +59,7 @@ export function flattenTreeData(treeNodeList, expandedKeys) {
       }
       // Loop treeNode children
       if (expandedKeys.has(mergedKey) && (!filterSearch || !isBooleanFilteredShownKeys && filteredShownKeys.has(mergedKey))) {
-        flattenNode.children = flatten(treeNode.children || [], flattenNode);
+        flattenNode.children = flatten(treeNode[realChildrenName] || [], flattenNode);
       } else {
         flattenNode.children = [];
       }
@@ -83,17 +94,20 @@ export function convertJsonToData(treeJson) {
 /**
  * Traverse all the data by `treeData`.
  */
-export function traverseDataNodes(treeNodes, callback) {
+export function traverseDataNodes(treeNodes, callback, keyMaps) {
+  const realKeyName = _get(keyMaps, 'key', 'key');
+  const realChildrenName = _get(keyMaps, 'children', 'children');
   const processNode = (node, ind, parent) => {
-    const children = node ? node.children : treeNodes;
+    const children = node ? node[realChildrenName] : treeNodes;
     const pos = node ? getPosition(parent.pos, ind) : '0';
     // Process node if is not root
     if (node) {
+      const nodeKey = _get(node, realKeyName, null);
       const data = {
         data: Object.assign({}, node),
         ind,
         pos,
-        key: node.key !== null ? node.key : pos,
+        key: nodeKey !== null ? nodeKey : pos,
         parentPos: parent.node ? parent.pos : null,
         level: Number(parent.level) + 1
       };
@@ -113,7 +127,7 @@ export function traverseDataNodes(treeNodes, callback) {
   processNode(null);
 }
 /* Convert data to entities map */
-export function convertDataToEntities(dataNodes) {
+export function convertDataToEntities(dataNodes, keyMaps) {
   const posEntities = {};
   const keyEntities = {};
   const valueEntities = {};
@@ -122,6 +136,7 @@ export function convertDataToEntities(dataNodes) {
     keyEntities,
     valueEntities
   };
+  const realValueName = _get(keyMaps, 'value', 'value');
   traverseDataNodes(dataNodes, data => {
     const {
       pos,
@@ -129,7 +144,7 @@ export function convertDataToEntities(dataNodes) {
       parentPos
     } = data;
     const entity = Object.assign({}, data);
-    const value = _get(entity, 'data.value', null);
+    const value = _get(entity, `data.${realValueName}`, null);
     if (value !== null) {
       valueEntities[value] = key;
     }
@@ -141,7 +156,7 @@ export function convertDataToEntities(dataNodes) {
       entity.parent.children = entity.parent.children || [];
       entity.parent.children.push(entity);
     }
-  });
+  }, keyMaps);
   return wrapper;
 }
 /* Get key by value */
@@ -539,7 +554,8 @@ export function filterTreeData(info) {
     treeData,
     filterTreeNode,
     filterProps,
-    prevExpandedKeys
+    prevExpandedKeys,
+    keyMaps
   } = info;
   let filteredOptsKeys = [];
   filteredOptsKeys = Object.values(keyEntities).filter(item => filter(inputValue, item.data, filterTreeNode, filterProps)).map(item => item.key);
@@ -550,7 +566,7 @@ export function filterTreeData(info) {
   }
   const shownChildKeys = findDescendantKeys(filteredOptsKeys, keyEntities, true);
   const filteredShownKeys = new Set([...shownChildKeys, ...expandedOptsKeys]);
-  const flattenNodes = flattenTreeData(treeData, new Set(expandedOptsKeys), showFilteredOnly && filteredShownKeys);
+  const flattenNodes = flattenTreeData(treeData, new Set(expandedOptsKeys), keyMaps, showFilteredOnly && filteredShownKeys);
   return {
     flattenNodes,
     filteredKeys: new Set(filteredOptsKeys),
@@ -559,16 +575,18 @@ export function filterTreeData(info) {
   };
 }
 // return data.value if data.value exist else fall back to key
-export function getValueOrKey(data) {
+export function getValueOrKey(data, keyMaps) {
+  const valueName = _get(keyMaps, 'value', 'value');
+  const keyName = _get(keyMaps, 'key', 'key');
   if (Array.isArray(data)) {
-    return data.map(item => _get(item, 'value', item.key));
+    return data.map(item => _get(item, valueName, item[keyName]));
   }
-  return _get(data, 'value', data.key);
+  return _get(data, valueName, data[keyName]);
 }
 /* Convert value to string */
-export function normalizeValue(value, withObject) {
+export function normalizeValue(value, withObject, keyMaps) {
   if (withObject && isValid(value)) {
-    return getValueOrKey(value);
+    return getValueOrKey(value, keyMaps);
   } else {
     return value;
   }
@@ -577,8 +595,9 @@ export function updateKeys(keySet, keyEntities) {
   const keyArr = [...keySet];
   return keyArr.filter(key => key in keyEntities);
 }
-export function calcDisabledKeys(keyEntities) {
-  const disabledKeys = Object.keys(keyEntities).filter(key => keyEntities[key].data.disabled);
+export function calcDisabledKeys(keyEntities, keyMaps) {
+  const disabledName = _get(keyMaps, 'disabled', 'disabled');
+  const disabledKeys = Object.keys(keyEntities).filter(key => keyEntities[key].data[disabledName]);
   const {
     checkedKeys
   } = calcCheckedKeys(disabledKeys, keyEntities);

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

@@ -122,7 +122,6 @@ export default class TreeSelectFoundation<P = Record<string, any>, S = Record<st
     findDataForValue(findValue: string): any;
     constructDataForValue(value: string): {
         [x: number]: string;
-        key: string;
     };
     getDataForKeyNotInKeyEntities(value: string): any;
     getCopyFromState(items: string | string[]): BasicTreeInnerData;

package/lib/es/treeSelect/foundation.js

@@ -89,8 +89,11 @@ export default class TreeSelectFoundation extends BaseFoundation {
   findDataForValue(findValue) {
     const {
       value,
-      defaultValue
+      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];
@@ -98,16 +101,19 @@ export default class TreeSelectFoundation extends BaseFoundation {
       valueArr = Array.isArray(defaultValue) ? defaultValue : [defaultValue];
     }
     return valueArr.find(item => {
-      return item.value === findValue || item.key === findValue;
+      return item[realValueName] === findValue || item[realKeyName] === findValue;
     });
   }
   constructDataForValue(value) {
     const {
-      treeNodeLabelProp
+      treeNodeLabelProp,
+      keyMaps
     } = this.getProps();
+    const keyName = _get(keyMaps, 'key', 'key');
+    const labelName = _get(keyMaps, 'label', treeNodeLabelProp);
     return {
-      key: value,
-      [treeNodeLabelProp]: value
+      [keyName]: value,
+      [labelName]: value
     };
   }
   getDataForKeyNotInKeyEntities(value) {
@@ -224,7 +230,8 @@ export default class TreeSelectFoundation extends BaseFoundation {
     } = this.getStates();
     const {
       leafOnly,
-      checkRelation
+      checkRelation,
+      keyMaps
     } = this.getProps();
     let keyList = [];
     if (checkRelation === 'related') {
@@ -232,11 +239,11 @@ export default class TreeSelectFoundation extends BaseFoundation {
     } else if (checkRelation === 'unRelated') {
       keyList = key;
     }
-    const nodes = keyList.map(key => keyEntities[key] && keyEntities[key].data.key === key ? keyEntities[key].data : this.getDataForKeyNotInKeyEntities(key));
+    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);
     }
   }
@@ -244,11 +251,14 @@ export default class TreeSelectFoundation extends BaseFoundation {
     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 {
@@ -375,15 +385,17 @@ export default class TreeSelectFoundation extends BaseFoundation {
   removeTag(eventKey) {
     const {
       disableStrictly,
-      checkRelation
+      checkRelation,
+      keyMaps
     } = this.getProps();
     const {
       keyEntities,
       disabledKeys,
       realCheckedKeys
     } = this.getStates();
-    const item = keyEntities[eventKey] && keyEntities[eventKey].data.key === eventKey ? keyEntities[eventKey].data : this.getDataForKeyNotInKeyEntities(eventKey);
-    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') {
@@ -422,11 +434,14 @@ 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,
@@ -450,8 +465,10 @@ 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 = [];
@@ -460,18 +477,18 @@ export default class TreeSelectFoundation extends BaseFoundation {
     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));
@@ -605,7 +622,7 @@ export default class TreeSelectFoundation extends BaseFoundation {
       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) {
@@ -630,7 +647,8 @@ export default class TreeSelectFoundation extends BaseFoundation {
     const {
       treeData,
       filteredShownKeys,
-      keyEntities
+      keyEntities,
+      keyMaps
     } = this.getStates();
     const showFilteredOnly = this._showFilteredOnly();
     // clone otherwise will be modified unexpectedly
@@ -654,7 +672,7 @@ export default class TreeSelectFoundation extends BaseFoundation {
     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,
@@ -672,7 +690,8 @@ export default class TreeSelectFoundation extends BaseFoundation {
   handleNodeExpand(e, treeNode) {
     // debugger;
     const {
-      loadData
+      loadData,
+      keyMaps
     } = this.getProps();
     const {
       inputValue,
@@ -709,7 +728,7 @@ export default class TreeSelectFoundation extends BaseFoundation {
     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,
@@ -730,19 +749,21 @@ export default class TreeSelectFoundation extends BaseFoundation {
   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 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].data.key === key ? keyEntities[key].data : this.getDataForKeyNotInKeyEntities(key);
+      item = keyEntities[key] && keyEntities[key].key === key ? keyEntities[key].data : this.getDataForKeyNotInKeyEntities(key);
     }
-    const renderText = item && treeNodeLabelProp in item ? renderSelectedItem(item) : null;
+    const renderText = item ? renderSelectedItem(item) : null;
     return renderText;
   }
   /**

package/lib/es/typography/typography.css

@@ -46,6 +46,10 @@
   font-size: 12px;
   line-height: 16px;
   font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 400;
+}
+.semi-typography-small.semi-typography-paragraph {
+  font-weight: 400;
 }
 .semi-typography code {
   border: 1px solid var(--semi-color-border);
@@ -315,6 +319,7 @@ h6.semi-typography.semi-typography-h6-weight-bold,
 p.semi-typography-extended,
 .semi-typography-paragraph.semi-typography-extended {
   line-height: 24px;
+  font-weight: 400;
 }
 
 .semi-rtl .semi-typography,

package/lib/es/typography/typography.scss

@@ -53,6 +53,10 @@ $module: #{$prefix}-typography;
 
     &-small {
         @include font-size-small;
+        font-weight: $font-typography_smallText-regular-fontWeight;
+        &.#{$module}-paragraph{
+            font-weight: $font-typography_smallParagraph-regular-fontWeight;
+        }
     }
 
     code {
@@ -351,6 +355,7 @@ h6.#{$module},
 p.#{$module}-extended,
 .#{$module}-paragraph.#{$module}-extended {
     line-height: $font-typography_paragraph_extended-lineHeight;
+    font-weight: $font-typography_normalParagraph-regular-fontWeight;
 }
 
 @import "./rtl.scss";

package/lib/es/typography/variables.scss

@@ -26,6 +26,10 @@ $font-typography_title-fontWeight: $font-weight-bold; // 标题文本字重
 $font-typography_link-fontWeight: $font-weight-bold; // 链接文本字重
 $font-typography_strong-fontWeight: $font-weight-bold; // 强调文本字重
 $font-typography_paragraph_extended-lineHeight: 24px; // 宽松行距段落文本行高
+$font-typography_normalText-regular-fontWeight: $font-weight-regular; // normal text 字重 - 正常
+$font-typography_smallText-regular-fontWeight: $font-weight-regular; // small text 字重 - 正常
+$font-typography_normalParagraph-regular-fontWeight: $font-weight-regular; // normal paragraph 字重 - 正常
+$font-typography_smallParagraph-regular-fontWeight: $font-weight-regular; // small paragraph 字重 - 正常
 
 $font-typography_title1-fontWeight: $font-typography_title-fontWeight; // 一级标题文本字重
 $font-typography_title2-fontWeight: $font-typography_title-fontWeight; // 二级标题文本字重

package/lib/es/utils/array.d.ts

@@ -11,12 +11,12 @@
  * => ['b', 'b']
  */
 export declare function pullAll(arrayA: any[], arrayB: any[]): any[];
-type CompareFn<T> = (a: T, b: T) => number;
+type CompareFn<T> = (a: T, b: T, sortOrder: 'ascend' | 'descend') => number;
 /**
  * Adapt the descending order
  * @param {Function} fn
  * @param {String} order
  * @returns
  */
-export declare function withOrderSort<T = any>(fn: CompareFn<T>, order?: string): CompareFn<T>;
+export declare function withOrderSort<T = any>(fn: CompareFn<T>, order?: 'ascend' | 'descend'): (a: T, b: T) => number;
 export {};

package/lib/es/utils/array.js

@@ -31,11 +31,11 @@ export function withOrderSort(fn) {
   switch (order) {
     case 'descend':
       return (a, b) => {
-        const result = Number(fn(a, b));
+        const result = Number(fn(a, b, order));
         return result !== 0 ? -result : result;
       };
     case 'ascend':
     default:
-      return fn;
+      return (a, b) => fn(a, b, order);
   }
 }

package/package.json

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

package/table/foundation.ts

@@ -1202,7 +1202,7 @@ export interface BaseSorterInfo<RecordType> {
     sorter?: BaseSorter<RecordType>
 }
 export type BaseSortOrder = boolean | ArrayElement<typeof strings.SORT_DIRECTIONS>;
-export type BaseSorter<RecordType> = boolean | ((a?: RecordType, b?: RecordType) => number);
+export type BaseSorter<RecordType> = boolean | ((a?: RecordType, b?: RecordType, sortOrder?: 'ascend' | 'descend') => number);
 export interface BaseChangeInfoFilter<RecordType> {
     dataIndex?: string;
     value?: any;

package/tree/foundation.ts

@@ -22,6 +22,8 @@ import {
     calcDropActualPosition
 } from './treeUtil';
 
+export { KeyMapProps } from './treeUtil';
+
 export interface BasicTreeNodeProps {
     [x: string]: any;
     expanded?: boolean;
@@ -44,7 +46,7 @@ export interface BasicTreeNodeProps {
 
 export interface BasicTreeNodeData {
     [x: string]: any;
-    key: string;
+    key?: string;
     value?: number | string;
     label?: any;
     icon?: any;
@@ -425,7 +427,7 @@ export default class TreeFoundation extends BaseFoundation<TreeAdapter, BasicTre
 
     notifyMultipleChange(key: string[], e: any) {
         const { keyEntities } = this.getStates();
-        const { leafOnly, checkRelation } = this.getProps();
+        const { leafOnly, checkRelation, keyMaps } = this.getProps();
         let value;
         let keyList = [];
         if (checkRelation === 'related') {
@@ -436,13 +438,14 @@ export default class TreeFoundation extends BaseFoundation<TreeAdapter, BasicTre
         if (this.getProp('onChangeWithObject')) {
             value = keyList.map((itemKey: string) => keyEntities[itemKey].data);
         } else {
-            value = getValueOrKey(keyList.map((itemKey: string) => keyEntities[itemKey].data));
+            value = getValueOrKey(keyList.map((itemKey: string) => keyEntities[itemKey].data), keyMaps);
         }
         this._adapter.notifyChange(value);
     }
 
     notifyChange(key: string[] | string, e: any) {
         const isMultiple = this._isMultiple();
+        const { keyMaps } = this.getProps();
         const { keyEntities } = this.getStates();
         if (this.getProp('treeDataSimpleJson')) {
             this.notifyJsonChange(key, e);
@@ -454,7 +457,7 @@ export default class TreeFoundation extends BaseFoundation<TreeAdapter, BasicTre
                 value = get(keyEntities, key).data;
             } else {
                 const { data } = get(keyEntities, key);
-                value = getValueOrKey(data);
+                value = getValueOrKey(data, keyMaps);
             }
             this._adapter.notifyChange(value);
         }
@@ -464,7 +467,8 @@ export default class TreeFoundation extends BaseFoundation<TreeAdapter, BasicTre
         // Input is a controlled component, so the value value needs to be updated
         this._adapter.updateInputValue(sugInput);
         const { expandedKeys, selectedKeys, keyEntities, treeData } = this.getStates();
-        const { showFilteredOnly, filterTreeNode, treeNodeFilterProp } = this.getProps();
+        const { showFilteredOnly, filterTreeNode, treeNodeFilterProp, keyMaps } = this.getProps();
+        const realFilterProp = treeNodeFilterProp !== 'label' ? treeNodeFilterProp : get(keyMaps, 'label', 'label');
         let filteredOptsKeys: string[] = [];
         let expandedOptsKeys: string[] = [];
         let flattenNodes: BasicFlattenNode[] = [];
@@ -473,10 +477,10 @@ export default class TreeFoundation extends BaseFoundation<TreeAdapter, BasicTre
         if (!sugInput) {
             expandedOptsKeys = findAncestorKeys(selectedKeys, keyEntities);
             expandedOptsKeys.forEach(item => expandedKeys.add(item));
-            flattenNodes = flattenTreeData(treeData, expandedKeys);
+            flattenNodes = flattenTreeData(treeData, expandedKeys, keyMaps);
         } else {
             filteredOptsKeys = Object.values(keyEntities)
-                .filter((item: BasicKeyEntity) => filter(sugInput, item.data, filterTreeNode, treeNodeFilterProp))
+                .filter((item: BasicKeyEntity) => filter(sugInput, item.data, filterTreeNode, realFilterProp))
                 .map((item: BasicKeyEntity) => item.key);
             expandedOptsKeys = findAncestorKeys(filteredOptsKeys, keyEntities, false);
             const shownChildKeys = findDescendantKeys(filteredOptsKeys, keyEntities, true);
@@ -484,6 +488,7 @@ export default class TreeFoundation extends BaseFoundation<TreeAdapter, BasicTre
             flattenNodes = flattenTreeData(
                 treeData,
                 new Set(expandedOptsKeys),
+                keyMaps,
                 showFilteredOnly && filteredShownKeys
             );
         }
@@ -627,6 +632,7 @@ export default class TreeFoundation extends BaseFoundation<TreeAdapter, BasicTre
 
     setExpandedStatus(treeNode: BasicTreeNodeProps) {
         const { inputValue, treeData, filteredShownKeys, keyEntities } = this.getStates();
+        const { keyMaps } = this.getProps();
         const isSearching = Boolean(inputValue);
         const showFilteredOnly = this._showFilteredOnly();
         const expandedStateKey = isSearching ? 'filteredExpandedKeys' : 'expandedKeys';
@@ -646,6 +652,7 @@ export default class TreeFoundation extends BaseFoundation<TreeAdapter, BasicTre
             const flattenNodes = flattenTreeData(
                 treeData,
                 expandedKeys,
+                keyMaps,
                 isSearching && showFilteredOnly && filteredShownKeys
             );
             const motionKeys = this._isAnimated() ? getMotionKeys(eventKey, expandedKeys, keyEntities) : [];