Merge pull request #7624 from BabylonJS/master

Nightly

.vscode/launch.json

@@ -67,6 +67,19 @@
             ]
         },
         {
+            "name": "Launch playground (Chrome+SSL+Public address)",
+            "type": "chrome",
+            "request": "launch",
+            "url": "https://localhost:1338/Playground/index-local.html",
+            "webRoot": "${workspaceRoot}/",
+            "sourceMaps": true,
+            "preLaunchTask": "start-public-ssl",
+            "userDataDir": "${workspaceRoot}/.tempChromeProfileForDebug",
+            "runtimeArgs": [
+                "--disable-es3-apis"
+            ]
+        },
+        {
             "name": "Launch Materials Library (Chrome)",
             "type": "chrome",
             "request": "launch",

.vscode/tasks.json

@@ -69,6 +69,30 @@
                 }
             ],
             "isBackground": true
+        },
+        {
+            "label": "start-public-ssl",
+            "type": "npm",
+            "script": "start-public-ssl",
+            "path": "Tools/Gulp/",
+            "isBackground": true,
+            "problemMatcher": {
+                "owner": "typescript",
+                "fileLocation": "relative",
+                "pattern": {
+                    "regexp": "^([^\\s].*)\\((\\d+|\\,\\d+|\\d+,\\d+,\\d+,\\d+)\\):\\s+(error|warning|info)\\s+(TS\\d+)\\s*:\\s*(.*)$",
+                    "file": 1,
+                    "location": 2,
+                    "severity": 3,
+                    "code": 4,
+                    "message": 5
+                },
+                "background": {
+                    "activeOnStart": true,
+                    "beginsPattern": "Starting \\'watchCore\\'",
+                    "endsPattern": "Watching for file changes"
+                }
+            }
         }
     ]
 }

Playground/debug.html

@@ -6,6 +6,8 @@
         <meta charset='utf-8' />
         <meta name="viewport" content="width=device-width, user-scalable=no">
         <link rel="shortcut icon" href="https://www.babylonjs.com/favicon.ico">
+        <meta name="description" content="Babylon.js playground online debug">
+        <meta name="keywords" content="Babylon.js,WebGL,3D, debug">
 
         <link rel="apple-touch-icon" sizes="57x57" href="https://www.babylonjs.com/img/favicon/apple-icon-57x57.png">
         <link rel="apple-touch-icon" sizes="60x60" href="https://www.babylonjs.com/img/favicon/apple-icon-60x60.png">

Playground/index-local.html

@@ -6,6 +6,8 @@
         <meta charset='utf-8' />
         <meta name="viewport" content="width=device-width, user-scalable=no">
         <link rel="shortcut icon" href="https://www.babylonjs.com/favicon.ico">
+        <meta name="description" content="Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes">
+        <meta name="keywords" content="Babylon.js,WebGL,3D">
 
         <link rel="stylesheet" href="https://use.typekit.net/cta4xsb.css" />
         <link rel="stylesheet"

dist/preview release/babylon.d.ts

@@ -43091,23 +43091,23 @@ declare module BABYLON {
         /**
          * Thumbstick component type
          */
-        static THUMBSTICK: MotionControllerComponentType;
+        static THUMBSTICK_TYPE: MotionControllerComponentType;
         /**
          * Touchpad component type
          */
-        static TOUCHPAD: MotionControllerComponentType;
+        static TOUCHPAD_TYPE: MotionControllerComponentType;
         /**
          * trigger component type
          */
-        static TRIGGER: MotionControllerComponentType;
+        static TRIGGER_TYPE: MotionControllerComponentType;
         /**
          * squeeze component type
          */
-        static SQUEEZE: MotionControllerComponentType;
+        static SQUEEZE_TYPE: MotionControllerComponentType;
         /**
          * button component type
          */
-        static BUTTON: MotionControllerComponentType;
+        static BUTTON_TYPE: MotionControllerComponentType;
         /**
          * Observers registered here will be triggered when the state of a button changes
          * State change is either pressed / touched / value
@@ -44476,6 +44476,10 @@ declare module BABYLON {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * A module that will enable pointer selection for motion controllers of XR Input Sources
@@ -44525,7 +44529,6 @@ declare module BABYLON {
          */
         disableSelectionMeshLighting: boolean;
         private static _idCounter;
-        private _tmpRay;
         private _controllers;
         private _scene;
         /**
@@ -44555,6 +44558,13 @@ declare module BABYLON {
          * @returns the controller that correlates to this id or null if not found
          */
         getXRControllerByPointerId(id: number): Nullable<WebXRInputSource>;
+        /**
+         * Will get the mesh under a specific pointer.
+         * `scene.meshUnderPointer` will only return one mesh - either left or right.
+         * @param controllerId the controllerId to check
+         * @returns The mesh under pointer or null if no mesh is under the pointer
+         */
+        getMeshUnderPointer(controllerId: string): Nullable<AbstractMesh>;
         protected _onXRFrame(_xrFrame: XRFrame): void;
         private _attachController;
         private _attachScreenRayMode;
@@ -44765,6 +44775,20 @@ declare module BABYLON {
          */
         teleportationTargetMesh?: AbstractMesh;
         /**
+         * An array of points to which the teleportation will snap to.
+         * If the teleportation ray is in the proximity of one of those points, it will be corrected to this point.
+         */
+        snapPositions?: Vector3[];
+        /**
+         * How close should the teleportation ray be in order to snap to position.
+         * Default to 0.8 units (meters)
+         */
+        snapToPositionRadius?: number;
+        /**
+         * Should teleportation move only to snap points
+         */
+        snapPointsOnly?: boolean;
+        /**
          * Values to configure the default target mesh
          */
         defaultTargetMeshOptions?: {
@@ -44806,10 +44830,14 @@ declare module BABYLON {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * This is a teleportation feature to be used with webxr-enabled motion controllers.
-     * When enabled and attached, the feature will allow a user to move aroundand rotate in the scene using
+     * When enabled and attached, the feature will allow a user to move around and rotate in the scene using
      * the input of the attached controllers.
      */
     export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
@@ -44871,6 +44899,7 @@ declare module BABYLON {
         private _tmpRay;
         private _tmpVector;
         private _floorMeshes;
+        private _snapToPositions;
         private _controllers;
         /**
          * constructs a new anchor system
@@ -44879,6 +44908,28 @@ declare module BABYLON {
          */
         constructor(_xrSessionManager: WebXRSessionManager, _options: IWebXRTeleportationOptions);
         private _selectionFeature;
+        private _snappedToPoint;
+        private _teleportationRingMaterial?;
+        /**
+         * Get the snapPointsOnly flag
+         */
+        get snapPointsOnly(): boolean;
+        /**
+         * Sets the snapPointsOnly flag
+         * @param snapToPoints should teleportation be exclusively to snap points
+         */
+        set snapPointsOnly(snapToPoints: boolean);
+        /**
+         * Add a new snap-to point to fix teleportation to this position
+         * @param newSnapPoint The new Snap-To point
+         */
+        addSnapPoint(newSnapPoint: Vector3): void;
+        /**
+         * This function will iterate through the array, searching for this point or equal to it. It will then remove it from the snap-to array
+         * @param snapPointToRemove the point (or a clone of it) to be removed from the array
+         * @returns was the point found and removed or not
+         */
+        removeSnapPoint(snapPointToRemove: Vector3): boolean;
         /**
          * This function sets a selection feature that will be disabled when
          * the forward ray is shown and will be reattached when hidden.
@@ -44894,11 +44945,12 @@ declare module BABYLON {
         private _attachController;
         private _teleportForward;
         private _detachController;
-        private createDefaultTargetMesh;
-        private setTargetMeshVisibility;
-        private setTargetMeshPosition;
+        private _createDefaultTargetMesh;
+        private _setTargetMeshVisibility;
+        private _setTargetMeshPosition;
         private _quadraticBezierCurve;
         private _showParabolicPath;
+        private _findClosestSnapPointWithRadius;
     }
 }
 declare module BABYLON {
@@ -68529,8 +68581,9 @@ declare module BABYLON {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          */
-        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): void;
+        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): void;
         /**
          * Generates an image screenshot from the specified camera.
          * @see http://doc.babylonjs.com/how_to/render_scene_on_a_png
@@ -68546,10 +68599,11 @@ declare module BABYLON {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          * @returns screenshot as a string of base64-encoded characters. This string can be assigned
          * to the src parameter of an <img> to display it
          */
-        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): Promise<string>;
+        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): Promise<string>;
         /**
          * Gets height and width for screenshot size
          * @private

dist/preview release/babylon.module.d.ts

@@ -44600,23 +44600,23 @@ declare module "babylonjs/XR/motionController/webXRControllerComponent" {
         /**
          * Thumbstick component type
          */
-        static THUMBSTICK: MotionControllerComponentType;
+        static THUMBSTICK_TYPE: MotionControllerComponentType;
         /**
          * Touchpad component type
          */
-        static TOUCHPAD: MotionControllerComponentType;
+        static TOUCHPAD_TYPE: MotionControllerComponentType;
         /**
          * trigger component type
          */
-        static TRIGGER: MotionControllerComponentType;
+        static TRIGGER_TYPE: MotionControllerComponentType;
         /**
          * squeeze component type
          */
-        static SQUEEZE: MotionControllerComponentType;
+        static SQUEEZE_TYPE: MotionControllerComponentType;
         /**
          * button component type
          */
-        static BUTTON: MotionControllerComponentType;
+        static BUTTON_TYPE: MotionControllerComponentType;
         /**
          * Observers registered here will be triggered when the state of a button changes
          * State change is either pressed / touched / value
@@ -45990,6 +45990,7 @@ declare module "babylonjs/Rendering/utilityLayerRenderer" {
 }
 declare module "babylonjs/XR/features/WebXRControllerPointerSelection" {
     import { WebXRSessionManager } from "babylonjs/XR/webXRSessionManager";
+    import { AbstractMesh } from "babylonjs/Meshes/abstractMesh";
     import { WebXRInput } from "babylonjs/XR/webXRInput";
     import { WebXRInputSource } from "babylonjs/XR/webXRInputSource";
     import { Scene } from "babylonjs/scene";
@@ -46039,6 +46040,10 @@ declare module "babylonjs/XR/features/WebXRControllerPointerSelection" {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * A module that will enable pointer selection for motion controllers of XR Input Sources
@@ -46088,7 +46093,6 @@ declare module "babylonjs/XR/features/WebXRControllerPointerSelection" {
          */
         disableSelectionMeshLighting: boolean;
         private static _idCounter;
-        private _tmpRay;
         private _controllers;
         private _scene;
         /**
@@ -46118,6 +46122,13 @@ declare module "babylonjs/XR/features/WebXRControllerPointerSelection" {
          * @returns the controller that correlates to this id or null if not found
          */
         getXRControllerByPointerId(id: number): Nullable<WebXRInputSource>;
+        /**
+         * Will get the mesh under a specific pointer.
+         * `scene.meshUnderPointer` will only return one mesh - either left or right.
+         * @param controllerId the controllerId to check
+         * @returns The mesh under pointer or null if no mesh is under the pointer
+         */
+        getMeshUnderPointer(controllerId: string): Nullable<AbstractMesh>;
         protected _onXRFrame(_xrFrame: XRFrame): void;
         private _attachController;
         private _attachScreenRayMode;
@@ -46319,6 +46330,7 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
     import { WebXRSessionManager } from "babylonjs/XR/webXRSessionManager";
     import { WebXRInput } from "babylonjs/XR/webXRInput";
     import { AbstractMesh } from "babylonjs/Meshes/abstractMesh";
+    import { Vector3 } from "babylonjs/Maths/math.vector";
     import { Material } from "babylonjs/Materials/material";
     import { WebXRAbstractFeature } from "babylonjs/XR/features/WebXRAbstractFeature";
     import { Scene } from "babylonjs/scene";
@@ -46345,6 +46357,20 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
          */
         teleportationTargetMesh?: AbstractMesh;
         /**
+         * An array of points to which the teleportation will snap to.
+         * If the teleportation ray is in the proximity of one of those points, it will be corrected to this point.
+         */
+        snapPositions?: Vector3[];
+        /**
+         * How close should the teleportation ray be in order to snap to position.
+         * Default to 0.8 units (meters)
+         */
+        snapToPositionRadius?: number;
+        /**
+         * Should teleportation move only to snap points
+         */
+        snapPointsOnly?: boolean;
+        /**
          * Values to configure the default target mesh
          */
         defaultTargetMeshOptions?: {
@@ -46386,10 +46412,14 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * This is a teleportation feature to be used with webxr-enabled motion controllers.
-     * When enabled and attached, the feature will allow a user to move aroundand rotate in the scene using
+     * When enabled and attached, the feature will allow a user to move around and rotate in the scene using
      * the input of the attached controllers.
      */
     export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
@@ -46451,6 +46481,7 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
         private _tmpRay;
         private _tmpVector;
         private _floorMeshes;
+        private _snapToPositions;
         private _controllers;
         /**
          * constructs a new anchor system
@@ -46459,6 +46490,28 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
          */
         constructor(_xrSessionManager: WebXRSessionManager, _options: IWebXRTeleportationOptions);
         private _selectionFeature;
+        private _snappedToPoint;
+        private _teleportationRingMaterial?;
+        /**
+         * Get the snapPointsOnly flag
+         */
+        get snapPointsOnly(): boolean;
+        /**
+         * Sets the snapPointsOnly flag
+         * @param snapToPoints should teleportation be exclusively to snap points
+         */
+        set snapPointsOnly(snapToPoints: boolean);
+        /**
+         * Add a new snap-to point to fix teleportation to this position
+         * @param newSnapPoint The new Snap-To point
+         */
+        addSnapPoint(newSnapPoint: Vector3): void;
+        /**
+         * This function will iterate through the array, searching for this point or equal to it. It will then remove it from the snap-to array
+         * @param snapPointToRemove the point (or a clone of it) to be removed from the array
+         * @returns was the point found and removed or not
+         */
+        removeSnapPoint(snapPointToRemove: Vector3): boolean;
         /**
          * This function sets a selection feature that will be disabled when
          * the forward ray is shown and will be reattached when hidden.
@@ -46474,11 +46527,12 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
         private _attachController;
         private _teleportForward;
         private _detachController;
-        private createDefaultTargetMesh;
-        private setTargetMeshVisibility;
-        private setTargetMeshPosition;
+        private _createDefaultTargetMesh;
+        private _setTargetMeshVisibility;
+        private _setTargetMeshPosition;
         private _quadraticBezierCurve;
         private _showParabolicPath;
+        private _findClosestSnapPointWithRadius;
     }
 }
 declare module "babylonjs/XR/webXRDefaultExperience" {
@@ -72199,8 +72253,9 @@ declare module "babylonjs/Misc/screenshotTools" {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          */
-        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): void;
+        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): void;
         /**
          * Generates an image screenshot from the specified camera.
          * @see http://doc.babylonjs.com/how_to/render_scene_on_a_png
@@ -72216,10 +72271,11 @@ declare module "babylonjs/Misc/screenshotTools" {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          * @returns screenshot as a string of base64-encoded characters. This string can be assigned
          * to the src parameter of an <img> to display it
          */
