[EuiComboBox] add support for option tooltips
Summary
This PR is the first part of updates for #7690
This PR updates EuiComboBox to support the two props toolTipContent and toolTipProps to be passed to combobox options to display a tooltip on hover/focus.
To ensure the tooltip can be opened on focus, the EuiToolTip was updated to a support controlled behavior via isOpen.
QA
- [ ] review and test
EuiComboBoxin storybook and docs and/or checkout this PR locally viagh pr checkout 7700- [ ] ensure the tooltip is applied as expected (on hover as well as on keyboard navigation or click)
General checklist
- Browser QA
- [x] Checked in both light and dark modes
- [x] Checked in mobile
- [x] Checked in Chrome, Safari, Edge, and Firefox
- [x] Checked for accessibility including keyboard-only and screenreader modes
- Docs site QA
- [x] Added documentation
- [x] Props have proper autodocs (using
@defaultif default values are missing) and playground toggles - [ ] ~Checked Code Sandbox works for any docs examples~
- Code quality checklist
- Release checklist
- [x] A changelog entry exists and is marked appropriately.
- [ ] ~If applicable, added the breaking change issue label (and filled out the breaking change checklist)~
@mgadewoll Thanks so much with your patience waiting for my review on this, and for your amazing work with granular commits that made it super easy to follow!! My largest comments I'd like to see resolved are:
- Firefox behavior (must fix, also not sure if this is only affecting me?)
- Avoiding a new API for
EuiToolTip/using a class ref method instead (open to pushback on this if you feel strongly, but I do also wonder if this ties into the FF bug above) - Changing the anchor position default to
leftinstead of bottom
Everything other comment is just nice to have. I'll skip reviewing the EuiSelectable version of this PR as well (assuming it has similar-ish comments to the above) until this PR is settled and merged in if that's cool!
ℹ️ I added baseline VRT references for EuiComboBox. The tooltip story currently looks the same as the playground one, I want to update it to use interactions to show an opened tooltip state instead, but I'd suggest doing it in a separate PR as I'll need to check on the setup first.
I want to update it to use interactions to show an opened tooltip state instead, but I'd suggest doing it in a separate PR as I'll need to check on the setup first.
Yasss that would be amazing! I reiterate that you are the best!
Preview staging links for this PR:
- Docs site: https://eui.elastic.co/pr_7700/
- Storybook: https://eui.elastic.co/pr_7700/storybook
:green_heart: Build Succeeded
- Buildkite Build
- Commit: 9929c3e3d89ece2723a1b7a16046bfb6cb4a12d5
History
- :green_heart: Build #1869 succeeded 44931b0c5e5de283d7620dbf6410b0affca609a7
- :green_heart: Build #1866 succeeded 14030c83a585066e5933e7f344d1a69a7dec5140
- :green_heart: Build #1859 succeeded 9b7b0e68a870ebe094e871061556a2f472408a6a
- :green_heart: Build #1855 succeeded 9e03e7702744ec0200921f7086445a8511d2e30d
- :green_heart: Build #1854 succeeded 05695b46a85504541bfacb3fb1fb8b23924bcea2
- :green_heart: Build #1810 succeeded c580005c9e584a6f841f753c000c72986ca6f74f