diff --git a/packages/svelte/src/lib/components/BaseEdge/BaseEdge.svelte b/packages/svelte/src/lib/components/BaseEdge/BaseEdge.svelte
index b0591ce2..36b3763e 100644
--- a/packages/svelte/src/lib/components/BaseEdge/BaseEdge.svelte
+++ b/packages/svelte/src/lib/components/BaseEdge/BaseEdge.svelte
@@ -18,7 +18,6 @@
   let className: $$Props['class'] = undefined;
   export { className as class };
 
-  // @todo, why is interactionWidth undefined after first re-render?
   let interactionWidthValue = interactionWidth === undefined ? 20 : interactionWidth;
 </script>
 
@@ -43,7 +42,7 @@
 {/if}
 
 {#if label}
-  <EdgeLabel {labelX} {labelY} {labelStyle}>
+  <EdgeLabel x={labelX} y={labelY} style={labelStyle}>
     {label}
   </EdgeLabel>
 {/if}
diff --git a/packages/svelte/src/lib/components/EdgeLabel/EdgeLabel.svelte b/packages/svelte/src/lib/components/EdgeLabel/EdgeLabel.svelte
index 98467787..eb0c794f 100644
--- a/packages/svelte/src/lib/components/EdgeLabel/EdgeLabel.svelte
+++ b/packages/svelte/src/lib/components/EdgeLabel/EdgeLabel.svelte
@@ -4,9 +4,9 @@
   import { getContext } from 'svelte';
   import type { BaseEdgeProps } from '../BaseEdge/types';
 
-  export let labelStyle: BaseEdgeProps['labelStyle'] = undefined;
-  export let labelX: BaseEdgeProps['labelX'] = undefined;
-  export let labelY: BaseEdgeProps['labelY'] = undefined;
+  export let style: BaseEdgeProps['labelStyle'] = undefined;
+  export let x: BaseEdgeProps['labelX'] = undefined;
+  export let y: BaseEdgeProps['labelY'] = undefined;
 
   const handleEdgeSelect = useHandleEdgeSelect();
 
@@ -16,8 +16,8 @@
 <EdgeLabelRenderer>
   <div
     class="svelte-flow__edge-label"
-    style:transform="translate(-50%, -50%) translate({labelX}px,{labelY}px)"
-    style={'pointer-events: all;' + labelStyle}
+    style:transform="translate(-50%, -50%) translate({x}px,{y}px)"
+    style={'pointer-events: all;' + style}
     on:click={() => {
       if (id) handleEdgeSelect(id);
     }}