@useinsider/guido 2.0.0-beta.087a24f → 2.0.0-beta.0941bcd

package/dist/extensions/Blocks/Recommendation/templates/utils.js

@@ -0,0 +1,121 @@
+import { ATTR_PRODUCT_IMAGE as r, ATTR_PRODUCT_NAME as a, ATTR_PRODUCT_OLD_PRICE as o, ATTR_PRODUCT_PRICE as c, ATTR_PRODUCT_OMNIBUS_PRICE as l, ATTR_PRODUCT_OMNIBUS_DISCOUNT as s, ATTR_PRODUCT_BUTTON as n } from "../constants/selectors.js";
+const _ = {
+  TITLE: "You May Also Like!"
+}, u = [
+  r,
+  a,
+  o,
+  c,
+  l,
+  s,
+  n
+], m = {
+  [r]: !0,
+  [a]: !0,
+  [c]: !0,
+  [o]: !0,
+  [l]: !1,
+  [s]: !1,
+  [n]: !0
+}, d = `
+    <tr>
+        <td class="spacer" style="height: 10px;"></td>
+    </tr>
+`, i = "https://email-static.useinsider.com/stripo/modules/email-recommendation-v3/assets/images/image-placeholder.png";
+function g(t) {
+  return !t || typeof t != "string" || t.trim() === "" ? i : t.startsWith("http://") ? t.replace("http://", "https://") : t;
+}
+function e(t) {
+  return {
+    name: "Product Name",
+    image_url: i,
+    price: { USD: 18 },
+    original_price: { USD: 20 },
+    discount: { USD: 2 },
+    url: `https://example.com/product/${t}`,
+    item_id: t,
+    in_stock: 1,
+    locale: "en",
+    product_attributes: {},
+    category: []
+  };
+}
+function b() {
+  return [
+    e("1"),
+    e("2"),
+    e("3"),
+    e("4"),
+    e("5"),
+    e("6")
+  ];
+}
+function R(t = "grid") {
+  return `
+    <td
+        align="left"
+        class="ins-recommendation-v3-block-v2 esd-block-recommendation-v3-block es-p20"${t === "list" ? `
+        data-layout="list"` : ""}>
+        <table width="100%" cellpadding="0" cellspacing="0" border="0">
+            <tr>
+                <td align="center">
+                    <table
+                        class="container"
+                        width="100%"
+                        cellpadding="0"
+                        cellspacing="0"
+                        border="0">
+                        <tbody>
+                            <tr>
+                                <td>
+                                    <table
+                                        width="100%"
+                                        cellpadding="0"
+                                        cellspacing="0"
+                                        border="0">
+                                        <tbody>
+                                            <tr>
+                                                <td
+                                                    class="esd-block-text es-p10t es-p10b es-p20l es-p20r"
+                                                    align="center">
+                                                    <p style="font-size: 28px; color: #333333;">
+                                                        <strong>{-{-TITLE-}-}</strong>
+                                                    </p>
+                                                </td>
+                                            </tr>
+                                        </tbody>
+                                    </table>
+                                </td>
+                            </tr>
+                            ${d}
+                            <tr>
+                                <td>
+                                    <table
+                                        class="ins-recommendation-product-container"
+                                        width="100%"
+                                        cellpadding="0"
+                                        cellspacing="0"
+                                        border="0"
+                                    >
+                                        {-{-PRODUCT_ROWS-}-}
+                                    </table>
+                                </td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </td>
+            </tr>
+        </table>
+    </td>
+`;
+}
+export {
+  _ as DEFAULTS,
+  u as DEFAULT_CARD_COMPOSITION,
+  m as DEFAULT_CARD_VISIBILITY,
+  i as PLACEHOLDER_IMAGE,
+  R as createBlockTemplate,
+  b as getDefaultProducts,
+  g as sanitizeImageUrl,
+  d as spacer
+};

package/dist/extensions/Blocks/Recommendation/types/nodeConfig.js

@@ -0,0 +1,6 @@
+function f(n) {
+  return !n || typeof n != "object" ? !1 : typeof n.configVersion == "number";
+}
+export {
+  f as hasMinimalConfig
+};

package/dist/extensions/Blocks/Recommendation/utils/filterUtil.js

@@ -1,28 +1,28 @@
 function l(t) {
   if (t.length === 0)
     return "";
-  const o = t.sort((r, e) => r.filterNumber - e.filterNumber), n = o.map((r) => `[${r.attribute}][${r.operatorReplace}][${r.value}]`), [s, ...p] = n;
-  let u = s;
+  const o = t.sort((r, e) => r.filterNumber - e.filterNumber), n = o.map((r) => `[${r.attribute}][${r.operatorReplace}][${r.value}]`), [i, ...p] = n;
+  let u = i;
   for (let r = 0; r < p.length; r++) {
     const e = o[r + 1].innerGroupOperator;
     u += `${e}${p[r]}`;
   }
   return `(${u})`;
 }
