From 51c936e7b44b0cd485fef32867658d638039cfec Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E8=B1=AA?= <1844749591@qq.com>
Date: Sun, 5 Jan 2025 16:32:02 +0800
Subject: [PATCH 1/5] feat: retire deprecated api

---
 docs/examples/common.less     | 10 ----------
 docs/examples/custom-icon.tsx |  6 ++----
 src/BaseSelect/index.tsx      |  7 -------
 src/Select.tsx                | 10 +---------
 src/hooks/useAllowClear.tsx   | 10 +++-------
 src/utils/warningPropsUtil.ts |  6 ------
 tests/Select.test.tsx         |  8 ++++----
 7 files changed, 10 insertions(+), 47 deletions(-)
 delete mode 100644 docs/examples/common.less

diff --git a/docs/examples/common.less b/docs/examples/common.less
deleted file mode 100644
index d78a563b4..000000000
--- a/docs/examples/common.less
+++ /dev/null
@@ -1,10 +0,0 @@
-// input {
-//   // height: 24px;
-//   // line-height: 24px;
-//   border: 1px solid #333;
-//   border-radius: 4px;
-// }
-
-// button {
-//   border: 1px solid #333;
-// }
diff --git a/docs/examples/custom-icon.tsx b/docs/examples/custom-icon.tsx
index b82aff553..4d3112d75 100644
--- a/docs/examples/custom-icon.tsx
+++ b/docs/examples/custom-icon.tsx
@@ -98,7 +98,7 @@ class CustomIconComponent extends React.Component {
             onSelect={this.onSelect}
             onInputKeyDown={this.onKeyDown}
             notFoundContent=""
-            allowClear
+            allowClear={{ clearIcon: getSvg(clearPath) }}
             placeholder="please select"
             value={value}
             mode="combobox"
@@ -110,7 +110,6 @@ class CustomIconComponent extends React.Component {
               }
               return getSvg(arrowPath);
             }}
-            clearIcon={getSvg(clearPath)}
             removeIcon={getSvg(clearPath)}
             menuItemSelectedIcon={singleItemIcon}
           >
