feat: Add configurable max height for TriggerWord Toggle node

- Add new setting 'loramanager.trigger_word_max_height' (150-600px, default 300px)
- Add getTriggerWordMaxHeight() getter to retrieve setting value
- Update tags_widget to respect max height limit with scrollbar
- Add getMaxHeight callback for ComfyUI layout system
- Add tooltip note about requiring page reload

Fixes #706

web/comfyui/settings.js

@@ -7,6 +7,9 @@ import { app } from "../../scripts/app.js";
 const TRIGGER_WORD_WHEEL_SENSITIVITY_ID = "loramanager.trigger_word_wheel_sensitivity";
 const TRIGGER_WORD_WHEEL_SENSITIVITY_DEFAULT = 0.02;
 
+const TRIGGER_WORD_MAX_HEIGHT_ID = "loramanager.trigger_word_max_height";
+const TRIGGER_WORD_MAX_HEIGHT_DEFAULT = 300;
+
 const AUTO_PATH_CORRECTION_SETTING_ID = "loramanager.auto_path_correction";
 const AUTO_PATH_CORRECTION_DEFAULT = true;
 
@@ -168,11 +171,50 @@ app.registerExtension({
             tooltip: "When enabled, tag names with underscores will have them replaced with spaces when inserted (e.g., 'blonde_hair' becomes 'blonde hair').",
             category: ["LoRA Manager", "Autocomplete", "Tag Formatting"],
         },
+        {
+            id: TRIGGER_WORD_MAX_HEIGHT_ID,
+            name: "Trigger Word Toggle Max Height",
+            type: "slider",
+            attrs: {
+                min: 150,
+                max: 600,
+                step: 10,
+            },
+            defaultValue: TRIGGER_WORD_MAX_HEIGHT_DEFAULT,
+            tooltip: "Maximum height (in pixels) for the Trigger Word Toggle node. Content exceeding this height will be scrollable. Note: Requires page reload to take effect.",
+            category: ["LoRA Manager", "Trigger Word Toggle", "Max Height"],
+        },
     ],
 });
 
+const getTriggerWordMaxHeight = (() => {
+    let settingsUnavailableLogged = false;
+
+    return () => {
+        const settingManager = app?.extensionManager?.setting;
+        if (!settingManager || typeof settingManager.get !== "function") {
+            if (!settingsUnavailableLogged) {
+                console.warn("LoRA Manager: settings API unavailable, using default max height.");
+                settingsUnavailableLogged = true;
+            }
+            return TRIGGER_WORD_MAX_HEIGHT_DEFAULT;
+        }
+
+        try {
+            const value = settingManager.get(TRIGGER_WORD_MAX_HEIGHT_ID);
+            return value ?? TRIGGER_WORD_MAX_HEIGHT_DEFAULT;
+        } catch (error) {
+            if (!settingsUnavailableLogged) {
+                console.warn("LoRA Manager: unable to read max height setting, using default.", error);
+                settingsUnavailableLogged = true;
+            }
+            return TRIGGER_WORD_MAX_HEIGHT_DEFAULT;
+        }
+    };
+})();
+
 // ============================================================================
 // Exports
 // ============================================================================
 
-export { getWheelSensitivity, getAutoPathCorrectionPreference, getPromptTagAutocompletePreference, getTagSpaceReplacementPreference };
+export { getWheelSensitivity, getAutoPathCorrectionPreference, getPromptTagAutocompletePreference, getTagSpaceReplacementPreference, getTriggerWordMaxHeight };

web/comfyui/tags_widget.js

@@ -1,4 +1,5 @@
 import { forwardMiddleMouseToCanvas } from "./utils.js";
+import { getTriggerWordMaxHeight } from "./settings.js";
 
 export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.02, options = {}) {
   // Create container for tags
@@ -12,6 +13,9 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0
   // Set initial height
   const defaultHeight = 150;
   
+  // Get max height from settings
+  const maxHeight = getTriggerWordMaxHeight();
+
   Object.assign(container.style, {
     display: "flex",
     flexWrap: "wrap",
@@ -22,7 +26,8 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0
     width: "100%",
     boxSizing: "border-box",
     overflow: "auto",
-    alignItems: "flex-start" // Ensure tags align at the top of each row
+    alignItems: "flex-start", // Ensure tags align at the top of each row
+    maxHeight: `${maxHeight}px` // Set max height for scrollable container
   });
 
   // Initialize default value as array
@@ -200,13 +205,14 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0
 
   // Function to update widget height consistently
   const updateWidgetHeight = (height) => {
-    // Ensure minimum height
+    const maxHeight = getTriggerWordMaxHeight();
-    const finalHeight = Math.max(defaultHeight, height);
+    // Ensure height is within bounds [defaultHeight, maxHeight]
-    
+    const finalHeight = Math.min(Math.max(defaultHeight, height), maxHeight);
+
     // Update CSS variables
     container.style.setProperty('--comfy-widget-min-height', `${finalHeight}px`);
     container.style.setProperty('--comfy-widget-height', `${finalHeight}px`);
-    
+
     // Force node to update size after a short delay to ensure DOM is updated
     if (node) {
       setTimeout(() => {
@@ -340,6 +346,9 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0
       widgetValue = v;
       renderTags(widgetValue, widget);
     },
+    getMaxHeight: function() {
+      return getTriggerWordMaxHeight();
+    },
     hideOnZoom: true,
     selectOn: ['click', 'focus']
   });
@@ -354,5 +363,5 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0
     return widgetValue
   };
 
-  return { minWidth: 300, minHeight: defaultHeight, widget };
+  return { minWidth: 300, minHeight: defaultHeight, maxHeight: getTriggerWordMaxHeight(), widget };
 }