Merge pull request #3820 from xyflow/fix-selection-key

Selection process is not interrupted by selectionKey being let go
This commit is contained in:
Moritz Klack
2024-01-23 15:25:21 +01:00
committed by GitHub
4 changed files with 9 additions and 4 deletions
+1
View File
@@ -4,6 +4,7 @@
### Patch changes
- selection box is not interrupted by selectionKey being let go
- fix `OnNodeDrag` type
- refactor(handles): do not use fallback handle if an id is being used #3409
@@ -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 });
+1
View File
@@ -8,6 +8,7 @@
## Patch changes
- selection box is not interrupted by selectionKey being let go
- Edge label has a default background and is clickable
- refactor(handles): do not use fallback handle if an id is being used #3409
@@ -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) {