From 87a8689584d9b29570d186628829324f3bec3b2e Mon Sep 17 00:00:00 2001
From: peterkogo <peter@xyflow.com>
Date: Tue, 7 Oct 2025 15:13:14 +0200
Subject: [PATCH] disable eslint rule svelte/prefer-svelte-reactivity for
 several lines and files

---
 .changeset/dark-mice-rest.md                                 | 5 +++++
 .../src/lib/container/NodeRenderer/NodeRenderer.svelte       | 1 +
 packages/svelte/src/lib/container/Pane/Pane.svelte           | 2 ++
 packages/svelte/src/lib/hooks/useNodeConnections.svelte.ts   | 3 +++
 .../svelte/src/lib/hooks/useUpdateNodeInternals.svelte.ts    | 3 +++
 packages/svelte/src/lib/plugins/Minimap/Minimap.svelte       | 2 +-
 packages/svelte/src/lib/plugins/Minimap/MinimapNode.svelte   | 4 ++--
 .../svelte/src/lib/plugins/NodeResizer/ResizeControl.svelte  | 1 +
 packages/svelte/src/lib/store/initial-store.svelte.ts        | 4 ++++
 9 files changed, 22 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/dark-mice-rest.md

diff --git a/.changeset/dark-mice-rest.md b/.changeset/dark-mice-rest.md
new file mode 100644
index 00000000..15e4f0f8
--- /dev/null
+++ b/.changeset/dark-mice-rest.md
@@ -0,0 +1,5 @@
+---
+'@xyflow/svelte': patch
+---
+
+Surpress svelte/prefer-svelte-reactivity warnings
diff --git a/packages/svelte/src/lib/container/NodeRenderer/NodeRenderer.svelte b/packages/svelte/src/lib/container/NodeRenderer/NodeRenderer.svelte
index 2dc4c6aa..ef20b865 100644
--- a/packages/svelte/src/lib/container/NodeRenderer/NodeRenderer.svelte
+++ b/packages/svelte/src/lib/container/NodeRenderer/NodeRenderer.svelte
@@ -26,6 +26,7 @@
     typeof ResizeObserver === 'undefined'
       ? null
       : new ResizeObserver((entries: ResizeObserverEntry[]) => {
+          // eslint-disable-next-line svelte/prefer-svelte-reactivity
           const updates = new Map();
 
           entries.forEach((entry: ResizeObserverEntry) => {
diff --git a/packages/svelte/src/lib/container/Pane/Pane.svelte b/packages/svelte/src/lib/container/Pane/Pane.svelte
index db11bd7d..e33e9a55 100644
--- a/packages/svelte/src/lib/container/Pane/Pane.svelte
+++ b/packages/svelte/src/lib/container/Pane/Pane.svelte
@@ -59,8 +59,10 @@
   let container: HTMLDivElement;
   let containerBounds: DOMRect | null = null;
 
+  /* eslint-disable svelte/prefer-svelte-reactivity */
   let selectedNodeIds: Set<string> = new Set();
   let selectedEdgeIds: Set<string> = new Set();
+  /* eslint-enable svelte/prefer-svelte-reactivity */
 
   let panOnDragActive = $derived(store.panActivationKeyPressed || panOnDrag);
   let isSelecting = $derived(
diff --git a/packages/svelte/src/lib/hooks/useNodeConnections.svelte.ts b/packages/svelte/src/lib/hooks/useNodeConnections.svelte.ts
index 6d70cb11..b73091dc 100644
--- a/packages/svelte/src/lib/hooks/useNodeConnections.svelte.ts
+++ b/packages/svelte/src/lib/hooks/useNodeConnections.svelte.ts
@@ -1,3 +1,4 @@
+/* eslint-disable svelte/prefer-svelte-reactivity */
 import {
   areConnectionMapsEqual,
   handleConnectionChange,
@@ -90,3 +91,5 @@ export function useNodeConnections({
     }
   };
 }
+
+/* eslint-enable svelte/prefer-svelte-reactivity */
diff --git a/packages/svelte/src/lib/hooks/useUpdateNodeInternals.svelte.ts b/packages/svelte/src/lib/hooks/useUpdateNodeInternals.svelte.ts
index f6124312..9dfe560b 100644
--- a/packages/svelte/src/lib/hooks/useUpdateNodeInternals.svelte.ts
+++ b/packages/svelte/src/lib/hooks/useUpdateNodeInternals.svelte.ts
@@ -1,3 +1,4 @@
+/* eslint-disable svelte/prefer-svelte-reactivity */
 import { useStore } from '$lib/store';
 import { getContext } from 'svelte';
 
@@ -38,3 +39,5 @@ export function useUpdateNodeInternals(): (nodeId?: string | string[]) => void {
 
   return updateInternals;
 }
+
+/* eslint-enable svelte/prefer-svelte-reactivity */
diff --git a/packages/svelte/src/lib/plugins/Minimap/Minimap.svelte b/packages/svelte/src/lib/plugins/Minimap/Minimap.svelte
index d2fb8263..33209dcb 100644
--- a/packages/svelte/src/lib/plugins/Minimap/Minimap.svelte
+++ b/packages/svelte/src/lib/plugins/Minimap/Minimap.svelte
@@ -128,7 +128,7 @@
             y={node.internals.positionAbsolute.y}
             {...nodeDimesions}
             selected={node.selected}
-            nodeComponent={nodeComponent}
+            {nodeComponent}
             color={nodeColorFunc?.(node)}
             borderRadius={nodeBorderRadius}
             strokeColor={nodeStrokeColorFunc(node)}
diff --git a/packages/svelte/src/lib/plugins/Minimap/MinimapNode.svelte b/packages/svelte/src/lib/plugins/Minimap/MinimapNode.svelte
index 1eb4cdeb..5fc092b8 100644
--- a/packages/svelte/src/lib/plugins/Minimap/MinimapNode.svelte
+++ b/packages/svelte/src/lib/plugins/Minimap/MinimapNode.svelte
@@ -34,8 +34,8 @@
 
 {#if nodeComponent}
   {@const CustomComponent = nodeComponent}
-  
-  <CustomComponent 
+
+  <CustomComponent
     {x}
     {y}
     {width}
diff --git a/packages/svelte/src/lib/plugins/NodeResizer/ResizeControl.svelte b/packages/svelte/src/lib/plugins/NodeResizer/ResizeControl.svelte
index 245f9cf8..8c6874e9 100644
--- a/packages/svelte/src/lib/plugins/NodeResizer/ResizeControl.svelte
+++ b/packages/svelte/src/lib/plugins/NodeResizer/ResizeControl.svelte
@@ -67,6 +67,7 @@
           };
         },
         onChange: (change: XYResizerChange, childChanges: XYResizerChildChange[]) => {
+          // eslint-disable-next-line svelte/prefer-svelte-reactivity
           const changes = new Map<string, Partial<Node>>();
           let position = change.x && change.y ? { x: change.x, y: change.y } : undefined;
           changes.set(id, { ...change, position });
diff --git a/packages/svelte/src/lib/store/initial-store.svelte.ts b/packages/svelte/src/lib/store/initial-store.svelte.ts
index 774fb317..9016972c 100644
--- a/packages/svelte/src/lib/store/initial-store.svelte.ts
+++ b/packages/svelte/src/lib/store/initial-store.svelte.ts
@@ -1,3 +1,5 @@
+/* eslint-disable svelte/prefer-svelte-reactivity */
+
 import {
   infiniteExtent,
   SelectionMode,
@@ -477,3 +479,5 @@ function warnIfDeeplyReactive(array: unknown[] | undefined, name: string) {
     console.warn(`Use $state.raw for ${name} to prevent performance issues.`);
   }
 }
+
+/* eslint-enable svelte/prefer-svelte-reactivity */