@useinsider/guido 2.1.0-beta.7ffef92 → 2.1.0-beta.84a7014

package/README.md

@@ -1,6 +1,8 @@
 <p align="center">
   <a href="https://www.youtube.com/shorts/Y0RwBeMezL4" target="_blank" rel="noopener noreferrer">
-    <img width="180" src="./public/guido.png" alt="Guido logo">
+    <img width="180" 
+      src="https://web-image.useinsider.com/guido/defaultImageLibrary/iUH0liTK0d2YDsVB5LDN1770169173.jpg"  
+      alt="Guido logo">
   </a>
 </p>
 
@@ -172,11 +174,48 @@ const config: GuidoConfigInput = {
 | `dynamic-content:open` | `DynamicContent \| null` | User wants to insert dynamic content |
 | `back` | - | Back button clicked |
 | `save:start` | - | Save process started |
-| `save:complete` | `Template` | Save completed successfully |
+| `save:complete` | `SavedTemplateDetails` | Save completed successfully (includes `metadata`) |
 | `on-change` | - | Template was modified |
 | `test-email:click` | - | Test email button clicked |
 | `onboarding-finished` | - | Onboarding popup dismissed |
 
+### `save:complete` Payload
+
+The `save:complete` event emits a `SavedTemplateDetails` object containing the compiled template data along with editor `metadata`:
+
+```typescript
+interface SavedTemplateDetails {
+  dynamicContentList: DynamicContent[];
+  compiledHtml: string;
+  rawHtml: string;
+  css: string;
+  ampHtml: string;
+  ampErrors: string[];
+  modules: number[];
+  recommendation: {
+    campaignUrls: Record<string, string>;
+    configs: Record<string, string>;
+  };
+  unsubscribe: {
+    status: boolean;
+    config: number[];
+  };
+  metadata: Metadata;
+}
+
+interface Metadata {
+  emailId: string;
+  partnerName?: string;
+  productType?: number;
+  userId: string;
+  username?: string;
+  savedModulesFolderName?: string;
+  defaultModulesFolderName?: string;
+}
+```
+
+> ⚠️ **Important:** The `metadata` object in the `save:complete` payload must be passed directly into your `templateConfig` / `stripoConfig` object while saving. This ensures the email-service receives the correct version of sync modules features
+
 ---
 
 ## Exposed Methods

package/dist/@types/config/schemas.js

@@ -1,5 +1,5 @@
 import { ModuleFolderDefaults as b } from "../../enums/defaults.js";
-import { object as o, number as p, optional as e, string as t, pipe as u, picklist as n, minLength as d, custom as S, boolean as a, array as c, literal as r, variant as k } from "../../node_modules/valibot/dist/index.js";
+import { object as o, number as p, optional as e, string as t, pipe as u, picklist as n, custom as S, boolean as a, array as c, minLength as d, literal as r, variant as k } from "../../node_modules/valibot/dist/index.js";
 const m = {
   /** Promotional/marketing emails */
   PROMOTIONAL: 1,

package/dist/components/Guido.vue.js

@@ -12,7 +12,7 @@ var t = function() {
   n,
   !1,
   null,
-  "16abb398"
+  "a26d7792"
 );
 const v = s.exports;
 export {

package/dist/components/Guido.vue2.js

@@ -1,65 +1,64 @@
-import { defineComponent as z, defineAsyncComponent as M, ref as K, computed as _, watch as V, onMounted as j, onUnmounted as q } from "vue";
-import { provideGuidoActions as J } from "../composables/useGuidoActions.js";
-import { usePartner as Q } from "../composables/usePartner.js";
-import { useStripo as X } from "../composables/useStripo.js";
-import { useTimerClone as Y } from "../composables/useTimerClone.js";
-import { migrate as P } from "../config/migrator/index.js";
-import { ModuleFolderDefaults as A } from "../enums/defaults.js";
-import Z from "./organisms/base/Toaster.vue.js";
-import $ from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
-import ee from "./organisms/header/HeaderWrapper.vue.js";
-import oe from "./organisms/LoadingWrapper.vue.js";
-import te from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
-import ne from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
+import { defineComponent as K, defineAsyncComponent as _, ref as V, computed as P, watch as j, onMounted as q, onUnmounted as J } from "vue";
+import { provideGuidoActions as Q } from "../composables/useGuidoActions.js";
+import { usePartner as X } from "../composables/usePartner.js";
+import { useStripo as Y } from "../composables/useStripo.js";
+import { useTimerClone as Z } from "../composables/useTimerClone.js";
+import { migrate as A } from "../config/migrator/index.js";
+import { ModuleFolderDefaults as N } from "../enums/defaults.js";
+import $ from "./organisms/base/Toaster.vue.js";
+import ee from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
+import oe from "./organisms/header/HeaderWrapper.vue.js";
+import te from "./organisms/LoadingWrapper.vue.js";
+import ne from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
+import se from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
 import { useStripoApi as re } from "../services/stripoApi.js";
-import { useConfigStore as se } from "../stores/config.js";
-import { useDynamicContentStore as ce } from "../stores/dynamic-content.js";
-import { useEditorStore as ae } from "../stores/editor.js";
-import { usePreviewStore as ie } from "../stores/preview.js";
+import { useConfigStore as ce } from "../stores/config.js";
+import { useDynamicContentStore as ae } from "../stores/dynamic-content.js";
+import { useEditorStore as ie } from "../stores/editor.js";
+import { usePreviewStore as me } from "../stores/preview.js";
 import { useUnsubscribeStore as de } from "../stores/unsubscribe.js";
-const Le = /* @__PURE__ */ z({
+const Me = /* @__PURE__ */ K({
   __name: "Guido",
   props: {
     config: null
   },
   emits: ["dynamic-content:open", "back", "save:start", "save:complete", "on-change", "ready", "onboarding:finished", "test-email:click"],
-  setup(N, { expose: W, emit: t }) {
-    const u = N, I = M(
+  setup(W, { expose: I, emit: t }) {
+    const v = W, O = _(
       () => import("./organisms/email-preview/PreviewContainer.vue.js")
-    ), O = M(
+    ), G = _(
       () => import("./organisms/onboarding/OnboardingWrapper.vue.js")
-    ), p = K(), a = ce(), v = de(), r = se();
-    r.init(u.config);
-    const i = ae(), G = ie(), s = _(() => i.hasChanges), { isTestPartner: H } = Q(), y = () => {
+    ), h = V(), i = ae(), y = de(), s = ce();
+    s.init(v.config);
+    const m = ie(), H = me(), c = P(() => m.hasChanges), { isTestPartner: x } = X(), f = () => {
       var e;
-      return (e = p.value) == null ? void 0 : e.handleSave(!0);
+      return (e = h.value) == null ? void 0 : e.handleSave(!0);
     }, {
       templateId: d,
-      userId: h,
-      partnerName: f,
-      productType: b,
-      username: S,
+      userId: b,
+      partnerName: S,
+      username: g,
       template: o,
       editor: n
-    } = r, c = (o == null ? void 0 : o.html) || "", g = (o == null ? void 0 : o.css) || "", m = (o == null ? void 0 : o.preselectedDynamicContent) || [], w = (n == null ? void 0 : n.savedModulesFolderName) || A.SAVED_MODULES, D = (n == null ? void 0 : n.defaultModulesFolderName) || A.DEFAULT_MODULES;
-    i.templateId = d;
-    const { initPlugin: E } = X({
+    } = s, a = (o == null ? void 0 : o.html) || "", D = (o == null ? void 0 : o.css) || "", l = (o == null ? void 0 : o.preselectedDynamicContent) || [], w = (n == null ? void 0 : n.savedModulesFolderName) || N.SAVED_MODULES, E = (n == null ? void 0 : n.defaultModulesFolderName) || N.DEFAULT_MODULES;
+    m.templateId = d;
+    const u = {
       emailId: d,
-      userId: h,
-      username: S,
-      partnerName: f,
-      productType: b,
-      preselectedDynamicContentList: m,
+      userId: b,
+      username: g,
+      partnerName: S,
       savedModulesFolderName: w,
-      defaultModulesFolderName: D,
+      defaultModulesFolderName: E
+    }, C = {
+      preselectedDynamicContentList: l,
       onReady: () => {
         console.debug("guido:ready"), t("ready");
       }
-    }), { getDefaultTemplate: C } = re(), { cloneTimersOnSave: T, hasTimerBlocks: k } = Y(), x = _(() => {
+    }, { initPlugin: T } = Y(u, C), { getDefaultTemplate: k } = re(), { cloneTimersOnSave: F, hasTimerBlocks: U } = Z(), B = P(() => {
       var e;
-      return !((e = r.ui) != null && e.showHeader);
+      return !((e = s.ui) != null && e.showHeader);
     });
-    J({
+    Q({
       onBack: () => {
         console.debug("guido:back"), t("back");
       },
@@ -67,55 +66,56 @@ const Le = /* @__PURE__ */ z({
         console.debug("guido:save:start"), t("save:start");
       },
       onSaveComplete: (e) => {
-        console.debug("guido:save:complete", e), t("save:complete", e);
+        const r = { ...e, metadata: u };
+        console.debug("guido:save:complete", r), t("save:complete", r);
       },
       onTestEmailClick: () => {
         console.debug("guido:test-email:click"), t("test-email:click");
       }
     });
-    const F = (e) => {
-      console.debug("dynamic-content:close", e), a.setSelectedDynamicContent(e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
-    }, U = () => {
+    const L = (e) => {
+      console.debug("dynamic-content:close", e), i.setSelectedDynamicContent(e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
+    }, M = () => {
       console.debug("dynamic-content:close", "Without Data"), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: { text: "", value: "" } }));
     };
-    V(() => s.value, () => {
-      t("on-change", s.value);
+    j(() => c.value, () => {
+      t("on-change", c.value);
     });
-    const l = (e) => {
-      const L = e, { attribute: B, position: R } = L.detail;
-      console.debug("dynamic-content:open", L.detail), t("dynamic-content:open", B, R);
+    const p = (e) => {
+      const r = e, { attribute: R, position: z } = r.detail;
+      console.debug("dynamic-content:open", r.detail), t("dynamic-content:open", R, z);
     };
-    return j(async () => {
+    return q(async () => {
       console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow");
       try {
-        v.selectedUnsubscribePages = (o == null ? void 0 : o.selectedUnsubscribePages) || [];
+        y.selectedUnsubscribePages = (o == null ? void 0 : o.selectedUnsubscribePages) || [];
         let e = {
-          html: c && await P(c),
-          css: g
+          html: a && await A(a),
+          css: D
         };
-        e.html || (e = await C(), e.html = await P(e.html)), k(e.html) && (e.html = await T(e.html)), await E(e), a.selectedDynamicContentList = m;
+        e.html || (e = await k(), e.html = await A(e.html)), U(e.html) && (e.html = await F(e.html)), await T(e), i.selectedDynamicContentList = l;
       } catch (e) {
         console.error("Failed to initialize Stripo editor:", e);
       }
-      document.addEventListener("dynamic-content:open", l);
-    }), q(() => {
-      document.removeEventListener("dynamic-content:open", l);
+      document.addEventListener("dynamic-content:open", p);
+    }), J(() => {
+      document.removeEventListener("dynamic-content:open", p);
       try {
         window.UIEditor.removeEditor();
       } catch {
         console.debug("Failed to remove Stripo editor: No editor found");
       }
-      r.reset();
-    }), W({
+      s.reset();
+    }), I({
       dynamicContent: {
-        insert: F,
-        close: U
+        insert: L,
+        close: M
       },
-      hasChanges: s,
-      saveSilent: y
-    }), { __sfc: !0, PreviewContainer: I, OnboardingWrapper: O, headerWrapperRef: p, dynamicContentStore: a, unsubscribeStore: v, props: u, configStore: r, editorStore: i, previewStore: G, hasChanges: s, isTestPartner: H, saveSilent: y, templateId: d, userId: h, partnerName: f, productType: b, username: S, templateConfig: o, editorConfig: n, html: c, css: g, preselectedDynamicContentList: m, savedModulesFolderName: w, defaultModulesFolderName: D, emit: t, initPlugin: E, getDefaultTemplate: C, cloneTimersOnSave: T, hasTimerBlocks: k, noHeader: x, insertDynamicContent: F, closeDynamicContent: U, handleDynamicContentOpen: l, Toaster: Z, FilterSelectionDrawer: $, HeaderWrapper: ee, LoadingWrapper: oe, SaveAsTemplateDrawer: te, UnsubscribeWrapper: ne };
+      hasChanges: c,
+      saveSilent: f
+    }), { __sfc: !0, PreviewContainer: O, OnboardingWrapper: G, headerWrapperRef: h, dynamicContentStore: i, unsubscribeStore: y, props: v, configStore: s, editorStore: m, previewStore: H, hasChanges: c, isTestPartner: x, saveSilent: f, templateId: d, userId: b, partnerName: S, username: g, templateConfig: o, editorConfig: n, html: a, css: D, preselectedDynamicContentList: l, savedModulesFolderName: w, defaultModulesFolderName: E, emit: t, metadata: u, options: C, initPlugin: T, getDefaultTemplate: k, cloneTimersOnSave: F, hasTimerBlocks: U, noHeader: B, insertDynamicContent: L, closeDynamicContent: M, handleDynamicContentOpen: p, Toaster: $, FilterSelectionDrawer: ee, HeaderWrapper: oe, LoadingWrapper: te, SaveAsTemplateDrawer: ne, UnsubscribeWrapper: se };
   }
 });
 export {
-  Le as default
+  Me as default
 };

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

@@ -1,26 +1,28 @@
 import r from "./FilterItem.vue2.js";
 /* empty css                */
-import l from "../../../../_virtual/_plugin-vue2_normalizer.js";
-var i = function() {
+import i from "../../../../_virtual/_plugin-vue2_normalizer.js";
+var l = function() {
   var a = this, e = a._self._c, t = a._self._setupProxy;
-  return e("div", { staticClass: "d-f f-d-c w-1 gap-16", attrs: { "data-filter-group": a.filter.filterGroup, "data-filter-number": a.filter.filterNumber } }, [e("div", { staticClass: "d-f a-i-c j-c-s-b pt-4", class: { "bor-t-s-s bor-t-w-1 bor-t-c-50": a.index === 0 } }, [e("p", [a._v(" " + a._s(t.trans("newsletter.filter")) + " " + a._s(a.index + 1) + " ")]), e(t.InButtonV2, { attrs: { id: "guido__delete-filter-group-button", "left-icon": "line-delete", styling: "text", type: "danger", "label-text-status": !1 }, on: { click: function(s) {
+  return e("div", { staticClass: "d-f f-d-c w-1 gap-16" }, [e("div", { staticClass: "d-f a-i-c j-c-s-b pt-4", class: { "bor-t-s-s bor-t-w-1 bor-t-c-50": a.index === 0 } }, [e("p", [a._v(" " + a._s(t.trans("newsletter.filter")) + " " + a._s(a.index + 1) + " ")]), e(t.InButtonV2, { attrs: { id: "guido__delete-filter-group-button", "left-icon": "line-delete", styling: "text", type: "danger", "label-text-status": !1 }, on: { click: function(s) {
     return t.emit("delete-filter", t.props.filter);
-  } } })], 1), e("div", { staticClass: "w-1 d-f a-i-s j-c-s-b gap-16" }, [e(t.InSelect, { staticClass: "w-2", attrs: { "disabled-status": "", "search-status": "", "button-status": !1, "label-text": t.trans("action-builder.filter-type"), options: t.filterTypeOptions, value: [t.filterTypeOptions[0]] } }), e(t.InSelect, { staticClass: "w-2", attrs: { id: "filter-item-input--attribute-type", "search-status": "", "static-position": "bottom right", "button-status": !1, "label-text": t.trans("condition.attribute"), options: t.store.getFilterList, state: t.getFieldState("attribute"), value: [t.selectedAttributeType] }, on: { select: t.handleAttributeChange } })], 1), e("div", { staticClass: "w-1 d-f a-i-s j-c-s-b gap-16" }, [t.isBooleanAttribute ? e(t.InSelect, { staticClass: "w-2", attrs: { "button-status": !1, "label-text": t.trans("condition.operator"), options: t.booleanValueOptions, state: t.getFieldState("value"), value: [t.selectedBooleanValue] }, on: { select: t.handleBooleanValueChange } }) : [e(t.InSelect, { staticClass: "w-2", attrs: { "button-status": !1, "label-text": t.trans("condition.operator"), options: t.getOperatorOptions(t.selectedAttributeType.type), state: t.getFieldState("operator"), value: [t.selectedOperatorType] }, on: { select: function(s) {
+  } } })], 1), e("div", { staticClass: "w-1 d-f a-i-s j-c-s-b gap-16" }, [e(t.InSelect, { staticClass: "w-2", attrs: { "disabled-status": "", "search-status": "", "button-status": !1, "label-text": t.trans("action-builder.filter-type"), options: t.filterTypeOptions, value: [t.filterTypeOptions[0]] } }), e(t.InSelect, { staticClass: "w-2", attrs: { id: "filter-item-input--attribute-type", "search-status": "", "static-position": "bottom right", "button-status": !1, "label-text": t.trans("condition.attribute"), options: t.store.getFilterList, value: [t.selectedAttributeType] }, on: { select: function(s) {
+    return t.updateFilter({ text: "attribute", value: s.value });
+  } } })], 1), e("div", { staticClass: "w-1 d-f a-i-s j-c-s-b gap-16" }, [e(t.InSelect, { staticClass: "w-2", attrs: { "button-status": !1, "label-text": t.trans("condition.operator"), options: t.getOperatorOptions(t.selectedAttributeType.type), value: [t.selectedOperatorType] }, on: { select: function(s) {
     return t.updateFilter({ text: "operator", value: s.value });
-  } } }), e(t.InBasicTextInput, { staticClass: "w-2", attrs: { id: "filter-item-input--value", name: "imageUrl", "character-counter-status": !1, "label-text": t.trans("condition.value"), "max-character-length": 25, "placeholder-text": t.trans("condition.enter-value-placeholder"), "state-message": t.valueErrorMessage, states: t.getFieldState("value"), "tooltip-status": !1, type: t.valueInputType, value: decodeURIComponent(t.props.filter.value) }, on: { input: function(s) {
+  } } }), e(t.InBasicTextInput, { staticClass: "w-2", attrs: { id: "filter-item-input--value", name: "imageUrl", type: "text", "character-counter-status": !1, "label-text": t.trans("condition.value"), "max-character-length": 25, "placeholder-text": t.trans("condition.enter-value-placeholder"), "tooltip-status": !1, value: decodeURIComponent(t.props.filter.value) }, on: { input: function(s) {
     t.updateFilter({ text: "value", value: encodeURIComponent(s) });
-  } } })]], 2), t.props.hasLogicAdapter ? e("div", { staticClass: "w-1 d-f a-i-c j-c-c p-r bor-b-s-s bor-b-w-1 bor-b-c-50 mt-4" }, [e(t.LogicAdapter, { staticClass: "p-a", attrs: { logic: t.props.filter.innerGroupOperator }, on: { change: function(s) {
+  } } })], 1), t.props.hasLogicAdapter ? e("div", { staticClass: "w-1 d-f a-i-c j-c-c p-r bor-b-s-s bor-b-w-1 bor-b-c-50 mt-4" }, [e(t.LogicAdapter, { staticClass: "p-a", attrs: { logic: t.props.filter.innerGroupOperator }, on: { change: function(s) {
     return t.updateFilter({ text: "innerGroupOperator", value: s });
   } } })], 1) : a._e()]);
-}, o = [], n = /* @__PURE__ */ l(
+}, n = [], o = /* @__PURE__ */ i(
   r,
-  i,
-  o,
+  l,
+  n,
   !1,
   null,
-  "b88d274d"
+  "6562e38c"
 );
-const f = n.exports;
+const f = o.exports;
 export {
   f as default
 };

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

@@ -1,69 +1,38 @@
-import { defineComponent as V, computed as o } from "vue";
-import { useTranslations as _ } from "../../../../composables/useTranslations.js";
-import { getOperatorOptions as s } from "../../../../enums/extensions/recommendationBlock.js";
-import { useRecommendationExtensionStore as C } from "../../../../extensions/Blocks/Recommendation/store/recommendation.js";
-import { getInvalidFilterFields as A } from "../../../../extensions/Blocks/Recommendation/validation/filterSchema.js";
-import { InButtonV2 as L, InSelect as O, InBasicTextInput as S } from "@useinsider/design-system-vue";
-import E from "./LogicAdapter.vue.js";
-import { useDebounceFn as N } from "../../../../node_modules/@vueuse/shared/index.js";
-const K = /* @__PURE__ */ V({
+import { defineComponent as f, computed as i } from "vue";
+import { useTranslations as v } from "../../../../composables/useTranslations.js";
+import { getOperatorOptions as a } from "../../../../enums/extensions/recommendationBlock.js";
+import { useRecommendationExtensionStore as x } from "../../../../extensions/Blocks/Recommendation/store/recommendation.js";
+import { InButtonV2 as y, InSelect as F, InBasicTextInput as T } from "@useinsider/design-system-vue";
+import _ from "./LogicAdapter.vue.js";
+import { useDebounceFn as b } from "../../../../node_modules/@vueuse/shared/index.js";
+const h = /* @__PURE__ */ f({
   __name: "FilterItem",
   props: {
     filter: null,
     index: null,
-    hasLogicAdapter: { type: Boolean },
-    submitted: { type: Boolean }
+    hasLogicAdapter: { type: Boolean }
   },
   emits: ["delete-filter"],
-  setup(f, { emit: v }) {
-    const t = f, p = _(), l = C(), F = [
+  setup(p, { emit: u }) {
+    const e = p, n = v(), r = x(), m = [
       {
-        text: p("email-editor.standard-filter"),
+        text: n("email-editor.standard-filter"),
         value: "standardFilter"
       }
-    ], n = [
-      { text: "True", value: "true" },
-      { text: "False", value: "false" }
-    ], c = o(() => t.filter.attribute || ""), r = o(() => l.getFilterList.find((e) => e.value === c.value) || { text: "", value: "", type: "" }), y = o(
-      () => {
-        var e;
-        return ((e = r.value) == null ? void 0 : e.type) === "Boolean";
-      }
-    ), g = o(() => {
-      var e;
-      return s((e = r.value) == null ? void 0 : e.type).find((a) => a.value === t.filter.operator);
-    }), b = o(
-      () => n.find((e) => e.value === t.filter.value) || n[0]
-    ), i = o(() => t.submitted ? A(t.filter) : /* @__PURE__ */ new Set()), h = (e) => i.value.has(e) ? "error" : "default", B = o(
-      () => i.value.has("value") ? "Enter Value to continue." : ""
-    ), d = o(
-      () => {
-        var e;
-        return ((e = r.value) == null ? void 0 : e.type) === "Number";
-      }
-    ), x = o(() => d.value ? "number" : "text"), T = N((e) => {
-      l.updateFilter({
-        ...t.filter,
-        [e.text]: e.value
-      });
+    ], s = i(() => e.filter.attribute || ""), l = i(() => r.getFilterList.find((t) => t.value === s.value) || { text: "", value: "", type: "" }), c = i(() => {
+      var t;
+      return a((t = l.value) == null ? void 0 : t.type).find((o) => o.value === e.filter.operator);
+    }), d = b((t) => {
+      console.debug("updateFilter: ", t);
+      const o = {
+        ...e.filter,
+        [t.text]: t.value
+      };
+      r.updateFilter(o);
     }, 500);
-    return { __sfc: !0, trans: p, store: l, props: t, filterTypeOptions: F, booleanValueOptions: n, attributeType: c, selectedAttributeType: r, isBooleanAttribute: y, selectedOperatorType: g, selectedBooleanValue: b, emit: v, invalidFields: i, getFieldState: h, valueErrorMessage: B, isNumericAttribute: d, valueInputType: x, updateFilter: T, handleAttributeChange: (e) => {
-      const a = l.getFilterList.find((I) => I.value === e.value), m = (a == null ? void 0 : a.type) === "Boolean", [u] = s(a == null ? void 0 : a.type);
-      l.updateFilter({
-        ...t.filter,
-        attribute: e.value,
-        operator: m ? "=" : (u == null ? void 0 : u.value) ?? "",
-        value: m ? "true" : ""
-      });
-    }, handleBooleanValueChange: (e) => {
-      l.updateFilter({
-        ...t.filter,
-        operator: "=",
-        value: e.value
-      });
-    }, getOperatorOptions: s, InBasicTextInput: S, InSelect: O, InButtonV2: L, LogicAdapter: E };
+    return { __sfc: !0, trans: n, store: r, props: e, filterTypeOptions: m, attributeType: s, selectedAttributeType: l, selectedOperatorType: c, emit: u, updateFilter: d, getOperatorOptions: a, InBasicTextInput: T, InSelect: F, InButtonV2: y, LogicAdapter: _ };
   }
 });
 export {
-  K as default
+  h as default
 };

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

@@ -1,11 +1,11 @@
 import o from "./FilterSelectionDrawer.vue2.js";
 import n from "../../../../_virtual/_plugin-vue2_normalizer.js";
-var i = function() {
+var l = function() {
   var e = this, r = e._self._c, t = e._self._setupProxy;
-  return r(t.WpDrawer, { attrs: { id: "recommendation-filter-drawer", "description-status": "", "description-text": t.trans("email-editor.filter-description"), "footer-button-group-options": t.footerButtonGroupOptions, status: t.store.filterSelectionDrawerStatus, "title-text": t.trans("email-editor.add-filters") }, on: { cancelOrBackButtonEvent: t.cancelModal, onCloseEvent: t.cancelModal, primaryButtonEvent: t.applyFilter } }, [t.store.filterSelectionDrawerStatus ? r(t.Filters, { ref: "filtersRef", attrs: { submitted: t.submitted } }) : e._e()], 1);
+  return r(t.WpDrawer, { attrs: { id: "recommendation-filter-drawer", "title-text": "Filter Selection", "footer-button-group-options": t.footerButtonGroupOptions, status: t.store.filterSelectionDrawerStatus }, on: { cancelOrBackButtonEvent: t.closeModal, onCloseEvent: t.closeModal, primaryButtonEvent: t.applyFilter } }, [r(t.Filters)], 1);
 }, s = [], a = /* @__PURE__ */ n(
   o,
-  i,
+  l,
   s,
   !1,
   null,

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

@@ -1,51 +1,38 @@
-import { defineComponent as d, ref as a, watch as y, computed as g, nextTick as v } from "vue";
-import b from "../../../wrappers/WpDrawer.vue.js";
-import { useTranslations as w } from "../../../../composables/useTranslations.js";
-import { useRecommendationExtensionStore as F } from "../../../../extensions/Blocks/Recommendation/store/recommendation.js";
-import { isFilterValid as _ } from "../../../../extensions/Blocks/Recommendation/validation/filterSchema.js";
-import h from "./Filters.vue.js";
-const I = /* @__PURE__ */ d({
+import { defineComponent as n, ref as a, computed as l } from "vue";
+import i from "../../../wrappers/WpDrawer.vue.js";
+import { useTranslations as c } from "../../../../composables/useTranslations.js";
+import { useRecommendationExtensionStore as p } from "../../../../extensions/Blocks/Recommendation/store/recommendation.js";
+import u from "./Filters.vue.js";
+const v = /* @__PURE__ */ n({
   __name: "FilterSelectionDrawer",
-  setup(S) {
-    const r = w(), e = F(), t = a(!1), o = a(!1), c = a();
-    y(() => e.filterSelectionDrawerStatus, (n) => {
-      n && (o.value = !1);
-    });
-    const f = g(() => ({
+  setup(f) {
+    const r = c(), t = p(), e = a(!1), s = l(() => ({
       primaryButton: {
         styling: "solid",
         type: "primary",
         labelText: r(
-          t.value ? "unsubscription-preference.selecting-type" : "products.select-and-continue"
+          e.value ? "unsubscription-preference.selecting-type" : "products.select-and-continue"
         ),
-        loadingStatus: t.value
+        loadingStatus: e.value,
+        disabledStatus: !1
       },
       cancelOrBackButton: {
         styling: "ghost",
         type: "secondary",
         labelText: r("products.cancel"),
-        disabledStatus: t.value
+        disabledStatus: e.value
       }
-    }));
-    return { __sfc: !0, trans: r, store: e, isApplying: t, submitted: o, filtersRef: c, footerButtonGroupOptions: f, cancelModal: () => {
-      e.cancelFilterDrawer();
-    }, applyFilter: async () => {
-      var u;
-      o.value = !0;
-      const { filters: n } = e.recommendationConfigs, i = n.find((l) => !_(l));
-      if (i) {
-        (u = c.value) == null || u.switchToGroup(i.filterGroup), await v();
-        const { filterGroup: l, filterNumber: p } = i, m = `[data-filter-group="${l}"][data-filter-number="${p}"]`, s = document.querySelector(m);
-        s == null || s.scrollIntoView({ behavior: "smooth", block: "center" });
-        return;
-      }
-      t.value = !0, e.patchCurrentBlockConfig(
-        { filters: e.recommendationConfigs.filters },
+    })), o = () => {
+      t.closeFilterDrawer();
+    };
+    return { __sfc: !0, trans: r, store: t, isApplying: e, footerButtonGroupOptions: s, closeModal: o, applyFilter: () => {
+      e.value = !0, t.patchCurrentBlockConfig(
+        { filters: t.recommendationConfigs.filters },
         { triggerRefetch: !0 }
-      ), e.closeFilterDrawer(), t.value = !1;
-    }, WpDrawer: b, Filters: h };
+      ), o(), e.value = !1;
+    }, WpDrawer: i, Filters: u };
   }
 });
 export {
-  I as default
+  v as default
 };

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

@@ -1,20 +1,20 @@
-import l from "./Filters.vue2.js";
+import s from "./Filters.vue2.js";
 /* empty css             */
 import a from "../../../../_virtual/_plugin-vue2_normalizer.js";
 var o = function() {
-  var r = this, e = r._self._c, t = r._self._setupProxy;
-  return e("div", { staticClass: "d-f f-d-c gap-16" }, [e("div", { staticClass: "d-f a-i-c j-c-s-b gap-16" }, [e(t.InSegments, { staticClass: "f-g-1 w-1", attrs: { id: "guido__filter-group-segments", "segment-list": t.filterGroupList, selected: t.selectedFilterGroup, "with-icon": !1 }, on: { click: t.switchToGroup } }), e(t.InButtonV2, { staticClass: "w-20-s f-g-1", attrs: { id: "guido__add-filter-group-button", "left-icon": "line-plus-netural", type: "secondary", "disabled-status": t.isMaxFilterGroupCount, "label-text": t.trans("smart-recommender.add-filter-group"), "tooltip-text": t.isMaxFilterGroupCount ? t.trans("email-editor.add-filter-group-tooltip") : "" }, on: { click: t.handleAddFilterGroup } })], 1), e("div", { staticClass: "d-f a-i-c j-c-s-b gap-16" }, [e("div", { staticClass: "d-f a-i-c" }, [t.selectedFilterGroup > 1 ? e(t.LogicAdapter, { staticClass: "mr-2", attrs: { logic: t.outerGroupOperator }, on: { change: t.handleOuterGroupOperatorChange } }) : r._e(), e("p", [r._v(" " + r._s(t.trans("email-editor.filter-group")) + " " + r._s(t.selectedFilterGroup) + " ")])], 1), t.hasRemoveFilterButton ? e(t.InButtonV2, { attrs: { id: "guido__delete-filter-group-button", "left-icon": "line-delete", styling: "text", type: "danger", "label-text-status": !1 }, on: { click: t.handleDeleteFilterGroup } }) : r._e()], 1), e("div", { staticClass: "d-f a-i-c j-c-s-b f-d-c" }, r._l(t.selectedFilterGroupFilters, function(s, i) {
-    return e(t.FilterItem, { key: i, attrs: { filter: s, "has-logic-adapter": t.hasLogicAdapter && i !== t.selectedFilterGroupFilters.length - 1, index: i, submitted: r.submitted }, on: { "delete-filter": t.handleDeleteFilter } });
-  }), 1), e("div", { staticClass: "d-f a-i-c j-c-c mt-3" }, [e(t.InButtonV2, { staticClass: "w-11-s", attrs: { id: "filter-group--add-filter-button", "left-icon": "line-plus-netural", type: "subtle-primary", "disabled-status": t.isMaxFilterPerGroupCount, "label-text": t.trans("smart-recommender.add-filter-condition"), "tooltip-text": t.isMaxFilterPerGroupCount ? t.trans("email-editor.add-filter-tooltip") : "" }, on: { click: t.handleAddFilter } })], 1)]);
+  var i = this, e = i._self._c, t = i._self._setupProxy;
+  return e("div", { staticClass: "d-f f-d-c gap-16" }, [e("div", { staticClass: "d-f a-i-c j-c-s-b gap-16" }, [e(t.InSegments, { staticClass: "f-g-1 w-1", attrs: { id: "guido__filter-group-segments", "segment-list": t.filterGroupList, selected: t.selectedFilterGroup, "with-icon": !1 }, on: { click: t.changeFilterGroup } }), e(t.InButtonV2, { staticClass: "w-20-s f-g-1", attrs: { id: "guido__add-filter-group-button", "left-icon": "line-plus-netural", type: "secondary", "disabled-status": t.isMaxFilterGroupCount, "label-text": t.trans("smart-recommender.add-filter-group"), "tooltip-text": t.isMaxFilterGroupCount ? t.trans("email-editor.add-filter-tooltip") : "" }, on: { click: t.handleAddFilterGroup } })], 1), e("div", { staticClass: "d-f a-i-c j-c-s-b gap-16" }, [e("div", { staticClass: "d-f a-i-c" }, [t.selectedFilterGroup > 1 ? e(t.LogicAdapter, { staticClass: "mr-2" }) : i._e(), e("p", [i._v(" " + i._s(t.trans("email-editor.filter-group")) + " " + i._s(t.selectedFilterGroup) + " ")])], 1), t.hasRemoveFilterButton ? e(t.InButtonV2, { attrs: { id: "guido__delete-filter-group-button", "left-icon": "line-delete", styling: "text", type: "danger", "label-text-status": !1 }, on: { click: t.handleDeleteFilterGroup } }) : i._e()], 1), e("div", { staticClass: "d-f a-i-c j-c-s-b f-d-c" }, i._l(t.selectedFilterGroupFilters, function(l, r) {
+    return e(t.FilterItem, { key: r, attrs: { filter: l, "has-logic-adapter": t.hasLogicAdapter && r !== t.selectedFilterGroupFilters.length - 1, index: r }, on: { "delete-filter": t.handleDeleteFilter } });
+  }), 1), e("div", { staticClass: "d-f a-i-c j-c-c mt-3" }, [e(t.InButtonV2, { staticClass: "w-11-s", attrs: { id: "filter-group--add-filter-button", "left-icon": "line-plus-netural", type: "subtle-primary", "label-text": t.trans("smart-recommender.add-filter-condition") }, on: { click: t.handleAddFilter } })], 1)]);
 }, d = [], n = /* @__PURE__ */ a(
-  l,
+  s,
   o,
   d,
   !1,
   null,
-  "bd89e39d"
+  "1ccb6d4a"
 );
-const m = n.exports;
+const _ = n.exports;
 export {
-  m as default
+  _ as default
 };