@weaverse/core 0.6.4 → 0.6.5

package/dist/index.d.ts

@@ -53,16 +53,13 @@ interface ProjectDataType {
     items: ProjectDataItemType[];
     rootId: string | number;
 }
-declare type MediaBreakpoints = {
-    tablet: string;
-    mobile: string;
-};
 declare type WeaverseType = {
-    [key: string]: any;
+    mediaBreakPoints?: any;
     appUrl?: string;
     projectKey?: string;
     projectData?: ProjectDataType;
     isDesignMode?: boolean;
+    ssrMode?: boolean;
 };
 /**
  * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data
@@ -85,6 +82,7 @@ declare class WeaverseItemStore {
     listeners: Set<any>;
     ref: RefObject<HTMLElement>;
     weaverse: Weaverse;
+    stitchesClass: string;
     constructor(itemData: any, weaverse: Weaverse);
     _data: any;
     get Element(): WeaverseElement;
@@ -133,6 +131,11 @@ declare class Weaverse {
      * @type {boolean}
      */
     isDesignMode: boolean;
+    /**
+     * Use in element to optionally render special HTML for hydration
+     * @type {boolean}
+     */
+    ssrMode: boolean;
     /**
      * stitches instance for handling CSS stylesheet, media, theme for Weaverse project
      */
