@useinsider/guido 2.1.0-beta.a720424 → 2.1.0-beta.e13d291

package/dist/extensions/Blocks/Recommendation/extension.js

@@ -1,19 +1,42 @@
-import { ExtensionBuilder as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { RecommendationBlock as t } from "./block.js";
-import { RecommendationCardCompositionControl as n } from "./cardCompositionControl.js";
-import { RecommendationBlockControl as r } from "./control.js";
-import { ButtonAlignControl as l, ButtonBorderControl as d, ButtonBorderRadiusControl as C, ButtonColorControl as i, ButtonFitToContentControl as a, ButtonFontFamilyControl as e, ButtonMarginsControl as m, ButtonPaddingsControl as s, ButtonTextControl as c, ButtonTextSizeControl as u, ButtonTextStyleAndFontColorControl as P, ImageMarginsControl as g, ImageSizeControl as B, NameAlignControl as O, NameBackgroundControl as f, NameColorControl as b, NameFontFamilyControl as p, NamePaddingsControl as y, NameSizeControl as S, NameStyleControl as F, OldPriceAlignControl as x, OldPriceBackgroundControl as T, OldPriceColorControl as k, OldPriceFontFamilyControl as A, OldPricePaddingsControl as D, OldPriceSizeControl as N, OldPriceStyleControl as R, OmnibusPriceAlignControl as z, OmnibusPriceBackgroundControl as I, OmnibusPriceColorControl as w, OmnibusPriceFontFamilyControl as h, OmnibusPricePaddingsControl as M, OmnibusPriceSizeControl as E, OmnibusPriceStyleControl as j, OmnibusDiscountAlignControl as q, OmnibusDiscountBackgroundControl as v, OmnibusDiscountColorControl as G, OmnibusDiscountFontFamilyControl as H, OmnibusDiscountPaddingsControl as J, OmnibusDiscountSizeControl as K, OmnibusDiscountStyleControl as L, PriceAlignControl as Q, PriceBackgroundControl as U, PriceColorControl as V, PriceFontFamilyControl as W, PricePaddingsControl as X, PriceSizeControl as Y, PriceStyleControl as Z } from "./controls/index.js";
-import { RecommendationIconsRegistry as _ } from "./iconsRegistry.js";
-import $ from "./recommendation.css.js";
-import { SettingsPanel as oo } from "./settingsPanel.js";
-import { CardBackgroundColorControl as to } from "./controls/cardBackgroundColorControl.js";
-import { SpacingControl as no } from "./controls/spacingControl.js";
-import { NameTextTrimControl as ro } from "./controls/nameTextTrimControl.js";
-import { OmnibusPriceTextBeforeControl as lo } from "./controls/omnibusPriceTextBeforeControl.js";
-import { OmnibusPriceTextAfterControl as Co } from "./controls/omnibusPriceTextAfterControl.js";
-import { OmnibusDiscountTextBeforeControl as io } from "./controls/omnibusDiscountTextBeforeControl.js";
-import { OmnibusDiscountTextAfterControl as ao } from "./controls/omnibusDiscountTextAfterControl.js";
-const xo = new o().addBlock(t).withSettingsPanelRegistry(oo).addControl(r).addControl(to).addControl(no).addControl(l).addControl(d).addControl(C).addControl(i).addControl(a).addControl(e).addControl(m).addControl(s).addControl(c).addControl(u).addControl(P).addControl(g).addControl(B).addControl(O).addControl(f).addControl(b).addControl(p).addControl(y).addControl(S).addControl(F).addControl(ro).addControl(x).addControl(T).addControl(k).addControl(A).addControl(D).addControl(N).addControl(R).addControl(z).addControl(I).addControl(w).addControl(h).addControl(M).addControl(E).addControl(j).addControl(lo).addControl(Co).addControl(q).addControl(v).addControl(G).addControl(H).addControl(J).addControl(K).addControl(L).addControl(io).addControl(ao).addControl(Q).addControl(U).addControl(V).addControl(W).addControl(X).addControl(Y).addControl(Z).addControl(n).addStyles($).withIconsRegistry(_).build();
+import { ExtensionBuilder as r } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { RecommendationBlock as m } from "./block.js";
+import { RecommendationBlockControl as n } from "./controls/main/index.js";
+import "./store/recommendation.js";
+import { NameControls as i } from "./controls/name/index.js";
+import { PriceControls as e } from "./controls/price/index.js";
+import { OldPriceControls as l } from "./controls/oldPrice/index.js";
+import { OmnibusPriceControls as s } from "./controls/omnibusPrice/index.js";
+import { OmnibusDiscountControls as a } from "./controls/omnibusDiscount/index.js";
+import { ButtonControls as p } from "./controls/button/index.js";
+import { ImageControls as c } from "./controls/image/index.js";
+import { SpacingControl as C } from "./controls/spacing/index.js";
+import { CardBackgroundColorControl as d } from "./controls/cardBackground/index.js";
+import { LayoutControl as f } from "./controls/layout/index.js";
+import { RecommendationCardCompositionControl as u } from "./controls/cardComposition/index.js";
+import { RecommendationIconsRegistry as g } from "./iconsRegistry.js";
+import R from "./recommendation.css.js";
+import { SettingsPanel as y } from "./settingsPanel.js";
+const B = [
+  i,
+  e,
+  l,
+  s,
+  a,
+  p,
+  c
+], P = [
+  n,
+  d,
+  f,
+  C,
+  u
+], b = [
+  ...P,
+  ...B.flatMap((o) => Object.values(o))
+], F = b.reduce(
+  (o, t) => o.addControl(t),
+  new r().addBlock(m).withSettingsPanelRegistry(y)
+).addStyles(R).withIconsRegistry(g).build();
 export {
-  xo as default
+  F as default
 };

package/dist/extensions/Blocks/Recommendation/iconsRegistry.js

@@ -1,5 +1,5 @@
-import { IconsRegistry as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-class n extends o {
+import { IconsRegistry as r } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+class o extends r {
   registerIconsSvg(C) {
     C["recommendation-icon"] = `
             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
@@ -43,9 +43,25 @@ class n extends o {
                 3.40029 12.0082 3.25285 11.7656 3.15234C11.365 2.98638 11.0001 2.64849 11 2.21484V2Z" 
                 fill="currentColor"/>
             </svg>
+        `, C["grid-orientation"] = `
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
+                <rect x="1" y="1" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
+                <rect x="12" y="1" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
+                <rect x="1" y="12" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
+                <rect x="12" y="12" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
+            </svg>
+        `, C["list-orientation"] = `
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
+                <circle cx="3" cy="4" r="1" stroke="currentColor" stroke-width="1"/>
+                <rect x="7" y="3" width="11" height="2" rx="1"/>
+                <circle cx="3" cy="10" r="1" stroke="currentColor" stroke-width="1"/>
+                <rect x="7" y="9" width="11" height="2" rx="1"/>
+                <circle cx="3" cy="16" r="1" stroke="currentColor" stroke-width="1"/>
+                <rect x="7" y="15" width="11" height="2" rx="1"/>
+            </svg>
         `;
   }
 }
 export {
-  n as RecommendationIconsRegistry
+  o as RecommendationIconsRegistry
 };

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

@@ -1,18 +1,27 @@
 const n = `/* Utils */
 .es-180w { width: 180px; }
 
-/* Recommendation Controls */
-.recommendation-controls-container > .container {
-    padding: 16px;
+/* Recommendation Controls - Main settings panel separators */
+.recommendation-controls-container > div {
+    border-bottom: 1px solid #e0e0e0;
 }
 
-.recommendation-controls-container > .container:first-child {
+.recommendation-controls-container > div:first-child {
     padding-top: 0;
 }
 
+.recommendation-controls-container > div:last-child {
+    border-bottom: none;
+}
+
 .container:has(.recommendation-controls-container) {
     padding: 0
 }
+
+/* Hide drag icon for list layout (ordering disabled) */
+ue-orderable.orderable-disabled .droppable-icon {
+    display: none;
+}
 `;
 export {
   n as default

package/dist/extensions/Blocks/Recommendation/services/configService.js

@@ -0,0 +1,239 @@
+import { ModificationDescription as f } from "../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { CURRENT_CONFIG_VERSION as u, DEFAULT_NODE_CONFIG as e } from "../constants/defaultConfig.js";
+import { setCurrencyAttributes as g } from "../controls/main/utils.js";
+import { hasMinimalConfig as a } from "../types/nodeConfig.js";
+class C {
+  // ========================================================================
+  // Read Operations
+  // ========================================================================
+  /**
+   * Get configuration from a node, with defaults for missing values
+   *
+   * This is the primary way to read configuration from a block.
+   * Always returns a complete config object with defaults merged in.
+   * @example
+   * const config = RecommendationConfigService.getConfig(this.currentNode);
+   * console.log(config.strategy); // 'mostPopular'
+   * @param node - The immutable HTML node to read config from
+   * @returns Complete configuration with defaults for missing values
+   */
+  static getConfig(i) {
+    if (!i)
+      return this.cloneDefaults();
+    if (!("getNodeConfig" in i) || typeof i.getNodeConfig != "function")
+      return this.cloneDefaults();
+    try {
+      const t = i.getNodeConfig();
+      return t ? this.mergeWithDefaults(t) : this.cloneDefaults();
+    } catch {
+      return this.cloneDefaults();
+    }
+  }
+  /**
+   * Check if a node has valid configuration stored
+   *
+   * Used for migration detection - returns false for legacy templates
+   * that need their configuration migrated.
+   * @param node - The immutable HTML node to check
+   * @returns True if node has valid config with version number
+   */
+  static hasConfig(i) {
+    if (!i || !("getNodeConfig" in i) || typeof i.getNodeConfig != "function")
+      return !1;
+    try {
+      const t = i.getNodeConfig();
+      return a(t);
+    } catch {
+      return !1;
+    }
+  }
+  /**
+   * Get the configuration version from a node
+   * @param node - The immutable HTML node to check
+   * @returns Config version number, or 0 if no config exists
+   */
+  static getConfigVersion(i) {
+    return this.hasConfig(i) && this.getConfig(i).configVersion || 0;
+  }
+  // ========================================================================
+  // Write Operations
+  // ========================================================================
+  /**
+   * Update specific configuration values
+   *
+   * Merges the updates with existing config and persists to node.
+   * This is the primary way to update configuration from controls.
+   * @example
+   * RecommendationConfigService.updateConfig(
+   *   this.api,
+   *   this.currentNode,
+   *   { strategy: 'complementaryItems' },
+   *   'Changed recommendation algorithm'
+   * );
+   * @param api - Stripo extension API with document modifier
+   * @param node - The immutable HTML node to update
+   * @param updates - Partial config with values to update
+   * @param description - Human-readable description for undo/redo
+   * @returns The new complete configuration
+   */
+  static updateConfig(i, t, o, n) {
+    const s = this.getConfig(t), r = this.deepMerge(s, o);
+    return this.saveConfig(i, t, r, n), r;
+  }
+  /**
+   * Initialize configuration for a new block
+   *
+   * Called when a block is first created (dropped into template).
+   * Can optionally merge in partial config from migration.
+   * @example
+   * // In Block.onCreated lifecycle
+   * RecommendationConfigService.initializeConfig(this.api, node);
+   * @param api - Stripo extension API with document modifier
+   * @param node - The immutable HTML node to initialize
+   * @param partialConfig - Optional partial config to merge with defaults
+   * @returns The initialized configuration
+   */
+  static initializeConfig(i, t, o) {
+    const n = o ? this.mergeWithDefaults(o) : this.cloneDefaults();
+    return this.saveConfig(i, t, n, "Initialize recommendation block"), g({
+      currentNode: t,
+      documentModifier: i.getDocumentModifier(),
+      currency: n.currency
+    }), n;
+  }
+  /**
+   * Save complete configuration to a node
+   *
+   * Low-level method - prefer `updateConfig` or `initializeConfig` in most cases.
+   * @param api - Stripo extension API with document modifier
+   * @param node - The immutable HTML node to save to
+   * @param config - Complete configuration to save
+   * @param description - Human-readable description for undo/redo
+   */
+  static saveConfig(i, t, o, n) {
+    try {
+      i.getDocumentModifier().modifyHtml(t).setNodeConfig(o).apply(new f(n));
+    } catch (s) {
+      console.warn("[RecommendationConfigService] Failed to save config:", s);
+    }
+  }
+  // ========================================================================
+  // Migration Helpers
+  // ========================================================================
+  /**
+   * Migrate configuration from legacy data-attributes
+   *
+   * Reads existing data-attributes and creates a proper node config.
+   * Used when loading templates created before node config was implemented.
+   * @param api - Stripo extension API with document modifier
+   * @param node - The block node to migrate
+   * @returns The migrated configuration
+   */
+  static migrateFromDataAttributes(i, t) {
+    const o = {
+      configVersion: u
+    };
+    if ("getAttribute" in t && typeof t.getAttribute == "function") {
+      const n = t.getAttribute("data-layout");
+      n === "list" || n === "horizontal" ? o.layout = "list" : (n === "grid" || n === "vertical") && (o.layout = "grid");
+      const s = t.getAttribute("data-card-composition");
+      s && (o.composition = s.split(",").filter(Boolean));
+      const r = t.getAttribute("data-column-spacing");
+      r && (o.columnSpacing = parseInt(r) || e.columnSpacing);
+      const c = t.getAttribute("data-row-spacing");
+      c && (o.rowSpacing = parseInt(c) || e.rowSpacing);
+    }
+    return this.initializeConfig(i, t, o);
+  }
+  /**
+   * Check if configuration needs migration
+   * @param node - The block node to check
+   * @returns True if migration is needed
+   */
+  static needsMigration(i) {
+    return i ? this.hasConfig(i) ? this.getConfigVersion(i) < u : !0 : !1;
+  }
+  // ========================================================================
+  // Internal Helpers
+  // ========================================================================
+  /**
+   * Clone default config to avoid mutations
+   */
+  static cloneDefaults() {
+    return {
+      ...e,
+      currency: { ...e.currency },
+      omnibusPrice: { ...e.omnibusPrice },
+      omnibusDiscount: { ...e.omnibusDiscount },
+      composition: [...e.composition],
+      visibility: { ...e.visibility },
+      filters: [],
+      productIds: []
+    };
+  }
+  /**
+   * Merge partial config with defaults
+   *
+   * Deep merges nested objects like currency, omnibus settings.
+   */
+  static mergeWithDefaults(i) {
+    const t = this.cloneDefaults();
+    return {
+      ...t,
+      ...i,
+      currency: {
+        ...t.currency,
+        ...i.currency || {}
+      },
+      omnibusPrice: {
+        ...t.omnibusPrice,
+        ...i.omnibusPrice || {}
+      },
+      omnibusDiscount: {
+        ...t.omnibusDiscount,
+        ...i.omnibusDiscount || {}
+      },
+      visibility: {
+        ...t.visibility,
+        ...i.visibility || {}
+      },
+      composition: i.composition || t.composition,
+      filters: i.filters || [],
+      productIds: i.productIds || []
+    };
+  }
+  /**
+   * Deep merge for nested objects
+   *
+   * Recursively merges source into target, preserving existing values
+   * that aren't explicitly overwritten.
+   */
+  static deepMerge(i, t) {
+    return {
+      ...i,
+      ...t,
+      currency: {
+        ...i.currency,
+        ...t.currency || {}
+      },
+      omnibusPrice: {
+        ...i.omnibusPrice,
+        ...t.omnibusPrice || {}
+      },
+      omnibusDiscount: {
+        ...i.omnibusDiscount,
+        ...t.omnibusDiscount || {}
+      },
+      visibility: {
+        ...i.visibility,
+        ...t.visibility || {}
+      },
+      composition: t.composition ?? i.composition,
+      filters: t.filters ?? i.filters,
+      productIds: t.productIds ?? i.productIds
+    };
+  }
+}
+export {
+  C as RecommendationConfigService
+};

package/dist/extensions/Blocks/Recommendation/settingsPanel.js

@@ -1,17 +1,27 @@
 import { SettingsPanelRegistry as S, SettingsPanelTab as I, SettingsTab as T, ContainerControls as E, TextControls as C } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { BLOCK_ID as R } from "./block.js";
-import { COMPOSITION_CONTROL_BLOCK_ID as L } from "./cardCompositionControl.js";
-import { RecommendationBlockId as N, RecommendationControlId as _ } from "./constants.js";
-import { CONTROL_BLOCK_ID as U } from "./control.js";
-import { CARD_BACKGROUND_COLOR_CONTROL_ID as B } from "./controls/cardBackgroundColorControl.js";
-import { SPACING_CONTROL_ID as D } from "./controls/spacingControl.js";
-class m extends S {
+import { RecommendationBlockId as N } from "./constants/blockIds.js";
+import { RecommendationControlId as _ } from "./constants/controlIds.js";
+import { CONTROL_BLOCK_ID as L } from "./controls/main/index.js";
+import "./store/recommendation.js";
+import "./controls/name/index.js";
+import "./controls/price/index.js";
+import "./controls/oldPrice/index.js";
+import "./controls/omnibusPrice/index.js";
+import "./controls/omnibusDiscount/index.js";
+import "./controls/button/index.js";
+import "./controls/image/index.js";
+import { SPACING_CONTROL_ID as U } from "./controls/spacing/index.js";
+import { CARD_BACKGROUND_COLOR_CONTROL_ID as B } from "./controls/cardBackground/index.js";
+import { LAYOUT_CONTROL_ID as D } from "./controls/layout/index.js";
+import { COMPOSITION_CONTROL_BLOCK_ID as A } from "./controls/cardComposition/index.js";
+class s extends S {
   registerBlockControls(O) {
     O[R] = [
       new I(
         T.SETTINGS,
         [
-          U,
+          L,
           E.EXTERNAL_INDENTS
         ]
       ),
@@ -20,13 +30,14 @@ class m extends S {
         [
           C.TEXT_BLOCK_BACKGROUND_COLOR,
           B,
-          D
+          D,
+          U
         ]
       ),
       new I(
         "Card Composition",
         [
-          L
+          A
         ]
       ).withLabel("Card Composition")
     ], O[N.NAME] = [
@@ -158,5 +169,5 @@ class m extends S {
   }
 }
 export {
-  m as SettingsPanel
+  s as SettingsPanel
 };

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

@@ -1,13 +1,14 @@
-import { RecommendationFeedSourceMaps as n, PriceAttributes as u } from "../../../../enums/extensions/recommendationBlock.js";
-import { useRecommendationApi as l } from "../../../../services/recommendationApi.js";
-import { useConfigStore as c } from "../../../../stores/config.js";
-import { defineStore as p } from "pinia";
-import { generateCompleteFilterQuery as m } from "../utils/filterUtil.js";
-const a = l(), d = () => ({
+import { RecommendationFeedSourceMaps as l, PriceAttributes as p } from "../../../../enums/extensions/recommendationBlock.js";
+import { useRecommendationApi as m } from "../../../../services/recommendationApi.js";
+import { useConfigStore as f } from "../../../../stores/config.js";
+import { defineStore as d } from "pinia";
+import { DEFAULT_CARDS_IN_ROW as g } from "../constants/layout.js";
+import { generateCompleteFilterQuery as c } from "../utils/filterUtil.js";
+const s = m(), h = () => ({
   recommendationCampaignUrls: {},
   recommendationProducts: [],
   recommendationConfigs: {
-    cardsInRow: 3,
+    cardsInRow: g,
     currencySettings: {
       name: "USD",
       value: "USD",
@@ -118,14 +119,14 @@ const a = l(), d = () => ({
     productIds: ["22", "12"],
     id: 1,
     language: "tr_TR",
-    orientation: "vertical",
+    orientation: "grid",
     recommendedProducts: [],
     sendProductRequestFlag: !1,
     shuffleProducts: !1,
     strategy: "mostPopular",
     textTrimming: !0,
     unresponsive: !1,
-    size: "9"
+    size: "6"
   },
   activePredictiveAlgorithms: [],
   languages: {},
@@ -134,8 +135,8 @@ const a = l(), d = () => ({
   filterSelectionDrawerStatus: !1,
   filterList: {},
   filterGroup: 1
-}), y = p("guidoRecommendationExtension", {
-  state: () => d(),
+}), R = d("guidoRecommendationExtension", {
+  state: () => h(),
   getters: {
     hasFilters: (e) => !!e.recommendationConfigs.filters.length,
     getFilterGroupCount: (e) => {
@@ -145,7 +146,7 @@ const a = l(), d = () => ({
     getActivePredictiveAlgorithms: (e) => {
       const t = [];
       return e.activePredictiveAlgorithms.forEach((r) => {
-        t.push(...n.filter((i) => i.id === r));
+        t.push(...l.filter((i) => i.id === r));
       }), t.map((r) => ({
         text: r.name,
         value: r.key
@@ -160,7 +161,7 @@ const a = l(), d = () => ({
       value: t.text
     })),
     getFilterList: (e) => Object.values(e.filterList).map((t) => {
-      const r = t.type === "defaultAttribute", i = u.includes(t.attributeName);
+      const r = t.type === "defaultAttribute", i = p.includes(t.attributeName);
       let o = r ? t.attributeName : `product_attributes.${t.attributeName}`;
       return o = i ? `${o}.${e.recommendationConfigs.currencySettings.value}` : o, {
         text: t.displayName,
@@ -178,13 +179,13 @@ const a = l(), d = () => ({
         activePredictiveAlgorithms: e,
         languages: t,
         currencies: r
-      } = await a.fetchRecommendationCreateData();
+      } = await s.fetchRecommendationCreateData();
       this.activePredictiveAlgorithms = e, this.languages = t;
       const [i] = r;
       this.recommendationConfigs.currencySettings.name = i.text, this.recommendationConfigs.currencySettings.value = i.value, this.currencyList = r, this.filterStatus = !!this.recommendationConfigs.filters.length;
     },
     async fetchRecommendationFilters() {
-      const e = await a.fetchRecommendationFilters();
+      const e = await s.fetchRecommendationFilters();
       this.filterList = e;
     },
     addFilterGroup(e) {
@@ -224,13 +225,15 @@ const a = l(), d = () => ({
       }
     },
     addFilter(e) {
-      const t = [...this.recommendationConfigs.filters], r = t.findLastIndex((i) => i.filterGroup === e.filterGroup);
-      r !== -1 ? t.splice(r + 1, 0, {
+      const t = [...this.recommendationConfigs.filters], i = t.filter(
+        (a) => a.filterGroup === e.filterGroup
+      ).length + 1, o = t.findLastIndex((a) => a.filterGroup === e.filterGroup);
+      o !== -1 ? t.splice(o + 1, 0, {
         ...e,
-        filterNumber: r + 2
+        filterNumber: i
       }) : t.push({
         ...e,
-        filterNumber: 1
+        filterNumber: i
       }), this.$patch({
         recommendationConfigs: {
           filters: t
@@ -238,30 +241,32 @@ const a = l(), d = () => ({
       });
     },
     generateFilterQuery() {
-      return m(this.recommendationConfigs.filters);
+      return c(this.recommendationConfigs.filters);
     },
     async fetchRecommendationProducts() {
-      var o;
-      const e = this.generateFilterQuery(), t = ((o = n.find((s) => s.key === this.recommendationConfigs.strategy)) == null ? void 0 : o.path) || "", r = c(), i = await a.fetchRecommendationProducts(
-        t,
-        {
-          // TODO: Here will be optimized and filled carefully
-          locale: this.recommendationConfigs.language,
-          currency: this.recommendationConfigs.currencySettings.value,
-          partnerName: r.partnerName,
-          productId: this.recommendationConfigs.strategy === "manualMerchandising" ? this.recommendationConfigs.productIds.join(",") : "{itemId}",
-          size: this.recommendationConfigs.size,
-          details: !0,
-          campaignId: "{campaignId}",
-          filter: e
-        }
+      var u;
+      const e = this.recommendationConfigs.filters.filter((n) => n.isValid), t = c(e), r = ((u = l.find((n) => n.key === this.recommendationConfigs.strategy)) == null ? void 0 : u.path) || "", i = f(), o = {
+        // Note: {itemId} and {campaignId} are template placeholders replaced at runtime
+        locale: this.recommendationConfigs.language,
+        currency: this.recommendationConfigs.currencySettings.value,
+        partnerName: i.partnerName,
+        productId: this.recommendationConfigs.strategy === "manualMerchandising" ? this.recommendationConfigs.productIds.join(",") : "{itemId}",
+        size: this.recommendationConfigs.size,
+        details: !0,
+        campaignId: "{campaignId}",
+        filter: t
+      };
+      this.recommendationConfigs.shuffleProducts && (o.shuffle = !0);
+      const a = await s.fetchRecommendationProducts(
+        r,
+        o
       );
       this.$patch({
-        recommendationProducts: i
+        recommendationProducts: a
       });
     }
   }
 });
 export {
-  y as useRecommendationExtensionStore
+  R as useRecommendationExtensionStore
 };