@useinsider/guido 3.12.0-beta.3a33163 → 3.12.0-beta.3aef680

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.
Files changed (28) hide show
  1. package/dist/components/Guido.vue.js +1 -1
  2. package/dist/components/Guido.vue2.js +110 -101
  3. package/dist/components/organisms/email-preview/desktop-preview/DesktopPreview.vue.js +1 -1
  4. package/dist/components/organisms/email-preview/desktop-preview/DesktopPreview.vue2.js +8 -8
  5. package/dist/components/organisms/email-preview/mobile-preview/ContentView.vue.js +5 -5
  6. package/dist/components/organisms/email-preview/mobile-preview/ContentView.vue2.js +10 -10
  7. package/dist/composables/usePreviewInteractionGuard.js +36 -11
  8. package/dist/composables/useRecommendationPreview.js +61 -60
  9. package/dist/composables/useStripo.js +72 -69
  10. package/dist/extensions/Blocks/Recommendation/constants/controlIds.js +1 -1
  11. package/dist/extensions/Blocks/Recommendation/controls/blockBackground/index.js +10 -0
  12. package/dist/extensions/Blocks/Recommendation/extension.js +23 -21
  13. package/dist/extensions/Blocks/Recommendation/settingsPanel.js +41 -40
  14. package/dist/extensions/Blocks/Unsubscribe/utils/constants.js +3 -2
  15. package/dist/extensions/Blocks/controlFactories.js +125 -75
  16. package/dist/guido.css +1 -1
  17. package/dist/services/stripoApi.js +18 -18
  18. package/dist/src/components/Guido.vue.d.ts +18 -2
  19. package/dist/src/composables/usePreviewInteractionGuard.d.ts +1 -1
  20. package/dist/src/composables/useStripo.d.ts +3 -2
  21. package/dist/src/extensions/Blocks/Recommendation/constants/controlIds.d.ts +1 -0
  22. package/dist/src/extensions/Blocks/Recommendation/controls/blockBackground/index.d.ts +14 -0
  23. package/dist/src/extensions/Blocks/Recommendation/controls/index.d.ts +1 -0
  24. package/dist/src/extensions/Blocks/Unsubscribe/utils/constants.d.ts +1 -0
  25. package/dist/src/extensions/Blocks/controlFactories.d.ts +36 -0
  26. package/dist/src/utils/urlSchemes.d.ts +6 -0
  27. package/dist/utils/urlSchemes.js +4 -0
  28. package/package.json +1 -1
