From 965ab674d580acf8e29c82fbb2a929ce4f6fe091 Mon Sep 17 00:00:00 2001 From: Johnpaul Chiwetelu <49923152+Myestery@users.noreply.github.com> Date: Mon, 12 Jan 2026 20:30:33 +0100 Subject: [PATCH] Road to No Explicit Any Part 3: Litegraph (#7935) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Summary - Replace `any` types with proper TypeScript types in litegraph core files - Focused on `LGraphCanvas.ts`, `LGraphNode.ts`, and `LGraph.ts` ## Changes **LGraphCanvas.ts:** - `ICreatePanelOptions` interface: `closable`, `window`, `width`, `height` - `options` property: `skip_events`, `viewport`, `skip_render`, `autoresize` - `prompt` function: `value` and `callback` parameters - `onSearchBox` return type: `string[] | void` - `onSearchBoxSelection` callback: `name: string`, `event: MouseEvent` - `onDrawBackground` / `onDrawForeground` callbacks: `visible_area: Rectangle` - Properties Panel callback parameters **LGraphNode.ts:** - `onDropFile` / `onDropData`: `file: File`, `filename: string` - `action_call` option: `string` (5 occurrences) - `onSerialize` return type: `void` - `onDrawTitleBar.fgcolor`: `string` **LGraph.ts:** - `LGraphConfig`: `align_to_grid`, `links_ontop` as `boolean` - `triggerInput`: `value: unknown` - `setCallback`: `func: (() => void) | undefined` ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-7935-Road-to-No-Explicit-Any-Part-3-Litegraph-2e36d73d3650819eb9f9ec9c16ebc3b9) by [Unito](https://www.unito.io) --- src/extensions/core/selectionBorder.ts | 5 ++- src/lib/litegraph/src/LGraph.ts | 8 ++-- src/lib/litegraph/src/LGraphCanvas.ts | 56 ++++++++++++++++---------- src/lib/litegraph/src/LGraphNode.ts | 20 ++++----- 4 files changed, 52 insertions(+), 37 deletions(-) diff --git a/src/extensions/core/selectionBorder.ts b/src/extensions/core/selectionBorder.ts index c4afafad1..fd3e98a91 100644 --- a/src/extensions/core/selectionBorder.ts +++ b/src/extensions/core/selectionBorder.ts @@ -1,4 +1,5 @@ -import { type LGraphCanvas, createBounds } from '@/lib/litegraph/src/litegraph' +import type { LGraphCanvas, Rectangle } from '@/lib/litegraph/src/litegraph' +import { createBounds } from '@/lib/litegraph/src/litegraph' import { app } from '@/scripts/app' /** @@ -56,7 +57,7 @@ const ext = { app.canvas.onDrawForeground = function ( ctx: CanvasRenderingContext2D, - visibleArea: any + visibleArea: Rectangle ) { // Call original if it exists originalDrawForeground?.call(this, ctx, visibleArea) diff --git a/src/lib/litegraph/src/LGraph.ts b/src/lib/litegraph/src/LGraph.ts index 32494c615..561836d1e 100644 --- a/src/lib/litegraph/src/LGraph.ts +++ b/src/lib/litegraph/src/LGraph.ts @@ -98,8 +98,8 @@ type ParamsArray< /** Configuration used by {@link LGraph} `config`. */ export interface LGraphConfig { /** @deprecated Legacy config - unused */ - align_to_grid?: any - links_ontop?: any + align_to_grid?: boolean + links_ontop?: boolean } export interface GroupNodeWorkflowData { @@ -1230,7 +1230,7 @@ export class LGraph } /** @todo Clean up - never implemented. */ - triggerInput(name: string, value: any): void { + triggerInput(name: string, value: unknown): void { const nodes = this.findNodesByTitle(name) for (const node of nodes) { // @ts-expect-error - onTrigger method may not exist on all node types @@ -1239,7 +1239,7 @@ export class LGraph } /** @todo Clean up - never implemented. */ - setCallback(name: string, func: any): void { + setCallback(name: string, func?: () => void): void { const nodes = this.findNodesByTitle(name) for (const node of nodes) { // @ts-expect-error - setTrigger method may not exist on all node types diff --git a/src/lib/litegraph/src/LGraphCanvas.ts b/src/lib/litegraph/src/LGraphCanvas.ts index 7e613c47c..3e09ba5fd 100644 --- a/src/lib/litegraph/src/LGraphCanvas.ts +++ b/src/lib/litegraph/src/LGraphCanvas.ts @@ -224,12 +224,12 @@ interface IPasteFromClipboardOptions { } interface ICreatePanelOptions { - closable?: any - window?: any + closable?: boolean + window?: Window onOpen?: () => void onClose?: () => void - width?: any - height?: any + width?: number | string + height?: number | string } const cursors = { @@ -495,10 +495,10 @@ export class LGraphCanvas implements CustomEventDispatcher } options: { - skip_events?: any - viewport?: any - skip_render?: any - autoresize?: any + skip_events?: boolean + viewport?: Rect + skip_render?: boolean + autoresize?: boolean } background_image: string @@ -584,13 +584,27 @@ export class LGraphCanvas implements CustomEventDispatcher /** @deprecated LEGACY: REMOVE THIS, USE {@link graph_mouse} INSTEAD */ canvas_mouse: Point /** to personalize the search box */ - onSearchBox?: (helper: Element, str: string, canvas: LGraphCanvas) => any - onSearchBoxSelection?: (name: any, event: any, canvas: LGraphCanvas) => void + onSearchBox?: ( + helper: HTMLDivElement, + str: string, + canvas: LGraphCanvas + ) => string[] | undefined + onSearchBoxSelection?: ( + name: string, + event: MouseEvent, + canvas: LGraphCanvas + ) => void onMouse?: (e: CanvasPointerEvent) => boolean /** to render background objects (behind nodes and connections) in the canvas affected by transform */ - onDrawBackground?: (ctx: CanvasRenderingContext2D, visible_area: any) => void + onDrawBackground?: ( + ctx: CanvasRenderingContext2D, + visible_area: Rectangle + ) => void /** to render foreground objects (above nodes and connections) in the canvas affected by transform */ - onDrawForeground?: (arg0: CanvasRenderingContext2D, arg1: any) => void + onDrawForeground?: ( + ctx: CanvasRenderingContext2D, + visible_area: Rectangle + ) => void connections_width: number /** The current node being drawn by {@link drawNode}. This should NOT be used to determine the currently selected node. See {@link selectedItems} */ current_node: LGraphNode | null @@ -931,7 +945,7 @@ export class LGraphCanvas implements CustomEventDispatcher this.connecting_links = null // to constraint render area to a portion of the canvas - this.viewport = options.viewport || null + this.viewport = options.viewport // link canvas and graph this.graph = graph @@ -963,7 +977,7 @@ export class LGraphCanvas implements CustomEventDispatcher this.startRendering() } - this.autoresize = options.autoresize + this.autoresize = options.autoresize ?? false this.updateLowQualityThreshold() } @@ -6668,8 +6682,8 @@ export class LGraphCanvas implements CustomEventDispatcher // refactor: there are different dialogs, some uses createDialog some dont prompt( title: string, - value: any, - callback: (arg0: any) => void, + value: string | number, + callback: (value: string) => void, event: CanvasPointerEvent, multiline?: boolean ): HTMLDivElement { @@ -6746,7 +6760,7 @@ export class LGraphCanvas implements CustomEventDispatcher dialog.querySelector('.value') if (!value_element) throw new TypeError('value_element was null') - value_element.value = value + value_element.value = String(value) value_element.select() const input = value_element @@ -8119,10 +8133,10 @@ export class LGraphCanvas implements CustomEventDispatcher { content: 'Properties Panel', callback: function ( - _item: any, - _options: any, - _e: any, - _menu: any, + _item: Positionable, + _options: IContextMenuOptions | undefined, + _e: MouseEvent | undefined, + _menu: ContextMenu | undefined, node: LGraphNode ) { LGraphCanvas.active_canvas.showShowNodePanel(node) diff --git a/src/lib/litegraph/src/LGraphNode.ts b/src/lib/litegraph/src/LGraphNode.ts index 27559e021..0ca41a732 100644 --- a/src/lib/litegraph/src/LGraphNode.ts +++ b/src/lib/litegraph/src/LGraphNode.ts @@ -579,11 +579,11 @@ export class LGraphNode onInputAdded?(this: LGraphNode, input: INodeInputSlot): void onOutputAdded?(this: LGraphNode, output: INodeOutputSlot): void onConfigure?(this: LGraphNode, serialisedNode: ISerialisedNode): void - onSerialize?(this: LGraphNode, serialised: ISerialisedNode): any + onSerialize?(this: LGraphNode, serialised: ISerialisedNode): void onExecute?( this: LGraphNode, param?: unknown, - options?: { action_call?: any } + options?: { action_call?: string } ): void onAction?( this: LGraphNode, @@ -655,10 +655,10 @@ export class LGraphNode onDropData?( this: LGraphNode, data: string | ArrayBuffer, - filename: any, - file: any + filename: string, + file: File ): void - onDropFile?(this: LGraphNode, file: any): void + onDropFile?(this: LGraphNode, file: File): void onInputClick?(this: LGraphNode, index: number, e: CanvasPointerEvent): void onInputDblClick?(this: LGraphNode, index: number, e: CanvasPointerEvent): void onOutputClick?(this: LGraphNode, index: number, e: CanvasPointerEvent): void @@ -730,7 +730,7 @@ export class LGraphNode title_height: number, size: Size, scale: number, - fgcolor: any + fgcolor: string ): void onRemoved?(this: LGraphNode): void onMouseMove?( @@ -1301,7 +1301,7 @@ export class LGraphNode return trigS } - onAfterExecuteNode(param: unknown, options?: { action_call?: any }) { + onAfterExecuteNode(param: unknown, options?: { action_call?: string }) { const trigS = this.findOutputSlot('onExecuted') if (trigS != -1) { this.triggerSlot(trigS, param, null, options) @@ -1339,7 +1339,7 @@ export class LGraphNode /** * Triggers the node code execution, place a boolean/counter to mark the node as being executed */ - doExecute(param?: unknown, options?: { action_call?: any }): void { + doExecute(param?: unknown, options?: { action_call?: string }): void { options = options || {} if (this.onExecute) { // enable this to give the event an ID @@ -1405,7 +1405,7 @@ export class LGraphNode trigger( action: string, param: unknown, - options: { action_call?: any } + options: { action_call?: string } ): void { const { outputs } = this if (!outputs || !outputs.length) { @@ -1435,7 +1435,7 @@ export class LGraphNode slot: number, param: unknown, link_id: number | null, - options?: { action_call?: any } + options?: { action_call?: string } ): void { options = options || {} if (!this.outputs) return