From 601c7f1c15377d56de68be4d9a26e6eda64258f8 Mon Sep 17 00:00:00 2001 From: peterkogo Date: Mon, 22 Jan 2024 11:26:02 +0100 Subject: [PATCH] Selection process is not interrupted by selectionKey being let go --- packages/react/src/container/FlowRenderer/index.tsx | 8 +++++--- packages/svelte/src/lib/container/Pane/Pane.svelte | 3 ++- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/packages/react/src/container/FlowRenderer/index.tsx b/packages/react/src/container/FlowRenderer/index.tsx index 06d6fab6..2670be70 100644 --- a/packages/react/src/container/FlowRenderer/index.tsx +++ b/packages/react/src/container/FlowRenderer/index.tsx @@ -28,7 +28,9 @@ export type FlowRendererProps = Omit< children: ReactNode; }; -const selector = (s: ReactFlowState) => s.nodesSelectionActive; +const selector = (s: ReactFlowState) => { + return { nodesSelectionActive: s.nodesSelectionActive, userSelectionActive: s.userSelectionActive }; +}; const FlowRendererComponent = ({ children, @@ -67,13 +69,13 @@ const FlowRendererComponent = ({ onViewportChange, isControlledViewport, }: FlowRendererProps) => { - const nodesSelectionActive = useStore(selector); + const { nodesSelectionActive, userSelectionActive } = useStore(selector); const selectionKeyPressed = useKeyPress(selectionKeyCode); const panActivationKeyPressed = useKeyPress(panActivationKeyCode); const panOnDrag = panActivationKeyPressed || _panOnDrag; const panOnScroll = panActivationKeyPressed || _panOnScroll; - const isSelecting = selectionKeyPressed || (selectionOnDrag && panOnDrag !== true); + const isSelecting = selectionKeyPressed || userSelectionActive || (selectionOnDrag && panOnDrag !== true); useGlobalKeyHandler({ deleteKeyCode, multiSelectionKeyCode }); diff --git a/packages/svelte/src/lib/container/Pane/Pane.svelte b/packages/svelte/src/lib/container/Pane/Pane.svelte index cce95636..f0df0980 100644 --- a/packages/svelte/src/lib/container/Pane/Pane.svelte +++ b/packages/svelte/src/lib/container/Pane/Pane.svelte @@ -73,7 +73,8 @@ let selectedNodes: Node[] = []; $: _panOnDrag = $panActivationKeyPressed || panOnDrag; - $: isSelecting = $selectionKeyPressed || (selectionOnDrag && _panOnDrag !== true); + $: isSelecting = + $selectionKeyPressed || $selectionRect || (selectionOnDrag && _panOnDrag !== true); $: hasActiveSelection = $elementsSelectable && (isSelecting || $selectionRectMode === 'user'); function onClick(event: MouseEvent | TouchEvent) {