Skip to content

Commit 41aab7b

Browse files
Viraj-10Viraj-10
committed
fix: ref typing for all unstyled
1 parent 420ade4 commit 41aab7b

File tree

27 files changed

+198
-490
lines changed

27 files changed

+198
-490
lines changed

‎packages/unstyled/alert-dialog/src/types.ts‎

Lines changed: 15 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import React from 'react';
2+
13
export interface InterfaceAlertDialogProps {
24
/**
35
* If true, the AlertDialog will open. Useful for controllable state behaviour
@@ -47,7 +49,7 @@ export interface InterfaceAlertDialogProps {
4749
* @default false
4850
*/
4951
useRNModal?: boolean;
50-
children?: any;
52+
children?: React.ReactNode;
5153
}
5254

5355
export interface IAlertDialogContentProps {
@@ -67,28 +69,32 @@ export type IAlertDialogComponentType<
6769
StyledAlertDialogBody,
6870
StyledAlertDialogBackdrop
6971
> = React.ForwardRefExoticComponent<
70-
React.RefAttributes<StyledAlertDialog> & StyledAlertDialog & IAlertDialogProps
72+
React.RefAttributes<StyledAlertDialog> &
73+
React.PropsWithoutRef<StyledAlertDialog & IAlertDialogProps>
7174
> & {
7275
Content: React.ForwardRefExoticComponent<
7376
React.RefAttributes<StyledAlertDialogContent> &
74-
IAlertDialogContentProps &
75-
StyledAlertDialogContent
77+
React.PropsWithoutRef<IAlertDialogContentProps & StyledAlertDialogContent>
7678
>;
7779
CloseButton: React.ForwardRefExoticComponent<
7880
React.RefAttributes<StyledAlertDialogCloseButton> &
79-
StyledAlertDialogCloseButton
81+
React.PropsWithoutRef<StyledAlertDialogCloseButton>
8082
>;
8183
Header: React.ForwardRefExoticComponent<
82-
React.RefAttributes<StyledAlertDialogHeader> & StyledAlertDialogHeader
84+
React.RefAttributes<StyledAlertDialogHeader> &
85+
React.PropsWithoutRef<StyledAlertDialogHeader>
8386
>;
8487
Footer: React.ForwardRefExoticComponent<
85-
React.RefAttributes<StyledAlertDialogFooter> & StyledAlertDialogFooter
88+
React.RefAttributes<StyledAlertDialogFooter> &
89+
React.PropsWithoutRef<StyledAlertDialogFooter>
8690
>;
8791
Body: React.ForwardRefExoticComponent<
88-
React.RefAttributes<StyledAlertDialogBody> & StyledAlertDialogBody
92+
React.RefAttributes<StyledAlertDialogBody> &
93+
React.PropsWithoutRef<StyledAlertDialogBody>
8994
>;
9095
Backdrop: React.ForwardRefExoticComponent<
91-
React.RefAttributes<StyledAlertDialogBackdrop> & StyledAlertDialogBackdrop
96+
React.RefAttributes<StyledAlertDialogBackdrop> &
97+
React.PropsWithoutRef<StyledAlertDialogBackdrop>
9298
>;
9399
};
94100

‎packages/unstyled/alert/src/types.ts‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,22 @@
1+
import React from 'react';
12
import type { ViewProps } from 'react-native';
23

34
export interface InterfaceAlertProps extends ViewProps {
4-
children?: JSX.Element | Array<JSX.Element>;
5+
children?: React.ReactNode;
56
}
67

78
export type IAlertComponentType<StyledAlert, StyledAlertText, StyledAlertIcon> =
89
React.ForwardRefExoticComponent<
9-
React.RefAttributes<StyledAlert> & StyledAlert & InterfaceAlertProps
10+
React.RefAttributes<StyledAlert> &
11+
React.PropsWithoutRef<StyledAlert & InterfaceAlertProps>
1012
> & {
1113
Text: React.ForwardRefExoticComponent<
12-
React.RefAttributes<StyledAlertText> & StyledAlertText
14+
React.RefAttributes<StyledAlertText> &
15+
React.PropsWithoutRef<StyledAlertText>
1316
>;
1417
Icon: React.ForwardRefExoticComponent<
15-
React.RefAttributes<StyledAlertIcon> & StyledAlertIcon
18+
React.RefAttributes<StyledAlertIcon> &
19+
React.PropsWithoutRef<StyledAlertIcon>
1620
>;
1721
};
1822

‎packages/unstyled/avatar/src/types.ts‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -15,19 +15,22 @@ export type IAvatarComponentType<
1515
ImageProps,
1616
FallbackTextProps
1717
> = React.ForwardRefExoticComponent<
18-
IAvatarProps & AvatarProps & React.RefAttributes<AvatarProps>
18+
React.PropsWithoutRef<IAvatarProps & AvatarProps> &
19+
React.RefAttributes<AvatarProps>
1920
> & {
2021
Badge: React.ForwardRefExoticComponent<
21-
BadgeProps & React.RefAttributes<BadgeProps>
22+
React.PropsWithoutRef<BadgeProps> & React.RefAttributes<BadgeProps>
2223
>;
2324
Group: React.ForwardRefExoticComponent<
24-
GroupProps & React.RefAttributes<GroupProps> & IAvatarGroupProps
25+
React.PropsWithoutRef<GroupProps & IAvatarGroupProps> &
26+
React.RefAttributes<GroupProps>
2527
>;
2628
Image: React.ForwardRefExoticComponent<
27-
ImageProps & React.RefAttributes<ImageProps>
29+
React.PropsWithoutRef<ImageProps> & React.RefAttributes<ImageProps>
2830
>;
2931
FallbackText: React.ForwardRefExoticComponent<
30-
FallbackTextProps & React.RefAttributes<FallbackTextProps>
32+
React.PropsWithoutRef<FallbackTextProps> &
33+
React.RefAttributes<FallbackTextProps>
3134
>;
3235
};
3336

‎packages/unstyled/checkbox/src/types.ts‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,15 +25,19 @@ export interface ICheckboxGroup {
2525

2626
export type ICheckboxComponentType<Root, Indicator, Icon, Label, Group> =
2727
React.ForwardRefExoticComponent<
28-
React.RefAttributes<Root> & Root & InterfaceCheckbox
28+
React.RefAttributes<Root> & React.PropsWithoutRef<Root> & InterfaceCheckbox
2929
> & {
3030
Indicator: React.ForwardRefExoticComponent<
31-
React.RefAttributes<Indicator> & Indicator
31+
React.RefAttributes<Indicator> & React.PropsWithoutRef<Indicator>
32+
>;
33+
Icon: React.ForwardRefExoticComponent<
34+
React.RefAttributes<Icon> & React.PropsWithoutRef<Icon>
35+
>;
36+
Label: React.ForwardRefExoticComponent<
37+
React.RefAttributes<Label> & React.PropsWithoutRef<Label>
3238
>;
33-
Icon: React.ForwardRefExoticComponent<React.RefAttributes<Icon> & Icon>;
34-
Label: React.ForwardRefExoticComponent<React.RefAttributes<Label> & Label>;
3539
Group: React.ForwardRefExoticComponent<
36-
React.RefAttributes<Group> & Group & ICheckboxGroup
40+
React.RefAttributes<Group> & React.PropsWithoutRef<Group> & ICheckboxGroup
3741
>;
3842
};
3943

‎packages/unstyled/divider/src/index.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import type React from 'react';
22
import { Divider as DividerMain } from './Divider';
3+
import { IDividerComponentType } from './types';
34

45
export function createDivider<DividerProps>({
56
Root,
@@ -8,5 +9,5 @@ export function createDivider<DividerProps>({
89
}) {
910
const Divider = DividerMain(Root);
1011
Divider.displayName = 'Divider';
11-
return Divider;
12+
return Divider as IDividerComponentType<DividerProps>;
1213
}

‎packages/unstyled/divider/src/types.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,7 @@ export interface InterfaceDivider {
44
}
55

66
export type IDividerProps = InterfaceDivider;
7+
8+
export type IDividerComponentType<Root> = React.ForwardRefExoticComponent<
9+
React.RefAttributes<Root> & React.PropsWithoutRef<Root>
10+
>;

‎packages/unstyled/fab/src/types.ts‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,12 +33,15 @@ export interface InterfaceFabProps {
3333

3434
export type IFabComponentType<StyledFab, StyledFabLabel, StyledFabIcon> =
3535
React.ForwardRefExoticComponent<
36-
StyledFab & InterfaceFabProps & React.RefAttributes<StyledFab>
36+
React.PropsWithoutRef<StyledFab> &
37+
InterfaceFabProps &
38+
React.RefAttributes<StyledFab>
3739
> & {
3840
Label: React.ForwardRefExoticComponent<
39-
StyledFabLabel & React.RefAttributes<StyledFabLabel>
41+
React.PropsWithoutRef<StyledFabLabel> &
42+
React.RefAttributes<StyledFabLabel>
4043
>;
4144
Icon: React.ForwardRefExoticComponent<
42-
StyledFabIcon & React.RefAttributes<StyledFabIcon>
45+
React.PropsWithoutRef<StyledFabIcon> & React.RefAttributes<StyledFabIcon>
4346
>;
4447
};

‎packages/unstyled/form-control/src/types.tsx‎

Lines changed: 27 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -36,16 +36,35 @@ export type IFormControlComponentType<
3636
_LabelAstrick,
3737
Helper,
3838
HelperText
39-
> = React.ForwardRefExoticComponent<Root & InterfaceFormControlProps> & {
40-
Error: React.ForwardRefExoticComponent<Error> & {
41-
Text: React.ForwardRefExoticComponent<ErrorText>;
42-
Icon: React.ForwardRefExoticComponent<ErrorIcon>;
39+
> = React.ForwardRefExoticComponent<
40+
InnerForwardRefExoticComponent<Root> & InterfaceFormControlProps
41+
> & {
42+
Error: React.ForwardRefExoticComponent<
43+
InnerForwardRefExoticComponent<Error>
44+
> & {
45+
Text: React.ForwardRefExoticComponent<
46+
InnerForwardRefExoticComponent<ErrorText>
47+
>;
48+
Icon: React.ForwardRefExoticComponent<
49+
InnerForwardRefExoticComponent<ErrorIcon>
50+
>;
4351
};
44-
Label: React.ForwardRefExoticComponent<Label> & {
45-
Text: React.ForwardRefExoticComponent<LabelText>;
52+
Label: React.ForwardRefExoticComponent<
53+
InnerForwardRefExoticComponent<Label>
54+
> & {
55+
Text: React.ForwardRefExoticComponent<
56+
InnerForwardRefExoticComponent<LabelText>
57+
>;
4658
};
47-
Helper: React.ForwardRefExoticComponent<Helper> & {
48-
Text: React.ForwardRefExoticComponent<HelperText>;
59+
Helper: React.ForwardRefExoticComponent<
60+
InnerForwardRefExoticComponent<Helper>
61+
> & {
62+
Text: React.ForwardRefExoticComponent<
63+
InnerForwardRefExoticComponent<HelperText>
64+
>;
4965
};
5066
};
5167
export type IFormControlProps = InterfaceFormControlProps;
68+
69+
type InnerForwardRefExoticComponent<T> = React.PropsWithoutRef<T> &
70+
React.RefAttributes<T>;

‎packages/unstyled/hstack/src/types.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,3 +6,7 @@ export interface IHStackProps extends ViewProps {
66
ref?: any;
77
children?: any;
88
}
9+
10+
export type IHStackComponentType<Root> = React.ForwardRefExoticComponent<
11+
React.RefAttributes<Root> & React.PropsWithoutRef<Root> & IHStackProps
12+
>;

‎packages/unstyled/image/src/types.ts‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,14 @@
1+
import React from 'react';
12
import type { ImageSourcePropType } from 'react-native';
23
export interface IImageProps {
34
source?: ImageSourcePropType | string;
45
alt?: string;
56
}
67

78
export type IImageComponentType<StyledImage> = React.ForwardRefExoticComponent<
8-
IImageProps & Omit<StyledImage, 'source' | 'alt'>
9+
IImageProps &
10+
InnerForwardRefExoticComponent<Omit<StyledImage, 'source' | 'alt'>>
911
>;
12+
13+
type InnerForwardRefExoticComponent<T> = React.PropsWithoutRef<T> &
14+
React.RefAttributes<T>;

0 commit comments

Comments
 (0)