@useinsider/guido 3.19.0-beta.11ec5b2 → 3.19.0-beta.169cb33

package/dist/composables/useStripo.js

@@ -17,21 +17,21 @@ import { buildMergeTagEntries as W, flattenDynamicContentList as Y } from "../ut
 import Z from "../package.json.js";
 let n = null;
 const he = () => {
-  const { features: c, template: u, isFeatureEnabled: p } = H(), { handleError: m, showToaster: v } = G(), { getToken: B, getCustomFonts: M, getSyncModulesStatus: T } = K(), { handleEvent: F } = z(), { handleModuleAdd: A } = j(), { getStripoBlocksConfig: V } = O(), { getStripoNotifications: _ } = $(), f = () => n || (n = new Promise((r, s) => {
+  const { features: c, template: u, isFeatureEnabled: m } = H(), { handleError: p, showToaster: B } = G(), { getToken: M, getCustomFonts: T, getSyncModulesStatus: v } = K(), { handleEvent: F } = z(), { handleModuleAdd: A } = j(), { getStripoBlocksConfig: V } = O(), { getStripoNotifications: _ } = $(), f = () => n || (n = new Promise((i, s) => {
     var d;
     if (document.getElementById("UiEditorScript")) {
-      r();
+      i();
       return;
     }
-    const o = Z.guido, i = `https://email-static.useinsider.com/guido/${(d = o == null ? void 0 : o.stripo) == null ? void 0 : d.version}/UIEditor.js`, e = document.createElement("script");
-    e.id = "UiEditorScript", e.type = "module", e.src = i, e.onload = () => r(), e.onerror = () => {
-      e.remove(), s(new Error(`Failed to load Stripo UIEditor script from S3: ${i}`));
+    const o = Z.guido, r = `https://email-static.useinsider.com/guido/${(d = o == null ? void 0 : o.stripo) == null ? void 0 : d.version}/UIEditor.js`, e = document.createElement("script");
+    e.id = "UiEditorScript", e.type = "module", e.src = r, e.onload = () => i(), e.onerror = () => {
+      e.remove(), s(new Error(`Failed to load Stripo UIEditor script from S3: ${r}`));
     }, document.body.appendChild(e);
   }), n.catch(() => {
     n = null;
-  }), n), D = async (r, s, o, a = [], i = !1) => {
+  }), n), D = async (i, s, o, a = [], r = !1) => {
     var y, E, h, C;
-    const e = k(), { html: d, css: R } = r, { baseBlocks: g, extensions: P } = await V(), S = ((y = c.value) == null ? void 0 : y.displayConditions) ?? !0, U = ((E = c.value) == null ? void 0 : E.modulesDisabled) ?? !1, I = !!d || (((h = u.value) == null ? void 0 : h.forceRecreate) ?? !1), q = "https://email-static.useinsider.com https://edge.fullstory.com https://rs.fullstory.com";
+    const e = k(), { html: d, css: R } = i, { baseBlocks: g, extensions: P } = await V(), S = ((y = c.value) == null ? void 0 : y.displayConditions) ?? !0, U = ((E = c.value) == null ? void 0 : E.modulesDisabled) ?? !1, I = !!d || (((h = u.value) == null ? void 0 : h.forceRecreate) ?? !1), q = "https://email-static.useinsider.com https://edge.fullstory.com https://rs.fullstory.com";
     w().importCss(), await window.UIEditor.initEditor(
       document.querySelector("#guido-editor"),
       {
@@ -45,7 +45,7 @@ const he = () => {
         mobileViewButtonSelector: ".guido__view-option-selection-mobile",
         desktopViewButtonSelector: ".guido__view-option-selection-desktop",
         codeEditorButtonSelector: "#guido__code-button",
-        customAppearanceMergetags: !p("liquidSyntax"),
+        customAppearanceMergetags: !m("liquidSyntax"),
         customAppearanceMergetagsBorderColor: "#f1f3fe",
         customAppearanceMergetagsBackgroundColor: "#f1f3fe",
         customViewStyles: Q,
@@ -53,7 +53,7 @@ const he = () => {
         customConditionsEnabled: S,
         enableXSSSecurity: !0,
         modulesDisabled: U,
-        syncModulesEnabled: i,
+        syncModulesEnabled: r,
         messageSettingsEnabled: !0,
         displayGmailAnnotations: !0,
         displayHiddenPreheader: !1,
@@ -74,16 +74,16 @@ const he = () => {
             entries: W(
               o.preselectedDynamicContentList,
               Y((C = u.value) == null ? void 0 : C.dynamicContentList),
-              p("liquidSyntax")
+              m("liquidSyntax")
             )
           }
         ],
         async onTokenRefreshRequest(t) {
           try {
-            const l = await B();
+            const l = await M();
             t(l);
           } catch (l) {
-            m(l, "Failed to refresh token");
+            p(l, "Failed to refresh token");
           }
         },
         onTemplateLoaded() {
@@ -93,7 +93,7 @@ const he = () => {
               e.hasChanges = !1;
             }, 1e3);
           } catch (t) {
-            m(t, "Failed to load custom interface appearance");
+            p(t, "Failed to load custom interface appearance");
           }
         },
         onCodeEditorVisibilityChanged(t) {
@@ -111,31 +111,27 @@ const he = () => {
         onEvent: F,
         onModuleAdd: A,
         notifications: _(),
-        // Stripo deselects the block on any click outside the canvas, so every surface
-        // that belongs to the block's own flow has to be listed here (SD-153273).
         ignoreClickOutsideSelectors: [
           "#guido-dynamic-content-modal",
           ".in-on-board-wrapper",
-          ".in-drawer__container",
-          ".in-modal-v2-wrapper",
-          ".in-toasts-wrapper"
+          ".in-drawer__container"
         ],
         extensions: P,
         localePatch: J
       }
     );
   };
-  return { initPlugin: async (r, s, o) => {
+  return { initPlugin: async (i, s, o) => {
     const a = k();
     try {
       await f();
-      const [i, e] = await Promise.all([
-        M(),
-        T()
+      const [r, e] = await Promise.all([
+        T(),
+        v()
       ]);
-      a.syncModulesEnabled = e, await D(r, s, o, i, e);
+      a.syncModulesEnabled = e, await D(i, s, o, r, e);
     } catch {
-      a.loadingStatus = !1, v({
+      a.loadingStatus = !1, B({
         type: X.Error,
         message: b["An error has occurred. Please report the error code to support."],
         actionButton: {

package/dist/enums/extensions/recommendationBlock.js

@@ -1,5 +1,5 @@
 import { useTranslations as s } from "../../composables/useTranslations.js";
-const t = {
+const a = {
   RECOMMENDATION_API_URL: "https://recommendationv2.api.useinsider.com",
   // Relative path → same-origin as the embedding inone dashboard.
   PRODUCT_ATTRIBUTES_PATH: "/product-attributes/get-attributes",
@@ -9,17 +9,17 @@ const t = {
   MIGRATE_STRATEGIES_PATH: "/newsletter/recommendations/migrate-strategies",
   // The template route narrows the recommendations resource before the action: the id
   // travels in the body, not the path.
-  TEMPLATE_MIGRATE_STRATEGIES_PATH: "/newsletter/recommendations/template/migrate-strategies"
-}, d = () => {
-  const { RECOMMENDATION_STRATEGIES_PANEL_PATH: e } = t;
-  return `${e}/create`;
-}, m = (e) => {
-  const { RECOMMENDATION_STRATEGIES_PANEL_PATH: n } = t;
-  return `${n}/${e}/edit`;
+  TEMPLATE_MIGRATE_STRATEGIES_PATH: "/newsletter/recommendations/template/migrate-strategies",
+  // Smart Recommender hides the Email channel unless the URL asks for it, so a strategy created
+  // without this flag can never be Email-suitable and would never reach the editor's list.
+  RECOMMENDATION_STRATEGY_CREATE_PATH: "/discovery/recommendation-strategies/create?isEmail=true"
+}, d = (e) => {
+  const { RECOMMENDATION_STRATEGIES_PANEL_PATH: n } = a;
+  return `${n}/${e}/edit?isEmail=true`;
+}, m = {
+  campaign: a.MIGRATE_STRATEGIES_PATH,
+  template: a.TEMPLATE_MIGRATE_STRATEGIES_PATH
 }, T = {
-  campaign: t.MIGRATE_STRATEGIES_PATH,
-  template: t.TEMPLATE_MIGRATE_STRATEGIES_PATH
-}, p = {
   CLIENT_ID: "clientId"
 }, E = () => {
   const e = s();
@@ -85,21 +85,21 @@ const t = {
       path: "top-sellers"
     }
   ];
-}, A = ["discount", "omnibus_price", "omnibus_discount", "price", "original_price"], v = [
+}, p = ["discount", "omnibus_price", "omnibus_discount", "price", "original_price"], A = [
   { text: "before the amount", value: "0" },
   { text: "after the amount", value: "1" }
-], _ = [
+], v = [
   { text: "dot(.)", value: "." },
   { text: "comma(,)", value: "," },
   { text: "space( )", value: " " }
-], h = [
+], _ = [
   { text: "0", value: "0" },
   { text: "1", value: "1" },
   { text: "2", value: "2" },
   { text: "3", value: "3" },
   { text: "4", value: "4" },
   { text: "5", value: "5" }
-], r = "||", a = [
+], r = "||", t = [
   { text: "is exactly", value: "=" },
   { text: "contains", value: "~" },
   { text: "does not contain", value: "!~" },
@@ -121,9 +121,9 @@ const t = {
 ], c = [
   { text: "true", value: "==" },
   { text: "false", value: "!=" }
-], x = (e) => {
+], h = (e) => {
   if (!e)
-    return a;
+    return t;
   switch (e) {
     case "Boolean":
       return c;
@@ -132,29 +132,28 @@ const t = {
     case "Number":
       return i;
     case "String":
-      return a;
+      return t;
     case "Strings":
       return o;
     default:
-      return a;
+      return t;
   }
 };
 export {
-  T as MIGRATION_PATHS,
+  m as MIGRATION_PATHS,
   r as OP_ANY_OF,
-  A as PriceAttributes,
-  p as QUERY_PARAMS,
-  t as URLS,
-  h as currencyDecimalCounts,
-  v as currencyLocationMaps,
-  _ as currencyOperators,
-  x as getOperatorOptions,
+  p as PriceAttributes,
+  T as QUERY_PARAMS,
+  a as URLS,
+  _ as currencyDecimalCounts,
+  A as currencyLocationMaps,
+  v as currencyOperators,
+  h as getOperatorOptions,
   E as getRecommendationFeedSourceMaps,
   o as operatorOptionsForArrayOfStrings,
   c as operatorOptionsForBooleans,
   u as operatorOptionsForDates,
   i as operatorOptionsForNumbers,
-  a as operatorOptionsForStrings,
-  d as strategyCreatePath,
-  m as strategyEditPath
+  t as operatorOptionsForStrings,
+  d as strategyEditPath
 };

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

@@ -1,13 +1,13 @@
-import { useToaster as _ } from "../../../../composables/useToaster.js";
+import { useToaster as D } from "../../../../composables/useToaster.js";
 import { useTranslations as L } from "../../../../composables/useTranslations.js";
-import { getRecommendationFeedSourceMaps as F, strategyEditPath as U, strategyCreatePath as N, getOperatorOptions as M, PriceAttributes as E } from "../../../../enums/extensions/recommendationBlock.js";
-import { ToasterTypeOptions as B } from "../../../../enums/toaster.js";
-import { useRecommendationApi as z } from "../../../../services/recommendationApi.js";
-import { useConfigStore as R } from "../../../../stores/config.js";
-import { defineStore as A } from "pinia";
+import { getRecommendationFeedSourceMaps as F, strategyEditPath as U, URLS as E, getOperatorOptions as N, PriceAttributes as M } from "../../../../enums/extensions/recommendationBlock.js";
+import { ToasterTypeOptions as A } from "../../../../enums/toaster.js";
+import { useRecommendationApi as T } from "../../../../services/recommendationApi.js";
+import { useConfigStore as k } from "../../../../stores/config.js";
+import { defineStore as B } from "pinia";
 import "../constants/selectors.js";
-import { DEFAULT_MOBILE_CARDS_IN_ROW as O, DEFAULT_CARDS_IN_ROW as x } from "../constants/layout.js";
-import { CURRENT_CONFIG_VERSION as C, DEFAULT_NODE_CONFIG as T, EXCLUDED_ALGORITHM_IDS as V } from "../constants/defaultConfig.js";
+import { DEFAULT_MOBILE_CARDS_IN_ROW as O, DEFAULT_CARDS_IN_ROW as z } from "../constants/layout.js";
+import { CURRENT_CONFIG_VERSION as C, DEFAULT_NODE_CONFIG as x, EXCLUDED_ALGORITHM_IDS as V } from "../constants/defaultConfig.js";
 import { getDefaultProducts as w } from "../templates/utils.js";
 import { generateCompleteFilterQuery as P } from "../utils/filterUtil.js";
 import { isLegacyStrategyConfig as j } from "../utils/legacyStrategyMigration.js";
@@ -15,13 +15,13 @@ import { getPartnerRecommendationParams as $ } from "../utils/partnerCustomizati
 import { sanitizeProductIds as q } from "../utils/productIds.js";
 import { isFilterValid as K } from "../validation/filterSchema.js";
 import { getInvalidFields as H, isConfigValid as J } from "../validation/requiredFields.js";
-const m = z();
-let S = null, p = null, y = null, I = "", k = null, b = 0;
+const m = T();
+let S = null, p = null, y = null, I = "", R = null, b = 0;
 const g = /* @__PURE__ */ new Map();
 let l = null;
-function D() {
+function _() {
   return {
-    cardsInRow: x,
+    cardsInRow: z,
     currencySettings: {
       name: "USD",
       value: "USD",
@@ -45,7 +45,7 @@ function D() {
     // that default is what reached buildCampaignUrl and baked a most-popular feed URL
     // for a block the user never configured (SD-149916). Legacy blocks still get their real
     // algorithm from the node-config sync or the save-time seed.
-    strategy: R().isFeatureEnabled("reusableRecommendationStrategy") ? "" : "mostPopular",
+    strategy: k().isFeatureEnabled("reusableRecommendationStrategy") ? "" : "mostPopular",
     strategyId: "",
     nodeConfigVersion: C,
     textTrimming: !0,
@@ -58,7 +58,7 @@ function D() {
 }
 function G() {
   return {
-    recommendationConfigs: D(),
+    recommendationConfigs: _(),
     recommendationProducts: [],
     filterStatus: !1,
     filterSelectionDrawerStatus: !1,
@@ -87,7 +87,7 @@ const Q = () => ({
   currentRecommendationId: null,
   strategyPanelOpen: !1,
   configVersion: 0
-}), ft = A("guidoRecommendationExtension", {
+}), ft = B("guidoRecommendationExtension", {
   state: () => Q(),
   getters: {
     // ====================================================================
@@ -98,7 +98,7 @@ const Q = () => ({
      * This allows all existing code that reads `store.recommendationConfigs` to work unchanged.
      */
     recommendationConfigs(t) {
-      return t.currentRecommendationId !== null && t.blockStates[t.currentRecommendationId] ? t.blockStates[t.currentRecommendationId].recommendationConfigs : D();
+      return t.currentRecommendationId !== null && t.blockStates[t.currentRecommendationId] ? t.blockStates[t.currentRecommendationId].recommendationConfigs : _();
     },
     /**
      * Proxy getter: delegates to blockStates[currentRecommendationId].recommendationProducts
@@ -119,7 +119,7 @@ const Q = () => ({
       return t.currentRecommendationId !== null && t.blockStates[t.currentRecommendationId] ? t.blockStates[t.currentRecommendationId].removeStrategyModalStatus : !1;
     },
     isLegacyStrategyBlock() {
-      return R().isFeatureEnabled("reusableRecommendationStrategy") && j(this.recommendationConfigs);
+      return k().isFeatureEnabled("reusableRecommendationStrategy") && j(this.recommendationConfigs);
     },
     legacyConversionLoading(t) {
       return t.currentRecommendationId !== null && t.blockStates[t.currentRecommendationId] ? t.blockStates[t.currentRecommendationId].legacyConversionLoading ?? !1 : !1;
@@ -181,7 +181,7 @@ const Q = () => ({
     getFilterList() {
       return Object.values(this.filterList).filter((t) => t.isFilterable !== 0 && t.isFilterable !== !1).map((t) => {
         let e;
-        return t.type === "productAttribute" ? e = `product_attributes.${t.attributeName}` : E.includes(t.attributeName) ? e = `${t.attributeName}.${this.recommendationConfigs.currencySettings.value}` : e = t.attributeName, {
+        return t.type === "productAttribute" ? e = `product_attributes.${t.attributeName}` : M.includes(t.attributeName) ? e = `${t.attributeName}.${this.recommendationConfigs.currencySettings.value}` : e = t.attributeName, {
           text: t.displayName,
           value: e,
           type: t.attributeType
@@ -234,7 +234,7 @@ const Q = () => ({
       const r = this.blockStates[t];
       if (r) {
         const o = structuredClone(r);
-        o.recommendationConfigs.id = e, o.recommendationConfigs.strategyId && R().isFeatureEnabled("reusableRecommendationStrategy") && (o.isInitialized = !1, o.syncedConfigFingerprint = null), this.blockStates = {
+        o.recommendationConfigs.id = e, o.recommendationConfigs.strategyId && k().isFeatureEnabled("reusableRecommendationStrategy") && (o.isInitialized = !1, o.syncedConfigFingerprint = null), this.blockStates = {
           ...this.blockStates,
           [e]: o
         };
@@ -314,7 +314,7 @@ const Q = () => ({
      * Creates a filter with the first available attribute and operator pre-selected.
      */
     createDefaultFilter(t, e) {
-      const [r] = this.getFilterList, [n] = M(r == null ? void 0 : r.type);
+      const [r] = this.getFilterList, [n] = N(r == null ? void 0 : r.type);
       return {
         type: "standardFilter",
         attribute: (r == null ? void 0 : r.value) ?? "",
@@ -380,9 +380,9 @@ const Q = () => ({
       this.currentRecommendationId === null || !this.blockStates[this.currentRecommendationId] || (this.blockStates[this.currentRecommendationId].removeStrategyModalStatus = !1);
     },
     async fetchStrategies() {
-      for (; k; )
+      for (; R; )
         try {
-          await k;
+          await R;
         } catch {
         }
       if (this.strategiesFetched)
@@ -398,11 +398,11 @@ const Q = () => ({
           this.strategiesLoading = !1, t === b && (this.strategiesSettled = !0);
         }
       })();
-      k = e;
+      R = e;
       try {
         await e;
       } finally {
-        k = null;
+        R = null;
       }
     },
     /**
@@ -434,8 +434,8 @@ const Q = () => ({
     _armStrategyPageReturn(t) {
       const e = window.open(t, "_blank");
       if (!e)
-        return _().showToaster({
-          type: B.Error,
+        return D().showToaster({
+          type: A.Error,
           message: L()("discovery-strategy.error-description")
         }), !1;
       e.opener = null, l == null || l();
@@ -471,7 +471,7 @@ const Q = () => ({
      * new strategy is offered; the user picks it themselves.
      */
     openStrategyCreation() {
-      return this._armStrategyPageReturn(N());
+      return this._armStrategyPageReturn(E.RECOMMENDATION_STRATEGY_CREATE_PATH);
     },
     /**
      * Opens the strategy's edit page. Every return refreshes the list so the block reflects the
@@ -532,7 +532,7 @@ const Q = () => ({
       this.patchCurrentBlockConfig({
         strategyId: "",
         strategy: "",
-        size: T.size,
+        size: x.size,
         nodeConfigVersion: C
       });
     },
@@ -685,7 +685,7 @@ const Q = () => ({
     },
     async _doFetchProducts() {
       var h;
-      const t = this.currentRecommendationId, e = this.blockStates[t], { recommendationConfigs: r } = e, n = R();
+      const t = this.currentRecommendationId, e = this.blockStates[t], { recommendationConfigs: r } = e, n = k();
       if (r.strategyId && n.isFeatureEnabled("reusableRecommendationStrategy")) {
         await this._doFetchStrategyProducts(t);
         return;

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

@@ -8,8 +8,8 @@ export declare const URLS: {
     NEWSLETTER_RECOMMENDATIONS_PATH: string;
     MIGRATE_STRATEGIES_PATH: string;
     TEMPLATE_MIGRATE_STRATEGIES_PATH: string;
+    RECOMMENDATION_STRATEGY_CREATE_PATH: string;
 };
-export declare const strategyCreatePath: () => string;
 export declare const strategyEditPath: (strategyId: string | number) => string;
 export declare const MIGRATION_PATHS: Record<RrsMigrationTarget['scope'], string>;
 export declare const QUERY_PARAMS: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.19.0-beta.11ec5b2",
+  "version": "3.19.0-beta.169cb33",
   "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",
@@ -54,7 +54,7 @@
   "dependencies": {
     "@stripoinc/ui-editor-extensions": "3.10.0",
     "@useinsider/design-system-organisms": "0.0.3-beta.d816f06",
-    "@useinsider/design-system-vue": "1.5.0",
+    "@useinsider/design-system-vue": "2.3.1",
     "@vueuse/core": "11.3.0",
     "lodash-es": "4.17.21",
     "pinia": "2.3.1",