From adb13e261da02ebf876ac0fb7cfadea23b526a06 Mon Sep 17 00:00:00 2001
From: peterkogo <peter@xyflow.com>
Date: Wed, 30 Apr 2025 16:20:23 +0200
Subject: [PATCH] fix selection bug on safari

---
 packages/svelte/src/lib/container/SvelteFlow/Wrapper.svelte | 5 ++++-
 packages/svelte/src/styles/base.css                         | 4 ++++
 packages/svelte/src/styles/style.css                        | 4 ++++
 3 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/packages/svelte/src/lib/container/SvelteFlow/Wrapper.svelte b/packages/svelte/src/lib/container/SvelteFlow/Wrapper.svelte
index 42d86c30..531ee861 100644
--- a/packages/svelte/src/lib/container/SvelteFlow/Wrapper.svelte
+++ b/packages/svelte/src/lib/container/SvelteFlow/Wrapper.svelte
@@ -82,6 +82,9 @@
     nodesFocusable,
     edgesFocusable,
     disableKeyboardA11y,
+    noDragClass,
+    noPanClass,
+    noWheelClass,
     ...divAttributes
   } = $derived(rest);
   /* eslint-enable @typescript-eslint/no-unused-vars */
@@ -97,7 +100,7 @@
   bind:clientWidth
   style:width={toPxString(width)}
   style:height={toPxString(height)}
-  class={['svelte-flow', 'svelte-flow-container', className, colorMode]}
+  class={['svelte-flow', 'svelte-flow__container', className, colorMode]}
   data-testid="svelte-flow__wrapper"
   role="application"
   {...divAttributes satisfies OnlyDivAttributes<typeof divAttributes>}
diff --git a/packages/svelte/src/styles/base.css b/packages/svelte/src/styles/base.css
index a0cf3040..56bfb526 100644
--- a/packages/svelte/src/styles/base.css
+++ b/packages/svelte/src/styles/base.css
@@ -7,3 +7,7 @@
   text-align: center;
   position: absolute;
 }
+
+.svelte-flow__container {
+  user-select: none;
+}
diff --git a/packages/svelte/src/styles/style.css b/packages/svelte/src/styles/style.css
index 3627b554..dc35ccc6 100644
--- a/packages/svelte/src/styles/style.css
+++ b/packages/svelte/src/styles/style.css
@@ -11,3 +11,7 @@
   color: var(--xy-edge-label-color, var(--xy-edge-label-color-default));
   background: var(--xy-edge-label-background-color, var(--xy-edge-label-background-color-default));
 }
+
+.svelte-flow__container {
+  user-select: none;
+}