From a72ab2f2dc8c892c6e90b6a6970cfd05c79d4898 Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Wed, 10 May 2023 12:32:25 +0200
Subject: [PATCH 1/2] refactor(base-edge): pass id to base edge path

---
 examples/vite-app/src/examples/Edges/CustomEdge.tsx  | 4 ++--
 examples/vite-app/src/examples/Edges/CustomEdge2.tsx | 5 ++---
 packages/core/src/components/Edges/BaseEdge.tsx      | 2 ++
 packages/core/src/types/edges.ts                     | 1 +
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/examples/vite-app/src/examples/Edges/CustomEdge.tsx b/examples/vite-app/src/examples/Edges/CustomEdge.tsx
index ec7dfb74..ff700413 100644
--- a/examples/vite-app/src/examples/Edges/CustomEdge.tsx
+++ b/examples/vite-app/src/examples/Edges/CustomEdge.tsx
@@ -1,5 +1,5 @@
 import { FC } from 'react';
-import { EdgeProps, getBezierPath } from 'reactflow';
+import { BaseEdge, EdgeProps, getBezierPath } from 'reactflow';
 
 const CustomEdge: FC<EdgeProps> = ({
   id,
@@ -22,7 +22,7 @@ const CustomEdge: FC<EdgeProps> = ({
 
   return (
     <>
-      <path id={id} className="react-flow__edge-path" d={edgePath} />
+      <BaseEdge path={edgePath} id={id} />
       <text>
         <textPath href={`#${id}`} style={{ fontSize: '12px' }} startOffset="50%" textAnchor="middle">
           {data.text}
diff --git a/examples/vite-app/src/examples/Edges/CustomEdge2.tsx b/examples/vite-app/src/examples/Edges/CustomEdge2.tsx
index 0ad41920..b40f12cb 100644
--- a/examples/vite-app/src/examples/Edges/CustomEdge2.tsx
+++ b/examples/vite-app/src/examples/Edges/CustomEdge2.tsx
@@ -1,5 +1,5 @@
 import { FC } from 'react';
-import { EdgeProps, getBezierPath, EdgeText } from 'reactflow';
+import { EdgeProps, getBezierPath, EdgeText, BaseEdge } from 'reactflow';
 
 const CustomEdge: FC<EdgeProps> = ({
   id,
@@ -22,7 +22,7 @@ const CustomEdge: FC<EdgeProps> = ({
 
   return (
     <>
-      <path id={id} className="react-flow__edge-path" d={edgePath} />
+      <BaseEdge id={id} path={edgePath} />
       <EdgeText
         x={labelX}
         y={labelY}
@@ -34,7 +34,6 @@ const CustomEdge: FC<EdgeProps> = ({
         labelBgBorderRadius={2}
         onClick={() => console.log(data)}
       />
-      ;
     </>
   );
 };
diff --git a/packages/core/src/components/Edges/BaseEdge.tsx b/packages/core/src/components/Edges/BaseEdge.tsx
index dc60493c..a9202820 100644
--- a/packages/core/src/components/Edges/BaseEdge.tsx
+++ b/packages/core/src/components/Edges/BaseEdge.tsx
@@ -3,6 +3,7 @@ import { isNumeric } from '../../utils';
 import type { BaseEdgeProps } from '../../types';
 
 const BaseEdge = ({
+  id,
   path,
   labelX,
   labelY,
@@ -20,6 +21,7 @@ const BaseEdge = ({
   return (
     <>
       <path
+        id={id}
         style={style}
         d={path}
         fill="none"
diff --git a/packages/core/src/types/edges.ts b/packages/core/src/types/edges.ts
index 7358b0e8..1899dcc5 100644
--- a/packages/core/src/types/edges.ts
+++ b/packages/core/src/types/edges.ts
@@ -121,6 +121,7 @@ export type EdgeProps<T = any> = Pick<
 
 export type BaseEdgeProps = Pick<EdgeProps, 'style' | 'markerStart' | 'markerEnd' | 'interactionWidth'> &
   EdgeLabelOptions & {
+    id?: string;
     labelX?: number;
     labelY?: number;
     path: string;

From 07b975bbee3580249e36a19582213b250f78093c Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Wed, 10 May 2023 12:33:12 +0200
Subject: [PATCH 2/2] chore(changeset): add

---
 .changeset/forty-peas-talk.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/forty-peas-talk.md

diff --git a/.changeset/forty-peas-talk.md b/.changeset/forty-peas-talk.md
new file mode 100644
index 00000000..ffeccbdf
--- /dev/null
+++ b/.changeset/forty-peas-talk.md
@@ -0,0 +1,5 @@
+---
+'@reactflow/core': patch
+---
+
+refactor(base-edge): pass id to base edge path