fix(dialog): treat PrimeVue overlay clicks as inside the search dialog

Filter panel is a nested PrimeVue Dialog teleported to body. With Reka modal
disabled, the outer dialog stays interactive but Reka's pointer-down-outside
still fires for clicks inside the teleported PrimeVue panel — which would
auto-dismiss the outer search box and tear down the panel mid-interaction
(filter type/value clicks then timeout because the elements are gone).

Block dismissal whenever the original pointer-down target is inside any
PrimeVue overlay (.p-dialog, .p-overlay, .p-autocomplete-overlay,
.p-select-overlay, .p-popover and their masks). The 300ms initial-open guard
is preserved.

Refs FE-574
This commit is contained in:
dante01yoon
2026-05-10 09:31:48 +09:00
parent 0bb0d9164f
commit 31e3b9c315

View File

@@ -131,8 +131,23 @@ function onOpenChange(open: boolean) {
visible.value = open
if (!open) clearFilters()
}
function onPointerDownOutside(event: Event) {
if (!dismissable.value) event.preventDefault()
// PrimeVue overlays (filter Dialog, AutoComplete dropdown, Select panel)
// teleport to body, so Reka treats clicks on them as "outside" and would
// dismiss the outer dialog. Treat clicks on any PrimeVue overlay as inside.
const PRIMEVUE_OVERLAY_SELECTORS =
'.p-dialog-mask, .p-dialog, .p-overlay-mask, .p-overlay, .p-autocomplete-overlay, .p-select-overlay, .p-popover'
function onPointerDownOutside(
event: CustomEvent<{ originalEvent: PointerEvent }>
) {
if (!dismissable.value) {
event.preventDefault()
return
}
const target = event.detail.originalEvent.target
if (target instanceof Element && target.closest(PRIMEVUE_OVERLAY_SELECTORS)) {
event.preventDefault()
}
}
const canvasStore = useCanvasStore()