@weaverse/core 1.3.1 → 1.3.3

package/dist/index.js

@@ -133,27 +133,12 @@ var stitchesUtils = {
 
 // src/core.ts
 var WeaverseItemStore = class {
+  weaverse;
+  listeners = /* @__PURE__ */ new Set();
+  ref = { current: null };
+  stitchesClass = "";
+  _store = { id: "", type: "" };
   constructor(itemData, weaverse) {
-    this.listeners = /* @__PURE__ */ new Set();
-    this.ref = { current: null };
-    this.stitchesClass = "";
-    this._store = { id: "", type: "" };
-    this.setData = (update) => {
-      this.data = Object.assign(this.data, update);
-      this.triggerUpdate();
-      return this.data;
-    };
-    this.subscribe = (fn) => {
-      this.listeners.add(fn);
-    };
-    this.unsubscribe = (fn) => {
-      this.listeners.delete(fn);
-    };
-    this.triggerUpdate = () => {
-      this.listeners.forEach((fn) => {
-        return fn(this.data);
-      });
-    };
     let { type, id } = itemData;
     this.weaverse = weaverse;
     if (id && type) {
@@ -189,78 +174,96 @@ var WeaverseItemStore = class {
     let extraData = this.Element?.extraData;
     return { ...defaultData, ...extraData, ...this._store, css };
   }
+  setData = (update) => {
+    this.data = Object.assign(this.data, update);
+    this.triggerUpdate();
+    return this.data;
+  };
+  subscribe = (fn) => {
+    this.listeners.add(fn);
+  };
+  unsubscribe = (fn) => {
+    this.listeners.delete(fn);
+  };
+  triggerUpdate = () => {
+    this.listeners.forEach((fn) => {
+      return fn(this.data);
+    });
+  };
 };
 var Weaverse = class {
+  /**
+   * The `weaverse-content-root` element of Weaverse SDK
+   */
+  contentRootElement;
+  /**
+   * For storing, registering element React component from Weaverse or created by user/developer
+   */
+  elementInstances = /* @__PURE__ */ new Map();
+  /**
+   * list of element/items store to provide data, handle state update, state sharing, etc.
+   */
+  itemInstances = /* @__PURE__ */ new Map();
+  /**
+   * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
+   */
+  weaverseHost = "https://weaverse.io";
+  /**
+   * Weaverse version, it can be used to load the correct version of Weaverse SDK
+   */
+  weaverseVersion = "";
+  /**
+   * Weaverse project key to access project data via API
+   */
+  projectId = "";
+  pageId = "";
+  internal = {};
+  requestInfo = {};
+  /**
+   * Weaverse project data, by default, user can provide project data via React Component:
+   * <WeaverseRoot data={data} /> it will be used to server-side rendering
+   */
+  data = {
+    rootId: "",
+    items: [],
+    script: { css: "", js: "" }
+  };
+  /**
+   * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot
+   */
+  listeners = /* @__PURE__ */ new Set();
+  /**
+   * Check whether the sdk is in editor or not.
+   * If isDesignMode is true, it means the sdk is isDesignMode mode, render the editor UI,
+   * else render the preview UI, plain HTML + CSS + React hydrate
+   */
+  isDesignMode = false;
+  /**
+   * Check the platform, shopify-section or react-ssr(hydrogen)
+   */
+  platformType = "shopify-section";
+  /**
+   * Check whether the sdk is in preview mode or not
+   */
+  isPreviewMode = false;
+  /**
+   * Use in element to optionally render special HTML for hydration
+   */
+  ssrMode = false;
+  /**
+   * Stitches instance for handling CSS stylesheet, media, theme for Weaverse project
+   */
+  stitchesInstance;
+  studioBridge;
+  elementSchemas = [];
+  static WeaverseItemStore = WeaverseItemStore;
+  mediaBreakPoints = {
+    desktop: "all",
+    // max-width need to subtract 0.02px to prevent bug https://getbootstrap.com/docs/5.1/layout/breakpoints/#max-width
+    // tablet: "(max-width: 1023.98px)", // to set css for tablet, {'@tablet' : { // css }},
+    mobile: "(max-width: 767.98px)"
+  };
   constructor(params = {}) {
-    /**
-     * For storing, registering element React component from Weaverse or created by user/developer
-     */
-    this.elementInstances = /* @__PURE__ */ new Map();
-    /**
-     * list of element/items store to provide data, handle state update, state sharing, etc.
-     */
-    this.itemInstances = /* @__PURE__ */ new Map();
-    /**
-     * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
-     */
-    this.weaverseHost = "https://weaverse.io";
-    /**
-     * Weaverse version, it can be used to load the correct version of Weaverse SDK
-     */
-    this.weaverseVersion = "";
-    /**
-     * Weaverse project key to access project data via API
-     */
-    this.projectId = "";
-    this.pageId = "";
-    this.internal = {};
-    this.requestInfo = {};
-    /**
-     * Weaverse project data, by default, user can provide project data via React Component:
-     * <WeaverseRoot data={data} /> it will be used to server-side rendering
-     */
-    this.data = {
-      rootId: "",
-      items: [],
-      script: { css: "", js: "" }
-    };
-    /**
-     * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot
-     */
-    this.listeners = /* @__PURE__ */ new Set();
-    /**
-     * Check whether the sdk is in editor or not.
-     * If isDesignMode is true, it means the sdk is isDesignMode mode, render the editor UI,
-     * else render the preview UI, plain HTML + CSS + React hydrate
-     */
-    this.isDesignMode = false;
-    /**
-     * Check the platform, shopify-section or react-ssr(hydrogen)
-     */
-    this.platformType = "shopify-section";
-    /**
-     * Check whether the sdk is in preview mode or not
-     */
-    this.isPreviewMode = false;
-    /**
-     * Use in element to optionally render special HTML for hydration
-     */
-    this.ssrMode = false;
-    this.elementSchemas = [];
-    this.mediaBreakPoints = {
-      desktop: "all",
-      // max-width need to subtract 0.02px to prevent bug https://getbootstrap.com/docs/5.1/layout/breakpoints/#max-width
-      // tablet: "(max-width: 1023.98px)", // to set css for tablet, {'@tablet' : { // css }},
-      mobile: "(max-width: 767.98px)"
-    };
-    this.initStitches = (externalConfig = {}) => {
-      this.stitchesInstance = this.stitchesInstance || stitches.createStitches({
-        prefix: "weaverse",
-        media: this.mediaBreakPoints,
-        utils: stitchesUtils,
-        ...externalConfig
-      });
-    };
     Object.entries(params).forEach(([k, v]) => {
       let key = k;
       if (key in this) {
@@ -283,6 +286,14 @@ var Weaverse = class {
       console.error("Weaverse: registerElement: `type` is required");
     }
   }
+  initStitches = (externalConfig = {}) => {
+    this.stitchesInstance = this.stitchesInstance || stitches.createStitches({
+      prefix: "weaverse",
+      media: this.mediaBreakPoints,
+      utils: stitchesUtils,
+      ...externalConfig
+    });
+  };
   subscribe(fn) {
     this.listeners.add(fn);
   }
@@ -325,7 +336,6 @@ var Weaverse = class {
     }
   }
 };
-Weaverse.WeaverseItemStore = WeaverseItemStore;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Weaverse,

package/dist/index.mjs

@@ -90,27 +90,12 @@ var stitchesUtils = {
 
 // src/core.ts
 var WeaverseItemStore = class {
+  weaverse;
+  listeners = /* @__PURE__ */ new Set();
+  ref = { current: null };
+  stitchesClass = "";
+  _store = { id: "", type: "" };
   constructor(itemData, weaverse) {
-    this.listeners = /* @__PURE__ */ new Set();
-    this.ref = { current: null };
-    this.stitchesClass = "";
-    this._store = { id: "", type: "" };
-    this.setData = (update) => {
-      this.data = Object.assign(this.data, update);
-      this.triggerUpdate();
-      return this.data;
-    };
-    this.subscribe = (fn) => {
-      this.listeners.add(fn);
-    };
-    this.unsubscribe = (fn) => {
-      this.listeners.delete(fn);
-    };
-    this.triggerUpdate = () => {
-      this.listeners.forEach((fn) => {
-        return fn(this.data);
-      });
-    };
     let { type, id } = itemData;
     this.weaverse = weaverse;
     if (id && type) {
@@ -146,78 +131,96 @@ var WeaverseItemStore = class {
     let extraData = this.Element?.extraData;
     return { ...defaultData, ...extraData, ...this._store, css };
   }
+  setData = (update) => {
+    this.data = Object.assign(this.data, update);
+    this.triggerUpdate();
+    return this.data;
+  };
+  subscribe = (fn) => {
+    this.listeners.add(fn);
+  };
+  unsubscribe = (fn) => {
+    this.listeners.delete(fn);
+  };
+  triggerUpdate = () => {
+    this.listeners.forEach((fn) => {
+      return fn(this.data);
+    });
+  };
 };
 var Weaverse = class {
+  /**
+   * The `weaverse-content-root` element of Weaverse SDK
+   */
+  contentRootElement;
+  /**
+   * For storing, registering element React component from Weaverse or created by user/developer
+   */
+  elementInstances = /* @__PURE__ */ new Map();
+  /**
+   * list of element/items store to provide data, handle state update, state sharing, etc.
+   */
+  itemInstances = /* @__PURE__ */ new Map();
+  /**
+   * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
+   */
+  weaverseHost = "https://weaverse.io";
+  /**
+   * Weaverse version, it can be used to load the correct version of Weaverse SDK
+   */
+  weaverseVersion = "";
+  /**
+   * Weaverse project key to access project data via API
+   */
+  projectId = "";
+  pageId = "";
+  internal = {};
+  requestInfo = {};
+  /**
+   * Weaverse project data, by default, user can provide project data via React Component:
+   * <WeaverseRoot data={data} /> it will be used to server-side rendering
+   */
+  data = {
+    rootId: "",
+    items: [],
+    script: { css: "", js: "" }
+  };
+  /**
+   * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot
+   */
+  listeners = /* @__PURE__ */ new Set();
+  /**
+   * Check whether the sdk is in editor or not.
+   * If isDesignMode is true, it means the sdk is isDesignMode mode, render the editor UI,
+   * else render the preview UI, plain HTML + CSS + React hydrate
+   */
+  isDesignMode = false;
+  /**
+   * Check the platform, shopify-section or react-ssr(hydrogen)
+   */
+  platformType = "shopify-section";
+  /**
+   * Check whether the sdk is in preview mode or not
+   */
+  isPreviewMode = false;
+  /**
+   * Use in element to optionally render special HTML for hydration
+   */
+  ssrMode = false;
+  /**
+   * Stitches instance for handling CSS stylesheet, media, theme for Weaverse project
+   */
+  stitchesInstance;
+  studioBridge;
+  elementSchemas = [];
+  static WeaverseItemStore = WeaverseItemStore;
+  mediaBreakPoints = {
+    desktop: "all",
+    // max-width need to subtract 0.02px to prevent bug https://getbootstrap.com/docs/5.1/layout/breakpoints/#max-width
+    // tablet: "(max-width: 1023.98px)", // to set css for tablet, {'@tablet' : { // css }},
+    mobile: "(max-width: 767.98px)"
+  };
   constructor(params = {}) {
-    /**
-     * For storing, registering element React component from Weaverse or created by user/developer
-     */
-    this.elementInstances = /* @__PURE__ */ new Map();
-    /**
-     * list of element/items store to provide data, handle state update, state sharing, etc.
-     */
-    this.itemInstances = /* @__PURE__ */ new Map();
-    /**
-     * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
-     */
-    this.weaverseHost = "https://weaverse.io";
-    /**
-     * Weaverse version, it can be used to load the correct version of Weaverse SDK
-     */
-    this.weaverseVersion = "";
-    /**
-     * Weaverse project key to access project data via API
-     */
-    this.projectId = "";
-    this.pageId = "";
-    this.internal = {};
-    this.requestInfo = {};
-    /**
-     * Weaverse project data, by default, user can provide project data via React Component:
-     * <WeaverseRoot data={data} /> it will be used to server-side rendering
-     */
-    this.data = {
-      rootId: "",
-      items: [],
-      script: { css: "", js: "" }
-    };
-    /**
-     * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot
-     */
-    this.listeners = /* @__PURE__ */ new Set();
-    /**
-     * Check whether the sdk is in editor or not.
-     * If isDesignMode is true, it means the sdk is isDesignMode mode, render the editor UI,
-     * else render the preview UI, plain HTML + CSS + React hydrate
-     */
-    this.isDesignMode = false;
-    /**
-     * Check the platform, shopify-section or react-ssr(hydrogen)
-     */
-    this.platformType = "shopify-section";
-    /**
-     * Check whether the sdk is in preview mode or not
-     */
-    this.isPreviewMode = false;
-    /**
-     * Use in element to optionally render special HTML for hydration
-     */
-    this.ssrMode = false;
-    this.elementSchemas = [];
-    this.mediaBreakPoints = {
-      desktop: "all",
-      // max-width need to subtract 0.02px to prevent bug https://getbootstrap.com/docs/5.1/layout/breakpoints/#max-width
-      // tablet: "(max-width: 1023.98px)", // to set css for tablet, {'@tablet' : { // css }},
-      mobile: "(max-width: 767.98px)"
-    };
-    this.initStitches = (externalConfig = {}) => {
-      this.stitchesInstance = this.stitchesInstance || stitches.createStitches({
-        prefix: "weaverse",
-        media: this.mediaBreakPoints,
-        utils: stitchesUtils,
-        ...externalConfig
-      });
-    };
     Object.entries(params).forEach(([k, v]) => {
       let key = k;
       if (key in this) {
@@ -240,6 +243,14 @@ var Weaverse = class {
       console.error("Weaverse: registerElement: `type` is required");
     }
   }
+  initStitches = (externalConfig = {}) => {
+    this.stitchesInstance = this.stitchesInstance || stitches.createStitches({
+      prefix: "weaverse",
+      media: this.mediaBreakPoints,
+      utils: stitchesUtils,
+      ...externalConfig
+    });
+  };
   subscribe(fn) {
     this.listeners.add(fn);
   }
@@ -282,7 +293,6 @@ var Weaverse = class {
     }
   }
 };
-Weaverse.WeaverseItemStore = WeaverseItemStore;
 export {
   Weaverse,
   WeaverseItemStore,

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.3.1",
+  "version": "1.3.3",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -11,7 +11,7 @@
     "dist/*"
   ],
   "engines": {
-    "node": ">=10"
+    "node": ">=16"
   },
   "scripts": {
     "start": "npm run dev",
@@ -28,4 +28,4 @@
   "optionalDependencies": {
     "@esbuild/darwin-x64": "*"
   }
-}
+}