Improve default node sizes (#3596)

Co-authored-by: github-actions <github-actions@github.com>

src/constants/coreSettings.ts

@@ -794,5 +794,14 @@ export const CORE_SETTINGS: SettingParams[] = [
     type: 'boolean',
     defaultValue: true,
     versionAdded: '1.16.1'
+  },
+  {
+    id: 'LiteGraph.Node.DefaultPadding',
+    name: 'Always shrink new nodes',
+    tooltip:
+      'Resize nodes to the smallest possible size when created. When disabled, a newly added node will be widened slightly to show widget values.',
+    type: 'boolean',
+    defaultValue: false,
+    versionAdded: '1.18.0'
   }
 ]

src/locales/en/settings.json

@@ -377,6 +377,10 @@
   "LiteGraph_ContextMenu_Scaling": {
     "name": "Scale node combo widget menus (lists) when zoomed in"
   },
+  "LiteGraph_Node_DefaultPadding": {
+    "name": "Always shrink new nodes",
+    "tooltip": "Resize nodes to the smallest possible size when created. When disabled, a newly added node will be widened slightly to show widget values."
+  },
   "LiteGraph_Node_TooltipDelay": {
     "name": "Tooltip Delay"
   },

src/locales/es/settings.json

@@ -377,6 +377,10 @@
   "LiteGraph_ContextMenu_Scaling": {
     "name": "Escala los menús de widgets combinados de nodos (listas) al acercar"
   },
+  "LiteGraph_Node_DefaultPadding": {
+    "name": "Reducir siempre los nuevos nodos",
+    "tooltip": "Redimensiona los nodos al tamaño más pequeño posible al crearlos. Si está desactivado, un nodo recién añadido se ampliará ligeramente para mostrar los valores de los widgets."
+  },
   "LiteGraph_Node_TooltipDelay": {
     "name": "Retraso de la información sobre herramientas"
   },

src/locales/fr/settings.json

@@ -377,6 +377,10 @@
   "LiteGraph_ContextMenu_Scaling": {
     "name": "Mise à l'échelle des menus de widgets combinés de nœuds (listes) lors du zoom"
   },
+  "LiteGraph_Node_DefaultPadding": {
+    "name": "Toujours réduire les nouveaux nœuds",
+    "tooltip": "Redimensionner les nœuds à la taille minimale possible lors de leur création. Lorsque cette option est désactivée, un nœud nouvellement ajouté sera légèrement élargi pour afficher les valeurs des widgets."
+  },
   "LiteGraph_Node_TooltipDelay": {
     "name": "Délai d'infobulle"
   },

src/locales/ja/settings.json

@@ -377,6 +377,10 @@
   "LiteGraph_ContextMenu_Scaling": {
     "name": "ズームイン時にノードコンボウィジェットメニュー（リスト）をスケーリングする"
   },
+  "LiteGraph_Node_DefaultPadding": {
+    "name": "新しいノードを常に縮小",
+    "tooltip": "ノード作成時に可能な限り小さいサイズにリサイズします。無効にすると、新しく追加されたノードはウィジェットの値が表示されるように少し幅広くなります。"
+  },
   "LiteGraph_Node_TooltipDelay": {
     "name": "ツールチップ遅延"
   },

src/locales/ko/settings.json

@@ -377,6 +377,10 @@
   "LiteGraph_ContextMenu_Scaling": {
     "name": "확대시 노드 콤보 위젯 메뉴 (목록) 스케일링"
   },
+  "LiteGraph_Node_DefaultPadding": {
+    "name": "새 노드를 항상 축소",
+    "tooltip": "노드를 생성할 때 가능한 가장 작은 크기로 크기를 조정합니다. 비활성화하면 새로 추가된 노드가 위젯 값을 표시하기 위해 약간 넓어집니다."
+  },
   "LiteGraph_Node_TooltipDelay": {
     "name": "툴팁 지연"
   },

src/locales/ru/settings.json

@@ -377,6 +377,10 @@
   "LiteGraph_ContextMenu_Scaling": {
     "name": "Масштабирование комбинированных виджетов меню узлов (списков) при увеличении"
   },
+  "LiteGraph_Node_DefaultPadding": {
+    "name": "Всегда сжимать новые узлы",
+    "tooltip": "Изменять размер узлов до минимально возможного при создании. Если отключено, новый узел будет немного расширен для отображения значений виджетов."
+  },
   "LiteGraph_Node_TooltipDelay": {
     "name": "Задержка всплывающей подсказки"
   },

src/locales/zh/settings.json

@@ -377,6 +377,10 @@
   "LiteGraph_ContextMenu_Scaling": {
     "name": "放大时缩放节点组合部件菜单（列表）"
   },
+  "LiteGraph_Node_DefaultPadding": {
+    "name": "始终收缩新节点",
+    "tooltip": "创建节点时将其缩小到最小可能尺寸。禁用后，新添加的节点会略微加宽以显示控件数值。"
+  },
   "LiteGraph_Node_TooltipDelay": {
     "name": "工具提示延迟"
   },

src/schemas/apiSchema.ts

@@ -454,7 +454,8 @@ const zSettings = z.object({
   /** Settings used for testing */
   'test.setting': z.any(),
   'main.sub.setting.name': z.any(),
-  'single.setting': z.any()
+  'single.setting': z.any(),
+  'LiteGraph.Node.DefaultPadding': z.boolean()
 })
 
 export type EmbeddingsResponse = z.infer<typeof zEmbeddingsResponse>

src/services/litegraphService.ts

@@ -30,6 +30,7 @@ import { $el } from '@/scripts/ui'
 import { useCanvasStore } from '@/stores/graphStore'
 import { useNodeOutputStore } from '@/stores/imagePreviewStore'
 import { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+import { useSettingStore } from '@/stores/settingStore'
 import { useToastStore } from '@/stores/toastStore'
 import { useWidgetStore } from '@/stores/widgetStore'
 import { normalizeI18nKey } from '@/utils/formatUtil'
@@ -214,7 +215,11 @@ export const useLitegraphService = () => {
        */
       #setInitialSize() {
         const s = this.computeSize()
-        s[0] = Math.max(this.#initialMinSize.width, s[0] * 1.5)
+        // Expand the width a little to fit widget values on screen.
+        const pad =
+          this.widgets?.length &&
+          !useSettingStore().get('LiteGraph.Node.DefaultPadding')
+        s[0] = Math.max(this.#initialMinSize.width, s[0] + (pad ? 60 : 0))
         s[1] = Math.max(this.#initialMinSize.height, s[1])
         this.setSize(s)
       }