linaria icon indicating copy to clipboard operation
linaria copied to clipboard

TS doesn't see props after «styled()» of «withTheme(styled.button`...`)»

Open Opty1712 opened this issue 4 years ago • 0 comments

Linking with https://github.com/callstack/react-theme-provider/issues/130

Environment

  • macOS Monterrey
  • yarn 3 (PnP)
  • TS 4.5.2
  • "@linaria/core": "^3.0.0-beta.15",
  • "@linaria/react": "^3.0.0-beta.15",
  • "@linaria/babel-preset": "^3.0.0-beta.15",
  • "@linaria/shaker": "^3.0.0-beta.15",
  • "@linaria/webpack-loader": "^3.0.0-beta.16",
  • "@callstack/react-theme-provider": "^3.0.7",
  • bundler - storybook@6
  • node 14.17.6

Description

export const Select = () => (
	<OptionButton type="button" data-qa-id="listItem-btn" />
);

const Button = withTheme(styled.button<Theme>`
	width: 100%;
`);

export const OptionButton = styled(Button)`
	width: 50%;
`;
```	
![image](https://user-images.githubusercontent.com/14236476/147383113-585a732c-c430-457d-ab9e-1887d8d3836b.png)

![image](https://user-images.githubusercontent.com/14236476/147383138-1f1174a0-703f-40e8-b648-d2fc0fec343a.png)


If I add Button directly - no error
![image](https://user-images.githubusercontent.com/14236476/147383131-b47c084e-e3f2-41b7-b542-62f6f029881d.png)

If I remove `withTheme` - no error too
![image](https://user-images.githubusercontent.com/14236476/147383160-57b5fdb7-da88-481e-a422-e39773c13036.png)

## Reproducible Demo

https://codesandbox.io/s/wild-grass-g4e0u?file=/src/App.tsx

Opty1712 avatar Dec 25 '21 10:12 Opty1712