@useinsider/guido 3.13.1 → 3.14.0-beta.1e474dd

package/dist/extensions/Blocks/Recommendation/utils/compositionKeys.js

@@ -0,0 +1,89 @@
+import { ATTR_CUSTOM_PREFIX as i, ATTR_PRODUCT_ATTR as c, PRODUCT_ATTRIBUTE_PREFIX as l, ATTR_DATA_ATTRIBUTE_TYPE as f, SELECTOR_ATTRIBUTE_ROW as R } from "../constants/selectors.js";
+function d(t) {
+  return !t.startsWith(l);
+}
+function y(t) {
+  return t.startsWith(l) ? t.substring(l.length) : t;
+}
+function T(t) {
+  return t.startsWith(i) ? t.substring(i.length) : t;
+}
+function A(t) {
+  return `${i}${t}`;
+}
+function P(t) {
+  return t.type === "defaultAttribute" ? t.attributeName : `${l}${t.attributeName}`;
+}
+function _(t, r) {
+  const n = Object.values(r).filter((e) => e.attributeName === t);
+  return n.find((e) => e.type === "defaultAttribute") ?? n[0];
+}
+function o(t, r) {
+  return t && "getAttribute" in t ? t.getAttribute(r) : null;
+}
+function m(t, r, n = {}) {
+  const e = `${i}${t}`, u = r == null ? void 0 : r.querySelector(
+    `${R}[${f}="${e}"]`
+  ), a = o(u, c) ?? o(u == null ? void 0 : u.querySelector(`[${c}]`), c);
+  if (a)
+    return a;
+  const s = _(t, n);
+  return s ? P(s) : t;
+}
+function g(t, r, n = {}) {
+  return t.startsWith(l) ? t : m(t, r, n);
+}
+function C(t, r, n = {}) {
+  return t.map((e) => {
+    if (!e.startsWith(i))
+      return e;
+    const u = T(e);
+    return A(g(u, r, n));
+  });
+}
+function E(t, r, n = {}) {
+  return t.map((e) => g(e, r, n));
+}
+function S(t) {
+  const r = o(t, f);
+  if (!(r != null && r.startsWith(i)))
+    return r;
+  const n = "querySelector" in t ? t.querySelector(`[${c}]`) : void 0, e = o(n, c);
+  return e ? A(e) : r;
+}
+function $(t, r) {
+  const n = o(t, c), e = o(t.querySelector(`[${c}]`), c), u = n ?? e;
+  return u === null || u === r;
+}
+function W(t, r) {
+  const n = (h) => t.querySelector(
+    `${R}[${f}="${h}"]`
+  );
+  if (!r.startsWith(i))
+    return n(r) ?? null;
+  const e = T(r), u = n(r);
+  if (u && $(u, e))
+    return u;
+  const a = A(y(e)), s = a === r ? void 0 : n(a);
+  return s && $(s, e) ? s : null;
+}
+function q(t, r) {
+  const n = T(r), e = A(y(n));
+  return e === r ? t : t.replace(
+    `${f}="${e}"`,
+    `${f}="${r}"`
+  );
+}
+export {
+  y as bareAttributeName,
+  T as compositionKeyToProductAttr,
+  P as filterToProductAttrValue,
+  W as findAttributeRow,
+  _ as findFilterByBareName,
+  d as isDefaultProductAttr,
+  C as normalizeCompositionKeys,
+  E as normalizeCustomAttrValues,
+  A as productAttrToCompositionKey,
+  S as resolveRowCompositionKey,
+  q as rewriteLegacyRowKeyHtml
+};

package/dist/extensions/Blocks/common-control.js

@@ -47,15 +47,15 @@ class d extends I {
     const t = this.getBlockInstanceId();
     if (!t)
       return !1;
-    const o = t !== this.lastBlockInstanceId;
-    return e(), o && (this.lastBlockInstanceId = t), o;
+    const E = t !== this.lastBlockInstanceId;
+    return e(), E && (this.lastBlockInstanceId = t), E;
   }
