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

package/cascader/foundation.ts

@@ -1,7 +1,6 @@
-import { isEqual, get, difference, isUndefined, assign, cloneDeep, isEmpty, isNumber, includes } from 'lodash';
+import { isEqual, get, difference, isUndefined, assign, isEmpty, isNumber, includes, isFunction, isObject } from 'lodash';
 import BaseFoundation, { DefaultAdapter } from '../base/foundation';
 import {
-    filter,
     findAncestorKeys,
     calcCheckedKeysForUnchecked,
     calcCheckedKeysForChecked,
@@ -11,11 +10,13 @@ import {
 } from '../tree/treeUtil';
 import { Motion } from '../utils/type';
 import {
+    filter,
     convertDataToEntities,
-    findKeysForValues,
     normalizedArr,
     isValid,
-    calcMergeType
+    calcMergeType,
+    getKeysByValuePath,
+    getKeyByPos
 } from './util';
 import { strings } from './constants';
 import isEnterPress from '../utils/isEnterPress';
@@ -24,7 +25,14 @@ export interface BasicData {
     data: BasicCascaderData;
     disabled: boolean;
     key: string;
-    searchText: any[]
+    searchText: any[];
+    pathData?: BasicCascaderData[]
+}
+
+export interface Virtualize {
+    itemSize: number;
+    height?: number | string;
+    width?: number | string
 }
 
 export interface BasicEntities {
@@ -49,6 +57,8 @@ export interface BasicEntity {
     parentKey?: string;
     /* key path */
     path: Array<string>;
+    /* pos in treeData */
+    pos: string;
     /* value path */
     valuePath: Array<string>
 }
@@ -90,9 +100,16 @@ export interface BasicTriggerRenderProps {
      * should call this function when the value of the Input component
      * customized by triggerRender is updated to synchronize the state
      * with Cascader. */
+    onSearch: (inputValue: string) => void;
+    /* This function is the same as onSearch (supported since v2.32.0),
+     * because this function was used before, and to align with TreeSelect,
+     * use onSearch instead of onChange is more suitable,
+     * onChange needs to be deleted in the next Major
+    */
     onChange: (inputValue: string) => void;
     /* Function to clear the value */
-    onClear: (e: any) => void
+    onClear: (e: any) => void;
+    onRemove: (key: string) => void
 }
 
 export interface BasicScrollPanelProps {
@@ -101,6 +118,7 @@ export interface BasicScrollPanelProps {
 }
 
 export interface BasicCascaderProps {
+    borderless?: boolean;
     mouseEnterDelay?: number;
     mouseLeaveDelay?: number;
     separator?: string;
@@ -115,7 +133,9 @@ export interface BasicCascaderProps {
     emptyContent?: any;
     filterLeafOnly?: boolean;
     motion?: boolean;
-    filterTreeNode?: ((inputValue: string, treeNodeString: string) => boolean) | boolean;
+    filterTreeNode?: ((inputValue: string, treeNodeString: string, data?: BasicCascaderData) => boolean) | boolean;
+    filterSorter?: (first: BasicCascaderData, second: BasicCascaderData, inputValue: string) => number;
+    filterRender?: (props: any) => any;
     placeholder?: string;
     searchPlaceholder?: string;
     size?: CascaderType;
@@ -146,6 +166,7 @@ export interface BasicCascaderProps {
     leafOnly?: boolean;
     enableLeafClick?: boolean;
     preventScroll?: boolean;
+    virtualizeInSearch?: Virtualize;
     onClear?: () => void;
     triggerRender?: (props: BasicTriggerRenderProps) => any;
     onListScroll?: (e: any, panel: BasicScrollPanelProps) => void;
@@ -192,6 +213,7 @@ export interface CascaderAdapter extends DefaultAdapter<BasicCascaderProps, Basi
     updateInputValue: (value: string) => void;
     updateInputPlaceHolder: (value: string) => void;
     focusInput: () => void;
+    blurInput: () => void;
     registerClickOutsideHandler: (cb: (e: any) => void) => void;
     unregisterClickOutsideHandler: () => void;
     rePositionDropdown: () => void;
@@ -211,10 +233,13 @@ export interface CascaderAdapter extends DefaultAdapter<BasicCascaderProps, Basi
     notifyListScroll: (e: any, panel: BasicScrollPanelProps) => void;
     notifyOnExceed: (data: BasicEntity[]) => void;
     toggleInputShow: (show: boolean, cb: () => void) => void;
-    updateFocusState: (focus: boolean) => void
+    updateFocusState: (focus: boolean) => void;
+    updateLoadingKeyRefValue: (keys: Set<string>) => void;
+    getLoadingKeyRefValue: () => Set<string>;
+    updateLoadedKeyRefValue: (keys: Set<string>) => void;
+    getLoadedKeyRefValue: () => Set<string>
 }
 
-// eslint-disable-next-line max-len
 export default class CascaderFoundation extends BaseFoundation<CascaderAdapter, BasicCascaderProps, BasicCascaderInnerData> {
 
     constructor(adapter: CascaderAdapter) {
@@ -224,6 +249,8 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
     init() {
         const isOpen = this.getProp('open') || this.getProp('defaultOpen');
         this.collectOptions(true);
+        this._adapter.updateLoadingKeyRefValue(new Set());
+        this._adapter.updateLoadedKeyRefValue(new Set());
 
         if (isOpen && !this._isDisabled()) {
             this.open();
@@ -247,8 +274,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         const valueProp: string | any[] = onChangeWithObject ? [] : 'value';
         if (multiple) {
             const valuePath: BasicValue = [];
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore 
+            // @ts-ignore
             item.forEach((checkedKey: string) => {
                 const valuePathItem = this.getItemPropPath(checkedKey, valueProp);
                 valuePath.push(valuePathItem as any);
@@ -291,14 +317,6 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         return isDisabled;
     }
 
-    getCopyFromState(items: string | string[]) {
-        const res: Partial<BasicCascaderInnerData> = {};
-        normalizedArr(items).forEach(key => {
-            res[key] = cloneDeep(this.getState(key));
-        });
-        return res;
-    }
-
     // prop: is array, return all data
     getItemPropPath(selectedKey: string, prop: string | any[], keyEntities?: BasicEntities) {
         const searchMap = keyEntities || this.getState('keyEntities');
@@ -325,9 +343,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         if (isEmpty(keyEntities[selectedKey])) {
             if (includes(selectedKey, 'not-exist-')) {
                 /* Get the value behind not-exist- */
-                // eslint-disable-next-line prefer-destructuring
                 const targetValue = selectedKey.match(/not-exist-(\S*)/)[1];
-                // eslint-disable-next-line max-depth
                 if (isEmpty(keyEntities[targetValue])) {
                     cacheValue = targetValue;
                 } else {
@@ -411,21 +427,21 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         const { changeOnSelect, onChangeWithObject, multiple } = this.getProps();
         const {
             activeKeys,
-            loadingKeys,
             loading,
             keyEntities: keyEntityState,
             selectedKeys: selectedKeysState
         } = this.getStates();
+        const loadingKeys = this._adapter.getLoadingKeyRefValue();
         const filterable = this._isFilterable();
         const loadingActive = [...activeKeys].filter(i => loadingKeys.has(i));
-
-        const valuePath = onChangeWithObject ? normalizedArr(value).map(i => i.value) : normalizedArr(value);
-        const selectedKeys = findKeysForValues(valuePath, keyEntities);
+        const normalizedValue = normalizedArr(value);
+        const valuePath = onChangeWithObject && isObject(normalizedValue[0]) ? normalizedValue.map(i => i.value) : normalizedValue;
+        const selectedKeys = getKeysByValuePath(valuePath);
         let updateStates: Partial<BasicCascaderInnerData> = {};
 
-        if (selectedKeys.length) {
-            const selectedKey = selectedKeys[0];
-            const selectedItem = keyEntities[selectedKey];
+        const selectedKey = selectedKeys.length > 0 ? selectedKeys[0] : undefined;
+        const selectedItem = selectedKey ? keyEntities[selectedKey] : undefined;
+        if (selectedItem) {
             /**
              * When changeOnSelect is turned on, or the target option is a leaf option,
              * the option is considered to be selected, even if the option is disabled
@@ -438,7 +454,11 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
                 if (filterable && !multiple) {
                     const displayText = this.renderDisplayText(selectedKey, keyEntities);
                     updateStates.inputPlaceHolder = displayText;
-                    updateStates.inputValue = displayText;
+                    /*
+                     *  displayText should not be assign to inputValue,
+                     *  cause inputValue should only change by user enter
+                     */
+                    // updateStates.inputValue = displayText;
                 }
             /**
              * If selectedKeys does not meet the update conditions,
@@ -469,7 +489,11 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
             if (filterable && !multiple) {
                 const displayText = this._defaultRenderText(valuePath);
                 updateStates.inputPlaceHolder = displayText;
-                updateStates.inputValue = displayText;
+                /*
+                 *  displayText should not be assign to inputValue,
+                 *  cause inputValue should only change by user enter
+                 */
+                // updateStates.inputValue = displayText;
             }
             keyEntities[key] = optionNotExist as BasicEntity;
             // Fix: 1155, if the data is loaded asynchronously to update treeData, the emptying operation should not be done when entering the updateSelectedKey method
@@ -536,21 +560,31 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         this._notifyBlur(e);
     }
 
+    focus() {
+        const { filterTreeNode } = this.getProps();
+        if (filterTreeNode) {
+            this._adapter.focusInput();
+        }
+        this._adapter.updateFocusState(true);
+    }
+
+    blur() {
+        const { filterTreeNode } = this.getProps();
+        if (filterTreeNode) {
+            this._adapter.blurInput();
+        }
+        this._adapter.updateFocusState(false);
+    }
+
     toggle2SearchInput(isShow: boolean) {
         if (isShow) {
-            this._adapter.toggleInputShow(isShow, () => this.focusInput());
+            this._adapter.toggleInputShow(isShow, () => this.focus());
         } else {
             this._adapter.toggleInputShow(isShow, () => undefined);
         }
     }
 
-    focusInput() {
-        this._adapter.focusInput();
-        this._adapter.updateFocusState(true);
-    }
-
-
-    updateSearching = (isSearching:boolean)=>{
+    updateSearching = (isSearching: boolean)=>{
         this._adapter.updateStates({ isSearching: false });
     }
 
@@ -639,18 +673,19 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
 
     handleNodeLoad(item: BasicEntity | BasicData) {
         const { data, key } = item;
-        const {
-            loadedKeys: prevLoadedKeys,
-            loadingKeys: prevLoadingKeys
-        } = this.getCopyFromState(['loadedKeys', 'loadingKeys']);
+        const prevLoadingKeys = new Set(this._adapter.getLoadingKeyRefValue());
+        const prevLoadedKeys = new Set(this._adapter.getLoadedKeyRefValue());
         const newLoadedKeys = prevLoadedKeys.add(key);
         const newLoadingKeys = new Set([...prevLoadingKeys]);
         newLoadingKeys.delete(key);
 
         // onLoad should trigger before internal setState to avoid `loadData` trigger twice.
         this._adapter.notifyOnLoad(newLoadedKeys, data);
+        this._adapter.updateLoadingKeyRefValue(newLoadingKeys);
+        this._adapter.updateLoadedKeyRefValue(newLoadedKeys);
         this._adapter.updateStates({
             loadingKeys: newLoadingKeys,
+            loadedKeys: newLoadedKeys
         });
     }
 
@@ -658,14 +693,17 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         const { data, key } = item;
         this._adapter.updateStates({ loading: false });
         if (!data.isLeaf && !data.children && this.getProp('loadData')) {
-            const { loadedKeys, loadingKeys } = this.getCopyFromState(['loadedKeys', 'loadingKeys']);
+            const loadedKeys = this._adapter.getLoadedKeyRefValue();
+            const loadingKeys = new Set(this._adapter.getLoadingKeyRefValue());
             if (loadedKeys.has(key) || loadingKeys.has(key)) {
                 return;
             }
             this._adapter.updateStates({ loading: true });
             const { keyEntities } = this.getStates();
             const optionPath = this.getItemPropPath(key, [], keyEntities);
-            this._adapter.updateStates({ loadingKeys: loadingKeys.add(key) });
+            const newLoadingKeys = loadingKeys.add(key);
+            this._adapter.updateLoadingKeyRefValue(newLoadingKeys);
+            this._adapter.updateStates({ loadingKeys: newLoadingKeys });
             this._adapter.notifyLoadData(optionPath, this.handleNodeLoad.bind(this, item));
         }
     }
@@ -798,7 +836,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
 
     calcNonDisabledCheckedKeys(eventKey: string, targetStatus: boolean) {
         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) {
@@ -831,10 +869,8 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         const { keyEntities } = this.getStates();
         const values: (string | number)[] = [];
         keys.forEach(key => {
-            if (!isEmpty(keyEntities) && !isEmpty(keyEntities[key])) {
-                const valueItem = keyEntities[key].data.value;
-                values.push(valueItem);
-            }
+            const valueItem = keyEntities[key]?.data?.value;
+            valueItem !== undefined && values.push(valueItem);
         });
         const formatValue: number | string | Array<string | number> = values.length === 1 ?
             values[0] :
@@ -849,7 +885,8 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
      */
     calcCheckedKeys(key: string, curCheckedStatus: boolean) {
         const { keyEntities } = this.getStates();
-        const { checkedKeys, halfCheckedKeys } = this.getCopyFromState(['checkedKeys', 'halfCheckedKeys']);
+        const checkedKeys = new Set(this.getState('checkedKeys')) as Set<string>;
+        const halfCheckedKeys = new Set(this.getState('halfCheckedKeys')) as Set<string>;
         return curCheckedStatus ?
             calcCheckedKeysForChecked(key, keyEntities, checkedKeys, halfCheckedKeys) :
             calcCheckedKeysForUnchecked(key, keyEntities, checkedKeys, halfCheckedKeys);
@@ -863,12 +900,12 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         if (sugInput) {
             filteredKeys = (Object.values(keyEntities) as BasicEntity[])
                 .filter(item => {
-                    const { key, _notExist } = item;
+                    const { key, _notExist, data } = item;
                     if (_notExist) {
                         return false;
                     }
-                    const filteredPath = this.getItemPropPath(key, treeNodeFilterProp).join();
-                    return filter(sugInput, filteredPath, filterTreeNode, false);
+                    const filteredPath = this.getItemPropPath(key, treeNodeFilterProp);
+                    return filter(sugInput, data, filterTreeNode, filteredPath);
                 })
                 .filter(
                     item => (filterTreeNode && !filterLeafOnly) ||
@@ -891,6 +928,7 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         const isControlled = this._isControlledComponent();
         const newState: Partial<BasicCascaderInnerData> = {};
         if (multiple) {
+            newState.isSearching = false;
             this._adapter.updateInputValue('');
             this._adapter.notifyOnSearch('');
             newState.checkedKeys = new Set([]);
@@ -944,14 +982,13 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         }
         return (Object.values(keyEntities) as BasicEntity[])
             .filter(item => item.parentKey === null && !item._notExist)
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
             // @ts-ignore
             .sort((a, b) => parseInt(a.ind, 10) - parseInt(b.ind, 10));
     }
 
     getFilteredData() {
-        const { treeNodeFilterProp } = this.getProps();
-        const { filteredKeys, keyEntities } = this.getStates();
+        const { treeNodeFilterProp, filterSorter } = this.getProps();
+        const { filteredKeys, keyEntities, inputValue } = this.getStates();
         const filteredList: BasicData[] = [];
         const filteredKeyArr = [...filteredKeys];
         filteredKeyArr.forEach(key => {
@@ -959,15 +996,23 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
             if (!item) {
                 return;
             }
-            const itemSearchPath = this.getItemPropPath(key, treeNodeFilterProp);
+            const pathData = this.getItemPropPath(key, []);
+            const itemSearchPath = pathData.map(item => item[treeNodeFilterProp]);
             const isDisabled = this._isOptionDisabled(key, keyEntities);
             filteredList.push({
                 data: item.data,
+                pathData,
                 key,
                 disabled: isDisabled,
                 searchText: itemSearchPath
             });
         });
+
+        if (isFunction(filterSorter)) {
+            filteredList.sort((a, b) => {
+                return filterSorter(a.pathData, b.pathData, inputValue);
+            });
+        }
         return filteredList;
     }
 
@@ -978,17 +1023,20 @@ export default class CascaderFoundation extends BaseFoundation<CascaderAdapter,
         this._adapter.notifyListScroll(e, { panelIndex: ind, activeNode: data });
     }
 
-    handleTagRemove(e: any, tagValuePath: string[]) {
+    handleTagRemoveByKey = (key: string) => {
         const { keyEntities } = this.getStates();
         const { disabled } = this.getProps();
         if (disabled) {
             /* istanbul ignore next */
             return;
         }
-        const removedItem = (Object.values(keyEntities) as BasicEntity[])
-            .filter(item => isEqual(item.valuePath, tagValuePath))[0];
-        !isEmpty(removedItem) &&
-        !removedItem.data.disabled &&
-        this._handleMultipleSelect(removedItem);
+        const removedItem = keyEntities[key] ?? {};
+        !removedItem?.data?.disable && this._handleMultipleSelect(removedItem);
+    }
+
+    handleTagRemoveInTrigger = (pos: string) => {
+        const { treeData } = this.getStates();
+        const key = getKeyByPos(pos, treeData);
+        this.handleTagRemoveByKey(key);
     }
 }

package/cascader/util.ts

@@ -3,7 +3,7 @@ import {
     isUndefined,
     isEqual
 } from 'lodash';
-import { strings } from './constants';
+import { strings, VALUE_SPLIT } from './constants';
 
 function getPosition(level: any, index: any) {
     return `${level}-${index}`;
@@ -21,6 +21,36 @@ export function normalizedArr(val: any) {
     }
 }
 
+/**
+ * @returns whether option includes sugInput.
+ * When filterTreeNode is a function,returns the result of filterTreeNode which called with (sugInput, target, option).
+ */
+export function filter(sugInput: string, option: any, filterTreeNode: any, filteredPath?: string[]) {
+    if (!filterTreeNode) {
+        return true;
+    }
+    let filterFn = filterTreeNode;
+    let target: string;
+    if (typeof filterTreeNode === 'boolean') {
+        filterFn = (targetVal: string, val: string) => {
+            const input = targetVal.toLowerCase();
+            return val
+                .toLowerCase()
+                .includes(input);
+        };
+        // 当 filterTreeNode 是 bool 类型时，由 Cascader 内部判断是否符合筛选条件，使用 join('') 修复搜索英文逗号导致所有数据被匹配问题
+        // When the type of of filterTreeNode is bool, Cascader internally determines whether it meets the filtering conditions.
+        // Use join('') to fix the problem that searching for English commas causes all data to be matched.
+        target = filteredPath.join('');
+    } else {
+        // 当 filterTreeNode 为函数类型时，由用户判断是否符合筛选条件，使用 join(), 和原来保持一致
+        // When the type of of filterTreeNode is function, the user determines whether it meets the filtering conditions, 
+        // uses join() to be consistent with the previous version.
+        target = filteredPath.join();
+    }
+    return filterFn(sugInput, target, option);
+}
+
 /**
  * Traverse all the data by `treeData`.
  */
@@ -30,11 +60,13 @@ function traverseDataNodes(treeNodes: any, callback: any) {
         let item: any = null;
         // Process node if is not root
         if (node) {
-            const key = parent ? getPosition(parent.key, ind) : `${ind}`;
+            const key = parent ? `${parent.key}${VALUE_SPLIT}${node.value}` : `${node.value}`;
+            const pos = parent ? getPosition(parent.pos, ind) : `${ind}`;
             item = {
                 data: { ...node },
                 ind,
                 key,
+                pos,
                 level: parent ? parent.level + 1 : 0,
                 parentKey: parent ? parent.key : null,
                 path: parent ? [...parent.path, key] : [key],
@@ -55,6 +87,36 @@ function traverseDataNodes(treeNodes: any, callback: any) {
     processNode(null);
 }
 
+export function getKeysByValuePath(valuePath: (string | number)[][] | (string | number)[]) {
+    if (valuePath?.length) {
+        if (Array.isArray(valuePath[0])) {
+            return valuePath.map((item) => getKeyByValuePath(item));
+        } else {
+            return [getKeyByValuePath(valuePath as (string | number)[])];
+        }
+    }
+    return [];
+}
+
+export function getKeyByValuePath(valuePath: (string | number)[]) {
+    return valuePath.join(VALUE_SPLIT);
+}
+
+export function getValuePathByKey(key: string) {
+    return key.split(VALUE_SPLIT);
+}
+
+export function getKeyByPos(pos: string, treeData: any) {
+    const posArr = pos.split('-').map(item => Number(item));
+    let resultData = treeData;
+    let valuePath = [];
+    posArr.forEach((item, index) => {
+        resultData = index === 0 ? resultData[item] : resultData?.children?.[item];
+        valuePath.push(resultData?.value);
+    });
+    return getKeyByValuePath(valuePath);
+}
+
 export function convertDataToEntities(dataNodes: any) {
     const keyEntities: any = {};
 
@@ -74,14 +136,6 @@ export function convertDataToEntities(dataNodes: any) {
     return keyEntities;
 }
 
-export function findKeysForValues(value: any, keyEntities: any) {
-    const valuePath = normalizedArr(value);
-    const res = Object.values(keyEntities)
-        .filter((item: any) => isEqual(item.valuePath, valuePath))
-        .map((item: any) => item.key);
-    return res;
-}
-
 export function calcMergeType(autoMergeValue: boolean, leafOnly: boolean): string {
     let mergeType: string;
     if (leafOnly) {

package/cascader/variables.scss

@@ -5,6 +5,7 @@ $color-cascader_default-border-hover: transparent; // 级联选择描边颜色 -
 $color-cascader_default-border-focus: var(--semi-color-focus-border); // 级联选择描边颜色 - 选中
 $color-cascader_default-bg-default: var(--semi-color-fill-0); // 级联选择菜单项背景颜色 - 默认
 $color-cascader_default-bg-hover: var(--semi-color-fill-1); // 级联选择菜单项背景颜色 - 悬浮
+$color-cascader_default-bg-active: var(--semi-color-fill-2); // 级联选择菜单项背景颜色 - 按下
 $color-cascader_option_list-border-default: var(--semi-color-fill-0); // 级联选择各级菜单分割线颜色
 $color-cascader_option_main-text-default: var(--semi-color-text-0); // 级联选择菜单项文字颜色
 $color-cascader_option-bg-hover: var(--semi-color-fill-0); // 级联选择菜单项背景颜色 - 悬浮
@@ -13,6 +14,7 @@ $color-cascader_option-bg-selected: var(--semi-color-primary-light-default); //
 $color-cascader_option_disabled-text-default: var(--semi-color-disabled-text); // 级联选择菜单项文字颜色 - 禁用
 $color-cascader_option_disabled-bg-hover: transparent; // 级联选择菜禁用单项背景颜色 - 悬浮
 $color-cascader_option_disabled-bg-active: transparent; // 级联选择菜禁用单项背景颜色 - 按下
+$color-cascader_tag_disabled-bg-default: transparent; // 级联选择菜禁用Tag背景颜色
 
 // warning，same as Input
 $color-cascader_warning-bg-default: var(--semi-color-warning-light-default); // 级联选择触发器警告背景颜色
@@ -96,7 +98,9 @@ $height-cascader_option_list: 180px; // 级联选择菜单高度
 $height-cascader_selection_tagInput_wrapper_small: 22px;  //级联选择多选搜索时搜索框最小高度 - 小尺寸
 $height-cascader_selection_tagInput_wrapper_default: 30px;  //级联选择多选搜索时搜索框最小高度 - 默认尺寸
 $height-cascader_selection_tagInput_wrapper_large: 38px;  //级联选择多选搜索时搜索框最小高度 - 大尺寸
-$height-cascader_selection_wrapper: 30px;
+$height-cascader_selection_wrapper_small: 22px;  //级联选择单选搜索时搜索框高度 - 小尺寸
+$height-cascader_selection_wrapper: 30px; // 级联选择单选搜索时搜索框高度 - 默认尺寸
+$height-cascader_selection_wrapper_large: 38px;  //级联选择单选搜索时搜索框高度 - 大尺寸
 
 $spacing-cascader_text-marginX: $spacing-base-tight; // 级联选择 prefix/suffix 文字水平内间距
 $spacing-cascader_icon-marginX: $spacing-tight; // 级联选择 prefix/suffix 图标水平内间距

package/checkbox/checkbox.scss

@@ -12,7 +12,6 @@ $module: #{$prefix}-checkbox;
     position: relative;
     display: flex;
     align-items: flex-start;
-    flex-wrap: wrap;
     @include font-size-regular;
     cursor: pointer;
     transition: background-color $transition_duration-checkbox-bg $transition_function-checkbox-bg $transition_delay-checkbox-bg,

package/checkbox/checkboxFoundation.ts

@@ -117,7 +117,7 @@ class CheckboxFoundation<P = Record<string, any>, S = Record<string, any>> exten
             if (target.matches(':focus-visible')) {
                 this._adapter.setFocusVisible(true);
             }
-        } catch (error){
+        } catch (error) {
             warning(true, 'Warning: [Semi Checkbox] The current browser does not support the focus-visible');
         }
     }
@@ -127,7 +127,6 @@ class CheckboxFoundation<P = Record<string, any>, S = Record<string, any>> exten
         this._adapter.setFocusVisible(false);
     }
 
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
     destroy() {}
 }
 

package/checkbox/checkboxGroupFoundation.ts

@@ -74,7 +74,6 @@ class CheckboxGroupFoundation extends BaseFoundation<CheckboxGroupAdapter> {
         }
     }
 
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
     destroy() {}
 }
 

package/collapse/foundation.ts

@@ -7,6 +7,7 @@ export interface CollapseProps{
     activeKey?: string | string[];
     defaultActiveKey?: string | string[];
     accordion?: boolean;
+    clickHeaderToExpand?: boolean;
     onChange?: (activeKey: CollapseProps['activeKey'], e: any) => void;
     expandIcon?: any;
     collapseIcon?: any;

package/datePicker/_utils/getDefaultFormatToken.ts

@@ -6,6 +6,7 @@ const defaultFormatTokens = {
     dateRange: strings.FORMAT_FULL_DATE,
     dateTimeRange: strings.FORMAT_DATE_TIME,
     month: strings.FORMAT_YEAR_MONTH,
+    monthRange: strings.FORMAT_YEAR_MONTH,
 } as const;
 
 const getDefaultFormatToken = (type: string) => defaultFormatTokens;

package/datePicker/_utils/getInsetInputFormatToken.ts

@@ -31,6 +31,7 @@ export default function getInsetInputFormatToken(options: { format: string; type
             break;
         case 'date':
         case 'month':
+        case 'monthRange':
         case 'dateRange':
         default:
             const dateResult = dateReg.exec(format);

package/datePicker/_utils/getInsetInputValueFromInsetInputStr.ts

@@ -34,6 +34,7 @@ export default function getInsetInputValueFromInsetInputStr(options: { inputValu
     switch (type) {
         case 'date':
         case 'month':
+        case 'monthRange':
             insetInputValue.monthLeft.dateInput = inputValue;
             break;
         case 'dateRange':

package/datePicker/_utils/getYears.ts

@@ -1,6 +1,10 @@
-const getYears = () => {
-    const year = new Date().getFullYear();
-    const startYear = year - 100;
-    return Array.from({ length: 200 }, (v, i) => startYear + i);
+const getYears = (startYear?: number, endYear?: number) => {
+    const currentYear = new Date().getFullYear();
+    let start = typeof startYear === 'number' ? startYear : currentYear - 100;
+    let end = typeof endYear === 'number' ? endYear : currentYear + 100;
+    if (end < start) {
+        [start, end] = [end, start];
+    }
+    return Array.from({ length: end - start + 1 }, (v, i) => start + i);
 };
 export default getYears;

package/datePicker/_utils/isValidTimeZone.ts

@@ -0,0 +1,3 @@
+export default function isValidTimeZone(timeZone?: string | number) {
+    return ['string', 'number'].includes(typeof timeZone) && timeZone !== '';
+}

package/datePicker/constants.ts

@@ -46,7 +46,7 @@ const strings = {
     DEFAULT_SEPARATOR_MULTIPLE: ',',
     DEFAULT_SEPARATOR_RANGE: ' ~ ',
     SIZE_SET: ['small', 'default', 'large'],
-    TYPE_SET: ['date', 'dateRange', 'year', 'month', 'dateTime', 'dateTimeRange'],
+    TYPE_SET: ['date', 'dateRange', 'year', 'month', 'monthRange', 'dateTime', 'dateTimeRange'],
     PRESET_POSITION_SET: ['left', 'right', 'top', 'bottom'],
     DENSITY_SET: ['default', 'compact'],
     PANEL_TYPE_LEFT: 'left',