@@ -1,7 +1,7 @@
1
- import { TextAlignBuiltInControl as a, TextColorBuiltInControl as g, TextSizeBuiltInControl as f, TextStyleBuiltInControl as x, TextFontFamilyBuiltInControl as C, ButtonBackgroundColorBuiltInControl as T, TextPaddingsBuiltInControl as B, ImageSizeBuiltInControl as m, ImageMarginsBuiltInControl as y, ButtonAlignBuiltInControl as I, ButtonBorderBuiltInControl as S, ButtonBorderRadiusBuiltInControl as A, ButtonColorBuiltInControl as b, ButtonFontFamilyBuiltInControl as N, ButtonMarginsBuiltInControl as q, ButtonPaddingsBuiltInControl as $, ButtonTextBuiltInControl as k, ButtonTextSizeBuiltInControl as p, ButtonTextStyleAndFontColorBuiltInControl as h, ButtonFitToContainerBuiltInControl as F, TextLineSpacingBuiltInControl as M } from "../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- const R = "buttonTextStyleForm", _ = "backgroundColor", E = /* @__PURE__ */ new Set(["", "transparent", "rgba(0, 0, 0, 0)"]);
3
- function z(o, n, r) {
4
- return class extends a {
1
+ import { TextAlignBuiltInControl as C, TextColorBuiltInControl as x, TextSizeBuiltInControl as T, TextStyleBuiltInControl as B, TextFontFamilyBuiltInControl as m, ButtonBackgroundColorBuiltInControl as d, TextPaddingsBuiltInControl as y, ImageSizeBuiltInControl as b, ImageMarginsBuiltInControl as I, ButtonAlignBuiltInControl as S, ButtonBorderBuiltInControl as A, ButtonBorderRadiusBuiltInControl as k, ButtonColorBuiltInControl as N, ButtonFontFamilyBuiltInControl as h, ButtonMarginsBuiltInControl as p, ButtonPaddingsBuiltInControl as $, ButtonTextBuiltInControl as q, ButtonTextSizeBuiltInControl as F, ButtonTextStyleAndFontColorBuiltInControl as v, ButtonFitToContainerBuiltInControl as R, TextLineSpacingBuiltInControl as M } from "../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
+ const O = "buttonTextStyleForm", a = "backgroundColor", g = /* @__PURE__ */ new Set(["", "transparent", "rgba(0, 0, 0, 0)"]), _ = ["elementColor", a], E = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i;
3
+ function P(o, n, r) {
4
+ return class extends C {
5
5
  getId() {
6
6
  return o;
7
7
  }
@@ -13,8 +13,8 @@ function z(o, n, r) {
13
13
  }
14
14
  };
15
15
  }
16
- function v(o, n, r) {
17
- return class extends g {
16
+ function H(o, n, r) {
17
+ return class extends x {
18
18
  getId() {
19
19
  return o;
20
20
  }
@@ -26,8 +26,8 @@ function v(o, n, r) {
26
26
  }
27
27
  };
28
28
  }
29
- function P(o, n, r) {
30
- return class extends f {
29
+ function U(o, n, r) {
30
+ return class extends T {
31
31
  getId() {
32
32
  return o;
33
33
  }
@@ -39,8 +39,8 @@ function P(o, n, r) {
39
39
  }
40
40
  };
41
41
  }
42
- function D(o, n, r) {
43
- return class extends x {
42
+ function Y(o, n, r) {
43
+ return class extends B {
44
44
  getId() {
45
45
  return o;
46
46
  }
@@ -52,8 +52,8 @@ function D(o, n, r) {
52
52
  }
53
53
  };
54
54
  }
55
- function K(o, n, r) {
56
- return class extends C {
55
+ function G(o, n, r) {
56
+ return class extends m {
57
57
  getId() {
58
58
  return o;
59
59
  }
@@ -65,8 +65,8 @@ function K(o, n, r) {
65
65
  }
66
66
  };
67
67
  }
68
- function L(o, n, r) {
69
- return class extends T {
68
+ function V(o, n, r) {
69
+ return class extends d {
70
70
  getId() {
71
71
  return o;
72
72
  }
@@ -89,16 +89,65 @@ function L(o, n, r) {
89
89
  const t = this.getTargetNodes(e);
90
90
  if (!t.length)
91
91
  return;
92
- const s = this.api.getValues()[_], i = !s || E.has(s), c = this.api.getDocumentModifier();
92
+ const i = this.api.getValues()[a], l = !i || g.has(i), s = this.api.getDocumentModifier();
93
93
  return t.forEach((u) => {
94
- const l = c.modifyHtml(u);
95
- i ? l.removeStyle("background-color") : l.setStyle("background-color", s);
96
- }), c;
94
+ const c = s.modifyHtml(u);
95
+ l ? c.removeStyle("background-color") : c.setStyle("background-color", i);
96
+ }), s;
97
97
  }
98
98
  };
99
99
  }
100
- function U(o, n, r) {
101
- return class extends B {
100
+ function K(o) {
101
+ const n = _.find((e) => e in o);
102
+ if (!n)
103
+ return;
104
+ const r = o[n];
105
+ return typeof r == "string" ? r : "";
106
+ }
107
+ function L(o, n) {
108
+ return n.startsWith(".") && "hasClass" in o && o.hasClass(n.slice(1));
109
+ }
110
+ function z(o, n) {
111
+ try {
112
+ return L(o, n) ? o : o.closest(n) ?? void 0;
113
+ } catch {
114
+ return;
115
+ }
116
+ }
117
+ function w(o, n) {
118
+ return class extends d {
119
+ getId() {
120
+ return o;
121
+ }
122
+ /** The parent control renders its own generic title; restore the block-level wording. */
123
+ getLabels() {
124
+ return { title: this.api.translate("Block Background Color") };
125
+ }
126
+ /** Guard: redirect the borrowed button parent onto the block `<td>` so it never paints the Buy buttons. */
127
+ getTargetNodes(r) {
128
+ const e = z(r, n);
129
+ return e ? [e] : [];
130
+ }
131
+ /**
132
+ * Writes the picked background onto the block as an inline style plus a `bgcolor`
133
+ * attribute. This is the whole mechanism, not a mirror: the parent control's own
134
+ * write never reaches the block element (verified at runtime). `bgcolor` is the
135
+ * channel Outlook honours on a `<td>`, and matches what the migrator emits.
136
+ */
137
+ getAdditionalModifications(r) {
138
+ const [e] = this.getTargetNodes(r);
139
+ if (!e)
140
+ return;
141
+ const t = K(this.api.getValues());
142
+ if (t === void 0)
143
+ return;
144
+ const i = !t || g.has(t), l = this.api.getDocumentModifier(), s = l.modifyHtml(e);
145
+ return i ? s.removeStyle("background-color").removeAttribute("bgcolor") : (s.setStyle("background-color", t), E.test(t) ? s.setAttribute("bgcolor", t) : s.removeAttribute("bgcolor")), l;
146
+ }
147
+ };
148
+ }
149
+ function W(o, n, r) {
150
+ return class extends y {
102
151
  getId() {
103
152
  return o;
104
153
  }
@@ -110,7 +159,7 @@ function U(o, n, r) {
110
159
  }
111
160
  };
112
161
  }
113
- function Y(o, n, r) {
162
+ function X(o, n, r) {
114
163
  return class extends M {
115
164
  getId() {
116
165
  return o;
@@ -120,8 +169,8 @@ function Y(o, n, r) {
120
169
  }
121
170
  };
122
171
  }
123
- function w(o, n, r = ".ins-recommendation-product-container") {
124
- return class extends I {
172
+ function j(o, n, r = ".ins-recommendation-product-container") {
173
+ return class extends S {
125
174
  getId() {
126
175
  return o;
127
176
  }
@@ -131,8 +180,8 @@ function w(o, n, r = ".ins-recommendation-product-container") {
131
180
  }
132
181
  };
133
182
  }
134
- function G(o, n, r = ".ins-recommendation-product-container") {
135
- return class extends b {
183
+ function J(o, n, r = ".ins-recommendation-product-container") {
184
+ return class extends N {
136
185
  getId() {
137
186
  return o;
138
187
  }
@@ -142,8 +191,8 @@ function G(o, n, r = ".ins-recommendation-product-container") {
142
191
  }
143
192
  };
144
193
  }
145
- function H(o, n, r = ".ins-recommendation-product-container") {
146
- return class extends S {
194
+ function Q(o, n, r = ".ins-recommendation-product-container") {
195
+ return class extends A {
147
196
  getId() {
148
197
  return o;
149
198
  }
@@ -153,8 +202,8 @@ function H(o, n, r = ".ins-recommendation-product-container") {
153
202
  }
154
203
  };
155
204
  }
156
- function V(o, n, r = ".ins-recommendation-product-container") {
157
- return class extends A {
205
+ function Z(o, n, r = ".ins-recommendation-product-container") {
206
+ return class extends k {
158
207
  getId() {
159
208
  return o;
160
209
  }
@@ -164,8 +213,8 @@ function V(o, n, r = ".ins-recommendation-product-container") {
164
213
  }
165
214
  };
166
215
  }
167
- function W(o, n, r = ".ins-recommendation-product-container") {
168
- return class extends N {
216
+ function tt(o, n, r = ".ins-recommendation-product-container") {
217
+ return class extends h {
169
218
  getId() {
170
219
  return o;
171
220
  }
@@ -175,8 +224,8 @@ function W(o, n, r = ".ins-recommendation-product-container") {
175
224
  }
176
225
  };
177
226
  }
178
- function X(o, n, r = ".ins-recommendation-product-container") {
179
- return class extends q {
227
+ function et(o, n, r = ".ins-recommendation-product-container") {
228
+ return class extends p {
180
229
  getId() {
181
230
  return o;
182
231
  }
@@ -186,7 +235,7 @@ function X(o, n, r = ".ins-recommendation-product-container") {
186
235
  }
187
236
  };
188
237
  }
189
- function j(o, n, r = ".ins-recommendation-product-container") {
238
+ function nt(o, n, r = ".ins-recommendation-product-container") {
190
239
  return class extends $ {
191
240
  getId() {
192
241
  return o;
@@ -197,8 +246,8 @@ function j(o, n, r = ".ins-recommendation-product-container") {
197
246
  }
198
247
  };
199
248
  }
200
- function J(o, n, r = ".ins-recommendation-product-container") {
201
- return class extends k {
249
+ function rt(o, n, r = ".ins-recommendation-product-container") {
250
+ return class extends q {
202
251
  getId() {
203
252
  return o;
204
253
  }
@@ -208,8 +257,8 @@ function J(o, n, r = ".ins-recommendation-product-container") {
208
257
  }
209
258
  };
210
259
  }
211
- function Q(o, n, r = ".ins-recommendation-product-container") {
212
- return class extends p {
260
+ function ot(o, n, r = ".ins-recommendation-product-container") {
261
+ return class extends F {
213
262
  getId() {
214
263
  return o;
215
264
  }
@@ -219,8 +268,8 @@ function Q(o, n, r = ".ins-recommendation-product-container") {
219
268
  }
220
269
  };
221
270
  }
222
- function Z(o, n, r) {
223
- return class extends h {
271
+ function st(o, n, r) {
272
+ return class extends v {
224
273
  getId() {
225
274
  return o;
226
275
  }
@@ -242,21 +291,21 @@ function Z(o, n, r) {
242
291
  const t = e.closest(r);
243
292
  if (!t)
244
293
  return;
245
- const s = t.querySelectorAll(`[esd-extension-block-id="${n}"] a.es-button`);
246
- if (!s.length)
294
+ const i = t.querySelectorAll(`[esd-extension-block-id="${n}"] a.es-button`);
295
+ if (!i.length)
247
296
  return;
248
- const i = this.api.getValues()[R];
249
- if (!i)
297
+ const l = this.api.getValues()[O];
298
+ if (!l)
250
299
  return;
251
- const c = i.bold ? "bold" : "normal", u = i.italic ? "italic" : "normal", l = this.api.getDocumentModifier();
252
- return s.forEach((d) => {
253
- l.modifyHtml(d).setStyle("font-weight", c).setStyle("font-style", u);
254
- }), l;
300
+ const s = l.bold ? "bold" : "normal", u = l.italic ? "italic" : "normal", c = this.api.getDocumentModifier();
301
+ return i.forEach((f) => {
302
+ c.modifyHtml(f).setStyle("font-weight", s).setStyle("font-style", u);
303
+ }), c;
255
304
  }
256
305
  };
257
306
  }
258
- function tt(o, n, r) {
259
- return class extends F {
307
+ function it(o, n, r) {
308
+ return class extends R {
260
309
  getId() {
261
310
  return o;
262
311
  }
@@ -266,8 +315,8 @@ function tt(o, n, r) {
266
315
  }
267
316
  };
268
317
  }
269
- function et(o, n, r) {
270
- return class extends m {
318
+ function lt(o, n, r) {
319
+ return class extends b {
271
320
  getId() {
272
321
  return o;
273
322
  }
@@ -281,8 +330,8 @@ function et(o, n, r) {
281
330
  }
282
331
  };
283
332
  }
284
- function nt(o, n, r) {
285
- return class extends y {
333
+ function ct(o, n, r) {
334
+ return class extends I {
286
335
  getId() {
287
336
  return o;
288
337
  }
@@ -297,25 +346,26 @@ function nt(o, n, r) {
297
346
  };
298
347
  }
299
348
  export {
300
- w as createButtonAlignControl,
301
- H as createButtonBorderControl,
302
- V as createButtonBorderRadiusControl,
303
- G as createButtonColorControl,
304
- tt as createButtonFitToContainerControl,
305
- W as createButtonFontFamilyControl,
306
- X as createButtonMarginsControl,
307
- j as createButtonPaddingsControl,
308
- J as createButtonTextControl,
309
- Q as createButtonTextSizeControl,
310
- Z as createButtonTextStyleAndFontColorControl,
311
- nt as createImageMarginsControl,
312
- et as createImageSizeControl,
313
- U as createPaddingsControl,
314
- z as createTextAlignControl,
315
- L as createTextBackgroundColorControl,
316
- v as createTextColorControl,
317
- K as createTextFontFamilyControl,
318
- Y as createTextLineSpacingControl,
319
- P as createTextSizeControl,
320
- D as createTextStyleControl
349
+ w as createBlockBackgroundColorControl,
350
+ j as createButtonAlignControl,
351
+ Q as createButtonBorderControl,
352
+ Z as createButtonBorderRadiusControl,
353
+ J as createButtonColorControl,
354
+ it as createButtonFitToContainerControl,
355
+ tt as createButtonFontFamilyControl,
356
+ et as createButtonMarginsControl,
357
+ nt as createButtonPaddingsControl,
358
+ rt as createButtonTextControl,
359
+ ot as createButtonTextSizeControl,
360
+ st as createButtonTextStyleAndFontColorControl,
361
+ ct as createImageMarginsControl,
362
+ lt as createImageSizeControl,
363
+ W as createPaddingsControl,
364
+ P as createTextAlignControl,
365
+ V as createTextBackgroundColorControl,
366
+ H as createTextColorControl,
367
+ G as createTextFontFamilyControl,
368
+ X as createTextLineSpacingControl,
369
+ U as createTextSizeControl,
370
+ Y as createTextStyleControl
321
371
  };
package/dist/guido.css CHANGED
@@ -1 +1 @@
1
- .gap-16[data-v-5553d071],.gap-16[data-v-0e1b0c54]{gap:16px}[data-v-73199fa4] .in-button-v2__wrapper{line-height:0}[data-v-22226124] .in-segments-wrapper__button_selected,[data-v-22226124] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb;color:#0010ac;border-color:#0010ac}[data-v-2cb418af] .in-progress-wrapper__progress p span:last-child{display:none!important}[data-v-2cb418af] .in-progress-description-status{display:none!important}.view-options-wrapper[data-v-195ab6d4]{position:relative;display:inline-block}.new-tag[data-v-195ab6d4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-195ab6d4] .guido__view-option-selection-desktop svg,[data-v-195ab6d4] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-195ab6d4] .in-segments-wrapper__button_selected,[data-v-195ab6d4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-195ab6d4] .in-tooltip-wrapper__icon{cursor:pointer}.editor-toolbar[data-v-173c3a40]{gap:4px}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history[data-v-fad98586]{gap:8px}.version-history__toolbar[data-v-fad98586]{gap:4px}.view-options-wrapper[data-v-d405ca59]{position:relative;display:inline-block}.new-tag[data-v-d405ca59]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-d405ca59] .guido__verion-history-view-option-selection-desktop svg,[data-v-d405ca59] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-d405ca59] .in-segments-wrapper__button_selected,[data-v-d405ca59] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-d405ca59] .in-tooltip-wrapper__icon{cursor:pointer}.auto-save-toggle[data-v-2c964af4]{position:relative}.auto-save-toggle__info-box[data-v-2c964af4]{position:absolute;top:100%;left:0;z-index:10;width:280px}.editor-actions[data-v-6e711fd7]{gap:4px}.header-wrapper[data-v-d11dd577]{min-width:1000px}.guido-loading__wrapper[data-v-07c4b2d8]{height:100%;top:75px!important;bottom:0!important}.guido-editor__wrapper[data-v-50dac6de]{--ribbon-offset: 0px;position:relative;width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__container[data-v-50dac6de]{width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__no-header[data-v-50dac6de]{height:calc(100vh - 75px - var(--ribbon-offset))}[data-v-293f1c47] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-91a26acd]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-91a26acd]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-91a26acd]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-91a26acd]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-91a26acd]{object-fit:cover;transform:scale(1)}[data-v-b9a93c6e] .guido__verion-history-view-option-selection-desktop svg,[data-v-b9a93c6e] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-b9a93c6e] .in-segments-wrapper__button_selected,[data-v-b9a93c6e] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-c3fd5d4b]{gap:16px}.desktop-browser-header[data-v-d86c5af5]{height:79px;min-height:79px}.desktop-browser-header__left[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:378px}.desktop-browser-header__center[data-v-d86c5af5]{height:79px;background-repeat:repeat-x;background-size:auto 100%;background-position:left top}.desktop-browser-header__right[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:112px}.desktop-preview[data-v-06afaecb]{min-width:602px;height:70vh;min-height:583px;border-radius:10px}.desktop-preview iframe[data-v-06afaecb]{min-height:504px}.iframe-wrapper[data-v-cbafc185]{width:258px}.iframe-scaled[data-v-cbafc185]{width:320px;height:124.0310077519%;transform:scale(.80625);transform-origin:top left}.cropped-text[data-v-eb3d05d7]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-preview-wrapper__phone[data-v-3f472f96]{width:282px}.mobile-preview-wrapper__phone img[data-v-3f472f96]{object-fit:cover;border-radius:44px}.mobile-preview-wrapper__content[data-v-3f472f96]{width:258px;height:450px;left:12px}[data-v-6bcaca8a] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-f16f20f8] .vueperslides__bullets{pointer-events:none!important}[data-v-f16f20f8] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-bb3cca55] .vueperslides__bullets{pointer-events:none!important}[data-v-bb3cca55] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-b09e80c4] .vueperslides__bullets{pointer-events:none!important}[data-v-b09e80c4] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-9bdef600] .vueperslides__parallax-wrapper{padding-bottom:110px!important}
1
+ .gap-16[data-v-5553d071],.gap-16[data-v-0e1b0c54]{gap:16px}[data-v-73199fa4] .in-button-v2__wrapper{line-height:0}[data-v-22226124] .in-segments-wrapper__button_selected,[data-v-22226124] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb;color:#0010ac;border-color:#0010ac}[data-v-2cb418af] .in-progress-wrapper__progress p span:last-child{display:none!important}[data-v-2cb418af] .in-progress-description-status{display:none!important}.view-options-wrapper[data-v-195ab6d4]{position:relative;display:inline-block}.new-tag[data-v-195ab6d4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-195ab6d4] .guido__view-option-selection-desktop svg,[data-v-195ab6d4] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-195ab6d4] .in-segments-wrapper__button_selected,[data-v-195ab6d4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-195ab6d4] .in-tooltip-wrapper__icon{cursor:pointer}.editor-toolbar[data-v-173c3a40]{gap:4px}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history[data-v-fad98586]{gap:8px}.version-history__toolbar[data-v-fad98586]{gap:4px}.view-options-wrapper[data-v-d405ca59]{position:relative;display:inline-block}.new-tag[data-v-d405ca59]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-d405ca59] .guido__verion-history-view-option-selection-desktop svg,[data-v-d405ca59] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-d405ca59] .in-segments-wrapper__button_selected,[data-v-d405ca59] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-d405ca59] .in-tooltip-wrapper__icon{cursor:pointer}.auto-save-toggle[data-v-2c964af4]{position:relative}.auto-save-toggle__info-box[data-v-2c964af4]{position:absolute;top:100%;left:0;z-index:10;width:280px}.editor-actions[data-v-6e711fd7]{gap:4px}.header-wrapper[data-v-d11dd577]{min-width:1000px}.guido-loading__wrapper[data-v-07c4b2d8]{height:100%;top:75px!important;bottom:0!important}.guido-editor__wrapper[data-v-daf7d5f8]{--ribbon-offset: 0px;position:relative;width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__container[data-v-daf7d5f8]{width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__no-header[data-v-daf7d5f8]{height:calc(100vh - 75px - var(--ribbon-offset))}[data-v-293f1c47] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-91a26acd]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-91a26acd]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-91a26acd]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-91a26acd]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-91a26acd]{object-fit:cover;transform:scale(1)}[data-v-b9a93c6e] .guido__verion-history-view-option-selection-desktop svg,[data-v-b9a93c6e] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-b9a93c6e] .in-segments-wrapper__button_selected,[data-v-b9a93c6e] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-c3fd5d4b]{gap:16px}.desktop-browser-header[data-v-d86c5af5]{height:79px;min-height:79px}.desktop-browser-header__left[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:378px}.desktop-browser-header__center[data-v-d86c5af5]{height:79px;background-repeat:repeat-x;background-size:auto 100%;background-position:left top}.desktop-browser-header__right[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:112px}.desktop-preview[data-v-cf946232]{min-width:602px;height:70vh;min-height:583px;border-radius:10px}.desktop-preview iframe[data-v-cf946232]{min-height:504px}.iframe-wrapper[data-v-f255b2bb]{width:258px}.iframe-scaled[data-v-f255b2bb]{width:320px;height:124.0310077519%;transform:scale(.80625);transform-origin:top left}.cropped-text[data-v-eb3d05d7]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-preview-wrapper__phone[data-v-3f472f96]{width:282px}.mobile-preview-wrapper__phone img[data-v-3f472f96]{object-fit:cover;border-radius:44px}.mobile-preview-wrapper__content[data-v-3f472f96]{width:258px;height:450px;left:12px}[data-v-6bcaca8a] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-f16f20f8] .vueperslides__bullets{pointer-events:none!important}[data-v-f16f20f8] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-bb3cca55] .vueperslides__bullets{pointer-events:none!important}[data-v-bb3cca55] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-b09e80c4] .vueperslides__bullets{pointer-events:none!important}[data-v-b09e80c4] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-9bdef600] .vueperslides__parallax-wrapper{padding-bottom:110px!important}
@@ -1,13 +1,9 @@
1
- import { useHttp as m } from "../composables/useHttp.js";
2
- import { useToaster as y } from "../composables/useToaster.js";
3
- import { MAX_DEFAULT_TEMPLATE_ID as f } from "../enums/defaults.js";
4
- import { useBlankTemplate as g } from "./blankTemplate.js";
5
- const l = () => ({
6
- id: 0,
7
- stripoId: 0,
8
- unsubscriptionPreferencePages: []
9
- }), D = () => {
10
- const { get: s, post: u } = m(), { handleError: r } = y(), { getBlankTemplate: n } = g();
1
+ import { useHttp as d } from "../composables/useHttp.js";
2
+ import { useToaster as m } from "../composables/useToaster.js";
3
+ import { MAX_DEFAULT_TEMPLATE_ID as y } from "../enums/defaults.js";
4
+ import { useBlankTemplate as f } from "./blankTemplate.js";
5
+ const D = () => {
6
+ const { get: s, post: u } = d(), { handleError: r } = m(), { getBlankTemplate: o } = f();
11
7
  return {
12
8
  getToken: async () => {
13
9
  try {
@@ -30,13 +26,13 @@ const l = () => ({
30
26
  },
31
27
  getDefaultTemplate: async () => {
32
28
  try {
33
- const t = new URLSearchParams(window.location.search), e = t.get("default-template"), p = t.get("master"), o = e ? parseInt(e) : 0, i = o >= 1 && o <= f ? o : 0;
34
- if (!i && !p)
35
- return await n();
36
- const d = `/stripo/default-template/${i}`, { data: c } = await s(d), a = typeof c == "string" ? JSON.parse(c) : c;
37
- return !a || typeof a != "object" || !("html" in a) || !("css" in a) ? await n() : a;
29
+ const t = new URLSearchParams(window.location.search), e = t.get("default-template"), l = t.get("master"), n = e ? parseInt(e) : 0, i = n >= 1 && n <= y ? n : 0;
30
+ if (!i && !l)
31
+ return await o();
32
+ const p = `/stripo/default-template/${i}`, { data: c } = await s(p), a = typeof c == "string" ? JSON.parse(c) : c;
33
+ return !a || typeof a != "object" || !("html" in a) || !("css" in a) ? await o() : a;
38
34
  } catch (t) {
39
- return r(t, "Failed to fetch default template"), n();
35
+ return r(t, "Failed to fetch default template"), o();
40
36
  }
41
37
  },
42
38
  getSyncModulesStatus: async () => {
@@ -57,9 +53,13 @@ const l = () => ({
57
53
  getSyncModule: async (t) => {
58
54
  try {
59
55
  const { data: e } = await s(`/stripo/stripo-modules/${t}/get`);
60
- return Array.isArray(e == null ? void 0 : e.unsubscriptionPreferencePages) ? e : l();
56
+ return e;
61
57
  } catch (e) {
62
- return r(e, "Failed to get sync module"), l();
58
+ return r(e, "Failed to get sync module"), {
59
+ id: 0,
60
+ stripoId: 0,
61
+ unsubscriptionPreferencePages: []
62
+ };
63
63
  }
64
64
  },
65
65
  setSyncModuleUnsubscriptionPages: async (t) => {
@@ -4,8 +4,12 @@ import type { SavedTemplateDetails } from '@@/Types/stripo';
4
4
  type __VLS_Props = {
5
5
  /** Guido configuration object */
6
6
  config: GuidoConfigInput;
7
+ /** Host data readiness. Runtime still preloads on mount; only config init waits. Defaults true for v-if-gated call sites. */
8
+ ready?: boolean;
7
9
  };
8
- declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<__VLS_Props>, {
10
+ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<__VLS_Props>, {
11
+ ready: boolean;
12
+ }>, {
9
13
  dynamicContent: {
10
14
  insert: (data: DynamicContent) => void;
11
15
  close: () => void;
@@ -30,8 +34,17 @@ declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<__
30
34
  ready: () => void;
31
35
  "onboarding:finished": () => void;
32
36
  "test-email:click": () => void;
33
- }, string, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<__VLS_Props>>>, {}>;
37
+ }, string, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<__VLS_Props>, {
38
+ ready: boolean;
39
+ }>>>, {
40
+ ready: boolean;
41
+ }>;
34
42
  export default _default;
43
+ type __VLS_WithDefaults<P, D> = {
44
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_PrettifyLocal<P[K] & {
45
+ default: D[K];
46
+ }> : P[K];
47
+ };
35
48
  type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
36
49
  type __VLS_TypePropsToOption<T> = {
37
50
  [K in keyof T]-?: {} extends Pick<T, K> ? {
@@ -41,3 +54,6 @@ type __VLS_TypePropsToOption<T> = {
41
54
  required: true;
42
55
  };
43
56
  };
57
+ type __VLS_PrettifyLocal<T> = {
58
+ [K in keyof T]: T[K];
59
+ } & {};
@@ -1,3 +1,3 @@
1
1
  export declare const usePreviewInteractionGuard: () => {
2
- blockPreviewInteractions: (iframe: HTMLIFrameElement) => void;
2
+ guardPreviewInteractions: (iframe: HTMLIFrameElement) => void;
3
3
  };
@@ -1,4 +1,5 @@
1
1
  import type { Metadata, Options, Template } from '@@/Types/stripo';
2
- export declare const useStripo: (metadata: Metadata, options: Options) => {
3
- initPlugin: (template: Template) => Promise<void>;
2
+ export declare const useStripo: () => {
3
+ initPlugin: (template: Template, metadata: Metadata, options: Options) => Promise<void>;
4
+ preloadRuntime: () => void;
4
5
  };
@@ -3,6 +3,7 @@
3
3
  * These IDs are returned by the getId() method of each control
4
4
  */
5
5
  export declare enum RecommendationControlId {
6
+ BLOCK_BACKGROUND = "recommendation-block-background-color-control",
6
7
  BUTTON_ALIGN = "recommendation-block-button-align-control",
7
8
  BUTTON_BORDER = "recommendation-block-button-border-control",
8
9
  BUTTON_BORDER_RADIUS = "recommendation-block-button-border-radius-control",
@@ -0,0 +1,14 @@
1
+ export declare const BlockBackgroundColorControl: {
2
+ new (): {
3
+ getId(): string;
4
+ getLabels(): {
5
+ title: string;
6
+ };
7
+ getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
8
+ getAdditionalModifications(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
9
+ getParentControlId(): string;
10
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
11
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
12
+ isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
13
+ };
14
+ };
@@ -20,6 +20,7 @@ export { ButtonControls } from './button';
20
20
  export { ImageControls } from './image';
21
21
  export { CustomAttributeControls } from './customAttribute';
22
22
  export { SpacingControl, SPACING_CONTROL_ID } from './spacing';
23
+ export { BlockBackgroundColorControl } from './blockBackground';
23
24
  export { CardBackgroundColorControl, CARD_BACKGROUND_COLOR_CONTROL_ID } from './cardBackground';
24
25
  export { RecommendationCardCompositionControl, COMPOSITION_CONTROL_BLOCK_ID } from './cardComposition';
25
26
  export { SyncInfoMessageControl, SYNC_INFO_MESSAGE_CONTROL_ID } from './syncInfoMessage';
@@ -9,3 +9,4 @@ export declare const DATA_ATTRIBUTES: {
9
9
  readonly BLOCK_ID: "data-unsubscribe-block-id";
10
10
  };
11
11
  export declare const UNSUBSCRIBE_BLOCK_SELECTOR = ".unsubscribe-block-v2";
12
+ export declare const UNSUBSCRIBE_LINK_SELECTOR = "a[data-unsubscribe-link=\"true\"], a.unsubscribe-link";
@@ -115,6 +115,42 @@ export declare function createTextBackgroundColorControl(controlId: string, targ
115
115
  isVisible(_node: ImmutableHtmlNode): boolean;
116
116
  };
117
117
  };
118
+ /**
119
+ * Factory for a background-color control that paints a whole extension block (SD-145082).
120
+ *
121
+ * Base is `ButtonBackgroundColorBuiltInControl` because its `GENERAL.BACKGROUND_COLOR` form key
122
+ * round-trips through `getValues()`; the block-text base (`TextBlockBackgroundBuiltInControl`, the
123
+ * built-in this replaces) reports `textBlockBackgroundColor`, which our read path never sees. That
124
+ * borrowed base targets the block's Buy buttons, so `getTargetNodes` here is a GUARD that keeps it
125
+ * off the buttons — not the write path.
126
+ *
127
+ * The write is entirely ours (`getAdditionalModifications`): Stripo's built-in emits a stylesheet
128
+ * rule that inline styles from regeneration outrank (SD-143023), so it would silently no-op on the
129
+ * next edit. We write inline `background-color` + `bgcolor` on the block `<td>` instead — surviving
130
+ * regeneration and reaching Outlook, matching the migrator's convention.
131
+ */
132
+ export declare function createBlockBackgroundColorControl(controlId: string, blockRootSelector?: string): {
133
+ new (): {
134
+ getId(): string;
135
+ /** The parent control renders its own generic title; restore the block-level wording. */
136
+ getLabels(): {
137
+ title: string;
138
+ };
139
+ /** Guard: redirect the borrowed button parent onto the block `<td>` so it never paints the Buy buttons. */
140
+ getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
141
+ /**
142
+ * Writes the picked background onto the block as an inline style plus a `bgcolor`
143
+ * attribute. This is the whole mechanism, not a mirror: the parent control's own
144
+ * write never reaches the block element (verified at runtime). `bgcolor` is the
145
+ * channel Outlook honours on a `<td>`, and matches what the migrator emits.
146
+ */
147
+ getAdditionalModifications(root: ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
148
+ getParentControlId(): string;
149
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
150
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
151
+ isVisible(_node: ImmutableHtmlNode): boolean;
152
+ };
153
+ };
118
154
  /**
119
155
  * Factory function to create paddings controls for different block elements
120
156
  * When targetBlockId and containerSelector are not provided, applies directly to root
@@ -0,0 +1,6 @@
1
+ /**
2
+ * URL schemes that are safe to follow from partner-authored email HTML. Shared so a
3
+ * future bypass fix lands in one place — the preview guard and the recommendation
4
+ * sanitizer both gate on it. Stored with the trailing colon to match `anchor.protocol`.
5
+ */
6
+ export declare const BASE_SAFE_URL_SCHEMES: readonly string[];
@@ -0,0 +1,4 @@
1
+ const t = ["http:", "https:", "mailto:"];
2
+ export {
3
+ t as BASE_SAFE_URL_SCHEMES
4
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useinsider/guido",
3
- "version": "3.12.0-beta.3a33163",
3
+ "version": "3.12.0-beta.3aef680",
4
4
  "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
5
5
  "main": "./dist/guido.umd.cjs",
6
6
  "module": "./dist/library.js",