🐛 fix(vscode): 修好属性网格 SelectMenu 选项点击被捕获阶段处理器吞掉
This commit is contained in:
@@ -531,6 +531,11 @@ function PropertyRow({
|
|||||||
ref={el => registerCellRef(fullKey, el)}
|
ref={el => registerCellRef(fullKey, el)}
|
||||||
data-property-cell={fullKey}
|
data-property-cell={fullKey}
|
||||||
onClickCapture={(e) => {
|
onClickCapture={(e) => {
|
||||||
|
// portal 弹层对祖先捕获处理器隐身:点击落在 SelectMenu 弹层内时不选中也不拦截,
|
||||||
|
// 让 click 正常落到选项按钮,避免被外层的 stopPropagation/preventDefault 吞掉。
|
||||||
|
const src = e.target
|
||||||
|
if (src instanceof Element && src.closest('[data-select-menu]'))
|
||||||
|
return
|
||||||
if (isSelected)
|
if (isSelected)
|
||||||
return
|
return
|
||||||
onSelect(fullKey)
|
onSelect(fullKey)
|
||||||
@@ -606,8 +611,11 @@ export function PropertyGrid({
|
|||||||
if (selectedKey == null)
|
if (selectedKey == null)
|
||||||
return
|
return
|
||||||
function handleMouseDown(e: MouseEvent): void {
|
function handleMouseDown(e: MouseEvent): void {
|
||||||
|
const t = e.target
|
||||||
|
if (!(t instanceof Node))
|
||||||
|
return
|
||||||
const root = rootRef.current
|
const root = rootRef.current
|
||||||
if (root && e.target instanceof Node && !root.contains(e.target))
|
if (root && !root.contains(t) && !(t instanceof Element && t.closest('[data-select-menu]')))
|
||||||
setSelectedKey(null)
|
setSelectedKey(null)
|
||||||
}
|
}
|
||||||
document.addEventListener('mousedown', handleMouseDown)
|
document.addEventListener('mousedown', handleMouseDown)
|
||||||
|
|||||||
@@ -211,6 +211,7 @@ export function SelectMenu({
|
|||||||
<div
|
<div
|
||||||
ref={menuRef}
|
ref={menuRef}
|
||||||
role="listbox"
|
role="listbox"
|
||||||
|
data-select-menu=""
|
||||||
tabIndex={-1}
|
tabIndex={-1}
|
||||||
className="fixed z-50 overflow-auto rounded border border-[var(--vscode-panel-border)] bg-[var(--vscode-editorWidget-background,var(--vscode-editor-background))] shadow-md"
|
className="fixed z-50 overflow-auto rounded border border-[var(--vscode-panel-border)] bg-[var(--vscode-editorWidget-background,var(--vscode-editor-background))] shadow-md"
|
||||||
style={{ top: pos.top, left: pos.left, width: pos.width, maxHeight: MAX_MENU_HEIGHT }}
|
style={{ top: pos.top, left: pos.left, width: pos.width, maxHeight: MAX_MENU_HEIGHT }}
|
||||||
|
|||||||
Reference in New Issue
Block a user