Enable tooltips on option rows and badges, then customize their content with getOptionTooltipCallback / getBadgeTooltipCallback. Placement is powered by Floating UI, so tooltips auto-flip when space is tight.

TT01 Option & badge tooltips

Toggle tooltips on rows and badges, then tune placement and cursor tracking.

Controls
Floating UI auto-flips to the opposite side when there is no room.
Quick usage
 
  • The default tooltip content is the display value plus the subtitle (a second line when present). getOptionTooltipCallback and getBadgeTooltipCallback replace it with your own string or HTMLElement.
  • option-tooltip-placement (default top-start) and badge-tooltip-placement (default top) auto-flip via Floating UI.
  • option-tooltip-follow-cursor anchors the tooltip to the pointer instead of the row — handy on full-width controls where a row-centered tooltip lands mid-screen.
  • Option tooltips can be styled independently via --ms-option-tooltip-*, which default to the shared --ms-tooltip-* surface. See the full list in CSS Variables.