@webiny/website-builder-sdk 6.3.0 → 6.4.0-beta.1
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/BindingsApi.js +29 -36
- package/BindingsApi.js.map +1 -1
- package/BindingsProcessor.js +34 -43
- package/BindingsProcessor.js.map +1 -1
- package/BindingsProcessor.test.js +82 -78
- package/BindingsProcessor.test.js.map +1 -1
- package/BindingsResolver.js +92 -119
- package/BindingsResolver.js.map +1 -1
- package/BindingsResolver.test.js +399 -363
- package/BindingsResolver.test.js.map +1 -1
- package/ComponentInputTraverser.js +28 -49
- package/ComponentInputTraverser.js.map +1 -1
- package/ComponentManifestToAstConverter.js +20 -21
- package/ComponentManifestToAstConverter.js.map +1 -1
- package/ComponentRegistry.js +26 -45
- package/ComponentRegistry.js.map +1 -1
- package/ComponentResolver.js +25 -29
- package/ComponentResolver.js.map +1 -1
- package/ConstraintEvaluator.js +246 -353
- package/ConstraintEvaluator.js.map +1 -1
- package/ConstraintEvaluator.test.js +1616 -1438
- package/ConstraintEvaluator.test.js.map +1 -1
- package/ContentSdk.js +83 -90
- package/ContentSdk.js.map +1 -1
- package/DocumentStore.js +47 -59
- package/DocumentStore.js.map +1 -1
- package/DocumentStoreManager.js +17 -16
- package/DocumentStoreManager.js.map +1 -1
- package/EditingSdk.js +87 -121
- package/EditingSdk.js.map +1 -1
- package/ElementFactory.js +126 -174
- package/ElementFactory.js.map +1 -1
- package/ElementFactory.test.js +234 -263
- package/ElementFactory.test.js.map +1 -1
- package/Environment.js +18 -19
- package/Environment.js.map +1 -1
- package/FunctionConverter.js +8 -7
- package/FunctionConverter.js.map +1 -1
- package/HashObject.js +11 -26
- package/HashObject.js.map +1 -1
- package/HotkeyManager.js +40 -47
- package/HotkeyManager.js.map +1 -1
- package/IBindingsUpdater.js +0 -3
- package/IRedirects.js +0 -3
- package/InheritanceProcessor.js +99 -139
- package/InheritanceProcessor.js.map +1 -1
- package/InheritanceProcessor.test.js +178 -179
- package/InheritanceProcessor.test.js.map +1 -1
- package/InheritedValueResolver.js +15 -20
- package/InheritedValueResolver.js.map +1 -1
- package/InputBindingsProcessor.js +187 -307
- package/InputBindingsProcessor.js.map +1 -1
- package/InputsBindingsProcessor.test.js +334 -315
- package/InputsBindingsProcessor.test.js.map +1 -1
- package/InputsUpdater.js +23 -26
- package/InputsUpdater.js.map +1 -1
- package/LiveSdk.js +12 -13
- package/LiveSdk.js.map +1 -1
- package/Logger.js +9 -8
- package/Logger.js.map +1 -1
- package/MouseTracker.js +77 -83
- package/MouseTracker.js.map +1 -1
- package/NullSdk.js +22 -21
- package/NullSdk.js.map +1 -1
- package/PreviewDocument.js +27 -30
- package/PreviewDocument.js.map +1 -1
- package/PreviewSdk.js +16 -17
- package/PreviewSdk.js.map +1 -1
- package/PreviewViewport.js +51 -63
- package/PreviewViewport.js.map +1 -1
- package/ResizeObserver.js +24 -31
- package/ResizeObserver.js.map +1 -1
- package/StylesBindingsProcessor.js +40 -79
- package/StylesBindingsProcessor.js.map +1 -1
- package/StylesUpdater.js +20 -25
- package/StylesUpdater.js.map +1 -1
- package/Theme.js +28 -25
- package/Theme.js.map +1 -1
- package/ViewportManager.js +89 -101
- package/ViewportManager.js.map +1 -1
- package/constants.js +7 -6
- package/constants.js.map +1 -1
- package/createElement.js +5 -6
- package/createElement.js.map +1 -1
- package/createInput.js +85 -143
- package/createInput.js.map +1 -1
- package/createTheme.js +2 -3
- package/createTheme.js.map +1 -1
- package/dataProviders/ApiClient.js +40 -49
- package/dataProviders/ApiClient.js.map +1 -1
- package/dataProviders/DefaultDataProvider.js +56 -58
- package/dataProviders/DefaultDataProvider.js.map +1 -1
- package/dataProviders/GET_PAGE_BY_ID.js +2 -1
- package/dataProviders/GET_PAGE_BY_ID.js.map +1 -1
- package/dataProviders/GET_PAGE_BY_PATH.js +2 -1
- package/dataProviders/GET_PAGE_BY_PATH.js.map +1 -1
- package/dataProviders/LIST_PUBLISHED_PAGES.js +2 -1
- package/dataProviders/LIST_PUBLISHED_PAGES.js.map +1 -1
- package/dataProviders/NullDataProvider.js +21 -20
- package/dataProviders/NullDataProvider.js.map +1 -1
- package/dataProviders/RedirectsProvider.js +24 -27
- package/dataProviders/RedirectsProvider.js.map +1 -1
- package/defaultBreakpoints.js +23 -22
- package/defaultBreakpoints.js.map +1 -1
- package/documentOperations/$addElementReferenceToParent.js +29 -32
- package/documentOperations/$addElementReferenceToParent.js.map +1 -1
- package/documentOperations/AddElement.js +8 -7
- package/documentOperations/AddElement.js.map +1 -1
- package/documentOperations/AddToParent.js +14 -13
- package/documentOperations/AddToParent.js.map +1 -1
- package/documentOperations/IDocumentOperation.js +0 -3
- package/documentOperations/RemoveElement.js +9 -15
- package/documentOperations/RemoveElement.js.map +1 -1
- package/documentOperations/SetGlobalInputBinding.js +23 -22
- package/documentOperations/SetGlobalInputBinding.js.map +1 -1
- package/documentOperations/SetGlobalStyleBinding.js +23 -23
- package/documentOperations/SetGlobalStyleBinding.js.map +1 -1
- package/documentOperations/SetInputBindingOverride.js +30 -29
- package/documentOperations/SetInputBindingOverride.js.map +1 -1
- package/documentOperations/SetStyleBindingOverride.js +30 -31
- package/documentOperations/SetStyleBindingOverride.js.map +1 -1
- package/documentOperations/index.js +9 -8
- package/documentOperations/index.js.map +1 -1
- package/findMatchingAstNode.js +11 -13
- package/findMatchingAstNode.js.map +1 -1
- package/generateElementId.js +2 -1
- package/generateElementId.js.map +1 -1
- package/headersProvider.js +4 -3
- package/headersProvider.js.map +1 -1
- package/index.js +0 -2
- package/jsonPatch.js +5 -9
- package/jsonPatch.js.map +1 -1
- package/messages.js +12 -11
- package/messages.js.map +1 -1
- package/messenger/MessageOrigin.js +12 -11
- package/messenger/MessageOrigin.js.map +1 -1
- package/messenger/Messenger.js +58 -69
- package/messenger/Messenger.js.map +1 -1
- package/messenger/index.js +0 -2
- package/package.json +5 -5
- package/registerComponentGroup.js +5 -6
- package/registerComponentGroup.js.map +1 -1
- package/types/ShorthandCssProperties.js +0 -3
- package/types/WebsiteBuilderTheme.js +0 -3
- package/types.d.ts +3 -0
- package/types.js +0 -3
- package/IBindingsUpdater.js.map +0 -1
- package/IRedirects.js.map +0 -1
- package/documentOperations/IDocumentOperation.js.map +0 -1
- package/index.js.map +0 -1
- package/messenger/index.js.map +0 -1
- package/types/ShorthandCssProperties.js.map +0 -1
- package/types/WebsiteBuilderTheme.js.map +0 -1
- package/types.js.map +0 -1
package/EditingSdk.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
import { Messenger, MessageOrigin } from "./messenger/index.js";
|
|
2
|
+
import { MessageOrigin, Messenger } from "./messenger/index.js";
|
|
4
3
|
import { logger } from "./Logger.js";
|
|
5
4
|
import { PreviewViewport } from "./PreviewViewport.js";
|
|
6
5
|
import { viewportManager } from "./ViewportManager.js";
|
|
@@ -9,132 +8,99 @@ import { functionConverter } from "./FunctionConverter.js";
|
|
|
9
8
|
import { documentStoreManager } from "./DocumentStoreManager.js";
|
|
10
9
|
import { PreviewDocument } from "./PreviewDocument.js";
|
|
11
10
|
import { hashObject } from "./HashObject.js";
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
11
|
+
class EditingSdk {
|
|
12
|
+
constructor(liveSdk, theme){
|
|
13
|
+
this.positionReportingEnabled = false;
|
|
14
|
+
this.previewViewport = null;
|
|
15
|
+
this.lastBoxesHash = 0;
|
|
16
|
+
this.liveSdk = liveSdk;
|
|
17
|
+
const source = new MessageOrigin(()=>window, window.location.origin);
|
|
18
|
+
const target = new MessageOrigin(()=>window.parent, this.getReferrerOrigin());
|
|
19
|
+
this.previewDocument = PreviewDocument.createFromWindow();
|
|
20
|
+
this.documentStore = documentStoreManager.getStore(this.previewDocument.getId());
|
|
21
|
+
this.messenger = new Messenger(source, target, "wb.editor.*");
|
|
22
|
+
componentRegistry.onRegister((reg)=>{
|
|
23
|
+
this.messenger.send("preview.component.register", reg.component.manifest);
|
|
24
|
+
});
|
|
25
|
+
this.setupListeners();
|
|
26
|
+
this.messenger.send("preview.ready", true);
|
|
27
|
+
if (theme) this.messenger.send("preview.theme", {
|
|
28
|
+
theme
|
|
29
|
+
});
|
|
30
|
+
this.disableLinks();
|
|
32
31
|
}
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
return this.liveSdk.getPage(path);
|
|
32
|
+
async getPage(path) {
|
|
33
|
+
if (!this.previewDocument.matches({
|
|
34
|
+
type: "page",
|
|
35
|
+
path
|
|
36
|
+
})) return this.liveSdk.getPage(path);
|
|
37
|
+
await this.documentStore.waitForDocument();
|
|
38
|
+
return this.documentStore.getDocument();
|
|
41
39
|
}
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
}
|
|
45
|
-
async listPages(options) {
|
|
46
|
-
return this.liveSdk.listPages(options);
|
|
47
|
-
}
|
|
48
|
-
registerComponentGroup(group) {
|
|
49
|
-
this.messenger.send("preview.componentGroup.register", {
|
|
50
|
-
...group,
|
|
51
|
-
filter: group.filter ? functionConverter.serialize(group.filter) : undefined
|
|
52
|
-
});
|
|
53
|
-
}
|
|
54
|
-
getReferrerOrigin() {
|
|
55
|
-
try {
|
|
56
|
-
const searchParams = new URLSearchParams(window.location.search);
|
|
57
|
-
return searchParams.get("wb.referrer");
|
|
58
|
-
} catch {
|
|
59
|
-
return "";
|
|
40
|
+
async listPages(options) {
|
|
41
|
+
return this.liveSdk.listPages(options);
|
|
60
42
|
}
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
43
|
+
registerComponentGroup(group) {
|
|
44
|
+
this.messenger.send("preview.componentGroup.register", {
|
|
45
|
+
...group,
|
|
46
|
+
filter: group.filter ? functionConverter.serialize(group.filter) : void 0
|
|
47
|
+
});
|
|
65
48
|
}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
this.messenger.on("element.set", data => {
|
|
74
|
-
this.documentStore.updateElement(data.id, data.patch);
|
|
75
|
-
});
|
|
76
|
-
this.messenger.on("document.patch", patch => {
|
|
77
|
-
this.documentStore.applyPatch(patch);
|
|
78
|
-
});
|
|
79
|
-
}
|
|
80
|
-
initPositionReporting() {
|
|
81
|
-
if (this.positionReportingEnabled) {
|
|
82
|
-
return;
|
|
49
|
+
getReferrerOrigin() {
|
|
50
|
+
try {
|
|
51
|
+
const searchParams = new URLSearchParams(window.location.search);
|
|
52
|
+
return searchParams.get("wb.referrer");
|
|
53
|
+
} catch {
|
|
54
|
+
return "";
|
|
55
|
+
}
|
|
83
56
|
}
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
this.messenger.send("preview.viewport.change.end");
|
|
97
|
-
}
|
|
98
|
-
});
|
|
99
|
-
|
|
100
|
-
// Enable position reporting by default
|
|
101
|
-
this.positionReportingEnabled = true;
|
|
102
|
-
|
|
103
|
-
// Report positions periodically
|
|
104
|
-
setInterval(() => this.reportBoxes(), 300);
|
|
105
|
-
}
|
|
106
|
-
reportBoxes() {
|
|
107
|
-
if (!this.messenger || !this.previewViewport) {
|
|
108
|
-
logger.warn("No messenger or preview viewport. Skipping position reporting.");
|
|
109
|
-
return;
|
|
57
|
+
setupListeners() {
|
|
58
|
+
if (!this.messenger) return;
|
|
59
|
+
this.messenger.on("document.set", (data)=>{
|
|
60
|
+
this.documentStore.setDocument(data);
|
|
61
|
+
if (!this.positionReportingEnabled) this.initPositionReporting();
|
|
62
|
+
});
|
|
63
|
+
this.messenger.on("element.set", (data)=>{
|
|
64
|
+
this.documentStore.updateElement(data.id, data.patch);
|
|
65
|
+
});
|
|
66
|
+
this.messenger.on("document.patch", (patch)=>{
|
|
67
|
+
this.documentStore.applyPatch(patch);
|
|
68
|
+
});
|
|
110
69
|
}
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
70
|
+
initPositionReporting() {
|
|
71
|
+
if (this.positionReportingEnabled) return;
|
|
72
|
+
this.previewViewport = new PreviewViewport();
|
|
73
|
+
viewportManager.onViewportChangeStart(()=>{
|
|
74
|
+
if (this.messenger) this.messenger.send("preview.viewport.change.start");
|
|
75
|
+
});
|
|
76
|
+
viewportManager.onViewportChangeEnd(()=>{
|
|
77
|
+
if (this.messenger) this.messenger.send("preview.viewport.change.end");
|
|
78
|
+
});
|
|
79
|
+
this.positionReportingEnabled = true;
|
|
80
|
+
setInterval(()=>this.reportBoxes(), 300);
|
|
81
|
+
}
|
|
82
|
+
reportBoxes() {
|
|
83
|
+
if (!this.messenger || !this.previewViewport) return void logger.warn("No messenger or preview viewport. Skipping position reporting.");
|
|
84
|
+
const newBoxes = this.previewViewport.getBoxes();
|
|
85
|
+
const hash = hashObject.hash(newBoxes);
|
|
86
|
+
if (hash === this.lastBoxesHash) return;
|
|
87
|
+
this.lastBoxesHash = hash;
|
|
88
|
+
this.messenger.send("preview.viewport", {
|
|
89
|
+
boxes: this.previewViewport.getBoxes(),
|
|
90
|
+
viewport: this.previewViewport.getViewport()
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
disableLinks() {
|
|
94
|
+
document.addEventListener("click", (event)=>{
|
|
95
|
+
const target = event.target;
|
|
96
|
+
const anchor = target.closest("a");
|
|
97
|
+
if (anchor && anchor.href) {
|
|
98
|
+
event.preventDefault();
|
|
99
|
+
event.stopPropagation();
|
|
100
|
+
}
|
|
101
|
+
}, true);
|
|
115
102
|
}
|
|
116
|
-
this.lastBoxesHash = hash;
|
|
117
|
-
// Send positions to the editor
|
|
118
|
-
this.messenger.send("preview.viewport", {
|
|
119
|
-
boxes: this.previewViewport.getBoxes(),
|
|
120
|
-
viewport: this.previewViewport.getViewport()
|
|
121
|
-
});
|
|
122
|
-
}
|
|
123
|
-
disableLinks() {
|
|
124
|
-
// Intercept link clicks when we're in the editing mode (loaded via iframe from the editor).
|
|
125
|
-
document.addEventListener("click", event => {
|
|
126
|
-
const target = event.target;
|
|
127
|
-
|
|
128
|
-
// Check if the clicked element or any of its ancestors is a link
|
|
129
|
-
const anchor = target.closest("a");
|
|
130
|
-
if (anchor && anchor.href) {
|
|
131
|
-
event.preventDefault();
|
|
132
|
-
event.stopPropagation();
|
|
133
|
-
}
|
|
134
|
-
},
|
|
135
|
-
// https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#usecapture
|
|
136
|
-
true);
|
|
137
|
-
}
|
|
138
103
|
}
|
|
104
|
+
export { EditingSdk };
|
|
139
105
|
|
|
140
106
|
//# sourceMappingURL=EditingSdk.js.map
|
package/EditingSdk.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Messenger","MessageOrigin","logger","PreviewViewport","viewportManager","componentRegistry","functionConverter","documentStoreManager","PreviewDocument","hashObject","EditingSdk","positionReportingEnabled","previewViewport","lastBoxesHash","constructor","liveSdk","theme","source","window","location","origin","target","parent","getReferrerOrigin","previewDocument","createFromWindow","documentStore","getStore","getId","messenger","onRegister","reg","send","component","manifest","setupListeners","disableLinks","getPage","path","matches","type","waitForDocument","getDocument","listPages","options","registerComponentGroup","group","filter","serialize","undefined","searchParams","URLSearchParams","search","get","on","data","setDocument","initPositionReporting","updateElement","id","patch","applyPatch","onViewportChangeStart","onViewportChangeEnd","setInterval","reportBoxes","warn","newBoxes","getBoxes","hash","boxes","viewport","getViewport","document","addEventListener","event","anchor","closest","href","preventDefault","stopPropagation"],"sources":["EditingSdk.ts"],"sourcesContent":["\"use client\";\nimport type {\n ComponentGroup,\n IContentSdk,\n ListPagesOptions,\n ListPagesResult,\n PublicPage\n} from \"./types.js\";\nimport { Messenger, MessageOrigin } from \"./messenger/index.js\";\nimport { logger } from \"./Logger.js\";\nimport { PreviewViewport } from \"./PreviewViewport.js\";\nimport { viewportManager } from \"./ViewportManager.js\";\nimport { componentRegistry } from \"./ComponentRegistry.js\";\nimport { functionConverter } from \"./FunctionConverter.js\";\nimport { documentStoreManager } from \"~/DocumentStoreManager.js\";\nimport type { DocumentStore } from \"~/DocumentStore.js\";\nimport { PreviewDocument } from \"./PreviewDocument.js\";\nimport { hashObject } from \"~/HashObject.js\";\nimport type { WebsiteBuilderTheme } from \"~/types/WebsiteBuilderTheme.js\";\n\nexport class EditingSdk implements IContentSdk {\n public readonly messenger: Messenger;\n private positionReportingEnabled = false;\n private previewViewport: PreviewViewport | null = null;\n private liveSdk: IContentSdk;\n private documentStore: DocumentStore<PublicPage>;\n private previewDocument: PreviewDocument;\n private lastBoxesHash = 0;\n\n constructor(liveSdk: IContentSdk, theme: WebsiteBuilderTheme) {\n this.liveSdk = liveSdk;\n\n const source = new MessageOrigin(() => window, window.location.origin);\n const target = new MessageOrigin(() => window.parent, this.getReferrerOrigin());\n\n this.previewDocument = PreviewDocument.createFromWindow();\n\n this.documentStore = documentStoreManager.getStore<PublicPage>(\n this.previewDocument.getId()\n );\n\n this.messenger = new Messenger(source, target, \"wb.editor.*\");\n\n componentRegistry.onRegister(reg => {\n this.messenger.send(\"preview.component.register\", reg.component.manifest);\n });\n\n this.setupListeners();\n\n this.messenger.send(\"preview.ready\", true);\n\n if (theme) {\n this.messenger.send(\"preview.theme\", { theme });\n }\n\n this.disableLinks();\n }\n\n public async getPage(path: string): Promise<PublicPage | null> {\n if (!this.previewDocument.matches({ type: \"page\", path })) {\n return this.liveSdk.getPage(path);\n }\n\n await this.documentStore.waitForDocument();\n return this.documentStore.getDocument();\n }\n\n public async listPages(options?: ListPagesOptions): Promise<ListPagesResult> {\n return this.liveSdk.listPages(options);\n }\n\n registerComponentGroup(group: ComponentGroup) {\n this.messenger.send(\"preview.componentGroup.register\", {\n ...group,\n filter: group.filter ? functionConverter.serialize(group.filter) : undefined\n });\n }\n\n private getReferrerOrigin(): string {\n try {\n const searchParams = new URLSearchParams(window.location.search);\n return searchParams.get(\"wb.referrer\")!;\n } catch {\n return \"\";\n }\n }\n\n private setupListeners() {\n if (!this.messenger) {\n return;\n }\n\n this.messenger.on(\"document.set\", data => {\n this.documentStore.setDocument(data);\n\n if (!this.positionReportingEnabled) {\n // Initialize position reporting\n this.initPositionReporting();\n }\n });\n\n this.messenger.on(\"element.set\", data => {\n this.documentStore.updateElement(data.id, data.patch);\n });\n\n this.messenger.on(\"document.patch\", patch => {\n this.documentStore.applyPatch(patch);\n });\n }\n\n private initPositionReporting(): void {\n if (this.positionReportingEnabled) {\n return;\n }\n\n // Initialize element positions tracker\n this.previewViewport = new PreviewViewport();\n\n // Add event listeners\n viewportManager.onViewportChangeStart(() => {\n if (this.messenger) {\n this.messenger.send(\"preview.viewport.change.start\");\n }\n });\n\n viewportManager.onViewportChangeEnd(() => {\n if (this.messenger) {\n this.messenger.send(\"preview.viewport.change.end\");\n }\n });\n\n // Enable position reporting by default\n this.positionReportingEnabled = true;\n\n // Report positions periodically\n setInterval(() => this.reportBoxes(), 300);\n }\n\n private reportBoxes(): void {\n if (!this.messenger || !this.previewViewport) {\n logger.warn(\"No messenger or preview viewport. Skipping position reporting.\");\n return;\n }\n\n const newBoxes = this.previewViewport.getBoxes();\n const hash = hashObject.hash(newBoxes);\n if (hash === this.lastBoxesHash) {\n return;\n }\n\n this.lastBoxesHash = hash;\n // Send positions to the editor\n this.messenger.send(\"preview.viewport\", {\n boxes: this.previewViewport.getBoxes(),\n viewport: this.previewViewport.getViewport()\n });\n }\n\n private disableLinks() {\n // Intercept link clicks when we're in the editing mode (loaded via iframe from the editor).\n document.addEventListener(\n \"click\",\n event => {\n const target = event.target as HTMLElement;\n\n // Check if the clicked element or any of its ancestors is a link\n const anchor = target.closest(\"a\");\n\n if (anchor && anchor.href) {\n event.preventDefault();\n event.stopPropagation();\n }\n },\n // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#usecapture\n true\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"EditingSdk.js","sources":["../src/EditingSdk.ts"],"sourcesContent":["\"use client\";\nimport type {\n ComponentGroup,\n IContentSdk,\n ListPagesOptions,\n ListPagesResult,\n PublicPage\n} from \"./types.js\";\nimport { Messenger, MessageOrigin } from \"./messenger/index.js\";\nimport { logger } from \"./Logger.js\";\nimport { PreviewViewport } from \"./PreviewViewport.js\";\nimport { viewportManager } from \"./ViewportManager.js\";\nimport { componentRegistry } from \"./ComponentRegistry.js\";\nimport { functionConverter } from \"./FunctionConverter.js\";\nimport { documentStoreManager } from \"~/DocumentStoreManager.js\";\nimport type { DocumentStore } from \"~/DocumentStore.js\";\nimport { PreviewDocument } from \"./PreviewDocument.js\";\nimport { hashObject } from \"~/HashObject.js\";\nimport type { WebsiteBuilderTheme } from \"~/types/WebsiteBuilderTheme.js\";\n\nexport class EditingSdk implements IContentSdk {\n public readonly messenger: Messenger;\n private positionReportingEnabled = false;\n private previewViewport: PreviewViewport | null = null;\n private liveSdk: IContentSdk;\n private documentStore: DocumentStore<PublicPage>;\n private previewDocument: PreviewDocument;\n private lastBoxesHash = 0;\n\n constructor(liveSdk: IContentSdk, theme: WebsiteBuilderTheme) {\n this.liveSdk = liveSdk;\n\n const source = new MessageOrigin(() => window, window.location.origin);\n const target = new MessageOrigin(() => window.parent, this.getReferrerOrigin());\n\n this.previewDocument = PreviewDocument.createFromWindow();\n\n this.documentStore = documentStoreManager.getStore<PublicPage>(\n this.previewDocument.getId()\n );\n\n this.messenger = new Messenger(source, target, \"wb.editor.*\");\n\n componentRegistry.onRegister(reg => {\n this.messenger.send(\"preview.component.register\", reg.component.manifest);\n });\n\n this.setupListeners();\n\n this.messenger.send(\"preview.ready\", true);\n\n if (theme) {\n this.messenger.send(\"preview.theme\", { theme });\n }\n\n this.disableLinks();\n }\n\n public async getPage(path: string): Promise<PublicPage | null> {\n if (!this.previewDocument.matches({ type: \"page\", path })) {\n return this.liveSdk.getPage(path);\n }\n\n await this.documentStore.waitForDocument();\n return this.documentStore.getDocument();\n }\n\n public async listPages(options?: ListPagesOptions): Promise<ListPagesResult> {\n return this.liveSdk.listPages(options);\n }\n\n registerComponentGroup(group: ComponentGroup) {\n this.messenger.send(\"preview.componentGroup.register\", {\n ...group,\n filter: group.filter ? functionConverter.serialize(group.filter) : undefined\n });\n }\n\n private getReferrerOrigin(): string {\n try {\n const searchParams = new URLSearchParams(window.location.search);\n return searchParams.get(\"wb.referrer\")!;\n } catch {\n return \"\";\n }\n }\n\n private setupListeners() {\n if (!this.messenger) {\n return;\n }\n\n this.messenger.on(\"document.set\", data => {\n this.documentStore.setDocument(data);\n\n if (!this.positionReportingEnabled) {\n // Initialize position reporting\n this.initPositionReporting();\n }\n });\n\n this.messenger.on(\"element.set\", data => {\n this.documentStore.updateElement(data.id, data.patch);\n });\n\n this.messenger.on(\"document.patch\", patch => {\n this.documentStore.applyPatch(patch);\n });\n }\n\n private initPositionReporting(): void {\n if (this.positionReportingEnabled) {\n return;\n }\n\n // Initialize element positions tracker\n this.previewViewport = new PreviewViewport();\n\n // Add event listeners\n viewportManager.onViewportChangeStart(() => {\n if (this.messenger) {\n this.messenger.send(\"preview.viewport.change.start\");\n }\n });\n\n viewportManager.onViewportChangeEnd(() => {\n if (this.messenger) {\n this.messenger.send(\"preview.viewport.change.end\");\n }\n });\n\n // Enable position reporting by default\n this.positionReportingEnabled = true;\n\n // Report positions periodically\n setInterval(() => this.reportBoxes(), 300);\n }\n\n private reportBoxes(): void {\n if (!this.messenger || !this.previewViewport) {\n logger.warn(\"No messenger or preview viewport. Skipping position reporting.\");\n return;\n }\n\n const newBoxes = this.previewViewport.getBoxes();\n const hash = hashObject.hash(newBoxes);\n if (hash === this.lastBoxesHash) {\n return;\n }\n\n this.lastBoxesHash = hash;\n // Send positions to the editor\n this.messenger.send(\"preview.viewport\", {\n boxes: this.previewViewport.getBoxes(),\n viewport: this.previewViewport.getViewport()\n });\n }\n\n private disableLinks() {\n // Intercept link clicks when we're in the editing mode (loaded via iframe from the editor).\n document.addEventListener(\n \"click\",\n event => {\n const target = event.target as HTMLElement;\n\n // Check if the clicked element or any of its ancestors is a link\n const anchor = target.closest(\"a\");\n\n if (anchor && anchor.href) {\n event.preventDefault();\n event.stopPropagation();\n }\n },\n // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#usecapture\n true\n );\n }\n}\n"],"names":["EditingSdk","liveSdk","theme","source","MessageOrigin","window","target","PreviewDocument","documentStoreManager","Messenger","componentRegistry","reg","path","options","group","functionConverter","undefined","searchParams","URLSearchParams","data","patch","PreviewViewport","viewportManager","setInterval","logger","newBoxes","hash","hashObject","document","event","anchor"],"mappings":"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"}
|
package/ElementFactory.js
CHANGED
|
@@ -3,190 +3,142 @@ import { DocumentOperations } from "./documentOperations/index.js";
|
|
|
3
3
|
import { ComponentManifestToAstConverter } from "./ComponentManifestToAstConverter.js";
|
|
4
4
|
import { ComponentInputTraverser } from "./ComponentInputTraverser.js";
|
|
5
5
|
const defaultStyles = {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
};
|
|
9
|
-
const withDefaultStyles = styles => {
|
|
10
|
-
return {
|
|
11
|
-
...defaultStyles,
|
|
12
|
-
...styles
|
|
13
|
-
};
|
|
6
|
+
display: "flex",
|
|
7
|
+
flexDirection: "column"
|
|
14
8
|
};
|
|
9
|
+
const withDefaultStyles = (styles)=>({
|
|
10
|
+
...defaultStyles,
|
|
11
|
+
...styles
|
|
12
|
+
});
|
|
15
13
|
const defaultOperations = {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
return new DocumentOperations.AddToParent(element, index);
|
|
21
|
-
},
|
|
22
|
-
setInputBinding: (elementId, bindingPath, binding) => {
|
|
23
|
-
return new DocumentOperations.SetGlobalInputBinding(elementId, bindingPath, binding);
|
|
24
|
-
},
|
|
25
|
-
setStyleBinding: (elementId, bindingPath, binding) => {
|
|
26
|
-
return new DocumentOperations.SetGlobalStyleBinding(elementId, bindingPath, binding);
|
|
27
|
-
}
|
|
14
|
+
addElement: (element)=>new DocumentOperations.AddElement(element),
|
|
15
|
+
addToParent: (element, index)=>new DocumentOperations.AddToParent(element, index),
|
|
16
|
+
setInputBinding: (elementId, bindingPath, binding)=>new DocumentOperations.SetGlobalInputBinding(elementId, bindingPath, binding),
|
|
17
|
+
setStyleBinding: (elementId, bindingPath, binding)=>new DocumentOperations.SetGlobalStyleBinding(elementId, bindingPath, binding)
|
|
28
18
|
};
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
documentOps.push(...this.generateOperations({
|
|
47
|
-
element,
|
|
48
|
-
inputsAst,
|
|
49
|
-
bindings: {
|
|
50
|
-
inputs: bindings?.inputs ?? componentManifest.defaults?.inputs ?? {},
|
|
51
|
-
styles: withDefaultStyles(bindings?.styles ?? componentManifest.defaults?.styles ?? {}),
|
|
52
|
-
overrides: bindings?.overrides ?? {}
|
|
53
|
-
},
|
|
54
|
-
operations: defaultOperations
|
|
55
|
-
}));
|
|
56
|
-
return {
|
|
57
|
-
element,
|
|
58
|
-
operations: documentOps
|
|
59
|
-
};
|
|
60
|
-
}
|
|
61
|
-
generateOperations({
|
|
62
|
-
element,
|
|
63
|
-
inputsAst,
|
|
64
|
-
bindings,
|
|
65
|
-
operations
|
|
66
|
-
}) {
|
|
67
|
-
const ops = this.generateOperationsFromBindings({
|
|
68
|
-
elementId: element.id,
|
|
69
|
-
inputsAst,
|
|
70
|
-
bindings,
|
|
71
|
-
operations,
|
|
72
|
-
ignoreDefaultValues: false
|
|
73
|
-
});
|
|
74
|
-
if (bindings.overrides) {
|
|
75
|
-
for (const [breakpoint, overrides] of Object.entries(bindings.overrides)) {
|
|
76
|
-
ops.push(...this.generateOperationsFromBindings({
|
|
77
|
-
elementId: element.id,
|
|
78
|
-
inputsAst,
|
|
79
|
-
bindings: {
|
|
80
|
-
inputs: overrides.inputs ?? {},
|
|
81
|
-
styles: overrides.styles ?? {}
|
|
82
|
-
},
|
|
83
|
-
operations: {
|
|
84
|
-
...operations,
|
|
85
|
-
setInputBinding: (elementId, bindingPath, binding) => {
|
|
86
|
-
return new DocumentOperations.SetInputBindingOverride(elementId, bindingPath, binding, breakpoint);
|
|
19
|
+
class ElementFactory {
|
|
20
|
+
constructor(components){
|
|
21
|
+
this.components = components;
|
|
22
|
+
}
|
|
23
|
+
createElementFromComponent({ componentName, parentId, slot, index, bindings }) {
|
|
24
|
+
const { element, componentManifest, inputsAst } = this.createElement(componentName, parentId, slot);
|
|
25
|
+
const documentOps = [
|
|
26
|
+
defaultOperations.addElement(element),
|
|
27
|
+
defaultOperations.addToParent(element, index)
|
|
28
|
+
];
|
|
29
|
+
documentOps.push(...this.generateOperations({
|
|
30
|
+
element,
|
|
31
|
+
inputsAst,
|
|
32
|
+
bindings: {
|
|
33
|
+
inputs: bindings?.inputs ?? componentManifest.defaults?.inputs ?? {},
|
|
34
|
+
styles: withDefaultStyles(bindings?.styles ?? componentManifest.defaults?.styles ?? {}),
|
|
35
|
+
overrides: bindings?.overrides ?? {}
|
|
87
36
|
},
|
|
88
|
-
|
|
89
|
-
return new DocumentOperations.SetStyleBindingOverride(elementId, bindingPath, binding, breakpoint);
|
|
90
|
-
}
|
|
91
|
-
},
|
|
92
|
-
ignoreDefaultValues: true
|
|
37
|
+
operations: defaultOperations
|
|
93
38
|
}));
|
|
94
|
-
|
|
39
|
+
return {
|
|
40
|
+
element,
|
|
41
|
+
operations: documentOps
|
|
42
|
+
};
|
|
95
43
|
}
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
ignoreDefaultValues
|
|
104
|
-
}) {
|
|
105
|
-
const inputData = bindings.inputs;
|
|
106
|
-
const traverser = new ComponentInputTraverser(inputsAst);
|
|
107
|
-
const ops = [];
|
|
108
|
-
traverser.traverse(inputData, (node, path, value) => {
|
|
109
|
-
const isCreateElement = value?.action === "CreateElement";
|
|
110
|
-
const isList = node.list;
|
|
111
|
-
const isObject = node.type === "object";
|
|
112
|
-
if (isCreateElement) {
|
|
113
|
-
const factory = new ElementFactory(this.components);
|
|
114
|
-
const newElement = factory.createElementFromComponent({
|
|
115
|
-
componentName: value.params.component,
|
|
116
|
-
// undefined index = append to end of the slot array
|
|
117
|
-
index: isList ? undefined : 0,
|
|
118
|
-
slot: path,
|
|
119
|
-
parentId: elementId,
|
|
120
|
-
bindings: value.params
|
|
44
|
+
generateOperations({ element, inputsAst, bindings, operations }) {
|
|
45
|
+
const ops = this.generateOperationsFromBindings({
|
|
46
|
+
elementId: element.id,
|
|
47
|
+
inputsAst,
|
|
48
|
+
bindings,
|
|
49
|
+
operations,
|
|
50
|
+
ignoreDefaultValues: false
|
|
121
51
|
});
|
|
122
|
-
const
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
id: generateElementId(),
|
|
136
|
-
static: newElementId,
|
|
137
|
-
type: node.type,
|
|
138
|
-
translatable: node.input.translatable,
|
|
139
|
-
list: node.list
|
|
140
|
-
}));
|
|
141
|
-
}
|
|
142
|
-
} else if (isObject && isList) {
|
|
143
|
-
return;
|
|
144
|
-
} else {
|
|
145
|
-
ops.push(operations.setInputBinding(elementId, path, {
|
|
146
|
-
id: generateElementId(),
|
|
147
|
-
static: ignoreDefaultValues ? undefined : value ?? node.input.defaultValue,
|
|
148
|
-
type: node.type,
|
|
149
|
-
list: node.list,
|
|
150
|
-
translatable: node.input.translatable
|
|
52
|
+
if (bindings.overrides) for (const [breakpoint, overrides] of Object.entries(bindings.overrides))ops.push(...this.generateOperationsFromBindings({
|
|
53
|
+
elementId: element.id,
|
|
54
|
+
inputsAst,
|
|
55
|
+
bindings: {
|
|
56
|
+
inputs: overrides.inputs ?? {},
|
|
57
|
+
styles: overrides.styles ?? {}
|
|
58
|
+
},
|
|
59
|
+
operations: {
|
|
60
|
+
...operations,
|
|
61
|
+
setInputBinding: (elementId, bindingPath, binding)=>new DocumentOperations.SetInputBindingOverride(elementId, bindingPath, binding, breakpoint),
|
|
62
|
+
setStyleBinding: (elementId, bindingPath, binding)=>new DocumentOperations.SetStyleBindingOverride(elementId, bindingPath, binding, breakpoint)
|
|
63
|
+
},
|
|
64
|
+
ignoreDefaultValues: true
|
|
151
65
|
}));
|
|
152
|
-
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
66
|
+
return ops;
|
|
67
|
+
}
|
|
68
|
+
generateOperationsFromBindings({ elementId, inputsAst, bindings, operations, ignoreDefaultValues }) {
|
|
69
|
+
const inputData = bindings.inputs;
|
|
70
|
+
const traverser = new ComponentInputTraverser(inputsAst);
|
|
71
|
+
const ops = [];
|
|
72
|
+
traverser.traverse(inputData, (node, path, value)=>{
|
|
73
|
+
const isCreateElement = value?.action === "CreateElement";
|
|
74
|
+
const isList = node.list;
|
|
75
|
+
const isObject = "object" === node.type;
|
|
76
|
+
if (isCreateElement) {
|
|
77
|
+
const factory = new ElementFactory(this.components);
|
|
78
|
+
const newElement = factory.createElementFromComponent({
|
|
79
|
+
componentName: value.params.component,
|
|
80
|
+
index: isList ? void 0 : 0,
|
|
81
|
+
slot: path,
|
|
82
|
+
parentId: elementId,
|
|
83
|
+
bindings: value.params
|
|
84
|
+
});
|
|
85
|
+
const newElementId = newElement.element.id;
|
|
86
|
+
ops.push(...newElement.operations);
|
|
87
|
+
if (isList) ops.push(operations.setInputBinding(elementId, path, {
|
|
88
|
+
id: generateElementId(),
|
|
89
|
+
type: node.type,
|
|
90
|
+
translatable: node.input.translatable,
|
|
91
|
+
list: node.list
|
|
92
|
+
}));
|
|
93
|
+
else ops.push(operations.setInputBinding(elementId, path, {
|
|
94
|
+
id: generateElementId(),
|
|
95
|
+
static: newElementId,
|
|
96
|
+
type: node.type,
|
|
97
|
+
translatable: node.input.translatable,
|
|
98
|
+
list: node.list
|
|
99
|
+
}));
|
|
100
|
+
} else {
|
|
101
|
+
if (isObject && isList) return;
|
|
102
|
+
ops.push(operations.setInputBinding(elementId, path, {
|
|
103
|
+
id: generateElementId(),
|
|
104
|
+
static: ignoreDefaultValues ? void 0 : value ?? node.input.defaultValue,
|
|
105
|
+
type: node.type,
|
|
106
|
+
list: node.list,
|
|
107
|
+
translatable: node.input.translatable
|
|
108
|
+
}));
|
|
109
|
+
}
|
|
110
|
+
});
|
|
111
|
+
for(const key in bindings.styles)ops.push(operations.setStyleBinding(elementId, key, {
|
|
112
|
+
static: bindings.styles[key]
|
|
113
|
+
}));
|
|
114
|
+
return ops;
|
|
160
115
|
}
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
116
|
+
getComponentManifest(componentName) {
|
|
117
|
+
const manifest = this.components[componentName];
|
|
118
|
+
if (!manifest) throw new Error(`Component "${componentName}" not registered.`);
|
|
119
|
+
return manifest;
|
|
120
|
+
}
|
|
121
|
+
createElement(componentName, parentId, slot) {
|
|
122
|
+
const element = {
|
|
123
|
+
type: "Webiny/Element",
|
|
124
|
+
id: generateElementId(),
|
|
125
|
+
parent: {
|
|
126
|
+
id: parentId,
|
|
127
|
+
slot
|
|
128
|
+
},
|
|
129
|
+
component: {
|
|
130
|
+
name: componentName
|
|
131
|
+
}
|
|
132
|
+
};
|
|
133
|
+
const componentManifest = this.getComponentManifest(componentName);
|
|
134
|
+
const inputsAst = ComponentManifestToAstConverter.convert(componentManifest.inputs ?? []);
|
|
135
|
+
return {
|
|
136
|
+
element,
|
|
137
|
+
inputsAst,
|
|
138
|
+
componentManifest
|
|
139
|
+
};
|
|
167
140
|
}
|
|
168
|
-
return manifest;
|
|
169
|
-
}
|
|
170
|
-
createElement(componentName, parentId, slot) {
|
|
171
|
-
const element = {
|
|
172
|
-
type: "Webiny/Element",
|
|
173
|
-
id: generateElementId(),
|
|
174
|
-
parent: {
|
|
175
|
-
id: parentId,
|
|
176
|
-
slot
|
|
177
|
-
},
|
|
178
|
-
component: {
|
|
179
|
-
name: componentName
|
|
180
|
-
}
|
|
181
|
-
};
|
|
182
|
-
const componentManifest = this.getComponentManifest(componentName);
|
|
183
|
-
const inputsAst = ComponentManifestToAstConverter.convert(componentManifest.inputs ?? []);
|
|
184
|
-
return {
|
|
185
|
-
element,
|
|
186
|
-
inputsAst,
|
|
187
|
-
componentManifest
|
|
188
|
-
};
|
|
189
|
-
}
|
|
190
141
|
}
|
|
142
|
+
export { ElementFactory };
|
|
191
143
|
|
|
192
144
|
//# sourceMappingURL=ElementFactory.js.map
|