-        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): Promise<string>;
+        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): Promise<string>;
         /**
          * Gets height and width for screenshot size
          * @private
@@ -116369,23 +116425,23 @@ declare module BABYLON {
         /**
          * Thumbstick component type
          */
-        static THUMBSTICK: MotionControllerComponentType;
+        static THUMBSTICK_TYPE: MotionControllerComponentType;
         /**
          * Touchpad component type
          */
-        static TOUCHPAD: MotionControllerComponentType;
+        static TOUCHPAD_TYPE: MotionControllerComponentType;
         /**
          * trigger component type
          */
-        static TRIGGER: MotionControllerComponentType;
+        static TRIGGER_TYPE: MotionControllerComponentType;
         /**
          * squeeze component type
          */
-        static SQUEEZE: MotionControllerComponentType;
+        static SQUEEZE_TYPE: MotionControllerComponentType;
         /**
          * button component type
          */
-        static BUTTON: MotionControllerComponentType;
+        static BUTTON_TYPE: MotionControllerComponentType;
         /**
          * Observers registered here will be triggered when the state of a button changes
          * State change is either pressed / touched / value
@@ -117754,6 +117810,10 @@ declare module BABYLON {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * A module that will enable pointer selection for motion controllers of XR Input Sources
@@ -117803,7 +117863,6 @@ declare module BABYLON {
          */
         disableSelectionMeshLighting: boolean;
         private static _idCounter;
-        private _tmpRay;
         private _controllers;
         private _scene;
         /**
@@ -117833,6 +117892,13 @@ declare module BABYLON {
          * @returns the controller that correlates to this id or null if not found
          */
         getXRControllerByPointerId(id: number): Nullable<WebXRInputSource>;
+        /**
+         * Will get the mesh under a specific pointer.
+         * `scene.meshUnderPointer` will only return one mesh - either left or right.
+         * @param controllerId the controllerId to check
+         * @returns The mesh under pointer or null if no mesh is under the pointer
+         */
+        getMeshUnderPointer(controllerId: string): Nullable<AbstractMesh>;
         protected _onXRFrame(_xrFrame: XRFrame): void;
         private _attachController;
         private _attachScreenRayMode;
