diff --git a/packages/react/src/components/Edges/StepEdge.tsx b/packages/react/src/components/Edges/StepEdge.tsx
index bb1833d4..6385e8f0 100644
--- a/packages/react/src/components/Edges/StepEdge.tsx
+++ b/packages/react/src/components/Edges/StepEdge.tsx
@@ -1,11 +1,11 @@
 import { memo, useMemo } from 'react';
 
 import { SmoothStepEdge } from './SmoothStepEdge';
-import type { SmoothStepEdgeProps } from '../../types';
+import type { StepEdgeProps } from '../../types';
 
 function createStepEdge(params: { isInternal: boolean }) {
   // eslint-disable-next-line react/display-name
-  return memo(({ id, ...props }: SmoothStepEdgeProps) => {
+  return memo(({ id, ...props }: StepEdgeProps) => {
     const _id = params.isInternal ? undefined : id;
 
     return (
diff --git a/packages/react/src/components/Edges/index.ts b/packages/react/src/components/Edges/index.ts
index dcd45701..21af9667 100644
--- a/packages/react/src/components/Edges/index.ts
+++ b/packages/react/src/components/Edges/index.ts
@@ -1,3 +1,7 @@
+// We distinguish between internal and exported edges
+// The internal edges are used directly like custom edges and always get an id, source and target props
+// If you import an edge from the library, the id is optional and source and target are not used at all
+
 export { SimpleBezierEdge, SimpleBezierEdgeInternal } from './SimpleBezierEdge';
 export { SmoothStepEdge, SmoothStepEdgeInternal } from './SmoothStepEdge';
 export { StepEdge, StepEdgeInternal } from './StepEdge';
diff --git a/packages/react/src/types/edges.ts b/packages/react/src/types/edges.ts
index db34416d..896c4605 100644
--- a/packages/react/src/types/edges.ts
+++ b/packages/react/src/types/edges.ts
@@ -14,6 +14,7 @@ import type {
   ConnectionStatus,
   EdgePosition,
   Optional,
+  StepPathOptions,
 } from '@xyflow/system';
 
 import { Node } from '.';
@@ -47,7 +48,12 @@ type BezierEdgeType<T> = DefaultEdge<T> & {
   pathOptions?: BezierPathOptions;
 };
 
-export type Edge<T = any> = DefaultEdge<T> | SmoothStepEdgeType<T> | BezierEdgeType<T>;
+type StepEdgeType<T> = DefaultEdge<T> & {
+  type: 'step';
+  pathOptions?: StepPathOptions;
+};
+
+export type Edge<T = any> = DefaultEdge<T> | SmoothStepEdgeType<T> | BezierEdgeType<T> | StepEdgeType<T>;
 
 export type EdgeMouseHandler = (event: ReactMouseEvent, edge: Edge) => void;
 
@@ -113,6 +119,10 @@ export type BezierEdgeProps<T = any> = EdgeComponentProps<T> & {
   pathOptions?: BezierPathOptions;
 };
 
+export type StepEdgeProps<T = any> = EdgeComponentProps<T> & {
+  pathOptions?: StepPathOptions;
+};
+
 export type SimpleBezierEdgeProps<T = any> = EdgeComponentProps<T>;
 
 export type OnEdgeUpdateFunc<T = any> = (oldEdge: Edge<T>, newConnection: Connection) => void;
diff --git a/packages/svelte/src/lib/components/EdgeWrapper/EdgeWrapper.svelte b/packages/svelte/src/lib/components/EdgeWrapper/EdgeWrapper.svelte
index fa4adc92..aad6d2b1 100644
--- a/packages/svelte/src/lib/components/EdgeWrapper/EdgeWrapper.svelte
+++ b/packages/svelte/src/lib/components/EdgeWrapper/EdgeWrapper.svelte
@@ -6,7 +6,7 @@
   import { errorMessages, getMarkerId } from '@xyflow/system';
 
   import { useStore } from '$lib/store';
-  import { BezierEdge } from '$lib/components/edges/internal';
+  import { BezierEdgeInternal } from '$lib/components/edges';
   import type { EdgeLayouted, Edge } from '$lib/types';
   import { get } from 'svelte/store';
 
@@ -57,7 +57,7 @@
     edgecontextmenu: { edge: Edge; event: MouseEvent };
   }>();
 
-  $: edgeComponent = $edgeTypes[type!] || BezierEdge;
+  $: edgeComponent = $edgeTypes[type!] || BezierEdgeInternal;
   $: markerStartUrl = markerStart ? `url(#${getMarkerId(markerStart, $flowId)})` : undefined;
   $: markerEndUrl = markerEnd ? `url(#${getMarkerId(markerEnd, $flowId)})` : undefined;
 
diff --git a/packages/svelte/src/lib/components/edges/BezierEdge.svelte b/packages/svelte/src/lib/components/edges/BezierEdge.svelte
deleted file mode 100644
index ef5fd3db..00000000
--- a/packages/svelte/src/lib/components/edges/BezierEdge.svelte
+++ /dev/null
@@ -1,30 +0,0 @@
-<script lang="ts">
-  import { getBezierPath, type Optional } from '@xyflow/system';
-
-  import type { EdgeProps } from '$lib/types';
-  import { BaseEdge } from '$lib/components/BaseEdge';
-
-  type $$Props = Optional<EdgeProps, 'id' | 'target' | 'source'>;
-
-  $: [path, labelX, labelY] = getBezierPath({
-    sourceX: $$props.sourceX,
-    sourceY: $$props.sourceY,
-    targetX: $$props.targetX,
-    targetY: $$props.targetY,
-    sourcePosition: $$props.sourcePosition,
-    targetPosition: $$props.targetPosition
-  });
-</script>
-
-<BaseEdge
-  {path}
-  {labelX}
-  {labelY}
-  id={$$props.id}
-  label={$$props.label}
-  labelStyle={$$props.labelStyle}
-  markerStart={$$props.markerStart}
-  markerEnd={$$props.markerEnd}
-  interactionWidth={$$props.interactionWidth}
-  style={$$props.style}
-/>
diff --git a/packages/svelte/src/lib/components/edges/BezierEdgeInternal.svelte b/packages/svelte/src/lib/components/edges/BezierEdge/BaseBezierEdge.svelte
similarity index 69%
rename from packages/svelte/src/lib/components/edges/BezierEdgeInternal.svelte
rename to packages/svelte/src/lib/components/edges/BezierEdge/BaseBezierEdge.svelte
index a1ca0658..749a5096 100644
--- a/packages/svelte/src/lib/components/edges/BezierEdgeInternal.svelte
+++ b/packages/svelte/src/lib/components/edges/BezierEdge/BaseBezierEdge.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
   import { getBezierPath } from '@xyflow/system';
 
-  import type { EdgeProps } from '$lib/types';
+  import type { BezierEdgeProps } from '$lib/types';
   import { BaseEdge } from '$lib/components/BaseEdge';
 
-  type $$Props = EdgeProps;
+  type $$Props = BezierEdgeProps & { internal?: boolean };
 
   $: [path, labelX, labelY] = getBezierPath({
     sourceX: $$props.sourceX,
@@ -12,14 +12,18 @@
     targetX: $$props.targetX,
     targetY: $$props.targetY,
     sourcePosition: $$props.sourcePosition,
-    targetPosition: $$props.targetPosition
+    targetPosition: $$props.targetPosition,
+    curvature: $$props.pathOptions?.curvature
   });
+
+  $: id = $$props.internal ? undefined : $$props.id;
 </script>
 
 <BaseEdge
   {path}
   {labelX}
   {labelY}
+  {id}
   label={$$props.label}
   labelStyle={$$props.labelStyle}
   markerStart={$$props.markerStart}
diff --git a/packages/svelte/src/lib/components/edges/BezierEdge/BezierEdge.svelte b/packages/svelte/src/lib/components/edges/BezierEdge/BezierEdge.svelte
new file mode 100644
index 00000000..9f93e7df
--- /dev/null
+++ b/packages/svelte/src/lib/components/edges/BezierEdge/BezierEdge.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import BaseBezierEdge from './BaseBezierEdge.svelte';
+  import type { BezierEdgeProps } from '$lib/types';
+
+  type $$Props = BezierEdgeProps;
+
+  $: props = $$props as $$Props;
+</script>
+
+<BaseBezierEdge {...props} />
diff --git a/packages/svelte/src/lib/components/edges/BezierEdge/BezierEdgeInternal.svelte b/packages/svelte/src/lib/components/edges/BezierEdge/BezierEdgeInternal.svelte
new file mode 100644
index 00000000..75d168f4
--- /dev/null
+++ b/packages/svelte/src/lib/components/edges/BezierEdge/BezierEdgeInternal.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import BaseBezierEdge from './BaseBezierEdge.svelte';
+  import type { EdgeProps } from '$lib/types';
+
+  type $$Props = EdgeProps;
+
+  $: props = $$props as $$Props;
+</script>
+
+<BaseBezierEdge {...props} internal />
diff --git a/packages/svelte/src/lib/components/edges/SmoothStepEdge.svelte b/packages/svelte/src/lib/components/edges/SmoothStepEdge.svelte
deleted file mode 100644
index f528da0e..00000000
--- a/packages/svelte/src/lib/components/edges/SmoothStepEdge.svelte
+++ /dev/null
@@ -1,30 +0,0 @@
-<script lang="ts">
-  import { getSmoothStepPath, type Optional } from '@xyflow/system';
-
-  import type { EdgeProps } from '$lib/types';
-  import { BaseEdge } from '$lib/components/BaseEdge';
-
-  type $$Props = Optional<EdgeProps, 'id' | 'target' | 'source'>;
-
-  $: [path, labelX, labelY] = getSmoothStepPath({
-    sourceX: $$props.sourceX,
-    sourceY: $$props.sourceY,
-    targetX: $$props.targetX,
-    targetY: $$props.targetY,
-    sourcePosition: $$props.sourcePosition,
-    targetPosition: $$props.targetPosition
-  });
-</script>
-
-<BaseEdge
-  {path}
-  {labelX}
-  {labelY}
-  id={$$props.id}
-  label={$$props.label}
-  labelStyle={$$props.labelStyle}
-  markerStart={$$props.markerStart}
-  markerEnd={$$props.markerEnd}
-  interactionWidth={$$props.interactionWidth}
-  style={$$props.style}
-/>
diff --git a/packages/svelte/src/lib/components/edges/SmoothStepEdgeInternal.svelte b/packages/svelte/src/lib/components/edges/SmoothStepEdge/BaseSmoothStepEdge.svelte
similarity index 65%
rename from packages/svelte/src/lib/components/edges/SmoothStepEdgeInternal.svelte
rename to packages/svelte/src/lib/components/edges/SmoothStepEdge/BaseSmoothStepEdge.svelte
index 73324a89..5ec4dd89 100644
--- a/packages/svelte/src/lib/components/edges/SmoothStepEdgeInternal.svelte
+++ b/packages/svelte/src/lib/components/edges/SmoothStepEdge/BaseSmoothStepEdge.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
   import { getSmoothStepPath } from '@xyflow/system';
 
-  import type { EdgeProps } from '$lib/types';
+  import type { SmoothStepEdgeProps } from '$lib/types';
   import { BaseEdge } from '$lib/components/BaseEdge';
 
-  type $$Props = EdgeProps;
+  type $$Props = SmoothStepEdgeProps & { internal?: boolean };
 
   $: [path, labelX, labelY] = getSmoothStepPath({
     sourceX: $$props.sourceX,
@@ -12,14 +12,19 @@
     targetX: $$props.targetX,
     targetY: $$props.targetY,
     sourcePosition: $$props.sourcePosition,
-    targetPosition: $$props.targetPosition
+    targetPosition: $$props.targetPosition,
+    borderRadius: $$props.pathOptions?.borderRadius,
+    offset: $$props.pathOptions?.offset
   });
+
+  $: id = $$props.internal ? undefined : $$props.id;
 </script>
 
 <BaseEdge
   {path}
   {labelX}
   {labelY}
+  {id}
   label={$$props.label}
   labelStyle={$$props.labelStyle}
   markerStart={$$props.markerStart}
diff --git a/packages/svelte/src/lib/components/edges/SmoothStepEdge/SmoothStepEdge.svelte b/packages/svelte/src/lib/components/edges/SmoothStepEdge/SmoothStepEdge.svelte
new file mode 100644
index 00000000..1cac5d1c
--- /dev/null
+++ b/packages/svelte/src/lib/components/edges/SmoothStepEdge/SmoothStepEdge.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import BaseSmoothStepEdge from './BaseSmoothStepEdge.svelte';
+  import type { SmoothStepEdgeProps } from '$lib/types';
+
+  type $$Props = SmoothStepEdgeProps;
+
+  $: props = $$props as $$Props;
+</script>
+
+<BaseSmoothStepEdge {...props} />
diff --git a/packages/svelte/src/lib/components/edges/SmoothStepEdge/SmoothStepEdgeInternal.svelte b/packages/svelte/src/lib/components/edges/SmoothStepEdge/SmoothStepEdgeInternal.svelte
new file mode 100644
index 00000000..803247c2
--- /dev/null
+++ b/packages/svelte/src/lib/components/edges/SmoothStepEdge/SmoothStepEdgeInternal.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import BaseSmoothStepEdge from './BaseSmoothStepEdge.svelte';
+  import type { EdgeProps } from '$lib/types';
+
+  type $$Props = EdgeProps;
+
+  $: props = $$props as $$Props;
+</script>
+
+<BaseSmoothStepEdge {...props} internal />
diff --git a/packages/svelte/src/lib/components/edges/StepEdge.svelte b/packages/svelte/src/lib/components/edges/StepEdge.svelte
deleted file mode 100644
index b0860d03..00000000
--- a/packages/svelte/src/lib/components/edges/StepEdge.svelte
+++ /dev/null
@@ -1,31 +0,0 @@
-<script lang="ts">
-  import { getSmoothStepPath, type Optional } from '@xyflow/system';
-
-  import type { EdgeProps } from '$lib/types';
-  import { BaseEdge } from '$lib/components/BaseEdge';
-
-  type $$Props = Optional<EdgeProps, 'id' | 'target' | 'source'>;
-
-  $: [path, labelX, labelY] = getSmoothStepPath({
-    sourceX: $$props.sourceX,
-    sourceY: $$props.sourceY,
-    targetX: $$props.targetX,
-    targetY: $$props.targetY,
-    sourcePosition: $$props.sourcePosition,
-    targetPosition: $$props.targetPosition,
-    borderRadius: 0
-  });
-</script>
-
-<BaseEdge
-  {path}
-  {labelX}
-  {labelY}
-  id={$$props.id}
-  label={$$props.label}
-  labelStyle={$$props.labelStyle}
-  markerStart={$$props.markerStart}
-  markerEnd={$$props.markerEnd}
-  interactionWidth={$$props.interactionWidth}
-  style={$$props.style}
-/>
diff --git a/packages/svelte/src/lib/components/edges/StepEdgeInternal.svelte b/packages/svelte/src/lib/components/edges/StepEdge/BaseStepEdge.svelte
similarity index 73%
rename from packages/svelte/src/lib/components/edges/StepEdgeInternal.svelte
rename to packages/svelte/src/lib/components/edges/StepEdge/BaseStepEdge.svelte
index f793376b..4099e7d5 100644
--- a/packages/svelte/src/lib/components/edges/StepEdgeInternal.svelte
+++ b/packages/svelte/src/lib/components/edges/StepEdge/BaseStepEdge.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
   import { getSmoothStepPath } from '@xyflow/system';
 
-  import type { EdgeProps } from '$lib/types';
+  import type { StepEdgeProps } from '$lib/types';
   import { BaseEdge } from '$lib/components/BaseEdge';
 
-  type $$Props = EdgeProps;
+  type $$Props = StepEdgeProps & { internal?: boolean };
 
   $: [path, labelX, labelY] = getSmoothStepPath({
     sourceX: $$props.sourceX,
@@ -13,14 +13,18 @@
     targetY: $$props.targetY,
     sourcePosition: $$props.sourcePosition,
     targetPosition: $$props.targetPosition,
-    borderRadius: 0
+    borderRadius: 0,
+    offset: $$props.pathOptions?.offset
   });
+
+  $: id = $$props.internal ? undefined : $$props.id;
 </script>
 
 <BaseEdge
   {path}
   {labelX}
   {labelY}
+  {id}
   label={$$props.label}
   labelStyle={$$props.labelStyle}
   markerStart={$$props.markerStart}
diff --git a/packages/svelte/src/lib/components/edges/StepEdge/StepEdge.svelte b/packages/svelte/src/lib/components/edges/StepEdge/StepEdge.svelte
new file mode 100644
index 00000000..49522e95
--- /dev/null
+++ b/packages/svelte/src/lib/components/edges/StepEdge/StepEdge.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import BaseStepEdge from './BaseStepEdge.svelte';
+  import type { StepEdgeProps } from '$lib/types';
+
+  type $$Props = StepEdgeProps;
+
+  $: props = $$props as $$Props;
+</script>
+
+<BaseStepEdge {...props} />
diff --git a/packages/svelte/src/lib/components/edges/StepEdge/StepEdgeInternal.svelte b/packages/svelte/src/lib/components/edges/StepEdge/StepEdgeInternal.svelte
new file mode 100644
index 00000000..21109992
--- /dev/null
+++ b/packages/svelte/src/lib/components/edges/StepEdge/StepEdgeInternal.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import BaseStepEdge from './BaseStepEdge.svelte';
+  import type { EdgeProps } from '$lib/types';
+
+  type $$Props = EdgeProps;
+
+  $: props = $$props as $$Props;
+</script>
+
+<BaseStepEdge {...props} internal />
diff --git a/packages/svelte/src/lib/components/edges/StraightEdge.svelte b/packages/svelte/src/lib/components/edges/StraightEdge.svelte
deleted file mode 100644
index 979c4351..00000000
--- a/packages/svelte/src/lib/components/edges/StraightEdge.svelte
+++ /dev/null
@@ -1,28 +0,0 @@
-<script lang="ts">
-  import { getStraightPath, type Optional } from '@xyflow/system';
-
-  import type { EdgeProps } from '$lib/types';
-  import { BaseEdge } from '$lib/components/BaseEdge';
-
-  type $$Props = Optional<EdgeProps, 'id' | 'target' | 'source'>;
-
-  $: [path, labelX, labelY] = getStraightPath({
-    sourceX: $$props.sourceX,
-    sourceY: $$props.sourceY,
-    targetX: $$props.targetX,
-    targetY: $$props.targetY
-  });
-</script>
-
-<BaseEdge
-  {path}
-  {labelX}
-  {labelY}
-  id={$$props.id}
-  label={$$props.label}
-  labelStyle={$$props.labelStyle}
-  markerStart={$$props.markerStart}
-  markerEnd={$$props.markerEnd}
-  interactionWidth={$$props.interactionWidth}
-  style={$$props.style}
-/>
diff --git a/packages/svelte/src/lib/components/edges/StraightEdgeInternal.svelte b/packages/svelte/src/lib/components/edges/StraightEdge/BaseStraightEdge.svelte
similarity index 75%
rename from packages/svelte/src/lib/components/edges/StraightEdgeInternal.svelte
rename to packages/svelte/src/lib/components/edges/StraightEdge/BaseStraightEdge.svelte
index 8cc984d7..5db480ca 100644
--- a/packages/svelte/src/lib/components/edges/StraightEdgeInternal.svelte
+++ b/packages/svelte/src/lib/components/edges/StraightEdge/BaseStraightEdge.svelte
@@ -1,10 +1,10 @@
 <script lang="ts">
   import { getStraightPath } from '@xyflow/system';
 
-  import type { EdgeProps } from '$lib/types';
+  import type { SmoothStepEdgeProps } from '$lib/types';
   import { BaseEdge } from '$lib/components/BaseEdge';
 
-  type $$Props = EdgeProps;
+  type $$Props = SmoothStepEdgeProps & { internal?: boolean };
 
   $: [path, labelX, labelY] = getStraightPath({
     sourceX: $$props.sourceX,
@@ -12,12 +12,15 @@
     targetX: $$props.targetX,
     targetY: $$props.targetY
   });
+
+  $: id = $$props.internal ? undefined : $$props.id;
 </script>
 
 <BaseEdge
   {path}
   {labelX}
   {labelY}
+  {id}
   label={$$props.label}
   labelStyle={$$props.labelStyle}
   markerStart={$$props.markerStart}
diff --git a/packages/svelte/src/lib/components/edges/StraightEdge/StraightEdge.svelte b/packages/svelte/src/lib/components/edges/StraightEdge/StraightEdge.svelte
new file mode 100644
index 00000000..d7153544
--- /dev/null
+++ b/packages/svelte/src/lib/components/edges/StraightEdge/StraightEdge.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import BaseStraighEdge from './BaseStraightEdge.svelte';
+  import type { StraightEdgeProps } from '$lib/types';
+
+  type $$Props = StraightEdgeProps;
+
+  $: props = $$props as $$Props;
+</script>
+
+<BaseStraighEdge {...props} />
diff --git a/packages/svelte/src/lib/components/edges/StraightEdge/StraightEdgeInternal.svelte b/packages/svelte/src/lib/components/edges/StraightEdge/StraightEdgeInternal.svelte
new file mode 100644
index 00000000..bad893b2
--- /dev/null
+++ b/packages/svelte/src/lib/components/edges/StraightEdge/StraightEdgeInternal.svelte
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import BaseStraighEdge from './BaseStraightEdge.svelte';
+  import type { EdgeProps } from '$lib/types';
+
+  type $$Props = EdgeProps;
+
+  $: props = $$props as $$Props;
+</script>
+
+<BaseStraighEdge {...props} internal />
diff --git a/packages/svelte/src/lib/components/edges/index.ts b/packages/svelte/src/lib/components/edges/index.ts
index 1f1567b6..19f1f129 100644
--- a/packages/svelte/src/lib/components/edges/index.ts
+++ b/packages/svelte/src/lib/components/edges/index.ts
@@ -1,4 +1,15 @@
-export { default as BezierEdge } from './BezierEdge.svelte';
-export { default as StraightEdge } from './StraightEdge.svelte';
-export { default as SmoothStepEdge } from './SmoothStepEdge.svelte';
-export { default as StepEdge } from './StepEdge.svelte';
+// We distinguish between internal and exported edges
+// The internal edges are used directly like custom edges and always get an id, source and target props
+// If you import an edge from the library, the id is optional and source and target are not used at all
+
+export { default as BezierEdge } from './BezierEdge/BezierEdge.svelte';
+export { default as BezierEdgeInternal } from './BezierEdge/BezierEdgeInternal.svelte';
+
+export { default as SmoothStepEdge } from './SmoothStepEdge/BaseSmoothStepEdge.svelte';
+export { default as SmoothStepEdgeInternal } from './SmoothStepEdge/SmoothStepEdgeInternal.svelte';
+
+export { default as StraightEdge } from './StraightEdge/StraightEdge.svelte';
+export { default as StraightEdgeInternal } from './StraightEdge/StraightEdgeInternal.svelte';
+
+export { default as StepEdge } from './StepEdge/StepEdge.svelte';
+export { default as StepEdgeInternal } from './StepEdge/StepEdgeInternal.svelte';
diff --git a/packages/svelte/src/lib/components/edges/internal.ts b/packages/svelte/src/lib/components/edges/internal.ts
deleted file mode 100644
index f2582b79..00000000
--- a/packages/svelte/src/lib/components/edges/internal.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export { default as BezierEdge } from './BezierEdgeInternal.svelte';
-export { default as StraightEdge } from './StraightEdgeInternal.svelte';
-export { default as SmoothStepEdge } from './SmoothStepEdgeInternal.svelte';
-export { default as StepEdge } from './StepEdgeInternal.svelte';
diff --git a/packages/svelte/src/lib/store/initial-store.ts b/packages/svelte/src/lib/store/initial-store.ts
index 65acad86..dcfee4db 100644
--- a/packages/svelte/src/lib/store/initial-store.ts
+++ b/packages/svelte/src/lib/store/initial-store.ts
@@ -25,7 +25,12 @@ import InputNode from '$lib/components/nodes/InputNode.svelte';
 import OutputNode from '$lib/components/nodes/OutputNode.svelte';
 import GroupNode from '$lib/components/nodes/GroupNode.svelte';
 
-import { BezierEdge, StraightEdge, StepEdge, SmoothStepEdge } from '$lib/components/edges/internal';
+import {
+  BezierEdgeInternal,
+  SmoothStepEdgeInternal,
+  StraightEdgeInternal,
+  StepEdgeInternal
+} from '$lib/components/edges';
 
 import type {
   NodeTypes,
@@ -47,10 +52,10 @@ export const initialNodeTypes = {
 };
 
 export const initialEdgeTypes = {
-  straight: StraightEdge,
-  smoothstep: SmoothStepEdge,
-  default: BezierEdge,
-  step: StepEdge
+  straight: StraightEdgeInternal,
+  smoothstep: SmoothStepEdgeInternal,
+  default: BezierEdgeInternal,
+  step: StepEdgeInternal
 };
 
 export const getInitialStore = ({
diff --git a/packages/svelte/src/lib/types/edges.ts b/packages/svelte/src/lib/types/edges.ts
index 33f0d908..0a666ce7 100644
--- a/packages/svelte/src/lib/types/edges.ts
+++ b/packages/svelte/src/lib/types/edges.ts
@@ -5,7 +5,9 @@ import type {
   BezierPathOptions,
   DefaultEdgeOptionsBase,
   EdgePosition,
-  SmoothStepPathOptions
+  SmoothStepPathOptions,
+  Optional,
+  StepPathOptions
 } from '@xyflow/system';
 
 import type { Node } from '$lib/types';
@@ -29,6 +31,7 @@ type BezierEdgeType<T> = DefaultEdge<T> & {
 
 type StepEdgeType<T> = DefaultEdge<T> & {
   type: 'step';
+  pathOptions?: StepPathOptions;
 };
 
 export type Edge<T = any> =
@@ -37,7 +40,7 @@ export type Edge<T = any> =
   | BezierEdgeType<T>
   | StepEdgeType<T>;
 
-export type EdgeProps = Omit<Edge, 'sourceHandle' | 'targetHandle'> &
+export type EdgeProps<T = any> = Omit<Edge<T>, 'sourceHandle' | 'targetHandle'> &
   EdgePosition & {
     markerStart?: string;
     markerEnd?: string;
@@ -45,6 +48,22 @@ export type EdgeProps = Omit<Edge, 'sourceHandle' | 'targetHandle'> &
     targetHandleId?: string | null;
   };
 
+export type EdgeComponentProps<T = any> = Optional<Omit<EdgeProps<T>, 'source' | 'target'>, 'id'>;
+
+export type BezierEdgeProps<T = any> = EdgeComponentProps<T> & {
+  pathOptions?: BezierPathOptions;
+};
+
+export type SmoothStepEdgeProps<T = any> = EdgeComponentProps<T> & {
+  pathOptions?: SmoothStepPathOptions;
+};
+
+export type StepEdgeProps<T = any> = EdgeComponentProps<T> & {
+  pathOptions?: StepPathOptions;
+};
+
+export type StraightEdgeProps<T = any> = EdgeComponentProps<T>;
+
 export type EdgeTypes = Record<string, ComponentType<SvelteComponent<EdgeProps>>>;
 
 export type DefaultEdgeOptions = Omit<DefaultEdgeOptionsBase<Edge>, 'focusable'>;
diff --git a/packages/system/src/types/edges.ts b/packages/system/src/types/edges.ts
index 855682d2..65c8e641 100644
--- a/packages/system/src/types/edges.ts
+++ b/packages/system/src/types/edges.ts
@@ -27,6 +27,10 @@ export type SmoothStepPathOptions = {
   borderRadius?: number;
 };
 
+export type StepPathOptions = {
+  offset?: number;
+};
+
 export type BezierPathOptions = {
   curvature?: number;
 };