iter(g28): 浮层 Esc 逐层关闭,阻止冒泡连带关外层
This commit is contained in:
@@ -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);
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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(); // 收起后焦点回触发器
|
||||
});
|
||||
|
||||
@@ -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; } // 未展开:展开并聚焦首个选项
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user