Add support for hidden & advanced widgets

src/components/graph/NodeTooltip.vue

@@ -23,35 +23,6 @@ const tooltipText = ref('')
 const left = ref<string>()
 const top = ref<string>()
 
-const getHoveredWidget = () => {
-  const node = comfyApp.canvas.node_over
-  if (!node.widgets) return
-
-  const graphPos = comfyApp.canvas.graph_mouse
-  const x = graphPos[0] - node.pos[0]
-  const y = graphPos[1] - node.pos[1]
-
-  for (const w of node.widgets) {
-    let widgetWidth: number, widgetHeight: number
-    if (w.computeSize) {
-      ;[widgetWidth, widgetHeight] = w.computeSize(node.size[0])
-    } else {
-      widgetWidth = (w as { width?: number }).width || node.size[0]
-      widgetHeight = LiteGraph.NODE_WIDGET_HEIGHT
-    }
-
-    if (
-      w.last_y !== undefined &&
-      x >= 6 &&
-      x <= widgetWidth - 12 &&
-      y >= w.last_y &&
-      y <= w.last_y + widgetHeight
-    ) {
-      return w
-    }
-  }
-}
-
 const hideTooltip = () => (tooltipText.value = null)
 
 const showTooltip = async (tooltip: string | null | undefined) => {
@@ -111,7 +82,7 @@ const onIdle = () => {
     return showTooltip(nodeDef.output.all?.[outputSlot]?.tooltip)
   }
 
-  const widget = getHoveredWidget()
+  const widget = comfyApp.canvas.getWidgetAtCursor()
   // Dont show for DOM widgets, these use native browser tooltips as we dont get proper mouse events on these
   if (widget && !widget.element) {
     return showTooltip(

src/scripts/app.ts

@@ -57,6 +57,8 @@ import { useExtensionStore } from '@/stores/extensionStore'
 import { KeyComboImpl, useKeybindingStore } from '@/stores/keybindingStore'
 import { useCommandStore } from '@/stores/commandStore'
 import { shallowReactive } from 'vue'
+import { type IBaseWidget } from '@comfyorg/litegraph/dist/types/widgets'
+import { PickByType } from '@/types/utils'
 
 export const ANIM_PREVIEW_WIDGET = '$$comfy_animation_preview'
 
@@ -2013,7 +2015,11 @@ export class ComfyApp {
             nodeData['input']['optional']
           )
         }
-        const config = { minWidth: 1, minHeight: 1 }
+        const config: {
+          minWidth: number
+          minHeight: number
+          widget?: IBaseWidget
+        } = { minWidth: 1, minHeight: 1 }
         for (const inputName in inputs) {
           const inputData = inputs[inputName]
           const type = inputData[0]
@@ -2042,28 +2048,28 @@ export class ComfyApp {
             widgetCreated = false
           }
 
-          // @ts-expect-error
-          if (widgetCreated && !inputIsRequired && config?.widget) {
-            // @ts-expect-error
-            if (!config.widget.options) config.widget.options = {}
-            // @ts-expect-error
-            config.widget.options.inputIsOptional = true
+          const setWidgetFlag = <
+            T extends keyof PickByType<IBaseWidget, boolean>
+          >(
+            key: T,
+            value: boolean
+          ) => {
+            if (value && widgetCreated && config?.widget) {
+              config.widget.options ??= {}
+              config.widget[key] = true
+            }
           }
 
           // @ts-expect-error
-          if (widgetCreated && inputData[1]?.forceInput && config?.widget) {
-            // @ts-expect-error
-            if (!config.widget.options) config.widget.options = {}
-            // @ts-expect-error
-            config.widget.options.forceInput = inputData[1].forceInput
-          }
+          setWidgetFlag('inputIsOptional', !inputIsRequired)
           // @ts-expect-error
-          if (widgetCreated && inputData[1]?.defaultInput && config?.widget) {
-            // @ts-expect-error
-            if (!config.widget.options) config.widget.options = {}
-            // @ts-expect-error
-            config.widget.options.defaultInput = inputData[1].defaultInput
-          }
+          setWidgetFlag('forceInput', inputData[1]?.forceInput)
+          // @ts-expect-error
+          setWidgetFlag('defaultInput', inputData[1]?.defaultInput)
+          // @ts-expect-error
+          setWidgetFlag('advanced', inputData[1]?.advanced)
+          // @ts-expect-error
+          setWidgetFlag('hidden', inputData[1]?.hidden)
         }
 
         for (const o in nodeData['output']) {

src/types/apiTypes.ts

@@ -244,7 +244,9 @@ const zBaseInputSpecValue = z
     forceInput: z.boolean().optional(),
     lazy: z.boolean().optional(),
     rawLink: z.boolean().optional(),
-    tooltip: z.string().optional()
+    tooltip: z.string().optional(),
+    hidden: z.boolean().optional(),
+    advanced: z.boolean().optional()
   })
   .passthrough()
 

src/types/utils.ts

@@ -0,0 +1,3 @@
+export type PickByType<T, Value> = {
+  [P in keyof T as T[P] extends Value | undefined ? P : never]: T[P]
+}