alighasami/xyflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Pane: only use cursor grab when panOnDrag=true

Browse Source
This commit is contained in:
peterkogo
2024-02-21 07:41:56 +01:00
parent 20e2d3d2ce
commit 9fb4979631
3 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react/src/container/Pane/index.tsx
+1 -1
View File
@@ -220,7 +220,7 @@ export function Pane({
return ( return (
<div <div
className={cc(['react-flow__pane', { dragging, selection: isSelecting }])} className={cc(['react-flow__pane', { draggable: panOnDrag, dragging, selection: isSelecting }])}
onClick={hasActiveSelection ? undefined : wrapHandler(onClick, container)} onClick={hasActiveSelection ? undefined : wrapHandler(onClick, container)}
onContextMenu={wrapHandler(onContextMenu, container)} onContextMenu={wrapHandler(onContextMenu, container)}
onWheel={wrapHandler(onWheel, container)} onWheel={wrapHandler(onWheel, container)}
packages/svelte/src/lib/container/Pane/Pane.svelte
+1
View File
@@ -202,6 +202,7 @@
<div <div
bind:this={container} bind:this={container}
class="svelte-flow__pane" class="svelte-flow__pane"
class:draggable={panOnDrag}
class:dragging={$dragging} class:dragging={$dragging}
class:selection={isSelecting} class:selection={isSelecting}
on:click={hasActiveSelection ? undefined : wrapHandler(onClick, container)} on:click={hasActiveSelection ? undefined : wrapHandler(onClick, container)}
packages/system/src/styles/init.css
+6 -3
View File
@@ -66,14 +66,17 @@
.xy-flow__pane { .xy-flow__pane {
z-index: 1; z-index: 1;
cursor: grab;
&.selection { &.selection {
cursor: pointer; cursor: pointer;
} }
&.dragging { &.draggable {
cursor: grabbing; cursor: grab;
&.dragging {
cursor: grabbing;
}
} }
} }