@proximus/lavender-carousel 2.0.0-alpha.53 → 2.0.0-alpha.55

package/dist/index.es.js

@@ -780,17 +780,8 @@ const zt = [
   (s) => s.replace(/([A-Z])/g, "-$1").toLowerCase().slice(1)
 ), Lt = ":host{display:inline-flex;flex-direction:column;justify-content:center}svg{font-size:var(--px-size-icon-s);line-height:var(--px-font-line-height-xs);width:1em;height:1em;color:var(--px-color-icon-accent-default)}.inherit{color:inherit}.brand{color:var(--px-color-icon-brand-default)}.accent{color:var(--px-color-icon-accent-default)}.neutral{color:var(--px-color-icon-neutral-default)}.dimmed{color:var(--px-color-icon-dimmed-default)}.purpose-success{color:var(--px-color-icon-purpose-success-default)}.purpose-warning{color:var(--px-color-icon-purpose-warning-default)}.purpose-error{color:var(--px-color-icon-purpose-error-default)}.purpose-unlimited{color:var(--px-color-icon-purpose-unlimited-default)}.purpose-promo{color:var(--px-color-icon-purpose-promo-default)}.state-hover:hover{color:var(--px-color-icon-state-hover-default)}.state-active:active{color:var(--px-color-icon-state-active-default)}.state-disabled{color:var(--px-color-icon-state-disabled-default)}:host([inverted]) svg{color:var(--px-color-icon-accent-inverted)}:host([inverted]) .inherit{color:inherit}:host([inverted]) .brand{color:var(--px-color-icon-brand-inverted)}:host([inverted]) .accent{color:var(--px-color-icon-accent-inverted)}:host([inverted]) .neutral{color:var(--px-color-icon-neutral-inverted)}:host([inverted]) .dimmed{color:var(--px-color-icon-dimmed-inverted)}:host([inverted]) .purpose-success{color:var(--px-color-icon-purpose-success-inverted)}:host([inverted]) .purpose-warning{color:var(--px-color-icon-purpose-warning-inverted)}:host([inverted]) .purpose-error{color:var(--px-color-icon-purpose-error-inverted)}:host([inverted]) .purpose-unlimited{color:var(--px-color-icon-purpose-unlimited-inverted)}:host([inverted]) .purpose-promo{color:var(--px-color-icon-purpose-promo-inverted)}:host([inverted]) .state-hover:hover{color:var(--px-color-icon-state-hover-inverted)}:host([inverted]) .state-active:active{color:var(--px-color-icon-state-active-inverted)}:host([inverted]) .state-disabled{color:var(--px-color-icon-state-disabled-inverted)}.size-xs{font-size:var(--px-size-icon-xs)}.size-s{font-size:var(--px-size-icon-s)}.size-m{font-size:var(--px-size-icon-m)}.size-l{font-size:var(--px-size-icon-l)}.size-xl{font-size:var(--px-size-icon-xl)}", K = new CSSStyleSheet();
 K.replaceSync(Lt);
-const Tt = [
-  "name",
-  "size",
-  "color",
-  "aria-label",
-  "inverted",
-  "from",
-  "disabled"
-];
 var u, p, $;
