@webspatial/core-sdk 0.0.3 → 0.0.4-alpha.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @webspatial/core-sdk
 
+## 0.0.4-alpha.0
+
+### Patch Changes
+
+- 997d398: support fixed position for Model including wrapped under a spatialdiv
+
 ## 0.0.3
 
 ### Patch Changes

package/dist/core/SpatialHelper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SpatialHelper.d.ts","sourceRoot":"","sources":["../../src/core/SpatialHelper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,UAAU,EAAE,MAAM,aAAa,CAAA;AAE9D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAGjD;;;GAGG;AACH,qBAAa,aAAa;IAkBL,OAAO,EAAE,cAAc;IAjB1C,OAAO,CAAC,MAAM,CAAC,SAAS,CAA6B;IACrD,MAAM,KAAK,QAAQ,yBAclB;gBAEkB,OAAO,EAAE,cAAc;IAE1C,KAAK;;iCAiB4B,MAAM;gDAOS,aAAa;MAsB5D;IAED,UAAU;yBAED,MAAM,YACD;YAAE,UAAU,EAAE;gBAAE,KAAK,EAAE,MAAM,CAAC;gBAAC,MAAM,EAAE,MAAM,CAAA;aAAE,CAAA;SAAE;0BA2BtD,MAAM,YACD;YAAE,UAAU,EAAE;gBAAE,KAAK,EAAE,MAAM,CAAC;gBAAC,MAAM,EAAE,MAAM,CAAA;aAAE,CAAA;SAAE;MA2B9D;IAED,GAAG;uCACoC,WAAW;;;MAgDjD;IAED,kBAAkB,UACT,UAAU,6CAKlB;CACF"}
+{"version":3,"file":"SpatialHelper.d.ts","sourceRoot":"","sources":["../../src/core/SpatialHelper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,UAAU,EAAE,MAAM,aAAa,CAAA;AAE9D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAGjD;;;GAGG;AACH,qBAAa,aAAa;IAkBL,OAAO,EAAE,cAAc;IAjB1C,OAAO,CAAC,MAAM,CAAC,SAAS,CAA6B;IACrD,MAAM,KAAK,QAAQ,yBAclB;gBAEkB,OAAO,EAAE,cAAc;IAE1C,KAAK;;iCAiB4B,MAAM;gDAOS,aAAa;MAsB5D;IAED,UAAU;yBAED,MAAM,YACD;YAAE,UAAU,EAAE;gBAAE,KAAK,EAAE,MAAM,CAAC;gBAAC,MAAM,EAAE,MAAM,CAAA;aAAE,CAAA;SAAE;0BAqCtD,MAAM,YACD;YAAE,UAAU,EAAE;gBAAE,KAAK,EAAE,MAAM,CAAC;gBAAC,MAAM,EAAE,MAAM,CAAA;aAAE,CAAA;SAAE;MA8C9D;IAED,GAAG;uCACoC,WAAW;;;MAgDjD;IAED,kBAAkB,UACT,UAAU,6CAKlB;CACF"}

package/dist/core/SpatialHelper.js

@@ -76,10 +76,20 @@ export class SpatialHelper {
                     ._setOpenSettings({ resolution: options.resolution });
             }
             // Create window container
-            var wg = await this.session.createWindowContainer({ style: 'Plain' });
+            var wg = await this.session.createWindowContainer({
+                style: 'Plain',
+                windowComponent: null,
+                windowContainer: null,
+            });
             // Create a root entity displaying a webpage
-            var ent = await this.session.createEntity();
-            var i = await this.session.createWindowComponent({ windowContainer: wg });
+            var ent = await this.session.createEntity({
+                windowComponent: null,
+                windowContainer: wg,
+            });
+            var i = await this.session.createWindowComponent({
+                windowComponent: null,
+                windowContainer: wg,
+            });
             await i.loadURL(url);
             await ent.setCoordinateSpace('Root');
             await ent.setComponent(i);
@@ -91,15 +101,31 @@ export class SpatialHelper {
                 ._setOpenSettings({ resolution: { width: 900, height: 700 } });
         },
         openVolume: async (url, options) => {
-            var wg = await this.session.createWindowContainer({ style: 'Volumetric' });
+            var wg = await this.session.createWindowContainer({
+                style: 'Volumetric',
+                windowComponent: null,
+                windowContainer: null,
+            });
             // Create a root view entity within the window container
-            var rootEnt = await this.session.createEntity();
-            await rootEnt.setComponent(await this.session.createViewComponent({ windowContainer: wg }));
+            var rootEnt = await this.session.createEntity({
+                windowComponent: null,
+                windowContainer: wg,
+            });
+            await rootEnt.setComponent(await this.session.createViewComponent({
+                windowComponent: null,
+                windowContainer: wg,
+            }));
             await rootEnt.setCoordinateSpace('Root');
             await wg.setRootEntity(rootEnt);
             // Add webpage to the window container
-            var ent = await this.session.createEntity();
-            var i = await this.session.createWindowComponent({ windowContainer: wg });
+            var ent = await this.session.createEntity({
+                windowComponent: null,
+                windowContainer: wg,
+            });
+            var i = await this.session.createWindowComponent({
+                windowComponent: null,
+                windowContainer: wg,
+            });
             await i.loadURL(url);
             if (options?.resolution) {
                 await i.setResolution(options.resolution.width, options.resolution.height);

package/dist/core/SpatialSession.d.ts

@@ -3,6 +3,10 @@ import { SpatialWindowContainer } from './SpatialWindowContainer';
 import { LoadingMethodKind, sceneDataShape, WindowStyle } from './types';
 import { SpatialMeshResource, SpatialPhysicallyBasedMaterialResource } from './resource';
 import { SpatialModelComponent, SpatialInputComponent, SpatialWindowComponent, SpatialViewComponent, SpatialModel3DComponent } from './component';
+type CreateResourceOptions = {
+    windowContainer?: SpatialWindowContainer | null;
+    windowComponent?: SpatialWindowComponent | null;
+};
 /**
  * Animation callback with timestamp
  */
@@ -24,63 +28,57 @@ export declare class SpatialSession {
      * Creates a Entity
      * @returns Entity
      */
-    createEntity(): Promise<SpatialEntity>;
+    createEntity(options?: CreateResourceOptions): Promise<SpatialEntity>;
     /**
      * Creates a WindowComponent
      * [TODO] should creation of components be moved to entity? and these made private?
      * @returns WindowComponent
      */
-    createWindowComponent(options?: {
-        windowContainer?: SpatialWindowContainer;
-    }): Promise<SpatialWindowComponent>;
+    createWindowComponent(options?: CreateResourceOptions): Promise<SpatialWindowComponent>;
     /**
      * Creates a ViewComponent used to display 3D content within the entity
      * @returns SpatialViewComponent
      */
-    createViewComponent(options?: {
-        windowContainer?: SpatialWindowContainer;
-    }): Promise<SpatialViewComponent>;
+    createViewComponent(options?: CreateResourceOptions): Promise<SpatialViewComponent>;
     /**
      * Creates a ModelComponent used to display geometry + material of a 3D model
      * @returns ModelComponent
      */
     createModelComponent(options?: {
         url: string;
-    }): Promise<SpatialModelComponent>;
+    } & CreateResourceOptions): Promise<SpatialModelComponent>;
     /**
      * Creates a Model3DComponent
      * @returns Model3DComponent
      */
     createModel3DComponent(options?: {
         url: string;
-    }): Promise<SpatialModel3DComponent>;
+    } & CreateResourceOptions): Promise<SpatialModel3DComponent>;
     /**
      * Creates a InputComponent
      * [Experimental] Creates a InputComponent used to handle click and drag events of the entity containing a model
      * @returns InputComponent
      */
