diff --git a/examples/react/src/examples/Figma/index.tsx b/examples/react/src/examples/Figma/index.tsx
index 136d0629..28e21179 100644
--- a/examples/react/src/examples/Figma/index.tsx
+++ b/examples/react/src/examples/Figma/index.tsx
@@ -45,6 +45,8 @@ const BasicFlow = () => {
onMove={onMove}
onMoveEnd={onMoveEnd}
onPaneClick={(e) => console.log('pane click', e)}
+ onSelectionStart={(e) => console.log('on selection start', e)}
+ onSelectionEnd={(e) => console.log('on selection end', e)}
>
diff --git a/examples/svelte/src/routes/examples/figma/+page.svelte b/examples/svelte/src/routes/examples/figma/+page.svelte
index 0b4c0b6a..9c448353 100644
--- a/examples/svelte/src/routes/examples/figma/+page.svelte
+++ b/examples/svelte/src/routes/examples/figma/+page.svelte
@@ -47,6 +47,8 @@
{onmove}
{onmoveend}
onpaneclick={(e) => console.log('on pane click', e)}
+ onselectionend={(e) => console.log('on selection end', e)}
+ onselectionstart={(e) => console.log('on selection start', e)}
>
diff --git a/packages/react/src/container/Pane/index.tsx b/packages/react/src/container/Pane/index.tsx
index f952434b..32dcdb9a 100644
--- a/packages/react/src/container/Pane/index.tsx
+++ b/packages/react/src/container/Pane/index.tsx
@@ -120,6 +120,7 @@ export function Pane({
const onClickCapture = (event: ReactMouseEvent) => {
if (selectionInProgress.current) {
event.stopPropagation();
+ selectionInProgress.current = false;
}
};
@@ -202,6 +203,7 @@ export function Pane({
if (distance <= paneClickDistance) {
return;
}
+ onSelectionStart?.(event);
}
selectionInProgress.current = true;
@@ -277,14 +279,9 @@ export function Pane({
userSelectionRect: null,
nodesSelectionActive: selectedNodeIds.current.size > 0,
});
- onSelectionEnd?.(event);
- /*
- * If the user kept holding the selectionKey during the selection,
- * we need to reset the selectionInProgress, so the next click event is not prevented
- */
- if (selectionKeyPressed || selectionOnDrag) {
- selectionInProgress.current = false;
+ if (selectionInProgress.current) {
+ onSelectionEnd?.(event);
}
selectionStarted.current = false;
diff --git a/packages/svelte/src/lib/container/Pane/Pane.svelte b/packages/svelte/src/lib/container/Pane/Pane.svelte
index fed9d005..46c48625 100644
--- a/packages/svelte/src/lib/container/Pane/Pane.svelte
+++ b/packages/svelte/src/lib/container/Pane/Pane.svelte
@@ -147,6 +147,7 @@
if (distance <= paneClickDistance) {
return;
}
+ onselectionstart?.(event);
}
selectionInProgress = true;
@@ -220,7 +221,9 @@
store.selectionRectMode = 'nodes';
}
- onselectionend?.(event);
+ if (selectionInProgress) {
+ onselectionend?.(event);
+ }
selectionStarted = false;
}