@@ -118043,6 +118109,20 @@ declare module BABYLON {
          */
         teleportationTargetMesh?: AbstractMesh;
         /**
+         * An array of points to which the teleportation will snap to.
+         * If the teleportation ray is in the proximity of one of those points, it will be corrected to this point.
+         */
+        snapPositions?: Vector3[];
+        /**
+         * How close should the teleportation ray be in order to snap to position.
+         * Default to 0.8 units (meters)
+         */
+        snapToPositionRadius?: number;
+        /**
+         * Should teleportation move only to snap points
+         */
+        snapPointsOnly?: boolean;
+        /**
          * Values to configure the default target mesh
          */
         defaultTargetMeshOptions?: {
@@ -118084,10 +118164,14 @@ declare module BABYLON {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * This is a teleportation feature to be used with webxr-enabled motion controllers.
-     * When enabled and attached, the feature will allow a user to move aroundand rotate in the scene using
+     * When enabled and attached, the feature will allow a user to move around and rotate in the scene using
      * the input of the attached controllers.
      */
     export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
@@ -118149,6 +118233,7 @@ declare module BABYLON {
         private _tmpRay;
         private _tmpVector;
         private _floorMeshes;
+        private _snapToPositions;
         private _controllers;
         /**
          * constructs a new anchor system
@@ -118157,6 +118242,28 @@ declare module BABYLON {
          */
         constructor(_xrSessionManager: WebXRSessionManager, _options: IWebXRTeleportationOptions);
         private _selectionFeature;
+        private _snappedToPoint;
+        private _teleportationRingMaterial?;
+        /**
+         * Get the snapPointsOnly flag
+         */
+        get snapPointsOnly(): boolean;
+        /**
+         * Sets the snapPointsOnly flag
+         * @param snapToPoints should teleportation be exclusively to snap points
+         */
+        set snapPointsOnly(snapToPoints: boolean);
+        /**
+         * Add a new snap-to point to fix teleportation to this position
+         * @param newSnapPoint The new Snap-To point
+         */
+        addSnapPoint(newSnapPoint: Vector3): void;
+        /**
+         * This function will iterate through the array, searching for this point or equal to it. It will then remove it from the snap-to array
+         * @param snapPointToRemove the point (or a clone of it) to be removed from the array
+         * @returns was the point found and removed or not
+         */
+        removeSnapPoint(snapPointToRemove: Vector3): boolean;
         /**
          * This function sets a selection feature that will be disabled when
          * the forward ray is shown and will be reattached when hidden.
@@ -118172,11 +118279,12 @@ declare module BABYLON {
         private _attachController;
         private _teleportForward;
         private _detachController;
-        private createDefaultTargetMesh;
-        private setTargetMeshVisibility;
-        private setTargetMeshPosition;
+        private _createDefaultTargetMesh;
+        private _setTargetMeshVisibility;
+        private _setTargetMeshPosition;
         private _quadraticBezierCurve;
         private _showParabolicPath;
+        private _findClosestSnapPointWithRadius;
     }
 }
 declare module BABYLON {
@@ -141807,8 +141915,9 @@ declare module BABYLON {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          */
-        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): void;
+        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): void;
         /**
          * Generates an image screenshot from the specified camera.
          * @see http://doc.babylonjs.com/how_to/render_scene_on_a_png
@@ -141824,10 +141933,11 @@ declare module BABYLON {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          * @returns screenshot as a string of base64-encoded characters. This string can be assigned
          * to the src parameter of an <img> to display it
          */
-        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): Promise<string>;
+        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): Promise<string>;
         /**
          * Gets height and width for screenshot size
          * @private

dist/preview release/documentation.d.ts

@@ -43091,23 +43091,23 @@ declare module BABYLON {
         /**
          * Thumbstick component type
          */
-        static THUMBSTICK: MotionControllerComponentType;
+        static THUMBSTICK_TYPE: MotionControllerComponentType;
         /**
          * Touchpad component type
          */
-        static TOUCHPAD: MotionControllerComponentType;
+        static TOUCHPAD_TYPE: MotionControllerComponentType;
         /**
          * trigger component type
          */
-        static TRIGGER: MotionControllerComponentType;
+        static TRIGGER_TYPE: MotionControllerComponentType;
         /**
          * squeeze component type
          */
-        static SQUEEZE: MotionControllerComponentType;
+        static SQUEEZE_TYPE: MotionControllerComponentType;
         /**
          * button component type
          */
-        static BUTTON: MotionControllerComponentType;
+        static BUTTON_TYPE: MotionControllerComponentType;
         /**
          * Observers registered here will be triggered when the state of a button changes
          * State change is either pressed / touched / value
@@ -44476,6 +44476,10 @@ declare module BABYLON {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * A module that will enable pointer selection for motion controllers of XR Input Sources
@@ -44525,7 +44529,6 @@ declare module BABYLON {
          */
         disableSelectionMeshLighting: boolean;
         private static _idCounter;
-        private _tmpRay;
         private _controllers;
         private _scene;
         /**
@@ -44555,6 +44558,13 @@ declare module BABYLON {
          * @returns the controller that correlates to this id or null if not found
          */
         getXRControllerByPointerId(id: number): Nullable<WebXRInputSource>;
+        /**
+         * Will get the mesh under a specific pointer.
+         * `scene.meshUnderPointer` will only return one mesh - either left or right.
+         * @param controllerId the controllerId to check
+         * @returns The mesh under pointer or null if no mesh is under the pointer
+         */
+        getMeshUnderPointer(controllerId: string): Nullable<AbstractMesh>;
         protected _onXRFrame(_xrFrame: XRFrame): void;
         private _attachController;
         private _attachScreenRayMode;
@@ -44765,6 +44775,20 @@ declare module BABYLON {
          */
         teleportationTargetMesh?: AbstractMesh;
         /**
+         * An array of points to which the teleportation will snap to.
+         * If the teleportation ray is in the proximity of one of those points, it will be corrected to this point.
+         */
+        snapPositions?: Vector3[];
+        /**
+         * How close should the teleportation ray be in order to snap to position.
+         * Default to 0.8 units (meters)
+         */
+        snapToPositionRadius?: number;
+        /**
+         * Should teleportation move only to snap points
+         */
+        snapPointsOnly?: boolean;
+        /**
          * Values to configure the default target mesh
          */
         defaultTargetMeshOptions?: {
@@ -44806,10 +44830,14 @@ declare module BABYLON {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * This is a teleportation feature to be used with webxr-enabled motion controllers.
-     * When enabled and attached, the feature will allow a user to move aroundand rotate in the scene using
+     * When enabled and attached, the feature will allow a user to move around and rotate in the scene using
      * the input of the attached controllers.
      */
     export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
@@ -44871,6 +44899,7 @@ declare module BABYLON {
         private _tmpRay;
         private _tmpVector;
         private _floorMeshes;
+        private _snapToPositions;
         private _controllers;
         /**
          * constructs a new anchor system
@@ -44879,6 +44908,28 @@ declare module BABYLON {
          */
         constructor(_xrSessionManager: WebXRSessionManager, _options: IWebXRTeleportationOptions);
         private _selectionFeature;
+        private _snappedToPoint;
+        private _teleportationRingMaterial?;
+        /**
+         * Get the snapPointsOnly flag
+         */
+        get snapPointsOnly(): boolean;
+        /**
+         * Sets the snapPointsOnly flag
+         * @param snapToPoints should teleportation be exclusively to snap points
+         */
+        set snapPointsOnly(snapToPoints: boolean);
+        /**
+         * Add a new snap-to point to fix teleportation to this position
+         * @param newSnapPoint The new Snap-To point
+         */
+        addSnapPoint(newSnapPoint: Vector3): void;
+        /**
+         * This function will iterate through the array, searching for this point or equal to it. It will then remove it from the snap-to array
+         * @param snapPointToRemove the point (or a clone of it) to be removed from the array
+         * @returns was the point found and removed or not
+         */
+        removeSnapPoint(snapPointToRemove: Vector3): boolean;
         /**
          * This function sets a selection feature that will be disabled when
          * the forward ray is shown and will be reattached when hidden.
@@ -44894,11 +44945,12 @@ declare module BABYLON {
         private _attachController;
         private _teleportForward;
         private _detachController;
-        private createDefaultTargetMesh;
-        private setTargetMeshVisibility;
-        private setTargetMeshPosition;
+        private _createDefaultTargetMesh;
+        private _setTargetMeshVisibility;
+        private _setTargetMeshPosition;
         private _quadraticBezierCurve;
         private _showParabolicPath;
+        private _findClosestSnapPointWithRadius;
     }
 }
 declare module BABYLON {
@@ -68529,8 +68581,9 @@ declare module BABYLON {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          */
-        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): void;
+        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): void;
         /**
          * Generates an image screenshot from the specified camera.
          * @see http://doc.babylonjs.com/how_to/render_scene_on_a_png
@@ -68546,10 +68599,11 @@ declare module BABYLON {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          * @returns screenshot as a string of base64-encoded characters. This string can be assigned
          * to the src parameter of an <img> to display it
          */
-        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): Promise<string>;
+        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): Promise<string>;
         /**
          * Gets height and width for screenshot size
          * @private

dist/preview release/gui/babylon.gui.js

@@ -7,7 +7,7 @@
 		exports["babylonjs-gui"] = factory(require("babylonjs"));
 	else
 		root["BABYLON"] = root["BABYLON"] || {}, root["BABYLON"]["GUI"] = factory(root["BABYLON"]);
-})((typeof self !== "undefined" ? self : typeof global !== "undefined" ? global : this), function(__WEBPACK_EXTERNAL_MODULE_babylonjs_Maths_math__) {
+})((typeof self !== "undefined" ? self : typeof global !== "undefined" ? global : this), function(__WEBPACK_EXTERNAL_MODULE_babylonjs_Misc_perfCounter__) {
 return /******/ (function(modules) { // webpackBootstrap
 /******/ 	// The module cache
 /******/ 	var installedModules = {};
@@ -366,7 +366,7 @@ module.exports = g;
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTextureInstrumentation", function() { return AdvancedDynamicTextureInstrumentation; });
-/* harmony import */ var babylonjs_Misc_perfCounter__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/perfCounter */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_perfCounter__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/perfCounter */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_perfCounter__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_perfCounter__WEBPACK_IMPORTED_MODULE_0__);
 
 /**
@@ -509,7 +509,7 @@ var AdvancedDynamicTextureInstrumentation = /** @class */ (function () {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AdvancedDynamicTexture", function() { return AdvancedDynamicTexture; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _controls_container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./controls/container */ "./2D/controls/container.ts");
 /* harmony import */ var _style__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./style */ "./2D/style.ts");
@@ -1469,7 +1469,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 /* harmony import */ var _textBlock__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./textBlock */ "./2D/controls/textBlock.ts");
 /* harmony import */ var _image__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./image */ "./2D/controls/image.ts");
