@weaverse/core 0.2.2 → 0.2.3

package/dist/core.cjs.development.js

@@ -11,96 +11,6 @@ var isReactNative = typeof navigator === 'object' && navigator.product === 'Reac
 var isBrowser = typeof window !== 'undefined' && !isReactNative;
 var isIframe = isBrowser && window.top !== window.self;
 
-/**
- * When the editor is ready, we'll load this studio-bridge code.
- * This is for processing data between the editor and the workspace project.
- * It will not load in production mode or not running when the editor is not detected/ready.
- */
-
-var StudioBridge = /*#__PURE__*/function () {
-  function StudioBridge(weaverse) {
-    var _this = this;
-
-    /**
-     * handle the message event from editor(parent window)
-     * the message type will start with "weavers.",
-     * when an item got message to update, get the item instance and setData to it
-     * @param event {MessageEvent}
-     */
-    this.handleMessageEvent = function (event) {
-      var _event$data, _event$data$type;
-
-      if ((_event$data = event.data) != null && (_event$data$type = _event$data.type) != null && _event$data$type.startsWith('weaverse.')) {
-        var type = event.data.type;
-
-        switch (type) {
-          case 'weaverse.editor.ready':
-            _this.weaverse.isEditor = true;
-            break;
-
-          case 'weaverse.editor.update':
-            var payload = event.data.payload;
-            var itemId = payload.itemId,
-                background = payload.background;
-
-            var instance = _this.weaverse.itemInstances.get(itemId);
-
-            if (instance) {
-              instance.setData({
-                css: {
-                  background: background
-                }
-              });
-            }
-
-        }
-      }
-    };
-
-    this.handleMouseDown = function (e) {
-      console.log('handleMouseDown', e);
-
-      _this.sendMessageToEditor('weaverse.editor.mouseDown', {});
-    };
-
-    this.weaverse = weaverse;
-    this.handleProps = {
-      onMouseDownCapture: this.handleMouseDown.bind(this)
-    };
-  }
-  /**
-   * subscribe to window message event from editor(parent window), and handle the message event
-   */
-
-
-  var _proto = StudioBridge.prototype;
-
-  _proto.subscribeMessageEvent = function subscribeMessageEvent() {
-    var _this2 = this;
-
-    if (typeof this.currentFrameSubscription === 'function') {
-      this.currentFrameSubscription();
-    }
-
-    isBrowser && window.addEventListener('message', this.handleMessageEvent);
-
-    this.currentFrameSubscription = function () {
-      isBrowser && window.removeEventListener('message', _this2.handleMessageEvent);
-    };
-
-    return this.currentFrameSubscription;
-  };
-
-  _proto.sendMessageToEditor = function sendMessageToEditor(type, payload) {
-    isBrowser && window.parent.postMessage({
-      type: type,
-      payload: payload
-    }, '*');
-  };
-
-  return StudioBridge;
-}();
-
 // TODO: Implement Weaverse SDK class
 // using stitches core only for framework-agnostic code
 
@@ -192,20 +102,41 @@ var Weaverse = /*#__PURE__*/function () {
         bp3: '(min-width: 1024px)'
       }
     });
