nextui-org / tailwind-variants

🦄 Tailwindcss first-class variant API
https://tailwind-variants.org
MIT License
2.04k stars 63 forks source link

Proposal: new syntax for boolean variants #167

Closed GermanJablo closed 3 months ago

GermanJablo commented 3 months ago

I would like to propose the following:

// current
 variants: {
    disabled: {
      true: 'opacity-50 bg-gray-500 pointer-events-none'
    }
  }

// proposal
 variants: {
    disabled: 'opacity-50 bg-gray-500 pointer-events-none',
  }
mskelton commented 3 months ago

This doesn't account for the false case. While the false case can be set as the default and rely on merging, co-locating true/false styles is very useful in many cases. I also don't think this provides enough additional value to warrant making it a first class concept given how complex tailwind-variants already is.

GermanJablo commented 3 months ago

I understand. I started playing with cva and tailwind-variants and whenever I've had a boolean variant I haven't needed to add styles for the "false" case, but I guess it makes sense in many cases.

Feel free to close the issue.