Skip to content

Commit 5851494

Browse files
aojunhao123aojunhao123
committed
refactor: update prop names and remove deprecated props
1 parent 51a9215 commit 5851494

File tree

10 files changed

+43
-74
lines changed

10 files changed

+43
-74
lines changed

‎examples/visible.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ const addressOptions = [
5959

6060
const Demo = () => {
6161
const [value, setValue] = useState<string[]>([]);
62-
const [popupVisible, setPopupVisible] = useState(false);
62+
const [open, setOpen] = useState(false);
6363

6464
const getLabel = () => {
6565
return arrayTreeFilter(addressOptions, (o, level) => o.value === value[level])
@@ -69,10 +69,10 @@ const Demo = () => {
6969

7070
return (
7171
<Cascader
72-
popupVisible={popupVisible}
72+
open={open}
7373
value={value}
7474
options={addressOptions}
75-
onPopupVisibleChange={open => setPopupVisible(open)}
75+
onPopupVisibleChange={open => setOpen(open)}
7676
onChange={value => setValue(value)}
7777
>
7878
<input value={getLabel()} readOnly />

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@
5555
"@types/classnames": "^2.2.6",
5656
"@types/enzyme": "^3.1.15",
5757
"@types/jest": "^29.4.0",
58-
"@types/react": "^17.0.38",
58+
"@types/react": "^18.0.38",
5959
"@types/react-dom": "^18.0.11",
6060
"@types/warning": "^3.0.0",
6161
"@umijs/fabric": "^4.0.0",

‎src/Cascader.tsx‎

Lines changed: 24 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ import {
2424
toRawValues,
2525
} from './utils/commonUtil';
2626
import { formatStrategyValues, toPathOptions } from './utils/treeUtil';
27-
import warningProps, { warningNullOptions } from './utils/warningPropsUtil';
27+
import { warningNullOptions } from './utils/warningPropsUtil';
2828

2929
export interface BaseOptionType {
3030
disabled?: boolean;
@@ -67,9 +67,9 @@ interface BaseCascaderProps<
6767
OptionType extends DefaultOptionType = DefaultOptionType,
6868
ValueField extends keyof OptionType = keyof OptionType,
6969
> extends Omit<
70-
BaseSelectPropsWithoutPrivate,
71-
'tokenSeparators' | 'labelInValue' | 'mode' | 'showSearch'
72-
> {
70+
BaseSelectPropsWithoutPrivate,
71+
'tokenSeparators' | 'labelInValue' | 'mode' | 'showSearch'
72+
> {
7373
// MISC
7474
id?: string;
7575
prefixCls?: string;
@@ -95,18 +95,14 @@ interface BaseCascaderProps<
9595
// Options
9696
options?: OptionType[];
9797
/** @private Internal usage. Do not use in your production. */
98-
dropdownPrefixCls?: string;
98+
popupPrefixCls?: string;
9999
loadData?: (selectOptions: OptionType[]) => void;
100100

101-
// Open
102-
/** @deprecated Use `open` instead */
103-
popupVisible?: boolean;
104-
105101
popupClassName?: string;
102+
/** @deprecated Use `popupMenuColumnStyle` instead */
106103
dropdownMenuColumnStyle?: React.CSSProperties;
104+
popupMenuColumnStyle?: React.CSSProperties;
107105

108-
/** @deprecated Use `placement` instead */
109-
popupPlacement?: Placement;
110106
placement?: Placement;
111107
builtinPlacements?: BuildInPlacements;
112108

@@ -131,8 +127,8 @@ export type ValueType<
131127
ValueField extends keyof OptionType = keyof OptionType,
132128
> = keyof OptionType extends ValueField
133129
? unknown extends OptionType['value']
134-
? OptionType[ValueField]
135-
: OptionType['value']
130+
? OptionType[ValueField]
131+
: OptionType['value']
136132
: OptionType[ValueField];
137133

138134
export type GetValueType<
@@ -201,18 +197,16 @@ const Cascader = React.forwardRef<CascaderRef, InternalCascaderProps>((props, re
201197

202198
// Options
203199
options,
204-
dropdownPrefixCls,
200+
popupPrefixCls,
205201
loadData,
206202

207-
// Open
208-
popupVisible,
209203
open,
210204

211205
popupClassName,
212206
dropdownMenuColumnStyle,
207+
popupMenuColumnStyle,
213208
popupStyle: customPopupStyle,
214209

215-
popupPlacement,
216210
placement,
217211

218212
onPopupVisibleChange,
@@ -272,7 +266,7 @@ const Cascader = React.forwardRef<CascaderRef, InternalCascaderProps>((props, re
272266
mergedSearchValue,
273267
mergedOptions,
274268
mergedFieldNames,
275-
dropdownPrefixCls || prefixCls,
269+
popupPrefixCls || prefixCls,
276270
searchConfig,
277271
changeOnSelect || multiple,
278272
);
@@ -365,19 +359,14 @@ const Cascader = React.forwardRef<CascaderRef, InternalCascaderProps>((props, re
365359
onInternalSelect(valueCells);
366360
};
367361

368-
// ============================ Open ============================
369-
const mergedOpen = open !== undefined ? open : popupVisible;
370-
371-
372-
const mergedPlacement = placement || popupPlacement;
373-
374362
const onInternalPopupVisibleChange = (nextVisible: boolean) => {
375363
onPopupVisibleChange?.(nextVisible);
376364
};
377365

366+
const mergedPopupMenuColumnStyle = popupMenuColumnStyle || dropdownMenuColumnStyle;
367+
378368
// ========================== Warning ===========================
379369
if (process.env.NODE_ENV !== 'production') {
380-
warningProps(props);
381370
warningNullOptions(mergedOptions, mergedFieldNames);
382371
}
383372

@@ -392,12 +381,12 @@ const Cascader = React.forwardRef<CascaderRef, InternalCascaderProps>((props, re
392381
onSelect: onInternalSelect,
393382
checkable,
394383
searchOptions,
395-
dropdownPrefixCls,
384+
popupPrefixCls,
396385
loadData,
397386
expandTrigger,
398387
expandIcon,
399388
loadingIcon,
400-
dropdownMenuColumnStyle,
389+
popupMenuColumnStyle: mergedPopupMenuColumnStyle,
401390
optionRender,
402391
}),
403392
[
@@ -409,12 +398,12 @@ const Cascader = React.forwardRef<CascaderRef, InternalCascaderProps>((props, re
409398
onInternalSelect,
410399
checkable,
411400
searchOptions,
412-
dropdownPrefixCls,
401+
popupPrefixCls,
413402
loadData,
414403
expandTrigger,
415404
expandIcon,
416405
loadingIcon,
417-
dropdownMenuColumnStyle,
406+
mergedPopupMenuColumnStyle,
418407
optionRender,
419408
],
420409
);
@@ -427,12 +416,12 @@ const Cascader = React.forwardRef<CascaderRef, InternalCascaderProps>((props, re
427416
const popupStyle: React.CSSProperties =
428417
// Search to match width
429418
(mergedSearchValue && searchConfig.matchInputWidth) ||
430-
// Empty keep the width
431-
emptyOptions
419+
// Empty keep the width
420+
emptyOptions
432421
? {}
433422
: {
434-
minWidth: 'auto',
435-
};
423+
minWidth: 'auto',
424+
};
436425

437426
return (
438427
<CascaderContext.Provider value={cascaderContext}>
@@ -460,9 +449,9 @@ const Cascader = React.forwardRef<CascaderRef, InternalCascaderProps>((props, re
460449
OptionList={OptionList}
461450
emptyOptions={emptyOptions}
462451
// Open
463-
open={mergedOpen}
452+
open={open}
464453
popupClassName={popupClassName}
465-
placement={mergedPlacement}
454+
placement={placement}
466455
onPopupVisibleChange={onInternalPopupVisibleChange}
467456
// Children
468457
getRawInputElement={() => children as React.ReactElement}

‎src/OptionList/Column.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ export default function Column<OptionType extends DefaultOptionType = DefaultOpt
5050
expandTrigger,
5151
expandIcon,
5252
loadingIcon,
53-
dropdownMenuColumnStyle,
53+
popupMenuColumnStyle,
5454
optionRender,
5555
} = React.useContext(CascaderContext);
5656

@@ -155,7 +155,7 @@ export default function Column<OptionType extends DefaultOptionType = DefaultOpt
155155
[`${menuItemPrefixCls}-disabled`]: isOptionDisabled(disabled),
156156
[`${menuItemPrefixCls}-loading`]: isLoading,
157157
})}
158-
style={dropdownMenuColumnStyle}
158+
style={popupMenuColumnStyle}
159159
role="menuitemcheckbox"
160160
title={title}
161161
aria-checked={checked}

‎src/OptionList/List.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -54,12 +54,12 @@ const RawOptionList = React.forwardRef<RefOptionListProps, RawOptionListProps>((
5454
changeOnSelect,
5555
onSelect,
5656
searchOptions,
57-
dropdownPrefixCls,
57+
popupPrefixCls,
5858
loadData,
5959
expandTrigger,
6060
} = React.useContext(CascaderContext);
6161

62-
const mergedPrefixCls = dropdownPrefixCls || prefixCls;
62+
const mergedPrefixCls = popupPrefixCls || prefixCls;
6363

6464
// ========================= loadData =========================
6565
const [loadingKeys, setLoadingKeys] = React.useState<React.Key[]>([]);

‎src/Panel.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -153,12 +153,12 @@ export default function Panel<
153153
onSelect: onInternalSelect,
154154
checkable,
155155
searchOptions: [],
156-
dropdownPrefixCls: undefined,
156+
popupPrefixCls: undefined,
157157
loadData,
158158
expandTrigger,
159159
expandIcon,
160160
loadingIcon,
161-
dropdownMenuColumnStyle: undefined,
161+
popupMenuColumnStyle: undefined,
162162
}),
163163
[
164164
mergedOptions,

‎src/context.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,12 @@ export interface CascaderContextProps {
1515
onSelect: (valuePath: SingleValueType) => void;
1616
checkable?: boolean | React.ReactNode;
1717
searchOptions: DefaultOptionType[];
18-
dropdownPrefixCls?: string;
18+
popupPrefixCls?: string;
1919
loadData?: (selectOptions: DefaultOptionType[]) => void;
2020
expandTrigger?: 'hover' | 'click';
2121
expandIcon?: React.ReactNode;
2222
loadingIcon?: React.ReactNode;
23-
dropdownMenuColumnStyle?: React.CSSProperties;
23+
popupMenuColumnStyle?: React.CSSProperties;
2424
optionRender?: CascaderProps['optionRender'];
2525
}
2626

‎src/utils/warningPropsUtil.ts‎

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,5 @@
11
import warning from '@rc-component/util/lib/warning';
2-
import type { DefaultOptionType, FieldNames, InternalCascaderProps } from '../Cascader';
3-
4-
function warningProps(props: InternalCascaderProps) {
5-
const { popupVisible, popupPlacement } = props;
6-
7-
warning(popupVisible === undefined, '`popupVisible` is deprecated. Please use `open` instead.');
8-
warning(
9-
popupPlacement === undefined,
10-
'`popupPlacement` is deprecated. Please use `placement` instead.',
11-
);
12-
}
2+
import type { DefaultOptionType, FieldNames } from '../Cascader';
133

144
// value in Cascader options should not be null
155
export function warningNullOptions(options: DefaultOptionType[], fieldNames: FieldNames) {
@@ -35,5 +25,3 @@ export function warningNullOptions(options: DefaultOptionType[], fieldNames: Fie
3525
recursiveOptions(options);
3626
}
3727
}
38-
39-
export default warningProps;

‎tests/index.spec.tsx‎

Lines changed: 5 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -514,28 +514,20 @@ describe('Cascader.Basic', () => {
514514
expect(wrapper.isOpen()).toBeTruthy();
515515
});
516516

517-
it('warning popupVisible & onPopupVisibleChange & popupClassName', () => {
517+
it('warning onPopupVisibleChange & popupClassName', () => {
518518
resetWarned();
519519
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
520520
const onPopupVisibleChange = jest.fn();
521521
const wrapper = mount(
522522
<Cascader
523-
popupVisible
523+
open
524524
onPopupVisibleChange={onPopupVisibleChange}
525525
popupClassName="legacy-cls"
526-
popupPlacement="topRight"
526+
placement="topRight"
527527
/>,
528528
);
529529

530-
expect(errorSpy).toHaveBeenCalledWith(
531-
'Warning: `popupVisible` is deprecated. Please use `open` instead.',
532-
);
533-
expect(errorSpy).toHaveBeenCalledWith(
534-
'Warning: `popupPlacement` is deprecated. Please use `placement` instead.',
535-
);
536-
537530
expect(wrapper.exists('.legacy-cls')).toBeTruthy();
538-
expect(wrapper.find('Trigger').prop('popupPlacement')).toEqual('topRight');
539531

540532
errorSpy.mockRestore();
541533
});
@@ -604,7 +596,7 @@ describe('Cascader.Basic', () => {
604596
},
605597
];
606598
const wrapper = mount(
607-
<Cascader options={options} popupVisible>
599+
<Cascader options={options} open>
608600
<input readOnly />
609601
</Cascader>,
610602
);
@@ -616,7 +608,7 @@ describe('Cascader.Basic', () => {
616608
const wrapper = mount(
617609
<Cascader
618610
options={addressOptions}
619-
popupVisible
611+
open
620612
popupRender={menus => (
621613
<div className="custom-dropdown">
622614
{menus}

‎tests/private.spec.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ describe('Cascader.Private', () => {
2121
]}
2222
open
2323
prefixCls="bamboo"
24-
dropdownPrefixCls="little"
24+
popupPrefixCls="little"
2525
/>,
2626
);
2727

0 commit comments

Comments
 (0)