@florid-kit/components 0.3.5 → 0.3.6

package/index.mjs

@@ -3,18 +3,18 @@
  * Copyright 2019 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const z = globalThis, tt = z.ShadowRoot && (z.ShadyCSS === void 0 || z.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, et = Symbol(), nt = /* @__PURE__ */ new WeakMap();
-let vt = class {
+const V = globalThis, rt = V.ShadowRoot && (V.ShadyCSS === void 0 || V.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, it = Symbol(), lt = /* @__PURE__ */ new WeakMap();
+let mt = class {
   constructor(t, e, s) {
-    if (this._$cssResult$ = !0, s !== et) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    if (this._$cssResult$ = !0, s !== it) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
     this.cssText = t, this.t = e;
   }
   get styleSheet() {
     let t = this.o;
     const e = this.t;
-    if (tt && t === void 0) {
+    if (rt && t === void 0) {
       const s = e !== void 0 && e.length === 1;
-      s && (t = nt.get(e)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), s && nt.set(e, t));
+      s && (t = lt.get(e)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), s && lt.set(e, t));
     }
     return t;
   }
@@ -22,33 +22,33 @@ let vt = class {
     return this.cssText;
   }
 };
-const yt = (i) => new vt(typeof i == "string" ? i : i + "", void 0, et), B = (i, ...t) => {
+const _t = (i) => new mt(typeof i == "string" ? i : i + "", void 0, it), I = (i, ...t) => {
   const e = i.length === 1 ? i[0] : t.reduce((s, r, n) => s + ((o) => {
     if (o._$cssResult$ === !0) return o.cssText;
     if (typeof o == "number") return o;
     throw Error("Value passed to 'css' function must be a 'css' function result: " + o + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
   })(r) + i[n + 1], i[0]);
-  return new vt(e, i, et);
-}, Et = (i, t) => {
-  if (tt) i.adoptedStyleSheets = t.map((e) => e instanceof CSSStyleSheet ? e : e.styleSheet);
+  return new mt(e, i, it);
+}, Ct = (i, t) => {
+  if (rt) i.adoptedStyleSheets = t.map((e) => e instanceof CSSStyleSheet ? e : e.styleSheet);
   else for (const e of t) {
-    const s = document.createElement("style"), r = z.litNonce;
+    const s = document.createElement("style"), r = V.litNonce;
     r !== void 0 && s.setAttribute("nonce", r), s.textContent = e.cssText, i.appendChild(s);
   }
-}, at = tt ? (i) => i : (i) => i instanceof CSSStyleSheet ? ((t) => {
+}, ht = rt ? (i) => i : (i) => i instanceof CSSStyleSheet ? ((t) => {
   let e = "";
   for (const s of t.cssRules) e += s.cssText;
-  return yt(e);
+  return _t(e);
 })(i) : i;
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const { is: xt, defineProperty: Ct, getOwnPropertyDescriptor: Pt, getOwnPropertyNames: Ot, getOwnPropertySymbols: Ut, getPrototypeOf: kt } = Object, y = globalThis, lt = y.trustedTypes, Mt = lt ? lt.emptyScript : "", F = y.reactiveElementPolyfillSupport, T = (i, t) => i, I = { toAttribute(i, t) {
+const { is: Pt, defineProperty: Ot, getOwnPropertyDescriptor: kt, getOwnPropertyNames: Ut, getOwnPropertySymbols: Mt, getPrototypeOf: Tt } = Object, _ = globalThis, ct = _.trustedTypes, It = ct ? ct.emptyScript : "", K = _.reactiveElementPolyfillSupport, z = (i, t) => i, q = { toAttribute(i, t) {
   switch (t) {
     case Boolean:
-      i = i ? Mt : null;
+      i = i ? It : null;
       break;
     case Object:
     case Array:
@@ -73,23 +73,23 @@ const { is: xt, defineProperty: Ct, getOwnPropertyDescriptor: Pt, getOwnProperty
       }
   }
   return e;
-} }, st = (i, t) => !xt(i, t), ht = { attribute: !0, type: String, converter: I, reflect: !1, useDefault: !1, hasChanged: st };
-Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), y.litPropertyMetadata ?? (y.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
-let O = class extends HTMLElement {
+} }, ot = (i, t) => !Pt(i, t), dt = { attribute: !0, type: String, converter: q, reflect: !1, useDefault: !1, hasChanged: ot };
+Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), _.litPropertyMetadata ?? (_.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
+let U = class extends HTMLElement {
   static addInitializer(t) {
     this._$Ei(), (this.l ?? (this.l = [])).push(t);
   }
   static get observedAttributes() {
     return this.finalize(), this._$Eh && [...this._$Eh.keys()];
   }
-  static createProperty(t, e = ht) {
+  static createProperty(t, e = dt) {
     if (e.state && (e.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(t) && ((e = Object.create(e)).wrapped = !0), this.elementProperties.set(t, e), !e.noAccessor) {
       const s = Symbol(), r = this.getPropertyDescriptor(t, s, e);
-      r !== void 0 && Ct(this.prototype, t, r);
+      r !== void 0 && Ot(this.prototype, t, r);
     }
   }
   static getPropertyDescriptor(t, e, s) {
-    const { get: r, set: n } = Pt(this.prototype, t) ?? { get() {
+    const { get: r, set: n } = kt(this.prototype, t) ?? { get() {
       return this[e];
     }, set(o) {
       this[e] = o;
@@ -100,17 +100,17 @@ let O = class extends HTMLElement {
     }, configurable: !0, enumerable: !0 };
   }
   static getPropertyOptions(t) {
-    return this.elementProperties.get(t) ?? ht;
+    return this.elementProperties.get(t) ?? dt;
   }
   static _$Ei() {
-    if (this.hasOwnProperty(T("elementProperties"))) return;
-    const t = kt(this);
+    if (this.hasOwnProperty(z("elementProperties"))) return;
+    const t = Tt(this);
     t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
   }
   static finalize() {
-    if (this.hasOwnProperty(T("finalized"))) return;
-    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(T("properties"))) {
-      const e = this.properties, s = [...Ot(e), ...Ut(e)];
+    if (this.hasOwnProperty(z("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(z("properties"))) {
+      const e = this.properties, s = [...Ut(e), ...Mt(e)];
       for (const r of s) this.createProperty(r, e[r]);
     }
     const t = this[Symbol.metadata];
@@ -129,8 +129,8 @@ let O = class extends HTMLElement {
     const e = [];
     if (Array.isArray(t)) {
       const s = new Set(t.flat(1 / 0).reverse());
-      for (const r of s) e.unshift(at(r));
-    } else t !== void 0 && e.push(at(t));
+      for (const r of s) e.unshift(ht(r));
+    } else t !== void 0 && e.push(ht(t));
     return e;
   }
   static _$Eu(t, e) {
@@ -159,7 +159,7 @@ let O = class extends HTMLElement {
   }
   createRenderRoot() {
     const t = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
-    return Et(t, this.constructor.elementStyles), t;
+    return Ct(t, this.constructor.elementStyles), t;
   }
   connectedCallback() {
     var t;
@@ -184,7 +184,7 @@ let O = class extends HTMLElement {
     var n;
     const s = this.constructor.elementProperties.get(t), r = this.constructor._$Eu(t, s);
     if (r !== void 0 && s.reflect === !0) {
-      const o = (((n = s.converter) == null ? void 0 : n.toAttribute) !== void 0 ? s.converter : I).toAttribute(e, s.type);
+      const o = (((n = s.converter) == null ? void 0 : n.toAttribute) !== void 0 ? s.converter : q).toAttribute(e, s.type);
       this._$Em = t, o == null ? this.removeAttribute(r) : this.setAttribute(r, o), this._$Em = null;
     }
   }
@@ -192,7 +192,7 @@ let O = class extends HTMLElement {
     var n, o;
     const s = this.constructor, r = s._$Eh.get(t);
     if (r !== void 0 && this._$Em !== r) {
-      const l = s.getPropertyOptions(r), a = typeof l.converter == "function" ? { fromAttribute: l.converter } : ((n = l.converter) == null ? void 0 : n.fromAttribute) !== void 0 ? l.converter : I;
+      const l = s.getPropertyOptions(r), a = typeof l.converter == "function" ? { fromAttribute: l.converter } : ((n = l.converter) == null ? void 0 : n.fromAttribute) !== void 0 ? l.converter : q;
       this._$Em = r, this[r] = a.fromAttribute(e, l.type) ?? ((o = this._$Ej) == null ? void 0 : o.get(r)) ?? null, this._$Em = null;
     }
   }
@@ -200,7 +200,7 @@ let O = class extends HTMLElement {
     var r;
     if (t !== void 0) {
       const n = this.constructor, o = this[t];
-      if (s ?? (s = n.getPropertyOptions(t)), !((s.hasChanged ?? st)(o, e) || s.useDefault && s.reflect && o === ((r = this._$Ej) == null ? void 0 : r.get(t)) && !this.hasAttribute(n._$Eu(t, s)))) return;
+      if (s ?? (s = n.getPropertyOptions(t)), !((s.hasChanged ?? ot)(o, e) || s.useDefault && s.reflect && o === ((r = this._$Ej) == null ? void 0 : r.get(t)) && !this.hasAttribute(n._$Eu(t, s)))) return;
       this.C(t, e, s);
     }
     this.isUpdatePending === !1 && (this._$ES = this._$EP());
@@ -276,76 +276,76 @@ let O = class extends HTMLElement {
   firstUpdated(t) {
   }
 };
-O.elementStyles = [], O.shadowRootOptions = { mode: "open" }, O[T("elementProperties")] = /* @__PURE__ */ new Map(), O[T("finalized")] = /* @__PURE__ */ new Map(), F == null || F({ ReactiveElement: O }), (y.reactiveElementVersions ?? (y.reactiveElementVersions = [])).push("2.1.0");
+U.elementStyles = [], U.shadowRootOptions = { mode: "open" }, U[z("elementProperties")] = /* @__PURE__ */ new Map(), U[z("finalized")] = /* @__PURE__ */ new Map(), K == null || K({ ReactiveElement: U }), (_.reactiveElementVersions ?? (_.reactiveElementVersions = [])).push("2.1.0");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const H = globalThis, V = H.trustedTypes, ct = V ? V.createPolicy("lit-html", { createHTML: (i) => i }) : void 0, mt = "$lit$", v = `lit$${Math.random().toFixed(9).slice(2)}$`, _t = "?" + v, Tt = `<${_t}>`, x = document, N = () => x.createComment(""), D = (i) => i === null || typeof i != "object" && typeof i != "function", rt = Array.isArray, Ht = (i) => rt(i) || typeof (i == null ? void 0 : i[Symbol.iterator]) == "function", Z = `[ 	
-\f\r]`, M = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, dt = /-->/g, ut = />/g, _ = RegExp(`>|${Z}(?:([^\\s"'>=/]+)(${Z}*=${Z}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`, "g"), pt = /'/g, bt = /"/g, At = /^(?:script|style|textarea|title)$/i, Nt = (i) => (t, ...e) => ({ _$litType$: i, strings: t, values: e }), w = Nt(1), C = Symbol.for("lit-noChange"), c = Symbol.for("lit-nothing"), gt = /* @__PURE__ */ new WeakMap(), A = x.createTreeWalker(x, 129);
-function wt(i, t) {
-  if (!rt(i) || !i.hasOwnProperty("raw")) throw Error("invalid template strings array");
-  return ct !== void 0 ? ct.createHTML(t) : t;
+const B = globalThis, W = B.trustedTypes, ut = W ? W.createPolicy("lit-html", { createHTML: (i) => i }) : void 0, wt = "$lit$", m = `lit$${Math.random().toFixed(9).slice(2)}$`, At = "?" + m, Ht = `<${At}>`, C = document, N = () => C.createComment(""), L = (i) => i === null || typeof i != "object" && typeof i != "function", nt = Array.isArray, zt = (i) => nt(i) || typeof (i == null ? void 0 : i[Symbol.iterator]) == "function", X = `[ 	
+\f\r]`, H = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, pt = /-->/g, ft = />/g, x = RegExp(`>|${X}(?:([^\\s"'>=/]+)(${X}*=${X}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g"), gt = /'/g, bt = /"/g, xt = /^(?:script|style|textarea|title)$/i, Bt = (i) => (t, ...e) => ({ _$litType$: i, strings: t, values: e }), g = Bt(1), P = Symbol.for("lit-noChange"), d = Symbol.for("lit-nothing"), vt = /* @__PURE__ */ new WeakMap(), E = C.createTreeWalker(C, 129);
+function Et(i, t) {
+  if (!nt(i) || !i.hasOwnProperty("raw")) throw Error("invalid template strings array");
+  return ut !== void 0 ? ut.createHTML(t) : t;
 }
-const Dt = (i, t) => {
+const Nt = (i, t) => {
   const e = i.length - 1, s = [];
-  let r, n = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", o = M;
+  let r, n = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", o = H;
   for (let l = 0; l < e; l++) {
     const a = i[l];
-    let d, u, h = -1, $ = 0;
-    for (; $ < a.length && (o.lastIndex = $, u = o.exec(a), u !== null); ) $ = o.lastIndex, o === M ? u[1] === "!--" ? o = dt : u[1] !== void 0 ? o = ut : u[2] !== void 0 ? (At.test(u[2]) && (r = RegExp("</" + u[2], "g")), o = _) : u[3] !== void 0 && (o = _) : o === _ ? u[0] === ">" ? (o = r ?? M, h = -1) : u[1] === void 0 ? h = -2 : (h = o.lastIndex - u[2].length, d = u[1], o = u[3] === void 0 ? _ : u[3] === '"' ? bt : pt) : o === bt || o === pt ? o = _ : o === dt || o === ut ? o = M : (o = _, r = void 0);
-    const f = o === _ && i[l + 1].startsWith("/>") ? " " : "";
-    n += o === M ? a + Tt : h >= 0 ? (s.push(d), a.slice(0, h) + mt + a.slice(h) + v + f) : a + v + (h === -2 ? l : f);
+    let u, p, h = -1, v = 0;
+    for (; v < a.length && (o.lastIndex = v, p = o.exec(a), p !== null); ) v = o.lastIndex, o === H ? p[1] === "!--" ? o = pt : p[1] !== void 0 ? o = ft : p[2] !== void 0 ? (xt.test(p[2]) && (r = RegExp("</" + p[2], "g")), o = x) : p[3] !== void 0 && (o = x) : o === x ? p[0] === ">" ? (o = r ?? H, h = -1) : p[1] === void 0 ? h = -2 : (h = o.lastIndex - p[2].length, u = p[1], o = p[3] === void 0 ? x : p[3] === '"' ? bt : gt) : o === bt || o === gt ? o = x : o === pt || o === ft ? o = H : (o = x, r = void 0);
+    const y = o === x && i[l + 1].startsWith("/>") ? " " : "";
+    n += o === H ? a + Ht : h >= 0 ? (s.push(u), a.slice(0, h) + wt + a.slice(h) + m + y) : a + m + (h === -2 ? l : y);
   }
-  return [wt(i, n + (i[e] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), s];
+  return [Et(i, n + (i[e] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), s];
 };
-class R {
+class D {
   constructor({ strings: t, _$litType$: e }, s) {
     let r;
     this.parts = [];
     let n = 0, o = 0;
-    const l = t.length - 1, a = this.parts, [d, u] = Dt(t, e);
-    if (this.el = R.createElement(d, s), A.currentNode = this.el.content, e === 2 || e === 3) {
+    const l = t.length - 1, a = this.parts, [u, p] = Nt(t, e);
+    if (this.el = D.createElement(u, s), E.currentNode = this.el.content, e === 2 || e === 3) {
       const h = this.el.content.firstChild;
       h.replaceWith(...h.childNodes);
     }
-    for (; (r = A.nextNode()) !== null && a.length < l; ) {
+    for (; (r = E.nextNode()) !== null && a.length < l; ) {
       if (r.nodeType === 1) {
-        if (r.hasAttributes()) for (const h of r.getAttributeNames()) if (h.endsWith(mt)) {
-          const $ = u[o++], f = r.getAttribute(h).split(v), L = /([.?@])?(.*)/.exec($);
-          a.push({ type: 1, index: n, name: L[2], strings: f, ctor: L[1] === "." ? Bt : L[1] === "?" ? jt : L[1] === "@" ? Lt : q }), r.removeAttribute(h);
-        } else h.startsWith(v) && (a.push({ type: 6, index: n }), r.removeAttribute(h));
-        if (At.test(r.tagName)) {
-          const h = r.textContent.split(v), $ = h.length - 1;
-          if ($ > 0) {
-            r.textContent = V ? V.emptyScript : "";
-            for (let f = 0; f < $; f++) r.append(h[f], N()), A.nextNode(), a.push({ type: 2, index: ++n });
-            r.append(h[$], N());
+        if (r.hasAttributes()) for (const h of r.getAttributeNames()) if (h.endsWith(wt)) {
+          const v = p[o++], y = r.getAttribute(h).split(m), j = /([.?@])?(.*)/.exec(v);
+          a.push({ type: 1, index: n, name: j[2], strings: y, ctor: j[1] === "." ? Dt : j[1] === "?" ? Rt : j[1] === "@" ? jt : F }), r.removeAttribute(h);
+        } else h.startsWith(m) && (a.push({ type: 6, index: n }), r.removeAttribute(h));
+        if (xt.test(r.tagName)) {
+          const h = r.textContent.split(m), v = h.length - 1;
+          if (v > 0) {
+            r.textContent = W ? W.emptyScript : "";
+            for (let y = 0; y < v; y++) r.append(h[y], N()), E.nextNode(), a.push({ type: 2, index: ++n });
+            r.append(h[v], N());
           }
         }
-      } else if (r.nodeType === 8) if (r.data === _t) a.push({ type: 2, index: n });
+      } else if (r.nodeType === 8) if (r.data === At) a.push({ type: 2, index: n });
       else {
         let h = -1;
-        for (; (h = r.data.indexOf(v, h + 1)) !== -1; ) a.push({ type: 7, index: n }), h += v.length - 1;
+        for (; (h = r.data.indexOf(m, h + 1)) !== -1; ) a.push({ type: 7, index: n }), h += m.length - 1;
       }
       n++;
     }
   }
   static createElement(t, e) {
-    const s = x.createElement("template");
+    const s = C.createElement("template");
     return s.innerHTML = t, s;
   }
 }
-function U(i, t, e = i, s) {
+function M(i, t, e = i, s) {
   var o, l;
-  if (t === C) return t;
+  if (t === P) return t;
   let r = s !== void 0 ? (o = e._$Co) == null ? void 0 : o[s] : e._$Cl;
-  const n = D(t) ? void 0 : t._$litDirective$;
-  return (r == null ? void 0 : r.constructor) !== n && ((l = r == null ? void 0 : r._$AO) == null || l.call(r, !1), n === void 0 ? r = void 0 : (r = new n(i), r._$AT(i, e, s)), s !== void 0 ? (e._$Co ?? (e._$Co = []))[s] = r : e._$Cl = r), r !== void 0 && (t = U(i, r._$AS(i, t.values), r, s)), t;
+  const n = L(t) ? void 0 : t._$litDirective$;
+  return (r == null ? void 0 : r.constructor) !== n && ((l = r == null ? void 0 : r._$AO) == null || l.call(r, !1), n === void 0 ? r = void 0 : (r = new n(i), r._$AT(i, e, s)), s !== void 0 ? (e._$Co ?? (e._$Co = []))[s] = r : e._$Cl = r), r !== void 0 && (t = M(i, r._$AS(i, t.values), r, s)), t;
 }
-class Rt {
+class Lt {
   constructor(t, e) {
     this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = e;
   }
@@ -356,30 +356,30 @@ class Rt {
     return this._$AM._$AU;
   }
   u(t) {
-    const { el: { content: e }, parts: s } = this._$AD, r = ((t == null ? void 0 : t.creationScope) ?? x).importNode(e, !0);
-    A.currentNode = r;
-    let n = A.nextNode(), o = 0, l = 0, a = s[0];
+    const { el: { content: e }, parts: s } = this._$AD, r = ((t == null ? void 0 : t.creationScope) ?? C).importNode(e, !0);
+    E.currentNode = r;
+    let n = E.nextNode(), o = 0, l = 0, a = s[0];
     for (; a !== void 0; ) {
       if (o === a.index) {
-        let d;
-        a.type === 2 ? d = new j(n, n.nextSibling, this, t) : a.type === 1 ? d = new a.ctor(n, a.name, a.strings, this, t) : a.type === 6 && (d = new zt(n, this, t)), this._$AV.push(d), a = s[++l];
+        let u;
+        a.type === 2 ? u = new R(n, n.nextSibling, this, t) : a.type === 1 ? u = new a.ctor(n, a.name, a.strings, this, t) : a.type === 6 && (u = new Vt(n, this, t)), this._$AV.push(u), a = s[++l];
       }
-      o !== (a == null ? void 0 : a.index) && (n = A.nextNode(), o++);
+      o !== (a == null ? void 0 : a.index) && (n = E.nextNode(), o++);
     }
-    return A.currentNode = x, r;
+    return E.currentNode = C, r;
   }
   p(t) {
     let e = 0;
     for (const s of this._$AV) s !== void 0 && (s.strings !== void 0 ? (s._$AI(t, s, e), e += s.strings.length - 2) : s._$AI(t[e])), e++;
   }
 }
-class j {
+class R {
   get _$AU() {
     var t;
     return ((t = this._$AM) == null ? void 0 : t._$AU) ?? this._$Cv;
   }
   constructor(t, e, s, r) {
-    this.type = 2, this._$AH = c, this._$AN = void 0, this._$AA = t, this._$AB = e, this._$AM = s, this.options = r, this._$Cv = (r == null ? void 0 : r.isConnected) ?? !0;
+    this.type = 2, this._$AH = d, this._$AN = void 0, this._$AA = t, this._$AB = e, this._$AM = s, this.options = r, this._$Cv = (r == null ? void 0 : r.isConnected) ?? !0;
   }
   get parentNode() {
     let t = this._$AA.parentNode;
@@ -393,7 +393,7 @@ class j {
     return this._$AB;
   }
   _$AI(t, e = this) {
-    t = U(this, t, e), D(t) ? t === c || t == null || t === "" ? (this._$AH !== c && this._$AR(), this._$AH = c) : t !== this._$AH && t !== C && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : Ht(t) ? this.k(t) : this._(t);
+    t = M(this, t, e), L(t) ? t === d || t == null || t === "" ? (this._$AH !== d && this._$AR(), this._$AH = d) : t !== this._$AH && t !== P && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : zt(t) ? this.k(t) : this._(t);
   }
   O(t) {
     return this._$AA.parentNode.insertBefore(t, this._$AB);
@@ -402,26 +402,26 @@ class j {
     this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
   }
   _(t) {
-    this._$AH !== c && D(this._$AH) ? this._$AA.nextSibling.data = t : this.T(x.createTextNode(t)), this._$AH = t;
+    this._$AH !== d && L(this._$AH) ? this._$AA.nextSibling.data = t : this.T(C.createTextNode(t)), this._$AH = t;
   }
   $(t) {
     var n;
-    const { values: e, _$litType$: s } = t, r = typeof s == "number" ? this._$AC(t) : (s.el === void 0 && (s.el = R.createElement(wt(s.h, s.h[0]), this.options)), s);
+    const { values: e, _$litType$: s } = t, r = typeof s == "number" ? this._$AC(t) : (s.el === void 0 && (s.el = D.createElement(Et(s.h, s.h[0]), this.options)), s);
     if (((n = this._$AH) == null ? void 0 : n._$AD) === r) this._$AH.p(e);
     else {
-      const o = new Rt(r, this), l = o.u(this.options);
+      const o = new Lt(r, this), l = o.u(this.options);
       o.p(e), this.T(l), this._$AH = o;
     }
   }
   _$AC(t) {
-    let e = gt.get(t.strings);
-    return e === void 0 && gt.set(t.strings, e = new R(t)), e;
+    let e = vt.get(t.strings);
+    return e === void 0 && vt.set(t.strings, e = new D(t)), e;
   }
   k(t) {
-    rt(this._$AH) || (this._$AH = [], this._$AR());
+    nt(this._$AH) || (this._$AH = [], this._$AR());
     const e = this._$AH;
     let s, r = 0;
-    for (const n of t) r === e.length ? e.push(s = new j(this.O(N()), this.O(N()), this, this.options)) : s = e[r], s._$AI(n), r++;
+    for (const n of t) r === e.length ? e.push(s = new R(this.O(N()), this.O(N()), this, this.options)) : s = e[r], s._$AI(n), r++;
     r < e.length && (this._$AR(s && s._$AB.nextSibling, r), e.length = r);
   }
   _$AR(t = this._$AA.nextSibling, e) {
@@ -436,7 +436,7 @@ class j {
     this._$AM === void 0 && (this._$Cv = t, (e = this._$AP) == null || e.call(this, t));
   }
 }
-class q {
+class F {
   get tagName() {
     return this.element.tagName;
   }
@@ -444,46 +444,46 @@ class q {
     return this._$AM._$AU;
   }
   constructor(t, e, s, r, n) {
-    this.type = 1, this._$AH = c, this._$AN = void 0, this.element = t, this.name = e, this._$AM = r, this.options = n, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = c;
+    this.type = 1, this._$AH = d, this._$AN = void 0, this.element = t, this.name = e, this._$AM = r, this.options = n, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = d;
   }
   _$AI(t, e = this, s, r) {
     const n = this.strings;
     let o = !1;
-    if (n === void 0) t = U(this, t, e, 0), o = !D(t) || t !== this._$AH && t !== C, o && (this._$AH = t);
+    if (n === void 0) t = M(this, t, e, 0), o = !L(t) || t !== this._$AH && t !== P, o && (this._$AH = t);
     else {
       const l = t;
-      let a, d;
-      for (t = n[0], a = 0; a < n.length - 1; a++) d = U(this, l[s + a], e, a), d === C && (d = this._$AH[a]), o || (o = !D(d) || d !== this._$AH[a]), d === c ? t = c : t !== c && (t += (d ?? "") + n[a + 1]), this._$AH[a] = d;
+      let a, u;
+      for (t = n[0], a = 0; a < n.length - 1; a++) u = M(this, l[s + a], e, a), u === P && (u = this._$AH[a]), o || (o = !L(u) || u !== this._$AH[a]), u === d ? t = d : t !== d && (t += (u ?? "") + n[a + 1]), this._$AH[a] = u;
     }
     o && !r && this.j(t);
   }
   j(t) {
-    t === c ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
+    t === d ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
   }
 }
-class Bt extends q {
+class Dt extends F {
   constructor() {
     super(...arguments), this.type = 3;
   }
   j(t) {
-    this.element[this.name] = t === c ? void 0 : t;
+    this.element[this.name] = t === d ? void 0 : t;
   }
 }
-class jt extends q {
+class Rt extends F {
   constructor() {
     super(...arguments), this.type = 4;
   }
   j(t) {
-    this.element.toggleAttribute(this.name, !!t && t !== c);
+    this.element.toggleAttribute(this.name, !!t && t !== d);
   }
 }
-class Lt extends q {
+class jt extends F {
   constructor(t, e, s, r, n) {
     super(t, e, s, r, n), this.type = 5;
   }
   _$AI(t, e = this) {
-    if ((t = U(this, t, e, 0) ?? c) === C) return;
-    const s = this._$AH, r = t === c && s !== c || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive, n = t !== c && (s === c || r);
+    if ((t = M(this, t, e, 0) ?? d) === P) return;
+    const s = this._$AH, r = t === d && s !== d || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive, n = t !== d && (s === d || r);
     r && this.element.removeEventListener(this.name, this, s), n && this.element.addEventListener(this.name, this, t), this._$AH = t;
   }
   handleEvent(t) {
@@ -491,7 +491,7 @@ class Lt extends q {
     typeof this._$AH == "function" ? this._$AH.call(((e = this.options) == null ? void 0 : e.host) ?? this.element, t) : this._$AH.handleEvent(t);
   }
 }
-class zt {
+class Vt {
   constructor(t, e, s) {
     this.element = t, this.type = 6, this._$AN = void 0, this._$AM = e, this.options = s;
   }
@@ -499,17 +499,17 @@ class zt {
     return this._$AM._$AU;
   }
   _$AI(t) {
-    U(this, t);
+    M(this, t);
   }
 }
-const J = H.litHtmlPolyfillSupport;
-J == null || J(R, j), (H.litHtmlVersions ?? (H.litHtmlVersions = [])).push("3.3.0");
-const It = (i, t, e) => {
+const G = B.litHtmlPolyfillSupport;
+G == null || G(D, R), (B.litHtmlVersions ?? (B.litHtmlVersions = [])).push("3.3.0");
+const qt = (i, t, e) => {
   const s = (e == null ? void 0 : e.renderBefore) ?? t;
   let r = s._$litPart$;
   if (r === void 0) {
     const n = (e == null ? void 0 : e.renderBefore) ?? null;
-    s._$litPart$ = r = new j(t.insertBefore(N(), n), n, void 0, e ?? {});
+    s._$litPart$ = r = new R(t.insertBefore(N(), n), n, void 0, e ?? {});
   }
   return r._$AI(i), r;
 };
@@ -519,7 +519,7 @@ const It = (i, t, e) => {
  * SPDX-License-Identifier: BSD-3-Clause
  */
 const S = globalThis;
-let E = class extends O {
+let w = class extends U {
   constructor() {
     super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
   }
@@ -530,7 +530,7 @@ let E = class extends O {
   }
   update(t) {
     const e = this.render();
-    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Do = It(e, this.renderRoot, this.renderOptions);
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Do = qt(e, this.renderRoot, this.renderOptions);
   }
   connectedCallback() {
     var t;
@@ -541,20 +541,20 @@ let E = class extends O {
     super.disconnectedCallback(), (t = this._$Do) == null || t.setConnected(!1);
   }
   render() {
-    return C;
+    return P;
   }
 };
-var ft;
-E._$litElement$ = !0, E.finalized = !0, (ft = S.litElementHydrateSupport) == null || ft.call(S, { LitElement: E });
-const K = S.litElementPolyfillSupport;
-K == null || K({ LitElement: E });
+var yt;
+w._$litElement$ = !0, w.finalized = !0, (yt = S.litElementHydrateSupport) == null || yt.call(S, { LitElement: w });
+const Q = S.litElementPolyfillSupport;
+Q == null || Q({ LitElement: w });
 (S.litElementVersions ?? (S.litElementVersions = [])).push("4.2.0");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const it = (i) => (t, e) => {
+const Z = (i) => (t, e) => {
   e !== void 0 ? e.addInitializer(() => {
     customElements.define(i, t);
   }) : customElements.define(i, t);
@@ -564,7 +564,7 @@ const it = (i) => (t, e) => {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const Vt = { attribute: !0, type: String, converter: I, reflect: !1, hasChanged: st }, qt = (i = Vt, t, e) => {
+const Wt = { attribute: !0, type: String, converter: q, reflect: !1, hasChanged: ot }, Ft = (i = Wt, t, e) => {
   const { kind: s, metadata: r } = e;
   let n = globalThis.litPropertyMetadata.get(r);
   if (n === void 0 && globalThis.litPropertyMetadata.set(r, n = /* @__PURE__ */ new Map()), s === "setter" && ((i = Object.create(i)).wrapped = !0), n.set(e.name, i), s === "accessor") {
@@ -585,18 +585,18 @@ const Vt = { attribute: !0, type: String, converter: I, reflect: !1, hasChanged:
   }
   throw Error("Unsupported decorator location: " + s);
 };
-function p(i) {
-  return (t, e) => typeof e == "object" ? qt(i, t, e) : ((s, r, n) => {
+function c(i) {
+  return (t, e) => typeof e == "object" ? Ft(i, t, e) : ((s, r, n) => {
     const o = r.hasOwnProperty(n);
     return r.constructor.createProperty(n, s), o ? Object.getOwnPropertyDescriptor(r, n) : void 0;
   })(i, t, e);
 }
-const Wt = B`
+const Zt = I`
 	outline: 1px dashed var(--button-border-color);
 	outline-offset: 2px;
 	outline: dashed black;
 `;
-B`
+I`
 	:host * {
 		box-sizing: border-box;
 	}
@@ -606,12 +606,12 @@ B`
  * Copyright 2023 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-const ot = Symbol("internals"), G = Symbol("privateInternals");
-function Ft(i) {
+const at = Symbol("internals"), Y = Symbol("privateInternals");
+function Jt(i) {
   var t;
   class e extends i {
-    get [(t = ot, t)]() {
-      return this[G] || (this[G] = this.attachInternals()), this[G];
+    get [(t = at, t)]() {
+      return this[Y] || (this[Y] = this.attachInternals()), this[Y];
     }
   }
   return e;
@@ -621,11 +621,11 @@ function Ft(i) {
  * Copyright 2023 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-function Zt(i) {
+function Kt(i) {
   i.addInitializer((t) => {
     const e = t;
     e.addEventListener("click", async (s) => {
-      const { type: r, [ot]: n } = e, { form: o } = n;
+      const { type: r, [at]: n } = e, { form: o } = n;
       if (!(!o || r === "button") && (await new Promise((l) => {
         setTimeout(l);
       }), !s.defaultPrevented)) {
@@ -648,12 +648,12 @@ function Zt(i) {
     });
   });
 }
-var Jt = Object.defineProperty, Kt = Object.getOwnPropertyDescriptor, P = (i, t, e, s) => {
-  for (var r = s > 1 ? void 0 : s ? Kt(t, e) : t, n = i.length - 1, o; n >= 0; n--)
+var Xt = Object.defineProperty, Gt = Object.getOwnPropertyDescriptor, O = (i, t, e, s) => {
+  for (var r = s > 1 ? void 0 : s ? Gt(t, e) : t, n = i.length - 1, o; n >= 0; n--)
     (o = i[n]) && (r = (s ? o(t, e, r) : o(r)) || r);
-  return s && r && Jt(t, e, r), r;
+  return s && r && Xt(t, e, r), r;
 };
-const Gt = Ft(E), $t = (i) => {
+const Qt = Jt(w), $t = (i) => {
   const t = `
 		--button-bg-disabled: var(--color-container-disabled);
     --button-bg-pressed: var(--color-container-action-${i}-pressed);
@@ -668,9 +668,9 @@ const Gt = Ft(E), $t = (i) => {
 		--button-text-hover: var(--color-content-action-${i});
 		--button-text: var(--color-content-action-${i});
 	`;
-  return yt(t);
-}, Qt = ["primary", "secondary"];
-let b = class extends Gt {
+  return _t(t);
+}, Yt = ["primary", "secondary"];
+let f = class extends Qt {
   constructor() {
     super(...arguments), this.type = "submit", this.value = "", this.variant = "primary", this.disabled = !1, this.href = "", this.target = "";
   }
@@ -684,32 +684,32 @@ let b = class extends Gt {
    * The associated form element with which this element's value will submit.
    */
   get form() {
-    return this[ot].form;
+    return this[at].form;
   }
   // TODO: Add aria attributes support
   // Adapt from: https://github.dev/material-components/material-web
   willUpdate() {
     const i = getComputedStyle(this).getPropertyValue("--button-variant");
-    i && Qt.some((t) => t === i) && (this.variant = i);
+    i && Yt.some((t) => t === i) && (this.variant = i);
   }
   render() {
     const i = this.href ? this.renderLink() : this.renderButton();
-    return w`${i}`;
+    return g`${i}`;
   }
   renderLink() {
-    return w`<a href=${this.href} target=${this.target || c} class="button" ?disabled=${this.disabled}>
+    return g`<a href=${this.href} target=${this.target || d} class="button" ?disabled=${this.disabled}>
       <slot />
     </a>`;
   }
   renderButton() {
-    return w`<button class="button" ?disabled=${this.disabled}>
+    return g`<button class="button" ?disabled=${this.disabled}>
       <slot />
     </button>`;
   }
 };
-Zt(b);
-b.formAssociated = !0;
-b.styles = B`
+Kt(f);
+f.formAssociated = !0;
+f.styles = I`
     :host {
       display: inline-flex;
       cursor: pointer;
@@ -779,41 +779,41 @@ b.styles = B`
     }
 
     .button:focus-visible {
-      ${Wt};
+      ${Zt};
     }
   `;
-P([
-  p()
-], b.prototype, "type", 2);
-P([
-  p({ reflect: !0 })
-], b.prototype, "value", 2);
-P([
-  p({ reflect: !0 })
-], b.prototype, "variant", 2);
-P([
-  p({
+O([
+  c()
+], f.prototype, "type", 2);
+O([
+  c({ reflect: !0 })
+], f.prototype, "value", 2);
+O([
+  c({ reflect: !0 })
+], f.prototype, "variant", 2);
+O([
+  c({
     converter: {
       fromAttribute: (i) => i === "" || i === "true"
     }
   })
-], b.prototype, "disabled", 2);
-P([
-  p()
-], b.prototype, "href", 2);
-P([
-  p()
-], b.prototype, "target", 2);
-b = P([
-  it("o-button")
-], b);
+], f.prototype, "disabled", 2);
+O([
+  c()
+], f.prototype, "href", 2);
+O([
+  c()
+], f.prototype, "target", 2);
+f = O([
+  Z("o-button")
+], f);
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const Xt = { CHILD: 2 }, Yt = (i) => (...t) => ({ _$litDirective$: i, values: t });
-class te {
+const te = { CHILD: 2 }, ee = (i) => (...t) => ({ _$litDirective$: i, values: t });
+class se {
   constructor(t) {
   }
   get _$AU() {
@@ -834,13 +834,13 @@ class te {
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-class Q extends te {
+class tt extends se {
   constructor(t) {
-    if (super(t), this.it = c, t.type !== Xt.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
+    if (super(t), this.it = d, t.type !== te.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
   }
   render(t) {
-    if (t === c || t == null) return this._t = void 0, this.it = t;
-    if (t === C) return t;
+    if (t === d || t == null) return this._t = void 0, this.it = t;
+    if (t === P) return t;
     if (typeof t != "string") throw Error(this.constructor.directiveName + "() called with a non-string value");
     if (t === this.it) return this._t;
     this.it = t;
@@ -848,31 +848,39 @@ class Q extends te {
     return e.raw = e, this._t = { _$litType$: this.constructor.resultType, strings: e, values: [] };
   }
 }
-Q.directiveName = "unsafeHTML", Q.resultType = 1;
+tt.directiveName = "unsafeHTML", tt.resultType = 1;
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-class X extends Q {
+class et extends tt {
 }
-X.directiveName = "unsafeSVG", X.resultType = 2;
-const Y = Yt(X), ee = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+et.directiveName = "unsafeSVG", et.resultType = 2;
+const st = ee(et), re = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M8 3.6275C7.06799 0.971489 3.25399 -0.0226278 1.67414 2.30983C0.0877404 4.65197 1.67414 6.99412 2.62598 8.33249C3.0147 8.87905 8 14 8 14C8 14 12.9853 8.87905 13.374 8.33249C14.3259 6.99412 15.9123 4.65197 14.3259 2.30983C12.746 -0.0226277 8.97167 0.971489 8 3.6275Z" stroke="#3F2B2E" stroke-linecap="round"/>
 </svg>
-`, se = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+`, ie = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M16 8L4 0V16L16 8Z" fill="#3F2B2E"/>
 </svg>
+`, oe = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.2266 8.16162C11.0953 9.26599 8.72489 11.8788 5.11546 16L4.63062 15.7172C5.78886 13.4007 7.17607 10.8283 8.79223 8C7.17607 5.17172 5.78886 2.59933 4.63062 0.282827L5.11546 0C8.72489 4.12121 11.0953 6.73401 12.2266 7.83838V8.16162Z" fill="#3F2B2E"/>
+</svg>
+`, ne = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 7.83838C6.02128 6.73401 8.16109 4.12121 11.4195 0L11.8571 0.282829C10.8116 2.59933 9.55927 5.17172 8.1003 8C9.55927 10.8283 10.8115 13.4007 11.8571 15.7172L11.4195 16C8.16109 11.8788 6.02128 9.266 5 8.16162L5 7.83838Z" fill="#3F2B2E"/>
+</svg>
 `, St = {
-  wishlist: ee,
-  playerv: se
+  wishlist: re,
+  playerv: ie,
+  chevronRight: oe,
+  chevronLeft: ne
 };
-var re = Object.defineProperty, ie = Object.getOwnPropertyDescriptor, W = (i, t, e, s) => {
-  for (var r = s > 1 ? void 0 : s ? ie(t, e) : t, n = i.length - 1, o; n >= 0; n--)
+var ae = Object.defineProperty, le = Object.getOwnPropertyDescriptor, J = (i, t, e, s) => {
+  for (var r = s > 1 ? void 0 : s ? le(t, e) : t, n = i.length - 1, o; n >= 0; n--)
     (o = i[n]) && (r = (s ? o(t, e, r) : o(r)) || r);
-  return s && r && re(t, e, r), r;
+  return s && r && ae(t, e, r), r;
 };
-let k = class extends E {
+let T = class extends w {
   constructor() {
     super(...arguments), this.status = "empty", this.ariaDescribedBy = "a-product-name", this.label = "Add to wishlist";
   }
@@ -881,7 +889,7 @@ let k = class extends E {
       "<svg",
       '<svg aria-hidden="true" focusable="false" part="svg"'
     );
-    return w`
+    return g`
             <button
                 type="button"
                 aria-label="${this.label}"
@@ -891,7 +899,7 @@ let k = class extends E {
                 @click="${this.toggleStatus}"
             >
                 <span class="sr-only">${this.label}</span>
-                ${Y(i)}
+                ${st(i)}
             </button>
         `;
   }
@@ -908,7 +916,7 @@ let k = class extends E {
     this.label = i, this.requestUpdate();
   }
 };
-k.styles = B`
+T.styles = I`
         :host {
 			display: inline-flex;
 			justify-content: center;
@@ -963,24 +971,24 @@ k.styles = B`
 			fill: var(--color-alpha-light-strong);
 		}
     `;
-W([
-  p({ type: String, reflect: !0 })
-], k.prototype, "status", 2);
-W([
-  p({ type: String, reflect: !0 })
-], k.prototype, "ariaDescribedBy", 2);
-W([
-  p({ type: String, reflect: !0 })
-], k.prototype, "label", 2);
-k = W([
-  it("o-wishlist-button")
-], k);
-var oe = Object.defineProperty, ne = Object.getOwnPropertyDescriptor, m = (i, t, e, s) => {
-  for (var r = s > 1 ? void 0 : s ? ne(t, e) : t, n = i.length - 1, o; n >= 0; n--)
+J([
+  c({ type: String, reflect: !0 })
+], T.prototype, "status", 2);
+J([
+  c({ type: String, reflect: !0 })
+], T.prototype, "ariaDescribedBy", 2);
+J([
+  c({ type: String, reflect: !0 })
+], T.prototype, "label", 2);
+T = J([
+  Z("o-wishlist-button")
+], T);
+var he = Object.defineProperty, ce = Object.getOwnPropertyDescriptor, A = (i, t, e, s) => {
+  for (var r = s > 1 ? void 0 : s ? ce(t, e) : t, n = i.length - 1, o; n >= 0; n--)
     (o = i[n]) && (r = (s ? o(t, e, r) : o(r)) || r);
-  return s && r && oe(t, e, r), r;
+  return s && r && he(t, e, r), r;
 };
-let g = class extends E {
+let b = class extends w {
   constructor() {
     super(...arguments), this.bgstyle = "background-light", this.size = "medium", this.status = "empty", this.type = "button", this.strokewidth = "1", this.icon = "wishlist", this.disabled = !1;
   }
@@ -988,29 +996,29 @@ let g = class extends E {
     super.updated(i), this.style.setProperty("--icon-stroke-width", this.strokewidth);
   }
   render() {
-    const t = (St[this.icon] ?? "").replace(
+    const i = St[this.icon] ?? "", t = `icon-${this.icon}`, e = i.replace(
       "<svg",
       '<svg aria-hidden="true" focusable="false" part="svg"'
     );
-    return w`
-			${this.type === "span" ? w`
-				<span class="icon icon-button ${this.size} ${this.bgstyle} ${this.status}" ?disabled="${this.disabled}">	
-					${Y(t)}
+    return g`
+			${this.type === "span" ? g`
+				<span class="icon icon-button ${this.size} ${this.bgstyle} ${this.status} ${t}" ?disabled="${this.disabled}">	
+					${st(e)}
 				</span>
-			` : w`
+			` : g`
 				<button
 					type="button"
 					aria-label="icon"
-					class="icon-button ${this.size} ${this.bgstyle} ${this.status}"
+					class="icon-button ${this.size} ${this.bgstyle} ${this.status} ${t}"
 					?disabled="${this.disabled}"
 				>
-					${Y(t)}
+					${st(e)}
 				</button>
 			`}
 		`;
   }
 };
-g.styles = B`
+b.styles = I`
 		:host {
 			display: inline-flex;
 			justify-content: center;
@@ -1090,10 +1098,15 @@ g.styles = B`
 			svg {
 				path {
 					stroke: var(--color-content-action-primary);
+					fill: var(--color-content-action-primary);
 				}
 			}
 		}
 
+		.icon-button.none-light.icon-wishlist svg path {
+			fill: none;
+		}
+
 		.icon-button.background-light {
 			background-color: var(--color-alpha-light-strong);
 
@@ -1163,27 +1176,181 @@ g.styles = B`
 			
 		}
 	`;
-m([
-  p({ type: String, reflect: !0 })
-], g.prototype, "bgstyle", 2);
-m([
-  p({ type: String, reflect: !0 })
-], g.prototype, "size", 2);
-m([
-  p({ type: String, reflect: !0 })
-], g.prototype, "status", 2);
-m([
-  p({ type: String, reflect: !0 })
-], g.prototype, "type", 2);
-m([
-  p({ type: String })
-], g.prototype, "strokewidth", 2);
-m([
-  p({ type: String })
-], g.prototype, "icon", 2);
-m([
-  p({ type: Boolean, reflect: !0 })
-], g.prototype, "disabled", 2);
-g = m([
-  it("o-icon-button")
-], g);
+A([
+  c({ type: String, reflect: !0 })
+], b.prototype, "bgstyle", 2);
+A([
+  c({ type: String, reflect: !0 })
+], b.prototype, "size", 2);
+A([
+  c({ type: String, reflect: !0 })
+], b.prototype, "status", 2);
+A([
+  c({ type: String, reflect: !0 })
+], b.prototype, "type", 2);
+A([
+  c({ type: String })
+], b.prototype, "strokewidth", 2);
+A([
+  c({ type: String })
+], b.prototype, "icon", 2);
+A([
+  c({ type: Boolean, reflect: !0 })
+], b.prototype, "disabled", 2);
+b = A([
+  Z("o-icon-button")
+], b);
+var de = Object.defineProperty, ue = Object.getOwnPropertyDescriptor, k = (i, t, e, s) => {
+  for (var r = s > 1 ? void 0 : s ? ue(t, e) : t, n = i.length - 1, o; n >= 0; n--)
+    (o = i[n]) && (r = (s ? o(t, e, r) : o(r)) || r);
+  return s && r && de(t, e, r), r;
+};
+let $ = class extends w {
+  constructor() {
+    super(...arguments), this.href = "", this.target = "", this.status = "standard", this.inverse = !1, this.endIcon = !1, this.reverseEndIcon = !1;
+  }
+  render() {
+    return g`
+            <a href="${this.href}" target="${this.target}">
+                ${this.endIcon && this.reverseEndIcon ? g`
+                            <o-icon-button
+                                icon="chevronLeft"
+                                bgstyle="${this.inverse ? "none-light" : "none-contrast"}"
+                                size="small"
+                                aria-hidden="true"
+                                type="span"
+                            ></o-icon-button>
+                    ` : null}
+                <span class="link-text"><slot></slot></span>
+                ${this.endIcon && !this.reverseEndIcon ? g`
+                            <o-icon-button
+                                icon="chevronRight"
+                                bgstyle="${this.inverse ? "none-light" : "none-contrast"}"
+                                size="small"
+                                aria-hidden="true"
+                                type="span"
+                            ></o-icon-button>
+                    ` : null}
+            </a>
+        `;
+  }
+};
+$.styles = I`
+        :host([status="standard"]) a {
+            color: var(--color-content-action-secondary);
+            font-size: var(--font-size-200);
+            font-weight: var(--font-weight-400);
+            line-height: var(--line-height-240);
+            letter-spacing: var(--letter-spacing-400);
+            font-family: var(--font-family-loccitane-serif);
+        }
+
+        :host([status="discret"]) a {
+            color: var(--color-content-action-secondary);
+            font-size: var(--font-size-100);
+            font-weight: var(--font-weight-400);
+            line-height: var(--line-height-160);
+            letter-spacing: var(--letter-spacing-400);
+            font-family: var(--font-family-loccitane-sans);
+        }
+
+        :host([status="review"]) a {
+            color: var(--color-content-action-secondary);
+            font-size: var(--font-size-100);
+            font-weight: var(--font-weight-500);
+            line-height: var(--line-height-160);
+            letter-spacing: var(--letter-spacing-400);
+            font-family: var(--font-family-loccitane-sans);
+            text-transform: uppercase;
+        }
+
+        :host([inverse]) a {
+            color: var(--color-container-action-tertiary-default);
+        }
+
+        :host([endIcon]) a o-icon-button {
+            margin-left: 2px;
+            transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+        }
+
+        :host([endIcon][reverseEndIcon]) a o-icon-button {
+            margin-right: 2px;
+            transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+        }
+
+        :host([endIcon]) a {
+            &:hover {
+                o-icon-button {
+                    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+                    :host(:not([reverseEndIcon])) & {
+                        transform: translateX(4px);
+                    }
+
+                    :host([reverseEndIcon]) & {
+                        transform: translateX(-4px);
+                    }
+                }
+            }
+        }
+
+        /*Underline effect */
+        :host a {
+            position: relative;
+            text-decoration: none;
+            color: inherit;
+        }
+
+        .link-text {
+            position: relative;
+            display: inline-block;
+        }
+
+        .link-text::after {
+            content: "";
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            width: 100%;
+            height: 1px;
+            background-color: currentColor;
+            opacity: 0;
+            transition: opacity 0.3s ease, height 0.3s ease;
+            pointer-events: none;
+        }
+
+        :host a:hover .link-text::after {
+            opacity: 1;
+            height: 1px;
+        }
+
+        :host(:not([endIcon])) .link-text::after {
+            opacity: 1;
+            height: 1px;
+        }   
+
+        :host(:not([endIcon])) a:hover .link-text::after {
+            opacity: 0;
+        }
+        /* End of underline effect */
+    `;
+k([
+  c({ type: String })
+], $.prototype, "href", 2);
+k([
+  c({ type: String })
+], $.prototype, "target", 2);
+k([
+  c({ type: String, reflect: !0 })
+], $.prototype, "status", 2);
+k([
+  c({ type: Boolean, reflect: !0 })
+], $.prototype, "inverse", 2);
+k([
+  c({ type: Boolean, reflect: !0 })
+], $.prototype, "endIcon", 2);
+k([
+  c({ type: Boolean, reflect: !0 })
+], $.prototype, "reverseEndIcon", 2);
+$ = k([
+  Z("o-link")
+], $);