iter(g291): 下拉族七处弹层接上滚动跟随
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
import { effect, h, signal } from '@ui-arch/frame';
|
||||
import type { Signal } from '@ui-arch/frame';
|
||||
import { bindOutside, pushOverlay } from './overlay.js';
|
||||
import { flip } from './position.js';
|
||||
import { flip, trackShift } from './position.js';
|
||||
import type { MultiSelectProps } from './types.js';
|
||||
|
||||
/*** 多选下拉:标签式回显 + 可搜索弹层,value 数组信号双向绑定,到 max 未选项自动禁用 ***/
|
||||
@@ -119,6 +119,15 @@ export function multiSelect(props: MultiSelectProps): HTMLElement {
|
||||
if (open()) releaseEsc ??= pushOverlay(() => { open(false); input.focus(); }); // 入栈逐层关闭
|
||||
else { releaseEsc?.(); releaseEsc = null; }
|
||||
});
|
||||
effect(() => { if (open()) place(flip(box, pop, 'bottom')); });
|
||||
let releaseShift: (() => void) | null = null; // 展开期间的位移跟随释放函数(滚动 / 缩放重算翻转)
|
||||
effect(() => {
|
||||
if (!open()) { // 收起即摘监听:弹层不在,重算方位没有意义
|
||||
releaseShift?.();
|
||||
releaseShift = null;
|
||||
return;
|
||||
}
|
||||
place(flip(box, pop, 'bottom')); // 打开先算一次:空间不足自动翻转
|
||||
releaseShift ??= trackShift(() => place(flip(box, pop, 'bottom'))); // 展开期间跟着滚动重算:视口空间会变
|
||||
});
|
||||
return root;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user