fix(editor): Tweak configurable node width (#17512)

This commit is contained in:
Suguru Inoue
2025-07-23 17:08:52 +02:00
committed by GitHub
parent d520059ec3
commit 3825f8a806
6 changed files with 26 additions and 23 deletions

View File

@@ -35,7 +35,11 @@ import {
export const GRID_SIZE = 16;
export const DEFAULT_NODE_SIZE: [number, number] = [GRID_SIZE * 6, GRID_SIZE * 6];
export const CONFIGURATION_NODE_SIZE: [number, number] = [GRID_SIZE * 5, GRID_SIZE * 5];
export const CONFIGURATION_NODE_RADIUS = (GRID_SIZE * 5) / 2;
export const CONFIGURATION_NODE_SIZE: [number, number] = [
CONFIGURATION_NODE_RADIUS * 2,
CONFIGURATION_NODE_RADIUS * 2,
]; // the node has circle shape
export const CONFIGURABLE_NODE_SIZE: [number, number] = [GRID_SIZE * 16, GRID_SIZE * 6];
export const DEFAULT_START_POSITION_X = GRID_SIZE * 11;
export const DEFAULT_START_POSITION_Y = GRID_SIZE * 15;
@@ -48,10 +52,6 @@ export const DEFAULT_VIEWPORT_BOUNDARIES: ViewportBoundaries = {
yMax: Infinity,
};
// The top-center of the configuration node is not a multiple of GRID_SIZE,
// therefore we need to offset non-main inputs to align with the nodes top-center
export const CONFIGURATION_NODE_OFFSET = (CONFIGURATION_NODE_SIZE[0] / 2) % GRID_SIZE;
/**
* Utility functions for returning nodes found at the edges of a group
*/
@@ -619,10 +619,13 @@ export function calculateNodeSize(
const height = DEFAULT_NODE_SIZE[1] + Math.max(0, maxVerticalHandles - 2) * GRID_SIZE * 2;
if (isConfigurable) {
const portCount = Math.max(NODE_MIN_INPUT_ITEMS_COUNT, nonMainInputCount);
return {
// Configuration node has extra width so that its centered port aligns to the grid
width:
Math.max(NODE_MIN_INPUT_ITEMS_COUNT, nonMainInputCount) * GRID_SIZE * 4 +
CONFIGURATION_NODE_OFFSET * 2,
CONFIGURATION_NODE_RADIUS * 2 +
GRID_SIZE * ((isConfiguration ? 1 : 0) + (portCount - 1) * 3),
height: isConfiguration ? CONFIGURATION_NODE_SIZE[1] : height,
};
}