From 87d9d055e366b5a3554f65fff422e645967d8a5b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A7=91=E6=9E=97=5FCyril=20Pilgrim?=
 <onepigge1999@gmail.com>
Date: Mon, 9 Feb 2026 22:57:25 +0800
Subject: [PATCH] feat(json): add frontend JS for dynamic input count refresh

- Created web/js/json_builder.js with Update inputs button handler
- Dynamically adds/removes key_N and value_N input pairs
- Pattern follows KJNodes JoinStringMulti implementation exactly

User can now:
1. Change inputcount value
2. Click Update inputs button
3. Frontend dynamically updates input slots
---
 web/js/json_builder.js | 52 ++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 web/js/json_builder.js

diff --git a/web/js/json_builder.js b/web/js/json_builder.js
new file mode 100644
index 0000000..3b6488e
--- /dev/null
+++ b/web/js/json_builder.js
@@ -0,0 +1,52 @@
+import { app } from "../../../scripts/app.js";
+
+app.registerExtension({
+    name: "LLMs_Toolkit.JSONBuilder",
+    async beforeRegisterNodeDef(nodeType, nodeData, app) {
+        if (nodeData.name === "JSONBuilder") {
+            nodeType.prototype.onNodeCreated = function () {
+                this.addWidget("button", "Update inputs", null, () => {
+                    if (!this.inputs) {
+                        this.inputs = [];
+                    }
+                    
+                    const inputcountWidget = this.widgets.find(w => w.name === "inputcount");
+                    if (!inputcountWidget) return;
+                    
+                    const target_count = inputcountWidget.value;
+                    
+                    // Count current key/value input pairs
+                    const current_keys = this.inputs.filter(input => 
+                        input.name && input.name.startsWith("key_")
+                    ).length;
+                    
+                    if (target_count === current_keys) return; // already correct
+                    
+                    if (target_count < current_keys) {
+                        // Remove excess inputs (remove from end, pairs at a time)
+                        const pairs_to_remove = current_keys - target_count;
+                        for (let i = 0; i < pairs_to_remove; i++) {
+                            // Find and remove value_N first, then key_N
+                            const idx_to_remove = current_keys - i;
+                            const value_input_idx = this.inputs.findIndex(
+                                input => input.name === `value_${idx_to_remove}`
+                            );
+                            if (value_input_idx !== -1) this.removeInput(value_input_idx);
+                            
+                            const key_input_idx = this.inputs.findIndex(
+                                input => input.name === `key_${idx_to_remove}`
+                            );
+                            if (key_input_idx !== -1) this.removeInput(key_input_idx);
+                        }
+                    } else {
+                        // Add new inputs
+                        for (let i = current_keys + 1; i <= target_count; i++) {
+                            this.addInput(`key_${i}`, "STRING");
+                            this.addInput(`value_${i}`, "STRING");
+                        }
+                    }
+                });
+            };
+        }
+    }
+});