Compound variants are lost when extending multiple times
benjamincanac opened this issue · 2 comments
benjamincanac commented
Describe the bug
When extending tv
objects in cascade, the compoundVariants
gets lost.
To Reproduce
import { tv } from 'tailwind-variants'
const themeButton = tv({
base: 'font-medium',
variants: {
color: {
primary: 'text-blue-500'
},
disabled: {
true: 'opacity-50'
}
},
compoundVariants: [{
color: 'primary',
disabled: true,
class: 'bg-black'
}],
defaultVariants: {
color: 'primary',
disabled: true
}
})
const appButton = tv({ extend: themeButton })
const button = tv({ extend: appButton })
console.log('appButton', appButton())
// -> font-medium text-blue-500 opacity-50 bg-black
console.log('button', button())
// -> font-medium text-blue-500 opacity-50
Expected behavior
The appButton
and button
function calls should have the same results.
Desktop (please complete the following information):
- OS: Mac
- Browser: Chrome
jrgarciadev commented
@mskelton could you please take a look at this?
mskelton commented
@jrgarciadev PR opened to fix this #170