@webspatial/react-sdk 0.1.5 → 0.1.7

package/dist/default/index.js

@@ -865,7 +865,8 @@ function renderJSXPortalInstance(inProps, inheritedPortalStyle, className) {
     marginTop: "0px",
     marginBottom: "0px",
     borderRadius: "0px",
-    overflow: ""
+    overflow: "",
+    display: "block"
   };
   const style = {
     ...inStyle,
@@ -1222,9 +1223,10 @@ function PortalInstance(inProps) {
     className
   );
   const needRenderPlaceHolder = isSubPortal && inheritedPortalStyle.position !== "absolute" && inheritedPortalStyle.position !== "fixed";
+  const El = props.El;
   return /* @__PURE__ */ jsxs(SpatialWindowManagerContext.Provider, { value: spatialWindowManager, children: [
     needRenderPlaceHolder && /* @__PURE__ */ jsx2(
-      "span",
+      El,
       {
         className,
         "data-subportal-spatialid": spatialId,
@@ -3413,7 +3415,7 @@ function ModelBase(inProps, ref) {
   );
   const isWebEnv = !getSession();
   if (isWebEnv) {
-    const loadFailed = useRef12(false);
+    const [loadFailed, setLoadFailed] = useState6(false);
     useEffect16(() => {
       if (gltfSourceURL == "") {
         console.warn("Unable to display model, no gltf/glb source provided");
@@ -3422,7 +3424,7 @@ function ModelBase(inProps, ref) {
             target: { ready: false, currentSrc: gltfSourceURL }
           });
         }
-        loadFailed.current = true;
+        setLoadFailed(true);
       }
     }, []);
     const myModelViewer = useRef12(null);
@@ -3445,7 +3447,7 @@ function ModelBase(inProps, ref) {
               target: { ready: false, currentSrc: gltfSourceURL }
             });
           }
-          loadFailed.current = true;
+          setLoadFailed(true);
         }
       }, 500);
     }, []);
@@ -3460,7 +3462,7 @@ function ModelBase(inProps, ref) {
               target: { ready: false, currentSrc: gltfSourceURL }
             });
           }
-          loadFailed.current = true;
+          setLoadFailed(true);
         }
       });
       myModelViewer.current.addEventListener("load", (event) => {
@@ -3469,7 +3471,7 @@ function ModelBase(inProps, ref) {
             target: { ready: true, currentSrc: gltfSourceURL }
           });
         }
-        loadFailed.current = false;
+        setLoadFailed(false);
       });
       myModelViewer.current.addEventListener("pointerdown", (event) => {
         isDragging.current = true;
@@ -3533,7 +3535,7 @@ function ModelBase(inProps, ref) {
         {
           ref: myModelViewer,
           style: {
-            display: loadFailed.current ? "none" : "",
+            display: loadFailed ? "none" : "",
             width: "100%",
             height: "100%"
           },
@@ -3543,7 +3545,7 @@ function ModelBase(inProps, ref) {
           poster: props2.poster
         }
       ),
-      loadFailed.current ? /* @__PURE__ */ jsx16(Fragment5, { children: placeHolder }) : /* @__PURE__ */ jsx16(Fragment5, { children: " " })
+      loadFailed ? /* @__PURE__ */ jsx16(Fragment5, { children: placeHolder }) : /* @__PURE__ */ jsx16(Fragment5, { children: " " })
     ] }) : /* @__PURE__ */ jsx16(Fragment5, { children: props2.poster ? /* @__PURE__ */ jsx16(
       "img",
       {