@@ -185,7 +184,7 @@ class Test extends React.Component {
             choiceTransitionName="rc-select-selection__choice-zoom"
             style={{ width: 500 }}
             mode="multiple"
-            allowClear
+            allowClear={{ clearIcon: getSvg(clearPath) }}
             optionFilterProp="children"
             optionLabelProp="children"
             onSelect={this.onSelect}
@@ -196,7 +195,6 @@ class Test extends React.Component {
             tokenSeparators={[' ', ',']}
             prefix="Foobar"
             suffixIcon={getSvg(arrowPath)}
-            clearIcon={getSvg(clearPath)}
             removeIcon={getSvg(clearPath)}
             menuItemSelectedIcon={menuItemSelectedIcon}
           >
diff --git a/src/BaseSelect/index.tsx b/src/BaseSelect/index.tsx
index a2a15e8c7..68ef0f6fe 100644
--- a/src/BaseSelect/index.tsx
+++ b/src/BaseSelect/index.tsx
@@ -175,11 +175,6 @@ export interface BaseSelectProps extends BaseSelectPrivateProps, React.AriaAttri
   allowClear?: boolean | { clearIcon?: RenderNode };
   prefix?: React.ReactNode;
   suffixIcon?: RenderNode;
-  /**
-   * Clear all icon
-   * @deprecated Please use `allowClear` instead
-   **/
-  clearIcon?: RenderNode;
   /** Selector remove icon */
   removeIcon?: RenderNode;
 
@@ -262,7 +257,6 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
     allowClear,
     prefix,
     suffixIcon,
-    clearIcon,
 
     // Dropdown
     OptionList,
@@ -733,7 +727,6 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
     onClearMouseDown,
     displayValues,
     allowClear,
-    clearIcon,
     disabled,
     mergedSearchValue,
     mode,
diff --git a/src/Select.tsx b/src/Select.tsx
index 9ead1bf40..cb075d411 100644
--- a/src/Select.tsx
+++ b/src/Select.tsx
@@ -70,8 +70,6 @@ export type RawValueType = string | number;
 export interface LabelInValueType {
   label: React.ReactNode;
   value: RawValueType;
-  /** @deprecated `key` is useless since it should always same as `value` */
-  key?: React.Key;
 }
 
 export type DraftValueType =
@@ -119,9 +117,6 @@ export interface SelectProps<ValueType = any, OptionType extends BaseOptionType
   // >>> Field Names
   fieldNames?: FieldNames;
 
-  // >>> Search
-  /** @deprecated Use `searchValue` instead */
-  inputValue?: string;
   searchValue?: string;
   onSearch?: (value: string) => void;
   autoClearSearchValue?: boolean;
@@ -178,7 +173,6 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
       fieldNames,
 
       // Search
-      inputValue,
       searchValue,
       onSearch,
       autoClearSearchValue = true,
@@ -239,7 +233,7 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
 
     // =========================== Search ===========================
     const [mergedSearchValue, setSearchValue] = useMergedState('', {
-      value: searchValue !== undefined ? searchValue : inputValue,
+      value: searchValue,
       postState: (search) => search || '',
     });
 
@@ -271,7 +265,6 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
           if (isRawValue(val)) {
             rawValue = val;
           } else {
-            rawKey = val.key;
             rawLabel = val.label;
             rawValue = val.value ?? (rawKey as RawValueType);
           }
@@ -513,7 +506,6 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
             ? {
                 label: option?.[mergedFieldNames.label],
                 value: val,
-                key: option?.key ?? val,
               }
             : val,
           injectPropsWithOption(option),
diff --git a/src/hooks/useAllowClear.tsx b/src/hooks/useAllowClear.tsx
index 7631521dd..8e4096fad 100644
--- a/src/hooks/useAllowClear.tsx
+++ b/src/hooks/useAllowClear.tsx
@@ -7,19 +7,15 @@ export const useAllowClear = (
   onClearMouseDown: React.MouseEventHandler<HTMLSpanElement>,
   displayValues: DisplayValueType[],
   allowClear?: boolean | { clearIcon?: RenderNode },
-  clearIcon?: RenderNode,
   disabled: boolean = false,
   mergedSearchValue?: string,
   mode?: Mode,
 ) => {
-  const mergedClearIcon = React.useMemo(() => {
+  const clearIcon = React.useMemo(() => {
     if (typeof allowClear === 'object') {
       return allowClear.clearIcon;
     }
-    if (clearIcon) {
-      return clearIcon;
-    }
-  }, [allowClear, clearIcon]);
+  }, [allowClear]);
 
   const mergedAllowClear = React.useMemo<boolean>(() => {
     if (
@@ -39,7 +35,7 @@ export const useAllowClear = (
       <TransBtn
         className={`${prefixCls}-clear`}
         onMouseDown={onClearMouseDown}
-        customizeIcon={mergedClearIcon}
+        customizeIcon={clearIcon}
       >
         ×
       </TransBtn>
diff --git a/src/utils/warningPropsUtil.ts b/src/utils/warningPropsUtil.ts
index cd65349bc..7a0fed2ea 100644
--- a/src/utils/warningPropsUtil.ts
+++ b/src/utils/warningPropsUtil.ts
@@ -28,7 +28,6 @@ function warningProps(props: SelectProps) {
     autoFocus,
     labelInValue,
     value,
-    inputValue,
     optionLabelProp,
   } = props;
 
@@ -149,11 +148,6 @@ function warningProps(props: SelectProps) {
         }\`.`,
       );
     }
-
-    warning(
-      inputValue === undefined,
-      '`inputValue` is deprecated, please use `searchValue` instead.',
-    );
   }
 }
 
diff --git a/tests/Select.test.tsx b/tests/Select.test.tsx
index a37330ddd..7b2d2685d 100644
--- a/tests/Select.test.tsx
+++ b/tests/Select.test.tsx
@@ -289,7 +289,7 @@ describe('Select.Basic', () => {
 
     resetWarned();
     const { container: container5 } = render(
-      <Select allowClear clearIcon={<div className="custom-clear-icon">x</div>} value="1">
+      <Select allowClear={{ clearIcon: <div className="custom-clear-icon">x</div> }} value="1">
         <Option value="1">1</Option>
         <Option value="2">2</Option>
       </Select>,
@@ -298,7 +298,7 @@ describe('Select.Basic', () => {
     expect(container5.querySelector('.custom-clear-icon').textContent).toBe('x');
 
     const { container: container6 } = render(
-      <Select allowClear clearIcon={<div className="custom-clear-icon">x</div>}>
+      <Select allowClear={{ clearIcon: <div className="custom-clear-icon">x</div> }}>
         <Option value="1">1</Option>
         <Option value="2">2</Option>
       </Select>,
@@ -1240,7 +1240,7 @@ describe('Select.Basic', () => {
 
   it('does not filter when filterOption value is false', () => {
     const { container } = testingRender(
-      <Select inputValue="1" filterOption={false} open>
+      <Select searchValue="1" filterOption={false} open>
         <Option value="1">1</Option>
         <Option value="2">2</Option>
       </Select>,
@@ -2330,7 +2330,7 @@ describe('Select.Basic', () => {
     const renderDemo = (props?: any) => (
       <Select
         labelInValue
-        value={{ key: 1, label: 'One' }}
+        value={{ value: 1, label: 'One' }}
         labelRender={labelRender}
         options={[
           {

From b043141a2955487e864fc05f8c5612e02a99e6e5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E8=B1=AA?= <1844749591@qq.com>
Date: Sun, 5 Jan 2025 16:35:09 +0800
Subject: [PATCH 2/5] chore: clean code

---
 src/Select.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/Select.tsx b/src/Select.tsx
index cb075d411..ff9a85ac2 100644
--- a/src/Select.tsx
+++ b/src/Select.tsx
@@ -539,7 +539,6 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
 
       // Clean search value if single or configured
       if (mode === 'combobox') {
-        // setSearchValue(String(val));
         setActiveValue('');
       } else if (!isMultiple || autoClearSearchValue) {
         setSearchValue('');

From dadf040c43d43272228efc912b01102468b6cf41 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E8=B1=AA?= <1844749591@qq.com>
Date: Sun, 5 Jan 2025 19:32:23 +0800
Subject: [PATCH 3/5] chore: adjust some logic and clean code

---
 src/Select.tsx                      | 11 ++++++-----
 tests/Multiple.test.tsx             | 16 +++++++++-------
 tests/Select.test.tsx               |  4 ++--
 tests/shared/removeSelectedTest.tsx |  6 +++---
 4 files changed, 20 insertions(+), 17 deletions(-)

diff --git a/src/Select.tsx b/src/Select.tsx
index ff9a85ac2..0435e4c24 100644
--- a/src/Select.tsx
+++ b/src/Select.tsx
@@ -257,7 +257,6 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
         return valueList.map((val) => {
           let rawValue: RawValueType;
           let rawLabel: React.ReactNode;
-          let rawKey: React.Key;
           let rawDisabled: boolean | undefined;
           let rawTitle: string;
 
@@ -266,7 +265,7 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
             rawValue = val;
           } else {
             rawLabel = val.label;
-            rawValue = val.value ?? (rawKey as RawValueType);
+            rawValue = val.value;
           }
 
           const option = valueOptions.get(rawValue);
@@ -274,7 +273,6 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
             // Fill missing props
             if (rawLabel === undefined)
               rawLabel = option?.[optionLabelProp || mergedFieldNames.label];
-            if (rawKey === undefined) rawKey = option?.key ?? rawValue;
             rawDisabled = option?.disabled;
             rawTitle = option?.title;
 
@@ -295,7 +293,7 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
           return {
             label: rawLabel,
             value: rawValue,
-            key: rawKey,
+            key: rawValue,
             disabled: rawDisabled,
             title: rawTitle,
           };
@@ -466,7 +464,10 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
         (labeledValues.length !== mergedValues.length ||
           labeledValues.some((newVal, index) => mergedValues[index]?.value !== newVal?.value))
       ) {
-        const returnValues = labelInValue ? labeledValues : labeledValues.map((v) => v.value);
+        const returnValues = labelInValue
+          ? labeledValues.map(({ label, value }) => ({ label, value }))
+          : labeledValues.map((v) => v.value);
+
         const returnOptions = labeledValues.map((v) =>
           injectPropsWithOption(getMixedOption(v.value)),
         );
diff --git a/tests/Multiple.test.tsx b/tests/Multiple.test.tsx
index bd9230da5..30d68b8bd 100644
--- a/tests/Multiple.test.tsx
+++ b/tests/Multiple.test.tsx
@@ -375,10 +375,12 @@ describe('Select.Multiple', () => {
   });
 
   it('show static prefix', () => {
-    render(<Select mode="multiple" value={['']} prefix="Foobar">
-      <Option value={1}>1</Option>
-      <Option value={2}>2</Option>
-    </Select>);
+    render(
+      <Select mode="multiple" value={['']} prefix="Foobar">
+        <Option value={1}>1</Option>
+        <Option value={2}>2</Option>
+      </Select>,
+    );
 
     expect(screen.findByText('Foobar')).toBeTruthy();
   });
@@ -459,7 +461,7 @@ describe('Select.Multiple', () => {
     toggleOpen(container);
     selectItem(container, 0);
     expect(onChange).toHaveBeenCalledWith(
-      [{ label: 'Light', value: 'light', key: 'light' }],
+      [{ label: 'Light', value: 'light' }],
       [{ label: 'Light', value: 'light', option: 2333 }],
     );
     onChange.mockReset();
@@ -470,8 +472,8 @@ describe('Select.Multiple', () => {
     selectItem(container, 0);
     expect(onChange).toHaveBeenCalledWith(
       [
-        { label: 'Light', value: 'light', key: 'light' },
-        { label: 'Bamboo', value: 'bamboo', key: 'bamboo' },
+        { label: 'Light', value: 'light' },
+        { label: 'Bamboo', value: 'bamboo' },
       ],
       [
         { label: 'Light', value: 'light', option: 2333 },
diff --git a/tests/Select.test.tsx b/tests/Select.test.tsx
index 7b2d2685d..47d430e1d 100644
--- a/tests/Select.test.tsx
+++ b/tests/Select.test.tsx
@@ -487,7 +487,7 @@ describe('Select.Basic', () => {
     toggleOpen(container);
     selectItem(container);
     expect(handleChange).toHaveBeenCalledWith(
-      { key: '1', value: '1', label: 'One' },
+      { value: '1', label: 'One' },
       { children: 'One', key: null, testprop: 'test', value: '1' },
     );
   });
@@ -508,7 +508,7 @@ describe('Select.Basic', () => {
     toggleOpen(container);
     selectItem(container);
     expect(handleChange).toHaveBeenCalledWith(
-      { key: '1', label: 'One', value: '1' },
+      { label: 'One', value: '1' },
       { children: 'One', key: null, testprop: 'test', value: '1' },
     );
   });
diff --git a/tests/shared/removeSelectedTest.tsx b/tests/shared/removeSelectedTest.tsx
index df732f697..62c2bfbde 100644
--- a/tests/shared/removeSelectedTest.tsx
+++ b/tests/shared/removeSelectedTest.tsx
@@ -50,7 +50,7 @@ export default function removeSelectedTest(mode: any) {
       const handleChange = jest.fn();
       const { container } = render(
         <Select
-          value={[{ key: '1' }, { key: '2' }]}
+          value={[{ value: '1' }, { value: '2' }]}
           onChange={handleChange}
           onDeselect={handleDeselect}
           labelInValue
@@ -63,12 +63,12 @@ export default function removeSelectedTest(mode: any) {
       removeSelection(container);
 
       expect(handleDeselect).toHaveBeenCalledWith(
-        expect.objectContaining({ key: '1', label: '1' }),
+        expect.objectContaining({ value: '1', label: '1' }),
         expect.objectContaining({ value: '1' }),
       );
 
       expect(handleChange).toHaveBeenCalledWith(
-        [expect.objectContaining({ key: '2', label: '2' })],
+        [expect.objectContaining({ value: '2', label: '2' })],
         [expect.objectContaining({ value: '2' })],
       );
     });

From ce980b8d4751fba6273aeb3b0db8c6958a903205 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E8=B1=AA?= <1844749591@qq.com>
Date: Sun, 5 Jan 2025 19:35:50 +0800
Subject: [PATCH 4/5] fix: lint fix

---
 src/Select.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Select.tsx b/src/Select.tsx
index 0435e4c24..3233b5a21 100644
--- a/src/Select.tsx
+++ b/src/Select.tsx
@@ -465,7 +465,7 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
           labeledValues.some((newVal, index) => mergedValues[index]?.value !== newVal?.value))
       ) {
         const returnValues = labelInValue
-          ? labeledValues.map(({ label, value }) => ({ label, value }))
+          ? labeledValues.map(({ label: l, value: v }) => ({ label: l, value: v }))
           : labeledValues.map((v) => v.value);
 
         const returnOptions = labeledValues.map((v) =>

From d75876a438651baba7113336ca22a1c5226020cb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E8=B1=AA?= <1844749591@qq.com>
Date: Wed, 8 Jan 2025 10:41:46 +0800
Subject: [PATCH 5/5] revert: rollback clearIcon

---
 src/BaseSelect/index.tsx    |  7 +++++++
 src/hooks/useAllowClear.tsx | 10 +++++++---
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/src/BaseSelect/index.tsx b/src/BaseSelect/index.tsx
index 68ef0f6fe..a2a15e8c7 100644
--- a/src/BaseSelect/index.tsx
+++ b/src/BaseSelect/index.tsx
@@ -175,6 +175,11 @@ export interface BaseSelectProps extends BaseSelectPrivateProps, React.AriaAttri
   allowClear?: boolean | { clearIcon?: RenderNode };
   prefix?: React.ReactNode;
   suffixIcon?: RenderNode;
+  /**
+   * Clear all icon
+   * @deprecated Please use `allowClear` instead
+   **/
+  clearIcon?: RenderNode;
   /** Selector remove icon */
   removeIcon?: RenderNode;
 
@@ -257,6 +262,7 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
     allowClear,
     prefix,
     suffixIcon,
+    clearIcon,
 
     // Dropdown
     OptionList,
@@ -727,6 +733,7 @@ const BaseSelect = React.forwardRef<BaseSelectRef, BaseSelectProps>((props, ref)
     onClearMouseDown,
     displayValues,
     allowClear,
+    clearIcon,
     disabled,
     mergedSearchValue,
     mode,
diff --git a/src/hooks/useAllowClear.tsx b/src/hooks/useAllowClear.tsx
index 8e4096fad..7631521dd 100644
--- a/src/hooks/useAllowClear.tsx
+++ b/src/hooks/useAllowClear.tsx
@@ -7,15 +7,19 @@ export const useAllowClear = (
   onClearMouseDown: React.MouseEventHandler<HTMLSpanElement>,
   displayValues: DisplayValueType[],
   allowClear?: boolean | { clearIcon?: RenderNode },
+  clearIcon?: RenderNode,
   disabled: boolean = false,
   mergedSearchValue?: string,
   mode?: Mode,
 ) => {
-  const clearIcon = React.useMemo(() => {
+  const mergedClearIcon = React.useMemo(() => {
     if (typeof allowClear === 'object') {
       return allowClear.clearIcon;
     }
-  }, [allowClear]);
+    if (clearIcon) {
+      return clearIcon;
+    }
+  }, [allowClear, clearIcon]);
 
   const mergedAllowClear = React.useMemo<boolean>(() => {
     if (
@@ -35,7 +39,7 @@ export const useAllowClear = (
       <TransBtn
         className={`${prefixCls}-clear`}
         onMouseDown={onClearMouseDown}
-        customizeIcon={clearIcon}
+        customizeIcon={mergedClearIcon}
       >
         ×
       </TransBtn>