This package adds a ->tailwind() method to the attribute bag used within Blade Components which let you overwrite classes.
Let's say you've a Blade "link" component like this:
<a {{ $attributes->merge(['class' => 'flex px-5']) }}>
{{ $slot }}
</a>
When you're using this like:
<x-button href="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/" class="px-3">Home</x-button>
You end up with flex px-5 px-3 instead of flex px-3. Because Tailwind classes are sorted and px-5 is listed after px-3 our "overwrite" won't do anything.
composer require justbetter/laravel-blade-tailwind-merge
From the example above, just use tailwind('...') instead of merge(['class' => '...') or class('...') when you need this.
<a {{ $attributes->tailwind('flex px-5') }}>
{{ $slot }}
</a>
Currently the merging works only by checking the first part before the dash. So text-red-500 overwrites text-xl and visa versa because we only check for text-*. To fix this we need to know all Tailwind options just like tailwind-merge does. Maybe in the future... but a PR is welcome!
The MIT License (MIT). Please see License File for more information.