From 425cc369fb4f2cf3df33991c88169c7d65e2eb39 Mon Sep 17 00:00:00 2001
From: AetherNo2332 <130164460+AetherNo2332@users.noreply.github.com>
Date: Mon, 21 Sep 2026 06:22:00 +0800
Subject: [PATCH] =?UTF-8?q?fix(web):=20=E5=9F=BA=E7=A1=80=E6=8E=A7?=
 =?UTF-8?q?=E4=BB=B6=20Tooltip=20-=20=E5=AD=90=E5=85=83=E7=B4=A0=E5=8F=AF?=
 =?UTF-8?q?=E8=A7=A6=E5=8F=91=E5=B9=B6=E4=BF=9D=E7=95=99=E9=94=AE=E7=9B=98?=
 =?UTF-8?q?=E5=8F=AF=E8=BE=BE=E6=80=A7=20(#560)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Original-Commit: 38b5909fa78902048345ad8d8e00248660830ad5
fix(web): 基础控件 Tooltip - 子元素可触发并保留键盘可达性

react-aria-components 的 TooltipTrigger 通过 context 下发 hover/focus 处理与 triggerRef，
只有消费该上下文的组件才会真正挂上；原来包一层普通 span，既不读 context 也拿不到 ref，
所以悬停/聚焦都不弹气泡（有定位也无基准）。

包装层改为 Focusable + excludeFromTabOrder：悬停与聚焦都能触发、气泡有定位基准，
外层不占 Tab 位，键盘焦点仍落在内层控件上，导航顺序不变。
---
 web/src/components/ui/base/tooltip/tooltip.tsx | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/web/src/components/ui/base/tooltip/tooltip.tsx b/web/src/components/ui/base/tooltip/tooltip.tsx
index 892d94698..a27c66d07 100644
--- a/web/src/components/ui/base/tooltip/tooltip.tsx
+++ b/web/src/components/ui/base/tooltip/tooltip.tsx
@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import { Tooltip as RACTooltip, TooltipTrigger, type Placement } from "react-aria-components";
+import { Focusable, Tooltip as RACTooltip, TooltipTrigger, type Placement } from "react-aria-components";
 
 import { cn } from "@/lib/utils";
 
@@ -42,7 +42,16 @@ export function Tooltip({ title, placement = "top", delay = 350, className, chil
 
     return (
         <TooltipTrigger delay={delay}>
-            <span className="inline-flex">{children}</span>
+            {/*
+             * RAC 1.21 的 TooltipTrigger 通过 context 下发 hover/focus 处理与 triggerRef，
+             * 只有消费该上下文的组件才会真正挂上（原生 <span>/<button> 不会读）。直接套
+             * 普通 span 的写法因此既没有触发事件、也没有定位基准，鼠标悬停永远不弹。
+             * Focusable 消费该上下文并把属性和 ref 合并到子元素：聚焦与悬停都可用，弹窗
+             * 也有定位基准；外层不占 Tab 位，键盘焦点落在内层控件上后冒泡触发。
+             */}
+            <Focusable excludeFromTabOrder>
+                <span className="inline-flex">{children}</span>
+            </Focusable>
             <RACTooltip placement={PLACEMENT_MAP[placement]} offset={6} className={cn("z-50 max-w-64 rounded-md border border-border bg-surface-strong px-2 py-1 text-xs leading-relaxed text-foreground shadow-md", "ra-pop-in", className)}>
                 {title}
             </RACTooltip>