@babylonjs/shared-ui-components 9.30.0 → 9.31.1

package/nodeGraphSystem/stateManager.d.ts

@@ -52,6 +52,11 @@ export declare class StateManager {
         data: any;
         active: boolean;
     }>;
+    /**
+     * Requests centering on the graph node associated with the supplied underlying block data.
+     * The current selection and zoom are preserved.
+     */
+    onFocusNodeObservable: Observable<unknown>;
     onPreviewCommandActivated: Observable<boolean>;
     exportData: (data: any, frame?: Nullable<GraphFrame>) => string;
     isElbowConnectionAllowed: (nodeA: FrameNodePort | NodePort, nodeB: FrameNodePort | NodePort) => boolean;

package/nodeGraphSystem/stateManager.js

@@ -23,6 +23,11 @@ export class StateManager {
         this.onGridSizeChanged = new Observable();
         this.onNewBlockRequiredObservable = new Observable();
         this.onHighlightNodeObservable = new Observable();
+        /**
+         * Requests centering on the graph node associated with the supplied underlying block data.
+         * The current selection and zoom are preserved.
+         */
+        this.onFocusNodeObservable = new Observable();
         this.onPreviewCommandActivated = new Observable();
     }
     queueRebuildCommand() {

package/nodeGraphSystem/stateManager.js.map

@@ -1 +1 @@
-{"version":3,"file":"stateManager.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/nodeGraphSystem/stateManager.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAalD,MAAM,OAAO,YAAY;IAAzB;QAQI,kCAA6B,GAAG,IAAI,UAAU,EAA4B,CAAC;QAC3E,iCAA4B,GAAG,IAAI,UAAU,EAAsC,CAAC;QACpF,6BAAwB,GAAG,IAAI,UAAU,EAAc,CAAC;QACxD,+BAA0B,GAAG,IAAI,UAAU,EAAiB,CAAC;QAC7D,iCAA4B,GAAG,IAAI,UAAU,EAAa,CAAC;QAC3D,wBAAmB,GAAG,IAAI,UAAU,EAAwB,CAAC;QAC7D,yBAAoB,GAAG,IAAI,UAAU,EAAqB,CAAC;QAC3D,sCAAiC,GAAG,IAAI,UAAU,EAAsC,CAAC;QACzF,qGAAqG;QACrG,4BAAuB,GAAwB,IAAI,CAAC;QACpD,sGAAsG;QACtG,qCAAgC,GAAY,KAAK,CAAC;QAClD,4FAA4F;QAC5F,qBAAgB,GAAY,KAAK,CAAC;QAClC,+BAA0B,GAAG,IAAI,UAAU,EAAa,CAAC;QACzD,gCAA2B,GAAG,IAAI,UAAU,EAAQ,CAAC;QACrD,0BAAqB,GAAG,IAAI,UAAU,EAAa,CAAC;QACpD,2CAAsC,GAAG,IAAI,UAAU,EAAU,CAAC;QAClE,kCAA6B,GAAG,IAAI,UAAU,EAAa,CAAC;QAC5D,sBAAiB,GAAG,IAAI,UAAU,EAAQ,CAAC;QAC3C,iCAA4B,GAAG,IAAI,UAAU,EAAuG,CAAC;QACrJ,8BAAyB,GAAG,IAAI,UAAU,EAAkC,CAAC;QAC7E,8BAAyB,GAAG,IAAI,UAAU,EAAW,CAAC;IA+B1D,CAAC;IAZG,mBAAmB;QACf,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,OAAO;QACX,CAAC;QAED,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;QAE7B,UAAU,CAAC,GAAG,EAAE;YACZ,IAAI,CAAC,2BAA2B,CAAC,eAAe,EAAE,CAAC;YACnD,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAClC,CAAC,EAAE,CAAC,CAAC,CAAC;IACV,CAAC;CACJ","sourcesContent":["import { type Vector2 } from \"core/Maths/math.vector\";\r\nimport { Observable } from \"core/Misc/observable\";\r\nimport { type Nullable } from \"core/types\";\r\nimport { type FrameNodePort } from \"./frameNodePort\";\r\nimport { type GraphFrame } from \"./graphFrame\";\r\nimport { type GraphNode } from \"./graphNode\";\r\nimport { type INodeContainer } from \"./interfaces/nodeContainer\";\r\nimport { type INodeData } from \"./interfaces/nodeData\";\r\nimport { type IPortData } from \"./interfaces/portData\";\r\nimport { type ISelectionChangedOptions } from \"./interfaces/selectionChangedOptions\";\r\nimport { type NodePort } from \"./nodePort\";\r\nimport { type HistoryStack } from \"../historyStack\";\r\nimport { type Scene } from \"core/scene\";\r\n\r\nexport class StateManager {\r\n    data: any;\r\n    hostDocument: Document;\r\n    lockObject: any;\r\n    modalIsDisplayed: boolean;\r\n    historyStack: HistoryStack;\r\n    activeNode: Nullable<GraphNode>;\r\n\r\n    onSearchBoxRequiredObservable = new Observable<{ x: number; y: number }>();\r\n    onSelectionChangedObservable = new Observable<Nullable<ISelectionChangedOptions>>();\r\n    onFrameCreatedObservable = new Observable<GraphFrame>();\r\n    onUpdateRequiredObservable = new Observable<Nullable<any>>();\r\n    onGraphNodeRemovalObservable = new Observable<GraphNode>();\r\n    onSelectionBoxMoved = new Observable<ClientRect | DOMRect>();\r\n    onCandidateLinkMoved = new Observable<Nullable<Vector2>>();\r\n    onCandidatePortSelectedObservable = new Observable<Nullable<NodePort | FrameNodePort>>();\r\n    /** The source port data for the current drag operation, used for design-time compatibility checks */\r\n    candidateSourcePortData: Nullable<IPortData> = null;\r\n    /** When true, ports glow red during drag when hovering over an incompatible target. Default false. */\r\n    enablePortCompatibilityHighlight: boolean = false;\r\n    /** When true, nodes can display validation and breakpoint badge overlays. Default false. */\r\n    enableNodeBadges: boolean = false;\r\n    onNewNodeCreatedObservable = new Observable<GraphNode>();\r\n    onRebuildRequiredObservable = new Observable<void>();\r\n    onNodeMovedObservable = new Observable<GraphNode>();\r\n    onErrorMessageDialogRequiredObservable = new Observable<string>();\r\n    onExposePortOnFrameObservable = new Observable<GraphNode>();\r\n    onGridSizeChanged = new Observable<void>();\r\n    onNewBlockRequiredObservable = new Observable<{ type: string; targetX: number; targetY: number; needRepositioning?: boolean; smartAdd?: boolean }>();\r\n    onHighlightNodeObservable = new Observable<{ data: any; active: boolean }>();\r\n    onPreviewCommandActivated = new Observable<boolean>();\r\n\r\n    exportData: (data: any, frame?: Nullable<GraphFrame>) => string;\r\n    isElbowConnectionAllowed: (nodeA: FrameNodePort | NodePort, nodeB: FrameNodePort | NodePort) => boolean;\r\n    isDebugConnectionAllowed: (nodeA: FrameNodePort | NodePort, nodeB: FrameNodePort | NodePort) => boolean;\r\n    applyNodePortDesign: (data: IPortData, element: HTMLElement, imgHost: HTMLImageElement, pip: HTMLDivElement) => boolean;\r\n\r\n    getPortColor: (portData: IPortData) => string;\r\n\r\n    storeEditorData: (serializationObject: any, frame?: Nullable<GraphFrame>) => void;\r\n\r\n    getEditorDataMap: () => { [key: number]: number };\r\n\r\n    getScene?: () => Scene;\r\n\r\n    createDefaultInputData: (rootData: any, portData: IPortData, nodeContainer: INodeContainer) => Nullable<{ data: INodeData; name: string }>;\r\n\r\n    private _isRebuildQueued: boolean;\r\n\r\n    queueRebuildCommand() {\r\n        if (this._isRebuildQueued) {\r\n            return;\r\n        }\r\n\r\n        this._isRebuildQueued = true;\r\n\r\n        setTimeout(() => {\r\n            this.onRebuildRequiredObservable.notifyObservers();\r\n            this._isRebuildQueued = false;\r\n        }, 1);\r\n    }\r\n}\r\n"]}
+{"version":3,"file":"stateManager.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/nodeGraphSystem/stateManager.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAalD,MAAM,OAAO,YAAY;IAAzB;QAQI,kCAA6B,GAAG,IAAI,UAAU,EAA4B,CAAC;QAC3E,iCAA4B,GAAG,IAAI,UAAU,EAAsC,CAAC;QACpF,6BAAwB,GAAG,IAAI,UAAU,EAAc,CAAC;QACxD,+BAA0B,GAAG,IAAI,UAAU,EAAiB,CAAC;QAC7D,iCAA4B,GAAG,IAAI,UAAU,EAAa,CAAC;QAC3D,wBAAmB,GAAG,IAAI,UAAU,EAAwB,CAAC;QAC7D,yBAAoB,GAAG,IAAI,UAAU,EAAqB,CAAC;QAC3D,sCAAiC,GAAG,IAAI,UAAU,EAAsC,CAAC;QACzF,qGAAqG;QACrG,4BAAuB,GAAwB,IAAI,CAAC;QACpD,sGAAsG;QACtG,qCAAgC,GAAY,KAAK,CAAC;QAClD,4FAA4F;QAC5F,qBAAgB,GAAY,KAAK,CAAC;QAClC,+BAA0B,GAAG,IAAI,UAAU,EAAa,CAAC;QACzD,gCAA2B,GAAG,IAAI,UAAU,EAAQ,CAAC;QACrD,0BAAqB,GAAG,IAAI,UAAU,EAAa,CAAC;QACpD,2CAAsC,GAAG,IAAI,UAAU,EAAU,CAAC;QAClE,kCAA6B,GAAG,IAAI,UAAU,EAAa,CAAC;QAC5D,sBAAiB,GAAG,IAAI,UAAU,EAAQ,CAAC;QAC3C,iCAA4B,GAAG,IAAI,UAAU,EAAuG,CAAC;QACrJ,8BAAyB,GAAG,IAAI,UAAU,EAAkC,CAAC;QAC7E;;;WAGG;QACH,0BAAqB,GAAG,IAAI,UAAU,EAAW,CAAC;QAClD,8BAAyB,GAAG,IAAI,UAAU,EAAW,CAAC;IA+B1D,CAAC;IAZG,mBAAmB;QACf,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,OAAO;QACX,CAAC;QAED,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;QAE7B,UAAU,CAAC,GAAG,EAAE;YACZ,IAAI,CAAC,2BAA2B,CAAC,eAAe,EAAE,CAAC;YACnD,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC;QAClC,CAAC,EAAE,CAAC,CAAC,CAAC;IACV,CAAC;CACJ","sourcesContent":["import { type Vector2 } from \"core/Maths/math.vector\";\r\nimport { Observable } from \"core/Misc/observable\";\r\nimport { type Nullable } from \"core/types\";\r\nimport { type FrameNodePort } from \"./frameNodePort\";\r\nimport { type GraphFrame } from \"./graphFrame\";\r\nimport { type GraphNode } from \"./graphNode\";\r\nimport { type INodeContainer } from \"./interfaces/nodeContainer\";\r\nimport { type INodeData } from \"./interfaces/nodeData\";\r\nimport { type IPortData } from \"./interfaces/portData\";\r\nimport { type ISelectionChangedOptions } from \"./interfaces/selectionChangedOptions\";\r\nimport { type NodePort } from \"./nodePort\";\r\nimport { type HistoryStack } from \"../historyStack\";\r\nimport { type Scene } from \"core/scene\";\r\n\r\nexport class StateManager {\r\n    data: any;\r\n    hostDocument: Document;\r\n    lockObject: any;\r\n    modalIsDisplayed: boolean;\r\n    historyStack: HistoryStack;\r\n    activeNode: Nullable<GraphNode>;\r\n\r\n    onSearchBoxRequiredObservable = new Observable<{ x: number; y: number }>();\r\n    onSelectionChangedObservable = new Observable<Nullable<ISelectionChangedOptions>>();\r\n    onFrameCreatedObservable = new Observable<GraphFrame>();\r\n    onUpdateRequiredObservable = new Observable<Nullable<any>>();\r\n    onGraphNodeRemovalObservable = new Observable<GraphNode>();\r\n    onSelectionBoxMoved = new Observable<ClientRect | DOMRect>();\r\n    onCandidateLinkMoved = new Observable<Nullable<Vector2>>();\r\n    onCandidatePortSelectedObservable = new Observable<Nullable<NodePort | FrameNodePort>>();\r\n    /** The source port data for the current drag operation, used for design-time compatibility checks */\r\n    candidateSourcePortData: Nullable<IPortData> = null;\r\n    /** When true, ports glow red during drag when hovering over an incompatible target. Default false. */\r\n    enablePortCompatibilityHighlight: boolean = false;\r\n    /** When true, nodes can display validation and breakpoint badge overlays. Default false. */\r\n    enableNodeBadges: boolean = false;\r\n    onNewNodeCreatedObservable = new Observable<GraphNode>();\r\n    onRebuildRequiredObservable = new Observable<void>();\r\n    onNodeMovedObservable = new Observable<GraphNode>();\r\n    onErrorMessageDialogRequiredObservable = new Observable<string>();\r\n    onExposePortOnFrameObservable = new Observable<GraphNode>();\r\n    onGridSizeChanged = new Observable<void>();\r\n    onNewBlockRequiredObservable = new Observable<{ type: string; targetX: number; targetY: number; needRepositioning?: boolean; smartAdd?: boolean }>();\r\n    onHighlightNodeObservable = new Observable<{ data: any; active: boolean }>();\r\n    /**\r\n     * Requests centering on the graph node associated with the supplied underlying block data.\r\n     * The current selection and zoom are preserved.\r\n     */\r\n    onFocusNodeObservable = new Observable<unknown>();\r\n    onPreviewCommandActivated = new Observable<boolean>();\r\n\r\n    exportData: (data: any, frame?: Nullable<GraphFrame>) => string;\r\n    isElbowConnectionAllowed: (nodeA: FrameNodePort | NodePort, nodeB: FrameNodePort | NodePort) => boolean;\r\n    isDebugConnectionAllowed: (nodeA: FrameNodePort | NodePort, nodeB: FrameNodePort | NodePort) => boolean;\r\n    applyNodePortDesign: (data: IPortData, element: HTMLElement, imgHost: HTMLImageElement, pip: HTMLDivElement) => boolean;\r\n\r\n    getPortColor: (portData: IPortData) => string;\r\n\r\n    storeEditorData: (serializationObject: any, frame?: Nullable<GraphFrame>) => void;\r\n\r\n    getEditorDataMap: () => { [key: number]: number };\r\n\r\n    getScene?: () => Scene;\r\n\r\n    createDefaultInputData: (rootData: any, portData: IPortData, nodeContainer: INodeContainer) => Nullable<{ data: INodeData; name: string }>;\r\n\r\n    private _isRebuildQueued: boolean;\r\n\r\n    queueRebuildCommand() {\r\n        if (this._isRebuildQueued) {\r\n            return;\r\n        }\r\n\r\n        this._isRebuildQueued = true;\r\n\r\n        setTimeout(() => {\r\n            this.onRebuildRequiredObservable.notifyObservers();\r\n            this._isRebuildQueued = false;\r\n        }, 1);\r\n    }\r\n}\r\n"]}

package/nodeGraphSystem/teleportInPropertyComponent.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import { type IPropertyComponentProps } from "./interfaces/propertyComponentProps.js";
+/**
+ * Cycles through a teleport entry's references without changing the selected node.
+ */
+export declare class TeleportInPropertyComponent extends React.Component<IPropertyComponentProps> {
+    private _lastEndpoint;
+    private _onUpdateRequiredObserver;
+    private _onRebuildRequiredObserver;
+    componentDidMount(): void;
+    componentDidUpdate(previousProps: IPropertyComponentProps): void;
+    componentWillUnmount(): void;
+    private _focusNextReference;
+    render(): React.JSX.Element;
+}

package/nodeGraphSystem/teleportInPropertyComponent.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { ButtonLineComponent } from "../lines/buttonLineComponent.js";
+/**
+ * Cycles through a teleport entry's references without changing the selected node.
+ */
+export class TeleportInPropertyComponent extends React.Component {
+    constructor() {
+        super(...arguments);
+        this._onUpdateRequiredObserver = null;
+        this._onRebuildRequiredObserver = null;
+    }
+    componentDidMount() {
+        this._onUpdateRequiredObserver = this.props.stateManager.onUpdateRequiredObservable.add(() => this.forceUpdate());
+        this._onRebuildRequiredObserver = this.props.stateManager.onRebuildRequiredObservable.add(() => this.forceUpdate());
+    }
+    componentDidUpdate(previousProps) {
+        if (previousProps.nodeData !== this.props.nodeData) {
+            this._lastEndpoint = undefined;
+        }
+    }
+    componentWillUnmount() {
+        this.props.stateManager.onUpdateRequiredObservable.remove(this._onUpdateRequiredObserver);
+        this.props.stateManager.onRebuildRequiredObservable.remove(this._onRebuildRequiredObserver);
+    }
+    _focusNextReference() {
+        const endpoints = this.props.nodeData.invisibleEndpoints;
+        if (!endpoints?.length) {
+            return;
+        }
+        const index = (endpoints.indexOf(this._lastEndpoint) + 1) % endpoints.length;
+        this._lastEndpoint = endpoints[index];
+        this.props.stateManager.onFocusNodeObservable.notifyObservers(this._lastEndpoint);
+    }
+    render() {
+        return _jsx(ButtonLineComponent, { label: "Focus next reference", isDisabled: !this.props.nodeData.invisibleEndpoints?.length, onClick: () => this._focusNextReference() });
+    }
+}
+//# sourceMappingURL=teleportInPropertyComponent.js.map

package/nodeGraphSystem/teleportInPropertyComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"teleportInPropertyComponent.js","sourceRoot":"","sources":["../../../../dev/sharedUiComponents/src/nodeGraphSystem/teleportInPropertyComponent.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAGnE;;GAEG;AACH,MAAM,OAAO,2BAA4B,SAAQ,KAAK,CAAC,SAAkC;IAAzF;;QAEY,8BAAyB,GAAgC,IAAI,CAAC;QAC9D,+BAA0B,GAA6B,IAAI,CAAC;IAgCxE,CAAC;IA9BY,iBAAiB;QACtB,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,0BAA0B,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;QAClH,IAAI,CAAC,0BAA0B,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,2BAA2B,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;IACxH,CAAC;IAEQ,kBAAkB,CAAC,aAAsC;QAC9D,IAAI,aAAa,CAAC,QAAQ,KAAK,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;YACjD,IAAI,CAAC,aAAa,GAAG,SAAS,CAAC;QACnC,CAAC;IACL,CAAC;IAEQ,oBAAoB;QACzB,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,0BAA0B,CAAC,MAAM,CAAC,IAAI,CAAC,yBAAyB,CAAC,CAAC;QAC1F,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,2BAA2B,CAAC,MAAM,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAC;IAChG,CAAC;IAEO,mBAAmB;QACvB,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,kBAAkB,CAAC;QACzD,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC;YACrB,OAAO;QACX,CAAC;QAED,MAAM,KAAK,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,GAAG,SAAS,CAAC,MAAM,CAAC;QAC7E,IAAI,CAAC,aAAa,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;QACtC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,qBAAqB,CAAC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IACtF,CAAC;IAEQ,MAAM;QACX,OAAO,KAAC,mBAAmB,IAAC,KAAK,EAAC,sBAAsB,EAAC,UAAU,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,kBAAkB,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,mBAAmB,EAAE,GAAI,CAAC;IACxK,CAAC;CACJ","sourcesContent":["import * as React from \"react\";\r\nimport { type Observer } from \"core/Misc/observable\";\r\nimport { type Nullable } from \"core/types\";\r\nimport { ButtonLineComponent } from \"../lines/buttonLineComponent\";\r\nimport { type IPropertyComponentProps } from \"./interfaces/propertyComponentProps\";\r\n\r\n/**\r\n * Cycles through a teleport entry's references without changing the selected node.\r\n */\r\nexport class TeleportInPropertyComponent extends React.Component<IPropertyComponentProps> {\r\n    private _lastEndpoint: unknown;\r\n    private _onUpdateRequiredObserver: Nullable<Observer<unknown>> = null;\r\n    private _onRebuildRequiredObserver: Nullable<Observer<void>> = null;\r\n\r\n    override componentDidMount() {\r\n        this._onUpdateRequiredObserver = this.props.stateManager.onUpdateRequiredObservable.add(() => this.forceUpdate());\r\n        this._onRebuildRequiredObserver = this.props.stateManager.onRebuildRequiredObservable.add(() => this.forceUpdate());\r\n    }\r\n\r\n    override componentDidUpdate(previousProps: IPropertyComponentProps) {\r\n        if (previousProps.nodeData !== this.props.nodeData) {\r\n            this._lastEndpoint = undefined;\r\n        }\r\n    }\r\n\r\n    override componentWillUnmount() {\r\n        this.props.stateManager.onUpdateRequiredObservable.remove(this._onUpdateRequiredObserver);\r\n        this.props.stateManager.onRebuildRequiredObservable.remove(this._onRebuildRequiredObserver);\r\n    }\r\n\r\n    private _focusNextReference() {\r\n        const endpoints = this.props.nodeData.invisibleEndpoints;\r\n        if (!endpoints?.length) {\r\n            return;\r\n        }\r\n\r\n        const index = (endpoints.indexOf(this._lastEndpoint) + 1) % endpoints.length;\r\n        this._lastEndpoint = endpoints[index];\r\n        this.props.stateManager.onFocusNodeObservable.notifyObservers(this._lastEndpoint);\r\n    }\r\n\r\n    override render() {\r\n        return <ButtonLineComponent label=\"Focus next reference\" isDisabled={!this.props.nodeData.invisibleEndpoints?.length} onClick={() => this._focusNextReference()} />;\r\n    }\r\n}\r\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@babylonjs/shared-ui-components",
-    "version": "9.30.0",
+    "version": "9.31.1",
     "main": "index.js",
     "module": "index.js",
     "types": "index.d.ts",
@@ -41,17 +41,17 @@
         "postcompile": "build-tools -c add-js-to-es6"
     },
     "devDependencies": {
-        "@babylonjs/lite": "1.27.0",
+        "@babylonjs/lite": "1.32.0",
         "@dev/build-tools": "^1.0.0",
         "@dev/shared-ui-components": "^1.0.0"
     },
     "peerDependencies": {
-        "@babylonjs/lite": "^1.27.0",
+        "@babylonjs/lite": "^1.32.0",
         "@types/dagre": "^0.7.47",
         "dagre": "^0.8.5",
         "react": "^18.2.0",
-        "react-dnd": "15.0.1",
-        "react-dnd-touch-backend": "15.0.1",
+        "react-dnd": "15.0.1 || 16.0.1",
+        "react-dnd-touch-backend": "15.0.1 || 16.0.1",
         "react-dom": "^18.2.0"
     },
     "peerDependenciesMeta": {