Feature/twmerge as composable

[Sqrcz]

This is a way to move twMerge as global composable instead of importing it each component.

Also this is a way to solve issue with custom user classes... proof of concept working for button, and main container of navbar.

[cogor]

Great suggestion, but if I'll add my custom class to button my classes will duplicated, to fix that you need to disable inheritAttrs and bind $attrs on root(or not) element

<template>
  <component
    v-bind="$attrs"
    :is="buttonComponent"
    :class="wrapperClasses"
    :[linkAttr]="href"
    :disabled="buttonComponent === 'button' && disabled"
  >
    ...
  </component>
</template>

<script lang="ts" setup>
/// ...

defineOptions({
  inheritAttrs: false,
})
/// ...

[Sqrcz]

Thanks, I'll take a look at this and prepare a fix.

[netlify]

✅ Deploy Preview for sensational-seahorse-8635f8 ready!

Name	Link
🔨 Latest commit	6198cdf
🔍 Latest deploy log	https://app.netlify.com/sites/sensational-seahorse-8635f8/deploys/656f286603559e0008edaa53
😎 Deploy Preview	https://deploy-preview-250--sensational-seahorse-8635f8.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[Sqrcz]

Hey @cogor 👋

I've tested different options here... and adding v-bind="$attrs" would require a way to filter unwanted parts which is not ideal when done manually... but we can take advantage of Vue's Attribute Inheritance. Especially this part: not explicitly declared in the receiving component's props or emits.

I've updated this PR with necessary changes... and I'm not getting duplicated classes and I'm able to add basic styles using regular class attribute.

Let me know what do you think about this approach.

[cogor]

Looks great