mirror of
https://github.com/getpaseo/paseo.git
synced 2026-07-29 12:01:31 +00:00
fix(app): only open tooltip on keyboard focus
Modal close restores focus to the tooltip's trigger, which was firing onFocus and re-opening the tooltip. Gate onFocus on input modality so only keyboard-driven focus opens it, matching W3C tooltip behavior. Also removes the key-based remount workarounds that existed solely to sidestep this bug.
This commit is contained in:
@@ -424,12 +424,7 @@ function ControlledStatusBar({
|
||||
|
||||
{thinkingOptions && thinkingOptions.length > 0 ? (
|
||||
<>
|
||||
<Tooltip
|
||||
key={`thinking-${openSelector === "thinking" ? "open" : "closed"}`}
|
||||
delayDuration={0}
|
||||
enabledOnDesktop
|
||||
enabledOnMobile={false}
|
||||
>
|
||||
<Tooltip delayDuration={0} enabledOnDesktop enabledOnMobile={false}>
|
||||
<TooltipTrigger asChild triggerRefProp="ref">
|
||||
<Pressable
|
||||
ref={thinkingAnchorRef}
|
||||
@@ -470,12 +465,7 @@ function ControlledStatusBar({
|
||||
|
||||
{modeOptions && modeOptions.length > 0 ? (
|
||||
<>
|
||||
<Tooltip
|
||||
key={`mode-${openSelector === "mode" ? "open" : "closed"}`}
|
||||
delayDuration={0}
|
||||
enabledOnDesktop
|
||||
enabledOnMobile={false}
|
||||
>
|
||||
<Tooltip delayDuration={0} enabledOnDesktop enabledOnMobile={false}>
|
||||
<TooltipTrigger asChild triggerRefProp="ref">
|
||||
<Pressable
|
||||
ref={modeAnchorRef}
|
||||
|
||||
@@ -60,6 +60,28 @@ function useTooltipContext(componentName: string): TooltipContextValue {
|
||||
return ctx;
|
||||
}
|
||||
|
||||
// Tooltips should open on hover or keyboard focus, not when focus is restored
|
||||
// programmatically (e.g. when a Modal closes and returns focus to its opener).
|
||||
// Track the last input modality on web so TooltipTrigger can ignore focus
|
||||
// events that weren't keyboard-driven. Native has no equivalent scenario.
|
||||
let lastInputWasKeyboard = false;
|
||||
if (isWeb && typeof window !== "undefined") {
|
||||
const markKeyboard = () => {
|
||||
lastInputWasKeyboard = true;
|
||||
};
|
||||
const markPointer = () => {
|
||||
lastInputWasKeyboard = false;
|
||||
};
|
||||
window.addEventListener("keydown", markKeyboard, true);
|
||||
window.addEventListener("mousedown", markPointer, true);
|
||||
window.addEventListener("pointerdown", markPointer, true);
|
||||
window.addEventListener("touchstart", markPointer, true);
|
||||
}
|
||||
|
||||
function shouldOpenOnFocus(): boolean {
|
||||
return !isWeb || lastInputWasKeyboard;
|
||||
}
|
||||
|
||||
function composeEventHandlers<E>(
|
||||
original?: (event: E) => void,
|
||||
injected?: (event: E) => void,
|
||||
@@ -304,6 +326,7 @@ export function TooltipTrigger({
|
||||
(e: any) => {
|
||||
onFocus?.(e);
|
||||
if (!ctx.enabled || disabled) return;
|
||||
if (!shouldOpenOnFocus()) return;
|
||||
clearOpenTimer();
|
||||
ctx.setOpen(true);
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user