@weaverse/core 0.3.0 → 0.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -12,6 +12,7 @@ interface ProjectDataItemType {
12
12
  }
13
13
  interface ProjectDataType {
14
14
  items: ProjectDataItemType[];
15
+ rootId: string | number;
15
16
  }
16
17
  declare type WeaverseType = {
17
18
  [key: string]: any;
@@ -19,6 +20,34 @@ declare type WeaverseType = {
19
20
  projectKey?: string;
20
21
  projectData?: ProjectDataType;
21
22
  };
23
+ /**
24
+ * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data
25
+ * @param itemData {ProjectDataItemType} Weaverse item data
26
+ * @param weaverse {Weaverse} Weaverse instance
27
+ * Usage:
28
+ * ```jsx
29
+ * useEffect(() => {
30
+ * let handleUpdate = (update: any) => {
31
+ * setData({...update})
32
+ * }
33
+ * itemInstance.subscribe(handleUpdate)
34
+ * return () => {
35
+ * itemInstance.unsubscribe(handleUpdate)
36
+ * }
37
+ * }, [])
38
+ * ```
39
+ */
40
+ declare class WeaverseItemStore {
41
+ data: any;
42
+ listeners: Set<any>;
43
+ Component: any;
44
+ ref: any;
45
+ constructor(itemData: any, weaverse: Weaverse);
46
+ setData: (data: any) => void;
47
+ subscribe: (fn: any) => void;
48
+ unsubscribe: (fn: any) => void;
49
+ triggerUpdate: () => void;
50
+ }
22
51
  declare class Weaverse {
23
52
  /**
24
53
  * For storing, registering element React component from Weaverse or created by user/developer
@@ -62,6 +91,7 @@ declare class Weaverse {
62
91
  */
63
92
  stitchesInstance: Stitches | any;
64
93
  studioBridge?: any;
94
+ static WeaverseItemStore: typeof WeaverseItemStore;
65
95
  /**
66
96
  * constructor
67
97
  * @param appUrl {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
@@ -82,42 +112,14 @@ declare class Weaverse {
82
112
  triggerUpdate(): void;
83
113
  /**
84
114
  * fetch data from Weaverse API (https://weaverse.io/api/v1/projects/:projectKey)
115
+ * @param fetch {fetch} custom fetch function, pass in custom fetch function if you want to use your own fetch function
85
116
  */
86
- fetchProjectData(): Promise<any>;
117
+ fetchProjectData(fetch?: typeof globalThis.fetch): Promise<any>;
87
118
  /**
88
119
  * fetch and update the project data, then trigger update to re-render the WeaverseRoot
89
120
  */
90
121
  updateProjectData(): void;
91
- triggerEditorUpdate(type?: string): void;
92
- initItemData(): void;
93
- }
94
- /**
95
- * WeaverseItemStore is a store for Weaverse item, it can be used to subscribe/update the item data
96
- * @param itemData {ProjectDataItemType} Weaverse item data
97
- * @param weaverse {Weaverse} Weaverse instance
98
- * Usage:
99
- * ```jsx
100
- * useEffect(() => {
101
- * let handleUpdate = (update: any) => {
102
- * setData({...update})
103
- * }
104
- * itemInstance.subscribe(handleUpdate)
105
- * return () => {
106
- * itemInstance.unsubscribe(handleUpdate)
107
- * }
108
- * }, [])
109
- * ```
110
- */
111
- declare class WeaverseItemStore {
112
- data: any;
113
- listeners: Set<any>;
114
- Component: any;
115
- ref: any;
116
- constructor(itemData: any, weaverse: Weaverse);
117
- setData: (data: any) => void;
118
- subscribe: (fn: any) => void;
119
- unsubscribe: (fn: any) => void;
120
- triggerUpdate: () => void;
122
+ initProjectItemData(): void;
121
123
  }
122
124
 
123
125
  declare const isReactNative: boolean;
package/dist/index.js CHANGED
@@ -5,12 +5,6 @@ var __getOwnPropNames = Object.getOwnPropertyNames;
5
5
  var __getProtoOf = Object.getPrototypeOf;
6
6
  var __hasOwnProp = Object.prototype.hasOwnProperty;
7
7
  var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __esm = (fn, res) => function __init() {
9
- return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
10
- };
11
- var __commonJS = (cb, mod) => function __require() {
12
- return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
13
- };
14
8
  var __export = (target, all) => {
15
9
  for (var name in all)
16
10
  __defProp(target, name, { get: all[name], enumerable: true });
@@ -32,25 +26,6 @@ var __toCommonJS = /* @__PURE__ */ ((cache) => {
32
26
  };
33
27
  })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
34
28
 
35
- // ../../node_modules/tsup/assets/cjs_shims.js
36
- var init_cjs_shims = __esm({
37
- "../../node_modules/tsup/assets/cjs_shims.js"() {
38
- }
39
- });
40
-
41
- // src/utils/fetch.js
42
- var require_fetch = __commonJS({
43
- "src/utils/fetch.js"(exports, module2) {
44
- init_cjs_shims();
45
- function r(m) {
46
- return m && m.default || m;
47
- }
48
- module2.exports = globalThis.fetch = globalThis.fetch || (typeof process == "undefined" ? r(require("unfetch")) : function(url, opts) {
49
- return r(require("node-fetch"))(String(url).replace(/^\/\//g, "https://"), opts);
50
- });
51
- }
52
- });
53
-
54
29
  // src/index.ts
55
30
  var src_exports = {};
56
31
  __export(src_exports, {
@@ -60,20 +35,45 @@ __export(src_exports, {
60
35
  isIframe: () => isIframe,
61
36
  isReactNative: () => isReactNative
62
37
  });
63
- init_cjs_shims();
64
-
65
- // src/core.ts
66
- init_cjs_shims();
67
- var import_fetch = __toESM(require_fetch());
68
38
 
69
39
  // src/utils/index.ts
70
- init_cjs_shims();
71
40
  var isReactNative = typeof navigator === "object" && navigator.product === "ReactNative";
72
41
  var isBrowser = typeof window !== "undefined" && !isReactNative;
73
42
  var isIframe = isBrowser && window.top !== window.self;
74
43
 
75
44
  // src/core.ts
76
45
  var stitches = __toESM(require("@stitches/core"));
46
+ var WeaverseItemStore = class {
47
+ constructor(itemData = {}, weaverse) {
48
+ this.data = {};
49
+ this.listeners = /* @__PURE__ */ new Set();
50
+ this.ref = {
51
+ current: null
52
+ };
53
+ this.setData = (data) => {
54
+ this.data = Object.assign(this.data, data);
55
+ this.triggerUpdate();
56
+ };
57
+ this.subscribe = (fn) => {
58
+ this.listeners.add(fn);
59
+ };
60
+ this.unsubscribe = (fn) => {
61
+ this.listeners.delete(fn);
62
+ };
63
+ this.triggerUpdate = () => {
64
+ this.listeners.forEach((fn) => {
65
+ return fn(this.data);
66
+ });
67
+ };
68
+ this.data = itemData;
69
+ let { type, id } = itemData;
70
+ if (type && id) {
71
+ this.Component = weaverse.elementInstances.get(type);
72
+ weaverse.itemInstances.set(id, this);
73
+ console.log("WeaverseItemStore created", this);
74
+ }
75
+ }
76
+ };
77
77
  var Weaverse = class {
78
78
  constructor({ appUrl, projectKey, projectData } = {}) {
79
79
  this.elementInstances = /* @__PURE__ */ new Map();
@@ -81,7 +81,8 @@ var Weaverse = class {
81
81
  this.appUrl = process.env.NODE_ENV === "development" ? "http://localhost:3000" : "https://weaverse.io";
82
82
  this.projectKey = "";
83
83
  this.projectData = {
84
- items: []
84
+ items: [],
85
+ rootId: 0
85
86
  };
86
87
  this.listeners = /* @__PURE__ */ new Set();
87
88
  this.isEditor = false;
@@ -105,21 +106,25 @@ var Weaverse = class {
105
106
  this.loadStudio();
106
107
  }
107
108
  loadStudio() {
109
+ console.log("loadStudio", { isIframe });
108
110
  if (isIframe) {
109
- let initStudio = () => {
110
- let StudioBridge = window.WeaverseStudioBridge;
111
- this.studioBridge = new StudioBridge(this);
112
- this.studioBridge.subscribeMessageEvent();
113
- this.triggerUpdate();
114
- console.log("studio bridge initialized", this.studioBridge);
115
- };
111
+ console.log("Weaverse SDK is initializing...", isIframe);
116
112
  window.addEventListener("message", (e) => {
117
113
  var _a;
118
- if (((_a = e.data) == null ? void 0 : _a.type) === "weaverse.editor.ready") {
114
+ if (((_a = e.data) == null ? void 0 : _a.type) === "weaverse.preview.initializeEditor") {
115
+ let initStudio = () => {
116
+ let StudioBridge = window.WeaverseStudioBridge;
117
+ this.studioBridge = new StudioBridge(this);
118
+ this.studioBridge.subscribeMessageEvent();
119
+ this.triggerUpdate();
120
+ console.log("studio bridge initialized", this.studioBridge);
121
+ };
122
+ console.log("studio message", e.data);
119
123
  this.isEditor = true;
120
124
  if (!window.WeaverseStudioBridge) {
121
125
  const studioBridgeScript = document.createElement("script");
122
126
  studioBridgeScript.src = `${this.appUrl}/assets/studio/studio-bridge.js`;
127
+ studioBridgeScript.type = "module";
123
128
  studioBridgeScript.onload = initStudio;
124
129
  document.body.appendChild(studioBridgeScript);
125
130
  } else {
@@ -137,17 +142,24 @@ var Weaverse = class {
137
142
  }
138
143
  triggerUpdate() {
139
144
  this.listeners.forEach((fn) => fn());
140
- this.triggerEditorUpdate();
145
+ if (this.isEditor && this.studioBridge) {
146
+ this.studioBridge.sendMessageToEditor("weaverse.editor.updateProject", {
147
+ projectData: this.projectData,
148
+ projectKey: this.projectKey,
149
+ appUrl: this.appUrl
150
+ });
151
+ }
141
152
  }
142
- fetchProjectData() {
143
- return (0, import_fetch.default)(this.appUrl + `/api/public/${this.projectKey}`).then((r) => r.json()).catch(console.error);
153
+ fetchProjectData(fetch = globalThis.fetch) {
154
+ console.log("fetching project data...");
155
+ return fetch(this.appUrl + `/api/public/${this.projectKey}`).then((r) => r.json()).catch(console.error);
144
156
  }
145
157
  updateProjectData() {
146
158
  if (this.projectKey) {
147
159
  this.fetchProjectData().then((data) => {
148
160
  if (data) {
149
161
  this.projectData = data;
150
- this.initItemData();
162
+ this.initProjectItemData();
151
163
  this.triggerUpdate();
152
164
  }
153
165
  }).catch((err) => {
@@ -155,54 +167,20 @@ var Weaverse = class {
155
167
  });
156
168
  }
157
169
  }
158
- triggerEditorUpdate(type = "weaverse.workspace.init") {
159
- if (this.isEditor && this.studioBridge) {
160
- this.studioBridge.sendMessageToEditor(type, {
161
- projectData: this.projectData,
162
- projectKey: this.projectKey,
163
- appUrl: this.appUrl
164
- });
165
- }
166
- }
167
- initItemData() {
170
+ initProjectItemData() {
168
171
  let data = this.projectData;
172
+ console.log("init project data", data);
169
173
  if (data.items) {
170
174
  data.items.forEach((item) => {
171
- let itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this);
172
- this.itemInstances.set(item.id, itemStore);
173
- });
174
- }
175
- }
176
- };
177
- var WeaverseItemStore = class {
178
- constructor(itemData = {}, weaverse) {
179
- this.data = {};
180
- this.listeners = /* @__PURE__ */ new Set();
181
- this.ref = {
182
- current: null
183
- };
184
- this.setData = (data) => {
185
- this.data = Object.assign(this.data, data);
186
- this.triggerUpdate();
187
- };
188
- this.subscribe = (fn) => {
189
- this.listeners.add(fn);
190
- };
191
- this.unsubscribe = (fn) => {
192
- this.listeners.delete(fn);
193
- };
194
- this.triggerUpdate = () => {
195
- this.listeners.forEach((fn) => {
196
- return fn(this.data);
175
+ if (!this.itemInstances.get(item.id)) {
176
+ console.log("init item instance", item);
177
+ new WeaverseItemStore(item, this);
178
+ }
197
179
  });
198
- };
199
- this.data = itemData;
200
- let { type } = itemData;
201
- if (type) {
202
- this.Component = weaverse.elementInstances.get(type);
203
180
  }
204
181
  }
205
182
  };
183
+ Weaverse.WeaverseItemStore = WeaverseItemStore;
206
184
  module.exports = __toCommonJS(src_exports);
207
185
  // Annotate the CommonJS export names for ESM import in node:
208
186
  0 && (module.exports = {
package/dist/index.mjs CHANGED
@@ -1,69 +1,41 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
9
- get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
10
- }) : x)(function(x) {
11
- if (typeof require !== "undefined")
12
- return require.apply(this, arguments);
13
- throw new Error('Dynamic require of "' + x + '" is not supported');
14
- });
15
- var __esm = (fn, res) => function __init() {
16
- return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
17
- };
18
- var __commonJS = (cb, mod) => function __require2() {
19
- return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
20
- };
21
- var __reExport = (target, module, copyDefault, desc) => {
22
- if (module && typeof module === "object" || typeof module === "function") {
23
- for (let key of __getOwnPropNames(module))
24
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
25
- __defProp(target, key, { get: () => module[key], enumerable: !(desc = __getOwnPropDesc(module, key)) || desc.enumerable });
26
- }
27
- return target;
28
- };
29
- var __toESM = (module, isNodeMode) => {
30
- return __reExport(__markAsModule(__defProp(module != null ? __create(__getProtoOf(module)) : {}, "default", !isNodeMode && module && module.__esModule ? { get: () => module.default, enumerable: true } : { value: module, enumerable: true })), module);
31
- };
32
-
33
- // ../../node_modules/tsup/assets/esm_shims.js
34
- var init_esm_shims = __esm({
35
- "../../node_modules/tsup/assets/esm_shims.js"() {
36
- }
37
- });
38
-
39
- // src/utils/fetch.js
40
- var require_fetch = __commonJS({
41
- "src/utils/fetch.js"(exports, module) {
42
- init_esm_shims();
43
- function r(m) {
44
- return m && m.default || m;
45
- }
46
- module.exports = globalThis.fetch = globalThis.fetch || (typeof process == "undefined" ? r(__require("unfetch")) : function(url, opts) {
47
- return r(__require("node-fetch"))(String(url).replace(/^\/\//g, "https://"), opts);
48
- });
49
- }
50
- });
51
-
52
- // src/index.ts
53
- init_esm_shims();
54
-
55
- // src/core.ts
56
- init_esm_shims();
57
- var import_fetch = __toESM(require_fetch());
58
-
59
1
  // src/utils/index.ts
60
- init_esm_shims();
61
2
  var isReactNative = typeof navigator === "object" && navigator.product === "ReactNative";
62
3
  var isBrowser = typeof window !== "undefined" && !isReactNative;
63
4
  var isIframe = isBrowser && window.top !== window.self;
64
5
 
65
6
  // src/core.ts
66
7
  import * as stitches from "@stitches/core";
8
+ var WeaverseItemStore = class {
9
+ constructor(itemData = {}, weaverse) {
10
+ this.data = {};
11
+ this.listeners = /* @__PURE__ */ new Set();
12
+ this.ref = {
13
+ current: null
14
+ };
15
+ this.setData = (data) => {
16
+ this.data = Object.assign(this.data, data);
17
+ this.triggerUpdate();
18
+ };
19
+ this.subscribe = (fn) => {
20
+ this.listeners.add(fn);
21
+ };
22
+ this.unsubscribe = (fn) => {
23
+ this.listeners.delete(fn);
24
+ };
25
+ this.triggerUpdate = () => {
26
+ this.listeners.forEach((fn) => {
27
+ return fn(this.data);
28
+ });
29
+ };
30
+ this.data = itemData;
31
+ let { type, id } = itemData;
32
+ if (type && id) {
33
+ this.Component = weaverse.elementInstances.get(type);
34
+ weaverse.itemInstances.set(id, this);
35
+ console.log("WeaverseItemStore created", this);
36
+ }
37
+ }
38
+ };
67
39
  var Weaverse = class {
68
40
  constructor({ appUrl, projectKey, projectData } = {}) {
69
41
  this.elementInstances = /* @__PURE__ */ new Map();
@@ -71,7 +43,8 @@ var Weaverse = class {
71
43
  this.appUrl = process.env.NODE_ENV === "development" ? "http://localhost:3000" : "https://weaverse.io";
72
44
  this.projectKey = "";
73
45
  this.projectData = {
74
- items: []
46
+ items: [],
47
+ rootId: 0
75
48
  };
76
49
  this.listeners = /* @__PURE__ */ new Set();
77
50
  this.isEditor = false;
@@ -95,21 +68,25 @@ var Weaverse = class {
95
68
  this.loadStudio();
96
69
  }
97
70
  loadStudio() {
71
+ console.log("loadStudio", { isIframe });
98
72
  if (isIframe) {
99
- let initStudio = () => {
100
- let StudioBridge = window.WeaverseStudioBridge;
101
- this.studioBridge = new StudioBridge(this);
102
- this.studioBridge.subscribeMessageEvent();
103
- this.triggerUpdate();
104
- console.log("studio bridge initialized", this.studioBridge);
105
- };
73
+ console.log("Weaverse SDK is initializing...", isIframe);
106
74
  window.addEventListener("message", (e) => {
107
75
  var _a;
108
- if (((_a = e.data) == null ? void 0 : _a.type) === "weaverse.editor.ready") {
76
+ if (((_a = e.data) == null ? void 0 : _a.type) === "weaverse.preview.initializeEditor") {
77
+ let initStudio = () => {
78
+ let StudioBridge = window.WeaverseStudioBridge;
79
+ this.studioBridge = new StudioBridge(this);
80
+ this.studioBridge.subscribeMessageEvent();
81
+ this.triggerUpdate();
82
+ console.log("studio bridge initialized", this.studioBridge);
83
+ };
84
+ console.log("studio message", e.data);
109
85
  this.isEditor = true;
110
86
  if (!window.WeaverseStudioBridge) {
111
87
  const studioBridgeScript = document.createElement("script");
112
88
  studioBridgeScript.src = `${this.appUrl}/assets/studio/studio-bridge.js`;
89
+ studioBridgeScript.type = "module";
113
90
  studioBridgeScript.onload = initStudio;
114
91
  document.body.appendChild(studioBridgeScript);
115
92
  } else {
@@ -127,17 +104,24 @@ var Weaverse = class {
127
104
  }
128
105
  triggerUpdate() {
129
106
  this.listeners.forEach((fn) => fn());
130
- this.triggerEditorUpdate();
107
+ if (this.isEditor && this.studioBridge) {
108
+ this.studioBridge.sendMessageToEditor("weaverse.editor.updateProject", {
109
+ projectData: this.projectData,
110
+ projectKey: this.projectKey,
111
+ appUrl: this.appUrl
112
+ });
113
+ }
131
114
  }
132
- fetchProjectData() {
133
- return (0, import_fetch.default)(this.appUrl + `/api/public/${this.projectKey}`).then((r) => r.json()).catch(console.error);
115
+ fetchProjectData(fetch = globalThis.fetch) {
116
+ console.log("fetching project data...");
117
+ return fetch(this.appUrl + `/api/public/${this.projectKey}`).then((r) => r.json()).catch(console.error);
134
118
  }
135
119
  updateProjectData() {
136
120
  if (this.projectKey) {
137
121
  this.fetchProjectData().then((data) => {
138
122
  if (data) {
139
123
  this.projectData = data;
140
- this.initItemData();
124
+ this.initProjectItemData();
141
125
  this.triggerUpdate();
142
126
  }
143
127
  }).catch((err) => {
@@ -145,54 +129,20 @@ var Weaverse = class {
145
129
  });
146
130
  }
147
131
  }
148
- triggerEditorUpdate(type = "weaverse.workspace.init") {
149
- if (this.isEditor && this.studioBridge) {
150
- this.studioBridge.sendMessageToEditor(type, {
151
- projectData: this.projectData,
152
- projectKey: this.projectKey,
153
- appUrl: this.appUrl
154
- });
155
- }
156
- }
157
- initItemData() {
132
+ initProjectItemData() {
158
133
  let data = this.projectData;
134
+ console.log("init project data", data);
159
135
  if (data.items) {
160
136
  data.items.forEach((item) => {
161
- let itemStore = this.itemInstances.get(item.id) || new WeaverseItemStore(item, this);
162
- this.itemInstances.set(item.id, itemStore);
163
- });
164
- }
165
- }
166
- };
167
- var WeaverseItemStore = class {
168
- constructor(itemData = {}, weaverse) {
169
- this.data = {};
170
- this.listeners = /* @__PURE__ */ new Set();
171
- this.ref = {
172
- current: null
173
- };
174
- this.setData = (data) => {
175
- this.data = Object.assign(this.data, data);
176
- this.triggerUpdate();
177
- };
178
- this.subscribe = (fn) => {
179
- this.listeners.add(fn);
180
- };
181
- this.unsubscribe = (fn) => {
182
- this.listeners.delete(fn);
183
- };
184
- this.triggerUpdate = () => {
185
- this.listeners.forEach((fn) => {
186
- return fn(this.data);
137
+ if (!this.itemInstances.get(item.id)) {
138
+ console.log("init item instance", item);
139
+ new WeaverseItemStore(item, this);
140
+ }
187
141
  });
188
- };
189
- this.data = itemData;
190
- let { type } = itemData;
191
- if (type) {
192
- this.Component = weaverse.elementInstances.get(type);
193
142
  }
194
143
  }
195
144
  };
145
+ Weaverse.WeaverseItemStore = WeaverseItemStore;
196
146
  export {
197
147
  Weaverse,
198
148
  WeaverseItemStore,
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "0.3.0",
2
+ "version": "0.3.3",
3
3
  "license": "MIT",
4
4
  "main": "dist/index.js",
5
5
  "typings": "dist/index.d.ts",
@@ -16,15 +16,12 @@
16
16
  "scripts": {
17
17
  "start": "npm run dev",
18
18
  "dev": "tsup src/index.ts --format esm,cjs --dts --outDir dist --watch",
19
- "build": "tsup src/index.ts --format esm,cjs --dts --outDir dist"
19
+ "build": "tsup src/index.ts --format esm,cjs --dts --outDir dist",
20
+ "prepublish": "npm run build"
20
21
  },
21
22
  "name": "@weaverse/core",
22
23
  "author": "Paul",
23
24
  "dependencies": {
24
- "@stitches/core": "^1.2.6"
25
- },
26
- "peerDependencies": {
27
- "node-fetch": "^3",
28
- "unfetch": "^4"
25
+ "@stitches/core": "^1.2.7"
29
26
  }
30
27
  }