-    createInputComponent(): Promise<SpatialInputComponent>;
+    createInputComponent(options?: CreateResourceOptions): Promise<SpatialInputComponent>;
     /**
      * Creates a MeshResource containing geometry data
      * @returns MeshResource
      */
     createMeshResource(options?: {
         shape?: string;
-    }): Promise<SpatialMeshResource>;
+    } & CreateResourceOptions): Promise<SpatialMeshResource>;
     /**
      * Creates a PhysicallyBasedMaterial containing PBR material data
      * @returns PhysicallyBasedMaterial
      */
-    createPhysicallyBasedMaterialResource(options?: {}): Promise<SpatialPhysicallyBasedMaterialResource>;
+    createPhysicallyBasedMaterialResource(options?: {} & CreateResourceOptions): Promise<SpatialPhysicallyBasedMaterialResource>;
     /**
      * Creates a WindowContainer
      * @returns SpatialWindowContainer
      * */
     createWindowContainer(options?: {
         style: WindowStyle;
-        windowContainer?: SpatialWindowContainer | null;
-        windowComponent?: SpatialWindowComponent | null;
-    }): Promise<SpatialWindowContainer>;
+    } & CreateResourceOptions): Promise<SpatialWindowContainer>;
     /**
      * Creates a Scene to display content within an anchored area managed by the OS
      * @hidden

package/dist/core/SpatialSession.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SpatialSession.d.ts","sourceRoot":"","sources":["../../src/core/SpatialSession.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAA;AAMjE,OAAO,EACL,iBAAiB,EACjB,cAAc,EAEd,WAAW,EACZ,MAAM,SAAS,CAAA;AAEhB,OAAO,EACL,mBAAmB,EACnB,sCAAsC,EACvC,MAAM,YAAY,CAAA;AACnB,OAAO,EACL,qBAAqB,EACrB,qBAAqB,EACrB,sBAAsB,EACtB,oBAAoB,EACpB,uBAAuB,EACxB,MAAM,aAAa,CAAA;AAGpB;;GAEG;AACH,KAAK,YAAY,GAAG,CAAC,IAAI,EAAE,mBAAmB,KAAK,OAAO,CAAC,GAAG,CAAC,CAAA;AA4B/D;;GAEG;AACH,qBAAa,cAAc;IACzB,cAAc;IACd,sBAAsB,iBAAwB;IAC9C,cAAc;IACd,iBAAiB,UAAQ;IAEzB;;;OAGG;IACH,8BAA8B,CAAC,QAAQ,EAAE,YAAY;IAerD;;;OAGG;IACG,YAAY;IASlB;;;;OAIG;IACG,qBAAqB,CAAC,OAAO,CAAC,EAAE;QACpC,eAAe,CAAC,EAAE,sBAAsB,CAAA;KACzC;IAWD;;;OAGG;IACG,mBAAmB,CAAC,OAAO,CAAC,EAAE;QAClC,eAAe,CAAC,EAAE,sBAAsB,CAAA;KACzC;IAWD;;;OAGG;IACG,oBAAoB,CAAC,OAAO,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE;IAcpD;;;OAGG;IACG,sBAAsB,CAAC,OAAO,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE;IActD;;;;OAIG;IACG,oBAAoB;IAS1B;;;OAGG;IACG,kBAAkB,CAAC,OAAO,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE;IAUrD;;;OAGG;IACG,qCAAqC,CAAC,OAAO,CAAC,EAAE,EAAE;IASxD;;;SAGK;IACC,qBAAqB,CAAC,OAAO,CAAC,EAAE;QACpC,KAAK,EAAE,WAAW,CAAA;QAClB,eAAe,CAAC,EAAE,sBAAsB,GAAG,IAAI,CAAA;QAC/C,eAAe,CAAC,EAAE,sBAAsB,GAAG,IAAI,CAAA;KAChD;IAYD;;;;;;OAMG;IACG,YAAY,CAChB,KAAK,EAAE,WAAW,YAAU,EAC5B,GAAG,EAAE;QACH,SAAS,EAAE,cAAc,CAAA;KAC1B;IAKH;;;;OAIG;IACH,yBAAyB;IAIzB;;;OAGG;IACG,wBAAwB;IAgB9B;;;OAGG;IACG,GAAG,CAAC,GAAG,GAAG,EAAE,GAAG,EAAE;IAUvB;;;OAGG;IACG,KAAK,CAAC,GAAG,EAAE,MAAM;IAIvB;;;;OAIG;IACG,SAAS;iBACsC,GAAG;oBAAc,GAAG;;IAGzE;;OAEG;IACG,QAAQ,CAAC,eAAe,GAAE,MAA2C;IAI3E;;OAEG;IACG,2BAA2B;IAIjC,gCAAgC;IAC1B,kBAAkB;IAIxB,iCAAiC;IAC3B,qBAAqB;IAI3B,OAAO,CAAC,MAAM,CAAC,yBAAyB,CACD;IACvC;;;OAGG;IACG,2BAA2B;IAYjC,OAAO,CAAC,MAAM,CAAC,uBAAuB,CAAwC;IAE9E;;;;OAIG;IACH,yBAAyB;IAWzB;;;;OAIG;IACH,WAAW,CAAC,EAAE,EAAE,QAAQ;IAMxB;;;OAGG;IACG,mBAAmB;IAgCzB,cAAc;IACR,UAAU,CAAC,EAAE,EAAE,MAAM;IAoB3B,cAAc;IACR,UAAU,CAAC,MAAM,EAAE,iBAAiB,EAAE,KAAK,CAAC,EAAE,MAAM;CAG3D"}
+{"version":3,"file":"SpatialSession.d.ts","sourceRoot":"","sources":["../../src/core/SpatialSession.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAA;AAMjE,OAAO,EACL,iBAAiB,EACjB,cAAc,EAEd,WAAW,EACZ,MAAM,SAAS,CAAA;AAEhB,OAAO,EACL,mBAAmB,EACnB,sCAAsC,EACvC,MAAM,YAAY,CAAA;AACnB,OAAO,EACL,qBAAqB,EACrB,qBAAqB,EACrB,sBAAsB,EACtB,oBAAoB,EACpB,uBAAuB,EACxB,MAAM,aAAa,CAAA;AAGpB,KAAK,qBAAqB,GAAG;IAC3B,eAAe,CAAC,EAAE,sBAAsB,GAAG,IAAI,CAAA;IAC/C,eAAe,CAAC,EAAE,sBAAsB,GAAG,IAAI,CAAA;CAChD,CAAA;AAED;;GAEG;AACH,KAAK,YAAY,GAAG,CAAC,IAAI,EAAE,mBAAmB,KAAK,OAAO,CAAC,GAAG,CAAC,CAAA;AA2B/D;;GAEG;AACH,qBAAa,cAAc;IACzB,cAAc;IACd,sBAAsB,iBAAwB;IAC9C,cAAc;IACd,iBAAiB,UAAQ;IAEzB;;;OAGG;IACH,8BAA8B,CAAC,QAAQ,EAAE,YAAY;IAerD;;;OAGG;IACG,YAAY,CAAC,OAAO,CAAC,EAAE,qBAAqB;IAUlD;;;;OAIG;IACG,qBAAqB,CAAC,OAAO,CAAC,EAAE,qBAAqB;IAU3D;;;OAGG;IACG,mBAAmB,CAAC,OAAO,CAAC,EAAE,qBAAqB;IAUzD;;;OAGG;IACG,oBAAoB,CACxB,OAAO,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,qBAAqB;IAgBnD;;;OAGG;IACG,sBAAsB,CAC1B,OAAO,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,qBAAqB;IAgBnD;;;;OAIG;IACG,oBAAoB,CAAC,OAAO,CAAC,EAAE,qBAAqB;IAU1D;;;OAGG;IACG,kBAAkB,CACtB,OAAO,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,qBAAqB;IAYtD;;;OAGG;IACG,qCAAqC,CACzC,OAAO,CAAC,EAAE,EAAE,GAAG,qBAAqB;IAWtC;;;SAGK;IACC,qBAAqB,CACzB,OAAO,CAAC,EAAE;QACR,KAAK,EAAE,WAAW,CAAA;KACnB,GAAG,qBAAqB;IAa3B;;;;;;OAMG;IACG,YAAY,CAChB,KAAK,EAAE,WAAW,YAAU,EAC5B,GAAG,EAAE;QACH,SAAS,EAAE,cAAc,CAAA;KAC1B;IAKH;;;;OAIG;IACH,yBAAyB;IAIzB;;;OAGG;IACG,wBAAwB;IAgB9B;;;OAGG;IACG,GAAG,CAAC,GAAG,GAAG,EAAE,GAAG,EAAE;IAUvB;;;OAGG;IACG,KAAK,CAAC,GAAG,EAAE,MAAM;IAIvB;;;;OAIG;IACG,SAAS;iBACsC,GAAG;oBAAc,GAAG;;IAGzE;;OAEG;IACG,QAAQ,CAAC,eAAe,GAAE,MAA2C;IAI3E;;OAEG;IACG,2BAA2B;IAIjC,gCAAgC;IAC1B,kBAAkB;IAIxB,iCAAiC;IAC3B,qBAAqB;IAI3B,OAAO,CAAC,MAAM,CAAC,yBAAyB,CACD;IACvC;;;OAGG;IACG,2BAA2B;IAYjC,OAAO,CAAC,MAAM,CAAC,uBAAuB,CAAwC;IAE9E;;;;OAIG;IACH,yBAAyB;IAWzB;;;;OAIG;IACH,WAAW,CAAC,EAAE,EAAE,QAAQ;IAMxB;;;OAGG;IACG,mBAAmB;IAgCzB,cAAc;IACR,UAAU,CAAC,EAAE,EAAE,MAAM;IAoB3B,cAAc;IACR,UAAU,CAAC,MAAM,EAAE,iBAAiB,EAAE,KAAK,CAAC,EAAE,MAAM;CAG3D"}

package/dist/core/SpatialSession.js

@@ -51,8 +51,9 @@ export class SpatialSession {
      * Creates a Entity
      * @returns Entity
      */
