Global modal system

src/lib/stores/layoutStates.ts

@@ -428,6 +428,38 @@ const ALL_ATTRIBUTES: AttributesSpecList = [
                 defaultValue: "gallery",
                 refreshPanelOnChange: true
             },
+
+            // Text
+            {
+                name: "multiline",
+                type: "boolean",
+                location: "nodeProps",
+                editable: true,
+                validNodeTypes: ["ui/text"],
+                defaultValue: false
+            },
+            {
+                name: "lines",
+                type: "number",
+                location: "nodeProps",
+                editable: true,
+                validNodeTypes: ["ui/text"],
+                defaultValue: 5,
+                min: 1,
+                max: 100,
+                step: 1
+            },
+            {
+                name: "maxLines",
+                type: "number",
+                location: "nodeProps",
+                editable: true,
+                validNodeTypes: ["ui/text"],
+                defaultValue: 5,
+                min: 1,
+                max: 100,
+                step: 1
+            },
         ]
     },
     {

src/lib/stores/modalState.ts

@@ -0,0 +1,66 @@
+import type { SvelteComponentDev } from "svelte/internal";
+import { writable, type Writable } from "svelte/store";
+import { v4 as uuidv4 } from "uuid";
+
+export type ModalButton = {
+    name: string,
+    variant: "primary" | "secondary",
+    onClick: () => void
+}
+export interface ModalData {
+    id: string,
+    title: string,
+    onClose?: () => void,
+    svelteComponent?: typeof SvelteComponentDev,
+    svelteProps?: Record<string, any>,
+    buttons?: ModalButton[],
+    showCloseButton?: boolean
+}
+export interface ModalState {
+    activeModals: ModalData[]
+}
+
+export interface ModalStateOps {
+    pushModal: (data: Partial<ModalData>) => void,
+    closeModal: (id: string) => void,
+    closeAllModals: () => void,
+}
+
+export type WritableModalStateStore = Writable<ModalState> & ModalStateOps;
+const store: Writable<ModalState> = writable(
+    {
+        activeModals: []
+    })
+
+function pushModal(data: Partial<ModalData>) {
+    const modal: ModalData = {
+        title: "Modal",
+        ...data,
+        id: uuidv4(),
+    }
+
+    store.update(s => {
+        s.activeModals.push(modal);
+        return s;
+    })
+}
+
+function closeModal(id: string) {
+    store.update(s => {
+        s.activeModals = s.activeModals.filter(m => m.id !== id)
+        return s;
+    })
+}
+
+function closeAllModals() {
+    store.set({ activeModals: [] })
+}
+
+const modalStateStore: WritableModalStateStore =
+{
+    ...store,
+    pushModal,
+    closeModal,
+    closeAllModals
+}
+export default modalStateStore;

src/lib/stores/workflowState.ts

@@ -1,5 +1,5 @@
 import type { SerializedGraphCanvasState } from '$lib/ComfyGraphCanvas';
-import { clamp, LGraphNode, type LGraphCanvas, type NodeID, type SerializedLGraph, type UUID, LGraph } from '@litegraph-ts/core';
+import { clamp, LGraphNode, type LGraphCanvas, type NodeID, type SerializedLGraph, type UUID, LGraph, LiteGraph } from '@litegraph-ts/core';
 import { get, writable } from 'svelte/store';
 import type { Readable, Writable } from 'svelte/store';
 import { defaultWorkflowAttributes, type SerializedLayoutState, type WritableLayoutStateStore } from './layoutStates';
@@ -76,6 +76,11 @@ export class ComfyWorkflow {
      */
     isModified: boolean = false;
 
+    /*
+     * Missing node types encountered when deserializing the graph
+     */
+    missingNodeTypes: string[];
+
     get layout(): WritableLayoutStateStore | null {
         return layoutStates.getLayout(this.id)
     }
@@ -170,6 +175,18 @@ export class ComfyWorkflow {
     }
 
     deserialize(layoutState: WritableLayoutStateStore, data: SerializedWorkflowState) {
+        this.missingNodeTypes = []
+
+        for (let n of data.graph.nodes) {
+            // Patch T2IAdapterLoader to ControlNetLoader since they are the same node now
+            if (n.type == "T2IAdapterLoader") n.type = "ControlNetLoader";
+
+            // Find missing node types
+            if (!(n.type in LiteGraph.registered_node_types)) {
+                this.missingNodeTypes.push(n.type);
+            }
+        }
+
         // Ensure loadGraphData does not trigger any state changes in layoutState
         // (isConfiguring is set to true here)
         // lGraph.configure will add new nodes, triggering onNodeAdded, but we