mjTip — a small, reusable, THEMED hover tooltip for dense surfaces (tab labels, truncated
selects, …). Behavior:
shows the full text only after the pointer holds STILL over the host (~450ms);
NON-INTERACTIVE (pointer-events:none) so it never blocks a click, and leaves on the next mousemove;
by default shows ONLY when the host is truncated (scrollWidth > clientWidth) — pass mjTipAlways
for hosts whose truncation can't be measured (a native <select>), so the full value shows regardless;
themed via design tokens (inline var() styles, since it is appended to <body>), with a NEUTRAL
rgba(0,0,0,…) shadow so it reads as a shadow in BOTH light and dark mode (a token-tinted shadow
glows in dark). Capped at ~1.5 tab-widths × 3 lines — never a screen-wide banner.
mjTip— a small, reusable, THEMED hover tooltip for dense surfaces (tab labels, truncated selects, …). Behavior:pointer-events:none) so it never blocks a click, and leaves on the next mousemove;scrollWidth > clientWidth) — passmjTipAlwaysfor hosts whose truncation can't be measured (a native<select>), so the full value shows regardless;var()styles, since it is appended to<body>), with a NEUTRALrgba(0,0,0,…)shadow so it reads as a shadow in BOTH light and dark mode (a token-tinted shadow glows in dark). Capped at ~1.5 tab-widths × 3 lines — never a screen-wide banner.