Add panOnScrollSpeed prop

This commit is contained in:
Jaan
2025-09-09 13:29:46 +02:00
parent 2d871bd3e6
commit 0e5ceb82b2
4 changed files with 11 additions and 1 deletions
@@ -59,6 +59,7 @@
zoomOnDoubleClick = true,
zoomOnPinch = true,
panOnScroll = false,
panOnScrollSpeed = 0.5,
panOnDrag = true,
selectionOnDrag = true,
connectionLineComponent,
@@ -152,6 +153,7 @@
{zoomOnDoubleClick}
{zoomOnPinch}
{panOnScroll}
{panOnScrollSpeed}
{panOnDrag}
{paneClickDistance}
{onmovestart}
@@ -305,6 +305,12 @@ export type SvelteFlowProps<
* @default false
*/
panOnScroll?: boolean;
/**
* Controls how fast viewport should be panned on scroll.
* Use together with `panOnScroll` prop.
* @default 0.5
*/
panOnScrollSpeed?: number;
/**
* This prop is used to limit the direction of panning when panOnScroll is enabled.
* The "free" option allows panning in any direction.
@@ -14,6 +14,7 @@
zoomOnPinch = true,
panOnDrag = true,
panOnScroll = false,
panOnScrollSpeed = 0.5,
paneClickDistance = 1,
onmovestart,
onmove,
@@ -58,7 +59,7 @@
zoomOnPinch,
panOnScroll: panOnScrollActive,
panOnDrag: panOnDragActive,
panOnScrollSpeed: 0.5,
panOnScrollSpeed,
panOnScrollMode: panOnScrollMode || PanOnScrollMode.Free,
zoomActivationKeyPressed: store.zoomActivationKeyPressed,
preventScrolling: typeof preventScrolling === 'boolean' ? preventScrolling : true,
@@ -6,6 +6,7 @@ import type { Snippet } from 'svelte';
export type ZoomProps<NodeType extends Node = Node, EdgeType extends Edge = Edge> = {
store: SvelteFlowStore<NodeType, EdgeType>;
panOnScrollMode: PanOnScrollMode;
panOnScrollSpeed: number;
preventScrolling: boolean;
zoomOnScroll: boolean;
zoomOnDoubleClick: boolean;