From e0d7dbe8a104d6cb29933a8c32784238b1f48e87 Mon Sep 17 00:00:00 2001
From: peterkogo <peter@xyflow.com>
Date: Thu, 18 Jan 2024 15:50:21 +0100
Subject: [PATCH] fixed focused, selectable css

---
 packages/react/src/components/EdgeWrapper/index.tsx | 1 +
 packages/system/src/styles/init.css                 | 4 ++--
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/react/src/components/EdgeWrapper/index.tsx b/packages/react/src/components/EdgeWrapper/index.tsx
index cb9b9c8b..28323a19 100644
--- a/packages/react/src/components/EdgeWrapper/index.tsx
+++ b/packages/react/src/components/EdgeWrapper/index.tsx
@@ -186,6 +186,7 @@ export function EdgeWrapper({
             animated: edge.animated,
             inactive: !isSelectable && !onClick,
             updating: updateHover,
+            selectable: isSelectable,
           },
         ])}
         onClick={onEdgeClick}
diff --git a/packages/system/src/styles/init.css b/packages/system/src/styles/init.css
index a688f6b9..14519c74 100644
--- a/packages/system/src/styles/init.css
+++ b/packages/system/src/styles/init.css
@@ -139,8 +139,8 @@
   }
 
   &.selected .xy-flow__edge-path,
-  &:focus .xy-flow__edge-path,
-  &:focus-visible .xy-flow__edge-path {
+  &.selectable:focus .xy-flow__edge-path,
+  &.selectable:focus-visible .xy-flow__edge-path {
     stroke: var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default));
   }