diff --git a/frontend/src/lib/components/common/popup/PopupV2.svelte b/frontend/src/lib/components/common/popup/PopupV2.svelte
index bbd68fe47b..425a09908a 100644
--- a/frontend/src/lib/components/common/popup/PopupV2.svelte
+++ b/frontend/src/lib/components/common/popup/PopupV2.svelte
@@ -8,8 +8,8 @@
floatingConfig?: ComputeConfig
open?: boolean
target?: string | undefined
- button?: import('svelte').Snippet<[any]>
- children?: import('svelte').Snippet<[any]>
+ button?: import('svelte').Snippet
+ children?: import('svelte').Snippet<[{ close: () => void }]>
}
let {
@@ -28,29 +28,13 @@
// export let floatingClasses: string = ''
const [floatingRef, floatingContent] = createFloatingActions(floatingConfig)
- function close(div: Element | null) {
+ function close() {
open = false
}
-
- let acceptClickoutside = $state(false)
- function pointerup() {
- setTimeout(() => {
- acceptClickoutside = true
- }, 100)
- }
-
- function pointerdown() {
- if (acceptClickoutside && open) {
- open = false
- } else {
- acceptClickoutside = false
- open = true
- }
- }
- {@render button?.({ pointerup, pointerdown })}
+ {@render button?.()}
@@ -61,17 +45,13 @@
use:floatingContent
transition:fly={{ duration: 100, y: -16 }}
>
-
{
- if (acceptClickoutside) {
- acceptClickoutside = false
- open = false
- }
+ use:clickOutside={{
+ eventToListenName: 'pointerdown',
+ onClickOutside: () => (open = false)
}}
>
- {@render children?.({ close })}
+ {@render children?.({ close: () => close(null) })}
{/if}
diff --git a/frontend/src/lib/components/flows/map/InsertModuleButton.svelte b/frontend/src/lib/components/flows/map/InsertModuleButton.svelte
index 71a5fbff6e..d7bb09815a 100644
--- a/frontend/src/lib/components/flows/map/InsertModuleButton.svelte
+++ b/frontend/src/lib/components/flows/map/InsertModuleButton.svelte
@@ -1,7 +1,4 @@
-
- {#snippet button({ pointerdown, pointerup })}
+
+ {#snippet button()}