@babylonjs/shared-ui-components 5.28.0 → 5.30.0

package/nodeGraphSystem/frameNodePort.d.ts

@@ -1,25 +1,25 @@
-import type { IDisplayManager } from "./interfaces/displayManager";
-import { Observable } from "@babylonjs/core/Misc/observable.js";
-import type { Nullable } from "@babylonjs/core/types.js";
-import type { IPortData } from "./interfaces/portData";
-import { NodePort } from "./nodePort";
-import type { GraphNode } from "./graphNode";
-import type { FramePortPosition } from "./graphFrame";
-import type { StateManager } from "./stateManager";
-export declare class FrameNodePort extends NodePort {
-    portData: IPortData;
-    node: GraphNode;
-    private _parentFrameId;
-    private _isInput;
-    private _framePortPosition;
-    private _framePortId;
-    private _onFramePortPositionChangedObservable;
-    get parentFrameId(): number;
-    get onFramePortPositionChangedObservable(): Observable<FrameNodePort>;
-    get isInput(): boolean;
-    get framePortId(): number;
-    get framePortPosition(): FramePortPosition;
-    set framePortPosition(position: FramePortPosition);
-    constructor(portContainer: HTMLElement, portData: IPortData, node: GraphNode, stateManager: StateManager, isInput: boolean, framePortId: number, parentFrameId: number);
-    static CreateFrameNodePortElement(portData: IPortData, node: GraphNode, root: HTMLElement, displayManager: Nullable<IDisplayManager>, stateManager: StateManager, isInput: boolean, framePortId: number, parentFrameId: number): FrameNodePort;
-}
+import type { IDisplayManager } from "./interfaces/displayManager";
+import { Observable } from "@babylonjs/core/Misc/observable.js";
+import type { Nullable } from "@babylonjs/core/types.js";
+import type { IPortData } from "./interfaces/portData";
+import { NodePort } from "./nodePort";
+import type { GraphNode } from "./graphNode";
+import type { FramePortPosition } from "./graphFrame";
+import type { StateManager } from "./stateManager";
+export declare class FrameNodePort extends NodePort {
+    portData: IPortData;
+    node: GraphNode;
+    private _parentFrameId;
+    private _isInput;
+    private _framePortPosition;
+    private _framePortId;
+    private _onFramePortPositionChangedObservable;
+    get parentFrameId(): number;
+    get onFramePortPositionChangedObservable(): Observable<FrameNodePort>;
+    get isInput(): boolean;
+    get framePortId(): number;
+    get framePortPosition(): FramePortPosition;
+    set framePortPosition(position: FramePortPosition);
+    constructor(portContainer: HTMLElement, portData: IPortData, node: GraphNode, stateManager: StateManager, isInput: boolean, framePortId: number, parentFrameId: number);
+    static CreateFrameNodePortElement(portData: IPortData, node: GraphNode, root: HTMLElement, displayManager: Nullable<IDisplayManager>, stateManager: StateManager, isInput: boolean, framePortId: number, parentFrameId: number): FrameNodePort;
+}

package/nodeGraphSystem/frameNodePort.js

