@useinsider/guido 3.3.0-beta.2d923be → 3.3.0-beta.402c269

package/dist/composables/useCustomInterfaceAppearance.js

@@ -4,20 +4,21 @@ import e from "../static/styles/components/amp-block.css.js";
 import i from "../static/styles/components/base-input.css.js";
 import p from "../static/styles/components/button-group.css.js";
 import n from "../static/styles/components/button.css.js";
-import s from "../static/styles/components/combobox.css.js";
-import C from "../static/styles/components/counter.css.js";
+import C from "../static/styles/components/combobox.css.js";
+import s from "../static/styles/components/counter.css.js";
 import f from "../static/styles/components/dropdown-menu.css.js";
 import a from "../static/styles/components/loader.css.js";
 import u from "../static/styles/components/narrow-panel.css.js";
-import c from "../static/styles/components/popup.css.js";
-import d from "../static/styles/components/switcher.css.js";
-import l from "../static/styles/components/tabs.css.js";
-import h from "../static/styles/components/tools.css.js";
-import w from "../static/styles/components/version-history.css.js";
-import y from "../static/styles/components/wide-panel.css.js";
-import B from "../static/styles/variables.css.js";
-const b = [
-  B,
+import c from "../static/styles/components/notification.css.js";
+import d from "../static/styles/components/popup.css.js";
+import l from "../static/styles/components/switcher.css.js";
+import h from "../static/styles/components/tabs.css.js";
+import w from "../static/styles/components/tools.css.js";
+import y from "../static/styles/components/version-history.css.js";
+import B from "../static/styles/components/wide-panel.css.js";
+import b from "../static/styles/variables.css.js";
+const A = [
+  b,
   // Must be on top
   S,
   // Must be on top
@@ -26,8 +27,8 @@ const b = [
   i,
   p,
   n,
-  s,
   C,
+  s,
   f,
   a,
   u,
@@ -36,12 +37,13 @@ const b = [
   l,
   h,
   w,
-  y
+  y,
+  B
 ].join(`
 
-`), v = () => ({ importCss: () => {
+`), F = () => ({ importCss: () => {
   const o = new CSSStyleSheet();
-  o.replaceSync(b);
+  o.replaceSync(A);
   const r = document.querySelector("ui-editor");
   if (!r)
     return;
@@ -49,5 +51,5 @@ const b = [
   t && (t.adoptedStyleSheets = [o]);
 } });
 export {
-  v as useCustomInterfaceAppearance
+  F as useCustomInterfaceAppearance
 };

package/dist/composables/useRecommendation.js

@@ -1,4 +1,4 @@
-import { RecommendationFeedSourceMaps as I, URLS as C } from "../enums/extensions/recommendationBlock.js";
+import { getRecommendationFeedSourceMaps as I, URLS as C } from "../enums/extensions/recommendationBlock.js";
 import { MinDeviceViewport as R, DefaultPadding as b } from "../enums/recommendation.js";
 import { useRecommendationExtensionStore as m } from "../extensions/Blocks/Recommendation/store/recommendation.js";
 import { generateCompleteFilterQuery as h } from "../extensions/Blocks/Recommendation/utils/filterUtil.js";
@@ -63,7 +63,7 @@ const w = () => ({
         shuffleProducts: o.shuffleProducts
       };
     }
-    const f = ((l = I.find((i) => i.key === e.strategy)) == null ? void 0 : l.path) || "", t = new URLSearchParams();
+    const f = ((l = I().find((i) => i.key === e.strategy)) == null ? void 0 : l.path) || "", t = new URLSearchParams();
     if (t.set("locale", e.language), t.set("currency", e.currencyCode), t.set("partnerName", n.partnerName), t.set("size", e.size), t.set("details", "true"), t.set("campaignId", n.variationId), e.strategy === "manualMerchandising") {
       const i = parseInt(e.size) || 6;
       t.set("productId", e.productIds.slice(0, i).join(","));

package/dist/composables/useStripo.js

@@ -1,28 +1,27 @@
-import { useActionsApi as I } from "./useActionsApi.js";
-import { useBlocksConfig as P } from "./useBlocksConfig.js";
-import { useConfig as U } from "./useConfig.js";
-import { useCustomInterfaceAppearance as R } from "./useCustomInterfaceAppearance.js";
-import { useFullStoryBridge as q } from "./useFullStoryBridge.js";
-import { useStripoEventHandler as x } from "./useStripoEventHandler.js";
-import { useStripoNotifications as H } from "./useStripoNotifications.js";
-import { useToaster as N } from "./useToaster.js";
-import { localePatch as O } from "../config/i18n/index.js";
-import { useStripoApi as j } from "../services/stripoApi.js";
-import L from "../static/styles/customEditorStyle.css.js";
+import { useActionsApi as D } from "./useActionsApi.js";
+import { useBlocksConfig as I } from "./useBlocksConfig.js";
+import { useConfig as P } from "./useConfig.js";
+import { useCustomInterfaceAppearance as U } from "./useCustomInterfaceAppearance.js";
+import { useFullStoryBridge as R } from "./useFullStoryBridge.js";
+import { useStripoEventHandler as q } from "./useStripoEventHandler.js";
+import { useToaster as x } from "./useToaster.js";
+import { localePatch as H } from "../config/i18n/index.js";
+import { useStripoApi as O } from "../services/stripoApi.js";
+import j from "../static/styles/customEditorStyle.css.js";
 import { useEditorStore as E } from "../stores/editor.js";
-import { dynamicContentToMergeTags as $ } from "../utils/genericUtil.js";
-import z from "../package.json.js";
-const dt = (C, c) => {
-  const { features: l, template: h, isFeatureEnabled: u } = U(), { handleError: m } = N(), { getToken: w, getCustomFonts: b, getSyncModulesStatus: k } = j(), { handleEvent: B } = x(), { getStripoNotifications: T } = H(), { getStripoBlocksConfig: V } = P(), _ = async (i, r = [], s = !1) => {
+import { dynamicContentToMergeTags as L } from "../utils/genericUtil.js";
+import $ from "../package.json.js";
+const se = (C, l) => {
+  const { features: c, template: h, isFeatureEnabled: u } = P(), { handleError: m } = x(), { getToken: w, getCustomFonts: b, getSyncModulesStatus: k } = O(), { handleEvent: B } = q(), { getStripoBlocksConfig: T } = I(), V = async (i, r = [], s = !1) => {
     var g, S, y;
-    const t = E(), { html: p, css: a } = i, { baseBlocks: o, extensions: d } = await V(), f = ((g = l.value) == null ? void 0 : g.displayConditions) ?? !0, v = ((S = l.value) == null ? void 0 : S.modulesDisabled) ?? !1, M = ((y = h.value) == null ? void 0 : y.forceRecreate) ?? !1;
+    const e = E(), { html: p, css: a } = i, { baseBlocks: o, extensions: d } = await T(), f = ((g = c.value) == null ? void 0 : g.displayConditions) ?? !0, F = ((S = c.value) == null ? void 0 : S.modulesDisabled) ?? !1, v = ((y = h.value) == null ? void 0 : y.forceRecreate) ?? !1;
     window.UIEditor.initEditor(
       document.querySelector("#guido-editor"),
       {
         metadata: C,
         html: p,
         css: a,
-        forceRecreate: M,
+        forceRecreate: v,
         locale: "en",
         undoButtonSelector: "#guido__undo-button",
         redoButtonSelector: "#guido__redo-button",
@@ -32,11 +31,11 @@ const dt = (C, c) => {
         customAppearanceMergetags: !u("liquidSyntax"),
         customAppearanceMergetagsBorderColor: "#f1f3fe",
         customAppearanceMergetagsBackgroundColor: "#f1f3fe",
-        customViewStyles: L,
+        customViewStyles: j,
         conditionsEnabled: f,
         customConditionsEnabled: f,
         enableXSSSecurity: !0,
-        modulesDisabled: v,
+        modulesDisabled: F,
         syncModulesEnabled: s,
         messageSettingsEnabled: !0,
         displayGmailAnnotations: !0,
@@ -53,60 +52,59 @@ const dt = (C, c) => {
         },
         mergeTags: [
           {
-            entries: $(
-              c.preselectedDynamicContentList,
+            entries: L(
+              l.preselectedDynamicContentList,
               u("liquidSyntax")
             )
           }
         ],
-        async onTokenRefreshRequest(e) {
+        async onTokenRefreshRequest(t) {
           try {
             const n = await w();
-            e(n);
+            t(n);
           } catch (n) {
             m(n, "Failed to refresh token");
           }
         },
         onTemplateLoaded() {
           try {
-            const { importCss: e } = R(), { activateCustomViewStyles: n, updateTimerInClonedTemplate: A } = I(), { injectFullStory: D } = q();
-            e(), n(), D(), A(), c.onReady(), t.isStripoInitialized = !0, t.loadingStatus = !1, setTimeout(() => {
-              t.hasChanges = !1;
+            const { importCss: t } = U(), { activateCustomViewStyles: n, updateTimerInClonedTemplate: M } = D(), { injectFullStory: A } = R();
+            t(), n(), A(), M(), l.onReady(), e.isStripoInitialized = !0, e.loadingStatus = !1, setTimeout(() => {
+              e.hasChanges = !1;
             }, 1e3);
-          } catch (e) {
-            m(e, "Failed to load custom interface appearance");
+          } catch (t) {
+            m(t, "Failed to load custom interface appearance");
           }
         },
-        onCodeEditorVisibilityChanged(e) {
-          t.isCodeEditorOpen = e;
+        onCodeEditorVisibilityChanged(t) {
+          e.isCodeEditorOpen = t;
         },
-        onEditorVisualModeChanged(e) {
-          t.editorVisualMode = e.toLowerCase();
+        onEditorVisualModeChanged(t) {
+          e.editorVisualMode = t.toLowerCase();
         },
-        onVersionHistoryVisibilityChanged(e) {
-          t.isVersionHistoryOpen = e;
+        onVersionHistoryVisibilityChanged(t) {
+          e.isVersionHistoryOpen = t;
         },
         onDataChanged() {
-          t.hasChanges = !0;
+          e.hasChanges = !0;
         },
         onEvent: B,
-        notifications: T(),
         ignoreClickOutsideSelectors: [
           "#guido-dynamic-content-modal",
           ".in-on-board-wrapper",
           ".in-drawer__container"
         ],
         extensions: d,
-        localePatch: O
+        localePatch: H
       }
     );
-  }, F = (i) => new Promise((r, s) => {
+  }, _ = (i) => new Promise((r, s) => {
     var d;
     if (document.getElementById("UiEditorScript")) {
       i(), r();
       return;
     }
-    const t = z.guido, a = `https://email-static.useinsider.com/guido/${(d = t == null ? void 0 : t.stripo) == null ? void 0 : d.version}/UIEditor.js`, o = document.createElement("script");
+    const e = $.guido, a = `https://email-static.useinsider.com/guido/${(d = e == null ? void 0 : e.stripo) == null ? void 0 : d.version}/UIEditor.js`, o = document.createElement("script");
     o.id = "UiEditorScript", o.type = "module", o.src = a, o.onload = () => {
       i(), r();
     }, o.onerror = () => {
@@ -114,15 +112,15 @@ const dt = (C, c) => {
     }, document.body.appendChild(o);
   });
   return { initPlugin: async (i) => {
-    await F(async () => {
-      const r = E(), [s, t] = await Promise.all([
+    await _(async () => {
+      const r = E(), [s, e] = await Promise.all([
         b(),
         k()
       ]);
-      r.syncModulesEnabled = t, await _(i, s, t);
+      r.syncModulesEnabled = e, await V(i, s, e);
     });
   } };
 };
 export {
-  dt as useStripo
+  se as useStripo
 };

package/dist/enums/extensions/recommendationBlock.js

@@ -1,44 +1,98 @@
-const s = {
+import { useTranslations as a } from "../../composables/useTranslations.js";
+const u = {
   RECOMMENDATION_API_URL: "https://recommendationv2.api.useinsider.com"
-}, i = {
+}, l = {
   CLIENT_ID: "clientId"
-}, u = [
-  { id: 11, key: "similarViewed", name: "Viewed Together", path: "viewed-together" },
-  { id: 12, key: "similarBought", name: "Purchased Together", path: "purchased-together" },
-  { id: 13, key: "userBased", name: "User Based", path: "user-based" },
-  { id: 36, key: "highestDiscounted", name: "Highest Discounted Items", path: "highest-discounted" },
-  { id: 38, key: "manualMerchandising", name: "Manual Merchandising", path: "manual-merchandising" },
-  { id: 39, key: "newArrivals", name: "New Arrivals", path: "new-arrivals" },
-  { id: 40, key: "trendingProducts", name: "Trending Products", path: "trending" },
-  { id: 46, key: "mostValuableOfPartner", name: "Most Valuable Products", path: "most-valuable" },
-  { id: 61, key: "mostPopular", name: "Most Popular Items", path: "most-popular" },
-  { id: 62, key: "mostPurchased", name: "Top Sellers", path: "top-sellers" }
-], l = ["discount", "omnibus_price", "omnibus_discount", "price", "original_price"], c = [
+}, c = () => {
+  const e = a();
+  return [
+    {
+      id: 11,
+      key: "similarViewed",
+      name: e("action-builder.similar-viewed"),
+      path: "viewed-together"
+    },
+    {
+      id: 12,
+      key: "similarBought",
+      name: e("action-builder.similar-bought"),
+      path: "purchased-together"
+    },
+    {
+      id: 13,
+      key: "userBased",
+      name: e("action-builder.user-based"),
+      path: "user-based"
+    },
+    {
+      id: 36,
+      key: "highestDiscounted",
+      name: e("journey-builder.highest-discounted-items"),
+      path: "highest-discounted"
+    },
+    {
+      id: 38,
+      key: "manualMerchandising",
+      name: e("action-builder.manual-merchandising"),
+      path: "manual-merchandising"
+    },
+    {
+      id: 39,
+      key: "newArrivals",
+      name: e("action-builder.new-arrivals"),
+      path: "new-arrivals"
+    },
+    {
+      id: 40,
+      key: "trendingProducts",
+      name: e("journey-builder.trending-products"),
+      path: "trending"
+    },
+    {
+      id: 46,
+      key: "mostValuableOfPartner",
+      name: e("journey-builder.most-valuable-products"),
+      path: "most-valuable"
+    },
+    {
+      id: 61,
+      key: "mostPopular",
+      name: e("journey-builder.most-popular-items"),
+      path: "most-popular"
+    },
+    {
+      id: 62,
+      key: "mostPurchased",
+      name: e("action-builder.most-purchased"),
+      path: "top-sellers"
+    }
+  ];
+}, d = ["discount", "omnibus_price", "omnibus_discount", "price", "original_price"], m = [
   { text: "before the amount", value: "0" },
   { text: "after the amount", value: "1" }
-], d = [
+], p = [
   { text: "dot(.)", value: "." },
   { text: "comma(,)", value: "," },
   { text: "space( )", value: " " }
-], p = [
+], v = [
   { text: "0", value: "0" },
   { text: "1", value: "1" },
   { text: "2", value: "2" },
   { text: "3", value: "3" },
   { text: "4", value: "4" },
   { text: "5", value: "5" }
-], e = [
+], t = [
   { text: "is exactly", value: "=" },
   { text: "contains", value: "~" },
   { text: "does not contain", value: "!~" },
   { text: "any of", value: "||" }
-], a = [
+], r = [
   { text: "is exactly", value: "=" },
   { text: "is not exactly", value: "!==" },
   { text: "contains", value: "~" },
   { text: "does not contain", value: "!~" },
   { text: "any of", value: "||" }
-], r = [
+], n = [
   { text: "is equal to", value: "=" },
   { text: "is greater than", value: ">" },
   { text: "is less than", value: "<" }
@@ -46,39 +100,39 @@ const s = {
   { text: "is equal to", value: "=" },
   { text: "after", value: ">" },
   { text: "before", value: "<" }
-], n = [
+], s = [
   { text: "true", value: "==" },
   { text: "false", value: "!=" }
-], m = (t) => {
-  if (!t)
-    return e;
-  switch (t) {
+], h = (e) => {
+  if (!e)
+    return t;
+  switch (e) {
     case "Boolean":
-      return n;
+      return s;
     case "Date":
       return o;
     case "Number":
-      return r;
+      return n;
     case "String":
-      return e;
+      return t;
     case "Strings":
-      return a;
+      return r;
     default:
-      return e;
+      return t;
   }
 };
 export {
-  l as PriceAttributes,
-  i as QUERY_PARAMS,
-  u as RecommendationFeedSourceMaps,
-  s as URLS,
-  p as currencyDecimalCounts,
-  c as currencyLocationMaps,
-  d as currencyOperators,
-  m as getOperatorOptions,
-  a as operatorOptionsForArrayOfStrings,
-  n as operatorOptionsForBooleans,
+  d as PriceAttributes,
+  l as QUERY_PARAMS,
+  u as URLS,
+  v as currencyDecimalCounts,
+  m as currencyLocationMaps,
+  p as currencyOperators,
+  h as getOperatorOptions,
+  c as getRecommendationFeedSourceMaps,
+  r as operatorOptionsForArrayOfStrings,
+  s as operatorOptionsForBooleans,
   o as operatorOptionsForDates,
-  r as operatorOptionsForNumbers,
-  e as operatorOptionsForStrings
+  n as operatorOptionsForNumbers,
+  t as operatorOptionsForStrings
 };

package/dist/enums/unsubscribe.js

@@ -1,32 +1,32 @@
 import { useTranslations as R } from "../composables/useTranslations.js";
-import { ProductType as s } from "../@types/config/schemas.js";
+import { ProductType as n } from "../@types/config/schemas.js";
 import "../@types/config/defaults.js";
 import { getEnvironmentPrefix as S } from "../utils/environmentUtil.js";
-const B = {
+const i = {
   UNSUBSCRIBE_LINK_TYPE: 1,
   PREFERENCES_LINK_TYPE: 3
-}, i = {
+}, B = {
   UNSUBSCRIBE_LINK_REGEX: /{{ins-unsubscribe-link}}/g,
   DATA_OGSB_BUTTON_CSS_REGEX: "\\[data-ogsb\\]\\s*\\.es-button\\.es-button-[0-9]+\\s*\\{(?:[^\\}]*)\\}",
   GLOBAL_UNSUBSCRIBE_LINK_REGEX: /{{ins-global-unsubscribe-link}}/g,
   PREFERENCES_UNSUBSCRIBE_LINK_REGEX: /{{ins-preferences-unsubscribe-link}}/g
-}, n = S(), C = {
-  UNSUBSCRIBE_URL: `https://mail.${n}.com/user/v1/unsub`,
-  PREFERENCES_URL: `https://mail.${n}.com/user/v1/prefs`
+}, s = S(), C = {
+  UNSUBSCRIBE_URL: `https://mail.${s}.com/user/v1/unsub`,
+  PREFERENCES_URL: `https://mail.${s}.com/user/v1/prefs`
 }, U = {
-  [s.EMAIL]: "email",
-  [s.ARCHITECT]: "journey",
-  [s.UNSUBSCRIBE_PAGES]: "email"
-}, t = "iid", o = {
-  name: "Global Unsubscribe",
-  sendGridId: "G"
-}, c = "/email/unsubscribe-pages", E = {
+  [n.EMAIL]: "email",
+  [n.ARCHITECT]: "journey",
+  [n.UNSUBSCRIBE_PAGES]: "email"
+}, o = "iid", r = "G", c = () => ({
+  name: R()("onboarding-center.email-subscribers-global-unsub-card-title"),
+  sendGridId: r
+}), u = "/email/unsubscribe-pages", E = {
   GLOBAL_UNSUBSCRIBE: 1,
   GLOBAL_UNSUBSCRIBE_CONFIRMATION_PAGE: 2,
   SUBSCRIPTION_PREFERENCE_CENTER: 3,
   SUBSCRIPTION_PREFERENCE_CONFIRMATION: 4,
   RESUBSCRIBE: 5
-}, u = {
+}, b = {
   [E.GLOBAL_UNSUBSCRIBE]: "custom-unsubscribe",
   [E.SUBSCRIPTION_PREFERENCE_CENTER]: "custom-preferences"
 }, T = {
@@ -39,7 +39,7 @@ const B = {
     E.SUBSCRIPTION_PREFERENCE_CENTER,
     E.SUBSCRIPTION_PREFERENCE_CONFIRMATION
   ]
-}, b = () => {
+}, P = () => {
   const e = R();
   return {
     [E.GLOBAL_UNSUBSCRIBE]: e("unsubscription-preference.type-global-unsubscribe"),
@@ -48,22 +48,23 @@ const B = {
     [E.SUBSCRIPTION_PREFERENCE_CENTER]: e("unsubscription-preference.type-subscription-preferences-center"),
     [E.SUBSCRIPTION_PREFERENCE_CONFIRMATION]: e("unsubscription-preference.type-subscription-preferences-confirmation")
   };
-}, P = {
+}, O = {
   default: "{{ins-unsubscribe-link}}",
   [E.GLOBAL_UNSUBSCRIBE]: "{{ins-global-unsubscribe-link}}",
   [E.SUBSCRIPTION_PREFERENCE_CENTER]: "{{ins-preferences-unsubscribe-link}}"
 };
 export {
-  o as DEFAULT_UNSUBSCRIBE_GROUP,
-  t as INSIDER_ID,
-  i as LINK_REGEXES,
-  B as LINK_TYPES,
-  P as MERGE_TAGS,
+  r as DEFAULT_UNSUBSCRIBE_GROUP_SEND_GRID_ID,
+  o as INSIDER_ID,
+  B as LINK_REGEXES,
+  i as LINK_TYPES,
+  O as MERGE_TAGS,
   E as PAGE_TYPES,
   U as PRODUCT_TYPE_URL_SEGMENTS,
   T as TYPE_COLLECTIONS,
-  c as UNSUBSCRIBE_PAGES_LINK,
-  u as UNSUBSCRIBE_SYNC_MODULE_TYPES,
+  u as UNSUBSCRIBE_PAGES_LINK,
+  b as UNSUBSCRIBE_SYNC_MODULE_TYPES,
   C as URLS,
-  b as getTypeTranslations
+  c as getDefaultUnsubscribeGroup,
+  P as getTypeTranslations
 };

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

@@ -1,11 +1,11 @@
-var d = Object.defineProperty;
-var l = (r, n, e) => n in r ? d(r, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[n] = e;
-var o = (r, n, e) => l(r, typeof n != "symbol" ? n + "" : n, e);
-import { useHttp as L } from "../../../composables/useHttp.js";
-import { DEFAULT_UNSUBSCRIBE_GROUP as c } from "../../../enums/unsubscribe.js";
-import { Control as h, UIElementType as i, UEAttr as t, ModificationDescription as p } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-const m = "ui-elements-checkbox", u = "select", { get: C } = L();
-class S extends h {
+var E = Object.defineProperty;
+var d = (i, n, e) => n in i ? E(i, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[n] = e;
+var o = (i, n, e) => d(i, typeof n != "symbol" ? n + "" : n, e);
+import { useHttp as l } from "../../../composables/useHttp.js";
+import { getDefaultUnsubscribeGroup as L, DEFAULT_UNSUBSCRIBE_GROUP_SEND_GRID_ID as h } from "../../../enums/unsubscribe.js";
+import { Control as p, UIElementType as r, UEAttr as t, ModificationDescription as m } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+const b = "ui-elements-checkbox", u = "select", { get: C } = l();
+class I extends p {
   constructor() {
     super(...arguments);
     o(this, "currentNode");
@@ -13,13 +13,13 @@ class S extends h {
     o(this, "unsubList", []);
   }
   getId() {
-    return m;
+    return b;
   }
   _setFormValues() {
     if (this.selectedUnsubGroup = "", this.currentNode && "getAttribute" in this.currentNode) {
       const e = this.currentNode.getAttribute("id");
       if (e) {
-        const s = e === c.sendGridId ? e : Number(e);
+        const s = e === h ? e : Number(e);
         s && (this.selectedUnsubGroup = s);
       }
     }
@@ -29,18 +29,18 @@ class S extends h {
   }
   _getLabel(e, s = `${Math.random()}`) {
     return `
-            <${i.LABEL} 
+            <${r.LABEL} 
                 ${t.LABEL.text}="${e}" 
                 ${t.LABEL.name}="${s}">
-            </${i.LABEL}>
+            </${r.LABEL}>
         `;
   }
   _getSelectItem(e, s) {
     return `
-            <${i.SELECT_ITEM} 
+            <${r.SELECT_ITEM} 
                 ${t.SELECT_ITEM.text}="${e}" 
                 ${t.SELECT_ITEM.value}="${s}">
-            </${i.SELECT_ITEM}>`;
+            </${r.SELECT_ITEM}>`;
   }
   _getSelect() {
     return this.unsubList.map((e) => this._getSelectItem(e.name, e.sendGridId)).join("");
@@ -49,22 +49,22 @@ class S extends h {
     return `
             <div class="checkbox-controls-container">
                 <div class="checkbox-select-container container two-columns stretch">
-                    <${i.LABEL}
+                    <${r.LABEL}
                         ${t.LABEL.text}="${this.api.translate("Unsubscribe Group")}"
                         ${t.LABEL.name}="${Math.random()}">
-                    </${i.LABEL}>
+                    </${r.LABEL}>
 
-                    <${i.SELECTPICKER}
+                    <${r.SELECTPICKER}
                         ${t.SELECTPICKER.name}="${u}"
                         ${t.SELECTPICKER.placeholder}="${this.api.translate("Select Unsubscribe Group")}">
                             ${this._getSelect()}
-                    </${i.SELECTPICKER}>
+                    </${r.SELECTPICKER}>
                 </div>
             </div>
         `;
   }
   _onSelectChange(e) {
-    this.currentNode && this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute("id", e.toString()).apply(new p(`Updated text to ${e}`));
+    this.currentNode && this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute("id", e.toString()).apply(new m(`Updated text to ${e}`));
   }
   _listenToFormUpdates() {
     this.api.onValueChanged(u, (e) => this._onSelectChange(e));
@@ -76,18 +76,18 @@ class S extends h {
   async onRender() {
     const e = await C(
       "/unsubscribe-groups/unsubscribe-list"
-    ), s = [c, ...e.data], E = s.map((a) => ({
+    ), s = [L(), ...e.data], c = s.map((a) => ({
       [t.SELECT_ITEM.text]: a.name,
       [t.SELECT_ITEM.value]: a.sendGridId
     }));
     this.unsubList = s, this.api.setUIEAttribute(
       u,
       t.SELECTPICKER.items,
-      E
+      c
     ), this._setFormValues(), this._listenToFormUpdates();
   }
 }
 export {
-  m as CHECKBOX_CONTROL_BLOCK_ID,
-  S as CheckboxControl
+  b as CHECKBOX_CONTROL_BLOCK_ID,
+  I as CheckboxControl
 };

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

@@ -1,11 +1,11 @@
-var d = Object.defineProperty;
-var l = (r, n, t) => n in r ? d(r, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[n] = t;
-var o = (r, n, t) => l(r, typeof n != "symbol" ? n + "" : n, t);
-import { useHttp as L } from "../../../composables/useHttp.js";
-import { DEFAULT_UNSUBSCRIBE_GROUP as c } from "../../../enums/unsubscribe.js";
-import { Control as p, UIElementType as i, UEAttr as e, ModificationDescription as h } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-const m = "ui-elements-radio-button", u = "select", { get: $ } = L();
-class S extends p {
+var E = Object.defineProperty;
+var d = (r, n, t) => n in r ? E(r, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[n] = t;
+var o = (r, n, t) => d(r, typeof n != "symbol" ? n + "" : n, t);
+import { useHttp as l } from "../../../composables/useHttp.js";
+import { getDefaultUnsubscribeGroup as L, DEFAULT_UNSUBSCRIBE_GROUP_SEND_GRID_ID as p } from "../../../enums/unsubscribe.js";
+import { Control as h, UIElementType as i, UEAttr as e, ModificationDescription as m } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+const b = "ui-elements-radio-button", u = "select", { get: $ } = l();
+class I extends h {
   constructor() {
     super(...arguments);
     o(this, "currentNode");
@@ -13,13 +13,13 @@ class S extends p {
     o(this, "unsubList", []);
   }
   getId() {
-    return m;
+    return b;
   }
   _setFormValues() {
     if (this.selectedUnsubGroup = "", this.currentNode && "getAttribute" in this.currentNode) {
       const t = this.currentNode.getAttribute("id");
       if (t) {
-        const s = t === c.sendGridId ? t : Number(t);
+        const s = t === p ? t : Number(t);
         s && (this.selectedUnsubGroup = s);
       }
     }
@@ -64,7 +64,7 @@ class S extends p {
         `;
   }
   _onSelectChange(t) {
-    this.currentNode && this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute("id", t.toString()).apply(new h(`Updated text to ${t}`));
+    this.currentNode && this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute("id", t.toString()).apply(new m(`Updated text to ${t}`));
   }
   _listenToFormUpdates() {
     this.api.onValueChanged(u, (t) => this._onSelectChange(t));
@@ -76,18 +76,18 @@ class S extends p {
   async onRender() {
     const t = await $(
       "/unsubscribe-groups/unsubscribe-list"
-    ), s = [c, ...t.data], E = s.map((a) => ({
+    ), s = [L(), ...t.data], c = s.map((a) => ({
       [e.SELECT_ITEM.text]: a.name,
       [e.SELECT_ITEM.value]: a.sendGridId
     }));
     this.unsubList = s, this.api.setUIEAttribute(
       u,
       e.SELECTPICKER.items,
-      E
+      c
     ), this._setFormValues(), this._listenToFormUpdates();
   }
 }
 export {
-  m as CONTROL_BLOCK_ID,
-  S as RadioButtonControl
+  b as CONTROL_BLOCK_ID,
+  I as RadioButtonControl
 };

package/dist/extensions/Blocks/Recommendation/store/recommendation.js

@@ -1,4 +1,4 @@
-import { RecommendationFeedSourceMaps as S, getOperatorOptions as R, PriceAttributes as y } from "../../../../enums/extensions/recommendationBlock.js";
+import { getRecommendationFeedSourceMaps as S, getOperatorOptions as R, PriceAttributes as y } from "../../../../enums/extensions/recommendationBlock.js";
 import { useRecommendationApi as C } from "../../../../services/recommendationApi.js";
 import { useConfigStore as G } from "../../../../stores/config.js";
 import { defineStore as P } from "pinia";
@@ -113,12 +113,12 @@ const v = () => ({
       return [...new Set(t.map((e) => e.filterGroup))].sort((e, r) => e - r);
     },
     getActivePredictiveAlgorithms: (t) => {
-      const e = [];
-      return t.activePredictiveAlgorithms.filter((r) => !D.includes(r)).forEach((r) => {
-        e.push(...S.filter((n) => n.id === r));
-      }), e.map((r) => ({
-        text: r.name,
-        value: r.key
+      const e = S(), r = [];
+      return t.activePredictiveAlgorithms.filter((n) => !D.includes(n)).forEach((n) => {
+        r.push(...e.filter((c) => c.id === n));
+      }), r.map((n) => ({
+        text: n.name,
+        value: n.key
       }));
     },
     getLanguages: (t) => Object.entries(t.languages).map(([e, r]) => ({
@@ -417,7 +417,7 @@ const v = () => ({
     },
     async _doFetchProducts() {
       var p;
-      const t = this.currentRecommendationId, e = this.blockStates[t], { recommendationConfigs: r } = e, n = r.filters.filter((l) => l.isValid), c = b(n), i = ((p = S.find((l) => l.key === r.strategy)) == null ? void 0 : p.path) || "", o = G(), s = parseInt(r.size) || 6, a = {
+      const t = this.currentRecommendationId, e = this.blockStates[t], { recommendationConfigs: r } = e, n = r.filters.filter((l) => l.isValid), c = b(n), i = ((p = S().find((l) => l.key === r.strategy)) == null ? void 0 : p.path) || "", o = G(), s = parseInt(r.size) || 6, a = {
         locale: r.language,
         currency: r.currencySettings.value,
         partnerName: o.partnerName,

package/dist/src/enums/extensions/recommendationBlock.d.ts

@@ -6,7 +6,11 @@ export declare const URLS: {
 export declare const QUERY_PARAMS: {
     CLIENT_ID: string;
 };
-export declare const RecommendationFeedSourceMaps: RecommendationFeedItem[];
+/**
+ * Get recommendation feed source maps lazily so translated names resolve at access time.
+ * Must be called within a Vue component context or after Pinia is initialized.
+ */
+export declare const getRecommendationFeedSourceMaps: () => RecommendationFeedItem[];
 export declare const PriceAttributes: string[];
 export declare const currencyLocationMaps: TextValueObject[];
 export declare const currencyOperators: TextValueObject[];

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

@@ -18,9 +18,14 @@ export declare const PRODUCT_TYPE_URL_SEGMENTS: {
     readonly 97: "email";
 };
 export declare const INSIDER_ID = "iid";
-export declare const DEFAULT_UNSUBSCRIBE_GROUP: {
-    readonly name: "Global Unsubscribe";
-    readonly sendGridId: "G";
+export declare const DEFAULT_UNSUBSCRIBE_GROUP_SEND_GRID_ID = "G";
+/**
+ * Get the default unsubscribe group lazily so the translated name resolves at access time.
+ * Must be called within a Vue component context or after Pinia is initialized.
+ */
+export declare const getDefaultUnsubscribeGroup: () => {
+    name: string;
+    sendGridId: string;
 };
 export declare const UNSUBSCRIBE_PAGES_LINK = "/email/unsubscribe-pages";
 export declare const PAGE_TYPES: {

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

@@ -0,0 +1,74 @@
+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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.3.0-beta.2d923be",
+  "version": "3.3.0-beta.402c269",
   "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",

package/dist/composables/useStripoNotifications.js

@@ -1,24 +0,0 @@
-import { useToaster as f } from "./useToaster.js";
-import { ToasterTypeOptions as n } from "../enums/toaster.js";
-const T = () => {
-  const { showToaster: r, hideToaster: l } = f();
-  let s = null;
-  const c = (t, o, i, e) => {
-    s = i;
-    const u = e != null && e.action ? { text: e.action.label, onClick: e.action.func } : void 0;
-    r({ type: t, message: o, actionButton: u });
-  };
-  return { getStripoNotifications: () => ({
-    info: (t, o, i) => c(n.Success, t, o, i),
-    success: (t, o, i) => c(n.Success, t, o, i),
-    warn: (t, o, i) => c(n.Warning, t, o, i),
-    error: (t, o, i) => c(n.Alert, t, o, i),
-    loader: (t, o, i) => c(n.Success, t, o, i),
-    hide: (t) => {
-      (s === null || s === t) && (l(), s = null);
-    }
-  }) };
-};
-export {
-  T as useStripoNotifications
-};

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

@@ -1,4 +0,0 @@
-import type { StripoNotifications } from '@@/Types/stripo';
-export declare const useStripoNotifications: () => {
-    getStripoNotifications: () => StripoNotifications;
-};