-    async createEntity() {
-        let entity = await WebSpatial.createResource('Entity', WebSpatial.getCurrentWindowContainer(), WebSpatial.getCurrentWebPanel());
+    async createEntity(options) {
+        var [parentWindowContainer, parentWindow] = _parseParentResources(options);
+        let entity = await WebSpatial.createResource('Entity', parentWindowContainer, parentWindow);
         return new SpatialEntity(entity);
     }
     /**
@@ -61,9 +62,8 @@ export class SpatialSession {
      * @returns WindowComponent
      */
     async createWindowComponent(options) {
-        let entity = await WebSpatial.createResource('SpatialWebView', options?.windowContainer
-            ? options?.windowContainer._wg
-            : WebSpatial.getCurrentWindowContainer(), WebSpatial.getCurrentWebPanel());
+        var [parentWindowContainer, parentWindow] = _parseParentResources(options);
+        let entity = await WebSpatial.createResource('SpatialWebView', parentWindowContainer, parentWindow);
         return new SpatialWindowComponent(entity);
     }
     /**
@@ -71,9 +71,8 @@ export class SpatialSession {
      * @returns SpatialViewComponent
      */
     async createViewComponent(options) {
-        let entity = await WebSpatial.createResource('SpatialView', options?.windowContainer
-            ? options?.windowContainer._wg
-            : WebSpatial.getCurrentWindowContainer(), WebSpatial.getCurrentWebPanel());
+        var [parentWindowContainer, parentWindow] = _parseParentResources(options);
+        let entity = await WebSpatial.createResource('SpatialView', parentWindowContainer, parentWindow);
         return new SpatialViewComponent(entity);
     }
     /**
@@ -81,11 +80,12 @@ export class SpatialSession {
      * @returns ModelComponent
      */
     async createModelComponent(options) {
+        var [parentWindowContainer, parentWindow] = _parseParentResources(options);
         var opts = undefined;
         if (options) {
             opts = { modelURL: options.url };
         }
-        let entity = await WebSpatial.createResource('ModelComponent', WebSpatial.getCurrentWindowContainer(), WebSpatial.getCurrentWebPanel(), opts);
+        let entity = await WebSpatial.createResource('ModelComponent', parentWindowContainer, parentWindow, opts);
         return new SpatialModelComponent(entity);
     }
     /**
@@ -93,11 +93,12 @@ export class SpatialSession {
      * @returns Model3DComponent
      */
     async createModel3DComponent(options) {
+        var [parentWindowContainer, parentWindow] = _parseParentResources(options);
         var opts = undefined;
         if (options) {
             opts = { modelURL: options.url };
         }
-        let entity = await WebSpatial.createResource('Model3DComponent', WebSpatial.getCurrentWindowContainer(), WebSpatial.getCurrentWebPanel(), opts);
+        let entity = await WebSpatial.createResource('Model3DComponent', parentWindowContainer, parentWindow, opts);
         return new SpatialModel3DComponent(entity);
     }
     /**
@@ -105,8 +106,9 @@ export class SpatialSession {
      * [Experimental] Creates a InputComponent used to handle click and drag events of the entity containing a model
      * @returns InputComponent
      */
-    async createInputComponent() {
-        let entity = await WebSpatial.createResource('InputComponent', WebSpatial.getCurrentWindowContainer(), WebSpatial.getCurrentWebPanel());
+    async createInputComponent(options) {
+        var [parentWindowContainer, parentWindow] = _parseParentResources(options);
+        let entity = await WebSpatial.createResource('InputComponent', parentWindowContainer, parentWindow);
         return new SpatialInputComponent(entity);
     }
     /**
@@ -114,7 +116,8 @@ export class SpatialSession {
      * @returns MeshResource
      */
     async createMeshResource(options) {
-        let entity = await WebSpatial.createResource('MeshResource', WebSpatial.getCurrentWindowContainer(), WebSpatial.getCurrentWebPanel(), options);
+        var [parentWindowContainer, parentWindow] = _parseParentResources(options);
+        let entity = await WebSpatial.createResource('MeshResource', parentWindowContainer, parentWindow, options);
         return new SpatialMeshResource(entity);
     }
     /**
@@ -122,7 +125,8 @@ export class SpatialSession {
      * @returns PhysicallyBasedMaterial
      */
     async createPhysicallyBasedMaterialResource(options) {
-        let entity = await WebSpatial.createResource('PhysicallyBasedMaterial', WebSpatial.getCurrentWindowContainer(), WebSpatial.getCurrentWebPanel(), options);
+        var [parentWindowContainer, parentWindow] = _parseParentResources(options);
+        let entity = await WebSpatial.createResource('PhysicallyBasedMaterial', parentWindowContainer, parentWindow, options);
         return new SpatialPhysicallyBasedMaterialResource(entity);
     }
     /**

package/dist/core/component/SpatialModel3DComponent.d.ts

@@ -38,6 +38,11 @@ export declare class SpatialModel3DComponent extends EventSpatialComponent {
      * @param aspectRatio number
      */
     setAspectRatio(aspectRatio: number): Promise<void>;
+    /**
+     * Defaults to false. If set to true, scrolling the parent page will also scroll this window with it like other dom elements
+     * @param scrollWithParent value to set
+     */
+    setScrollWithParent(scrollWithParent: boolean): Promise<void>;
     /**
      * Sets whether the model appear in original size or fit the rect
      * @param resizable

package/dist/core/component/SpatialModel3DComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SpatialModel3DComponent.d.ts","sourceRoot":"","sources":["../../../src/core/component/SpatialModel3DComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAE/D,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAA;AAE1C;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC,SAAS,EAAE,WAAW,GAAG,SAAS,GAAG,MAAM,CAAA;IAC3C,aAAa,EAAE,IAAI,CAAA;IACnB,eAAe,EAAE,IAAI,CAAA;CACtB,CAAA;AAED,MAAM,MAAM,QAAQ,GAAG;IACrB,SAAS,EAAE,KAAK,CAAA;CACjB,CAAA;AAED;;GAEG;AACH,qBAAa,uBAAwB,SAAQ,qBAAqB;cAC7C,WAAW,CAAC,IAAI,EAAE,GAAG,GAAG,IAAI;IAiC/C;;OAEG;IACG,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;IAM3C,iBAAiB,CAAC,cAAc,EAAE,IAAI;IAM5C;;;OAGG;IACG,UAAU,CAAC,OAAO,EAAE,MAAM;IAMhC;;;OAGG;IACG,cAAc,CAAC,WAAW,EAAE,MAAM,GAAG,KAAK;IAMhD;;;;;OAKG;IACG,cAAc,CAAC,WAAW,EAAE,MAAM;IAMxC;;;OAGG;IACG,YAAY,CAAC,SAAS,EAAE,OAAO;IAMrC;;OAEG;IACI,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IAE7B;;;OAGG;IACI,SAAS,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;IAEhD;;;OAGG;IACH,OAAO,CAAC,YAAY,CAAC,CAA4C;IACjE,IAAW,WAAW,CACpB,QAAQ,EAAE,CAAC,CAAC,SAAS,EAAE,qBAAqB,KAAK,IAAI,CAAC,GAAG,SAAS,EAQnE;IAED;;;OAGG;IACH,OAAO,CAAC,OAAO,CAAC,CAA4C;IAC5D,IAAW,MAAM,CACf,QAAQ,EAAE,CAAC,CAAC,SAAS,EAAE,qBAAqB,KAAK,IAAI,CAAC,GAAG,SAAS,EAQnE;IAED;;;OAGG;IACH,OAAO,CAAC,UAAU,CAAC,CAA4C;IAC/D,IAAW,SAAS,CAClB,QAAQ,EAAE,CAAC,CAAC,SAAS,EAAE,qBAAqB,KAAK,IAAI,CAAC,GAAG,SAAS,EAQnE;IAED,OAAO,KAAK,eAAe,GAM1B;IAED;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,CAAY;IAC3B,IAAW,KAAK,CAAC,QAAQ,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,EAOlD;IAED,kDAAkD;IAClD,OAAO,CAAC,YAAY,CAAC,CAAY;IACjC,IAAW,WAAW,CAAC,QAAQ,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,EAOxD;IAED,iDAAiD;IACjD,OAAO,CAAC,YAAY,CAAC,CAAY;IACjC,IAAW,WAAW,CAAC,QAAQ,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,EAOxD;CACF"}
+{"version":3,"file":"SpatialModel3DComponent.d.ts","sourceRoot":"","sources":["../../../src/core/component/SpatialModel3DComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAE/D,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAA;AAE1C;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG;IAClC,SAAS,EAAE,WAAW,GAAG,SAAS,GAAG,MAAM,CAAA;IAC3C,aAAa,EAAE,IAAI,CAAA;IACnB,eAAe,EAAE,IAAI,CAAA;CACtB,CAAA;AAED,MAAM,MAAM,QAAQ,GAAG;IACrB,SAAS,EAAE,KAAK,CAAA;CACjB,CAAA;AAED;;GAEG;AACH,qBAAa,uBAAwB,SAAQ,qBAAqB;cAC7C,WAAW,CAAC,IAAI,EAAE,GAAG,GAAG,IAAI;IAiC/C;;OAEG;IACG,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;IAM3C,iBAAiB,CAAC,cAAc,EAAE,IAAI;IAM5C;;;OAGG;IACG,UAAU,CAAC,OAAO,EAAE,MAAM;IAMhC;;;OAGG;IACG,cAAc,CAAC,WAAW,EAAE,MAAM,GAAG,KAAK;IAMhD;;;;;OAKG;IACG,cAAc,CAAC,WAAW,EAAE,MAAM;IAMxC;;;OAGG;IACG,mBAAmB,CAAC,gBAAgB,EAAE,OAAO;IAMnD;;;OAGG;IACG,YAAY,CAAC,SAAS,EAAE,OAAO;IAMrC;;OAEG;IACI,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IAE7B;;;OAGG;IACI,SAAS,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;IAEhD;;;OAGG;IACH,OAAO,CAAC,YAAY,CAAC,CAA4C;IACjE,IAAW,WAAW,CACpB,QAAQ,EAAE,CAAC,CAAC,SAAS,EAAE,qBAAqB,KAAK,IAAI,CAAC,GAAG,SAAS,EAQnE;IAED;;;OAGG;IACH,OAAO,CAAC,OAAO,CAAC,CAA4C;IAC5D,IAAW,MAAM,CACf,QAAQ,EAAE,CAAC,CAAC,SAAS,EAAE,qBAAqB,KAAK,IAAI,CAAC,GAAG,SAAS,EAQnE;IAED;;;OAGG;IACH,OAAO,CAAC,UAAU,CAAC,CAA4C;IAC/D,IAAW,SAAS,CAClB,QAAQ,EAAE,CAAC,CAAC,SAAS,EAAE,qBAAqB,KAAK,IAAI,CAAC,GAAG,SAAS,EAQnE;IAED,OAAO,KAAK,eAAe,GAM1B;IAED;;OAEG;IACH,OAAO,CAAC,MAAM,CAAC,CAAY;IAC3B,IAAW,KAAK,CAAC,QAAQ,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,EAOlD;IAED,kDAAkD;IAClD,OAAO,CAAC,YAAY,CAAC,CAAY;IACjC,IAAW,WAAW,CAAC,QAAQ,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,EAOxD;IAED,iDAAiD;IACjD,OAAO,CAAC,YAAY,CAAC,CAAY;IACjC,IAAW,WAAW,CAAC,QAAQ,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,EAOxD;CACF"}

package/dist/core/component/SpatialModel3DComponent.js

@@ -79,6 +79,15 @@ export class SpatialModel3DComponent extends EventSpatialComponent {
             aspectRatio,
         });
     }
+    /**
+     * Defaults to false. If set to true, scrolling the parent page will also scroll this window with it like other dom elements
+     * @param scrollWithParent value to set
+     */
+    async setScrollWithParent(scrollWithParent) {
+        await WebSpatial.updateResource(this._resource, {
+            scrollWithParent: scrollWithParent,
+        });
+    }
     /**
      * Sets whether the model appear in original size or fit the rect
      * @param resizable

package/dist/core/private/WebSpatial.d.ts

@@ -35,7 +35,7 @@ export declare class WebSpatial {
     static inspectRootWindowContainer(): Promise<any>;
     static setComponent(entity: WebSpatialResource, resource: WebSpatialResource): Promise<void>;
     static removeComponent(entity: WebSpatialResource, resource: WebSpatialResource): Promise<void>;
-    static createResource(type: string, windowContainer: WindowContainer, parentWebView: WebSpatialResource, params?: any): Promise<WebSpatialResource>;
+    static createResource(type: string, windowContainer: WindowContainer | null, parentWebView: WebSpatialResource | null, params?: any): Promise<WebSpatialResource>;
     static updateWindowContainer(wg: WindowContainer, data: any): Promise<unknown>;
     static updateResource(resource: WebSpatialResource, data?: any): Promise<unknown>;
     static setLoading(method: LoadingMethodKind, style?: string): Promise<unknown>;

package/dist/core/private/WebSpatial.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WebSpatial.d.ts","sourceRoot":"","sources":["../../../src/core/private/WebSpatial.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,EACL,WAAW,EAEX,iBAAiB,EACjB,cAAc,EAEf,MAAM,UAAU,CAAA;AAEjB,qBAAa,eAAe;IAC1B,EAAE,SAAK;CACR;AAED,qBAAa,kBAAkB;IAC7B,EAAE,SAAK;IACP,iBAAiB,SAAK;IACtB,IAAI,EAAS,GAAG,CAAA;IAEhB,YAAY;CACb;AAED,qBAAa,UAAU;IACrB,OAAc,aAAa,EAAE,GAAG,CAAK;IAErC,OAAc,kBAAkB,UAAQ;IACxC,OAAc,mBAAmB,kBAAyB;IAG1D,OAAO,CAAC,MAAM,CAAC,cAAc,CACzB;WAEU,qBAAqB,CACjC,UAAU,EAAE,MAAM,EAClB,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI;WAKjB,uBAAuB,CAAC,UAAU,EAAE,MAAM;IAIxD,MAAM,CAAC,IAAI;IAkBX,MAAM,CAAC,gBAAgB;WAKV,eAAe;IAa5B,MAAM,CAAC,UAAU;WAQJ,WAAW,CAAC,GAAG,EAAE,aAAa;IAoB3C,MAAM,CAAC,2BAA2B;IAMlC,MAAM,CAAC,yBAAyB;IAMhC,MAAM,CAAC,kBAAkB;WAOZ,WAAW,CACtB,KAAK,EAAE,WAAW,YAAU,EAC5B,GAAG,EAAE;QACH,SAAS,EAAE,cAAc,CAAA;KAC1B;WAyBU,qBAAqB,CAChC,KAAK,EAAE,WAAW,YAAU,EAC5B,eAAe,EAAE,eAAe,GAAG,IAAI,EACvC,aAAa,EAAE,kBAAkB,GAAG,IAAI;WAiB7B,eAAe,CAAC,QAAQ,EAAE,kBAAkB;WAU5C,IAAI,CAAC,GAAG,EAAE,MAAM;WAmBhB,QAAQ;WAaR,OAAO,CAAC,eAAe,EAAE,MAAM;WAa/B,0BAA0B;WAI1B,YAAY,CACvB,MAAM,EAAE,kBAAkB,EAC1B,QAAQ,EAAE,kBAAkB;WAWjB,eAAe,CAC1B,MAAM,EAAE,kBAAkB,EAC1B,QAAQ,EAAE,kBAAkB;WAajB,cAAc,CACzB,IAAI,EAAE,MAAM,EACZ,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,kBAAkB,EACjC,MAAM,GAAS,GAAG;WAmBP,qBAAqB,CAAC,EAAE,EAAE,eAAe,EAAE,IAAI,EAAE,GAAG;WAapD,cAAc,CAAC,QAAQ,EAAE,kBAAkB,EAAE,IAAI,GAAE,GAAU;WAc7D,UAAU,CAAC,MAAM,EAAE,iBAAiB,EAAE,KAAK,CAAC,EAAE,MAAM;WAgBpD,kBAAkB;WAKlB,qBAAqB;IAKlC,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,CAAC;CAiBrD"}
+{"version":3,"file":"WebSpatial.d.ts","sourceRoot":"","sources":["../../../src/core/private/WebSpatial.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,EACL,WAAW,EAEX,iBAAiB,EACjB,cAAc,EAEf,MAAM,UAAU,CAAA;AAEjB,qBAAa,eAAe;IAC1B,EAAE,SAAK;CACR;AAED,qBAAa,kBAAkB;IAC7B,EAAE,SAAK;IACP,iBAAiB,SAAK;IACtB,IAAI,EAAS,GAAG,CAAA;IAEhB,YAAY;CACb;AAED,qBAAa,UAAU;IACrB,OAAc,aAAa,EAAE,GAAG,CAAK;IAErC,OAAc,kBAAkB,UAAQ;IACxC,OAAc,mBAAmB,kBAAyB;IAG1D,OAAO,CAAC,MAAM,CAAC,cAAc,CACzB;WAEU,qBAAqB,CACjC,UAAU,EAAE,MAAM,EAClB,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI;WAKjB,uBAAuB,CAAC,UAAU,EAAE,MAAM;IAIxD,MAAM,CAAC,IAAI;IAkBX,MAAM,CAAC,gBAAgB;WAKV,eAAe;IAa5B,MAAM,CAAC,UAAU;WAQJ,WAAW,CAAC,GAAG,EAAE,aAAa;IAoB3C,MAAM,CAAC,2BAA2B;IAMlC,MAAM,CAAC,yBAAyB;IAMhC,MAAM,CAAC,kBAAkB;WAOZ,WAAW,CACtB,KAAK,EAAE,WAAW,YAAU,EAC5B,GAAG,EAAE;QACH,SAAS,EAAE,cAAc,CAAA;KAC1B;WAyBU,qBAAqB,CAChC,KAAK,EAAE,WAAW,YAAU,EAC5B,eAAe,EAAE,eAAe,GAAG,IAAI,EACvC,aAAa,EAAE,kBAAkB,GAAG,IAAI;WAiB7B,eAAe,CAAC,QAAQ,EAAE,kBAAkB;WAU5C,IAAI,CAAC,GAAG,EAAE,MAAM;WAmBhB,QAAQ;WAaR,OAAO,CAAC,eAAe,EAAE,MAAM;WAa/B,0BAA0B;WAI1B,YAAY,CACvB,MAAM,EAAE,kBAAkB,EAC1B,QAAQ,EAAE,kBAAkB;WAWjB,eAAe,CAC1B,MAAM,EAAE,kBAAkB,EAC1B,QAAQ,EAAE,kBAAkB;WAajB,cAAc,CACzB,IAAI,EAAE,MAAM,EACZ,eAAe,EAAE,eAAe,GAAG,IAAI,EACvC,aAAa,EAAE,kBAAkB,GAAG,IAAI,EACxC,MAAM,GAAS,GAAG;WAmBP,qBAAqB,CAAC,EAAE,EAAE,eAAe,EAAE,IAAI,EAAE,GAAG;WAapD,cAAc,CAAC,QAAQ,EAAE,kBAAkB,EAAE,IAAI,GAAE,GAAU;WAc7D,UAAU,CAAC,MAAM,EAAE,iBAAiB,EAAE,KAAK,CAAC,EAAE,MAAM;WAgBpD,kBAAkB;WAKlB,qBAAqB;IAKlC,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,CAAC;CAiBrD"}

package/dist/core/private/WebSpatial.js

@@ -206,8 +206,8 @@ export class WebSpatial {
     // parentWebView is the SpatialWebView that the resource will be tied to (if not provided, resource will continue to exist even if this page is unloaded)
     static async createResource(type, windowContainer, parentWebView, params = {}) {
         var cmd = new RemoteCommand('createResource', {
-            windowContainerID: windowContainer.id,
-            resourceID: parentWebView.id,
+            windowContainerID: windowContainer ? windowContainer.id : undefined,
+            resourceID: parentWebView ? parentWebView.id : undefined,
             type: type,
             params: params,
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webspatial/core-sdk",
-  "version": "0.0.3",
+  "version": "0.0.4-alpha.0",
   "description": "this is runtime for webspatial",
   "main": "dist/index.js",
   "types": "dist/index.d.js",

package/src/core/SpatialHelper.ts

@@ -88,11 +88,21 @@ export class SpatialHelper {
       }
 
       // Create window container
-      var wg = await this.session.createWindowContainer({ style: 'Plain' })
+      var wg = await this.session.createWindowContainer({
+        style: 'Plain',
+        windowComponent: null,
+        windowContainer: null,
+      })
 
       // Create a root entity displaying a webpage
-      var ent = await this.session!.createEntity()
-      var i = await this.session!.createWindowComponent({ windowContainer: wg })
+      var ent = await this.session!.createEntity({
+        windowComponent: null,
+        windowContainer: wg,
+      })
+      var i = await this.session!.createWindowComponent({
+        windowComponent: null,
+        windowContainer: wg,
+      })
       await i.loadURL(url)
       await ent.setCoordinateSpace('Root')
       await ent.setComponent(i)
@@ -109,22 +119,41 @@ export class SpatialHelper {
       url: string,
       options?: { resolution: { width: number; height: number } },
     ) => {
-      var wg = await this.session.createWindowContainer({ style: 'Volumetric' })
+      var wg = await this.session.createWindowContainer({
+        style: 'Volumetric',
+        windowComponent: null,
+        windowContainer: null,
+      })
 
       // Create a root view entity within the window container
-      var rootEnt = await this.session!.createEntity()
+      var rootEnt = await this.session!.createEntity({
+        windowComponent: null,
+        windowContainer: wg,
+      })
       await rootEnt.setComponent(
-        await this.session!.createViewComponent({ windowContainer: wg }),
+        await this.session!.createViewComponent({
+          windowComponent: null,
+          windowContainer: wg,
+        }),
       )
       await rootEnt.setCoordinateSpace('Root')
       await wg.setRootEntity(rootEnt)
 
       // Add webpage to the window container
-      var ent = await this.session!.createEntity()
-      var i = await this.session!.createWindowComponent({ windowContainer: wg })
+      var ent = await this.session!.createEntity({
+        windowComponent: null,
+        windowContainer: wg,
+      })
+      var i = await this.session!.createWindowComponent({
+        windowComponent: null,
+        windowContainer: wg,
+      })
       await i.loadURL(url)
       if (options?.resolution) {
-        await i.setResolution(options.resolution.width, options.resolution.height)
+        await i.setResolution(
+          options.resolution.width,
+          options.resolution.height,
+        )
       } else {
         await i.setResolution(1000, 1000)
       }

package/src/core/SpatialSession.ts

@@ -25,6 +25,11 @@ import {
 } from './component'
 import { RemoteCommand } from './private/remote-command'
 
+type CreateResourceOptions = {
+  windowContainer?: SpatialWindowContainer | null
+  windowComponent?: SpatialWindowComponent | null
+}
+
 /**
  * Animation callback with timestamp
  */
@@ -35,10 +40,9 @@ type animCallback = (time: DOMHighResTimeStamp) => Promise<any>
  * @param options
  * @returns parsed results
  */
-function _parseParentResources(options?: {
-  windowContainer?: SpatialWindowContainer | null
-  windowComponent?: SpatialWindowComponent | null
-}): [WindowContainer | null, WebSpatialResource | null] {
+function _parseParentResources(
+  options?: CreateResourceOptions,
+): [WindowContainer | null, WebSpatialResource | null] {
   var parentWindowContainer: WindowContainer | null = null
   if (options?.windowContainer !== null) {
     parentWindowContainer = options?.windowContainer
@@ -88,11 +92,12 @@ export class SpatialSession {
    * Creates a Entity
    * @returns Entity
    */
-  async createEntity() {
+  async createEntity(options?: CreateResourceOptions) {
+    var [parentWindowContainer, parentWindow] = _parseParentResources(options)
     let entity = await WebSpatial.createResource(
       'Entity',
-      WebSpatial.getCurrentWindowContainer(),
-      WebSpatial.getCurrentWebPanel(),
+      parentWindowContainer,
+      parentWindow,
     )
     return new SpatialEntity(entity)
   }
@@ -102,15 +107,12 @@ export class SpatialSession {
    * [TODO] should creation of components be moved to entity? and these made private?
    * @returns WindowComponent
    */
-  async createWindowComponent(options?: {
-    windowContainer?: SpatialWindowContainer
-  }) {
+  async createWindowComponent(options?: CreateResourceOptions) {
+    var [parentWindowContainer, parentWindow] = _parseParentResources(options)
     let entity = await WebSpatial.createResource(
       'SpatialWebView',
-      options?.windowContainer
-        ? options?.windowContainer._wg
-        : WebSpatial.getCurrentWindowContainer(),
-      WebSpatial.getCurrentWebPanel(),
+      parentWindowContainer,
+      parentWindow,
     )
     return new SpatialWindowComponent(entity)
   }
@@ -119,15 +121,12 @@ export class SpatialSession {
    * Creates a ViewComponent used to display 3D content within the entity
    * @returns SpatialViewComponent
    */
-  async createViewComponent(options?: {
-    windowContainer?: SpatialWindowContainer
-  }) {
+  async createViewComponent(options?: CreateResourceOptions) {
+    var [parentWindowContainer, parentWindow] = _parseParentResources(options)
     let entity = await WebSpatial.createResource(
       'SpatialView',
-      options?.windowContainer
-        ? options?.windowContainer._wg
-        : WebSpatial.getCurrentWindowContainer(),
-      WebSpatial.getCurrentWebPanel(),
+      parentWindowContainer,
+      parentWindow,
     )
     return new SpatialViewComponent(entity)
   }
@@ -136,15 +135,18 @@ export class SpatialSession {
    * Creates a ModelComponent used to display geometry + material of a 3D model
    * @returns ModelComponent
    */
-  async createModelComponent(options?: { url: string }) {
+  async createModelComponent(
+    options?: { url: string } & CreateResourceOptions,
+  ) {
+    var [parentWindowContainer, parentWindow] = _parseParentResources(options)
     var opts = undefined
     if (options) {
       opts = { modelURL: options.url }
     }
     let entity = await WebSpatial.createResource(
       'ModelComponent',
-      WebSpatial.getCurrentWindowContainer(),
-      WebSpatial.getCurrentWebPanel(),
+      parentWindowContainer,
+      parentWindow,
       opts,
     )
     return new SpatialModelComponent(entity)
@@ -154,15 +156,18 @@ export class SpatialSession {
    * Creates a Model3DComponent
    * @returns Model3DComponent
    */
-  async createModel3DComponent(options?: { url: string }) {
+  async createModel3DComponent(
+    options?: { url: string } & CreateResourceOptions,
+  ) {
+    var [parentWindowContainer, parentWindow] = _parseParentResources(options)
     var opts = undefined
     if (options) {
       opts = { modelURL: options.url }
     }
     let entity = await WebSpatial.createResource(
       'Model3DComponent',
-      WebSpatial.getCurrentWindowContainer(),
-      WebSpatial.getCurrentWebPanel(),
+      parentWindowContainer,
+      parentWindow,
       opts,
     )
     return new SpatialModel3DComponent(entity)
@@ -173,11 +178,12 @@ export class SpatialSession {
    * [Experimental] Creates a InputComponent used to handle click and drag events of the entity containing a model
    * @returns InputComponent
    */
-  async createInputComponent() {
+  async createInputComponent(options?: CreateResourceOptions) {
+    var [parentWindowContainer, parentWindow] = _parseParentResources(options)
     let entity = await WebSpatial.createResource(
       'InputComponent',
-      WebSpatial.getCurrentWindowContainer(),
-      WebSpatial.getCurrentWebPanel(),
+      parentWindowContainer,
+      parentWindow,
     )
     return new SpatialInputComponent(entity)
   }
@@ -186,11 +192,14 @@ export class SpatialSession {
    * Creates a MeshResource containing geometry data
    * @returns MeshResource
    */
-  async createMeshResource(options?: { shape?: string }) {
+  async createMeshResource(
+    options?: { shape?: string } & CreateResourceOptions,
+  ) {
+    var [parentWindowContainer, parentWindow] = _parseParentResources(options)
     let entity = await WebSpatial.createResource(
       'MeshResource',
-      WebSpatial.getCurrentWindowContainer(),
-      WebSpatial.getCurrentWebPanel(),
+      parentWindowContainer,
+      parentWindow,
       options,
     )
     return new SpatialMeshResource(entity)
@@ -200,11 +209,14 @@ export class SpatialSession {
    * Creates a PhysicallyBasedMaterial containing PBR material data
    * @returns PhysicallyBasedMaterial
    */
-  async createPhysicallyBasedMaterialResource(options?: {}) {
+  async createPhysicallyBasedMaterialResource(
+    options?: {} & CreateResourceOptions,
+  ) {
+    var [parentWindowContainer, parentWindow] = _parseParentResources(options)
     let entity = await WebSpatial.createResource(
       'PhysicallyBasedMaterial',
-      WebSpatial.getCurrentWindowContainer(),
-      WebSpatial.getCurrentWebPanel(),
+      parentWindowContainer,
+      parentWindow,
       options,
     )
     return new SpatialPhysicallyBasedMaterialResource(entity)
@@ -213,11 +225,11 @@ export class SpatialSession {
    * Creates a WindowContainer
    * @returns SpatialWindowContainer
    * */
-  async createWindowContainer(options?: {
-    style: WindowStyle
-    windowContainer?: SpatialWindowContainer | null
-    windowComponent?: SpatialWindowComponent | null
-  }) {
+  async createWindowContainer(
+    options?: {
+      style: WindowStyle
+    } & CreateResourceOptions,
+  ) {
     var style = options?.style ? options?.style : 'Plain'
     var [parentWindowContainer, parentWindow] = _parseParentResources(options)
     return new SpatialWindowContainer(

package/src/core/component/SpatialModel3DComponent.ts

@@ -99,6 +99,16 @@ export class SpatialModel3DComponent extends EventSpatialComponent {
     })
   }
 
+  /**
+   * Defaults to false. If set to true, scrolling the parent page will also scroll this window with it like other dom elements
+   * @param scrollWithParent value to set
+   */
+  async setScrollWithParent(scrollWithParent: boolean) {
+    await WebSpatial.updateResource(this._resource, {
+      scrollWithParent: scrollWithParent,
+    })
+  }
+
   /**
    * Sets whether the model appear in original size or fit the rect
    * @param resizable

package/src/core/private/WebSpatial.ts

@@ -16,7 +16,7 @@ export class WebSpatialResource {
   windowContainerId = ''
   data = {} as any
 
-  receiveEvent() {}
+  receiveEvent() { }
 }
 
 export class WebSpatial {
@@ -41,7 +41,7 @@ export class WebSpatial {
   }
 
   static init() {
-    ;(window as any).__SpatialWebEvent = (e: any) => {
+    ; (window as any).__SpatialWebEvent = (e: any) => {
       if (e.resourceId) {
         var callback = WebSpatial.eventReceivers[e.resourceId]
         callback(e.data)
@@ -96,10 +96,10 @@ export class WebSpatial {
     var msg = JSON.stringify(cmd)
 
     if (WebSpatial.getBackend() == 'AVP') {
-      ;(window as any).webkit.messageHandlers.bridge.postMessage(msg)
+      ; (window as any).webkit.messageHandlers.bridge.postMessage(msg)
       return
     } else {
-      ;(window as any).bridge.nativeMessage(msg)
+      ; (window as any).bridge.nativeMessage(msg)
       return
     }
   }
@@ -261,13 +261,13 @@ export class WebSpatial {
   // parentWebView is the SpatialWebView that the resource will be tied to (if not provided, resource will continue to exist even if this page is unloaded)
   static async createResource(
     type: string,
-    windowContainer: WindowContainer,
-    parentWebView: WebSpatialResource,
+    windowContainer: WindowContainer | null,
+    parentWebView: WebSpatialResource | null,
     params = {} as any,
   ) {
     var cmd = new RemoteCommand('createResource', {
-      windowContainerID: windowContainer.id,
-      resourceID: parentWebView.id,
+      windowContainerID: windowContainer ? windowContainer.id : undefined,
+      resourceID: parentWebView ? parentWebView.id : undefined,
       type: type,
       params: params,
     })