From ef7c722dab5cbf57f2a782103f8712bfa00e6a3a Mon Sep 17 00:00:00 2001
From: GogoVega <92022724+GogoVega@users.noreply.github.com>
Date: Thu, 5 Dec 2024 11:31:51 +0100
Subject: [PATCH] Fix the prefix to use in the input element ids

---
 nodes/widgets/ui_spacer.html | 42 ++++++++++++++++--------------------
 1 file changed, 18 insertions(+), 24 deletions(-)

diff --git a/nodes/widgets/ui_spacer.html b/nodes/widgets/ui_spacer.html
index 22c73f5a..b379d235 100644
--- a/nodes/widgets/ui_spacer.html
+++ b/nodes/widgets/ui_spacer.html
@@ -12,10 +12,10 @@
                     value: 1,
                     validate: function (v) {
                         const width = v || 0
-                        const currentGroup = $('#node-input-group').val() || this.group
+                        const currentGroup = $('#node-config-input-group').val() || this.group
                         const groupNode = RED.nodes.node(currentGroup)
                         const valid = !groupNode || +width >= 0
-                        $('#node-input-size').toggleClass('input-error', !valid)
+                        $('#node-config-input-size').toggleClass('input-error', !valid)
                         return valid
                     }
                 },
@@ -34,18 +34,18 @@
                 // as typedInputs and hide the elementSizer (as it doesn't make sense for subflow templates)
                 if (RED.nodes.subflow(this.z)) {
                     // change inputs from hidden to text & display them
-                    $('#node-input-width').attr('type', 'text')
-                    $('#node-input-height').attr('type', 'text')
+                    $('#node-config-input-width').attr('type', 'text')
+                    $('#node-config-input-height').attr('type', 'text')
                     $('div.form-row.nr-db-ui-element-sizer-row').hide()
                     $('div.form-row.nr-db-ui-manual-size-row').show()
                 } else {
                     // not in a subflow, use the elementSizer
                     $('div.form-row.nr-db-ui-element-sizer-row').show()
                     $('div.form-row.nr-db-ui-manual-size-row').hide()
-                    $('#node-input-size').elementSizer({
-                        width: '#node-input-width',
-                        height: '#node-input-height',
-                        group: '#node-input-group'
+                    $('#node-config-input-size').elementSizer({
+                        width: '#node-config-input-width',
+                        height: '#node-config-input-height',
+                        group: '#node-config-input-group'
                     })
                 }
                 // use jQuery UI tooltip to convert the plain old title attribute to a nice tooltip
@@ -56,42 +56,36 @@
                     }
                 })
             },
-            oneditsave: function () {
-                this.name = $('#node-input-name').val()
-                this.width = $('#node-input-width').val()
-                this.height = $('#node-input-height').val()
-                this.className = $('#node-input-className').val()
-            }
         })
     })()
 </script>
 
 <script type="text/html" data-template-name="ui-spacer">
     <div class="form-row">
-        <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
-        <input type="text" id="node-input-name">
-        <input type="hidden" id="node-input-topicType">
+        <label for="node-config-input-name"><i class="fa fa-tag"></i> Name</label>
+        <input type="text" id="node-config-input-name">
+        <input type="hidden" id="node-config-input-topicType">
     </div>
     <div class="form-row">
-        <label for="node-input-group"><i class="fa fa-table"></i> Group</label>
-        <input type="text" id="node-input-group">
+        <label for="node-config-input-group"><i class="fa fa-table"></i> Group</label>
+        <input type="text" id="node-config-input-group">
     </div>
     <div class="form-row nr-db-ui-element-sizer-row">
         <label><i class="fa fa-object-group"></i> <span data-i18n="ui-spacer.label.size">Size</label>
-        <button class="editor-button" id="node-input-size"></button>
+        <button class="editor-button" id="node-config-input-size"></button>
     </div>
     <div class="form-row nr-db-ui-manual-size-row">
         <label><i class="fa fa-arrows-h"></i> <span data-i18n="ui-spacer.label.width">Width</label>
-        <input type="hidden" id="node-input-width">
+        <input type="hidden" id="node-config-input-width">
     </div>
     <div class="form-row nr-db-ui-manual-size-row">
         <label><i class="fa fa-arrows-v"></i> <span data-i18n="ui-spacer.label.height">Height</label>
-        <input type="hidden" id="node-input-height">
+        <input type="hidden" id="node-config-input-height">
     </div>
     <div class="form-row">
-        <label for="node-input-className"><i class="fa fa-code"></i> Class</label>
+        <label for="node-config-input-className"><i class="fa fa-code"></i> Class</label>
         <div style="display: inline;">
-            <input style="width: 70%;" type="text" id="node-input-className" placeholder="Optional CSS class name(s)" style="flex-grow: 1;">
+            <input style="width: 70%;" type="text" id="node-config-input-className" placeholder="Optional CSS class name(s)" style="flex-grow: 1;">
             <a
                 data-html="true"
                 title="Dynamic Property: Send msg.class to append new classes to this widget. NOTE: classes set at runtime will be applied in addition to any class(es) set in the nodes class field."