Problem: I have types problem using Ant Design with Styled Components, especially with Progress component. I have "@types/styled-components": "^5.1.24". Looks like Progress component is not a component like Button or Input from Ant Design.
Code in editor:
import styled from "styled-components";
import { Progress, Button } from 'antd'
export const StyledProgress = styled(Progress)`` // error
export const StyledButton = styled(Button)`` // ok
Error code:
TS2769: No overload matches this call.
Overload 1 of 2, '(component: AnyStyledComponent): ThemedStyledFunction<any, DefaultTheme, any, any>', gave the following error.
Argument of type 'typeof Progress' is not assignable to parameter of type 'AnyStyledComponent'.
I solved this by
export const StyledProgress = styled(Progress as unknown as AnyStyledComponent)``
But I think its kinda weird
Error example on the screen below
Expected: Progress component works with styled-components like any other component from Ant Design
Received: Type Error for Progress component
Question: Could you tell me please how to solve this problem without this manipulation?