Update web content to release v1.3.26 (#5413)

* Update web content to release v1.3.26

* nit

web/assets/ExtensionPanel-BmKi_NKS.js

@@ -1,8 +1,8 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { d as defineComponent, bK as useExtensionStore, u as useSettingStore, r as ref, o as onMounted, q as computed, g as openBlock, h as createElementBlock, i as createVNode, y as withCtx, z as unref, bL as script$1, A as createBaseVNode, x as createBlock, M as Fragment, N as renderList, am as toDisplayString, ap as createTextVNode, j as createCommentVNode, D as script$4 } from "./index-CgU1oKZt.js";
+import { d as defineComponent, bQ as useExtensionStore, u as useSettingStore, r as ref, o as onMounted, q as computed, g as openBlock, h as createElementBlock, i as createVNode, y as withCtx, z as unref, bR as script$1, A as createBaseVNode, x as createBlock, N as Fragment, O as renderList, a6 as toDisplayString, aw as createTextVNode, j as createCommentVNode, D as script$4 } from "./index-BHayQCxv.js";
-import { s as script, a as script$2, b as script$3 } from "./index-DBWDcZsl.js";
+import { s as script, a as script$2, b as script$3 } from "./index-CwRXxFdA.js";
-import "./index-DYEEBf64.js";
+import "./index-C_wOqB0f.js";
 const _hoisted_1 = { class: "extension-panel" };
 const _hoisted_2 = { class: "mt-4" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -100,4 +100,4 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 export {
   _sfc_main as default
 };
-//# sourceMappingURL=ExtensionPanel-DZLYjWBj.js.map
+//# sourceMappingURL=ExtensionPanel-BmKi_NKS.js.map

web/assets/ExtensionPanel-BmKi_NKS.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExtensionPanel-DZLYjWBj.js","sources":["../../src/components/dialog/content/setting/ExtensionPanel.vue"],"sourcesContent":["<template>\n  <div class=\"extension-panel\">\n    <DataTable :value=\"extensionStore.extensions\" stripedRows size=\"small\">\n      <Column field=\"name\" :header=\"$t('extensionName')\" sortable></Column>\n      <Column\n        :pt=\"{\n          bodyCell: 'flex items-center justify-end'\n        }\"\n      >\n        <template #body=\"slotProps\">\n          <ToggleSwitch\n            v-model=\"editingEnabledExtensions[slotProps.data.name]\"\n            @change=\"updateExtensionStatus\"\n          />\n        </template>\n      </Column>\n    </DataTable>\n    <div class=\"mt-4\">\n      <Message v-if=\"hasChanges\" severity=\"info\">\n        <ul>\n          <li v-for=\"ext in changedExtensions\" :key=\"ext.name\">\n            <span>\n              {{ extensionStore.isExtensionEnabled(ext.name) ? '[-]' : '[+]' }}\n            </span>\n            {{ ext.name }}\n          </li>\n        </ul>\n      </Message>\n      <Button\n        :label=\"$t('reloadToApplyChanges')\"\n        icon=\"pi pi-refresh\"\n        @click=\"applyChanges\"\n        :disabled=\"!hasChanges\"\n        text\n        fluid\n        severity=\"danger\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted } from 'vue'\nimport { useExtensionStore } from '@/stores/extensionStore'\nimport { useSettingStore } from '@/stores/settingStore'\nimport DataTable from 'primevue/datatable'\nimport Column from 'primevue/column'\nimport ToggleSwitch from 'primevue/toggleswitch'\nimport Button from 'primevue/button'\nimport Message from 'primevue/message'\n\nconst extensionStore = useExtensionStore()\nconst settingStore = useSettingStore()\n\nconst editingEnabledExtensions = ref<Record<string, boolean>>({})\n\nonMounted(() => {\n  extensionStore.extensions.forEach((ext) => {\n    editingEnabledExtensions.value[ext.name] =\n      extensionStore.isExtensionEnabled(ext.name)\n  })\n})\n\nconst changedExtensions = computed(() => {\n  return extensionStore.extensions.filter(\n    (ext) =>\n      editingEnabledExtensions.value[ext.name] !==\n      extensionStore.isExtensionEnabled(ext.name)\n  )\n})\n\nconst hasChanges = computed(() => {\n  return changedExtensions.value.length > 0\n})\n\nconst updateExtensionStatus = () => {\n  const editingDisabledExtensionNames = Object.entries(\n    editingEnabledExtensions.value\n  )\n    .filter(([_, enabled]) => !enabled)\n    .map(([name]) => name)\n\n  settingStore.set('Comfy.Extension.Disabled', [\n    ...extensionStore.inactiveDisabledExtensionNames,\n    ...editingDisabledExtensionNames\n  ])\n}\n\nconst applyChanges = () => {\n  // Refresh the page to apply changes\n  window.location.reload()\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;;AAmDA,UAAM,iBAAiB;AACvB,UAAM,eAAe;AAEf,UAAA,2BAA2B,IAA6B,CAAA,CAAE;AAEhE,cAAU,MAAM;AACC,qBAAA,WAAW,QAAQ,CAAC,QAAQ;AACzC,iCAAyB,MAAM,IAAI,IAAI,IACrC,eAAe,mBAAmB,IAAI,IAAI;AAAA,MAAA,CAC7C;AAAA,IAAA,CACF;AAEK,UAAA,oBAAoB,SAAS,MAAM;AACvC,aAAO,eAAe,WAAW;AAAA,QAC/B,CAAC,QACC,yBAAyB,MAAM,IAAI,IAAI,MACvC,eAAe,mBAAmB,IAAI,IAAI;AAAA,MAAA;AAAA,IAC9C,CACD;AAEK,UAAA,aAAa,SAAS,MAAM;AACzB,aAAA,kBAAkB,MAAM,SAAS;AAAA,IAAA,CACzC;AAED,UAAM,wBAAwB,6BAAM;AAClC,YAAM,gCAAgC,OAAO;AAAA,QAC3C,yBAAyB;AAAA,MAExB,EAAA,OAAO,CAAC,CAAC,GAAG,OAAO,MAAM,CAAC,OAAO,EACjC,IAAI,CAAC,CAAC,IAAI,MAAM,IAAI;AAEvB,mBAAa,IAAI,4BAA4B;AAAA,QAC3C,GAAG,eAAe;AAAA,QAClB,GAAG;AAAA,MAAA,CACJ;AAAA,IAAA,GAV2B;AAa9B,UAAM,eAAe,6BAAM;AAEzB,aAAO,SAAS;IAAO,GAFJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ExtensionPanel-BmKi_NKS.js","sources":["../../src/components/dialog/content/setting/ExtensionPanel.vue"],"sourcesContent":["<template>\n  <div class=\"extension-panel\">\n    <DataTable :value=\"extensionStore.extensions\" stripedRows size=\"small\">\n      <Column field=\"name\" :header=\"$t('extensionName')\" sortable></Column>\n      <Column\n        :pt=\"{\n          bodyCell: 'flex items-center justify-end'\n        }\"\n      >\n        <template #body=\"slotProps\">\n          <ToggleSwitch\n            v-model=\"editingEnabledExtensions[slotProps.data.name]\"\n            @change=\"updateExtensionStatus\"\n          />\n        </template>\n      </Column>\n    </DataTable>\n    <div class=\"mt-4\">\n      <Message v-if=\"hasChanges\" severity=\"info\">\n        <ul>\n          <li v-for=\"ext in changedExtensions\" :key=\"ext.name\">\n            <span>\n              {{ extensionStore.isExtensionEnabled(ext.name) ? '[-]' : '[+]' }}\n            </span>\n            {{ ext.name }}\n          </li>\n        </ul>\n      </Message>\n      <Button\n        :label=\"$t('reloadToApplyChanges')\"\n        icon=\"pi pi-refresh\"\n        @click=\"applyChanges\"\n        :disabled=\"!hasChanges\"\n        text\n        fluid\n        severity=\"danger\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted } from 'vue'\nimport { useExtensionStore } from '@/stores/extensionStore'\nimport { useSettingStore } from '@/stores/settingStore'\nimport DataTable from 'primevue/datatable'\nimport Column from 'primevue/column'\nimport ToggleSwitch from 'primevue/toggleswitch'\nimport Button from 'primevue/button'\nimport Message from 'primevue/message'\n\nconst extensionStore = useExtensionStore()\nconst settingStore = useSettingStore()\n\nconst editingEnabledExtensions = ref<Record<string, boolean>>({})\n\nonMounted(() => {\n  extensionStore.extensions.forEach((ext) => {\n    editingEnabledExtensions.value[ext.name] =\n      extensionStore.isExtensionEnabled(ext.name)\n  })\n})\n\nconst changedExtensions = computed(() => {\n  return extensionStore.extensions.filter(\n    (ext) =>\n      editingEnabledExtensions.value[ext.name] !==\n      extensionStore.isExtensionEnabled(ext.name)\n  )\n})\n\nconst hasChanges = computed(() => {\n  return changedExtensions.value.length > 0\n})\n\nconst updateExtensionStatus = () => {\n  const editingDisabledExtensionNames = Object.entries(\n    editingEnabledExtensions.value\n  )\n    .filter(([_, enabled]) => !enabled)\n    .map(([name]) => name)\n\n  settingStore.set('Comfy.Extension.Disabled', [\n    ...extensionStore.inactiveDisabledExtensionNames,\n    ...editingDisabledExtensionNames\n  ])\n}\n\nconst applyChanges = () => {\n  // Refresh the page to apply changes\n  window.location.reload()\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;;AAmDA,UAAM,iBAAiB;AACvB,UAAM,eAAe;AAEf,UAAA,2BAA2B,IAA6B,CAAA,CAAE;AAEhE,cAAU,MAAM;AACC,qBAAA,WAAW,QAAQ,CAAC,QAAQ;AACzC,iCAAyB,MAAM,IAAI,IAAI,IACrC,eAAe,mBAAmB,IAAI,IAAI;AAAA,MAAA,CAC7C;AAAA,IAAA,CACF;AAEK,UAAA,oBAAoB,SAAS,MAAM;AACvC,aAAO,eAAe,WAAW;AAAA,QAC/B,CAAC,QACC,yBAAyB,MAAM,IAAI,IAAI,MACvC,eAAe,mBAAmB,IAAI,IAAI;AAAA,MAAA;AAAA,IAC9C,CACD;AAEK,UAAA,aAAa,SAAS,MAAM;AACzB,aAAA,kBAAkB,MAAM,SAAS;AAAA,IAAA,CACzC;AAED,UAAM,wBAAwB,6BAAM;AAClC,YAAM,gCAAgC,OAAO;AAAA,QAC3C,yBAAyB;AAAA,MAExB,EAAA,OAAO,CAAC,CAAC,GAAG,OAAO,MAAM,CAAC,OAAO,EACjC,IAAI,CAAC,CAAC,IAAI,MAAM,IAAI;AAEvB,mBAAa,IAAI,4BAA4B;AAAA,QAC3C,GAAG,eAAe;AAAA,QAClB,GAAG;AAAA,MAAA,CACJ;AAAA,IAAA,GAV2B;AAa9B,UAAM,eAAe,6BAAM;AAEzB,aAAO,SAAS;IAAO,GAFJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

web/assets/GraphView-Cf7ubG48.css

@@ -1,13 +1,13 @@
 
-.group-title-editor.node-title-editor[data-v-fc3f26e3] {
+.group-title-editor.node-title-editor[data-v-8a100d5a] {
   z-index: 9999;
   padding: 0.25rem;
 }
-[data-v-fc3f26e3] .editable-text {
+[data-v-8a100d5a] .editable-text {
   width: 100%;
   height: 100%;
 }
-[data-v-fc3f26e3] .editable-text input {
+[data-v-8a100d5a] .editable-text input {
   width: 100%;
   height: 100%;
   /* Override the default font size */
@@ -45,7 +45,7 @@
   --sidebar-icon-size: 1rem;
 }
 
-.side-tool-bar-container[data-v-b6bfc188] {
+.side-tool-bar-container[data-v-37fd2fa4] {
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -58,36 +58,39 @@
   background-color: var(--comfy-menu-bg);
   color: var(--fg-color);
 }
-.side-tool-bar-end[data-v-b6bfc188] {
+.side-tool-bar-end[data-v-37fd2fa4] {
   align-self: flex-end;
   margin-top: auto;
 }
 
-.p-splitter-gutter {
+[data-v-b49f20b1] .p-splitter-gutter {
   pointer-events: auto;
 }
-.gutter-hidden {
+.side-bar-panel[data-v-b49f20b1] {
-  display: none !important;
-}
-
-.side-bar-panel[data-v-b9df3042] {
   background-color: var(--bg-color);
   pointer-events: auto;
 }
-.splitter-overlay[data-v-b9df3042] {
+.bottom-panel[data-v-b49f20b1] {
-  width: 100%;
+  background-color: var(--bg-color);
-  height: 100%;
+  pointer-events: auto;
-  position: absolute;
+}
-  top: 0;
+.splitter-overlay[data-v-b49f20b1] {
-  left: 0;
-  background-color: transparent;
   pointer-events: none;
+  border-style: none;
+  background-color: transparent;
+}
+.splitter-overlay-root[data-v-b49f20b1] {
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  height: 100%;
+  width: 100%;
+
   /* Set it the same as the ComfyUI menu */
   /* Note: Lite-graph DOM widgets have the same z-index as the node id, so
   999 should be sufficient to make sure splitter overlays on node's DOM
   widgets */
   z-index: 999;
-  border: none;
 }
 
 [data-v-37f672ab] .highlight {
@@ -251,7 +254,7 @@
   display: none;
 }
 
-.comfyui-menu[data-v-b13fdc92] {
+.comfyui-menu[data-v-ad2c662b] {
   width: 100vw;
   background: var(--comfy-menu-bg);
   color: var(--fg-color);
@@ -263,13 +266,13 @@
   grid-column: 1/-1;
   max-height: 90vh;
 }
-.comfyui-menu.dropzone[data-v-b13fdc92] {
+.comfyui-menu.dropzone[data-v-ad2c662b] {
   background: var(--p-highlight-background);
 }
-.comfyui-menu.dropzone-active[data-v-b13fdc92] {
+.comfyui-menu.dropzone-active[data-v-ad2c662b] {
   background: var(--p-highlight-background-focus);
 }
-.comfyui-logo[data-v-b13fdc92] {
+.comfyui-logo[data-v-ad2c662b] {
   font-size: 1.2em;
   -webkit-user-select: none;
      -moz-user-select: none;

web/assets/KeybindingPanel-Dm_3sBT5.js

@@ -1,8 +1,8 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { d as defineComponent, q as computed, g as openBlock, h as createElementBlock, M as Fragment, N as renderList, i as createVNode, y as withCtx, ap as createTextVNode, am as toDisplayString, z as unref, at as script, j as createCommentVNode, r as ref, bH as FilterMatchMode, K as useKeybindingStore, F as useCommandStore, aC as watchEffect, aZ as useToast, t as resolveDirective, bI as SearchBox, A as createBaseVNode, D as script$2, x as createBlock, af as script$4, b2 as withModifiers, aA as script$6, v as withDirectives, P as pushScopeId, Q as popScopeId, by as KeyComboImpl, bJ as KeybindingImpl, _ as _export_sfc } from "./index-CgU1oKZt.js";
+import { d as defineComponent, q as computed, g as openBlock, h as createElementBlock, N as Fragment, O as renderList, i as createVNode, y as withCtx, aw as createTextVNode, a6 as toDisplayString, z as unref, aA as script, j as createCommentVNode, r as ref, bN as FilterMatchMode, M as useKeybindingStore, F as useCommandStore, aJ as watchEffect, b9 as useToast, t as resolveDirective, bO as SearchBox, A as createBaseVNode, D as script$2, x as createBlock, ao as script$4, be as withModifiers, aH as script$6, v as withDirectives, P as pushScopeId, Q as popScopeId, bJ as KeyComboImpl, bP as KeybindingImpl, _ as _export_sfc } from "./index-BHayQCxv.js";
-import { s as script$1, a as script$3, b as script$5 } from "./index-DBWDcZsl.js";
+import { s as script$1, a as script$3, b as script$5 } from "./index-CwRXxFdA.js";
-import "./index-DYEEBf64.js";
+import "./index-C_wOqB0f.js";
 const _hoisted_1$1 = {
   key: 0,
   class: "px-2"
@@ -261,4 +261,4 @@ const KeybindingPanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "d
 export {
   KeybindingPanel as default
 };
-//# sourceMappingURL=KeybindingPanel-YkUFoiMw.js.map
+//# sourceMappingURL=KeybindingPanel-Dm_3sBT5.js.map

web/assets/index-BReiUkk9.js

@@ -1,7 +1,7 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { bu as ComfyDialog, bv as $el, bw as ComfyApp, c as app, k as LiteGraph, aP as LGraphCanvas, bx as DraggableList, a_ as useToastStore, ax as useNodeDefStore, bq as api, L as LGraphGroup, by as KeyComboImpl, K as useKeybindingStore, F as useCommandStore, e as LGraphNode, bz as ComfyWidgets, bA as applyTextReplacements, av as NodeSourceType, bB as NodeBadgeMode, u as useSettingStore, q as computed, bC as getColorPalette, w as watch, bD as BadgePosition, aR as LGraphBadge, bE as _, bF as defaultColorPalette } from "./index-CgU1oKZt.js";
+import { bF as ComfyDialog, bG as $el, bH as ComfyApp, c as app, k as LiteGraph, b0 as LGraphCanvas, bI as DraggableList, ba as useToastStore, aE as useNodeDefStore, bC as api, L as LGraphGroup, bJ as KeyComboImpl, M as useKeybindingStore, F as useCommandStore, e as LGraphNode, bK as ComfyWidgets, bL as applyTextReplacements } from "./index-BHayQCxv.js";
-import { mergeIfValid, getWidgetConfig, setWidgetConfig } from "./widgetInputs-DNVvusS1.js";
+import { mergeIfValid, getWidgetConfig, setWidgetConfig } from "./widgetInputs-DdecKYqd.js";
 class ClipspaceDialog extends ComfyDialog {
   static {
     __name(this, "ClipspaceDialog");
@@ -37,7 +37,9 @@ class ClipspaceDialog extends ComfyDialog {
         ...self.createButtons()
       ]);
       if (self.element) {
+        if (self.element.firstChild) {
           self.element.removeChild(self.element.firstChild);
+        }
         self.element.appendChild(children);
       } else {
         self.element = $el("div.comfy-modal", { parent: document.body }, [
@@ -76,7 +78,7 @@ class ClipspaceDialog extends ComfyDialog {
     return buttons;
   }
   createImgSettings() {
-    if (ComfyApp.clipspace.imgs) {
+    if (ComfyApp.clipspace?.imgs) {
       const combo_items = [];
       const imgs = ComfyApp.clipspace.imgs;
       for (let i = 0; i < imgs.length; i++) {
@@ -87,8 +89,10 @@ class ClipspaceDialog extends ComfyDialog {
         {
           id: "clipspace_img_selector",
           onchange: /* @__PURE__ */ __name((event) => {
+            if (event.target && ComfyApp.clipspace) {
               ComfyApp.clipspace["selectedIndex"] = event.target.selectedIndex;
               ClipspaceDialog.invalidatePreview();
+            }
           }, "onchange")
         },
         combo_items
@@ -102,7 +106,9 @@ class ClipspaceDialog extends ComfyDialog {
         {
           id: "clipspace_img_paste_mode",
           onchange: /* @__PURE__ */ __name((event) => {
+            if (event.target && ComfyApp.clipspace) {
               ComfyApp.clipspace["img_paste_mode"] = event.target.value;
+            }
           }, "onchange")
         },
         [
@@ -127,7 +133,7 @@ class ClipspaceDialog extends ComfyDialog {
     }
   }
   createImgPreview() {
-    if (ComfyApp.clipspace.imgs) {
+    if (ComfyApp.clipspace?.imgs) {
       return $el("img", { id: "clipspace_preview", ondragstart: /* @__PURE__ */ __name(() => false, "ondragstart") });
     } else return [];
   }
@@ -173,9 +179,9 @@ const ext$2 = {
         requestAnimationFrame(() => {
           const currentNode = LGraphCanvas.active_canvas.current_node;
           const clickedComboValue = currentNode.widgets?.filter(
-            (w) => w.type === "combo" && w.options.values.length === values.length
+            (w) => w.type === "combo" && w.options.values?.length === values.length
           ).find(
-            (w) => w.options.values.every((v, i) => v === values[i])
+            (w) => w.options.values?.every((v, i) => v === values[i])
           )?.value;
           let selectedIndex = clickedComboValue ? values.findIndex((v) => v === clickedComboValue) : 0;
           if (selectedIndex < 0) {
@@ -244,7 +250,7 @@ const ext$2 = {
           filter.addEventListener("input", () => {
             const term = filter.value.toLocaleLowerCase();
             displayedItems = items.filter((item) => {
-              const isVisible = !term || item.textContent.toLocaleLowerCase().includes(term);
+              const isVisible = !term || item.textContent?.toLocaleLowerCase().includes(term);
               item.style.display = isVisible ? "block" : "none";
               return isVisible;
             });
@@ -1224,7 +1230,7 @@ class GroupNodeConfig {
   checkPrimitiveConnection(link, inputName, inputs) {
     const sourceNode = this.nodeData.nodes[link[0]];
     if (sourceNode.type === "PrimitiveNode") {
-      const [sourceNodeId, _2, targetNodeId, __] = link;
+      const [sourceNodeId, _, targetNodeId, __] = link;
       const primitiveDef = this.primitiveDefs[sourceNodeId];
       const targetWidget = inputs[inputName];
       const primitiveConfig = primitiveDef.input.required.value;
@@ -1619,7 +1625,7 @@ class GroupNodeHandler {
       return newNodes;
     };
     const getExtraMenuOptions = this.node.getExtraMenuOptions;
-    this.node.getExtraMenuOptions = function(_2, options) {
+    this.node.getExtraMenuOptions = function(_, options) {
       getExtraMenuOptions?.apply(this, arguments);
       let optionIndex = options.findIndex((o) => o.content === "Outputs");
       if (optionIndex === -1) optionIndex = options.length;
@@ -1793,7 +1799,7 @@ class GroupNodeHandler {
       } else if (innerNode.type === "Reroute") {
         const rerouteLinks = this.groupData.linksFrom[old.node.index];
         if (rerouteLinks) {
-          for (const [_2, , targetNodeId, targetSlot] of rerouteLinks["0"]) {
+          for (const [_, , targetNodeId, targetSlot] of rerouteLinks["0"]) {
             const node = this.innerNodes[targetNodeId];
             const input = node.inputs[targetSlot];
             if (input.widget) {
@@ -2408,10 +2414,10 @@ const ext = {
       defaultValue: 2,
       type: "combo",
       options: [
-        { value: LiteGraph.STRAIGHT_LINK, text: "Straight" },
+        { value: LiteGraph.STRAIGHT_LINK.toString(), text: "Straight" },
-        { value: LiteGraph.LINEAR_LINK, text: "Linear" },
+        { value: LiteGraph.LINEAR_LINK.toString(), text: "Linear" },
-        { value: LiteGraph.SPLINE_LINK, text: "Spline" },
+        { value: LiteGraph.SPLINE_LINK.toString(), text: "Spline" },
-        { value: LiteGraph.HIDDEN_LINK, text: "Hidden" }
+        { value: LiteGraph.HIDDEN_LINK.toString(), text: "Hidden" }
       ],
       onChange(value) {
         app2.canvas.links_render_mode = +value;
@@ -3934,7 +3940,7 @@ app.registerExtension({
         };
         this.isVirtualNode = true;
       }
-      getExtraMenuOptions(_2, options) {
+      getExtraMenuOptions(_, options) {
         options.unshift(
           {
             content: (this.properties.showOutputText ? "Hide" : "Show") + " Type",
@@ -4157,7 +4163,7 @@ app.registerExtension({
   slot_types_default_in: {},
   async beforeRegisterNodeDef(nodeType, nodeData, app2) {
     var nodeId = nodeData.name;
-    const inputs = nodeData["input"]["required"];
+    const inputs = nodeData["input"]?.["required"];
     for (const inputKey in inputs) {
       var input = inputs[inputKey];
       if (typeof input[0] !== "string") continue;
@@ -4179,19 +4185,19 @@ app.registerExtension({
         nodeType.comfyClass
       );
     }
-    var outputs = nodeData["output"];
+    var outputs = nodeData["output"] ?? [];
-    for (const key in outputs) {
+    for (const el of outputs) {
-      var type = outputs[key];
+      const type2 = el;
-      if (!(type in this.slot_types_default_in)) {
+      if (!(type2 in this.slot_types_default_in)) {
-        this.slot_types_default_in[type] = ["Reroute"];
+        this.slot_types_default_in[type2] = ["Reroute"];
       }
-      this.slot_types_default_in[type].push(nodeId);
+      this.slot_types_default_in[type2].push(nodeId);
-      if (!(type in LiteGraph.registered_slot_out_types)) {
+      if (!(type2 in LiteGraph.registered_slot_out_types)) {
-        LiteGraph.registered_slot_out_types[type] = { nodes: [] };
+        LiteGraph.registered_slot_out_types[type2] = { nodes: [] };
       }
-      LiteGraph.registered_slot_out_types[type].nodes.push(nodeType.comfyClass);
+      LiteGraph.registered_slot_out_types[type2].nodes.push(nodeType.comfyClass);
-      if (!LiteGraph.slot_types_out.includes(type)) {
+      if (!LiteGraph.slot_types_out.includes(type2)) {
-        LiteGraph.slot_types_out.push(type);
+        LiteGraph.slot_types_out.push(type2);
       }
     }
     var maxNum = this.suggestionsNumber.value;
@@ -4276,7 +4282,7 @@ app.registerExtension({
         } else {
           w = node.size[0];
           h = node.size[1];
-          let titleMode = node.constructor.title_mode;
+          const titleMode = node.constructor.title_mode;
           if (titleMode !== LiteGraph.TRANSPARENT_TITLE && titleMode !== LiteGraph.NO_TITLE) {
             h += LiteGraph.NODE_TITLE_HEIGHT;
             shiftY -= LiteGraph.NODE_TITLE_HEIGHT;
@@ -4627,108 +4633,4 @@ app.registerExtension({
     };
   }
 });
-function getNodeSource(node) {
+//# sourceMappingURL=index-BReiUkk9.js.map
-  const nodeDef = node.constructor.nodeData;
-  if (!nodeDef) {
-    return null;
-  }
-  const nodeDefStore = useNodeDefStore();
-  return nodeDefStore.nodeDefsByName[nodeDef.name]?.nodeSource ?? null;
-}
-__name(getNodeSource, "getNodeSource");
-function isCoreNode(node) {
-  return getNodeSource(node)?.type === NodeSourceType.Core;
-}
-__name(isCoreNode, "isCoreNode");
-function badgeTextVisible(node, badgeMode) {
-  return badgeMode === NodeBadgeMode.None || isCoreNode(node) && badgeMode === NodeBadgeMode.HideBuiltIn;
-}
-__name(badgeTextVisible, "badgeTextVisible");
-function getNodeIdBadgeText(node, nodeIdBadgeMode) {
-  return badgeTextVisible(node, nodeIdBadgeMode) ? "" : `#${node.id}`;
-}
-__name(getNodeIdBadgeText, "getNodeIdBadgeText");
-function getNodeSourceBadgeText(node, nodeSourceBadgeMode) {
-  const nodeSource = getNodeSource(node);
-  return badgeTextVisible(node, nodeSourceBadgeMode) ? "" : nodeSource?.badgeText ?? "";
-}
-__name(getNodeSourceBadgeText, "getNodeSourceBadgeText");
-function getNodeLifeCycleBadgeText(node, nodeLifeCycleBadgeMode) {
-  let text = "";
-  const nodeDef = node.constructor.nodeData;
-  if (!nodeDef) {
-    return "";
-  }
-  if (nodeDef.deprecated) {
-    text = "[DEPR]";
-  }
-  if (nodeDef.experimental) {
-    text = "[BETA]";
-  }
-  return badgeTextVisible(node, nodeLifeCycleBadgeMode) ? "" : text;
-}
-__name(getNodeLifeCycleBadgeText, "getNodeLifeCycleBadgeText");
-class NodeBadgeExtension {
-  static {
-    __name(this, "NodeBadgeExtension");
-  }
-  constructor(nodeIdBadgeMode = null, nodeSourceBadgeMode = null, nodeLifeCycleBadgeMode = null, colorPalette = null) {
-    this.nodeIdBadgeMode = nodeIdBadgeMode;
-    this.nodeSourceBadgeMode = nodeSourceBadgeMode;
-    this.nodeLifeCycleBadgeMode = nodeLifeCycleBadgeMode;
-    this.colorPalette = colorPalette;
-  }
-  name = "Comfy.NodeBadge";
-  init(app2) {
-    const settingStore = useSettingStore();
-    this.nodeSourceBadgeMode = computed(
-      () => settingStore.get("Comfy.NodeBadge.NodeSourceBadgeMode")
-    );
-    this.nodeIdBadgeMode = computed(
-      () => settingStore.get("Comfy.NodeBadge.NodeIdBadgeMode")
-    );
-    this.nodeLifeCycleBadgeMode = computed(
-      () => settingStore.get(
-        "Comfy.NodeBadge.NodeLifeCycleBadgeMode"
-      )
-    );
-    this.colorPalette = computed(
-      () => getColorPalette(settingStore.get("Comfy.ColorPalette"))
-    );
-    watch(this.nodeSourceBadgeMode, () => {
-      app2.graph.setDirtyCanvas(true, true);
-    });
-    watch(this.nodeIdBadgeMode, () => {
-      app2.graph.setDirtyCanvas(true, true);
-    });
-    watch(this.nodeLifeCycleBadgeMode, () => {
-      app2.graph.setDirtyCanvas(true, true);
-    });
-  }
-  nodeCreated(node, app2) {
-    node.badgePosition = BadgePosition.TopRight;
-    node.badge_enabled = true;
-    const badge = computed(
-      () => new LGraphBadge({
-        text: _.truncate(
-          [
-            getNodeIdBadgeText(node, this.nodeIdBadgeMode.value),
-            getNodeLifeCycleBadgeText(
-              node,
-              this.nodeLifeCycleBadgeMode.value
-            ),
-            getNodeSourceBadgeText(node, this.nodeSourceBadgeMode.value)
-          ].filter((s) => s.length > 0).join(" "),
-          {
-            length: 31
-          }
-        ),
-        fgColor: this.colorPalette.value.colors.litegraph_base?.BADGE_FG_COLOR || defaultColorPalette.colors.litegraph_base.BADGE_FG_COLOR,
-        bgColor: this.colorPalette.value.colors.litegraph_base?.BADGE_BG_COLOR || defaultColorPalette.colors.litegraph_base.BADGE_BG_COLOR
-      })
-    );
-    node.badges.push(() => badge.value);
-  }
-}
-app.registerExtension(new NodeBadgeExtension());
-//# sourceMappingURL=index-D36_Nnai.js.map

web/assets/index-BitceZ14.css

@@ -1,51 +1,30 @@
 
-:root {
+.no-results-placeholder[data-v-a1e982e0] .p-card {
-  --red-600: #dc3545;
-}
-
-.comfy-missing-nodes[data-v-0a88b934] {
-  font-family: monospace;
-  color: var(--red-600);
-  padding: 1.5rem;
   background-color: var(--surface-ground);
-  border-radius: var(--border-radius);
+  text-align: center;
-  box-shadow: var(--card-shadow);
+  box-shadow: unset;
 }
-.warning-title[data-v-0a88b934] {
+.no-results-placeholder h3[data-v-a1e982e0] {
-  margin-top: 0;
+  color: var(--text-color);
+  margin-bottom: 0.5rem;
+}
+.no-results-placeholder p[data-v-a1e982e0] {
+  color: var(--text-color-secondary);
   margin-bottom: 1rem;
 }
-.warning-description[data-v-0a88b934] {
+
-  margin-bottom: 1rem;
+.comfy-missing-nodes[data-v-05a7c5eb] {
-}
-.missing-nodes-list[data-v-0a88b934] {
   max-height: 300px;
   overflow-y: auto;
 }
-.missing-nodes-list.maximized[data-v-0a88b934] {
+.node-hint[data-v-05a7c5eb] {
-  max-height: unset;
-}
-.missing-node-item[data-v-0a88b934] {
-  display: flex;
-  align-items: center;
-  padding: 0.5rem;
-}
-.node-type[data-v-0a88b934] {
-  font-weight: 600;
-  color: var(--text-color);
-}
-.node-hint[data-v-0a88b934] {
   margin-left: 0.5rem;
   font-style: italic;
   color: var(--text-color-secondary);
 }
-[data-v-0a88b934] .p-button {
+[data-v-05a7c5eb] .p-button {
   margin-left: auto;
 }
-.added-nodes-warning[data-v-0a88b934] {
-  margin-top: 1rem;
-  font-style: italic;
-}
 
 :root {
   --red-600: #dc3545;
@@ -217,24 +196,6 @@
   border: none !important;
 }
 
-.no-results-placeholder[data-v-c19e9e10] {
-  height: 100%;
-  padding: 2rem;
-}
-.no-results-placeholder[data-v-c19e9e10] .p-card {
-  background-color: var(--surface-ground);
-  text-align: center;
-  box-shadow: unset;
-}
-.no-results-placeholder h3[data-v-c19e9e10] {
-  color: var(--text-color);
-  margin-bottom: 0.5rem;
-}
-.no-results-placeholder p[data-v-c19e9e10] {
-  color: var(--text-color-secondary);
-  margin-bottom: 1rem;
-}
-
 .settings-tab-panels {
   padding-top: 0px !important;
 }
@@ -1808,6 +1769,9 @@ cursor: pointer;
       max-width: 3200px;
     }
   }
+  .pointer-events-none{
+    pointer-events: none;
+  }
   .pointer-events-auto{
     pointer-events: auto;
   }
@@ -2049,6 +2013,9 @@ cursor: pointer;
     margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
     margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
   }
+  .justify-self-end{
+    justify-self: end;
+  }
   .overflow-hidden{
     overflow: hidden;
   }
@@ -2072,6 +2039,9 @@ cursor: pointer;
   .whitespace-pre-line{
     white-space: pre-line;
   }
+  .whitespace-pre-wrap{
+    white-space: pre-wrap;
+  }
   .text-wrap{
     text-wrap: wrap;
   }
@@ -2135,9 +2105,15 @@ cursor: pointer;
   .p-2{
     padding: 0.5rem;
   }
+  .p-3{
+    padding: 0.75rem;
+  }
   .p-4{
     padding: 1rem;
   }
+  .p-8{
+    padding: 2rem;
+  }
   .px-0{
     padding-left: 0px;
     padding-right: 0px;
@@ -2146,6 +2122,10 @@ cursor: pointer;
     padding-left: 0.5rem;
     padding-right: 0.5rem;
   }
+  .px-4{
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
   .py-0{
     padding-top: 0px;
     padding-bottom: 0px;

web/assets/index-C_wOqB0f.js

@@ -1,6 +1,6 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { bM as script$4, A as createBaseVNode, g as openBlock, h as createElementBlock, m as mergeProps } from "./index-CgU1oKZt.js";
+import { bS as script$4, A as createBaseVNode, g as openBlock, h as createElementBlock, m as mergeProps } from "./index-BHayQCxv.js";
 var script$3 = {
   name: "BarsIcon",
   "extends": script$4
@@ -99,4 +99,4 @@ export {
   script$2 as c,
   script as s
 };
-//# sourceMappingURL=index-DYEEBf64.js.map
+//# sourceMappingURL=index-C_wOqB0f.js.map

web/assets/index-CwRXxFdA.js

@@ -1,7 +1,7 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { bM as script$s, A as createBaseVNode, g as openBlock, h as createElementBlock, m as mergeProps, B as BaseStyle, R as script$t, am as toDisplayString, al as Ripple, t as resolveDirective, v as withDirectives, x as createBlock, O as resolveDynamicComponent, bN as script$u, l as resolveComponent, C as normalizeClass, ao as createSlots, y as withCtx, bf as script$v, b5 as script$w, M as Fragment, N as renderList, ap as createTextVNode, aX as setAttribute, a1 as UniqueComponentId, aV as normalizeProps, p as renderSlot, j as createCommentVNode, ac as equals, aS as script$x, bO as script$y, bP as getFirstFocusableElement, a5 as OverlayEventBus, Y as getVNodeProp, a3 as resolveFieldData, bQ as invokeElementMethod, bR as getAttribute, bS as getNextElementSibling, W as getOuterWidth, bT as getPreviousElementSibling, D as script$z, ai as script$A, bU as script$B, aU as script$D, a0 as isNotEmpty, b2 as withModifiers, X as getOuterHeight, bV as _default, a2 as ZIndex, a4 as focus, a7 as addStyle, a9 as absolutePosition, aa as ConnectedOverlayScrollHandler, ab as isTouchDevice, bW as FilterOperator, ah as script$E, bX as FocusTrap, i as createVNode, an as Transition, bY as withKeys, bZ as getIndex, s as script$G, b_ as isClickable, b$ as clearSelection, c0 as localeComparator, c1 as sort, c2 as FilterService, bH as FilterMatchMode, ae as findSingle, c3 as findIndexInList, c4 as find, c5 as exportCSV, c6 as getOffset, c7 as getHiddenElementOuterWidth, c8 as getHiddenElementOuterHeight, c9 as reorderArray, ca as getWindowScrollTop, cb as removeClass, cc as addClass, a6 as isEmpty, ag as script$H, aj as script$I, aT as script$L, $ as vShow } from "./index-CgU1oKZt.js";
+import { bS as script$s, A as createBaseVNode, g as openBlock, h as createElementBlock, m as mergeProps, B as BaseStyle, R as script$t, a6 as toDisplayString, a1 as Ripple, t as resolveDirective, v as withDirectives, x as createBlock, J as resolveDynamicComponent, bT as script$u, l as resolveComponent, C as normalizeClass, av as createSlots, y as withCtx, br as script$v, bh as script$w, N as Fragment, O as renderList, aw as createTextVNode, b7 as setAttribute, ad as UniqueComponentId, b5 as normalizeProps, p as renderSlot, j as createCommentVNode, a4 as equals, b2 as script$x, bU as script$y, bV as getFirstFocusableElement, ag as OverlayEventBus, a8 as getVNodeProp, af as resolveFieldData, bW as invokeElementMethod, a2 as getAttribute, bX as getNextElementSibling, Y as getOuterWidth, bY as getPreviousElementSibling, D as script$z, ar as script$A, a0 as script$B, b4 as script$D, ac as isNotEmpty, be as withModifiers, W as getOuterHeight, bZ as _default, ae as ZIndex, a3 as focus, ai as addStyle, ak as absolutePosition, al as ConnectedOverlayScrollHandler, am as isTouchDevice, b_ as FilterOperator, aq as script$E, b$ as FocusTrap, i as createVNode, au as Transition, c0 as withKeys, c1 as getIndex, s as script$G, c2 as isClickable, c3 as clearSelection, c4 as localeComparator, c5 as sort, c6 as FilterService, bN as FilterMatchMode, V as findSingle, c7 as findIndexInList, c8 as find, c9 as exportCSV, X as getOffset, ca as getHiddenElementOuterWidth, cb as getHiddenElementOuterHeight, cc as reorderArray, cd as getWindowScrollTop, ce as removeClass, cf as addClass, ah as isEmpty, ap as script$H, as as script$I, b3 as script$L, ab as vShow } from "./index-BHayQCxv.js";
-import { b as script$C, c as script$F, s as script$J, a as script$K } from "./index-DYEEBf64.js";
+import { b as script$C, c as script$F, s as script$J, a as script$K } from "./index-C_wOqB0f.js";
 var script$r = {
   name: "ArrowDownIcon",
   "extends": script$s
@@ -8994,4 +8994,4 @@ export {
   script as b,
   script$2 as s
 };
-//# sourceMappingURL=index-DBWDcZsl.js.map
+//# sourceMappingURL=index-CwRXxFdA.js.map

web/assets/userSelection-DITGVoWz.js

@@ -1,6 +1,6 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { bq as api, bv as $el } from "./index-CgU1oKZt.js";
+import { bC as api, bG as $el } from "./index-BHayQCxv.js";
 function createSpinner() {
   const div = document.createElement("div");
   div.innerHTML = `<div class="lds-ring"><div></div><div></div><div></div><div></div></div>`;
@@ -126,4 +126,4 @@ window.comfyAPI.userSelection.UserSelectionScreen = UserSelectionScreen;
 export {
   UserSelectionScreen
 };
-//# sourceMappingURL=userSelection-DVDwxLD5.js.map
+//# sourceMappingURL=userSelection-DITGVoWz.js.map

web/assets/widgetInputs-DdecKYqd.js

@@ -1,6 +1,6 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { e as LGraphNode, c as app, bA as applyTextReplacements, bz as ComfyWidgets, bG as addValueControlWidgets, k as LiteGraph } from "./index-CgU1oKZt.js";
+import { e as LGraphNode, c as app, bL as applyTextReplacements, bK as ComfyWidgets, bM as addValueControlWidgets, k as LiteGraph } from "./index-BHayQCxv.js";
 const CONVERTED_TYPE = "converted-widget";
 const VALID_TYPES = [
   "STRING",
@@ -753,4 +753,4 @@ export {
   mergeIfValid,
   setWidgetConfig
 };
-//# sourceMappingURL=widgetInputs-DNVvusS1.js.map
+//# sourceMappingURL=widgetInputs-DdecKYqd.js.map

web/index.html

@@ -6,8 +6,8 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
     <link rel="stylesheet" type="text/css" href="user.css" />
     <link rel="stylesheet" type="text/css" href="materialdesignicons.min.css" />
-    <script type="module" crossorigin src="./assets/index-CgU1oKZt.js"></script>
+    <script type="module" crossorigin src="./assets/index-BHayQCxv.js"></script>
-    <link rel="stylesheet" crossorigin href="./assets/index-BDQCPKeJ.css">
+    <link rel="stylesheet" crossorigin href="./assets/index-BitceZ14.css">
   </head>
   <body class="litegraph grid">
     <div id="vue-app"></div>