mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-09 18:43:23 +08:00
Code Issues Actions 29 Packages Projects Releases Wiki Activity

fix: radioButton ref type (#44747)

Browse Source 
* fix: radioButton ref

* fix: added radio types test
This commit is contained in:
Aleksei Mamaev 2023-09-12 06:40:53 +03:00 committed by GitHub
parent 242769e0fb
commit 59d38ecea6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 35 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
components/radio/__tests__/type.test.tsx Normal file
View File

@ -0,0 +1,22 @@
import * as React from 'react';
import Radio from '..';
import type { RadioRef } from '..';
describe('Radio.typescript', () => {
it('Radio', () => {
const ref = React.createRef<RadioRef>();
const checkbox = <Radio value ref={ref} />;
expect(checkbox).toBeTruthy();
});
it('Radio.Group', () => {
const group = (
<Radio.Group>
<Radio />
</Radio.Group>
);
expect(group).toBeTruthy();
});
});

5
components/radio/index.ts
View File

@ -1,6 +1,6 @@
import type * as React from 'react';
import Group from './group';
import type { RadioProps } from './interface';
import type { RadioProps, RadioRef } from './interface';
import InternalRadio from './radio';
import Button from './radioButton';
@ -12,11 +12,12 @@ export {
RadioGroupOptionType,
RadioGroupProps,
RadioProps,
RadioRef,
} from './interface';
export { Button, Group };
type CompoundedComponent = React.ForwardRefExoticComponent<
RadioProps & React.RefAttributes<HTMLElement>
RadioProps & React.RefAttributes<RadioRef>
> & {
Group: typeof Group;
Button: typeof Button;

1
components/radio/interface.ts
View File

@ -4,6 +4,7 @@ import type { AbstractCheckboxGroupProps } from '../checkbox/Group';
import type { DisabledType } from '../config-provider/DisabledContext';
import type { SizeType } from '../config-provider/SizeContext';
export type { CheckboxRef as RadioRef } from 'rc-checkbox';
export type RadioGroupButtonStyle = 'outline' | 'solid';
export type RadioGroupOptionType = 'default' | 'button';

9
components/radio/radio.tsx
View File

@ -1,6 +1,5 @@
import * as React from 'react';
import classNames from 'classnames';
import type { CheckboxRef } from 'rc-checkbox';
import RcCheckbox from 'rc-checkbox';
import { composeRef } from 'rc-util/lib/ref';
@ -11,15 +10,15 @@ import { ConfigContext } from '../config-provider';
import DisabledContext from '../config-provider/DisabledContext';
import { FormItemInputContext } from '../form/context';
import RadioGroupContext, { RadioOptionTypeContext } from './context';
import type { RadioChangeEvent, RadioProps } from './interface';
import type { RadioChangeEvent, RadioProps, RadioRef } from './interface';
import useStyle from './style';
const InternalRadio: React.ForwardRefRenderFunction<CheckboxRef, RadioProps> = (props, ref) => {
const InternalRadio: React.ForwardRefRenderFunction<RadioRef, RadioProps> = (props, ref) => {
const groupContext = React.useContext(RadioGroupContext);
const radioOptionTypeContext = React.useContext(RadioOptionTypeContext);
const { getPrefixCls, direction, radio } = React.useContext(ConfigContext);
const innerRef = React.useRef<CheckboxRef>(null);
const innerRef = React.useRef<RadioRef>(null);
const mergedRef = composeRef(ref, innerRef);
const { isFormItemInput } = React.useContext(FormItemInputContext);
@ -104,7 +103,7 @@ const InternalRadio: React.ForwardRefRenderFunction<CheckboxRef, RadioProps> = (
);
};
const Radio = React.forwardRef<CheckboxRef, RadioProps>(InternalRadio);
const Radio = React.forwardRef<RadioRef, RadioProps>(InternalRadio);
if (process.env.NODE_ENV !== 'production') {
Radio.displayName = 'Radio';

11
components/radio/radioButton.tsx
View File

@ -1,24 +1,23 @@
import * as React from 'react';
import type { CheckboxRef } from '../checkbox';
import type { AbstractCheckboxProps } from '../checkbox/Checkbox';
import { ConfigContext } from '../config-provider';
import { RadioOptionTypeContextProvider } from './context';
import type { RadioChangeEvent } from './interface';
import type { RadioChangeEvent, RadioRef } from './interface';
import Radio from './radio';
export type RadioButtonProps = AbstractCheckboxProps<RadioChangeEvent>;
const RadioButton: React.ForwardRefRenderFunction<CheckboxRef, RadioButtonProps> = (props, ref) => {
const RadioButton: React.ForwardRefRenderFunction<RadioRef, RadioButtonProps> = (props, ref) => {
const { getPrefixCls } = React.useContext(ConfigContext);
const { prefixCls: customizePrefixCls, ...radioProps } = props;
const prefixCls = getPrefixCls('radio', customizePrefixCls);
return (
<RadioOptionTypeContextProvider value='button'>
<Radio prefixCls={prefixCls} {...radioProps} type='radio' ref={ref} />
<RadioOptionTypeContextProvider value="button">
<Radio prefixCls={prefixCls} {...radioProps} type="radio" ref={ref} />
</RadioOptionTypeContextProvider>
);
};
export default React.forwardRef<CheckboxRef, RadioButtonProps>(RadioButton);
export default React.forwardRef<RadioRef, RadioButtonProps>(RadioButton);