diff --git a/web/comfyui/tags_widget.js b/web/comfyui/tags_widget.js
index 3825a402..f685eda8 100644
--- a/web/comfyui/tags_widget.js
+++ b/web/comfyui/tags_widget.js
@@ -1,5 +1,6 @@
import { app } from "../../scripts/app.js";
import { forwardMiddleMouseToCanvas, forwardWheelToCanvas } from "./utils.js";
+import { copyToClipboard } from "./loras_widget_utils.js";
const MIN_HEIGHT = 150;
const GROUP_EDITOR_ID = "lm-trigger-group-editor";
@@ -568,6 +569,56 @@ function toggleGroupEditor(widget, index, anchorEl) {
openGroupEditor(widget, index, anchorEl);
}
+function showTagContextMenu(event, tagData, index, widget, anchorEl) {
+ event.preventDefault();
+ event.stopPropagation();
+
+ closeGroupEditor(widget);
+
+ const existingMenu = document.querySelector('.lm-lora-context-menu');
+ if (existingMenu) {
+ existingMenu.remove();
+ }
+
+ const menu = document.createElement('div');
+ menu.className = 'lm-lora-context-menu';
+ menu.style.left = `${event.clientX}px`;
+ menu.style.top = `${event.clientY}px`;
+
+ const copyOption = document.createElement('div');
+ copyOption.className = 'lm-lora-menu-item';
+ copyOption.innerHTML = `Copy`;
+ copyOption.addEventListener('click', () => {
+ menu.remove();
+ document.removeEventListener('click', closeMenu);
+ copyToClipboard(tagData.text, 'Copied to clipboard');
+ });
+ menu.appendChild(copyOption);
+
+ if (isGroupTag(tagData) && Array.isArray(tagData.items) && tagData.items.length > 1) {
+ const editOption = document.createElement('div');
+ editOption.className = 'lm-lora-menu-item';
+ editOption.innerHTML = `Edit Group`;
+ editOption.addEventListener('click', () => {
+ menu.remove();
+ document.removeEventListener('click', closeMenu);
+ toggleGroupEditor(widget, index, anchorEl);
+ renderGroupEditor(widget, tagData, index);
+ });
+ menu.appendChild(editOption);
+ }
+
+ document.body.appendChild(menu);
+
+ const closeMenu = (e) => {
+ if (!menu.contains(e.target)) {
+ menu.remove();
+ document.removeEventListener('click', closeMenu);
+ }
+ };
+ setTimeout(() => document.addEventListener('click', closeMenu), 0);
+}
+
export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.02, options = {}) {
const container = document.createElement("div");
container.className = "comfy-tags-container";
@@ -618,6 +669,10 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0
});
});
+ tagEl.addEventListener("contextmenu", (e) => {
+ showTagContextMenu(e, tagData, index, widget, tagEl);
+ });
+
if (showStrengthInfo) {
tagEl.addEventListener("wheel", (e) => {
e.preventDefault();
@@ -728,11 +783,13 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0
};
editButton.addEventListener("click", openEditor);
- groupChip.addEventListener("contextmenu", openEditor);
-
groupChip.appendChild(editButton);
}
+ groupChip.addEventListener("contextmenu", (e) => {
+ showTagContextMenu(e, tagData, index, widget, groupChip);
+ });
+
groupChip.addEventListener("click", (e) => {
e.stopPropagation();
if (editButton && e.target === editButton) {
@@ -773,6 +830,11 @@ export function addTagsWidget(node, name, opts, callback, wheelSensitivity = 0.0
container.removeChild(container.firstChild);
}
+ const existingMenu = document.querySelector('.lm-lora-context-menu');
+ if (existingMenu) {
+ existingMenu.remove();
+ }
+
const normalizedTags = Array.isArray(tagsData) ? tagsData : [];
const showStrengthInfo = widget.allowStrengthAdjustment ?? allowStrengthAdjustment;
const groupAnchors = new Map();