@useinsider/guido 3.12.0-beta.40db55d → 3.12.0-beta.458ffd7

package/dist/extensions/Blocks/controlFactories.js

@@ -1,7 +1,7 @@
-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";
-const R = "buttonTextStyleForm", _ = "backgroundColor", E = /* @__PURE__ */ new Set(["", "transparent", "rgba(0, 0, 0, 0)"]);
-function z(o, n, r) {
-  return class extends a {
+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";
+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;
+function P(o, n, r) {
+  return class extends C {
     getId() {
       return o;
     }
@@ -13,8 +13,8 @@ function z(o, n, r) {
     }
   };
 }
-function v(o, n, r) {
-  return class extends g {
+function H(o, n, r) {
+  return class extends x {
     getId() {
       return o;
     }
@@ -26,8 +26,8 @@ function v(o, n, r) {
     }
   };
 }
-function P(o, n, r) {
-  return class extends f {
+function U(o, n, r) {
+  return class extends T {
     getId() {
       return o;
     }
@@ -39,8 +39,8 @@ function P(o, n, r) {
     }
   };
 }
-function D(o, n, r) {
-  return class extends x {
+function Y(o, n, r) {
+  return class extends B {
     getId() {
       return o;
     }
@@ -52,8 +52,8 @@ function D(o, n, r) {
     }
   };
 }
-function K(o, n, r) {
-  return class extends C {
+function G(o, n, r) {
+  return class extends m {
     getId() {
       return o;
     }
@@ -65,8 +65,8 @@ function K(o, n, r) {
     }
   };
 }
-function L(o, n, r) {
-  return class extends T {
+function V(o, n, r) {
+  return class extends d {
     getId() {
       return o;
     }
@@ -89,16 +89,65 @@ function L(o, n, r) {
       const t = this.getTargetNodes(e);
       if (!t.length)
         return;
-      const s = this.api.getValues()[_], i = !s || E.has(s), c = this.api.getDocumentModifier();
+      const i = this.api.getValues()[a], l = !i || g.has(i), s = this.api.getDocumentModifier();
       return t.forEach((u) => {
-        const l = c.modifyHtml(u);
-        i ? l.removeStyle("background-color") : l.setStyle("background-color", s);
-      }), c;
+        const c = s.modifyHtml(u);
+        l ? c.removeStyle("background-color") : c.setStyle("background-color", i);
+      }), s;
     }
   };
 }
-function U(o, n, r) {
-  return class extends B {
+function K(o) {
+  const n = _.find((e) => e in o);
+  if (!n)
+    return;
+  const r = o[n];
+  return typeof r == "string" ? r : "";
+}
+function L(o, n) {
+  return n.startsWith(".") && "hasClass" in o && o.hasClass(n.slice(1));
+}
+function z(o, n) {
+  try {
+    return L(o, n) ? o : o.closest(n) ?? void 0;
+  } catch {
+    return;
+  }
+}
+function w(o, n) {
+  return class extends d {
+    getId() {
+      return o;
+    }
+    /** The parent control renders its own generic title; restore the block-level wording. */
+    getLabels() {
+      return { title: this.api.translate("Block Background Color") };
+    }
+    /** Guard: redirect the borrowed button parent onto the block `<td>` so it never paints the Buy buttons. */
+    getTargetNodes(r) {
+      const e = z(r, n);
+      return e ? [e] : [];
+    }
+    /**
+     * Writes the picked background onto the block as an inline style plus a `bgcolor`
+     * attribute. This is the whole mechanism, not a mirror: the parent control's own
+     * write never reaches the block element (verified at runtime). `bgcolor` is the
+     * channel Outlook honours on a `<td>`, and matches what the migrator emits.
+     */
+    getAdditionalModifications(r) {
+      const [e] = this.getTargetNodes(r);
+      if (!e)
+        return;
+      const t = K(this.api.getValues());
+      if (t === void 0)
+        return;
+      const i = !t || g.has(t), l = this.api.getDocumentModifier(), s = l.modifyHtml(e);
+      return i ? s.removeStyle("background-color").removeAttribute("bgcolor") : (s.setStyle("background-color", t), E.test(t) ? s.setAttribute("bgcolor", t) : s.removeAttribute("bgcolor")), l;
+    }
+  };
+}
+function W(o, n, r) {
+  return class extends y {
     getId() {
       return o;
     }
@@ -110,7 +159,7 @@ function U(o, n, r) {
     }
   };
 }
-function Y(o, n, r) {
+function X(o, n, r) {
   return class extends M {
     getId() {
       return o;
@@ -120,8 +169,8 @@ function Y(o, n, r) {
     }
   };
 }
-function w(o, n, r = ".ins-recommendation-product-container") {
-  return class extends I {
+function j(o, n, r = ".ins-recommendation-product-container") {
+  return class extends S {
     getId() {
       return o;
     }
@@ -131,8 +180,8 @@ function w(o, n, r = ".ins-recommendation-product-container") {
     }
   };
 }
-function G(o, n, r = ".ins-recommendation-product-container") {
-  return class extends b {
+function J(o, n, r = ".ins-recommendation-product-container") {
+  return class extends N {
     getId() {
       return o;
     }
@@ -142,8 +191,8 @@ function G(o, n, r = ".ins-recommendation-product-container") {
     }
   };
 }
-function H(o, n, r = ".ins-recommendation-product-container") {
-  return class extends S {
+function Q(o, n, r = ".ins-recommendation-product-container") {
+  return class extends A {
     getId() {
       return o;
     }
@@ -153,8 +202,8 @@ function H(o, n, r = ".ins-recommendation-product-container") {
     }
   };
 }
-function V(o, n, r = ".ins-recommendation-product-container") {
-  return class extends A {
+function Z(o, n, r = ".ins-recommendation-product-container") {
+  return class extends k {
     getId() {
       return o;
     }
@@ -164,8 +213,8 @@ function V(o, n, r = ".ins-recommendation-product-container") {
     }
   };
 }
-function W(o, n, r = ".ins-recommendation-product-container") {
-  return class extends N {
+function tt(o, n, r = ".ins-recommendation-product-container") {
+  return class extends h {
     getId() {
       return o;
     }
@@ -175,8 +224,8 @@ function W(o, n, r = ".ins-recommendation-product-container") {
     }
   };
 }
-function X(o, n, r = ".ins-recommendation-product-container") {
-  return class extends q {
+function et(o, n, r = ".ins-recommendation-product-container") {
+  return class extends p {
     getId() {
       return o;
     }
@@ -186,7 +235,7 @@ function X(o, n, r = ".ins-recommendation-product-container") {
     }
   };
 }
-function j(o, n, r = ".ins-recommendation-product-container") {
+function nt(o, n, r = ".ins-recommendation-product-container") {
   return class extends $ {
     getId() {
       return o;
@@ -197,8 +246,8 @@ function j(o, n, r = ".ins-recommendation-product-container") {
     }
   };
 }
-function J(o, n, r = ".ins-recommendation-product-container") {
-  return class extends k {
+function rt(o, n, r = ".ins-recommendation-product-container") {
+  return class extends q {
     getId() {
       return o;
     }
@@ -208,8 +257,8 @@ function J(o, n, r = ".ins-recommendation-product-container") {
     }
   };
 }
-function Q(o, n, r = ".ins-recommendation-product-container") {
-  return class extends p {
+function ot(o, n, r = ".ins-recommendation-product-container") {
+  return class extends F {
     getId() {
       return o;
     }
@@ -219,8 +268,8 @@ function Q(o, n, r = ".ins-recommendation-product-container") {
     }
   };
 }
-function Z(o, n, r) {
-  return class extends h {
+function st(o, n, r) {
+  return class extends v {
     getId() {
       return o;
     }
@@ -242,21 +291,21 @@ function Z(o, n, r) {
       const t = e.closest(r);
       if (!t)
         return;
-      const s = t.querySelectorAll(`[esd-extension-block-id="${n}"] a.es-button`);
-      if (!s.length)
+      const i = t.querySelectorAll(`[esd-extension-block-id="${n}"] a.es-button`);
+      if (!i.length)
         return;
-      const i = this.api.getValues()[R];
-      if (!i)
+      const l = this.api.getValues()[O];
+      if (!l)
         return;
-      const c = i.bold ? "bold" : "normal", u = i.italic ? "italic" : "normal", l = this.api.getDocumentModifier();
-      return s.forEach((d) => {
-        l.modifyHtml(d).setStyle("font-weight", c).setStyle("font-style", u);
-      }), l;
+      const s = l.bold ? "bold" : "normal", u = l.italic ? "italic" : "normal", c = this.api.getDocumentModifier();
+      return i.forEach((f) => {
+        c.modifyHtml(f).setStyle("font-weight", s).setStyle("font-style", u);
+      }), c;
     }
   };
 }
-function tt(o, n, r) {
-  return class extends F {
+function it(o, n, r) {
+  return class extends R {
     getId() {
       return o;
     }
@@ -266,8 +315,8 @@ function tt(o, n, r) {
     }
   };
 }
-function et(o, n, r) {
-  return class extends m {
+function lt(o, n, r) {
+  return class extends b {
     getId() {
       return o;
     }
@@ -281,8 +330,8 @@ function et(o, n, r) {
     }
   };
 }
-function nt(o, n, r) {
-  return class extends y {
+function ct(o, n, r) {
+  return class extends I {
     getId() {
       return o;
     }
@@ -297,25 +346,26 @@ function nt(o, n, r) {
   };
 }
 export {
-  w as createButtonAlignControl,
-  H as createButtonBorderControl,
-  V as createButtonBorderRadiusControl,
-  G as createButtonColorControl,
-  tt as createButtonFitToContainerControl,
-  W as createButtonFontFamilyControl,
-  X as createButtonMarginsControl,
-  j as createButtonPaddingsControl,
-  J as createButtonTextControl,
-  Q as createButtonTextSizeControl,
-  Z as createButtonTextStyleAndFontColorControl,
-  nt as createImageMarginsControl,
-  et as createImageSizeControl,
-  U as createPaddingsControl,
-  z as createTextAlignControl,
-  L as createTextBackgroundColorControl,
-  v as createTextColorControl,
-  K as createTextFontFamilyControl,
-  Y as createTextLineSpacingControl,
-  P as createTextSizeControl,
-  D as createTextStyleControl
+  w as createBlockBackgroundColorControl,
+  j as createButtonAlignControl,
+  Q as createButtonBorderControl,
+  Z as createButtonBorderRadiusControl,
+  J as createButtonColorControl,
+  it as createButtonFitToContainerControl,
+  tt as createButtonFontFamilyControl,
+  et as createButtonMarginsControl,
+  nt as createButtonPaddingsControl,
+  rt as createButtonTextControl,
+  ot as createButtonTextSizeControl,
+  st as createButtonTextStyleAndFontColorControl,
+  ct as createImageMarginsControl,
+  lt as createImageSizeControl,
+  W as createPaddingsControl,
+  P as createTextAlignControl,
+  V as createTextBackgroundColorControl,
+  H as createTextColorControl,
+  G as createTextFontFamilyControl,
+  X as createTextLineSpacingControl,
+  U as createTextSizeControl,
+  Y as createTextStyleControl
 };

package/dist/guido.css

@@ -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-10599c37]{position:relative;display:inline-block}.new-tag[data-v-10599c37]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-10599c37] .guido__view-option-selection-desktop svg,[data-v-10599c37] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-10599c37] .in-segments-wrapper__button_selected,[data-v-10599c37] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.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-38eb0a73]{position:relative;display:inline-block}.new-tag[data-v-38eb0a73]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-38eb0a73] .guido__verion-history-view-option-selection-desktop svg,[data-v-38eb0a73] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-38eb0a73] .in-segments-wrapper__button_selected,[data-v-38eb0a73] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.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}
+.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-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}

package/dist/src/@types/config/schemas.d.ts

@@ -7,6 +7,7 @@
  */
 import type { DynamicContentNode } from '../generic';
 import type { SavedTemplateDetails } from '../stripo';
+import type { ActionButton } from '../toaster';
 import * as v from 'valibot';
 /**
  * Handler function for external validation before save
@@ -14,6 +15,19 @@ import * as v from 'valibot';
  * @returns Promise<boolean> - true if valid, false to cancel save
  */
 export type ExternalValidationHandler = (data: Omit<SavedTemplateDetails, 'metadata'>) => Promise<boolean>;
+/**
+ * Content for the domain-allowlist block toaster. By default Guido self-serves this (see
+ * useAllowlistToast): it resolves the user role via /get-user-role-and-email, builds the
+ * settings deep-link, and pulls copy from window.trans. A host may supply an override to
+ * replace that content. `actionButton.onClick` runs the action (e.g. the "Add to allowlist"
+ * deep-link). Returning null/void falls back to Guido's self-served toaster.
+ * @param blockedDomains - the non-allowlisted domains found in the template
+ */
+export interface AllowlistToastContent {
+    message: string;
+    actionButton?: ActionButton;
+}
+export type ResolveAllowlistToastHandler = (blockedDomains: string[]) => AllowlistToastContent | null | void;
 /**
  * Message type constants for email templates
  */
@@ -377,6 +391,8 @@ export declare const FeaturesSchema: v.ObjectSchema<{
     readonly liquidSyntax: v.OptionalSchema<v.BooleanSchema<undefined>, false>;
     /** Enable autosave (3-min interval + tab-hide). User toggles on/off from the header. */
     readonly autosave: v.OptionalSchema<v.BooleanSchema<undefined>, false>;
+    /** Enable pre-save domain-allowlist validation (opt-in; host supplies the block toaster via callbacks.resolveAllowlistToast) */
+    readonly allowlistEnabled: v.OptionalSchema<v.BooleanSchema<undefined>, false>;
 }, undefined>;
 /**
  * Default block types available in Stripo
@@ -582,6 +598,13 @@ export declare const CallbacksSchema: v.ObjectSchema<{
      * Return false to cancel the save operation.
      */
     readonly externalValidation: v.OptionalSchema<v.CustomSchema<ExternalValidationHandler, v.ErrorMessage<v.CustomIssue> | undefined>, undefined>;
+    /**
+     * OPTIONAL override for the domain-allowlist block toaster (features.allowlistEnabled). By
+     * default Guido self-serves the toaster — resolves the user role via /get-user-role-and-email,
+     * builds the settings deep-link, and reads copy from window.trans — so consumers only flip the
+     * flag. Supply this only to replace that content. Returning null/void keeps Guido's default.
+     */
+    readonly resolveAllowlistToast: v.OptionalSchema<v.CustomSchema<ResolveAllowlistToastHandler, v.ErrorMessage<v.CustomIssue> | undefined>, undefined>;
 }, undefined>;
 /**
  * Complete Guido configuration schema
@@ -764,6 +787,8 @@ export declare const GuidoConfigSchema: v.ObjectSchema<{
         readonly liquidSyntax: v.OptionalSchema<v.BooleanSchema<undefined>, false>;
         /** Enable autosave (3-min interval + tab-hide). User toggles on/off from the header. */
         readonly autosave: v.OptionalSchema<v.BooleanSchema<undefined>, false>;
+        /** Enable pre-save domain-allowlist validation (opt-in; host supplies the block toaster via callbacks.resolveAllowlistToast) */
+        readonly allowlistEnabled: v.OptionalSchema<v.BooleanSchema<undefined>, false>;
     }, undefined>, {}>;
     /** Block configuration */
     readonly blocks: v.OptionalSchema<v.ObjectSchema<{
@@ -834,5 +859,12 @@ export declare const GuidoConfigSchema: v.ObjectSchema<{
          * Return false to cancel the save operation.
          */
         readonly externalValidation: v.OptionalSchema<v.CustomSchema<ExternalValidationHandler, v.ErrorMessage<v.CustomIssue> | undefined>, undefined>;
+        /**
+         * OPTIONAL override for the domain-allowlist block toaster (features.allowlistEnabled). By
+         * default Guido self-serves the toaster — resolves the user role via /get-user-role-and-email,
+         * builds the settings deep-link, and reads copy from window.trans — so consumers only flip the
+         * flag. Supply this only to replace that content. Returning null/void keeps Guido's default.
+         */
+        readonly resolveAllowlistToast: v.OptionalSchema<v.CustomSchema<ResolveAllowlistToastHandler, v.ErrorMessage<v.CustomIssue> | undefined>, undefined>;
     }, undefined>, {}>;
 }, undefined>;

package/dist/src/composables/useAllowlistToast.d.ts

@@ -0,0 +1,17 @@
+import type { AllowlistToastContent } from '@@/Types/config/schemas';
+/**
+ * Builds the "Add to allowlist" InOne Settings deep-link (Security tab, add-domain modal
+ * prefilled). The route is identical across InOne products, so Guido builds it generically.
+ * @param value - domain(s) to prefill; base64-encoded into the `values` query param.
+ */
+export declare const buildAllowlistSettingsUrl: (value: string) => string;
+/**
+ * Builds the domain-allowlist block-toaster content Guido renders when a save is blocked.
+ * Guido owns the whole toaster: it resolves the user role itself (useUserRole → the shared
+ * /get-user-role-and-email endpoint) and pulls copy from window.trans, so consumers only need
+ * to set features.allowlistEnabled. Manage users get the "Add to allowlist" deep-link button;
+ * everyone else gets a message-only warning. SD-143197.
+ */
+export declare const useAllowlistToast: () => {
+    resolveAllowlistToast: (blockedDomains: string[]) => Promise<AllowlistToastContent>;
+};

package/dist/src/composables/useConfig.d.ts

@@ -96,6 +96,7 @@ export declare const useConfig: () => {
             modulesDisabled: boolean;
             liquidSyntax: boolean;
             autosave: boolean;
+            allowlistEnabled: boolean;
         };
         blocks: {
             excludeDefaults: ("amp-accordion" | "amp-carousel" | "amp-form-controls" | "banner-block" | "button-block" | "html-block" | "image-block" | "menu-block" | "social-block" | "spacer-block" | "text-block" | "timer-block" | "video-block")[];
@@ -135,6 +136,7 @@ export declare const useConfig: () => {
         };
         callbacks: {
             externalValidation?: import("@@/Types/config").ExternalValidationHandler | undefined;
+            resolveAllowlistToast?: import("../@types/config/schemas").ResolveAllowlistToastHandler | undefined;
         };
     } | null>;
     initialized: import("vue").Ref<boolean>;
@@ -227,6 +229,7 @@ export declare const useConfig: () => {
         modulesDisabled: boolean;
         liquidSyntax: boolean;
         autosave: boolean;
+        allowlistEnabled: boolean;
     } | null>;
     blocks: import("vue").ComputedRef<{
         excludeDefaults: ("amp-accordion" | "amp-carousel" | "amp-form-controls" | "banner-block" | "button-block" | "html-block" | "image-block" | "menu-block" | "social-block" | "spacer-block" | "text-block" | "timer-block" | "video-block")[];
@@ -266,6 +269,7 @@ export declare const useConfig: () => {
     } | null>;
     callbacks: import("vue").ComputedRef<{
         externalValidation?: import("@@/Types/config").ExternalValidationHandler | undefined;
+        resolveAllowlistToast?: import("../@types/config/schemas").ResolveAllowlistToastHandler | undefined;
     } | null>;
     templateId: import("vue").ComputedRef<string>;
     userId: import("vue").ComputedRef<string>;

package/dist/src/composables/usePreviewInteractionGuard.d.ts

@@ -1,3 +1,3 @@
 export declare const usePreviewInteractionGuard: () => {
-    blockPreviewInteractions: (iframe: HTMLIFrameElement) => void;
+    guardPreviewInteractions: (iframe: HTMLIFrameElement) => void;
 };

package/dist/src/composables/useUserRole.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Resolves whether the current user may manage the partner's domain allowlist, via the shared
+ * InOne endpoint GET /get-user-role-and-email. Fail-open: on any error the user is treated as
+ * non-manage (message-only toaster, no "Add to allowlist" deep-link they may not be able to use).
+ */
+export declare const useUserRole: () => {
+    getIsManageUser: () => Promise<boolean>;
+};

package/dist/src/composables/validators/useAllowlistValidator.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Pre-save domain-allowlist validation. Extracts every external domain from the compiled
+ * HTML/CSS and asks the backend whether each is allowlisted, so an un-allowlisted link can
+ * block the save BEFORE anything is persisted. Gated by `features.allowlistEnabled` in
+ * `useSave`; the block toaster is rendered by Guido from host-supplied content.
+ */
+export declare const useAllowlistValidator: () => {
+    getBlockedDomains: (html: string, css: string) => Promise<string[]>;
+};

package/dist/src/enums/roles.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Insider user-role aliases — the kebab-case wire values returned by
+ * GET /get-user-role-and-email (the same set honey-badger's RoleEnums defines).
+ * Only the manage-user role is needed in Guido: it gates the "Add to allowlist"
+ * action in the domain-allowlist block toaster. SD-143197.
+ */
+export declare enum RoleEnums {
+    MANAGE_USERS = "manage-users"
+}

package/dist/src/extensions/Blocks/Recommendation/constants/controlIds.d.ts

@@ -3,6 +3,7 @@
  * These IDs are returned by the getId() method of each control
  */
 export declare enum RecommendationControlId {
+    BLOCK_BACKGROUND = "recommendation-block-background-color-control",
     BUTTON_ALIGN = "recommendation-block-button-align-control",
     BUTTON_BORDER = "recommendation-block-button-border-control",
     BUTTON_BORDER_RADIUS = "recommendation-block-button-border-radius-control",

package/dist/src/extensions/Blocks/Recommendation/controls/blockBackground/index.d.ts

@@ -0,0 +1,14 @@
+export declare const BlockBackgroundColorControl: {
+    new (): {
+        getId(): string;
+        getLabels(): {
+            title: string;
+        };
+        getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+        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;
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+    };
+};

package/dist/src/extensions/Blocks/Recommendation/controls/index.d.ts

@@ -20,6 +20,7 @@ export { ButtonControls } from './button';
 export { ImageControls } from './image';
 export { CustomAttributeControls } from './customAttribute';
 export { SpacingControl, SPACING_CONTROL_ID } from './spacing';
+export { BlockBackgroundColorControl } from './blockBackground';
 export { CardBackgroundColorControl, CARD_BACKGROUND_COLOR_CONTROL_ID } from './cardBackground';
 export { RecommendationCardCompositionControl, COMPOSITION_CONTROL_BLOCK_ID } from './cardComposition';
 export { SyncInfoMessageControl, SYNC_INFO_MESSAGE_CONTROL_ID } from './syncInfoMessage';

package/dist/src/extensions/Blocks/Unsubscribe/utils/constants.d.ts

@@ -9,3 +9,4 @@ export declare const DATA_ATTRIBUTES: {
     readonly BLOCK_ID: "data-unsubscribe-block-id";
 };
 export declare const UNSUBSCRIBE_BLOCK_SELECTOR = ".unsubscribe-block-v2";
+export declare const UNSUBSCRIBE_LINK_SELECTOR = "a[data-unsubscribe-link=\"true\"], a.unsubscribe-link";

package/dist/src/extensions/Blocks/controlFactories.d.ts

@@ -115,6 +115,42 @@ export declare function createTextBackgroundColorControl(controlId: string, targ
         isVisible(_node: ImmutableHtmlNode): boolean;
     };
 };
+/**
+ * Factory for a background-color control that paints a whole extension block (SD-145082).
+ *
+ * Base is `ButtonBackgroundColorBuiltInControl` because its `GENERAL.BACKGROUND_COLOR` form key
+ * round-trips through `getValues()`; the block-text base (`TextBlockBackgroundBuiltInControl`, the
+ * built-in this replaces) reports `textBlockBackgroundColor`, which our read path never sees. That
+ * borrowed base targets the block's Buy buttons, so `getTargetNodes` here is a GUARD that keeps it
+ * off the buttons — not the write path.
+ *
+ * The write is entirely ours (`getAdditionalModifications`): Stripo's built-in emits a stylesheet
+ * rule that inline styles from regeneration outrank (SD-143023), so it would silently no-op on the
+ * next edit. We write inline `background-color` + `bgcolor` on the block `<td>` instead — surviving
+ * regeneration and reaching Outlook, matching the migrator's convention.
+ */
+export declare function createBlockBackgroundColorControl(controlId: string, blockRootSelector?: string): {
+    new (): {
+        getId(): string;
+        /** The parent control renders its own generic title; restore the block-level wording. */
+        getLabels(): {
+            title: string;
+        };
+        /** Guard: redirect the borrowed button parent onto the block `<td>` so it never paints the Buy buttons. */
+        getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
+        /**
+         * Writes the picked background onto the block as an inline style plus a `bgcolor`
+         * attribute. This is the whole mechanism, not a mirror: the parent control's own
+         * write never reaches the block element (verified at runtime). `bgcolor` is the
+         * channel Outlook honours on a `<td>`, and matches what the migrator emits.
+         */
+        getAdditionalModifications(root: ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+        getParentControlId(): string;
+        api: import("@stripoinc/ui-editor-extensions").ControlApi;
+        getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+        isVisible(_node: ImmutableHtmlNode): boolean;
+    };
+};
 /**
  * Factory function to create paddings controls for different block elements
  * When targetBlockId and containerSelector are not provided, applies directly to root