@weaverse/react 0.1.6 → 0.1.7

package/dist/core.d.ts

@@ -6,6 +6,12 @@ export interface ProjectDataItemType {
 export interface ProjectDataType {
     items: ProjectDataItemType[];
 }
+export declare type WeaverseType = {
+    [key: string]: any;
+    appUrl?: string;
+    projectKey?: string;
+    projectData?: ProjectDataType;
+};
 export declare class Weaverse {
     elementInstances: Map<string, any>;
     itemInstances: Map<string | number, WeaverseItemStore>;
@@ -15,11 +21,7 @@ export declare class Weaverse {
     listeners: Set<any>;
     isEditor: boolean;
     currentFrameSubscription: any;
-    constructor({ appUrl, projectKey, projectData }?: {
-        appUrl?: string;
-        projectKey?: string;
-        projectData?: ProjectDataType;
-    });
+    constructor({ appUrl, projectKey, projectData }?: WeaverseType);
     registerElement(name: string, element: any): void;
     init(): void;
     subscribe(fn: any): void;
@@ -41,5 +43,4 @@ export declare class WeaverseItemStore {
     subscribe: (fn: any) => void;
     unsubscribe: (fn: any) => void;
     triggerUpdate: () => void;
-    useSubscription: (fn: any) => void;
 }

package/dist/elements/base.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare const BaseElement: {
+    ({ tag, children, ...props }: any): React.DetailedReactHTMLElement<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
+    configs: {
+        type: string;
+    };
+};
+export default BaseElement;

package/dist/elements/button.d.ts

@@ -0,0 +1,17 @@
+export declare const Button: {
+    (props: any): JSX.Element;
+    defaultProps: {
+        style: {
+            backgroundColor: string;
+            borderRadius: string;
+            fontSize: string;
+            padding: string;
+        };
+        type: string;
+        tag: string;
+    };
+    configs: {
+        type: string;
+    };
+};
+export default Button;

package/dist/elements/index.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+declare const elements: {
+    Button: {
+        (props: any): JSX.Element;
+        defaultProps: {
+            style: {
+                backgroundColor: string;
+                borderRadius: string;
+                fontSize: string;
+                padding: string;
+            };
+            type: string;
+            tag: string;
+        };
+        configs: {
+            type: string;
+        };
+    };
+    BaseElement: {
+        ({ tag, children, ...props }: any): import("react").DetailedReactHTMLElement<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
+        configs: {
+            type: string;
+        };
+    };
+};
+export default elements;

package/dist/index.d.ts

@@ -1,6 +1,7 @@
-import { Weaverse } from './core';
+import { Weaverse, WeaverseType } from './core';
+declare const createRootContext: (configs: WeaverseType) => Weaverse;
 declare const WeaverseRoot: ({ context, defaultData }: {
     context: Weaverse;
     defaultData: any;
 }) => JSX.Element;
-export { Weaverse, WeaverseRoot };
+export { createRootContext, WeaverseRoot };

package/dist/sdk-react.cjs.development.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
 
 var React = require('react');
+var React__default = _interopDefault(React);
 var fetch = _interopDefault(require('isomorphic-unfetch'));
-var Elements = _interopDefault(require('@weaverse/elements'));
 
 function _extends() {
   _extends = Object.assign || function (target) {
@@ -98,7 +98,6 @@ var Weaverse = /*#__PURE__*/function () {
     this.projectKey = projectKey || this.projectKey;
     projectData && (this.projectData = projectData);
     this.init();
-    console.log('"development"', "development");
   }
 
   var _proto = Weaverse.prototype;
@@ -108,14 +107,6 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.init = function init() {
-    var _this2 = this;
-
-    Object.keys(Elements).forEach(function (key) {
-      var _Elements$key, _Elements$key$configs;
-
-      // @ts-ignore
-      ((_Elements$key = Elements[key]) == null ? void 0 : (_Elements$key$configs = _Elements$key.configs) == null ? void 0 : _Elements$key$configs.type) && _this2.registerElement(Elements[key].configs.type, Elements[key]);
-    });
     this.subscribeMessageEvent();
   };
 
@@ -141,16 +132,16 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.updateProjectData = function updateProjectData() {
-    var _this3 = this;
+    var _this2 = this;
 
     if (this.projectKey) {
       this.fetchProjectData().then(function (data) {
         if (data) {
-          _this3.projectData = data;
+          _this2.projectData = data;
 
-          _this3.initItemData();
+          _this2.initItemData();
 
-          _this3.triggerUpdate();
+          _this2.triggerUpdate();
         }
       })["catch"](function (err) {
         console.error(err);
@@ -159,7 +150,7 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.subscribeMessageEvent = function subscribeMessageEvent() {
-    var _this4 = this;
+    var _this3 = this;
 
     if (typeof this.currentFrameSubscription === 'function') {
       this.currentFrameSubscription();
@@ -168,7 +159,7 @@ var Weaverse = /*#__PURE__*/function () {
     isBrowser && window.addEventListener('message', this.handleMessageEvent);
 
     this.currentFrameSubscription = function () {
-      isBrowser && window.removeEventListener('message', _this4.handleMessageEvent);
+      isBrowser && window.removeEventListener('message', _this3.handleMessageEvent);
     };
 
     return this.currentFrameSubscription;
@@ -193,15 +184,15 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.initItemData = function initItemData() {
-    var _this5 = this;
+    var _this4 = this;
 
     var data = this.projectData;
 
     if (data.items) {
       data.items.forEach(function (item) {
-        var itemStore = _this5.itemInstances.get(item.id) || new WeaverseItemStore(item, _this5);
+        var itemStore = _this4.itemInstances.get(item.id) || new WeaverseItemStore(item, _this4);
 
-        _this5.itemInstances.set(item.id, itemStore);
+        _this4.itemInstances.set(item.id, itemStore);
       });
     }
   };
@@ -209,7 +200,7 @@ var Weaverse = /*#__PURE__*/function () {
   return Weaverse;
 }();
 var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
-  var _this6 = this;
+  var _this5 = this;
 
   if (itemData === void 0) {
     itemData = {};
@@ -219,35 +210,25 @@ var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
   this.listeners = new Set();
 
   this.setData = function (data) {
-    _this6.data = Object.assign(_this6.data, data);
+    _this5.data = Object.assign(_this5.data, data);
 
-    _this6.triggerUpdate();
+    _this5.triggerUpdate();
   };
 
   this.subscribe = function (fn) {
-    _this6.listeners.add(fn);
+    _this5.listeners.add(fn);
   };
 
   this.unsubscribe = function (fn) {
-    _this6.listeners["delete"](fn);
+    _this5.listeners["delete"](fn);
   };
 
   this.triggerUpdate = function () {
-    _this6.listeners.forEach(function (fn) {
-      return fn(_this6.data);
+    _this5.listeners.forEach(function (fn) {
+      return fn(_this5.data);
     });
   };
 
-  this.useSubscription = function (fn) {
-    React.useEffect(function () {
-      _this6.subscribe(fn);
-
-      return function () {
-        _this6.unsubscribe(fn);
-      };
-    }, []);
-  };
-
   this.data = itemData;
   var _itemData = itemData,
       type = _itemData.type;
@@ -257,7 +238,61 @@ var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
   }
 };
 
-var _excluded = ["id", "type", "childIds"];
+var Button = function Button(props) {
+  var _React$useState = React.useState(0),
+      count = _React$useState[0],
+      setCount = _React$useState[1];
+
+  return React.createElement("button", Object.assign({}, props, {
+    onClick: function onClick() {
+      return setCount(count + 1);
+    }
+  }), "Test Button ", count);
+};
+Button.defaultProps = {
+  style: {
+    backgroundColor: 'green',
+    borderRadius: '9999px',
+    fontSize: '13px',
+    padding: '10px 15px'
+  },
+  type: 'button',
+  tag: 'button'
+};
+Button.configs = {
+  type: 'button'
+};
+
+var _excluded = ["tag", "children"];
+var BaseElement = function BaseElement(_ref) {
+  var _ref$tag = _ref.tag,
+      tag = _ref$tag === void 0 ? 'div' : _ref$tag,
+      children = _ref.children,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return React__default.createElement(tag, _extends({}, props), children);
+};
+BaseElement.configs = {
+  type: 'base'
+};
+
+var elements = {
+  Button: Button,
+  BaseElement: BaseElement
+};
+
+var _excluded$1 = ["id", "type", "childIds"];
+
+var createRootContext = function createRootContext(configs) {
+  var rootContext = new Weaverse(configs);
+  Object.keys(elements).forEach(function (key) {
+    var _Elements$key, _Elements$key$configs;
+
+    // @ts-ignore
+    ((_Elements$key = elements[key]) == null ? void 0 : (_Elements$key$configs = _Elements$key.configs) == null ? void 0 : _Elements$key$configs.type) && rootContext.registerElement(elements[key].configs.type, elements[key]);
+  });
+  return rootContext;
+};
 
 var WeaverseRoot = function WeaverseRoot(_ref) {
   var _context$projectData, _context$projectData$;
@@ -303,13 +338,18 @@ var Item = function Item(_ref2) {
   var id = data.id,
       type = data.type,
       childIds = data.childIds,
-      rest = _objectWithoutPropertiesLoose(data, _excluded);
+      rest = _objectWithoutPropertiesLoose(data, _excluded$1);
 
-  var useSubscription = itemInstance.useSubscription;
-  useSubscription(function (update) {
-    console.log('update', update);
-    setData(_extends({}, update));
-  });
+  React.useEffect(function () {
+    var handleUpdate = function handleUpdate(update) {
+      setData(_extends({}, update));
+    };
+
+    itemInstance.subscribe(handleUpdate);
+    return function () {
+      itemInstance.unsubscribe(handleUpdate);
+    };
+  }, []);
   var Component = elementInstances.get(type);
 
   if (Component) {
@@ -346,6 +386,6 @@ var RenderItem = function RenderItem(_ref3) {
   return React.createElement(React.Fragment, null);
 };
 
-exports.Weaverse = Weaverse;
 exports.WeaverseRoot = WeaverseRoot;
+exports.createRootContext = createRootContext;
 //# sourceMappingURL=sdk-react.cjs.development.js.map

package/dist/sdk-react.cjs.development.js.map

@@ -1 +1 @@
-{"version":3,"file":"sdk-react.cjs.development.js","sources":["../src/utils/index.ts","../src/core.ts","../src/index.tsx"],"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\nimport fetch from 'isomorphic-unfetch'\nimport Elements from '@weaverse/elements'\nimport {useEffect} from 'react'\nimport {isBrowser} from './utils'\n\n\nexport interface ProjectDataItemType {\n\ttype: string\n\tname: string\n\tid: string | number\n}\n\nexport interface ProjectDataType {\n\titems: ProjectDataItemType[]\n}\n\nexport class Weaverse {\n\telementInstances = new Map<string, any>()\n\titemInstances = new Map<string | number, WeaverseItemStore>()\n\tappUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n\tprojectKey: string = ''\n\tprojectData: ProjectDataType = {\n\t\titems: []\n\t}\n\tlisteners: Set<any> = new Set()\n\tisEditor = false\n\tcurrentFrameSubscription: any\n\n\tconstructor({\n\t\t\t\t\tappUrl,\n\t\t\t\t\tprojectKey,\n\t\t\t\t\tprojectData\n\t\t\t\t}: { appUrl?: string, projectKey?: string, projectData?: ProjectDataType } = {}) {\n\t\tthis.appUrl = appUrl || this.appUrl\n\t\tthis.projectKey = projectKey || this.projectKey\n\t\tprojectData && (this.projectData = projectData)\n\t\tthis.init()\n\t\tconsole.log('process.env.NODE_ENV', process.env.NODE_ENV)\n\t}\n\n\tregisterElement(name: string, element: any) {\n\t\tthis.elementInstances.set(name, element)\n\t}\n\n\tinit() {\n\t\tObject.keys(Elements).forEach(key => {\n\t\t\t// @ts-ignore\n\t\t\tElements[key]?.configs?.type && this.registerElement(Elements[key].configs.type, Elements[key])\n\t\t})\n\t\tthis.subscribeMessageEvent()\n\t}\n\n\tsubscribe(fn: any) {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe(fn: any) {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate() {\n\t\tthis.listeners.forEach(fn => fn())\n\t\tthis.triggerEditorUpdate()\n\t}\n\n\tfetchProjectData() {\n\t\treturn fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json())\n\t}\n\n\tupdateProjectData() {\n\t\tif (this.projectKey) {\n\t\t\tthis.fetchProjectData().then(data => {\n\t\t\t\tif (data) {\n\t\t\t\t\tthis.projectData = data\n\t\t\t\t\tthis.initItemData()\n\t\t\t\t\tthis.triggerUpdate()\n\t\t\t\t}\n\t\t\t}).catch(err => {\n\t\t\t\tconsole.error(err)\n\t\t\t})\n\t\t}\n\t}\n\n\tsubscribeMessageEvent() {\n\t\tif (typeof this.currentFrameSubscription === 'function') {\n\t\t\tthis.currentFrameSubscription()\n\t\t}\n\t\tisBrowser && window.addEventListener('message', this.handleMessageEvent)\n\t\tthis.currentFrameSubscription = () => {\n\t\t\tisBrowser && window.removeEventListener('message', this.handleMessageEvent)\n\t\t}\n\t\treturn this.currentFrameSubscription\n\t}\n\n\ttriggerEditorUpdate(type = 'weaverse.workspace.init') {\n\t\tif (this.isEditor) {\n\t\t\twindow.top?.postMessage({\n\t\t\t\ttype, payload: {\n\t\t\t\t\tprojectKey: this.projectKey,\n\t\t\t\t\tprojectData: this.projectData\n\t\t\t\t}\n\t\t\t}, '*')\n\t\t}\n\t}\n\n\thandleMessageEvent = (e: MessageEvent) => {\n\t\tif (e.data?.type?.startsWith('weaverse.')) {\n\t\t\tlet type = e.data.type\n\t\t\tswitch (type) {\n\t\t\t\tcase 'weaverse.editor.ready':\n\t\t\t\t\tthis.isEditor = true\n\t\t\t\t\tbreak\n\t\t\t\tcase 'weaverse.editor.update':\n\t\t\t\t\tlet {payload} = e.data\n\t\t\t\t\tlet {itemId, background} = payload\n\t\t\t\t\tlet instance = this.itemInstances.get(itemId)\n\t\t\t\t\tif (instance) {\n\t\t\t\t\t\tinstance.setData({\n\t\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\tbackground\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tinitItemData() {\n\t\tlet data = this.projectData\n\t\tif (data.items) {\n\t\t\tdata.items.forEach(item => {\n\t\t\t\tlet itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n\t\t\t\tthis.itemInstances.set(item.id, itemStore)\n\t\t\t})\n\t\t}\n\t}\n}\n\nexport class WeaverseItemStore {\n\tdata: any = {}\n\tlisteners: Set<any> = new Set()\n\tComponent: any\n\n\tconstructor(itemData: any = {}, weaverse: Weaverse) {\n\t\tthis.data = itemData\n\t\tlet {type} = itemData\n\t\tif (type) {\n\t\t\tthis.Component = weaverse.elementInstances.get(type)\n\t\t}\n\t}\n\n\tsetData = (data: any) => {\n\t\tthis.data = Object.assign(this.data, data)\n\t\tthis.triggerUpdate()\n\t}\n\n\tsubscribe = (fn: any) => {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe = (fn: any) => {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate = () => {\n\t\tthis.listeners.forEach(fn => {\n\t\t\treturn fn(this.data)\n\t\t})\n\t}\n\n\tuseSubscription = (fn: any) => {\n\t\tuseEffect(() => {\n\t\t\tthis.subscribe(fn)\n\t\t\treturn () => {\n\t\t\t\tthis.unsubscribe(fn)\n\t\t\t}\n\t\t}, [])\n\t}\n\n\n\t// addItem(item: any) {\n\t// \tthis.items.push(item)\n\t// \tthis.triggerUpdate()\n\t// }\n\t//\n\t// removeItem(item: any) {\n\t// \tthis.items = this.items.filter(i => i !== item)\n\t// \tthis.triggerUpdate()\n\t// }\n}","import * as React from 'react'\nimport {useEffect} from 'react'\nimport {Weaverse} from './core'\n\nconst WeaverseRoot = ({context, defaultData}: { context: Weaverse, defaultData: any }) => {\n  let [, setData] = React.useState<any>(context.projectData)\n  useEffect(() => {\n    let handleUpdate = () => {\n      setData(context.projectData)\n    }\n    context.subscribe(handleUpdate)\n    context.updateProjectData()\n\n    return () => {\n      context.unsubscribe(handleUpdate)\n    }\n  }, [])\n  if (!context.projectData?.items?.length && defaultData) {\n    context.projectData = defaultData\n    context.initItemData()\n  }\n  return <RenderItem itemId={0} context={context}/>\n\n}\n\n\nconst Item = ({itemInstance, elementInstances, context}: any) => {\n  let [data, setData] = React.useState<any>(itemInstance.data)\n  let {id, type, childIds, ...rest} = data\n\n  let {useSubscription} = itemInstance\n  useSubscription((update: any) => {\n    console.log('update', update)\n    setData({...update})\n  })\n  let Component = elementInstances.get(type)\n  if (Component) {\n    return <Component key={id} data-wv-id={id} {...rest}>\n      {Array.isArray(childIds)\n      && childIds.map(childId =>\n          <RenderItem\n              key={childId}\n              itemId={childId}\n              context={context}\n          />\n      )}\n    </Component>\n  }\n  return null\n}\n\nconst RenderItem = ({itemId, context}: { itemId: number, context: any }): any => {\n  let {itemInstances, elementInstances} = context\n  let itemInstance = itemInstances.get(itemId)\n  if (itemInstance) {\n    return <Item itemInstance={itemInstance} elementInstances={elementInstances} context={context}/>\n  }\n  return <></>\n}\n\nexport {Weaverse, WeaverseRoot}\n"],"names":["isReactNative","navigator","product","isBrowser","window","Weaverse","appUrl","projectKey","projectData","Map","process","items","Set","e","data","type","startsWith","isEditor","payload","itemId","background","instance","itemInstances","get","setData","style","init","console","log","registerElement","name","element","elementInstances","set","Object","keys","Elements","forEach","key","configs","subscribeMessageEvent","subscribe","fn","listeners","add","unsubscribe","triggerUpdate","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","updateProjectData","initItemData","err","error","currentFrameSubscription","addEventListener","handleMessageEvent","removeEventListener","top","postMessage","item","itemStore","id","WeaverseItemStore","itemData","weaverse","assign","useEffect","Component","WeaverseRoot","context","defaultData","React","handleUpdate","length","RenderItem","Item","itemInstance","childIds","rest","useSubscription","update","Array","isArray","map","childId"],"mappings":"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"}
+{"version":3,"file":"sdk-react.cjs.development.js","sources":["../src/utils/index.ts","../src/core.ts","../src/elements/button.tsx","../src/elements/base.tsx","../src/elements/index.ts","../src/index.tsx"],"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\nimport fetch from 'isomorphic-unfetch'\nimport {isBrowser} from './utils'\n\n\nexport interface ProjectDataItemType {\n\ttype: string\n\tname: string\n\tid: string | number\n}\n\nexport interface ProjectDataType {\n\titems: ProjectDataItemType[]\n}\n\n// const isSheetAccessible = (sheet: CSSStyleSheet) => {\n// \tif (sheet.href && !sheet.href.startsWith(location.origin)) {\n// \t\treturn false\n// \t}\n//\n// \ttry {\n// \t\tsheet.cssRules\n// \t\treturn true\n// \t} catch (e) {\n// \t\treturn false\n// \t}\n// }\n\n// export class WeaverseStyle {\n// \tpublic styleSheets: StyleSheetList\n// \tpublic document: Document\n//\n// \tconstructor(root: Document) {\n// \t\tthis.document = root\n// \t\tthis.styleSheets = this.document.styleSheets\n// \t}\n//\n// \t// Create styleSheet instance that work both on client and server side\n// \tcreateSheet = (root?: Document) => {\n// \t\tlet sheetInstance: any = null\n//\n// \t\tconst reset = () => {\n// \t\t\tconst sheets = Object(root).styleSheets || []\n// \t\t\t// iterate all stylesheets until a hydratable stylesheet is found\n// \t\t\tfor (const sheet of sheets) {\n// \t\t\t\tif (!isSheetAccessible(sheet)) continue\n//\n// \t\t\t\tfor (let index = 0, rules = sheet.cssRules; rules[index]; ++index) {\n// \t\t\t\t\t// /** @type {CSSStyleRule} Possible indicator rule. */\n// \t\t\t\t\tconst check = Object(rules[index])\n// \t\t\t\t\tif (check.selectorText && check.selectorText.includes('@media')) {\n// \t\t\t\t\t\tif (!sheetInstance) sheetInstance = {sheet, reset, rules: sheet.cssRules}\n// \t\t\t\t\t\tbreak\n// \t\t\t\t\t}\n//\n// \t\t\t\t}\n//\n// \t\t\t\t// if a hydratable stylesheet is found, stop looking\n// \t\t\t\tif (sheetInstance) break\n// \t\t\t}\n// \t\t\t// if no hydratable stylesheet is found\n// \t\t\tif (!sheetInstance) {\n// \t\t\t\tconst createCSSMediaRule = (sourceCssText: string) => {\n// \t\t\t\t\tlet rule: any = {\n// \t\t\t\t\t\tcssRules: [],\n// \t\t\t\t\t\tinsertRule(cssText: string, index: number) {\n// \t\t\t\t\t\t\tthis.cssRules.splice(index, 0, createCSSMediaRule(cssText))\n// \t\t\t\t\t\t},\n// \t\t\t\t\t\tget cssText() {\n// \t\t\t\t\t\t\treturn sourceCssText === '@media{}' ? `@media{${[].map.call(this.cssRules, (cssRule: any) => cssRule.cssText).join('')}}` : sourceCssText\n// \t\t\t\t\t\t}\n// \t\t\t\t\t}\n// \t\t\t\t\treturn rule\n// \t\t\t\t}\n//\n// \t\t\t\tsheetInstance = {\n// \t\t\t\t\tsheet: root ? (root.head || root).appendChild(root.createElement('style')).sheet : createCSSMediaRule(''),\n// \t\t\t\t\trules: {},\n// \t\t\t\t\treset,\n// \t\t\t\t\ttoString() {\n// \t\t\t\t\t\tconst {cssRules} = sheetInstance.sheet\n// \t\t\t\t\t\treturn [].map\n// \t\t\t\t\t\t\t.call(cssRules, (cssMediaRule: CSSMediaRule, cssRuleIndex) => {\n// \t\t\t\t\t\t\t\tconst {cssText} = cssMediaRule\n//\n// \t\t\t\t\t\t\t\tlet lastRuleCssText = ''\n// \t\t\t\t\t\t\t\tif (cssRules[cssRuleIndex - 1]) {\n// \t\t\t\t\t\t\t\t\tif (!cssMediaRule.cssRules.length) return ''\n//\n// \t\t\t\t\t\t\t\t\tfor (const name in sheetInstance.rules) {\n// \t\t\t\t\t\t\t\t\t\tif (sheetInstance.rules[name].group === cssMediaRule) {\n// \t\t\t\t\t\t\t\t\t\t\treturn `--sxs{--sxs:${[...sheetInstance.rules[name].cache].join(' ')}}${cssText}`\n// \t\t\t\t\t\t\t\t\t\t}\n// \t\t\t\t\t\t\t\t\t}\n//\n// \t\t\t\t\t\t\t\t\treturn cssMediaRule.cssRules.length ? `${lastRuleCssText}${cssText}` : ''\n// \t\t\t\t\t\t\t\t}\n//\n// \t\t\t\t\t\t\t\treturn cssText\n// \t\t\t\t\t\t\t})\n// \t\t\t\t\t\t\t.join('')\n// \t\t\t\t\t}\n// \t\t\t\t}\n// \t\t\t}\n// \t\t}\n//\n// \t}\n//\n// }\n\nexport type WeaverseType = {\n\t[key: string]: any\n\tappUrl?: string,\n\tprojectKey?: string,\n\tprojectData?: ProjectDataType\n}\n\nexport class Weaverse {\n\telementInstances = new Map<string, any>()\n\titemInstances = new Map<string | number, WeaverseItemStore>()\n\tappUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n\tprojectKey: string = ''\n\tprojectData: ProjectDataType = {\n\t\titems: []\n\t}\n\tlisteners: Set<any> = new Set()\n\tisEditor = false\n\tcurrentFrameSubscription: any\n\n\tconstructor({appUrl, projectKey, projectData}: WeaverseType = {}) {\n\t\tthis.appUrl = appUrl || this.appUrl\n\t\tthis.projectKey = projectKey || this.projectKey\n\t\tprojectData && (this.projectData = projectData)\n\t\tthis.init()\n\t}\n\n\tregisterElement(name: string, element: any) {\n\t\tthis.elementInstances.set(name, element)\n\t}\n\n\tinit() {\n\t\tthis.subscribeMessageEvent()\n\t}\n\n\tsubscribe(fn: any) {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe(fn: any) {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate() {\n\t\tthis.listeners.forEach(fn => fn())\n\t\tthis.triggerEditorUpdate()\n\t}\n\n\tfetchProjectData() {\n\t\treturn fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json())\n\t}\n\n\tupdateProjectData() {\n\t\tif (this.projectKey) {\n\t\t\tthis.fetchProjectData().then(data => {\n\t\t\t\tif (data) {\n\t\t\t\t\tthis.projectData = data\n\t\t\t\t\tthis.initItemData()\n\t\t\t\t\tthis.triggerUpdate()\n\t\t\t\t}\n\t\t\t}).catch(err => {\n\t\t\t\tconsole.error(err)\n\t\t\t})\n\t\t}\n\t}\n\n\tsubscribeMessageEvent() {\n\t\tif (typeof this.currentFrameSubscription === 'function') {\n\t\t\tthis.currentFrameSubscription()\n\t\t}\n\t\tisBrowser && window.addEventListener('message', this.handleMessageEvent)\n\t\tthis.currentFrameSubscription = () => {\n\t\t\tisBrowser && window.removeEventListener('message', this.handleMessageEvent)\n\t\t}\n\t\treturn this.currentFrameSubscription\n\t}\n\n\ttriggerEditorUpdate(type = 'weaverse.workspace.init') {\n\t\tif (this.isEditor) {\n\t\t\twindow.top?.postMessage({\n\t\t\t\ttype, payload: {\n\t\t\t\t\tprojectKey: this.projectKey,\n\t\t\t\t\tprojectData: this.projectData\n\t\t\t\t}\n\t\t\t}, '*')\n\t\t}\n\t}\n\n\thandleMessageEvent = (e: MessageEvent) => {\n\t\tif (e.data?.type?.startsWith('weaverse.')) {\n\t\t\tlet type = e.data.type\n\t\t\tswitch (type) {\n\t\t\t\tcase 'weaverse.editor.ready':\n\t\t\t\t\tthis.isEditor = true\n\t\t\t\t\tbreak\n\t\t\t\tcase 'weaverse.editor.update':\n\t\t\t\t\tlet {payload} = e.data\n\t\t\t\t\tlet {itemId, background} = payload\n\t\t\t\t\tlet instance = this.itemInstances.get(itemId)\n\t\t\t\t\tif (instance) {\n\t\t\t\t\t\tinstance.setData({\n\t\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\tbackground\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tinitItemData() {\n\t\tlet data = this.projectData\n\t\tif (data.items) {\n\t\t\tdata.items.forEach(item => {\n\t\t\t\tlet itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n\t\t\t\tthis.itemInstances.set(item.id, itemStore)\n\t\t\t})\n\t\t}\n\t}\n}\n\nexport class WeaverseItemStore {\n\tdata: any = {}\n\tlisteners: Set<any> = new Set()\n\tComponent: any\n\n\tconstructor(itemData: any = {}, weaverse: Weaverse) {\n\t\tthis.data = itemData\n\t\tlet {type} = itemData\n\t\tif (type) {\n\t\t\tthis.Component = weaverse.elementInstances.get(type)\n\t\t}\n\t}\n\n\tsetData = (data: any) => {\n\t\tthis.data = Object.assign(this.data, data)\n\t\tthis.triggerUpdate()\n\t}\n\n\tsubscribe = (fn: any) => {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe = (fn: any) => {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate = () => {\n\t\tthis.listeners.forEach(fn => {\n\t\t\treturn fn(this.data)\n\t\t})\n\t}\n\n\n\n\t// addItem(item: any) {\n\t// \tthis.items.push(item)\n\t// \tthis.triggerUpdate()\n\t// }\n\t//\n\t// removeItem(item: any) {\n\t// \tthis.items = this.items.filter(i => i !== item)\n\t// \tthis.triggerUpdate()\n\t// }\n}","import * as React from 'react'\n\nexport const Button = (props: any) => {\n    let [count, setCount] = React.useState(0)\n    return <button {...props} onClick={() => setCount(count + 1)}>Test Button {count}</button>\n}\n\nButton.defaultProps = {\n    style: {\n        backgroundColor: 'green',\n        borderRadius: '9999px',\n        fontSize: '13px',\n        padding: '10px 15px'\n    },\n    type: 'button',\n    tag: 'button'\n}\nButton.configs = {\n    type: 'button'\n}\n\nexport default Button","import React from 'react'\n\nexport const BaseElement = ({tag = 'div', children, ...props}: any) => {\n    return React.createElement(tag, {\n        ...props\n    }, children)\n}\n\nBaseElement.configs = {\n    type: 'base'\n}\nexport default BaseElement\n","import Button from './button'\nimport BaseElement from './base'\n\nconst elements = {\n\tButton,\n\tBaseElement\n}\nexport default elements","import * as React from 'react'\nimport {useEffect} from 'react'\nimport {Weaverse, WeaverseType} from './core'\nimport Elements from './elements'\n\nlet stitches = require('@stitches/core')\n\nconst createRootContext = (configs: WeaverseType) => {\n  const rootContext = new Weaverse(configs)\n  Object.keys(Elements).forEach(key => {\n    // @ts-ignore\n    Elements[key]?.configs?.type && rootContext.registerElement(Elements[key].configs.type, Elements[key])\n  })\n\n  return rootContext\n}\n\nconst WeaverseRoot = ({context, defaultData}: { context: Weaverse, defaultData: any }) => {\n  let [, setData] = React.useState<any>(context.projectData)\n  useEffect(() => {\n    let handleUpdate = () => {\n      setData(context.projectData)\n    }\n    context.subscribe(handleUpdate)\n    context.updateProjectData()\n\n    return () => {\n      context.unsubscribe(handleUpdate)\n    }\n  }, [])\n  if (!context.projectData?.items?.length && defaultData) {\n    context.projectData = defaultData\n    context.initItemData()\n  }\n  return <RenderItem itemId={0} context={context}/>\n}\n\n\nconst Item = ({itemInstance, elementInstances, context}: any) => {\n  let [data, setData] = React.useState<any>(itemInstance.data)\n  let {id, type, childIds, ...rest} = data\n\n  useEffect(() => {\n    let handleUpdate = (update: any) => {\n      setData({...update})\n    }\n    itemInstance.subscribe(handleUpdate)\n    return () => {\n      itemInstance.unsubscribe(handleUpdate)\n    }\n  }, [])\n  let Component = elementInstances.get(type)\n  if (Component) {\n    return <Component key={id} data-wv-id={id} {...rest}>\n      {Array.isArray(childIds)\n          && childIds.map(childId =>\n              <RenderItem\n                  key={childId}\n                  itemId={childId}\n                  context={context}\n              />\n      )}\n    </Component>\n  }\n  return null\n}\n\n\nconst RenderItem = ({itemId, context}: { itemId: number, context: any }): any => {\n  let {itemInstances, elementInstances} = context\n  let itemInstance = itemInstances.get(itemId)\n  if (itemInstance) {\n    return <Item itemInstance={itemInstance} elementInstances={elementInstances} context={context}/>\n  }\n  return <></>\n}\n\nexport {createRootContext, WeaverseRoot}\n"],"names":["isReactNative","navigator","product","isBrowser","window","Weaverse","appUrl","projectKey","projectData","Map","process","items","Set","e","data","type","startsWith","isEditor","payload","itemId","background","instance","itemInstances","get","setData","style","init","registerElement","name","element","elementInstances","set","subscribeMessageEvent","subscribe","fn","listeners","add","unsubscribe","triggerUpdate","forEach","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","updateProjectData","initItemData","err","console","error","currentFrameSubscription","addEventListener","handleMessageEvent","removeEventListener","top","postMessage","item","itemStore","id","WeaverseItemStore","itemData","weaverse","Object","assign","Component","Button","props","React","count","setCount","onClick","defaultProps","backgroundColor","borderRadius","fontSize","padding","tag","configs","BaseElement","children","createElement","elements","createRootContext","rootContext","keys","Elements","key","WeaverseRoot","context","defaultData","useEffect","handleUpdate","length","RenderItem","Item","itemInstance","childIds","rest","update","Array","isArray","map","childId"],"mappings":"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"}

package/dist/sdk-react.cjs.production.min.js

@@ -1,2 +1,2 @@
-"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=t(require("isomorphic-unfetch")),i=t(require("@weaverse/elements"));function r(){return(r=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}var s="object"==typeof navigator&&"ReactNative"===navigator.product,a="undefined"!=typeof window&&!s,c=function(){function t(t){var e=this,n=void 0===t?{}:t,i=n.appUrl,r=n.projectKey,s=n.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.handleMessageEvent=function(t){var n,i;if(null!=(n=t.data)&&null!=(i=n.type)&&i.startsWith("weaverse."))switch(t.data.type){case"weaverse.editor.ready":e.isEditor=!0;break;case"weaverse.editor.update":var r=t.data.payload,s=r.background,a=e.itemInstances.get(r.itemId);a&&a.setData({style:{background:s}})}},this.appUrl=i||this.appUrl,this.projectKey=r||this.projectKey,s&&(this.projectData=s),this.init(),console.log('"production"',"production")}var e=t.prototype;return e.registerElement=function(t,e){this.elementInstances.set(t,e)},e.init=function(){var t=this;Object.keys(i).forEach((function(e){var n,r;(null==(n=i[e])||null==(r=n.configs)?void 0:r.type)&&t.registerElement(i[e].configs.type,i[e])})),this.subscribeMessageEvent()},e.subscribe=function(t){this.listeners.add(t)},e.unsubscribe=function(t){this.listeners.delete(t)},e.triggerUpdate=function(){this.listeners.forEach((function(t){return t()})),this.triggerEditorUpdate()},e.fetchProjectData=function(){return n(this.appUrl+"/api/public/"+this.projectKey).then((function(t){return t.json()}))},e.updateProjectData=function(){var t=this;this.projectKey&&this.fetchProjectData().then((function(e){e&&(t.projectData=e,t.initItemData(),t.triggerUpdate())})).catch((function(t){console.error(t)}))},e.subscribeMessageEvent=function(){var t=this;return"function"==typeof this.currentFrameSubscription&&this.currentFrameSubscription(),a&&window.addEventListener("message",this.handleMessageEvent),this.currentFrameSubscription=function(){a&&window.removeEventListener("message",t.handleMessageEvent)},this.currentFrameSubscription},e.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}},"*"))},e.initItemData=function(){var t=this,e=this.projectData;e.items&&e.items.forEach((function(e){var n=t.itemInstances.get(e.id)||new o(e,t);t.itemInstances.set(e.id,n)}))},t}(),o=function(t,n){var i=this;void 0===t&&(t={}),this.data={},this.listeners=new Set,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.useSubscription=function(t){e.useEffect((function(){return i.subscribe(t),function(){i.unsubscribe(t)}}),[])},this.data=t;var r=t.type;r&&(this.Component=n.elementInstances.get(r))},u=["id","type","childIds"],p=function(t){var n=t.itemInstance,i=t.elementInstances,s=t.context,a=e.useState(n.data),c=a[0],o=a[1],p=c.id,l=c.type,h=c.childIds,f=function(t,e){if(null==t)return{};var n,i,r={},s=Object.keys(t);for(i=0;i<s.length;i++)e.indexOf(n=s[i])>=0||(r[n]=t[n]);return r}(c,u);(0,n.useSubscription)((function(t){console.log("update",t),o(r({},t))}));var v=i.get(l);return v?e.createElement(v,Object.assign({key:p,"data-wv-id":p},f),Array.isArray(h)&&h.map((function(t){return e.createElement(d,{key:t,itemId:t,context:s})}))):null},d=function(t){var n=t.context,i=n.elementInstances,r=n.itemInstances.get(t.itemId);return r?e.createElement(p,{itemInstance:r,elementInstances:i,context:n}):e.createElement(e.Fragment,null)};exports.Weaverse=c,exports.WeaverseRoot=function(t){var n,i,r=t.context,s=t.defaultData,a=e.useState(r.projectData)[1];return e.useEffect((function(){var t=function(){a(r.projectData)};return r.subscribe(t),r.updateProjectData(),function(){r.unsubscribe(t)}}),[]),null!=(n=r.projectData)&&null!=(i=n.items)&&i.length||!s||(r.projectData=s,r.initItemData()),e.createElement(d,{itemId:0,context:r})};
+"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=t(e),r=t(require("isomorphic-unfetch"));function i(){return(i=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t}).apply(this,arguments)}function a(t,e){if(null==t)return{};var n,r,i={},a=Object.keys(t);for(r=0;r<a.length;r++)e.indexOf(n=a[r])>=0||(i[n]=t[n]);return i}var s="object"==typeof navigator&&"ReactNative"===navigator.product,o="undefined"!=typeof window&&!s,c=function(){function t(t){var e=this,n=void 0===t?{}:t,r=n.appUrl,i=n.projectKey,a=n.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.handleMessageEvent=function(t){var n,r;if(null!=(n=t.data)&&null!=(r=n.type)&&r.startsWith("weaverse."))switch(t.data.type){case"weaverse.editor.ready":e.isEditor=!0;break;case"weaverse.editor.update":var i=t.data.payload,a=i.background,s=e.itemInstances.get(i.itemId);s&&s.setData({style:{background:a}})}},this.appUrl=r||this.appUrl,this.projectKey=i||this.projectKey,a&&(this.projectData=a),this.init()}var e=t.prototype;return e.registerElement=function(t,e){this.elementInstances.set(t,e)},e.init=function(){this.subscribeMessageEvent()},e.subscribe=function(t){this.listeners.add(t)},e.unsubscribe=function(t){this.listeners.delete(t)},e.triggerUpdate=function(){this.listeners.forEach((function(t){return t()})),this.triggerEditorUpdate()},e.fetchProjectData=function(){return r(this.appUrl+"/api/public/"+this.projectKey).then((function(t){return t.json()}))},e.updateProjectData=function(){var t=this;this.projectKey&&this.fetchProjectData().then((function(e){e&&(t.projectData=e,t.initItemData(),t.triggerUpdate())})).catch((function(t){console.error(t)}))},e.subscribeMessageEvent=function(){var t=this;return"function"==typeof this.currentFrameSubscription&&this.currentFrameSubscription(),o&&window.addEventListener("message",this.handleMessageEvent),this.currentFrameSubscription=function(){o&&window.removeEventListener("message",t.handleMessageEvent)},this.currentFrameSubscription},e.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}},"*"))},e.initItemData=function(){var t=this,e=this.projectData;e.items&&e.items.forEach((function(e){var n=t.itemInstances.get(e.id)||new u(e,t);t.itemInstances.set(e.id,n)}))},t}(),u=function(t,e){var n=this;void 0===t&&(t={}),this.data={},this.listeners=new Set,this.setData=function(t){n.data=Object.assign(n.data,t),n.triggerUpdate()},this.subscribe=function(t){n.listeners.add(t)},this.unsubscribe=function(t){n.listeners.delete(t)},this.triggerUpdate=function(){n.listeners.forEach((function(t){return t(n.data)}))},this.data=t;var r=t.type;r&&(this.Component=e.elementInstances.get(r))},p=function(t){var n=e.useState(0),r=n[0],i=n[1];return e.createElement("button",Object.assign({},t,{onClick:function(){return i(r+1)}}),"Test Button ",r)};p.defaultProps={style:{backgroundColor:"green",borderRadius:"9999px",fontSize:"13px",padding:"10px 15px"},type:"button",tag:"button"},p.configs={type:"button"};var d=["tag","children"],l=function(t){var e=t.tag,r=void 0===e?"div":e,s=t.children,o=a(t,d);return n.createElement(r,i({},o),s)};l.configs={type:"base"};var f={Button:p,BaseElement:l},h=["id","type","childIds"],v=function(t){var n=t.itemInstance,r=t.elementInstances,s=t.context,o=e.useState(n.data),c=o[0],u=o[1],p=c.id,d=c.type,l=c.childIds,f=a(c,h);e.useEffect((function(){var t=function(t){u(i({},t))};return n.subscribe(t),function(){n.unsubscribe(t)}}),[]);var v=r.get(d);return v?e.createElement(v,Object.assign({key:p,"data-wv-id":p},f),Array.isArray(l)&&l.map((function(t){return e.createElement(g,{key:t,itemId:t,context:s})}))):null},g=function(t){var n=t.context,r=n.elementInstances,i=n.itemInstances.get(t.itemId);return i?e.createElement(v,{itemInstance:i,elementInstances:r,context:n}):e.createElement(e.Fragment,null)};exports.WeaverseRoot=function(t){var n,r,i=t.context,a=t.defaultData,s=e.useState(i.projectData)[1];return e.useEffect((function(){var t=function(){s(i.projectData)};return i.subscribe(t),i.updateProjectData(),function(){i.unsubscribe(t)}}),[]),null!=(n=i.projectData)&&null!=(r=n.items)&&r.length||!a||(i.projectData=a,i.initItemData()),e.createElement(g,{itemId:0,context:i})},exports.createRootContext=function(t){var e=new c(t);return Object.keys(f).forEach((function(t){var n,r;(null==(n=f[t])||null==(r=n.configs)?void 0:r.type)&&e.registerElement(f[t].configs.type,f[t])})),e};
 //# sourceMappingURL=sdk-react.cjs.production.min.js.map

package/dist/sdk-react.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"sdk-react.cjs.production.min.js","sources":["../src/utils/index.ts","../src/core.ts","../src/index.tsx"],"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\nimport fetch from 'isomorphic-unfetch'\nimport Elements from '@weaverse/elements'\nimport {useEffect} from 'react'\nimport {isBrowser} from './utils'\n\n\nexport interface ProjectDataItemType {\n\ttype: string\n\tname: string\n\tid: string | number\n}\n\nexport interface ProjectDataType {\n\titems: ProjectDataItemType[]\n}\n\nexport class Weaverse {\n\telementInstances = new Map<string, any>()\n\titemInstances = new Map<string | number, WeaverseItemStore>()\n\tappUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n\tprojectKey: string = ''\n\tprojectData: ProjectDataType = {\n\t\titems: []\n\t}\n\tlisteners: Set<any> = new Set()\n\tisEditor = false\n\tcurrentFrameSubscription: any\n\n\tconstructor({\n\t\t\t\t\tappUrl,\n\t\t\t\t\tprojectKey,\n\t\t\t\t\tprojectData\n\t\t\t\t}: { appUrl?: string, projectKey?: string, projectData?: ProjectDataType } = {}) {\n\t\tthis.appUrl = appUrl || this.appUrl\n\t\tthis.projectKey = projectKey || this.projectKey\n\t\tprojectData && (this.projectData = projectData)\n\t\tthis.init()\n\t\tconsole.log('process.env.NODE_ENV', process.env.NODE_ENV)\n\t}\n\n\tregisterElement(name: string, element: any) {\n\t\tthis.elementInstances.set(name, element)\n\t}\n\n\tinit() {\n\t\tObject.keys(Elements).forEach(key => {\n\t\t\t// @ts-ignore\n\t\t\tElements[key]?.configs?.type && this.registerElement(Elements[key].configs.type, Elements[key])\n\t\t})\n\t\tthis.subscribeMessageEvent()\n\t}\n\n\tsubscribe(fn: any) {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe(fn: any) {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate() {\n\t\tthis.listeners.forEach(fn => fn())\n\t\tthis.triggerEditorUpdate()\n\t}\n\n\tfetchProjectData() {\n\t\treturn fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json())\n\t}\n\n\tupdateProjectData() {\n\t\tif (this.projectKey) {\n\t\t\tthis.fetchProjectData().then(data => {\n\t\t\t\tif (data) {\n\t\t\t\t\tthis.projectData = data\n\t\t\t\t\tthis.initItemData()\n\t\t\t\t\tthis.triggerUpdate()\n\t\t\t\t}\n\t\t\t}).catch(err => {\n\t\t\t\tconsole.error(err)\n\t\t\t})\n\t\t}\n\t}\n\n\tsubscribeMessageEvent() {\n\t\tif (typeof this.currentFrameSubscription === 'function') {\n\t\t\tthis.currentFrameSubscription()\n\t\t}\n\t\tisBrowser && window.addEventListener('message', this.handleMessageEvent)\n\t\tthis.currentFrameSubscription = () => {\n\t\t\tisBrowser && window.removeEventListener('message', this.handleMessageEvent)\n\t\t}\n\t\treturn this.currentFrameSubscription\n\t}\n\n\ttriggerEditorUpdate(type = 'weaverse.workspace.init') {\n\t\tif (this.isEditor) {\n\t\t\twindow.top?.postMessage({\n\t\t\t\ttype, payload: {\n\t\t\t\t\tprojectKey: this.projectKey,\n\t\t\t\t\tprojectData: this.projectData\n\t\t\t\t}\n\t\t\t}, '*')\n\t\t}\n\t}\n\n\thandleMessageEvent = (e: MessageEvent) => {\n\t\tif (e.data?.type?.startsWith('weaverse.')) {\n\t\t\tlet type = e.data.type\n\t\t\tswitch (type) {\n\t\t\t\tcase 'weaverse.editor.ready':\n\t\t\t\t\tthis.isEditor = true\n\t\t\t\t\tbreak\n\t\t\t\tcase 'weaverse.editor.update':\n\t\t\t\t\tlet {payload} = e.data\n\t\t\t\t\tlet {itemId, background} = payload\n\t\t\t\t\tlet instance = this.itemInstances.get(itemId)\n\t\t\t\t\tif (instance) {\n\t\t\t\t\t\tinstance.setData({\n\t\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\tbackground\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tinitItemData() {\n\t\tlet data = this.projectData\n\t\tif (data.items) {\n\t\t\tdata.items.forEach(item => {\n\t\t\t\tlet itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n\t\t\t\tthis.itemInstances.set(item.id, itemStore)\n\t\t\t})\n\t\t}\n\t}\n}\n\nexport class WeaverseItemStore {\n\tdata: any = {}\n\tlisteners: Set<any> = new Set()\n\tComponent: any\n\n\tconstructor(itemData: any = {}, weaverse: Weaverse) {\n\t\tthis.data = itemData\n\t\tlet {type} = itemData\n\t\tif (type) {\n\t\t\tthis.Component = weaverse.elementInstances.get(type)\n\t\t}\n\t}\n\n\tsetData = (data: any) => {\n\t\tthis.data = Object.assign(this.data, data)\n\t\tthis.triggerUpdate()\n\t}\n\n\tsubscribe = (fn: any) => {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe = (fn: any) => {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate = () => {\n\t\tthis.listeners.forEach(fn => {\n\t\t\treturn fn(this.data)\n\t\t})\n\t}\n\n\tuseSubscription = (fn: any) => {\n\t\tuseEffect(() => {\n\t\t\tthis.subscribe(fn)\n\t\t\treturn () => {\n\t\t\t\tthis.unsubscribe(fn)\n\t\t\t}\n\t\t}, [])\n\t}\n\n\n\t// addItem(item: any) {\n\t// \tthis.items.push(item)\n\t// \tthis.triggerUpdate()\n\t// }\n\t//\n\t// removeItem(item: any) {\n\t// \tthis.items = this.items.filter(i => i !== item)\n\t// \tthis.triggerUpdate()\n\t// }\n}","import * as React from 'react'\nimport {useEffect} from 'react'\nimport {Weaverse} from './core'\n\nconst WeaverseRoot = ({context, defaultData}: { context: Weaverse, defaultData: any }) => {\n  let [, setData] = React.useState<any>(context.projectData)\n  useEffect(() => {\n    let handleUpdate = () => {\n      setData(context.projectData)\n    }\n    context.subscribe(handleUpdate)\n    context.updateProjectData()\n\n    return () => {\n      context.unsubscribe(handleUpdate)\n    }\n  }, [])\n  if (!context.projectData?.items?.length && defaultData) {\n    context.projectData = defaultData\n    context.initItemData()\n  }\n  return <RenderItem itemId={0} context={context}/>\n\n}\n\n\nconst Item = ({itemInstance, elementInstances, context}: any) => {\n  let [data, setData] = React.useState<any>(itemInstance.data)\n  let {id, type, childIds, ...rest} = data\n\n  let {useSubscription} = itemInstance\n  useSubscription((update: any) => {\n    console.log('update', update)\n    setData({...update})\n  })\n  let Component = elementInstances.get(type)\n  if (Component) {\n    return <Component key={id} data-wv-id={id} {...rest}>\n      {Array.isArray(childIds)\n      && childIds.map(childId =>\n          <RenderItem\n              key={childId}\n              itemId={childId}\n              context={context}\n          />\n      )}\n    </Component>\n  }\n  return null\n}\n\nconst RenderItem = ({itemId, context}: { itemId: number, context: any }): any => {\n  let {itemInstances, elementInstances} = context\n  let itemInstance = itemInstances.get(itemId)\n  if (itemInstance) {\n    return <Item itemInstance={itemInstance} elementInstances={elementInstances} context={context}/>\n  }\n  return <></>\n}\n\nexport {Weaverse, WeaverseRoot}\n"],"names":["isReactNative","navigator","product","isBrowser","window","Weaverse","appUrl","projectKey","projectData","Map","items","Set","e","data","_e$data","type","_e$data$type","startsWith","_this","isEditor","payload","background","instance","itemInstances","get","itemId","setData","style","this","init","console","log","process","registerElement","name","element","elementInstances","set","Object","keys","Elements","forEach","key","configs","_this2","subscribeMessageEvent","subscribe","fn","listeners","add","unsubscribe","triggerUpdate","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","updateProjectData","_this3","initItemData","err","error","currentFrameSubscription","addEventListener","handleMessageEvent","removeEventListener","_this4","top","postMessage","item","itemStore","_this5","id","WeaverseItemStore","itemData","weaverse","_this6","assign","useEffect","Component","Item","itemInstance","context","React","childIds","rest","useSubscription","update","Array","isArray","map","childId","RenderItem","defaultData","handleUpdate","_context$projectData","_context$projectData$","length"],"mappings":"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"}
+{"version":3,"file":"sdk-react.cjs.production.min.js","sources":["../src/utils/index.ts","../src/core.ts","../src/elements/button.tsx","../src/elements/base.tsx","../src/elements/index.ts","../src/index.tsx"],"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\nimport fetch from 'isomorphic-unfetch'\nimport {isBrowser} from './utils'\n\n\nexport interface ProjectDataItemType {\n\ttype: string\n\tname: string\n\tid: string | number\n}\n\nexport interface ProjectDataType {\n\titems: ProjectDataItemType[]\n}\n\n// const isSheetAccessible = (sheet: CSSStyleSheet) => {\n// \tif (sheet.href && !sheet.href.startsWith(location.origin)) {\n// \t\treturn false\n// \t}\n//\n// \ttry {\n// \t\tsheet.cssRules\n// \t\treturn true\n// \t} catch (e) {\n// \t\treturn false\n// \t}\n// }\n\n// export class WeaverseStyle {\n// \tpublic styleSheets: StyleSheetList\n// \tpublic document: Document\n//\n// \tconstructor(root: Document) {\n// \t\tthis.document = root\n// \t\tthis.styleSheets = this.document.styleSheets\n// \t}\n//\n// \t// Create styleSheet instance that work both on client and server side\n// \tcreateSheet = (root?: Document) => {\n// \t\tlet sheetInstance: any = null\n//\n// \t\tconst reset = () => {\n// \t\t\tconst sheets = Object(root).styleSheets || []\n// \t\t\t// iterate all stylesheets until a hydratable stylesheet is found\n// \t\t\tfor (const sheet of sheets) {\n// \t\t\t\tif (!isSheetAccessible(sheet)) continue\n//\n// \t\t\t\tfor (let index = 0, rules = sheet.cssRules; rules[index]; ++index) {\n// \t\t\t\t\t// /** @type {CSSStyleRule} Possible indicator rule. */\n// \t\t\t\t\tconst check = Object(rules[index])\n// \t\t\t\t\tif (check.selectorText && check.selectorText.includes('@media')) {\n// \t\t\t\t\t\tif (!sheetInstance) sheetInstance = {sheet, reset, rules: sheet.cssRules}\n// \t\t\t\t\t\tbreak\n// \t\t\t\t\t}\n//\n// \t\t\t\t}\n//\n// \t\t\t\t// if a hydratable stylesheet is found, stop looking\n// \t\t\t\tif (sheetInstance) break\n// \t\t\t}\n// \t\t\t// if no hydratable stylesheet is found\n// \t\t\tif (!sheetInstance) {\n// \t\t\t\tconst createCSSMediaRule = (sourceCssText: string) => {\n// \t\t\t\t\tlet rule: any = {\n// \t\t\t\t\t\tcssRules: [],\n// \t\t\t\t\t\tinsertRule(cssText: string, index: number) {\n// \t\t\t\t\t\t\tthis.cssRules.splice(index, 0, createCSSMediaRule(cssText))\n// \t\t\t\t\t\t},\n// \t\t\t\t\t\tget cssText() {\n// \t\t\t\t\t\t\treturn sourceCssText === '@media{}' ? `@media{${[].map.call(this.cssRules, (cssRule: any) => cssRule.cssText).join('')}}` : sourceCssText\n// \t\t\t\t\t\t}\n// \t\t\t\t\t}\n// \t\t\t\t\treturn rule\n// \t\t\t\t}\n//\n// \t\t\t\tsheetInstance = {\n// \t\t\t\t\tsheet: root ? (root.head || root).appendChild(root.createElement('style')).sheet : createCSSMediaRule(''),\n// \t\t\t\t\trules: {},\n// \t\t\t\t\treset,\n// \t\t\t\t\ttoString() {\n// \t\t\t\t\t\tconst {cssRules} = sheetInstance.sheet\n// \t\t\t\t\t\treturn [].map\n// \t\t\t\t\t\t\t.call(cssRules, (cssMediaRule: CSSMediaRule, cssRuleIndex) => {\n// \t\t\t\t\t\t\t\tconst {cssText} = cssMediaRule\n//\n// \t\t\t\t\t\t\t\tlet lastRuleCssText = ''\n// \t\t\t\t\t\t\t\tif (cssRules[cssRuleIndex - 1]) {\n// \t\t\t\t\t\t\t\t\tif (!cssMediaRule.cssRules.length) return ''\n//\n// \t\t\t\t\t\t\t\t\tfor (const name in sheetInstance.rules) {\n// \t\t\t\t\t\t\t\t\t\tif (sheetInstance.rules[name].group === cssMediaRule) {\n// \t\t\t\t\t\t\t\t\t\t\treturn `--sxs{--sxs:${[...sheetInstance.rules[name].cache].join(' ')}}${cssText}`\n// \t\t\t\t\t\t\t\t\t\t}\n// \t\t\t\t\t\t\t\t\t}\n//\n// \t\t\t\t\t\t\t\t\treturn cssMediaRule.cssRules.length ? `${lastRuleCssText}${cssText}` : ''\n// \t\t\t\t\t\t\t\t}\n//\n// \t\t\t\t\t\t\t\treturn cssText\n// \t\t\t\t\t\t\t})\n// \t\t\t\t\t\t\t.join('')\n// \t\t\t\t\t}\n// \t\t\t\t}\n// \t\t\t}\n// \t\t}\n//\n// \t}\n//\n// }\n\nexport type WeaverseType = {\n\t[key: string]: any\n\tappUrl?: string,\n\tprojectKey?: string,\n\tprojectData?: ProjectDataType\n}\n\nexport class Weaverse {\n\telementInstances = new Map<string, any>()\n\titemInstances = new Map<string | number, WeaverseItemStore>()\n\tappUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n\tprojectKey: string = ''\n\tprojectData: ProjectDataType = {\n\t\titems: []\n\t}\n\tlisteners: Set<any> = new Set()\n\tisEditor = false\n\tcurrentFrameSubscription: any\n\n\tconstructor({appUrl, projectKey, projectData}: WeaverseType = {}) {\n\t\tthis.appUrl = appUrl || this.appUrl\n\t\tthis.projectKey = projectKey || this.projectKey\n\t\tprojectData && (this.projectData = projectData)\n\t\tthis.init()\n\t}\n\n\tregisterElement(name: string, element: any) {\n\t\tthis.elementInstances.set(name, element)\n\t}\n\n\tinit() {\n\t\tthis.subscribeMessageEvent()\n\t}\n\n\tsubscribe(fn: any) {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe(fn: any) {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate() {\n\t\tthis.listeners.forEach(fn => fn())\n\t\tthis.triggerEditorUpdate()\n\t}\n\n\tfetchProjectData() {\n\t\treturn fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json())\n\t}\n\n\tupdateProjectData() {\n\t\tif (this.projectKey) {\n\t\t\tthis.fetchProjectData().then(data => {\n\t\t\t\tif (data) {\n\t\t\t\t\tthis.projectData = data\n\t\t\t\t\tthis.initItemData()\n\t\t\t\t\tthis.triggerUpdate()\n\t\t\t\t}\n\t\t\t}).catch(err => {\n\t\t\t\tconsole.error(err)\n\t\t\t})\n\t\t}\n\t}\n\n\tsubscribeMessageEvent() {\n\t\tif (typeof this.currentFrameSubscription === 'function') {\n\t\t\tthis.currentFrameSubscription()\n\t\t}\n\t\tisBrowser && window.addEventListener('message', this.handleMessageEvent)\n\t\tthis.currentFrameSubscription = () => {\n\t\t\tisBrowser && window.removeEventListener('message', this.handleMessageEvent)\n\t\t}\n\t\treturn this.currentFrameSubscription\n\t}\n\n\ttriggerEditorUpdate(type = 'weaverse.workspace.init') {\n\t\tif (this.isEditor) {\n\t\t\twindow.top?.postMessage({\n\t\t\t\ttype, payload: {\n\t\t\t\t\tprojectKey: this.projectKey,\n\t\t\t\t\tprojectData: this.projectData\n\t\t\t\t}\n\t\t\t}, '*')\n\t\t}\n\t}\n\n\thandleMessageEvent = (e: MessageEvent) => {\n\t\tif (e.data?.type?.startsWith('weaverse.')) {\n\t\t\tlet type = e.data.type\n\t\t\tswitch (type) {\n\t\t\t\tcase 'weaverse.editor.ready':\n\t\t\t\t\tthis.isEditor = true\n\t\t\t\t\tbreak\n\t\t\t\tcase 'weaverse.editor.update':\n\t\t\t\t\tlet {payload} = e.data\n\t\t\t\t\tlet {itemId, background} = payload\n\t\t\t\t\tlet instance = this.itemInstances.get(itemId)\n\t\t\t\t\tif (instance) {\n\t\t\t\t\t\tinstance.setData({\n\t\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\tbackground\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tinitItemData() {\n\t\tlet data = this.projectData\n\t\tif (data.items) {\n\t\t\tdata.items.forEach(item => {\n\t\t\t\tlet itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n\t\t\t\tthis.itemInstances.set(item.id, itemStore)\n\t\t\t})\n\t\t}\n\t}\n}\n\nexport class WeaverseItemStore {\n\tdata: any = {}\n\tlisteners: Set<any> = new Set()\n\tComponent: any\n\n\tconstructor(itemData: any = {}, weaverse: Weaverse) {\n\t\tthis.data = itemData\n\t\tlet {type} = itemData\n\t\tif (type) {\n\t\t\tthis.Component = weaverse.elementInstances.get(type)\n\t\t}\n\t}\n\n\tsetData = (data: any) => {\n\t\tthis.data = Object.assign(this.data, data)\n\t\tthis.triggerUpdate()\n\t}\n\n\tsubscribe = (fn: any) => {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe = (fn: any) => {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate = () => {\n\t\tthis.listeners.forEach(fn => {\n\t\t\treturn fn(this.data)\n\t\t})\n\t}\n\n\n\n\t// addItem(item: any) {\n\t// \tthis.items.push(item)\n\t// \tthis.triggerUpdate()\n\t// }\n\t//\n\t// removeItem(item: any) {\n\t// \tthis.items = this.items.filter(i => i !== item)\n\t// \tthis.triggerUpdate()\n\t// }\n}","import * as React from 'react'\n\nexport const Button = (props: any) => {\n    let [count, setCount] = React.useState(0)\n    return <button {...props} onClick={() => setCount(count + 1)}>Test Button {count}</button>\n}\n\nButton.defaultProps = {\n    style: {\n        backgroundColor: 'green',\n        borderRadius: '9999px',\n        fontSize: '13px',\n        padding: '10px 15px'\n    },\n    type: 'button',\n    tag: 'button'\n}\nButton.configs = {\n    type: 'button'\n}\n\nexport default Button","import React from 'react'\n\nexport const BaseElement = ({tag = 'div', children, ...props}: any) => {\n    return React.createElement(tag, {\n        ...props\n    }, children)\n}\n\nBaseElement.configs = {\n    type: 'base'\n}\nexport default BaseElement\n","import Button from './button'\nimport BaseElement from './base'\n\nconst elements = {\n\tButton,\n\tBaseElement\n}\nexport default elements","import * as React from 'react'\nimport {useEffect} from 'react'\nimport {Weaverse, WeaverseType} from './core'\nimport Elements from './elements'\n\nlet stitches = require('@stitches/core')\n\nconst createRootContext = (configs: WeaverseType) => {\n  const rootContext = new Weaverse(configs)\n  Object.keys(Elements).forEach(key => {\n    // @ts-ignore\n    Elements[key]?.configs?.type && rootContext.registerElement(Elements[key].configs.type, Elements[key])\n  })\n\n  return rootContext\n}\n\nconst WeaverseRoot = ({context, defaultData}: { context: Weaverse, defaultData: any }) => {\n  let [, setData] = React.useState<any>(context.projectData)\n  useEffect(() => {\n    let handleUpdate = () => {\n      setData(context.projectData)\n    }\n    context.subscribe(handleUpdate)\n    context.updateProjectData()\n\n    return () => {\n      context.unsubscribe(handleUpdate)\n    }\n  }, [])\n  if (!context.projectData?.items?.length && defaultData) {\n    context.projectData = defaultData\n    context.initItemData()\n  }\n  return <RenderItem itemId={0} context={context}/>\n}\n\n\nconst Item = ({itemInstance, elementInstances, context}: any) => {\n  let [data, setData] = React.useState<any>(itemInstance.data)\n  let {id, type, childIds, ...rest} = data\n\n  useEffect(() => {\n    let handleUpdate = (update: any) => {\n      setData({...update})\n    }\n    itemInstance.subscribe(handleUpdate)\n    return () => {\n      itemInstance.unsubscribe(handleUpdate)\n    }\n  }, [])\n  let Component = elementInstances.get(type)\n  if (Component) {\n    return <Component key={id} data-wv-id={id} {...rest}>\n      {Array.isArray(childIds)\n          && childIds.map(childId =>\n              <RenderItem\n                  key={childId}\n                  itemId={childId}\n                  context={context}\n              />\n      )}\n    </Component>\n  }\n  return null\n}\n\n\nconst RenderItem = ({itemId, context}: { itemId: number, context: any }): any => {\n  let {itemInstances, elementInstances} = context\n  let itemInstance = itemInstances.get(itemId)\n  if (itemInstance) {\n    return <Item itemInstance={itemInstance} elementInstances={elementInstances} context={context}/>\n  }\n  return <></>\n}\n\nexport {createRootContext, WeaverseRoot}\n"],"names":["isReactNative","navigator","product","isBrowser","window","Weaverse","appUrl","projectKey","projectData","Map","items","Set","e","data","_e$data","type","_e$data$type","startsWith","_this","isEditor","payload","background","instance","itemInstances","get","itemId","setData","style","this","init","registerElement","name","element","elementInstances","set","subscribeMessageEvent","subscribe","fn","listeners","add","unsubscribe","triggerUpdate","forEach","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","updateProjectData","_this2","initItemData","err","console","error","currentFrameSubscription","addEventListener","handleMessageEvent","removeEventListener","_this3","top","postMessage","item","itemStore","_this4","id","WeaverseItemStore","itemData","weaverse","_this5","Object","assign","Component","Button","props","React","count","setCount","onClick","defaultProps","backgroundColor","borderRadius","fontSize","padding","tag","configs","BaseElement","children","createElement","elements","Item","itemInstance","context","childIds","rest","useEffect","handleUpdate","update","key","Array","isArray","map","childId","RenderItem","defaultData","_context$projectData","_context$projectData$","length","rootContext","keys","Elements"],"mappings":"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"}

package/dist/sdk-react.esm.js

@@ -1,6 +1,5 @@
-import { useEffect, useState, createElement, Fragment } from 'react';
+import React__default, { useState, createElement, useEffect, Fragment } from 'react';
 import fetch from 'isomorphic-unfetch';
-import Elements from '@weaverse/elements';
 
 function _extends() {
   _extends = Object.assign || function (target) {
@@ -92,7 +91,6 @@ var Weaverse = /*#__PURE__*/function () {
     this.projectKey = projectKey || this.projectKey;
     projectData && (this.projectData = projectData);
     this.init();
-    console.log('process.env.NODE_ENV', process.env.NODE_ENV);
   }
 
   var _proto = Weaverse.prototype;
@@ -102,14 +100,6 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.init = function init() {
-    var _this2 = this;
-
-    Object.keys(Elements).forEach(function (key) {
-      var _Elements$key, _Elements$key$configs;
-
-      // @ts-ignore
-      ((_Elements$key = Elements[key]) == null ? void 0 : (_Elements$key$configs = _Elements$key.configs) == null ? void 0 : _Elements$key$configs.type) && _this2.registerElement(Elements[key].configs.type, Elements[key]);
-    });
     this.subscribeMessageEvent();
   };
 
@@ -135,16 +125,16 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.updateProjectData = function updateProjectData() {
-    var _this3 = this;
+    var _this2 = this;
 
     if (this.projectKey) {
       this.fetchProjectData().then(function (data) {
         if (data) {
-          _this3.projectData = data;
+          _this2.projectData = data;
 
-          _this3.initItemData();
+          _this2.initItemData();
 
-          _this3.triggerUpdate();
+          _this2.triggerUpdate();
         }
       })["catch"](function (err) {
         console.error(err);
@@ -153,7 +143,7 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.subscribeMessageEvent = function subscribeMessageEvent() {
-    var _this4 = this;
+    var _this3 = this;
 
     if (typeof this.currentFrameSubscription === 'function') {
       this.currentFrameSubscription();
@@ -162,7 +152,7 @@ var Weaverse = /*#__PURE__*/function () {
     isBrowser && window.addEventListener('message', this.handleMessageEvent);
 
     this.currentFrameSubscription = function () {
-      isBrowser && window.removeEventListener('message', _this4.handleMessageEvent);
+      isBrowser && window.removeEventListener('message', _this3.handleMessageEvent);
     };
 
     return this.currentFrameSubscription;
@@ -187,15 +177,15 @@ var Weaverse = /*#__PURE__*/function () {
   };
 
   _proto.initItemData = function initItemData() {
-    var _this5 = this;
+    var _this4 = this;
 
     var data = this.projectData;
 
     if (data.items) {
       data.items.forEach(function (item) {
-        var itemStore = _this5.itemInstances.get(item.id) || new WeaverseItemStore(item, _this5);
+        var itemStore = _this4.itemInstances.get(item.id) || new WeaverseItemStore(item, _this4);
 
-        _this5.itemInstances.set(item.id, itemStore);
+        _this4.itemInstances.set(item.id, itemStore);
       });
     }
   };
@@ -203,7 +193,7 @@ var Weaverse = /*#__PURE__*/function () {
   return Weaverse;
 }();
 var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
-  var _this6 = this;
+  var _this5 = this;
 
   if (itemData === void 0) {
     itemData = {};
@@ -213,35 +203,25 @@ var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
   this.listeners = new Set();
 
   this.setData = function (data) {
-    _this6.data = Object.assign(_this6.data, data);
+    _this5.data = Object.assign(_this5.data, data);
 
-    _this6.triggerUpdate();
+    _this5.triggerUpdate();
   };
 
   this.subscribe = function (fn) {
-    _this6.listeners.add(fn);
+    _this5.listeners.add(fn);
   };
 
   this.unsubscribe = function (fn) {
-    _this6.listeners["delete"](fn);
+    _this5.listeners["delete"](fn);
   };
 
   this.triggerUpdate = function () {
-    _this6.listeners.forEach(function (fn) {
-      return fn(_this6.data);
+    _this5.listeners.forEach(function (fn) {
+      return fn(_this5.data);
     });
   };
 
-  this.useSubscription = function (fn) {
-    useEffect(function () {
-      _this6.subscribe(fn);
-
-      return function () {
-        _this6.unsubscribe(fn);
-      };
-    }, []);
-  };
-
   this.data = itemData;
   var _itemData = itemData,
       type = _itemData.type;
@@ -251,7 +231,61 @@ var WeaverseItemStore = function WeaverseItemStore(itemData, weaverse) {
   }
 };
 
-var _excluded = ["id", "type", "childIds"];
+var Button = function Button(props) {
+  var _React$useState = useState(0),
+      count = _React$useState[0],
+      setCount = _React$useState[1];
+
+  return createElement("button", Object.assign({}, props, {
+    onClick: function onClick() {
+      return setCount(count + 1);
+    }
+  }), "Test Button ", count);
+};
+Button.defaultProps = {
+  style: {
+    backgroundColor: 'green',
+    borderRadius: '9999px',
+    fontSize: '13px',
+    padding: '10px 15px'
+  },
+  type: 'button',
+  tag: 'button'
+};
+Button.configs = {
+  type: 'button'
+};
+
+var _excluded = ["tag", "children"];
+var BaseElement = function BaseElement(_ref) {
+  var _ref$tag = _ref.tag,
+      tag = _ref$tag === void 0 ? 'div' : _ref$tag,
+      children = _ref.children,
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return React__default.createElement(tag, _extends({}, props), children);
+};
+BaseElement.configs = {
+  type: 'base'
+};
+
+var elements = {
+  Button: Button,
+  BaseElement: BaseElement
+};
+
+var _excluded$1 = ["id", "type", "childIds"];
+
+var createRootContext = function createRootContext(configs) {
+  var rootContext = new Weaverse(configs);
+  Object.keys(elements).forEach(function (key) {
+    var _Elements$key, _Elements$key$configs;
+
+    // @ts-ignore
+    ((_Elements$key = elements[key]) == null ? void 0 : (_Elements$key$configs = _Elements$key.configs) == null ? void 0 : _Elements$key$configs.type) && rootContext.registerElement(elements[key].configs.type, elements[key]);
+  });
+  return rootContext;
+};
 
 var WeaverseRoot = function WeaverseRoot(_ref) {
   var _context$projectData, _context$projectData$;
@@ -297,13 +331,18 @@ var Item = function Item(_ref2) {
   var id = data.id,
       type = data.type,
       childIds = data.childIds,
-      rest = _objectWithoutPropertiesLoose(data, _excluded);
+      rest = _objectWithoutPropertiesLoose(data, _excluded$1);
 
-  var useSubscription = itemInstance.useSubscription;
-  useSubscription(function (update) {
-    console.log('update', update);
-    setData(_extends({}, update));
-  });
+  useEffect(function () {
+    var handleUpdate = function handleUpdate(update) {
+      setData(_extends({}, update));
+    };
+
+    itemInstance.subscribe(handleUpdate);
+    return function () {
+      itemInstance.unsubscribe(handleUpdate);
+    };
+  }, []);
   var Component = elementInstances.get(type);
 
   if (Component) {
@@ -340,5 +379,5 @@ var RenderItem = function RenderItem(_ref3) {
   return createElement(Fragment, null);
 };
 
-export { Weaverse, WeaverseRoot };
+export { WeaverseRoot, createRootContext };
 //# sourceMappingURL=sdk-react.esm.js.map

package/dist/sdk-react.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"sdk-react.esm.js","sources":["../src/utils/index.ts","../src/core.ts","../src/index.tsx"],"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\nimport fetch from 'isomorphic-unfetch'\nimport Elements from '@weaverse/elements'\nimport {useEffect} from 'react'\nimport {isBrowser} from './utils'\n\n\nexport interface ProjectDataItemType {\n\ttype: string\n\tname: string\n\tid: string | number\n}\n\nexport interface ProjectDataType {\n\titems: ProjectDataItemType[]\n}\n\nexport class Weaverse {\n\telementInstances = new Map<string, any>()\n\titemInstances = new Map<string | number, WeaverseItemStore>()\n\tappUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n\tprojectKey: string = ''\n\tprojectData: ProjectDataType = {\n\t\titems: []\n\t}\n\tlisteners: Set<any> = new Set()\n\tisEditor = false\n\tcurrentFrameSubscription: any\n\n\tconstructor({\n\t\t\t\t\tappUrl,\n\t\t\t\t\tprojectKey,\n\t\t\t\t\tprojectData\n\t\t\t\t}: { appUrl?: string, projectKey?: string, projectData?: ProjectDataType } = {}) {\n\t\tthis.appUrl = appUrl || this.appUrl\n\t\tthis.projectKey = projectKey || this.projectKey\n\t\tprojectData && (this.projectData = projectData)\n\t\tthis.init()\n\t\tconsole.log('process.env.NODE_ENV', process.env.NODE_ENV)\n\t}\n\n\tregisterElement(name: string, element: any) {\n\t\tthis.elementInstances.set(name, element)\n\t}\n\n\tinit() {\n\t\tObject.keys(Elements).forEach(key => {\n\t\t\t// @ts-ignore\n\t\t\tElements[key]?.configs?.type && this.registerElement(Elements[key].configs.type, Elements[key])\n\t\t})\n\t\tthis.subscribeMessageEvent()\n\t}\n\n\tsubscribe(fn: any) {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe(fn: any) {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate() {\n\t\tthis.listeners.forEach(fn => fn())\n\t\tthis.triggerEditorUpdate()\n\t}\n\n\tfetchProjectData() {\n\t\treturn fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json())\n\t}\n\n\tupdateProjectData() {\n\t\tif (this.projectKey) {\n\t\t\tthis.fetchProjectData().then(data => {\n\t\t\t\tif (data) {\n\t\t\t\t\tthis.projectData = data\n\t\t\t\t\tthis.initItemData()\n\t\t\t\t\tthis.triggerUpdate()\n\t\t\t\t}\n\t\t\t}).catch(err => {\n\t\t\t\tconsole.error(err)\n\t\t\t})\n\t\t}\n\t}\n\n\tsubscribeMessageEvent() {\n\t\tif (typeof this.currentFrameSubscription === 'function') {\n\t\t\tthis.currentFrameSubscription()\n\t\t}\n\t\tisBrowser && window.addEventListener('message', this.handleMessageEvent)\n\t\tthis.currentFrameSubscription = () => {\n\t\t\tisBrowser && window.removeEventListener('message', this.handleMessageEvent)\n\t\t}\n\t\treturn this.currentFrameSubscription\n\t}\n\n\ttriggerEditorUpdate(type = 'weaverse.workspace.init') {\n\t\tif (this.isEditor) {\n\t\t\twindow.top?.postMessage({\n\t\t\t\ttype, payload: {\n\t\t\t\t\tprojectKey: this.projectKey,\n\t\t\t\t\tprojectData: this.projectData\n\t\t\t\t}\n\t\t\t}, '*')\n\t\t}\n\t}\n\n\thandleMessageEvent = (e: MessageEvent) => {\n\t\tif (e.data?.type?.startsWith('weaverse.')) {\n\t\t\tlet type = e.data.type\n\t\t\tswitch (type) {\n\t\t\t\tcase 'weaverse.editor.ready':\n\t\t\t\t\tthis.isEditor = true\n\t\t\t\t\tbreak\n\t\t\t\tcase 'weaverse.editor.update':\n\t\t\t\t\tlet {payload} = e.data\n\t\t\t\t\tlet {itemId, background} = payload\n\t\t\t\t\tlet instance = this.itemInstances.get(itemId)\n\t\t\t\t\tif (instance) {\n\t\t\t\t\t\tinstance.setData({\n\t\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\tbackground\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tinitItemData() {\n\t\tlet data = this.projectData\n\t\tif (data.items) {\n\t\t\tdata.items.forEach(item => {\n\t\t\t\tlet itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n\t\t\t\tthis.itemInstances.set(item.id, itemStore)\n\t\t\t})\n\t\t}\n\t}\n}\n\nexport class WeaverseItemStore {\n\tdata: any = {}\n\tlisteners: Set<any> = new Set()\n\tComponent: any\n\n\tconstructor(itemData: any = {}, weaverse: Weaverse) {\n\t\tthis.data = itemData\n\t\tlet {type} = itemData\n\t\tif (type) {\n\t\t\tthis.Component = weaverse.elementInstances.get(type)\n\t\t}\n\t}\n\n\tsetData = (data: any) => {\n\t\tthis.data = Object.assign(this.data, data)\n\t\tthis.triggerUpdate()\n\t}\n\n\tsubscribe = (fn: any) => {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe = (fn: any) => {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate = () => {\n\t\tthis.listeners.forEach(fn => {\n\t\t\treturn fn(this.data)\n\t\t})\n\t}\n\n\tuseSubscription = (fn: any) => {\n\t\tuseEffect(() => {\n\t\t\tthis.subscribe(fn)\n\t\t\treturn () => {\n\t\t\t\tthis.unsubscribe(fn)\n\t\t\t}\n\t\t}, [])\n\t}\n\n\n\t// addItem(item: any) {\n\t// \tthis.items.push(item)\n\t// \tthis.triggerUpdate()\n\t// }\n\t//\n\t// removeItem(item: any) {\n\t// \tthis.items = this.items.filter(i => i !== item)\n\t// \tthis.triggerUpdate()\n\t// }\n}","import * as React from 'react'\nimport {useEffect} from 'react'\nimport {Weaverse} from './core'\n\nconst WeaverseRoot = ({context, defaultData}: { context: Weaverse, defaultData: any }) => {\n  let [, setData] = React.useState<any>(context.projectData)\n  useEffect(() => {\n    let handleUpdate = () => {\n      setData(context.projectData)\n    }\n    context.subscribe(handleUpdate)\n    context.updateProjectData()\n\n    return () => {\n      context.unsubscribe(handleUpdate)\n    }\n  }, [])\n  if (!context.projectData?.items?.length && defaultData) {\n    context.projectData = defaultData\n    context.initItemData()\n  }\n  return <RenderItem itemId={0} context={context}/>\n\n}\n\n\nconst Item = ({itemInstance, elementInstances, context}: any) => {\n  let [data, setData] = React.useState<any>(itemInstance.data)\n  let {id, type, childIds, ...rest} = data\n\n  let {useSubscription} = itemInstance\n  useSubscription((update: any) => {\n    console.log('update', update)\n    setData({...update})\n  })\n  let Component = elementInstances.get(type)\n  if (Component) {\n    return <Component key={id} data-wv-id={id} {...rest}>\n      {Array.isArray(childIds)\n      && childIds.map(childId =>\n          <RenderItem\n              key={childId}\n              itemId={childId}\n              context={context}\n          />\n      )}\n    </Component>\n  }\n  return null\n}\n\nconst RenderItem = ({itemId, context}: { itemId: number, context: any }): any => {\n  let {itemInstances, elementInstances} = context\n  let itemInstance = itemInstances.get(itemId)\n  if (itemInstance) {\n    return <Item itemInstance={itemInstance} elementInstances={elementInstances} context={context}/>\n  }\n  return <></>\n}\n\nexport {Weaverse, WeaverseRoot}\n"],"names":["isReactNative","navigator","product","isBrowser","window","Weaverse","appUrl","projectKey","projectData","Map","process","env","NODE_ENV","items","Set","e","data","type","startsWith","isEditor","payload","itemId","background","instance","itemInstances","get","setData","style","init","console","log","registerElement","name","element","elementInstances","set","Object","keys","Elements","forEach","key","configs","subscribeMessageEvent","subscribe","fn","listeners","add","unsubscribe","triggerUpdate","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","updateProjectData","initItemData","err","error","currentFrameSubscription","addEventListener","handleMessageEvent","removeEventListener","top","postMessage","item","itemStore","id","WeaverseItemStore","itemData","weaverse","assign","useEffect","Component","WeaverseRoot","context","defaultData","React","handleUpdate","length","RenderItem","Item","itemInstance","childIds","rest","useSubscription","update","Array","isArray","map","childId"],"mappings":"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"}
+{"version":3,"file":"sdk-react.esm.js","sources":["../src/utils/index.ts","../src/core.ts","../src/elements/button.tsx","../src/elements/base.tsx","../src/elements/index.ts","../src/index.tsx"],"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\nimport fetch from 'isomorphic-unfetch'\nimport {isBrowser} from './utils'\n\n\nexport interface ProjectDataItemType {\n\ttype: string\n\tname: string\n\tid: string | number\n}\n\nexport interface ProjectDataType {\n\titems: ProjectDataItemType[]\n}\n\n// const isSheetAccessible = (sheet: CSSStyleSheet) => {\n// \tif (sheet.href && !sheet.href.startsWith(location.origin)) {\n// \t\treturn false\n// \t}\n//\n// \ttry {\n// \t\tsheet.cssRules\n// \t\treturn true\n// \t} catch (e) {\n// \t\treturn false\n// \t}\n// }\n\n// export class WeaverseStyle {\n// \tpublic styleSheets: StyleSheetList\n// \tpublic document: Document\n//\n// \tconstructor(root: Document) {\n// \t\tthis.document = root\n// \t\tthis.styleSheets = this.document.styleSheets\n// \t}\n//\n// \t// Create styleSheet instance that work both on client and server side\n// \tcreateSheet = (root?: Document) => {\n// \t\tlet sheetInstance: any = null\n//\n// \t\tconst reset = () => {\n// \t\t\tconst sheets = Object(root).styleSheets || []\n// \t\t\t// iterate all stylesheets until a hydratable stylesheet is found\n// \t\t\tfor (const sheet of sheets) {\n// \t\t\t\tif (!isSheetAccessible(sheet)) continue\n//\n// \t\t\t\tfor (let index = 0, rules = sheet.cssRules; rules[index]; ++index) {\n// \t\t\t\t\t// /** @type {CSSStyleRule} Possible indicator rule. */\n// \t\t\t\t\tconst check = Object(rules[index])\n// \t\t\t\t\tif (check.selectorText && check.selectorText.includes('@media')) {\n// \t\t\t\t\t\tif (!sheetInstance) sheetInstance = {sheet, reset, rules: sheet.cssRules}\n// \t\t\t\t\t\tbreak\n// \t\t\t\t\t}\n//\n// \t\t\t\t}\n//\n// \t\t\t\t// if a hydratable stylesheet is found, stop looking\n// \t\t\t\tif (sheetInstance) break\n// \t\t\t}\n// \t\t\t// if no hydratable stylesheet is found\n// \t\t\tif (!sheetInstance) {\n// \t\t\t\tconst createCSSMediaRule = (sourceCssText: string) => {\n// \t\t\t\t\tlet rule: any = {\n// \t\t\t\t\t\tcssRules: [],\n// \t\t\t\t\t\tinsertRule(cssText: string, index: number) {\n// \t\t\t\t\t\t\tthis.cssRules.splice(index, 0, createCSSMediaRule(cssText))\n// \t\t\t\t\t\t},\n// \t\t\t\t\t\tget cssText() {\n// \t\t\t\t\t\t\treturn sourceCssText === '@media{}' ? `@media{${[].map.call(this.cssRules, (cssRule: any) => cssRule.cssText).join('')}}` : sourceCssText\n// \t\t\t\t\t\t}\n// \t\t\t\t\t}\n// \t\t\t\t\treturn rule\n// \t\t\t\t}\n//\n// \t\t\t\tsheetInstance = {\n// \t\t\t\t\tsheet: root ? (root.head || root).appendChild(root.createElement('style')).sheet : createCSSMediaRule(''),\n// \t\t\t\t\trules: {},\n// \t\t\t\t\treset,\n// \t\t\t\t\ttoString() {\n// \t\t\t\t\t\tconst {cssRules} = sheetInstance.sheet\n// \t\t\t\t\t\treturn [].map\n// \t\t\t\t\t\t\t.call(cssRules, (cssMediaRule: CSSMediaRule, cssRuleIndex) => {\n// \t\t\t\t\t\t\t\tconst {cssText} = cssMediaRule\n//\n// \t\t\t\t\t\t\t\tlet lastRuleCssText = ''\n// \t\t\t\t\t\t\t\tif (cssRules[cssRuleIndex - 1]) {\n// \t\t\t\t\t\t\t\t\tif (!cssMediaRule.cssRules.length) return ''\n//\n// \t\t\t\t\t\t\t\t\tfor (const name in sheetInstance.rules) {\n// \t\t\t\t\t\t\t\t\t\tif (sheetInstance.rules[name].group === cssMediaRule) {\n// \t\t\t\t\t\t\t\t\t\t\treturn `--sxs{--sxs:${[...sheetInstance.rules[name].cache].join(' ')}}${cssText}`\n// \t\t\t\t\t\t\t\t\t\t}\n// \t\t\t\t\t\t\t\t\t}\n//\n// \t\t\t\t\t\t\t\t\treturn cssMediaRule.cssRules.length ? `${lastRuleCssText}${cssText}` : ''\n// \t\t\t\t\t\t\t\t}\n//\n// \t\t\t\t\t\t\t\treturn cssText\n// \t\t\t\t\t\t\t})\n// \t\t\t\t\t\t\t.join('')\n// \t\t\t\t\t}\n// \t\t\t\t}\n// \t\t\t}\n// \t\t}\n//\n// \t}\n//\n// }\n\nexport type WeaverseType = {\n\t[key: string]: any\n\tappUrl?: string,\n\tprojectKey?: string,\n\tprojectData?: ProjectDataType\n}\n\nexport class Weaverse {\n\telementInstances = new Map<string, any>()\n\titemInstances = new Map<string | number, WeaverseItemStore>()\n\tappUrl: string = process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://weaverse.io'\n\tprojectKey: string = ''\n\tprojectData: ProjectDataType = {\n\t\titems: []\n\t}\n\tlisteners: Set<any> = new Set()\n\tisEditor = false\n\tcurrentFrameSubscription: any\n\n\tconstructor({appUrl, projectKey, projectData}: WeaverseType = {}) {\n\t\tthis.appUrl = appUrl || this.appUrl\n\t\tthis.projectKey = projectKey || this.projectKey\n\t\tprojectData && (this.projectData = projectData)\n\t\tthis.init()\n\t}\n\n\tregisterElement(name: string, element: any) {\n\t\tthis.elementInstances.set(name, element)\n\t}\n\n\tinit() {\n\t\tthis.subscribeMessageEvent()\n\t}\n\n\tsubscribe(fn: any) {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe(fn: any) {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate() {\n\t\tthis.listeners.forEach(fn => fn())\n\t\tthis.triggerEditorUpdate()\n\t}\n\n\tfetchProjectData() {\n\t\treturn fetch(this.appUrl + `/api/public/${this.projectKey}`).then(r => r.json())\n\t}\n\n\tupdateProjectData() {\n\t\tif (this.projectKey) {\n\t\t\tthis.fetchProjectData().then(data => {\n\t\t\t\tif (data) {\n\t\t\t\t\tthis.projectData = data\n\t\t\t\t\tthis.initItemData()\n\t\t\t\t\tthis.triggerUpdate()\n\t\t\t\t}\n\t\t\t}).catch(err => {\n\t\t\t\tconsole.error(err)\n\t\t\t})\n\t\t}\n\t}\n\n\tsubscribeMessageEvent() {\n\t\tif (typeof this.currentFrameSubscription === 'function') {\n\t\t\tthis.currentFrameSubscription()\n\t\t}\n\t\tisBrowser && window.addEventListener('message', this.handleMessageEvent)\n\t\tthis.currentFrameSubscription = () => {\n\t\t\tisBrowser && window.removeEventListener('message', this.handleMessageEvent)\n\t\t}\n\t\treturn this.currentFrameSubscription\n\t}\n\n\ttriggerEditorUpdate(type = 'weaverse.workspace.init') {\n\t\tif (this.isEditor) {\n\t\t\twindow.top?.postMessage({\n\t\t\t\ttype, payload: {\n\t\t\t\t\tprojectKey: this.projectKey,\n\t\t\t\t\tprojectData: this.projectData\n\t\t\t\t}\n\t\t\t}, '*')\n\t\t}\n\t}\n\n\thandleMessageEvent = (e: MessageEvent) => {\n\t\tif (e.data?.type?.startsWith('weaverse.')) {\n\t\t\tlet type = e.data.type\n\t\t\tswitch (type) {\n\t\t\t\tcase 'weaverse.editor.ready':\n\t\t\t\t\tthis.isEditor = true\n\t\t\t\t\tbreak\n\t\t\t\tcase 'weaverse.editor.update':\n\t\t\t\t\tlet {payload} = e.data\n\t\t\t\t\tlet {itemId, background} = payload\n\t\t\t\t\tlet instance = this.itemInstances.get(itemId)\n\t\t\t\t\tif (instance) {\n\t\t\t\t\t\tinstance.setData({\n\t\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\tbackground\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tinitItemData() {\n\t\tlet data = this.projectData\n\t\tif (data.items) {\n\t\t\tdata.items.forEach(item => {\n\t\t\t\tlet itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this)\n\t\t\t\tthis.itemInstances.set(item.id, itemStore)\n\t\t\t})\n\t\t}\n\t}\n}\n\nexport class WeaverseItemStore {\n\tdata: any = {}\n\tlisteners: Set<any> = new Set()\n\tComponent: any\n\n\tconstructor(itemData: any = {}, weaverse: Weaverse) {\n\t\tthis.data = itemData\n\t\tlet {type} = itemData\n\t\tif (type) {\n\t\t\tthis.Component = weaverse.elementInstances.get(type)\n\t\t}\n\t}\n\n\tsetData = (data: any) => {\n\t\tthis.data = Object.assign(this.data, data)\n\t\tthis.triggerUpdate()\n\t}\n\n\tsubscribe = (fn: any) => {\n\t\tthis.listeners.add(fn)\n\t}\n\n\tunsubscribe = (fn: any) => {\n\t\tthis.listeners.delete(fn)\n\t}\n\n\ttriggerUpdate = () => {\n\t\tthis.listeners.forEach(fn => {\n\t\t\treturn fn(this.data)\n\t\t})\n\t}\n\n\n\n\t// addItem(item: any) {\n\t// \tthis.items.push(item)\n\t// \tthis.triggerUpdate()\n\t// }\n\t//\n\t// removeItem(item: any) {\n\t// \tthis.items = this.items.filter(i => i !== item)\n\t// \tthis.triggerUpdate()\n\t// }\n}","import * as React from 'react'\n\nexport const Button = (props: any) => {\n    let [count, setCount] = React.useState(0)\n    return <button {...props} onClick={() => setCount(count + 1)}>Test Button {count}</button>\n}\n\nButton.defaultProps = {\n    style: {\n        backgroundColor: 'green',\n        borderRadius: '9999px',\n        fontSize: '13px',\n        padding: '10px 15px'\n    },\n    type: 'button',\n    tag: 'button'\n}\nButton.configs = {\n    type: 'button'\n}\n\nexport default Button","import React from 'react'\n\nexport const BaseElement = ({tag = 'div', children, ...props}: any) => {\n    return React.createElement(tag, {\n        ...props\n    }, children)\n}\n\nBaseElement.configs = {\n    type: 'base'\n}\nexport default BaseElement\n","import Button from './button'\nimport BaseElement from './base'\n\nconst elements = {\n\tButton,\n\tBaseElement\n}\nexport default elements","import * as React from 'react'\nimport {useEffect} from 'react'\nimport {Weaverse, WeaverseType} from './core'\nimport Elements from './elements'\n\nlet stitches = require('@stitches/core')\n\nconst createRootContext = (configs: WeaverseType) => {\n  const rootContext = new Weaverse(configs)\n  Object.keys(Elements).forEach(key => {\n    // @ts-ignore\n    Elements[key]?.configs?.type && rootContext.registerElement(Elements[key].configs.type, Elements[key])\n  })\n\n  return rootContext\n}\n\nconst WeaverseRoot = ({context, defaultData}: { context: Weaverse, defaultData: any }) => {\n  let [, setData] = React.useState<any>(context.projectData)\n  useEffect(() => {\n    let handleUpdate = () => {\n      setData(context.projectData)\n    }\n    context.subscribe(handleUpdate)\n    context.updateProjectData()\n\n    return () => {\n      context.unsubscribe(handleUpdate)\n    }\n  }, [])\n  if (!context.projectData?.items?.length && defaultData) {\n    context.projectData = defaultData\n    context.initItemData()\n  }\n  return <RenderItem itemId={0} context={context}/>\n}\n\n\nconst Item = ({itemInstance, elementInstances, context}: any) => {\n  let [data, setData] = React.useState<any>(itemInstance.data)\n  let {id, type, childIds, ...rest} = data\n\n  useEffect(() => {\n    let handleUpdate = (update: any) => {\n      setData({...update})\n    }\n    itemInstance.subscribe(handleUpdate)\n    return () => {\n      itemInstance.unsubscribe(handleUpdate)\n    }\n  }, [])\n  let Component = elementInstances.get(type)\n  if (Component) {\n    return <Component key={id} data-wv-id={id} {...rest}>\n      {Array.isArray(childIds)\n          && childIds.map(childId =>\n              <RenderItem\n                  key={childId}\n                  itemId={childId}\n                  context={context}\n              />\n      )}\n    </Component>\n  }\n  return null\n}\n\n\nconst RenderItem = ({itemId, context}: { itemId: number, context: any }): any => {\n  let {itemInstances, elementInstances} = context\n  let itemInstance = itemInstances.get(itemId)\n  if (itemInstance) {\n    return <Item itemInstance={itemInstance} elementInstances={elementInstances} context={context}/>\n  }\n  return <></>\n}\n\nexport {createRootContext, WeaverseRoot}\n"],"names":["isReactNative","navigator","product","isBrowser","window","Weaverse","appUrl","projectKey","projectData","Map","process","env","NODE_ENV","items","Set","e","data","type","startsWith","isEditor","payload","itemId","background","instance","itemInstances","get","setData","style","init","registerElement","name","element","elementInstances","set","subscribeMessageEvent","subscribe","fn","listeners","add","unsubscribe","triggerUpdate","forEach","triggerEditorUpdate","fetchProjectData","fetch","then","r","json","updateProjectData","initItemData","err","console","error","currentFrameSubscription","addEventListener","handleMessageEvent","removeEventListener","top","postMessage","item","itemStore","id","WeaverseItemStore","itemData","weaverse","Object","assign","Component","Button","props","React","count","setCount","onClick","defaultProps","backgroundColor","borderRadius","fontSize","padding","tag","configs","BaseElement","children","createElement","elements","createRootContext","rootContext","keys","Elements","key","WeaverseRoot","context","defaultData","useEffect","handleUpdate","length","RenderItem","Item","itemInstance","childIds","rest","update","Array","isArray","map","childId"],"mappings":"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"}

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.1.6",
+  "version": "0.1.7",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -24,7 +24,6 @@
     "analyze": "size-limit --why"
   },
   "peerDependencies": {
-    "@weaverse/elements": "^0.1.1",
     "react": ">=16"
   },
   "husky": {
@@ -55,7 +54,6 @@
     "@size-limit/preset-small-lib": "^7.0.4",
     "@types/react": "^17.0.37",
     "@types/react-dom": "^17.0.11",
-    "@weaverse/elements": "^0.1.4",
     "husky": "^7.0.4",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
@@ -65,6 +63,7 @@
     "typescript": "^4.5.4"
   },
   "dependencies": {
+    "@stitches/core": "^1.2.6",
     "isomorphic-unfetch": "^3.1.0"
   }
 }

package/src/core.ts

@@ -1,7 +1,5 @@
 // TODO: Implement Weaverse SDK class
 import fetch from 'isomorphic-unfetch'
-import Elements from '@weaverse/elements'
-import {useEffect} from 'react'
 import {isBrowser} from './utils'
 
 
@@ -15,6 +13,108 @@ export interface ProjectDataType {
 	items: ProjectDataItemType[]
 }
 
+// const isSheetAccessible = (sheet: CSSStyleSheet) => {
+// 	if (sheet.href && !sheet.href.startsWith(location.origin)) {
+// 		return false
+// 	}
+//
+// 	try {
+// 		sheet.cssRules
+// 		return true
+// 	} catch (e) {
+// 		return false
+// 	}
+// }
+
+// export class WeaverseStyle {
+// 	public styleSheets: StyleSheetList
+// 	public document: Document
+//
+// 	constructor(root: Document) {
+// 		this.document = root
+// 		this.styleSheets = this.document.styleSheets
+// 	}
+//
+// 	// Create styleSheet instance that work both on client and server side
+// 	createSheet = (root?: Document) => {
+// 		let sheetInstance: any = null
+//
+// 		const reset = () => {
+// 			const sheets = Object(root).styleSheets || []
+// 			// iterate all stylesheets until a hydratable stylesheet is found
+// 			for (const sheet of sheets) {
+// 				if (!isSheetAccessible(sheet)) continue
+//
+// 				for (let index = 0, rules = sheet.cssRules; rules[index]; ++index) {
+// 					// /** @type {CSSStyleRule} Possible indicator rule. */
+// 					const check = Object(rules[index])
+// 					if (check.selectorText && check.selectorText.includes('@media')) {
+// 						if (!sheetInstance) sheetInstance = {sheet, reset, rules: sheet.cssRules}
+// 						break
+// 					}
+//
+// 				}
+//
+// 				// if a hydratable stylesheet is found, stop looking
+// 				if (sheetInstance) break
+// 			}
+// 			// if no hydratable stylesheet is found
+// 			if (!sheetInstance) {
+// 				const createCSSMediaRule = (sourceCssText: string) => {
+// 					let rule: any = {
+// 						cssRules: [],
+// 						insertRule(cssText: string, index: number) {
+// 							this.cssRules.splice(index, 0, createCSSMediaRule(cssText))
+// 						},
+// 						get cssText() {
+// 							return sourceCssText === '@media{}' ? `@media{${[].map.call(this.cssRules, (cssRule: any) => cssRule.cssText).join('')}}` : sourceCssText
+// 						}
+// 					}
+// 					return rule
+// 				}
+//
+// 				sheetInstance = {
+// 					sheet: root ? (root.head || root).appendChild(root.createElement('style')).sheet : createCSSMediaRule(''),
+// 					rules: {},
+// 					reset,
+// 					toString() {
+// 						const {cssRules} = sheetInstance.sheet
+// 						return [].map
+// 							.call(cssRules, (cssMediaRule: CSSMediaRule, cssRuleIndex) => {
+// 								const {cssText} = cssMediaRule
+//
+// 								let lastRuleCssText = ''
+// 								if (cssRules[cssRuleIndex - 1]) {
+// 									if (!cssMediaRule.cssRules.length) return ''
+//
+// 									for (const name in sheetInstance.rules) {
+// 										if (sheetInstance.rules[name].group === cssMediaRule) {
+// 											return `--sxs{--sxs:${[...sheetInstance.rules[name].cache].join(' ')}}${cssText}`
+// 										}
+// 									}
+//
+// 									return cssMediaRule.cssRules.length ? `${lastRuleCssText}${cssText}` : ''
+// 								}
+//
+// 								return cssText
+// 							})
+// 							.join('')
+// 					}
+// 				}
+// 			}
+// 		}
+//
+// 	}
+//
+// }
+
+export type WeaverseType = {
+	[key: string]: any
+	appUrl?: string,
+	projectKey?: string,
+	projectData?: ProjectDataType
+}
+
 export class Weaverse {
 	elementInstances = new Map<string, any>()
 	itemInstances = new Map<string | number, WeaverseItemStore>()
@@ -27,16 +127,11 @@ export class Weaverse {
 	isEditor = false
 	currentFrameSubscription: any
 
-	constructor({
-					appUrl,
-					projectKey,
-					projectData
-				}: { appUrl?: string, projectKey?: string, projectData?: ProjectDataType } = {}) {
+	constructor({appUrl, projectKey, projectData}: WeaverseType = {}) {
 		this.appUrl = appUrl || this.appUrl
 		this.projectKey = projectKey || this.projectKey
 		projectData && (this.projectData = projectData)
 		this.init()
-		console.log('process.env.NODE_ENV', process.env.NODE_ENV)
 	}
 
 	registerElement(name: string, element: any) {
@@ -44,10 +139,6 @@ export class Weaverse {
 	}
 
 	init() {
-		Object.keys(Elements).forEach(key => {
-			// @ts-ignore
-			Elements[key]?.configs?.type && this.registerElement(Elements[key].configs.type, Elements[key])
-		})
 		this.subscribeMessageEvent()
 	}
 
@@ -169,14 +260,6 @@ export class WeaverseItemStore {
 		})
 	}
 
-	useSubscription = (fn: any) => {
-		useEffect(() => {
-			this.subscribe(fn)
-			return () => {
-				this.unsubscribe(fn)
-			}
-		}, [])
-	}
 
 
 	// addItem(item: any) {

package/src/elements/base.tsx

@@ -0,0 +1,12 @@
+import React from 'react'
+
+export const BaseElement = ({tag = 'div', children, ...props}: any) => {
+    return React.createElement(tag, {
+        ...props
+    }, children)
+}
+
+BaseElement.configs = {
+    type: 'base'
+}
+export default BaseElement

package/src/elements/button.tsx

@@ -0,0 +1,22 @@
+import * as React from 'react'
+
+export const Button = (props: any) => {
+    let [count, setCount] = React.useState(0)
+    return <button {...props} onClick={() => setCount(count + 1)}>Test Button {count}</button>
+}
+
+Button.defaultProps = {
+    style: {
+        backgroundColor: 'green',
+        borderRadius: '9999px',
+        fontSize: '13px',
+        padding: '10px 15px'
+    },
+    type: 'button',
+    tag: 'button'
+}
+Button.configs = {
+    type: 'button'
+}
+
+export default Button

package/src/elements/index.ts

@@ -0,0 +1,8 @@
+import Button from './button'
+import BaseElement from './base'
+
+const elements = {
+	Button,
+	BaseElement
+}
+export default elements

package/src/index.tsx

@@ -1,6 +1,19 @@
 import * as React from 'react'
 import {useEffect} from 'react'
-import {Weaverse} from './core'
+import {Weaverse, WeaverseType} from './core'
+import Elements from './elements'
+
+let stitches = require('@stitches/core')
+
+const createRootContext = (configs: WeaverseType) => {
+  const rootContext = new Weaverse(configs)
+  Object.keys(Elements).forEach(key => {
+    // @ts-ignore
+    Elements[key]?.configs?.type && rootContext.registerElement(Elements[key].configs.type, Elements[key])
+  })
+
+  return rootContext
+}
 
 const WeaverseRoot = ({context, defaultData}: { context: Weaverse, defaultData: any }) => {
   let [, setData] = React.useState<any>(context.projectData)
@@ -20,7 +33,6 @@ const WeaverseRoot = ({context, defaultData}: { context: Weaverse, defaultData:
     context.initItemData()
   }
   return <RenderItem itemId={0} context={context}/>
-
 }
 
 
@@ -28,27 +40,32 @@ const Item = ({itemInstance, elementInstances, context}: any) => {
   let [data, setData] = React.useState<any>(itemInstance.data)
   let {id, type, childIds, ...rest} = data
 
-  let {useSubscription} = itemInstance
-  useSubscription((update: any) => {
-    console.log('update', update)
-    setData({...update})
-  })
+  useEffect(() => {
+    let handleUpdate = (update: any) => {
+      setData({...update})
+    }
+    itemInstance.subscribe(handleUpdate)
+    return () => {
+      itemInstance.unsubscribe(handleUpdate)
+    }
+  }, [])
   let Component = elementInstances.get(type)
   if (Component) {
     return <Component key={id} data-wv-id={id} {...rest}>
       {Array.isArray(childIds)
-      && childIds.map(childId =>
-          <RenderItem
-              key={childId}
-              itemId={childId}
-              context={context}
-          />
+          && childIds.map(childId =>
+              <RenderItem
+                  key={childId}
+                  itemId={childId}
+                  context={context}
+              />
       )}
     </Component>
   }
   return null
 }
 
+
 const RenderItem = ({itemId, context}: { itemId: number, context: any }): any => {
   let {itemInstances, elementInstances} = context
   let itemInstance = itemInstances.get(itemId)
@@ -58,4 +75,4 @@ const RenderItem = ({itemId, context}: { itemId: number, context: any }): any =>
   return <></>
 }
 
-export {Weaverse, WeaverseRoot}
+export {createRootContext, WeaverseRoot}