@@ -1,60 +1,60 @@
-import { Observable } from "@babylonjs/core/Misc/observable.js";
-import { NodePort } from "./nodePort.js";
-import { IsFramePortData } from "./tools.js";
-import commonStyles from "./common.modules.scss";
-export class FrameNodePort extends NodePort {
-    constructor(portContainer, portData, node, stateManager, isInput, framePortId, parentFrameId) {
-        super(portContainer, portData, node, stateManager);
-        this.portData = portData;
-        this.node = node;
-        this._onFramePortPositionChangedObservable = new Observable();
-        this._parentFrameId = parentFrameId;
-        this._isInput = isInput;
-        this._framePortId = framePortId;
-        this._onSelectionChangedObserver = stateManager.onSelectionChangedObservable.add((options) => {
-            const { selection } = options || {};
-            if (IsFramePortData(selection) && selection.port === this) {
-                this._img.classList.add(commonStyles["selected"]);
-            }
-            else {
-                this._img.classList.remove(commonStyles["selected"]);
-            }
-        });
-        this.refresh();
-    }
-    get parentFrameId() {
-        return this._parentFrameId;
-    }
-    get onFramePortPositionChangedObservable() {
-        return this._onFramePortPositionChangedObservable;
-    }
-    get isInput() {
-        return this._isInput;
-    }
-    get framePortId() {
-        return this._framePortId;
-    }
-    get framePortPosition() {
-        return this._framePortPosition;
-    }
-    set framePortPosition(position) {
-        this._framePortPosition = position;
-        this.onFramePortPositionChangedObservable.notifyObservers(this);
-    }
-    static CreateFrameNodePortElement(portData, node, root, displayManager, stateManager, isInput, framePortId, parentFrameId) {
-        const portContainer = root.ownerDocument.createElement("div");
-        portContainer.classList.add(commonStyles["portLine"]);
-        if (framePortId !== null) {
-            portContainer.dataset.framePortId = `${framePortId}`;
-        }
-        root.appendChild(portContainer);
-        if (!displayManager || displayManager.shouldDisplayPortLabels(portData)) {
-            const portLabel = root.ownerDocument.createElement("div");
-            portLabel.classList.add(commonStyles["port-label"]);
-            portLabel.innerHTML = portData.name;
-            portContainer.appendChild(portLabel);
-        }
-        return new FrameNodePort(portContainer, portData, node, stateManager, isInput, framePortId, parentFrameId);
-    }
-}
+import { Observable } from "@babylonjs/core/Misc/observable.js";
+import { NodePort } from "./nodePort.js";
+import { IsFramePortData } from "./tools.js";
+import commonStyles from "./common.modules.scss";
+export class FrameNodePort extends NodePort {
+    constructor(portContainer, portData, node, stateManager, isInput, framePortId, parentFrameId) {
+        super(portContainer, portData, node, stateManager);
+        this.portData = portData;
+        this.node = node;
+        this._onFramePortPositionChangedObservable = new Observable();
+        this._parentFrameId = parentFrameId;
+        this._isInput = isInput;
+        this._framePortId = framePortId;
+        this._onSelectionChangedObserver = stateManager.onSelectionChangedObservable.add((options) => {
+            const { selection } = options || {};
+            if (IsFramePortData(selection) && selection.port === this) {
+                this._img.classList.add(commonStyles["selected"]);
+            }
+            else {
+                this._img.classList.remove(commonStyles["selected"]);
+            }
+        });
+        this.refresh();
+    }
+    get parentFrameId() {
+        return this._parentFrameId;
+    }
+    get onFramePortPositionChangedObservable() {
+        return this._onFramePortPositionChangedObservable;
+    }
+    get isInput() {
+        return this._isInput;
+    }
+    get framePortId() {
+        return this._framePortId;
+    }
+    get framePortPosition() {
+        return this._framePortPosition;
+    }
+    set framePortPosition(position) {
+        this._framePortPosition = position;
+        this.onFramePortPositionChangedObservable.notifyObservers(this);
+    }
+    static CreateFrameNodePortElement(portData, node, root, displayManager, stateManager, isInput, framePortId, parentFrameId) {
+        const portContainer = root.ownerDocument.createElement("div");
+        portContainer.classList.add(commonStyles["portLine"]);
+        if (framePortId !== null) {
+            portContainer.dataset.framePortId = `${framePortId}`;
+        }
+        root.appendChild(portContainer);
+        if (!displayManager || displayManager.shouldDisplayPortLabels(portData)) {
+            const portLabel = root.ownerDocument.createElement("div");
+            portLabel.classList.add(commonStyles["port-label"]);
+            portLabel.innerHTML = portData.name;
+            portContainer.appendChild(portLabel);
+        }
+        return new FrameNodePort(portContainer, portData, node, stateManager, isInput, framePortId, parentFrameId);
+    }
+}
 //# sourceMappingURL=frameNodePort.js.map

package/nodeGraphSystem/graphCanvas.d.ts

