Closed Mad-Kat closed 2 months ago
The latest updates on your projects. Learn more about Vercel for Git ↗︎
Name | Status | Preview | Comments | Updated (UTC) |
---|---|---|---|---|
next-yak-benchmark | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 24, 2024 11:17am |
yacijs | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 24, 2024 11:17am |
Comparing fix-composition-types
(ef119e8) with main
(7b0de33)
✅ 2
untouched benchmarks
Just checked and styled-component seems to behave the same: https://stackblitz.com/edit/vitejs-vite-vttcyb?file=src%2Fmain.tsx,src%2FApp.tsx&terminal=dev
I adjusted the tests and added @ts-expect-error
Yeah I think you need to write it like this:
const Parent = styled.div<{ $colorMe: boolean }>`
${Child} {
color: blue;
}
color: ${({ $colorMe }) => $colorMe ? `blue` : `red`};
`;
you have to add the type parameter in order to say that $colorMe
exists. It doesn't automatically infer it from the functions you provide.
released as 0.2.2
Fixes #72
Use
NoInfer<T>
in order to be explicit for the tagged template literal types and not inferring them from the functions that are used for dynamic props or child components.Added bonus: The destructuring of the props in the tagged template literal gives you now type hints, as TypeScript doesn't want to infer it dynamically and the type is known when you start with the literal.