@florid-kit/components 0.10.19 → 0.10.20

package/index.mjs

@@ -3,7 +3,7 @@
  * Copyright 2019 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const At = globalThis, Vt = At.ShadowRoot && (At.ShadyCSS === void 0 || At.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, Zt = Symbol(), le = /* @__PURE__ */ new WeakMap();
+const Lt = globalThis, Vt = Lt.ShadowRoot && (Lt.ShadyCSS === void 0 || Lt.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, Zt = Symbol(), le = /* @__PURE__ */ new WeakMap();
 let xe = class {
   constructor(t, e, n) {
     if (this._$cssResult$ = !0, n !== Zt) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
@@ -22,23 +22,23 @@ let xe = class {
     return this.cssText;
   }
 };
-const Le = (o) => new xe(typeof o == "string" ? o : o + "", void 0, Zt), f = (o, ...t) => {
+const Ae = (o) => new xe(typeof o == "string" ? o : o + "", void 0, Zt), v = (o, ...t) => {
   const e = o.length === 1 ? o[0] : t.reduce((n, i, r) => n + ((s) => {
     if (s._$cssResult$ === !0) return s.cssText;
     if (typeof s == "number") return s;
     throw Error("Value passed to 'css' function must be a 'css' function result: " + s + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
   })(i) + o[r + 1], o[0]);
   return new xe(e, o, Zt);
-}, Ae = (o, t) => {
+}, Le = (o, t) => {
   if (Vt) o.adoptedStyleSheets = t.map((e) => e instanceof CSSStyleSheet ? e : e.styleSheet);
   else for (const e of t) {
-    const n = document.createElement("style"), i = At.litNonce;
+    const n = document.createElement("style"), i = Lt.litNonce;
     i !== void 0 && n.setAttribute("nonce", i), n.textContent = e.cssText, o.appendChild(n);
   }
 }, ce = Vt ? (o) => o : (o) => o instanceof CSSStyleSheet ? ((t) => {
   let e = "";
   for (const n of t.cssRules) e += n.cssText;
-  return Le(e);
+  return Ae(e);
 })(o) : o;
 /**
  * @license
@@ -159,7 +159,7 @@ let ct = class extends HTMLElement {
   }
   createRenderRoot() {
     const t = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
-    return Ae(t, this.constructor.elementStyles), t;
+    return Le(t, this.constructor.elementStyles), t;
   }
   connectedCallback() {
     var t;
@@ -294,10 +294,10 @@ const Fe = (o, t) => {
   let i, r = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", s = ft;
   for (let c = 0; c < e; c++) {
     const h = o[c];
-    let x, _, v = -1, V = 0;
-    for (; V < h.length && (s.lastIndex = V, _ = s.exec(h), _ !== null); ) V = s.lastIndex, s === ft ? _[1] === "!--" ? s = ue : _[1] !== void 0 ? s = fe : _[2] !== void 0 ? (ke.test(_[2]) && (i = RegExp("</" + _[2], "g")), s = it) : _[3] !== void 0 && (s = it) : s === it ? _[0] === ">" ? (s = i ?? ft, v = -1) : _[1] === void 0 ? v = -2 : (v = s.lastIndex - _[2].length, x = _[1], s = _[3] === void 0 ? it : _[3] === '"' ? ge : ve) : s === ge || s === ve ? s = it : s === ue || s === fe ? s = ft : (s = it, i = void 0);
+    let f, x, g = -1, V = 0;
+    for (; V < h.length && (s.lastIndex = V, x = s.exec(h), x !== null); ) V = s.lastIndex, s === ft ? x[1] === "!--" ? s = ue : x[1] !== void 0 ? s = fe : x[2] !== void 0 ? (ke.test(x[2]) && (i = RegExp("</" + x[2], "g")), s = it) : x[3] !== void 0 && (s = it) : s === it ? x[0] === ">" ? (s = i ?? ft, g = -1) : x[1] === void 0 ? g = -2 : (g = s.lastIndex - x[2].length, f = x[1], s = x[3] === void 0 ? it : x[3] === '"' ? ge : ve) : s === ge || s === ve ? s = it : s === ue || s === fe ? s = ft : (s = it, i = void 0);
     const Y = s === it && o[c + 1].startsWith("/>") ? " " : "";
-    r += s === ft ? h + Te : v >= 0 ? (n.push(x), h.slice(0, v) + we + h.slice(v) + J + Y) : h + J + (v === -2 ? c : Y);
+    r += s === ft ? h + Te : g >= 0 ? (n.push(f), h.slice(0, g) + we + h.slice(g) + J + Y) : h + J + (g === -2 ? c : Y);
   }
   return [_e(o, r + (o[e] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), n];
 };
@@ -306,29 +306,29 @@ class xt {
     let i;
     this.parts = [];
     let r = 0, s = 0;
-    const c = t.length - 1, h = this.parts, [x, _] = Fe(t, e);
-    if (this.el = xt.createElement(x, n), nt.currentNode = this.el.content, e === 2 || e === 3) {
-      const v = this.el.content.firstChild;
-      v.replaceWith(...v.childNodes);
+    const c = t.length - 1, h = this.parts, [f, x] = Fe(t, e);
+    if (this.el = xt.createElement(f, n), nt.currentNode = this.el.content, e === 2 || e === 3) {
+      const g = this.el.content.firstChild;
+      g.replaceWith(...g.childNodes);
     }
     for (; (i = nt.nextNode()) !== null && h.length < c; ) {
       if (i.nodeType === 1) {
-        if (i.hasAttributes()) for (const v of i.getAttributeNames()) if (v.endsWith(we)) {
-          const V = _[s++], Y = i.getAttribute(v).split(J), Lt = /([.?@])?(.*)/.exec(V);
-          h.push({ type: 1, index: r, name: Lt[2], strings: Y, ctor: Lt[1] === "." ? Ue : Lt[1] === "?" ? Ne : Lt[1] === "@" ? qe : Ot }), i.removeAttribute(v);
-        } else v.startsWith(J) && (h.push({ type: 6, index: r }), i.removeAttribute(v));
+        if (i.hasAttributes()) for (const g of i.getAttributeNames()) if (g.endsWith(we)) {
+          const V = x[s++], Y = i.getAttribute(g).split(J), At = /([.?@])?(.*)/.exec(V);
+          h.push({ type: 1, index: r, name: At[2], strings: Y, ctor: At[1] === "." ? Ue : At[1] === "?" ? Ne : At[1] === "@" ? qe : Ot }), i.removeAttribute(g);
+        } else g.startsWith(J) && (h.push({ type: 6, index: r }), i.removeAttribute(g));
         if (ke.test(i.tagName)) {
-          const v = i.textContent.split(J), V = v.length - 1;
+          const g = i.textContent.split(J), V = g.length - 1;
           if (V > 0) {
             i.textContent = Bt ? Bt.emptyScript : "";
-            for (let Y = 0; Y < V; Y++) i.append(v[Y], yt()), nt.nextNode(), h.push({ type: 2, index: ++r });
-            i.append(v[V], yt());
+            for (let Y = 0; Y < V; Y++) i.append(g[Y], yt()), nt.nextNode(), h.push({ type: 2, index: ++r });
+            i.append(g[V], yt());
           }
         }
       } else if (i.nodeType === 8) if (i.data === $e) h.push({ type: 2, index: r });
       else {
-        let v = -1;
-        for (; (v = i.data.indexOf(J, v + 1)) !== -1; ) h.push({ type: 7, index: r }), v += J.length - 1;
+        let g = -1;
+        for (; (g = i.data.indexOf(J, g + 1)) !== -1; ) h.push({ type: 7, index: r }), g += J.length - 1;
       }
       r++;
     }
@@ -361,8 +361,8 @@ class Re {
     let r = nt.nextNode(), s = 0, c = 0, h = n[0];
     for (; h !== void 0; ) {
       if (s === h.index) {
-        let x;
-        h.type === 2 ? x = new Et(r, r.nextSibling, this, t) : h.type === 1 ? x = new h.ctor(r, h.name, h.strings, this, t) : h.type === 6 && (x = new Ve(r, this, t)), this._$AV.push(x), h = n[++c];
+        let f;
+        h.type === 2 ? f = new Et(r, r.nextSibling, this, t) : h.type === 1 ? f = new h.ctor(r, h.name, h.strings, this, t) : h.type === 6 && (f = new Ve(r, this, t)), this._$AV.push(f), h = n[++c];
       }
       s !== (h == null ? void 0 : h.index) && (r = nt.nextNode(), s++);
     }
@@ -452,8 +452,8 @@ class Ot {
     if (r === void 0) t = ht(this, t, e, 0), s = !mt(t) || t !== this._$AH && t !== tt, s && (this._$AH = t);
     else {
       const c = t;
-      let h, x;
-      for (t = r[0], h = 0; h < r.length - 1; h++) x = ht(this, c[n + h], e, h), x === tt && (x = this._$AH[h]), s || (s = !mt(x) || x !== this._$AH[h]), x === d ? t = d : t !== d && (t += (x ?? "") + r[h + 1]), this._$AH[h] = x;
+      let h, f;
+      for (t = r[0], h = 0; h < r.length - 1; h++) f = ht(this, c[n + h], e, h), f === tt && (f = this._$AH[h]), s || (s = !mt(f) || f !== this._$AH[h]), f === d ? t = d : t !== d && (t += (f ?? "") + r[h + 1]), this._$AH[h] = f;
     }
     s && !i && this.j(t);
   }
@@ -554,7 +554,7 @@ jt == null || jt({ LitElement: u });
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const g = (o) => (t, e) => {
+const b = (o) => (t, e) => {
   e !== void 0 ? e.addInitializer(() => {
     customElements.define(o, t);
   }) : customElements.define(o, t);
@@ -621,11 +621,11 @@ function Ce(o, t) {
     } });
   };
 }
-const at = f`
+const at = v`
 	outline: 1px dashed var(--color-border-primary);
 	outline-offset: 2px;
 `;
-f`
+v`
 	:host * {
 		box-sizing: border-box;
 	}
@@ -775,7 +775,7 @@ const Ye = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="h
 </svg>`, Eo = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M4.5 8L11.5 13L11.5 3L4.5 8Z" fill="#3F2B2E"/>
 </svg>
-`, Lo = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, Ao = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M11.5 8L4.5 13L4.5 3L11.5 8Z" fill="#3F2B2E"/>
 </svg>
 `, Z = {
@@ -805,8 +805,8 @@ const Ye = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="h
   backToBag: Co,
   checkbox: So,
   sliderLeftArrow: Eo,
-  sliderRightArrow: Lo
-}, Ao = {
+  sliderRightArrow: Ao
+}, Lo = {
   strikeDiagonal: xo
 }, Po = {
   success: $o,
@@ -1090,7 +1090,7 @@ let B = class extends u {
 		`;
   }
 };
-B.styles = f`
+B.styles = v`
 		:host {
 			display: inline-flex;
 			justify-content: center;
@@ -1301,9 +1301,9 @@ R([
   a({ type: String })
 ], B.prototype, "srLabel", 2);
 B = R([
-  g("o-icon-button")
+  b("o-icon-button")
 ], B);
-var Ro = Object.defineProperty, Uo = Object.getOwnPropertyDescriptor, b = (o, t, e, n) => {
+var Ro = Object.defineProperty, Uo = Object.getOwnPropertyDescriptor, y = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Uo(t, e) : t, r = o.length - 1, s; r >= 0; r--)
     (s = o[r]) && (i = (n ? s(t, e, i) : s(i)) || i);
   return n && i && Ro(t, e, i), i;
@@ -1393,31 +1393,40 @@ let p = class extends u {
     return t;
   }
   trapFocus(o) {
-    var i;
+    var r;
     if (o.key !== "Tab") return;
     const t = this.shadowRoot;
     if (!t) return;
     const e = this.getDeepActiveElement();
     if (this.showDetail) {
-      const r = t.querySelector(".detail-view .return-btn"), s = t.querySelector(".detail-view .close-btn"), c = r ? this.resolveFocusable(r) : null, h = s ? this.resolveFocusable(s) : null;
-      if (o.shiftKey && c && e === c && h) {
-        o.preventDefault(), o.stopPropagation(), h.focus({ preventScroll: !0 });
+      const s = t.querySelector(".detail-view .return-btn"), c = t.querySelector(".detail-view .close-btn"), h = s ? this.resolveFocusable(s) : null, f = c ? this.resolveFocusable(c) : null;
+      if (o.shiftKey && h && e === h && f) {
+        o.preventDefault(), o.stopPropagation(), f.focus({ preventScroll: !0 });
         return;
       }
-      if (!o.shiftKey && h && e === h) {
-        o.preventDefault(), o.stopPropagation(), (((i = t.querySelector(".detail-scroller")) == null ? void 0 : i.querySelector(
+      if (!o.shiftKey && f && e === f) {
+        o.preventDefault(), o.stopPropagation(), (((r = t.querySelector(".detail-scroller")) == null ? void 0 : r.querySelector(
           p.focusablesSelector
-        )) ?? c ?? h).focus({ preventScroll: !0 });
+        )) ?? h ?? f).focus({ preventScroll: !0 });
         return;
       }
     }
-    const n = this.renderRoot.querySelector(".close-btn");
-    if (!o.shiftKey && n && n.contains(e)) {
+    if (document.querySelector("#refineandsortpopin")) {
+      const s = t.querySelector(".close-btn"), c = s ? this.resolveFocusable(s) : null, h = t.querySelector(".js-clear-refinements"), f = h ? this.resolveFocusable(h) : null, x = (g) => {
+        o.preventDefault(), o.stopPropagation(), g.focus({ preventScroll: !0 });
+      };
+      if (c && f) {
+        if (!o.shiftKey && e === f) return x(c);
+        if (o.shiftKey && e === c) return x(f);
+      }
+    }
+    const i = this.renderRoot.querySelector(".close-btn");
+    if (!o.shiftKey && i && i.contains(e)) {
       o.preventDefault();
-      const r = this.renderRoot.querySelector(
+      const s = this.renderRoot.querySelector(
         ".o-whats-inside--content p"
       );
-      r == null || r.focus();
+      s == null || s.focus();
     }
   }
   getFocusableElements() {
@@ -1585,7 +1594,7 @@ let p = class extends u {
 		`;
   }
 };
-p.styles = f`
+p.styles = v`
 		:host {
 			--z-overlay: 99;
 			--z-panel: 100;
@@ -1828,85 +1837,85 @@ p.shadowRootOptions = {
   // This helps send focus into the first focusable in shadow when host is focused
   delegatesFocus: !0
 };
-b([
+y([
   a({ type: Boolean, reflect: !0 })
 ], p.prototype, "open", 2);
-b([
+y([
   a({ type: Boolean, reflect: !0 })
 ], p.prototype, "showHeader", 2);
-b([
+y([
   a({ type: Boolean, reflect: !0 })
 ], p.prototype, "showFooter", 2);
-b([
+y([
   a({ type: Boolean, reflect: !0 })
 ], p.prototype, "showHeaderStartIcon", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "headerTitle", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "headerTitleClassName", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "labelDialog", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "addToBagProductCount", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "closeButtonLabel", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "goBackButtonLabel", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "firstButtonLabel", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "firstButtonVariant", 2);
-b([
+y([
   a({ type: Object, reflect: !0 })
 ], p.prototype, "firstButtonProps", 2);
-b([
+y([
   a({ type: Boolean, reflect: !0 })
 ], p.prototype, "onFirstButtonClickClose", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "secondButtonLabel", 2);
-b([
+y([
   a({ type: String, reflect: !0 })
 ], p.prototype, "secondButtonVariant", 2);
-b([
+y([
   a({ type: Object, reflect: !0 })
 ], p.prototype, "secondButtonProps", 2);
-b([
+y([
   a({ type: Boolean, reflect: !0 })
 ], p.prototype, "onSecondButtonClickClose", 2);
-b([
+y([
   a({ type: Boolean, reflect: !0 })
 ], p.prototype, "disablePortal", 2);
-b([
+y([
   a({ type: Number, reflect: !0 })
 ], p.prototype, "zIndex", 2);
-b([
+y([
   a({ type: Boolean, reflect: !0 })
 ], p.prototype, "initialized", 2);
-b([
+y([
   a({ type: Boolean })
 ], p.prototype, "showDetail", 2);
-b([
+y([
   a({ type: Boolean })
 ], p.prototype, "isHidingDetail", 2);
-p = b([
-  g("o-side-panel")
+p = y([
+  b("o-side-panel")
 ], p);
-var No = Object.defineProperty, qo = Object.getOwnPropertyDescriptor, k = (o, t, e, n) => {
+var No = Object.defineProperty, qo = Object.getOwnPropertyDescriptor, _ = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? qo(t, e) : t, r = o.length - 1, s; r >= 0; r--)
     (s = o[r]) && (i = (n ? s(t, e, i) : s(i)) || i);
   return n && i && No(t, e, i), i;
 };
 const Vo = Xt(u);
-let y = class extends Vo {
+let m = class extends Vo {
   constructor() {
     super(...arguments), this.type = "submit", this.value = "", this.variant = "primary", this.text = "", this.textsecond = "", this.fullwidth = !1, this.disabled = !1, this.startIconModel = "", this.endIconModel = "", this.startIcon = !1, this.endIcon = !1, this.panelTarget = "", this.href = "", this.target = "", this.underlined = !1, this.withbadge = !1;
   }
@@ -1974,9 +1983,9 @@ let y = class extends Vo {
     `;
   }
 };
-Xe(y);
-y.formAssociated = !0;
-y.styles = f`
+Xe(m);
+m.formAssociated = !0;
+m.styles = v`
     :host {
       --button-border: transparent;
       --badge-outer-width: 19px;
@@ -2183,57 +2192,57 @@ y.styles = f`
       transform: translateX(4px);
     }
   `;
-k([
+_([
   a()
-], y.prototype, "type", 2);
-k([
+], m.prototype, "type", 2);
+_([
   a()
-], y.prototype, "value", 2);
-k([
+], m.prototype, "value", 2);
+_([
   a({ type: String, reflect: !0 })
-], y.prototype, "variant", 2);
-k([
+], m.prototype, "variant", 2);
+_([
   a({ type: String })
-], y.prototype, "text", 2);
-k([
+], m.prototype, "text", 2);
+_([
   a({ type: String })
-], y.prototype, "textsecond", 2);
-k([
+], m.prototype, "textsecond", 2);
+_([
   a({ type: Boolean, reflect: !0 })
-], y.prototype, "fullwidth", 2);
-k([
+], m.prototype, "fullwidth", 2);
+_([
   a({ type: Boolean, reflect: !0 })
-], y.prototype, "disabled", 2);
-k([
+], m.prototype, "disabled", 2);
+_([
   a({ type: String })
-], y.prototype, "startIconModel", 2);
-k([
+], m.prototype, "startIconModel", 2);
+_([
   a({ type: String })
-], y.prototype, "endIconModel", 2);
-k([
+], m.prototype, "endIconModel", 2);
+_([
   a({ type: Boolean, reflect: !0, attribute: "starticon" })
-], y.prototype, "startIcon", 2);
-k([
+], m.prototype, "startIcon", 2);
+_([
   a({ type: Boolean, reflect: !0, attribute: "endicon" })
-], y.prototype, "endIcon", 2);
-k([
+], m.prototype, "endIcon", 2);
+_([
   a({ type: String, attribute: "paneltarget" })
-], y.prototype, "panelTarget", 2);
-k([
+], m.prototype, "panelTarget", 2);
+_([
   a({ type: String })
-], y.prototype, "href", 2);
-k([
+], m.prototype, "href", 2);
+_([
   a({ type: String })
-], y.prototype, "target", 2);
-k([
+], m.prototype, "target", 2);
+_([
   a({ type: Boolean, reflect: !0 })
-], y.prototype, "underlined", 2);
-k([
+], m.prototype, "underlined", 2);
+_([
   a({ type: Boolean, reflect: !0 })
-], y.prototype, "withbadge", 2);
-y = k([
-  g("o-button")
-], y);
+], m.prototype, "withbadge", 2);
+m = _([
+  b("o-button")
+], m);
 var Zo = Object.defineProperty, Ko = Object.getOwnPropertyDescriptor, It = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Ko(t, e) : t, r = o.length - 1, s; r >= 0; r--)
     (s = o[r]) && (i = (n ? s(t, e, i) : s(i)) || i);
@@ -2280,7 +2289,7 @@ let dt = class extends u {
     this.label = o, this.requestUpdate();
   }
 };
-dt.styles = f`
+dt.styles = v`
 		:host {
 			display: inline-flex;
 			justify-content: center;
@@ -2355,7 +2364,7 @@ It([
   a({ type: String, reflect: !0 })
 ], dt.prototype, "label", 2);
 dt = It([
-  g("o-wishlist-button")
+  b("o-wishlist-button")
 ], dt);
 var Wo = Object.defineProperty, Go = Object.getOwnPropertyDescriptor, lt = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Go(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -2400,7 +2409,7 @@ let K = class extends u {
         `;
   }
 };
-K.styles = f`
+K.styles = v`
         :host([template="standard"]) a {
             color: var(--color-content-action-secondary);
             font-size: var(--font-size-200);
@@ -2502,7 +2511,7 @@ lt([
   a({ type: Boolean, reflect: !0 })
 ], K.prototype, "reverseEndIcon", 2);
 K = lt([
-  g("o-link")
+  b("o-link")
 ], K);
 var Xo = Object.defineProperty, Yo = Object.getOwnPropertyDescriptor, Dt = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Yo(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -2536,7 +2545,7 @@ let pt = class extends u {
 		`;
   }
 };
-pt.styles = f`
+pt.styles = v`
 		svg {
 			width: 12px;
 			height: 12px;
@@ -2580,7 +2589,7 @@ Dt([
   a({ type: String })
 ], pt.prototype, "href", 2);
 pt = Dt([
-  g("o-rating")
+  b("o-rating")
 ], pt);
 var Jo = Object.defineProperty, Qo = Object.getOwnPropertyDescriptor, ot = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Qo(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -2678,7 +2687,7 @@ let F = class extends u {
     `;
   }
 };
-F.styles = f`
+F.styles = v`
     :host {
       display: flex;
       gap: 5px;
@@ -2805,7 +2814,7 @@ ot([
   W()
 ], F.prototype, "focusedIndex", 2);
 F = ot([
-  g("thumbnail-navigation")
+  b("thumbnail-navigation")
 ], F);
 var ti = Object.defineProperty, ei = Object.getOwnPropertyDescriptor, te = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? ei(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -2822,7 +2831,7 @@ let wt = class extends u {
     `;
   }
 };
-wt.styles = f`
+wt.styles = v`
     .tag {
       display: inline-block;
       padding: var(--spacing-2-xs) var(--spacing-s);
@@ -2889,7 +2898,7 @@ te([
   a({ type: String, reflect: !0 })
 ], wt.prototype, "bgstyle", 2);
 wt = te([
-  g("o-tag")
+  b("o-tag")
 ], wt);
 var oi = Object.defineProperty, ii = Object.getOwnPropertyDescriptor, ee = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? ii(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -2909,7 +2918,7 @@ let $t = class extends u {
     `;
   }
 };
-$t.styles = f`
+$t.styles = v`
     .tooltip {
         position: relative;
         display: inline-block;
@@ -3009,7 +3018,7 @@ ee([
   a({ type: String, reflect: !0 })
 ], $t.prototype, "text", 2);
 $t = ee([
-  g("o-tooltip")
+  b("o-tooltip")
 ], $t);
 var ni = Object.defineProperty, ri = Object.getOwnPropertyDescriptor, G = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? ri(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -3139,7 +3148,7 @@ let T = class extends u {
     `;
   }
 };
-T.styles = f`
+T.styles = v`
     :host {
       display: inline-block;
       position: relative;
@@ -3303,7 +3312,7 @@ G([
   W()
 ], T.prototype, "menuWidth", 2);
 T = G([
-  g("o-dropdown")
+  b("o-dropdown")
 ], T);
 var si = Object.getOwnPropertyDescriptor, ai = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? si(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -3315,7 +3324,7 @@ let Nt = class extends u {
     return l` <span class="dots"></span> `;
   }
 };
-Nt.styles = f`
+Nt.styles = v`
   :host {
     display: flex;
     align-items: center;
@@ -3359,7 +3368,7 @@ Nt.styles = f`
   }
 `;
 Nt = ai([
-  g("o-dots")
+  b("o-dots")
 ], Nt);
 var li = Object.defineProperty, ci = Object.getOwnPropertyDescriptor, U = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? ci(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -3503,7 +3512,7 @@ let z = class extends u {
 		`;
   }
 };
-z.styles = f`
+z.styles = v`
 	:host {
 		display: inline-block;
 		position: relative;
@@ -3707,7 +3716,7 @@ U([
   W()
 ], z.prototype, "menuWidth", 2);
 z = U([
-  g("o-dropdown-variant")
+  b("o-dropdown-variant")
 ], z);
 /**
  * @license
@@ -3766,7 +3775,7 @@ let kt = class extends u {
     return t ? l`<a href="${P(this.option.url)}" class="reassurance-item clickable">${r}</a>` : l`<div class="reassurance-item">${r}</div>`;
   }
 };
-kt.styles = f`
+kt.styles = v`
     :host {
       display: inline-block;
       position: relative;
@@ -3855,7 +3864,7 @@ oe([
   a({ type: Number, reflect: !0 })
 ], kt.prototype, "imageSize", 2);
 kt = oe([
-  g("o-reassurance")
+  b("o-reassurance")
 ], kt);
 var fi = Object.defineProperty, vi = Object.getOwnPropertyDescriptor, X = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? vi(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -3887,7 +3896,7 @@ let O = class extends gi {
     `;
   }
 };
-O.styles = f`
+O.styles = v`
     :host {
       cursor: pointer;
       display: inline-flex;
@@ -4006,7 +4015,7 @@ X([
   a({ type: Boolean, reflect: !0 })
 ], O.prototype, "inactive", 2);
 O = X([
-  g("o-chip")
+  b("o-chip")
 ], O);
 var bi = Object.defineProperty, yi = Object.getOwnPropertyDescriptor, ie = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? yi(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -4029,7 +4038,7 @@ let _t = class extends u {
     `;
   }
 };
-_t.styles = f`
+_t.styles = v`
     :host {
       display: flex;
       flex-direction: row;
@@ -4044,7 +4053,7 @@ ie([
   a({ reflect: !0 })
 ], _t.prototype, "value", 2);
 _t = ie([
-  g("o-chipset")
+  b("o-chipset")
 ], _t);
 var mi = Object.defineProperty, xi = Object.getOwnPropertyDescriptor, N = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? xi(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -4071,7 +4080,7 @@ let I = class extends wi {
     return l`<span class="cross-icon">${S(o)}</span>`;
   }
   strikeThroughImg() {
-    const o = Ao[this.strikethroughImgName].replace(
+    const o = Lo[this.strikethroughImgName].replace(
       "<svg",
       '<svg aria-hidden="true" focusable="false" part="strikethrough"'
     ).replace(/stroke=[#"'a-z1-9]*/gi, "");
@@ -4102,7 +4111,7 @@ let I = class extends wi {
     `;
   }
 };
-I.styles = f`
+I.styles = v`
     :host {
       cursor: pointer;
       display: inline-flex;
@@ -4253,7 +4262,7 @@ N([
   a({ type: Boolean, reflect: !0 })
 ], I.prototype, "fullwidth", 2);
 I = N([
-  g("o-filter-chip")
+  b("o-filter-chip")
 ], I);
 var $i = Object.defineProperty, M = (o, t, e, n) => {
   for (var i = void 0, r = o.length - 1, s; r >= 0; r--)
@@ -4326,7 +4335,7 @@ const se = class se extends u {
     `;
   }
 };
-se.styles = f`
+se.styles = v`
     :host {
       display: block;
       max-width: 100%;
@@ -4491,7 +4500,7 @@ let Ct = class extends u {
     `;
   }
 };
-Ct.styles = f`
+Ct.styles = v`
     :host([variant]) {
       --badge-width: 19px;
       display: inline-block;
@@ -4533,14 +4542,14 @@ ne([
   a({ type: String })
 ], Ct.prototype, "text", 2);
 Ct = ne([
-  g("o-badge")
+  b("o-badge")
 ], Ct);
 var Ci = Object.defineProperty, Si = Object.getOwnPropertyDescriptor, H = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Si(t, e) : t, r = o.length - 1, s; r >= 0; r--)
     (s = o[r]) && (i = (n ? s(t, e, i) : s(i)) || i);
   return n && i && Ci(t, e, i), i;
 };
-let L = class extends u {
+let A = class extends u {
   constructor() {
     super(...arguments), this.icon = "info", this.text = "Sample text", this.verticalanchor = "top", this.horizontalanchor = "right", this.verticaloffset = 24, this.horizontaloffset = 24, this.animationduration = 500, this.animationaxis = "horizontal", this.animated = !0, this.lifeduration = 5e3, this.multiline = !1;
   }
@@ -4604,7 +4613,7 @@ let L = class extends u {
         `;
   }
 };
-L.styles = f`
+A.styles = v`
         :host {
             --vertical-offset: 24px;
             --horizontal-offset: 24px;
@@ -4684,48 +4693,48 @@ L.styles = f`
     `;
 H([
   a({ type: String, reflect: !0 })
-], L.prototype, "icon", 2);
+], A.prototype, "icon", 2);
 H([
   a({ type: String, reflect: !0 })
-], L.prototype, "text", 2);
+], A.prototype, "text", 2);
 H([
   a({ type: String, reflect: !0 })
-], L.prototype, "verticalanchor", 2);
+], A.prototype, "verticalanchor", 2);
 H([
   a({ type: String, reflect: !0 })
-], L.prototype, "horizontalanchor", 2);
+], A.prototype, "horizontalanchor", 2);
 H([
   a({ type: Number, reflect: !0 })
-], L.prototype, "verticaloffset", 2);
+], A.prototype, "verticaloffset", 2);
 H([
   a({ type: Number, reflect: !0 })
-], L.prototype, "horizontaloffset", 2);
+], A.prototype, "horizontaloffset", 2);
 H([
   a({ type: Number, reflect: !0 })
-], L.prototype, "animationduration", 2);
+], A.prototype, "animationduration", 2);
 H([
   a({ type: String, reflect: !0 })
-], L.prototype, "animationaxis", 2);
+], A.prototype, "animationaxis", 2);
 H([
   a({ type: Boolean, reflect: !0 })
-], L.prototype, "animated", 2);
+], A.prototype, "animated", 2);
 H([
   a({ type: Number, reflect: !0 })
-], L.prototype, "lifeduration", 2);
+], A.prototype, "lifeduration", 2);
 H([
   a({ type: Boolean, reflect: !0 })
-], L.prototype, "multiline", 2);
-L = H([
-  g("o-toast")
-], L);
-var Ei = Object.defineProperty, Li = Object.getOwnPropertyDescriptor, j = (o, t, e, n) => {
-  for (var i = n > 1 ? void 0 : n ? Li(t, e) : t, r = o.length - 1, s; r >= 0; r--)
+], A.prototype, "multiline", 2);
+A = H([
+  b("o-toast")
+], A);
+var Ei = Object.defineProperty, Ai = Object.getOwnPropertyDescriptor, j = (o, t, e, n) => {
+  for (var i = n > 1 ? void 0 : n ? Ai(t, e) : t, r = o.length - 1, s; r >= 0; r--)
     (s = o[r]) && (i = (n ? s(t, e, i) : s(i)) || i);
   return n && i && Ei(t, e, i), i;
 };
