@useinsider/guido 3.9.1-beta.fdaa66f → 3.10.0-beta.06d1f41

package/dist/utils/pairProductVariables.js

@@ -1,85 +1,84 @@
-import { productPairs as L } from "../extensions/Blocks/Items/enums/productEnums.js";
-function q(w) {
-  const y = w.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), T = new DOMParser().parseFromString(y, "text/html"), C = L.PAIRS_FOR_EXTENSION;
-  Object.entries(C).forEach(([r, f]) => {
-    T.querySelectorAll(".ins-product-td").forEach((o) => {
-      const A = o.getAttribute("data-number") || "1", b = o.getAttribute("data-type") || "CART_ITEMS";
-      o.querySelectorAll(`[product-attr="${r}"]`).forEach((e) => {
-        var k, F, I;
-        const $ = e.getAttribute("data-type") || b, d = e.getAttribute("data-number") || A, u = f[$];
-        if (u)
+import { productPairs as q } from "../extensions/Blocks/Items/enums/productEnums.js";
+import { DefaultConfigValues as N } from "../extensions/Blocks/Items/enums/settingsEnums.js";
+function W(M) {
+  const S = M.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), g = new DOMParser().parseFromString(S, "text/html"), m = q.PAIRS_FOR_EXTENSION;
+  Object.entries(m).forEach(([r, f]) => {
+    g.querySelectorAll(".ins-product-td").forEach((c) => {
+      const A = c.getAttribute("data-number") || "1", C = c.getAttribute("data-type") || "CART_ITEMS";
+      c.querySelectorAll(`[product-attr="${r}"]`).forEach((e) => {
+        var F, I, w;
+        const $ = e.getAttribute("data-type") || C, u = e.getAttribute("data-number") || A, d = f[$];
+        if (d)
           switch (r) {
             case "imageSrc": {
               let t = null, i = null;
               if (e.tagName === "IMG" ? (t = e, i = t.closest("a")) : (t = e.querySelector("img"), i = e.querySelector("a") || e.closest("a")), !t)
                 break;
-              const a = u.DEFAULT, s = u.ATTR;
+              const a = d.DEFAULT, s = d.ATTR;
               if (a && t.src) {
-                const c = t.src;
+                const o = t.src;
                 a.some((h) => {
-                  const l = h.split("/").pop() || "", g = c.split("/").pop() || "";
-                  return c.includes(h) || c.includes(l) || g === l;
-                }) && (t.src = `{{${s}_${d}}}`);
+                  const l = h.split("/").pop() || "", b = o.split("/").pop() || "";
+                  return o.includes(h) || o.includes(l) || b === l;
+                }) && (t.src = `{{${s}_${u}}}`);
               }
-              const n = (F = (k = C.name) == null ? void 0 : k[$]) == null ? void 0 : F.ATTR;
-              if (n && t.setAttribute("alt", `{{${n}_${d}}}`), i) {
-                const c = (I = C.itemLink) == null ? void 0 : I[$];
-                if (c) {
-                  const E = c.HREF, h = c.DEFAULT_HREF || "#!", l = i.href;
-                  (l === "#" || l === "" || l.endsWith("#!") || l.endsWith(h) || l === `${window.location.href}${h}` || !l || l === window.location.href) && (i.href = `{{${E}_${d}}}`);
+              const n = (I = (F = m.name) == null ? void 0 : F[$]) == null ? void 0 : I.ATTR;
+              if (n && t.setAttribute("alt", `{{${n}_${u}}}`), i) {
+                const o = (w = m.itemLink) == null ? void 0 : w[$];
+                if (o) {
+                  const E = o.HREF, h = o.DEFAULT_HREF || "#!", l = i.href;
+                  (l === "#" || l === "" || l.endsWith("#!") || l.endsWith(h) || l === `${window.location.href}${h}` || !l || l === window.location.href) && (i.href = `{{${E}_${u}}}`);
                 }
               }
               break;
             }
             case "name": {
-              const t = u, i = t.ATTR, a = t.DEFAULT_HREF || "#!", s = t.HREF;
-              e.textContent && (e.textContent = `{{${i}_${d}}}`);
+              const t = d, i = t.ATTR, a = t.DEFAULT_HREF || "#!", s = t.HREF;
+              e.textContent && (e.textContent = `{{${i}_${u}}}`);
               const n = e.closest("a") || (e.tagName === "A" ? e : null);
               if (n && s) {
-                const c = n.href, E = `${window.location.href}${a}`;
-                (c === E || c.endsWith(a)) && (n.href = `{{${s}_${d}}}`);
+                const o = n.href, E = `${window.location.href}${a}`;
+                (o === E || o.endsWith(a)) && (n.href = `{{${s}_${u}}}`);
               }
               break;
             }
             case "price":
             case "originalPrice": {
-              const t = u, i = e.getAttribute("data-formated"), a = e.getAttribute("data-single_price"), s = i === "true", n = a === "true", c = e.getAttribute("data-curency") || "before";
+              const t = d, i = e.getAttribute("data-formated"), a = e.getAttribute("data-single_price"), s = i === "true", n = a === "true", o = e.getAttribute("data-curency") || "before";
               let E;
               n ? E = s ? t.SINGLE_PRICE_FORMATTED : t.SINGLE_PRICE : E = s ? t.PRICE_FORMATTED : t.PRICE;
               const h = t.CURRENCY;
-              let l = `{{${E}_${d}}}`;
-              if (h) {
-                const g = `{{${h}_${d}}}`;
-                l = c === "after" ? `${l} ${g}` : `${g} ${l}`;
-              }
-              e.textContent = l;
+              let l = `{{${E}_${u}}}`;
+              const b = (e.getAttribute("data-currency_symbol") || "").trim(), x = b !== "" && b !== N.productPriceCurrencySymbolControlValue;
+              let T = "";
+              x ? T = b : h && (T = `{{${h}_${u}}}`), T && (l = o === "after" ? `${l} ${T}` : `${T} ${l}`), e.textContent = l;
               break;
             }
             case "quantity": {
-              const t = u, i = t.ATTR, a = t.DEFAULT;
-              e.textContent && e.textContent.trim() === a && (e.textContent = `{{${i}_${d}}}`);
+              const t = d, i = t.ATTR, a = t.DEFAULT;
+              e.textContent && e.textContent.trim() === a && (e.textContent = `{{${i}_${u}}}`);
               break;
             }
             case "button": {
-              const t = u, i = t.HREF, a = t.DEFAULT_HREF || "#!", s = e.tagName === "A" ? e : e.querySelector("a");
+              const t = d, i = t.HREF, a = t.DEFAULT_HREF || "#!", s = e.tagName === "A" ? e : e.querySelector("a");
               if (s) {
-                const n = s.href || "", c = `${window.location.href}${a}`;
-                (n === "" || n === "#" || n === c || n.endsWith(a) || n.endsWith("#!") || n === window.location.href) && (s.href = `{{${i}_${d}}}`);
+                const n = s.href || "", o = `${window.location.href}${a}`;
+                (n === "" || n === "#" || n === o || n.endsWith(a) || n.endsWith("#!") || n === window.location.href) && (s.href = `{{${i}_${u}}}`);
               }
               break;
             }
             case "itemLink": {
-              const t = u, i = t.HREF, a = t.DEFAULT_HREF || "#!", s = e;
+              const t = d, i = t.HREF, a = t.DEFAULT_HREF || "#!", s = e;
               if (s.href) {
-                const n = s.href, c = `${window.location.href}${a}`;
-                (n === c || n.endsWith(a)) && (s.href = `{{${i}_${d}}}`);
+                const n = s.href, o = `${window.location.href}${a}`;
+                (n === o || n.endsWith(a)) && (s.href = `{{${i}_${u}}}`);
               }
               break;
             }
             default: {
-              if ("ATTR" in u) {
-                const t = u.ATTR;
-                e.textContent && (e.textContent = `{{${t}_${d}}}`);
+              if ("ATTR" in d) {
+                const t = d.ATTR;
+                e.textContent && (e.textContent = `{{${t}_${u}}}`);
               }
               break;
             }
@@ -87,48 +86,48 @@ function q(w) {
       });
     });
   });
-  const S = y.match(/<!DOCTYPE[^>]*>/i), M = S ? `${S[0]}
-` : "", P = T.querySelectorAll(".ins-product-td"), H = [];
-  P.forEach((r) => {
-    const f = r.getAttribute("data-type") || "CART_ITEMS", p = r.getAttribute("data-number") || "1", o = r.getAttribute("data-nodup"), A = r.outerHTML;
-    H.push({
+  const H = S.match(/<!DOCTYPE[^>]*>/i), P = H ? `${H[0]}
+` : "", D = g.querySelectorAll(".ins-product-td"), k = [];
+  D.forEach((r) => {
+    const f = r.getAttribute("data-type") || "CART_ITEMS", p = r.getAttribute("data-number") || "1", c = r.getAttribute("data-nodup"), A = r.outerHTML;
+    k.push({
       element: r,
       outerHtml: A,
       type: f,
       number: p,
-      nodup: o || void 0
+      nodup: c || void 0
     });
   });
-  let _ = M + T.documentElement.outerHTML;
-  H.reverse().forEach(({ outerHtml: r, type: f, number: p }) => {
-    let o = "";
+  let _ = P + g.documentElement.outerHTML;
+  k.reverse().forEach(({ outerHtml: r, type: f, number: p }) => {
+    let c = "";
     switch (f) {
       case "CART_ITEMS":
-        o = "ins_apr_total_product_kind";
+        c = "ins_apr_total_product_kind";
         break;
       case "BROWSED_ITEMS":
-        o = "browsed_item_total_product_kind";
+        c = "browsed_item_total_product_kind";
         break;
       case "PURCHASED_ITEMS":
-        o = "purchased_item_total_product_kind";
+        c = "purchased_item_total_product_kind";
         break;
     }
-    if (o) {
-      const b = parseInt(p) - 1, $ = `${`{% if ${o} > ${b} %}`}${r}{% endif %}`;
+    if (c) {
+      const C = parseInt(p) - 1, $ = `${`{% if ${c} > ${C} %}`}${r}{% endif %}`;
       _ = _.replace(r, $);
     }
   });
-  const D = T.querySelectorAll('[product-attr="originalPrice"][data-type="CART_ITEMS"]'), R = [];
-  return D.forEach((r) => {
+  const L = g.querySelectorAll('[product-attr="originalPrice"][data-type="CART_ITEMS"]'), y = [];
+  return L.forEach((r) => {
     const f = r.getAttribute("data-number"), p = r.getAttribute("data-type");
     if (!f || p !== "CART_ITEMS")
       return;
-    const o = r.closest(".product-original-price-class");
-    if (o) {
-      const A = o.outerHTML;
-      R.some((m) => m.tdOuterHtml === A) || R.push({ tdOuterHtml: A, number: f });
+    const c = r.closest(".product-original-price-class");
+    if (c) {
+      const A = c.outerHTML;
+      y.some((R) => R.tdOuterHtml === A) || y.push({ tdOuterHtml: A, number: f });
     }
-  }), R.reverse().forEach(({ tdOuterHtml: r, number: f }) => {
+  }), y.reverse().forEach(({ tdOuterHtml: r, number: f }) => {
     const p = `{% if ins_apr_price_${f} != ins_apr_originalprice_${f} %}`;
     if (!_.includes(p) && !r.includes("{% if")) {
       const A = `${p}${r}{% endif %}`;
@@ -137,5 +136,5 @@ function q(w) {
   }), _.replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}").replaceAll("&lt;!--{%", "{%").replaceAll("%}--&gt;", "%}");
 }
 export {
-  q as pairProductVariables
+  W as pairProductVariables
 };

package/dist/utils/templatePreparation.js

@@ -2,16 +2,15 @@ import { useActionsApi as P } from "../composables/useActionsApi.js";
 import { useHtmlCompiler as w } from "../composables/useHtmlCompiler.js";
 import { DEFAULT_CURRENCY as l, DEFAULT_NODE_CONFIG as i } from "../extensions/Blocks/Recommendation/constants/defaultConfig.js";
 import { useRecommendationExtensionStore as b } from "../extensions/Blocks/Recommendation/store/recommendation.js";
-import { mapLegacyStrategy as E } from "../extensions/Blocks/Recommendation/utils/legacyStrategyMap.js";
 import { DATA_ATTRIBUTES as h } from "../extensions/Blocks/Unsubscribe/utils/constants.js";
-import { parsePageList as H } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
-import { useDynamicContentStore as U } from "../stores/dynamic-content.js";
-import { useUnsubscribeStore as F } from "../stores/unsubscribe.js";
-function L(s) {
+import { parsePageList as E } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
+import { useDynamicContentStore as H } from "../stores/dynamic-content.js";
+import { useUnsubscribeStore as U } from "../stores/unsubscribe.js";
+function F(s) {
   const o = new DOMParser().parseFromString(s, "text/html").querySelectorAll(`[${h.PAGE_LIST}]`), t = [];
-  return o.forEach((a) => {
-    const n = a.getAttribute(h.PAGE_LIST);
-    n && t.push(...H(n));
+  return o.forEach((n) => {
+    const a = n.getAttribute(h.PAGE_LIST);
+    a && t.push(...E(a));
   }), [...new Set(t)];
 }
 async function R(s) {
@@ -21,8 +20,8 @@ async function R(s) {
   const o = b();
   m.forEach((t) => {
     var c, p, g, f, r;
-    const a = t.getAttribute("recommendation-id"), n = a ? Number(a) : NaN;
-    if (!Number.isFinite(n))
+    const n = t.getAttribute("recommendation-id"), a = n ? Number(n) : NaN;
+    if (!Number.isFinite(a))
       return;
     const d = t.getAttribute("esd-ext-config");
     if (!d)
@@ -36,10 +35,7 @@ async function R(s) {
     if (!e || typeof e != "object" || Array.isArray(e))
       return;
     const y = {
-      // Normalize legacy strategy keys (e.g. `mostViewed` → `mostPopular`) so
-      // already-saved blocks that never re-run the migrator don't emit a
-      // strategy-less campaign URL. `||` also catches '' / undefined (SD-144882).
-      strategy: E(e.strategy) || i.strategy,
+      strategy: e.strategy ?? i.strategy,
       language: e.language ?? i.language,
       size: e.size ?? i.size,
       // Spread the default arrays so each block gets a fresh reference
@@ -53,7 +49,7 @@ async function R(s) {
       currencyDecimalSeparator: ((f = e.currency) == null ? void 0 : f.decimalSeparator) ?? l.decimalSeparator,
       currencyThousandSeparator: ((r = e.currency) == null ? void 0 : r.thousandSeparator) ?? l.thousandSeparator
     };
-    o.seedBlockUrlConfig(n, y);
+    o.seedBlockUrlConfig(a, y);
   });
   try {
     await o.fetchRecommendationCreateData();
@@ -64,8 +60,8 @@ async function R(s) {
     );
   }
 }
-const G = () => {
-  const s = U(), u = F(), { getCompiledEmail: m, getTemplateData: o } = P(), { compileHtml: t, compileAmpHtml: a } = w();
+const v = () => {
+  const s = H(), u = U(), { getCompiledEmail: m, getTemplateData: o } = P(), { compileHtml: t, compileAmpHtml: n } = w();
   return {
     prepareTemplateDetails: async () => {
       const { html: d, ampHtml: e = "", ampErrors: y = [] } = await m({
@@ -73,7 +69,7 @@ const G = () => {
         resetDataSavedFlag: !1
       }), { html: c, css: p, syncModulesIds: g = [] } = await o();
       u.selectedUnsubscribePages.length && await u.fetchTemplates(), await R(c);
-      const { compiledHtml: f, stats: r, appliedRules: A } = t(d), C = e && a(e).compiledHtml, T = s.getSelectedDynamicContentList, D = b(), S = L(c);
+      const { compiledHtml: f, stats: r, appliedRules: A } = t(d), C = e && n(e).compiledHtml, T = s.getSelectedDynamicContentList, D = b(), S = F(c);
       return console.debug("HTML Compilation Stats:", {
         originalSize: r.originalSize,
         compiledSize: r.compiledSize,
@@ -101,6 +97,6 @@ const G = () => {
   };
 };
 export {
-  L as getHtmlReferencedUnsubscribePages,
-  G as useTemplatePreparation
+  F as getHtmlReferencedUnsubscribePages,
+  v as useTemplatePreparation
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.9.1-beta.fdaa66f",
+  "version": "3.10.0-beta.06d1f41",
   "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
   "main": "./dist/guido.umd.cjs",
   "module": "./dist/library.js",
@@ -37,7 +37,7 @@
   "license": "ISC",
   "dependencies": {
     "@stripoinc/ui-editor-extensions": "3.8.0",
-    "@useinsider/design-system-vue": "1.1.0-beta.73ec2fa",
+    "@useinsider/design-system-vue": "1.3.0",
     "@vueuse/core": "11.3.0",
     "lodash-es": "4.17.21",
     "pinia": "2.3.1",

package/dist/static/styles/components/notification.css.js

@@ -1,74 +0,0 @@
-const n = `ue-notifications-container {
-    left: 96px;
-    margin: 0;
-    bottom: 32px;
-    top: unset;
-    width: unset;
-    position: fixed;
-}
-
-ue-notifications-container ue-message + ue-message {
-    margin-bottom: 24px;
-}
-
-ue-notifications-container .alert-message-wrapper {
-    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.07);
-    border: none;
-    padding: 16px 24px;
-}
-
-ue-notifications-container .alert-message-wrapper.info,
-ue-notifications-container .alert-message-wrapper.loader {
-    background-color: var(--guido-color-background-toaster-info) !important;
-    color: inherit;
-}
-
-.alert-message-wrapper .alert-message-main {
-    align-items: center;
-}
-
-ue-notifications-container ue-caption .caption {
-    color: var(--guido-color-white) !important;
-}
-
-ue-block-thumb-hint {
-    text-align: left;
-}
-
-ue-notifications-container .alert-message-wrapper .alert-message-main .alert-message-content {
-    width: calc(100% - 64px);
-}
-
-ue-notifications-container .alert-message-wrapper .alert-message-main .alert-message-text {
-    font-size: 15px;
-    font-weight: 600;
-}
-
-ue-notifications-container .alert-message-text,
-ue-notifications-container .alert-message-wrapper ue-icon-component.icon,
-ue-notifications-container .alert-message-wrapper ue-icon-component.icon-button {
-    color: var(--guido-color-white);
-}
-
-ue-notifications-container ue-message ue-button.close {
-    margin: 0 0 0 16px;
-}
-
-ue-notifications-container .alert-message-wrapper.success {
-    background: var(--guido-color-background-toaster-success);
-    color: inherit;
-}
-
-ue-notifications-container .alert-message-wrapper.error {
-    background: var(--guido-color-background-toaster-error);
-    color: inherit;
-}
-
-ue-notifications-container .alert-message-wrapper.warn {
-    background: var(--guido-color-background-toaster-warn);
-    color: inherit;
-}
-`;
-export {
-  n as default
-};

package/dist/static/templates/empty/index.html.js

@@ -1,74 +0,0 @@
-const t = `<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html>
-
-<head>
-    <meta charset="UTF-8">
-    <meta content="width=device-width, initial-scale=1" name="viewport">
-    <meta name="x-apple-disable-message-reformatting">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta content="telephone=no" name="format-detection">
-    <title></title>
-    <!--[if (mso 16)]><style type="text/css">a{text-decoration:none}</style><![endif]-->
-    <!--[if gte mso 9]><style>sup{font-size:100% !important}</style><![endif]-->
-    <!--[if gte mso 9]><style>sup{font-size:100% !important}</style><![endif]-->
-    <!--[if gte mso 9]><style>sup{font-size:100% !important}</style><![endif]-->
-    <!--[if gte mso 9]><style>sup{font-size:100% !important}</style><![endif]-->
-    <!--[if gte mso 9]><style>sup { font-size: 100% !important; }</style><![endif]-->
-</head>
-
-<body>
-    <div class="es-wrapper-color">
-        <!--[if gte mso 9]>
-			<v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
-				<v:fill type="tile" color="#f6f6f6"></v:fill>
-			</v:background>
-		<![endif]-->
-        <table class="es-wrapper" width="100%" cellspacing="0" cellpadding="0">
-            <tbody>
-                <tr>
-                    <td class="esd-email-paddings" valign="top">
-                        <table class="es-content esd-footer-popover" cellspacing="0" cellpadding="0" align="center">
-                            <tbody>
-                                <tr>
-                                    <td class="esd-stripe" align="center">
-                                        <table class="es-content-body" width="600" cellspacing="0" cellpadding="0" bgcolor="#ffffff" align="center">
-                                            <tbody>
-                                                <tr>
-                                                    <td class="esd-structure es-p20" align="left">
-                                                        <table cellpadding="0" cellspacing="0" width="100%">
-                                                            <tbody>
-                                                                <tr>
-                                                                    <td width="560" class="esd-container-frame" align="center" valign="top">
-                                                                        <table cellpadding="0" cellspacing="0" width="100%">
-                                                                            <tbody>
-                                                                                <tr>
-                                                                                    <td align="center" class="esd-empty-container" style="display: none;"></td>
-                                                                                </tr>
-                                                                            </tbody>
-                                                                        </table>
-                                                                    </td>
-                                                                </tr>
-                                                            </tbody>
-                                                        </table>
-                                                    </td>
-                                                </tr>
-                                            </tbody>
-                                        </table>
-                                    </td>
-                                </tr>
-                            </tbody>
-                        </table>
-                    </td>
-                </tr>
-            </tbody>
-        </table>
-    </div>
-    <div style="position: absolute; left: -9999px; top: -9999px; margin: 0px;"></div>
-    <div style="position: absolute; left: -9999px; top: -9999px; margin: 0px; padding: 0px; border: 0px none; width: 1px;"></div>
-</body>
-
-</html>
-`;
-export {
-  t as default
-};