@webspatial/react-sdk 1.2.0 → 1.2.1

package/dist/default/index.js

@@ -2,7 +2,7 @@
       (function(){
         if(typeof window === 'undefined') return;
         if(!window.__webspatialsdk__) window.__webspatialsdk__ = {}
-        window.__webspatialsdk__['react-sdk-version'] = "1.2.0"
+        window.__webspatialsdk__['react-sdk-version'] = "1.2.1"
         window.__webspatialsdk__['XR_ENV'] = "avp"
     })()
       
@@ -1164,12 +1164,12 @@ function useSync2DFrame(spatialId, portalInstanceObject, spatializedContainerObj
 
 // src/spatialized-container/hooks/useSpatializedElement.ts
 import { useEffect as useEffect6, useState as useState3 } from "react";
-function useSpatializedElement(createSpatializedElement3, portalInstanceObject) {
+function useSpatializedElement(createSpatializedElement2, portalInstanceObject) {
   const [spatializedElement, setSpatializedElement] = useState3();
   useEffect6(() => {
     let isDestroyed = false;
     let spatializedElement2;
-    createSpatializedElement3().then(
+    createSpatializedElement2().then(
       (inSpatializedElement) => {
         if (!isDestroyed) {
           spatializedElement2 = inSpatializedElement;
@@ -1187,7 +1187,7 @@ function useSpatializedElement(createSpatializedElement3, portalInstanceObject)
         spatializedElement2 = void 0;
       }
     };
-  }, [createSpatializedElement3, portalInstanceObject]);
+  }, [createSpatializedElement2, portalInstanceObject]);
   return spatializedElement;
 }
 
@@ -1221,7 +1221,7 @@ function renderPlaceholderInSubPortal(portalInstanceObject, El) {
 function PortalSpatializedContainer(props) {
   const {
     spatializedContent: Content,
-    createSpatializedElement: createSpatializedElement3,
+    createSpatializedElement: createSpatializedElement2,
     getExtraSpatializedElementProperties: getExtraSpatializedElementProperties2,
     onSpatialTap,
     onSpatialDragStart,
@@ -1255,7 +1255,7 @@ function PortalSpatializedContainer(props) {
   }, []);
   useSync2DFrame(spatialId, portalInstanceObject, spatializedContainerObject);
   const spatializedElement = useSpatializedElement(
-    createSpatializedElement3,
+    createSpatializedElement2,
     portalInstanceObject
   );
   const PlaceholderEl = renderPlaceholderInSubPortal(
@@ -1476,7 +1476,7 @@ function SpatializedContainerBase(inprops, ref) {
     const {
       component: Component,
       spatializedContent,
-      createSpatializedElement: createSpatializedElement3,
+      createSpatializedElement: createSpatializedElement2,
       getExtraSpatializedElementProperties: getExtraSpatializedElementProperties2,
       onSpatialTap: onSpatialTap2,
       onSpatialDragStart: onSpatialDragStart2,
@@ -1555,7 +1555,7 @@ function SpatializedContainerBase(inprops, ref) {
       }, [spatialContainerRefProxy.current]);
       const {
         spatializedContent,
-        createSpatializedElement: createSpatializedElement3,
+        createSpatializedElement: createSpatializedElement2,
         getExtraSpatializedElementProperties: getExtraSpatializedElementProperties2,
         ...restProps
       } = props;
@@ -1605,7 +1605,7 @@ function SpatializedContainerBase(inprops, ref) {
     );
     const {
       spatializedContent,
-      createSpatializedElement: createSpatializedElement3,
+      createSpatializedElement: createSpatializedElement2,
       getExtraSpatializedElementProperties: getExtraSpatializedElementProperties2,
       ...restProps
     } = props;
@@ -1815,7 +1815,10 @@ import {
   useCallback as useCallback6,
   useContext as useContext8,
   useEffect as useEffect12,
-  useMemo as useMemo3
+  useMemo as useMemo3,
+  useState as useState6,
+  useImperativeHandle,
+  useRef as useRef4
 } from "react";
 import { Fragment as Fragment2, jsx as jsx8 } from "react/jsx-runtime";
 function getAbsoluteURL(url) {
@@ -1889,10 +1892,15 @@ function SpatializedContent2(props) {
   }, [onError]);
   return /* @__PURE__ */ jsx8(Fragment2, {});
 }
-async function createSpatializedElement2() {
-  return getSession().createSpatializedStatic3DElement();
-}
 function SpatializedStatic3DElementContainerBase(props, ref) {
+  const containerRef = useRef4(null);
+  const [elementCreated, setElementCreated] = useState6(false);
+  useImperativeHandle(ref, () => elementCreated ? containerRef.current : null, [elementCreated]);
+  const createSpatializedElement2 = useCallback6(async () => {
+    const element = await getSession().createSpatializedStatic3DElement();
+    setElementCreated(true);
+    return element;
+  }, [setElementCreated]);
   const extraRefProps = useCallback6(
     (domProxy) => {
       let modelTransform = new DOMMatrixReadOnly();
@@ -1925,7 +1933,7 @@ function SpatializedStatic3DElementContainerBase(props, ref) {
   return /* @__PURE__ */ jsx8(
     SpatializedContainer,
     {
-      ref,
+      ref: containerRef,
       component: "div",
       createSpatializedElement: createSpatializedElement2,
       spatializedContent: SpatializedContent2,
@@ -1987,9 +1995,9 @@ function initScene(name, callback, options) {
 import { forwardRef as forwardRef9 } from "react";
 
 // src/spatialized-container-monitor/useMonitorDomChange.tsx
-import { useRef as useRef4, useEffect as useEffect13, useMemo as useMemo4 } from "react";
+import { useRef as useRef5, useEffect as useEffect13, useMemo as useMemo4 } from "react";
 function useMonitorDomChange(inRef) {
-  const ref = useRef4(null);
+  const ref = useRef5(null);
   useEffect13(() => {
     const observer = new MutationObserver((mutationsList) => {
       notifyDOMUpdate(mutationsList);
@@ -2098,7 +2106,7 @@ var ParentContext = createContext6(null);
 var useParentContext = () => useContext10(ParentContext);
 
 // src/reality/hooks/useEntityTransform.tsx
-import { useEffect as useEffect15, useRef as useRef5 } from "react";
+import { useEffect as useEffect15, useRef as useRef6 } from "react";
 
 // src/reality/utils/ResourceRegistry.ts
 var ResourceRegistry = class {
@@ -2179,7 +2187,7 @@ var AbortResourceManager = class {
 
 // src/reality/hooks/useEntityTransform.tsx
 function useEntityTransform(entity, { position, rotation, scale }) {
-  const last = useRef5({});
+  const last = useRef6({});
   useEffect15(() => {
     if (!entity) return;
     const shouldUpdate = !shallowEqualVec3(last.current.position, position) || !shallowEqualRotation(last.current.rotation, rotation) || !shallowEqualVec3(last.current.scale, scale);
@@ -2199,7 +2207,7 @@ function useEntityTransform(entity, { position, rotation, scale }) {
 }
 
 // src/reality/hooks/useEntityEvent.tsx
-import { useEffect as useEffect17, useRef as useRef7 } from "react";
+import { useEffect as useEffect17, useRef as useRef8 } from "react";
 
 // src/reality/type.ts
 var eventMap = {
@@ -2220,9 +2228,9 @@ var eventMap = {
 };
 
 // src/reality/hooks/useEntityRef.tsx
-import { useImperativeHandle } from "react";
+import { useImperativeHandle as useImperativeHandle2 } from "react";
 var useEntityRef = (ref, instance) => {
-  useImperativeHandle(ref, () => instance);
+  useImperativeHandle2(ref, () => instance);
 };
 var EntityRef = class {
   _entity;
@@ -2342,7 +2350,7 @@ function createEventProxy2(ev, instance) {
   });
 }
 var useEntityEvent = ({ instance, ...handlers }) => {
-  const eventsSetRef = useRef7(/* @__PURE__ */ new Set());
+  const eventsSetRef = useRef8(/* @__PURE__ */ new Set());
   useEffect17(() => {
     const entity = instance.entity;
     if (!entity) return;
@@ -2384,7 +2392,7 @@ var useEntityId = ({ id, entity }) => {
 };
 
 // src/reality/hooks/useEntity.tsx
-import { useEffect as useEffect19, useRef as useRef8 } from "react";
+import { useEffect as useEffect19, useRef as useRef9 } from "react";
 var useEntity = ({
   ref,
   id,
@@ -2406,7 +2414,7 @@ var useEntity = ({
 }) => {
   const ctx = useRealityContext();
   const parent = useParentContext();
-  const instanceRef = useRef8(new EntityRef(null, ctx));
+  const instanceRef = useRef9(new EntityRef(null, ctx));
   const forceUpdate = useForceUpdate2();
   useEffect19(() => {
     if (!ctx) return;
@@ -2458,9 +2466,9 @@ var useEntity = ({
 };
 
 // src/reality/hooks/useForceUpdate.tsx
-import { useCallback as useCallback7, useState as useState7 } from "react";
+import { useCallback as useCallback7, useState as useState8 } from "react";
 var useForceUpdate2 = () => {
-  const [, setTick] = useState7(0);
+  const [, setTick] = useState8(0);
   return useCallback7(() => setTick((tick) => tick + 1), []);
 };
 
@@ -2565,10 +2573,10 @@ var BoxEntity = forwardRef13(
 );
 
 // src/reality/components/UnlitMaterial.tsx
-import { useEffect as useEffect20, useRef as useRef9 } from "react";
+import { useEffect as useEffect20, useRef as useRef10 } from "react";
 var UnlitMaterial = ({ children, ...options }) => {
   const ctx = useRealityContext();
-  const materialRef = useRef9();
+  const materialRef = useRef10();
   useEffect20(() => {
     if (!ctx) return;
     const { session, reality, resourceRegistry } = ctx;
@@ -2685,7 +2693,7 @@ var SceneGraph = ({ children }) => {
 };
 
 // src/reality/components/ModelAsset.tsx
-import { useEffect as useEffect21, useRef as useRef10 } from "react";
+import { useEffect as useEffect21, useRef as useRef11 } from "react";
 var resolveAssetUrl = (url) => {
   if (url.startsWith("http://") || url.startsWith("https://")) {
     return url;
@@ -2694,7 +2702,7 @@ var resolveAssetUrl = (url) => {
 };
 var ModelAsset = ({ children, ...options }) => {
   const ctx = useRealityContext();
-  const materialRef = useRef10();
+  const materialRef = useRef11();
   useEffect21(() => {
     const controller = new AbortController();
     if (!ctx) return;
@@ -2763,8 +2771,8 @@ import {
   forwardRef as forwardRef19,
   useCallback as useCallback8,
   useEffect as useEffect22,
-  useRef as useRef11,
-  useState as useState8
+  useRef as useRef12,
+  useState as useState9
 } from "react";
 import { Fragment as Fragment3, jsx as jsx22, jsxs as jsxs3 } from "react/jsx-runtime";
 var Reality = forwardRef19(
@@ -2780,9 +2788,9 @@ var Reality = forwardRef19(
       onSpatialMagnifyEnd,
       ...props
     } = inProps;
-    const ctxRef = useRef11(null);
-    const creationId = useRef11(0);
-    const [isReady, setIsReady] = useState8(false);
+    const ctxRef = useRef12(null);
+    const creationId = useRef12(0);
+    const [isReady, setIsReady] = useState9(false);
     const cleanupReality = useCallback8(() => {
       ctxRef.current?.resourceRegistry.destroy();
       ctxRef.current?.reality.destroy();
@@ -2872,7 +2880,7 @@ var Model = withSSRSupported(forwardRef20(ModelBase));
 Model.displayName = "Model";
 
 // src/index.ts
-var version = "1.2.0";
+var version = "1.2.1";
 if (typeof window !== "undefined") {
   initPolyfill();
 }