@webspatial/react-sdk 0.1.7 → 0.1.9

package/dist/web/index.js

@@ -1658,6 +1658,15 @@ function useSpatialStyle() {
       observer.disconnect();
     };
   }, []);
+  useEffect6(() => {
+    const headObserver = new MutationObserver((mutations) => {
+      checkSpatialStyleUpdate();
+    });
+    headObserver.observe(document.head, { childList: true, subtree: true });
+    return () => {
+      headObserver.disconnect();
+    };
+  }, []);
   useEffect6(() => {
     if (!ref.current) {
       return;
@@ -3368,6 +3377,15 @@ CSSModel3D.displayName = "CSSModel3D";
 
 // src/spatial-react-components/Model/index.tsx
 import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs6 } from "react/jsx-runtime";
+{
+  const styleElement = document.createElement("style");
+  styleElement.id = "__custom-class-model-webspatial";
+  styleElement.innerHTML = `.__custom-class-model-webspatial { width: 300px; height: 300px; }`;
+  if (document.getElementById("__custom-class-model-webspatial")) {
+    console.warn("__custom-class-model-webspatial already exists");
+  }
+  document.head.prepend(styleElement);
+}
 function renderInModel3D(inProps, ref, modelUrl, placeHolder) {
   const { poster, ...props } = inProps;
   return /* @__PURE__ */ jsxs6(CSSModel3D, { modelUrl, ...props, ref, children: [
@@ -3409,6 +3427,8 @@ function parseChildren(child) {
 }
 function ModelBase(inProps, ref) {
   const { children, ...props } = inProps;
+  props.className = "__custom-class-model-webspatial " + (props.className ? props.className : "");
+  let className = props.className;
   const { placeHolder, gltfSourceURL, usdzSourceURL } = useMemo9(
     () => parseChildren(children),
     [children]
@@ -3428,7 +3448,7 @@ function ModelBase(inProps, ref) {
       }
     }, []);
     const myModelViewer = useRef12(null);
-    const { className, style = {}, ...props2 } = inProps;
+    const { style = {}, ...props2 } = inProps;
     const isDragging = useRef12(false);
     let [modelViewerExists, setModelViewerExists] = useState6(false);
     useEffect16(() => {