Merge pull request #233 from pathsim/fix/node-width-type-name

fix node width from type name

Author: milanofthe

src/lib/components/FlowCanvas.svelte

@@ -392,7 +392,8 @@
 				graphNode.inputs.length,
 				graphNode.outputs.length,
 				pinnedParamCount,
-				rotation
+				rotation,
+				typeDef?.name
 			);
 
 			// If node exists, update data but don't preserve selection here

src/lib/components/nodes/BaseNode.svelte

@@ -142,7 +142,8 @@
 		data.inputs.length,
 		data.outputs.length,
 		pinnedCount,
-		rotation
+		rotation,
+		typeDef?.name
 	));
 	const nodeWidth = $derived(nodeDimensions.width);
 	const nodeHeight = $derived(nodeDimensions.height);

src/lib/constants/dimensions.ts

@@ -9,8 +9,8 @@ import { GRID_SIZE, G } from './grid';
 
 /** Node dimension constants (grid-aligned) */
 export const NODE = {
-	/** Base width: 10 grid units = 100px */
-	baseWidth: G.x10,
+	/** Base width: 8 grid units = 80px */
+	baseWidth: G.px(8),
 	/** Base height: 4 grid units = 40px */
 	baseHeight: G.x4,
 	/** Spacing between ports: 2 grid units = 20px */
@@ -81,7 +81,8 @@ export function calculateNodeDimensions(
 	inputCount: number,
 	outputCount: number,
 	pinnedParamCount: number,
-	rotation: number
+	rotation: number,
+	typeName?: string
 ): { width: number; height: number } {
 	const isVertical = rotation === 1 || rotation === 3;
 	const maxPortsOnSide = Math.max(inputCount, outputCount);
@@ -90,12 +91,15 @@ export function calculateNodeDimensions(
 	// Pinned params height: border(1) + padding(10) + rows(20 each) + gaps(4 between)
 	const pinnedParamsHeight = pinnedParamCount > 0 ? 7 + 24 * pinnedParamCount : 0;
 
-	// Width: base, name estimate, pinned params minimum, port dimension (if vertical)
-	const nameWidth = name.length * 6 + 24;
+	// Width: base, name estimate, type name estimate, pinned params minimum, port dimension (if vertical)
+	// Name uses 10px font (~5px per char), type uses 8px font (~4px per char), plus padding for node margins
+	const nameWidth = name.length * 5 + 20;
+	const typeWidth = typeName ? typeName.length * 4 + 20 : 0;
 	const pinnedParamsWidth = pinnedParamCount > 0 ? 160 : 0;
 	const width = snapTo2G(Math.max(
 		NODE.baseWidth,
 		nameWidth,
+		typeWidth,
 		pinnedParamsWidth,
 		isVertical ? minPortDimension : 0
 	));