-class Et extends I {
+class Tt extends I {
   constructor(...e) {
     var i;
     super(...e, K);
@@ -802,7 +793,16 @@ class Et extends I {
     this.shadowRoot.innerHTML = d(this, $).call(this), j(this, p, (i = this.attachInternals) == null ? void 0 : i.call(this)), d(this, p) && (d(this, p).role = "img");
   }
   static get observedAttributes() {
-    return [...super.observedAttributes, ...Tt];
+    return [
+      ...super.observedAttributes,
+      "name",
+      "size",
+      "color",
+      "aria-label",
+      "inverted",
+      "from",
+      "disabled"
+    ];
   }
   attributeChangedCallback(e, i, o) {
     if (i !== o)
@@ -903,10 +903,10 @@ class Et extends I {
   }
 }
 u = new WeakMap(), p = new WeakMap(), $ = new WeakMap();
-customElements.get("px-icon") || customElements.define("px-icon", Et);
-const It = ":host{--px-appleseed-size-l: 14px;--px-appleseed-size-m: 10px;--px-appleseed-size-s: 6px;--px-appleseed-size-xs: 4px}.container{display:flex}.container:has(#seed-0.appleseed-6-plus[active]) :nth-child(4)>div,.container:has(#seed-1.appleseed-6-plus[active]) :nth-child(4)>div{width:var(--px-appleseed-size-s);height:var(--px-appleseed-size-s)}.container:has(#seed-0.appleseed-6-plus[active]) :nth-child(5)>div,.container:has(#seed-1.appleseed-6-plus[active]) :nth-child(5)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-2.appleseed-6-plus[active]) :nth-child(2)>div,.container:has(#seed-2.appleseed-6-plus[active]) :nth-child(4)>div{width:var(--px-appleseed-size-s);height:var(--px-appleseed-size-s)}.container:has(#seed-2.appleseed-6-plus[active]) :nth-child(1)>div,.container:has(#seed-2.appleseed-6-plus[active]) :nth-child(5)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-3.appleseed-6-plus[active]) :nth-child(1)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-3.appleseed-6-plus[active]) :nth-child(2)>div{width:var(--px-appleseed-size-s);height:var(--px-appleseed-size-s)}.container:has(#seed-3.appleseed-6-plus[active]) :nth-child(5)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-4.appleseed-6-plus[active]) :nth-child(1)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-4.appleseed-6-plus[active]) :nth-child(2)>div{width:var(--px-appleseed-size-s);height:var(--px-appleseed-size-s)}.appleseed{width:var(--px-size-icon-m);height:var(--px-size-icon-m);display:flex;justify-content:center;align-items:center}@media only screen and (max-width: 47.938em){.appleseed{width:var(--px-size-icon-s);height:var(--px-size-icon-s)}}.appleseed-6-plus>div,.appleseed-6-minus>div{box-shadow:inset 0 0 0 var(--px-size-border-s) var(--px-color-border-brand-default);border-radius:var(--px-radius-main);height:var(--px-appleseed-size-m);width:var(--px-appleseed-size-m)}.appleseed-6-plus[active]>div,.appleseed-6-minus[active]>div{width:var(--px-appleseed-size-l);height:var(--px-appleseed-size-l);background-color:var(--px-color-icon-brand-default)}", J = new CSSStyleSheet();
-J.replaceSync(It);
-class Rt extends HTMLElement {
+customElements.get("px-icon") || customElements.define("px-icon", Tt);
+const Et = ":host{--px-appleseed-size-l: 14px;--px-appleseed-size-m: 10px;--px-appleseed-size-s: 6px;--px-appleseed-size-xs: 4px}.container{display:flex}.container:has(#seed-0.appleseed-6-plus[active]) :nth-child(4)>div,.container:has(#seed-1.appleseed-6-plus[active]) :nth-child(4)>div{width:var(--px-appleseed-size-s);height:var(--px-appleseed-size-s)}.container:has(#seed-0.appleseed-6-plus[active]) :nth-child(5)>div,.container:has(#seed-1.appleseed-6-plus[active]) :nth-child(5)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-2.appleseed-6-plus[active]) :nth-child(2)>div,.container:has(#seed-2.appleseed-6-plus[active]) :nth-child(4)>div{width:var(--px-appleseed-size-s);height:var(--px-appleseed-size-s)}.container:has(#seed-2.appleseed-6-plus[active]) :nth-child(1)>div,.container:has(#seed-2.appleseed-6-plus[active]) :nth-child(5)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-3.appleseed-6-plus[active]) :nth-child(1)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-3.appleseed-6-plus[active]) :nth-child(2)>div{width:var(--px-appleseed-size-s);height:var(--px-appleseed-size-s)}.container:has(#seed-3.appleseed-6-plus[active]) :nth-child(5)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-4.appleseed-6-plus[active]) :nth-child(1)>div{width:var(--px-appleseed-size-xs);height:var(--px-appleseed-size-xs)}.container:has(#seed-4.appleseed-6-plus[active]) :nth-child(2)>div{width:var(--px-appleseed-size-s);height:var(--px-appleseed-size-s)}.appleseed{width:var(--px-size-icon-m);height:var(--px-size-icon-m);display:flex;justify-content:center;align-items:center}@media only screen and (max-width: 47.938em){.appleseed{width:var(--px-size-icon-s);height:var(--px-size-icon-s)}}.appleseed-6-plus>div,.appleseed-6-minus>div{box-shadow:inset 0 0 0 var(--px-size-border-s) var(--px-color-border-brand-default);border-radius:var(--px-radius-main);height:var(--px-appleseed-size-m);width:var(--px-appleseed-size-m)}.appleseed-6-plus[active]>div,.appleseed-6-minus[active]>div{width:var(--px-appleseed-size-l);height:var(--px-appleseed-size-l);background-color:var(--px-color-icon-brand-default)}", J = new CSSStyleSheet();
+J.replaceSync(Et);
+class It extends HTMLElement {
   constructor() {
     super(), this.template = (t, e) => `<div class="container">
       ${Array.from(
@@ -948,54 +948,54 @@ class Rt extends HTMLElement {
     return parseInt(this.getAttribute("active")) || 0;
   }
 }
-customElements.get("px-appleseed") || customElements.define("px-appleseed", Rt);
+customElements.get("px-appleseed") || customElements.define("px-appleseed", It);
 function y(s) {
   var t = typeof s;
   return s != null && (t == "object" || t == "function");
 }
-var Mt = typeof global == "object" && global && global.Object === Object && global, Ht = typeof self == "object" && self && self.Object === Object && self, Q = Mt || Ht || Function("return this")(), L = function() {
+var Rt = typeof global == "object" && global && global.Object === Object && global, Mt = typeof self == "object" && self && self.Object === Object && self, Q = Rt || Mt || Function("return this")(), L = function() {
   return Q.Date.now();
-}, Pt = /\s/;
-function Dt(s) {
-  for (var t = s.length; t-- && Pt.test(s.charAt(t)); )
+}, Ht = /\s/;
+function Pt(s) {
+  for (var t = s.length; t-- && Ht.test(s.charAt(t)); )
     ;
   return t;
 }
-var qt = /^\s+/;
-function Ot(s) {
-  return s && s.slice(0, Dt(s) + 1).replace(qt, "");
+var Dt = /^\s+/;
+function qt(s) {
+  return s && s.slice(0, Pt(s) + 1).replace(Dt, "");
 }
-var w = Q.Symbol, Y = Object.prototype, Nt = Y.hasOwnProperty, Wt = Y.toString, f = w ? w.toStringTag : void 0;
-function Xt(s) {
-  var t = Nt.call(s, f), e = s[f];
+var w = Q.Symbol, Y = Object.prototype, Ot = Y.hasOwnProperty, Nt = Y.toString, f = w ? w.toStringTag : void 0;
+function Wt(s) {
+  var t = Ot.call(s, f), e = s[f];
   try {
     s[f] = void 0;
     var i = !0;
   } catch {
   }
-  var o = Wt.call(s);
+  var o = Nt.call(s);
   return i && (t ? s[f] = e : delete s[f]), o;
 }
-var Ft = Object.prototype, Bt = Ft.toString;
-function Gt(s) {
-  return Bt.call(s);
+var Xt = Object.prototype, Ft = Xt.toString;
+function Bt(s) {
+  return Ft.call(s);
 }
-var Zt = "[object Null]", _t = "[object Undefined]", W = w ? w.toStringTag : void 0;
-function Ut(s) {
-  return s == null ? s === void 0 ? _t : Zt : W && W in Object(s) ? Xt(s) : Gt(s);
+var Gt = "[object Null]", Zt = "[object Undefined]", W = w ? w.toStringTag : void 0;
+function _t(s) {
+  return s == null ? s === void 0 ? Zt : Gt : W && W in Object(s) ? Wt(s) : Bt(s);
 }
-function Kt(s) {
+function Ut(s) {
   return s != null && typeof s == "object";
 }
-var Jt = "[object Symbol]";
-function Qt(s) {
-  return typeof s == "symbol" || Kt(s) && Ut(s) == Jt;
+var Kt = "[object Symbol]";
+function Jt(s) {
+  return typeof s == "symbol" || Ut(s) && _t(s) == Kt;
 }
-var X = NaN, Yt = /^[-+]0x[0-9a-f]+$/i, Vt = /^0b[01]+$/i, te = /^0o[0-7]+$/i, ee = parseInt;
+var X = NaN, Qt = /^[-+]0x[0-9a-f]+$/i, Yt = /^0b[01]+$/i, Vt = /^0o[0-7]+$/i, te = parseInt;
 function F(s) {
   if (typeof s == "number")
     return s;
-  if (Qt(s))
+  if (Jt(s))
     return X;
   if (y(s)) {
     var t = typeof s.valueOf == "function" ? s.valueOf() : s;
@@ -1003,16 +1003,16 @@ function F(s) {
   }
   if (typeof s != "string")
     return s === 0 ? s : +s;
-  s = Ot(s);
-  var e = Vt.test(s);
-  return e || te.test(s) ? ee(s.slice(2), e ? 2 : 8) : Yt.test(s) ? X : +s;
+  s = qt(s);
+  var e = Yt.test(s);
+  return e || Vt.test(s) ? te(s.slice(2), e ? 2 : 8) : Qt.test(s) ? X : +s;
 }
-var ie = "Expected a function", se = Math.max, oe = Math.min;
-function re(s, t, e) {
+var ee = "Expected a function", ie = Math.max, se = Math.min;
+function oe(s, t, e) {
   var i, o, n, l, a, c, b = 0, H = !1, g = !1, S = !0;
   if (typeof s != "function")
-    throw new TypeError(ie);
-  t = F(t) || 0, y(e) && (H = !!e.leading, g = "maxWait" in e, n = g ? se(F(e.maxWait) || 0, t) : n, S = "trailing" in e ? !!e.trailing : S);
+    throw new TypeError(ee);
+  t = F(t) || 0, y(e) && (H = !!e.leading, g = "maxWait" in e, n = g ? ie(F(e.maxWait) || 0, t) : n, S = "trailing" in e ? !!e.trailing : S);
   function C(r) {
     var h = i, v = o;
     return i = o = void 0, b = r, l = s.apply(v, h), l;
@@ -1022,7 +1022,7 @@ function re(s, t, e) {
   }
   function et(r) {
     var h = r - c, v = r - b, q = t - h;
-    return g ? oe(q, n - v) : q;
+    return g ? se(q, n - v) : q;
   }
   function P(r) {
     var h = r - c, v = r - b;
@@ -1055,12 +1055,12 @@ function re(s, t, e) {
   }
   return z.cancel = it, z.flush = st, z;
 }
-var ae = "Expected a function";
-function ne(s, t, e) {
+var re = "Expected a function";
+function ae(s, t, e) {
   var i = !0, o = !0;
   if (typeof s != "function")
-    throw new TypeError(ae);
-  return y(e) && (i = "leading" in e ? !!e.leading : i, o = "trailing" in e ? !!e.trailing : o), re(s, t, {
+    throw new TypeError(re);
+  return y(e) && (i = "leading" in e ? !!e.leading : i, o = "trailing" in e ? !!e.trailing : o), oe(s, t, {
     leading: i,
     maxWait: t,
     trailing: o
@@ -1068,8 +1068,8 @@ function ne(s, t, e) {
 }
 const M = new CSSStyleSheet();
 M.replaceSync(dt);
-const le = (s, t, e) => `:host([${s}${e ? `--${e}` : ""}='${t}']) .carousel`, ce = "px-spacing", T = (s) => (t, e) => `calc(((100%  - ${Math.max(parseInt(t), 2)}  * ( var(--px-spacing-${s}-${e}))) / ${t}) - ( 64px / ${Math.max(parseInt(t), 2)}))`;
-class de extends HTMLElement {
+const ne = (s, t, e) => `:host([${s}${e ? `--${e}` : ""}='${t}']) .carousel`, le = "px-spacing", T = (s) => (t, e) => `calc(((100%  - ${Math.max(parseInt(t), 2)}  * ( var(--px-spacing-${s}-${e}))) / ${t}) - ( 64px / ${Math.max(parseInt(t), 2)}))`;
+class ce extends HTMLElement {
   constructor() {
     super(), this.visibleItemsAttributeDelegate = new B(
       this,
@@ -1107,9 +1107,9 @@ class de extends HTMLElement {
       M,
       ct(
         "gap",
-        le,
+        ne,
         G,
-        ce
+        le
       )
     ];
   }
@@ -1138,7 +1138,7 @@ class de extends HTMLElement {
       this.getAttribute("gap") || "s"
     ), requestAnimationFrame(() => {
       this.handleAppleSeedDisplay();
-    }), this.$appleseed.setAttribute("amount", `${this.itemNumbers}`), this.$carousel.addEventListener("scroll", ne(this.onScroll, 500)), this.$previous.addEventListener("click", () => {
+    }), this.$appleseed.setAttribute("amount", `${this.itemNumbers}`), this.$carousel.addEventListener("scroll", ae(this.onScroll, 500)), this.$previous.addEventListener("click", () => {
       this.$carousel.scrollLeft -= this.$carousel.clientWidth;
     }), this.$next.addEventListener("click", () => {
       this.$carousel.scrollLeft += this.$carousel.clientWidth;
@@ -1178,10 +1178,10 @@ class de extends HTMLElement {
     return this.querySelectorAll("px-carousel-item").length;
   }
 }
-customElements.get("px-carousel") || customElements.define("px-carousel", de);
+customElements.get("px-carousel") || customElements.define("px-carousel", ce);
 const V = new CSSStyleSheet();
 V.replaceSync(pt);
-class pe extends HTMLElement {
+class de extends HTMLElement {
   constructor() {
     super(), this.template = `
   <div class="carousel-item">
@@ -1189,9 +1189,9 @@ class pe extends HTMLElement {
   </div>`, this.attachShadow({ mode: "open" }), this.shadowRoot.innerHTML = this.template, this.shadowRoot.adoptedStyleSheets = [M, V];
   }
 }
-customElements.get("px-carousel-item") || customElements.define("px-carousel-item", pe);
+customElements.get("px-carousel-item") || customElements.define("px-carousel-item", de);
 export {
-  Rt as AppleSeed,
-  de as Carousel,
-  pe as CarouselItem
+  It as AppleSeed,
+  ce as Carousel,
+  de as CarouselItem
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@proximus/lavender-carousel",
-  "version": "2.0.0-alpha.53",
+  "version": "2.0.0-alpha.55",
   "description": "",
   "main": "dist/index.es.js",
   "types": "dist/index.d.ts",