@@ -1,111 +1,117 @@
-import * as React from "react";
-import { GraphNode } from "./graphNode";
-import type { Nullable } from "@babylonjs/core/types.js";
-import { NodeLink } from "./nodeLink";
-import { NodePort } from "./nodePort";
-import { GraphFrame } from "./graphFrame";
-import type { IEditorData, IFrameData } from "./interfaces/nodeLocationInfo";
-import type { StateManager } from "./stateManager";
-import type { INodeData } from "./interfaces/nodeData";
-import type { IPortData } from "./interfaces/portData";
-import type { INodeContainer } from "./interfaces/nodeContainer";
-export interface IGraphCanvasComponentProps {
-    stateManager: StateManager;
-    onEmitNewNode: (nodeData: INodeData) => GraphNode;
-}
-export declare class GraphCanvasComponent extends React.Component<IGraphCanvasComponentProps> implements INodeContainer {
-    static readonly NodeWidth = 100;
-    private readonly _minZoom;
-    private readonly _maxZoom;
-    private _hostCanvas;
-    private _graphCanvas;
-    private _selectionContainer;
-    private _frameContainer;
-    private _svgCanvas;
-    private _rootContainer;
-    private _nodes;
-    private _links;
-    private _mouseStartPointX;
-    private _mouseStartPointY;
-    private _dropPointX;
-    private _dropPointY;
-    private _selectionStartX;
-    private _selectionStartY;
-    private _candidateLinkedHasMoved;
-    private _x;
-    private _y;
-    private _zoom;
-    private _selectedNodes;
-    private _selectedLink;
-    private _selectedPort;
-    private _candidateLink;
-    private _candidatePort;
-    private _gridSize;
-    private _selectionBox;
-    private _selectedFrames;
-    private _frameCandidate;
-    private _frames;
-    private _nodeDataContentList;
-    private _altKeyIsPressed;
-    private _multiKeyIsPressed;
-    private _oldY;
-    _frameIsMoving: boolean;
-    _isLoading: boolean;
-    _targetLinkCandidate: Nullable<NodeLink>;
-    private _copiedNodes;
-    private _copiedFrames;
-    get gridSize(): number;
-    set gridSize(value: number);
-    get stateManager(): StateManager;
-    get nodes(): GraphNode[];
-    get links(): NodeLink[];
-    get frames(): GraphFrame[];
-    get zoom(): number;
-    set zoom(value: number);
-    get x(): number;
-    set x(value: number);
-    get y(): number;
-    set y(value: number);
-    get selectedNodes(): GraphNode[];
-    get selectedLink(): Nullable<NodeLink>;
-    get selectedFrames(): GraphFrame[];
-    get selectedPort(): Nullable<NodePort>;
-    get canvasContainer(): HTMLDivElement;
-    get hostCanvas(): HTMLDivElement;
-    get svgCanvas(): HTMLElement;
-    get selectionContainer(): HTMLDivElement;
-    get frameContainer(): HTMLDivElement;
-    private _selectedFrameAndNodesConflict;
-    constructor(props: IGraphCanvasComponentProps);
-    populateConnectedEntriesBeforeRemoval(item: GraphNode, items: GraphNode[], inputs: Nullable<IPortData>[], outputs: Nullable<IPortData>[]): void;
-    automaticRewire(inputs: Nullable<IPortData>[], outputs: Nullable<IPortData>[], firstOnly?: boolean): void;
-    handleKeyDown(evt: KeyboardEvent, onRemove: (nodeData: INodeData) => void, mouseLocationX: number, mouseLocationY: number, dataGenerator: (nodeData: INodeData) => any, rootElement: HTMLDivElement): void;
-    pasteSelection(copiedNodes: GraphNode[], currentX: number, currentY: number, dataGenerator: (nodeData: INodeData) => any, selectNew?: boolean): GraphNode[];
-    reconnectNewNodes(nodeIndex: number, newNodes: GraphNode[], sourceNodes: GraphNode[], done: boolean[]): void;
-    getCachedData(): any[];
-    removeDataFromCache(data: any): void;
-    createNodeFromObject(nodeData: INodeData, onNodeCreated: (data: any) => void, recursion?: boolean): GraphNode;
-    getGridPosition(position: number, useCeil?: boolean): number;
-    getGridPositionCeil(position: number): number;
-    updateTransform(): void;
-    onKeyUp(): void;
-    findNodeFromData(data: any): GraphNode;
-    reset(): void;
-    connectPorts(pointA: IPortData, pointB: IPortData): void;
-    removeLink(link: NodeLink): void;
-    appendNode(nodeData: INodeData): GraphNode;
-    distributeGraph(): void;
-    componentDidMount(): void;
-    onMove(evt: React.PointerEvent): void;
-    onDown(evt: React.PointerEvent<HTMLElement>): void;
-    onUp(evt: React.PointerEvent): void;
-    onWheel(evt: React.WheelEvent): void;
-    zoomToFit(): void;
-    processCandidatePort(): void;
-    connectNodes(nodeA: GraphNode, pointA: IPortData, nodeB: GraphNode, pointB: IPortData): void;
-    drop(newNode: GraphNode, targetX: number, targetY: number, offsetX: number, offsetY: number): void;
-    processEditorData(editorData: IEditorData): void;
-    reOrganize(editorData?: Nullable<IEditorData>, isImportingAFrame?: boolean): void;
-    addFrame(frameData: IFrameData): void;
-    render(): JSX.Element;
-}
+import * as React from "react";
+import { GraphNode } from "./graphNode";
+import type { Nullable } from "@babylonjs/core/types.js";
+import { NodeLink } from "./nodeLink";
+import { NodePort } from "./nodePort";
+import { GraphFrame } from "./graphFrame";
+import type { IEditorData, IFrameData } from "./interfaces/nodeLocationInfo";
+import type { StateManager } from "./stateManager";
+import type { INodeData } from "./interfaces/nodeData";
+import type { IPortData } from "./interfaces/portData";
+import type { INodeContainer } from "./interfaces/nodeContainer";
+export interface IGraphCanvasComponentProps {
+    stateManager: StateManager;
+    onEmitNewNode: (nodeData: INodeData) => GraphNode;
+}
+export declare class GraphCanvasComponent extends React.Component<IGraphCanvasComponentProps> implements INodeContainer {
+    static readonly NodeWidth = 100;
+    private readonly _minZoom;
+    private readonly _maxZoom;
+    private _hostCanvasRef;
+    private _hostCanvas;
+    private _graphCanvasRef;
+    private _graphCanvas;
+    private _selectionContainerRef;
+    private _selectionContainer;
+    private _frameContainerRef;
+    private _frameContainer;
+    private _svgCanvasRef;
+    private _svgCanvas;
+    private _rootContainerRef;
+    private _rootContainer;
+    private _nodes;
+    private _links;
+    private _mouseStartPointX;
+    private _mouseStartPointY;
+    private _dropPointX;
+    private _dropPointY;
+    private _selectionStartX;
+    private _selectionStartY;
+    private _candidateLinkedHasMoved;
+    private _x;
+    private _y;
+    private _zoom;
+    private _selectedNodes;
+    private _selectedLink;
+    private _selectedPort;
+    private _candidateLink;
+    private _candidatePort;
+    private _gridSize;
+    private _selectionBox;
+    private _selectedFrames;
+    private _frameCandidate;
+    private _frames;
+    private _nodeDataContentList;
+    private _altKeyIsPressed;
+    private _multiKeyIsPressed;
+    private _oldY;
+    _frameIsMoving: boolean;
+    _isLoading: boolean;
+    _targetLinkCandidate: Nullable<NodeLink>;
+    private _copiedNodes;
+    private _copiedFrames;
+    get gridSize(): number;
+    set gridSize(value: number);
+    get stateManager(): StateManager;
+    get nodes(): GraphNode[];
+    get links(): NodeLink[];
+    get frames(): GraphFrame[];
+    get zoom(): number;
+    set zoom(value: number);
+    get x(): number;
+    set x(value: number);
+    get y(): number;
+    set y(value: number);
+    get selectedNodes(): GraphNode[];
+    get selectedLink(): Nullable<NodeLink>;
+    get selectedFrames(): GraphFrame[];
+    get selectedPort(): Nullable<NodePort>;
+    get canvasContainer(): HTMLDivElement;
+    get hostCanvas(): HTMLDivElement;
+    get svgCanvas(): HTMLElement;
+    get selectionContainer(): HTMLDivElement;
+    get frameContainer(): HTMLDivElement;
+    private _selectedFrameAndNodesConflict;
+    constructor(props: IGraphCanvasComponentProps);
+    populateConnectedEntriesBeforeRemoval(item: GraphNode, items: GraphNode[], inputs: Nullable<IPortData>[], outputs: Nullable<IPortData>[]): void;
+    automaticRewire(inputs: Nullable<IPortData>[], outputs: Nullable<IPortData>[], firstOnly?: boolean): void;
+    handleKeyDown(evt: KeyboardEvent, onRemove: (nodeData: INodeData) => void, mouseLocationX: number, mouseLocationY: number, dataGenerator: (nodeData: INodeData) => any, rootElement: HTMLDivElement): void;
+    pasteSelection(copiedNodes: GraphNode[], currentX: number, currentY: number, dataGenerator: (nodeData: INodeData) => any, selectNew?: boolean): GraphNode[];
+    reconnectNewNodes(nodeIndex: number, newNodes: GraphNode[], sourceNodes: GraphNode[], done: boolean[]): void;
+    getCachedData(): any[];
+    removeDataFromCache(data: any): void;
+    createNodeFromObject(nodeData: INodeData, onNodeCreated: (data: any) => void, recursion?: boolean): GraphNode;
+    getGridPosition(position: number, useCeil?: boolean): number;
+    getGridPositionCeil(position: number): number;
+    updateTransform(): void;
+    onKeyUp(): void;
+    findNodeFromData(data: any): GraphNode;
+    reset(): void;
+    connectPorts(pointA: IPortData, pointB: IPortData): void;
+    removeLink(link: NodeLink): void;
+    appendNode(nodeData: INodeData): GraphNode;
+    distributeGraph(): void;
+    componentDidMount(): void;
+    onMove(evt: React.PointerEvent): void;
+    onDown(evt: React.PointerEvent<HTMLElement>): void;
+    onUp(evt: React.PointerEvent): void;
+    onWheel(evt: React.WheelEvent): void;
+    zoomToFit(): void;
+    processCandidatePort(): void;
+    connectNodes(nodeA: GraphNode, pointA: IPortData, nodeB: GraphNode, pointB: IPortData): void;
+    drop(newNode: GraphNode, targetX: number, targetY: number, offsetX: number, offsetY: number): void;
+    processEditorData(editorData: IEditorData): void;
+    reOrganize(editorData?: Nullable<IEditorData>, isImportingAFrame?: boolean): void;
+    addFrame(frameData: IFrameData): void;
+    render(): JSX.Element;
+}