@weaverse/core 1.0.45 → 1.0.46

package/dist/index.d.ts

@@ -40,27 +40,13 @@ declare let stitchesUtils: {
     };
 };
 
-/**
- * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data
- * @param itemData {ElementData} Weaverse item data
- * @param weaverse {Weaverse} Weaverse instance
- * @example
- * useEffect(() => {
- *     let handleUpdate = (update: any) => {
- *       setData({...update})
- *     }
- *     itemInstance.subscribe(handleUpdate)
- *     return () => {
- *       itemInstance.unsubscribe(handleUpdate)
- *     }
- * }, [])
- */
 declare class WeaverseItemStore {
-    listeners: Set<any>;
-    ref: RefObject<HTMLElement>;
     weaverse: Weaverse;
+    listeners: Set<(_: ElementData) => void>;
+    ref: RefObject<HTMLElement>;
+    platformType: PlatformTypeEnum;
     stitchesClass: string;
-    _data: ElementData;
+    _store: ElementData;
     constructor(itemData: ElementData, weaverse: Weaverse);
     get _id(): string;
     get _element(): HTMLElement | null;
@@ -69,8 +55,8 @@ declare class WeaverseItemStore {
     set data(update: Omit<ElementData, "id" | "type">);
     get data(): ElementData;
     setData: (update: Omit<ElementData, "id" | "type">) => ElementData;
-    subscribe: (fn: any) => void;
-    unsubscribe: (fn: any) => void;
+    subscribe: (fn: (_: ElementData) => void) => void;
+    unsubscribe: (fn: (_: ElementData) => void) => void;
     triggerUpdate: () => void;
 }
 declare class Weaverse {
@@ -88,17 +74,14 @@ declare class Weaverse {
     itemInstances: Map<string | number, WeaverseItemStore>;
     /**
      * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
-     * @type {string}
      */
     weaverseHost: string;
     /**
      * Weaverse version, it can be used to load the correct version of Weaverse SDK
-     * @type {string}
      */
     weaverseVersion: string;
     /**
      * Weaverse project key to access project data via API
-     * @type {string}
      */
     projectId: string;
     pageId: string;
@@ -109,14 +92,12 @@ declare class Weaverse {
     data: WeaverseProjectDataType;
     /**
      * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot
-     * @type {Map<string, (data: any) => void>}
      */
-    listeners: Set<any>;
+    listeners: Set<() => void>;
     /**
      * 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
-     * @type {boolean}
      */
     isDesignMode: boolean;
     /**
@@ -125,12 +106,10 @@ declare class Weaverse {
     platformType: PlatformTypeEnum;
     /**
      * Check whether the sdk is in preview mode or not
-     * @type {boolean}
      */
     isPreviewMode: boolean;
     /**
      * Use in element to optionally render special HTML for hydration
-     * @type {boolean}
      */
     ssrMode: boolean;
     /**
@@ -152,8 +131,7 @@ declare class Weaverse {
      * @param elementSchemas {Array<ElementSchema>} List of element schemas
      * @param platformType {PlatformTypeEnum} Check the platform, shopify-section or react-ssr(hydrogen)
      */
-    constructor({ weaverseHost, weaverseVersion, projectId, data, mediaBreakPoints, isDesignMode, ssrMode, elementSchemas, platformType, pageId, }?: WeaverseType);
-    init({ weaverseHost, weaverseVersion, elementSchemas, platformType, projectId, data, mediaBreakPoints, isDesignMode, ssrMode, pageId, }?: WeaverseType): void;
+    constructor(params?: WeaverseType);
     /**
      * Register the custom React Component to Weaverse, store it into Weaverse.elementInstances
      * @param element {WeaverseElement} custom React Component
@@ -164,8 +142,16 @@ declare class Weaverse {
     unsubscribe(fn: any): void;
     triggerUpdate(): void;
     refreshAllItems(): void;
+    /**
+     * When applying new template,
+     * we need to reset the project data and re-initialize the project item data
+     * @param data {WeaverseProjectDataType}
+     */
     setProjectData(data: WeaverseProjectDataType): void;
-    initProjectItemData(): void;
+    /**
+     * Create new WeaverseItemStore instance for each item in project data
+     */
+    initProject(): void;
 }
 
 interface WeaverseProjectDataType {

package/dist/index.js

@@ -116,14 +116,12 @@ var stitchesUtils = {
 var WeaverseItemStore = class {
   constructor(itemData, weaverse) {
     this.listeners = /* @__PURE__ */ new Set();
-    this.ref = {
-      current: null
-    };
+    this.ref = { current: null };
+    this.platformType = "shopify-section";
     this.stitchesClass = "";
-    this._data = { id: "", type: "" };
+    this._store = { id: "", type: "" };
     this.setData = (update) => {
-      let platformType = this.weaverse.platformType;
-      if (platformType === "shopify-hydrogen") {
+      if (this.platformType === "shopify-hydrogen") {
         this.data = update;
       } else {
         this.data = Object.assign(this.data, update);
@@ -144,13 +142,14 @@ var WeaverseItemStore = class {
     };
     let { type, id } = itemData;
     this.weaverse = weaverse;
+    this.platformType = weaverse.platformType;
     if (id && type) {
       weaverse.itemInstances.set(id, this);
-      this.data = { ...itemData };
+      this._store = { ...itemData };
     }
   }
   get _id() {
-    return this._data.id;
+    return this._store.id;
   }
   get _element() {
     return this.ref.current;
@@ -159,31 +158,33 @@ var WeaverseItemStore = class {
     return this.Element?.schema?.flags || {};
   }
   get Element() {
-    return this.weaverse.elementInstances.get(this._data.type);
+    return this.weaverse.elementInstances.get(this._store.type);
   }
   set data(update) {
-    let platformType = this.weaverse.platformType;
-    if (platformType === "shopify-hydrogen") {
-      this._data.data = merge(this.data, update);
+    if (this.platformType === "shopify-hydrogen") {
+      let { children, ...rest } = update;
+      if (children) {
+        this._store.children = children;
+      }
+      this._store.data = merge(this._store.data, rest);
     } else {
-      this._data = { ...this.data, ...update };
+      this._store = { ...this.data, ...update };
     }
   }
   get data() {
-    let platformType = this.weaverse.platformType;
-    if (platformType === "shopify-hydrogen") {
-      let defaultData2 = { ...this.Element?.Component?.defaultProps };
+    let defaultProps = { ...this.Element?.Component?.defaultProps };
+    if (this.platformType === "shopify-hydrogen") {
       return {
-        ...this._data,
-        ...defaultData2,
-        ...this._data.data
+        ...this._store,
+        data: { ...defaultProps?.data, ...this._store.data }
       };
+    } else {
+      let defaultCss = this.Element?.defaultCss || {};
+      let currentCss = this._store.css || {};
+      let css = merge(defaultCss, currentCss);
+      let extraData = this.Element?.extraData;
+      return { ...defaultProps, ...extraData, ...this._store, css };
     }
-    let defaultCss = this.Element?.defaultCss || {};
-    let currentCss = this._data.css || {};
-    let css = merge(defaultCss, currentCss);
-    let defaultData = { ...this.Element?.Component?.defaultProps, ...this.Element?.extraData || {} };
-    return { ...defaultData, ...this._data, css };
   }
 };
 var Weaverse = class {
@@ -198,18 +199,7 @@ var Weaverse = class {
    * @param elementSchemas {Array<ElementSchema>} List of element schemas
    * @param platformType {PlatformTypeEnum} Check the platform, shopify-section or react-ssr(hydrogen)
    */
-  constructor({
-    weaverseHost,
-    weaverseVersion,
-    projectId,
-    data,
-    mediaBreakPoints,
-    isDesignMode,
-    ssrMode,
-    elementSchemas,
-    platformType,
-    pageId
-  } = {}) {
+  constructor(params = {}) {
     /**
      * For storing, registering element React component from Weaverse or created by user/developer
      */
@@ -220,17 +210,14 @@ var Weaverse = class {
     this.itemInstances = /* @__PURE__ */ new Map();
     /**
      * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
-     * @type {string}
      */
     this.weaverseHost = "https://studio.weaverse.io";
     /**
      * Weaverse version, it can be used to load the correct version of Weaverse SDK
-     * @type {string}
      */
     this.weaverseVersion = "";
     /**
      * Weaverse project key to access project data via API
-     * @type {string}
      */
     this.projectId = "";
     this.pageId = "";
@@ -245,14 +232,12 @@ var Weaverse = class {
     };
     /**
      * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot
-     * @type {Map<string, (data: any) => void>}
      */
     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
-     * @type {boolean}
      */
     this.isDesignMode = false;
     /**
@@ -261,12 +246,10 @@ var Weaverse = class {
     this.platformType = "shopify-section";
     /**
      * Check whether the sdk is in preview mode or not
-     * @type {boolean}
      */
     this.isPreviewMode = false;
     /**
      * Use in element to optionally render special HTML for hydration
-     * @type {boolean}
      */
     this.ssrMode = false;
     this.elementSchemas = [];
@@ -284,42 +267,11 @@ var Weaverse = class {
         ...externalConfig
       });
     };
-    this.init({
-      weaverseHost,
-      weaverseVersion,
-      projectId,
-      data,
-      platformType,
-      mediaBreakPoints,
-      isDesignMode,
-      ssrMode,
-      elementSchemas,
-      pageId
+    Object.entries(params).forEach(([k, v]) => {
+      let key = k;
+      this[key] = v || this[key];
     });
-  }
-  init({
-    weaverseHost,
-    weaverseVersion,
-    elementSchemas,
-    platformType,
-    projectId,
-    data,
-    mediaBreakPoints,
-    isDesignMode,
-    ssrMode,
-    pageId
-  } = {}) {
-    this.elementSchemas = elementSchemas || this.elementSchemas;
-    this.weaverseHost = weaverseHost || this.weaverseHost;
-    this.weaverseVersion = weaverseVersion || this.weaverseVersion;
-    this.projectId = projectId || this.projectId;
-    this.pageId = pageId || this.pageId;
-    this.mediaBreakPoints = mediaBreakPoints || this.mediaBreakPoints;
-    this.isDesignMode = isDesignMode || this.isDesignMode;
-    this.ssrMode = ssrMode || this.ssrMode;
-    this.platformType = platformType || this.platformType;
-    this.data = data || this.data;
-    this.initProjectItemData();
+    this.initProject();
     this.initStitches();
   }
   /**
@@ -349,12 +301,20 @@ var Weaverse = class {
       item.triggerUpdate();
     });
   }
+  /**
+   * When applying new template,
+   * we need to reset the project data and re-initialize the project item data
+   * @param data {WeaverseProjectDataType}
+   */
   setProjectData(data) {
     this.data = data;
-    this.initProjectItemData();
+    this.initProject();
     this.triggerUpdate();
   }
-  initProjectItemData() {
+  /**
+   * Create new WeaverseItemStore instance for each item in project data
+   */
+  initProject() {
     const data = this.data;
     if (data?.items) {
       data.items.forEach((item) => {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/core.ts","../src/utils/load-script.ts","../src/utils/index.ts","../src/utils/styles.ts"],"sourcesContent":["export * from \"./types\"\nexport * from \"./core\"\nexport * from \"./utils\"\n","// TODO: Implement Weaverse SDK class\n// Only core code is implemented here, avoid importing other packages,\n// the core code should be framework agnostic, no react, vue, angular, etc.\n// noinspection JSUnusedGlobalSymbols\n\n// using stitches core only for framework-agnostic code\nimport * as stitches from \"@stitches/core\"\nimport type Stitches from \"@stitches/core/types/stitches\"\nimport type { RefObject } from \"react\"\nimport type {\n  BreakPoints,\n  ElementData,\n  ElementSchema,\n  PlatformTypeEnum,\n  WeaverseElement,\n  WeaverseProjectDataType,\n  WeaverseType,\n} from \"./types\"\nimport { merge } from \"./utils\"\nimport { stitchesUtils } from \"./utils/styles\"\n\n/**\n * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data\n * @param itemData {ElementData} Weaverse item data\n * @param weaverse {Weaverse} Weaverse instance\n * @example\n * useEffect(() => {\n *     let handleUpdate = (update: any) => {\n *       setData({...update})\n *     }\n *     itemInstance.subscribe(handleUpdate)\n *     return () => {\n *       itemInstance.unsubscribe(handleUpdate)\n *     }\n * }, [])\n */\nexport class WeaverseItemStore {\n  listeners: Set<any> = new Set()\n  ref: RefObject<HTMLElement> = {\n    current: null,\n  }\n  weaverse: Weaverse\n  stitchesClass = \"\"\n  _data: ElementData = { id: \"\", type: \"\" }\n\n  constructor(itemData: ElementData, weaverse: Weaverse) {\n    let { type, id } = itemData\n    this.weaverse = weaverse\n    if (id && type) {\n      weaverse.itemInstances.set(id, this)\n      this.data = { ...itemData }\n    }\n  }\n\n  get _id() {\n    return this._data.id\n  }\n  get _element() {\n    return this.ref.current\n  }\n  get _flags() {\n    return this.Element?.schema?.flags || {}\n  }\n\n  get Element() {\n    return this.weaverse.elementInstances.get(this._data.type!)\n  }\n\n  set data(data: Omit<ElementData, \"id\" | \"type\">) {\n    this._data = { ...this.data, ...data }\n  }\n\n  get data(): ElementData {\n    let defaultCss = this.Element?.defaultCss || {}\n    let currentCss = this._data.css || {}\n    let css = merge(defaultCss, currentCss)\n    let defaultData = { ...this.Element?.Component?.defaultProps }\n    return { ...defaultData, ...this._data, css }\n  }\n\n  setData = (data: Omit<ElementData, \"id\" | \"type\">) => {\n    this.data = Object.assign(this.data, data)\n    this.triggerUpdate()\n    return this.data\n  }\n\n  subscribe = (fn: any) => {\n    this.listeners.add(fn)\n  }\n\n  unsubscribe = (fn: any) => {\n    this.listeners.delete(fn)\n  }\n\n  triggerUpdate = () => {\n    this.listeners.forEach((fn) => {\n      return fn(this.data)\n    })\n  }\n}\n\nexport class Weaverse {\n  /**\n   * The `weaverse-content-root` element of Weaverse SDK\n   */\n  contentRootElement: HTMLElement | undefined\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   */\n  elementInstances = new Map<string, WeaverseElement>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   */\n  itemInstances = new Map<string | number, WeaverseItemStore>()\n  /**\n   * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @type {string}\n   */\n  weaverseHost = \"https://studio.weaverse.io\"\n  /**\n   * Weaverse version, it can be used to load the correct version of Weaverse SDK\n   * @type {string}\n   */\n  weaverseVersion = \"\"\n  /**\n   * Weaverse project key to access project data via API\n   * @type {string}\n   */\n  projectId = \"\"\n\n  pageId = \"\"\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot data={data} /> it will be used to server-side rendering\n   */\n  data: WeaverseProjectDataType = {\n    rootId: \"\",\n    items: [],\n    script: { css: \"\", js: \"\" },\n  }\n  /**\n   * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot\n   * @type {Map<string, (data: any) => void>}\n   */\n  listeners: Set<any> = new Set()\n  /**\n   * Check whether the sdk is in editor or not.\n   * If isDesignMode is true, it means the sdk is isDesignMode mode, render the editor UI,\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   * @type {boolean}\n   */\n  isDesignMode = false\n\n  /**\n   * Check the platform, shopify-section or react-ssr(hydrogen)\n   */\n  platformType: PlatformTypeEnum = \"shopify-section\"\n\n  /**\n   * Check whether the sdk is in preview mode or not\n   * @type {boolean}\n   */\n  isPreviewMode = false\n\n  /**\n   * Use in element to optionally render special HTML for hydration\n   * @type {boolean}\n   */\n  ssrMode = false\n  /**\n   * Stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: any\n  elementSchemas?: ElementSchema[]\n  static WeaverseItemStore: typeof WeaverseItemStore = WeaverseItemStore\n\n  mediaBreakPoints: BreakPoints = {\n    desktop: \"all\",\n    // max-width need to subtract 0.02px to prevent bug https://getbootstrap.com/docs/5.1/layout/breakpoints/#max-width\n    // tablet: \"(max-width: 1023.98px)\", // to set css for tablet, {'@tablet' : { // css }},\n    mobile: \"(max-width: 767.98px)\",\n  }\n\n  /**\n   * constructor\n   * @param weaverseHost {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectId {string} Weaverse project key to access project data via API\n   * @param data {WeaverseProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   * @param mediaBreakPoints {object} Pass down custom media query breakpoints or just use the default.\n   * @param isDesignMode {boolean} check whether the sdk is isDesignMode or not\n   * @param ssrMode {boolean} Use in element to optionally render special HTML for hydration\n   * @param elementSchemas {Array<ElementSchema>} List of element schemas\n   * @param platformType {PlatformTypeEnum} Check the platform, shopify-section or react-ssr(hydrogen)\n   */\n  constructor({\n    weaverseHost,\n    weaverseVersion,\n    projectId,\n    data,\n    mediaBreakPoints,\n    isDesignMode,\n    ssrMode,\n    elementSchemas,\n    platformType,\n    pageId,\n  }: WeaverseType = {}) {\n    this.init({\n      weaverseHost,\n      weaverseVersion,\n      projectId,\n      data,\n      platformType,\n      mediaBreakPoints,\n      isDesignMode,\n      ssrMode,\n      elementSchemas,\n      pageId,\n    })\n  }\n\n  init({\n    weaverseHost,\n    weaverseVersion,\n    elementSchemas,\n    platformType,\n    projectId,\n    data,\n    mediaBreakPoints,\n    isDesignMode,\n    ssrMode,\n    pageId,\n  }: WeaverseType = {}) {\n    this.elementSchemas = elementSchemas || this.elementSchemas\n    this.weaverseHost = weaverseHost || this.weaverseHost\n    this.weaverseVersion = weaverseVersion || this.weaverseVersion\n    this.projectId = projectId || this.projectId\n    this.pageId = pageId || this.pageId\n    this.mediaBreakPoints = mediaBreakPoints || this.mediaBreakPoints\n    this.isDesignMode = isDesignMode || this.isDesignMode\n    this.ssrMode = ssrMode || this.ssrMode\n    this.platformType = platformType || this.platformType\n    this.data = data || this.data\n    this.initProjectItemData()\n    this.initStitches()\n  }\n\n  /**\n   * Register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param element {WeaverseElement} custom React Component\n   */\n  registerElement(element: WeaverseElement) {\n    if (element?.type) {\n      if (!this.elementInstances.has(element.type)) {\n        this.elementInstances.set(element?.type, element)\n      }\n    } else {\n      console.error(\"Weaverse: registerElement: `type` is required\")\n    }\n  }\n\n  initStitches = (externalConfig = {}) => {\n    this.stitchesInstance =\n      this.stitchesInstance ||\n      stitches.createStitches({\n        prefix: \"weaverse\",\n        media: this.mediaBreakPoints,\n        utils: stitchesUtils,\n        ...externalConfig,\n      })\n  }\n\n  subscribe(fn: any) {\n    this.listeners.add(fn)\n  }\n\n  unsubscribe(fn: any) {\n    this.listeners.delete(fn)\n  }\n\n  triggerUpdate() {\n    this.listeners.forEach((fn) => fn())\n  }\n  refreshAllItems() {\n    this.itemInstances.forEach((item) => {\n      item.triggerUpdate()\n    })\n  }\n\n  setProjectData(data: WeaverseProjectDataType) {\n    this.data = data\n    this.initProjectItemData()\n    this.triggerUpdate()\n  }\n\n  initProjectItemData() {\n    const data = this.data\n    if (data?.items) {\n      data.items.forEach((item) => {\n        if (!this.itemInstances.get(item.id as string | number)) {\n          new WeaverseItemStore(item, this)\n        }\n      })\n    }\n  }\n}\n","export let loadScript = (src: string) => {\n  return new Promise((resolve, reject) => {\n    let script = document.createElement(\"script\")\n    script.src = src\n    script.onload = resolve\n    script.onerror = reject\n    script.defer = true\n    document.body.appendChild(script)\n  })\n}\n\nexport default loadScript\n","export let isReactNative = typeof navigator === \"object\" && navigator.product === \"ReactNative\"\nexport let isBrowser = typeof window !== \"undefined\" && !isReactNative\nexport let isIframe = isBrowser && window.top !== window.self\n\n/**\n * Deep merge two objects.\n * @param target\n * @param source\n */\nexport function merge(target: Record<string, any>, source: Record<string, any>) {\n  let t = { ...(target || {}) }\n  // Iterate through `source` properties and if an `Object` set property to merge of `target` and `source` properties\n  for (let key of Object.keys(source)) {\n    if (source[key] instanceof Object && !Array.isArray(source[key])) {\n      Object.assign(source[key], merge(t[key], source[key]))\n    }\n  }\n\n  // Join `target` and modified `source`\n  Object.assign(t || {}, source)\n  return t\n}\n\nexport { loadScript } from \"./load-script\"\n","export let stitchesUtils = {\n  // Abbreviated margin properties\n  m: (value: string) => ({\n    margin: value,\n  }),\n  mt: (value: string) => ({\n    marginTop: value,\n  }),\n  mr: (value: string) => ({\n    marginRight: value,\n  }),\n  mb: (value: string) => ({\n    marginBottom: value,\n  }),\n  ml: (value: string) => ({\n    marginLeft: value,\n  }),\n  mx: (value: string) => ({\n    marginLeft: value,\n    marginRight: value,\n  }),\n  my: (value: string) => ({\n    marginTop: value,\n    marginBottom: value,\n  }),\n\n  // A property for applying width/height together\n  size: (value: string) => ({\n    width: value,\n    height: value,\n  }),\n  // Abbreviated padding properties\n  px: (value: string) => ({\n    paddingLeft: value,\n    paddingRight: value,\n  }),\n  py: (value: string) => ({\n    paddingTop: value,\n    paddingBottom: value,\n  }),\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/index.ts","../src/core.ts","../src/utils/load-script.ts","../src/utils/index.ts","../src/utils/styles.ts"],"sourcesContent":["export * from \"./types\"\nexport * from \"./core\"\nexport * from \"./utils\"\n","// TODO: Implement Weaverse SDK class\n// Only core code is implemented here, avoid importing other packages,\n// the core code should be framework agnostic, no react, vue, angular, etc.\n// noinspection JSUnusedGlobalSymbols\n\n// using stitches core only for framework-agnostic code\nimport * as stitches from \"@stitches/core\"\nimport type Stitches from \"@stitches/core/types/stitches\"\nimport type { RefObject } from \"react\"\nimport type {\n  BreakPoints,\n  ElementData,\n  ElementSchema,\n  PlatformTypeEnum,\n  WeaverseElement,\n  WeaverseProjectDataType,\n  WeaverseType,\n} from \"./types\"\nimport { merge } from \"./utils\"\nimport { stitchesUtils } from \"./utils/styles\"\n\nexport class WeaverseItemStore {\n  weaverse: Weaverse\n  listeners: Set<(_: ElementData) => void> = new Set()\n  ref: RefObject<HTMLElement> = { current: null }\n  platformType: PlatformTypeEnum = \"shopify-section\"\n  stitchesClass = \"\"\n  _store: ElementData = { id: \"\", type: \"\" }\n\n  constructor(itemData: ElementData, weaverse: Weaverse) {\n    let { type, id } = itemData\n    this.weaverse = weaverse\n    this.platformType = weaverse.platformType\n    if (id && type) {\n      weaverse.itemInstances.set(id, this)\n      this._store = { ...itemData }\n    }\n  }\n\n  get _id() {\n    return this._store.id\n  }\n  get _element() {\n    return this.ref.current\n  }\n  get _flags() {\n    return this.Element?.schema?.flags || {}\n  }\n  get Element() {\n    return this.weaverse.elementInstances.get(this._store.type)\n  }\n\n  set data(update: Omit<ElementData, \"id\" | \"type\">) {\n    if (this.platformType === \"shopify-hydrogen\") {\n      let { children, ...rest } = update\n      if (children) {\n        this._store.children = children\n      }\n      this._store.data = merge(this._store.data, rest)\n    } else {\n      this._store = { ...this.data, ...update }\n    }\n  }\n\n  get data(): ElementData {\n    let defaultProps = { ...this.Element?.Component?.defaultProps }\n    if (this.platformType === \"shopify-hydrogen\") {\n      return {\n        ...this._store,\n        data: { ...defaultProps?.data, ...this._store.data },\n      }\n    } else {\n      let defaultCss = this.Element?.defaultCss || {}\n      let currentCss = this._store.css || {}\n      let css = merge(defaultCss, currentCss)\n      let extraData = this.Element?.extraData\n      return { ...defaultProps, ...extraData, ...this._store, css }\n    }\n  }\n\n  setData = (update: Omit<ElementData, \"id\" | \"type\">) => {\n    if (this.platformType === \"shopify-hydrogen\") {\n      this.data = update\n    } else {\n      this.data = Object.assign(this.data, update)\n    }\n    this.triggerUpdate()\n    return this.data\n  }\n\n  subscribe = (fn: (_: ElementData) => void) => {\n    this.listeners.add(fn)\n  }\n\n  unsubscribe = (fn: (_: ElementData) => void) => {\n    this.listeners.delete(fn)\n  }\n\n  triggerUpdate = () => {\n    this.listeners.forEach((fn) => {\n      return fn(this.data)\n    })\n  }\n}\n\nexport class Weaverse {\n  /**\n   * The `weaverse-content-root` element of Weaverse SDK\n   */\n  contentRootElement: HTMLElement | undefined\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   */\n  elementInstances = new Map<string, WeaverseElement>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   */\n  itemInstances = new Map<string | number, WeaverseItemStore>()\n  /**\n   * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   */\n  weaverseHost = \"https://studio.weaverse.io\"\n  /**\n   * Weaverse version, it can be used to load the correct version of Weaverse SDK\n   */\n  weaverseVersion = \"\"\n  /**\n   * Weaverse project key to access project data via API\n   */\n  projectId = \"\"\n\n  pageId = \"\"\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot data={data} /> it will be used to server-side rendering\n   */\n  data: WeaverseProjectDataType = {\n    rootId: \"\",\n    items: [],\n    script: { css: \"\", js: \"\" },\n  }\n  /**\n   * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot\n   */\n  listeners: Set<() => void> = new Set()\n  /**\n   * Check whether the sdk is in editor or not.\n   * If isDesignMode is true, it means the sdk is isDesignMode mode, render the editor UI,\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   */\n  isDesignMode = false\n\n  /**\n   * Check the platform, shopify-section or react-ssr(hydrogen)\n   */\n  platformType: PlatformTypeEnum = \"shopify-section\"\n\n  /**\n   * Check whether the sdk is in preview mode or not\n   */\n  isPreviewMode = false\n\n  /**\n   * Use in element to optionally render special HTML for hydration\n   */\n  ssrMode = false\n  /**\n   * Stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: any\n  elementSchemas: ElementSchema[] = []\n  static WeaverseItemStore: typeof WeaverseItemStore = WeaverseItemStore\n\n  mediaBreakPoints: BreakPoints = {\n    desktop: \"all\",\n    // max-width need to subtract 0.02px to prevent bug https://getbootstrap.com/docs/5.1/layout/breakpoints/#max-width\n    // tablet: \"(max-width: 1023.98px)\", // to set css for tablet, {'@tablet' : { // css }},\n    mobile: \"(max-width: 767.98px)\",\n  }\n\n  /**\n   * constructor\n   * @param weaverseHost {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectId {string} Weaverse project key to access project data via API\n   * @param data {WeaverseProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   * @param mediaBreakPoints {object} Pass down custom media query breakpoints or just use the default.\n   * @param isDesignMode {boolean} check whether the sdk is isDesignMode or not\n   * @param ssrMode {boolean} Use in element to optionally render special HTML for hydration\n   * @param elementSchemas {Array<ElementSchema>} List of element schemas\n   * @param platformType {PlatformTypeEnum} Check the platform, shopify-section or react-ssr(hydrogen)\n   */\n  constructor(params: WeaverseType = {}) {\n    Object.entries(params).forEach(([k, v]) => {\n      let key = k as keyof typeof this\n      this[key] = v || this[key]\n    })\n    this.initProject()\n    this.initStitches()\n  }\n\n  /**\n   * Register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param element {WeaverseElement} custom React Component\n   */\n  registerElement(element: WeaverseElement) {\n    if (element?.type) {\n      if (!this.elementInstances.has(element.type)) {\n        this.elementInstances.set(element?.type, element)\n      }\n    } else {\n      console.error(\"Weaverse: registerElement: `type` is required\")\n    }\n  }\n\n  initStitches = (externalConfig = {}) => {\n    this.stitchesInstance =\n      this.stitchesInstance ||\n      stitches.createStitches({\n        prefix: \"weaverse\",\n        media: this.mediaBreakPoints,\n        utils: stitchesUtils,\n        ...externalConfig,\n      })\n  }\n\n  subscribe(fn: any) {\n    this.listeners.add(fn)\n  }\n\n  unsubscribe(fn: any) {\n    this.listeners.delete(fn)\n  }\n\n  triggerUpdate() {\n    this.listeners.forEach((fn) => fn())\n  }\n  refreshAllItems() {\n    this.itemInstances.forEach((item) => {\n      item.triggerUpdate()\n    })\n  }\n\n  /**\n   * When applying new template,\n   * we need to reset the project data and re-initialize the project item data\n   * @param data {WeaverseProjectDataType}\n   */\n  setProjectData(data: WeaverseProjectDataType) {\n    this.data = data\n    this.initProject()\n    this.triggerUpdate()\n  }\n\n  /**\n   * Create new WeaverseItemStore instance for each item in project data\n   */\n  initProject() {\n    const data = this.data\n    if (data?.items) {\n      data.items.forEach((item) => {\n        if (!this.itemInstances.get(item.id as string | number)) {\n          new WeaverseItemStore(item, this)\n        }\n      })\n    }\n  }\n}\n","export let loadScript = (src: string) => {\n  return new Promise((resolve, reject) => {\n    let script = document.createElement(\"script\")\n    script.src = src\n    script.onload = resolve\n    script.onerror = reject\n    script.defer = true\n    document.body.appendChild(script)\n  })\n}\n\nexport default loadScript\n","export let isReactNative = typeof navigator === \"object\" && navigator.product === \"ReactNative\"\nexport let isBrowser = typeof window !== \"undefined\" && !isReactNative\nexport let isIframe = isBrowser && window.top !== window.self\n\n/**\n * Deep merge two objects.\n * @param target\n * @param source\n */\nexport function merge(target: Record<string, any>, source: Record<string, any>) {\n  let t = { ...(target || {}) }\n  // Iterate through `source` properties and if an `Object` set property to merge of `target` and `source` properties\n  for (let key of Object.keys(source)) {\n    if (source[key] instanceof Object && !Array.isArray(source[key])) {\n      Object.assign(source[key], merge(t[key], source[key]))\n    }\n  }\n\n  // Join `target` and modified `source`\n  Object.assign(t || {}, source)\n  return t\n}\n\nexport { loadScript } from \"./load-script\"\n","export let stitchesUtils = {\n  // Abbreviated margin properties\n  m: (value: string) => ({\n    margin: value,\n  }),\n  mt: (value: string) => ({\n    marginTop: value,\n  }),\n  mr: (value: string) => ({\n    marginRight: value,\n  }),\n  mb: (value: string) => ({\n    marginBottom: value,\n  }),\n  ml: (value: string) => ({\n    marginLeft: value,\n  }),\n  mx: (value: string) => ({\n    marginLeft: value,\n    marginRight: value,\n  }),\n  my: (value: string) => ({\n    marginTop: value,\n    marginBottom: value,\n  }),\n\n  // A property for applying width/height together\n  size: (value: string) => ({\n    width: value,\n    height: value,\n  }),\n  // Abbreviated padding properties\n  px: (value: string) => ({\n    paddingLeft: value,\n    paddingRight: value,\n  }),\n  py: (value: string) => ({\n    paddingTop: value,\n    paddingBottom: value,\n  }),\n}\n"],"mappings":"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","names":[]}

package/dist/index.mjs

@@ -74,14 +74,12 @@ var stitchesUtils = {
 var WeaverseItemStore = class {
   constructor(itemData, weaverse) {
     this.listeners = /* @__PURE__ */ new Set();
-    this.ref = {
-      current: null
-    };
+    this.ref = { current: null };
+    this.platformType = "shopify-section";
     this.stitchesClass = "";
-    this._data = { id: "", type: "" };
+    this._store = { id: "", type: "" };
     this.setData = (update) => {
-      let platformType = this.weaverse.platformType;
-      if (platformType === "shopify-hydrogen") {
+      if (this.platformType === "shopify-hydrogen") {
         this.data = update;
       } else {
         this.data = Object.assign(this.data, update);
@@ -102,13 +100,14 @@ var WeaverseItemStore = class {
     };
     let { type, id } = itemData;
     this.weaverse = weaverse;
+    this.platformType = weaverse.platformType;
     if (id && type) {
       weaverse.itemInstances.set(id, this);
-      this.data = { ...itemData };
+      this._store = { ...itemData };
     }
   }
   get _id() {
-    return this._data.id;
+    return this._store.id;
   }
   get _element() {
     return this.ref.current;
@@ -117,31 +116,33 @@ var WeaverseItemStore = class {
     return this.Element?.schema?.flags || {};
   }
   get Element() {
-    return this.weaverse.elementInstances.get(this._data.type);
+    return this.weaverse.elementInstances.get(this._store.type);
   }
   set data(update) {
-    let platformType = this.weaverse.platformType;
-    if (platformType === "shopify-hydrogen") {
-      this._data.data = merge(this.data, update);
+    if (this.platformType === "shopify-hydrogen") {
+      let { children, ...rest } = update;
+      if (children) {
+        this._store.children = children;
+      }
+      this._store.data = merge(this._store.data, rest);
     } else {
-      this._data = { ...this.data, ...update };
+      this._store = { ...this.data, ...update };
     }
   }
   get data() {
-    let platformType = this.weaverse.platformType;
-    if (platformType === "shopify-hydrogen") {
-      let defaultData2 = { ...this.Element?.Component?.defaultProps };
+    let defaultProps = { ...this.Element?.Component?.defaultProps };
+    if (this.platformType === "shopify-hydrogen") {
       return {
-        ...this._data,
-        ...defaultData2,
-        ...this._data.data
+        ...this._store,
+        data: { ...defaultProps?.data, ...this._store.data }
       };
+    } else {
+      let defaultCss = this.Element?.defaultCss || {};
+      let currentCss = this._store.css || {};
+      let css = merge(defaultCss, currentCss);
+      let extraData = this.Element?.extraData;
+      return { ...defaultProps, ...extraData, ...this._store, css };
     }
-    let defaultCss = this.Element?.defaultCss || {};
-    let currentCss = this._data.css || {};
-    let css = merge(defaultCss, currentCss);
-    let defaultData = { ...this.Element?.Component?.defaultProps, ...this.Element?.extraData || {} };
-    return { ...defaultData, ...this._data, css };
   }
 };
 var Weaverse = class {
@@ -156,18 +157,7 @@ var Weaverse = class {
    * @param elementSchemas {Array<ElementSchema>} List of element schemas
    * @param platformType {PlatformTypeEnum} Check the platform, shopify-section or react-ssr(hydrogen)
    */
-  constructor({
-    weaverseHost,
-    weaverseVersion,
-    projectId,
-    data,
-    mediaBreakPoints,
-    isDesignMode,
-    ssrMode,
-    elementSchemas,
-    platformType,
-    pageId
-  } = {}) {
+  constructor(params = {}) {
     /**
      * For storing, registering element React component from Weaverse or created by user/developer
      */
@@ -178,17 +168,14 @@ var Weaverse = class {
     this.itemInstances = /* @__PURE__ */ new Map();
     /**
      * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
-     * @type {string}
      */
     this.weaverseHost = "https://studio.weaverse.io";
     /**
      * Weaverse version, it can be used to load the correct version of Weaverse SDK
-     * @type {string}
      */
     this.weaverseVersion = "";
     /**
      * Weaverse project key to access project data via API
-     * @type {string}
      */
     this.projectId = "";
     this.pageId = "";
@@ -203,14 +190,12 @@ var Weaverse = class {
     };
     /**
      * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot
-     * @type {Map<string, (data: any) => void>}
      */
     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
-     * @type {boolean}
      */
     this.isDesignMode = false;
     /**
@@ -219,12 +204,10 @@ var Weaverse = class {
     this.platformType = "shopify-section";
     /**
      * Check whether the sdk is in preview mode or not
-     * @type {boolean}
      */
     this.isPreviewMode = false;
     /**
      * Use in element to optionally render special HTML for hydration
-     * @type {boolean}
      */
     this.ssrMode = false;
     this.elementSchemas = [];
@@ -242,42 +225,11 @@ var Weaverse = class {
         ...externalConfig
       });
     };
-    this.init({
-      weaverseHost,
-      weaverseVersion,
-      projectId,
-      data,
-      platformType,
-      mediaBreakPoints,
-      isDesignMode,
-      ssrMode,
-      elementSchemas,
-      pageId
+    Object.entries(params).forEach(([k, v]) => {
+      let key = k;
+      this[key] = v || this[key];
     });
-  }
-  init({
-    weaverseHost,
-    weaverseVersion,
-    elementSchemas,
-    platformType,
-    projectId,
-    data,
-    mediaBreakPoints,
-    isDesignMode,
-    ssrMode,
-    pageId
-  } = {}) {
-    this.elementSchemas = elementSchemas || this.elementSchemas;
-    this.weaverseHost = weaverseHost || this.weaverseHost;
-    this.weaverseVersion = weaverseVersion || this.weaverseVersion;
-    this.projectId = projectId || this.projectId;
-    this.pageId = pageId || this.pageId;
-    this.mediaBreakPoints = mediaBreakPoints || this.mediaBreakPoints;
-    this.isDesignMode = isDesignMode || this.isDesignMode;
-    this.ssrMode = ssrMode || this.ssrMode;
-    this.platformType = platformType || this.platformType;
-    this.data = data || this.data;
-    this.initProjectItemData();
+    this.initProject();
     this.initStitches();
   }
   /**
@@ -307,12 +259,20 @@ var Weaverse = class {
       item.triggerUpdate();
     });
   }
+  /**
+   * When applying new template,
+   * we need to reset the project data and re-initialize the project item data
+   * @param data {WeaverseProjectDataType}
+   */
   setProjectData(data) {
     this.data = data;
-    this.initProjectItemData();
+    this.initProject();
     this.triggerUpdate();
   }
-  initProjectItemData() {
+  /**
+   * Create new WeaverseItemStore instance for each item in project data
+   */
+  initProject() {
     const data = this.data;
     if (data?.items) {
       data.items.forEach((item) => {

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/core.ts","../src/utils/load-script.ts","../src/utils/index.ts","../src/utils/styles.ts"],"sourcesContent":["// TODO: Implement Weaverse SDK class\n// Only core code is implemented here, avoid importing other packages,\n// the core code should be framework agnostic, no react, vue, angular, etc.\n// noinspection JSUnusedGlobalSymbols\n\n// using stitches core only for framework-agnostic code\nimport * as stitches from \"@stitches/core\"\nimport type Stitches from \"@stitches/core/types/stitches\"\nimport type { RefObject } from \"react\"\nimport type {\n  BreakPoints,\n  ElementData,\n  ElementSchema,\n  PlatformTypeEnum,\n  WeaverseElement,\n  WeaverseProjectDataType,\n  WeaverseType,\n} from \"./types\"\nimport { merge } from \"./utils\"\nimport { stitchesUtils } from \"./utils/styles\"\n\n/**\n * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data\n * @param itemData {ElementData} Weaverse item data\n * @param weaverse {Weaverse} Weaverse instance\n * @example\n * useEffect(() => {\n *     let handleUpdate = (update: any) => {\n *       setData({...update})\n *     }\n *     itemInstance.subscribe(handleUpdate)\n *     return () => {\n *       itemInstance.unsubscribe(handleUpdate)\n *     }\n * }, [])\n */\nexport class WeaverseItemStore {\n  listeners: Set<any> = new Set()\n  ref: RefObject<HTMLElement> = {\n    current: null,\n  }\n  weaverse: Weaverse\n  stitchesClass = \"\"\n  _data: ElementData = { id: \"\", type: \"\" }\n\n  constructor(itemData: ElementData, weaverse: Weaverse) {\n    let { type, id } = itemData\n    this.weaverse = weaverse\n    if (id && type) {\n      weaverse.itemInstances.set(id, this)\n      this.data = { ...itemData }\n    }\n  }\n\n  get _id() {\n    return this._data.id\n  }\n  get _element() {\n    return this.ref.current\n  }\n  get _flags() {\n    return this.Element?.schema?.flags || {}\n  }\n\n  get Element() {\n    return this.weaverse.elementInstances.get(this._data.type!)\n  }\n\n  set data(data: Omit<ElementData, \"id\" | \"type\">) {\n    this._data = { ...this.data, ...data }\n  }\n\n  get data(): ElementData {\n    let defaultCss = this.Element?.defaultCss || {}\n    let currentCss = this._data.css || {}\n    let css = merge(defaultCss, currentCss)\n    let defaultData = { ...this.Element?.Component?.defaultProps }\n    return { ...defaultData, ...this._data, css }\n  }\n\n  setData = (data: Omit<ElementData, \"id\" | \"type\">) => {\n    this.data = Object.assign(this.data, data)\n    this.triggerUpdate()\n    return this.data\n  }\n\n  subscribe = (fn: any) => {\n    this.listeners.add(fn)\n  }\n\n  unsubscribe = (fn: any) => {\n    this.listeners.delete(fn)\n  }\n\n  triggerUpdate = () => {\n    this.listeners.forEach((fn) => {\n      return fn(this.data)\n    })\n  }\n}\n\nexport class Weaverse {\n  /**\n   * The `weaverse-content-root` element of Weaverse SDK\n   */\n  contentRootElement: HTMLElement | undefined\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   */\n  elementInstances = new Map<string, WeaverseElement>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   */\n  itemInstances = new Map<string | number, WeaverseItemStore>()\n  /**\n   * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @type {string}\n   */\n  weaverseHost = \"https://studio.weaverse.io\"\n  /**\n   * Weaverse version, it can be used to load the correct version of Weaverse SDK\n   * @type {string}\n   */\n  weaverseVersion = \"\"\n  /**\n   * Weaverse project key to access project data via API\n   * @type {string}\n   */\n  projectId = \"\"\n\n  pageId = \"\"\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot data={data} /> it will be used to server-side rendering\n   */\n  data: WeaverseProjectDataType = {\n    rootId: \"\",\n    items: [],\n    script: { css: \"\", js: \"\" },\n  }\n  /**\n   * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot\n   * @type {Map<string, (data: any) => void>}\n   */\n  listeners: Set<any> = new Set()\n  /**\n   * Check whether the sdk is in editor or not.\n   * If isDesignMode is true, it means the sdk is isDesignMode mode, render the editor UI,\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   * @type {boolean}\n   */\n  isDesignMode = false\n\n  /**\n   * Check the platform, shopify-section or react-ssr(hydrogen)\n   */\n  platformType: PlatformTypeEnum = \"shopify-section\"\n\n  /**\n   * Check whether the sdk is in preview mode or not\n   * @type {boolean}\n   */\n  isPreviewMode = false\n\n  /**\n   * Use in element to optionally render special HTML for hydration\n   * @type {boolean}\n   */\n  ssrMode = false\n  /**\n   * Stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: any\n  elementSchemas?: ElementSchema[]\n  static WeaverseItemStore: typeof WeaverseItemStore = WeaverseItemStore\n\n  mediaBreakPoints: BreakPoints = {\n    desktop: \"all\",\n    // max-width need to subtract 0.02px to prevent bug https://getbootstrap.com/docs/5.1/layout/breakpoints/#max-width\n    // tablet: \"(max-width: 1023.98px)\", // to set css for tablet, {'@tablet' : { // css }},\n    mobile: \"(max-width: 767.98px)\",\n  }\n\n  /**\n   * constructor\n   * @param weaverseHost {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectId {string} Weaverse project key to access project data via API\n   * @param data {WeaverseProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   * @param mediaBreakPoints {object} Pass down custom media query breakpoints or just use the default.\n   * @param isDesignMode {boolean} check whether the sdk is isDesignMode or not\n   * @param ssrMode {boolean} Use in element to optionally render special HTML for hydration\n   * @param elementSchemas {Array<ElementSchema>} List of element schemas\n   * @param platformType {PlatformTypeEnum} Check the platform, shopify-section or react-ssr(hydrogen)\n   */\n  constructor({\n    weaverseHost,\n    weaverseVersion,\n    projectId,\n    data,\n    mediaBreakPoints,\n    isDesignMode,\n    ssrMode,\n    elementSchemas,\n    platformType,\n    pageId,\n  }: WeaverseType = {}) {\n    this.init({\n      weaverseHost,\n      weaverseVersion,\n      projectId,\n      data,\n      platformType,\n      mediaBreakPoints,\n      isDesignMode,\n      ssrMode,\n      elementSchemas,\n      pageId,\n    })\n  }\n\n  init({\n    weaverseHost,\n    weaverseVersion,\n    elementSchemas,\n    platformType,\n    projectId,\n    data,\n    mediaBreakPoints,\n    isDesignMode,\n    ssrMode,\n    pageId,\n  }: WeaverseType = {}) {\n    this.elementSchemas = elementSchemas || this.elementSchemas\n    this.weaverseHost = weaverseHost || this.weaverseHost\n    this.weaverseVersion = weaverseVersion || this.weaverseVersion\n    this.projectId = projectId || this.projectId\n    this.pageId = pageId || this.pageId\n    this.mediaBreakPoints = mediaBreakPoints || this.mediaBreakPoints\n    this.isDesignMode = isDesignMode || this.isDesignMode\n    this.ssrMode = ssrMode || this.ssrMode\n    this.platformType = platformType || this.platformType\n    this.data = data || this.data\n    this.initProjectItemData()\n    this.initStitches()\n  }\n\n  /**\n   * Register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param element {WeaverseElement} custom React Component\n   */\n  registerElement(element: WeaverseElement) {\n    if (element?.type) {\n      if (!this.elementInstances.has(element.type)) {\n        this.elementInstances.set(element?.type, element)\n      }\n    } else {\n      console.error(\"Weaverse: registerElement: `type` is required\")\n    }\n  }\n\n  initStitches = (externalConfig = {}) => {\n    this.stitchesInstance =\n      this.stitchesInstance ||\n      stitches.createStitches({\n        prefix: \"weaverse\",\n        media: this.mediaBreakPoints,\n        utils: stitchesUtils,\n        ...externalConfig,\n      })\n  }\n\n  subscribe(fn: any) {\n    this.listeners.add(fn)\n  }\n\n  unsubscribe(fn: any) {\n    this.listeners.delete(fn)\n  }\n\n  triggerUpdate() {\n    this.listeners.forEach((fn) => fn())\n  }\n  refreshAllItems() {\n    this.itemInstances.forEach((item) => {\n      item.triggerUpdate()\n    })\n  }\n\n  setProjectData(data: WeaverseProjectDataType) {\n    this.data = data\n    this.initProjectItemData()\n    this.triggerUpdate()\n  }\n\n  initProjectItemData() {\n    const data = this.data\n    if (data?.items) {\n      data.items.forEach((item) => {\n        if (!this.itemInstances.get(item.id as string | number)) {\n          new WeaverseItemStore(item, this)\n        }\n      })\n    }\n  }\n}\n","export let loadScript = (src: string) => {\n  return new Promise((resolve, reject) => {\n    let script = document.createElement(\"script\")\n    script.src = src\n    script.onload = resolve\n    script.onerror = reject\n    script.defer = true\n    document.body.appendChild(script)\n  })\n}\n\nexport default loadScript\n","export let isReactNative = typeof navigator === \"object\" && navigator.product === \"ReactNative\"\nexport let isBrowser = typeof window !== \"undefined\" && !isReactNative\nexport let isIframe = isBrowser && window.top !== window.self\n\n/**\n * Deep merge two objects.\n * @param target\n * @param source\n */\nexport function merge(target: Record<string, any>, source: Record<string, any>) {\n  let t = { ...(target || {}) }\n  // Iterate through `source` properties and if an `Object` set property to merge of `target` and `source` properties\n  for (let key of Object.keys(source)) {\n    if (source[key] instanceof Object && !Array.isArray(source[key])) {\n      Object.assign(source[key], merge(t[key], source[key]))\n    }\n  }\n\n  // Join `target` and modified `source`\n  Object.assign(t || {}, source)\n  return t\n}\n\nexport { loadScript } from \"./load-script\"\n","export let stitchesUtils = {\n  // Abbreviated margin properties\n  m: (value: string) => ({\n    margin: value,\n  }),\n  mt: (value: string) => ({\n    marginTop: value,\n  }),\n  mr: (value: string) => ({\n    marginRight: value,\n  }),\n  mb: (value: string) => ({\n    marginBottom: value,\n  }),\n  ml: (value: string) => ({\n    marginLeft: value,\n  }),\n  mx: (value: string) => ({\n    marginLeft: value,\n    marginRight: value,\n  }),\n  my: (value: string) => ({\n    marginTop: value,\n    marginBottom: value,\n  }),\n\n  // A property for applying width/height together\n  size: (value: string) => ({\n    width: value,\n    height: value,\n  }),\n  // Abbreviated padding properties\n  px: (value: string) => ({\n    paddingLeft: value,\n    paddingRight: value,\n  }),\n  py: (value: string) => ({\n    paddingTop: value,\n    paddingBottom: value,\n  }),\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/core.ts","../src/utils/load-script.ts","../src/utils/index.ts","../src/utils/styles.ts"],"sourcesContent":["// TODO: Implement Weaverse SDK class\n// Only core code is implemented here, avoid importing other packages,\n// the core code should be framework agnostic, no react, vue, angular, etc.\n// noinspection JSUnusedGlobalSymbols\n\n// using stitches core only for framework-agnostic code\nimport * as stitches from \"@stitches/core\"\nimport type Stitches from \"@stitches/core/types/stitches\"\nimport type { RefObject } from \"react\"\nimport type {\n  BreakPoints,\n  ElementData,\n  ElementSchema,\n  PlatformTypeEnum,\n  WeaverseElement,\n  WeaverseProjectDataType,\n  WeaverseType,\n} from \"./types\"\nimport { merge } from \"./utils\"\nimport { stitchesUtils } from \"./utils/styles\"\n\nexport class WeaverseItemStore {\n  weaverse: Weaverse\n  listeners: Set<(_: ElementData) => void> = new Set()\n  ref: RefObject<HTMLElement> = { current: null }\n  platformType: PlatformTypeEnum = \"shopify-section\"\n  stitchesClass = \"\"\n  _store: ElementData = { id: \"\", type: \"\" }\n\n  constructor(itemData: ElementData, weaverse: Weaverse) {\n    let { type, id } = itemData\n    this.weaverse = weaverse\n    this.platformType = weaverse.platformType\n    if (id && type) {\n      weaverse.itemInstances.set(id, this)\n      this._store = { ...itemData }\n    }\n  }\n\n  get _id() {\n    return this._store.id\n  }\n  get _element() {\n    return this.ref.current\n  }\n  get _flags() {\n    return this.Element?.schema?.flags || {}\n  }\n  get Element() {\n    return this.weaverse.elementInstances.get(this._store.type)\n  }\n\n  set data(update: Omit<ElementData, \"id\" | \"type\">) {\n    if (this.platformType === \"shopify-hydrogen\") {\n      let { children, ...rest } = update\n      if (children) {\n        this._store.children = children\n      }\n      this._store.data = merge(this._store.data, rest)\n    } else {\n      this._store = { ...this.data, ...update }\n    }\n  }\n\n  get data(): ElementData {\n    let defaultProps = { ...this.Element?.Component?.defaultProps }\n    if (this.platformType === \"shopify-hydrogen\") {\n      return {\n        ...this._store,\n        data: { ...defaultProps?.data, ...this._store.data },\n      }\n    } else {\n      let defaultCss = this.Element?.defaultCss || {}\n      let currentCss = this._store.css || {}\n      let css = merge(defaultCss, currentCss)\n      let extraData = this.Element?.extraData\n      return { ...defaultProps, ...extraData, ...this._store, css }\n    }\n  }\n\n  setData = (update: Omit<ElementData, \"id\" | \"type\">) => {\n    if (this.platformType === \"shopify-hydrogen\") {\n      this.data = update\n    } else {\n      this.data = Object.assign(this.data, update)\n    }\n    this.triggerUpdate()\n    return this.data\n  }\n\n  subscribe = (fn: (_: ElementData) => void) => {\n    this.listeners.add(fn)\n  }\n\n  unsubscribe = (fn: (_: ElementData) => void) => {\n    this.listeners.delete(fn)\n  }\n\n  triggerUpdate = () => {\n    this.listeners.forEach((fn) => {\n      return fn(this.data)\n    })\n  }\n}\n\nexport class Weaverse {\n  /**\n   * The `weaverse-content-root` element of Weaverse SDK\n   */\n  contentRootElement: HTMLElement | undefined\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   */\n  elementInstances = new Map<string, WeaverseElement>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   */\n  itemInstances = new Map<string | number, WeaverseItemStore>()\n  /**\n   * Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   */\n  weaverseHost = \"https://studio.weaverse.io\"\n  /**\n   * Weaverse version, it can be used to load the correct version of Weaverse SDK\n   */\n  weaverseVersion = \"\"\n  /**\n   * Weaverse project key to access project data via API\n   */\n  projectId = \"\"\n\n  pageId = \"\"\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot data={data} /> it will be used to server-side rendering\n   */\n  data: WeaverseProjectDataType = {\n    rootId: \"\",\n    items: [],\n    script: { css: \"\", js: \"\" },\n  }\n  /**\n   * Storing subscribe callback function for any component that want to listen to the change of WeaverseRoot\n   */\n  listeners: Set<() => void> = new Set()\n  /**\n   * Check whether the sdk is in editor or not.\n   * If isDesignMode is true, it means the sdk is isDesignMode mode, render the editor UI,\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   */\n  isDesignMode = false\n\n  /**\n   * Check the platform, shopify-section or react-ssr(hydrogen)\n   */\n  platformType: PlatformTypeEnum = \"shopify-section\"\n\n  /**\n   * Check whether the sdk is in preview mode or not\n   */\n  isPreviewMode = false\n\n  /**\n   * Use in element to optionally render special HTML for hydration\n   */\n  ssrMode = false\n  /**\n   * Stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: any\n  elementSchemas: ElementSchema[] = []\n  static WeaverseItemStore: typeof WeaverseItemStore = WeaverseItemStore\n\n  mediaBreakPoints: BreakPoints = {\n    desktop: \"all\",\n    // max-width need to subtract 0.02px to prevent bug https://getbootstrap.com/docs/5.1/layout/breakpoints/#max-width\n    // tablet: \"(max-width: 1023.98px)\", // to set css for tablet, {'@tablet' : { // css }},\n    mobile: \"(max-width: 767.98px)\",\n  }\n\n  /**\n   * constructor\n   * @param weaverseHost {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectId {string} Weaverse project key to access project data via API\n   * @param data {WeaverseProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   * @param mediaBreakPoints {object} Pass down custom media query breakpoints or just use the default.\n   * @param isDesignMode {boolean} check whether the sdk is isDesignMode or not\n   * @param ssrMode {boolean} Use in element to optionally render special HTML for hydration\n   * @param elementSchemas {Array<ElementSchema>} List of element schemas\n   * @param platformType {PlatformTypeEnum} Check the platform, shopify-section or react-ssr(hydrogen)\n   */\n  constructor(params: WeaverseType = {}) {\n    Object.entries(params).forEach(([k, v]) => {\n      let key = k as keyof typeof this\n      this[key] = v || this[key]\n    })\n    this.initProject()\n    this.initStitches()\n  }\n\n  /**\n   * Register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param element {WeaverseElement} custom React Component\n   */\n  registerElement(element: WeaverseElement) {\n    if (element?.type) {\n      if (!this.elementInstances.has(element.type)) {\n        this.elementInstances.set(element?.type, element)\n      }\n    } else {\n      console.error(\"Weaverse: registerElement: `type` is required\")\n    }\n  }\n\n  initStitches = (externalConfig = {}) => {\n    this.stitchesInstance =\n      this.stitchesInstance ||\n      stitches.createStitches({\n        prefix: \"weaverse\",\n        media: this.mediaBreakPoints,\n        utils: stitchesUtils,\n        ...externalConfig,\n      })\n  }\n\n  subscribe(fn: any) {\n    this.listeners.add(fn)\n  }\n\n  unsubscribe(fn: any) {\n    this.listeners.delete(fn)\n  }\n\n  triggerUpdate() {\n    this.listeners.forEach((fn) => fn())\n  }\n  refreshAllItems() {\n    this.itemInstances.forEach((item) => {\n      item.triggerUpdate()\n    })\n  }\n\n  /**\n   * When applying new template,\n   * we need to reset the project data and re-initialize the project item data\n   * @param data {WeaverseProjectDataType}\n   */\n  setProjectData(data: WeaverseProjectDataType) {\n    this.data = data\n    this.initProject()\n    this.triggerUpdate()\n  }\n\n  /**\n   * Create new WeaverseItemStore instance for each item in project data\n   */\n  initProject() {\n    const data = this.data\n    if (data?.items) {\n      data.items.forEach((item) => {\n        if (!this.itemInstances.get(item.id as string | number)) {\n          new WeaverseItemStore(item, this)\n        }\n      })\n    }\n  }\n}\n","export let loadScript = (src: string) => {\n  return new Promise((resolve, reject) => {\n    let script = document.createElement(\"script\")\n    script.src = src\n    script.onload = resolve\n    script.onerror = reject\n    script.defer = true\n    document.body.appendChild(script)\n  })\n}\n\nexport default loadScript\n","export let isReactNative = typeof navigator === \"object\" && navigator.product === \"ReactNative\"\nexport let isBrowser = typeof window !== \"undefined\" && !isReactNative\nexport let isIframe = isBrowser && window.top !== window.self\n\n/**\n * Deep merge two objects.\n * @param target\n * @param source\n */\nexport function merge(target: Record<string, any>, source: Record<string, any>) {\n  let t = { ...(target || {}) }\n  // Iterate through `source` properties and if an `Object` set property to merge of `target` and `source` properties\n  for (let key of Object.keys(source)) {\n    if (source[key] instanceof Object && !Array.isArray(source[key])) {\n      Object.assign(source[key], merge(t[key], source[key]))\n    }\n  }\n\n  // Join `target` and modified `source`\n  Object.assign(t || {}, source)\n  return t\n}\n\nexport { loadScript } from \"./load-script\"\n","export let stitchesUtils = {\n  // Abbreviated margin properties\n  m: (value: string) => ({\n    margin: value,\n  }),\n  mt: (value: string) => ({\n    marginTop: value,\n  }),\n  mr: (value: string) => ({\n    marginRight: value,\n  }),\n  mb: (value: string) => ({\n    marginBottom: value,\n  }),\n  ml: (value: string) => ({\n    marginLeft: value,\n  }),\n  mx: (value: string) => ({\n    marginLeft: value,\n    marginRight: value,\n  }),\n  my: (value: string) => ({\n    marginTop: value,\n    marginBottom: value,\n  }),\n\n  // A property for applying width/height together\n  size: (value: string) => ({\n    width: value,\n    height: value,\n  }),\n  // Abbreviated padding properties\n  px: (value: string) => ({\n    paddingLeft: value,\n    paddingRight: value,\n  }),\n  py: (value: string) => ({\n    paddingTop: value,\n    paddingBottom: value,\n  }),\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.0.45",
+  "version": "1.0.46",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -24,5 +24,8 @@
   "author": "Weaverse Team",
   "dependencies": {
     "@stitches/core": "^1.2.8"
+  },
+  "optionalDependencies": {
+    "@esbuild/darwin-x64": "*"
   }
 }