Type LGraphNode.addDOMWidget (#2548)

This commit is contained in:
Chenlei Hu
2025-02-13 15:15:21 -05:00
committed by GitHub
parent 166ad432f3
commit f9c2db5908

View File

@@ -1,5 +1,6 @@
import { LGraphCanvas, LGraphNode, LiteGraph } from '@comfyorg/litegraph' import { LGraphCanvas, LGraphNode, LiteGraph } from '@comfyorg/litegraph'
import type { Size, Vector4 } from '@comfyorg/litegraph' import type { Size, Vector4 } from '@comfyorg/litegraph'
import type { ISerialisedNode } from '@comfyorg/litegraph/dist/types/serialisation'
import type { import type {
ICustomWidget, ICustomWidget,
IWidget, IWidget,
@@ -201,7 +202,7 @@ function computeSize(this: LGraphNode, size: Size): void {
} }
// Override the compute visible nodes function to allow us to hide/show DOM elements when the node goes offscreen // Override the compute visible nodes function to allow us to hide/show DOM elements when the node goes offscreen
const elementWidgets = new Set() const elementWidgets = new Set<LGraphNode>()
const computeVisibleNodes = LGraphCanvas.prototype.computeVisibleNodes const computeVisibleNodes = LGraphCanvas.prototype.computeVisibleNodes
LGraphCanvas.prototype.computeVisibleNodes = function ( LGraphCanvas.prototype.computeVisibleNodes = function (
nodes?: LGraphNode[], nodes?: LGraphNode[],
@@ -380,6 +381,7 @@ LGraphNode.prototype.addDOMWidget = function <
T extends HTMLElement, T extends HTMLElement,
V extends object | string V extends object | string
>( >(
this: LGraphNode,
name: string, name: string,
type: string, type: string,
element: T, element: T,
@@ -427,23 +429,26 @@ LGraphNode.prototype.addDOMWidget = function <
elementWidgets.add(this) elementWidgets.add(this)
const collapse = this.collapse const collapse = this.collapse
this.collapse = function (force?: boolean) { this.collapse = function (this: LGraphNode, force?: boolean) {
collapse.call(this, force) collapse.call(this, force)
if (this.flags?.collapsed) { if (this.collapsed) {
element.hidden = true element.hidden = true
element.style.display = 'none' element.style.display = 'none'
} }
element.dataset.collapsed = this.flags?.collapsed ? 'true' : 'false' element.dataset.collapsed = this.collapsed ? 'true' : 'false'
} }
const { onConfigure } = this const { onConfigure } = this
this.onConfigure = function (serializedNode: any) { this.onConfigure = function (
this: LGraphNode,
serializedNode: ISerialisedNode
) {
onConfigure?.call(this, serializedNode) onConfigure?.call(this, serializedNode)
element.dataset.collapsed = this.flags?.collapsed ? 'true' : 'false' element.dataset.collapsed = this.collapsed ? 'true' : 'false'
} }
const onRemoved = this.onRemoved const onRemoved = this.onRemoved
this.onRemoved = function () { this.onRemoved = function (this: LGraphNode) {
element.remove() element.remove()
elementWidgets.delete(this) elementWidgets.delete(this)
onRemoved?.call(this) onRemoved?.call(this)
@@ -454,7 +459,7 @@ LGraphNode.prototype.addDOMWidget = function <
// @ts-ignore index with symbol // @ts-ignore index with symbol
this[SIZE] = true this[SIZE] = true
const onResize = this.onResize const onResize = this.onResize
this.onResize = function (size: Size) { this.onResize = function (this: LGraphNode, size: Size) {
options.beforeResize?.call(widget, this) options.beforeResize?.call(widget, this)
computeSize.call(this, size) computeSize.call(this, size)
onResize?.call(this, size) onResize?.call(this, size)