search

themesberg / flowbite-vue

Official Vue 3 components built for Flowbite and Tailwind CSS
https://flowbite-vue.com
MIT License
739 stars 117 forks source link

Feature/twmerge as composable #250

Closed Sqrcz closed 9 months ago

Sqrcz commented 10 months ago

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 commented 9 months ago

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 commented 9 months ago

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

netlify[bot] commented 9 months ago

Deploy Preview for sensational-seahorse-8635f8 ready!

Name Link
Latest commit 6198cdf64c44d682fd3dd3f42c6de9d484efa299
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...

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 commented 9 months ago

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 commented 9 months ago

Looks great