-/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_5__);
 
 
@@ -1701,7 +1701,7 @@ babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_5__["_TypeStore"].RegisteredTy
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Checkbox", function() { return Checkbox; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
@@ -1884,7 +1884,7 @@ babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredT
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ColorPicker", function() { return ColorPicker; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 /* harmony import */ var _inputText__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./inputText */ "./2D/controls/inputText.ts");
@@ -3273,7 +3273,7 @@ babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredT
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Container", function() { return Container; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/logger */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/logger */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../measure */ "./2D/measure.ts");
@@ -3688,7 +3688,7 @@ babylonjs_Misc_logger__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Control", function() { return Control; });
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../measure */ "./2D/measure.ts");
@@ -5570,7 +5570,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DisplayGrid", function() { return DisplayGrid; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
-/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__);
 
 
@@ -5803,7 +5803,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
-/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__);
 
 
@@ -5900,7 +5900,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__);
 
 
@@ -6358,7 +6358,7 @@ babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["_TypeStore"].RegisteredTypes[
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Image", function() { return Image; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 
@@ -7284,7 +7284,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InputPassword", function() { return InputPassword; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 /* harmony import */ var _inputText__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./inputText */ "./2D/controls/inputText.ts");
-/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__);
 
 
@@ -7323,7 +7323,7 @@ babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__["_TypeStore"].RegisteredTy
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InputText", function() { return InputText; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
@@ -8336,7 +8336,7 @@ babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredT
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Line", function() { return Line; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
@@ -8607,7 +8607,7 @@ babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].RegisteredTypes[
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MultiLine", function() { return MultiLine; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/abstractMesh */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/abstractMesh */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 /* harmony import */ var _multiLinePoint__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../multiLinePoint */ "./2D/multiLinePoint.ts");
@@ -8877,7 +8877,7 @@ babylonjs_Meshes_abstractMesh__WEBPACK_IMPORTED_MODULE_1__["_TypeStore"].Registe
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "RadioButton", function() { return RadioButton; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
 /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
@@ -9084,7 +9084,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Rectangle", function() { return Rectangle; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
-/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__);
 
 
@@ -9228,7 +9228,7 @@ babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__["_TypeStore"].RegisteredTy
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ScrollViewer", function() { return ScrollViewer; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Events/pointerEvents */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Events/pointerEvents */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Events_pointerEvents__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _rectangle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../rectangle */ "./2D/controls/rectangle.ts");
 /* harmony import */ var _grid__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../grid */ "./2D/controls/grid.ts");
@@ -10832,7 +10832,7 @@ var SelectionPanel = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BaseSlider", function() { return BaseSlider; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../control */ "./2D/controls/control.ts");
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../valueAndUnit */ "./2D/valueAndUnit.ts");
@@ -11162,7 +11162,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 /* harmony import */ var _baseSlider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./baseSlider */ "./2D/controls/sliders/baseSlider.ts");
 /* harmony import */ var _measure__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../measure */ "./2D/measure.ts");
-/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_3__);
 
 
@@ -11755,7 +11755,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Slider", function() { return Slider; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 /* harmony import */ var _baseSlider__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./baseSlider */ "./2D/controls/sliders/baseSlider.ts");
-/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__);
 
 
@@ -12010,7 +12010,7 @@ babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_2__["_TypeStore"].RegisteredTy
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StackPanel", function() { return StackPanel; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _container__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container */ "./2D/controls/container.ts");
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
@@ -12278,7 +12278,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TextWrapping", function() { return TextWrapping; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TextBlock", function() { return TextBlock; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../valueAndUnit */ "./2D/valueAndUnit.ts");
 /* harmony import */ var _control__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./control */ "./2D/controls/control.ts");
@@ -12741,7 +12741,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "KeyPropertySet", function() { return KeyPropertySet; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VirtualKeyboard", function() { return VirtualKeyboard; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _stackPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./stackPanel */ "./2D/controls/stackPanel.ts");
 /* harmony import */ var _button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./button */ "./2D/controls/button.ts");
@@ -13130,7 +13130,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Vector2WithInfo", function() { return Vector2WithInfo; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Matrix2D", function() { return Matrix2D; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 
@@ -13354,7 +13354,7 @@ var Matrix2D = /** @class */ (function () {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Measure", function() { return Measure; });
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__);
 
 var tmpRect = [
@@ -13503,7 +13503,7 @@ var Measure = /** @class */ (function () {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MultiLinePoint", function() { return MultiLinePoint; });
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./valueAndUnit */ "./2D/valueAndUnit.ts");
 
@@ -13646,7 +13646,7 @@ var MultiLinePoint = /** @class */ (function () {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Style", function() { return Style; });
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _valueAndUnit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./valueAndUnit */ "./2D/valueAndUnit.ts");
 
@@ -13952,7 +13952,7 @@ var ValueAndUnit = /** @class */ (function () {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "XmlLoader", function() { return XmlLoader; });
-/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/typeStore */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_typeStore__WEBPACK_IMPORTED_MODULE_0__);
 
 /**
@@ -14271,7 +14271,7 @@ var XmlLoader = /** @class */ (function () {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AbstractButton3D", function() { return AbstractButton3D; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control3D */ "./3D/controls/control3D.ts");
 
@@ -14314,7 +14314,7 @@ var AbstractButton3D = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Button3D", function() { return Button3D; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _abstractButton3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./abstractButton3D */ "./3D/controls/abstractButton3D.ts");
 /* harmony import */ var _2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../2D/advancedDynamicTexture */ "./2D/advancedDynamicTexture.ts");
@@ -14494,7 +14494,7 @@ var Button3D = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Container3D", function() { return Container3D; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Meshes/transformNode */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Meshes_transformNode__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _control3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./control3D */ "./3D/controls/control3D.ts");
 
@@ -14651,7 +14651,7 @@ var Container3D = /** @class */ (function (_super) {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Control3D", function() { return Control3D; });
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _vector3WithInfo__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../vector3WithInfo */ "./3D/vector3WithInfo.ts");
 
@@ -15057,7 +15057,7 @@ var Control3D = /** @class */ (function () {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CylinderPanel", function() { return CylinderPanel; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
@@ -15143,7 +15143,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "HolographicButton", function() { return HolographicButton; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
 /* harmony import */ var _button3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./button3D */ "./3D/controls/button3D.ts");
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_2__);
 /* harmony import */ var _materials_fluentMaterial__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../materials/fluentMaterial */ "./3D/materials/fluentMaterial.ts");
 /* harmony import */ var _2D_controls_stackPanel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../2D/controls/stackPanel */ "./2D/controls/stackPanel.ts");
@@ -15637,7 +15637,7 @@ var MeshButton3D = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlanePanel", function() { return PlanePanel; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
@@ -15692,7 +15692,7 @@ var PlanePanel = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ScatterPanel", function() { return ScatterPanel; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
@@ -15819,7 +15819,7 @@ var ScatterPanel = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SpherePanel", function() { return SpherePanel; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _volumeBasedPanel__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./volumeBasedPanel */ "./3D/controls/volumeBasedPanel.ts");
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
@@ -15904,7 +15904,7 @@ var SpherePanel = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StackPanel3D", function() { return StackPanel3D; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
@@ -16029,7 +16029,7 @@ var StackPanel3D = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VolumeBasedPanel", function() { return VolumeBasedPanel; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _container3D__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./container3D */ "./3D/controls/container3D.ts");
 
@@ -16220,7 +16220,7 @@ var VolumeBasedPanel = /** @class */ (function (_super) {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "GUI3DManager", function() { return GUI3DManager; });
-/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Misc/observable */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_observable__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _controls_container3D__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./controls/container3D */ "./3D/controls/container3D.ts");
 
@@ -16487,7 +16487,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FluentMaterialDefines", function() { return FluentMaterialDefines; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FluentMaterial", function() { return FluentMaterial; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/decorators */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Misc/decorators */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_decorators__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var _shaders_fluent_vertex__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./shaders/fluent.vertex */ "./3D/materials/shaders/fluent.vertex.ts");
 /* harmony import */ var _shaders_fluent_fragment__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./shaders/fluent.fragment */ "./3D/materials/shaders/fluent.fragment.ts");
@@ -16809,7 +16809,7 @@ __webpack_require__.r(__webpack_exports__);
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fluentPixelShader", function() { return fluentPixelShader; });
-/* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__);
 
 var name = 'fluentPixelShader';
@@ -16831,7 +16831,7 @@ var fluentPixelShader = { name: name, shader: shader };
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fluentVertexShader", function() { return fluentVertexShader; });
-/* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! babylonjs/Materials/effect */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Materials_effect__WEBPACK_IMPORTED_MODULE_0__);
 
 var name = 'fluentVertexShader';
@@ -16854,7 +16854,7 @@ var fluentVertexShader = { name: name, shader: shader };
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Vector3WithInfo", function() { return Vector3WithInfo; });
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../node_modules/tslib/tslib.es6.js");
-/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Maths/math");
+/* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! babylonjs/Maths/math */ "babylonjs/Misc/perfCounter");
 /* harmony import */ var babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Maths_math__WEBPACK_IMPORTED_MODULE_1__);
 
 
@@ -17156,14 +17156,14 @@ if (typeof globalObject !== "undefined") {
 
 /***/ }),
 
-/***/ "babylonjs/Maths/math":
+/***/ "babylonjs/Misc/perfCounter":
 /*!****************************************************************************************************!*\
   !*** external {"root":"BABYLON","commonjs":"babylonjs","commonjs2":"babylonjs","amd":"babylonjs"} ***!
   \****************************************************************************************************/
 /*! no static exports found */
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_babylonjs_Maths_math__;
+module.exports = __WEBPACK_EXTERNAL_MODULE_babylonjs_Misc_perfCounter__;
 
 /***/ })
 

dist/preview release/viewer/babylon.module.d.ts

