Não faça componentes no CSS a não ser que esteja em html puro, o tailwind foi criado para não ter esse tipo de coisa, não tem abstrações a não ser que seja absolutamente necessário, sempre dê copy paste e use os recursos do editor para mudar alguma coisa, rapidamente vc percebe que isso escala, porque é muito facil mudar apenas aquilo que você quer. E tambem vc sempre ao maximo evitar usar o @apply, foi das piores coisas que ja adicionaram e o proprio desenvolvedor do tailwind se arrependeu, passou muito tempo corrigindo bug ate funcionar mas nao vale a pena.
Se quiser fazer um componente, USE O FRAMEWORK, é muito melhor, pegue as classes e coloca num componente separado de botão com todos os estilos logica e etc, é desse jeito que a documentação diz pra fazer.
Se vc pega e faz classes tipo btn, vc ta jogando todos os beneficios do tailwind no lixo.
2
1
Realmente eu não costumo criar componentes assim, até porque, se fosse o próposito criar estilo separado, como você mesmo falou seria mais fácil usar uma outra biblioteca para isso.
Eu criei assim apenas para facilitar a visualização já que o código iria ficar muito poluido e prejudicar bastante o entendimento.
Mas de qualquer forma eu nem estava sabendo sobre esse problema que você relatou vou deixar ume disclaimer na publicação.