@useinsider/guido 3.9.0-beta.7791f66 → 3.9.0-beta.f67c6c8

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

@@ -1,101 +1,148 @@
-import { ATTR_CUSTOM_PREFIX as c, PRODUCT_ATTRIBUTE_PREFIX as l, ATTR_PRODUCT_IMAGE as b, ATTR_PRODUCT_NAME as T, ATTR_PRODUCT_OLD_PRICE as g, ATTR_PRODUCT_PRICE as _, ATTR_PRODUCT_OMNIBUS_PRICE as f, ATTR_PRODUCT_OMNIBUS_DISCOUNT as p, ATTR_PRODUCT_BUTTON as m } from "../constants/selectors.js";
-function U(t) {
-  return t.replace(/_/g, " ").replace(/\b\w/g, (n) => n.toUpperCase());
-}
-function S(t) {
-  const n = Array.isArray(t) ? t[t.length - 1] : t;
-  if (typeof n == "string")
-    return n;
-  if (typeof n == "number")
-    return String(n);
-}
-function C(t, n) {
-  const e = Object.values(n).find((o) => o.attributeName === t);
-  return (e == null ? void 0 : e.type) === "defaultAttribute";
-}
-function E(t, n) {
-  return C(t, n) ? t : `${l}${t}`;
-}
-function M(t) {
-  const n = t.startsWith(l) ? t.substring(l.length) : t;
-  return `${c}${n}`;
-}
-const P = Symbol("customCellHtml");
-function k(t, n, e = {}) {
-  const o = t[P];
+import { ATTR_PRODUCT_PRICE as c, ATTR_PRODUCT_OLD_PRICE as l, ATTR_CUSTOM_PREFIX as a, PRODUCT_ATTRIBUTE_PREFIX as u, ATTR_PRODUCT_IMAGE as f, ATTR_PRODUCT_NAME as T, ATTR_PRODUCT_OMNIBUS_PRICE as C, ATTR_PRODUCT_OMNIBUS_DISCOUNT as p, ATTR_PRODUCT_BUTTON as _ } from "../constants/selectors.js";
+import { useRecommendationExtensionStore as D } from "../store/recommendation.js";
+import { formatPrice as O } from "../utils/priceFormatter.js";
+function E() {
+  const t = D(), { currencySettings: e } = t.recommendationConfigs;
+  return {
+    code: e.value,
+    symbol: e.symbol,
+    alignment: e.alignment === "0" ? "before" : "after",
+    decimalCount: parseInt(e.decimalCount) || 2,
+    decimalSeparator: e.decimalSeparator,
+    thousandSeparator: e.thousandSeparator
+  };
+}
+function m(t, e = "price") {
+  const n = E(), o = t[e], r = (o == null ? void 0 : o[n.code]) ?? Object.values(o ?? {})[0] ?? 0;
+  return O({
+    price: r,
+    currency: n
+  });
+}
+function Y(t) {
+  return m(t, "price") === m(t, "original_price");
+}
+function I(t) {
+  return t.replace(/_/g, " ").replace(/\b\w/g, (e) => e.toUpperCase());
+}
+function G(t) {
+  const e = t.indexOf(c), n = t.indexOf(l), o = n !== -1 && (e === -1 || n < e);
+  return {
+    originalFirst: o,
+    anchor: o ? l : c,
+    skip: o ? c : l
+  };
+}
+function $(t) {
+  const e = Array.isArray(t) ? t[t.length - 1] : t;
+  if (typeof e == "string")
+    return e;
+  if (typeof e == "number")
+    return String(e);
+}
+function h(t, e) {
+  const n = Object.values(e).find((o) => o.attributeName === t);
+  return (n == null ? void 0 : n.type) === "defaultAttribute";
+}
+function L(t, e) {
+  return h(t, e) ? t : `${u}${t}`;
+}
+function j(t) {
+  const e = t.startsWith(u) ? t.substring(u.length) : t;
+  return `${a}${e}`;
+}
+const x = Symbol("customCellHtml");
+function z(t, e, n = {}) {
+  const o = t[x];
   if (!o)
     return { ...t };
-  const s = { ...t };
-  return n.filter((r) => r.startsWith(c) && !s[r]).forEach((r) => {
-    const i = r.substring(c.length), a = U(i), y = E(i, e), R = C(i, e);
-    s[r] = (d, A) => {
-      var u;
-      const D = R ? d[i] : (u = d.product_attributes) == null ? void 0 : u[i], O = S(D) ?? a;
-      return o(y, O, A);
+  const r = { ...t };
+  return e.filter((s) => s.startsWith(a) && !r[s]).forEach((s) => {
+    const i = s.substring(a.length), d = I(i), S = L(i, n), A = h(i, n);
+    r[s] = (g, R) => {
+      var b;
+      const P = A ? g[i] : (b = g.product_attributes) == null ? void 0 : b[i], U = $(P) ?? d;
+      return o(S, U, R);
     };
-  }), s;
+  }), r;
+}
+function V(t, e) {
+  var n, o, r, s, i;
+  return {
+    cellPadding: e.cellPadding,
+    cardBackgroundColor: e.cardBackgroundColor,
+    cellBackgroundColor: (n = e.cellBackgroundColors) == null ? void 0 : n[t],
+    cellAlignment: (o = e.cellAlignments) == null ? void 0 : o[t],
+    cellClasses: (r = e.cellClasses) == null ? void 0 : r[t],
+    omnibusText: (s = e.omnibusTexts) == null ? void 0 : s[t],
+    styleTemplate: (i = e.styleTemplates) == null ? void 0 : i[t]
+  };
 }
-const x = {
+const X = {
   TITLE: "You May Also Like!"
-}, v = [
-  b,
-  T,
-  g,
-  _,
+}, K = [
   f,
+  T,
+  l,
+  c,
+  C,
   p,
-  m
-], F = {
-  [b]: !0,
+  _
+], q = {
+  [f]: !0,
   [T]: !0,
-  [_]: !0,
-  [g]: !0,
-  [f]: !1,
+  [c]: !0,
+  [l]: !0,
+  [C]: !1,
   [p]: !1,
-  [m]: !0
-}, I = 10;
-function $(t = I) {
+  [_]: !0
+}, B = 10;
+function k(t = B) {
   return `
     <tr>
         <td class="spacer" style="height: ${t}px;"></td>
     </tr>
 `;
 }
-const L = $();
-function w(t, n) {
-  return n ? n.pStyle ?? "" : t;
+const v = k();
+function w(t, e) {
+  return e ? e.pStyle ?? "" : t;
 }
-function W(t, n, e) {
-  const o = w(n.pStyle, e), s = e ? e.openTags ?? "" : n.openTags, r = e ? e.closeTags ?? "" : n.closeTags;
-  return `<p contenteditable="false" style="${o}">${s}${t}${r}</p>`;
+function J(t, e, n) {
+  const o = w(e.pStyle, n), r = n ? n.openTags ?? "" : e.openTags, s = n ? n.closeTags ?? "" : e.closeTags;
+  return `<p contenteditable="false" style="${o}">${r}${t}${s}</p>`;
 }
-function H(t, n) {
-  const e = [];
-  return t && e.push(t), n && e.push(`background-color: ${n};`), e.join(" ");
+function Q(t, e) {
+  const n = [];
+  return t && n.push(t), e && n.push(`background-color: ${e};`), n.join(" ");
 }
-function Y(t) {
-  return t ? ` style="background-color: ${t};"` : "";
+function N(t) {
+  return t ? ` background-color: ${t};` : "";
+}
+function Z(t) {
+  const e = N(t);
+  return e ? ` style="${e.trim()}"` : "";
 }
-function G(t, n = "") {
+function tt(t, e = "") {
   return {
-    before: (t == null ? void 0 : t.before) ?? n,
+    before: (t == null ? void 0 : t.before) ?? e,
     after: (t == null ? void 0 : t.after) ?? ""
   };
 }
-function z(t, n) {
-  return `${(n == null ? void 0 : n.openTags) ?? ""}${t}${(n == null ? void 0 : n.closeTags) ?? ""}`;
+function et(t, e) {
+  return `${(e == null ? void 0 : e.openTags) ?? ""}${t}${(e == null ? void 0 : e.closeTags) ?? ""}`;
 }
-function X(t) {
+function nt(t) {
   return t != null && t.buttonFitToContainer ? "es-button-border es-fw" : "es-button-border";
 }
-const j = "display: block; max-width: 100%; height: auto;", V = "border-width: 1px; background: rgb(217, 234, 211); border-color: rgb(106, 168, 79);", K = "color: rgb(56, 118, 29); background: rgb(217, 234, 211); font-family: arial, 'helvetica neue', helvetica, sans-serif; font-size: 16px; font-weight: normal; line-height: 120%; mso-border-alt: 10px solid rgb(217, 234, 211); mso-padding-alt: 0;", h = "https://email-static.useinsider.com/stripo/modules/email-recommendation-v3/assets/images/image-placeholder.png";
-function q(t) {
-  return !t || typeof t != "string" || t.trim() === "" ? h : t.startsWith("http://") ? t.replace("http://", "https://") : t;
+const ot = "display: block; max-width: 100%; height: auto;", rt = "border-width: 1px; background: rgb(217, 234, 211); border-color: rgb(106, 168, 79);", st = "color: rgb(56, 118, 29); background: rgb(217, 234, 211); font-family: arial, 'helvetica neue', helvetica, sans-serif; font-size: 16px; font-weight: normal; line-height: 120%; mso-border-alt: 10px solid rgb(217, 234, 211); mso-padding-alt: 0;", y = "https://email-static.useinsider.com/stripo/modules/email-recommendation-v3/assets/images/image-placeholder.png";
+function it(t) {
+  return !t || typeof t != "string" || t.trim() === "" ? y : t.startsWith("http://") ? t.replace("http://", "https://") : t;
 }
-function B(t) {
+function F(t) {
   return {
     name: "Product Name",
-    image_url: h,
+    image_url: y,
     price: { USD: 18 },
     original_price: { USD: 20 },
     discount: { USD: 2 },
@@ -107,19 +154,19 @@ function B(t) {
     category: []
   };
 }
-function J(t = 6) {
+function ct(t = 6) {
   return Array.from(
     { length: t },
-    (n, e) => B(String(e + 1))
+    (e, n) => F(String(n + 1))
   );
 }
-function Q(t = "grid", n) {
-  const e = t === "list" ? `
-        data-layout="list"` : "", o = n ? ` ${n}` : "";
+function lt(t = "grid", e) {
+  const n = t === "list" ? `
+        data-layout="list"` : "", o = e ? ` ${e}` : "";
   return `
     <td
         align="left"
-        class="${`recommendation-block-v2 esd-block-recommendation-v3-block es-p20${t === "list" ? " es-m-p0 ins-recommendation-list-layout" : ""}${o}`}"${e}>
+        class="${`recommendation-block-v2 esd-block-recommendation-v3-block es-p20${t === "list" ? " es-m-p0 ins-recommendation-list-layout" : ""}${o}`}"${n}>
         <table width="100%" cellpadding="0" cellspacing="0" border="0">
             <tr>
                 <td align="center">
@@ -151,7 +198,7 @@ function Q(t = "grid", n) {
                                     </table>
                                 </td>
                             </tr>
-                            ${L}
+                            ${v}
                             <tr>
                                 <td>
                                     <table
@@ -190,31 +237,37 @@ function Q(t = "grid", n) {
 `;
 }
 export {
-  P as CUSTOM_CELL_HTML,
-  x as DEFAULTS,
-  K as DEFAULT_BUTTON_ANCHOR_STYLE,
-  V as DEFAULT_BUTTON_BORDER_STYLE,
-  v as DEFAULT_CARD_COMPOSITION,
-  F as DEFAULT_CARD_VISIBILITY,
-  j as DEFAULT_IMG_STYLE,
-  I as DEFAULT_ROW_SPACING_PX,
-  h as PLACEHOLDER_IMAGE,
-  k as buildElementRenderer,
-  $ as buildSpacer,
-  Y as cellBgStyleAttr,
-  Q as createBlockTemplate,
-  J as getDefaultProducts,
-  C as isDefaultAttribute,
-  z as renderButtonLabel,
-  W as renderStyledParagraph,
-  X as resolveButtonBorderClass,
-  G as resolveOmnibusText,
+  x as CUSTOM_CELL_HTML,
+  X as DEFAULTS,
+  st as DEFAULT_BUTTON_ANCHOR_STYLE,
+  rt as DEFAULT_BUTTON_BORDER_STYLE,
+  K as DEFAULT_CARD_COMPOSITION,
+  q as DEFAULT_CARD_VISIBILITY,
+  ot as DEFAULT_IMG_STYLE,
+  B as DEFAULT_ROW_SPACING_PX,
+  y as PLACEHOLDER_IMAGE,
+  N as bgColorFragment,
+  V as buildCellOptions,
+  z as buildElementRenderer,
+  k as buildSpacer,
+  Z as cellBgStyleAttr,
+  lt as createBlockTemplate,
+  m as formatProductPrice,
+  E as getCurrentCurrencyConfig,
+  ct as getDefaultProducts,
+  h as isDefaultAttribute,
+  Y as isSamePrice,
+  et as renderButtonLabel,
+  J as renderStyledParagraph,
+  nt as resolveButtonBorderClass,
+  G as resolveInlinePriceOrder,
+  tt as resolveOmnibusText,
   w as resolvePStyle,
-  E as resolveProductAttrValue,
-  H as resolveSegmentBgStyle,
-  q as sanitizeImageUrl,
-  L as spacer,
-  M as toCustomCompositionKey,
-  U as toDisplayName,
-  S as toDisplayableAttributeValue
+  L as resolveProductAttrValue,
+  Q as resolveSegmentBgStyle,
+  it as sanitizeImageUrl,
+  v as spacer,
+  j as toCustomCompositionKey,
+  I as toDisplayName,
+  $ as toDisplayableAttributeValue
 };

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

@@ -1,19 +1,20 @@
 var S = Object.defineProperty;
-var L = (c, o, e) => o in c ? S(c, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[o] = e;
-var a = (c, o, e) => L(c, typeof o != "symbol" ? o + "" : o, e);
-import { useToaster as f } from "../../../composables/useToaster.js";
+var f = (c, o, e) => o in c ? S(c, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[o] = e;
+var a = (c, o, e) => f(c, typeof o != "symbol" ? o + "" : o, e);
+import { useToaster as L } from "../../../composables/useToaster.js";
 import { ToasterTypeOptions as A } from "../../../enums/toaster.js";
 import { PAGE_TYPES as h } from "../../../enums/unsubscribe.js";
-import { useUnsubscribeStore as u } from "../../../stores/unsubscribe.js";
-import { Block as y, BlockCompositionType as T, ContextActionType as k, ModificationDescription as d, BlockType as I } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { getDefaultTemplate as v } from "./template.js";
+import { useEditorStore as y } from "../../../stores/editor.js";
+import { useUnsubscribeStore as l } from "../../../stores/unsubscribe.js";
+import { Block as T, BlockCompositionType as I, ContextActionType as B, ModificationDescription as d, BlockType as v } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { getDefaultTemplate as C } from "./template.js";
 import { UNSUBSCRIBE_BLOCK_SELECTOR as m, DATA_ATTRIBUTES as n, UNSUBSCRIBE_EVENTS as b } from "./utils/constants.js";
-import { parsePageList as B } from "./utils/utils.js";
-const C = "unsubscribe-block", E = 'a[data-unsubscribe-link="true"]', N = "{{ins-unsubscribe-link}}", U = "https://academy.insiderone.com/docs/adding-unsubscribe-pages-into-emails", R = "Removing the unsubscribe text leaves an empty block, but an active unsubscribe link is required. Undo your last action to restore the text, or delete the unsubscribe block entirely.", D = {
+import { parsePageList as _ } from "./utils/utils.js";
+const N = "unsubscribe-block", E = 'a[data-unsubscribe-link="true"]', U = "{{ins-unsubscribe-link}}", R = "https://academy.insiderone.com/docs/adding-unsubscribe-pages-into-emails", D = "Removing the unsubscribe text leaves an empty block, but an active unsubscribe link is required. Undo your last action to restore the text, or delete the unsubscribe block entirely.", w = {
   [h.GLOBAL_UNSUBSCRIBE]: "{{ins-global-unsubscribe-link}}",
   [h.SUBSCRIPTION_PREFERENCE_CENTER]: "{{ins-preferences-unsubscribe-link}}"
-}, w = 3;
-class H extends y {
+}, P = 3;
+class W extends T {
   constructor() {
     super();
     a(this, "selectEventListener", null);
@@ -29,13 +30,13 @@ class H extends y {
     a(this, "guardAttemptsByBlockId", /* @__PURE__ */ new Map());
   }
   getId() {
-    return C;
+    return N;
   }
   getIcon() {
     return "unsubscribe-icon";
   }
   getBlockCompositionType() {
-    return T.BLOCK;
+    return I.BLOCK;
   }
   getName() {
     return this.api.translate("Unsubscribe Block");
@@ -44,15 +45,16 @@ class H extends y {
     return this.api.translate("Unsubscribe Block Description");
   }
   getTemplate() {
-    return v();
+    return C();
   }
   getContextActionsIds() {
-    return [k.MOVE, k.REMOVE];
+    return [B.MOVE, B.REMOVE];
   }
   onSelect(e) {
-    this.currentNode = e;
+    if (this.currentNode = e, y().isPreviewModeOpen)
+      return;
     const t = this._getOrAssignBlockId(e);
-    t && this.linkStateByBlockId.set(t, this._hasUnsubscribeLink(e)), this._setupSelectEventListener(), this._setupCancelEventListener(), !("getAttribute" in e && e.getAttribute("data-migration")) && (this._resetStoreState(), this._loadBlockState(e), this._checkExistingBlocks(), this._openDrawer());
+    t && this.linkStateByBlockId.set(t, this._hasUnsubscribeLink(e)), this._setupSelectEventListener(), this._setupCancelEventListener(t), !("getAttribute" in e && e.getAttribute("data-migration")) && (this._resetStoreState(), t && (l().pendingBlockId = t), this._loadBlockState(e), this._checkExistingBlocks(), this._openDrawer());
   }
   onCreated(e) {
     this._ensureLeadingTextGuard(e);
@@ -107,9 +109,9 @@ class H extends y {
     const g = this._getOrAssignBlockId(e);
     if (!g)
       return;
-    const _ = this.guardAttemptsByBlockId.get(g) ?? 0;
-    if (!(_ >= w)) {
-      this.guardAttemptsByBlockId.set(g, _ + 1);
+    const k = this.guardAttemptsByBlockId.get(g) ?? 0;
+    if (!(k >= P)) {
+      this.guardAttemptsByBlockId.set(g, k + 1);
       try {
         this.api.getDocumentModifier().modifyHtml(r).prepend(" ").apply(new d("Ensure unsubscribe link text guard"));
       } catch (p) {
@@ -154,8 +156,8 @@ class H extends y {
       const t = this.api.getDocumentRoot();
       t && "querySelectorAll" in t && t.querySelectorAll(m).forEach((r) => {
         if ("getAttribute" in r) {
-          const i = r.getAttribute(n.BLOCK_ID), l = i ? parseInt(i) : 0;
-          l > e && (e = l);
+          const i = r.getAttribute(n.BLOCK_ID), u = i ? parseInt(i) : 0;
+          u > e && (e = u);
         }
       });
     } catch {
@@ -164,14 +166,14 @@ class H extends y {
   }
   _warnLinkRemoved() {
     try {
-      const { showToaster: e } = f();
+      const { showToaster: e } = L();
       e({
         type: A.Warning,
-        message: this.api.translate(R),
+        message: this.api.translate(D),
         actionButton: {
           text: this.api.translate("Visit Academy"),
           onClick: () => {
-            window.open(U, "_blank", "noopener,noreferrer");
+            window.open(R, "_blank", "noopener,noreferrer");
           }
         }
       });
@@ -188,9 +190,10 @@ class H extends y {
   _removeSelectEventListener() {
     this.selectEventListener && (document.removeEventListener(b.SELECT, this.selectEventListener), this.selectEventListener = null);
   }
-  _setupCancelEventListener() {
-    this._removeCancelEventListener(), this.cancelEventListener = () => {
-      this._handleCancel();
+  _setupCancelEventListener(e) {
+    this._removeCancelEventListener(), this.cancelEventListener = (t) => {
+      const { detail: s } = t;
+      ((s == null ? void 0 : s.blockId) ?? null) === e && this._handleCancel();
     }, document.addEventListener(b.CANCEL, this.cancelEventListener);
   }
   _removeCancelEventListener() {
@@ -200,7 +203,7 @@ class H extends y {
     try {
       if (!this.currentNode)
         return;
-      this.api.getDocumentModifier().modifyHtml(this.currentNode).replaceWith(`<${I.EMPTY_CONTAINER}/>`).apply(new d("Removed unsubscribe block due to cancel"));
+      this.api.getDocumentModifier().modifyHtml(this.currentNode).replaceWith(`<${v.EMPTY_CONTAINER}/>`).apply(new d("Removed unsubscribe block due to cancel"));
     } catch (e) {
       console.warn("[UnsubscribeBlock] Failed to remove unsubscribe block:", e);
     }
@@ -218,19 +221,19 @@ class H extends y {
     this.api.getDocumentModifier().modifyHtml(s).setAttribute("href", r).apply(new d(`Updated unsubscribe link to ${r}`)), this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute(n.PAGE_TYPE, e.toString()).setAttribute(n.PAGE_LIST, t).apply(new d("Updated unsubscribe block metadata"));
   }
   _getMergeTag(e) {
-    return D[e] ?? N;
+    return w[e] ?? U;
   }
   _openDrawer() {
     if (!(this.currentNode && this.currentNode.getAttribute("data-unsubscribe-page-type")))
       try {
-        const e = u();
+        const e = l();
         e.typeSelectionDrawerStatus = !0;
       } catch (e) {
         console.error("[UnsubscribeBlock] Failed to open drawer:", e);
       }
   }
   _checkExistingBlocks() {
-    const e = u();
+    const e = l();
     e.isGlobalUnsubscribeDisabled = !1, e.isSubscriptionPreferencesCenterDisabled = !1, this.api.getDocumentRoot().querySelectorAll(m).forEach((s) => {
       if ("getAttribute" in s) {
         const r = s.getAttribute(n.PAGE_TYPE);
@@ -247,11 +250,11 @@ class H extends y {
     const t = e.getAttribute(n.PAGE_TYPE), s = e.getAttribute(n.PAGE_LIST);
     if (!t || !s)
       return;
-    const r = u(), i = Number(t), l = B(s);
-    await r.fetchTemplates(), r.setCollectionWithoutAutoSelection(i), r.loadSelectedTemplates(l);
+    const r = l(), i = Number(t), u = _(s);
+    await r.fetchTemplates(), r.setCollectionWithoutAutoSelection(i), r.loadSelectedTemplates(u);
   }
   _resetStoreState() {
-    u().$reset();
+    l().$reset();
   }
   _removeBlockTemplatesFromStore(e) {
     if (!("getAttribute" in e))
@@ -259,11 +262,11 @@ class H extends y {
     const t = e.getAttribute(n.PAGE_LIST);
     if (!t)
       return;
-    const s = u(), r = B(t);
+    const s = l(), r = _(t);
     s.removeUnsubscribePages(r);
   }
 }
 export {
-  C as UNSUBSCRIBE_BLOCK_ID,
-  H as UnsubscribeBlock
+  N as UNSUBSCRIBE_BLOCK_ID,
+  W as UnsubscribeBlock
 };

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

@@ -1,18 +1,19 @@
 var T = Object.defineProperty;
-var p = (o, s, e) => s in o ? T(o, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[s] = e;
-var c = (o, s, e) => p(o, typeof s != "symbol" ? s + "" : s, e);
+var p = (a, s, e) => s in a ? T(a, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[s] = e;
+var c = (a, s, e) => p(a, typeof s != "symbol" ? s + "" : s, e);
+import { useEditorStore as _ } from "../../../stores/editor.js";
 import { useUnsubscribeStore as l } from "../../../stores/unsubscribe.js";
-import { Control as _, UEAttr as i, UIElementType as n } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { Control as g, UEAttr as i, UIElementType as n } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { DATA_ATTRIBUTES as d } from "./utils/constants.js";
 import { parsePageList as h } from "./utils/utils.js";
-const g = "ui-elements-unsubscribe", r = {
+const v = "ui-elements-unsubscribe", r = {
   SELECT_BUTTON: "selectTemplateButton",
   PREV_BUTTON: "prevButton",
   NEXT_BUTTON: "nextButton",
   COUNTER_TEXT: "counterText",
   PREVIEW_IMAGE: "previewImage"
 };
-class B extends _ {
+class w extends g {
   constructor() {
     super(...arguments);
     c(this, "currentPreviewIndex", 0);
@@ -22,7 +23,7 @@ class B extends _ {
     c(this, "lastParsedAttribute");
   }
   getId() {
-    return g;
+    return v;
   }
   getTemplate() {
     return `
@@ -59,10 +60,12 @@ class B extends _ {
       this.api.onValueChanged(r.NEXT_BUTTON, () => this._onNextClick())
     );
   }
-  _onButtonClick() {
+  async _onButtonClick() {
     try {
+      if (_().isPreviewModeOpen)
+        return;
       const e = l();
-      this._reseedSelectionFromBlock(), e.activeType = e.getSelectedCollection[this.currentPreviewIndex], e.pageSelectionUpdateStatus = !0, e.pageSelectionDrawerStatus = !0;
+      await e.fetchTemplates(!0), this._reseedSelectionFromBlock(), e.activeType = e.getSelectedCollection[this.currentPreviewIndex], e.pageSelectionUpdateStatus = !0, e.pageSelectionDrawerStatus = !0;
     } catch (e) {
       console.error("[UnsubscribeControl] Failed to open drawer:", e);
     }
@@ -71,8 +74,8 @@ class B extends _ {
     const e = l();
     if (e.$reset(), !this.currentNode || !("getAttribute" in this.currentNode))
       return;
-    const t = this.currentNode.getAttribute(d.PAGE_TYPE), a = this.currentNode.getAttribute(d.PAGE_LIST);
-    !t || !a || (e.setCollectionWithoutAutoSelection(Number(t)), e.loadSelectedTemplates(h(a)));
+    const t = this.currentNode.getAttribute(d.PAGE_TYPE), o = this.currentNode.getAttribute(d.PAGE_LIST);
+    !t || !o || (e.setCollectionWithoutAutoSelection(Number(t)), e.loadSelectedTemplates(h(o)));
   }
   _onPrevClick() {
     this.currentPreviewIndex > 0 && (this.currentPreviewIndex--, this._updatePreview(), this._updateCounter());
@@ -100,8 +103,8 @@ class B extends _ {
       }
   }
   _updateCounter() {
-    const e = this.currentPreviewIndex + 1, t = this.totalTemplates, a = this.currentPreviewIndex === 0, u = this.currentPreviewIndex >= t - 1;
-    this.api.setUIEAttribute(r.PREV_BUTTON, i.BUTTON.disabled, a), this.api.setUIEAttribute(r.NEXT_BUTTON, i.BUTTON.disabled, u), this.api.setUIEAttribute(
+    const e = this.currentPreviewIndex + 1, t = this.totalTemplates, o = this.currentPreviewIndex === 0, u = this.currentPreviewIndex >= t - 1;
+    this.api.setUIEAttribute(r.PREV_BUTTON, i.BUTTON.disabled, o), this.api.setUIEAttribute(r.NEXT_BUTTON, i.BUTTON.disabled, u), this.api.setUIEAttribute(
       r.COUNTER_TEXT,
       i.LABEL.text,
       `${this.api.translate("Showing")} ${e} ${this.api.translate("of")} ${t}`
@@ -142,8 +145,8 @@ class B extends _ {
             </${n.LABEL}>
         `;
   }
-  _getIconButton(e, t, a) {
-    const u = a ? `${i.BUTTON.disabled}="true"` : "";
+  _getIconButton(e, t, o) {
+    const u = o ? `${i.BUTTON.disabled}="true"` : "";
     return `
             <${n.BUTTON}
                 id="${e}"
@@ -172,6 +175,6 @@ class B extends _ {
   }
 }
 export {
-  g as UNSUBSCRIBE_CONTROL_ID,
-  B as UnsubscribeControl
+  v as UNSUBSCRIBE_CONTROL_ID,
+  w as UnsubscribeControl
 };