TTC
Theo's Typesafe Cult•2y ago
dinislam

shadcn/ui is unusable due to Type Errors

Hey folks! I'm trying to use shadcn/ui for a project and keep on running into type error in many components. These are components written by shadcn and not my code. Example with the Dialog: 
Type 'ForwardRefExoticComponent<DialogDescriptionProps & RefAttributes<HTMLParagraphElement>>' does not satisfy the constraint 'keyof IntrinsicElements | ForwardRefExoticComponent<any> | (new (props: any) => Component<any, {}, any>) | ((props: any, context?: any) => ReactElement<...> | null)'.
  Type 'ForwardRefExoticComponent<DialogDescriptionProps & RefAttributes<HTMLParagraphElement>>' is not assignable to type 'ForwardRefExoticComponent<any>'.
    Type 'ReactNode' is not assignable to type 'ReactElement<any, string | JSXElementConstructor<any>> | null'.ts(2344)
Type 'ForwardRefExoticComponent<DialogDescriptionProps & RefAttributes<HTMLParagraphElement>>' does not satisfy the constraint 'keyof IntrinsicElements | ForwardRefExoticComponent<any> | (new (props: any) => Component<any, {}, any>) | ((props: any, context?: any) => ReactElement<...> | null)'.
  Type 'ForwardRefExoticComponent<DialogDescriptionProps & RefAttributes<HTMLParagraphElement>>' is not assignable to type 'ForwardRefExoticComponent<any>'.
    Type 'ReactNode' is not assignable to type 'ReactElement<any, string | JSXElementConstructor<any>> | null'.ts(2344)
A similar error exists in many others. Seems to be a pattern in using forwardRef with Radix components. Any idea on how to fix?
1 Reply
dinislam
dinislamOP•2y ago
This seems to be fixed by updating react react-dom @types/react @types/react-dom and @types/node to latest

Did you find this page helpful?