From 21872a8e9eeee4559d37598417bf8089ff4b5697 Mon Sep 17 00:00:00 2001 From: Will Miao Date: Sat, 16 May 2026 16:52:06 +0800 Subject: [PATCH] fix(ui): default_active in group mode should not propagate to children; hide group badge/edit for single-child groups (#929) --- web/comfyui/tags_widget.js | 108 +++++++++++++++-------------- web/comfyui/trigger_word_toggle.js | 12 +++- 2 files changed, 68 insertions(+), 52 deletions(-) diff --git a/web/comfyui/tags_widget.js b/web/comfyui/tags_widget.js index 453312ad..3825a402 100644 --- a/web/comfyui/tags_widget.js +++ b/web/comfyui/tags_widget.js @@ -658,32 +658,34 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0 textEl.style.maxWidth = "140px"; } - const countBadge = document.createElement("span"); - countBadge.className = "lm-trigger-count-badge"; - countBadge.textContent = `${groupState.activeChildren}/${groupState.totalChildren}`; - Object.assign(countBadge.style, { - fontSize: "11px", - padding: "1px 6px", - borderRadius: "999px", - backgroundColor: "rgba(255,255,255,0.12)", - color: "inherit", - flexShrink: "0", - boxSizing: "border-box", - minWidth: "42px", - display: "inline-flex", - alignItems: "center", - justifyContent: "center", - lineHeight: "1", - fontVariantNumeric: "tabular-nums", - }); - if (groupState.hasInactiveChildren) { - countBadge.classList.add("lm-trigger-count-badge--edited"); + if (tagData.items.length > 1) { + const countBadge = document.createElement("span"); + countBadge.className = "lm-trigger-count-badge"; + countBadge.textContent = `${groupState.activeChildren}/${groupState.totalChildren}`; Object.assign(countBadge.style, { - backgroundColor: "rgba(255,255,255,0.08)", - boxShadow: "inset 0 0 0 1px rgba(255,255,255,0.28)", + fontSize: "11px", + padding: "1px 6px", + borderRadius: "999px", + backgroundColor: "rgba(255,255,255,0.12)", + color: "inherit", + flexShrink: "0", + boxSizing: "border-box", + minWidth: "42px", + display: "inline-flex", + alignItems: "center", + justifyContent: "center", + lineHeight: "1", + fontVariantNumeric: "tabular-nums", }); + if (groupState.hasInactiveChildren) { + countBadge.classList.add("lm-trigger-count-badge--edited"); + Object.assign(countBadge.style, { + backgroundColor: "rgba(255,255,255,0.08)", + boxShadow: "inset 0 0 0 1px rgba(255,255,255,0.28)", + }); + } + groupChip.appendChild(countBadge); } - groupChip.appendChild(countBadge); if (showStrengthInfo) { const strengthBadge = createStrengthBadge(); @@ -697,39 +699,43 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0 groupChip.title = activePreview ? `${tagData.text}\nActive: ${activePreview}` : tagData.text; } - const editButton = document.createElement("button"); - editButton.type = "button"; - editButton.className = "lm-trigger-group-edit-button"; - editButton.textContent = "⋯"; - Object.assign(editButton.style, { - border: "none", - background: "transparent", - color: "inherit", - cursor: "pointer", - fontSize: "14px", - lineHeight: "1", - padding: "0 2px", - marginLeft: "2px", - opacity: groupState.hasInactiveChildren ? "0.9" : "0.72", - flexShrink: "0", - }); - editButton.title = "Edit group tags"; + let editButton = null; - const openEditor = (event) => { - event.preventDefault(); - event.stopPropagation(); - toggleGroupEditor(widget, index, groupChip); - renderGroupEditor(widget, tagData, index); - }; + if (tagData.items.length > 1) { + editButton = document.createElement("button"); + editButton.type = "button"; + editButton.className = "lm-trigger-group-edit-button"; + editButton.textContent = "⋯"; + Object.assign(editButton.style, { + border: "none", + background: "transparent", + color: "inherit", + cursor: "pointer", + fontSize: "14px", + lineHeight: "1", + padding: "0 2px", + marginLeft: "2px", + opacity: groupState.hasInactiveChildren ? "0.9" : "0.72", + flexShrink: "0", + }); + editButton.title = "Edit group tags"; - editButton.addEventListener("click", openEditor); - groupChip.addEventListener("contextmenu", openEditor); + const openEditor = (event) => { + event.preventDefault(); + event.stopPropagation(); + toggleGroupEditor(widget, index, groupChip); + renderGroupEditor(widget, tagData, index); + }; - groupChip.appendChild(editButton); + editButton.addEventListener("click", openEditor); + groupChip.addEventListener("contextmenu", openEditor); + + groupChip.appendChild(editButton); + } groupChip.addEventListener("click", (e) => { e.stopPropagation(); - if (e.target === editButton) { + if (editButton && e.target === editButton) { return; } updateWidgetValue(widget, (updatedTags) => { @@ -740,7 +746,7 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0 if (showStrengthInfo) { groupChip.addEventListener("wheel", (e) => { - if (e.target === editButton) { + if (editButton && e.target === editButton) { return; } e.preventDefault(); diff --git a/web/comfyui/trigger_word_toggle.js b/web/comfyui/trigger_word_toggle.js index afd82b1e..d2cd54e5 100644 --- a/web/comfyui/trigger_word_toggle.js +++ b/web/comfyui/trigger_word_toggle.js @@ -303,6 +303,8 @@ app.registerExtension({ return; } + const groupMode = groupModeWidget?.value ?? false; + const updatedTags = node.tagWidget.value.map((tag) => { if (!Array.isArray(tag.items)) { return { @@ -311,6 +313,15 @@ app.registerExtension({ }; } + // In group mode, default_active only controls the group-level switch. + // Children's individual active states are managed exclusively via the group editor. + if (groupMode) { + return { + ...tag, + active: value, + }; + } + return { ...tag, active: value, @@ -320,7 +331,6 @@ app.registerExtension({ })), }; }); - node.tagWidget.value = updatedTags; node.applyTriggerHighlightState?.(); };