@useinsider/guido 3.8.1-beta.e680250 → 3.8.1-beta.fc167ba

package/dist/composables/useHtmlCompiler.js

@@ -26,24 +26,27 @@ const y = /* @__PURE__ */ new Set([
   "format-comment-braces",
   "add-universal-link-flags",
   // Coupon placeholder replacement (only present when liquidSyntax is enabled).
-  "liquid-coupon-code"
+  "liquid-coupon-code",
+  // Editor-only attribute strip — AMP4EMAIL has no `contenteditable`, so leaving
+  // it in narrows/breaks rendering. Pure attribute removal, emits nothing.
+  "remove-contenteditable"
 ]), M = () => {
-  var t, m, r;
-  const { compiler: e, isFeatureEnabled: a, partner: n } = k(), p = ((t = e.value) == null ? void 0 : t.customRules) || [], l = [
-    ...!!((m = e.value) != null && m.ignoreDefaultRules) ? [] : R,
+  var i, m, r;
+  const { compiler: o, isFeatureEnabled: n, partner: a } = k(), p = ((i = o.value) == null ? void 0 : i.customRules) || [], l = [
+    ...!!((m = o.value) != null && m.ignoreDefaultRules) ? [] : R,
     ...v,
     ...x,
     ...g,
     ...b,
     ...H,
-    ...a("liquidSyntax") ? C : [],
-    ...p.map((o, f) => ({
-      ...o,
-      priority: o.priority + 1e3 + f
+    ...n("liquidSyntax") ? C : [],
+    ...p.map((e, f) => ({
+      ...e,
+      priority: e.priority + 1e3 + f
       // Ensure additional rules run after default rules
     }))
-  ], u = s(l), c = l.filter((o) => y.has(o.id)), d = s(c), i = (r = n.value) == null ? void 0 : r.fallbackFont;
-  return { compileHtml: (o) => u.compile(o, void 0, i), compileAmpHtml: (o) => d.compile(o, void 0, i) };
+  ], u = s(l), c = l.filter((e) => y.has(e.id)), d = s(c), t = (r = a.value) == null ? void 0 : r.fallbackFont;
+  return { compileHtml: (e) => u.compile(e, void 0, t), compileAmpHtml: (e) => d.compile(e, void 0, t) };
 };
 export {
   M as useHtmlCompiler

package/dist/composables/useHtmlValidator.js

@@ -1,172 +1,219 @@
-import { useConfig as V } from "./useConfig.js";
-import { TemplateTypes as G } from "../enums/defaults.js";
-import { DISPLAY_CONDITIONS_REGEX as H, DISPLAY_CONDITIONS_EXCEPTIONS_REGEX as M, CampaignCouldNotBeSavedKey as X, CanNotMakeAnyChangesForRunningKey as P, DATA_ATTRIBUTE_REGEX as Y, DYNAMIC_CONTENT_TAG_REGEX as $, ALLOWED_DYNAMIC_SYSTEM_TOKENS as q, VALID_DYNAMIC_VARIABLE_REGEX as K } from "../enums/html-validator.js";
+import { useConfig as W } from "./useConfig.js";
+import { getIgnoredRecommendationBlockIds as G } from "../config/compiler/utils/recommendationIgnoreUtils.js";
+import { TemplateTypes as H } from "../enums/defaults.js";
+import { DISPLAY_CONDITIONS_REGEX as P, DISPLAY_CONDITIONS_EXCEPTIONS_REGEX as X, CampaignCouldNotBeSavedKey as $, CanNotMakeAnyChangesForRunningKey as Y, DATA_ATTRIBUTE_REGEX as U, DYNAMIC_CONTENT_TAG_REGEX as j, ALLOWED_DYNAMIC_SYSTEM_TOKENS as q, VALID_DYNAMIC_VARIABLE_REGEX as K } from "../enums/html-validator.js";
 import { ToasterTypeOptions as c } from "../enums/toaster.js";
-import { itemsBlockDynamicVariables as j } from "../extensions/Blocks/Items/enums/productEnums.js";
-import { useRecommendationExtensionStore as U } from "../extensions/Blocks/Recommendation/store/recommendation.js";
-import { RecommendationRequiredFieldsKey as z } from "../extensions/Blocks/Recommendation/validation/requiredFields.js";
-import { useRecommendationStore as Z } from "../stores/recommendation.js";
-import { base64EncodeWithSpecialChars as J } from "../utils/base64.js";
-import { useHttp as Q } from "./useHttp.js";
-import { useToaster as ee } from "./useToaster.js";
-import { useTranslations as te } from "./useTranslations.js";
-const se = /recommendation-id="(\d+)"/g;
-function ne(i) {
-  return [...i.matchAll(se)].map((d) => d[1]);
+import { itemsBlockDynamicVariables as z } from "../extensions/Blocks/Items/enums/productEnums.js";
+import { RECOMMENDATION_VARIABLE_BUILTIN_ATTRIBUTES as Z } from "../extensions/Blocks/Recommendation/constants/selectors.js";
+import { useRecommendationExtensionStore as J } from "../extensions/Blocks/Recommendation/store/recommendation.js";
+import { resolveProductAttrValue as Q } from "../extensions/Blocks/Recommendation/templates/utils.js";
+import { RecommendationRequiredFieldsKey as ee } from "../extensions/Blocks/Recommendation/validation/requiredFields.js";
+import { useRecommendationStore as te } from "../stores/recommendation.js";
+import { base64EncodeWithSpecialChars as ne } from "../utils/base64.js";
+import { useHttp as se } from "./useHttp.js";
+import { useToaster as oe } from "./useToaster.js";
+import { useTranslations as ie } from "./useTranslations.js";
+const re = /recommendation-id="(\d+)"/g;
+function ae(t) {
+  return [...t.matchAll(re)].map((m) => m[1]);
 }
-function ie(i, d) {
-  return d.some((g) => i.startsWith(`${g}_`));
+function ce(t, m) {
+  return m.some((f) => t.startsWith(`${f}_`));
 }
-function oe(i) {
-  return (i.replace(Y, "$1").match($) ?? []).filter((r) => {
-    const u = r.slice(2, -2), f = u.indexOf("|"), p = (f === -1 ? u : u.slice(0, f)).trim();
-    return q.includes(p) ? !1 : K.test(p) ? f !== -1 && u.slice(f + 1).trim() === "" : !0;
+const le = /^(\d+)_\d+_(.+)$/;
+function me(t) {
+  const m = t.match(le);
+  return m ? { recoId: m[1], attribute: m[2] } : null;
+}
+function ue(t) {
+  const m = new Set(Z);
+  return Object.values(t).forEach((f) => {
+    m.add(Q(f.attributeName, t).toLowerCase());
+  }), m;
+}
+function de(t, m, f, i, d) {
+  const u = t.match(/{{([a-zA-Z0-9_.\s]*)}}/gm);
+  if (!u)
+    return [];
+  const p = new Set(m.map((y) => y.toLowerCase())), h = [];
+  return u.forEach((y) => {
+    const g = y.slice(2, -2).trim().toLowerCase();
+    if (g !== "" && p.has(g))
+      return;
+    const E = me(g);
+    if (E && i.has(E.recoId)) {
+      if (!d || d.has(E.attribute))
+        return;
+      h.push(g);
+      return;
+    }
+    ce(g, f) || g.includes(".") || h.push(g);
+  }), h;
+}
+function fe(t) {
+  return (t.replace(U, "$1").match(j) ?? []).filter((i) => {
+    const d = i.slice(2, -2), u = d.indexOf("|"), p = (u === -1 ? d : d.slice(0, u)).trim();
+    return q.includes(p) ? !1 : K.test(p) ? u !== -1 && d.slice(u + 1).trim() === "" : !0;
   });
 }
-const Ce = () => {
-  var h, v;
-  const { showToaster: i } = ee(), { post: d } = Q(), { config: g } = V(), r = te(), u = Z(), f = U(), p = ((v = (h = g.value) == null ? void 0 : h.partner) == null ? void 0 : v.messageType) === G.transactional, A = async (e) => {
-    const t = await d(
+const xe = () => {
+  var I, b;
+  const { showToaster: t } = oe(), { post: m } = se(), { config: f } = W(), i = ie(), d = te(), u = J(), p = ((b = (I = f.value) == null ? void 0 : I.partner) == null ? void 0 : b.messageType) === H.transactional, h = async (e) => {
+    if (e.size === 0)
+      return /* @__PURE__ */ new Set();
+    try {
+      await u.fetchRecommendationFilters();
+    } catch {
+      return null;
+    }
+    return ue(u.filterList);
+  }, y = async (e) => {
+    const n = await m(
       "/newsletter/template-library/check-template-html-body",
-      { html: J(e) }
-    ), { status: n, message: l } = t.data;
-    return n || i({
+      { html: ne(e) }
+    ), { status: o, message: a } = n.data;
+    return o || t({
       type: c.Alert,
-      message: n === void 0 ? l : r("newsletter.invalid-url-link-for-toaster")
-    }), r(X), l === r(P) && i({
+      message: o === void 0 ? a : i("newsletter.invalid-url-link-for-toaster")
+    }), i($), a === i(Y) && t({
       type: c.Alert,
-      message: r("newsletter.already-in-progress")
-    }), n;
-  }, S = (e) => !["if", "endif", "else", "elif", "now"].includes(e.toLowerCase()), b = (e) => ["if", "endif"].includes(e.toLowerCase()), I = (e, s) => {
-    const t = e.match(/({%(.*?)%})/g);
-    let n = !0;
-    return t !== null && !p && t.forEach((l) => {
-      const o = l.slice(2, -2).trim().match(/(".*?"|[^"\s]+)(?=\s*|\s*$)/g);
-      if (o && o.length > 0) {
-        const [a] = o;
-        S(a) && !s.includes(a) && (i({
+      message: i("newsletter.already-in-progress")
+    }), o;
+  }, g = (e) => !["if", "endif", "else", "elif", "now"].includes(e.toLowerCase()), E = (e) => ["if", "endif"].includes(e.toLowerCase()), T = (e, s) => {
+    const n = e.match(/({%(.*?)%})/g);
+    let o = !0;
+    return n !== null && !p && n.forEach((a) => {
+      const r = a.slice(2, -2).trim().match(/(".*?"|[^"\s]+)(?=\s*|\s*$)/g);
+      if (r && r.length > 0) {
+        const [l] = r;
+        g(l) && !s.includes(l) && (t({
           type: c.Warning,
-          message: r("custom-fields.invalid-custom-fields")
-        }), n = !1);
+          message: i("custom-fields.invalid-custom-fields")
+        }), o = !1);
       }
-    }), n;
-  }, T = async (e, s, t) => {
-    const n = t ? await A(e) : !0;
-    return I(e, s) && n;
-  }, w = (e) => e.length > 0 ? !0 : (i({
+    }), o;
+  }, w = async (e, s, n) => {
+    const o = n ? await y(e) : !0;
+    return T(e, s) && o;
+  }, R = (e) => e.length > 0 ? !0 : (t({
     type: c.Warning,
-    message: r("newsletter.html-content-is-empty")
-  }), !1), x = (e) => {
-    const s = (e.match(/{/gm) || []).length, t = (e.match(/}/gm) || []).length;
-    return s > t && i({
+    message: i("newsletter.html-content-is-empty")
+  }), !1), _ = (e) => {
+    const s = (e.match(/{/gm) || []).length, n = (e.match(/}/gm) || []).length;
+    return s > n && t({
       type: c.Warning,
-      message: r("custom-fields.missing-closing-braces")
-    }), s < t && i({
+      message: i("custom-fields.missing-closing-braces")
+    }), s < n && t({
       type: c.Warning,
-      message: r("custom-fields.missing-opening-braces")
-    }), s === t;
-  }, _ = (e) => {
-    const s = oe(e).length === 0;
-    return s || i({
+      message: i("custom-fields.missing-opening-braces")
+    }), s === n;
+  }, N = (e) => {
+    const s = fe(e).length === 0;
+    return s || t({
       type: c.Warning,
-      message: r("custom-fields.invalid-custom-fields")
+      message: i("custom-fields.invalid-custom-fields")
     }), s;
-  }, k = (e, s) => {
-    const t = e.match(/{{([a-zA-Z0-9_\s]*)}}/gm);
-    if (t && !p) {
-      const n = new Set(s.map((a) => a.toLowerCase())), l = ne(e), o = [];
-      if (t.forEach((a) => {
-        const m = a.slice(2, -2).trim().toLowerCase();
-        (!n.has(m) || m === "") && !ie(m, l) && o.push(m);
-      }), o.length > 0) {
-        const a = `
-                    <ul>
-                        ${o.map((m) => `<li>${m}</li>`).join("")}
-                    </ul>
-                `;
-        return i({
-          type: c.Alert,
-          message: r("custom-fields.invalid-custom-fields") + a
-        }), !1;
-      }
+  }, x = (e, s, n, o) => {
+    if (p)
+      return !0;
+    const a = de(
+      e,
+      s,
+      ae(e),
+      n,
+      o
+    );
+    if (a.length > 0) {
+      const r = `
+                <ul>
+                    ${a.map((l) => `<li>${l}</li>`).join("")}
+                </ul>
+            `;
+      return t({
+        type: c.Alert,
+        message: i("custom-fields.invalid-custom-fields") + r
+      }), !1;
     }
     return !0;
-  }, R = (e) => {
-    const s = e.match(/{%(.*?)%}/g), t = [];
-    let n = !0;
-    if (s && s.forEach((l) => {
-      const o = l.match(H), a = l.match(M), m = (o == null ? void 0 : o.join("")) || "";
-      (!o || l !== m) && !a && (i({
+  }, O = (e) => {
+    const s = e.match(/{%(.*?)%}/g), n = [];
+    let o = !0;
+    if (s && s.forEach((a) => {
+      const r = a.match(P), l = a.match(X), v = (r == null ? void 0 : r.join("")) || "";
+      (!r || a !== v) && !l && (t({
         type: c.Alert,
-        message: r("newsletter.display-conditions-invalid-syntax")
-      }), n = !1), o && o.forEach((y) => {
-        y.trim() === "=" && (i({
+        message: i("newsletter.display-conditions-invalid-syntax")
+      }), o = !1), r && r.forEach((C) => {
+        C.trim() === "=" && (t({
           type: c.Alert,
-          message: r("custom-conditions.wrong-equality-operators")
-        }), n = !1);
-        const C = y.match(/^[a-zA-Z]*$/g);
-        C && C.forEach((E) => {
-          b(E) && t.push(E);
+          message: i("custom-conditions.wrong-equality-operators")
+        }), o = !1);
+        const A = C.match(/^[a-zA-Z]*$/g);
+        A && A.forEach((S) => {
+          E(S) && n.push(S);
         });
       });
-    }), t.length) {
-      const l = t.filter((a) => a === "if"), o = t.filter((a) => a === "endif");
-      l.length !== o.length && (i({
+    }), n.length) {
+      const a = n.filter((l) => l === "if"), r = n.filter((l) => l === "endif");
+      a.length !== r.length && (t({
         type: c.Alert,
-        message: r("custom-conditions.missing-if-endif-tag")
-      }), n = !1);
+        message: i("custom-conditions.missing-if-endif-tag")
+      }), o = !1);
     }
-    return n;
-  }, N = (e) => {
-    const s = (e.match(/{% /gm) || []).length, t = (e.match(/ %}/gm) || []).length, n = s === t;
-    return n || i({
+    return o;
+  }, k = (e) => {
+    const s = (e.match(/{% /gm) || []).length, n = (e.match(/ %}/gm) || []).length, o = s === n;
+    return o || t({
       type: c.Warning,
-      message: r("custom-conditions.no-space-after-braces")
-    }), n;
-  }, D = (e) => (e.match(/({%(.*?)%})/g) || []).filter((t) => t.includes("if")).map((t) => (t.match(/{{.*}}/gm) || []).length).reduce((t, n) => t + n, 0) > 0 ? (i({
+      message: i("custom-conditions.no-space-after-braces")
+    }), o;
+  }, B = (e) => (e.match(/({%(.*?)%})/g) || []).filter((n) => n.includes("if")).map((n) => (n.match(/{{.*}}/gm) || []).length).reduce((n, o) => n + o, 0) > 0 ? (t({
     type: c.Warning,
-    message: r("custom-conditions.no-braces-inside-if-tag")
-  }), !1) : !0, F = () => f.hasInvalidBlock() ? (i({
+    message: i("custom-conditions.no-braces-inside-if-tag")
+  }), !1) : !0, D = () => u.hasInvalidBlock() ? (t({
     type: c.Alert,
-    message: r(z)
-  }), !1) : !0, O = () => u.recommendationConfigs && Object.values(u.recommendationConfigs).find((s) => s.filters.find((t) => t.value === "")) !== void 0 ? (i({
+    message: i(ee)
+  }), !1) : !0, F = () => d.recommendationConfigs && Object.values(d.recommendationConfigs).find((s) => s.filters.find((n) => n.value === "")) !== void 0 ? (t({
     type: c.Alert,
-    message: r("newsletter.fill-all-necessary-fields")
-  }), !1) : !0, B = (e) => {
+    message: i("newsletter.fill-all-necessary-fields")
+  }), !1) : !0, L = (e) => {
     const s = /src="[^"]*\.(svg|pst)"/gm;
-    return e.match(s) === null ? !0 : (i({
+    return e.match(s) === null ? !0 : (t({
       type: c.Alert,
-      message: r("newsletter.invalid-image-type")
+      message: i("newsletter.invalid-image-type")
     }), !1);
-  }, L = (e) => {
-    const n = new DOMParser().parseFromString(e, "text/html").querySelectorAll(".checkbox-block-v2");
-    return Array.from(n).find((o) => {
-      var a;
-      return !((a = o.id) != null && a.trim());
-    }) ? (i({
+  }, V = (e) => {
+    const o = new DOMParser().parseFromString(e, "text/html").querySelectorAll(".checkbox-block-v2");
+    return Array.from(o).find((r) => {
+      var l;
+      return !((l = r.id) != null && l.trim());
+    }) ? (t({
       type: c.Alert,
-      message: r("unsubscribe-templates.select-checkbox-groups")
+      message: i("unsubscribe-templates.select-checkbox-groups")
     }), !1) : !0;
-  }, W = (e) => {
-    const n = new DOMParser().parseFromString(e, "text/html").querySelectorAll(".radio-button-v2");
-    return Array.from(n).find((o) => {
-      var a;
-      return !((a = o.id) != null && a.trim());
-    }) ? (i({
+  }, M = (e) => {
+    const o = new DOMParser().parseFromString(e, "text/html").querySelectorAll(".radio-button-v2");
+    return Array.from(o).find((r) => {
+      var l;
+      return !((l = r.id) != null && l.trim());
+    }) ? (t({
       type: c.Alert,
-      message: r("unsubscribe-templates.select-radio-button-groups")
+      message: i("unsubscribe-templates.select-radio-button-groups")
     }), !1) : !0;
   };
-  return { validateHtml: async (e, s, t = !1) => {
-    var o, a;
-    const n = [
-      ...s.map((m) => m.value),
-      ...j,
-      ...((a = (o = g.value) == null ? void 0 : o.template) == null ? void 0 : a.customFieldAttributes) ?? []
-    ];
-    return await T(e, n, t) && w(e) && x(e) && _(e) && k(e, n) && R(e) && N(e) && D(e) && F() && O() && B(e) && L(e) && W(e);
+  return { validateHtml: async (e, s, n = !1) => {
+    var v, C;
+    const o = [
+      ...s.map((A) => A.value),
+      ...z,
+      ...((C = (v = f.value) == null ? void 0 : v.template) == null ? void 0 : C.customFieldAttributes) ?? []
+    ], a = G(e), r = await h(a);
+    return await w(e, o, n) && R(e) && _(e) && N(e) && x(e, o, a, r) && O(e) && k(e) && B(e) && D() && F() && L(e) && V(e) && M(e);
   } };
 };
 export {
-  Ce as useHtmlValidator
+  ue as buildPartnerAttributeNameSet,
+  de as findInvalidCustomFields,
+  me as parseRecommendationVariable,
+  xe as useHtmlValidator
 };

package/dist/config/compiler/htmlCompilerRules.js

@@ -1,5 +1,5 @@
-import { stripFontTags as n } from "../../utils/stripFontTags.js";
-const l = [
+import { stripFontTags as p } from "../../utils/stripFontTags.js";
+const d = [
   {
     id: "fix-url-encoding-start",
     description: "Replace {%22 with %7B%22 to fix URL encoding",
@@ -58,7 +58,7 @@ const l = [
     id: "strip-font-tags",
     description: 'Unwrap browser-translate-injected <font dir="auto"> tags, keeping inner content; other <font> elements are left intact.',
     type: "custom",
-    processor: (e) => n(e),
+    processor: (e) => p(e),
     priority: 15
   },
   {
@@ -99,7 +99,7 @@ const l = [
     description: "Adding MSO Conditions",
     type: "custom",
     processor: (e) => {
-      const i = [
+      const t = [
         `<!--[if gte mso 9]>
 <style>sup {
     font-size: 100% !important;
@@ -119,13 +119,13 @@ const l = [
         <w:DontUseAdvancedTypographyReadingMail></w:DontUseAdvancedTypographyReadingMail>
     </w:WordDocument>
 </xml><![endif]-->`
-      ], s = /<head>([\S\s]*)<\/head>/, o = new RegExp(s);
+      ], i = /<head>([\S\s]*)<\/head>/, o = new RegExp(i);
       if (!e.match(o))
         return e;
-      let t = e;
-      return i.forEach((r) => {
-        t = t.replace("</head>", `${r}</head>`);
-      }), t;
+      let s = e;
+      return t.forEach((r) => {
+        s = s.replace("</head>", `${r}</head>`);
+      }), s;
     },
     priority: 30
   },
@@ -146,8 +146,36 @@ const l = [
     replacement: "email-static.useinsider.com",
     replaceAll: !0,
     priority: 41
+  },
+  {
+    id: "convert-rgb-to-hex",
+    // SD-142395: rgb()/6-digit hex are verbose; hex/3-digit shorthand is byte-identical
+    // to render. Shrinks the whole email to stay under Gmail's ~102KB clip threshold.
+    // Leaves rgba()/8-digit hex (alpha) untouched.
+    description: "Convert rgb() colors to hex and collapse 6-digit hex to shorthand",
+    type: "custom",
+    processor: (e) => {
+      const t = (i) => i.toString(16).padStart(2, "0");
+      return e.replace(/rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)/gi, (i, o, n, s) => {
+        const [r, a, c] = [Number(o), Number(n), Number(s)];
+        return r > 255 || a > 255 || c > 255 ? i : `#${t(r)}${t(a)}${t(c)}`;
+      }).replace(/#([0-9a-f])\1([0-9a-f])\2([0-9a-f])\3\b/gi, "#$1$2$3");
+    },
+    priority: 44
+  },
+  {
+    id: "remove-contenteditable",
+    // SD-142395: contenteditable is a Stripo editor flag with zero effect in a
+    // delivered email. Stripping it globally shaves bytes off every text block,
+    // helping the whole email stay under Gmail's ~102KB clip threshold.
+    description: "Strip editor-only contenteditable attributes from compiled output",
+    type: "regex",
+    pattern: '\\s+contenteditable="[^"]*"',
+    replacement: "",
+    flags: "g",
+    priority: 45
   }
 ];
 export {
-  l as defaultHtmlCompilerRules
+  d as defaultHtmlCompilerRules
 };