nextui
nextui copied to clipboard
[Feature Request] Add Tooltip prop to disable focus
Is your feature request related to a problem? Please describe.
I made a table that has buttons wrapped in tooltips, just like in the custom cells example. When navigating to the buttons using the keyboard, the tooltip <div>
is focussed instead. To navigate to the button, an additional keypress is required.
Describe the solution you'd like
As a user, I expected the button to be selected, but the tooltip element is selected instead.
Ideal steps I would like to see:
- Navigate to the desired row.
- Navigate to the desired button, without the Tooltip's
<button>
element receiving focus first.
Describe alternatives you've considered
Currently, I'm passing the disabled
prop to the Tooltip. This changes the behaviour exactly to what I want. The Tooltip's button is taken out of the Accessibility Tree and the child buttons are still focusable.
Using the disabled
prop is not ideal, because this suggests the Tooltip will not show when hovered, even though it does. The disabled
prop is also not in the Tooltip's Props type, causing Typescript to mark it as an error, even though it's actually passed to the Tooltip's <button>
element.
Screenshots or Videos
Current tooltip focus behaviour:
Desired tooltip focus behaviour:
Hey @TechnologicNick thanks for reporting it, we will migrate the current Tooltip
behaviour to https://react-spectrum.adobe.com/react-aria/useTooltipTrigger.html which provides better accessibility and focus management, stay tuned
Hey please upgrade to V2 since V1 will no receive more updates.