From ee53f8baf7090a8e000eb28e97a6fd7bcceb7087 Mon Sep 17 00:00:00 2001
From: peterkogo <peter@xyflow.com>
Date: Fri, 6 Feb 2026 19:41:24 +0100
Subject: [PATCH] add reproduction of the bug

---
 examples/react/src/App/routes.ts              |  6 +++
 .../src/examples/NodeSelectionBug/index.tsx   | 41 +++++++++++++++++++
 2 files changed, 47 insertions(+)
 create mode 100644 examples/react/src/examples/NodeSelectionBug/index.tsx

diff --git a/examples/react/src/App/routes.ts b/examples/react/src/App/routes.ts
index 055dc9e1..d5bbfe01 100644
--- a/examples/react/src/App/routes.ts
+++ b/examples/react/src/App/routes.ts
@@ -62,6 +62,7 @@ import MovingHandles from '../examples/MovingHandles';
 import DetachedHandle from '../examples/DetachedHandle';
 import ZIndexMode from '../examples/ZIndexMode';
 import Middlewares from '../examples/Middlewares';
+import NodeSelectionBug from '../examples/NodeSelectionBug';
 
 export interface IRoute {
   name: string;
@@ -390,6 +391,11 @@ const routes: IRoute[] = [
     path: 'z-index-mode',
     component: ZIndexMode,
   },
+  {
+    name: 'Node Selection Bug',
+    path: 'node-selection-bug',
+    component: NodeSelectionBug,
+  },
 ];
 
 export default routes;
diff --git a/examples/react/src/examples/NodeSelectionBug/index.tsx b/examples/react/src/examples/NodeSelectionBug/index.tsx
new file mode 100644
index 00000000..a587cab3
--- /dev/null
+++ b/examples/react/src/examples/NodeSelectionBug/index.tsx
@@ -0,0 +1,41 @@
+import { Node, ReactFlow, useNodesState } from '@xyflow/react';
+
+import '@xyflow/react/dist/style.css';
+import { useRef } from 'react';
+
+export default function App() {
+  const [nodes, setNodes, onNodesChange] = useNodesState<Node>([
+    {
+      id: '0',
+      position: { x: 0, y: 0 },
+      data: { label: 'Rectangle Select Me First' },
+    },
+  ]);
+  const id = useRef(0);
+  return (
+    <>
+      <button
+        onClick={() =>
+          setNodes((nodes) => [
+            ...nodes.map((node) => ({ ...node, selected: false })),
+            {
+              id: (++id.current).toString(),
+              position: { x: -100, y: 100 * Math.floor((id.current + 1) / 2) },
+              data: { label: `Button Node ${id.current}` },
+              selected: true,
+            },
+            {
+              id: (++id.current).toString(),
+              position: { x: 100, y: (100 * id.current) / 2 },
+              data: { label: `Button Node ${id.current}` },
+              selected: true,
+            },
+          ])
+        }
+      >
+        Click me to add nodes that are already selected.
+      </button>
+      <ReactFlow nodes={nodes} onNodesChange={onNodesChange} fitView></ReactFlow>
+    </>
+  );
+}