-let Ai = 0, A = class extends u {
+let Li = 0, L = class extends u {
   constructor() {
-    super(), this.checked = !1, this.indeterminate = !1, this.disabled = !1, this.size = "S", this.showLabel = !0, this.label = "Checkbox", this.name = "", this.value = "on", this.inputId = "", this.inputId || (this.inputId = `o-checkbox-${++Ai}`);
+    super(), this.checked = !1, this.indeterminate = !1, this.disabled = !1, this.size = "S", this.showLabel = !0, this.label = "Checkbox", this.name = "", this.value = "on", this.inputId = "", this.inputId || (this.inputId = `o-checkbox-${++Li}`);
   }
   toggle() {
     this.disabled || (this.indeterminate ? (this.indeterminate = !1, this.checked = !0) : this.checked = !this.checked, this.syncInput(), this.dispatchEvent(new Event("change", { bubbles: !0, composed: !0 })));
@@ -4763,7 +4772,7 @@ let Ai = 0, A = class extends u {
     `;
   }
 };
-A.styles = f`
+L.styles = v`
     :host {
       display: inline-flex;
       align-items: center;
@@ -4868,37 +4877,37 @@ A.styles = f`
   `;
 j([
   a({ type: Boolean, reflect: !0 })
-], A.prototype, "checked", 2);
+], L.prototype, "checked", 2);
 j([
   a({ type: Boolean, reflect: !0 })
-], A.prototype, "indeterminate", 2);
+], L.prototype, "indeterminate", 2);
 j([
   a({ type: Boolean, reflect: !0 })
-], A.prototype, "disabled", 2);
+], L.prototype, "disabled", 2);
 j([
   a({ type: String, reflect: !0 })
-], A.prototype, "size", 2);
+], L.prototype, "size", 2);
 j([
   a({ type: Boolean })
-], A.prototype, "showLabel", 2);
+], L.prototype, "showLabel", 2);
 j([
   a({ type: String })
-], A.prototype, "label", 2);
+], L.prototype, "label", 2);
 j([
   a({ type: String })
-], A.prototype, "name", 2);
+], L.prototype, "name", 2);
 j([
   a({ type: String })
-], A.prototype, "value", 2);
+], L.prototype, "value", 2);
 j([
   a({ type: String, reflect: !0 })
-], A.prototype, "inputId", 2);
+], L.prototype, "inputId", 2);
 j([
   Ce("input")
-], A.prototype, "inputEl", 2);
-A = j([
-  g("o-checkbox")
-], A);
+], L.prototype, "inputEl", 2);
+L = j([
+  b("o-checkbox")
+], L);
 var Pi = Object.defineProperty, Bi = Object.getOwnPropertyDescriptor, q = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Bi(t, e) : t, r = o.length - 1, s; r >= 0; r--)
     (s = o[r]) && (i = (n ? s(t, e, i) : s(i)) || i);
@@ -4938,7 +4947,7 @@ let zi = 0, D = class extends u {
     `;
   }
 };
-D.styles = f`
+D.styles = v`
     :host {
       display: inline-flex;
       align-items: center;
@@ -5056,7 +5065,7 @@ q([
   Ce("input")
 ], D.prototype, "inputEl", 2);
 D = q([
-  g("o-radio")
+  b("o-radio")
 ], D);
 var Oi = Object.getOwnPropertyDescriptor, Ii = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Oi(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -5074,7 +5083,7 @@ let qt = class extends u {
         `;
   }
 };
-qt.styles = f`
+qt.styles = v`
         nav {
             max-width: 144rem;
             margin: auto;
@@ -5087,7 +5096,7 @@ qt.styles = f`
         }
     `;
 qt = Ii([
-  g("o-breadcrumbs")
+  b("o-breadcrumbs")
 ], qt);
 var Di = Object.defineProperty, Hi = Object.getOwnPropertyDescriptor, re = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Hi(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -5115,7 +5124,7 @@ let St = class extends u {
         `;
   }
 };
-St.styles = f`
+St.styles = v`
         :host(:not([active]))::after {
             content: "/";
             margin: 0 0.5rem;
@@ -5162,7 +5171,7 @@ re([
   a({ type: Boolean, reflect: !0 })
 ], St.prototype, "active", 2);
 St = re([
-  g("o-breadcrumb")
+  b("o-breadcrumb")
 ], St);
 var Ti = Object.defineProperty, Mi = Object.getOwnPropertyDescriptor, ut = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Mi(t, e) : t, r = o.length - 1, s; r >= 0; r--)
@@ -5188,7 +5197,7 @@ let et = class extends u {
     </div>`;
   }
 };
-et.styles = f`
+et.styles = v`
     :host {
       --card-width : 175px;
       --card-height : 260px;
@@ -5277,7 +5286,7 @@ ut([
   a({ type: Boolean, reflect: !0 })
 ], et.prototype, "dimmed", 2);
 et = ut([
-  g("o-arch-image")
+  b("o-arch-image")
 ], et);
 const ji = `<?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <svg
@@ -5494,7 +5503,7 @@ const ae = class ae extends u {
     `;
   }
 };
-ae.styles = f`
+ae.styles = v`
     :host {
       position: fixed;
       inset: 0;
@@ -5630,62 +5639,62 @@ ae.styles = f`
       to { transform: translateY(0) scale(1); opacity: 1; }
     }
   `;
-let w = ae;
+let $ = ae;
 C([
   a({ type: Boolean, reflect: !0 })
-], w.prototype, "ispagedesigner", 2);
+], $.prototype, "ispagedesigner", 2);
 C([
   a({ type: String, reflect: !0 })
-], w.prototype, "classPopin", 1);
+], $.prototype, "classPopin", 1);
 C([
   a({ type: Boolean, reflect: !0 })
-], w.prototype, "open", 2);
+], $.prototype, "open", 2);
 C([
   a({ type: String, reflect: !0 })
-], w.prototype, "background", 2);
+], $.prototype, "background", 2);
 C([
   a({ type: String, attribute: "background-url", reflect: !0 })
-], w.prototype, "backgroundUrl", 2);
+], $.prototype, "backgroundUrl", 2);
 C([
   a({ type: Boolean, attribute: "close-on-esc" })
-], w.prototype, "closeOnEsc", 2);
+], $.prototype, "closeOnEsc", 2);
 C([
   a({ type: Boolean, attribute: "close-on-backdrop" })
-], w.prototype, "closeOnBackdrop", 2);
+], $.prototype, "closeOnBackdrop", 2);
 C([
   a({ type: Boolean, attribute: "lock-scroll" })
-], w.prototype, "lockScroll", 2);
+], $.prototype, "lockScroll", 2);
 C([
   a({ type: String, reflect: !0 })
-], w.prototype, "variant", 2);
+], $.prototype, "variant", 2);
 C([
   a({ type: String, attribute: "max-width" })
-], w.prototype, "maxWidth", 2);
+], $.prototype, "maxWidth", 2);
 C([
   a({ type: Boolean, reflect: !0 })
-], w.prototype, "showBackButton", 2);
+], $.prototype, "showBackButton", 2);
 C([
   a({ type: Boolean, reflect: !0 })
-], w.prototype, "contrast", 2);
+], $.prototype, "contrast", 2);
 C([
   a({ type: String, reflect: !0 })
-], w.prototype, "iconSize", 2);
+], $.prototype, "iconSize", 2);
 C([
   a({ type: Boolean, attribute: "hide-header-on-scroll" })
-], w.prototype, "hideHeaderOnScroll", 2);
+], $.prototype, "hideHeaderOnScroll", 2);
 C([
   W()
-], w.prototype, "_labelId", 2);
+], $.prototype, "_labelId", 2);
 C([
   W()
-], w.prototype, "_headerHidden", 2);
-customElements.define("o-popin", w);
-var Ui = Object.defineProperty, Ni = Object.getOwnPropertyDescriptor, $ = (o, t, e, n) => {
+], $.prototype, "_headerHidden", 2);
+customElements.define("o-popin", $);
+var Ui = Object.defineProperty, Ni = Object.getOwnPropertyDescriptor, k = (o, t, e, n) => {
   for (var i = n > 1 ? void 0 : n ? Ni(t, e) : t, r = o.length - 1, s; r >= 0; r--)
     (s = o[r]) && (i = (n ? s(t, e, i) : s(i)) || i);
   return n && i && Ui(t, e, i), i;
 };
-let m = class extends u {
+let w = class extends u {
   constructor() {
     super(...arguments), this.type = "cart | notifyme", this.titleProduct = "", this.descriptionProduct = "", this.volume = "", this.perLiter = "", this.mainPrice = "", this.salesPercentage = "", this.oldPrice = "", this.imageUrl = "https://placehold.co/112x140", this.outOfStock = !1, this.altImage = "", this.fullwidth = !1, this.current = !1, this.hideIcon = !1, this.tagText = "";
   }
@@ -5754,7 +5763,7 @@ let m = class extends u {
     `;
   }
 };
-m.styles = f`
+w.styles = v`
     :host {
       display: block;
       max-width: 100%;
@@ -5923,57 +5932,57 @@ m.styles = f`
       cursor: pointer;
     }
   `;
-$([
+k([
   a({ type: String })
-], m.prototype, "type", 2);
-$([
+], w.prototype, "type", 2);
+k([
   a({ type: String })
-], m.prototype, "titleProduct", 2);
-$([
+], w.prototype, "titleProduct", 2);
+k([
   a({ type: String })
-], m.prototype, "descriptionProduct", 2);
-$([
+], w.prototype, "descriptionProduct", 2);
+k([
   a({ type: String })
-], m.prototype, "volume", 2);
-$([
+], w.prototype, "volume", 2);
+k([
   a({ type: String })
-], m.prototype, "perLiter", 2);
-$([
+], w.prototype, "perLiter", 2);
+k([
   a({ type: String })
-], m.prototype, "mainPrice", 2);
-$([
+], w.prototype, "mainPrice", 2);
+k([
   a({ type: String })
-], m.prototype, "salesPercentage", 2);
-$([
+], w.prototype, "salesPercentage", 2);
+k([
   a({ type: String })
-], m.prototype, "oldPrice", 2);
-$([
+], w.prototype, "oldPrice", 2);
+k([
   a({ type: String })
-], m.prototype, "imageUrl", 2);
-$([
+], w.prototype, "imageUrl", 2);
+k([
   a({ type: Boolean })
-], m.prototype, "outOfStock", 2);
-$([
+], w.prototype, "outOfStock", 2);
+k([
   a({ type: String })
-], m.prototype, "altImage", 2);
-$([
+], w.prototype, "altImage", 2);
+k([
   a({ type: Boolean })
-], m.prototype, "fullwidth", 2);
-$([
+], w.prototype, "fullwidth", 2);
+k([
   a({ type: Boolean })
-], m.prototype, "current", 2);
-$([
+], w.prototype, "current", 2);
+k([
   a({ type: Boolean })
-], m.prototype, "hideIcon", 2);
-$([
+], w.prototype, "hideIcon", 2);
+k([
   a({ type: String })
-], m.prototype, "tagText", 2);
-$([
+], w.prototype, "tagText", 2);
+k([
   a({ attribute: !1 })
-], m.prototype, "onClickTile", 2);
-$([
+], w.prototype, "onClickTile", 2);
+k([
   a({ attribute: !1 })
-], m.prototype, "onClickIcon", 2);
-m = $([
-  g("o-medium-tile")
-], m);
+], w.prototype, "onClickIcon", 2);
+w = k([
+  b("o-medium-tile")
+], w);