@babylonjs/inspector 9.1.0 → 9.2.0

package/lib/{reflectorService-CFTva2GG.js.map → reflectorService-DdPEZLjO.js.map}

@@ -1 +1 @@
-{"version":3,"file":"reflectorService-CFTva2GG.js","sources":["../../../../../../../../dev/inspector-v2/src/components/tools/reflectorTools.tsx","../../../../../../../../dev/inspector-v2/src/services/panes/tools/reflectorService.tsx"],"sourcesContent":["import { ButtonLine } from \"shared-ui-components/fluent/hoc/buttonLine\";\r\nimport { useState, useCallback, useRef, type FunctionComponent } from \"react\";\r\nimport { type Scene } from \"core/scene\";\r\nimport { TextInputPropertyLine, NumberInputPropertyLine } from \"shared-ui-components/fluent/hoc/propertyLines/inputPropertyLine\";\r\nimport { Reflector } from \"core/Misc/reflector\";\r\nimport { PlugConnectedRegular } from \"@fluentui/react-icons\";\r\n\r\nexport const ReflectorTools: FunctionComponent<{ scene: Scene }> = ({ scene }) => {\r\n    const [hostname, setHostname] = useState(\"localhost\");\r\n    const [port, setPort] = useState(1234);\r\n    const reflectorRef = useRef<Reflector | null>(null);\r\n\r\n    const connectReflector = useCallback(() => {\r\n        if (reflectorRef.current) {\r\n            reflectorRef.current.close();\r\n        }\r\n\r\n        reflectorRef.current = new Reflector(scene, hostname, port);\r\n    }, [scene, hostname, port]);\r\n\r\n    return (\r\n        <>\r\n            <TextInputPropertyLine label=\"Hostname\" value={hostname} onChange={(value) => setHostname(value)} />\r\n            <NumberInputPropertyLine label=\"Port\" value={port} onChange={(value) => setPort(value)} forceInt />\r\n            <ButtonLine label=\"Connect\" icon={PlugConnectedRegular} onClick={connectReflector} />\r\n        </>\r\n    );\r\n};\r\n","import { type ServiceDefinition } from \"../../../modularity/serviceDefinition\";\r\nimport { ToolsServiceIdentity, type IToolsService } from \"../toolsService\";\r\nimport { type IDisposable } from \"core/scene\";\r\nimport { ReflectorTools } from \"../../../components/tools/reflectorTools\";\r\n\r\nexport const ReflectorServiceDefinition: ServiceDefinition<[], [IToolsService]> = {\r\n    friendlyName: \"Reflector Tools\",\r\n    consumes: [ToolsServiceIdentity],\r\n    factory: (toolsService) => {\r\n        const contentRegistrations: IDisposable[] = [];\r\n\r\n        // Reflector content\r\n        contentRegistrations.push(\r\n            toolsService.addSectionContent({\r\n                key: \"Reflector\",\r\n                section: \"Reflector\",\r\n                component: ({ context }) => <ReflectorTools scene={context} />,\r\n            })\r\n        );\r\n\r\n        return {\r\n            dispose: () => {\r\n                contentRegistrations.forEach((registration) => registration.dispose());\r\n            },\r\n        };\r\n    },\r\n};\r\n\r\nexport default {\r\n    serviceDefinitions: [ReflectorServiceDefinition],\r\n} as const;\r\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOO,MAAM,cAAc,GAAwC,CAAC,EAAE,KAAK,EAAE,KAAI;IAC7E,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC;IACrD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC;AACtC,IAAA,MAAM,YAAY,GAAG,MAAM,CAAmB,IAAI,CAAC;AAEnD,IAAA,MAAM,gBAAgB,GAAG,WAAW,CAAC,MAAK;AACtC,QAAA,IAAI,YAAY,CAAC,OAAO,EAAE;AACtB,YAAA,YAAY,CAAC,OAAO,CAAC,KAAK,EAAE;QAChC;AAEA,QAAA,YAAY,CAAC,OAAO,GAAG,IAAI,SAAS,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC;IAC/D,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,CAAC;AAE3B,IAAA,QACIA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACIC,GAAA,CAAC,qBAAqB,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,KAAK,KAAK,WAAW,CAAC,KAAK,CAAC,EAAA,CAAI,EACpGA,GAAA,CAAC,uBAAuB,EAAA,EAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,KAAK,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,QAAQ,EAAA,IAAA,EAAA,CAAG,EACnGA,GAAA,CAAC,UAAU,EAAA,EAAC,KAAK,EAAC,SAAS,EAAC,IAAI,EAAE,oBAAoB,EAAE,OAAO,EAAE,gBAAgB,EAAA,CAAI,CAAA,EAAA,CACtF;AAEX,CAAC;;ACtBM,MAAM,0BAA0B,GAA2C;AAC9E,IAAA,YAAY,EAAE,iBAAiB;IAC/B,QAAQ,EAAE,CAAC,oBAAoB,CAAC;AAChC,IAAA,OAAO,EAAE,CAAC,YAAY,KAAI;QACtB,MAAM,oBAAoB,GAAkB,EAAE;;AAG9C,QAAA,oBAAoB,CAAC,IAAI,CACrB,YAAY,CAAC,iBAAiB,CAAC;AAC3B,YAAA,GAAG,EAAE,WAAW;AAChB,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,KAAKA,GAAA,CAAC,cAAc,EAAA,EAAC,KAAK,EAAE,OAAO,EAAA,CAAI;AACjE,SAAA,CAAC,CACL;QAED,OAAO;YACH,OAAO,EAAE,MAAK;AACV,gBAAA,oBAAoB,CAAC,OAAO,CAAC,CAAC,YAAY,KAAK,YAAY,CAAC,OAAO,EAAE,CAAC;YAC1E,CAAC;SACJ;IACL,CAAC;;AAGL,uBAAe;IACX,kBAAkB,EAAE,CAAC,0BAA0B,CAAC;CAC1C;;;;"}
+{"version":3,"file":"reflectorService-DdPEZLjO.js","sources":["../../../../../../../../dev/inspector-v2/src/components/tools/reflectorTools.tsx","../../../../../../../../dev/inspector-v2/src/services/panes/tools/reflectorService.tsx"],"sourcesContent":["import { ButtonLine } from \"shared-ui-components/fluent/hoc/buttonLine\";\r\nimport { useState, useCallback, useRef, type FunctionComponent } from \"react\";\r\nimport { type Scene } from \"core/scene\";\r\nimport { TextInputPropertyLine, NumberInputPropertyLine } from \"shared-ui-components/fluent/hoc/propertyLines/inputPropertyLine\";\r\nimport { Reflector } from \"core/Misc/reflector\";\r\nimport { PlugConnectedRegular } from \"@fluentui/react-icons\";\r\n\r\nexport const ReflectorTools: FunctionComponent<{ scene: Scene }> = ({ scene }) => {\r\n    const [hostname, setHostname] = useState(\"localhost\");\r\n    const [port, setPort] = useState(1234);\r\n    const reflectorRef = useRef<Reflector | null>(null);\r\n\r\n    const connectReflector = useCallback(() => {\r\n        if (reflectorRef.current) {\r\n            reflectorRef.current.close();\r\n        }\r\n\r\n        reflectorRef.current = new Reflector(scene, hostname, port);\r\n    }, [scene, hostname, port]);\r\n\r\n    return (\r\n        <>\r\n            <TextInputPropertyLine label=\"Hostname\" value={hostname} onChange={(value) => setHostname(value)} />\r\n            <NumberInputPropertyLine label=\"Port\" value={port} onChange={(value) => setPort(value)} forceInt />\r\n            <ButtonLine label=\"Connect\" icon={PlugConnectedRegular} onClick={connectReflector} />\r\n        </>\r\n    );\r\n};\r\n","import { type ServiceDefinition } from \"../../../modularity/serviceDefinition\";\r\nimport { ToolsServiceIdentity, type IToolsService } from \"../toolsService\";\r\nimport { type IDisposable } from \"core/scene\";\r\nimport { ReflectorTools } from \"../../../components/tools/reflectorTools\";\r\n\r\nexport const ReflectorServiceDefinition: ServiceDefinition<[], [IToolsService]> = {\r\n    friendlyName: \"Reflector Tools\",\r\n    consumes: [ToolsServiceIdentity],\r\n    factory: (toolsService) => {\r\n        const contentRegistrations: IDisposable[] = [];\r\n\r\n        // Reflector content\r\n        contentRegistrations.push(\r\n            toolsService.addSectionContent({\r\n                key: \"Reflector\",\r\n                section: \"Reflector\",\r\n                component: ({ context }) => <ReflectorTools scene={context} />,\r\n            })\r\n        );\r\n\r\n        return {\r\n            dispose: () => {\r\n                contentRegistrations.forEach((registration) => registration.dispose());\r\n            },\r\n        };\r\n    },\r\n};\r\n\r\nexport default {\r\n    serviceDefinitions: [ReflectorServiceDefinition],\r\n} as const;\r\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOO,MAAM,cAAc,GAAwC,CAAC,EAAE,KAAK,EAAE,KAAI;IAC7E,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC;IACrD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC;AACtC,IAAA,MAAM,YAAY,GAAG,MAAM,CAAmB,IAAI,CAAC;AAEnD,IAAA,MAAM,gBAAgB,GAAG,WAAW,CAAC,MAAK;AACtC,QAAA,IAAI,YAAY,CAAC,OAAO,EAAE;AACtB,YAAA,YAAY,CAAC,OAAO,CAAC,KAAK,EAAE;QAChC;AAEA,QAAA,YAAY,CAAC,OAAO,GAAG,IAAI,SAAS,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC;IAC/D,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,CAAC;AAE3B,IAAA,QACIA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACIC,GAAA,CAAC,qBAAqB,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,KAAK,KAAK,WAAW,CAAC,KAAK,CAAC,EAAA,CAAI,EACpGA,GAAA,CAAC,uBAAuB,EAAA,EAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,KAAK,KAAK,OAAO,CAAC,KAAK,CAAC,EAAE,QAAQ,EAAA,IAAA,EAAA,CAAG,EACnGA,GAAA,CAAC,UAAU,EAAA,EAAC,KAAK,EAAC,SAAS,EAAC,IAAI,EAAE,oBAAoB,EAAE,OAAO,EAAE,gBAAgB,EAAA,CAAI,CAAA,EAAA,CACtF;AAEX,CAAC;;ACtBM,MAAM,0BAA0B,GAA2C;AAC9E,IAAA,YAAY,EAAE,iBAAiB;IAC/B,QAAQ,EAAE,CAAC,oBAAoB,CAAC;AAChC,IAAA,OAAO,EAAE,CAAC,YAAY,KAAI;QACtB,MAAM,oBAAoB,GAAkB,EAAE;;AAG9C,QAAA,oBAAoB,CAAC,IAAI,CACrB,YAAY,CAAC,iBAAiB,CAAC;AAC3B,YAAA,GAAG,EAAE,WAAW;AAChB,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,KAAKA,GAAA,CAAC,cAAc,EAAA,EAAC,KAAK,EAAE,OAAO,EAAA,CAAI;AACjE,SAAA,CAAC,CACL;QAED,OAAO;YACH,OAAO,EAAE,MAAK;AACV,gBAAA,oBAAoB,CAAC,OAAO,CAAC,CAAC,YAAY,KAAK,YAAY,CAAC,OAAO,EAAE,CAAC;YAC1E,CAAC;SACJ;IACL,CAAC;;AAGL,uBAAe;IACX,kBAAkB,EAAE,CAAC,0BAA0B,CAAC;CAC1C;;;;"}

package/lib/services/cli/cliConnectionStatus.d.ts

@@ -0,0 +1,19 @@
+import { type IReadonlyObservable } from "@babylonjs/core/index.js";
+import { type IService } from "../../modularity/serviceDefinition";
+/**
+ * The service identity for the CLI connection status.
+ */
+export declare const CliConnectionStatusIdentity: unique symbol;
+/**
+ * Provides the connection status of the Inspector CLI bridge.
+ */
+export interface ICliConnectionStatus extends IService<typeof CliConnectionStatusIdentity> {
+    /**
+     * Whether the bridge WebSocket is currently connected.
+     */
+    readonly isConnected: boolean;
+    /**
+     * Observable that fires when the connection status changes.
+     */
+    readonly onConnectionStatusChanged: IReadonlyObservable<boolean>;
+}

package/lib/services/cli/entityQueryService.d.ts

@@ -0,0 +1,8 @@
+import { type ServiceDefinition } from "../../modularity/serviceDefinition";
+import { type ISceneContext } from "../sceneContext";
+import { type IInspectableCommandRegistry } from "./inspectableCommandRegistry";
+/**
+ * Service that registers CLI commands for querying scene entities by uniqueId.
+ * When uniqueId is omitted, returns a summary list of all entities of that type.
+ */
+export declare const EntityQueryServiceDefinition: ServiceDefinition<[], [IInspectableCommandRegistry, ISceneContext]>;

package/lib/services/cli/inspectableBridgeService.d.ts

@@ -0,0 +1,22 @@
+import { type ServiceDefinition } from "../../modularity/serviceDefinition";
+import { type ICliConnectionStatus } from "./cliConnectionStatus";
+import { type IInspectableCommandRegistry } from "./inspectableCommandRegistry";
+/**
+ * Options for the inspectable bridge service.
+ */
+export interface IInspectableBridgeServiceOptions {
+    /**
+     * The WebSocket port for the bridge's browser port.
+     */
+    port: number;
+    /**
+     * The session display name sent to the bridge.
+     */
+    name: string;
+}
+/**
+ * Creates the service definition for the InspectableBridgeService.
+ * @param options The options for connecting to the bridge.
+ * @returns A service definition that produces an IInspectableCommandRegistry.
+ */
+export declare function MakeInspectableBridgeServiceDefinition(options: IInspectableBridgeServiceOptions): ServiceDefinition<[IInspectableCommandRegistry, ICliConnectionStatus], []>;

package/lib/services/cli/inspectableCommandRegistry.d.ts

@@ -0,0 +1,58 @@
+import { type IDisposable } from "@babylonjs/core/index.js";
+import { type IService } from "../../modularity/serviceDefinition";
+/**
+ * Describes an argument for an inspectable command.
+ */
+export type InspectableCommandArg = {
+    /**
+     * The name of the argument.
+     */
+    name: string;
+    /**
+     * A description of the argument.
+     */
+    description: string;
+    /**
+     * Whether the argument is required.
+     */
+    required?: boolean;
+};
+/**
+ * Describes a command that can be invoked from the CLI.
+ */
+export type InspectableCommandDescriptor = {
+    /**
+     * A unique identifier for the command.
+     */
+    id: string;
+    /**
+     * A human-readable description of what the command does.
+     */
+    description: string;
+    /**
+     * The arguments that this command accepts.
+     */
+    args?: InspectableCommandArg[];
+    /**
+     * Executes the command with the given arguments and returns a result string.
+     * @param args A map of argument names to their values.
+     * @returns A promise that resolves to the result string.
+     */
+    executeAsync: (args: Record<string, string>) => Promise<string>;
+};
+/**
+ * The service identity for the inspectable command registry.
+ */
+export declare const InspectableCommandRegistryIdentity: unique symbol;
+/**
+ * A registry for commands that can be invoked from the Inspector CLI.
+ * @experimental
+ */
+export interface IInspectableCommandRegistry extends IService<typeof InspectableCommandRegistryIdentity> {
+    /**
+     * Registers a command that can be invoked from the Inspector CLI.
+     * @param descriptor The command descriptor.
+     * @returns A disposable token that unregisters the command when disposed.
+     */
+    addCommand(descriptor: InspectableCommandDescriptor): IDisposable;
+}

package/lib/services/cli/perfTraceCommandService.d.ts

@@ -0,0 +1,9 @@
+import { type ServiceDefinition } from "../../modularity/serviceDefinition";
+import { type ISceneContext } from "../sceneContext";
+import { type IInspectableCommandRegistry } from "./inspectableCommandRegistry";
+import "@babylonjs/core/Misc/PerformanceViewer/performanceViewerSceneExtension.js";
+/**
+ * Service that registers CLI commands for performance tracing using the PerformanceViewerCollector.
+ * start-perf-trace begins collecting data, stop-perf-trace stops and returns the collected data as JSON.
+ */
+export declare const PerfTraceCommandServiceDefinition: ServiceDefinition<[], [IInspectableCommandRegistry, ISceneContext]>;

package/lib/services/cli/screenshotCommandService.d.ts

@@ -0,0 +1,8 @@
+import { type ServiceDefinition } from "../../modularity/serviceDefinition";
+import { type ISceneContext } from "../sceneContext";
+import { type IInspectableCommandRegistry } from "./inspectableCommandRegistry";
+/**
+ * Service that registers a CLI command for capturing a screenshot of the scene.
+ * Returns the image as a base64 data string, suitable for consumption by AI agents.
+ */
+export declare const ScreenshotCommandServiceDefinition: ServiceDefinition<[], [IInspectableCommandRegistry, ISceneContext]>;

package/lib/services/cli/shaderCommandService.d.ts

@@ -0,0 +1,7 @@
+import { type ServiceDefinition } from "../../modularity/serviceDefinition";
+import { type ISceneContext } from "../sceneContext";
+import { type IInspectableCommandRegistry } from "./inspectableCommandRegistry";
+/**
+ * Service that registers a CLI command for retrieving compiled shader code from a material.
+ */
+export declare const ShaderCommandServiceDefinition: ServiceDefinition<[], [IInspectableCommandRegistry, ISceneContext]>;

package/lib/services/cli/statsCommandService.d.ts

@@ -0,0 +1,9 @@
+import { type ServiceDefinition } from "../../modularity/serviceDefinition";
+import { type ISceneContext } from "../sceneContext";
+import { type IInspectableCommandRegistry } from "./inspectableCommandRegistry";
+import "@babylonjs/core/Engines/AbstractEngine/abstractEngine.timeQuery.js";
+import "@babylonjs/core/Engines/Extensions/engine.query.js";
+/**
+ * Service that registers CLI commands for querying scene and engine statistics.
+ */
+export declare const StatsCommandServiceDefinition: ServiceDefinition<[], [IInspectableCommandRegistry, ISceneContext]>;

package/lib/services/cliConnectionStatusService.d.ts

@@ -0,0 +1,4 @@
+import { type ServiceDefinition } from "../modularity/serviceDefinition";
+import { type ICliConnectionStatus } from "./cli/cliConnectionStatus";
+import { type IShellService } from "./shellService";
+export declare const CliConnectionStatusServiceDefinition: ServiceDefinition<[], [IShellService, ICliConnectionStatus]>;

package/lib/services/defaultToolbarMetadata.d.ts

@@ -1,5 +1,6 @@
 export declare const enum DefaultToolbarItemOrder {
     FrameRate = 300,
     RefreshProperties = 200,
-    Feedback = 100
+    Feedback = 100,
+    CliStatus = 0
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@babylonjs/inspector",
-    "version": "9.1.0",
+    "version": "9.2.0",
     "main": "lib/index.js",
     "module": "lib/index.js",
     "esnext": "lib/index.js",
@@ -12,7 +12,11 @@
         },
         "./package.json": "./package.json"
     },
+    "bin": {
+        "babylon-inspector": "./bin/inspector-cli.mjs"
+    },
     "files": [
+        "bin/**/*.mjs",
         "lib/**/*.js",
         "lib/**/*.d.ts",
         "lib/**/*.map",
@@ -21,9 +25,10 @@
     ],
     "scripts": {
         "build": "npm run clean && npm run bundle",
-        "clean": "rimraf lib && rimraf dist && rimraf *.tsbuildinfo -g",
-        "bundle": "npm run bundle:lib",
+        "clean": "rimraf lib && rimraf bin && rimraf dist && rimraf *.tsbuildinfo -g",
+        "bundle": "npm run bundle:lib && npm run bundle:cli",
         "bundle:lib": "rollup -c rollup.config.lib.mjs && tsc -p tsconfig.build.dts.json && build-tools -c tp --outDir ./lib --buildType es6 --basePackage @babylonjs/inspector --appendJS",
+        "bundle:cli": "rollup -c rollup.config.cli.mjs",
         "pack": "npm run build && npm pack"
     },
     "peerDependencies": {
@@ -48,9 +53,11 @@
         "@rollup/plugin-commonjs": "^26.0.1",
         "@rollup/plugin-node-resolve": "^15.2.3",
         "@rollup/plugin-typescript": "^11.1.6",
+        "@types/ws": "^8.5.0",
         "chalk": "^5.3.0",
         "rollup": "^4.59.0",
-        "rollup-plugin-dts": "^6.1.1"
+        "rollup-plugin-dts": "^6.1.1",
+        "ws": "^8.18.0"
     },
     "keywords": [
         "3D",

package/readme.md

@@ -21,3 +21,30 @@ import { ShowInspector } from "@babylonjs/inspector";
 
 ShowInspector(scene);
 ```
+
+## Headless Inspectable (No UI)
+
+You can make a scene inspectable for the CLI without showing the Inspector UI by calling `StartInspectable`:
+
+```ts
+import { StartInspectable } from "@babylonjs/inspector";
+
+// Your code that sets up a Babylon.js scene...
+
+const token = StartInspectable(scene);
+
+// When you're done, dispose the token to disconnect:
+token.dispose();
+```
+
+`StartInspectable` connects the scene to the Inspector CLI bridge, enabling CLI commands like querying entities, taking screenshots, and capturing performance traces — all without rendering any Inspector UI. `ShowInspector` automatically calls `StartInspectable` internally.
+
+## Inspector CLI
+
+While the Inspector UI is designed for humans, the Inspector CLI is designed for AI agents. It provides machine-friendly JSON output for querying scene entities, capturing screenshots, collecting performance data, and more.
+
+To get started:
+
+```bash
+npx babylon-inspector --help
+```