refactor(react/svelte): cleanup types

packages/svelte/src/lib/components/Handle/handler.ts

@@ -1,3 +1,4 @@
+import { get, type Writable } from 'svelte/store';
 import {
   getHostForElement,
   calcAutoPan,
@@ -10,7 +11,6 @@ import type {
   HandleType,
   Connection,
   ConnectionMode,
-  Node,
   XYPosition,
   Transform
 } from '@reactflow/system';
@@ -25,8 +25,7 @@ import {
   type ConnectionHandle,
   type ValidConnectionFunc
 } from './utils';
-import { get, type Writable } from 'svelte/store';
-import type { ConnectionData } from '$lib/types';
+import type { ConnectionData, Node } from '$lib/types';
 
 export function handlePointerDown({
   event,

packages/svelte/src/lib/components/Handle/index.svelte

@@ -9,9 +9,9 @@
 
   type $$Props = HandleProps;
 
+  export let id: $$Props['id'] = undefined;
   export let type: $$Props['type'] = 'source';
   export let position: $$Props['position'] = Position.Top;
-  export let id: $$Props['id'] = undefined;
   export let isConnectable: $$Props['isConnectable'] = true;
   export let isValidConnection: $$Props['isValidConnection'] = (_: Connection) => true;
   let className: string | null = null;

packages/svelte/src/lib/components/Handle/utils.ts

@@ -1,7 +1,9 @@
 import { internalsSymbol, ConnectionMode, type ConnectionStatus } from '@reactflow/system';
-import type { Connection, HandleType, XYPosition, Node, NodeHandleBounds } from '@reactflow/system';
+import type { Connection, HandleType, XYPosition, NodeHandleBounds } from '@reactflow/system';
 import { getEventPosition } from '@reactflow/utils';
 
+import type { Node } from '$lib/types';
+
 export type ConnectionHandle = {
   id: string | null;
   type: HandleType;

packages/svelte/src/lib/components/edges/BaseEdge.svelte

@@ -1,13 +1,13 @@
 <script lang="ts">
-  import type { BaseEdgeProps } from '$lib/types';
   import EdgeLabelRenderer from '$lib/components/EdgeLabelRenderer/index.svelte';
+  import type { BaseEdgeProps } from '$lib/types';
 
   type $$Props = BaseEdgeProps;
 
-  export let path: $$Props['path'];
-  export let label: $$Props['label'];
-  export let labelX: $$Props['labelX'];
-  export let labelY: $$Props['labelY'];
+  export let path: $$Props['path'] = '';
+  export let label: $$Props['label'] = undefined;
+  export let labelX: $$Props['labelX'] = undefined;
+  export let labelY: $$Props['labelY'] = undefined;
   export let interactionWidth: $$Props['interactionWidth'] = 20;
 </script>
 

packages/svelte/src/lib/components/edges/EdgeWrapper.svelte

@@ -4,9 +4,9 @@
 
   import { useStore } from '$lib/store';
   import BezierEdge from '$lib/components/edges/StraightEdge.svelte';
-  import type { EdgeProps, WrapEdgeProps } from '$lib/types';
+  import type { EdgeProps, EdgeLayouted } from '$lib/types';
 
-  type $$Props = WrapEdgeProps;
+  type $$Props = EdgeLayouted;
 
   export let id: $$Props['id'];
   export let type: $$Props['type'] = 'default';
@@ -16,6 +16,8 @@
   export let sourceY: $$Props['sourceY'] = 0;
   export let targetX: $$Props['targetX'] = 0;
   export let targetY: $$Props['targetY'] = 0;
+  export let sourceHandleId: $$Props['sourceHandleId'] = undefined;
+  export let targetHandleId: $$Props['targetHandleId'] = undefined;
   export let sourcePosition: $$Props['sourcePosition'] = Position.Bottom;
   export let targetPosition: $$Props['targetPosition'] = Position.Top;
   export let animated: $$Props['animated'] = false;