@useinsider/guido 3.15.0 → 3.16.0-beta.0faee0c

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

@@ -0,0 +1,89 @@
+import { ATTR_CUSTOM_PREFIX as s, ATTR_PRODUCT_ATTR as i, PRODUCT_ATTRIBUTE_PREFIX as f, ATTR_DATA_ATTRIBUTE_TYPE as l, SELECTOR_ATTRIBUTE_ROW as R } from "../constants/selectors.js";
+function d(t) {
+  return !t.startsWith(f);
+}
+function y(t) {
+  return t.startsWith(f) ? t.substring(f.length) : t;
+}
+function T(t) {
+  return t.startsWith(s) ? t.substring(s.length) : t;
+}
+function A(t) {
+  return `${s}${t}`;
+}
+function P(t) {
+  return t.type === "defaultAttribute" ? t.attributeName : `${f}${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 a(t, r) {
+  return t && "getAttribute" in t ? t.getAttribute(r) : null;
+}
+function m(t, r, n = {}) {
+  const e = `${s}${t}`, u = r == null ? void 0 : r.querySelector(
+    `${R}[${l}="${e}"]`
+  ), c = a(u, i) ?? a(u == null ? void 0 : u.querySelector(`[${i}]`), i);
+  if (c)
+    return c;
+  const o = _(t, n);
+  return o ? P(o) : t;
+}
+function g(t, r, n = {}) {
+  return t.startsWith(f) ? t : m(t, r, n);
+}
+function C(t, r, n = {}) {
+  return t.map((e) => {
+    if (!e.startsWith(s))
+      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 = a(t, l);
+  if (!(r != null && r.startsWith(s)))
+    return r;
+  const n = "querySelector" in t ? t.querySelector(`[${i}]`) : void 0, e = a(n, i);
+  return e ? A(e) : r;
+}
+function $(t, r, n) {
+  const e = a(t, i), u = a(t.querySelector(`[${i}]`), i), c = e ?? u;
+  return c === null ? n : c === r;
+}
+function W(t, r) {
+  const n = (h) => t.querySelector(
+    `${R}[${l}="${h}"]`
+  );
+  if (!r.startsWith(s))
+    return n(r) ?? null;
+  const e = T(r), u = n(r);
+  if (u && $(u, e, !0))
+    return u;
+  const c = A(y(e)), o = c === r ? void 0 : n(c);
+  return o && $(o, e, !1) ? o : null;
+}
+function q(t, r) {
+  const n = T(r), e = A(y(n));
+  return e === r ? t : t.replace(
+    `${l}="${e}"`,
+    `${l}="${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}>
         `;
   }