+    this.loadStudio();
   };
 
   _proto.loadStudio = function loadStudio() {
-    console.log('"development"', "development"); // only load studio bridge if it's in editor mode
-
-    {
-      // TODO: separate studio bridge into a separate package
-      // in development mode, we should use localhost:3000 as appUrl
-      // this.appUrl = 'http://localhost:3000'
-      // let StudioBridge = require('./studio-bridge')
-      this.studioBridge = new StudioBridge(this);
-      console.log('Weaverse: init studio bridge', this.studioBridge);
-      this.studioBridge.subscribeMessageEvent();
-      return true;
+    var _this = this;
+
+    if (isIframe) {
+      var initStudio = function initStudio() {
+        var StudioBridge = window.WeaverseStudioBridge;
+        _this.studioBridge = new StudioBridge(_this);
+
+        _this.studioBridge.subscribeMessageEvent();
+
+        _this.triggerUpdate();
+
+        console.log('studio bridge initialized', _this.studioBridge);
+      };
+
+      window.addEventListener('message', function (e) {
+        var _e$data;
+
+        if (((_e$data = e.data) == null ? void 0 : _e$data.type) === 'weaverse.editor.ready') {
+          _this.isEditor = true;
+
+          if (!window.WeaverseStudioBridge) {
+            // load studio bridge script by url: https://weaverse.io/assets/studio/studio-bridge.js
+            var studioBridgeScript = document.createElement('script');
+            studioBridgeScript.src = _this.appUrl + "/assets/studio/studio-bridge.js";
+            studioBridgeScript.onload = initStudio;
+            document.body.appendChild(studioBridgeScript);
+          } else {
+            initStudio();
+          }
+        }
+      });
     }
   };
 
@@ -265,15 +196,15 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.initItemData = function initItemData() {
-    var _this2 = this;
+    var _this3 = this;
 
     var data = this.projectData;
 
     if (data.items) {
       data.items.forEach(function (item) {
-        var itemStore = _this2.itemInstances.get(item.id) || new WeaverseItemStore(item, _this2);
+        var itemStore = _this3.itemInstances.get(item.id) || new WeaverseItemStore(item, _this3);
 
-        _this2.itemInstances.set(item.id, itemStore);
+        _this3.itemInstances.set(item.id, itemStore);
       });
     }
   };
@@ -299,7 +230,7 @@ var Weaverse = /*#__PURE__*/function () {
  */
 
 var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
-  var _this3 = this;
+  var _this4 = this;
 
   if (itemData === void 0) {
     itemData = {};
@@ -312,22 +243,22 @@ var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
   };
 
   this.setData = function (data) {
-    _this3.data = Object.assign(_this3.data, data);
+    _this4.data = Object.assign(_this4.data, data);
 
-    _this3.triggerUpdate();
+    _this4.triggerUpdate();
   };
 
   this.subscribe = function (fn) {
-    _this3.listeners.add(fn);
+    _this4.listeners.add(fn);
   };
 
   this.unsubscribe = function (fn) {
-    _this3.listeners["delete"](fn);
+    _this4.listeners["delete"](fn);
   };
 
   this.triggerUpdate = function () {
-    _this3.listeners.forEach(function (fn) {
-      return fn(_this3.data);
+    _this4.listeners.forEach(function (fn) {
+      return fn(_this4.data);
     });
   };
 

package/dist/core.cjs.development.js.map

@@ -1 +1 @@
-{"version":3,"file":"core.cjs.development.js","sources":["../src/utils/index.ts","../src/studio-bridge.ts","../src/core.ts"],"sourcesContent":["export const isReactNative = typeof navigator === 'object' && navigator.product === 'ReactNative'\nexport const isBrowser = typeof window !== 'undefined' && !isReactNative\nexport const isIframe = isBrowser && window.top !== window.self","import {isBrowser} from './utils'\nimport type {Weaverse} from '.'\n\n/**\n * When the editor is ready, we'll load this studio-bridge code.\n * This is for processing data between the editor and the workspace project.\n * It will not load in production mode or not running when the editor is not detected/ready.\n */\n\nexport class StudioBridge {\n  weaverse: Weaverse\n\n  /**\n   * instance for subscribing to window message, save it to currentFrameSubscription then can remove it when unmount\n   */\n  currentFrameSubscription: any\n  handleProps: any\n  constructor(weaverse: Weaverse) {\n    this.weaverse = weaverse\n    this.handleProps = {\n      onMouseDownCapture: this.handleMouseDown.bind(this)\n    }\n  }\n\n  /**\n   * subscribe to window message event from editor(parent window), and handle the message event\n   */\n  subscribeMessageEvent() {\n    if (typeof this.currentFrameSubscription === 'function') {\n      this.currentFrameSubscription()\n    }\n    isBrowser && window.addEventListener('message', this.handleMessageEvent)\n    this.currentFrameSubscription = () => {\n      isBrowser && window.removeEventListener('message', this.handleMessageEvent)\n    }\n    return this.currentFrameSubscription\n  }\n\n  /**\n   * handle the message event from editor(parent window)\n   * the message type will start with \"weavers.\",\n   * when an item got message to update, get the item instance and setData to it\n   * @param event {MessageEvent}\n   */\n  handleMessageEvent = (event: MessageEvent) => {\n    if (event.data?.type?.startsWith('weaverse.')) {\n      let type = event.data.type\n      switch (type) {\n        case 'weaverse.editor.ready':\n          this.weaverse.isEditor = true\n          break\n        case 'weaverse.editor.update':\n          let {payload} = event.data\n          let {itemId, background} = payload\n          let instance = this.weaverse.itemInstances.get(itemId)\n          if (instance) {\n            instance.setData({\n              css: {\n                background\n              }\n            })\n          }\n      }\n    }\n  }\n\n  sendMessageToEditor(type: string, payload: any) {\n    isBrowser && window.parent.postMessage({type, payload}, '*')\n  }\n\n  handleMouseDown = (e: MouseEvent) => {\n    console.log('handleMouseDown', e)\n    this.sendMessageToEditor('weaverse.editor.mouseDown', {})\n  }\n}\n\n\nexport default StudioBridge","// 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.\nimport fetch from 'isomorphic-unfetch'\nimport * as process from 'process'\nimport StudioBridge from './studio-bridge'\nimport Stitches from '@stitches/core/types/stitches'\n// stitches problem, we should use require instead of import\n// using stitches core only for framework-agnostic code\nlet stitches = require('@stitches/core')\n\n\nexport interface ProjectDataItemType {\n  type: string\n  name?: string\n  id: string | number\n  description?: string\n  childIds?: Array<string | number>\n  css?: {\n    [key: string]: string\n  }\n}\n\nexport interface ProjectDataType {\n  items: ProjectDataItemType[]\n}\n\n\nexport type WeaverseType = {\n  [key: string]: any\n  appUrl?: string,\n  projectKey?: string,\n  projectData?: ProjectDataType\n}\n\n\nexport class Weaverse {\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   * @type {Map<string, React.Component>}\n   */\n  elementInstances = new Map<string, any>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   * @type {Map<string, any>}\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  appUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n  /**\n   * Weaverse project key to access project data via API\n   * @type {string}\n   */\n  projectKey: string = ''\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot defaultData={projectData} /> it will be used to server-side rendering\n   */\n  projectData: ProjectDataType = {\n    items: []\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 inEditor or not\n   * if isEditor is true, it means the sdk is inEditor mode, render the editor UI\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   * @type {boolean}\n   */\n  isEditor = false\n  /**\n   * stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: StudioBridge\n\n  /**\n   * constructor\n   * @param appUrl {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectKey {string} Weaverse project key to access project data via API\n   * @param projectData {ProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   */\n  constructor({appUrl, projectKey, projectData}: WeaverseType = {}) {\n    this.appUrl = appUrl || this.appUrl\n    this.projectKey = projectKey || this.projectKey\n    projectData && (this.projectData = projectData)\n    this.init()\n  }\n\n  /**\n   * register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param name {string} unique name of the custom React Component\n   * @param element {React.Component} custom React Component\n   */\n  registerElement(name: string, element: any) {\n    this.elementInstances.set(name, element)\n  }\n\n  init() {\n    // init the stitches instance\n    this.stitchesInstance = stitches.createStitches(\n      {\n        prefix: 'weaverse',\n        media: {\n          bp1: '(min-width: 640px)',\n          bp2: '(max-width: 768px)',\n          bp3: '(min-width: 1024px)'\n        }\n      }\n    )\n  }\n\n  loadStudio() {\n    console.log('process.env.NODE_ENV', process.env.NODE_ENV)\n    // only load studio bridge if it's in editor mode\n    if (process.env.NODE_ENV !== 'production') {\n      // TODO: separate studio bridge into a separate package\n      // in development mode, we should use localhost:3000 as appUrl\n      // this.appUrl = 'http://localhost:3000'\n      // let StudioBridge = require('./studio-bridge')\n      this.studioBridge = new StudioBridge(this)\n      console.log('Weaverse: init studio bridge', this.studioBridge)\n\n      this.studioBridge.subscribeMessageEvent()\n      return true\n    }\n    return false\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    this.triggerEditorUpdate()\n  }\n\n  /**\n   * fetch data from Weaverse API (https://weaverse.io/api/v1/projects/:projectKey)\n   */\n  fetchProjectData() {\n    return fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json()).catch(console.error)\n  }\n\n  /**\n   * fetch and update the project data, then trigger update to re-render the WeaverseRoot\n   */\n  updateProjectData() {\n    console.log('this.projectData', this.projectData)\n    this.initItemData()\n    this.triggerUpdate()\n    return\n    if (this.projectKey) {\n      this.fetchProjectData().then(data => {\n        if (data) {\n          this.projectData = data\n          this.initItemData()\n          this.triggerUpdate()\n        }\n      }).catch(err => {\n        console.error(err)\n      })\n    }\n  }\n\n\n  triggerEditorUpdate(type = 'weaverse.workspace.init') {\n    if (this.isEditor) {\n      window.top?.postMessage({\n        type, payload: {\n          projectKey: this.projectKey,\n          projectData: this.projectData\n        }\n      }, '*')\n    }\n  }\n\n  initItemData() {\n    let data = this.projectData\n    if (data.items) {\n      data.items.forEach(item => {\n        let itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n        this.itemInstances.set(item.id, itemStore)\n      })\n    }\n  }\n}\n\n/**\n * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data\n * @param itemData {ProjectDataItemType} Weaverse item data\n * @param weaverse {Weaverse} Weaverse instance\n * Usage:\n * ```jsx\n * useEffect(() => {\n *     let handleUpdate = (update: any) => {\n *       setData({...update})\n *     }\n *     itemInstance.subscribe(handleUpdate)\n *     return () => {\n *       itemInstance.unsubscribe(handleUpdate)\n *     }\n *   }, [])\n *   ```\n */\nexport class WeaverseItemStore {\n  data: any = {}\n  listeners: Set<any> = new Set()\n  Component: any\n  ref: any = {\n    current: null\n  }\n\n  constructor(itemData: any = {}, weaverse: Weaverse) {\n    this.data = itemData\n    let {type} = itemData\n    if (type) {\n      this.Component = weaverse.elementInstances.get(type)\n    }\n  }\n\n  setData = (data: any) => {\n    this.data = Object.assign(this.data, data)\n    this.triggerUpdate()\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}"],"names":["isReactNative","navigator","product","isBrowser","window","isIframe","top","self","StudioBridge","weaverse","event","data","type","startsWith","isEditor","payload","itemId","background","instance","itemInstances","get","setData","css","e","console","log","sendMessageToEditor","handleProps","onMouseDownCapture","handleMouseDown","bind","subscribeMessageEvent","currentFrameSubscription","addEventListener","handleMessageEvent","removeEventListener","parent","postMessage","stitches","require","Weaverse","appUrl","projectKey","projectData","Map","process","items","Set","init","registerElement","name","element","elementInstances","set","stitchesInstance","createStitches","prefix","media","bp1","bp2","bp3","loadStudio","studioBridge","subscribe","fn","listeners","add","unsubscribe","triggerUpdate","forEach","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","error","updateProjectData","initItemData","item","itemStore","id","WeaverseItemStore","itemData","current","Object","assign","Component"],"mappings":"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"}
+{"version":3,"file":"core.cjs.development.js","sources":["../src/utils/index.ts","../src/core.ts"],"sourcesContent":["export const isReactNative = typeof navigator === 'object' && navigator.product === 'ReactNative'\nexport const isBrowser = typeof window !== 'undefined' && !isReactNative\nexport const isIframe = isBrowser && window.top !== window.self","// 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.\nimport fetch from 'isomorphic-unfetch'\nimport * as process from 'process'\nimport Stitches from '@stitches/core/types/stitches'\nimport {isIframe} from './utils'\n// stitches problem, we should use require instead of import\n// using stitches core only for framework-agnostic code\nlet stitches = require('@stitches/core')\n\n\nexport interface ProjectDataItemType {\n  type: string\n  name?: string\n  id: string | number\n  description?: string\n  childIds?: Array<string | number>\n  css?: {\n    [key: string]: string\n  }\n}\n\nexport interface ProjectDataType {\n  items: ProjectDataItemType[]\n}\n\n\nexport type WeaverseType = {\n  [key: string]: any\n  appUrl?: string,\n  projectKey?: string,\n  projectData?: ProjectDataType\n}\n\n\nexport class Weaverse {\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   * @type {Map<string, React.Component>}\n   */\n  elementInstances = new Map<string, any>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   * @type {Map<string, any>}\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  appUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n  /**\n   * Weaverse project key to access project data via API\n   * @type {string}\n   */\n  projectKey: string = ''\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot defaultData={projectData} /> it will be used to server-side rendering\n   */\n  projectData: ProjectDataType = {\n    items: []\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 inEditor or not\n   * if isEditor is true, it means the sdk is inEditor mode, render the editor UI\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   * @type {boolean}\n   */\n  isEditor = false\n  /**\n   * stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: any\n\n  /**\n   * constructor\n   * @param appUrl {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectKey {string} Weaverse project key to access project data via API\n   * @param projectData {ProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   */\n  constructor({appUrl, projectKey, projectData}: WeaverseType = {}) {\n    this.appUrl = appUrl || this.appUrl\n    this.projectKey = projectKey || this.projectKey\n    projectData && (this.projectData = projectData)\n    this.init()\n  }\n\n  /**\n   * register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param name {string} unique name of the custom React Component\n   * @param element {React.Component} custom React Component\n   */\n  registerElement(name: string, element: any) {\n    this.elementInstances.set(name, element)\n  }\n\n  init() {\n    // init the stitches instance\n    this.stitchesInstance = stitches.createStitches(\n      {\n        prefix: 'weaverse',\n        media: {\n          bp1: '(min-width: 640px)',\n          bp2: '(max-width: 768px)',\n          bp3: '(min-width: 1024px)'\n        }\n      }\n    )\n    this.loadStudio()\n  }\n\n  loadStudio() {\n    if (isIframe) {\n      let initStudio = () => {\n        let StudioBridge = window.WeaverseStudioBridge\n        this.studioBridge = new StudioBridge(this)\n        this.studioBridge.subscribeMessageEvent()\n        this.triggerUpdate()\n        console.log('studio bridge initialized', this.studioBridge)\n      }\n      window.addEventListener('message', e => {\n        if (e.data?.type === 'weaverse.editor.ready') {\n          this.isEditor = true\n          if (!window.WeaverseStudioBridge) {\n            // load studio bridge script by url: https://weaverse.io/assets/studio/studio-bridge.js\n            const studioBridgeScript = document.createElement('script')\n            studioBridgeScript.src = `${this.appUrl}/assets/studio/studio-bridge.js`\n            studioBridgeScript.onload = initStudio\n            document.body.appendChild(studioBridgeScript)\n          } else {\n            initStudio()\n          }\n        }\n      })\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    this.triggerEditorUpdate()\n  }\n\n  /**\n   * fetch data from Weaverse API (https://weaverse.io/api/v1/projects/:projectKey)\n   */\n  fetchProjectData() {\n    return fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json()).catch(console.error)\n  }\n\n  /**\n   * fetch and update the project data, then trigger update to re-render the WeaverseRoot\n   */\n  updateProjectData() {\n    console.log('this.projectData', this.projectData)\n    this.initItemData()\n    this.triggerUpdate()\n    return\n    if (this.projectKey) {\n      this.fetchProjectData().then(data => {\n        if (data) {\n          this.projectData = data\n          this.initItemData()\n          this.triggerUpdate()\n        }\n      }).catch(err => {\n        console.error(err)\n      })\n    }\n  }\n\n\n  triggerEditorUpdate(type = 'weaverse.workspace.init') {\n    if (this.isEditor) {\n      window.top?.postMessage({\n        type, payload: {\n          projectKey: this.projectKey,\n          projectData: this.projectData\n        }\n      }, '*')\n    }\n  }\n\n  initItemData() {\n    let data = this.projectData\n    if (data.items) {\n      data.items.forEach(item => {\n        let itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n        this.itemInstances.set(item.id, itemStore)\n      })\n    }\n  }\n}\n\n/**\n * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data\n * @param itemData {ProjectDataItemType} Weaverse item data\n * @param weaverse {Weaverse} Weaverse instance\n * Usage:\n * ```jsx\n * useEffect(() => {\n *     let handleUpdate = (update: any) => {\n *       setData({...update})\n *     }\n *     itemInstance.subscribe(handleUpdate)\n *     return () => {\n *       itemInstance.unsubscribe(handleUpdate)\n *     }\n *   }, [])\n *   ```\n */\nexport class WeaverseItemStore {\n  data: any = {}\n  listeners: Set<any> = new Set()\n  Component: any\n  ref: any = {\n    current: null\n  }\n\n  constructor(itemData: any = {}, weaverse: Weaverse) {\n    this.data = itemData\n    let {type} = itemData\n    if (type) {\n      this.Component = weaverse.elementInstances.get(type)\n    }\n  }\n\n  setData = (data: any) => {\n    this.data = Object.assign(this.data, data)\n    this.triggerUpdate()\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}"],"names":["isReactNative","navigator","product","isBrowser","window","isIframe","top","self","stitches","require","Weaverse","appUrl","projectKey","projectData","Map","process","items","Set","init","registerElement","name","element","elementInstances","set","stitchesInstance","createStitches","prefix","media","bp1","bp2","bp3","loadStudio","initStudio","StudioBridge","WeaverseStudioBridge","studioBridge","subscribeMessageEvent","triggerUpdate","console","log","addEventListener","e","data","type","isEditor","studioBridgeScript","document","createElement","src","onload","body","appendChild","subscribe","fn","listeners","add","unsubscribe","forEach","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","error","updateProjectData","initItemData","postMessage","payload","item","itemStore","itemInstances","get","id","WeaverseItemStore","itemData","weaverse","current","Object","assign","Component"],"mappings":"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"}

package/dist/core.cjs.production.min.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t,e=(t=require("isomorphic-unfetch"))&&"object"==typeof t&&"default"in t?t.default:t;require("process");var i="object"==typeof navigator&&"ReactNative"===navigator.product,s="undefined"!=typeof window&&!i,r=s&&window.top!==window.self,n=require("@stitches/core"),o=function(){function t(t){var e=void 0===t?{}:t,i=e.appUrl,s=e.projectKey,r=e.projectData;this.elementInstances=new Map,this.itemInstances=new Map,this.appUrl="https://weaverse.io",this.projectKey="",this.projectData={items:[]},this.listeners=new Set,this.isEditor=!1,this.appUrl=i||this.appUrl,this.projectKey=s||this.projectKey,r&&(this.projectData=r),this.init()}var i=t.prototype;return i.registerElement=function(t,e){this.elementInstances.set(t,e)},i.init=function(){this.stitchesInstance=n.createStitches({prefix:"weaverse",media:{bp1:"(min-width: 640px)",bp2:"(max-width: 768px)",bp3:"(min-width: 1024px)"}})},i.loadStudio=function(){return console.log('"production"',"production"),!1},i.subscribe=function(t){this.listeners.add(t)},i.unsubscribe=function(t){this.listeners.delete(t)},i.triggerUpdate=function(){this.listeners.forEach((function(t){return t()})),this.triggerEditorUpdate()},i.fetchProjectData=function(){return e(this.appUrl+"/api/public/"+this.projectKey).then((function(t){return t.json()})).catch(console.error)},i.updateProjectData=function(){console.log("this.projectData",this.projectData),this.initItemData(),this.triggerUpdate()},i.triggerEditorUpdate=function(t){var e;void 0===t&&(t="weaverse.workspace.init"),this.isEditor&&(null==(e=window.top)||e.postMessage({type:t,payload:{projectKey:this.projectKey,projectData:this.projectData}},"*"))},i.initItemData=function(){var t=this,e=this.projectData;e.items&&e.items.forEach((function(e){var i=t.itemInstances.get(e.id)||new a(e,t);t.itemInstances.set(e.id,i)}))},t}(),a=function(t,e){var i=this;void 0===t&&(t={}),this.data={},this.listeners=new Set,this.ref={current:null},this.setData=function(t){i.data=Object.assign(i.data,t),i.triggerUpdate()},this.subscribe=function(t){i.listeners.add(t)},this.unsubscribe=function(t){i.listeners.delete(t)},this.triggerUpdate=function(){i.listeners.forEach((function(t){return t(i.data)}))},this.data=t;var s=t.type;s&&(this.Component=e.elementInstances.get(s))};exports.Weaverse=o,exports.WeaverseItemStore=a,exports.isBrowser=s,exports.isIframe=r,exports.isReactNative=i;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t,e=(t=require("isomorphic-unfetch"))&&"object"==typeof t&&"default"in t?t.default:t;require("process");var i="object"==typeof navigator&&"ReactNative"===navigator.product,s="undefined"!=typeof window&&!i,r=s&&window.top!==window.self,n=require("@stitches/core"),a=function(){function t(t){var e=void 0===t?{}:t,i=e.appUrl,s=e.projectKey,r=e.projectData;this.elementInstances=new Map,this.itemInstances=new Map,this.appUrl="https://weaverse.io",this.projectKey="",this.projectData={items:[]},this.listeners=new Set,this.isEditor=!1,this.appUrl=i||this.appUrl,this.projectKey=s||this.projectKey,r&&(this.projectData=r),this.init()}var i=t.prototype;return i.registerElement=function(t,e){this.elementInstances.set(t,e)},i.init=function(){this.stitchesInstance=n.createStitches({prefix:"weaverse",media:{bp1:"(min-width: 640px)",bp2:"(max-width: 768px)",bp3:"(min-width: 1024px)"}}),this.loadStudio()},i.loadStudio=function(){var t=this;if(r){var e=function(){var e=window.WeaverseStudioBridge;t.studioBridge=new e(t),t.studioBridge.subscribeMessageEvent(),t.triggerUpdate(),console.log("studio bridge initialized",t.studioBridge)};window.addEventListener("message",(function(i){var s;if("weaverse.editor.ready"===(null==(s=i.data)?void 0:s.type))if(t.isEditor=!0,window.WeaverseStudioBridge)e();else{var r=document.createElement("script");r.src=t.appUrl+"/assets/studio/studio-bridge.js",r.onload=e,document.body.appendChild(r)}}))}},i.subscribe=function(t){this.listeners.add(t)},i.unsubscribe=function(t){this.listeners.delete(t)},i.triggerUpdate=function(){this.listeners.forEach((function(t){return t()})),this.triggerEditorUpdate()},i.fetchProjectData=function(){return e(this.appUrl+"/api/public/"+this.projectKey).then((function(t){return t.json()})).catch(console.error)},i.updateProjectData=function(){console.log("this.projectData",this.projectData),this.initItemData(),this.triggerUpdate()},i.triggerEditorUpdate=function(t){var e;void 0===t&&(t="weaverse.workspace.init"),this.isEditor&&(null==(e=window.top)||e.postMessage({type:t,payload:{projectKey:this.projectKey,projectData:this.projectData}},"*"))},i.initItemData=function(){var t=this,e=this.projectData;e.items&&e.items.forEach((function(e){var i=t.itemInstances.get(e.id)||new o(e,t);t.itemInstances.set(e.id,i)}))},t}(),o=function(t,e){var i=this;void 0===t&&(t={}),this.data={},this.listeners=new Set,this.ref={current:null},this.setData=function(t){i.data=Object.assign(i.data,t),i.triggerUpdate()},this.subscribe=function(t){i.listeners.add(t)},this.unsubscribe=function(t){i.listeners.delete(t)},this.triggerUpdate=function(){i.listeners.forEach((function(t){return t(i.data)}))},this.data=t;var s=t.type;s&&(this.Component=e.elementInstances.get(s))};exports.Weaverse=a,exports.WeaverseItemStore=o,exports.isBrowser=s,exports.isIframe=r,exports.isReactNative=i;
 //# sourceMappingURL=core.cjs.production.min.js.map

package/dist/core.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"core.cjs.production.min.js","sources":["../src/utils/index.ts","../src/core.ts"],"sourcesContent":["export const isReactNative = typeof navigator === 'object' && navigator.product === 'ReactNative'\nexport const isBrowser = typeof window !== 'undefined' && !isReactNative\nexport const isIframe = isBrowser && window.top !== window.self","// 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.\nimport fetch from 'isomorphic-unfetch'\nimport * as process from 'process'\nimport StudioBridge from './studio-bridge'\nimport Stitches from '@stitches/core/types/stitches'\n// stitches problem, we should use require instead of import\n// using stitches core only for framework-agnostic code\nlet stitches = require('@stitches/core')\n\n\nexport interface ProjectDataItemType {\n  type: string\n  name?: string\n  id: string | number\n  description?: string\n  childIds?: Array<string | number>\n  css?: {\n    [key: string]: string\n  }\n}\n\nexport interface ProjectDataType {\n  items: ProjectDataItemType[]\n}\n\n\nexport type WeaverseType = {\n  [key: string]: any\n  appUrl?: string,\n  projectKey?: string,\n  projectData?: ProjectDataType\n}\n\n\nexport class Weaverse {\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   * @type {Map<string, React.Component>}\n   */\n  elementInstances = new Map<string, any>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   * @type {Map<string, any>}\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  appUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n  /**\n   * Weaverse project key to access project data via API\n   * @type {string}\n   */\n  projectKey: string = ''\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot defaultData={projectData} /> it will be used to server-side rendering\n   */\n  projectData: ProjectDataType = {\n    items: []\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 inEditor or not\n   * if isEditor is true, it means the sdk is inEditor mode, render the editor UI\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   * @type {boolean}\n   */\n  isEditor = false\n  /**\n   * stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: StudioBridge\n\n  /**\n   * constructor\n   * @param appUrl {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectKey {string} Weaverse project key to access project data via API\n   * @param projectData {ProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   */\n  constructor({appUrl, projectKey, projectData}: WeaverseType = {}) {\n    this.appUrl = appUrl || this.appUrl\n    this.projectKey = projectKey || this.projectKey\n    projectData && (this.projectData = projectData)\n    this.init()\n  }\n\n  /**\n   * register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param name {string} unique name of the custom React Component\n   * @param element {React.Component} custom React Component\n   */\n  registerElement(name: string, element: any) {\n    this.elementInstances.set(name, element)\n  }\n\n  init() {\n    // init the stitches instance\n    this.stitchesInstance = stitches.createStitches(\n      {\n        prefix: 'weaverse',\n        media: {\n          bp1: '(min-width: 640px)',\n          bp2: '(max-width: 768px)',\n          bp3: '(min-width: 1024px)'\n        }\n      }\n    )\n  }\n\n  loadStudio() {\n    console.log('process.env.NODE_ENV', process.env.NODE_ENV)\n    // only load studio bridge if it's in editor mode\n    if (process.env.NODE_ENV !== 'production') {\n      // TODO: separate studio bridge into a separate package\n      // in development mode, we should use localhost:3000 as appUrl\n      // this.appUrl = 'http://localhost:3000'\n      // let StudioBridge = require('./studio-bridge')\n      this.studioBridge = new StudioBridge(this)\n      console.log('Weaverse: init studio bridge', this.studioBridge)\n\n      this.studioBridge.subscribeMessageEvent()\n      return true\n    }\n    return false\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    this.triggerEditorUpdate()\n  }\n\n  /**\n   * fetch data from Weaverse API (https://weaverse.io/api/v1/projects/:projectKey)\n   */\n  fetchProjectData() {\n    return fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json()).catch(console.error)\n  }\n\n  /**\n   * fetch and update the project data, then trigger update to re-render the WeaverseRoot\n   */\n  updateProjectData() {\n    console.log('this.projectData', this.projectData)\n    this.initItemData()\n    this.triggerUpdate()\n    return\n    if (this.projectKey) {\n      this.fetchProjectData().then(data => {\n        if (data) {\n          this.projectData = data\n          this.initItemData()\n          this.triggerUpdate()\n        }\n      }).catch(err => {\n        console.error(err)\n      })\n    }\n  }\n\n\n  triggerEditorUpdate(type = 'weaverse.workspace.init') {\n    if (this.isEditor) {\n      window.top?.postMessage({\n        type, payload: {\n          projectKey: this.projectKey,\n          projectData: this.projectData\n        }\n      }, '*')\n    }\n  }\n\n  initItemData() {\n    let data = this.projectData\n    if (data.items) {\n      data.items.forEach(item => {\n        let itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n        this.itemInstances.set(item.id, itemStore)\n      })\n    }\n  }\n}\n\n/**\n * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data\n * @param itemData {ProjectDataItemType} Weaverse item data\n * @param weaverse {Weaverse} Weaverse instance\n * Usage:\n * ```jsx\n * useEffect(() => {\n *     let handleUpdate = (update: any) => {\n *       setData({...update})\n *     }\n *     itemInstance.subscribe(handleUpdate)\n *     return () => {\n *       itemInstance.unsubscribe(handleUpdate)\n *     }\n *   }, [])\n *   ```\n */\nexport class WeaverseItemStore {\n  data: any = {}\n  listeners: Set<any> = new Set()\n  Component: any\n  ref: any = {\n    current: null\n  }\n\n  constructor(itemData: any = {}, weaverse: Weaverse) {\n    this.data = itemData\n    let {type} = itemData\n    if (type) {\n      this.Component = weaverse.elementInstances.get(type)\n    }\n  }\n\n  setData = (data: any) => {\n    this.data = Object.assign(this.data, data)\n    this.triggerUpdate()\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}"],"names":["isReactNative","navigator","product","isBrowser","window","isIframe","top","self","stitches","require","Weaverse","appUrl","projectKey","projectData","Map","items","Set","this","init","registerElement","name","element","elementInstances","set","stitchesInstance","createStitches","prefix","media","bp1","bp2","bp3","loadStudio","console","log","process","subscribe","fn","listeners","add","unsubscribe","triggerUpdate","forEach","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","error","updateProjectData","initItemData","type","isEditor","postMessage","payload","data","item","itemStore","_this2","itemInstances","get","id","WeaverseItemStore","itemData","weaverse","current","_this3","Object","assign","Component"],"mappings":"oLAAaA,EAAqC,iBAAdC,WAAgD,gBAAtBA,UAAUC,QAC3DC,EAA8B,oBAAXC,SAA2BJ,EAC9CK,EAAWF,GAAaC,OAAOE,MAAQF,OAAOG,KCOvDC,EAAWC,QAAQ,kBA2BVC,4CAqDmD,KAAjDC,IAAAA,OAAQC,IAAAA,WAAYC,IAAAA,kCAhDd,IAAIC,uBAKP,IAAIA,gBAKgE,sCAK/D,oBAKU,CAC7BC,MAAO,mBAMa,IAAIC,mBAOf,OAeJL,OAASA,GAAUM,KAAKN,YACxBC,WAAaA,GAAcK,KAAKL,WACrCC,IAAgBI,KAAKJ,YAAcA,QAC9BK,kCAQPC,gBAAA,SAAgBC,EAAcC,QACvBC,iBAAiBC,IAAIH,EAAMC,MAGlCH,KAAA,gBAEOM,iBAAmBhB,EAASiB,eAC/B,CACEC,OAAQ,WACRC,MAAO,CACLC,IAAK,qBACLC,IAAK,qBACLC,IAAK,4BAMbC,WAAA,kBACEC,QAAQC,IAAI,eAAwBC,eAa7B,KAGTC,UAAA,SAAUC,QACHC,UAAUC,IAAIF,MAGrBG,YAAA,SAAYH,QACLC,iBAAiBD,MAGxBI,cAAA,gBACOH,UAAUI,SAAQ,SAAAL,UAAMA,YACxBM,yBAMPC,iBAAA,kBACSC,EAAM3B,KAAKN,sBAAwBM,KAAKL,YAAciC,MAAK,SAAAC,UAAKA,EAAEC,gBAAcf,QAAQgB,UAMjGC,kBAAA,WACEjB,QAAQC,IAAI,mBAAoBhB,KAAKJ,kBAChCqC,oBACAV,mBAgBPE,oBAAA,SAAoBS,kBAAAA,IAAAA,EAAO,2BACrBlC,KAAKmC,oBACPhD,OAAOE,QAAK+C,YAAY,CACtBF,KAAAA,EAAMG,QAAS,CACb1C,WAAYK,KAAKL,WACjBC,YAAaI,KAAKJ,cAEnB,SAIPqC,aAAA,sBACMK,EAAOtC,KAAKJ,YACZ0C,EAAKxC,OACPwC,EAAKxC,MAAM0B,SAAQ,SAAAe,OACbC,EAAYC,EAAKC,cAAcC,IAAIJ,EAAKK,KAAO,IAAIC,EAAkBN,EAAME,GAC/EA,EAAKC,cAAcpC,IAAIiC,EAAKK,GAAIJ,YAuB3BK,EAQX,SAAYC,EAAoBC,uBAApBD,IAAAA,EAAgB,cAPhB,kBACU,IAAI/C,aAEf,CACTiD,QAAS,mBAWD,SAACV,GACTW,EAAKX,KAAOY,OAAOC,OAAOF,EAAKX,KAAMA,GACrCW,EAAK1B,gCAGK,SAACJ,GACX8B,EAAK7B,UAAUC,IAAIF,qBAGP,SAACA,GACb8B,EAAK7B,iBAAiBD,uBAGR,WACd8B,EAAK7B,UAAUI,SAAQ,SAAAL,UACdA,EAAG8B,EAAKX,eAtBZA,KAAOQ,MACPZ,EAAQY,EAARZ,KACDA,SACGkB,UAAYL,EAAS1C,iBAAiBsC,IAAIT"}
+{"version":3,"file":"core.cjs.production.min.js","sources":["../src/utils/index.ts","../src/core.ts"],"sourcesContent":["export const isReactNative = typeof navigator === 'object' && navigator.product === 'ReactNative'\nexport const isBrowser = typeof window !== 'undefined' && !isReactNative\nexport const isIframe = isBrowser && window.top !== window.self","// 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.\nimport fetch from 'isomorphic-unfetch'\nimport * as process from 'process'\nimport Stitches from '@stitches/core/types/stitches'\nimport {isIframe} from './utils'\n// stitches problem, we should use require instead of import\n// using stitches core only for framework-agnostic code\nlet stitches = require('@stitches/core')\n\n\nexport interface ProjectDataItemType {\n  type: string\n  name?: string\n  id: string | number\n  description?: string\n  childIds?: Array<string | number>\n  css?: {\n    [key: string]: string\n  }\n}\n\nexport interface ProjectDataType {\n  items: ProjectDataItemType[]\n}\n\n\nexport type WeaverseType = {\n  [key: string]: any\n  appUrl?: string,\n  projectKey?: string,\n  projectData?: ProjectDataType\n}\n\n\nexport class Weaverse {\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   * @type {Map<string, React.Component>}\n   */\n  elementInstances = new Map<string, any>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   * @type {Map<string, any>}\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  appUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n  /**\n   * Weaverse project key to access project data via API\n   * @type {string}\n   */\n  projectKey: string = ''\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot defaultData={projectData} /> it will be used to server-side rendering\n   */\n  projectData: ProjectDataType = {\n    items: []\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 inEditor or not\n   * if isEditor is true, it means the sdk is inEditor mode, render the editor UI\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   * @type {boolean}\n   */\n  isEditor = false\n  /**\n   * stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: any\n\n  /**\n   * constructor\n   * @param appUrl {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectKey {string} Weaverse project key to access project data via API\n   * @param projectData {ProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   */\n  constructor({appUrl, projectKey, projectData}: WeaverseType = {}) {\n    this.appUrl = appUrl || this.appUrl\n    this.projectKey = projectKey || this.projectKey\n    projectData && (this.projectData = projectData)\n    this.init()\n  }\n\n  /**\n   * register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param name {string} unique name of the custom React Component\n   * @param element {React.Component} custom React Component\n   */\n  registerElement(name: string, element: any) {\n    this.elementInstances.set(name, element)\n  }\n\n  init() {\n    // init the stitches instance\n    this.stitchesInstance = stitches.createStitches(\n      {\n        prefix: 'weaverse',\n        media: {\n          bp1: '(min-width: 640px)',\n          bp2: '(max-width: 768px)',\n          bp3: '(min-width: 1024px)'\n        }\n      }\n    )\n    this.loadStudio()\n  }\n\n  loadStudio() {\n    if (isIframe) {\n      let initStudio = () => {\n        let StudioBridge = window.WeaverseStudioBridge\n        this.studioBridge = new StudioBridge(this)\n        this.studioBridge.subscribeMessageEvent()\n        this.triggerUpdate()\n        console.log('studio bridge initialized', this.studioBridge)\n      }\n      window.addEventListener('message', e => {\n        if (e.data?.type === 'weaverse.editor.ready') {\n          this.isEditor = true\n          if (!window.WeaverseStudioBridge) {\n            // load studio bridge script by url: https://weaverse.io/assets/studio/studio-bridge.js\n            const studioBridgeScript = document.createElement('script')\n            studioBridgeScript.src = `${this.appUrl}/assets/studio/studio-bridge.js`\n            studioBridgeScript.onload = initStudio\n            document.body.appendChild(studioBridgeScript)\n          } else {\n            initStudio()\n          }\n        }\n      })\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    this.triggerEditorUpdate()\n  }\n\n  /**\n   * fetch data from Weaverse API (https://weaverse.io/api/v1/projects/:projectKey)\n   */\n  fetchProjectData() {\n    return fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json()).catch(console.error)\n  }\n\n  /**\n   * fetch and update the project data, then trigger update to re-render the WeaverseRoot\n   */\n  updateProjectData() {\n    console.log('this.projectData', this.projectData)\n    this.initItemData()\n    this.triggerUpdate()\n    return\n    if (this.projectKey) {\n      this.fetchProjectData().then(data => {\n        if (data) {\n          this.projectData = data\n          this.initItemData()\n          this.triggerUpdate()\n        }\n      }).catch(err => {\n        console.error(err)\n      })\n    }\n  }\n\n\n  triggerEditorUpdate(type = 'weaverse.workspace.init') {\n    if (this.isEditor) {\n      window.top?.postMessage({\n        type, payload: {\n          projectKey: this.projectKey,\n          projectData: this.projectData\n        }\n      }, '*')\n    }\n  }\n\n  initItemData() {\n    let data = this.projectData\n    if (data.items) {\n      data.items.forEach(item => {\n        let itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n        this.itemInstances.set(item.id, itemStore)\n      })\n    }\n  }\n}\n\n/**\n * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data\n * @param itemData {ProjectDataItemType} Weaverse item data\n * @param weaverse {Weaverse} Weaverse instance\n * Usage:\n * ```jsx\n * useEffect(() => {\n *     let handleUpdate = (update: any) => {\n *       setData({...update})\n *     }\n *     itemInstance.subscribe(handleUpdate)\n *     return () => {\n *       itemInstance.unsubscribe(handleUpdate)\n *     }\n *   }, [])\n *   ```\n */\nexport class WeaverseItemStore {\n  data: any = {}\n  listeners: Set<any> = new Set()\n  Component: any\n  ref: any = {\n    current: null\n  }\n\n  constructor(itemData: any = {}, weaverse: Weaverse) {\n    this.data = itemData\n    let {type} = itemData\n    if (type) {\n      this.Component = weaverse.elementInstances.get(type)\n    }\n  }\n\n  setData = (data: any) => {\n    this.data = Object.assign(this.data, data)\n    this.triggerUpdate()\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}"],"names":["isReactNative","navigator","product","isBrowser","window","isIframe","top","self","stitches","require","Weaverse","appUrl","projectKey","projectData","Map","items","Set","this","init","registerElement","name","element","elementInstances","set","stitchesInstance","createStitches","prefix","media","bp1","bp2","bp3","loadStudio","initStudio","StudioBridge","WeaverseStudioBridge","_this","studioBridge","subscribeMessageEvent","triggerUpdate","console","log","addEventListener","e","data","type","isEditor","studioBridgeScript","document","createElement","src","onload","body","appendChild","subscribe","fn","listeners","add","unsubscribe","forEach","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","error","updateProjectData","initItemData","postMessage","payload","item","itemStore","_this3","itemInstances","get","id","WeaverseItemStore","itemData","weaverse","current","_this4","Object","assign","Component"],"mappings":"oLAAaA,EAAqC,iBAAdC,WAAgD,gBAAtBA,UAAUC,QAC3DC,EAA8B,oBAAXC,SAA2BJ,EAC9CK,EAAWF,GAAaC,OAAOE,MAAQF,OAAOG,KCOvDC,EAAWC,QAAQ,kBA2BVC,4CAqDmD,KAAjDC,IAAAA,OAAQC,IAAAA,WAAYC,IAAAA,kCAhDd,IAAIC,uBAKP,IAAIA,gBAKgE,sCAK/D,oBAKU,CAC7BC,MAAO,mBAMa,IAAIC,mBAOf,OAeJL,OAASA,GAAUM,KAAKN,YACxBC,WAAaA,GAAcK,KAAKL,WACrCC,IAAgBI,KAAKJ,YAAcA,QAC9BK,kCAQPC,gBAAA,SAAgBC,EAAcC,QACvBC,iBAAiBC,IAAIH,EAAMC,MAGlCH,KAAA,gBAEOM,iBAAmBhB,EAASiB,eAC/B,CACEC,OAAQ,WACRC,MAAO,CACLC,IAAK,qBACLC,IAAK,qBACLC,IAAK,8BAINC,gBAGPA,WAAA,yBACM1B,EAAU,KACR2B,EAAa,eACXC,EAAe7B,OAAO8B,qBAC1BC,EAAKC,aAAe,IAAIH,EAAaE,GACrCA,EAAKC,aAAaC,wBAClBF,EAAKG,gBACLC,QAAQC,IAAI,4BAA6BL,EAAKC,eAEhDhC,OAAOqC,iBAAiB,WAAW,SAAAC,YACZ,oCAAjBA,EAAEC,eAAMC,SACVT,EAAKU,UAAW,EACXzC,OAAO8B,qBAOVF,QAPgC,KAE1Bc,EAAqBC,SAASC,cAAc,UAClDF,EAAmBG,IAASd,EAAKxB,yCACjCmC,EAAmBI,OAASlB,EAC5Be,SAASI,KAAKC,YAAYN,WASpCO,UAAA,SAAUC,QACHC,UAAUC,IAAIF,MAGrBG,YAAA,SAAYH,QACLC,iBAAiBD,MAGxBhB,cAAA,gBACOiB,UAAUG,SAAQ,SAAAJ,UAAMA,YACxBK,yBAMPC,iBAAA,kBACSC,EAAM5C,KAAKN,sBAAwBM,KAAKL,YAAckD,MAAK,SAAAC,UAAKA,EAAEC,gBAAczB,QAAQ0B,UAMjGC,kBAAA,WACE3B,QAAQC,IAAI,mBAAoBvB,KAAKJ,kBAChCsD,oBACA7B,mBAgBPqB,oBAAA,SAAoBf,kBAAAA,IAAAA,EAAO,2BACrB3B,KAAK4B,oBACPzC,OAAOE,QAAK8D,YAAY,CACtBxB,KAAAA,EAAMyB,QAAS,CACbzD,WAAYK,KAAKL,WACjBC,YAAaI,KAAKJ,cAEnB,SAIPsD,aAAA,sBACMxB,EAAO1B,KAAKJ,YACZ8B,EAAK5B,OACP4B,EAAK5B,MAAM2C,SAAQ,SAAAY,OACbC,EAAYC,EAAKC,cAAcC,IAAIJ,EAAKK,KAAO,IAAIC,EAAkBN,EAAME,GAC/EA,EAAKC,cAAclD,IAAI+C,EAAKK,GAAIJ,YAuB3BK,EAQX,SAAYC,EAAoBC,uBAApBD,IAAAA,EAAgB,cAPhB,kBACU,IAAI7D,aAEf,CACT+D,QAAS,mBAWD,SAACpC,GACTqC,EAAKrC,KAAOsC,OAAOC,OAAOF,EAAKrC,KAAMA,GACrCqC,EAAK1C,gCAGK,SAACgB,GACX0B,EAAKzB,UAAUC,IAAIF,qBAGP,SAACA,GACb0B,EAAKzB,iBAAiBD,uBAGR,WACd0B,EAAKzB,UAAUG,SAAQ,SAAAJ,UACdA,EAAG0B,EAAKrC,eAtBZA,KAAOkC,MACPjC,EAAQiC,EAARjC,KACDA,SACGuC,UAAYL,EAASxD,iBAAiBoD,IAAI9B"}

package/dist/core.d.ts

@@ -1,4 +1,3 @@
-import StudioBridge from './studio-bridge';
 import Stitches from '@stitches/core/types/stitches';
 export interface ProjectDataItemType {
     type: string;
@@ -61,7 +60,7 @@ export declare class Weaverse {
      * stitches instance for handling CSS stylesheet, media, theme for Weaverse project
      */
     stitchesInstance: Stitches | any;
-    studioBridge?: StudioBridge;
+    studioBridge?: any;
     /**
      * constructor
      * @param appUrl {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
@@ -76,7 +75,7 @@ export declare class Weaverse {
      */
     registerElement(name: string, element: any): void;
     init(): void;
-    loadStudio(): boolean;
+    loadStudio(): void;
     subscribe(fn: any): void;
     unsubscribe(fn: any): void;
     triggerUpdate(): void;

package/dist/core.esm.js

@@ -5,96 +5,6 @@ var isReactNative = typeof navigator === 'object' && navigator.product === 'Reac
 var isBrowser = typeof window !== 'undefined' && !isReactNative;
 var isIframe = isBrowser && window.top !== window.self;
 
-/**
- * When the editor is ready, we'll load this studio-bridge code.
- * This is for processing data between the editor and the workspace project.
- * It will not load in production mode or not running when the editor is not detected/ready.
- */
-
-var StudioBridge = /*#__PURE__*/function () {
-  function StudioBridge(weaverse) {
-    var _this = this;
-
-    /**
-     * handle the message event from editor(parent window)
-     * the message type will start with "weavers.",
-     * when an item got message to update, get the item instance and setData to it
-     * @param event {MessageEvent}
-     */
-    this.handleMessageEvent = function (event) {
-      var _event$data, _event$data$type;
-
-      if ((_event$data = event.data) != null && (_event$data$type = _event$data.type) != null && _event$data$type.startsWith('weaverse.')) {
-        var type = event.data.type;
-
-        switch (type) {
-          case 'weaverse.editor.ready':
-            _this.weaverse.isEditor = true;
-            break;
-
-          case 'weaverse.editor.update':
-            var payload = event.data.payload;
-            var itemId = payload.itemId,
-                background = payload.background;
-
-            var instance = _this.weaverse.itemInstances.get(itemId);
-
-            if (instance) {
-              instance.setData({
-                css: {
-                  background: background
-                }
-              });
-            }
-
-        }
-      }
-    };
-
-    this.handleMouseDown = function (e) {
-      console.log('handleMouseDown', e);
-
-      _this.sendMessageToEditor('weaverse.editor.mouseDown', {});
-    };
-
-    this.weaverse = weaverse;
-    this.handleProps = {
-      onMouseDownCapture: this.handleMouseDown.bind(this)
-    };
-  }
-  /**
-   * subscribe to window message event from editor(parent window), and handle the message event
-   */
-
-
-  var _proto = StudioBridge.prototype;
-
-  _proto.subscribeMessageEvent = function subscribeMessageEvent() {
-    var _this2 = this;
-
-    if (typeof this.currentFrameSubscription === 'function') {
-      this.currentFrameSubscription();
-    }
-
-    isBrowser && window.addEventListener('message', this.handleMessageEvent);
-
-    this.currentFrameSubscription = function () {
-      isBrowser && window.removeEventListener('message', _this2.handleMessageEvent);
-    };
-
-    return this.currentFrameSubscription;
-  };
-
-  _proto.sendMessageToEditor = function sendMessageToEditor(type, payload) {
-    isBrowser && window.parent.postMessage({
-      type: type,
-      payload: payload
-    }, '*');
-  };
-
-  return StudioBridge;
-}();
-
 // TODO: Implement Weaverse SDK class
 // using stitches core only for framework-agnostic code
 
@@ -186,23 +96,42 @@ var Weaverse = /*#__PURE__*/function () {
         bp3: '(min-width: 1024px)'
       }
     });
+    this.loadStudio();
   };
 
   _proto.loadStudio = function loadStudio() {
-    console.log('process.env.NODE_ENV', env.NODE_ENV); // only load studio bridge if it's in editor mode
-
-    if (env.NODE_ENV !== 'production') {
-      // TODO: separate studio bridge into a separate package
-      // in development mode, we should use localhost:3000 as appUrl
-      // this.appUrl = 'http://localhost:3000'
-      // let StudioBridge = require('./studio-bridge')
-      this.studioBridge = new StudioBridge(this);
-      console.log('Weaverse: init studio bridge', this.studioBridge);
-      this.studioBridge.subscribeMessageEvent();
-      return true;
-    }
+    var _this = this;
+
+    if (isIframe) {
+      var initStudio = function initStudio() {
+        var StudioBridge = window.WeaverseStudioBridge;
+        _this.studioBridge = new StudioBridge(_this);
+
+        _this.studioBridge.subscribeMessageEvent();
+
+        _this.triggerUpdate();
 
-    return false;
+        console.log('studio bridge initialized', _this.studioBridge);
+      };
+
+      window.addEventListener('message', function (e) {
+        var _e$data;
+
+        if (((_e$data = e.data) == null ? void 0 : _e$data.type) === 'weaverse.editor.ready') {
+          _this.isEditor = true;
+
+          if (!window.WeaverseStudioBridge) {
+            // load studio bridge script by url: https://weaverse.io/assets/studio/studio-bridge.js
+            var studioBridgeScript = document.createElement('script');
+            studioBridgeScript.src = _this.appUrl + "/assets/studio/studio-bridge.js";
+            studioBridgeScript.onload = initStudio;
+            document.body.appendChild(studioBridgeScript);
+          } else {
+            initStudio();
+          }
+        }
+      });
+    }
   };
 
   _proto.subscribe = function subscribe(fn) {
@@ -261,15 +190,15 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.initItemData = function initItemData() {
-    var _this2 = this;
+    var _this3 = this;
 
     var data = this.projectData;
 
     if (data.items) {
       data.items.forEach(function (item) {
-        var itemStore = _this2.itemInstances.get(item.id) || new WeaverseItemStore(item, _this2);
+        var itemStore = _this3.itemInstances.get(item.id) || new WeaverseItemStore(item, _this3);
 
-        _this2.itemInstances.set(item.id, itemStore);
+        _this3.itemInstances.set(item.id, itemStore);
       });
     }
   };
@@ -295,7 +224,7 @@ var Weaverse = /*#__PURE__*/function () {
  */
 
 var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
-  var _this3 = this;
+  var _this4 = this;
 
   if (itemData === void 0) {
     itemData = {};
@@ -308,22 +237,22 @@ var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
   };
 
   this.setData = function (data) {
-    _this3.data = Object.assign(_this3.data, data);
+    _this4.data = Object.assign(_this4.data, data);
 
-    _this3.triggerUpdate();
+    _this4.triggerUpdate();
   };
 
   this.subscribe = function (fn) {
-    _this3.listeners.add(fn);
+    _this4.listeners.add(fn);
   };
 
   this.unsubscribe = function (fn) {
-    _this3.listeners["delete"](fn);
+    _this4.listeners["delete"](fn);
   };
 
   this.triggerUpdate = function () {
-    _this3.listeners.forEach(function (fn) {
-      return fn(_this3.data);
+    _this4.listeners.forEach(function (fn) {
+      return fn(_this4.data);
     });
   };
 

package/dist/core.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"core.esm.js","sources":["../src/utils/index.ts","../src/studio-bridge.ts","../src/core.ts"],"sourcesContent":["export const isReactNative = typeof navigator === 'object' && navigator.product === 'ReactNative'\nexport const isBrowser = typeof window !== 'undefined' && !isReactNative\nexport const isIframe = isBrowser && window.top !== window.self","import {isBrowser} from './utils'\nimport type {Weaverse} from '.'\n\n/**\n * When the editor is ready, we'll load this studio-bridge code.\n * This is for processing data between the editor and the workspace project.\n * It will not load in production mode or not running when the editor is not detected/ready.\n */\n\nexport class StudioBridge {\n  weaverse: Weaverse\n\n  /**\n   * instance for subscribing to window message, save it to currentFrameSubscription then can remove it when unmount\n   */\n  currentFrameSubscription: any\n  handleProps: any\n  constructor(weaverse: Weaverse) {\n    this.weaverse = weaverse\n    this.handleProps = {\n      onMouseDownCapture: this.handleMouseDown.bind(this)\n    }\n  }\n\n  /**\n   * subscribe to window message event from editor(parent window), and handle the message event\n   */\n  subscribeMessageEvent() {\n    if (typeof this.currentFrameSubscription === 'function') {\n      this.currentFrameSubscription()\n    }\n    isBrowser && window.addEventListener('message', this.handleMessageEvent)\n    this.currentFrameSubscription = () => {\n      isBrowser && window.removeEventListener('message', this.handleMessageEvent)\n    }\n    return this.currentFrameSubscription\n  }\n\n  /**\n   * handle the message event from editor(parent window)\n   * the message type will start with \"weavers.\",\n   * when an item got message to update, get the item instance and setData to it\n   * @param event {MessageEvent}\n   */\n  handleMessageEvent = (event: MessageEvent) => {\n    if (event.data?.type?.startsWith('weaverse.')) {\n      let type = event.data.type\n      switch (type) {\n        case 'weaverse.editor.ready':\n          this.weaverse.isEditor = true\n          break\n        case 'weaverse.editor.update':\n          let {payload} = event.data\n          let {itemId, background} = payload\n          let instance = this.weaverse.itemInstances.get(itemId)\n          if (instance) {\n            instance.setData({\n              css: {\n                background\n              }\n            })\n          }\n      }\n    }\n  }\n\n  sendMessageToEditor(type: string, payload: any) {\n    isBrowser && window.parent.postMessage({type, payload}, '*')\n  }\n\n  handleMouseDown = (e: MouseEvent) => {\n    console.log('handleMouseDown', e)\n    this.sendMessageToEditor('weaverse.editor.mouseDown', {})\n  }\n}\n\n\nexport default StudioBridge","// 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.\nimport fetch from 'isomorphic-unfetch'\nimport * as process from 'process'\nimport StudioBridge from './studio-bridge'\nimport Stitches from '@stitches/core/types/stitches'\n// stitches problem, we should use require instead of import\n// using stitches core only for framework-agnostic code\nlet stitches = require('@stitches/core')\n\n\nexport interface ProjectDataItemType {\n  type: string\n  name?: string\n  id: string | number\n  description?: string\n  childIds?: Array<string | number>\n  css?: {\n    [key: string]: string\n  }\n}\n\nexport interface ProjectDataType {\n  items: ProjectDataItemType[]\n}\n\n\nexport type WeaverseType = {\n  [key: string]: any\n  appUrl?: string,\n  projectKey?: string,\n  projectData?: ProjectDataType\n}\n\n\nexport class Weaverse {\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   * @type {Map<string, React.Component>}\n   */\n  elementInstances = new Map<string, any>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   * @type {Map<string, any>}\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  appUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n  /**\n   * Weaverse project key to access project data via API\n   * @type {string}\n   */\n  projectKey: string = ''\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot defaultData={projectData} /> it will be used to server-side rendering\n   */\n  projectData: ProjectDataType = {\n    items: []\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 inEditor or not\n   * if isEditor is true, it means the sdk is inEditor mode, render the editor UI\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   * @type {boolean}\n   */\n  isEditor = false\n  /**\n   * stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: StudioBridge\n\n  /**\n   * constructor\n   * @param appUrl {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectKey {string} Weaverse project key to access project data via API\n   * @param projectData {ProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   */\n  constructor({appUrl, projectKey, projectData}: WeaverseType = {}) {\n    this.appUrl = appUrl || this.appUrl\n    this.projectKey = projectKey || this.projectKey\n    projectData && (this.projectData = projectData)\n    this.init()\n  }\n\n  /**\n   * register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param name {string} unique name of the custom React Component\n   * @param element {React.Component} custom React Component\n   */\n  registerElement(name: string, element: any) {\n    this.elementInstances.set(name, element)\n  }\n\n  init() {\n    // init the stitches instance\n    this.stitchesInstance = stitches.createStitches(\n      {\n        prefix: 'weaverse',\n        media: {\n          bp1: '(min-width: 640px)',\n          bp2: '(max-width: 768px)',\n          bp3: '(min-width: 1024px)'\n        }\n      }\n    )\n  }\n\n  loadStudio() {\n    console.log('process.env.NODE_ENV', process.env.NODE_ENV)\n    // only load studio bridge if it's in editor mode\n    if (process.env.NODE_ENV !== 'production') {\n      // TODO: separate studio bridge into a separate package\n      // in development mode, we should use localhost:3000 as appUrl\n      // this.appUrl = 'http://localhost:3000'\n      // let StudioBridge = require('./studio-bridge')\n      this.studioBridge = new StudioBridge(this)\n      console.log('Weaverse: init studio bridge', this.studioBridge)\n\n      this.studioBridge.subscribeMessageEvent()\n      return true\n    }\n    return false\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    this.triggerEditorUpdate()\n  }\n\n  /**\n   * fetch data from Weaverse API (https://weaverse.io/api/v1/projects/:projectKey)\n   */\n  fetchProjectData() {\n    return fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json()).catch(console.error)\n  }\n\n  /**\n   * fetch and update the project data, then trigger update to re-render the WeaverseRoot\n   */\n  updateProjectData() {\n    console.log('this.projectData', this.projectData)\n    this.initItemData()\n    this.triggerUpdate()\n    return\n    if (this.projectKey) {\n      this.fetchProjectData().then(data => {\n        if (data) {\n          this.projectData = data\n          this.initItemData()\n          this.triggerUpdate()\n        }\n      }).catch(err => {\n        console.error(err)\n      })\n    }\n  }\n\n\n  triggerEditorUpdate(type = 'weaverse.workspace.init') {\n    if (this.isEditor) {\n      window.top?.postMessage({\n        type, payload: {\n          projectKey: this.projectKey,\n          projectData: this.projectData\n        }\n      }, '*')\n    }\n  }\n\n  initItemData() {\n    let data = this.projectData\n    if (data.items) {\n      data.items.forEach(item => {\n        let itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n        this.itemInstances.set(item.id, itemStore)\n      })\n    }\n  }\n}\n\n/**\n * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data\n * @param itemData {ProjectDataItemType} Weaverse item data\n * @param weaverse {Weaverse} Weaverse instance\n * Usage:\n * ```jsx\n * useEffect(() => {\n *     let handleUpdate = (update: any) => {\n *       setData({...update})\n *     }\n *     itemInstance.subscribe(handleUpdate)\n *     return () => {\n *       itemInstance.unsubscribe(handleUpdate)\n *     }\n *   }, [])\n *   ```\n */\nexport class WeaverseItemStore {\n  data: any = {}\n  listeners: Set<any> = new Set()\n  Component: any\n  ref: any = {\n    current: null\n  }\n\n  constructor(itemData: any = {}, weaverse: Weaverse) {\n    this.data = itemData\n    let {type} = itemData\n    if (type) {\n      this.Component = weaverse.elementInstances.get(type)\n    }\n  }\n\n  setData = (data: any) => {\n    this.data = Object.assign(this.data, data)\n    this.triggerUpdate()\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}"],"names":["isReactNative","navigator","product","isBrowser","window","isIframe","top","self","StudioBridge","weaverse","event","data","type","startsWith","isEditor","payload","itemId","background","instance","itemInstances","get","setData","css","e","console","log","sendMessageToEditor","handleProps","onMouseDownCapture","handleMouseDown","bind","subscribeMessageEvent","currentFrameSubscription","addEventListener","handleMessageEvent","removeEventListener","parent","postMessage","stitches","require","Weaverse","appUrl","projectKey","projectData","Map","process","NODE_ENV","items","Set","init","registerElement","name","element","elementInstances","set","stitchesInstance","createStitches","prefix","media","bp1","bp2","bp3","loadStudio","studioBridge","subscribe","fn","listeners","add","unsubscribe","triggerUpdate","forEach","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","error","updateProjectData","initItemData","item","itemStore","id","WeaverseItemStore","itemData","current","Object","assign","Component"],"mappings":"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"}
+{"version":3,"file":"core.esm.js","sources":["../src/utils/index.ts","../src/core.ts"],"sourcesContent":["export const isReactNative = typeof navigator === 'object' && navigator.product === 'ReactNative'\nexport const isBrowser = typeof window !== 'undefined' && !isReactNative\nexport const isIframe = isBrowser && window.top !== window.self","// 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.\nimport fetch from 'isomorphic-unfetch'\nimport * as process from 'process'\nimport Stitches from '@stitches/core/types/stitches'\nimport {isIframe} from './utils'\n// stitches problem, we should use require instead of import\n// using stitches core only for framework-agnostic code\nlet stitches = require('@stitches/core')\n\n\nexport interface ProjectDataItemType {\n  type: string\n  name?: string\n  id: string | number\n  description?: string\n  childIds?: Array<string | number>\n  css?: {\n    [key: string]: string\n  }\n}\n\nexport interface ProjectDataType {\n  items: ProjectDataItemType[]\n}\n\n\nexport type WeaverseType = {\n  [key: string]: any\n  appUrl?: string,\n  projectKey?: string,\n  projectData?: ProjectDataType\n}\n\n\nexport class Weaverse {\n  /**\n   * For storing, registering element React component from Weaverse or created by user/developer\n   * @type {Map<string, React.Component>}\n   */\n  elementInstances = new Map<string, any>()\n  /**\n   * list of element/items store to provide data, handle state update, state sharing, etc.\n   * @type {Map<string, any>}\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  appUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n  /**\n   * Weaverse project key to access project data via API\n   * @type {string}\n   */\n  projectKey: string = ''\n  /**\n   * Weaverse project data, by default, user can provide project data via React Component:\n   * <WeaverseRoot defaultData={projectData} /> it will be used to server-side rendering\n   */\n  projectData: ProjectDataType = {\n    items: []\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 inEditor or not\n   * if isEditor is true, it means the sdk is inEditor mode, render the editor UI\n   * else render the preview UI, plain HTML + CSS + React hydrate\n   * @type {boolean}\n   */\n  isEditor = false\n  /**\n   * stitches instance for handling CSS stylesheet, media, theme for Weaverse project\n   */\n  stitchesInstance: Stitches | any\n\n  studioBridge?: any\n\n  /**\n   * constructor\n   * @param appUrl {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000\n   * @param projectKey {string} Weaverse project key to access project data via API\n   * @param projectData {ProjectDataType} Weaverse project data, by default, user can provide project data via React Component.\n   */\n  constructor({appUrl, projectKey, projectData}: WeaverseType = {}) {\n    this.appUrl = appUrl || this.appUrl\n    this.projectKey = projectKey || this.projectKey\n    projectData && (this.projectData = projectData)\n    this.init()\n  }\n\n  /**\n   * register the custom React Component to Weaverse, store it into Weaverse.elementInstances\n   * @param name {string} unique name of the custom React Component\n   * @param element {React.Component} custom React Component\n   */\n  registerElement(name: string, element: any) {\n    this.elementInstances.set(name, element)\n  }\n\n  init() {\n    // init the stitches instance\n    this.stitchesInstance = stitches.createStitches(\n      {\n        prefix: 'weaverse',\n        media: {\n          bp1: '(min-width: 640px)',\n          bp2: '(max-width: 768px)',\n          bp3: '(min-width: 1024px)'\n        }\n      }\n    )\n    this.loadStudio()\n  }\n\n  loadStudio() {\n    if (isIframe) {\n      let initStudio = () => {\n        let StudioBridge = window.WeaverseStudioBridge\n        this.studioBridge = new StudioBridge(this)\n        this.studioBridge.subscribeMessageEvent()\n        this.triggerUpdate()\n        console.log('studio bridge initialized', this.studioBridge)\n      }\n      window.addEventListener('message', e => {\n        if (e.data?.type === 'weaverse.editor.ready') {\n          this.isEditor = true\n          if (!window.WeaverseStudioBridge) {\n            // load studio bridge script by url: https://weaverse.io/assets/studio/studio-bridge.js\n            const studioBridgeScript = document.createElement('script')\n            studioBridgeScript.src = `${this.appUrl}/assets/studio/studio-bridge.js`\n            studioBridgeScript.onload = initStudio\n            document.body.appendChild(studioBridgeScript)\n          } else {\n            initStudio()\n          }\n        }\n      })\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    this.triggerEditorUpdate()\n  }\n\n  /**\n   * fetch data from Weaverse API (https://weaverse.io/api/v1/projects/:projectKey)\n   */\n  fetchProjectData() {\n    return fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json()).catch(console.error)\n  }\n\n  /**\n   * fetch and update the project data, then trigger update to re-render the WeaverseRoot\n   */\n  updateProjectData() {\n    console.log('this.projectData', this.projectData)\n    this.initItemData()\n    this.triggerUpdate()\n    return\n    if (this.projectKey) {\n      this.fetchProjectData().then(data => {\n        if (data) {\n          this.projectData = data\n          this.initItemData()\n          this.triggerUpdate()\n        }\n      }).catch(err => {\n        console.error(err)\n      })\n    }\n  }\n\n\n  triggerEditorUpdate(type = 'weaverse.workspace.init') {\n    if (this.isEditor) {\n      window.top?.postMessage({\n        type, payload: {\n          projectKey: this.projectKey,\n          projectData: this.projectData\n        }\n      }, '*')\n    }\n  }\n\n  initItemData() {\n    let data = this.projectData\n    if (data.items) {\n      data.items.forEach(item => {\n        let itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n        this.itemInstances.set(item.id, itemStore)\n      })\n    }\n  }\n}\n\n/**\n * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data\n * @param itemData {ProjectDataItemType} Weaverse item data\n * @param weaverse {Weaverse} Weaverse instance\n * Usage:\n * ```jsx\n * useEffect(() => {\n *     let handleUpdate = (update: any) => {\n *       setData({...update})\n *     }\n *     itemInstance.subscribe(handleUpdate)\n *     return () => {\n *       itemInstance.unsubscribe(handleUpdate)\n *     }\n *   }, [])\n *   ```\n */\nexport class WeaverseItemStore {\n  data: any = {}\n  listeners: Set<any> = new Set()\n  Component: any\n  ref: any = {\n    current: null\n  }\n\n  constructor(itemData: any = {}, weaverse: Weaverse) {\n    this.data = itemData\n    let {type} = itemData\n    if (type) {\n      this.Component = weaverse.elementInstances.get(type)\n    }\n  }\n\n  setData = (data: any) => {\n    this.data = Object.assign(this.data, data)\n    this.triggerUpdate()\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}"],"names":["isReactNative","navigator","product","isBrowser","window","isIframe","top","self","stitches","require","Weaverse","appUrl","projectKey","projectData","Map","process","NODE_ENV","items","Set","init","registerElement","name","element","elementInstances","set","stitchesInstance","createStitches","prefix","media","bp1","bp2","bp3","loadStudio","initStudio","StudioBridge","WeaverseStudioBridge","studioBridge","subscribeMessageEvent","triggerUpdate","console","log","addEventListener","e","data","type","isEditor","studioBridgeScript","document","createElement","src","onload","body","appendChild","subscribe","fn","listeners","add","unsubscribe","forEach","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","error","updateProjectData","initItemData","postMessage","payload","item","itemStore","itemInstances","get","id","WeaverseItemStore","itemData","weaverse","current","Object","assign","Component"],"mappings":"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"}

package/dist/utils/load-script.d.ts

@@ -0,0 +1 @@
+declare const loadScript: (url: string) => Promise<unknown>;

package/package.json

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

package/dist/studio-bridge.d.ts

@@ -1,29 +0,0 @@
-import type { Weaverse } from '.';
-/**
- * When the editor is ready, we'll load this studio-bridge code.
- * This is for processing data between the editor and the workspace project.
- * It will not load in production mode or not running when the editor is not detected/ready.
- */
-export declare class StudioBridge {
-    weaverse: Weaverse;
-    /**
-     * instance for subscribing to window message, save it to currentFrameSubscription then can remove it when unmount
-     */
-    currentFrameSubscription: any;
-    handleProps: any;
-    constructor(weaverse: Weaverse);
-    /**
-     * subscribe to window message event from editor(parent window), and handle the message event
-     */
-    subscribeMessageEvent(): any;
-    /**
-     * handle the message event from editor(parent window)
-     * the message type will start with "weavers.",
-     * when an item got message to update, get the item instance and setData to it
-     * @param event {MessageEvent}
-     */
-    handleMessageEvent: (event: MessageEvent) => void;
-    sendMessageToEditor(type: string, payload: any): void;
-    handleMouseDown: (e: MouseEvent) => void;
-}
-export default StudioBridge;