@@ -44600,23 +44600,23 @@ declare module "babylonjs/XR/motionController/webXRControllerComponent" {
         /**
          * Thumbstick component type
          */
-        static THUMBSTICK: MotionControllerComponentType;
+        static THUMBSTICK_TYPE: MotionControllerComponentType;
         /**
          * Touchpad component type
          */
-        static TOUCHPAD: MotionControllerComponentType;
+        static TOUCHPAD_TYPE: MotionControllerComponentType;
         /**
          * trigger component type
          */
-        static TRIGGER: MotionControllerComponentType;
+        static TRIGGER_TYPE: MotionControllerComponentType;
         /**
          * squeeze component type
          */
-        static SQUEEZE: MotionControllerComponentType;
+        static SQUEEZE_TYPE: MotionControllerComponentType;
         /**
          * button component type
          */
-        static BUTTON: MotionControllerComponentType;
+        static BUTTON_TYPE: MotionControllerComponentType;
         /**
          * Observers registered here will be triggered when the state of a button changes
          * State change is either pressed / touched / value
@@ -45990,6 +45990,7 @@ declare module "babylonjs/Rendering/utilityLayerRenderer" {
 }
 declare module "babylonjs/XR/features/WebXRControllerPointerSelection" {
     import { WebXRSessionManager } from "babylonjs/XR/webXRSessionManager";
+    import { AbstractMesh } from "babylonjs/Meshes/abstractMesh";
     import { WebXRInput } from "babylonjs/XR/webXRInput";
     import { WebXRInputSource } from "babylonjs/XR/webXRInputSource";
     import { Scene } from "babylonjs/scene";
@@ -46039,6 +46040,10 @@ declare module "babylonjs/XR/features/WebXRControllerPointerSelection" {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * A module that will enable pointer selection for motion controllers of XR Input Sources
@@ -46088,7 +46093,6 @@ declare module "babylonjs/XR/features/WebXRControllerPointerSelection" {
          */
         disableSelectionMeshLighting: boolean;
         private static _idCounter;
-        private _tmpRay;
         private _controllers;
         private _scene;
         /**
@@ -46118,6 +46122,13 @@ declare module "babylonjs/XR/features/WebXRControllerPointerSelection" {
          * @returns the controller that correlates to this id or null if not found
          */
         getXRControllerByPointerId(id: number): Nullable<WebXRInputSource>;
+        /**
+         * Will get the mesh under a specific pointer.
+         * `scene.meshUnderPointer` will only return one mesh - either left or right.
+         * @param controllerId the controllerId to check
+         * @returns The mesh under pointer or null if no mesh is under the pointer
+         */
+        getMeshUnderPointer(controllerId: string): Nullable<AbstractMesh>;
         protected _onXRFrame(_xrFrame: XRFrame): void;
         private _attachController;
         private _attachScreenRayMode;
@@ -46319,6 +46330,7 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
     import { WebXRSessionManager } from "babylonjs/XR/webXRSessionManager";
     import { WebXRInput } from "babylonjs/XR/webXRInput";
     import { AbstractMesh } from "babylonjs/Meshes/abstractMesh";
+    import { Vector3 } from "babylonjs/Maths/math.vector";
     import { Material } from "babylonjs/Materials/material";
     import { WebXRAbstractFeature } from "babylonjs/XR/features/WebXRAbstractFeature";
     import { Scene } from "babylonjs/scene";
@@ -46345,6 +46357,20 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
          */
         teleportationTargetMesh?: AbstractMesh;
         /**
+         * An array of points to which the teleportation will snap to.
+         * If the teleportation ray is in the proximity of one of those points, it will be corrected to this point.
+         */
+        snapPositions?: Vector3[];
+        /**
+         * How close should the teleportation ray be in order to snap to position.
+         * Default to 0.8 units (meters)
+         */
+        snapToPositionRadius?: number;
+        /**
+         * Should teleportation move only to snap points
+         */
+        snapPointsOnly?: boolean;
+        /**
          * Values to configure the default target mesh
          */
         defaultTargetMeshOptions?: {
@@ -46386,10 +46412,14 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * This is a teleportation feature to be used with webxr-enabled motion controllers.
-     * When enabled and attached, the feature will allow a user to move aroundand rotate in the scene using
+     * When enabled and attached, the feature will allow a user to move around and rotate in the scene using
      * the input of the attached controllers.
      */
     export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
@@ -46451,6 +46481,7 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
         private _tmpRay;
         private _tmpVector;
         private _floorMeshes;
+        private _snapToPositions;
         private _controllers;
         /**
          * constructs a new anchor system
@@ -46459,6 +46490,28 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
          */
         constructor(_xrSessionManager: WebXRSessionManager, _options: IWebXRTeleportationOptions);
         private _selectionFeature;
+        private _snappedToPoint;
+        private _teleportationRingMaterial?;
+        /**
+         * Get the snapPointsOnly flag
+         */
+        get snapPointsOnly(): boolean;
+        /**
+         * Sets the snapPointsOnly flag
+         * @param snapToPoints should teleportation be exclusively to snap points
+         */
+        set snapPointsOnly(snapToPoints: boolean);
+        /**
+         * Add a new snap-to point to fix teleportation to this position
+         * @param newSnapPoint The new Snap-To point
+         */
+        addSnapPoint(newSnapPoint: Vector3): void;
+        /**
+         * This function will iterate through the array, searching for this point or equal to it. It will then remove it from the snap-to array
+         * @param snapPointToRemove the point (or a clone of it) to be removed from the array
+         * @returns was the point found and removed or not
+         */
+        removeSnapPoint(snapPointToRemove: Vector3): boolean;
         /**
          * This function sets a selection feature that will be disabled when
          * the forward ray is shown and will be reattached when hidden.
@@ -46474,11 +46527,12 @@ declare module "babylonjs/XR/features/WebXRControllerTeleportation" {
         private _attachController;
         private _teleportForward;
         private _detachController;
-        private createDefaultTargetMesh;
-        private setTargetMeshVisibility;
-        private setTargetMeshPosition;
+        private _createDefaultTargetMesh;
+        private _setTargetMeshVisibility;
+        private _setTargetMeshPosition;
         private _quadraticBezierCurve;
         private _showParabolicPath;
+        private _findClosestSnapPointWithRadius;
     }
 }
 declare module "babylonjs/XR/webXRDefaultExperience" {
@@ -72199,8 +72253,9 @@ declare module "babylonjs/Misc/screenshotTools" {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          */
-        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): void;
+        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): void;
         /**
          * Generates an image screenshot from the specified camera.
          * @see http://doc.babylonjs.com/how_to/render_scene_on_a_png
@@ -72216,10 +72271,11 @@ declare module "babylonjs/Misc/screenshotTools" {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          * @returns screenshot as a string of base64-encoded characters. This string can be assigned
          * to the src parameter of an <img> to display it
          */
-        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): Promise<string>;
+        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): Promise<string>;
         /**
          * Gets height and width for screenshot size
          * @private
@@ -116369,23 +116425,23 @@ declare module BABYLON {
         /**
          * Thumbstick component type
          */
-        static THUMBSTICK: MotionControllerComponentType;
+        static THUMBSTICK_TYPE: MotionControllerComponentType;
         /**
          * Touchpad component type
          */
-        static TOUCHPAD: MotionControllerComponentType;
+        static TOUCHPAD_TYPE: MotionControllerComponentType;
         /**
          * trigger component type
          */
-        static TRIGGER: MotionControllerComponentType;
+        static TRIGGER_TYPE: MotionControllerComponentType;
         /**
          * squeeze component type
          */
-        static SQUEEZE: MotionControllerComponentType;
+        static SQUEEZE_TYPE: MotionControllerComponentType;
         /**
          * button component type
          */
-        static BUTTON: MotionControllerComponentType;
+        static BUTTON_TYPE: MotionControllerComponentType;
         /**
          * Observers registered here will be triggered when the state of a button changes
          * State change is either pressed / touched / value
@@ -117754,6 +117810,10 @@ declare module BABYLON {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * A module that will enable pointer selection for motion controllers of XR Input Sources
@@ -117803,7 +117863,6 @@ declare module BABYLON {
          */
         disableSelectionMeshLighting: boolean;
         private static _idCounter;
-        private _tmpRay;
         private _controllers;
         private _scene;
         /**
@@ -117833,6 +117892,13 @@ declare module BABYLON {
          * @returns the controller that correlates to this id or null if not found
          */
         getXRControllerByPointerId(id: number): Nullable<WebXRInputSource>;
+        /**
+         * Will get the mesh under a specific pointer.
+         * `scene.meshUnderPointer` will only return one mesh - either left or right.
+         * @param controllerId the controllerId to check
+         * @returns The mesh under pointer or null if no mesh is under the pointer
+         */
+        getMeshUnderPointer(controllerId: string): Nullable<AbstractMesh>;
         protected _onXRFrame(_xrFrame: XRFrame): void;
         private _attachController;
         private _attachScreenRayMode;
