@weaverse/core 0.3.4 → 0.4.0
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 +34 -10
- package/dist/index.js +16 -12
- package/dist/index.mjs +16 -12
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,15 +1,29 @@
|
|
|
1
1
|
import Stitches from '@stitches/core/types/stitches';
|
|
2
2
|
|
|
3
|
+
declare type WeaverseElementMap = {
|
|
4
|
+
[key: string]: WeaverseElement;
|
|
5
|
+
};
|
|
3
6
|
declare type WeaverseElement = {
|
|
4
7
|
Component: any;
|
|
5
|
-
schema:
|
|
6
|
-
type: string;
|
|
7
|
-
[key: string]: any;
|
|
8
|
-
};
|
|
8
|
+
schema: WeaverseElementSchema;
|
|
9
9
|
};
|
|
10
|
-
declare type
|
|
11
|
-
|
|
10
|
+
declare type WeaverseElementSchema = {
|
|
11
|
+
title: string;
|
|
12
|
+
type: string;
|
|
13
|
+
settings: WeaverseElementSetting[];
|
|
14
|
+
};
|
|
15
|
+
declare type WeaverseElementSetting = {
|
|
16
|
+
tab: string;
|
|
17
|
+
label: string;
|
|
18
|
+
inspectors: WeaverseElementInspector[];
|
|
19
|
+
};
|
|
20
|
+
declare type WeaverseElementInspector = {
|
|
21
|
+
binding: 'data' | 'style';
|
|
22
|
+
key: string;
|
|
23
|
+
label: string;
|
|
24
|
+
type: InspectorInputType;
|
|
12
25
|
};
|
|
26
|
+
declare type InspectorInputType = "alignment" | "color" | "switch" | "textarea";
|
|
13
27
|
declare global {
|
|
14
28
|
interface Window {
|
|
15
29
|
WeaverseStudioBridge: any;
|
|
@@ -30,6 +44,10 @@ interface ProjectDataType {
|
|
|
30
44
|
items: ProjectDataItemType[];
|
|
31
45
|
rootId: string | number;
|
|
32
46
|
}
|
|
47
|
+
declare type MediaBreakpoints = {
|
|
48
|
+
tablet: string;
|
|
49
|
+
mobile: string;
|
|
50
|
+
};
|
|
33
51
|
declare type WeaverseType = {
|
|
34
52
|
[key: string]: any;
|
|
35
53
|
appUrl?: string;
|
|
@@ -108,20 +126,26 @@ declare class Weaverse {
|
|
|
108
126
|
stitchesInstance: Stitches | any;
|
|
109
127
|
studioBridge?: any;
|
|
110
128
|
static WeaverseItemStore: typeof WeaverseItemStore;
|
|
129
|
+
mediaBreakPoints: {
|
|
130
|
+
desktop: string;
|
|
131
|
+
tablet: string;
|
|
132
|
+
mobile: string;
|
|
133
|
+
};
|
|
111
134
|
/**
|
|
112
135
|
* constructor
|
|
113
136
|
* @param appUrl {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
|
|
114
137
|
* @param projectKey {string} Weaverse project key to access project data via API
|
|
115
138
|
* @param projectData {ProjectDataType} Weaverse project data, by default, user can provide project data via React Component.
|
|
139
|
+
* @param mediaBreakPoints {object} Pass down custom media query breakpoints or just use the default.
|
|
116
140
|
*/
|
|
117
|
-
constructor({ appUrl, projectKey, projectData }?: WeaverseType);
|
|
141
|
+
constructor({ appUrl, projectKey, projectData, mediaBreakPoints }?: WeaverseType);
|
|
118
142
|
/**
|
|
119
143
|
* register the custom React Component to Weaverse, store it into Weaverse.elementInstances
|
|
120
|
-
* @param
|
|
121
|
-
* @param element {React.Component} custom React Component
|
|
144
|
+
* @param element {WeaverseElement} custom React Component
|
|
122
145
|
*/
|
|
123
146
|
registerElement(element: WeaverseElement): void;
|
|
124
147
|
init(): void;
|
|
148
|
+
initStitches: () => void;
|
|
125
149
|
loadStudio(): void;
|
|
126
150
|
subscribe(fn: any): void;
|
|
127
151
|
unsubscribe(fn: any): void;
|
|
@@ -142,4 +166,4 @@ declare const isReactNative: boolean;
|
|
|
142
166
|
declare const isBrowser: boolean;
|
|
143
167
|
declare const isIframe: boolean;
|
|
144
168
|
|
|
145
|
-
export { ProjectDataItemType, ProjectDataType, Weaverse, WeaverseElement, WeaverseElementMap, WeaverseItemStore, WeaverseType, isBrowser, isIframe, isReactNative };
|
|
169
|
+
export { InspectorInputType, MediaBreakpoints, ProjectDataItemType, ProjectDataType, Weaverse, WeaverseElement, WeaverseElementInspector, WeaverseElementMap, WeaverseElementSchema, WeaverseElementSetting, WeaverseItemStore, WeaverseType, isBrowser, isIframe, isReactNative };
|
package/dist/index.js
CHANGED
|
@@ -68,7 +68,7 @@ var WeaverseItemStore = class {
|
|
|
68
68
|
}
|
|
69
69
|
};
|
|
70
70
|
var Weaverse = class {
|
|
71
|
-
constructor({ appUrl, projectKey, projectData } = {}) {
|
|
71
|
+
constructor({ appUrl, projectKey, projectData, mediaBreakPoints } = {}) {
|
|
72
72
|
this.elementInstances = /* @__PURE__ */ new Map();
|
|
73
73
|
this.itemInstances = /* @__PURE__ */ new Map();
|
|
74
74
|
this.appUrl = process.env.NODE_ENV === "development" ? "http://localhost:3000" : "https://weaverse.io";
|
|
@@ -79,8 +79,20 @@ var Weaverse = class {
|
|
|
79
79
|
};
|
|
80
80
|
this.listeners = /* @__PURE__ */ new Set();
|
|
81
81
|
this.isEditor = false;
|
|
82
|
+
this.mediaBreakPoints = {
|
|
83
|
+
desktop: "all",
|
|
84
|
+
tablet: "(max-width: 1023.98px)",
|
|
85
|
+
mobile: "(max-width: 767.98px)"
|
|
86
|
+
};
|
|
87
|
+
this.initStitches = () => {
|
|
88
|
+
this.stitchesInstance = stitches.createStitches({
|
|
89
|
+
prefix: "we",
|
|
90
|
+
media: this.mediaBreakPoints
|
|
91
|
+
});
|
|
92
|
+
};
|
|
82
93
|
this.appUrl = appUrl || this.appUrl;
|
|
83
94
|
this.projectKey = projectKey || this.projectKey;
|
|
95
|
+
this.mediaBreakPoints = mediaBreakPoints || this.mediaBreakPoints;
|
|
84
96
|
projectData && (this.projectData = projectData);
|
|
85
97
|
this.init();
|
|
86
98
|
}
|
|
@@ -93,14 +105,7 @@ var Weaverse = class {
|
|
|
93
105
|
}
|
|
94
106
|
}
|
|
95
107
|
init() {
|
|
96
|
-
this.
|
|
97
|
-
prefix: "we",
|
|
98
|
-
media: {
|
|
99
|
-
bp1: "(min-width: 640px)",
|
|
100
|
-
bp2: "(max-width: 768px)",
|
|
101
|
-
bp3: "(min-width: 1024px)"
|
|
102
|
-
}
|
|
103
|
-
});
|
|
108
|
+
this.initStitches();
|
|
104
109
|
this.loadStudio();
|
|
105
110
|
}
|
|
106
111
|
loadStudio() {
|
|
@@ -108,13 +113,12 @@ var Weaverse = class {
|
|
|
108
113
|
window.addEventListener("message", (e) => {
|
|
109
114
|
var _a;
|
|
110
115
|
if (((_a = e.data) == null ? void 0 : _a.type) === "weaverse.preview.initializeEditor") {
|
|
116
|
+
this.isEditor = true;
|
|
111
117
|
let initStudio = () => {
|
|
112
|
-
|
|
113
|
-
this.studioBridge = new StudioBridge(this);
|
|
118
|
+
this.studioBridge = new window.WeaverseStudioBridge(this);
|
|
114
119
|
this.studioBridge.subscribeMessageEvent();
|
|
115
120
|
this.triggerUpdate();
|
|
116
121
|
};
|
|
117
|
-
this.isEditor = true;
|
|
118
122
|
if (!window.WeaverseStudioBridge) {
|
|
119
123
|
const studioBridgeScript = document.createElement("script");
|
|
120
124
|
studioBridgeScript.src = `${this.appUrl}/assets/studio/studio-bridge.js`;
|
package/dist/index.mjs
CHANGED
|
@@ -36,7 +36,7 @@ var WeaverseItemStore = class {
|
|
|
36
36
|
}
|
|
37
37
|
};
|
|
38
38
|
var Weaverse = class {
|
|
39
|
-
constructor({ appUrl, projectKey, projectData } = {}) {
|
|
39
|
+
constructor({ appUrl, projectKey, projectData, mediaBreakPoints } = {}) {
|
|
40
40
|
this.elementInstances = /* @__PURE__ */ new Map();
|
|
41
41
|
this.itemInstances = /* @__PURE__ */ new Map();
|
|
42
42
|
this.appUrl = process.env.NODE_ENV === "development" ? "http://localhost:3000" : "https://weaverse.io";
|
|
@@ -47,8 +47,20 @@ var Weaverse = class {
|
|
|
47
47
|
};
|
|
48
48
|
this.listeners = /* @__PURE__ */ new Set();
|
|
49
49
|
this.isEditor = false;
|
|
50
|
+
this.mediaBreakPoints = {
|
|
51
|
+
desktop: "all",
|
|
52
|
+
tablet: "(max-width: 1023.98px)",
|
|
53
|
+
mobile: "(max-width: 767.98px)"
|
|
54
|
+
};
|
|
55
|
+
this.initStitches = () => {
|
|
56
|
+
this.stitchesInstance = stitches.createStitches({
|
|
57
|
+
prefix: "we",
|
|
58
|
+
media: this.mediaBreakPoints
|
|
59
|
+
});
|
|
60
|
+
};
|
|
50
61
|
this.appUrl = appUrl || this.appUrl;
|
|
51
62
|
this.projectKey = projectKey || this.projectKey;
|
|
63
|
+
this.mediaBreakPoints = mediaBreakPoints || this.mediaBreakPoints;
|
|
52
64
|
projectData && (this.projectData = projectData);
|
|
53
65
|
this.init();
|
|
54
66
|
}
|
|
@@ -61,14 +73,7 @@ var Weaverse = class {
|
|
|
61
73
|
}
|
|
62
74
|
}
|
|
63
75
|
init() {
|
|
64
|
-
this.
|
|
65
|
-
prefix: "we",
|
|
66
|
-
media: {
|
|
67
|
-
bp1: "(min-width: 640px)",
|
|
68
|
-
bp2: "(max-width: 768px)",
|
|
69
|
-
bp3: "(min-width: 1024px)"
|
|
70
|
-
}
|
|
71
|
-
});
|
|
76
|
+
this.initStitches();
|
|
72
77
|
this.loadStudio();
|
|
73
78
|
}
|
|
74
79
|
loadStudio() {
|
|
@@ -76,13 +81,12 @@ var Weaverse = class {
|
|
|
76
81
|
window.addEventListener("message", (e) => {
|
|
77
82
|
var _a;
|
|
78
83
|
if (((_a = e.data) == null ? void 0 : _a.type) === "weaverse.preview.initializeEditor") {
|
|
84
|
+
this.isEditor = true;
|
|
79
85
|
let initStudio = () => {
|
|
80
|
-
|
|
81
|
-
this.studioBridge = new StudioBridge(this);
|
|
86
|
+
this.studioBridge = new window.WeaverseStudioBridge(this);
|
|
82
87
|
this.studioBridge.subscribeMessageEvent();
|
|
83
88
|
this.triggerUpdate();
|
|
84
89
|
};
|
|
85
|
-
this.isEditor = true;
|
|
86
90
|
if (!window.WeaverseStudioBridge) {
|
|
87
91
|
const studioBridgeScript = document.createElement("script");
|
|
88
92
|
studioBridgeScript.src = `${this.appUrl}/assets/studio/studio-bridge.js`;
|
package/package.json
CHANGED