mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-08-05 15:39:45 +08:00
Code Issues Actions 19 Packages Projects Releases Wiki Activity

fix: Cascader typescript (#33008)

Browse Source 
* chore: Cascsader add missing suffixIcon

* chore: export CascaderRef

* chore: Casacer type
This commit is contained in:
二货机器人 2021-11-24 17:45:13 +08:00 committed by GitHub
parent c1d17fcc82
commit e7ac69edeb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 48 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
components/cascader/__tests__/type.test.tsx
View File

@ -1,5 +1,6 @@
import { mount } from 'enzyme';
import * as React from 'react';
import Cascader from '..';
import Cascader, { BasicDataNode } from '..';
describe('Cascader.typescript', () => {
it('options value', () => {
@ -42,4 +43,35 @@ describe('Cascader.typescript', () => {
expect(result).toBeTruthy();
});
it('suffixIcon', () => {
const wrapper = mount(<Cascader suffixIcon={<span />} />);
expect(wrapper).toBeTruthy();
});
it('Generic', () => {
interface MyOptionData extends BasicDataNode {
customizeLabel: string;
customizeValue: string;
customizeChildren?: MyOptionData[];
}
const wrapper = mount(
<Cascader<MyOptionData>
options={[
{
customizeLabel: 'Bamboo',
customizeValue: 'bamboo',
customizeChildren: [
{
customizeLabel: 'Little',
customizeValue: 'little',
},
],
},
]}
/>,
);
expect(wrapper).toBeTruthy();
});
});

20
components/cascader/index.tsx
View File

@ -2,7 +2,7 @@ import * as React from 'react';
import classNames from 'classnames';
import RcCascader from 'rc-cascader';
import type { CascaderProps as RcCascaderProps } from 'rc-cascader';
import type { ShowSearchType, FieldNames } from 'rc-cascader/lib/interface';
import type { ShowSearchType, FieldNames, DataNode } from 'rc-cascader/lib/interface';
import omit from 'rc-util/lib/omit';
import RightOutlined from '@ant-design/icons/RightOutlined';
import RedoOutlined from '@ant-design/icons/RedoOutlined';
@ -19,6 +19,8 @@ import { getTransitionName } from '../_util/motion';
// - Hover opacity style
// - Search filter match case
export type BasicDataNode = Omit<DataNode, 'label' | 'value' | 'children'>;
export type FieldNamesType = FieldNames;
export type FilledFieldNamesType = Required<FieldNamesType>;
@ -72,18 +74,22 @@ const defaultSearchRender: ShowSearchType['render'] = (inputValue, path, prefixC
return optionList;
};
export interface CascaderProps extends Omit<RcCascaderProps, 'checkable'> {
export interface CascaderProps<DataNodeType>
extends Omit<RcCascaderProps, 'checkable' | 'options'> {
multiple?: boolean;
size?: SizeType;
bordered?: boolean;
suffixIcon?: React.ReactNode;
options?: DataNodeType[];
}
interface CascaderRef {
export interface CascaderRef {
focus: () => void;
blur: () => void;
}
const Cascader = React.forwardRef((props: CascaderProps, ref: React.Ref<CascaderRef>) => {
const Cascader = React.forwardRef((props: CascaderProps<any>, ref: React.Ref<CascaderRef>) => {
const {
prefixCls: customizePrefixCls,
size: customizeSize,
@ -225,7 +231,11 @@ const Cascader = React.forwardRef((props: CascaderProps, ref: React.Ref<Cascader
ref={ref}
/>
);
});
}) as (<DataNodeType extends BasicDataNode | DataNode = DataNode>(
props: React.PropsWithChildren<CascaderProps<DataNodeType>> & { ref?: React.Ref<CascaderRef> },
) => React.ReactElement) & {
displayName: string;
};
Cascader.displayName = 'Cascader';