Skip to content

Commit 1a56cfe

Browse files
authored
feat: retire deprecated api (#1099)
* feat: retire deprecated api * chore: clean code * chore: adjust some logic and clean code * fix: lint fix * revert: rollback clearIcon
1 parent fd1f076 commit 1a56cfe

File tree

7 files changed

+27
-51
lines changed

7 files changed

+27
-51
lines changed

docs/examples/common.less

-10
This file was deleted.

docs/examples/custom-icon.tsx

+2-4
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ class CustomIconComponent extends React.Component {
9898
onSelect={this.onSelect}
9999
onInputKeyDown={this.onKeyDown}
100100
notFoundContent=""
101-
allowClear
101+
allowClear={{ clearIcon: getSvg(clearPath) }}
102102
placeholder="please select"
103103
value={value}
104104
mode="combobox"
@@ -110,7 +110,6 @@ class CustomIconComponent extends React.Component {
110110
}
111111
return getSvg(arrowPath);
112112
}}
113-
clearIcon={getSvg(clearPath)}
114113
removeIcon={getSvg(clearPath)}
115114
menuItemSelectedIcon={singleItemIcon}
116115
>
@@ -185,7 +184,7 @@ class Test extends React.Component {
185184
choiceTransitionName="rc-select-selection__choice-zoom"
186185
style={{ width: 500 }}
187186
mode="multiple"
188-
allowClear
187+
allowClear={{ clearIcon: getSvg(clearPath) }}
189188
optionFilterProp="children"
190189
optionLabelProp="children"
191190
onSelect={this.onSelect}
@@ -196,7 +195,6 @@ class Test extends React.Component {
196195
tokenSeparators={[' ', ',']}
197196
prefix="Foobar"
198197
suffixIcon={getSvg(arrowPath)}
199-
clearIcon={getSvg(clearPath)}
200198
removeIcon={getSvg(clearPath)}
201199
menuItemSelectedIcon={menuItemSelectedIcon}
202200
>

src/Select.tsx

+7-15
Original file line numberDiff line numberDiff line change
@@ -70,8 +70,6 @@ export type RawValueType = string | number;
7070
export interface LabelInValueType {
7171
label: React.ReactNode;
7272
value: RawValueType;
73-
/** @deprecated `key` is useless since it should always same as `value` */
74-
key?: React.Key;
7573
}
7674

7775
export type DraftValueType =
@@ -119,9 +117,6 @@ export interface SelectProps<ValueType = any, OptionType extends BaseOptionType
119117
// >>> Field Names
120118
fieldNames?: FieldNames;
121119

122-
// >>> Search
123-
/** @deprecated Use `searchValue` instead */
124-
inputValue?: string;
125120
searchValue?: string;
126121
onSearch?: (value: string) => void;
127122
autoClearSearchValue?: boolean;
@@ -178,7 +173,6 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
178173
fieldNames,
179174

180175
// Search
181-
inputValue,
182176
searchValue,
183177
onSearch,
184178
autoClearSearchValue = true,
@@ -239,7 +233,7 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
239233

240234
// =========================== Search ===========================
241235
const [mergedSearchValue, setSearchValue] = useMergedState('', {
242-
value: searchValue !== undefined ? searchValue : inputValue,
236+
value: searchValue,
243237
postState: (search) => search || '',
244238
});
245239

@@ -263,25 +257,22 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
263257
return valueList.map((val) => {
264258
let rawValue: RawValueType;
265259
let rawLabel: React.ReactNode;
266-
let rawKey: React.Key;
267260
let rawDisabled: boolean | undefined;
268261
let rawTitle: string;
269262

270263
// Fill label & value
271264
if (isRawValue(val)) {
272265
rawValue = val;
273266
} else {
274-
rawKey = val.key;
275267
rawLabel = val.label;
276-
rawValue = val.value ?? (rawKey as RawValueType);
268+
rawValue = val.value;
277269
}
278270

279271
const option = valueOptions.get(rawValue);
280272
if (option) {
281273
// Fill missing props
282274
if (rawLabel === undefined)
283275
rawLabel = option?.[optionLabelProp || mergedFieldNames.label];
284-
if (rawKey === undefined) rawKey = option?.key ?? rawValue;
285276
rawDisabled = option?.disabled;
286277
rawTitle = option?.title;
287278

@@ -302,7 +293,7 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
302293
return {
303294
label: rawLabel,
304295
value: rawValue,
305-
key: rawKey,
296+
key: rawValue,
306297
disabled: rawDisabled,
307298
title: rawTitle,
308299
};
@@ -473,7 +464,10 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
473464
(labeledValues.length !== mergedValues.length ||
474465
labeledValues.some((newVal, index) => mergedValues[index]?.value !== newVal?.value))
475466
) {
476-
const returnValues = labelInValue ? labeledValues : labeledValues.map((v) => v.value);
467+
const returnValues = labelInValue
468+
? labeledValues.map(({ label: l, value: v }) => ({ label: l, value: v }))
469+
: labeledValues.map((v) => v.value);
470+
477471
const returnOptions = labeledValues.map((v) =>
478472
injectPropsWithOption(getMixedOption(v.value)),
479473
);
@@ -513,7 +507,6 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
513507
? {
514508
label: option?.[mergedFieldNames.label],
515509
value: val,
516-
key: option?.key ?? val,
517510
}
518511
: val,
519512
injectPropsWithOption(option),
@@ -547,7 +540,6 @@ const Select = React.forwardRef<BaseSelectRef, SelectProps<any, DefaultOptionTyp
547540

548541
// Clean search value if single or configured
549542
if (mode === 'combobox') {
550-
// setSearchValue(String(val));
551543
setActiveValue('');
552544
} else if (!isMultiple || autoClearSearchValue) {
553545
setSearchValue('');

src/utils/warningPropsUtil.ts

-6
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,6 @@ function warningProps(props: SelectProps) {
2828
autoFocus,
2929
labelInValue,
3030
value,
31-
inputValue,
3231
optionLabelProp,
3332
} = props;
3433

@@ -149,11 +148,6 @@ function warningProps(props: SelectProps) {
149148
}\`.`,
150149
);
151150
}
152-
153-
warning(
154-
inputValue === undefined,
155-
'`inputValue` is deprecated, please use `searchValue` instead.',
156-
);
157151
}
158152
}
159153

tests/Multiple.test.tsx

+9-7
Original file line numberDiff line numberDiff line change
@@ -375,10 +375,12 @@ describe('Select.Multiple', () => {
375375
});
376376

377377
it('show static prefix', () => {
378-
render(<Select mode="multiple" value={['']} prefix="Foobar">
379-
<Option value={1}>1</Option>
380-
<Option value={2}>2</Option>
381-
</Select>);
378+
render(
379+
<Select mode="multiple" value={['']} prefix="Foobar">
380+
<Option value={1}>1</Option>
381+
<Option value={2}>2</Option>
382+
</Select>,
383+
);
382384

383385
expect(screen.findByText('Foobar')).toBeTruthy();
384386
});
@@ -459,7 +461,7 @@ describe('Select.Multiple', () => {
459461
toggleOpen(container);
460462
selectItem(container, 0);
461463
expect(onChange).toHaveBeenCalledWith(
462-
[{ label: 'Light', value: 'light', key: 'light' }],
464+
[{ label: 'Light', value: 'light' }],
463465
[{ label: 'Light', value: 'light', option: 2333 }],
464466
);
465467
onChange.mockReset();
@@ -470,8 +472,8 @@ describe('Select.Multiple', () => {
470472
selectItem(container, 0);
471473
expect(onChange).toHaveBeenCalledWith(
472474
[
473-
{ label: 'Light', value: 'light', key: 'light' },
474-
{ label: 'Bamboo', value: 'bamboo', key: 'bamboo' },
475+
{ label: 'Light', value: 'light' },
476+
{ label: 'Bamboo', value: 'bamboo' },
475477
],
476478
[
477479
{ label: 'Light', value: 'light', option: 2333 },

tests/Select.test.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -289,7 +289,7 @@ describe('Select.Basic', () => {
289289

290290
resetWarned();
291291
const { container: container5 } = render(
292-
<Select allowClear clearIcon={<div className="custom-clear-icon">x</div>} value="1">
292+
<Select allowClear={{ clearIcon: <div className="custom-clear-icon">x</div> }} value="1">
293293
<Option value="1">1</Option>
294294
<Option value="2">2</Option>
295295
</Select>,
@@ -298,7 +298,7 @@ describe('Select.Basic', () => {
298298
expect(container5.querySelector('.custom-clear-icon').textContent).toBe('x');
299299

300300
const { container: container6 } = render(
301-
<Select allowClear clearIcon={<div className="custom-clear-icon">x</div>}>
301+
<Select allowClear={{ clearIcon: <div className="custom-clear-icon">x</div> }}>
302302
<Option value="1">1</Option>
303303
<Option value="2">2</Option>
304304
</Select>,
@@ -487,7 +487,7 @@ describe('Select.Basic', () => {
487487
toggleOpen(container);
488488
selectItem(container);
489489
expect(handleChange).toHaveBeenCalledWith(
490-
{ key: '1', value: '1', label: 'One' },
490+
{ value: '1', label: 'One' },
491491
{ children: 'One', key: null, testprop: 'test', value: '1' },
492492
);
493493
});
@@ -508,7 +508,7 @@ describe('Select.Basic', () => {
508508
toggleOpen(container);
509509
selectItem(container);
510510
expect(handleChange).toHaveBeenCalledWith(
511-
{ key: '1', label: 'One', value: '1' },
511+
{ label: 'One', value: '1' },
512512
{ children: 'One', key: null, testprop: 'test', value: '1' },
513513
);
514514
});
@@ -1240,7 +1240,7 @@ describe('Select.Basic', () => {
12401240

12411241
it('does not filter when filterOption value is false', () => {
12421242
const { container } = testingRender(
1243-
<Select inputValue="1" filterOption={false} open>
1243+
<Select searchValue="1" filterOption={false} open>
12441244
<Option value="1">1</Option>
12451245
<Option value="2">2</Option>
12461246
</Select>,
@@ -2330,7 +2330,7 @@ describe('Select.Basic', () => {
23302330
const renderDemo = (props?: any) => (
23312331
<Select
23322332
labelInValue
2333-
value={{ key: 1, label: 'One' }}
2333+
value={{ value: 1, label: 'One' }}
23342334
labelRender={labelRender}
23352335
options={[
23362336
{

tests/shared/removeSelectedTest.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ export default function removeSelectedTest(mode: any) {
5050
const handleChange = jest.fn();
5151
const { container } = render(
5252
<Select
53-
value={[{ key: '1' }, { key: '2' }]}
53+
value={[{ value: '1' }, { value: '2' }]}
5454
onChange={handleChange}
5555
onDeselect={handleDeselect}
5656
labelInValue
@@ -63,12 +63,12 @@ export default function removeSelectedTest(mode: any) {
6363
removeSelection(container);
6464

6565
expect(handleDeselect).toHaveBeenCalledWith(
66-
expect.objectContaining({ key: '1', label: '1' }),
66+
expect.objectContaining({ value: '1', label: '1' }),
6767
expect.objectContaining({ value: '1' }),
6868
);
6969

7070
expect(handleChange).toHaveBeenCalledWith(
71-
[expect.objectContaining({ key: '2', label: '2' })],
71+
[expect.objectContaining({ value: '2', label: '2' })],
7272
[expect.objectContaining({ value: '2' })],
7373
);
7474
});

0 commit comments

Comments
 (0)