tailwind-variants
tailwind-variants copied to clipboard
Using compondVariants with slots and defaultVariants breaks
Describe the bug
Using tailwind-variants with slots, compoundVariants, defaultVariants and explicitly passing the variants as undefined breaks.
To Reproduce
import { tv } from "tailwind-variants";
const variants = tv({
slots: {
root: "",
},
variants: {
variant: {
solid: {},
},
orientation: {
horizontal: {
root: "",
},
},
},
compoundVariants: [
{
orientation: "horizontal",
variant: "solid",
className: {
root: "border-b",
},
},
],
defaultVariants: {
orientation: "horizontal",
variant: "solid",
},
});
const { root } = variants();
console.log(root({})) // Output: "border-b"
console.log(root({ orientation: undefined, variant: undefined })) // Output: ""
Expected behavior It should use the defaultVariants
Desktop (please complete the following information):
- OS: Windows 11
- Browser Chrome 131
- Version 0.31
Smartphone (please complete the following information):
- Device: [e.g. iPhone6]
- OS: [e.g. iOS8.1]
- Browser [e.g. stock browser, safari]
- Version [e.g. 22]
Additional context Add any other context about the problem here.