fix(svelte): use node.style.width and node.style

examples/astro-xyflow/src/components/ReactFlowExample/index.tsx

@@ -48,16 +48,12 @@ const initialNodes: Node[] = [
         position: Position.Bottom,
         x: nodeSize.width * 0.5,
         y: nodeSize.height,
-        width: 1,
-        height: 1,
       },
       {
         type: 'target',
         position: Position.Top,
         x: nodeSize.width * 0.5,
         y: 0,
-        width: 1,
-        height: 1,
       },
     ],
   },
@@ -72,16 +68,12 @@ const initialNodes: Node[] = [
         position: Position.Bottom,
         x: nodeSize.width * 0.5,
         y: nodeSize.height,
-        width: 1,
-        height: 1,
       },
       {
         type: 'target',
         position: Position.Top,
         x: nodeSize.width * 0.5,
         y: 0,
-        width: 1,
-        height: 1,
       },
     ],
   },

packages/svelte/src/lib/components/NodeWrapper/NodeWrapper.svelte

@@ -170,9 +170,9 @@
     style:z-index={zIndex}
     style:transform="translate({positionOriginX}px, {positionOriginY}px)"
     style:visibility={initialized ? 'visible' : 'hidden'}
-    style:width={width === undefined ? undefined : `${width}px`}
-    style:height={height === undefined ? undefined : `${height}px`}
-    {style}
+    style="{style ?? ''}; {!width ? '' : `width:${width}px;`} {!height
+      ? ''
+      : `height:${height}px;`}"
     on:click={onSelectNodeHandler}
     on:mouseenter={(event) => dispatch('nodemouseenter', { node, event })}
     on:mouseleave={(event) => dispatch('nodemouseleave', { node, event })}