bug: force tooltip-open doesn’t work for group states

[serhii-chernenko]

Reproduction URL (Required)

https://play.tailwindcss.com/vv5uCBW3RN

What version of daisyUI are you using?

No response

Which browsers are you seeing the problem on?

All browsers

Describe your issue

I’d like to to force open a tooltip for the ≤summary> tag within the <details> tag. In the real app application summary, a trigger button is stored in another child component. So, I have to use group behavior.
What I want to achieve:
When the parent details component has the attribute open I’d like to force the opened state for tooltip.
But sadly, just group-open:tooltip-open doesn’t work. The tooltip-open works only with as the exact modifier.

Expected but doesn’t work

<details class="group open:group-open dropdown">
  <summary 
    class="tooltip group-open:tooltip-open" 
    data-tip="Tip content"
  >
    Trigger
  </summary>
  <div class="dropdown-content">Dropdown content</div>
</details>

How it’s solved, currently:

<details class="group open:group-open dropdown">
  <summary 
    class="tooltip group-open:before:opacity-100 group-open:after:opacity-100 [--tt-pos:0]" 
    data-tip="Tip content"
  >
    Trigger
  </summary>
  <div class="dropdown-content">Dropdown content</div>
</details>

[github-actions]

Thank you @serhii-chernenko for reporting issues. It helps daisyUI a lot 💚
I'll be working on issues one by one. I will help with this one as soon as a I find a solution.
In the meantime providing more details and reproduction links would be helpful.

[saadeghi]

Thanks for reporting.
Yes that's challenging. Currently style of tooltip-open is like below to avoid CSS specificity issues

.tooltip {
  &.tooltip-open {
  }
}

And because of that, Tailwind doesn't generate variant class names for it (like group-open:tooltip-open).

A workaround for your use case would be using group-open:tooltip instead. Example:
https://play.tailwindcss.com/IPsst6MV5d

[serhii-chernenko]

Thanks for sharing, @saadeghi. In my case, I still want to have the default behavior of displaying the tooltip on hover and focus. So, it has to be like this then:

group-open:tooltip group-hover:tooltip focus-visible:tooltip

But yeah, it works