Button group with disabled button and tooltip

[MarkKremer]

Flux version

v2.6.0

Livewire version

v3.6.4

Tailwind version

v4.1.14

Browser and Operating System

Firefox on Linux

What is the problem?

Combining a button group with disabled buttons with tooltips is not possible. The docs mention a workaround for adding tooltips to disabled buttons. However, this breaks the layout when the button is part of a group.

This issue has overlap with #2021. However, depending on the fix, the linked issue may not fix support for tooltips automatically.

Code snippets to replicate the problem

Normal usage:

<flux:button.group>
    <flux:button>Close merge request</flux:button>
    <flux:button disabled tooltip="Cannot merge until reviewed by a team member" icon="arrow-turn-down-right">Merge pull request</flux:button>
</flux:button.group>

Button group looks right but the tooltip doesn't work.

Using the workaround described in the docs results in a broken UI:

<flux:button.group>
    <flux:button>Close merge request</flux:button>
    <flux:tooltip content="Cannot merge until reviewed by a team member">
        <div>
            <flux:button disabled icon="arrow-turn-down-right">Merge pull request</flux:button>
        </div>
    </flux:tooltip>
</flux:button.group>

Tooltip works but button group isn't styled correctly.

Screenshots/ screen recordings of the problem

See above

How do you expect it to work?

I expect tooltips to work on disabled buttons in a button group. Or to have a working work-around.

Please confirm (incomplete submissions will not be addressed)

• I have provided easy and step-by-step instructions to reproduce the bug.
• I have provided code samples as text and NOT images.
• I understand my bug report will be closed if I haven't met the criteria above.