@elementor/editor-elements 3.33.0-98 → 3.35.0-324
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.mts +204 -69
- package/dist/index.d.ts +204 -69
- package/dist/index.js +1163 -293
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1149 -291
- package/dist/index.mjs.map +1 -1
- package/package.json +7 -5
- package/src/errors.ts +10 -0
- package/src/hooks/use-element-children.ts +12 -12
- package/src/hooks/use-element-editor-settings.ts +12 -0
- package/src/hooks/use-element-interactions.ts +25 -0
- package/src/hooks/use-element-setting.ts +1 -1
- package/src/hooks/use-selected-element.ts +2 -2
- package/src/index.ts +38 -20
- package/src/mcp/elements-tool.ts +345 -0
- package/src/mcp/handlers/common-style-utils.ts +23 -0
- package/src/mcp/handlers/create-element.ts +96 -0
- package/src/mcp/handlers/create-style.ts +42 -0
- package/src/mcp/handlers/delete-element.ts +17 -0
- package/src/mcp/handlers/delete-style.ts +22 -0
- package/src/mcp/handlers/deselect-element.ts +21 -0
- package/src/mcp/handlers/duplicate-element.ts +22 -0
- package/src/mcp/handlers/get-element-props.ts +28 -0
- package/src/mcp/handlers/get-element-schema.ts +17 -0
- package/src/mcp/handlers/get-selected.ts +5 -0
- package/src/mcp/handlers/get-styles.ts +26 -0
- package/src/mcp/handlers/list-available-types.ts +27 -0
- package/src/mcp/handlers/move-element.ts +30 -0
- package/src/mcp/handlers/select-element.ts +25 -0
- package/src/mcp/handlers/update-props.ts +22 -0
- package/src/mcp/handlers/update-styles.ts +45 -0
- package/src/mcp/index.ts +9 -0
- package/src/sync/delete-element.ts +8 -2
- package/src/sync/drop-element.ts +30 -0
- package/src/sync/duplicate-elements.ts +3 -4
- package/src/sync/get-current-document-container.ts +1 -1
- package/src/sync/get-element-editor-settings.ts +8 -0
- package/src/sync/get-element-interactions.ts +15 -0
- package/src/sync/get-element-label.ts +6 -1
- package/src/sync/get-element-type.ts +28 -0
- package/src/sync/get-elements.ts +1 -1
- package/src/sync/get-widgets-cache.ts +4 -3
- package/src/sync/move-element.ts +45 -0
- package/src/sync/move-elements.ts +127 -0
- package/src/sync/remove-elements.ts +11 -0
- package/src/sync/replace-element.ts +50 -12
- package/src/sync/types.ts +32 -3
- package/src/sync/update-element-editor-settings.ts +28 -0
- package/src/sync/update-element-interactions.ts +32 -0
- package/src/types.ts +16 -1
- package/src/hooks/use-element-type.ts +0 -35
package/dist/index.js
CHANGED
|
@@ -26,39 +26,51 @@ __export(index_exports, {
|
|
|
26
26
|
createElements: () => createElements,
|
|
27
27
|
deleteElement: () => deleteElement,
|
|
28
28
|
deleteElementStyle: () => deleteElementStyle,
|
|
29
|
+
dropElement: () => dropElement,
|
|
29
30
|
duplicateElement: () => duplicateElement,
|
|
30
31
|
duplicateElements: () => duplicateElements,
|
|
31
32
|
generateElementId: () => generateElementId,
|
|
32
33
|
getAnchoredAncestorId: () => getAnchoredAncestorId,
|
|
33
34
|
getAnchoredDescendantId: () => getAnchoredDescendantId,
|
|
34
35
|
getContainer: () => getContainer,
|
|
36
|
+
getCurrentDocumentContainer: () => getCurrentDocumentContainer,
|
|
35
37
|
getCurrentDocumentId: () => getCurrentDocumentId,
|
|
38
|
+
getElementEditorSettings: () => getElementEditorSettings,
|
|
39
|
+
getElementInteractions: () => getElementInteractions,
|
|
36
40
|
getElementLabel: () => getElementLabel,
|
|
37
41
|
getElementSetting: () => getElementSetting,
|
|
38
42
|
getElementSettings: () => getElementSettings,
|
|
39
43
|
getElementStyles: () => getElementStyles,
|
|
44
|
+
getElementType: () => getElementType,
|
|
40
45
|
getElements: () => getElements,
|
|
41
46
|
getLinkInLinkRestriction: () => getLinkInLinkRestriction,
|
|
42
47
|
getSelectedElements: () => getSelectedElements,
|
|
43
48
|
getWidgetsCache: () => getWidgetsCache,
|
|
49
|
+
initElementsMcp: () => initMcp,
|
|
44
50
|
isElementAnchored: () => isElementAnchored,
|
|
51
|
+
moveElement: () => moveElement,
|
|
52
|
+
moveElements: () => moveElements,
|
|
53
|
+
playElementInteractions: () => playElementInteractions,
|
|
45
54
|
removeElements: () => removeElements,
|
|
46
55
|
replaceElement: () => replaceElement,
|
|
47
56
|
selectElement: () => selectElement,
|
|
48
57
|
shouldCreateNewLocalStyle: () => shouldCreateNewLocalStyle,
|
|
49
58
|
styleRerenderEvents: () => styleRerenderEvents,
|
|
59
|
+
updateElementEditorSettings: () => updateElementEditorSettings,
|
|
60
|
+
updateElementInteractions: () => updateElementInteractions,
|
|
50
61
|
updateElementSettings: () => updateElementSettings,
|
|
51
62
|
updateElementStyle: () => updateElementStyle,
|
|
52
63
|
useElementChildren: () => useElementChildren,
|
|
64
|
+
useElementEditorSettings: () => useElementEditorSettings,
|
|
65
|
+
useElementInteractions: () => useElementInteractions,
|
|
53
66
|
useElementSetting: () => useElementSetting,
|
|
54
67
|
useElementSettings: () => useElementSettings,
|
|
55
|
-
useElementType: () => useElementType,
|
|
56
68
|
useParentElement: () => useParentElement,
|
|
57
69
|
useSelectedElement: () => useSelectedElement
|
|
58
70
|
});
|
|
59
71
|
module.exports = __toCommonJS(index_exports);
|
|
60
72
|
|
|
61
|
-
// src/hooks/use-element-
|
|
73
|
+
// src/hooks/use-element-children.ts
|
|
62
74
|
var import_editor_v1_adapters2 = require("@elementor/editor-v1-adapters");
|
|
63
75
|
|
|
64
76
|
// src/sync/get-container.ts
|
|
@@ -76,6 +88,53 @@ var selectElement = (elementId) => {
|
|
|
76
88
|
}
|
|
77
89
|
};
|
|
78
90
|
|
|
91
|
+
// src/hooks/use-element-children.ts
|
|
92
|
+
function useElementChildren(elementId, childrenTypes) {
|
|
93
|
+
return (0, import_editor_v1_adapters2.__privateUseListenTo)(
|
|
94
|
+
[
|
|
95
|
+
(0, import_editor_v1_adapters2.v1ReadyEvent)(),
|
|
96
|
+
(0, import_editor_v1_adapters2.commandEndEvent)("document/elements/create"),
|
|
97
|
+
(0, import_editor_v1_adapters2.commandEndEvent)("document/elements/delete"),
|
|
98
|
+
(0, import_editor_v1_adapters2.commandEndEvent)("document/elements/update"),
|
|
99
|
+
(0, import_editor_v1_adapters2.commandEndEvent)("document/elements/set-settings")
|
|
100
|
+
],
|
|
101
|
+
() => {
|
|
102
|
+
const container = getContainer(elementId);
|
|
103
|
+
const elementChildren = Object.entries(childrenTypes).reduce((acc, [parentType, childType]) => {
|
|
104
|
+
const parent = container?.children?.findRecursive?.(
|
|
105
|
+
({ model }) => model.get("elType") === parentType
|
|
106
|
+
);
|
|
107
|
+
const children = parent?.children ?? [];
|
|
108
|
+
acc[childType] = children.filter(({ model }) => model.get("elType") === childType).map(({ id }) => ({ id }));
|
|
109
|
+
return acc;
|
|
110
|
+
}, {});
|
|
111
|
+
return elementChildren;
|
|
112
|
+
},
|
|
113
|
+
[elementId]
|
|
114
|
+
);
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
// src/hooks/use-element-editor-settings.ts
|
|
118
|
+
var import_editor_v1_adapters3 = require("@elementor/editor-v1-adapters");
|
|
119
|
+
|
|
120
|
+
// src/sync/get-element-editor-settings.ts
|
|
121
|
+
function getElementEditorSettings(elementId) {
|
|
122
|
+
const container = getContainer(elementId);
|
|
123
|
+
return container?.model.get("editor_settings") ?? {};
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
// src/hooks/use-element-editor-settings.ts
|
|
127
|
+
var useElementEditorSettings = (elementId) => {
|
|
128
|
+
return (0, import_editor_v1_adapters3.__privateUseListenTo)(
|
|
129
|
+
(0, import_editor_v1_adapters3.windowEvent)("elementor/element/update_editor_settings"),
|
|
130
|
+
() => getElementEditorSettings(elementId),
|
|
131
|
+
[elementId]
|
|
132
|
+
);
|
|
133
|
+
};
|
|
134
|
+
|
|
135
|
+
// src/hooks/use-element-setting.ts
|
|
136
|
+
var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
|
|
137
|
+
|
|
79
138
|
// src/sync/get-element-setting.ts
|
|
80
139
|
var getElementSetting = (elementId, settingKey) => {
|
|
81
140
|
const container = getContainer(elementId);
|
|
@@ -87,15 +146,15 @@ var getElementSettings = (elementId, settingKey) => {
|
|
|
87
146
|
|
|
88
147
|
// src/hooks/use-element-setting.ts
|
|
89
148
|
var useElementSetting = (elementId, settingKey) => {
|
|
90
|
-
return (0,
|
|
91
|
-
(0,
|
|
149
|
+
return (0, import_editor_v1_adapters4.__privateUseListenTo)(
|
|
150
|
+
(0, import_editor_v1_adapters4.commandEndEvent)("document/elements/set-settings"),
|
|
92
151
|
() => getElementSetting(elementId, settingKey),
|
|
93
152
|
[elementId, settingKey]
|
|
94
153
|
);
|
|
95
154
|
};
|
|
96
155
|
var useElementSettings = (elementId, settingKeys) => {
|
|
97
|
-
return (0,
|
|
98
|
-
(0,
|
|
156
|
+
return (0, import_editor_v1_adapters4.__privateUseListenTo)(
|
|
157
|
+
(0, import_editor_v1_adapters4.commandEndEvent)("document/elements/set-settings"),
|
|
99
158
|
() => settingKeys.reduce((settings, key) => {
|
|
100
159
|
const value = getElementSetting(elementId, key);
|
|
101
160
|
if (value !== null) {
|
|
@@ -103,49 +162,61 @@ var useElementSettings = (elementId, settingKeys) => {
|
|
|
103
162
|
}
|
|
104
163
|
return settings;
|
|
105
164
|
}, {}),
|
|
106
|
-
[elementId,
|
|
165
|
+
[elementId, settingKeys.join(",")]
|
|
107
166
|
);
|
|
108
167
|
};
|
|
109
168
|
|
|
110
|
-
// src/hooks/use-element
|
|
111
|
-
var
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
const extendedWindow = window;
|
|
116
|
-
return extendedWindow?.elementor?.widgetsCache || null;
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
// src/hooks/use-element-type.ts
|
|
120
|
-
function useElementType(type) {
|
|
121
|
-
return (0, import_editor_v1_adapters3.__privateUseListenTo)(
|
|
122
|
-
(0, import_editor_v1_adapters3.commandEndEvent)("editor/documents/load"),
|
|
169
|
+
// src/hooks/use-parent-element.ts
|
|
170
|
+
var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
|
|
171
|
+
function useParentElement(elementId) {
|
|
172
|
+
return (0, import_editor_v1_adapters5.__privateUseListenTo)(
|
|
173
|
+
[(0, import_editor_v1_adapters5.commandEndEvent)("document/elements/create")],
|
|
123
174
|
() => {
|
|
124
|
-
if (!
|
|
125
|
-
return null;
|
|
126
|
-
}
|
|
127
|
-
const widgetsCache = getWidgetsCache();
|
|
128
|
-
const elementType = widgetsCache?.[type];
|
|
129
|
-
if (!elementType?.atomic_controls) {
|
|
175
|
+
if (!elementId) {
|
|
130
176
|
return null;
|
|
131
177
|
}
|
|
132
|
-
|
|
178
|
+
const extendedWindow = window;
|
|
179
|
+
const element = extendedWindow?.elementor?.getContainer?.(elementId);
|
|
180
|
+
if (!element) {
|
|
133
181
|
return null;
|
|
134
182
|
}
|
|
135
|
-
return
|
|
136
|
-
key: type,
|
|
137
|
-
controls: elementType.atomic_controls,
|
|
138
|
-
propsSchema: elementType.atomic_props_schema,
|
|
139
|
-
dependenciesPerTargetMapping: elementType.dependencies_per_target_mapping ?? {},
|
|
140
|
-
title: elementType.title
|
|
141
|
-
};
|
|
183
|
+
return element.parent;
|
|
142
184
|
},
|
|
143
|
-
[
|
|
185
|
+
[elementId]
|
|
144
186
|
);
|
|
145
187
|
}
|
|
146
188
|
|
|
147
189
|
// src/hooks/use-selected-element.ts
|
|
148
|
-
var
|
|
190
|
+
var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
|
|
191
|
+
|
|
192
|
+
// src/sync/get-widgets-cache.ts
|
|
193
|
+
function getWidgetsCache() {
|
|
194
|
+
const extendedWindow = window;
|
|
195
|
+
return extendedWindow?.elementor?.widgetsCache || null;
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
// src/sync/get-element-type.ts
|
|
199
|
+
function getElementType(type) {
|
|
200
|
+
if (!type) {
|
|
201
|
+
return null;
|
|
202
|
+
}
|
|
203
|
+
const widgetsCache = getWidgetsCache();
|
|
204
|
+
const elementType = widgetsCache?.[type];
|
|
205
|
+
if (!elementType?.atomic_controls) {
|
|
206
|
+
return null;
|
|
207
|
+
}
|
|
208
|
+
if (!elementType?.atomic_props_schema) {
|
|
209
|
+
return null;
|
|
210
|
+
}
|
|
211
|
+
return {
|
|
212
|
+
key: type,
|
|
213
|
+
controls: elementType.atomic_controls,
|
|
214
|
+
propsSchema: elementType.atomic_props_schema,
|
|
215
|
+
dependenciesPerTargetMapping: elementType.dependencies_per_target_mapping ?? {},
|
|
216
|
+
title: elementType.title,
|
|
217
|
+
styleStates: elementType.atomic_style_states ?? []
|
|
218
|
+
};
|
|
219
|
+
}
|
|
149
220
|
|
|
150
221
|
// src/sync/get-selected-elements.ts
|
|
151
222
|
function getSelectedElements() {
|
|
@@ -165,72 +236,23 @@ function getSelectedElements() {
|
|
|
165
236
|
|
|
166
237
|
// src/hooks/use-selected-element.ts
|
|
167
238
|
function useSelectedElement() {
|
|
168
|
-
const elements = (0,
|
|
239
|
+
const elements = (0, import_editor_v1_adapters6.__privateUseListenTo)(
|
|
169
240
|
[
|
|
170
|
-
(0,
|
|
171
|
-
(0,
|
|
172
|
-
(0,
|
|
173
|
-
(0,
|
|
241
|
+
(0, import_editor_v1_adapters6.commandEndEvent)("document/elements/select"),
|
|
242
|
+
(0, import_editor_v1_adapters6.commandEndEvent)("document/elements/deselect"),
|
|
243
|
+
(0, import_editor_v1_adapters6.commandEndEvent)("document/elements/select-all"),
|
|
244
|
+
(0, import_editor_v1_adapters6.commandEndEvent)("document/elements/deselect-all")
|
|
174
245
|
],
|
|
175
246
|
getSelectedElements
|
|
176
247
|
);
|
|
177
248
|
const [element] = elements;
|
|
178
|
-
const elementType =
|
|
249
|
+
const elementType = getElementType(element?.type);
|
|
179
250
|
if (elements.length !== 1 || !elementType) {
|
|
180
251
|
return { element: null, elementType: null };
|
|
181
252
|
}
|
|
182
253
|
return { element, elementType };
|
|
183
254
|
}
|
|
184
255
|
|
|
185
|
-
// src/hooks/use-parent-element.ts
|
|
186
|
-
var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
|
|
187
|
-
function useParentElement(elementId) {
|
|
188
|
-
return (0, import_editor_v1_adapters5.__privateUseListenTo)(
|
|
189
|
-
[(0, import_editor_v1_adapters5.commandEndEvent)("document/elements/create")],
|
|
190
|
-
() => {
|
|
191
|
-
if (!elementId) {
|
|
192
|
-
return null;
|
|
193
|
-
}
|
|
194
|
-
const extendedWindow = window;
|
|
195
|
-
const element = extendedWindow?.elementor?.getContainer?.(elementId);
|
|
196
|
-
if (!element) {
|
|
197
|
-
return null;
|
|
198
|
-
}
|
|
199
|
-
return element.parent;
|
|
200
|
-
},
|
|
201
|
-
[elementId]
|
|
202
|
-
);
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
// src/hooks/use-element-children.ts
|
|
206
|
-
var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
|
|
207
|
-
function useElementChildren(elementId, childrenTypes) {
|
|
208
|
-
return (0, import_editor_v1_adapters6.__privateUseListenTo)(
|
|
209
|
-
[
|
|
210
|
-
(0, import_editor_v1_adapters6.v1ReadyEvent)(),
|
|
211
|
-
(0, import_editor_v1_adapters6.commandEndEvent)("document/elements/create"),
|
|
212
|
-
(0, import_editor_v1_adapters6.commandEndEvent)("document/elements/delete"),
|
|
213
|
-
(0, import_editor_v1_adapters6.commandEndEvent)("document/elements/update"),
|
|
214
|
-
(0, import_editor_v1_adapters6.commandEndEvent)("document/elements/set-settings")
|
|
215
|
-
],
|
|
216
|
-
() => {
|
|
217
|
-
const container = getContainer(elementId);
|
|
218
|
-
const elementChildren = childrenTypes.reduce((acc, type) => {
|
|
219
|
-
acc[type] = [];
|
|
220
|
-
return acc;
|
|
221
|
-
}, {});
|
|
222
|
-
container?.children?.forEachRecursive?.(({ model, id }) => {
|
|
223
|
-
const elType = model.get("elType");
|
|
224
|
-
if (elType && elType in elementChildren) {
|
|
225
|
-
elementChildren[elType].push({ id });
|
|
226
|
-
}
|
|
227
|
-
});
|
|
228
|
-
return elementChildren;
|
|
229
|
-
},
|
|
230
|
-
[elementId]
|
|
231
|
-
);
|
|
232
|
-
}
|
|
233
|
-
|
|
234
256
|
// src/sync/create-element.ts
|
|
235
257
|
var import_editor_v1_adapters7 = require("@elementor/editor-v1-adapters");
|
|
236
258
|
function createElement({ containerId, model, options }) {
|
|
@@ -245,41 +267,21 @@ function createElement({ containerId, model, options }) {
|
|
|
245
267
|
});
|
|
246
268
|
}
|
|
247
269
|
|
|
248
|
-
// src/sync/duplicate-element.ts
|
|
249
|
-
function duplicateElement({ elementId, options = {} }) {
|
|
250
|
-
const elementToDuplicate = getContainer(elementId);
|
|
251
|
-
if (!elementToDuplicate) {
|
|
252
|
-
throw new Error(`Element with ID "${elementId}" not found`);
|
|
253
|
-
}
|
|
254
|
-
if (!elementToDuplicate.parent) {
|
|
255
|
-
throw new Error(`Element with ID "${elementId}" has no parent container`);
|
|
256
|
-
}
|
|
257
|
-
const parentContainer = elementToDuplicate.parent;
|
|
258
|
-
const elementModel = elementToDuplicate.model.toJSON();
|
|
259
|
-
const currentIndex = elementToDuplicate.view?._index ?? 0;
|
|
260
|
-
const insertPosition = options.clone !== false ? currentIndex + 1 : void 0;
|
|
261
|
-
return createElement({
|
|
262
|
-
containerId: parentContainer.id,
|
|
263
|
-
model: elementModel,
|
|
264
|
-
options: {
|
|
265
|
-
at: insertPosition,
|
|
266
|
-
...options
|
|
267
|
-
}
|
|
268
|
-
});
|
|
269
|
-
}
|
|
270
|
-
|
|
271
270
|
// src/sync/create-elements.ts
|
|
272
271
|
var import_editor_v1_adapters9 = require("@elementor/editor-v1-adapters");
|
|
273
272
|
var import_i18n = require("@wordpress/i18n");
|
|
274
273
|
|
|
275
274
|
// src/sync/delete-element.ts
|
|
276
275
|
var import_editor_v1_adapters8 = require("@elementor/editor-v1-adapters");
|
|
277
|
-
function deleteElement({
|
|
276
|
+
function deleteElement({
|
|
277
|
+
elementId,
|
|
278
|
+
options = {}
|
|
279
|
+
}) {
|
|
278
280
|
const container = getContainer(elementId);
|
|
279
281
|
if (!container) {
|
|
280
282
|
throw new Error(`Element with ID "${elementId}" not found`);
|
|
281
283
|
}
|
|
282
|
-
(0, import_editor_v1_adapters8.__privateRunCommand)("document/elements/delete", {
|
|
284
|
+
return (0, import_editor_v1_adapters8.__privateRunCommand)("document/elements/delete", {
|
|
283
285
|
container,
|
|
284
286
|
options
|
|
285
287
|
});
|
|
@@ -349,16 +351,52 @@ var createElements = ({
|
|
|
349
351
|
return undoableCreate({ elements });
|
|
350
352
|
};
|
|
351
353
|
|
|
352
|
-
// src/sync/
|
|
354
|
+
// src/sync/drop-element.ts
|
|
353
355
|
var import_editor_v1_adapters10 = require("@elementor/editor-v1-adapters");
|
|
356
|
+
function dropElement({ containerId, model, options }) {
|
|
357
|
+
const container = getContainer(containerId);
|
|
358
|
+
if (!container) {
|
|
359
|
+
throw new Error(`Container with ID "${containerId}" not found`);
|
|
360
|
+
}
|
|
361
|
+
return (0, import_editor_v1_adapters10.__privateRunCommandSync)("preview/drop", {
|
|
362
|
+
container,
|
|
363
|
+
model,
|
|
364
|
+
options
|
|
365
|
+
});
|
|
366
|
+
}
|
|
367
|
+
|
|
368
|
+
// src/sync/duplicate-element.ts
|
|
369
|
+
function duplicateElement({ elementId, options = {} }) {
|
|
370
|
+
const elementToDuplicate = getContainer(elementId);
|
|
371
|
+
if (!elementToDuplicate) {
|
|
372
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
373
|
+
}
|
|
374
|
+
if (!elementToDuplicate.parent) {
|
|
375
|
+
throw new Error(`Element with ID "${elementId}" has no parent container`);
|
|
376
|
+
}
|
|
377
|
+
const parentContainer = elementToDuplicate.parent;
|
|
378
|
+
const elementModel = elementToDuplicate.model.toJSON();
|
|
379
|
+
const currentIndex = elementToDuplicate.view?._index ?? 0;
|
|
380
|
+
const insertPosition = options.clone !== false ? currentIndex + 1 : void 0;
|
|
381
|
+
return createElement({
|
|
382
|
+
containerId: parentContainer.id,
|
|
383
|
+
model: elementModel,
|
|
384
|
+
options: {
|
|
385
|
+
at: insertPosition,
|
|
386
|
+
...options
|
|
387
|
+
}
|
|
388
|
+
});
|
|
389
|
+
}
|
|
390
|
+
|
|
391
|
+
// src/sync/duplicate-elements.ts
|
|
392
|
+
var import_editor_v1_adapters11 = require("@elementor/editor-v1-adapters");
|
|
354
393
|
var import_i18n2 = require("@wordpress/i18n");
|
|
355
394
|
var duplicateElements = ({
|
|
356
395
|
elementIds,
|
|
357
396
|
title,
|
|
358
|
-
subtitle = (0, import_i18n2.__)("Item duplicated", "elementor")
|
|
359
|
-
onCreate
|
|
397
|
+
subtitle = (0, import_i18n2.__)("Item duplicated", "elementor")
|
|
360
398
|
}) => {
|
|
361
|
-
const undoableDuplicate = (0,
|
|
399
|
+
const undoableDuplicate = (0, import_editor_v1_adapters11.undoable)(
|
|
362
400
|
{
|
|
363
401
|
do: ({ elementIds: elementIdsToDuplicate }) => {
|
|
364
402
|
const duplicatedElements = elementIdsToDuplicate.reduce((acc, elementId) => {
|
|
@@ -379,7 +417,7 @@ var duplicateElements = ({
|
|
|
379
417
|
}
|
|
380
418
|
return acc;
|
|
381
419
|
}, []);
|
|
382
|
-
return { duplicatedElements
|
|
420
|
+
return { duplicatedElements };
|
|
383
421
|
},
|
|
384
422
|
undo: (_, { duplicatedElements }) => {
|
|
385
423
|
[...duplicatedElements].reverse().forEach(({ id }) => {
|
|
@@ -412,7 +450,7 @@ var duplicateElements = ({
|
|
|
412
450
|
}
|
|
413
451
|
return acc;
|
|
414
452
|
}, []);
|
|
415
|
-
return { duplicatedElements
|
|
453
|
+
return { duplicatedElements };
|
|
416
454
|
}
|
|
417
455
|
},
|
|
418
456
|
{
|
|
@@ -423,74 +461,23 @@ var duplicateElements = ({
|
|
|
423
461
|
return undoableDuplicate({ elementIds });
|
|
424
462
|
};
|
|
425
463
|
|
|
426
|
-
// src/sync/
|
|
427
|
-
var
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
elementIds,
|
|
431
|
-
title,
|
|
432
|
-
subtitle = (0, import_i18n3.__)("Item removed", "elementor")
|
|
433
|
-
}) => {
|
|
434
|
-
const undoableRemove = (0, import_editor_v1_adapters11.undoable)(
|
|
435
|
-
{
|
|
436
|
-
do: ({ elementIds: elementIdsParam }) => {
|
|
437
|
-
const removedElements = [];
|
|
438
|
-
elementIdsParam.forEach((elementId) => {
|
|
439
|
-
const container = getContainer(elementId);
|
|
440
|
-
if (container) {
|
|
441
|
-
const model = container.model.toJSON();
|
|
442
|
-
const parent = container.parent;
|
|
443
|
-
const at = container.view?._index ?? 0;
|
|
444
|
-
removedElements.push({
|
|
445
|
-
elementId,
|
|
446
|
-
model,
|
|
447
|
-
parent: parent ?? null,
|
|
448
|
-
at
|
|
449
|
-
});
|
|
450
|
-
}
|
|
451
|
-
});
|
|
452
|
-
elementIdsParam.forEach((elementId) => {
|
|
453
|
-
deleteElement({
|
|
454
|
-
elementId,
|
|
455
|
-
options: { useHistory: false }
|
|
456
|
-
});
|
|
457
|
-
});
|
|
458
|
-
return { elementIds: elementIdsParam, removedElements };
|
|
459
|
-
},
|
|
460
|
-
undo: (_, { removedElements }) => {
|
|
461
|
-
[...removedElements].reverse().forEach(({ model, parent, at }) => {
|
|
462
|
-
if (parent && model) {
|
|
463
|
-
createElement({
|
|
464
|
-
containerId: parent.id,
|
|
465
|
-
model,
|
|
466
|
-
options: { useHistory: false, at }
|
|
467
|
-
});
|
|
468
|
-
}
|
|
469
|
-
});
|
|
470
|
-
},
|
|
471
|
-
redo: (_, { elementIds: originalElementIds, removedElements }) => {
|
|
472
|
-
originalElementIds.forEach((elementId) => {
|
|
473
|
-
deleteElement({
|
|
474
|
-
elementId,
|
|
475
|
-
options: { useHistory: false }
|
|
476
|
-
});
|
|
477
|
-
});
|
|
478
|
-
return { elementIds: originalElementIds, removedElements };
|
|
479
|
-
}
|
|
480
|
-
},
|
|
481
|
-
{
|
|
482
|
-
title,
|
|
483
|
-
subtitle
|
|
484
|
-
}
|
|
485
|
-
);
|
|
486
|
-
return undoableRemove({ elementIds });
|
|
464
|
+
// src/sync/generate-element-id.ts
|
|
465
|
+
var generateElementId = () => {
|
|
466
|
+
const extendedWindow = window;
|
|
467
|
+
return extendedWindow.elementorCommon?.helpers?.getUniqueId?.() ?? `el-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
|
|
487
468
|
};
|
|
488
469
|
|
|
489
|
-
// src/sync/get-
|
|
490
|
-
|
|
491
|
-
const
|
|
492
|
-
return
|
|
493
|
-
}
|
|
470
|
+
// src/sync/get-current-document-container.ts
|
|
471
|
+
function getCurrentDocumentContainer() {
|
|
472
|
+
const extendedWindow = window;
|
|
473
|
+
return extendedWindow.elementor?.documents?.getCurrent?.()?.container ?? null;
|
|
474
|
+
}
|
|
475
|
+
|
|
476
|
+
// src/sync/get-current-document-id.ts
|
|
477
|
+
function getCurrentDocumentId() {
|
|
478
|
+
const extendedWindow = window;
|
|
479
|
+
return extendedWindow.elementor?.documents?.getCurrentId?.() ?? null;
|
|
480
|
+
}
|
|
494
481
|
|
|
495
482
|
// src/errors.ts
|
|
496
483
|
var import_utils = require("@elementor/utils");
|
|
@@ -510,9 +497,20 @@ var ElementLabelNotExistsError = (0, import_utils.createError)({
|
|
|
510
497
|
code: "element_label_not_exists",
|
|
511
498
|
message: "Element label does not exist."
|
|
512
499
|
});
|
|
500
|
+
var ElementParentNotFoundError = (0, import_utils.createError)({
|
|
501
|
+
code: "element_parent_not_found",
|
|
502
|
+
message: "Element parent not found."
|
|
503
|
+
});
|
|
504
|
+
var ElementIndexNotFoundError = (0, import_utils.createError)({
|
|
505
|
+
code: "element_index_not_found",
|
|
506
|
+
message: "Element index not found."
|
|
507
|
+
});
|
|
513
508
|
|
|
514
509
|
// src/sync/get-element-label.ts
|
|
515
510
|
function getElementLabel(elementId) {
|
|
511
|
+
if (!elementId) {
|
|
512
|
+
elementId = getSelectedElements()?.[0]?.id;
|
|
513
|
+
}
|
|
516
514
|
const container = getContainer(elementId);
|
|
517
515
|
const type = container?.model.get("widgetType") || container?.model.get("elType");
|
|
518
516
|
if (!type) {
|
|
@@ -525,11 +523,11 @@ function getElementLabel(elementId) {
|
|
|
525
523
|
return label;
|
|
526
524
|
}
|
|
527
525
|
|
|
528
|
-
// src/sync/get-
|
|
529
|
-
|
|
530
|
-
const
|
|
531
|
-
return
|
|
532
|
-
}
|
|
526
|
+
// src/sync/get-element-styles.ts
|
|
527
|
+
var getElementStyles = (elementID) => {
|
|
528
|
+
const container = getContainer(elementID);
|
|
529
|
+
return container?.model.get("styles") || null;
|
|
530
|
+
};
|
|
533
531
|
|
|
534
532
|
// src/sync/get-elements.ts
|
|
535
533
|
function getElements(root) {
|
|
@@ -543,14 +541,239 @@ function getElements(root) {
|
|
|
543
541
|
return [container, ...children];
|
|
544
542
|
}
|
|
545
543
|
|
|
546
|
-
// src/sync/
|
|
547
|
-
function
|
|
548
|
-
const
|
|
549
|
-
|
|
544
|
+
// src/sync/move-element.ts
|
|
545
|
+
function moveElement({ elementId, targetContainerId, options = {} }) {
|
|
546
|
+
const container = getContainer(elementId);
|
|
547
|
+
const target = getContainer(targetContainerId);
|
|
548
|
+
if (!container) {
|
|
549
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
550
|
+
}
|
|
551
|
+
if (!target) {
|
|
552
|
+
throw new Error(`Target container with ID "${targetContainerId}" not found`);
|
|
553
|
+
}
|
|
554
|
+
const modelToRecreate = container.model.toJSON();
|
|
555
|
+
deleteElement({
|
|
556
|
+
elementId,
|
|
557
|
+
// prevent inner history from being created
|
|
558
|
+
options: { ...options, useHistory: false }
|
|
559
|
+
});
|
|
560
|
+
const newContainer = createElement({
|
|
561
|
+
containerId: targetContainerId,
|
|
562
|
+
model: modelToRecreate,
|
|
563
|
+
// prevent inner history from being created
|
|
564
|
+
options: { edit: false, ...options, useHistory: false }
|
|
565
|
+
});
|
|
566
|
+
return newContainer;
|
|
550
567
|
}
|
|
551
568
|
|
|
552
|
-
// src/sync/
|
|
569
|
+
// src/sync/move-elements.ts
|
|
553
570
|
var import_editor_v1_adapters12 = require("@elementor/editor-v1-adapters");
|
|
571
|
+
var import_i18n3 = require("@wordpress/i18n");
|
|
572
|
+
var moveElements = ({
|
|
573
|
+
moves: movesToMake,
|
|
574
|
+
title,
|
|
575
|
+
subtitle = (0, import_i18n3.__)("Elements moved", "elementor"),
|
|
576
|
+
onMoveElements,
|
|
577
|
+
onRestoreElements
|
|
578
|
+
}) => {
|
|
579
|
+
const undoableMove = (0, import_editor_v1_adapters12.undoable)(
|
|
580
|
+
{
|
|
581
|
+
do: ({ moves }) => {
|
|
582
|
+
const movedElements = [];
|
|
583
|
+
onMoveElements?.();
|
|
584
|
+
moves.forEach((move) => {
|
|
585
|
+
const { elementId } = move;
|
|
586
|
+
const sourceContainer = getContainer(elementId);
|
|
587
|
+
if (!sourceContainer) {
|
|
588
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
589
|
+
}
|
|
590
|
+
const originalContainerId = sourceContainer.parent?.id || "";
|
|
591
|
+
const originalIndex = sourceContainer.parent?.children?.indexOf(sourceContainer) ?? -1;
|
|
592
|
+
const originalPosition = {
|
|
593
|
+
elementId,
|
|
594
|
+
originalContainerId,
|
|
595
|
+
originalIndex
|
|
596
|
+
};
|
|
597
|
+
const element = moveElement({
|
|
598
|
+
...move,
|
|
599
|
+
options: { ...move.options, useHistory: false }
|
|
600
|
+
});
|
|
601
|
+
movedElements.push({
|
|
602
|
+
elementId,
|
|
603
|
+
originalPosition,
|
|
604
|
+
move,
|
|
605
|
+
element
|
|
606
|
+
});
|
|
607
|
+
});
|
|
608
|
+
return { movedElements };
|
|
609
|
+
},
|
|
610
|
+
undo: (_, { movedElements }) => {
|
|
611
|
+
onRestoreElements?.();
|
|
612
|
+
[...movedElements].reverse().forEach(({ originalPosition }) => {
|
|
613
|
+
const { elementId, originalContainerId, originalIndex } = originalPosition;
|
|
614
|
+
moveElement({
|
|
615
|
+
elementId,
|
|
616
|
+
targetContainerId: originalContainerId,
|
|
617
|
+
options: {
|
|
618
|
+
useHistory: false,
|
|
619
|
+
at: originalIndex >= 0 ? originalIndex : void 0
|
|
620
|
+
}
|
|
621
|
+
});
|
|
622
|
+
});
|
|
623
|
+
},
|
|
624
|
+
redo: (_, { movedElements }) => {
|
|
625
|
+
const newMovedElements = [];
|
|
626
|
+
onMoveElements?.();
|
|
627
|
+
movedElements.forEach(({ move, originalPosition }) => {
|
|
628
|
+
const element = moveElement({
|
|
629
|
+
...move,
|
|
630
|
+
options: { ...move.options, useHistory: false }
|
|
631
|
+
});
|
|
632
|
+
newMovedElements.push({
|
|
633
|
+
elementId: move.elementId,
|
|
634
|
+
originalPosition,
|
|
635
|
+
move,
|
|
636
|
+
element
|
|
637
|
+
});
|
|
638
|
+
});
|
|
639
|
+
return { movedElements: newMovedElements };
|
|
640
|
+
}
|
|
641
|
+
},
|
|
642
|
+
{
|
|
643
|
+
title,
|
|
644
|
+
subtitle
|
|
645
|
+
}
|
|
646
|
+
);
|
|
647
|
+
return undoableMove({ moves: movesToMake });
|
|
648
|
+
};
|
|
649
|
+
|
|
650
|
+
// src/sync/remove-elements.ts
|
|
651
|
+
var import_editor_v1_adapters13 = require("@elementor/editor-v1-adapters");
|
|
652
|
+
var import_i18n4 = require("@wordpress/i18n");
|
|
653
|
+
var removeElements = ({
|
|
654
|
+
elementIds,
|
|
655
|
+
title,
|
|
656
|
+
subtitle = (0, import_i18n4.__)("Item removed", "elementor"),
|
|
657
|
+
onRemoveElements,
|
|
658
|
+
onRestoreElements
|
|
659
|
+
}) => {
|
|
660
|
+
const undoableRemove = (0, import_editor_v1_adapters13.undoable)(
|
|
661
|
+
{
|
|
662
|
+
do: ({ elementIds: elementIdsParam }) => {
|
|
663
|
+
const removedElements = [];
|
|
664
|
+
elementIdsParam.forEach((elementId) => {
|
|
665
|
+
const container = getContainer(elementId);
|
|
666
|
+
if (container) {
|
|
667
|
+
const model = container.model.toJSON();
|
|
668
|
+
const parent = container.parent;
|
|
669
|
+
const at = container.view?._index ?? 0;
|
|
670
|
+
removedElements.push({
|
|
671
|
+
elementId,
|
|
672
|
+
model,
|
|
673
|
+
parent: parent ?? null,
|
|
674
|
+
at
|
|
675
|
+
});
|
|
676
|
+
}
|
|
677
|
+
});
|
|
678
|
+
onRemoveElements?.();
|
|
679
|
+
elementIdsParam.forEach((elementId) => {
|
|
680
|
+
deleteElement({
|
|
681
|
+
elementId,
|
|
682
|
+
options: { useHistory: false }
|
|
683
|
+
});
|
|
684
|
+
});
|
|
685
|
+
return { elementIds: elementIdsParam, removedElements };
|
|
686
|
+
},
|
|
687
|
+
undo: (_, { removedElements }) => {
|
|
688
|
+
onRestoreElements?.();
|
|
689
|
+
[...removedElements].reverse().forEach(({ model, parent, at }) => {
|
|
690
|
+
if (parent && model) {
|
|
691
|
+
createElement({
|
|
692
|
+
containerId: parent.id,
|
|
693
|
+
model,
|
|
694
|
+
options: { useHistory: false, at }
|
|
695
|
+
});
|
|
696
|
+
}
|
|
697
|
+
});
|
|
698
|
+
},
|
|
699
|
+
redo: (_, { elementIds: originalElementIds, removedElements }) => {
|
|
700
|
+
onRemoveElements?.();
|
|
701
|
+
originalElementIds.forEach((elementId) => {
|
|
702
|
+
deleteElement({
|
|
703
|
+
elementId,
|
|
704
|
+
options: { useHistory: false }
|
|
705
|
+
});
|
|
706
|
+
});
|
|
707
|
+
return { elementIds: originalElementIds, removedElements };
|
|
708
|
+
}
|
|
709
|
+
},
|
|
710
|
+
{
|
|
711
|
+
title,
|
|
712
|
+
subtitle
|
|
713
|
+
}
|
|
714
|
+
);
|
|
715
|
+
return undoableRemove({ elementIds });
|
|
716
|
+
};
|
|
717
|
+
|
|
718
|
+
// src/sync/replace-element.ts
|
|
719
|
+
var replaceElement = ({ currentElement, newElement, withHistory = true }) => {
|
|
720
|
+
const { containerId, index } = getNewElementLocation(currentElement, newElement);
|
|
721
|
+
createElement({
|
|
722
|
+
containerId,
|
|
723
|
+
model: newElement,
|
|
724
|
+
options: { at: index, useHistory: withHistory }
|
|
725
|
+
});
|
|
726
|
+
deleteElement({ elementId: currentElement.id, options: { useHistory: withHistory } });
|
|
727
|
+
};
|
|
728
|
+
function getNewElementLocation(currentElement, newElement) {
|
|
729
|
+
let location;
|
|
730
|
+
const currentElementContainer = getContainer(currentElement.id);
|
|
731
|
+
if (!currentElementContainer) {
|
|
732
|
+
throw new ElementNotFoundError({ context: { elementId: currentElement.id } });
|
|
733
|
+
}
|
|
734
|
+
const parent = currentElementContainer.parent;
|
|
735
|
+
if (!parent) {
|
|
736
|
+
throw new ElementParentNotFoundError({ context: { elementId: currentElement.id } });
|
|
737
|
+
}
|
|
738
|
+
const elementIndex = currentElementContainer.view?._index ?? 0;
|
|
739
|
+
if (elementIndex === void 0 || elementIndex === -1) {
|
|
740
|
+
throw new ElementIndexNotFoundError({ context: { elementId: currentElement.id } });
|
|
741
|
+
}
|
|
742
|
+
location = { containerId: parent.id, index: elementIndex };
|
|
743
|
+
if (parent.id === "document" && newElement.elType === "widget") {
|
|
744
|
+
location = createWrapperForWidget(parent.id, elementIndex);
|
|
745
|
+
}
|
|
746
|
+
return location;
|
|
747
|
+
}
|
|
748
|
+
function createWrapperForWidget(parentId, elementIndex) {
|
|
749
|
+
const container = createElement({
|
|
750
|
+
containerId: parentId,
|
|
751
|
+
model: { elType: "container" },
|
|
752
|
+
options: { at: elementIndex, useHistory: false }
|
|
753
|
+
});
|
|
754
|
+
return { containerId: container.id, index: 0 };
|
|
755
|
+
}
|
|
756
|
+
|
|
757
|
+
// src/sync/update-element-editor-settings.ts
|
|
758
|
+
var import_editor_v1_adapters14 = require("@elementor/editor-v1-adapters");
|
|
759
|
+
var updateElementEditorSettings = ({
|
|
760
|
+
elementId,
|
|
761
|
+
settings
|
|
762
|
+
}) => {
|
|
763
|
+
const element = getContainer(elementId);
|
|
764
|
+
if (!element) {
|
|
765
|
+
throw new Error(`Element with id ${elementId} not found`);
|
|
766
|
+
}
|
|
767
|
+
const editorSettings = element.model.get("editor_settings") ?? {};
|
|
768
|
+
element.model.set("editor_settings", { ...editorSettings, ...settings });
|
|
769
|
+
setDocumentModifiedStatus(true);
|
|
770
|
+
};
|
|
771
|
+
function setDocumentModifiedStatus(status) {
|
|
772
|
+
(0, import_editor_v1_adapters14.__privateRunCommandSync)("document/save/set-is-modified", { status }, { internal: true });
|
|
773
|
+
}
|
|
774
|
+
|
|
775
|
+
// src/sync/update-element-settings.ts
|
|
776
|
+
var import_editor_v1_adapters15 = require("@elementor/editor-v1-adapters");
|
|
554
777
|
var updateElementSettings = ({ id, props, withHistory = true }) => {
|
|
555
778
|
const container = getContainer(id);
|
|
556
779
|
const args = {
|
|
@@ -558,45 +781,105 @@ var updateElementSettings = ({ id, props, withHistory = true }) => {
|
|
|
558
781
|
settings: { ...props }
|
|
559
782
|
};
|
|
560
783
|
if (withHistory) {
|
|
561
|
-
(0,
|
|
784
|
+
(0, import_editor_v1_adapters15.__privateRunCommandSync)("document/elements/settings", args);
|
|
562
785
|
} else {
|
|
563
|
-
(0,
|
|
786
|
+
(0, import_editor_v1_adapters15.__privateRunCommandSync)("document/elements/set-settings", args, { internal: true });
|
|
564
787
|
}
|
|
565
788
|
};
|
|
566
789
|
|
|
567
|
-
// src/
|
|
568
|
-
|
|
569
|
-
const
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
if (!parent) {
|
|
577
|
-
throw new Error(`Parent not found for element ${currentElement.id}. Cannot replace element.`);
|
|
790
|
+
// src/link-restriction.ts
|
|
791
|
+
function getLinkInLinkRestriction(elementId) {
|
|
792
|
+
const anchoredDescendantId = getAnchoredDescendantId(elementId);
|
|
793
|
+
if (anchoredDescendantId) {
|
|
794
|
+
return {
|
|
795
|
+
shouldRestrict: true,
|
|
796
|
+
reason: "descendant",
|
|
797
|
+
elementId: anchoredDescendantId
|
|
798
|
+
};
|
|
578
799
|
}
|
|
579
|
-
const
|
|
580
|
-
if (
|
|
581
|
-
|
|
800
|
+
const ancestor = getAnchoredAncestorId(elementId);
|
|
801
|
+
if (ancestor) {
|
|
802
|
+
return {
|
|
803
|
+
shouldRestrict: true,
|
|
804
|
+
reason: "ancestor",
|
|
805
|
+
elementId: ancestor
|
|
806
|
+
};
|
|
582
807
|
}
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
808
|
+
return {
|
|
809
|
+
shouldRestrict: false
|
|
810
|
+
};
|
|
811
|
+
}
|
|
812
|
+
function getAnchoredDescendantId(elementId) {
|
|
813
|
+
const element = getElementDOM(elementId);
|
|
814
|
+
if (!element) {
|
|
815
|
+
return null;
|
|
816
|
+
}
|
|
817
|
+
for (const childAnchorElement of Array.from(element.querySelectorAll("a"))) {
|
|
818
|
+
const childElementId = findElementIdOf(childAnchorElement);
|
|
819
|
+
if (childElementId !== elementId) {
|
|
820
|
+
return childElementId;
|
|
821
|
+
}
|
|
822
|
+
}
|
|
823
|
+
return null;
|
|
824
|
+
}
|
|
825
|
+
function getAnchoredAncestorId(elementId) {
|
|
826
|
+
const element = getElementDOM(elementId);
|
|
827
|
+
if (!element || element.parentElement === null) {
|
|
828
|
+
return null;
|
|
829
|
+
}
|
|
830
|
+
const parentAnchor = element.parentElement.closest("a");
|
|
831
|
+
return parentAnchor ? findElementIdOf(parentAnchor) : null;
|
|
832
|
+
}
|
|
833
|
+
function isElementAnchored(elementId) {
|
|
834
|
+
const element = getElementDOM(elementId);
|
|
835
|
+
if (!element) {
|
|
836
|
+
return false;
|
|
837
|
+
}
|
|
838
|
+
if (isAnchorTag(element.tagName)) {
|
|
839
|
+
return true;
|
|
840
|
+
}
|
|
841
|
+
return doesElementContainAnchor(element);
|
|
842
|
+
}
|
|
843
|
+
function doesElementContainAnchor(element) {
|
|
844
|
+
for (const child of element.children) {
|
|
845
|
+
if (isElementorElement(child)) {
|
|
846
|
+
continue;
|
|
847
|
+
}
|
|
848
|
+
if (isAnchorTag(child.tagName)) {
|
|
849
|
+
return true;
|
|
850
|
+
}
|
|
851
|
+
if (doesElementContainAnchor(child)) {
|
|
852
|
+
return true;
|
|
853
|
+
}
|
|
854
|
+
}
|
|
855
|
+
return false;
|
|
856
|
+
}
|
|
857
|
+
function findElementIdOf(element) {
|
|
858
|
+
return element.closest("[data-id]")?.dataset.id || null;
|
|
859
|
+
}
|
|
860
|
+
function getElementDOM(id) {
|
|
861
|
+
try {
|
|
862
|
+
return getContainer(id)?.view?.el || null;
|
|
863
|
+
} catch {
|
|
864
|
+
return null;
|
|
865
|
+
}
|
|
866
|
+
}
|
|
867
|
+
function isAnchorTag(tagName) {
|
|
868
|
+
return tagName.toLowerCase() === "a";
|
|
869
|
+
}
|
|
870
|
+
function isElementorElement(element) {
|
|
871
|
+
return element.hasAttribute("data-id");
|
|
872
|
+
}
|
|
590
873
|
|
|
591
874
|
// src/styles/consts.ts
|
|
592
|
-
var
|
|
875
|
+
var import_editor_v1_adapters16 = require("@elementor/editor-v1-adapters");
|
|
593
876
|
var ELEMENT_STYLE_CHANGE_EVENT = "elementor/editor-v2/editor-elements/style";
|
|
594
877
|
var styleRerenderEvents = [
|
|
595
|
-
(0,
|
|
596
|
-
(0,
|
|
597
|
-
(0,
|
|
598
|
-
(0,
|
|
599
|
-
(0,
|
|
878
|
+
(0, import_editor_v1_adapters16.commandEndEvent)("document/elements/create"),
|
|
879
|
+
(0, import_editor_v1_adapters16.commandEndEvent)("document/elements/duplicate"),
|
|
880
|
+
(0, import_editor_v1_adapters16.commandEndEvent)("document/elements/import"),
|
|
881
|
+
(0, import_editor_v1_adapters16.commandEndEvent)("document/elements/paste"),
|
|
882
|
+
(0, import_editor_v1_adapters16.windowEvent)(ELEMENT_STYLE_CHANGE_EVENT)
|
|
600
883
|
];
|
|
601
884
|
|
|
602
885
|
// src/styles/create-element-style.ts
|
|
@@ -605,7 +888,7 @@ var import_editor_styles = require("@elementor/editor-styles");
|
|
|
605
888
|
|
|
606
889
|
// src/styles/mutate-element-styles.ts
|
|
607
890
|
var import_editor_props = require("@elementor/editor-props");
|
|
608
|
-
var
|
|
891
|
+
var import_editor_v1_adapters17 = require("@elementor/editor-v1-adapters");
|
|
609
892
|
function mutateElementStyles(elementId, mutator) {
|
|
610
893
|
const container = getContainer(elementId);
|
|
611
894
|
if (!container) {
|
|
@@ -661,7 +944,7 @@ function getClassesProps(container) {
|
|
|
661
944
|
}
|
|
662
945
|
function notifyChanges() {
|
|
663
946
|
dispatchChangeEvent();
|
|
664
|
-
(0,
|
|
947
|
+
(0, import_editor_v1_adapters17.__privateRunCommandSync)("document/save/set-is-modified", { status: true }, { internal: true });
|
|
665
948
|
}
|
|
666
949
|
function dispatchChangeEvent() {
|
|
667
950
|
window.dispatchEvent(new CustomEvent(ELEMENT_STYLE_CHANGE_EVENT));
|
|
@@ -713,6 +996,14 @@ function shouldCreateNewLocalStyle(payload) {
|
|
|
713
996
|
return !payload?.styleId && !payload?.provider;
|
|
714
997
|
}
|
|
715
998
|
|
|
999
|
+
// src/styles/delete-element-style.ts
|
|
1000
|
+
function deleteElementStyle(elementId, styleId) {
|
|
1001
|
+
mutateElementStyles(elementId, (styles) => {
|
|
1002
|
+
delete styles[styleId];
|
|
1003
|
+
return styles;
|
|
1004
|
+
});
|
|
1005
|
+
}
|
|
1006
|
+
|
|
716
1007
|
// src/styles/update-element-style.ts
|
|
717
1008
|
var import_editor_props3 = require("@elementor/editor-props");
|
|
718
1009
|
var import_editor_styles2 = require("@elementor/editor-styles");
|
|
@@ -734,96 +1025,663 @@ function updateElementStyle(args) {
|
|
|
734
1025
|
});
|
|
735
1026
|
}
|
|
736
1027
|
|
|
737
|
-
// src/
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
1028
|
+
// src/hooks/use-element-interactions.ts
|
|
1029
|
+
var import_react = require("react");
|
|
1030
|
+
var import_editor_v1_adapters18 = require("@elementor/editor-v1-adapters");
|
|
1031
|
+
|
|
1032
|
+
// src/sync/get-element-interactions.ts
|
|
1033
|
+
function getElementInteractions(elementId) {
|
|
1034
|
+
const container = getContainer(elementId);
|
|
1035
|
+
const interactions = container?.model?.get("interactions");
|
|
1036
|
+
if (typeof interactions === "string") {
|
|
1037
|
+
return JSON.parse(interactions);
|
|
1038
|
+
}
|
|
1039
|
+
return interactions;
|
|
1040
|
+
}
|
|
1041
|
+
|
|
1042
|
+
// src/hooks/use-element-interactions.ts
|
|
1043
|
+
var useElementInteractions = (elementId) => {
|
|
1044
|
+
const [interactions, setInteractions] = (0, import_react.useState)(() => {
|
|
1045
|
+
const initial = getElementInteractions(elementId);
|
|
1046
|
+
return initial ?? { version: 1, items: [] };
|
|
742
1047
|
});
|
|
1048
|
+
(0, import_editor_v1_adapters18.__privateUseListenTo)(
|
|
1049
|
+
(0, import_editor_v1_adapters18.windowEvent)("elementor/element/update_interactions"),
|
|
1050
|
+
() => {
|
|
1051
|
+
const newInteractions = getElementInteractions(elementId);
|
|
1052
|
+
setInteractions(newInteractions ?? { version: 1, items: [] });
|
|
1053
|
+
},
|
|
1054
|
+
[elementId]
|
|
1055
|
+
);
|
|
1056
|
+
return interactions;
|
|
1057
|
+
};
|
|
1058
|
+
|
|
1059
|
+
// src/sync/update-element-interactions.ts
|
|
1060
|
+
var import_editor_v1_adapters19 = require("@elementor/editor-v1-adapters");
|
|
1061
|
+
var updateElementInteractions = ({
|
|
1062
|
+
elementId,
|
|
1063
|
+
interactions
|
|
1064
|
+
}) => {
|
|
1065
|
+
const element = getContainer(elementId);
|
|
1066
|
+
if (!element) {
|
|
1067
|
+
throw new Error(`Element with id ${elementId} not found`);
|
|
1068
|
+
}
|
|
1069
|
+
element.model.set("interactions", interactions);
|
|
1070
|
+
window.dispatchEvent(new CustomEvent("elementor/element/update_interactions"));
|
|
1071
|
+
setDocumentModifiedStatus2(true);
|
|
1072
|
+
};
|
|
1073
|
+
var playElementInteractions = (elementId, animationId) => {
|
|
1074
|
+
window.top?.dispatchEvent(new CustomEvent("atomic/play_interactions", { detail: { elementId, animationId } }));
|
|
1075
|
+
};
|
|
1076
|
+
function setDocumentModifiedStatus2(status) {
|
|
1077
|
+
(0, import_editor_v1_adapters19.__privateRunCommandSync)("document/save/set-is-modified", { status }, { internal: true });
|
|
743
1078
|
}
|
|
744
1079
|
|
|
745
|
-
// src/
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
1080
|
+
// src/mcp/index.ts
|
|
1081
|
+
var import_editor_mcp2 = require("@elementor/editor-mcp");
|
|
1082
|
+
|
|
1083
|
+
// src/mcp/elements-tool.ts
|
|
1084
|
+
var import_editor_mcp = require("@elementor/editor-mcp");
|
|
1085
|
+
var import_schema = require("@elementor/schema");
|
|
1086
|
+
|
|
1087
|
+
// src/mcp/handlers/create-element.ts
|
|
1088
|
+
function handleCreateElement({
|
|
1089
|
+
elementType,
|
|
1090
|
+
containerId,
|
|
1091
|
+
props = {},
|
|
1092
|
+
styles
|
|
1093
|
+
}) {
|
|
1094
|
+
let container = containerId === "document" ? getCurrentDocumentContainer() : getContainer(containerId);
|
|
1095
|
+
if (!container) {
|
|
1096
|
+
if (containerId === "document") {
|
|
1097
|
+
throw new Error("Document container not found. Please ensure the editor is initialized.");
|
|
1098
|
+
}
|
|
1099
|
+
throw new Error(`Container with ID "${containerId}" not found`);
|
|
754
1100
|
}
|
|
755
|
-
const
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
elementId: ancestor
|
|
1101
|
+
const containerElType = container.model.get("elType");
|
|
1102
|
+
const isDocument = container.id === "document" || containerElType === "document";
|
|
1103
|
+
if (isDocument) {
|
|
1104
|
+
const containerModel = {
|
|
1105
|
+
elType: "e-div-block"
|
|
761
1106
|
};
|
|
1107
|
+
const createdContainer = createElement({
|
|
1108
|
+
containerId: container.id,
|
|
1109
|
+
model: containerModel,
|
|
1110
|
+
options: { useHistory: true }
|
|
1111
|
+
});
|
|
1112
|
+
createElementStyle({
|
|
1113
|
+
elementId: createdContainer.id,
|
|
1114
|
+
classesProp: "classes",
|
|
1115
|
+
label: "local",
|
|
1116
|
+
meta: { breakpoint: "desktop", state: null },
|
|
1117
|
+
props: {
|
|
1118
|
+
display: { $$type: "string", value: "flex" },
|
|
1119
|
+
"flex-direction": { $$type: "string", value: "row" },
|
|
1120
|
+
"flex-wrap": { $$type: "string", value: "wrap" }
|
|
1121
|
+
}
|
|
1122
|
+
});
|
|
1123
|
+
container = getContainer(createdContainer.id);
|
|
1124
|
+
if (!container) {
|
|
1125
|
+
throw new Error("Failed to create container for widget. Cannot create widgets directly in the document.");
|
|
1126
|
+
}
|
|
1127
|
+
}
|
|
1128
|
+
const actualContainerId = container.id;
|
|
1129
|
+
const elementTypeData = getElementType(elementType);
|
|
1130
|
+
if (!elementTypeData) {
|
|
1131
|
+
throw new Error(`Element type "${elementType}" not found or is not atomic`);
|
|
1132
|
+
}
|
|
1133
|
+
const model = {
|
|
1134
|
+
widgetType: elementType,
|
|
1135
|
+
elType: "widget",
|
|
1136
|
+
settings: props
|
|
1137
|
+
};
|
|
1138
|
+
const createdElement = createElement({
|
|
1139
|
+
containerId: actualContainerId,
|
|
1140
|
+
model,
|
|
1141
|
+
options: { useHistory: true }
|
|
1142
|
+
});
|
|
1143
|
+
if (styles) {
|
|
1144
|
+
createElementStyle({
|
|
1145
|
+
elementId: createdElement.id,
|
|
1146
|
+
classesProp: "classes",
|
|
1147
|
+
label: "local",
|
|
1148
|
+
meta: { breakpoint: "desktop", state: null },
|
|
1149
|
+
props: styles
|
|
1150
|
+
});
|
|
762
1151
|
}
|
|
763
1152
|
return {
|
|
764
|
-
|
|
1153
|
+
elementId: createdElement.id,
|
|
1154
|
+
type: elementType
|
|
765
1155
|
};
|
|
766
1156
|
}
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
1157
|
+
|
|
1158
|
+
// src/mcp/handlers/common-style-utils.ts
|
|
1159
|
+
var VALID_BREAKPOINTS = [
|
|
1160
|
+
"widescreen",
|
|
1161
|
+
"desktop",
|
|
1162
|
+
"laptop",
|
|
1163
|
+
"tablet_extra",
|
|
1164
|
+
"tablet",
|
|
1165
|
+
"mobile_extra",
|
|
1166
|
+
"mobile"
|
|
1167
|
+
];
|
|
1168
|
+
function resolveBreakpointId(breakpoint) {
|
|
1169
|
+
if (breakpoint === null) {
|
|
770
1170
|
return null;
|
|
771
1171
|
}
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
if (childElementId !== elementId) {
|
|
775
|
-
return childElementId;
|
|
776
|
-
}
|
|
1172
|
+
if (VALID_BREAKPOINTS.includes(breakpoint)) {
|
|
1173
|
+
return breakpoint;
|
|
777
1174
|
}
|
|
778
|
-
return
|
|
1175
|
+
return "desktop";
|
|
779
1176
|
}
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
1177
|
+
|
|
1178
|
+
// src/mcp/handlers/create-style.ts
|
|
1179
|
+
function handleCreateStyle({
|
|
1180
|
+
elementId,
|
|
1181
|
+
styleId,
|
|
1182
|
+
classesProp = "classes",
|
|
1183
|
+
label = "local",
|
|
1184
|
+
styles,
|
|
1185
|
+
breakpoint = "desktop",
|
|
1186
|
+
state = null,
|
|
1187
|
+
customCss = null
|
|
1188
|
+
}) {
|
|
1189
|
+
const resolvedBreakpoint = resolveBreakpointId(breakpoint);
|
|
1190
|
+
const resolvedState = state === null || state === void 0 ? null : state;
|
|
1191
|
+
const createdStyleId = createElementStyle({
|
|
1192
|
+
styleId,
|
|
1193
|
+
elementId,
|
|
1194
|
+
classesProp,
|
|
1195
|
+
label,
|
|
1196
|
+
meta: { breakpoint: resolvedBreakpoint, state: resolvedState },
|
|
1197
|
+
props: styles,
|
|
1198
|
+
custom_css: customCss
|
|
1199
|
+
});
|
|
1200
|
+
return { styleId: createdStyleId };
|
|
1201
|
+
}
|
|
1202
|
+
|
|
1203
|
+
// src/mcp/handlers/delete-element.ts
|
|
1204
|
+
function handleDeleteElement(elementId) {
|
|
1205
|
+
const container = getContainer(elementId);
|
|
1206
|
+
if (!container) {
|
|
1207
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
784
1208
|
}
|
|
785
|
-
|
|
786
|
-
|
|
1209
|
+
deleteElement({
|
|
1210
|
+
elementId,
|
|
1211
|
+
options: { useHistory: true }
|
|
1212
|
+
});
|
|
1213
|
+
return { success: true };
|
|
787
1214
|
}
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
1215
|
+
|
|
1216
|
+
// src/mcp/handlers/delete-style.ts
|
|
1217
|
+
function handleDeleteStyle({ elementId, styleId }) {
|
|
1218
|
+
const elementStyles = getElementStyles(elementId);
|
|
1219
|
+
if (!elementStyles) {
|
|
1220
|
+
throw new Error(`Element with ID "${elementId}" has no styles.`);
|
|
792
1221
|
}
|
|
793
|
-
|
|
794
|
-
|
|
1222
|
+
const resolvedStyleId = styleId || Object.keys(elementStyles)[0];
|
|
1223
|
+
if (!resolvedStyleId) {
|
|
1224
|
+
throw new Error(`Element with ID "${elementId}" has no styles to delete.`);
|
|
795
1225
|
}
|
|
796
|
-
|
|
1226
|
+
deleteElementStyle(elementId, resolvedStyleId);
|
|
1227
|
+
return { success: true };
|
|
797
1228
|
}
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
1229
|
+
|
|
1230
|
+
// src/mcp/handlers/deselect-element.ts
|
|
1231
|
+
var import_editor_v1_adapters20 = require("@elementor/editor-v1-adapters");
|
|
1232
|
+
function handleDeselectElement(elementId) {
|
|
1233
|
+
const container = getContainer(elementId);
|
|
1234
|
+
if (!container) {
|
|
1235
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
1236
|
+
}
|
|
1237
|
+
(0, import_editor_v1_adapters20.__privateRunCommand)("document/elements/deselect", { container });
|
|
1238
|
+
return { success: true };
|
|
1239
|
+
}
|
|
1240
|
+
function handleDeselectAllElements() {
|
|
1241
|
+
(0, import_editor_v1_adapters20.__privateRunCommand)("document/elements/deselect-all", {});
|
|
1242
|
+
return { success: true };
|
|
1243
|
+
}
|
|
1244
|
+
|
|
1245
|
+
// src/mcp/handlers/duplicate-element.ts
|
|
1246
|
+
function handleDuplicateElement(elementId) {
|
|
1247
|
+
const container = getContainer(elementId);
|
|
1248
|
+
if (!container) {
|
|
1249
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
1250
|
+
}
|
|
1251
|
+
const duplicatedElement = duplicateElement({
|
|
1252
|
+
elementId,
|
|
1253
|
+
options: { useHistory: true }
|
|
1254
|
+
});
|
|
1255
|
+
const type = duplicatedElement.model.get("widgetType") || duplicatedElement.model.get("elType") || "";
|
|
1256
|
+
return {
|
|
1257
|
+
elementId: duplicatedElement.id,
|
|
1258
|
+
type
|
|
1259
|
+
};
|
|
1260
|
+
}
|
|
1261
|
+
|
|
1262
|
+
// src/mcp/handlers/get-element-props.ts
|
|
1263
|
+
function handleGetElementProps(elementId) {
|
|
1264
|
+
const container = getContainer(elementId);
|
|
1265
|
+
if (!container) {
|
|
1266
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
1267
|
+
}
|
|
1268
|
+
const type = container.model.get("widgetType") || container.model.get("elType");
|
|
1269
|
+
if (!type) {
|
|
1270
|
+
throw new Error(`Element with ID "${elementId}" has no type`);
|
|
1271
|
+
}
|
|
1272
|
+
const elementType = getElementType(type);
|
|
1273
|
+
if (!elementType) {
|
|
1274
|
+
throw new Error(`Element type "${type}" is not atomic`);
|
|
1275
|
+
}
|
|
1276
|
+
const propsSchema = elementType.propsSchema;
|
|
1277
|
+
const propKeys = Object.keys(propsSchema);
|
|
1278
|
+
return getElementSettings(elementId, propKeys);
|
|
1279
|
+
}
|
|
1280
|
+
|
|
1281
|
+
// src/mcp/handlers/get-element-schema.ts
|
|
1282
|
+
var import_editor_styles3 = require("@elementor/editor-styles");
|
|
1283
|
+
function handleGetElementSchema(elementType) {
|
|
1284
|
+
const elementTypeData = getElementType(elementType);
|
|
1285
|
+
if (!elementTypeData) {
|
|
1286
|
+
throw new Error(`Element type "${elementType}" not found or is not atomic`);
|
|
1287
|
+
}
|
|
1288
|
+
return { ...elementTypeData, stylesSchema: (0, import_editor_styles3.getStylesSchema)() };
|
|
1289
|
+
}
|
|
1290
|
+
|
|
1291
|
+
// src/mcp/handlers/get-selected.ts
|
|
1292
|
+
function handleGetSelected() {
|
|
1293
|
+
return getSelectedElements();
|
|
1294
|
+
}
|
|
1295
|
+
|
|
1296
|
+
// src/mcp/handlers/get-styles.ts
|
|
1297
|
+
function handleGetStyles(elementId) {
|
|
1298
|
+
const styles = getElementStyles(elementId);
|
|
1299
|
+
if (!styles) {
|
|
1300
|
+
return null;
|
|
1301
|
+
}
|
|
1302
|
+
return Object.fromEntries(
|
|
1303
|
+
Object.entries(styles).map(([id, style]) => [
|
|
1304
|
+
id,
|
|
1305
|
+
{
|
|
1306
|
+
id: style.id,
|
|
1307
|
+
label: style.label,
|
|
1308
|
+
type: style.type,
|
|
1309
|
+
variants: style.variants.map((variant) => ({
|
|
1310
|
+
meta: variant.meta,
|
|
1311
|
+
props: variant.props,
|
|
1312
|
+
custom_css: variant.custom_css
|
|
1313
|
+
}))
|
|
1314
|
+
}
|
|
1315
|
+
])
|
|
1316
|
+
);
|
|
1317
|
+
}
|
|
1318
|
+
|
|
1319
|
+
// src/mcp/handlers/list-available-types.ts
|
|
1320
|
+
function handleListAvailableTypes() {
|
|
1321
|
+
const widgetsCache = getWidgetsCache();
|
|
1322
|
+
if (!widgetsCache) {
|
|
1323
|
+
return [];
|
|
1324
|
+
}
|
|
1325
|
+
const availableTypes = [];
|
|
1326
|
+
Object.entries(widgetsCache).forEach(([type, config]) => {
|
|
1327
|
+
if (config?.atomic_controls && config?.atomic_props_schema) {
|
|
1328
|
+
availableTypes.push({
|
|
1329
|
+
type,
|
|
1330
|
+
title: config.title || type
|
|
1331
|
+
});
|
|
805
1332
|
}
|
|
806
|
-
|
|
807
|
-
|
|
1333
|
+
});
|
|
1334
|
+
return availableTypes;
|
|
1335
|
+
}
|
|
1336
|
+
|
|
1337
|
+
// src/mcp/handlers/move-element.ts
|
|
1338
|
+
function handleMoveElement({
|
|
1339
|
+
elementId,
|
|
1340
|
+
targetContainerId
|
|
1341
|
+
}) {
|
|
1342
|
+
const container = getContainer(elementId);
|
|
1343
|
+
if (!container) {
|
|
1344
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
1345
|
+
}
|
|
1346
|
+
const targetContainer = getContainer(targetContainerId);
|
|
1347
|
+
if (!targetContainer) {
|
|
1348
|
+
throw new Error(`Target container with ID "${targetContainerId}" not found`);
|
|
1349
|
+
}
|
|
1350
|
+
moveElement({
|
|
1351
|
+
elementId,
|
|
1352
|
+
targetContainerId,
|
|
1353
|
+
options: { useHistory: true }
|
|
1354
|
+
});
|
|
1355
|
+
return { success: true };
|
|
1356
|
+
}
|
|
1357
|
+
|
|
1358
|
+
// src/mcp/handlers/select-element.ts
|
|
1359
|
+
function handleSelectElement(elementId) {
|
|
1360
|
+
const container = getContainer(elementId);
|
|
1361
|
+
if (!container) {
|
|
1362
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
1363
|
+
}
|
|
1364
|
+
selectElement(elementId);
|
|
1365
|
+
return { success: true };
|
|
1366
|
+
}
|
|
1367
|
+
function handleSelectMultipleElements(elementIds) {
|
|
1368
|
+
elementIds.forEach((elementId) => {
|
|
1369
|
+
const container = getContainer(elementId);
|
|
1370
|
+
if (container) {
|
|
1371
|
+
selectElement(elementId);
|
|
808
1372
|
}
|
|
1373
|
+
});
|
|
1374
|
+
return { success: true };
|
|
1375
|
+
}
|
|
1376
|
+
|
|
1377
|
+
// src/mcp/handlers/update-props.ts
|
|
1378
|
+
function handleUpdateProps({ elementId, props }) {
|
|
1379
|
+
const container = getContainer(elementId);
|
|
1380
|
+
if (!container) {
|
|
1381
|
+
throw new Error(`Element with ID "${elementId}" not found`);
|
|
809
1382
|
}
|
|
810
|
-
|
|
1383
|
+
updateElementSettings({
|
|
1384
|
+
id: elementId,
|
|
1385
|
+
props,
|
|
1386
|
+
withHistory: true
|
|
1387
|
+
});
|
|
1388
|
+
return { success: true };
|
|
811
1389
|
}
|
|
812
|
-
|
|
813
|
-
|
|
1390
|
+
|
|
1391
|
+
// src/mcp/handlers/update-styles.ts
|
|
1392
|
+
function handleUpdateStyles({
|
|
1393
|
+
elementId,
|
|
1394
|
+
styleId,
|
|
1395
|
+
styles,
|
|
1396
|
+
breakpoint = "desktop",
|
|
1397
|
+
state = null
|
|
1398
|
+
}) {
|
|
1399
|
+
const resolvedBreakpoint = resolveBreakpointId(breakpoint);
|
|
1400
|
+
const resolvedState = state === null || state === void 0 ? null : state;
|
|
1401
|
+
const elementStyles = getElementStyles(elementId);
|
|
1402
|
+
if (!elementStyles) {
|
|
1403
|
+
throw new Error(`Element with ID "${elementId}" has no styles. Create a style first.`);
|
|
1404
|
+
}
|
|
1405
|
+
const resolvedStyleId = styleId || Object.keys(elementStyles)[0];
|
|
1406
|
+
if (!resolvedStyleId) {
|
|
1407
|
+
throw new Error(`Element with ID "${elementId}" has no styles. Create a style first.`);
|
|
1408
|
+
}
|
|
1409
|
+
updateElementStyle({
|
|
1410
|
+
elementId,
|
|
1411
|
+
styleId: resolvedStyleId,
|
|
1412
|
+
meta: { breakpoint: resolvedBreakpoint, state: resolvedState },
|
|
1413
|
+
props: styles
|
|
1414
|
+
});
|
|
1415
|
+
return { success: true };
|
|
814
1416
|
}
|
|
815
|
-
|
|
1417
|
+
|
|
1418
|
+
// src/mcp/elements-tool.ts
|
|
1419
|
+
var actionEnum = import_schema.z.enum([
|
|
1420
|
+
"get-element-schema",
|
|
1421
|
+
"get-element-props",
|
|
1422
|
+
"create-element",
|
|
1423
|
+
"update-props",
|
|
1424
|
+
"create-style",
|
|
1425
|
+
"get-styles",
|
|
1426
|
+
"update-styles",
|
|
1427
|
+
"delete-style",
|
|
1428
|
+
"delete",
|
|
1429
|
+
"duplicate",
|
|
1430
|
+
"move",
|
|
1431
|
+
"select",
|
|
1432
|
+
"deselect",
|
|
1433
|
+
"deselect-all",
|
|
1434
|
+
"get-selected",
|
|
1435
|
+
"list-available-types"
|
|
1436
|
+
]);
|
|
1437
|
+
var schema = {
|
|
1438
|
+
action: actionEnum.describe("The element operation to perform."),
|
|
1439
|
+
elementId: import_schema.z.string().optional().describe("The ID of the target element"),
|
|
1440
|
+
elementIds: import_schema.z.array(import_schema.z.string()).optional().describe("Array of element IDs for multi-element operations"),
|
|
1441
|
+
elementType: import_schema.z.string().optional().describe(
|
|
1442
|
+
"The type of element to create. Must be an atomic element type (required for create-element and get-element-schema actions)"
|
|
1443
|
+
),
|
|
1444
|
+
props: import_schema.z.record(import_schema.z.any()).optional().describe("Props object for creating or updating an element. Must match the element type's propsSchema."),
|
|
1445
|
+
containerId: import_schema.z.string().optional().describe(
|
|
1446
|
+
'Parent container ID for element creation or move operations. Use "document" if parent is the document root.'
|
|
1447
|
+
),
|
|
1448
|
+
targetContainerId: import_schema.z.string().optional().describe("Target container ID for move operations"),
|
|
1449
|
+
styles: import_schema.z.record(import_schema.z.any()).optional().describe(
|
|
1450
|
+
"Styles object for creating or updating element styles. Must match the element type's stylesSchema."
|
|
1451
|
+
),
|
|
1452
|
+
styleId: import_schema.z.string().optional().describe(
|
|
1453
|
+
"Style definition ID for style operations. If not provided, the first available style will be used (for update/delete)."
|
|
1454
|
+
),
|
|
1455
|
+
breakpoint: import_schema.z.string().optional().describe('Breakpoint for style operations (e.g., "desktop", "tablet", "mobile"). Defaults to "desktop".'),
|
|
1456
|
+
state: import_schema.z.string().optional().describe('State for style operations (e.g., "hover", "active", or null). Defaults to null.'),
|
|
1457
|
+
classesProp: import_schema.z.string().optional().describe('Classes property name for create-style action. Defaults to "classes".'),
|
|
1458
|
+
label: import_schema.z.string().optional().describe('Label for create-style action. Defaults to "local".'),
|
|
1459
|
+
custom_css: import_schema.z.object({ raw: import_schema.z.string() }).optional().describe("Custom CSS object with raw CSS string for create-style action.")
|
|
1460
|
+
};
|
|
1461
|
+
function routeAction(params) {
|
|
816
1462
|
try {
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
1463
|
+
switch (params.action) {
|
|
1464
|
+
case "get-element-schema":
|
|
1465
|
+
if (!params.elementType) {
|
|
1466
|
+
throw new Error("elementType is required for get-element-schema action");
|
|
1467
|
+
}
|
|
1468
|
+
return handleGetElementSchema(params.elementType);
|
|
1469
|
+
case "get-element-props":
|
|
1470
|
+
if (!params.elementId) {
|
|
1471
|
+
throw new Error("elementId is required for get-element-props action");
|
|
1472
|
+
}
|
|
1473
|
+
return handleGetElementProps(params.elementId);
|
|
1474
|
+
case "create-element":
|
|
1475
|
+
if (!params.elementType) {
|
|
1476
|
+
throw new Error("elementType is required for create-element action");
|
|
1477
|
+
}
|
|
1478
|
+
if (!params.containerId) {
|
|
1479
|
+
throw new Error("containerId is required for create-element action");
|
|
1480
|
+
}
|
|
1481
|
+
return handleCreateElement({
|
|
1482
|
+
elementType: params.elementType,
|
|
1483
|
+
containerId: params.containerId,
|
|
1484
|
+
props: params.props,
|
|
1485
|
+
styles: params.styles
|
|
1486
|
+
});
|
|
1487
|
+
case "update-props":
|
|
1488
|
+
if (!params.elementId) {
|
|
1489
|
+
throw new Error("elementId is required for update-props action");
|
|
1490
|
+
}
|
|
1491
|
+
if (!params.props) {
|
|
1492
|
+
throw new Error("props is required for update-props action");
|
|
1493
|
+
}
|
|
1494
|
+
return handleUpdateProps({
|
|
1495
|
+
elementId: params.elementId,
|
|
1496
|
+
props: params.props
|
|
1497
|
+
});
|
|
1498
|
+
case "create-style":
|
|
1499
|
+
if (!params.elementId) {
|
|
1500
|
+
throw new Error("elementId is required for create-style action");
|
|
1501
|
+
}
|
|
1502
|
+
if (!params.styles) {
|
|
1503
|
+
throw new Error("styles is required for create-style action");
|
|
1504
|
+
}
|
|
1505
|
+
return handleCreateStyle({
|
|
1506
|
+
elementId: params.elementId,
|
|
1507
|
+
styleId: params.styleId,
|
|
1508
|
+
classesProp: params.classesProp,
|
|
1509
|
+
label: params.label,
|
|
1510
|
+
styles: params.styles,
|
|
1511
|
+
breakpoint: params.breakpoint,
|
|
1512
|
+
state: params.state,
|
|
1513
|
+
customCss: params.custom_css
|
|
1514
|
+
});
|
|
1515
|
+
case "get-styles":
|
|
1516
|
+
if (!params.elementId) {
|
|
1517
|
+
throw new Error("elementId is required for get-styles action");
|
|
1518
|
+
}
|
|
1519
|
+
return handleGetStyles(params.elementId);
|
|
1520
|
+
case "update-styles":
|
|
1521
|
+
if (!params.elementId) {
|
|
1522
|
+
throw new Error("elementId is required for update-styles action");
|
|
1523
|
+
}
|
|
1524
|
+
if (!params.styles) {
|
|
1525
|
+
throw new Error("styles is required for update-styles action");
|
|
1526
|
+
}
|
|
1527
|
+
return handleUpdateStyles({
|
|
1528
|
+
elementId: params.elementId,
|
|
1529
|
+
styleId: params.styleId,
|
|
1530
|
+
styles: params.styles,
|
|
1531
|
+
breakpoint: params.breakpoint,
|
|
1532
|
+
state: params.state
|
|
1533
|
+
});
|
|
1534
|
+
case "delete-style":
|
|
1535
|
+
if (!params.elementId) {
|
|
1536
|
+
throw new Error("elementId is required for delete-style action");
|
|
1537
|
+
}
|
|
1538
|
+
return handleDeleteStyle({
|
|
1539
|
+
elementId: params.elementId,
|
|
1540
|
+
styleId: params.styleId
|
|
1541
|
+
});
|
|
1542
|
+
case "delete":
|
|
1543
|
+
if (!params.elementId) {
|
|
1544
|
+
throw new Error("elementId is required for delete action");
|
|
1545
|
+
}
|
|
1546
|
+
return handleDeleteElement(params.elementId);
|
|
1547
|
+
case "duplicate":
|
|
1548
|
+
if (!params.elementId) {
|
|
1549
|
+
throw new Error("elementId is required for duplicate action");
|
|
1550
|
+
}
|
|
1551
|
+
return handleDuplicateElement(params.elementId);
|
|
1552
|
+
case "move":
|
|
1553
|
+
if (!params.elementId) {
|
|
1554
|
+
throw new Error("elementId is required for move action");
|
|
1555
|
+
}
|
|
1556
|
+
if (!params.targetContainerId) {
|
|
1557
|
+
throw new Error("targetContainerId is required for move action");
|
|
1558
|
+
}
|
|
1559
|
+
return handleMoveElement({
|
|
1560
|
+
elementId: params.elementId,
|
|
1561
|
+
targetContainerId: params.targetContainerId
|
|
1562
|
+
});
|
|
1563
|
+
case "select":
|
|
1564
|
+
if (params.elementIds && params.elementIds.length > 0) {
|
|
1565
|
+
return handleSelectMultipleElements(params.elementIds);
|
|
1566
|
+
}
|
|
1567
|
+
if (!params.elementId) {
|
|
1568
|
+
throw new Error("elementId or elementIds is required for select action");
|
|
1569
|
+
}
|
|
1570
|
+
return handleSelectElement(params.elementId);
|
|
1571
|
+
case "deselect":
|
|
1572
|
+
if (!params.elementId) {
|
|
1573
|
+
throw new Error("elementId is required for deselect action");
|
|
1574
|
+
}
|
|
1575
|
+
return handleDeselectElement(params.elementId);
|
|
1576
|
+
case "deselect-all":
|
|
1577
|
+
return handleDeselectAllElements();
|
|
1578
|
+
case "get-selected":
|
|
1579
|
+
return handleGetSelected();
|
|
1580
|
+
case "list-available-types":
|
|
1581
|
+
return handleListAvailableTypes();
|
|
1582
|
+
default:
|
|
1583
|
+
throw new Error(`Unknown action: ${params.action}`);
|
|
1584
|
+
}
|
|
1585
|
+
} catch (error) {
|
|
1586
|
+
const errorMessage = error instanceof Error ? error.message : String(error);
|
|
1587
|
+
throw new Error(`Failed to execute action "${params.action}": ${errorMessage}`);
|
|
820
1588
|
}
|
|
821
1589
|
}
|
|
822
|
-
function
|
|
823
|
-
|
|
1590
|
+
function initElementsTool() {
|
|
1591
|
+
(0, import_editor_mcp.getMCPByDomain)("elements").addTool({
|
|
1592
|
+
name: "elements",
|
|
1593
|
+
schema,
|
|
1594
|
+
description: `This tool manages individual Elementor atomic elements (v4).
|
|
1595
|
+
|
|
1596
|
+
**When to use this tool:**
|
|
1597
|
+
|
|
1598
|
+
Use this tool to create, update, delete, duplicate, move, and select individual atomic elements, as well as retrieve their schemas and current props.
|
|
1599
|
+
|
|
1600
|
+
**Available actions:**
|
|
1601
|
+
|
|
1602
|
+
- \`list-available-types\`: List all available atomic element types.
|
|
1603
|
+
- \`get-element-schema\`: Get the propsSchema and controls for an element type. Required before creating elements of a new type.
|
|
1604
|
+
- \`get-element-props\`: Get the current prop values for an existing element.
|
|
1605
|
+
- \`create-element\`: Create a new atomic element with specified props and styles (Important to match props and styles by the schema, use get-element-schema to get the schema first).
|
|
1606
|
+
- \`update-props\`: Update props for an existing element.
|
|
1607
|
+
- \`create-style\`: Create a new style definition for an element.
|
|
1608
|
+
- \`get-styles\`: Get all style definitions for an element.
|
|
1609
|
+
- \`update-styles\`: Update styles for an existing element's style variant.
|
|
1610
|
+
- \`delete-style\`: Delete a style definition from an element.
|
|
1611
|
+
- \`delete\`: Delete an element.
|
|
1612
|
+
- \`duplicate\`: Duplicate an existing element.
|
|
1613
|
+
- \`move\`: Move an element to a different container.
|
|
1614
|
+
- \`select\`: Select one or more elements.
|
|
1615
|
+
- \`deselect\`: Deselect a specific element.
|
|
1616
|
+
- \`deselect-all\`: Deselect all selected elements.
|
|
1617
|
+
- \`get-selected\`: Get currently selected elements.
|
|
1618
|
+
|
|
1619
|
+
**Constraints:**
|
|
1620
|
+
|
|
1621
|
+
- Before creating an element of a certain type for the first time, you MUST call \`get-element-schema\` to retrieve its schema.
|
|
1622
|
+
- You can only update props for existing elements.
|
|
1623
|
+
- All props must match the element type's propsSchema keys.
|
|
1624
|
+
- Element types must be atomic (have atomic_controls and atomic_props_schema).
|
|
1625
|
+
- Container IDs must exist and be valid before create/move operations.
|
|
1626
|
+
|
|
1627
|
+
** Must do with every operation **
|
|
1628
|
+
As of the user can ask in multiple ways the creation of the element, you need to first get the list of available types with "list-available-types" action.
|
|
1629
|
+
After getting it, convert to the most relevant type that the user requested and if this is not clear, request for user input.
|
|
1630
|
+
After finding out the proper type, get the schema for it with "get-element-schema" action.
|
|
1631
|
+
|
|
1632
|
+
** Styles and Settings propUtils **
|
|
1633
|
+
Getting the schema is important as it introduces the propUtils for the styles and settings.
|
|
1634
|
+
You can use the propUtils to create, update, delete, and get the values of the styles and settings.
|
|
1635
|
+
Settings exists in the result of the get-element-schema action -> propsSchema.
|
|
1636
|
+
Styles exists in the result of the get-element-schema action -> stylesSchema.
|
|
1637
|
+
|
|
1638
|
+
**Examples:**
|
|
1639
|
+
|
|
1640
|
+
Get schema for heading element:
|
|
1641
|
+
\`\`\`json
|
|
1642
|
+
{ "action": "get-element-schema", "elementType": "e-heading" }
|
|
1643
|
+
\`\`\`
|
|
1644
|
+
|
|
1645
|
+
Create a heading element:
|
|
1646
|
+
\`\`\`json
|
|
1647
|
+
{ "action": "create-element", "elementType": "e-heading", "containerId": "document", "props": { "title": { $$type: "string", "value": "Hello World" } } }
|
|
1648
|
+
\`\`\`
|
|
1649
|
+
|
|
1650
|
+
Update element props:
|
|
1651
|
+
\`\`\`json
|
|
1652
|
+
{ "action": "update-props", "elementId": "abc123", "props": { "title": "Updated Title" } }
|
|
1653
|
+
\`\`\`
|
|
1654
|
+
|
|
1655
|
+
Create element style:
|
|
1656
|
+
\`\`\`json
|
|
1657
|
+
{ "action": "create-style", "elementId": "abc123", "styles": { "padding": "20px", "margin": "10px" } }
|
|
1658
|
+
\`\`\`
|
|
1659
|
+
|
|
1660
|
+
Get element styles:
|
|
1661
|
+
\`\`\`json
|
|
1662
|
+
{ "action": "get-styles", "elementId": "abc123" }
|
|
1663
|
+
\`\`\`
|
|
1664
|
+
|
|
1665
|
+
Update element styles:
|
|
1666
|
+
\`\`\`json
|
|
1667
|
+
{ "action": "update-styles", "elementId": "abc123", "styles": { "padding": "20px", "margin": "10px" } }
|
|
1668
|
+
\`\`\`
|
|
1669
|
+
|
|
1670
|
+
Delete element style:
|
|
1671
|
+
\`\`\`json
|
|
1672
|
+
{ "action": "delete-style", "elementId": "abc123", "styleId": "style-id-123" }
|
|
1673
|
+
\`\`\``,
|
|
1674
|
+
handler: async (params) => {
|
|
1675
|
+
return routeAction(params);
|
|
1676
|
+
}
|
|
1677
|
+
});
|
|
824
1678
|
}
|
|
825
|
-
|
|
826
|
-
|
|
1679
|
+
|
|
1680
|
+
// src/mcp/index.ts
|
|
1681
|
+
function initMcp() {
|
|
1682
|
+
const { setMCPDescription } = (0, import_editor_mcp2.getMCPByDomain)("elements");
|
|
1683
|
+
setMCPDescription("Tools for managing atomic elements in Elementor v4 editor");
|
|
1684
|
+
initElementsTool();
|
|
827
1685
|
}
|
|
828
1686
|
// Annotate the CommonJS export names for ESM import in node:
|
|
829
1687
|
0 && (module.exports = {
|
|
@@ -833,33 +1691,45 @@ function isElementorElement(element) {
|
|
|
833
1691
|
createElements,
|
|
834
1692
|
deleteElement,
|
|
835
1693
|
deleteElementStyle,
|
|
1694
|
+
dropElement,
|
|
836
1695
|
duplicateElement,
|
|
837
1696
|
duplicateElements,
|
|
838
1697
|
generateElementId,
|
|
839
1698
|
getAnchoredAncestorId,
|
|
840
1699
|
getAnchoredDescendantId,
|
|
841
1700
|
getContainer,
|
|
1701
|
+
getCurrentDocumentContainer,
|
|
842
1702
|
getCurrentDocumentId,
|
|
1703
|
+
getElementEditorSettings,
|
|
1704
|
+
getElementInteractions,
|
|
843
1705
|
getElementLabel,
|
|
844
1706
|
getElementSetting,
|
|
845
1707
|
getElementSettings,
|
|
846
1708
|
getElementStyles,
|
|
1709
|
+
getElementType,
|
|
847
1710
|
getElements,
|
|
848
1711
|
getLinkInLinkRestriction,
|
|
849
1712
|
getSelectedElements,
|
|
850
1713
|
getWidgetsCache,
|
|
1714
|
+
initElementsMcp,
|
|
851
1715
|
isElementAnchored,
|
|
1716
|
+
moveElement,
|
|
1717
|
+
moveElements,
|
|
1718
|
+
playElementInteractions,
|
|
852
1719
|
removeElements,
|
|
853
1720
|
replaceElement,
|
|
854
1721
|
selectElement,
|
|
855
1722
|
shouldCreateNewLocalStyle,
|
|
856
1723
|
styleRerenderEvents,
|
|
1724
|
+
updateElementEditorSettings,
|
|
1725
|
+
updateElementInteractions,
|
|
857
1726
|
updateElementSettings,
|
|
858
1727
|
updateElementStyle,
|
|
859
1728
|
useElementChildren,
|
|
1729
|
+
useElementEditorSettings,
|
|
1730
|
+
useElementInteractions,
|
|
860
1731
|
useElementSetting,
|
|
861
1732
|
useElementSettings,
|
|
862
|
-
useElementType,
|
|
863
1733
|
useParentElement,
|
|
864
1734
|
useSelectedElement
|
|
865
1735
|
});
|