@elementor/editor-canvas 0.11.1 → 0.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +10 -10
- package/CHANGELOG.md +46 -0
- package/dist/index.d.mts +6 -1
- package/dist/index.d.ts +6 -1
- package/dist/index.js +406 -45
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +419 -46
- package/dist/index.mjs.map +1 -1
- package/package.json +11 -10
- package/src/__tests__/__mocks__/styles-schema.ts +72 -3
- package/src/__tests__/init-styles-renderer.test.ts +19 -5
- package/src/__tests__/mock-attachment-data.ts +15 -0
- package/src/__tests__/prop-types.ts +65 -0
- package/src/__tests__/settings-props-resolver.test.ts +193 -0
- package/src/__tests__/styles-prop-resolver.test.ts +59 -16
- package/src/index.ts +1 -0
- package/src/init-settings-transformers.ts +19 -0
- package/src/init-style-transformers.ts +13 -9
- package/src/init-styles-renderer.ts +9 -3
- package/src/init.tsx +8 -0
- package/src/legacy/create-element-type.ts +84 -0
- package/src/legacy/init-legacy-views.ts +22 -0
- package/src/legacy/types.ts +60 -0
- package/src/settings-transformers-registry.ts +3 -0
- package/src/style-commands/__tests__/paste-style.test.ts +554 -0
- package/src/style-commands/__tests__/reset-style.test.ts +153 -0
- package/src/style-commands/init-style-commands.ts +7 -0
- package/src/style-commands/paste-style.ts +53 -0
- package/src/style-commands/reset-style.ts +34 -0
- package/src/style-commands/undoable-actions/paste-element-style.ts +107 -0
- package/src/style-commands/undoable-actions/reset-element-style.ts +60 -0
- package/src/style-commands/utils.ts +62 -0
- package/src/transformers/settings/array-transformer.ts +5 -0
- package/src/transformers/settings/link-transformer.ts +14 -0
- package/src/transformers/{styles → shared}/image-src-transformer.ts +2 -2
- package/src/transformers/shared/image-transformer.ts +41 -0
- package/src/transformers/shared/plain-transformer.ts +5 -0
- package/src/transformers/styles/background-color-overlay-transformer.ts +13 -3
- package/src/transformers/styles/background-gradient-overlay-transformer.ts +16 -0
- package/src/transformers/styles/background-image-overlay-transformer.ts +6 -2
- package/src/transformers/styles/color-stop-transformer.ts +10 -0
- package/src/transformers/styles/image-attachment-transformer.ts +0 -15
- package/src/transformers/styles/image-transformer.ts +0 -34
- package/src/transformers/styles/primitive-transformer.ts +0 -3
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
|
|
2
|
-
> @elementor/editor-canvas@0.
|
|
2
|
+
> @elementor/editor-canvas@0.13.0 build
|
|
3
3
|
> tsup --config=../../tsup.build.ts
|
|
4
4
|
|
|
5
5
|
[34mCLI[39m Building entry: src/index.ts
|
|
@@ -10,13 +10,13 @@
|
|
|
10
10
|
[34mCLI[39m Cleaning output folder
|
|
11
11
|
[34mESM[39m Build start
|
|
12
12
|
[34mCJS[39m Build start
|
|
13
|
-
[
|
|
14
|
-
[
|
|
15
|
-
[
|
|
16
|
-
[
|
|
17
|
-
[
|
|
18
|
-
[
|
|
13
|
+
[32mESM[39m [1mdist/index.mjs [22m[32m29.82 KB[39m
|
|
14
|
+
[32mESM[39m [1mdist/index.mjs.map [22m[32m62.58 KB[39m
|
|
15
|
+
[32mESM[39m ⚡️ Build success in 351ms
|
|
16
|
+
[32mCJS[39m [1mdist/index.js [22m[32m32.49 KB[39m
|
|
17
|
+
[32mCJS[39m [1mdist/index.js.map [22m[32m62.41 KB[39m
|
|
18
|
+
[32mCJS[39m ⚡️ Build success in 359ms
|
|
19
19
|
[34mDTS[39m Build start
|
|
20
|
-
[32mDTS[39m ⚡️ Build success in
|
|
21
|
-
[32mDTS[39m [1mdist/index.d.mts [22m[
|
|
22
|
-
[32mDTS[39m [1mdist/index.d.ts [22m[
|
|
20
|
+
[32mDTS[39m ⚡️ Build success in 21312ms
|
|
21
|
+
[32mDTS[39m [1mdist/index.d.mts [22m[32m751.00 B[39m
|
|
22
|
+
[32mDTS[39m [1mdist/index.d.ts [22m[32m751.00 B[39m
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,51 @@
|
|
|
1
1
|
# @elementor/editor-canvas
|
|
2
2
|
|
|
3
|
+
## 0.13.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- b8a7725: Add settings transformers
|
|
8
|
+
- 98d2a8e: Added support to atomic elements for command "document/elements/paste-style"
|
|
9
|
+
- 4c2935b: Added support to atomic elements for command "document/elements/reset-style"
|
|
10
|
+
- 4510821: Remove 'save' options from the editor context menu.
|
|
11
|
+
- c002cba: Change background color overlay shape to support variables
|
|
12
|
+
- 070b92c: Register legacy views
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- 51432b9: The editor loader disappears before the styles finish rendering
|
|
17
|
+
- Updated dependencies [b8a7725]
|
|
18
|
+
- Updated dependencies [e798985]
|
|
19
|
+
- Updated dependencies [4c2935b]
|
|
20
|
+
- Updated dependencies [8231e7c]
|
|
21
|
+
- Updated dependencies [19f5dfe]
|
|
22
|
+
- Updated dependencies [c002cba]
|
|
23
|
+
- Updated dependencies [51432b9]
|
|
24
|
+
- Updated dependencies [070b92c]
|
|
25
|
+
- Updated dependencies [0909b4b]
|
|
26
|
+
- @elementor/wp-media@0.6.0
|
|
27
|
+
- @elementor/editor-v1-adapters@0.11.0
|
|
28
|
+
- @elementor/editor-props@0.11.0
|
|
29
|
+
- @elementor/editor-elements@0.6.3
|
|
30
|
+
- @elementor/editor@0.18.3
|
|
31
|
+
- @elementor/editor-styles-repository@0.7.6
|
|
32
|
+
- @elementor/editor-responsive@0.13.3
|
|
33
|
+
- @elementor/editor-styles@0.6.3
|
|
34
|
+
|
|
35
|
+
## 0.12.0
|
|
36
|
+
|
|
37
|
+
### Minor Changes
|
|
38
|
+
|
|
39
|
+
- 7d37fc1: Add background gradient overlay control
|
|
40
|
+
|
|
41
|
+
### Patch Changes
|
|
42
|
+
|
|
43
|
+
- Updated dependencies [7d37fc1]
|
|
44
|
+
- @elementor/editor-props@0.10.0
|
|
45
|
+
- @elementor/editor-styles-repository@0.7.5
|
|
46
|
+
- @elementor/editor-elements@0.6.2
|
|
47
|
+
- @elementor/editor-styles@0.6.2
|
|
48
|
+
|
|
3
49
|
## 0.11.1
|
|
4
50
|
|
|
5
51
|
### Patch Changes
|
package/dist/index.d.mts
CHANGED
|
@@ -15,4 +15,9 @@ declare const styleTransformersRegistry: {
|
|
|
15
15
|
all(): TransformersMap;
|
|
16
16
|
};
|
|
17
17
|
|
|
18
|
-
|
|
18
|
+
declare const settingsTransformersRegistry: {
|
|
19
|
+
register(name: TransformerName, transformer: AnyTransformer): /*elided*/ any;
|
|
20
|
+
all(): TransformersMap;
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
export { settingsTransformersRegistry, styleTransformersRegistry };
|
package/dist/index.d.ts
CHANGED
|
@@ -15,4 +15,9 @@ declare const styleTransformersRegistry: {
|
|
|
15
15
|
all(): TransformersMap;
|
|
16
16
|
};
|
|
17
17
|
|
|
18
|
-
|
|
18
|
+
declare const settingsTransformersRegistry: {
|
|
19
|
+
register(name: TransformerName, transformer: AnyTransformer): /*elided*/ any;
|
|
20
|
+
all(): TransformersMap;
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
export { settingsTransformersRegistry, styleTransformersRegistry };
|
package/dist/index.js
CHANGED
|
@@ -30,6 +30,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
30
30
|
// src/index.ts
|
|
31
31
|
var index_exports = {};
|
|
32
32
|
__export(index_exports, {
|
|
33
|
+
settingsTransformersRegistry: () => settingsTransformersRegistry,
|
|
33
34
|
styleTransformersRegistry: () => styleTransformersRegistry
|
|
34
35
|
});
|
|
35
36
|
module.exports = __toCommonJS(index_exports);
|
|
@@ -175,18 +176,89 @@ function createTransformersRegistry() {
|
|
|
175
176
|
};
|
|
176
177
|
}
|
|
177
178
|
|
|
178
|
-
// src/
|
|
179
|
-
var
|
|
179
|
+
// src/settings-transformers-registry.ts
|
|
180
|
+
var settingsTransformersRegistry = createTransformersRegistry();
|
|
180
181
|
|
|
181
182
|
// src/transformers/create-transformer.ts
|
|
182
183
|
function createTransformer(cb) {
|
|
183
184
|
return cb;
|
|
184
185
|
}
|
|
185
186
|
|
|
187
|
+
// src/transformers/settings/array-transformer.ts
|
|
188
|
+
var arrayTransformer = createTransformer((value) => {
|
|
189
|
+
return value.filter(Boolean);
|
|
190
|
+
});
|
|
191
|
+
|
|
192
|
+
// src/transformers/settings/link-transformer.ts
|
|
193
|
+
var linkTransformer = createTransformer(({ destination, isTargetBlank }) => {
|
|
194
|
+
return {
|
|
195
|
+
// The real post URL is not relevant in the Editor.
|
|
196
|
+
href: typeof destination === "number" ? "#post-id-" + destination : destination,
|
|
197
|
+
target: isTargetBlank ? "_blank" : "_self"
|
|
198
|
+
};
|
|
199
|
+
});
|
|
200
|
+
|
|
201
|
+
// src/transformers/shared/image-src-transformer.ts
|
|
202
|
+
var imageSrcTransformer = createTransformer((value) => ({
|
|
203
|
+
id: value.id ?? null,
|
|
204
|
+
url: value.url ?? null
|
|
205
|
+
}));
|
|
206
|
+
|
|
207
|
+
// src/transformers/shared/image-transformer.ts
|
|
208
|
+
var import_wp_media = require("@elementor/wp-media");
|
|
209
|
+
var imageTransformer = createTransformer(async (value) => {
|
|
210
|
+
const { src, size: size2 } = value;
|
|
211
|
+
if (!src?.id) {
|
|
212
|
+
return src?.url ? { src: src.url } : null;
|
|
213
|
+
}
|
|
214
|
+
const attachment = await (0, import_wp_media.getMediaAttachment)({ id: src.id });
|
|
215
|
+
const sizedAttachment = attachment?.sizes?.[size2 ?? ""];
|
|
216
|
+
if (sizedAttachment) {
|
|
217
|
+
return {
|
|
218
|
+
src: sizedAttachment.url,
|
|
219
|
+
height: sizedAttachment.height,
|
|
220
|
+
width: sizedAttachment.width
|
|
221
|
+
};
|
|
222
|
+
}
|
|
223
|
+
if (attachment) {
|
|
224
|
+
return {
|
|
225
|
+
src: attachment.url,
|
|
226
|
+
height: attachment.height,
|
|
227
|
+
width: attachment.width
|
|
228
|
+
};
|
|
229
|
+
}
|
|
230
|
+
return null;
|
|
231
|
+
});
|
|
232
|
+
|
|
233
|
+
// src/transformers/shared/plain-transformer.ts
|
|
234
|
+
var plainTransformer = createTransformer((value) => {
|
|
235
|
+
return value;
|
|
236
|
+
});
|
|
237
|
+
|
|
238
|
+
// src/init-settings-transformers.ts
|
|
239
|
+
function initSettingsTransformers() {
|
|
240
|
+
settingsTransformersRegistry.register("string", plainTransformer).register("url", plainTransformer).register("number", plainTransformer).register("boolean", plainTransformer).register("classes", arrayTransformer).register("link", linkTransformer).register("image", imageTransformer).register("image-src", imageSrcTransformer).register("image-attachment-id", plainTransformer);
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
// src/style-transformers-registry.ts
|
|
244
|
+
var styleTransformersRegistry = createTransformersRegistry();
|
|
245
|
+
|
|
186
246
|
// src/transformers/styles/background-color-overlay-transformer.ts
|
|
187
|
-
var backgroundColorOverlayTransformer = createTransformer(
|
|
188
|
-
|
|
189
|
-
)
|
|
247
|
+
var backgroundColorOverlayTransformer = createTransformer((value) => {
|
|
248
|
+
const { color = null } = value;
|
|
249
|
+
if (!color) {
|
|
250
|
+
return null;
|
|
251
|
+
}
|
|
252
|
+
return `linear-gradient(${color}, ${color})`;
|
|
253
|
+
});
|
|
254
|
+
|
|
255
|
+
// src/transformers/styles/background-gradient-overlay-transformer.ts
|
|
256
|
+
var backgroundGradientOverlayTransformer = createTransformer((value) => {
|
|
257
|
+
if (value.type === "radial") {
|
|
258
|
+
return `radial-gradient(circle at ${value.positions}, ${value.stops})`;
|
|
259
|
+
}
|
|
260
|
+
return `linear-gradient(${value.angle}deg, ${value.stops})`;
|
|
261
|
+
});
|
|
190
262
|
|
|
191
263
|
// src/transformers/styles/background-image-overlay-transformer.ts
|
|
192
264
|
var DEFAULT_POSITION_VALUE = "0% 0%";
|
|
@@ -195,8 +267,9 @@ var backgroundImageOverlayTransformer = createTransformer((value) => {
|
|
|
195
267
|
if (!image) {
|
|
196
268
|
return null;
|
|
197
269
|
}
|
|
270
|
+
const src = image.src ? `url(${image.src})` : null;
|
|
198
271
|
const backgroundStyles = [
|
|
199
|
-
|
|
272
|
+
src,
|
|
200
273
|
repeat,
|
|
201
274
|
attachment,
|
|
202
275
|
size2 ? `${position || DEFAULT_POSITION_VALUE} / ${size2}` : position
|
|
@@ -221,6 +294,11 @@ var backgroundTransformer = createTransformer((value) => {
|
|
|
221
294
|
return `${overlays} ${color}`.trim();
|
|
222
295
|
});
|
|
223
296
|
|
|
297
|
+
// src/transformers/styles/color-stop-transformer.ts
|
|
298
|
+
var colorStopTransformer = createTransformer(
|
|
299
|
+
(value) => `${value?.color} ${value?.offset ?? 0}%`
|
|
300
|
+
);
|
|
301
|
+
|
|
224
302
|
// src/transformers/styles/create-combine-array-transformer.ts
|
|
225
303
|
var createCombineArrayTransformer = (delimiter) => {
|
|
226
304
|
return createTransformer((value) => value.filter(Boolean).join(delimiter));
|
|
@@ -248,42 +326,6 @@ var createMultiPropsTransformer = (keys, keyGenerator) => {
|
|
|
248
326
|
});
|
|
249
327
|
};
|
|
250
328
|
|
|
251
|
-
// src/transformers/styles/image-attachment-transformer.ts
|
|
252
|
-
var import_wp_media = require("@elementor/wp-media");
|
|
253
|
-
var imageAttachmentTransformer = createTransformer(async (value) => {
|
|
254
|
-
const attachment = await (0, import_wp_media.getMediaAttachment)({ id: value });
|
|
255
|
-
if (!attachment) {
|
|
256
|
-
return null;
|
|
257
|
-
}
|
|
258
|
-
return attachment;
|
|
259
|
-
});
|
|
260
|
-
|
|
261
|
-
// src/transformers/styles/image-src-transformer.ts
|
|
262
|
-
var imageSrcTransformer = createTransformer((value) => ({
|
|
263
|
-
attachment: value.id,
|
|
264
|
-
url: value.url
|
|
265
|
-
}));
|
|
266
|
-
|
|
267
|
-
// src/transformers/styles/image-transformer.ts
|
|
268
|
-
var imageTransformer = createTransformer((value) => {
|
|
269
|
-
const { src, size: size2 } = value;
|
|
270
|
-
if (src?.url) {
|
|
271
|
-
return `url(${src.url})`;
|
|
272
|
-
}
|
|
273
|
-
const sizeUrl = src?.attachment?.sizes?.[size2 ?? ""]?.url;
|
|
274
|
-
if (sizeUrl) {
|
|
275
|
-
return `url(${sizeUrl})`;
|
|
276
|
-
}
|
|
277
|
-
const attachmentUrl = src?.attachment?.url;
|
|
278
|
-
if (attachmentUrl) {
|
|
279
|
-
return `url(${attachmentUrl})`;
|
|
280
|
-
}
|
|
281
|
-
return null;
|
|
282
|
-
});
|
|
283
|
-
|
|
284
|
-
// src/transformers/styles/primitive-transformer.ts
|
|
285
|
-
var primitiveTransformer = createTransformer((value) => value);
|
|
286
|
-
|
|
287
329
|
// src/transformers/styles/shadow-transformer.ts
|
|
288
330
|
var shadowTransformer = createTransformer((value) => {
|
|
289
331
|
return [value.hOffset, value.vOffset, value.blur, value.spread, value.color, value.position].filter(Boolean).join(" ");
|
|
@@ -312,7 +354,7 @@ function initStyleTransformers() {
|
|
|
312
354
|
["block-start", "block-end", "inline-start", "inline-end"],
|
|
313
355
|
({ propKey, key }) => `${propKey}-${key}`
|
|
314
356
|
)
|
|
315
|
-
).register("color",
|
|
357
|
+
).register("color", plainTransformer).register("number", plainTransformer).register("string", plainTransformer).register("url", plainTransformer).register("box-shadow", createCombineArrayTransformer(",")).register("background", backgroundTransformer).register("background-overlay", createCombineArrayTransformer(",")).register("background-color-overlay", backgroundColorOverlayTransformer).register("background-image-overlay", backgroundImageOverlayTransformer).register("background-gradient-overlay", backgroundGradientOverlayTransformer).register("gradient-color-stop", createCombineArrayTransformer(",")).register("color-stop", colorStopTransformer).register("background-image-position-offset", backgroundImagePositionOffsetTransformer).register("background-image-size-scale", backgroundImageSizeScaleTransformer).register("image-attachment-id", plainTransformer).register("image-src", imageSrcTransformer).register("image", imageTransformer).register(
|
|
316
358
|
"layout-direction",
|
|
317
359
|
createMultiPropsTransformer(["row", "column"], ({ propKey, key }) => `${key}-${propKey}`)
|
|
318
360
|
).register(
|
|
@@ -496,7 +538,7 @@ function initStylesRenderer() {
|
|
|
496
538
|
schema: (0, import_editor_styles.getStylesSchema)(),
|
|
497
539
|
onPropResolve: enqueueUsedFonts
|
|
498
540
|
});
|
|
499
|
-
|
|
541
|
+
const injectStyleElements = async () => {
|
|
500
542
|
const styleContainer = getStylesContainer();
|
|
501
543
|
const styles = import_editor_styles_repository.stylesRepository.all().reverse();
|
|
502
544
|
const breakpoints = (0, import_editor_responsive.getBreakpointsMap)();
|
|
@@ -511,7 +553,9 @@ function initStylesRenderer() {
|
|
|
511
553
|
selectorPrefix: SELECTOR_PREFIX,
|
|
512
554
|
signal: abortController.signal
|
|
513
555
|
});
|
|
514
|
-
}
|
|
556
|
+
};
|
|
557
|
+
import_editor_styles_repository.stylesRepository.subscribe(injectStyleElements);
|
|
558
|
+
(0, import_editor_v1_adapters2.registerDataHook)("after", "editor/documents/attach-preview", injectStyleElements);
|
|
515
559
|
});
|
|
516
560
|
}
|
|
517
561
|
function getStylesContainer() {
|
|
@@ -537,10 +581,326 @@ function enqueueUsedFonts({ key, value }) {
|
|
|
537
581
|
enqueueFont(value);
|
|
538
582
|
}
|
|
539
583
|
|
|
584
|
+
// src/legacy/init-legacy-views.ts
|
|
585
|
+
var import_editor_elements2 = require("@elementor/editor-elements");
|
|
586
|
+
var import_editor_v1_adapters3 = require("@elementor/editor-v1-adapters");
|
|
587
|
+
|
|
588
|
+
// src/legacy/create-element-type.ts
|
|
589
|
+
function createElementType(type) {
|
|
590
|
+
const legacyWindow = window;
|
|
591
|
+
return class extends legacyWindow.elementor.modules.elements.types.Widget {
|
|
592
|
+
getType() {
|
|
593
|
+
return type;
|
|
594
|
+
}
|
|
595
|
+
getView() {
|
|
596
|
+
return createElementView();
|
|
597
|
+
}
|
|
598
|
+
};
|
|
599
|
+
}
|
|
600
|
+
function createElementView() {
|
|
601
|
+
const legacyWindow = window;
|
|
602
|
+
return class extends legacyWindow.elementor.modules.elements.views.Widget {
|
|
603
|
+
// Dispatch `render` event so the overlay layer will be updated
|
|
604
|
+
onRender(...args) {
|
|
605
|
+
super.onRender(...args);
|
|
606
|
+
this.#dispatchEvent("elementor/preview/atomic-widget/render");
|
|
607
|
+
}
|
|
608
|
+
// Dispatch `destroy` event so the overlay layer will be updated
|
|
609
|
+
onDestroy(...args) {
|
|
610
|
+
super.onDestroy(...args);
|
|
611
|
+
this.#dispatchEvent("elementor/preview/atomic-widget/destroy");
|
|
612
|
+
}
|
|
613
|
+
attributes() {
|
|
614
|
+
return {
|
|
615
|
+
...super.attributes(),
|
|
616
|
+
// Mark the widget as atomic, so external APIs (such as the overlay layer) can reference it.
|
|
617
|
+
"data-atomic": "",
|
|
618
|
+
// Make the wrapper is non-existent in terms of CSS to mimic the frontend DOM tree.
|
|
619
|
+
style: "display: contents !important;"
|
|
620
|
+
};
|
|
621
|
+
}
|
|
622
|
+
// Removes behaviors that are not needed for atomic widgets (that are implemented in the overlay layer).
|
|
623
|
+
behaviors() {
|
|
624
|
+
const disabledBehaviors = ["InlineEditing", "Draggable", "Resizable"];
|
|
625
|
+
const behaviorsAsEntries = Object.entries(super.behaviors()).filter(
|
|
626
|
+
([key]) => !disabledBehaviors.includes(key)
|
|
627
|
+
);
|
|
628
|
+
return Object.fromEntries(behaviorsAsEntries);
|
|
629
|
+
}
|
|
630
|
+
// Change the drag handle because the $el is not the draggable element (`display: contents`).
|
|
631
|
+
getDomElement() {
|
|
632
|
+
return this.$el.find(":first-child");
|
|
633
|
+
}
|
|
634
|
+
// Remove the overlay, so we can use the new overlay layer.
|
|
635
|
+
getHandlesOverlay() {
|
|
636
|
+
return null;
|
|
637
|
+
}
|
|
638
|
+
#dispatchEvent(eventType) {
|
|
639
|
+
window.top?.dispatchEvent(
|
|
640
|
+
new CustomEvent(eventType, {
|
|
641
|
+
detail: { id: this.model.get("id") }
|
|
642
|
+
})
|
|
643
|
+
);
|
|
644
|
+
}
|
|
645
|
+
getContextMenuGroups() {
|
|
646
|
+
return super.getContextMenuGroups().filter((group) => group.name !== "save");
|
|
647
|
+
}
|
|
648
|
+
};
|
|
649
|
+
}
|
|
650
|
+
|
|
651
|
+
// src/legacy/init-legacy-views.ts
|
|
652
|
+
function initLegacyViews() {
|
|
653
|
+
(0, import_editor_v1_adapters3.__privateListenTo)((0, import_editor_v1_adapters3.v1ReadyEvent)(), () => {
|
|
654
|
+
const config = (0, import_editor_elements2.getWidgetsCache)() ?? {};
|
|
655
|
+
const legacyWindow = window;
|
|
656
|
+
Object.entries(config).forEach(([type, element]) => {
|
|
657
|
+
if (!element.atomic) {
|
|
658
|
+
return;
|
|
659
|
+
}
|
|
660
|
+
const ElementType = createElementType(type);
|
|
661
|
+
legacyWindow.elementor.elementsManager.registerElementType(new ElementType());
|
|
662
|
+
});
|
|
663
|
+
});
|
|
664
|
+
}
|
|
665
|
+
|
|
666
|
+
// src/style-commands/paste-style.ts
|
|
667
|
+
var import_editor_v1_adapters5 = require("@elementor/editor-v1-adapters");
|
|
668
|
+
|
|
669
|
+
// src/style-commands/undoable-actions/paste-element-style.ts
|
|
670
|
+
var import_editor_elements4 = require("@elementor/editor-elements");
|
|
671
|
+
var import_editor_styles_repository2 = require("@elementor/editor-styles-repository");
|
|
672
|
+
var import_editor_v1_adapters4 = require("@elementor/editor-v1-adapters");
|
|
673
|
+
var import_i18n2 = require("@wordpress/i18n");
|
|
674
|
+
|
|
675
|
+
// src/style-commands/utils.ts
|
|
676
|
+
var import_editor_elements3 = require("@elementor/editor-elements");
|
|
677
|
+
var import_editor_props2 = require("@elementor/editor-props");
|
|
678
|
+
var import_i18n = require("@wordpress/i18n");
|
|
679
|
+
function hasAtomicWidgets(args) {
|
|
680
|
+
const { containers = [args.container] } = args;
|
|
681
|
+
return containers.some(isAtomicWidget);
|
|
682
|
+
}
|
|
683
|
+
function isAtomicWidget(container) {
|
|
684
|
+
if (!container) {
|
|
685
|
+
return false;
|
|
686
|
+
}
|
|
687
|
+
return Boolean(getContainerSchema(container));
|
|
688
|
+
}
|
|
689
|
+
function getClassesProp(container) {
|
|
690
|
+
const propsSchema = getContainerSchema(container);
|
|
691
|
+
if (!propsSchema) {
|
|
692
|
+
return null;
|
|
693
|
+
}
|
|
694
|
+
const [propKey] = Object.entries(propsSchema).find(
|
|
695
|
+
([, propType]) => propType.kind === "plain" && propType.key === import_editor_props2.CLASSES_PROP_KEY
|
|
696
|
+
) ?? [];
|
|
697
|
+
return propKey ?? null;
|
|
698
|
+
}
|
|
699
|
+
function getContainerSchema(container) {
|
|
700
|
+
const type = container?.model.get("widgetType") || container?.model.get("elType");
|
|
701
|
+
const widgetsCache = (0, import_editor_elements3.getWidgetsCache)();
|
|
702
|
+
const elementType = widgetsCache?.[type];
|
|
703
|
+
return elementType?.atomic_props_schema ?? null;
|
|
704
|
+
}
|
|
705
|
+
function getClipboardElements(storageKey = "clipboard") {
|
|
706
|
+
try {
|
|
707
|
+
const storedData = JSON.parse(localStorage.getItem("elementor") ?? "{}");
|
|
708
|
+
return storedData[storageKey]?.elements;
|
|
709
|
+
} catch {
|
|
710
|
+
return void 0;
|
|
711
|
+
}
|
|
712
|
+
}
|
|
713
|
+
function getTitleForContainers(containers) {
|
|
714
|
+
return containers.length > 1 ? (0, import_i18n.__)("Elements", "elementor") : (0, import_editor_elements3.getElementLabel)(containers[0].id);
|
|
715
|
+
}
|
|
716
|
+
|
|
717
|
+
// src/style-commands/undoable-actions/paste-element-style.ts
|
|
718
|
+
var undoablePasteElementStyle = () => (0, import_editor_v1_adapters4.undoable)(
|
|
719
|
+
{
|
|
720
|
+
do: ({ containers, newStyle }) => {
|
|
721
|
+
return containers.map((container) => {
|
|
722
|
+
const elementId = container.id;
|
|
723
|
+
const classesProp = getClassesProp(container);
|
|
724
|
+
if (!classesProp) {
|
|
725
|
+
return null;
|
|
726
|
+
}
|
|
727
|
+
const originalStyles = (0, import_editor_elements4.getElementStyles)(container.id);
|
|
728
|
+
const [styleId, styleDef] = Object.entries(originalStyles ?? {})[0] ?? [];
|
|
729
|
+
const originalStyle = Object.keys(styleDef ?? {}).length ? styleDef : null;
|
|
730
|
+
const revertData = {
|
|
731
|
+
styleId,
|
|
732
|
+
originalStyle
|
|
733
|
+
};
|
|
734
|
+
if (styleId) {
|
|
735
|
+
newStyle.variants.forEach(({ meta, props }) => {
|
|
736
|
+
(0, import_editor_elements4.updateElementStyle)({
|
|
737
|
+
elementId,
|
|
738
|
+
styleId,
|
|
739
|
+
meta,
|
|
740
|
+
props
|
|
741
|
+
});
|
|
742
|
+
});
|
|
743
|
+
} else {
|
|
744
|
+
const [firstVariant] = newStyle.variants;
|
|
745
|
+
const additionalVariants = newStyle.variants.slice(1);
|
|
746
|
+
revertData.styleId = (0, import_editor_elements4.createElementStyle)({
|
|
747
|
+
elementId,
|
|
748
|
+
classesProp,
|
|
749
|
+
label: import_editor_styles_repository2.LOCAL_STYLES_RESERVED_LABEL,
|
|
750
|
+
...firstVariant,
|
|
751
|
+
additionalVariants
|
|
752
|
+
});
|
|
753
|
+
}
|
|
754
|
+
return revertData;
|
|
755
|
+
});
|
|
756
|
+
},
|
|
757
|
+
undo: ({ containers }, revertDataItems) => {
|
|
758
|
+
containers.forEach((container, index) => {
|
|
759
|
+
const revertData = revertDataItems[index];
|
|
760
|
+
if (!revertData) {
|
|
761
|
+
return;
|
|
762
|
+
}
|
|
763
|
+
if (!revertData.originalStyle) {
|
|
764
|
+
(0, import_editor_elements4.deleteElementStyle)(container.id, revertData.styleId);
|
|
765
|
+
return;
|
|
766
|
+
}
|
|
767
|
+
const classesProp = getClassesProp(container);
|
|
768
|
+
if (!classesProp) {
|
|
769
|
+
return;
|
|
770
|
+
}
|
|
771
|
+
const [firstVariant] = revertData.originalStyle.variants;
|
|
772
|
+
const additionalVariants = revertData.originalStyle.variants.slice(1);
|
|
773
|
+
(0, import_editor_elements4.createElementStyle)({
|
|
774
|
+
elementId: container.id,
|
|
775
|
+
classesProp,
|
|
776
|
+
label: import_editor_styles_repository2.LOCAL_STYLES_RESERVED_LABEL,
|
|
777
|
+
styleId: revertData.styleId,
|
|
778
|
+
...firstVariant,
|
|
779
|
+
additionalVariants
|
|
780
|
+
});
|
|
781
|
+
});
|
|
782
|
+
}
|
|
783
|
+
},
|
|
784
|
+
{
|
|
785
|
+
title: ({ containers }) => getTitleForContainers(containers),
|
|
786
|
+
subtitle: (0, import_i18n2.__)("Style Pasted", "elementor")
|
|
787
|
+
}
|
|
788
|
+
);
|
|
789
|
+
|
|
790
|
+
// src/style-commands/paste-style.ts
|
|
791
|
+
function initPasteStyleCommand() {
|
|
792
|
+
const pasteElementStyleCommand = undoablePasteElementStyle();
|
|
793
|
+
(0, import_editor_v1_adapters5.blockCommand)({
|
|
794
|
+
command: "document/elements/paste-style",
|
|
795
|
+
condition: hasAtomicWidgets
|
|
796
|
+
});
|
|
797
|
+
(0, import_editor_v1_adapters5.__privateListenTo)(
|
|
798
|
+
(0, import_editor_v1_adapters5.commandStartEvent)("document/elements/paste-style"),
|
|
799
|
+
(e) => pasteStyles(e.args, pasteElementStyleCommand)
|
|
800
|
+
);
|
|
801
|
+
}
|
|
802
|
+
function pasteStyles(args, pasteCallback) {
|
|
803
|
+
const { containers = [args.container], storageKey } = args;
|
|
804
|
+
const clipboardElements = getClipboardElements(storageKey);
|
|
805
|
+
const [clipboardElement] = clipboardElements ?? [];
|
|
806
|
+
if (!clipboardElement) {
|
|
807
|
+
return;
|
|
808
|
+
}
|
|
809
|
+
const elementStyles = clipboardElement.styles;
|
|
810
|
+
const elementStyle = Object.values(elementStyles ?? {})[0];
|
|
811
|
+
if (!elementStyle) {
|
|
812
|
+
return;
|
|
813
|
+
}
|
|
814
|
+
const atomicContainers = containers.filter(isAtomicWidget);
|
|
815
|
+
if (!atomicContainers.length) {
|
|
816
|
+
return;
|
|
817
|
+
}
|
|
818
|
+
pasteCallback({ containers: atomicContainers, newStyle: elementStyle });
|
|
819
|
+
}
|
|
820
|
+
|
|
821
|
+
// src/style-commands/reset-style.ts
|
|
822
|
+
var import_editor_v1_adapters7 = require("@elementor/editor-v1-adapters");
|
|
823
|
+
|
|
824
|
+
// src/style-commands/undoable-actions/reset-element-style.ts
|
|
825
|
+
var import_editor_elements5 = require("@elementor/editor-elements");
|
|
826
|
+
var import_editor_styles_repository3 = require("@elementor/editor-styles-repository");
|
|
827
|
+
var import_editor_v1_adapters6 = require("@elementor/editor-v1-adapters");
|
|
828
|
+
var import_i18n3 = require("@wordpress/i18n");
|
|
829
|
+
var undoableResetElementStyle = () => (0, import_editor_v1_adapters6.undoable)(
|
|
830
|
+
{
|
|
831
|
+
do: ({ containers }) => {
|
|
832
|
+
return containers.map((container) => {
|
|
833
|
+
const elementId = container.model.get("id");
|
|
834
|
+
const containerStyles = (0, import_editor_elements5.getElementStyles)(elementId);
|
|
835
|
+
Object.keys(containerStyles ?? {}).forEach(
|
|
836
|
+
(styleId) => (0, import_editor_elements5.deleteElementStyle)(elementId, styleId)
|
|
837
|
+
);
|
|
838
|
+
return containerStyles;
|
|
839
|
+
});
|
|
840
|
+
},
|
|
841
|
+
undo: ({ containers }, revertDataItems) => {
|
|
842
|
+
containers.forEach((container, index) => {
|
|
843
|
+
const classesProp = getClassesProp(container);
|
|
844
|
+
if (!classesProp) {
|
|
845
|
+
return;
|
|
846
|
+
}
|
|
847
|
+
const elementId = container.model.get("id");
|
|
848
|
+
const containerStyles = revertDataItems[index];
|
|
849
|
+
Object.entries(containerStyles ?? {}).forEach(([styleId, style]) => {
|
|
850
|
+
const [firstVariant] = style.variants;
|
|
851
|
+
const additionalVariants = style.variants.slice(1);
|
|
852
|
+
(0, import_editor_elements5.createElementStyle)({
|
|
853
|
+
elementId,
|
|
854
|
+
classesProp,
|
|
855
|
+
styleId,
|
|
856
|
+
label: import_editor_styles_repository3.LOCAL_STYLES_RESERVED_LABEL,
|
|
857
|
+
...firstVariant,
|
|
858
|
+
additionalVariants
|
|
859
|
+
});
|
|
860
|
+
});
|
|
861
|
+
});
|
|
862
|
+
}
|
|
863
|
+
},
|
|
864
|
+
{
|
|
865
|
+
title: ({ containers }) => getTitleForContainers(containers),
|
|
866
|
+
subtitle: (0, import_i18n3.__)("Style Reset", "elementor")
|
|
867
|
+
}
|
|
868
|
+
);
|
|
869
|
+
|
|
870
|
+
// src/style-commands/reset-style.ts
|
|
871
|
+
function initResetStyleCommand() {
|
|
872
|
+
const resetElementStyles = undoableResetElementStyle();
|
|
873
|
+
(0, import_editor_v1_adapters7.blockCommand)({
|
|
874
|
+
command: "document/elements/reset-style",
|
|
875
|
+
condition: hasAtomicWidgets
|
|
876
|
+
});
|
|
877
|
+
(0, import_editor_v1_adapters7.__privateListenTo)(
|
|
878
|
+
(0, import_editor_v1_adapters7.commandStartEvent)("document/elements/reset-style"),
|
|
879
|
+
(e) => resetStyles(e.args, resetElementStyles)
|
|
880
|
+
);
|
|
881
|
+
}
|
|
882
|
+
function resetStyles(args, resetElementStyles) {
|
|
883
|
+
const { containers = [args.container] } = args;
|
|
884
|
+
const atomicContainers = containers.filter(isAtomicWidget);
|
|
885
|
+
if (!atomicContainers.length) {
|
|
886
|
+
return;
|
|
887
|
+
}
|
|
888
|
+
resetElementStyles({ containers: atomicContainers });
|
|
889
|
+
}
|
|
890
|
+
|
|
891
|
+
// src/style-commands/init-style-commands.ts
|
|
892
|
+
function initStyleCommands() {
|
|
893
|
+
initPasteStyleCommand();
|
|
894
|
+
initResetStyleCommand();
|
|
895
|
+
}
|
|
896
|
+
|
|
540
897
|
// src/init.tsx
|
|
541
898
|
function init() {
|
|
542
899
|
initStyleTransformers();
|
|
543
900
|
initStylesRenderer();
|
|
901
|
+
initStyleCommands();
|
|
902
|
+
initLegacyViews();
|
|
903
|
+
initSettingsTransformers();
|
|
544
904
|
(0, import_editor.injectIntoTop)({
|
|
545
905
|
id: "elements-overlays",
|
|
546
906
|
component: ElementsOverlays
|
|
@@ -551,6 +911,7 @@ function init() {
|
|
|
551
911
|
init();
|
|
552
912
|
// Annotate the CommonJS export names for ESM import in node:
|
|
553
913
|
0 && (module.exports = {
|
|
914
|
+
settingsTransformersRegistry,
|
|
554
915
|
styleTransformersRegistry
|
|
555
916
|
});
|
|
556
917
|
//# sourceMappingURL=index.js.map
|