From 7f54d3a38e6809214ad107e6691456bf7e5038cf Mon Sep 17 00:00:00 2001
From: Braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Thu, 21 Apr 2022 16:41:56 +0200
Subject: [PATCH] refactor(edges): Remove base edge from default edge types

# What's changed?

* Remove base-edge component for performance
---
 package/src/components/Edges/BezierEdge.vue   | 20 +++++++++++--------
 .../src/components/Edges/SimpleBezierEdge.vue | 20 +++++++++++--------
 .../src/components/Edges/SmoothStepEdge.vue   | 20 +++++++++++--------
 package/src/components/Edges/StraightEdge.vue | 20 +++++++++++--------
 4 files changed, 48 insertions(+), 32 deletions(-)

diff --git a/package/src/components/Edges/BezierEdge.vue b/package/src/components/Edges/BezierEdge.vue
index 8d72b484..9b2c2c57 100644
--- a/package/src/components/Edges/BezierEdge.vue
+++ b/package/src/components/Edges/BezierEdge.vue
@@ -2,7 +2,7 @@
 import { Position } from '../../types/flow'
 import type { EdgeProps } from '../../types/edge'
 import { getBezierPath, getBezierCenter } from './utils'
-import BaseEdge from './BaseEdge.vue'
+import EdgeText from './EdgeText.vue'
 
 const props = withDefaults(defineProps<EdgeProps>(), {
   selected: false,
@@ -45,18 +45,22 @@ export default {
 }
 </script>
 <template>
-  <BaseEdge
-    :path="path"
-    :center-x="centered[0]"
-    :center-y="centered[1]"
+  <path
+    :style="props.style"
+    :d="path"
+    class="vue-flow__edge-path"
+    :marker-end="props.markerEnd"
+    :marker-start="props.markerStart"
+  />
+  <EdgeText
+    v-if="props.label"
+    :x="centered[0]"
+    :y="centered[1]"
     :label="props.label"
     :label-style="props.labelStyle"
     :label-show-bg="props.labelShowBg"
     :label-bg-style="props.labelBgStyle"
     :label-bg-padding="props.labelBgPadding"
     :label-bg-border-radius="props.labelBgBorderRadius"
-    :style="props.style"
-    :marker-end="props.markerEnd"
-    :marker-start="props.markerStart"
   />
 </template>
diff --git a/package/src/components/Edges/SimpleBezierEdge.vue b/package/src/components/Edges/SimpleBezierEdge.vue
index ab68bc17..78de5868 100644
--- a/package/src/components/Edges/SimpleBezierEdge.vue
+++ b/package/src/components/Edges/SimpleBezierEdge.vue
@@ -2,7 +2,7 @@
 import { Position } from '../../types/flow'
 import type { EdgeProps } from '../../types/edge'
 import { getSimpleBezierPath, getSimpleBezierCenter } from './utils'
-import BaseEdge from './BaseEdge.vue'
+import EdgeText from './EdgeText.vue'
 
 const props = withDefaults(defineProps<EdgeProps>(), {
   selected: false,
@@ -43,18 +43,22 @@ export default {
 }
 </script>
 <template>
-  <BaseEdge
-    :path="path"
-    :center-x="centered[0]"
-    :center-y="centered[1]"
+  <path
+    :style="props.style"
+    :d="path"
+    class="vue-flow__edge-path"
+    :marker-end="props.markerEnd"
+    :marker-start="props.markerStart"
+  />
+  <EdgeText
+    v-if="props.label"
+    :x="centered[0]"
+    :y="centered[1]"
     :label="props.label"
     :label-style="props.labelStyle"
     :label-show-bg="props.labelShowBg"
     :label-bg-style="props.labelBgStyle"
     :label-bg-padding="props.labelBgPadding"
     :label-bg-border-radius="props.labelBgBorderRadius"
-    :style="props.style"
-    :marker-end="props.markerEnd"
-    :marker-start="props.markerStart"
   />
 </template>
diff --git a/package/src/components/Edges/SmoothStepEdge.vue b/package/src/components/Edges/SmoothStepEdge.vue
index e79be58d..b830b232 100644
--- a/package/src/components/Edges/SmoothStepEdge.vue
+++ b/package/src/components/Edges/SmoothStepEdge.vue
@@ -2,7 +2,7 @@
 import { Position } from '../../types'
 import type { SmoothStepEdgeProps } from '../../types/edge'
 import { getCenter, getSmoothStepPath } from './utils'
-import BaseEdge from './BaseEdge.vue'
+import EdgeText from './EdgeText.vue'
 
 const props = withDefaults(defineProps<SmoothStepEdgeProps>(), {
   selected: false,
@@ -46,18 +46,22 @@ export default {
 }
 </script>
 <template>
-  <BaseEdge
-    :path="path"
-    :center-x="centered[0]"
-    :center-y="centered[1]"
+  <path
+    :style="props.style"
+    :d="path"
+    class="vue-flow__edge-path"
+    :marker-end="props.markerEnd"
+    :marker-start="props.markerStart"
+  />
+  <EdgeText
+    v-if="props.label"
+    :x="centered[0]"
+    :y="centered[1]"
     :label="props.label"
     :label-style="props.labelStyle"
     :label-show-bg="props.labelShowBg"
     :label-bg-style="props.labelBgStyle"
     :label-bg-padding="props.labelBgPadding"
     :label-bg-border-radius="props.labelBgBorderRadius"
-    :style="props.style"
-    :marker-end="props.markerEnd"
-    :marker-start="props.markerStart"
   />
 </template>
diff --git a/package/src/components/Edges/StraightEdge.vue b/package/src/components/Edges/StraightEdge.vue
index 570e4ebe..c05ce886 100644
--- a/package/src/components/Edges/StraightEdge.vue
+++ b/package/src/components/Edges/StraightEdge.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { Position } from '../../types'
 import type { EdgeProps } from '../../types/edge'
-import BaseEdge from './BaseEdge.vue'
+import EdgeText from './EdgeText.vue'
 
 const props = withDefaults(defineProps<EdgeProps>(), {
   selected: false,
@@ -30,18 +30,22 @@ export default {
 }
 </script>
 <template>
-  <BaseEdge
-    :path="path"
-    :center-x="centerX"
-    :center-y="centerY"
+  <path
+    :style="props.style"
+    :d="path"
+    class="vue-flow__edge-path"
+    :marker-end="props.markerEnd"
+    :marker-start="props.markerStart"
+  />
+  <EdgeText
+    v-if="props.label"
+    :x="centerX"
+    :y="centerY"
     :label="props.label"
     :label-style="props.labelStyle"
     :label-show-bg="props.labelShowBg"
     :label-bg-style="props.labelBgStyle"
     :label-bg-padding="props.labelBgPadding"
     :label-bg-border-radius="props.labelBgBorderRadius"
-    :style="props.style"
-    :marker-end="props.markerEnd"
-    :marker-start="props.markerStart"
   />
 </template>