iter(g28): 浮层 Esc 逐层关闭,阻止冒泡连带关外层

This commit is contained in:
HIsheR
2026-10-26 11:38:44 +08:00
parent b263075e65
commit d9feeda0fd
10 changed files with 33 additions and 12 deletions
+1 -1
View File
@@ -35,7 +35,7 @@ function openViewer(src: string, alt?: string): void {
document.removeEventListener('keydown', onKey);
prev?.focus?.();
};
const onKey = (e: KeyboardEvent) => e.key === 'Escape' && close();
const onKey = (e: KeyboardEvent) => { if (e.key !== 'Escape') return; e.stopPropagation(); close(); }; // 预览层 Esc 自关,不连带关外层
mask.addEventListener('click', close);
document.addEventListener('keydown', onKey);
document.body.appendChild(mask);
+1
View File
@@ -73,6 +73,7 @@ export function menu(props: MenuProps): HTMLElement {
root.addEventListener('keydown', (e: KeyboardEvent) => {
if (e.key === 'Escape') {
e.stopPropagation(); // 只关本层:不再冒泡去关外层的弹窗/抽屉
open(false);
trigger.focus(); // 收起后焦点回到触发器,键盘流不断
return;
+1
View File
@@ -53,6 +53,7 @@ export function popover(props: PopoverProps, trigger: HTMLElement): HTMLElement
}
root.addEventListener('keydown', (e: KeyboardEvent) => {
if (e.key !== 'Escape' || !open()) return; // 卫语句:未展开时 Esc 不处理
e.stopPropagation(); // 只关本层,避免连带关闭外层弹窗
setOpen(false);
trigger.focus(); // 收起后焦点回触发器
});
+1 -1
View File
@@ -65,7 +65,7 @@ export function select(props: SelectProps): HTMLElement {
};
root.addEventListener('keydown', (e: KeyboardEvent) => {
if (e.key === 'Escape') { open(false); trigger.focus(); return; } // Esc 关闭并回焦触发器
if (e.key === 'Escape') { e.stopPropagation(); open(false); trigger.focus(); return; } // Esc 只关本层并回焦触发器
if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {
e.preventDefault(); // 阻止页面滚动
if (!open()) { open(true); options[0]?.focus(); return; } // 未展开:展开并聚焦首个选项
+1 -1
View File
@@ -49,7 +49,7 @@ export function tooltip(props: TooltipProps, trigger: HTMLElement): HTMLElement
root.addEventListener('focusout', hide); // 失焦
effect(() => { if (open()) place(flip(trigger, bubble, props.placement ?? 'top')); }); // 每次出场重算方位:空间不足自动翻转
root.addEventListener('keydown', (e: KeyboardEvent) => {
if (e.key === 'Escape') hide(); // Esc 立即收起,不必等延迟
if (e.key === 'Escape') { e.stopPropagation(); hide(); } // Esc 立即收起且不影响外层弹层
});
return root;
}