Improved createMultilineSetting

web/customLoraLoaders.js

@@ -1,4 +1,4 @@
-import { SettingUtils } from '../sn0w.js';  // Adjust path as needed
+import { SettingUtils } from './sn0w.js';
 import { app } from "../../../scripts/app.js";
 
 const xlId = "sn0w.CustomLoraLoadersXL";
@@ -7,7 +7,10 @@ const xlSettingDefinition = {
     name: "[Sn0w] Custom Lora Loaders XL",
     type: SettingUtils.createMultilineSetting,
     defaultValue: "ExampleName1:Value1\nExampleName2:Value2",
-    tooltip: "Enter each name-value pair on a new line, separated by a colon (:)."
+    attrs: {
+        height: "80",
+        tooltip: "Enter each name-value pair on a new line, separated by a colon (:).",
+    }
 };
 
 const nonXlId = "sn0w.CustomLoraLoaders1.5";
@@ -16,7 +19,10 @@ const nonXlSettingDefinition = {
     name: "[Sn0w] Custom Lora Loaders 1.5",
     type: SettingUtils.createMultilineSetting,
     defaultValue: "ExampleName1:Value1\nExampleName2:Value2",
-    tooltip: "Enter each name-value pair on a new line, separated by a colon (:)."
+    attrs: {
+        height: "80",
+        tooltip: "Enter each name-value pair on a new line, separated by a colon (:).",
+    }
 };
 
 const registerSetting = (settingDefinition) => {

web/sn0w.js

@@ -1,38 +1,43 @@
 export class SettingUtils {
-    static createMultilineSetting(name, setter, value, attrs, tooltip = "") {
+    static createMultilineSetting(name, setter, value, attrs) {
+        console.log(attrs)
+
         const tr = document.createElement("tr");
         const tdLabel = document.createElement("td");
         const tdInput = document.createElement("td");
         const label = document.createElement("label");
         const textarea = document.createElement("textarea");
-
+    
         // Generate a unique ID for associating the label with the textarea
         const uniqueId = `custom-setting-${Date.now()}`;
         label.setAttribute("for", uniqueId);
         label.textContent = name;
-        label.className = "comfy-tooltip-indicator";
-
+    
         textarea.id = uniqueId;
         textarea.value = value;
-        textarea.setAttribute("style", "width: 100%; height: 100px; resize: none;");
-
+        textarea.setAttribute("style", `width: 100%; height: ${attrs["height"]}px; resize: none;`);
+    
         // Apply event handler
         textarea.onchange = () => setter(textarea.value);
-
+    
         // Apply additional attributes
         for (const [key, val] of Object.entries(attrs)) {
             textarea.setAttribute(key, val);
         }
-
+    
         tdLabel.appendChild(label);
         tdInput.appendChild(textarea);
         tr.appendChild(tdLabel);
         tr.appendChild(tdInput);
 
-        if (tooltip) {
-            label.title = tooltip;  // Setting tooltip if provided
+        const tooltip = attrs["tooltip"];
+    
+        // Setting tooltip if provided
+        if (tooltip != "") {
+            tr.title = tooltip;  
+            label.className = "comfy-tooltip-indicator";
         }
-
+    
         return tr;
     }
 }