Refs
One of the biggest feature of twc is the automatic forwarding of ref prop. You don't have to worry about it any more.
Usage
Take this component with a forwarded ref.
import * as React from "react";
const Card = React.forwardRef<
HTMLDivElement,
React.HTMLAttributes<HTMLDivElement>
>(({ className, ...props }, ref) => (
<div
ref={ref}
className="rounded-lg border bg-slate-100 text-white shadow-sm"
{...props}
/>
));With twc, the ref prop is automatically forwarded:
const Card = twc.div`rounded-lg border bg-slate-100 text-white shadow-sm`;So you can safely use ref on Card component:
function CardDemo() {
const ref = useRef();
return <Card ref={ref}>TWC is magic!</Card>;
}