refactor(react/svelte): simplify ssr usage

packages/system/src/types/nodes.ts

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { internalsSymbol } from '../constants';
 import type { XYPosition, Position, CoordinateExtent, HandleElement } from '.';
+import { Optional } from '../utils/types';
 
 // this is stuff that all nodes share independent of the framework
 export type NodeBase<T = any, U extends string | undefined = string | undefined> = {
@@ -28,7 +29,7 @@ export type NodeBase<T = any, U extends string | undefined = string | undefined>
   ariaLabel?: string;
   focusable?: boolean;
   origin?: NodeOrigin;
-  handles?: HandleElement[];
+  handles?: NodeHandle[];
   size?: {
     width?: number;
     height?: number;
@@ -94,3 +95,5 @@ export type NodeOrigin = [number, number];
 export type OnNodeDrag = (event: MouseEvent, node: NodeBase, nodes: NodeBase[]) => void;
 
 export type OnSelectionDrag = (event: MouseEvent, nodes: NodeBase[]) => void;
+
+export type NodeHandle = Optional<HandleElement, 'width' | 'height'>;

packages/system/src/utils/edges/positions.ts

@@ -1,6 +1,6 @@
 import { EdgePosition } from '../../types/edges';
 import { ConnectionMode, OnError } from '../../types/general';
-import { NodeBase, NodeHandleBounds } from '../../types/nodes';
+import { NodeBase, NodeHandle, NodeHandleBounds } from '../../types/nodes';
 import { Position, Rect, XYPosition } from '../../types/utils';
 import { errorMessages, internalsSymbol } from '../../constants';
 import { HandleElement } from '../../types';
@@ -59,19 +59,22 @@ export function getEdgePosition(params: GetEdgePositionParams): EdgePosition | n
   };
 }
 
-function toHandleBounds(handles?: HandleElement[]) {
+function toHandleBounds(handles?: NodeHandle[]) {
   if (!handles) {
     return null;
   }
 
   return handles.reduce<NodeHandleBounds>(
     (res, item) => {
+      item.width = item.width || 1;
+      item.height = item.height || 1;
+
       if (item.type === 'source') {
-        res.source?.push(item);
+        res.source?.push(item as HandleElement);
       }
 
       if (item.type === 'target') {
-        res.target?.push(item);
+        res.target?.push(item as HandleElement);
       }
 
       return res;

packages/system/src/utils/types.ts

@@ -0,0 +1 @@
+export type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;