-function m(t) {
+function f(t) {
   if (!t || t.length === 0)
     return "";
-  const o = t.reduce((r, e) => (r[e.filterGroup] || (r[e.filterGroup] = []), r[e.filterGroup].push(e), r), {}), n = Object.keys(o).map(Number).sort((r, e) => r - e), s = n.map((r) => {
+  const o = t.reduce((r, e) => (r[e.filterGroup] || (r[e.filterGroup] = []), r[e.filterGroup].push(e), r), {}), n = Object.keys(o).map(Number).sort((r, e) => r - e), i = n.map((r) => {
     const e = o[r];
     return l(e);
-  }), [p, ...u] = s;
-  let i = p;
+  }), [p, ...u] = i;
+  let s = p;
   for (let r = 0; r < u.length; r++) {
     const e = n[r + 1], c = o[e][0].outerGroupOperator;
-    i += `${c}${u[r]}`;
+    s += `${c}${u[r]}`;
   }
-  return console.debug("🎉 Complete query generated:", i), i.trim();
+  return s.trim();
 }
 export {
-  m as generateCompleteFilterQuery
+  f as generateCompleteFilterQuery
 };

package/dist/extensions/Blocks/Recommendation/utils/preserveTextStyles.js

@@ -0,0 +1,36 @@
+function p(t) {
+  const r = {
+    "&": "&",
+    "<": "&lt;",
+    ">": "&gt;",
+    '"': "&quot;",
+    "'": "&#39;"
+  };
+  return t.replace(/[&<>"']/g, (n) => r[n]);
+}
+function m(t) {
+  return "getInnerHTML" in t && typeof t.getInnerHTML == "function" ? t.getInnerHTML() : "innerHTML" in t ? t.innerHTML : "";
+}
+function T(t, r) {
+  const n = p(r);
+  if (!t)
+    return n;
+  const e = m(t);
+  if (!e || e.trim() === "" || !/<(strong|em|u|s|b|i)\b/i.test(e))
+    return n;
+  const i = [], o = [];
+  let c = e.trim();
+  for (; ; ) {
+    const u = c.match(/^<(strong|em|u|s|b|i)(\s[^>]*)?>(.*)$/is);
+    if (!u)
+      break;
+    const [, s, f = "", g] = u, a = new RegExp(`</${s}>$`, "i");
+    if (!a.test(g))
+      break;
+    i.push(`<${s}${f}>`), o.unshift(`</${s}>`), c = g.replace(a, "").trim();
+  }
+  return i.length > 0 ? i.join("") + n + o.join("") : n;
+}
+export {
+  T as preserveTextStyles
+};

package/dist/extensions/Blocks/Recommendation/utils/priceFormatter.js

@@ -0,0 +1,29 @@
+function d(a, t) {
+  const { thousandSeparator: s, decimalSeparator: e, decimalCount: r } = t, u = Math.abs(a).toFixed(r), [c, o] = u.split("."), n = c.replace(
+    /\B(?=(\d{3})+(?!\d))/g,
+    s
+  ), i = a < 0 ? "-" : "";
+  return r > 0 && o ? `${i}${n}${e}${o}` : `${i}${n}`;
+}
+function m(a) {
+  const { price: t, currency: s } = a, {
+    symbol: e,
+    alignment: r,
+    thousandSeparator: u,
+    decimalSeparator: c,
+    decimalCount: o
+  } = s;
+  if (typeof t != "number" || Number.isNaN(t)) {
+    const i = "0".repeat(o), $ = `0${c}${i}`;
+    return r === "before" ? `${e} ${$}` : `${$} ${e}`;
+  }
+  const n = d(t, {
+    thousandSeparator: u,
+    decimalSeparator: c,
+    decimalCount: o
+  });
+  return r === "before" ? `${e} ${n}` : `${n} ${e}`;
+}
+export {
+  m as formatPrice
+};

package/dist/extensions/Blocks/Recommendation/utils/tagName.js

@@ -0,0 +1,46 @@
+function a(t) {
+  return typeof t == "object" && t !== null && "tagName" in t && typeof t.tagName == "string";
+}
+function r(t) {
+  return typeof t == "object" && t !== null && "getTagName" in t && typeof t.getTagName == "function";
+}
+function n(t) {
+  return typeof t == "object" && t !== null && "getStyle" in t && typeof t.getStyle == "function";
+}
+function u(t) {
+  return typeof t == "object" && t !== null && "parent" in t && typeof t.parent == "function";
+}
+function g(t) {
+  return typeof t == "object" && t !== null && "tagName" in t && t.tagName === "TD";
+}
+function p(t, e) {
+  return !t || !n(t) ? null : t.getStyle(e);
+}
+function N(t) {
+  return !t || !u(t) ? null : t.parent();
+}
+function l(t, e = "UNKNOWN") {
+  return t ? a(t) ? t.tagName.toUpperCase() : r(t) ? t.getTagName().toUpperCase() : e : e;
+}
+const f = /* @__PURE__ */ new Set(["TD", "BLOCK_IMAGE", "BLOCK_BUTTON"]);
+function i(t) {
+  return f.has(t.toUpperCase());
+}
+function c(t) {
+  const e = l(t);
+  return i(e);
+}
+function s(t) {
+  return c(t) ? "table-cell" : "table-row";
+}
+export {
+  s as getTableDisplayValue,
+  l as getTagName,
+  n as hasGetStyle,
+  u as hasParent,
+  c as isTableCellNode,
+  i as isTableCellTag,
+  g as isTdNode,
+  N as safeGetParent,
+  p as safeGetStyle
+};

package/dist/extensions/Blocks/Unsubscribe/extension.js

@@ -1,21 +1,21 @@
 import { ExtensionBuilder as e } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { UnsubscribeBlock as i } from "./block.js";
 import { UnsubscribeControl as t } from "./control.js";
-import { PreviewUIElement as o } from "./elements/preview.js";
-import { UnsubscribeIconsRegistry as r } from "./iconsRegistry.js";
-import { SettingsPanel as s } from "./settingsPanel.js";
+import { PreviewUIElement as s } from "./elements/preview.js";
+import { UnsubscribeIconsRegistry as o } from "./iconsRegistry.js";
+import { SettingsPanel as r } from "./settingsPanel.js";
 import n from "./styles.css.js";
-import { UnsubscribeTagRegistry as l } from "./tagRegistry.js";
-const f = new e().addBlock(i).withSettingsPanelRegistry(s).addControl(t).addUiElement(o).addStyles(n).withLocalization({
+import { UnsubscribeTagRegistry as c } from "./tagRegistry.js";
+const g = new e().addBlock(i).withSettingsPanelRegistry(r).addControl(t).addUiElement(s).addStyles(n).withLocalization({
   en: {
-    "Unsubscribe Block": "Unsubscribe Block",
-    "Unsubscribe Block Description": "Add an unsubscribe link to your email",
+    "Unsubscribe Block": "Unsubscribe",
+    "Unsubscribe Block Description": "Unsubscribe lets you add an Unsubscribe Link to direct users to opt out of receiving your messages.",
     "Select Template": "Select Template",
     "Unsubscribe Template": "Unsubscribe Template",
     Showing: "Showing",
     of: "of"
   }
-}).withUiElementTagRegistry(l).withIconsRegistry(r).build();
+}).withUiElementTagRegistry(c).withIconsRegistry(o).build();
 export {
-  f as default
+  g as default
 };

package/dist/extensions/Blocks/common-control.js

@@ -1,12 +1,12 @@
 var c = Object.defineProperty;
-var I = (T, r, e) => r in T ? c(T, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : T[r] = e;
-var l = (T, r, e) => I(T, typeof r != "symbol" ? r + "" : r, e);
-import { Control as s, UIElementType as t, UEAttr as $ } from "../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-class B extends s {
+var I = (a, r, e) => r in a ? c(a, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[r] = e;
+var u = (a, r, e) => I(a, typeof r != "symbol" ? r + "" : r, e);
+import { Control as O, UIElementType as t, UEAttr as $ } from "../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+class _ extends O {
   constructor() {
     super(...arguments);
-    l(this, "currentNode");
-    l(this, "lastBlockInstanceId", null);
+    u(this, "currentNode");
+    u(this, "lastBlockInstanceId", null);
   }
   getContainer() {
     var e;
@@ -19,54 +19,42 @@ class B extends s {
     this.lastBlockInstanceId = null;
   }
   /**
-   * Gets the Items block container element from the current node.
-   * @returns The container element or null if not found
-   */
-  getItemsBlockContainer() {
-    return this.currentNode ? this.currentNode.closest(".items-block-v2") : null;
-  }
-  /**
-   * Gets the config block element from the current node (legacy support).
-   * @deprecated Use getNodeConfig() from nodeConfigUtils instead for Stripo V2
+   * Gets the config block element from the current node.
    * @returns The config block element or null if not found
    */
   getConfigBlock() {
-    const e = this.getItemsBlockContainer();
+    if (!this.currentNode)
+      return null;
+    const e = this.currentNode.closest(".items-block-v2");
     return e ? e.querySelector("esd-config-block") : null;
   }
   /**
-   * Gets the current block instance ID from the node config (Stripo V2) or legacy config block.
+   * Gets the current block instance ID from the config block.
+   * @param blockInstanceIdAttribute - The attribute name for block instance ID (default: 'data-block-instance-id')
    * @returns The block instance ID or null if not found
    */
-  getBlockInstanceId() {
-    const e = this.getItemsBlockContainer();
-    if (!e)
-      return null;
-    const n = e.getNodeConfig();
-    if (n && typeof n.blockInstanceId == "string")
-      return n.blockInstanceId;
-    const o = this.getConfigBlock();
-    return o ? o.getAttribute("data-block-instance-id") : null;
+  getBlockInstanceId(e = "data-block-instance-id") {
+    const n = this.getConfigBlock();
+    return n ? n.getAttribute(e) : null;
   }
   /**
    * Handles block instance change detection and syncing.
-   * This is a helper method for controls that need to sync config when switching between block instances.
-   * Uses Stripo V2 nodeConfig API for block instance tracking.
-   * @param syncFunction - Function to call when block instance changes (to sync from node config)
+   * This is a helper method for controls that need to sync attributes when switching between block instances.
+   * @param syncFunction - Function to call when block instance changes (to sync from attributes)
    * @param updateUI - Function to call to update the UI (called both on change and when same block)
+   * @param blockInstanceIdAttribute - The attribute name for block instance ID (default: 'data-block-instance-id')
    * @returns true if block instance changed, false otherwise
    */
-  handleBlockInstanceChange(e, n) {
-    const o = this.getBlockInstanceId();
+  handleBlockInstanceChange(e, n, E = "data-block-instance-id") {
+    const o = this.getBlockInstanceId(E);
     if (!o)
       return !1;
-    const E = o !== this.lastBlockInstanceId;
-    return E ? (this.currentNode && e(this.currentNode), n(), this.lastBlockInstanceId = o) : n(), E;
+    const T = o !== this.lastBlockInstanceId;
+    return T ? (this.currentNode && e(this.currentNode), n(), this.lastBlockInstanceId = o) : n(), T;
   }
-  _GuLabel({ text: e, name: n = "", position: o = "top" }) {
+  _GuLabel({ text: e, name: n = "" }) {
     return `
             <${t.LABEL} 
-                style="${o === "top" ? "margin-bottom: 8px;" : ""}"
                 ${$.LABEL.text}="${e}" 
                 ${$.LABEL.name}="${n || `${e} Label`}">
             </${t.LABEL}>
@@ -86,59 +74,59 @@ class B extends s {
                 ${$.SELECT_ITEM.value}="${n}">
             </${t.SELECT_ITEM}>`;
   }
-  _GuSelect({ name: e, placeholder: n, options: o, className: E = "es-180w" }) {
+  _GuSelect({ name: e, placeholder: n, options: E, className: o = "es-180w" }) {
     return `
             <${t.SELECTPICKER}
-                class="${E}"
+                class="${o}"
                 ${$.SELECTPICKER.name}="${e}"
                 ${$.SELECTPICKER.placeholder}="${n}">
-                    ${o.map((a) => this._GuSelectItem(a)).join("")}
+                    ${E.map((T) => this._GuSelectItem(T)).join("")}
             </${t.SELECTPICKER}>
         `;
   }
-  _GuTextInput({ name: e, placeholder: n, className: o = "", disabled: E = !1 }) {
+  _GuTextInput({ name: e, placeholder: n, className: E = "", disabled: o = !1 }) {
     return `
             <${t.TEXT}
-                class=${o}
+                class=${E}
                 ${$.TEXT.name}="${e}"
                 placeholder="${n || e}"
-                ${E ? `${$.TEXT.disabled}="true"` : ""}>
+                ${o ? `${$.TEXT.disabled}="true"` : ""}>
             </${t.TEXT}>
         `;
   }
-  _GuCounter({ name: e, maxValue: n, minValue: o = 1, step: E = 1 }) {
+  _GuCounter({ name: e, maxValue: n, minValue: E = 1, step: o = 1 }) {
     return `
             <${t.COUNTER}
                 ${$.COUNTER.name}="${e}"
-                ${$.COUNTER.minValue}="${o}"
+                ${$.COUNTER.minValue}="${E}"
                 ${$.COUNTER.maxValue}="${n}"
-                ${$.COUNTER.step}="${E}">
+                ${$.COUNTER.step}="${o}">
             </${t.COUNTER}>
         `;
   }
-  _GuRadioButtonItem({ text: e, value: n, icon: o }) {
+  _GuRadioButtonItem({ text: e, value: n, icon: E }) {
     return `
             <${t.RADIO_ITEM}
                 ${$.RADIO_ITEM.value}="${n}"
                 ${e ? `${$.RADIO_ITEM.text}="${e}"` : ""}
-                ${o ? `${$.RADIO_ITEM.icon}="${o}"` : ""}>
+                ${E ? `${$.RADIO_ITEM.icon}="${E}"` : ""}>
             </${t.RADIO_ITEM}>
         `;
   }
-  _GuRadioButton({ name: e, buttons: n, id: o = "" }) {
+  _GuRadioButton({ name: e, buttons: n, id: E = "" }) {
     return `
             <${t.RADIO_BUTTONS}
-                ${o ? `id="${o}"` : ""}
+                ${E ? `id="${E}"` : ""}
                 ${$.RADIO_BUTTONS.name}="${e}">
-                ${n.map((E) => this._GuRadioButtonItem(E)).join("")}
+                ${n.map((o) => this._GuRadioButtonItem(o)).join("")}
             </${t.RADIO_BUTTONS}>
         `;
   }
-  _GuButton({ name: e, label: n, id: o = "" }) {
+  _GuButton({ name: e, label: n, id: E = "" }) {
     return `
             <${t.BUTTON}
                 ${$.BUTTON.name}="${e}"
-                ${o ? `id="${o}"` : ""}
+                ${E ? `id="${E}"` : ""}
                 ${$.BUTTON.caption}="${n}"}>
             </${t.BUTTON}>
         `;
@@ -148,10 +136,10 @@ class B extends s {
    * @param param0
    * @returns It returns a button with an icon.
    */
-  _GuIconButton({ name: e, icon: n, className: o = "" }) {
+  _GuIconButton({ name: e, icon: n, className: E = "" }) {
     return `
             <${t.BUTTON}
-                class="${o}"
+                class="${E}"
                 ${$.BUTTON.name}="${e}"
                 ${$.BUTTON.icon}="${n}">
             </${t.BUTTON}>
@@ -179,19 +167,19 @@ class B extends s {
    * @returns HTML string for the orderable control
    */
   _GuOrderable(e, n) {
-    let o = "";
-    n.forEach((a) => {
-      const u = $.ORDERABLE_ITEM && "name" in $.ORDERABLE_ITEM ? $.ORDERABLE_ITEM.name : "name";
-      o += `
-                <${t.ORDERABLE_ITEM} ${u}="${a.key}">
-                    ${a.content}
+    let E = "";
+    n.forEach((T) => {
+      const l = $.ORDERABLE_ITEM && "name" in $.ORDERABLE_ITEM ? $.ORDERABLE_ITEM.name : "name";
+      E += `
+                <${t.ORDERABLE_ITEM} ${l}="${T.key}">
+                    ${T.content}
                 </${t.ORDERABLE_ITEM}>
             `;
     });
-    const E = $.ORDERABLE && "name" in $.ORDERABLE ? $.ORDERABLE.name : "name";
+    const o = $.ORDERABLE && "name" in $.ORDERABLE ? $.ORDERABLE.name : "name";
     return `
-            <${t.ORDERABLE} ${E}="${e}">
-                ${o}
+            <${t.ORDERABLE} ${o}="${e}">
+                ${E}
             </${t.ORDERABLE}>
         `;
   }
@@ -232,16 +220,16 @@ class B extends s {
         `;
   }
   _GuRadioButtons(e, n) {
-    const o = n.map((E) => `
+    const E = n.map((o) => `
                 <${t.RADIO_ITEM}
-                    ${$.RADIO_ITEM.text}="${E.text}"
-                    ${$.RADIO_ITEM.value}="${E.value}">
+                    ${$.RADIO_ITEM.text}="${o.text}"
+                    ${$.RADIO_ITEM.value}="${o.value}">
                 </${t.RADIO_ITEM}>
             `).join("");
     return `
             <${t.RADIO_BUTTONS}
                 ${$.RADIO_BUTTONS.name}="${e}">
-                ${o}
+                ${E}
             </${t.RADIO_BUTTONS}>
         `;
   }
@@ -255,5 +243,5 @@ class B extends s {
   }
 }
 export {
-  B as CommonControl
+  _ as CommonControl
 };