@@ -149,8 +152,10 @@ declare class Weaverse {
      * @param projectKey {string} Weaverse project key to access project data via API
      * @param projectData {ProjectDataType} Weaverse project data, by default, user can provide project data via React Component.
      * @param mediaBreakPoints {object} Pass down custom media query breakpoints or just use the default.
+     * @param isDesignMode {boolean} check whether the sdk is isDesignMode or not
+     * @param ssrMode {boolean} Use in element to optionally render special HTML for hydration
      */
-    constructor({ appUrl, projectKey, projectData, mediaBreakPoints, isDesignMode }?: WeaverseType);
+    constructor({ appUrl, projectKey, projectData, mediaBreakPoints, isDesignMode, ssrMode }?: WeaverseType);
     /**
      * register the custom React Component to Weaverse, store it into Weaverse.elementInstances
      * @param element {WeaverseElement} custom React Component
@@ -158,7 +163,6 @@ declare class Weaverse {
     registerElement(element: WeaverseElement): void;
     init(): void;
     initStitches: () => void;
-    loadStudio(): void;
     subscribe(fn: any): void;
     unsubscribe(fn: any): void;
     triggerUpdate(): void;
@@ -184,4 +188,4 @@ declare const isReactNative: boolean;
 declare const isBrowser: boolean;
 declare const isIframe: boolean;
 
-export { MediaBreakpoints, ProjectDataItemType, ProjectDataType, TODO, Weaverse, WeaverseElement, WeaverseElementCatalog, WeaverseElementInput, WeaverseElementMap, WeaverseElementSchema, WeaverseItemStore, WeaverseType, isBrowser, isIframe, isReactNative };
+export { ProjectDataItemType, ProjectDataType, TODO, Weaverse, WeaverseElement, WeaverseElementCatalog, WeaverseElementInput, WeaverseElementMap, WeaverseElementSchema, WeaverseItemStore, WeaverseType, isBrowser, isIframe, isReactNative };

package/dist/index.js

@@ -44,11 +44,6 @@ __export(src_exports, {
 });
 module.exports = __toCommonJS(src_exports);
 
-// src/utils/index.ts
-var isReactNative = typeof navigator === "object" && navigator.product === "ReactNative";
-var isBrowser = typeof window !== "undefined" && !isReactNative;
-var isIframe = isBrowser && window.top !== window.self;
-
 // src/core.ts
 var stitches = __toESM(require("@stitches/core"));
 var WeaverseItemStore = class {
@@ -57,6 +52,7 @@ var WeaverseItemStore = class {
     this.ref = {
       current: null
     };
+    this.stitchesClass = "";
     this._data = {};
     this.setData = (data) => {
       this.data = Object.assign(this.data, data);
@@ -93,7 +89,7 @@ var WeaverseItemStore = class {
   }
 };
 var _Weaverse = class {
-  constructor({ appUrl, projectKey, projectData, mediaBreakPoints, isDesignMode } = {}) {
+  constructor({ appUrl, projectKey, projectData, mediaBreakPoints, isDesignMode, ssrMode } = {}) {
     this.elementInstances = /* @__PURE__ */ new Map();
     this.itemInstances = /* @__PURE__ */ new Map();
     this.appUrl = process.env.NODE_ENV === "development" ? "http://localhost:3000" : "https://weaverse.io";
@@ -104,6 +100,7 @@ var _Weaverse = class {
     };
     this.listeners = /* @__PURE__ */ new Set();
     this.isDesignMode = false;
+    this.ssrMode = false;
     this.mediaBreakPoints = {
       desktop: "all",
       mobile: "(max-width: 767.98px)"
@@ -130,6 +127,7 @@ var _Weaverse = class {
     this.projectKey = projectKey || this.projectKey;
     this.mediaBreakPoints = mediaBreakPoints || this.mediaBreakPoints;
     this.isDesignMode = isDesignMode || this.isDesignMode;
+    this.ssrMode = ssrMode || this.ssrMode;
     projectData && (this.projectData = projectData);
     this.init();
   }
@@ -143,27 +141,9 @@ var _Weaverse = class {
   }
   init() {
     this.initStitches();
-    this.loadStudio();
     this.initProjectItemData();
     this.updateProjectData();
   }
-  loadStudio() {
-    if (this.isDesignMode && isIframe) {
-      let initStudio = () => {
-        this.studioBridge = new window.WeaverseStudioBridge(this);
-        this.triggerUpdate();
-      };
-      if (!window.WeaverseStudioBridge) {
-        const studioBridgeScript = document.createElement("script");
-        studioBridgeScript.src = `${this.appUrl}/assets/studio/studio-bridge.js`;
-        studioBridgeScript.type = "module";
-        studioBridgeScript.onload = initStudio;
-        document.body.appendChild(studioBridgeScript);
-      } else {
-        initStudio();
-      }
-    }
-  }
   subscribe(fn) {
     this.listeners.add(fn);
   }
@@ -206,6 +186,11 @@ var _Weaverse = class {
 };
 var Weaverse = _Weaverse;
 Weaverse.WeaverseItemStore = WeaverseItemStore;
+
+// src/utils/index.ts
+var isReactNative = typeof navigator === "object" && navigator.product === "ReactNative";
+var isBrowser = typeof window !== "undefined" && !isReactNative;
+var isIframe = isBrowser && window.top !== window.self;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Weaverse,

package/dist/index.mjs

@@ -15,11 +15,6 @@ var __spreadValues = (a, b) => {
   return a;
 };
 
-// src/utils/index.ts
-var isReactNative = typeof navigator === "object" && navigator.product === "ReactNative";
-var isBrowser = typeof window !== "undefined" && !isReactNative;
-var isIframe = isBrowser && window.top !== window.self;
-
 // src/core.ts
 import * as stitches from "@stitches/core";
 var WeaverseItemStore = class {
@@ -28,6 +23,7 @@ var WeaverseItemStore = class {
     this.ref = {
       current: null
     };
+    this.stitchesClass = "";
     this._data = {};
     this.setData = (data) => {
       this.data = Object.assign(this.data, data);
@@ -64,7 +60,7 @@ var WeaverseItemStore = class {
   }
 };
 var _Weaverse = class {
-  constructor({ appUrl, projectKey, projectData, mediaBreakPoints, isDesignMode } = {}) {
+  constructor({ appUrl, projectKey, projectData, mediaBreakPoints, isDesignMode, ssrMode } = {}) {
     this.elementInstances = /* @__PURE__ */ new Map();
     this.itemInstances = /* @__PURE__ */ new Map();
     this.appUrl = process.env.NODE_ENV === "development" ? "http://localhost:3000" : "https://weaverse.io";
@@ -75,6 +71,7 @@ var _Weaverse = class {
     };
     this.listeners = /* @__PURE__ */ new Set();
     this.isDesignMode = false;
+    this.ssrMode = false;
     this.mediaBreakPoints = {
       desktop: "all",
       mobile: "(max-width: 767.98px)"
@@ -101,6 +98,7 @@ var _Weaverse = class {
     this.projectKey = projectKey || this.projectKey;
     this.mediaBreakPoints = mediaBreakPoints || this.mediaBreakPoints;
     this.isDesignMode = isDesignMode || this.isDesignMode;
+    this.ssrMode = ssrMode || this.ssrMode;
     projectData && (this.projectData = projectData);
     this.init();
   }
@@ -114,27 +112,9 @@ var _Weaverse = class {
   }
   init() {
     this.initStitches();
-    this.loadStudio();
     this.initProjectItemData();
     this.updateProjectData();
   }
-  loadStudio() {
-    if (this.isDesignMode && isIframe) {
-      let initStudio = () => {
-        this.studioBridge = new window.WeaverseStudioBridge(this);
-        this.triggerUpdate();
-      };
-      if (!window.WeaverseStudioBridge) {
-        const studioBridgeScript = document.createElement("script");
-        studioBridgeScript.src = `${this.appUrl}/assets/studio/studio-bridge.js`;
-        studioBridgeScript.type = "module";
-        studioBridgeScript.onload = initStudio;
-        document.body.appendChild(studioBridgeScript);
-      } else {
-        initStudio();
-      }
-    }
-  }
   subscribe(fn) {
     this.listeners.add(fn);
   }
@@ -177,6 +157,11 @@ var _Weaverse = class {
 };
 var Weaverse = _Weaverse;
 Weaverse.WeaverseItemStore = WeaverseItemStore;
+
+// src/utils/index.ts
+var isReactNative = typeof navigator === "object" && navigator.product === "ReactNative";
+var isBrowser = typeof window !== "undefined" && !isReactNative;
+var isIframe = isBrowser && window.top !== window.self;
 export {
   Weaverse,
   WeaverseItemStore,

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.6.4",
+  "version": "0.6.5",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",