-  _GuLabel({ text: e, name: t = "", hint: o }) {
+  _GuLabel({ text: e, name: t = "", hint: E }) {
     return `
             <${n.LABEL}
                 ${$.LABEL.text}="${e}"
                 ${$.LABEL.name}="${t || `${e} Label`}"
-                ${o ? `${$.LABEL.hint}="${o}"` : ""}>
+                ${E ? `${$.LABEL.hint}="${E}"` : ""}>
             </${n.LABEL}>
         `;
   }
@@ -73,7 +73,7 @@ class d extends I {
    * Use in getTemplate() — the icon is registered in a hidden store so Stripo initializes it.
    * Pair with _setInfoMessageValue() in onRender() to set the text content.
    */
-  _GuOnPageMessage({ name: e, icon: t = "not-found", type: o = "info" }) {
+  _GuOnPageMessage({ name: e, icon: t = "not-found", type: E = "info" }) {
     return `
             <div data-info-message="${e}" style="display: none; padding: 16px 16px 0;">
                 <div class="icon-store" style="display: none;">
@@ -81,7 +81,7 @@ class d extends I {
                         ${this._GuIcon({ src: t, className: "icon" })}
                     </div>
                 </div>
-                ${this._GuMessage({ name: e, type: o })}
+                ${this._GuMessage({ name: e, type: E })}
             </div>
         `;
   }
@@ -91,7 +91,7 @@ class d extends I {
    * and combines it with the text in Stripo's alert-message layout.
    */
   _setInfoMessageValue(e, t) {
-    const o = this.getContainer(), E = o.querySelector(`[data-icon-key="${e}"]`), a = E == null ? void 0 : E.querySelector("ue-icon-component"), l = (a == null ? void 0 : a.outerHTML) ?? "";
+    const E = this.getContainer(), o = E.querySelector(`[data-icon-key="${e}"]`), a = o == null ? void 0 : o.querySelector("ue-icon-component"), l = (a == null ? void 0 : a.outerHTML) ?? "";
     this.api.setUIEAttribute(
       e,
       "value",
@@ -104,7 +104,7 @@ class d extends I {
             </div>
             `
     );
-    const T = o.querySelector(`[data-info-message="${e}"]`);
+    const T = E.querySelector(`[data-info-message="${e}"]`);
     T && (T.style.display = "");
   }
   _GuToggle(e) {
@@ -121,59 +121,66 @@ class d extends I {
                 ${$.SELECT_ITEM.value}="${t}">
             </${n.SELECT_ITEM}>`;
   }
-  _GuSelect({ name: e, placeholder: t, options: o, className: E = "es-180w" }) {
+  _GuSelect({
+    name: e,
+    placeholder: t,
+    options: E,
+    className: o = "es-180w",
+    searchable: a = !1
+  }) {
     return `
             <${n.SELECTPICKER}
-                class="${E}"
+                class="${o}"
                 ${$.SELECTPICKER.name}="${e}"
+                ${a ? `${$.SELECTPICKER.searchable}="true"` : ""}
                 ${$.SELECTPICKER.placeholder}="${t}">
-                    ${o.map((a) => this._GuSelectItem(a)).join("")}
+                    ${E.map((l) => this._GuSelectItem(l)).join("")}
             </${n.SELECTPICKER}>
         `;
   }
-  _GuTextInput({ name: e, placeholder: t, className: o = "", disabled: E = !1 }) {
+  _GuTextInput({ name: e, placeholder: t, className: E = "", disabled: o = !1 }) {
     return `
             <${n.TEXT}
-                class=${o}
+                class=${E}
                 ${$.TEXT.name}="${e}"
                 placeholder="${t || e}"
-                ${E ? `${$.TEXT.disabled}="true"` : ""}>
+                ${o ? `${$.TEXT.disabled}="true"` : ""}>
             </${n.TEXT}>
         `;
   }
-  _GuCounter({ name: e, maxValue: t, minValue: o = 1, step: E = 1 }) {
+  _GuCounter({ name: e, maxValue: t, minValue: E = 1, step: o = 1 }) {
     return `
             <${n.COUNTER}
                 ${$.COUNTER.name}="${e}"
-                ${$.COUNTER.minValue}="${o}"
+                ${$.COUNTER.minValue}="${E}"
                 ${$.COUNTER.maxValue}="${t}"
-                ${$.COUNTER.step}="${E}">
+                ${$.COUNTER.step}="${o}">
             </${n.COUNTER}>
         `;
   }
-  _GuRadioButtonItem({ text: e, value: t, icon: o }) {
+  _GuRadioButtonItem({ text: e, value: t, icon: E }) {
     return `
             <${n.RADIO_ITEM}
                 ${$.RADIO_ITEM.value}="${t}"
                 ${e ? `${$.RADIO_ITEM.text}="${e}"` : ""}
-                ${o ? `${$.RADIO_ITEM.icon}="${o}"` : ""}>
+                ${E ? `${$.RADIO_ITEM.icon}="${E}"` : ""}>
             </${n.RADIO_ITEM}>
         `;
   }
-  _GuRadioButton({ name: e, buttons: t, id: o = "" }) {
+  _GuRadioButton({ name: e, buttons: t, id: E = "" }) {
     return `
             <${n.RADIO_BUTTONS}
-                ${o ? `id="${o}"` : ""}
+                ${E ? `id="${E}"` : ""}
                 ${$.RADIO_BUTTONS.name}="${e}">
-                ${t.map((E) => this._GuRadioButtonItem(E)).join("")}
+                ${t.map((o) => this._GuRadioButtonItem(o)).join("")}
             </${n.RADIO_BUTTONS}>
         `;
   }
-  _GuButton({ name: e, label: t, id: o = "" }) {
+  _GuButton({ name: e, label: t, id: E = "" }) {
     return `
             <${n.BUTTON}
                 ${$.BUTTON.name}="${e}"
-                ${o ? `id="${o}"` : ""}
+                ${E ? `id="${E}"` : ""}
                 ${$.BUTTON.caption}="${t}"}>
             </${n.BUTTON}>
         `;
@@ -191,10 +198,10 @@ class d extends I {
    * @param param0
    * @returns It returns a button with an icon.
    */
-  _GuIconButton({ name: e, icon: t, className: o = "" }) {
+  _GuIconButton({ name: e, icon: t, className: E = "" }) {
     return `
             <${n.BUTTON}
-                class="${o}"
+                class="${E}"
                 ${$.BUTTON.name}="${e}"
                 ${$.BUTTON.icon}="${t}">
             </${n.BUTTON}>
@@ -222,19 +229,19 @@ class d extends I {
    * @returns HTML string for the orderable control
    */
   _GuOrderable(e, t) {
-    let o = "";
+    let E = "";
     t.forEach((a) => {
       const l = $.ORDERABLE_ITEM && "name" in $.ORDERABLE_ITEM ? $.ORDERABLE_ITEM.name : "name";
-      o += `
+      E += `
                 <${n.ORDERABLE_ITEM} ${l}="${a.key}">
                     ${a.content}
                 </${n.ORDERABLE_ITEM}>
             `;
     });
-    const E = $.ORDERABLE && "name" in $.ORDERABLE ? $.ORDERABLE.name : "name";
+    const o = $.ORDERABLE && "name" in $.ORDERABLE ? $.ORDERABLE.name : "name";
     return `
-            <${n.ORDERABLE} ${E}="${e}">
-                ${o}
+            <${n.ORDERABLE} ${o}="${e}">
+                ${E}
             </${n.ORDERABLE}>
         `;
   }
@@ -275,16 +282,16 @@ class d extends I {
         `;
   }
   _GuRadioButtons(e, t) {
-    const o = t.map((E) => `
+    const E = t.map((o) => `
                 <${n.RADIO_ITEM}
-                    ${$.RADIO_ITEM.text}="${E.text}"
-                    ${$.RADIO_ITEM.value}="${E.value}">
+                    ${$.RADIO_ITEM.text}="${o.text}"
+                    ${$.RADIO_ITEM.value}="${o.value}">
                 </${n.RADIO_ITEM}>
             `).join("");
     return `
             <${n.RADIO_BUTTONS}
                 ${$.RADIO_BUTTONS.name}="${e}">
-                ${o}
+                ${E}
             </${n.RADIO_BUTTONS}>
         `;
   }

package/dist/guido.css

@@ -1 +1 @@
-.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-195ab6d4]{position:relative;display:inline-block}.new-tag[data-v-195ab6d4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-195ab6d4] .guido__view-option-selection-desktop svg,[data-v-195ab6d4] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-195ab6d4] .in-segments-wrapper__button_selected,[data-v-195ab6d4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-195ab6d4] .in-tooltip-wrapper__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-d405ca59]{position:relative;display:inline-block}.new-tag[data-v-d405ca59]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-d405ca59] .guido__verion-history-view-option-selection-desktop svg,[data-v-d405ca59] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-d405ca59] .in-segments-wrapper__button_selected,[data-v-d405ca59] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-d405ca59] .in-tooltip-wrapper__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-5079a1c8]{--ribbon-offset: 0px;position:relative;width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__container[data-v-5079a1c8]{width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__no-header[data-v-5079a1c8]{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}
+.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-5079a1c8]{--ribbon-offset: 0px;position:relative;width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__container[data-v-5079a1c8]{width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__no-header[data-v-5079a1c8]{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}

package/dist/node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js

@@ -41,9 +41,9 @@ ${s.map((o) => `  - ${o}`).join(`
 };
 v.validatedClasses = /* @__PURE__ */ new Set();
 v.validationErrors = /* @__PURE__ */ new Map();
-var i = v, z = /* @__PURE__ */ ((e) => (e.BLOCK = "BLOCK", e.CONTAINER = "CONTAINER", e.STRUCTURE = "STRUCTURE", e.STRIPE = "STRIPE", e))(z || {}), P = class c extends i {
+var i = v, z = /* @__PURE__ */ ((e) => (e.BLOCK = "BLOCK", e.CONTAINER = "CONTAINER", e.STRUCTURE = "STRUCTURE", e.STRIPE = "STRIPE", e))(z || {}), P = class T extends i {
   constructor() {
-    super(c.REQUIRED_METHODS, c);
+    super(T.REQUIRED_METHODS, T);
   }
   /**
    * Determines if the block should be available for use in the editor.
@@ -222,9 +222,9 @@ var i = v, z = /* @__PURE__ */ ((e) => (e.BLOCK = "BLOCK", e.CONTAINER = "CONTAI
   }
 };
 P.REQUIRED_METHODS = ["getId", "getTemplate", "getIcon", "getName", "getDescription"];
-var qe = P, Z = class T extends i {
+var qe = P, Z = class c extends i {
   constructor() {
-    super(T.REQUIRED_METHODS, T);
+    super(c.REQUIRED_METHODS, c);
   }
   /**
    * @deprecated - use {@link getPreviewInnerHtml} instead
@@ -339,12 +339,12 @@ var j = {
   height: "height"
 }, Je = {
   BLOCK_IMAGE: j
-}, U = "esd-block-button", w = "esd-block-text", K = "esd-block-image", J = "esd-structure", ee = "esd-block-video", te = "esd-block-social", re = "esd-block-banner", ae = "esd-block-timer", ne = "esd-block-menu", se = "esd-block-html", ie = "esd-block-spacer", le = "esd-container-frame", Ee = "esd-stripe", oe = "esd-amp-form", I = ((e) => (e.BUTTON = `.${U}`, e.TEXT = `.${w}`, e.IMAGE = `.${K}`, e.STRUCTURE = `.${J}`, e.VIDEO = `.${ee}`, e.SOCIAL = `.${te}`, e.BANNER = `.${re}`, e.TIMER = `.${ae}`, e.MENU = `.${ne}`, e.HTML = `.${se}`, e.SPACER = `.${ie}`, e.CONTAINER = `.${le}`, e.STRIPE = `.${Ee}`, e.FORM = `.${oe}`, e))(I || {}), de = /* @__PURE__ */ ((e) => (e.BLOCK_IMAGE = "BLOCK_IMAGE", e.BLOCK_TEXT = "BLOCK_TEXT", e.BLOCK_BUTTON = "BLOCK_BUTTON", e.BLOCK_SPACER = "BLOCK_SPACER", e.BLOCK_VIDEO = "BLOCK_VIDEO", e.BLOCK_SOCIAL = "BLOCK_SOCIAL", e.BLOCK_BANNER = "BLOCK_BANNER", e.BLOCK_TIMER = "BLOCK_TIMER", e.BLOCK_MENU = "BLOCK_MENU", e.BLOCK_MENU_ITEM = "BLOCK_MENU_ITEM", e.BLOCK_HTML = "BLOCK_HTML", e.BLOCK_AMP_CAROUSEL = "BLOCK_AMP_CAROUSEL", e.BLOCK_AMP_ACCORDION = "BLOCK_AMP_ACCORDION", e.BLOCK_AMP_FORM = "BLOCK_AMP_FORM", e.CONTAINER = "CONTAINER", e.FORM_CONTAINER = "FORM_CONTAINER", e.STRUCTURE = "STRUCTURE", e.STRIPE = "STRIPE", e.EMPTY_CONTAINER = "EMPTY_CONTAINER", e.CUSTOM_BLOCK_LINK = "CUSTOM_BLOCK_LINK", e.CUSTOM_BLOCK_IMAGE = "CUSTOM_BLOCK_IMAGE", e.CUSTOM_BLOCK_TEXT = "CUSTOM_BLOCK_TEXT", e))(de || {}), F = /* @__PURE__ */ ((e) => (e.ANCHOR_LINK_CONTAINER = "anchorLinkFormContainer", e.APPLY_CONDITION = "applyCondition", e.APPLY_CONDITION_SWITCHER = "applyConditionSwitcher", e.BACKGROUND_COLOR = "backgroundColor", e.BACKGROUND_IMAGE = "generalImageContainer", e.TEXT_COLOR = "textColor", e.TEXT_STYLE = "textStyle", e.TEXT_SIZE = "textSize", e.TEXT_LINE_SPACING = "textLineSpacing", e.TEXT_ALIGN = "textAlign", e.FIXED_HEIGHT_SWITCHER = "fixedHeightSwitcherForm", e.HIDDEN_NODE = "hiddenNode", e.SMART_BLOCK = "smartBlock", e.SYNCHRONIZED_MODULE = "synchronizedModuleForm", e.FONT_FAMILY = "generalFontFamilyForm", e.BLOCK_INTERNAL_INDENTS = "generalBlockInternalIndents", e.STRUCTURE_INTERNAL_INDENTS = "generalStructureInternalIndents", e))(F || {}), H = /* @__PURE__ */ ((e) => (e.ADJUST_TO_WIDTH = "adjustToWidth", e.ALIGNMENT = "buttonAlignment", e.BORDER = "buttonBorder", e.BORDER_RADIUS = "buttonBorderRadius", e.COLOR = "buttonColor", e.BUTTON_BLOCK_BACKGROUND_COLOR = "buttonBlockBackgroundColor", e.EXTERNAL_INDENTS = "buttonExternalIndents", e.FIXED_HEIGHT = "buttonFixedHeightForm", e.FONT_COLOR = "buttonFontColor", e.FONT_FAMILY = "buttonFontFamily", e.FONT_SIZE = "buttonFontSize", e.ICON = "buttonIconContainer", e.ICON_ALIGN = "buttonIconAlign", e.ICON_INDENT = "buttonIconIndent", e.ICON_WIDTH = "buttonIconWidth", e.IMAGE = "buttonImageForm", e.INTERNAL_INDENTS = "buttonInternalIndents", e.LINK = "buttonLink", e.MIME_TYPE = "buttonMimeTypeForm", e.SWITCHER_HOVERED_STYLES = "buttonSwitcherHoveredStylesForm", e.TEXT = "buttonText", e.TEXT_STYLE_AND_COLOR = "buttonTextStyleAndColorForm", e.HOVERED_BORDER_COLOR = "hoveredStyleBorderButtonForm", e.HOVERED_COLOR = "hoveredButtonColorForm", e.HOVERED_TEXT_COLOR = "hoveredButtonTextColorForm", e))(H || {}), k = /* @__PURE__ */ ((e) => (e.HIDDEN_NODE = "hiddenNodeText", e.PARAGRAPH_STYLE = "paragraphStyleForm", e.ALIGN = "textAlignmentForm", e.ANCHOR_CONTAINER = "textAnchorForm", e.FONT_BACKGROUND_COLOR = "textBlockFontBackgroundColor", e.TEXT_BLOCK_BACKGROUND_COLOR = "textBlockBackgroundColor", e.FONT_COLOR = "textBlockFontColor", e.TEXT_BLOCK_FONT_FAMILY = "textBlockFontFamily", e.FONT_FAMILY = "textFontFamily", e.FONT_SIZE = "textBlockFontSize", e.FONT_WEIGHT = "textBlockFontWeight", e.DIRECTION = "textBlockDirectionForm", e.INSERT_FORM = "textBlockInsertForm", e.LINK_DATA = "textBlockLinkDataForm", e.FORMAT = "textBlockTextFormatForm", e.FIXED_HEIGHT = "textFixedHeightForm", e.INTERNAL_INDENTS = "textInternalIndents", e.LINE_HEIGHT = "textLineHeightForm", e.MIME_TYPE = "textMimeTypeForm", e.NO_LINE_WRAPS = "textNoLineWrapsForm", e))(k || {}), p = /* @__PURE__ */ ((e) => (e.ALT_TEXT = "altText", e.LINK = "blockLink", e.ALIGNMENT = "imageAlignment", e.ANCHOR_LINK_CONTAINER = "imageAnchorLinkContainerForm", e.BORDER_RADIUS = "imageBorderRadiusForm", e.IMAGE = "imageImageForm", e.EXTERNAL_INDENTS = "imageExternalIndents", e.MIME_TYPE = "imageMimeTypeForm", e.RESPONSIVE = "imageResponsive", e.ROLLOVER_IMAGE = "imageRolloverImageForm", e.ROLLOVER_SWITCHER = "imageRolloverSwitcherForm", e.SIZE = "imageSizeContainer", e))(p || {}), ue = /* @__PURE__ */ ((e) => (e.BACKGROUND_COLOR = "containerBackgroundColorForm", e.BORDER_FORM = "containerBorderForm", e.BORDER_RADIUS = "containerBorderRadiusForm", e.EXTERNAL_INDENTS = "containerExternalIndentsForm", e.IMAGE_CONTAINER = "containerImageContainerForm", e.MIME_TYPE = "containerMimeTypeForm", e.DISPLAY_CONDITIONS = "displayConditions", e.HIDDEN_NODE = "containerHiddenNodeForm", e))(ue || {}), n = {
+}, U = "esd-block-button", w = "esd-block-text", K = "esd-block-image", J = "esd-structure", ee = "esd-block-video", te = "esd-block-social", re = "esd-block-banner", ae = "esd-block-timer", ne = "esd-block-menu", se = "esd-block-html", ie = "esd-block-spacer", le = "esd-container-frame", Ee = "esd-stripe", oe = "esd-amp-form", I = ((e) => (e.BUTTON = `.${U}`, e.TEXT = `.${w}`, e.IMAGE = `.${K}`, e.STRUCTURE = `.${J}`, e.VIDEO = `.${ee}`, e.SOCIAL = `.${te}`, e.BANNER = `.${re}`, e.TIMER = `.${ae}`, e.MENU = `.${ne}`, e.HTML = `.${se}`, e.SPACER = `.${ie}`, e.CONTAINER = `.${le}`, e.STRIPE = `.${Ee}`, e.FORM = `.${oe}`, e))(I || {}), de = /* @__PURE__ */ ((e) => (e.BLOCK_IMAGE = "BLOCK_IMAGE", e.BLOCK_TEXT = "BLOCK_TEXT", e.BLOCK_BUTTON = "BLOCK_BUTTON", e.BLOCK_SPACER = "BLOCK_SPACER", e.BLOCK_VIDEO = "BLOCK_VIDEO", e.BLOCK_SOCIAL = "BLOCK_SOCIAL", e.BLOCK_BANNER = "BLOCK_BANNER", e.BLOCK_TIMER = "BLOCK_TIMER", e.BLOCK_MENU = "BLOCK_MENU", e.BLOCK_MENU_ITEM = "BLOCK_MENU_ITEM", e.BLOCK_HTML = "BLOCK_HTML", e.BLOCK_AMP_CAROUSEL = "BLOCK_AMP_CAROUSEL", e.BLOCK_AMP_ACCORDION = "BLOCK_AMP_ACCORDION", e.BLOCK_AMP_FORM = "BLOCK_AMP_FORM", e.CONTAINER = "CONTAINER", e.FORM_CONTAINER = "FORM_CONTAINER", e.STRUCTURE = "STRUCTURE", e.STRIPE = "STRIPE", e.EMPTY_CONTAINER = "EMPTY_CONTAINER", e.CUSTOM_BLOCK_LINK = "CUSTOM_BLOCK_LINK", e.CUSTOM_BLOCK_IMAGE = "CUSTOM_BLOCK_IMAGE", e.CUSTOM_BLOCK_TEXT = "CUSTOM_BLOCK_TEXT", e))(de || {}), F = /* @__PURE__ */ ((e) => (e.ANCHOR_LINK_CONTAINER = "anchorLinkFormContainer", e.APPLY_CONDITION = "applyCondition", e.APPLY_CONDITION_SWITCHER = "applyConditionSwitcher", e.BACKGROUND_COLOR = "backgroundColor", e.BACKGROUND_IMAGE = "generalImageContainer", e.TEXT_COLOR = "textColor", e.TEXT_STYLE = "textStyle", e.TEXT_SIZE = "textSize", e.TEXT_LINE_SPACING = "textLineSpacing", e.TEXT_ALIGN = "textAlign", e.FIXED_HEIGHT_SWITCHER = "fixedHeightSwitcherForm", e.HIDDEN_NODE = "hiddenNode", e.SMART_BLOCK = "smartBlock", e.SYNCHRONIZED_MODULE = "synchronizedModuleForm", e.FONT_FAMILY = "generalFontFamilyForm", e.BLOCK_INTERNAL_INDENTS = "generalBlockInternalIndents", e.STRUCTURE_INTERNAL_INDENTS = "generalStructureInternalIndents", e))(F || {}), H = /* @__PURE__ */ ((e) => (e.ADJUST_TO_WIDTH = "adjustToWidth", e.ALIGNMENT = "buttonAlignment", e.BORDER = "buttonBorder", e.BORDER_RADIUS = "buttonBorderRadius", e.COLOR = "buttonColor", e.BUTTON_BLOCK_BACKGROUND_COLOR = "buttonBlockBackgroundColor", e.EXTERNAL_INDENTS = "buttonExternalIndents", e.FIXED_HEIGHT = "buttonFixedHeightForm", e.FONT_COLOR = "buttonFontColor", e.FONT_FAMILY = "buttonFontFamily", e.FONT_SIZE = "buttonFontSize", e.FONT_WEIGHT = "buttonFontWeight", e.ICON = "buttonIconContainer", e.ICON_ALIGN = "buttonIconAlign", e.ICON_INDENT = "buttonIconIndent", e.ICON_WIDTH = "buttonIconWidth", e.IMAGE = "buttonImageForm", e.INTERNAL_INDENTS = "buttonInternalIndents", e.LINK = "buttonLink", e.MIME_TYPE = "buttonMimeTypeForm", e.SWITCHER_HOVERED_STYLES = "buttonSwitcherHoveredStylesForm", e.TEXT = "buttonText", e.TEXT_STYLE_AND_COLOR = "buttonTextStyleAndColorForm", e.HOVERED_BORDER_COLOR = "hoveredStyleBorderButtonForm", e.HOVERED_COLOR = "hoveredButtonColorForm", e.HOVERED_TEXT_COLOR = "hoveredButtonTextColorForm", e))(H || {}), k = /* @__PURE__ */ ((e) => (e.HIDDEN_NODE = "hiddenNodeText", e.PARAGRAPH_STYLE = "paragraphStyleForm", e.ALIGN = "textAlignmentForm", e.ANCHOR_CONTAINER = "textAnchorForm", e.FONT_BACKGROUND_COLOR = "textBlockFontBackgroundColor", e.TEXT_BLOCK_BACKGROUND_COLOR = "textBlockBackgroundColor", e.FONT_COLOR = "textBlockFontColor", e.TEXT_BLOCK_FONT_FAMILY = "textBlockFontFamily", e.FONT_FAMILY = "textFontFamily", e.FONT_SIZE = "textBlockFontSize", e.FONT_WEIGHT = "textBlockFontWeight", e.DIRECTION = "textBlockDirectionForm", e.INSERT_FORM = "textBlockInsertForm", e.LINK_DATA = "textBlockLinkDataForm", e.FORMAT = "textBlockTextFormatForm", e.FIXED_HEIGHT = "textFixedHeightForm", e.INTERNAL_INDENTS = "textInternalIndents", e.LINE_HEIGHT = "textLineHeightForm", e.MIME_TYPE = "textMimeTypeForm", e.NO_LINE_WRAPS = "textNoLineWrapsForm", e))(k || {}), p = /* @__PURE__ */ ((e) => (e.ALT_TEXT = "altText", e.LINK = "blockLink", e.ALIGNMENT = "imageAlignment", e.ANCHOR_LINK_CONTAINER = "imageAnchorLinkContainerForm", e.BORDER_RADIUS = "imageBorderRadiusForm", e.IMAGE = "imageImageForm", e.EXTERNAL_INDENTS = "imageExternalIndents", e.MIME_TYPE = "imageMimeTypeForm", e.RESPONSIVE = "imageResponsive", e.ROLLOVER_IMAGE = "imageRolloverImageForm", e.ROLLOVER_SWITCHER = "imageRolloverSwitcherForm", e.SIZE = "imageSizeContainer", e))(p || {}), ue = /* @__PURE__ */ ((e) => (e.BACKGROUND_COLOR = "containerBackgroundColorForm", e.BORDER_FORM = "containerBorderForm", e.BORDER_RADIUS = "containerBorderRadiusForm", e.EXTERNAL_INDENTS = "containerExternalIndentsForm", e.IMAGE_CONTAINER = "containerImageContainerForm", e.MIME_TYPE = "containerMimeTypeForm", e.DISPLAY_CONDITIONS = "displayConditions", e.HIDDEN_NODE = "containerHiddenNodeForm", e))(ue || {}), n = {
   BLOCK_BUTTON: H,
   BLOCK_TEXT: k,
   BLOCK_IMAGE: p,
   GENERAL: F
-}, Ie = /* @__PURE__ */ ((e) => (e.SAVE_AS_MODULE = "saveAsModule", e.IMPROVE_WITH_AI = "improveWithAI", e.MOVE = "move", e.COPY = "copy", e.REMOVE = "remove", e.CLEAR_CONTAINER = "clearContainer", e.EXTERNAL_DISPLAY_CONDITION = "externalDisplayCondition", e))(Ie || {}), ce = /* @__PURE__ */ ((e) => (e.previewDeviceMode = "previewDeviceMode", e.panelPosition = "panelPosition", e.themeMode = "themeMode", e))(ce || {}), Te = /* @__PURE__ */ ((e) => (e.DESKTOP = "DESKTOP", e.MOBILE = "MOBILE", e))(Te || {}), be = /* @__PURE__ */ ((e) => (e.SETTINGS = "settings", e.STYLES = "styles", e.DATA = "data", e))(be || {}), a = {
+}, Ie = /* @__PURE__ */ ((e) => (e.SAVE_AS_MODULE = "saveAsModule", e.IMPROVE_WITH_AI = "improveWithAI", e.MOVE = "move", e.COPY = "copy", e.REMOVE = "remove", e.CLEAR_CONTAINER = "clearContainer", e.EXTERNAL_DISPLAY_CONDITION = "externalDisplayCondition", e))(Ie || {}), Te = /* @__PURE__ */ ((e) => (e.previewDeviceMode = "previewDeviceMode", e.panelPosition = "panelPosition", e.themeMode = "themeMode", e))(Te || {}), ce = /* @__PURE__ */ ((e) => (e.DESKTOP = "DESKTOP", e.MOBILE = "MOBILE", e))(ce || {}), be = /* @__PURE__ */ ((e) => (e.SETTINGS = "settings", e.STYLES = "styles", e.DATA = "data", e))(be || {}), a = {
   name: "name",
   disabled: "disabled"
 }, he = {
@@ -619,7 +619,7 @@ var j = {
   }
 };
 G.REQUIRED_METHODS = ["getId", "getTemplate"];
-var ct = G, Xe = class m extends i {
+var Tt = G, Xe = class m extends i {
   constructor() {
     super(m.REQUIRED_METHODS, m);
   }
@@ -694,7 +694,7 @@ var V = class extends x {
     const t = e.querySelectorAll(I.IMAGE), r = e.asElement().hasClass(K) ? [e] : [];
     return t.length ? t : r;
   }
-}, Tt = class extends V {
+}, ct = class extends V {
   getParentControlId() {
     return n.BLOCK_IMAGE.EXTERNAL_INDENTS;
   }
@@ -1215,17 +1215,17 @@ export {
   It as ButtonTextStyleAndFontColorBuiltInControl,
   ue as ContainerControls,
   Ie as ContextActionType,
-  ct as Control,
-  ce as EditorStatePropertyType,
+  Tt as Control,
+  Te as EditorStatePropertyType,
   Ve as Extension,
   Nt as ExtensionBuilder,
   F as GeneralControls,
   Dt as IconsRegistry,
   p as ImageControls,
-  Tt as ImageMarginsBuiltInControl,
+  ct as ImageMarginsBuiltInControl,
   bt as ImageSizeBuiltInControl,
   St as ModificationDescription,
-  Te as PreviewDeviceMode,
+  ce as PreviewDeviceMode,
   ht as SettingsPanelRegistry,
   mt as SettingsPanelTab,
   be as SettingsTab,

package/dist/package.json.js

@@ -1,4 +1,4 @@
-const o = { stripo: { version: "2.69.1" } }, s = {
+const o = { stripo: { version: "2.72.1" } }, s = {
   guido: o
 };
 export {

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

@@ -14,8 +14,9 @@ export declare function parseRecommendationVariable(field: string): {
  * `{{recoId_index_attribute}}` variables: the built-in compiler attributes plus
  * each account attribute in its canonical token form — bare for
  * `defaultAttribute`, `product_attribute.<name>` for `productAttribute`. Using
- * `resolveProductAttrValue` (the same producer the block builder uses) keeps the
- * validator's notion of "valid form" identical to what is actually emitted.
+ * `filterToProductAttrValue` (the same producer the block builder uses) keeps the
+ * validator's notion of "valid form" identical to what is actually emitted, and
+ * admits both forms when a default and a custom attribute share a name.
  */
 export declare function buildPartnerAttributeNameSet(filterList: FiltersResponse): Set<string>;
 /**

package/dist/src/config/migrator/recommendation/types.d.ts

@@ -193,6 +193,7 @@ export type PerElementStyles = Record<string, MappedTextStyle | MappedButtonStyl
 export interface MappedComposition {
     composition: string[];
     visibility: Record<string, boolean>;
+    /** Canonical `product-attr` values, mirrored into `data-custom-attributes`. */
     customAttributes: string[];
     /** Mapping of customAttr key → full `product-attr` value. */
     customAttrValues: Record<string, string>;

package/dist/src/extensions/Blocks/Recommendation/constants/index.d.ts

@@ -8,6 +8,6 @@
  */
 export { RecommendationBlockId } from './blockIds';
 export { RecommendationControlId } from './controlIds';
-export { BLOCK_ROOT_SELECTOR, CONTAINER_SELECTOR, DESKTOP_CONTAINER_SELECTOR, MOBILE_CONTAINER_SELECTOR, MOBILE_ROW_SELECTOR, CSS_CLASS_RECO_BUTTON, CSS_CLASS_SKIP_COMPILE, RECOMMENDATION_VARIABLE_BUILTIN_ATTRIBUTES, CURRENCY_ATTR, ATTR_PRODUCT_IMAGE, ATTR_PRODUCT_NAME, ATTR_PRODUCT_PRICE, ATTR_PRODUCT_OLD_PRICE, ATTR_PRODUCT_OMNIBUS_PRICE, ATTR_PRODUCT_OMNIBUS_DISCOUNT, ATTR_PRODUCT_BUTTON, ATTR_CUSTOM_PREFIX, ATTR_DATA_CUSTOM_ATTRIBUTES, ATTR_PRODUCT_ATTR, PRODUCT_ATTRIBUTE_PREFIX, BUILT_IN_DEFAULT_ATTRIBUTES, } from './selectors';
+export { BLOCK_ROOT_SELECTOR, CONTAINER_SELECTOR, DESKTOP_CONTAINER_SELECTOR, MOBILE_CONTAINER_SELECTOR, MOBILE_ROW_SELECTOR, CSS_CLASS_RECO_BUTTON, CSS_CLASS_SKIP_COMPILE, RECOMMENDATION_VARIABLE_BUILTIN_ATTRIBUTES, CURRENCY_ATTR, ATTR_PRODUCT_IMAGE, ATTR_PRODUCT_NAME, ATTR_PRODUCT_PRICE, ATTR_PRODUCT_OLD_PRICE, ATTR_PRODUCT_OMNIBUS_PRICE, ATTR_PRODUCT_OMNIBUS_DISCOUNT, ATTR_PRODUCT_BUTTON, ATTR_CUSTOM_PREFIX, ATTR_DATA_CUSTOM_ATTRIBUTES, ATTR_PRODUCT_ATTR, SELECTOR_ATTRIBUTE_ROW, ATTR_DATA_ATTRIBUTE_TYPE, PRODUCT_ATTRIBUTE_PREFIX, BUILT_IN_DEFAULT_ATTRIBUTES, } from './selectors';
 export { LAYOUT_VALUES, LAYOUT_OPTIONS, DEFAULT_PRODUCTS_PER_ROW, DEFAULT_CARDS_IN_ROW, DEFAULT_MOBILE_CARDS_IN_ROW, MAX_PRODUCT_COUNT, MIN_PRODUCT_COUNT, MAX_PRODUCTS_PER_ROW, MIN_PRODUCTS_PER_ROW, MAX_MOBILE_PRODUCTS_PER_ROW, MIN_MOBILE_PRODUCTS_PER_ROW, DEFAULT_COLUMN_SPACING, DEFAULT_ROW_SPACING, DEFAULT_MOBILE_COLUMN_SPACING, DEFAULT_MOBILE_ROW_SPACING, MIN_SPACING, MAX_SPACING, SPACING_STEP, } from './layout';
 export { DEFAULT_NODE_CONFIG, DEFAULT_CURRENCY, DEFAULT_COMPOSITION, DEFAULT_VISIBILITY, CURRENT_CONFIG_VERSION, EXCLUDED_ALGORITHM_IDS, } from './defaultConfig';

package/dist/src/extensions/Blocks/Recommendation/constants/selectors.d.ts

@@ -68,6 +68,10 @@ export declare const ATTR_CUSTOM_PREFIX = "customAttr:";
 export declare const ATTR_DATA_CUSTOM_ATTRIBUTES = "data-custom-attributes";
 /** HTML attribute on <td> elements identifying the product attribute for compiler template variable generation */
 export declare const ATTR_PRODUCT_ATTR = "product-attr";
+/** Row wrapper of one composition entry inside a product card */
+export declare const SELECTOR_ATTRIBUTE_ROW = ".recommendation-attribute-row";
+/** HTML attribute on an attribute row holding its composition key */
+export declare const ATTR_DATA_ATTRIBUTE_TYPE = "data-attribute-type";
 /** Prefix `resolveProductAttrValue` puts on custom (non-default) product attributes in `product-attr` values */
 export declare const PRODUCT_ATTRIBUTE_PREFIX = "product_attribute.";
 /**

package/dist/src/extensions/Blocks/Recommendation/controls/cardComposition/index.d.ts

@@ -29,6 +29,8 @@ export declare class RecommendationCardCompositionControl extends CommonControl
     private _initializeComposition;
     private _registerValueChangeListeners;
     private _readCompositionFromNode;
+    /** Upgrades legacy bare-name custom keys to the canonical form. (SD-147101) */
+    private _normalizeComposition;
     private _readCustomAttributesFromNode;
     private _readVisibilityFromRows;
     private _getDefaultVisibilities;
@@ -61,7 +63,15 @@ export declare class RecommendationCardCompositionControl extends CommonControl
     private _createPriceGroupItemHtml;
     private _createCustomItemHtml;
     /**
-     * Builds select options from the store's filterList.
+     * Dropdown label of an attribute. A partner can own a default and a custom
+     * attribute under the same name; the type is spelled out only then, so partners
+     * without a collision keep clean labels. (SD-147101)
+     */
+    private _toOptionLabel;
+    /**
+     * Builds select options from the store's filterList. Option values are
+     * `product-attr` values, so a default attribute and a same-named custom one
+     * never collapse onto a single option. (SD-147101)
      * Falls back to a single option for the currently selected attribute.
      */
     private _getSelectOptions;
@@ -144,6 +154,12 @@ export declare class RecommendationCardCompositionControl extends CommonControl
      */
     private _onCustomAttributeChanged;
     private _onReorder;
+    /**
+     * Outer HTML of an existing attribute row, rewritten to the canonical key when
+     * the row still carries a legacy bare-name one. Copying rows this way lets the
+     * DOM converge on the next composition change without writing on open.
+     */
+    private _getExistingRowHtml;
     private _injectCustomAttributeHtml;
     private _injectGridAttributeRow;
     private _injectListAttributeRow;
@@ -204,13 +220,14 @@ export declare class RecommendationCardCompositionControl extends CommonControl
      */
     private _subscribeToStoreChanges;
     /**
-     * Returns filters eligible for the custom attribute dropdown,
-     * excluding default attributes already covered by built-in toggle items.
+     * Returns filters eligible for the custom attribute dropdown, excluding default
+     * attributes already covered by built-in toggle items.
      */
     private _getAddableFilters;
     /**
-     * Looks up the display name for an attribute from the store's filterList.
-     * Falls back to Title Case conversion of the snake_case attribute name.
+     * Looks up the display name for a `product-attr` value from the store's filterList.
+     * Matches on the canonical value, so a default and a same-named custom attribute
+     * resolve to their own entry. Falls back to Title Case of the bare name.
      */
     private _getDisplayNameForAttribute;
     /**

package/dist/src/extensions/Blocks/Recommendation/templates/utils.d.ts

@@ -43,22 +43,23 @@ export declare function resolveInlinePriceOrder(composition: string[]): {
  */
 export declare function toDisplayableAttributeValue(value: unknown): string | undefined;
 /**
- * Checks whether an attribute is a default (top-level) product attribute
- * vs a custom product attribute (nested under `product_attributes`).
- * Returns false when filterList is empty or the attribute is not found.
+ * Name-only type lookup — **legacy fallback only**; the canonical path uses
+ * `isDefaultProductAttr` on the `product-attr` value. A bare name is the canonical
+ * form of a default attribute, so a duplicated name resolves to the default rather
+ * than to whichever entry the filter list happens to enumerate first. (SD-147101)
  */
 export declare function isDefaultAttribute(attrName: string, filterList: FiltersResponse): boolean;
 /**
- * Resolves the `product-attr` HTML attribute value based on attribute type from the filter list.
- * - Default attributes → attribute name directly (e.g., "brand") → compiles to `{{1_0_brand}}`
- * - Product attributes → "product_attribute.<name>" (e.g., "product_attribute.rating_star")
+ * Name-only `product-attr` resolution — **legacy fallback only**, see
+ * `isDefaultAttribute`. Prefer `filterToProductAttrValue`, which reads the type off
+ * the filter entry itself.
  */
 export declare function resolveProductAttrValue(attrName: string, filterList: FiltersResponse): string;
 /**
- * Reverse of `resolveProductAttrValue`: maps a cell's `product-attr` value back to its
- * `customAttr:<name>` composition key. The resolver only ever emits `<name>` (default
- * attribute) or `product_attribute.<name>` (custom product attribute), so stripping the
- * prefix recovers the attribute name without needing the store's filter list.
+ * Maps a cell's `product-attr` value to its composition key. The value is the
+ * canonical identity, so it is carried into the key verbatim — stripping the
+ * `product_attribute.` prefix here would collapse a default and a same-named
+ * custom attribute onto one key.
  */
 export declare function toCustomCompositionKey(productAttrValue: string): string;
 /**
@@ -184,7 +185,7 @@ export interface RenderOptions {
  * `RenderOptions`. Single source for both the stacked per-cell options and the two inline
  * (price + old-price) option sets, so style capture → re-bake stays consistent across layouts.
  */
-export declare function buildCellOptions(attrType: string, renderOptions: RenderOptions): CellRenderOptions;
+export declare function buildCellOptions(attrType: string, renderOptions: RenderOptions, composition?: string[]): CellRenderOptions;
 /**
  * Options for prepareProductRows unified function
  */

package/dist/src/extensions/Blocks/Recommendation/utils/compositionKeys.d.ts

@@ -0,0 +1,52 @@
+import type { FiltersResponse } from '@@/Types/recommendation';
+import type { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
+/**
+ * Canonical identity of a card-composition custom attribute is its `product-attr`
+ * value — `brand` for a default attribute, `product_attribute.brand` for a custom
+ * one. A partner can own both under the same name, and only this form tells them
+ * apart. (SD-147101)
+ */
+type FilterEntry = FiltersResponse[string];
+/** True when a `product-attr` value refers to a top-level (default) product field. */
+export declare function isDefaultProductAttr(productAttrValue: string): boolean;
+/** The bare attribute name behind a `product-attr` value (`product_attribute.brand` → `brand`). */
+export declare function bareAttributeName(productAttrValue: string): string;
+/** `customAttr:product_attribute.brand` → `product_attribute.brand`. */
+export declare function compositionKeyToProductAttr(compositionKey: string): string;
+/** `product_attribute.brand` → `customAttr:product_attribute.brand`. */
+export declare function productAttrToCompositionKey(productAttrValue: string): string;
+/**
+ * Canonical identity of a filter entry. Reads the type off the entry itself, so
+ * two same-named filters never collapse onto one value.
+ */
+export declare function filterToProductAttrValue(filter: FilterEntry): string;
+/**
+ * Filter entry behind a bare attribute name. A bare name is the canonical form of a
+ * DEFAULT attribute, so the default wins a name collision; the custom entry is only
+ * reached when it is the sole match (a genuinely legacy key). (SD-147101)
+ */
+export declare function findFilterByBareName(bareName: string, filterList: FiltersResponse): FilterEntry | undefined;
+/** Composition array with every `customAttr:*` key upgraded to the canonical form. */
+export declare function normalizeCompositionKeys(composition: string[], blockNode?: ImmutableHtmlNode | null, filterList?: FiltersResponse): string[];
+/**
+ * `data-custom-attributes` upgraded to canonical values. Index-preserving: the
+ * Nth entry must keep mapping to the Nth `customAttr:*` composition key.
+ */
+export declare function normalizeCustomAttrValues(values: string[], blockNode?: ImmutableHtmlNode | null, filterList?: FiltersResponse): string[];
+/**
+ * Composition key of an attribute row. Custom rows are keyed by their `product-attr`
+ * value, which stays correct on rows still tagged with a legacy bare name.
+ */
+export declare function resolveRowCompositionKey(row: ImmutableHtmlNode): string | null;
+/**
+ * Finds an attribute row by composition key, tolerating rows still tagged with the
+ * legacy bare-name key. Custom candidates are validated against their `product-attr`,
+ * so a legacy custom `brand` row is never mistaken for the default `brand`.
+ */
+export declare function findAttributeRow(container: ImmutableHtmlNode, compositionKey: string): ImmutableHtmlNode | null;
+/**
+ * Rewrites a copied row's legacy `data-attribute-type` to the canonical key so the
+ * DOM converges on the user's next composition change (no write on mere open).
+ */
+export declare function rewriteLegacyRowKeyHtml(rowHtml: string, compositionKey: string): string;
+export {};

package/dist/src/extensions/Blocks/common-control.d.ts

@@ -34,6 +34,8 @@ interface SelectProps {
     placeholder: string;
     options: TextValueObject[];
     className?: string;
+    /** Adds the picker's built-in search box. Worth it once the list gets long. */
+    searchable?: boolean;
 }
 interface CounterProps {
     name: string;
@@ -105,7 +107,7 @@ export declare abstract class CommonControl extends Control {
         text: string;
         value: string;
     }): string;
-    _GuSelect({ name, placeholder, options, className }: SelectProps): string;
+    _GuSelect({ name, placeholder, options, className, searchable, }: SelectProps): string;
     _GuTextInput({ name, placeholder, className, disabled }: TextInputProps): string;
     _GuCounter({ name, maxValue, minValue, step }: CounterProps): string;
     _GuRadioButtonItem({ text, value, icon }: {