Skip to content

[Wildcard] Fix support for Tooltips on disabled trigger elements

Administrator requested to merge lrh/tooltip-fix-disabled-triggers into main

Created by: lrhacker

#37321 fixed a bunch of other issues by removing the wrapping <span> element, but in the case of disabled triggers (e.g. <Button> or <Input> components), it needs to be wrapped to ensure the tooltip content still displays correctly.

This resolves that problem by adding logic to the <Tooltip> component itself and check its single child of ReactElement for a truthy disabled prop. If it is disabled, additional elements are rendered with the trigger to enable the normal tooltip behavior.

This logic was removed from the <Button> component itself, since without using data-tooltip, we won't have an easy way to tell from within that component if it's wrapped with a <Tooltip>.

Test plan

Verified via the "Disabled Trigger" Storybook examples.

App preview:

Check out the client app preview documentation to learn more.

Merge request reports

Loading