search

gregberge / twc

Create reusable React + Tailwind CSS components in one line ✨
https://react-twc.vercel.app
MIT License
1.35k stars 31 forks source link

fix: fix generic typings #13

Closed mastondzn closed 10 months ago

mastondzn commented 10 months ago

Summary

Fixes #12 The problem with the current generic usage, right now it rewrites the props entirely and potentially makes the composed component unsafe, (by passing props that the component would not accept otherwise) in my opinion the generic should not rewrite the entire type, and instead the types of the component's props should still exist no matter if the user includes them or not.

Test plan

Most of the tests worked as expected, added a test for cva and asChild usage updated some comments

vercel[bot] commented 10 months ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
twc ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 22, 2023 8:20pm
gregberge commented 10 months ago

Hi @mastondzn, I understand the problem you raised but I am not sure it solves it completely. Some use cases like reducing the API surface are no longer possible:

Creating a component that does not accept any props:

twc.div<Record<string, never>>`flex`

Creating a component that does not accept asChild prop:

twc.div<Omit<ComponentProps<"div">, "asChild">>`flex`

But what should not be possible is passing wrong props, I don't know if it is possible to ensure that. For example, this should throw a type error because the asChild prop is not compatible with the asChild prop of the underlying component.

 twc.div<{ asChild: string }>`flex`

What do you think?