@@ -118043,6 +118109,20 @@ declare module BABYLON {
          */
         teleportationTargetMesh?: AbstractMesh;
         /**
+         * An array of points to which the teleportation will snap to.
+         * If the teleportation ray is in the proximity of one of those points, it will be corrected to this point.
+         */
+        snapPositions?: Vector3[];
+        /**
+         * How close should the teleportation ray be in order to snap to position.
+         * Default to 0.8 units (meters)
+         */
+        snapToPositionRadius?: number;
+        /**
+         * Should teleportation move only to snap points
+         */
+        snapPointsOnly?: boolean;
+        /**
          * Values to configure the default target mesh
          */
         defaultTargetMeshOptions?: {
@@ -118084,10 +118164,14 @@ declare module BABYLON {
          * if provided, this scene will be used to render meshes.
          */
         customUtilityLayerScene?: Scene;
+        /**
+         *  use this rendering group id for the meshes (optional)
+         */
+        renderingGroupId?: number;
     }
     /**
      * This is a teleportation feature to be used with webxr-enabled motion controllers.
-     * When enabled and attached, the feature will allow a user to move aroundand rotate in the scene using
+     * When enabled and attached, the feature will allow a user to move around and rotate in the scene using
      * the input of the attached controllers.
      */
     export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
@@ -118149,6 +118233,7 @@ declare module BABYLON {
         private _tmpRay;
         private _tmpVector;
         private _floorMeshes;
+        private _snapToPositions;
         private _controllers;
         /**
          * constructs a new anchor system
@@ -118157,6 +118242,28 @@ declare module BABYLON {
          */
         constructor(_xrSessionManager: WebXRSessionManager, _options: IWebXRTeleportationOptions);
         private _selectionFeature;
+        private _snappedToPoint;
+        private _teleportationRingMaterial?;
+        /**
+         * Get the snapPointsOnly flag
+         */
+        get snapPointsOnly(): boolean;
+        /**
+         * Sets the snapPointsOnly flag
+         * @param snapToPoints should teleportation be exclusively to snap points
+         */
+        set snapPointsOnly(snapToPoints: boolean);
+        /**
+         * Add a new snap-to point to fix teleportation to this position
+         * @param newSnapPoint The new Snap-To point
+         */
+        addSnapPoint(newSnapPoint: Vector3): void;
+        /**
+         * This function will iterate through the array, searching for this point or equal to it. It will then remove it from the snap-to array
+         * @param snapPointToRemove the point (or a clone of it) to be removed from the array
+         * @returns was the point found and removed or not
+         */
+        removeSnapPoint(snapPointToRemove: Vector3): boolean;
         /**
          * This function sets a selection feature that will be disabled when
          * the forward ray is shown and will be reattached when hidden.
@@ -118172,11 +118279,12 @@ declare module BABYLON {
         private _attachController;
         private _teleportForward;
         private _detachController;
-        private createDefaultTargetMesh;
-        private setTargetMeshVisibility;
-        private setTargetMeshPosition;
+        private _createDefaultTargetMesh;
+        private _setTargetMeshVisibility;
+        private _setTargetMeshPosition;
         private _quadraticBezierCurve;
         private _showParabolicPath;
+        private _findClosestSnapPointWithRadius;
     }
 }
 declare module BABYLON {
@@ -141807,8 +141915,9 @@ declare module BABYLON {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          */
-        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): void;
+        static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): void;
         /**
          * Generates an image screenshot from the specified camera.
          * @see http://doc.babylonjs.com/how_to/render_scene_on_a_png
@@ -141824,10 +141933,11 @@ declare module BABYLON {
          * @param samples Texture samples (default: 1)
          * @param antialiasing Whether antialiasing should be turned on or not (default: false)
          * @param fileName A name for for the downloaded file.
+         * @param renderSprites Whether the sprites should be rendered or not (default: false)
          * @returns screenshot as a string of base64-encoded characters. This string can be assigned
          * to the src parameter of an <img> to display it
          */
-        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string): Promise<string>;
+        static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType?: string, samples?: number, antialiasing?: boolean, fileName?: string, renderSprites?: boolean): Promise<string>;
         /**
          * Gets height and width for screenshot size
          * @private

dist/preview release/what's new.md

@@ -164,6 +164,7 @@
 
 - Added interface for argument `size` of screenshot methods ([Dok11](https://github.com/Dok11/))
 - Implementation usage of precision in combination height and width params ([Dok11](https://github.com/Dok11/))
+- Added a parameter to `CreateScreenshotUsingRenderTarget` to render sprites ([Popov72](https://github.com/Popov72))
 
 ### Sounds
 
@@ -198,7 +199,7 @@
 - New observable that triggers when a session was initialized ([RaananW](https://github.com/RaananW/))
 - WebXR teleportation can now be disabled after initialized or before created ([RaananW](https://github.com/RaananW/))
 - New Features Manager for WebXR features ([RaananW](https://github.com/RaananW/))
-- New features - Plane detection, Hit Test, Background remover ([RaananW](https://github.com/RaananW/))
+- New features - Plane detection, Hit test, Background remover ([RaananW](https://github.com/RaananW/))
 - XR Camera's API is Babylon-conform (position, rotationQuaternion, world matrix, direction etc') ([#7239](https://github.com/BabylonJS/Babylon.js/issues/7239)) ([RaananW](https://github.com/RaananW/))
 - XR Input now using standard profiles and completely separated from the gamepad class ([#7348](https://github.com/BabylonJS/Babylon.js/issues/7348)) ([RaananW](https://github.com/RaananW/))
 - Teleportation and controller selection are now WebXR features. ([#7290](https://github.com/BabylonJS/Babylon.js/issues/7290)) ([RaananW](https://github.com/RaananW/))
@@ -208,9 +209,10 @@
 - Selection has gaze mode (which can be forced) and touch-screen support ([#7395](https://github.com/BabylonJS/Babylon.js/issues/7395)) ([RaananW](https://github.com/RaananW/))
 - Laser pointers can be excluded from lighting influence so that they are always visible in both WebXR and WebVR ([#7323](https://github.com/BabylonJS/Babylon.js/issues/7323)) ([RaananW](https://github.com/RaananW/))
 - Full support for the online motion controller repository ([#7323](https://github.com/BabylonJS/Babylon.js/issues/7323)) ([RaananW](https://github.com/RaananW/))
-- New XR feature - XR Controller physics impostor for motion controllers ([RaananW](https://github.com/RaananW/))
+- New XR feature - XR Controller physics impostor for motion controllers / XR Input sources ([RaananW](https://github.com/RaananW/))
 - Teleportation between different ground levels in WebXR is enabled ([RaananW](https://github.com/RaananW/))
 - Utility Meshes for XR (teleportation ring, selection rays) can now be rendered using a utility layer ([#7563](https://github.com/BabylonJS/Babylon.js/issues/7563)) ([RaananW](https://github.com/RaananW/))
+- Teleportation supports snap-to (anchor) points ([#7441](https://github.com/BabylonJS/Babylon.js/issues/7441)) ([RaananW](https://github.com/RaananW/))
 
 ### Ray
 

src/Misc/screenshotTools.ts

@@ -112,8 +112,9 @@ export class ScreenshotTools {
      * @param samples Texture samples (default: 1)
      * @param antialiasing Whether antialiasing should be turned on or not (default: false)
      * @param fileName A name for for the downloaded file.
+     * @param renderSprites Whether the sprites should be rendered or not (default: false)
      */
