feat: retire deprecated api

Author: aojunhao123

docs/examples/common.less

@@ -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}
           >

docs/examples/custom-icon.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,

src/BaseSelect/index.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),

src/Select.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>

src/hooks/useAllowClear.tsx

@@ -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.',
-    );
   }
 }
 

src/utils/warningPropsUtil.ts

@@ -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={[
           {