@babylonjs/inspector 5.0.0-alpha.62 → 5.0.0-alpha.63

package/babylon.inspector.module.d.ts

@@ -74,6 +74,8 @@ declare module "@babylonjs/inspector/components/globalState" {
         enableLightGizmo(light: Light, enable?: boolean): void;
         cameraGizmos: Array<CameraGizmo>;
         enableCameraGizmo(camera: Camera, enable?: boolean): void;
+        onSceneExplorerClosedObservable: Observable<void>;
+        onActionTabsClosedObservable: Observable<void>;
     }
 }
 declare module "@babylonjs/inspector/components/actionTabs/paneComponent" {
@@ -306,6 +308,123 @@ declare module "@babylonjs/inspector/components/graph/graphSupportingTypes" {
         Hours = 3
     }
 }
+declare module "@babylonjs/inspector/sharedUiComponents/colorPicker/colorComponentEntry" {
+    import * as React from "react";
+    export interface IColorComponentEntryProps {
+        value: number;
+        label: string;
+        max?: number;
+        min?: number;
+        onChange: (value: number) => void;
+    }
+    export class ColorComponentEntry extends React.Component<IColorComponentEntryProps> {
+        constructor(props: IColorComponentEntryProps);
+        updateValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+}
+declare module "@babylonjs/inspector/sharedUiComponents/colorPicker/hexColor" {
+    import * as React from "react";
+    export interface IHexColorProps {
+        value: string;
+        expectedLength: number;
+        onChange: (value: string) => void;
+    }
+    export class HexColor extends React.Component<IHexColorProps, {
+        hex: string;
+    }> {
+        constructor(props: IHexColorProps);
+        shouldComponentUpdate(nextProps: IHexColorProps, nextState: {
+            hex: string;
+        }): boolean;
+        updateHexValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+}
+declare module "@babylonjs/inspector/sharedUiComponents/colorPicker/colorPicker" {
+    import * as React from "react";
+    import { Color3, Color4 } from "@babylonjs/core/Maths/math.color";
+    /**
+     * Interface used to specify creation options for color picker
+     */
+    export interface IColorPickerProps {
+        color: Color3 | Color4;
+        linearhint?: boolean;
+        debugMode?: boolean;
+        onColorChanged?: (color: Color3 | Color4) => void;
+    }
+    /**
+     * Interface used to specify creation options for color picker
+     */
+    export interface IColorPickerState {
+        color: Color3;
+        alpha: number;
+    }
+    /**
+     * Class used to create a color picker
+     */
+    export class ColorPicker extends React.Component<IColorPickerProps, IColorPickerState> {
+        private _saturationRef;
+        private _hueRef;
+        private _isSaturationPointerDown;
+        private _isHuePointerDown;
+        constructor(props: IColorPickerProps);
+        shouldComponentUpdate(nextProps: IColorPickerProps, nextState: IColorPickerState): boolean;
+        onSaturationPointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
+        onSaturationPointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
+        onSaturationPointerMove(evt: React.PointerEvent<HTMLDivElement>): void;
+        onHuePointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
+        onHuePointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
+        onHuePointerMove(evt: React.PointerEvent<HTMLDivElement>): void;
+        private _evaluateSaturation;
+        private _evaluateHue;
+        componentDidUpdate(): void;
+        raiseOnColorChanged(): void;
+        render(): JSX.Element;
+    }
+}
+declare module "@babylonjs/inspector/sharedUiComponents/lines/colorPickerComponent" {
+    import * as React from "react";
+    import { Color4, Color3 } from "@babylonjs/core/Maths/math.color";
+    export interface IColorPickerComponentProps {
+        value: Color4 | Color3;
+        linearHint?: boolean;
+        onColorChanged: (newOne: string) => void;
+        icon?: string;
+        iconLabel?: string;
+        shouldPopRight?: boolean;
+    }
+    interface IColorPickerComponentState {
+        pickerEnabled: boolean;
+        color: Color3 | Color4;
+        hex: string;
+    }
+    export class ColorPickerLineComponent extends React.Component<IColorPickerComponentProps, IColorPickerComponentState> {
+        private _floatRef;
+        private _floatHostRef;
+        constructor(props: IColorPickerComponentProps);
+        syncPositions(): void;
+        shouldComponentUpdate(nextProps: IColorPickerComponentProps, nextState: IColorPickerComponentState): boolean;
+        componentDidUpdate(): void;
+        componentDidMount(): void;
+        render(): JSX.Element;
+    }
+}
+declare module "@babylonjs/inspector/components/actionTabs/tabs/performanceViewer/performanceViewerSidebarComponent" {
+    import { PerformanceViewerCollector } from "@babylonjs/core/Misc/PerformanceViewer/performanceViewerCollector";
+    interface IPerformanceViewerSidebarComponentProps {
+        collector: PerformanceViewerCollector;
+    }
+    export const PerformanceViewerSidebarComponent: (props: IPerformanceViewerSidebarComponentProps) => JSX.Element;
+}
+declare module "@babylonjs/inspector/components/actionTabs/tabs/performanceViewer/performancePlayheadButtonComponent" {
+    import { Observable } from "@babylonjs/core/Misc/observable";
+    import * as React from "react";
+    interface IPerformancePlayheadButtonProps {
+        returnToPlayhead: Observable<void>;
+    }
+    export const PerformancePlayheadButtonComponent: React.FC<IPerformancePlayheadButtonProps>;
+}
 declare module "@babylonjs/inspector/components/graph/canvasGraphService" {
     import { ICanvasGraphServiceSettings, IPerfLayoutSize } from "@babylonjs/inspector/components/graph/graphSupportingTypes";
     import { IPerfDatasets, IPerfMetadata } from "@babylonjs/core/Misc/interfaces/iPerfViewer";
@@ -550,152 +669,19 @@ declare module "@babylonjs/inspector/components/graph/canvasGraphComponent" {
     }
     export const CanvasGraphComponent: React.FC<ICanvasGraphComponentProps>;
 }
-declare module "@babylonjs/inspector/components/popupComponent" {
-    import * as React from "react";
-    interface IPopupComponentProps {
-        id: string;
-        title: string;
-        size: {
-            width: number;
-            height: number;
-        };
-        onOpen?: (window: Window) => void;
-        onClose: (window: Window) => void;
-        onResize?: () => void;
-        onKeyUp?: (evt: KeyboardEvent) => void;
-        onKeyDown?: (evt: KeyboardEvent) => void;
-    }
-    export class PopupComponent extends React.Component<IPopupComponentProps, {
-        isComponentMounted: boolean;
-        blockedByBrowser: boolean;
-    }> {
-        private _container;
-        private _window;
-        private _host;
-        constructor(props: IPopupComponentProps);
-        componentDidMount(): void;
-        openPopup(): void;
-        componentWillUnmount(): void;
-        getWindow(): Window | null;
-        render(): React.ReactPortal | null;
-    }
-}
-declare module "@babylonjs/inspector/sharedUiComponents/colorPicker/colorComponentEntry" {
-    import * as React from "react";
-    export interface IColorComponentEntryProps {
-        value: number;
-        label: string;
-        max?: number;
-        min?: number;
-        onChange: (value: number) => void;
-    }
-    export class ColorComponentEntry extends React.Component<IColorComponentEntryProps> {
-        constructor(props: IColorComponentEntryProps);
-        updateValue(valueString: string): void;
-        render(): JSX.Element;
-    }
-}
-declare module "@babylonjs/inspector/sharedUiComponents/colorPicker/hexColor" {
-    import * as React from "react";
-    export interface IHexColorProps {
-        value: string;
-        expectedLength: number;
-        onChange: (value: string) => void;
-    }
-    export class HexColor extends React.Component<IHexColorProps, {
-        hex: string;
-    }> {
-        constructor(props: IHexColorProps);
-        shouldComponentUpdate(nextProps: IHexColorProps, nextState: {
-            hex: string;
-        }): boolean;
-        updateHexValue(valueString: string): void;
-        render(): JSX.Element;
-    }
-}
-declare module "@babylonjs/inspector/sharedUiComponents/colorPicker/colorPicker" {
-    import * as React from "react";
-    import { Color3, Color4 } from "@babylonjs/core/Maths/math.color";
-    /**
-     * Interface used to specify creation options for color picker
-     */
-    export interface IColorPickerProps {
-        color: Color3 | Color4;
-        linearhint?: boolean;
-        debugMode?: boolean;
-        onColorChanged?: (color: Color3 | Color4) => void;
-    }
-    /**
-     * Interface used to specify creation options for color picker
-     */
-    export interface IColorPickerState {
-        color: Color3;
-        alpha: number;
-    }
-    /**
-     * Class used to create a color picker
-     */
-    export class ColorPicker extends React.Component<IColorPickerProps, IColorPickerState> {
-        private _saturationRef;
-        private _hueRef;
-        private _isSaturationPointerDown;
-        private _isHuePointerDown;
-        constructor(props: IColorPickerProps);
-        shouldComponentUpdate(nextProps: IColorPickerProps, nextState: IColorPickerState): boolean;
-        onSaturationPointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
-        onSaturationPointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
-        onSaturationPointerMove(evt: React.PointerEvent<HTMLDivElement>): void;
-        onHuePointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
-        onHuePointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
-        onHuePointerMove(evt: React.PointerEvent<HTMLDivElement>): void;
-        private _evaluateSaturation;
-        private _evaluateHue;
-        componentDidUpdate(): void;
-        raiseOnColorChanged(): void;
-        render(): JSX.Element;
-    }
-}
-declare module "@babylonjs/inspector/sharedUiComponents/lines/colorPickerComponent" {
+declare module "@babylonjs/inspector/components/actionTabs/tabs/performanceViewer/performanceViewerPopupComponent" {
     import * as React from "react";
-    import { Color4, Color3 } from "@babylonjs/core/Maths/math.color";
-    export interface IColorPickerComponentProps {
-        value: Color4 | Color3;
-        linearHint?: boolean;
-        onColorChanged: (newOne: string) => void;
-        icon?: string;
-        iconLabel?: string;
-        shouldPopRight?: boolean;
-    }
-    interface IColorPickerComponentState {
-        pickerEnabled: boolean;
-        color: Color3 | Color4;
-        hex: string;
-    }
-    export class ColorPickerLineComponent extends React.Component<IColorPickerComponentProps, IColorPickerComponentState> {
-        private _floatRef;
-        private _floatHostRef;
-        constructor(props: IColorPickerComponentProps);
-        syncPositions(): void;
-        shouldComponentUpdate(nextProps: IColorPickerComponentProps, nextState: IColorPickerComponentState): boolean;
-        componentDidUpdate(): void;
-        componentDidMount(): void;
-        render(): JSX.Element;
-    }
-}
-declare module "@babylonjs/inspector/components/actionTabs/tabs/performanceViewer/performanceViewerSidebarComponent" {
-    import { PerformanceViewerCollector } from "@babylonjs/core/Misc/PerformanceViewer/performanceViewerCollector";
-    interface IPerformanceViewerSidebarComponentProps {
-        collector: PerformanceViewerCollector;
-    }
-    export const PerformanceViewerSidebarComponent: (props: IPerformanceViewerSidebarComponentProps) => JSX.Element;
-}
-declare module "@babylonjs/inspector/components/actionTabs/tabs/performanceViewer/performancePlayheadButtonComponent" {
+    import { Scene } from "@babylonjs/core/scene";
     import { Observable } from "@babylonjs/core/Misc/observable";
-    import * as React from "react";
-    interface IPerformancePlayheadButtonProps {
-        returnToPlayhead: Observable<void>;
+    import { PerformanceViewerCollector } from "@babylonjs/core/Misc/PerformanceViewer/performanceViewerCollector";
+    import { IPerfLayoutSize } from "@babylonjs/inspector/components/graph/graphSupportingTypes";
+    interface IPerformanceViewerPopupComponentProps {
+        scene: Scene;
+        layoutObservable: Observable<IPerfLayoutSize>;
+        returnToLiveObservable: Observable<void>;
+        performanceCollector: PerformanceViewerCollector;
     }
-    export const PerformancePlayheadButtonComponent: React.FC<IPerformancePlayheadButtonProps>;
+    export const PerformanceViewerPopupComponent: React.FC<IPerformanceViewerPopupComponentProps>;
 }
 declare module "@babylonjs/inspector/components/actionTabs/tabs/performanceViewer/performanceViewerComponent" {
     import { Scene } from "@babylonjs/core/scene";
@@ -704,6 +690,10 @@ declare module "@babylonjs/inspector/components/actionTabs/tabs/performanceViewe
     interface IPerformanceViewerComponentProps {
         scene: Scene;
     }
+    export enum IPerfMetadataCategory {
+        Count = "Count",
+        FrameSteps = "Frame Steps Duration"
+    }
     export const PerformanceViewerComponent: React.FC<IPerformanceViewerComponentProps>;
 }
 declare module "@babylonjs/inspector/components/actionTabs/tabs/statisticsTabComponent" {
@@ -1111,6 +1101,36 @@ declare module "@babylonjs/inspector/components/actionTabs/tabs/propertyGrids/cu
         render(): JSX.Element | null;
     }
 }
+declare module "@babylonjs/inspector/components/popupComponent" {
+    import * as React from "react";
+    export interface IPopupComponentProps {
+        id: string;
+        title: string;
+        size: {
+            width: number;
+            height: number;
+        };
+        onOpen?: (window: Window) => void;
+        onClose: (window: Window) => void;
+        onResize?: (window: Window) => void;
+        onKeyUp?: (evt: KeyboardEvent) => void;
+        onKeyDown?: (evt: KeyboardEvent) => void;
+    }
+    export class PopupComponent extends React.Component<IPopupComponentProps, {
+        isComponentMounted: boolean;
+        blockedByBrowser: boolean;
+    }> {
+        private _container;
+        private _window;
+        private _host;
+        constructor(props: IPopupComponentProps);
+        componentDidMount(): void;
+        openPopup(): void;
+        componentWillUnmount(): void;
+        getWindow(): Window | null;
+        render(): React.ReactPortal | null;
+    }
+}
 declare module "@babylonjs/inspector/components/actionTabs/tabs/propertyGrids/animations/curveEditor/graph/curve" {
     import { Animation } from "@babylonjs/core/Animations/animation";
     import { AnimationKeyInterpolation } from "@babylonjs/core/Animations/animationKey";
@@ -2512,6 +2532,19 @@ declare module "@babylonjs/inspector/components/actionTabs/tabs/propertyGrids/ma
         render(): JSX.Element;
     }
 }
+declare module "@babylonjs/inspector/components/sceneExplorer/entities/gui/guiTools" {
+    import { AdvancedDynamicTexture } from "@babylonjs/gui/2D/advancedDynamicTexture";
+    /** Used to pass in the gui-editor package. */
+    export function InjectGUIEditor(guiEditorPackage: any): void;
+    /** Change the URL that the GUI editor loads from */
+    export function SetGUIEditorURL(guiEditorURL: string): void;
+    /**
+     * Opens an ADT in the GUI editor
+     * if you are in an ES6 environment, you must first call InjectGUIEditor to provide the gui-editor package
+     * If you are in a UMD environment, it will load the package from a URL
+    */
+    export function EditAdvancedDynamicTexture(adt: AdvancedDynamicTexture): Promise<void>;
+}
 declare module "@babylonjs/inspector/components/actionTabs/tabs/propertyGrids/materials/texturePropertyGridComponent" {
     import * as React from "react";
     import { Nullable } from "@babylonjs/core/types";
@@ -4832,21 +4865,32 @@ declare module "@babylonjs/inspector/components/embedHost/embedHostComponent" {
     }
 }
 declare module "@babylonjs/inspector/inspector" {
+    import * as React from "react";
     import { IInspectorOptions } from "@babylonjs/core/Debug/debugLayer";
     import { Observable } from "@babylonjs/core/Misc/observable";
     import { Scene } from "@babylonjs/core/scene";
     import { PropertyChangedEvent } from "@babylonjs/inspector/components/propertyChangedEvent";
+    import { IPopupComponentProps } from "@babylonjs/inspector/components/popupComponent";
+    export interface IPersistentPopupConfiguration {
+        props: IPopupComponentProps;
+        children: React.ReactNode;
+        closeWhenSceneExplorerCloses?: boolean;
+        closeWhenActionTabsCloses?: boolean;
+    }
     export class Inspector {
         private static _SceneExplorerHost;
         private static _ActionTabsHost;
         private static _EmbedHost;
         private static _NewCanvasContainer;
+        private static _PersistentPopupHost;
         private static _SceneExplorerWindow;
         private static _ActionTabsWindow;
         private static _EmbedHostWindow;
         private static _Scene;
         private static _OpenedPane;
         private static _OnBeforeRenderObserver;
+        private static _OnSceneExplorerClosedObserver;
+        private static _OnActionTabsClosedObserver;
         static OnSelectionChangeObservable: Observable<any>;
         static OnPropertyChangedObservable: Observable<PropertyChangedEvent>;
         private static _GlobalState;
@@ -4866,6 +4910,8 @@ declare module "@babylonjs/inspector/inspector" {
         private static _Cleanup;
         private static _RemoveElementFromDOM;
         static Hide(): void;
+        static _CreatePersistentPopup(config: IPersistentPopupConfiguration, hostElement: HTMLElement): void;
+        static _ClosePersistentPopup(): void;
     }
 }
 declare module "@babylonjs/inspector/index" {

package/package.json

@@ -4,7 +4,7 @@
     },
     "name": "@babylonjs/inspector",
     "description": "The Babylon.js inspector.",
-    "version": "5.0.0-alpha.62",
+    "version": "5.0.0-alpha.63",
     "repository": {
         "type": "git",
         "url": "https://github.com/BabylonJS/Babylon.js.git"
@@ -27,12 +27,12 @@
     ],
     "license": "Apache-2.0",
     "dependencies": {
-        "@babylonjs/core": "5.0.0-alpha.62",
-        "@babylonjs/gui": "5.0.0-alpha.62",
-        "@babylonjs/loaders": "5.0.0-alpha.62",
-        "@babylonjs/materials": "5.0.0-alpha.62",
-        "@babylonjs/serializers": "5.0.0-alpha.62",
-        "babylonjs-gltf2interface": "5.0.0-alpha.62",
+        "@babylonjs/core": "5.0.0-alpha.63",
+        "@babylonjs/gui": "5.0.0-alpha.63",
+        "@babylonjs/loaders": "5.0.0-alpha.63",
+        "@babylonjs/materials": "5.0.0-alpha.63",
+        "@babylonjs/serializers": "5.0.0-alpha.63",
+        "babylonjs-gltf2interface": "5.0.0-alpha.63",
         "tslib": "^2.3.1"
     },
     "peerDependencies": {