callstack / callstack/react-theme-provider

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

Ouverte
#130 2 commentaires 1 réaction 0 personnes assignées Voir sur GitHub
Langage dominant
JavaScript
Étoiles
467
Forks
53
Métriques de merge des PR
Aucune PR mergée en 30 j

Description

Linking with https://github.com/callstack/linaria/issues/893

## 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

```ts
export const Select = () => (

);

const Button = withTheme(styled.button`
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

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par le CodeSandbox reproductible et comparez les cas où Button est utilisé directement ou où withTheme est supprimé. Suivez la manière dont TypeScript infère les props via styled() et withTheme() ; c’est terminé lorsque OptionButton accepte les props présentées sans erreur tout en conservant la composition existante utilisant le thème.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
react, typescript
Domaine
frontend
Type d'issue
Bug
Difficulté
4/5
Temps estimé
3-5 jours
Activité
À l'abandon
Clarté
Plutôt claire
Accessibilité débutants
42/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.