Update frontend to 1.2.30 (#4513)

web/assets/index-DAK31IJJ.css

@@ -1,8 +1,8 @@
 @font-face {
     font-family: 'primeicons';
     font-display: block;
-    src: url('/assets/primeicons-DMOk5skT.eot');
+    src: url('./primeicons-DMOk5skT.eot');
-    src: url('/assets/primeicons-DMOk5skT.eot?#iefix') format('embedded-opentype'), url('/assets/primeicons-C6QP2o4f.woff2') format('woff2'), url('/assets/primeicons-WjwUDZjB.woff') format('woff'), url('/assets/primeicons-MpK4pl85.ttf') format('truetype'), url('/assets/primeicons-Dr5RGzOO.svg?#primeicons') format('svg');
+    src: url('./primeicons-DMOk5skT.eot?#iefix') format('embedded-opentype'), url('./primeicons-C6QP2o4f.woff2') format('woff2'), url('./primeicons-WjwUDZjB.woff') format('woff'), url('./primeicons-MpK4pl85.ttf') format('truetype'), url('./primeicons-Dr5RGzOO.svg?#primeicons') format('svg');
     font-weight: normal;
     font-style: normal;
 }
@@ -1330,6 +1330,184 @@
 .comfyui-body-right .side-bar-button.side-bar-button-selected[data-v-7a0b94a3]:hover {
   border-right: 4px solid var(--p-button-text-primary-color);
 }
+
+:root {
+  --red-600: #dc3545;
+}
+
+.comfy-missing-nodes[data-v-286402f2] {
+  font-family: monospace;
+  color: var(--red-600);
+  padding: 1.5rem;
+  background-color: var(--surface-ground);
+  border-radius: var(--border-radius);
+  box-shadow: var(--card-shadow);
+}
+.warning-title[data-v-286402f2] {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+.warning-description[data-v-286402f2] {
+  margin-bottom: 1rem;
+}
+.missing-nodes-list[data-v-286402f2] {
+  max-height: 300px;
+  overflow-y: auto;
+}
+.missing-nodes-list.maximized[data-v-286402f2] {
+  max-height: unset;
+}
+.missing-node-item[data-v-286402f2] {
+  display: flex;
+  align-items: center;
+  padding: 0.5rem;
+}
+.node-type[data-v-286402f2] {
+  font-weight: 600;
+  color: var(--text-color);
+}
+.node-hint[data-v-286402f2] {
+  margin-left: 0.5rem;
+  font-style: italic;
+  color: var(--text-color-secondary);
+}
+[data-v-286402f2] .p-button {
+  margin-left: auto;
+}
+.added-nodes-warning[data-v-286402f2] {
+  margin-top: 1rem;
+  font-style: italic;
+}
+
+.input-slider[data-v-fbaf7a8c] {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+}
+.slider-part[data-v-fbaf7a8c] {
+  flex-grow: 1;
+}
+.input-part[data-v-fbaf7a8c] {
+  width: 5rem !important;
+}
+
+.info-chip[data-v-6361f2fb] {
+  background: transparent;
+}
+.setting-item[data-v-6361f2fb] {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 1rem;
+}
+.setting-label[data-v-6361f2fb] {
+  display: flex;
+  align-items: center;
+  flex: 1;
+}
+.setting-input[data-v-6361f2fb] {
+  flex: 1;
+  display: flex;
+  justify-content: flex-end;
+  margin-left: 1rem;
+}
+
+/* Ensure PrimeVue components take full width of their container */
+.setting-input[data-v-6361f2fb] .p-inputtext,
+.setting-input[data-v-6361f2fb] .input-slider,
+.setting-input[data-v-6361f2fb] .p-select,
+.setting-input[data-v-6361f2fb] .p-togglebutton {
+  width: 100%;
+  max-width: 200px;
+}
+.setting-input[data-v-6361f2fb] .p-inputtext {
+  max-width: unset;
+}
+
+/* Special case for ToggleSwitch to align it to the right */
+.setting-input[data-v-6361f2fb] .p-toggleswitch {
+  margin-left: auto;
+}
+
+.search-box-input[data-v-8160f15b] {
+  width: 100%;
+}
+
+.no-results-placeholder[data-v-5a7d148a] {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  padding: 2rem;
+}
+.no-results-placeholder[data-v-5a7d148a] .p-card {
+  background-color: var(--surface-ground);
+  text-align: center;
+}
+.no-results-placeholder h3[data-v-5a7d148a] {
+  color: var(--text-color);
+  margin-bottom: 0.5rem;
+}
+.no-results-placeholder p[data-v-5a7d148a] {
+  color: var(--text-color-secondary);
+  margin-bottom: 1rem;
+}
+
+/* Remove after we have tailwind setup */
+.border-none {
+  border: none !important;
+}
+.settings-tab-panels {
+  padding-top: 0px !important;
+}
+
+.settings-container[data-v-29723d1f] {
+  display: flex;
+  height: 70vh;
+  width: 60vw;
+  max-width: 1000px;
+  overflow: hidden;
+  /* Prevents container from scrolling */
+}
+.settings-sidebar[data-v-29723d1f] {
+  width: 250px;
+  flex-shrink: 0;
+  /* Prevents sidebar from shrinking */
+  overflow-y: auto;
+  padding: 10px;
+}
+.settings-search-box[data-v-29723d1f] {
+  width: 100%;
+  margin-bottom: 10px;
+}
+.settings-content[data-v-29723d1f] {
+  flex-grow: 1;
+  overflow-y: auto;
+  /* Allows vertical scrolling */
+}
+
+/* Ensure the Listbox takes full width of the sidebar */
+.settings-sidebar[data-v-29723d1f] .p-listbox {
+  width: 100%;
+}
+
+/* Optional: Style scrollbars for webkit browsers */
+.settings-sidebar[data-v-29723d1f]::-webkit-scrollbar,
+.settings-content[data-v-29723d1f]::-webkit-scrollbar {
+  width: 1px;
+}
+.settings-sidebar[data-v-29723d1f]::-webkit-scrollbar-thumb,
+.settings-content[data-v-29723d1f]::-webkit-scrollbar-thumb {
+  background-color: transparent;
+}
+
+.pi-cog[data-v-969a1066] {
+  font-size: 1.25rem;
+  margin-right: 0.5rem;
+}
+.version-tag[data-v-969a1066] {
+  margin-left: 0.5rem;
+}
 .lds-ring {
   display: inline-block;
   position: relative;
@@ -2881,6 +3059,7 @@ body {
 #graph-canvas {
   width: 100%;
   height: 100%;
+  touch-action: none;
 }
 
 .comfyui-body-right {
@@ -3482,184 +3661,6 @@ audio.comfy-audio.empty-audio-widget {
   max-width: 25vw;
 }
 
-:root {
-  --red-600: #dc3545;
-}
-
-.comfy-missing-nodes[data-v-286402f2] {
-  font-family: monospace;
-  color: var(--red-600);
-  padding: 1.5rem;
-  background-color: var(--surface-ground);
-  border-radius: var(--border-radius);
-  box-shadow: var(--card-shadow);
-}
-.warning-title[data-v-286402f2] {
-  margin-top: 0;
-  margin-bottom: 1rem;
-}
-.warning-description[data-v-286402f2] {
-  margin-bottom: 1rem;
-}
-.missing-nodes-list[data-v-286402f2] {
-  max-height: 300px;
-  overflow-y: auto;
-}
-.missing-nodes-list.maximized[data-v-286402f2] {
-  max-height: unset;
-}
-.missing-node-item[data-v-286402f2] {
-  display: flex;
-  align-items: center;
-  padding: 0.5rem;
-}
-.node-type[data-v-286402f2] {
-  font-weight: 600;
-  color: var(--text-color);
-}
-.node-hint[data-v-286402f2] {
-  margin-left: 0.5rem;
-  font-style: italic;
-  color: var(--text-color-secondary);
-}
-[data-v-286402f2] .p-button {
-  margin-left: auto;
-}
-.added-nodes-warning[data-v-286402f2] {
-  margin-top: 1rem;
-  font-style: italic;
-}
-
-.input-slider[data-v-fbaf7a8c] {
-  display: flex;
-  align-items: center;
-  gap: 1rem;
-}
-.slider-part[data-v-fbaf7a8c] {
-  flex-grow: 1;
-}
-.input-part[data-v-fbaf7a8c] {
-  width: 5rem !important;
-}
-
-.info-chip[data-v-4feeb3d2] {
-  background: transparent;
-}
-.setting-item[data-v-4feeb3d2] {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 1rem;
-}
-.setting-label[data-v-4feeb3d2] {
-  display: flex;
-  align-items: center;
-  flex: 1;
-}
-.setting-input[data-v-4feeb3d2] {
-  flex: 1;
-  display: flex;
-  justify-content: flex-end;
-  margin-left: 1rem;
-}
-
-/* Ensure PrimeVue components take full width of their container */
-.setting-input[data-v-4feeb3d2] .p-inputtext,
-.setting-input[data-v-4feeb3d2] .input-slider,
-.setting-input[data-v-4feeb3d2] .p-select,
-.setting-input[data-v-4feeb3d2] .p-togglebutton {
-  width: 100%;
-  max-width: 200px;
-}
-.setting-input[data-v-4feeb3d2] .p-inputtext {
-  max-width: unset;
-}
-
-/* Special case for ToggleSwitch to align it to the right */
-.setting-input[data-v-4feeb3d2] .p-toggleswitch {
-  margin-left: auto;
-}
-
-.search-box-input[data-v-3bbe5335] {
-  width: 100%;
-}
-
-.no-results-placeholder[data-v-5a7d148a] {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-  padding: 2rem;
-}
-.no-results-placeholder[data-v-5a7d148a] .p-card {
-  background-color: var(--surface-ground);
-  text-align: center;
-}
-.no-results-placeholder h3[data-v-5a7d148a] {
-  color: var(--text-color);
-  margin-bottom: 0.5rem;
-}
-.no-results-placeholder p[data-v-5a7d148a] {
-  color: var(--text-color-secondary);
-  margin-bottom: 1rem;
-}
-
-/* Remove after we have tailwind setup */
-.border-none {
-  border: none !important;
-}
-.settings-tab-panels {
-  padding-top: 0px !important;
-}
-
-.settings-container[data-v-833dbfbb] {
-  display: flex;
-  height: 70vh;
-  width: 60vw;
-  max-width: 1000px;
-  overflow: hidden;
-  /* Prevents container from scrolling */
-}
-.settings-sidebar[data-v-833dbfbb] {
-  width: 250px;
-  flex-shrink: 0;
-  /* Prevents sidebar from shrinking */
-  overflow-y: auto;
-  padding: 10px;
-}
-.settings-search-box[data-v-833dbfbb] {
-  width: 100%;
-  margin-bottom: 10px;
-}
-.settings-content[data-v-833dbfbb] {
-  flex-grow: 1;
-  overflow-y: auto;
-  /* Allows vertical scrolling */
-}
-
-/* Ensure the Listbox takes full width of the sidebar */
-.settings-sidebar[data-v-833dbfbb] .p-listbox {
-  width: 100%;
-}
-
-/* Optional: Style scrollbars for webkit browsers */
-.settings-sidebar[data-v-833dbfbb]::-webkit-scrollbar,
-.settings-content[data-v-833dbfbb]::-webkit-scrollbar {
-  width: 1px;
-}
-.settings-sidebar[data-v-833dbfbb]::-webkit-scrollbar-thumb,
-.settings-content[data-v-833dbfbb]::-webkit-scrollbar-thumb {
-  background-color: transparent;
-}
-
-.pi-cog[data-v-969a1066] {
-  font-size: 1.25rem;
-  margin-right: 0.5rem;
-}
-.version-tag[data-v-969a1066] {
-  margin-left: 0.5rem;
-}
-
 :root {
   --sidebar-width: 64px;
   --sidebar-icon-size: 1.5rem;
@@ -3869,77 +3870,81 @@ audio.comfy-audio.empty-audio-widget {
   color: var(--error-text);
 }
 
-.comfy-vue-node-search-container[data-v-b8a4ffdc] {
+.comfy-vue-node-search-container[data-v-ba2c5897] {
   display: flex;
   width: 100%;
   min-width: 24rem;
   align-items: center;
   justify-content: center;
 }
-.comfy-vue-node-search-container[data-v-b8a4ffdc] * {
+.comfy-vue-node-search-container[data-v-ba2c5897] * {
   pointer-events: auto;
 }
-.comfy-vue-node-preview-container[data-v-b8a4ffdc] {
+.comfy-vue-node-preview-container[data-v-ba2c5897] {
   position: absolute;
   left: -350px;
   top: 50px;
 }
-.comfy-vue-node-search-box[data-v-b8a4ffdc] {
+.comfy-vue-node-search-box[data-v-ba2c5897] {
   z-index: 10;
   flex-grow: 1;
 }
-.option-container[data-v-b8a4ffdc] {
+.option-container[data-v-ba2c5897] {
   display: flex;
   width: 100%;
   cursor: pointer;
-  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
   overflow: hidden;
-  padding-left: 1rem;
+  padding-left: 0.5rem;
-  padding-right: 1rem;
+  padding-right: 0.5rem;
-  padding-top: 0.5rem;
+  padding-top: 0px;
-  padding-bottom: 0.5rem;
+  padding-bottom: 0px;
 }
-.option-display-name[data-v-b8a4ffdc] {
+.option-display-name[data-v-ba2c5897] {
+  display: flex;
+  flex-direction: column;
   font-weight: 600;
 }
-.option-category[data-v-b8a4ffdc] {
+.option-category[data-v-ba2c5897] {
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: 0.875rem;
   line-height: 1.25rem;
+  font-weight: 300;
   --tw-text-opacity: 1;
   color: rgb(156 163 175 / var(--tw-text-opacity));
   /* Keeps the text on a single line by default */
   white-space: nowrap;
 }
-.i-badge[data-v-b8a4ffdc] {
+.i-badge[data-v-ba2c5897] {
   --tw-bg-opacity: 1;
   background-color: rgb(34 197 94 / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
-.o-badge[data-v-b8a4ffdc] {
+.o-badge[data-v-ba2c5897] {
   --tw-bg-opacity: 1;
   background-color: rgb(239 68 68 / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
-.c-badge[data-v-b8a4ffdc] {
+.c-badge[data-v-ba2c5897] {
   --tw-bg-opacity: 1;
   background-color: rgb(59 130 246 / var(--tw-bg-opacity));
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
-.s-badge[data-v-b8a4ffdc] {
+.s-badge[data-v-ba2c5897] {
   --tw-bg-opacity: 1;
   background-color: rgb(234 179 8 / var(--tw-bg-opacity));
 }
-[data-v-b8a4ffdc] .highlight {
+[data-v-ba2c5897] .highlight {
   background-color: var(--p-primary-color);
   color: var(--p-primary-contrast-color);
   font-weight: bold;
   border-radius: 0.25rem;
-  padding: 0.125rem 0.25rem;
+  padding: 0rem 0.125rem;
   margin: -0.125rem 0.125rem;
 }
 
@@ -3971,46 +3976,57 @@ audio.comfy-audio.empty-audio-widget {
   z-index: 99999;
 }
 
-.result-container[data-v-0fac61d9] {
+.broken-image[data-v-1a883642] {
+  display: none;
+}
+.broken-image-placeholder[data-v-1a883642] {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  margin: 2rem;
+}
+.broken-image-placeholder i[data-v-1a883642] {
+  font-size: 3rem;
+  margin-bottom: 0.5rem;
+}
+
+.result-container[data-v-7ceacc88] {
+  width: 100%;
+  height: 100%;
   aspect-ratio: 1 / 1;
   overflow: hidden;
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
-[data-v-0fac61d9] img {
+[data-v-7ceacc88] .task-output-image {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
      object-fit: cover;
+  -o-object-position: center;
+     object-position: center;
 }
-.p-image-preview[data-v-0fac61d9] {
+.image-preview-mask[data-v-7ceacc88] {
-  position: static;
-  display: contents;
-}
-[data-v-0fac61d9] .image-preview-mask {
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
-  width: auto;
-  height: auto;
   display: flex;
   align-items: center;
   justify-content: center;
   opacity: 0;
-  padding: 10px;
+  transition: opacity 0.3s ease;
-  cursor: pointer;
+}
-  background: rgba(0, 0, 0, 0.5);
+.result-container:hover .image-preview-mask[data-v-7ceacc88] {
-  color: var(--p-image-preview-mask-color);
+  opacity: 1;
-  transition:
-    opacity var(--p-image-transition-duration),
-    background var(--p-image-transition-duration);
-  border-radius: 50%;
 }
 
-.task-result-preview[data-v-6cf8179c] {
+.task-result-preview[data-v-7c099cb7] {
   aspect-ratio: 1 / 1;
   overflow: hidden;
   display: flex;
@@ -4019,18 +4035,18 @@ audio.comfy-audio.empty-audio-widget {
   width: 100%;
   height: 100%;
 }
-.task-result-preview i[data-v-6cf8179c],
+.task-result-preview i[data-v-7c099cb7],
-.task-result-preview span[data-v-6cf8179c] {
+.task-result-preview span[data-v-7c099cb7] {
   font-size: 2rem;
 }
-.task-item[data-v-6cf8179c] {
+.task-item[data-v-7c099cb7] {
   display: flex;
   flex-direction: column;
   border-radius: 4px;
   overflow: hidden;
   position: relative;
 }
-.task-item-details[data-v-6cf8179c] {
+.task-item-details[data-v-7c099cb7] {
   position: absolute;
   bottom: 0;
   padding: 0.6rem;
@@ -4041,12 +4057,23 @@ audio.comfy-audio.empty-audio-widget {
 
 /* In dark mode, transparent background color for tags is not ideal for tags that
 are floating on top of images. */
-.tag-wrapper[data-v-6cf8179c] {
+.tag-wrapper[data-v-7c099cb7] {
   background-color: var(--p-primary-contrast-color);
   border-radius: 6px;
   display: inline-flex;
 }
 
+/* PrimeVue's galleria teleports the fullscreen gallery out of subtree so we
+cannot use scoped style here. */
+img.galleria-image {
+  max-width: 100vw;
+  max-height: 100vh;
+  -o-object-fit: contain;
+     object-fit: contain;
+  /* Set z-index so the close button doesn't get hidden behind the image when image is large */
+  z-index: -1;
+}
+
 .comfy-vue-side-bar-container[data-v-bde767d2] {
   display: flex;
   flex-direction: column;
@@ -4078,14 +4105,33 @@ are floating on top of images. */
   background-color: transparent;
 }
 
-.queue-grid[data-v-7f831ee9] {
+.scroll-container[data-v-bd027c46] {
+  height: 100%;
+  overflow-y: auto;
+}
+.queue-grid[data-v-bd027c46] {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
   padding: 0.5rem;
   gap: 0.5rem;
 }
 
-.spinner[data-v-40c18658] {
+.node-lib-tree-node-label {
+  display: flex;
+  align-items: center;
+  margin-left: var(--p-tree-node-gap);
+}
+
+[data-v-11e12183] .node-lib-search-box {
+  margin-left: 1rem;
+  margin-right: 1rem;
+  margin-top: 1rem;
+}
+[data-v-11e12183] .comfy-vue-side-bar-body {
+  background: var(--p-tree-background);
+}
+
+.spinner[data-v-afce9bd6] {
     position: absolute;
     inset: 0px;
     display: flex;

web/assets/index-DkvOTKox.js

@@ -48,7 +48,7 @@ var __async = (__this, __arguments, generator) => {
   });
 };
 var _PrimitiveNode_instances, onFirstConnection_fn, createWidget_fn, mergeWidgetConfig_fn, isValidConnection_fn, removeWidgets_fn, _convertedToProcess;
-import { C as ComfyDialog, $ as $el, a as ComfyApp, b as app, L as LGraphCanvas, c as LiteGraph, d as applyTextReplacements, e as ComfyWidgets, f as addValueControlWidgets, D as DraggableList, g as api, h as LGraphGroup, i as LGraphNode } from "./index-D8Zp4vRl.js";
+import { C as ComfyDialog, $ as $el, a as ComfyApp, b as app, L as LGraphCanvas, c as LiteGraph, d as applyTextReplacements, e as ComfyWidgets, f as addValueControlWidgets, D as DraggableList, g as api, u as useToastStore, h as LGraphGroup, i as LGraphNode } from "./index-CaD4RONs.js";
 const _ClipspaceDialog = class _ClipspaceDialog extends ComfyDialog {
   static registerButton(name, contextPredicate, callback) {
     const item = $el("button", {
@@ -891,6 +891,7 @@ app.registerExtension({
     });
     app.ui.settings.addSetting({
       id: id$4,
+      category: ["Comfy", "ColorPalette"],
       name: "Color Palette",
       type: /* @__PURE__ */ __name((name, setter, value) => {
         const options = [
@@ -923,12 +924,6 @@ app.registerExtension({
           options
         );
         return $el("tr", [
-          $el("td", [
-            $el("label", {
-              for: id$4.replaceAll(".", "-"),
-              textContent: "Color palette"
-            })
-          ]),
           $el("td", [
             els.select,
             $el(
@@ -1221,7 +1216,6 @@ app.registerExtension({
       const floatWeight = parseFloat(weight);
       if (isNaN(floatWeight)) return weight;
       const newWeight = floatWeight + delta;
-      if (newWeight < 0) return "0";
       return String(Number(newWeight.toFixed(10)));
     }
     __name(incrementWeight, "incrementWeight");
@@ -1302,7 +1296,7 @@ app.registerExtension({
       selectedText = addWeightToParentheses(selectedText);
       const weightDelta = event.key === "ArrowUp" ? delta : -delta;
       const updatedText = selectedText.replace(
-        /\((.*):(\d+(?:\.\d+)?)\)/,
+        /\((.*):([+-]?\d+(?:\.\d+)?)\)/,
         (match, text, weight) => {
           weight = incrementWeight(weight, weightDelta);
           if (weight == 1) {
@@ -1620,9 +1614,9 @@ function getWidgetConfig(slot) {
 }
 __name(getWidgetConfig, "getWidgetConfig");
 function getConfig(widgetName) {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e;
   const { nodeData } = this.constructor;
-  return (_d = (_a = nodeData == null ? void 0 : nodeData.input) == null ? void 0 : _a.required[widgetName]) != null ? _d : (_c = (_b = nodeData == null ? void 0 : nodeData.input) == null ? void 0 : _b.optional) == null ? void 0 : _c[widgetName];
+  return (_e = (_b = (_a = nodeData == null ? void 0 : nodeData.input) == null ? void 0 : _a.required) == null ? void 0 : _b[widgetName]) != null ? _e : (_d = (_c = nodeData == null ? void 0 : nodeData.input) == null ? void 0 : _c.optional) == null ? void 0 : _d[widgetName];
 }
 __name(getConfig, "getConfig");
 function isConvertibleWidget(widget, config) {
@@ -1854,8 +1848,7 @@ app.registerExtension({
   init() {
     useConversionSubmenusSetting = app.ui.settings.addSetting({
       id: "Comfy.NodeInputConversionSubmenus",
-      name: "Node widget/input conversion sub-menus",
+      name: "In the node context menu, place the entries that convert between input/widget in sub-menus.",
-      tooltip: "In the node context menu, place the entries that convert between input/widget in sub-menus.",
       type: "boolean",
       defaultValue: true
     });
@@ -3957,7 +3950,8 @@ app.registerExtension({
     }, "replace");
     app.ui.settings.addSetting({
       id: id$2,
-      name: "Invert Menu Scrolling",
+      category: ["Comfy", "Graph", "InvertMenuScrolling"],
+      name: "Invert Context Menu Scrolling",
       type: "boolean",
       defaultValue: false,
       onChange(value) {
@@ -3974,58 +3968,66 @@ app.registerExtension({
   name: "Comfy.Keybinds",
   init() {
     const keybindListener = /* @__PURE__ */ __name(function(event) {
-      const modifierPressed = event.ctrlKey || event.metaKey;
+      return __async(this, null, function* () {
-      if (modifierPressed && event.key === "Enter") {
+        const modifierPressed = event.ctrlKey || event.metaKey;
-        if (event.altKey) {
+        if (modifierPressed && event.key === "Enter") {
-          api.interrupt();
+          if (event.altKey) {
+            yield api.interrupt();
+            useToastStore().add({
+              severity: "info",
+              summary: "Interrupted",
+              detail: "Execution has been interrupted",
+              life: 1e3
+            });
+            return;
+          }
+          app.queuePrompt(event.shiftKey ? -1 : 0).then();
           return;
         }
-        app.queuePrompt(event.shiftKey ? -1 : 0).then();
+        const target = event.composedPath()[0];
-        return;
+        if (["INPUT", "TEXTAREA"].includes(target.tagName)) {
-      }
+          return;
-      const target = event.composedPath()[0];
-      if (["INPUT", "TEXTAREA"].includes(target.tagName)) {
-        return;
-      }
-      const modifierKeyIdMap = {
-        s: "#comfy-save-button",
-        o: "#comfy-file-input",
-        Backspace: "#comfy-clear-button",
-        d: "#comfy-load-default-button"
-      };
-      const modifierKeybindId = modifierKeyIdMap[event.key];
-      if (modifierPressed && modifierKeybindId) {
-        event.preventDefault();
-        const elem = document.querySelector(modifierKeybindId);
-        elem.click();
-        return;
-      }
-      if (event.ctrlKey || event.altKey || event.metaKey) {
-        return;
-      }
-      if (event.key === "Escape") {
-        const modals = document.querySelectorAll(".comfy-modal");
-        const modal = Array.from(modals).find(
-          (modal2) => window.getComputedStyle(modal2).getPropertyValue("display") !== "none"
-        );
-        if (modal) {
-          modal.style.display = "none";
         }
-        ;
+        const modifierKeyIdMap = {
-        [...document.querySelectorAll("dialog")].forEach((d) => {
+          s: "#comfy-save-button",
-          d.close();
+          o: "#comfy-file-input",
-        });
+          Backspace: "#comfy-clear-button",
-      }
+          d: "#comfy-load-default-button"
-      const keyIdMap = {
+        };
-        q: ".queue-tab-button.side-bar-button",
+        const modifierKeybindId = modifierKeyIdMap[event.key];
-        h: ".queue-tab-button.side-bar-button",
+        if (modifierPressed && modifierKeybindId) {
-        r: "#comfy-refresh-button"
+          event.preventDefault();
-      };
+          const elem = document.querySelector(modifierKeybindId);
-      const buttonId = keyIdMap[event.key];
+          elem.click();
-      if (buttonId) {
+          return;
-        const button = document.querySelector(buttonId);
+        }
-        button.click();
+        if (event.ctrlKey || event.altKey || event.metaKey) {
-      }
+          return;
+        }
+        if (event.key === "Escape") {
+          const modals = document.querySelectorAll(".comfy-modal");
+          const modal = Array.from(modals).find(
+            (modal2) => window.getComputedStyle(modal2).getPropertyValue("display") !== "none"
+          );
+          if (modal) {
+            modal.style.display = "none";
+          }
+          ;
+          [...document.querySelectorAll("dialog")].forEach((d) => {
+            d.close();
+          });
+        }
+        const keyIdMap = {
+          q: ".queue-tab-button.side-bar-button",
+          h: ".queue-tab-button.side-bar-button",
+          r: "#comfy-refresh-button"
+        };
+        const buttonId = keyIdMap[event.key];
+        if (buttonId) {
+          const button = document.querySelector(buttonId);
+          button.click();
+        }
+      });
     }, "keybindListener");
     window.addEventListener("keydown", keybindListener, true);
   }
@@ -4037,6 +4039,7 @@ const ext = {
     return __async(this, null, function* () {
       app2.ui.settings.addSetting({
         id: id$1,
+        category: ["Comfy", "Graph", "LinkRenderMode"],
         name: "Link Render Mode",
         defaultValue: 2,
         type: "combo",
@@ -5684,7 +5687,9 @@ app.registerExtension({
     LiteGraph.middle_click_slot_add_default_node = true;
     this.suggestionsNumber = app.ui.settings.addSetting({
       id: "Comfy.NodeSuggestions.number",
+      category: ["Comfy", "Node Search Box", "NodeSuggestions"],
       name: "Number of nodes suggestions",
+      tooltip: "Only for litegraph searchbox/context menu",
       type: "slider",
       attrs: {
         min: 1,
@@ -5766,7 +5771,8 @@ app.registerExtension({
   init() {
     app.ui.settings.addSetting({
       id: "Comfy.SnapToGrid.GridSize",
-      name: "Grid Size",
+      category: ["Comfy", "Graph", "GridSize"],
+      name: "Snap to gird size",
       type: "slider",
       attrs: {
         min: 1,
@@ -6176,4 +6182,4 @@ app.registerExtension({
     };
   }
 });
-//# sourceMappingURL=index--0nRVkuV.js.map
+//# sourceMappingURL=index-DkvOTKox.js.map

web/assets/userSelection-GRU1gtOt.js

@@ -20,7 +20,7 @@ var __async = (__this, __arguments, generator) => {
     step((generator = generator.apply(__this, __arguments)).next());
   });
 };
-import { j as createSpinner, g as api, $ as $el } from "./index-D8Zp4vRl.js";
+import { j as createSpinner, g as api, $ as $el } from "./index-CaD4RONs.js";
 const _UserSelectionScreen = class _UserSelectionScreen {
   show(users, user) {
     return __async(this, null, function* () {
@@ -139,4 +139,4 @@ window.comfyAPI.userSelection.UserSelectionScreen = UserSelectionScreen;
 export {
   UserSelectionScreen
 };
-//# sourceMappingURL=userSelection-CH4RQEqW.js.map
+//# sourceMappingURL=userSelection-GRU1gtOt.js.map

web/index.html

@@ -14,8 +14,8 @@
 		</style> -->
 		<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-D8Zp4vRl.js"></script>
+		<script type="module" crossorigin src="./assets/index-CaD4RONs.js"></script>
-		<link rel="stylesheet" crossorigin href="/assets/index-BHzRuMlR.css">
+		<link rel="stylesheet" crossorigin href="./assets/index-DAK31IJJ.css">
 	</head>
 	<body class="litegraph">
 		<div id="vue-app"></div>