Solid
@tw-classed/solid
is a library that allows you to create classed components in Solid.js
. It has 1-1 API parity with @tw-classed/react
, but with Solid specific internals. Follow the React guide to learn more about the API.
Installation
pnpm add @tw-classed/solid
Usage
import { classed } from "@tw-classed/solid";
const Button = classed.button("flex items-center", {
variants: {
size: {
1: "px-2 py-1 text-sm",
2: "px-4 py-2 text-base",
3: "px-6 py-3 text-lg",
},
color: {
blue: "bg-blue-300",
red: "bg-red-300",
},
},
});
In your App
() => (
<Button size="2" color="blue" class="some-extra-classes..">
Click me
</Button>
);