@useinsider/guido 3.17.0-beta.6255bfc → 3.17.0-beta.bdc7d25

package/dist/components/Guido.vue.js

@@ -3,7 +3,7 @@ import i from "./Guido.vue2.js";
 import a from "../_virtual/_plugin-vue2_normalizer.js";
 var t = function() {
   var o = this, r = o._self._c, e = o._self._setupProxy;
-  return r("div", { ref: "wrapperRef", staticClass: "guido-editor__wrapper", class: { "guido-editor__no-header": e.noHeader } }, [r(e.HeaderWrapper, { ref: "headerWrapperRef" }), r(e.AutoSaveController), e.editorStore.isPreviewModeOpen ? r(e.PreviewContainer) : o._e(), r("div", { directives: [{ name: "show", rawName: "v-show", value: !e.previewStore.isLoaded, expression: "!previewStore.isLoaded" }], staticClass: "guido-editor__container", class: { "guido-editor__no-header": e.noHeader }, attrs: { id: "guido-editor" } }), r(e.Toaster), r(e.FilterSelectionDrawer), r(e.AssignStrategyDrawer), r(e.SaveAsTemplateDrawer), e.isTestPartner() ? o._e() : r(e.OnboardingWrapper, { on: { "onboarding-finished": function(p) {
+  return r("div", { ref: "wrapperRef", staticClass: "guido-editor__wrapper", class: { "guido-editor__no-header": e.noHeader } }, [r(e.HeaderWrapper, { ref: "headerWrapperRef" }), r(e.AutoSaveController), e.editorStore.isPreviewModeOpen ? r(e.PreviewContainer) : o._e(), r("div", { directives: [{ name: "show", rawName: "v-show", value: !e.previewStore.isLoaded, expression: "!previewStore.isLoaded" }], staticClass: "guido-editor__container", class: { "guido-editor__no-header": e.noHeader }, attrs: { id: "guido-editor" } }), r(e.Toaster), r(e.FilterSelectionDrawer), e.isRrsEnabled ? r(e.AssignStrategyDrawer) : o._e(), r(e.SaveAsTemplateDrawer), e.isTestPartner() ? o._e() : r(e.OnboardingWrapper, { on: { "onboarding-finished": function(p) {
     return e.emit("onboarding:finished");
   } } }), r(e.UnsubscribeWrapper), r(e.LoadingWrapper)], 1);
 }, n = [], s = /* @__PURE__ */ a(
@@ -12,7 +12,7 @@ var t = function() {
   n,
   !1,
   null,
-  "003398e6"
+  "b13f0cfc"
 );
 const l = s.exports;
 export {

package/dist/components/Guido.vue2.js

@@ -1,31 +1,30 @@
-import { defineComponent as j, defineAsyncComponent as R, ref as B, computed as U, watch as _, onMounted as J, onUnmounted as Q } from "vue";
-import { useCortexBlueprintBridge as X } from "../composables/useCortexBlueprintBridge.js";
-import { provideGuidoActions as Y } from "../composables/useGuidoActions.js";
-import { useGuidoStateBridge as Z } from "../composables/useGuidoStateBridge.js";
-import { usePartner as ee } from "../composables/usePartner.js";
-import { useStripo as te } from "../composables/useStripo.js";
-import { useTimerClone as oe } from "../composables/useTimerClone.js";
+import { defineComponent as Q, defineAsyncComponent as g, ref as U, computed as S, watch as _, onMounted as X, onUnmounted as Y } from "vue";
+import { useCortexBlueprintBridge as Z } from "../composables/useCortexBlueprintBridge.js";
+import { provideGuidoActions as ee } from "../composables/useGuidoActions.js";
+import { useGuidoStateBridge as te } from "../composables/useGuidoStateBridge.js";
+import { usePartner as oe } from "../composables/usePartner.js";
+import { useStripo as ne } from "../composables/useStripo.js";
+import { useTimerClone as re } from "../composables/useTimerClone.js";
 import { migrate as A } from "../config/migrator/index.js";
 import { ModuleFolderDefaults as N } from "../enums/defaults.js";
-import { RIBBON_SELECTOR as ne } from "../enums/onboarding.js";
-import { useRecommendationExtensionStore as re } from "../extensions/Blocks/Recommendation/store/recommendation.js";
-import se from "./organisms/AutoSaveController.vue.js";
-import ae from "./organisms/base/Toaster.vue.js";
-import ie from "./organisms/extensions/recommendation/AssignStrategyDrawer.vue.js";
-import ce from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
-import de from "./organisms/header/HeaderWrapper.vue.js";
-import me from "./organisms/LoadingWrapper.vue.js";
-import le from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
-import ue from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
-import { useStripoApi as pe } from "../services/stripoApi.js";
-import { useConfigStore as fe } from "../stores/config.js";
-import { useDynamicContentStore as ye } from "../stores/dynamic-content.js";
+import { RIBBON_SELECTOR as se } from "../enums/onboarding.js";
+import { useRecommendationExtensionStore as ae } from "../extensions/Blocks/Recommendation/store/recommendation.js";
+import ie from "./organisms/AutoSaveController.vue.js";
+import ce from "./organisms/base/Toaster.vue.js";
+import de from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
+import me from "./organisms/header/HeaderWrapper.vue.js";
+import le from "./organisms/LoadingWrapper.vue.js";
+import ue from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
+import pe from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
+import { useStripoApi as fe } from "../services/stripoApi.js";
+import { useConfigStore as ye } from "../stores/config.js";
+import { useDynamicContentStore as ve } from "../stores/dynamic-content.js";
 import { useEditorStore as O } from "../stores/editor.js";
-import { usePreviewStore as ve } from "../stores/preview.js";
-import { useTemplateStore as ge } from "../stores/template.js";
-import { useUnsubscribeStore as Se } from "../stores/unsubscribe.js";
+import { usePreviewStore as ge } from "../stores/preview.js";
+import { useTemplateStore as Se } from "../stores/template.js";
+import { useUnsubscribeStore as be } from "../stores/unsubscribe.js";
 import { readTrackFloor as P } from "../utils/linkTrackingIds.js";
-const Ke = /* @__PURE__ */ j({
+const Ke = /* @__PURE__ */ Q({
   __name: "Guido",
   props: {
     config: null,
@@ -33,19 +32,21 @@ const Ke = /* @__PURE__ */ j({
   },
   emits: ["dynamic-content:open", "back", "save:start", "save:complete", "on-change", "ready", "onboarding:finished", "test-email:click"],
   setup(W, { expose: x, emit: r }) {
-    const a = W, G = R(
+    const a = W, G = g(
       () => import("./organisms/email-preview/PreviewContainer.vue.js")
-    ), H = R(
+    ), H = g(
       () => import("./organisms/onboarding/OnboardingWrapper.vue.js")
-    ), g = B(), l = B(), u = ye(), S = Se(), o = fe();
+    ), $ = g(
+      () => import("./organisms/extensions/recommendation/AssignStrategyDrawer.vue.js")
+    ), b = U(), l = U(), u = ve(), h = be(), o = ye();
     a.ready && o.init(a.config);
-    const c = O(), $ = ve(), m = U(() => c.hasChanges), { isTestPartner: z } = ee(), h = () => {
+    const c = O(), z = ge(), m = S(() => c.hasChanges), { isTestPartner: q } = oe(), E = () => {
       var t;
-      return (t = g.value) == null ? void 0 : t.handleSave(!0);
-    }, b = (t) => {
+      return (t = b.value) == null ? void 0 : t.handleSave(!0);
+    }, w = (t) => {
       c.loadingStatus = t;
     };
-    X(), Z();
+    Z(), te();
     const p = () => {
       var t, e;
       return {
@@ -56,11 +57,11 @@ const Ke = /* @__PURE__ */ j({
         savedModulesFolderName: ((t = o.editor) == null ? void 0 : t.savedModulesFolderName) || N.SAVED_MODULES,
         defaultModulesFolderName: ((e = o.editor) == null ? void 0 : e.defaultModulesFolderName) || N.DEFAULT_MODULES
       };
-    }, { initPlugin: E, preloadRuntime: w } = te(), { getDefaultTemplate: D } = pe(), { cloneTimersOnSave: C, hasTimerBlocks: k } = oe(), q = U(() => {
+    }, { initPlugin: D, preloadRuntime: C } = ne(), { getDefaultTemplate: k } = fe(), { cloneTimersOnSave: T, hasTimerBlocks: F } = re(), K = S(() => {
       var t;
       return !((t = o.ui) != null && t.showHeader);
-    });
-    Y({
+    }), V = S(() => o.isFeatureEnabled("reusableRecommendationStrategy"));
+    ee({
       onBack: () => {
         console.debug("guido:back"), r("back");
       },
@@ -75,9 +76,9 @@ const Ke = /* @__PURE__ */ j({
         console.debug("guido:test-email:click"), r("test-email:click");
       }
     });
-    const T = (t) => {
+    const I = (t) => {
       console.debug("dynamic-content:close", t), u.setSelectedDynamicContent(t), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: t }));
-    }, F = () => {
+    }, R = () => {
       console.debug("dynamic-content:close", "Without Data"), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: { text: "", value: "" } }));
     };
     _(() => m.value, () => {
@@ -90,38 +91,38 @@ const Ke = /* @__PURE__ */ j({
     let i = null;
     const y = () => {
       var e;
-      const t = document.querySelector(ne);
+      const t = document.querySelector(se);
       (e = l.value) == null || e.style.setProperty("--ribbon-offset", `${(t == null ? void 0 : t.offsetHeight) ?? 0}px`);
     }, v = async () => {
       var t;
       try {
         o.initialized || o.init(a.config), c.templateId = o.templateId;
-        const e = o.template, s = (e == null ? void 0 : e.html) || "", d = (e == null ? void 0 : e.css) || "", I = (e == null ? void 0 : e.preselectedDynamicContent) || [];
-        S.selectedUnsubscribePages = (e == null ? void 0 : e.selectedUnsubscribePages) || [];
-        const L = ((t = e == null ? void 0 : e.migration) == null ? void 0 : t.recommendationConfigs) ?? {}, M = o.isFeatureEnabled("linkTrackingIds");
+        const e = o.template, s = (e == null ? void 0 : e.html) || "", d = (e == null ? void 0 : e.css) || "", L = (e == null ? void 0 : e.preselectedDynamicContent) || [];
+        h.selectedUnsubscribePages = (e == null ? void 0 : e.selectedUnsubscribePages) || [];
+        const M = ((t = e == null ? void 0 : e.migration) == null ? void 0 : t.recommendationConfigs) ?? {}, B = o.isFeatureEnabled("linkTrackingIds");
         let n = {
-          html: s && await A(s, L),
+          html: s && await A(s, M),
           css: d
         };
-        n.html || (n = await D(), n.html = await A(n.html, L));
-        const K = M ? P(n.html, (e == null ? void 0 : e.trackIdCounter) || 0) : 0;
-        k(n.html) && (n.html = await C(n.html)), M && (c.trackIdSessionFloor = Math.max(K, P(n.html)));
-        const V = {
-          preselectedDynamicContentList: I,
+        n.html || (n = await k(), n.html = await A(n.html, M));
+        const j = B ? P(n.html, (e == null ? void 0 : e.trackIdCounter) || 0) : 0;
+        F(n.html) && (n.html = await T(n.html)), B && (c.trackIdSessionFloor = Math.max(j, P(n.html)));
+        const J = {
+          preselectedDynamicContentList: L,
           onReady: () => {
             console.debug("guido:ready"), r("ready");
           }
         };
-        await E(n, p(), V), u.selectedDynamicContentList = I;
+        await D(n, p(), J), u.selectedDynamicContentList = L;
       } catch (e) {
         console.error("Failed to initialize Stripo editor:", e);
       }
     };
-    return J(async () => {
+    return X(async () => {
       var e;
-      console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow"), re().$reset(), O().$reset(), ge().$reset(), y();
+      console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow"), ae().$reset(), O().$reset(), Se().$reset(), y();
       const t = (e = l.value) == null ? void 0 : e.parentElement;
-      if (t && (i = new ResizeObserver(y), i.observe(t)), w(), a.ready)
+      if (t && (i = new ResizeObserver(y), i.observe(t)), C(), a.ready)
         await v();
       else {
         const s = _(() => a.ready, (d) => {
@@ -129,7 +130,7 @@ const Ke = /* @__PURE__ */ j({
         });
       }
       document.addEventListener("dynamic-content:open", f);
-    }), Q(() => {
+    }), Y(() => {
       i == null || i.disconnect(), document.removeEventListener("dynamic-content:open", f);
       try {
         window.UIEditor.removeEditor();
@@ -139,13 +140,13 @@ const Ke = /* @__PURE__ */ j({
       o.reset();
     }), x({
       dynamicContent: {
-        insert: T,
-        close: F
+        insert: I,
+        close: R
       },
       hasChanges: m,
-      saveSilent: h,
-      setLoading: b
-    }), { __sfc: !0, PreviewContainer: G, OnboardingWrapper: H, headerWrapperRef: g, wrapperRef: l, dynamicContentStore: u, unsubscribeStore: S, props: a, configStore: o, editorStore: c, previewStore: $, hasChanges: m, isTestPartner: z, saveSilent: h, setLoading: b, emit: r, buildMetadata: p, initPlugin: E, preloadRuntime: w, getDefaultTemplate: D, cloneTimersOnSave: C, hasTimerBlocks: k, noHeader: q, insertDynamicContent: T, closeDynamicContent: F, handleDynamicContentOpen: f, ribbonObserver: i, updateRibbonOffset: y, startEditor: v, AutoSaveController: se, Toaster: ae, AssignStrategyDrawer: ie, FilterSelectionDrawer: ce, HeaderWrapper: de, LoadingWrapper: me, SaveAsTemplateDrawer: le, UnsubscribeWrapper: ue };
+      saveSilent: E,
+      setLoading: w
+    }), { __sfc: !0, PreviewContainer: G, OnboardingWrapper: H, AssignStrategyDrawer: $, headerWrapperRef: b, wrapperRef: l, dynamicContentStore: u, unsubscribeStore: h, props: a, configStore: o, editorStore: c, previewStore: z, hasChanges: m, isTestPartner: q, saveSilent: E, setLoading: w, emit: r, buildMetadata: p, initPlugin: D, preloadRuntime: C, getDefaultTemplate: k, cloneTimersOnSave: T, hasTimerBlocks: F, noHeader: K, isRrsEnabled: V, insertDynamicContent: I, closeDynamicContent: R, handleDynamicContentOpen: f, ribbonObserver: i, updateRibbonOffset: y, startEditor: v, AutoSaveController: ie, Toaster: ce, FilterSelectionDrawer: de, HeaderWrapper: me, LoadingWrapper: le, SaveAsTemplateDrawer: ue, UnsubscribeWrapper: pe };
   }
 });
 export {

package/dist/components/organisms/extensions/recommendation/AssignStrategyDrawer.vue.js

@@ -1,18 +1,21 @@
-import a from "./AssignStrategyDrawer.vue2.js";
+import r from "./AssignStrategyDrawer.vue2.js";
 /* empty css                          */
-import r from "../../../../_virtual/_plugin-vue2_normalizer.js";
-var o = function() {
-  var s = this, e = s._self._c, t = s._self._setupProxy;
-  return e(t.WpDrawer, { attrs: { id: "assign-strategy-drawer", "description-status": "", size: "medium", "description-text": t.drawerDescription, "footer-button-group-options": t.footerButtonGroupOptions, status: t.store.assignStrategyDrawerStatus, "title-text": t.trans("gpt-app-builder.assign-recommendation-strategy") }, on: { cancelOrBackButtonEvent: t.closeDrawer, onCloseEvent: t.closeDrawer, primaryButtonEvent: t.assignStrategy } }, [t.store.assignStrategyDrawerStatus ? e("div", { staticClass: "assign-strategy-drawer-content d-f f-d-c gap-16" }, [e(t.InSelect, { staticClass: "assign-strategy-select", attrs: { id: "assign-strategy-select", "search-status": "", "static-child-position": "bottom right", "button-status": !1, "dynamic-child-position": !1, "label-text": t.trans("ds-steps.recommendation-strategy"), options: t.strategyOptions, "placeholder-text": t.trans("ds-steps.select-strategy"), "skeleton-sizing": { width: 240, height: 42 }, "skeleton-status": t.store.strategiesLoading, state: t.showSelectionError ? "error" : "default", "state-message": t.showSelectionError ? t.trans("ds-steps.select-strategy-tooltip") : "", value: t.selectValue }, on: { select: t.onSelect } }), t.selectedStrategy ? e("div", { key: String(t.selectedStrategy.strategy_id), staticClass: "assign-strategy-detail" }, [e(t.OrgStrategyDetailModal, { attrs: { show: "", "campaign-details-tab-status": t.campaignTabSupported, "footer-status": !1, strategy: t.selectedStrategy } })], 1) : s._e()], 1) : s._e()]);
-}, n = [], i = /* @__PURE__ */ r(
+/* empty css                          */
+import o from "../../../../_virtual/_plugin-vue2_normalizer.js";
+var a = function() {
+  var e = this, s = e._self._c, t = e._self._setupProxy;
+  return t.store.assignStrategyDrawerStatus ? s(t.OrgStrategyDetailModal, { staticClass: "assign-strategy-drawer", attrs: { "description-status": "", show: "", "description-text": t.drawerDescription, "footer-button-group-options": t.footerButtonGroupOptions, strategy: t.selectedStrategy ?? {}, "title-text": t.trans("gpt-app-builder.assign-recommendation-strategy") }, on: { close: t.closeDrawer, primaryClick: t.assignStrategy }, scopedSlots: e._u([{ key: "contentTop", fn: function() {
+    return [s("div", { staticClass: "assign-strategy-drawer-content px-5 py-5" }, [s(t.OrgStrategyDropdown, { staticClass: "assign-strategy-select", attrs: { id: "assign-strategy-select", "info-box-position": "bottom right", "create-button-visible": !1, loading: t.store.strategiesLoading, "selected-strategy-id": t.selectedStrategyId, state: t.showSelectionError ? "error" : "default", "state-message": t.showSelectionError ? t.trans("ds-steps.select-strategy-tooltip") : "", strategies: t.strategyOptions }, on: { select: t.onSelect } })], 1)];
+  }, proxy: !0 }], null, !1, 5799417) }) : e._e();
+}, n = [], i = /* @__PURE__ */ o(
+  r,
   a,
-  o,
   n,
   !1,
   null,
-  "afde0449"
+  "43e684f6"
 );
-const p = i.exports;
+const y = i.exports;
 export {
-  p as default
+  y as default
 };

package/dist/components/organisms/extensions/recommendation/AssignStrategyDrawer.vue2.js

@@ -1,38 +1,41 @@
-import { defineComponent as S, defineAsyncComponent as w, ref as c, computed as o, watch as v } from "vue";
+import { defineComponent as f, defineAsyncComponent as g, ref as l, computed as a, watch as w } from "vue";
 import "@useinsider/design-system-organisms/style";
-import _ from "../../../wrappers/WpDrawer.vue.js";
-import { useToaster as D } from "../../../../composables/useToaster.js";
-import { useTranslations as T } from "../../../../composables/useTranslations.js";
-import { URLS as A } from "../../../../enums/extensions/recommendationBlock.js";
-import { ToasterTypeOptions as u } from "../../../../enums/toaster.js";
-import { useRecommendationExtensionStore as E } from "../../../../extensions/Blocks/Recommendation/store/recommendation.js";
-import { buildStrategyInfoBoxProps as O } from "../../../../utils/strategyInfoBox.js";
-import { InSelect as x } from "@useinsider/design-system-vue";
-const V = /* @__PURE__ */ S({
+import { useToaster as _ } from "../../../../composables/useToaster.js";
+import { useTranslations as D } from "../../../../composables/useTranslations.js";
+import { URLS as v } from "../../../../enums/extensions/recommendationBlock.js";
+import { ToasterTypeOptions as p } from "../../../../enums/toaster.js";
+import { useRecommendationExtensionStore as T } from "../../../../extensions/Blocks/Recommendation/store/recommendation.js";
+import O from "./StrategyInfoBoxContent.vue.js";
+import { buildStrategyInfoBoxProps as x } from "../../../../utils/strategyInfoBox.js";
+const L = /* @__PURE__ */ f({
   __name: "AssignStrategyDrawer",
-  setup(B) {
-    const p = w(
+  setup(A) {
+    const m = g(
       async () => (await import("@useinsider/design-system-organisms")).OrgStrategyDetailModal
-    ), r = T(), e = E(), { showToaster: n } = D(), s = c(null), a = c(!1), l = c(!1), m = o(() => e.assignStrategyDrawerStatus ? r("email-editor.assign-strategy-description", { url: A.RECOMMENDATION_STRATEGIES_PANEL_PATH }) : "");
-    v(() => e.assignStrategyDrawerStatus, (t) => {
+    ), y = g(
+      async () => (await import("@useinsider/design-system-organisms")).OrgStrategyDropdown
+    ), r = D(), e = T(), { showToaster: n } = _(), s = l(null), o = l(!1), u = a(() => e.assignStrategyDrawerStatus ? r("email-editor.assign-strategy-description", { url: v.RECOMMENDATION_STRATEGIES_PANEL_PATH }) : "");
+    w(() => e.assignStrategyDrawerStatus, (t) => {
       if (!t)
         return;
       const { strategyId: i } = e.recommendationConfigs;
-      s.value = i || null, a.value = !1, l.value = !!window.l10n, e.fetchStrategies().catch(() => {
+      s.value = i || null, o.value = !1, e.fetchStrategies().catch(() => {
         n({
-          type: u.Error,
+          type: p.Error,
           message: r("discovery-strategy.error-description")
         });
       });
     });
-    const y = o(() => e.strategies.map((t) => ({
+    const d = a(() => e.strategies.map((t) => ({
       text: t.name,
       value: t.strategy_id,
-      infoBoxProps: O(t, r)
-    }))), d = o(() => [{ value: s.value }]), g = o(() => {
+      // `slot` lives here, not in the util: the design system renders it with
+      // `<component :is>` inside its own info box, and a util must not import one.
+      infoBoxProps: { ...x(t, r), slot: O }
+    }))), c = a(() => {
       const t = e.strategies.find((i) => String(i.strategy_id) === String(s.value ?? ""));
       return t ? { ...t, fallback_config: null } : null;
-    }), f = o(() => ({
+    }), S = a(() => ({
       primaryButton: {
         styling: "solid",
         type: "primary",
@@ -44,23 +47,23 @@ const V = /* @__PURE__ */ S({
         labelText: r("products.cancel")
       }
     }));
-    return { __sfc: !0, OrgStrategyDetailModal: p, trans: r, store: e, showToaster: n, selectedStrategyId: s, showSelectionError: a, campaignTabSupported: l, drawerDescription: m, strategyOptions: y, selectValue: d, selectedStrategy: g, footerButtonGroupOptions: f, closeDrawer: () => {
+    return { __sfc: !0, OrgStrategyDetailModal: m, OrgStrategyDropdown: y, trans: r, store: e, showToaster: n, selectedStrategyId: s, showSelectionError: o, drawerDescription: u, strategyOptions: d, selectedStrategy: c, footerButtonGroupOptions: S, closeDrawer: () => {
       e.closeAssignStrategyDrawer();
     }, assignStrategy: () => {
-      const t = g.value;
+      const t = c.value;
       if (!t) {
-        a.value = !0;
+        o.value = !0;
         return;
       }
       e.assignStrategy(t), n({
-        type: u.Success,
+        type: p.Success,
         message: r("email-editor.strategy-assigned-success", { strategyName: t.name })
       }), e.closeAssignStrategyDrawer();
     }, onSelect: (t) => {
-      s.value = t.value, a.value = !1;
-    }, WpDrawer: _, InSelect: x };
+      s.value = t.value, o.value = !1;
+    } };
   }
 });
 export {
-  V as default
+  L as default
 };

package/dist/components/organisms/extensions/recommendation/StrategyInfoBoxContent.vue.js

@@ -0,0 +1,19 @@
+import a from "./StrategyInfoBoxContent.vue2.js";
+import r from "../../../../_virtual/_plugin-vue2_normalizer.js";
+var _ = function() {
+  var t = this, s = t._self._c;
+  return t._self._setupProxy, s("div", { staticClass: "d-f f-d-c mt-3" }, t._l(t.details, function(n, e) {
+    return s("div", { key: n.title, staticClass: "d-f f-d-c", class: { "mt-2": e > 0 } }, [s("span", { staticClass: "f-s-1 f-w-600 l-h-1 t-c-52 mb-12" }, [t._v(t._s(n.title))]), s("span", { staticClass: "f-s-1 l-h-6 t-c-55 w-b-b-w" }, [t._v(t._s(n.value))])]);
+  }), 0);
+}, c = [], f = /* @__PURE__ */ r(
+  a,
+  _,
+  c,
+  !1,
+  null,
+  null
+);
+const m = f.exports;
+export {
+  m as default
+};

package/dist/components/organisms/extensions/recommendation/StrategyInfoBoxContent.vue2.js

@@ -0,0 +1,13 @@
+import { defineComponent as t } from "vue";
+const o = /* @__PURE__ */ t({
+  __name: "StrategyInfoBoxContent",
+  props: {
+    details: null
+  },
+  setup(e) {
+    return { __sfc: !0 };
+  }
+});
+export {
+  o as default
+};

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

@@ -141,11 +141,11 @@ const z = () => ({
     },
     getActivePredictiveAlgorithms: (t) => {
       const e = y(), r = [];
-      return t.activePredictiveAlgorithms.filter((i) => !N.includes(i)).forEach((i) => {
-        r.push(...e.filter((s) => s.id === i));
-      }), r.map((i) => ({
-        text: i.name,
-        value: i.key
+      return t.activePredictiveAlgorithms.filter((n) => !N.includes(n)).forEach((n) => {
+        r.push(...e.filter((s) => s.id === n));
+      }), r.map((n) => ({
+        text: n.name,
+        value: n.key
       }));
     },
     getLanguages: (t) => Object.entries(t.languages).map(([e, r]) => ({
@@ -191,13 +191,13 @@ const z = () => ({
     removeBlockState(t) {
       const e = t.toString();
       if (this.recommendationCampaignUrls[e]) {
-        const i = { ...this.recommendationCampaignUrls };
-        delete i[e], this.recommendationCampaignUrls = i;
+        const n = { ...this.recommendationCampaignUrls };
+        delete n[e], this.recommendationCampaignUrls = n;
       }
       const r = { ...this.blockStates };
       if (delete r[t], this.blockStates = r, this.currentRecommendationId === t) {
-        const i = Object.keys(this.blockStates).map(Number);
-        this.currentRecommendationId = i.length > 0 ? i[0] : null;
+        const n = Object.keys(this.blockStates).map(Number);
+        this.currentRecommendationId = n.length > 0 ? n[0] : null;
       }
     },
     /**
@@ -213,10 +213,10 @@ const z = () => ({
           [e]: o
         };
       }
-      const i = t.toString(), s = e.toString(), n = this.recommendationCampaignUrls[i];
-      n && (this.recommendationCampaignUrls = {
+      const n = t.toString(), s = e.toString(), i = this.recommendationCampaignUrls[n];
+      i && (this.recommendationCampaignUrls = {
         ...this.recommendationCampaignUrls,
-        [s]: n
+        [s]: i
       });
     },
     /**
@@ -241,7 +241,7 @@ const z = () => ({
      * `isInitialized`) alone.
      */
     seedBlockUrlConfig(t, e) {
-      const r = (o, a) => o === "." || o === "," || o === " " ? o : a, i = {
+      const r = (o, a) => o === "." || o === "," || o === " " ? o : a, n = {
         name: e.currencyCode,
         value: e.currencyCode,
         symbol: e.currencyCode,
@@ -249,9 +249,9 @@ const z = () => ({
         decimalCount: String(e.currencyDecimalCount),
         decimalSeparator: r(e.currencyDecimalSeparator, ","),
         thousandSeparator: r(e.currencyThousandSeparator, ".")
-      }, s = !this.blockStates[t], n = s ? k() : this.blockStates[t];
-      n.recommendationConfigs = {
-        ...n.recommendationConfigs,
+      }, s = !this.blockStates[t], i = s ? k() : this.blockStates[t];
+      i.recommendationConfigs = {
+        ...i.recommendationConfigs,
         strategy: e.strategy,
         strategyId: e.strategyId,
         language: e.language,
@@ -259,10 +259,10 @@ const z = () => ({
         productIds: e.productIds,
         filters: e.filters,
         shuffleProducts: e.shuffleProducts,
-        currencySettings: i
+        currencySettings: n
       }, s && (this.blockStates = {
         ...this.blockStates,
-        [t]: n
+        [t]: i
       });
     },
     /**
@@ -281,18 +281,18 @@ const z = () => ({
           ...t.currencySettings || {}
         }
       };
-      const { triggerRefetch: i = !0 } = e;
-      i && this.configVersion++;
+      const { triggerRefetch: n = !0 } = e;
+      n && this.configVersion++;
     },
     /**
      * Creates a filter with the first available attribute and operator pre-selected.
      */
     createDefaultFilter(t, e) {
-      const [r] = this.getFilterList, [i] = w(r == null ? void 0 : r.type);
+      const [r] = this.getFilterList, [n] = w(r == null ? void 0 : r.type);
       return {
         type: "standardFilter",
         attribute: (r == null ? void 0 : r.value) ?? "",
-        operator: (i == null ? void 0 : i.value) ?? "",
+        operator: (n == null ? void 0 : n.value) ?? "",
         innerGroupOperator: "*",
         outerGroupOperator: "*",
         filterNumber: e,
@@ -385,14 +385,14 @@ const z = () => ({
      * currencies can resolve to different paths for the same revision.
      */
     async resolveStrategyUrlTemplate(t, e) {
-      const r = typeof t.updated_at == "string" ? t.updated_at : "", i = r ? `${t.strategy_id}:${r}:${e}` : "", s = i ? this.strategyUrlTemplates[i] : void 0;
+      const r = typeof t.updated_at == "string" ? t.updated_at : "", n = r ? `${t.strategy_id}:${r}:${e}` : "", s = n ? this.strategyUrlTemplates[n] : void 0;
       if (s)
         return s;
-      const { full_path: n } = await d.generateStrategyEndpoint(t, e);
-      return i && (this.strategyUrlTemplates = {
+      const { full_path: i } = await d.generateStrategyEndpoint(t, e);
+      return n && (this.strategyUrlTemplates = {
         ...this.strategyUrlTemplates,
-        [i]: n
-      }), n;
+        [n]: i
+      }), i;
     },
     /**
      * Assigns a strategy to the current block. The config write is
@@ -433,8 +433,8 @@ const z = () => ({
             currencies: r
           } = await d.fetchRecommendationCreateData();
           if (this.activePredictiveAlgorithms = t, this.languages = e, this.currentRecommendationId !== null && this.blockStates[this.currentRecommendationId]) {
-            const i = this.blockStates[this.currentRecommendationId];
-            i.filterStatus = !!i.recommendationConfigs.filters.length;
+            const n = this.blockStates[this.currentRecommendationId];
+            n.filterStatus = !!n.recommendationConfigs.filters.length;
           }
           this.currencyList = r;
         })();
@@ -473,41 +473,41 @@ const z = () => ({
     deleteFilterGroup(t) {
       if (this.currentRecommendationId === null || !this.blockStates[this.currentRecommendationId])
         return;
-      const e = this.blockStates[this.currentRecommendationId], r = e.recommendationConfigs.filters.filter((n) => n.filterGroup !== t), i = [...new Set(r.map((n) => n.filterGroup))].sort((n, o) => n - o), s = new Map(i.map((n, o) => [n, o + 1]));
-      e.recommendationConfigs.filters = r.map((n) => ({
-        ...n,
-        filterGroup: s.get(n.filterGroup) ?? n.filterGroup
+      const e = this.blockStates[this.currentRecommendationId], r = e.recommendationConfigs.filters.filter((i) => i.filterGroup !== t), n = [...new Set(r.map((i) => i.filterGroup))].sort((i, o) => i - o), s = new Map(n.map((i, o) => [i, o + 1]));
+      e.recommendationConfigs.filters = r.map((i) => ({
+        ...i,
+        filterGroup: s.get(i.filterGroup) ?? i.filterGroup
       }));
     },
     updateFilter(t) {
       if (this.currentRecommendationId === null || !this.blockStates[this.currentRecommendationId])
         return;
-      const e = this.blockStates[this.currentRecommendationId], r = e.recommendationConfigs.filters.findIndex((i) => i.filterNumber === t.filterNumber && i.filterGroup === t.filterGroup);
+      const e = this.blockStates[this.currentRecommendationId], r = e.recommendationConfigs.filters.findIndex((n) => n.filterNumber === t.filterNumber && n.filterGroup === t.filterGroup);
       if (r !== -1) {
-        const i = [...e.recommendationConfigs.filters];
-        i[r] = {
+        const n = [...e.recommendationConfigs.filters];
+        n[r] = {
           ...t,
           isValid: A(t)
-        }, e.recommendationConfigs.filters = i;
+        }, e.recommendationConfigs.filters = n;
       }
     },
     deleteFilter(t) {
       if (this.currentRecommendationId === null || !this.blockStates[this.currentRecommendationId])
         return;
-      const e = this.blockStates[this.currentRecommendationId], r = [...e.recommendationConfigs.filters].findIndex((i) => i.filterNumber === t.filterNumber && i.filterGroup === t.filterGroup);
+      const e = this.blockStates[this.currentRecommendationId], r = [...e.recommendationConfigs.filters].findIndex((n) => n.filterNumber === t.filterNumber && n.filterGroup === t.filterGroup);
       if (r !== -1) {
-        let i = [...e.recommendationConfigs.filters];
-        if (i.splice(r, 1), i.some((n) => n.filterGroup === t.filterGroup)) {
-          let n = 1;
-          i = i.map((o) => o.filterGroup === t.filterGroup ? { ...o, filterNumber: n++ } : o);
+        let n = [...e.recommendationConfigs.filters];
+        if (n.splice(r, 1), n.some((i) => i.filterGroup === t.filterGroup)) {
+          let i = 1;
+          n = n.map((o) => o.filterGroup === t.filterGroup ? { ...o, filterNumber: i++ } : o);
         } else {
-          const n = [...new Set(i.map((a) => a.filterGroup))].sort((a, c) => a - c), o = new Map(n.map((a, c) => [a, c + 1]));
-          i = i.map((a) => ({
+          const i = [...new Set(n.map((a) => a.filterGroup))].sort((a, c) => a - c), o = new Map(i.map((a, c) => [a, c + 1]));
+          n = n.map((a) => ({
             ...a,
             filterGroup: o.get(a.filterGroup) ?? a.filterGroup
           }));
         }
-        e.recommendationConfigs.filters = i;
+        e.recommendationConfigs.filters = n;
       }
     },
     addFilter(t) {
@@ -515,8 +515,8 @@ const z = () => ({
         return;
       const e = this.blockStates[this.currentRecommendationId], r = [...e.recommendationConfigs.filters], s = r.filter(
         (o) => o.filterGroup === t.filterGroup
-      ).length + 1, n = r.findLastIndex((o) => o.filterGroup === t.filterGroup);
-      n !== -1 ? r.splice(n + 1, 0, {
+      ).length + 1, i = r.findLastIndex((o) => o.filterGroup === t.filterGroup);
+      i !== -1 ? r.splice(i + 1, 0, {
         ...t,
         filterNumber: s
       }) : r.push({
@@ -554,22 +554,22 @@ const z = () => ({
     },
     async _doFetchProducts() {
       var p;
-      const t = this.currentRecommendationId, e = this.blockStates[t], { recommendationConfigs: r } = e, i = P(), { isFeatureEnabled: s } = C();
+      const t = this.currentRecommendationId, e = this.blockStates[t], { recommendationConfigs: r } = e, n = P(), { isFeatureEnabled: s } = C();
       if (s("reusableRecommendationStrategy") && r.strategyId) {
         await this._doFetchStrategyProducts(t);
         return;
       }
-      const n = r.filters.filter((u) => u.isValid), o = I(n), a = ((p = y().find((u) => u.key === r.strategy)) == null ? void 0 : p.path) || "", c = parseInt(r.size) || 6, l = {
+      const i = r.filters.filter((u) => u.isValid), o = I(i), a = ((p = y().find((u) => u.key === r.strategy)) == null ? void 0 : p.path) || "", c = parseInt(r.size) || 6, l = {
         locale: r.language,
         currency: r.currencySettings.value,
-        partnerName: i.partnerName,
+        partnerName: n.partnerName,
         size: r.size,
         details: !0,
-        campaignId: i.variationId
+        campaignId: n.variationId
       };
       r.strategy === "manualMerchandising" ? l.productId = x(r.productIds) : r.strategy === "similarViewed" && (l.productId = "{itemId}"), r.strategy === "userBased" && (l.userId = "{user_id}"), o && (l.filter = o), r.shuffleProducts && (l.shuffle = !0), Object.assign(
         l,
-        L(i.partnerName, r.strategy)
+        L(n.partnerName, r.strategy)
       );
       let m;
       try {
@@ -587,21 +587,21 @@ const z = () => ({
      */
     async _doFetchStrategyProducts(t) {
       const { recommendationConfigs: e } = this.blockStates[t];
-      let r = [], i = parseInt(e.size) || 6;
+      let r = [], n = parseInt(e.size) || 6;
       try {
-        this.strategies.length || await this.fetchStrategies();
+        await this.fetchStrategies();
         const s = this.strategies.find(
-          (n) => String(n.strategy_id) === e.strategyId
+          (i) => String(i.strategy_id) === e.strategyId
         );
         if (s) {
-          i = parseInt(String(s.size ?? "")) || i;
-          const n = e.currencySettings.value, a = (await this.resolveStrategyUrlTemplate(s, n)).replaceAll("{locale}", e.language).replaceAll("{currency}", n), c = a.indexOf("?"), l = c === -1 ? a : a.slice(0, c), m = (c === -1 ? "" : a.slice(c + 1)).split("&").filter((u) => u && !u.startsWith("user_id=")), p = m.length ? `${l}?${m.join("&")}` : l;
+          n = parseInt(String(s.size ?? "")) || n;
+          const i = e.currencySettings.value, a = (await this.resolveStrategyUrlTemplate(s, i)).replaceAll("{locale}", e.language).replaceAll("{currency}", i), c = a.indexOf("?"), l = c === -1 ? a : a.slice(0, c), m = (c === -1 ? "" : a.slice(c + 1)).split("&").filter((u) => u && !u.startsWith("user_id=")), p = m.length ? `${l}?${m.join("&")}` : l;
           r = await d.fetchRecommendationProductsByUrl(p);
         }
       } catch {
         r = [];
       }
-      this._setBlockProducts(t, r, i);
+      this._setBlockProducts(t, r, n);
     },
     /**
      * Writes products to a block's state, padded/clipped to exactly `size`:
@@ -612,10 +612,10 @@ const z = () => ({
     _setBlockProducts(t, e, r) {
       if (!this.blockStates[t])
         return;
-      const i = e.length > 0 ? e : b(r);
+      const n = e.length > 0 ? e : b(r);
       this.blockStates[t].recommendationProducts = [
-        ...i.slice(0, r),
-        ...b(Math.max(0, r - i.length))
+        ...n.slice(0, r),
+        ...b(Math.max(0, r - n.length))
       ];
     }
   }

package/dist/guido.css

@@ -1 +1 @@
-@charset "UTF-8";.gap-16[data-v-afde0449]{gap:16px}.assign-strategy-select[data-v-afde0449] .assign-strategy-info-box__updated{margin-top:2px;color:var(--guido-color-gray-600, #6d7686);font-size:12px;line-height:18px}.assign-strategy-select[data-v-afde0449] .assign-strategy-info-box__row{display:flex;flex-direction:column;margin-top:10px;font-size:12px;line-height:18px}.assign-strategy-select[data-v-afde0449] .assign-strategy-info-box__label{color:var(--guido-color-gray-600, #6d7686)}.assign-strategy-select[data-v-afde0449] .assign-strategy-info-box__value{color:var(--guido-color-gray-800, #2c3546);word-break:break-word}.assign-strategy-select[data-v-afde0449]{width:100%;max-width:none}.assign-strategy-select[data-v-afde0449] .in-dropdown-box__container{width:58%}.assign-strategy-detail[data-v-afde0449] .spaced-dot-sep{background-image:linear-gradient(90deg,#91949f 20%,#fff0 0);background-position:center bottom;background-repeat:repeat-x;background-size:5px 1px}.assign-strategy-detail[data-v-afde0449] .spaced-dot-sep--top{background-position:center top}.assign-strategy-detail[data-v-afde0449] .spaced-dot-sep--fc-n:first-child{background:none}.assign-strategy-detail[data-v-afde0449] .in-drawer__container,.assign-strategy-detail[data-v-afde0449] .in-drawer__wrapper{position:static!important;inset:auto!important;width:100%!important;max-width:none!important;height:auto!important;border:none!important;box-shadow:none!important;transform:none!important}.assign-strategy-detail[data-v-afde0449] .in-drawer__content{height:auto!important;max-height:none!important;overflow:visible!important}.assign-strategy-detail[data-v-afde0449] .in-drawer__content .px-5{padding-left:0!important;padding-right:0!important}.assign-strategy-detail[data-v-afde0449] .filter-humanizer{margin-right:0!important;margin-left:0!important}.assign-strategy-detail[data-v-afde0449] .in-drawer__header-main{padding:0!important}.assign-strategy-detail[data-v-afde0449] .in-tabs-wrapper{padding-right:0;padding-left:0}.assign-strategy-detail[data-v-afde0449] .in-on-page-message-wrapper{margin-right:0;margin-left:0}.assign-strategy-detail[data-v-afde0449] .in-drawer__title,.assign-strategy-detail[data-v-afde0449] [class*=overlay],.assign-strategy-detail[data-v-afde0449] #close-button-strategy-details-drawer{display:none!important}.gap-16[data-v-5553d071],.gap-16[data-v-0e1b0c54]{gap:16px}[data-v-73199fa4] .in-button-v2__wrapper{line-height:0}[data-v-22226124] .in-segments-wrapper__button_selected,[data-v-22226124] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb;color:#0010ac;border-color:#0010ac}[data-v-2cb418af] .in-progress-wrapper__progress p span:last-child{display:none!important}[data-v-2cb418af] .in-progress-description-status{display:none!important}.view-options-wrapper[data-v-87033101]{position:relative;display:inline-block}.new-tag[data-v-87033101]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-87033101] .guido__view-option-selection-desktop svg,[data-v-87033101] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-87033101] .in-segments-wrapper__button_selected,[data-v-87033101] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-87033101] .in-tooltip-wrapper-v2__icon{cursor:pointer}.editor-toolbar[data-v-173c3a40]{gap:4px}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history[data-v-fad98586]{gap:8px}.version-history__toolbar[data-v-fad98586]{gap:4px}.view-options-wrapper[data-v-6ebabfe4]{position:relative;display:inline-block}.new-tag[data-v-6ebabfe4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-6ebabfe4] .guido__verion-history-view-option-selection-desktop svg,[data-v-6ebabfe4] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-6ebabfe4] .in-segments-wrapper__button_selected,[data-v-6ebabfe4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-6ebabfe4] .in-tooltip-wrapper-v2__icon{cursor:pointer}.auto-save-toggle[data-v-2c964af4]{position:relative}.auto-save-toggle__info-box[data-v-2c964af4]{position:absolute;top:100%;left:0;z-index:10;width:280px}.editor-actions[data-v-6e711fd7]{gap:4px}.header-wrapper[data-v-d11dd577]{min-width:1000px}.guido-loading__wrapper[data-v-07c4b2d8]{height:100%;top:75px!important;bottom:0!important}.guido-editor__wrapper[data-v-003398e6]{--ribbon-offset: 0px;position:relative;width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__container[data-v-003398e6]{width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__no-header[data-v-003398e6]{height:calc(100vh - 75px - var(--ribbon-offset))}[data-v-293f1c47] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-91a26acd]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-91a26acd]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-91a26acd]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-91a26acd]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-91a26acd]{object-fit:cover;transform:scale(1)}[data-v-b9a93c6e] .guido__verion-history-view-option-selection-desktop svg,[data-v-b9a93c6e] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-b9a93c6e] .in-segments-wrapper__button_selected,[data-v-b9a93c6e] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-c3fd5d4b]{gap:16px}.desktop-browser-header[data-v-d86c5af5]{height:79px;min-height:79px}.desktop-browser-header__left[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:378px}.desktop-browser-header__center[data-v-d86c5af5]{height:79px;background-repeat:repeat-x;background-size:auto 100%;background-position:left top}.desktop-browser-header__right[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:112px}.desktop-preview[data-v-cf946232]{min-width:602px;height:70vh;min-height:583px;border-radius:10px}.desktop-preview iframe[data-v-cf946232]{min-height:504px}.iframe-wrapper[data-v-f255b2bb]{width:258px}.iframe-scaled[data-v-f255b2bb]{width:320px;height:124.0310077519%;transform:scale(.80625);transform-origin:top left}.cropped-text[data-v-eb3d05d7]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-preview-wrapper__phone[data-v-3f472f96]{width:282px}.mobile-preview-wrapper__phone img[data-v-3f472f96]{object-fit:cover;border-radius:44px}.mobile-preview-wrapper__content[data-v-3f472f96]{width:258px;height:450px;left:12px}[data-v-6bcaca8a] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-f16f20f8] .vueperslides__bullets{pointer-events:none!important}[data-v-f16f20f8] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-bb3cca55] .vueperslides__bullets{pointer-events:none!important}[data-v-bb3cca55] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-b09e80c4] .vueperslides__bullets{pointer-events:none!important}[data-v-b09e80c4] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-9bdef600] .vueperslides__parallax-wrapper{padding-bottom:110px!important}
+@charset "UTF-8";.gap-16[data-v-5553d071],.gap-16[data-v-0e1b0c54]{gap:16px}[data-v-73199fa4] .in-button-v2__wrapper{line-height:0}[data-v-22226124] .in-segments-wrapper__button_selected,[data-v-22226124] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb;color:#0010ac;border-color:#0010ac}[data-v-2cb418af] .in-progress-wrapper__progress p span:last-child{display:none!important}[data-v-2cb418af] .in-progress-description-status{display:none!important}.view-options-wrapper[data-v-87033101]{position:relative;display:inline-block}.new-tag[data-v-87033101]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-87033101] .guido__view-option-selection-desktop svg,[data-v-87033101] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-87033101] .in-segments-wrapper__button_selected,[data-v-87033101] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-87033101] .in-tooltip-wrapper-v2__icon{cursor:pointer}.editor-toolbar[data-v-173c3a40]{gap:4px}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history[data-v-fad98586]{gap:8px}.version-history__toolbar[data-v-fad98586]{gap:4px}.view-options-wrapper[data-v-6ebabfe4]{position:relative;display:inline-block}.new-tag[data-v-6ebabfe4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-6ebabfe4] .guido__verion-history-view-option-selection-desktop svg,[data-v-6ebabfe4] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-6ebabfe4] .in-segments-wrapper__button_selected,[data-v-6ebabfe4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-6ebabfe4] .in-tooltip-wrapper-v2__icon{cursor:pointer}.auto-save-toggle[data-v-2c964af4]{position:relative}.auto-save-toggle__info-box[data-v-2c964af4]{position:absolute;top:100%;left:0;z-index:10;width:280px}.editor-actions[data-v-6e711fd7]{gap:4px}.header-wrapper[data-v-d11dd577]{min-width:1000px}.guido-loading__wrapper[data-v-07c4b2d8]{height:100%;top:75px!important;bottom:0!important}.guido-editor__wrapper[data-v-b13f0cfc]{--ribbon-offset: 0px;position:relative;width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__container[data-v-b13f0cfc]{width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__no-header[data-v-b13f0cfc]{height:calc(100vh - 75px - var(--ribbon-offset))}[data-v-293f1c47] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-91a26acd]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-91a26acd]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-91a26acd]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-91a26acd]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-91a26acd]{object-fit:cover;transform:scale(1)}[data-v-b9a93c6e] .guido__verion-history-view-option-selection-desktop svg,[data-v-b9a93c6e] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-b9a93c6e] .in-segments-wrapper__button_selected,[data-v-b9a93c6e] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-c3fd5d4b]{gap:16px}.desktop-browser-header[data-v-d86c5af5]{height:79px;min-height:79px}.desktop-browser-header__left[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:378px}.desktop-browser-header__center[data-v-d86c5af5]{height:79px;background-repeat:repeat-x;background-size:auto 100%;background-position:left top}.desktop-browser-header__right[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:112px}.desktop-preview[data-v-cf946232]{min-width:602px;height:70vh;min-height:583px;border-radius:10px}.desktop-preview iframe[data-v-cf946232]{min-height:504px}.iframe-wrapper[data-v-f255b2bb]{width:258px}.iframe-scaled[data-v-f255b2bb]{width:320px;height:124.0310077519%;transform:scale(.80625);transform-origin:top left}.cropped-text[data-v-eb3d05d7]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-preview-wrapper__phone[data-v-3f472f96]{width:282px}.mobile-preview-wrapper__phone img[data-v-3f472f96]{object-fit:cover;border-radius:44px}.mobile-preview-wrapper__content[data-v-3f472f96]{width:258px;height:450px;left:12px}[data-v-6bcaca8a] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-f16f20f8] .vueperslides__bullets{pointer-events:none!important}[data-v-f16f20f8] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-bb3cca55] .vueperslides__bullets{pointer-events:none!important}[data-v-bb3cca55] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-b09e80c4] .vueperslides__bullets{pointer-events:none!important}[data-v-b09e80c4] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-9bdef600] .vueperslides__parallax-wrapper{padding-bottom:110px!important}.assign-strategy-drawer-content .assign-strategy-select[data-v-43e684f6]{width:100%;max-width:none}.assign-strategy-drawer-content .assign-strategy-select[data-v-43e684f6] .in-dropdown-box__container{width:413px}.assign-strategy-drawer .spaced-dot-sep{background-image:linear-gradient(90deg,#91949f 20%,#fff0 0);background-position:center bottom;background-repeat:repeat-x;background-size:5px 1px}.assign-strategy-drawer .spaced-dot-sep--top{background-position:center top}.assign-strategy-drawer .spaced-dot-sep--fc-n:first-child{background:none}

package/dist/src/components/organisms/extensions/recommendation/StrategyInfoBoxContent.vue.d.ts

@@ -0,0 +1,17 @@
+type __VLS_Props = {
+    details: {
+        title: string;
+        value: string;
+    }[];
+};
+declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<__VLS_Props>, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<__VLS_Props>>>, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/dist/src/components/wrappers/WpModal.vue.d.ts

@@ -35,9 +35,9 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_WithDefaults<
     size: "X-small" | "small" | "medium" | "large";
     description: string;
     closeOnOutsideClick: boolean;
-    footerStatus: boolean;
     footerButtonOptions: FooterButtonGroup;
     closeButtonStatus: boolean;
+    footerStatus: boolean;
 }>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/src/utils/strategyInfoBox.d.ts

@@ -1,13 +1,23 @@
 import type { RrsStrategy } from '@@/Types/recommendation';
 import { useTranslations } from '@@/Composables/useTranslations';
-export declare const STRATEGY_INFO_BOX_CLASS = "assign-strategy-info-box";
+interface StrategyInfoBoxDetail {
+    title: string;
+    value: string;
+}
+interface StrategyInfoBoxContent {
+    details: StrategyInfoBoxDetail[];
+}
 /**
  * Props for the design system info box that previews a strategy on hover.
  *
  * The box is InSelect's own per-option feature: the dropdown v-binds this whole
- * object onto `<in-info-box>`, so `titleText`/`descriptionText` are all it takes
- * — no slot component. Both go through the design system's sanitizer, and every
- * partner-supplied value is escaped here before it reaches that markup.
+ * object onto `<in-info-box>` and, when `slot` is set, renders that component
+ * inside it with `slotProps`. `slot` is added by the caller — a util must not
+ * import a component.
+ *
+ * `titleText` still reaches the design system's sanitizer as markup, so the
+ * partner-supplied name is escaped here; the rows go through the component's
+ * text interpolation and need no escaping.
  *
  * `trans` is injectable because callers map this over a whole listing, and
  * `useTranslations()` rebuilds its dictionary and memo cache on every call.
@@ -18,5 +28,8 @@ export declare const buildStrategyInfoBoxProps: (strategy: RrsStrategy, trans?:
     variant: string;
     className: string;
     titleText: string;
+    descriptionStatus: boolean;
     descriptionText: string;
+    slotProps: StrategyInfoBoxContent;
 };
+export {};

package/dist/utils/strategyInfoBox.js

@@ -1,37 +1,68 @@
-import { useTranslations as m } from "../composables/useTranslations.js";
-import { formatShortDate as u } from "./dateUtil.js";
-import { escapeHtml as c } from "./htmlEscape.js";
-const n = "assign-strategy-info-box", a = (e) => typeof e == "string" ? e : typeof e == "number" ? String(e) : "", p = (e, t) => {
-  const r = a(e.algorithm) === "MIXED" ? t("discovery-strategy.mixed-algorithm") : t("discovery-strategy.single-algorithm"), i = a(e.algorithm_used).split(",").map((o) => o.trim()).filter(Boolean).map((o) => t(`recommendation-algorithm-names.${o.replaceAll("_", "-").toLowerCase()}`));
-  return i.length ? `${r} · ${i.join(", ")}` : r;
-}, g = (e, t) => [
+import { useTranslations as a } from "../composables/useTranslations.js";
+import { formatShortDate as c } from "./dateUtil.js";
+import { escapeHtml as l } from "./htmlEscape.js";
+const d = "assign-strategy-info-box", o = (e) => typeof e == "string" ? e : typeof e == "number" ? String(e) : "", u = (e, t) => {
+  const r = o(e.algorithm) === "MIXED" ? t("discovery-strategy.mixed-algorithm") : t("discovery-strategy.single-algorithm"), n = o(e.algorithm_used).split(",").map((i) => i.trim()).filter(Boolean).map((i) => t(`recommendation-algorithm-names.${i.replaceAll("_", "-").toLowerCase()}`));
+  return n.length ? `${r} · ${n.join(", ")}` : r;
+}, m = (e, t) => [
   [e.exclude_view, "discovery-strategy.exclude-recently-view-items"],
   [e.exclude_purchase, "discovery-strategy.exclude-recently-purchased-items"],
   [e.exclude_cart, "discovery-strategy.exclude-recently-added-cart-items"]
-].filter(([r]) => Number(r) === 1).map(([, r]) => t(r)).join(", "), h = (e) => a(
-  e.manual_merchandising || e.manual_merchandising_products
-).trim(), _ = (e) => {
+].filter(([r]) => Number(r) === 1).map(([, r]) => t(r)).join(", "), s = (e) => {
+  const t = o(e).trim();
+  if (!t)
+    return "";
+  let r;
+  try {
+    r = JSON.parse(t);
+  } catch {
+    return t;
+  }
+  if (Array.isArray(r))
+    return r.length ? String(r.length) : "";
+  if (r && typeof r == "object") {
+    const n = Object.keys(r).length;
+    return n ? String(n) : "";
+  }
+  return t;
+}, p = (e) => s(e.manual_merchandising) || s(e.manual_merchandising_products), g = (e) => {
+  if (Array.isArray(e))
+    return e.length;
+  const { conditionList: t } = e ?? {};
+  return Array.isArray(t) ? t.length : 1;
+}, h = (e) => {
   const t = e.filters;
   if (!t)
     return 0;
   try {
     const r = typeof t == "string" ? JSON.parse(t) : t;
-    return Array.isArray(r) ? r.reduce((i, o) => i + (Array.isArray(o) ? o.length : 1), 0) : 0;
+    return !r || typeof r != "object" ? 0 : Object.values(r).reduce((n, i) => n + g(i), 0);
   } catch {
     return 0;
   }
-}, s = (e, t) => `<div class="${n}__row"><span class="${n}__label">${c(e)}</span><span class="${n}__value">${c(t)}</span></div>`, v = (e, t = m()) => {
-  const r = t("recommendation-strategy.none"), i = a(e.updated_at || e.created_at), o = _(e), d = i ? c(t("recommendation-strategy.last-updated-on", { value: u(i) })) : "", l = d ? `<div class="${n}__updated">${d}</div>` : "";
+}, f = (e, t) => {
+  const r = o(e.updated_at || e.created_at);
+  return r ? t("recommendation-strategy.last-updated-on", { value: c(r) }) : "";
+}, y = (e, t = a()) => {
+  const r = t("recommendation-strategy.none"), n = h(e);
   return {
-    id: `strategy-info-${e.strategy_id}`,
-    theme: "light",
-    variant: "information",
-    className: n,
-    titleText: c(a(e.name)),
-    descriptionText: l + s(t("gpt-app-builder.algorithms-and-method"), p(e, t)) + s(t("gpt-app-builder.exclusions"), g(e, t) || r) + s(t("discovery-strategy.filters"), o ? String(o) : r) + s(t("action-builder.manual-merchandising"), h(e) || r)
+    details: [
+      { title: t("gpt-app-builder.algorithms-and-method"), value: u(e, t) },
+      { title: t("gpt-app-builder.exclusions"), value: m(e, t) || r },
+      { title: t("discovery-strategy.filters"), value: n ? String(n) : r },
+      { title: t("action-builder.manual-merchandising"), value: p(e) || r }
+    ]
   };
-};
+}, b = (e, t = a()) => ({
+  id: `strategy-info-${e.strategy_id}`,
+  theme: "light",
+  variant: "information",
+  className: d,
+  titleText: l(o(e.name)),
+  descriptionStatus: !0,
+  descriptionText: f(e, t),
+  slotProps: y(e, t)
+});
 export {
-  n as STRATEGY_INFO_BOX_CLASS,
-  v as buildStrategyInfoBoxProps
+  b as buildStrategyInfoBoxProps
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.17.0-beta.6255bfc",
+  "version": "3.17.0-beta.bdc7d25",
   "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",
@@ -48,7 +48,7 @@
   "license": "ISC",
   "dependencies": {
     "@stripoinc/ui-editor-extensions": "3.9.0",
-    "@useinsider/design-system-organisms": "0.0.3-beta.fc2c160",
+    "@useinsider/design-system-organisms": "0.0.3-beta.791d412",
     "@useinsider/design-system-vue": "1.5.0",
     "@vueuse/core": "11.3.0",
     "lodash-es": "4.17.21",