-    public static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType: string = "image/png", samples: number = 1, antialiasing: boolean = false, fileName?: string): void {
+    public static CreateScreenshotUsingRenderTarget(engine: Engine, camera: Camera, size: IScreenshotSize | number, successCallback?: (data: string) => void, mimeType: string = "image/png", samples: number = 1, antialiasing: boolean = false, fileName?: string, renderSprites: boolean = false): void {
         const { height, width } = ScreenshotTools._getScreenshotSize(engine, camera, size);
         let targetTextureSize = { width, height };
 
@@ -144,6 +145,7 @@ export class ScreenshotTools {
         var texture = new RenderTargetTexture("screenShot", targetTextureSize, scene, false, false, Constants.TEXTURETYPE_UNSIGNED_INT, false, Texture.NEAREST_SAMPLINGMODE);
         texture.renderList = null;
         texture.samples = samples;
+        texture.renderSprites = renderSprites;
         texture.onAfterRenderObservable.add(() => {
             Tools.DumpFramebuffer(width, height, engine, successCallback, mimeType, fileName);
         });
@@ -196,10 +198,11 @@ export class ScreenshotTools {
      * @param samples Texture samples (default: 1)
      * @param antialiasing Whether antialiasing should be turned on or not (default: false)
      * @param fileName A name for for the downloaded file.
+     * @param renderSprites Whether the sprites should be rendered or not (default: false)
      * @returns screenshot as a string of base64-encoded characters. This string can be assigned
      * to the src parameter of an <img> to display it
      */
-    public static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType: string = "image/png", samples: number = 1, antialiasing: boolean = false, fileName?: string): Promise<string> {
+    public static CreateScreenshotUsingRenderTargetAsync(engine: Engine, camera: Camera, size: any, mimeType: string = "image/png", samples: number = 1, antialiasing: boolean = false, fileName?: string,  renderSprites: boolean = false): Promise<string> {
         return new Promise((resolve, reject) => {
             ScreenshotTools.CreateScreenshotUsingRenderTarget(engine, camera, size, (data) => {
                 if (typeof(data) !== "undefined") {
@@ -207,7 +210,7 @@ export class ScreenshotTools {
                 } else {
                     reject(new Error("Data is undefined"));
                 }
-            }, mimeType, samples, antialiasing, fileName);
+            }, mimeType, samples, antialiasing, fileName, renderSprites);
         });
     }
 

src/Physics/Plugins/oimoJSPlugin.ts

@@ -151,8 +151,6 @@ export class OimoJSPlugin implements IPhysicsEnginePlugin {
 
                 const radToDeg = 57.295779513082320876;
 
-                console.log(i.object.position, extendSize);
-
                 if (i === impostor) {
                     var center = impostor.getObjectCenter();
 
@@ -233,7 +231,6 @@ export class OimoJSPlugin implements IPhysicsEnginePlugin {
                 //actually not needed, but hey...
                 i.object.rotationQuaternion = oldQuaternion;
             });
-            console.log(bodyConfig);
             impostor.physicsBody = this.world.add(bodyConfig);
             // set the quaternion, ignoring the previously defined (euler) rotation
             impostor.physicsBody.resetQuaternion(globalQuaternion);

src/XR/features/WebXRControllerPhysics.ts

@@ -326,7 +326,7 @@ export class WebXRControllerPhysics extends WebXRAbstractFeature {
             const comparedQuaternion = controllerData.oldRotation || controllerData.impostorMesh!.rotationQuaternion!;
 
             controllerMesh.position.subtractToRef(comparedPosition, this._tmpVector);
-            this._tmpVector.scaleInPlace(this._delta);
+            this._tmpVector.scaleInPlace(1000 / this._delta);
             controllerData.impostor.setLinearVelocity(this._tmpVector);
             if (this._debugMode) {
                 console.log(this._tmpVector, 'linear');
@@ -342,7 +342,7 @@ export class WebXRControllerPhysics extends WebXRAbstractFeature {
                     this._tmpVector.scaleInPlace(2);
                 } else {
                     const angle = 2 * Math.atan2(len, this._tmpQuaternion.w);
-                    this._tmpVector.scaleInPlace((angle / (len * this._delta)));
+                    this._tmpVector.scaleInPlace((angle / (len * (this._delta / 1000))));
                 }
                 controllerData.impostor.setAngularVelocity(this._tmpVector);
                 if (this._debugMode) {

src/XR/features/WebXRControllerPointerSelection.ts

@@ -66,6 +66,11 @@ export interface IWebXRControllerPointerSelectionOptions {
      * if provided, this scene will be used to render meshes.
      */
     customUtilityLayerScene?: Scene;
+
+    /**
+     *  use this rendering group id for the meshes (optional)
+     */
+    renderingGroupId?: number;
 }
 
 /**
@@ -122,8 +127,6 @@ export class WebXRControllerPointerSelection extends WebXRAbstractFeature {
 
     private static _idCounter = 0;
 
-    private _tmpRay = new Ray(new Vector3(), new Vector3());
-
     private _controllers: {
         [controllerUniqueId: string]: {
             xrController: WebXRInputSource;
@@ -132,8 +135,10 @@ export class WebXRControllerPointerSelection extends WebXRAbstractFeature {
             onFrameObserver?: Nullable<Observer<XRFrame>>;
             laserPointer: AbstractMesh;
             selectionMesh: AbstractMesh;
+            meshUnderPointer: Nullable<AbstractMesh>;
             pick: Nullable<PickingInfo>;
             id: number;
+            tmpRay: Ray;
         };
     } = {};
 
@@ -205,13 +210,27 @@ export class WebXRControllerPointerSelection extends WebXRAbstractFeature {
         return null;
     }
 
+    /**
+     * Will get the mesh under a specific pointer.
+     * `scene.meshUnderPointer` will only return one mesh - either left or right.
+     * @param controllerId the controllerId to check
+     * @returns The mesh under pointer or null if no mesh is under the pointer
+     */
+    public getMeshUnderPointer(controllerId: string): Nullable<AbstractMesh> {
+        if (this._controllers[controllerId]) {
+            return this._controllers[controllerId].meshUnderPointer;
+        } else {
+            return null;
+        }
+    }
+
     protected _onXRFrame(_xrFrame: XRFrame) {
         Object.keys(this._controllers).forEach((id) => {
             const controllerData = this._controllers[id];
 
             // Every frame check collisions/input
-            controllerData.xrController.getWorldPointerRayToRef(this._tmpRay);
-            controllerData.pick = this._scene.pickWithRay(this._tmpRay);
+            controllerData.xrController.getWorldPointerRayToRef(controllerData.tmpRay);
+            controllerData.pick = this._scene.pickWithRay(controllerData.tmpRay);
 
             const pick = controllerData.pick;
 
@@ -226,7 +245,7 @@ export class WebXRControllerPointerSelection extends WebXRAbstractFeature {
                 controllerData.selectionMesh.scaling.z = Math.sqrt(pick.distance);
 
                 // To avoid z-fighting
-                let pickNormal = this._convertNormalToDirectionOfRay(pick.getNormal(true), this._tmpRay);
+                let pickNormal = this._convertNormalToDirectionOfRay(pick.getNormal(true), controllerData.tmpRay);
                 let deltaFighting = 0.001;
                 controllerData.selectionMesh.position.copyFrom(pick.pickedPoint);
                 if (pickNormal) {
@@ -236,8 +255,10 @@ export class WebXRControllerPointerSelection extends WebXRAbstractFeature {
                     controllerData.selectionMesh.position.addInPlace(pickNormal.scale(deltaFighting));
                 }
                 controllerData.selectionMesh.isVisible = true && this.displaySelectionMesh;
+                controllerData.meshUnderPointer = pick.pickedMesh;
             } else {
                 controllerData.selectionMesh.isVisible = false;
+                controllerData.meshUnderPointer = null;
             }
         });
     }
@@ -255,7 +276,9 @@ export class WebXRControllerPointerSelection extends WebXRAbstractFeature {
             xrController,
             laserPointer,
             selectionMesh,
+            meshUnderPointer: null,
             pick: null,
+            tmpRay: new Ray(new Vector3(), new Vector3()),
             id: WebXRControllerPointerSelection._idCounter++
         };
         switch (xrController.inputSource.targetRayMode) {
@@ -346,6 +369,10 @@ export class WebXRControllerPointerSelection extends WebXRAbstractFeature {
 
             oldPick = controllerData.pick;
         });
+
+        if (this._options.renderingGroupId !== undefined) {
+            discMesh.renderingGroupId = this._options.renderingGroupId;
+        }
         xrController.onDisposeObservable.addOnce(() => {
             if (controllerData.pick && !this._options.disablePointerUpOnTouchOut && downTriggered) {
                 this._scene.simulatePointerUp(controllerData.pick, { pointerId: controllerData.id });
@@ -466,6 +493,11 @@ export class WebXRControllerPointerSelection extends WebXRAbstractFeature {
         targetMat.backFaceCulling = false;
         selectionMesh.material = targetMat;
 
+        if (this._options.renderingGroupId !== undefined) {
+            laserPointer.renderingGroupId = this._options.renderingGroupId;
+            selectionMesh.renderingGroupId = this._options.renderingGroupId;
+        }
+
         return {
             laserPointer,
             selectionMesh

src/XR/features/WebXRControllerTeleportation.ts

@@ -47,6 +47,21 @@ export interface IWebXRTeleportationOptions {
      * When left untouched, the default mesh will be initialized.
      */
     teleportationTargetMesh?: AbstractMesh;
+
+    /**
+     * An array of points to which the teleportation will snap to.
+     * If the teleportation ray is in the proximity of one of those points, it will be corrected to this point.
+     */
+    snapPositions?: Vector3[];
+    /**
+     * How close should the teleportation ray be in order to snap to position.
+     * Default to 0.8 units (meters)
+     */
+    snapToPositionRadius?: number;
+    /**
+     * Should teleportation move only to snap points
+     */
+    snapPointsOnly?: boolean;
     /**
      * Values to configure the default target mesh
      */
@@ -92,11 +107,16 @@ export interface IWebXRTeleportationOptions {
      * if provided, this scene will be used to render meshes.
      */
     customUtilityLayerScene?: Scene;
+
+    /**
+     *  use this rendering group id for the meshes (optional)
+     */
+    renderingGroupId?: number;
 }
 
 /**
  * This is a teleportation feature to be used with webxr-enabled motion controllers.
- * When enabled and attached, the feature will allow a user to move aroundand rotate in the scene using
+ * When enabled and attached, the feature will allow a user to move around and rotate in the scene using
  * the input of the attached controllers.
  */
 export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
@@ -177,6 +197,7 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
     private _tmpVector = new Vector3();
 
     private _floorMeshes: AbstractMesh[];
+    private _snapToPositions: Vector3[];
 
     private _controllers: {
         [controllerUniqueId: string]: {
@@ -203,17 +224,68 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         super(_xrSessionManager);
         // create default mesh if not provided
         if (!this._options.teleportationTargetMesh) {
-            this.createDefaultTargetMesh();
+            this._createDefaultTargetMesh();
         }
 
         this._floorMeshes = this._options.floorMeshes || [];
+        this._snapToPositions = this._options.snapPositions || [];
 
-        this.setTargetMeshVisibility(false);
+        this._setTargetMeshVisibility(false);
     }
 
     private _selectionFeature: IWebXRFeature;
+    private _snappedToPoint: boolean = false;
+    private _teleportationRingMaterial?: StandardMaterial;
+
+    /**
+     * Get the snapPointsOnly flag
+     */
+    public get snapPointsOnly(): boolean {
+        return !!this._options.snapPointsOnly;
+    }
+
+    /**
+     * Sets the snapPointsOnly flag
+     * @param snapToPoints should teleportation be exclusively to snap points
+     */
+    public set snapPointsOnly(snapToPoints: boolean) {
+        this._options.snapPointsOnly = snapToPoints;
+    }
+
+    /**
+     * Add a new snap-to point to fix teleportation to this position
+     * @param newSnapPoint The new Snap-To point
+     */
+    public addSnapPoint(newSnapPoint: Vector3) {
+        this._snapToPositions.push(newSnapPoint);
+    }
 
     /**
+     * This function will iterate through the array, searching for this point or equal to it. It will then remove it from the snap-to array
+     * @param snapPointToRemove the point (or a clone of it) to be removed from the array
+     * @returns was the point found and removed or not
+     */
+    public removeSnapPoint(snapPointToRemove: Vector3): boolean {
+        // check if the object is in the array
+        let index = this._snapToPositions.indexOf(snapPointToRemove);
+        // if not found as an object, compare to the points
+        if (index === -1) {
+            for (let i = 0; i < this._snapToPositions.length; ++i) {
+                // equals? index is i, break the loop
+                if (this._snapToPositions[i].equals(snapPointToRemove)) {
+                    index = i;
+                    break;
+                }
+            }
+        }
+        // index is not -1? remove the object
+        if (index !== -1) {
+            this._snapToPositions.splice(index, 1);
+            return true;
+        }
+        return false;
+    }
+    /**
      * This function sets a selection feature that will be disabled when
      * the forward ray is shown and will be reattached when hidden.
      * This is used to remove the selection rays when moving.
@@ -247,7 +319,7 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
             this._detachController(controllerId);
         });
 
-        this.setTargetMeshVisibility(false);
+        this._setTargetMeshVisibility(false);
 
         return true;
     }
@@ -286,8 +358,8 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
                 });
                 if (pick && pick.pickedPoint) {
                     hitPossible = true;
-                    this.setTargetMeshPosition(pick.pickedPoint);
-                    this.setTargetMeshVisibility(true);
+                    this._setTargetMeshPosition(pick.pickedPoint);
+                    this._setTargetMeshVisibility(true);
                     this._showParabolicPath(pick);
                 } else {
                     if (this.parabolicRayEnabled) {
@@ -307,20 +379,20 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
                         });
                         if (pick && pick.pickedPoint) {
                             hitPossible = true;
-                            this.setTargetMeshPosition(pick.pickedPoint);
-                            this.setTargetMeshVisibility(true);
+                            this._setTargetMeshPosition(pick.pickedPoint);
+                            this._setTargetMeshVisibility(true);
                             this._showParabolicPath(pick);
                         }
                     }
                 }
 
                 // if needed, set visible:
-                this.setTargetMeshVisibility(hitPossible);
+                this._setTargetMeshVisibility(hitPossible);
             } else {
-                this.setTargetMeshVisibility(false);
+                this._setTargetMeshVisibility(false);
             }
         } else {
-            this.setTargetMeshVisibility(false);
+            this._setTargetMeshVisibility(false);
         }
     }
 
@@ -345,7 +417,7 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         // motion controller support
         xrController.onMotionControllerInitObservable.addOnce(() => {
             if (xrController.motionController) {
-                const movementController = xrController.motionController.getComponentOfType(WebXRControllerComponent.THUMBSTICK) || xrController.motionController.getComponentOfType(WebXRControllerComponent.TOUCHPAD);
+                const movementController = xrController.motionController.getComponentOfType(WebXRControllerComponent.THUMBSTICK_TYPE) || xrController.motionController.getComponentOfType(WebXRControllerComponent.TOUCHPAD_TYPE);
                 if (!movementController || this._options.useMainComponentOnly) {
                     // use trigger to move on long press
                     const mainComponent = xrController.motionController.getMainComponent();
@@ -398,7 +470,7 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
                             //this._currentTeleportationControllerId = "";
                             //}
                         }
-                        if (axesData.y > 0.7 && !controllerData.teleportationState.forward && this.backwardsMovementEnabled) {
+                        if (axesData.y > 0.7 && !controllerData.teleportationState.forward && this.backwardsMovementEnabled && !this.snapPointsOnly) {
                             // teleport backwards
                             if (!controllerData.teleportationState.backwards) {
                                 controllerData.teleportationState.backwards = true;
@@ -459,6 +531,9 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         const controllerData = this._controllers[controllerId];
         controllerData.teleportationState.forward = false;
         this._currentTeleportationControllerId = "";
+        if (this.snapPointsOnly && !this._snappedToPoint) {
+            return;
+        }
         // do the movement forward here
         if (this._options.teleportationTargetMesh && this._options.teleportationTargetMesh.isVisible) {
             const height = this._options.xrInput.xrCamera.realWorldHeight;
@@ -483,7 +558,7 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         delete this._controllers[xrControllerUniqueId];
     }
 
-    private createDefaultTargetMesh() {
+    private _createDefaultTargetMesh() {
         // set defaults
         this._options.defaultTargetMeshOptions = this._options.defaultTargetMeshOptions || {};
         const sceneToRenderTo = this._options.useUtilityLayer ? (this._options.customUtilityLayerScene || UtilityLayerRenderer.DefaultUtilityLayer.utilityLayerScene) : this._xrSessionManager.scene;
@@ -562,12 +637,19 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
             torusConeMaterial.alpha = 0.9;
             torus.material = torusConeMaterial;
             cone.material = torusConeMaterial;
+            this._teleportationRingMaterial = torusConeMaterial;
+        }
+
+        if (this._options.renderingGroupId !== undefined) {
+            teleportationTarget.renderingGroupId = this._options.renderingGroupId;
+            torus.renderingGroupId = this._options.renderingGroupId;
+            cone.renderingGroupId = this._options.renderingGroupId;
         }
 
         this._options.teleportationTargetMesh = teleportationTarget;
     }
 
-    private setTargetMeshVisibility(visible: boolean) {
+    private _setTargetMeshVisibility(visible: boolean) {
         if (!this._options.teleportationTargetMesh) { return; }
         if (this._options.teleportationTargetMesh.isVisible === visible) { return; }
         this._options.teleportationTargetMesh.isVisible = visible;
@@ -587,9 +669,16 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         }
     }
 
-    private setTargetMeshPosition(newPosition: Vector3) {
+    private _setTargetMeshPosition(newPosition: Vector3) {
         if (!this._options.teleportationTargetMesh) { return; }
-        this._options.teleportationTargetMesh.position.copyFrom(newPosition);
+        const snapPosition = this._findClosestSnapPointWithRadius(newPosition);
+        this._snappedToPoint = !!snapPosition;
+        if (this.snapPointsOnly && !this._snappedToPoint && this._teleportationRingMaterial) {
+            this._teleportationRingMaterial.diffuseColor.set(1.0, 0.3, 0.3);
+        } else if (this.snapPointsOnly && this._snappedToPoint && this._teleportationRingMaterial) {
+            this._teleportationRingMaterial.diffuseColor.set(0.3, 0.3, 1.0);
+        }
+        this._options.teleportationTargetMesh.position.copyFrom(snapPosition || newPosition);
         this._options.teleportationTargetMesh.position.y += 0.01;
     }
 
@@ -613,6 +702,22 @@ export class WebXRMotionControllerTeleportation extends WebXRAbstractFeature {
         this._quadraticBezierCurve = LinesBuilder.CreateLines("path line", { points: quadraticBezierVectors.getPoints() });
         this._quadraticBezierCurve.isPickable = false;
     }
+
+    private _findClosestSnapPointWithRadius(realPosition: Vector3, radius: number = this._options.snapToPositionRadius || 0.8) {
+        let closestPoint: Nullable<Vector3> = null;
+        let closestDistance = Number.MAX_VALUE;
+        if (this._snapToPositions.length) {
+            const radiusSquared = radius * radius;
+            this._snapToPositions.forEach((position) => {
+                const dist = Vector3.DistanceSquared(position, realPosition);
+                if (dist <= radiusSquared && dist < closestDistance) {
+                    closestDistance = dist;
+                    closestPoint = position;
+                }
+            });
+        }
+        return closestPoint;
+    }
 }
 
 WebXRFeaturesManager.AddWebXRFeature(WebXRMotionControllerTeleportation.Name, (xrSessionManager, options) => {

src/XR/motionController/webXRControllerComponent.ts

@@ -59,23 +59,23 @@ export class WebXRControllerComponent implements IDisposable {
     /**
      * Thumbstick component type
      */
-    public static THUMBSTICK: MotionControllerComponentType = "thumbstick";
+    public static THUMBSTICK_TYPE: MotionControllerComponentType = "thumbstick";
     /**
      * Touchpad component type
      */
-    public static TOUCHPAD: MotionControllerComponentType = "touchpad";
+    public static TOUCHPAD_TYPE: MotionControllerComponentType = "touchpad";
     /**
      * trigger component type
      */
-    public static TRIGGER: MotionControllerComponentType = "trigger";
+    public static TRIGGER_TYPE: MotionControllerComponentType = "trigger";
     /**
      * squeeze component type
      */
-    public static SQUEEZE: MotionControllerComponentType = "squeeze";
+    public static SQUEEZE_TYPE: MotionControllerComponentType = "squeeze";
     /**
      * button component type
      */
-    public static BUTTON: MotionControllerComponentType = "button";
+    public static BUTTON_TYPE: MotionControllerComponentType = "button";
     /**
      * Observers registered here will be triggered when the state of a button changes
      * State change is either pressed / touched / value

src/XR/motionController/webXRProfiledMotionController.ts

@@ -57,12 +57,12 @@ export class WebXRProfiledMotionController extends WebXRAbstractMotionController
                     };
                 } else {
                     // visibility, usually for touchpads
-                    const nameOfMesh = (componentInLayout.type === WebXRControllerComponent.TOUCHPAD && componentInLayout.touchPointNodeName)
+                    const nameOfMesh = (componentInLayout.type === WebXRControllerComponent.TOUCHPAD_TYPE && componentInLayout.touchPointNodeName)
                         ? componentInLayout.touchPointNodeName : visResponse.valueNodeName!;
                     this._buttonMeshMapping[type].states[visualResponseKey] = {
                         valueMesh: this._getChildByName(this.rootMesh!, nameOfMesh)
                     };
-                    if (componentInLayout.type === WebXRControllerComponent.TOUCHPAD && !this._touchDots[visualResponseKey]) {
+                    if (componentInLayout.type === WebXRControllerComponent.TOUCHPAD_TYPE && !this._touchDots[visualResponseKey]) {
                         const dot = SphereBuilder.CreateSphere(visualResponseKey + 'dot', {
                             diameter: 0.0015,
                             segments: 8