@proximus/lavender-common 1.4.7-alpha.3 → 1.4.7-alpha.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- export declare function cssTokenBreakpoints(attributeName: string, selector: (attributeName: string, attribute: string, device?: 'mobile' | 'tablet' | 'laptop' | 'desktop') => string, attributeValues: string[], cssPropertyPrefix?: string, generatedCssPropertyName?: string): CSSStyleSheet;
1
+ export declare function cssTokenBreakpoints(attributeName: string, selector: (attributeName: string, attribute: string, device?: 'mobile' | 'tablet' | 'laptop' | 'desktop') => string, attributeValues: string[], cssPropertyPrefix?: string, generatedCssPropertyName?: string, selectorAttributeName?: string): CSSStyleSheet;
2
2
  export declare class AttributeBreakpointHandlerDelegate {
3
3
  private readonly component;
4
4
  private readonly attributeName;
package/dist/index.es.js CHANGED
@@ -1,23 +1,23 @@
1
- const c = ":host([grow]){flex-grow:var(--grow-value)}:host([shrink]){flex-shrink:var(--shrink-value)}:host([basis]){flex-basis:var(--basis-value)}:host([align-self]){align-self:var(--align-self-value)}:host([col-span]){grid-column:span var(--col-span-value) / span var(--col-span-value)}:host([justify-self]){justify-self:var(--justify-value)}:host([order]),::slotted([order]){order:var(--order-value)}:host([hidden]),::slotted([hidden]){display:none}:host([shown--sr]),::slotted(*[shown--sr]){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}@media screen and (max-width: 767px){:host([hidden--mobile]),::slotted([hidden--mobile]){display:none}:host([grow--mobile]){flex-grow:var(--grow--mobile-value)!important}:host([shrink--mobile]){flex-shrink:var(--shrink--mobile-value)!important}:host([basis--mobile]){flex-basis:var(--basis--mobile-value)!important}:host([align-self--mobile]){align-self:var(--align-self--mobile-value)!important}:host([col-span--mobile]){grid-column:span var(--col-span--mobile-value) / span var(--col-span--mobile-value)!important}:host([justify-self--mobile]){justify-self:var(--justify-self--mobile-value)!important}:host([order--mobile]),::slotted([order--mobile]){order:var(--order--mobile-value)!important}:host([shown--sr--mobile]),::slotted(*[shown--sr--mobile]){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}}@media screen and (min-width: 768px) and (max-width: 1024px){:host([hidden--tablet]),::slotted([hidden--tablet]){display:none}:host([grow--tablet]){flex-grow:var(--grow--tablet-value)!important}:host([shrink--tablet]){flex-shrink:var(--shrink--tablet-value)!important}:host([basis--tablet]){flex-basis:var(--basis--tablet-value)!important}:host([align-self--tablet]){align-self:var(--align-self--tablet-value)!important}:host([col-span--tablet]){grid-column:span var(--col-span--tablet-value) / span var(--col-span--tablet-value)!important}:host([justify-self--tablet]){justify-self:var(--justify-self--tablet-value)!important}:host([order--tablet]),::slotted([order--tablet]){order:var(--order--tablet-value)!important}:host([shown--sr--tablet]),::slotted(*[shown--sr--tablet]){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}}@media screen and (min-width: 1025px){:host([shown--sr--laptop]),::slotted(*[shown--sr--laptop]){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}}@media screen and (min-width: 1025px){:host([hidden--laptop]),::slotted([hidden--laptop]){display:none!important}:host([grow--laptop]){flex-grow:var(--grow--laptop-value)!important}:host([shrink--laptop]){flex-shrink:var(--shrink--laptop-value)!important}:host([basis--laptop]){flex-basis:var(--basis--laptop-value)!important}:host([align-self--laptop]){align-self:var(--align-self--laptop-value)!important}:host([col-span--laptop]){grid-column:span var(--col-span--laptop-value) / span var(--col-span--laptop-value)!important}:host([justify-self--laptop]){justify-self:var(--justify-self--laptop-value)!important}:host([order--laptop]),::slotted([order--laptop]){order:var(--order--laptop-value)!important}}@media screen and (min-width: 1441px){:host([col-span--desktop]){grid-column:span var(--col-span--desktop-value) / span var(--col-span--desktop-value)!important}:host([justify-self--desktop]){justify-self:var(--justify-self--desktop-value)!important}:host([order--desktop]),::slotted([order--desktop]){order:var(--order--desktop-value)!important}:host([hidden--desktop]),::slotted([hidden--desktop]){display:none!important}:host([grow--desktop]){flex-grow:var(--grow--desktop-value)!important}:host([shrink--desktop]){flex-shrink:var(--shrink--desktop-value)!important}:host([basis--desktop]){flex-basis:var(--basis--desktop-value)!important}:host([align-self--desktop]){align-self:var(--align-self--desktop-value)!important}}", g = {};
2
- function f(i) {
3
- const t = document.createElement(i), s = Object.getPrototypeOf(t);
1
+ const g = ":host([grow]){flex-grow:var(--grow-value)}:host([shrink]){flex-shrink:var(--shrink-value)}:host([basis]){flex-basis:var(--basis-value)}:host([align-self]){align-self:var(--align-self-value)}:host([col-span]){grid-column:span var(--col-span-value) / span var(--col-span-value)}:host([justify-self]){justify-self:var(--justify-value)}:host([order]),::slotted([order]){order:var(--order-value)}:host([hidden]),::slotted([hidden]){display:none}:host([shown--sr]),::slotted(*[shown--sr]){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}@media screen and (max-width: 767px){:host([hidden--mobile]),::slotted([hidden--mobile]){display:none}:host([grow--mobile]){flex-grow:var(--grow--mobile-value)!important}:host([shrink--mobile]){flex-shrink:var(--shrink--mobile-value)!important}:host([basis--mobile]){flex-basis:var(--basis--mobile-value)!important}:host([align-self--mobile]){align-self:var(--align-self--mobile-value)!important}:host([col-span--mobile]){grid-column:span var(--col-span--mobile-value) / span var(--col-span--mobile-value)!important}:host([justify-self--mobile]){justify-self:var(--justify-self--mobile-value)!important}:host([order--mobile]),::slotted([order--mobile]){order:var(--order--mobile-value)!important}:host([shown--sr--mobile]),::slotted(*[shown--sr--mobile]){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}}@media screen and (min-width: 768px) and (max-width: 1024px){:host([hidden--tablet]),::slotted([hidden--tablet]){display:none}:host([grow--tablet]){flex-grow:var(--grow--tablet-value)!important}:host([shrink--tablet]){flex-shrink:var(--shrink--tablet-value)!important}:host([basis--tablet]){flex-basis:var(--basis--tablet-value)!important}:host([align-self--tablet]){align-self:var(--align-self--tablet-value)!important}:host([col-span--tablet]){grid-column:span var(--col-span--tablet-value) / span var(--col-span--tablet-value)!important}:host([justify-self--tablet]){justify-self:var(--justify-self--tablet-value)!important}:host([order--tablet]),::slotted([order--tablet]){order:var(--order--tablet-value)!important}:host([shown--sr--tablet]),::slotted(*[shown--sr--tablet]){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}}@media screen and (min-width: 1025px){:host([shown--sr--laptop]),::slotted(*[shown--sr--laptop]){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}}@media screen and (min-width: 1025px){:host([hidden--laptop]),::slotted([hidden--laptop]){display:none!important}:host([grow--laptop]){flex-grow:var(--grow--laptop-value)!important}:host([shrink--laptop]){flex-shrink:var(--shrink--laptop-value)!important}:host([basis--laptop]){flex-basis:var(--basis--laptop-value)!important}:host([align-self--laptop]){align-self:var(--align-self--laptop-value)!important}:host([col-span--laptop]){grid-column:span var(--col-span--laptop-value) / span var(--col-span--laptop-value)!important}:host([justify-self--laptop]){justify-self:var(--justify-self--laptop-value)!important}:host([order--laptop]),::slotted([order--laptop]){order:var(--order--laptop-value)!important}}@media screen and (min-width: 1441px){:host([col-span--desktop]){grid-column:span var(--col-span--desktop-value) / span var(--col-span--desktop-value)!important}:host([justify-self--desktop]){justify-self:var(--justify-self--desktop-value)!important}:host([order--desktop]),::slotted([order--desktop]){order:var(--order--desktop-value)!important}:host([hidden--desktop]),::slotted([hidden--desktop]){display:none!important}:host([grow--desktop]){flex-grow:var(--grow--desktop-value)!important}:host([shrink--desktop]){flex-shrink:var(--shrink--desktop-value)!important}:host([basis--desktop]){flex-basis:var(--basis--desktop-value)!important}:host([align-self--desktop]){align-self:var(--align-self--desktop-value)!important}}", f = {};
2
+ function m(o) {
3
+ const t = document.createElement(o), s = Object.getPrototypeOf(t);
4
4
  return Object.getOwnPropertyNames(s);
5
5
  }
6
- function m(i) {
7
- const t = document.createElement(i), s = Object.getPrototypeOf(t);
6
+ function k(o) {
7
+ const t = document.createElement(o), s = Object.getPrototypeOf(t);
8
8
  return Object.getOwnPropertyNames(s).map(
9
9
  (e) => e.toLowerCase()
10
10
  );
11
11
  }
12
12
  const d = new CSSStyleSheet();
13
- d.replaceSync(c);
14
- const k = typeof import.meta < "u" && typeof g < "u" && !0;
13
+ d.replaceSync(g);
14
+ const v = typeof import.meta < "u" && typeof f < "u" && !0;
15
15
  typeof window < "u" && (window.isComponentDebug = h);
16
16
  function h() {
17
- return k;
17
+ return v;
18
18
  }
19
- function v(i) {
20
- h() && console.error(i);
19
+ function w(o) {
20
+ h() && console.error(o);
21
21
  }
22
22
  typeof window < "u" && (window.isComponentDebug = h);
23
23
  class u extends HTMLElement {
@@ -77,7 +77,7 @@ class u extends HTMLElement {
77
77
  ];
78
78
  }
79
79
  attributeChangedCallback(t, s, e) {
80
- var o;
80
+ var i;
81
81
  if (u.observedAttributes.indexOf(t) !== -1)
82
82
  switch (t) {
83
83
  case "grow":
@@ -106,7 +106,7 @@ class u extends HTMLElement {
106
106
  t,
107
107
  s,
108
108
  e,
109
- ((o = this.parentElement) == null ? void 0 : o.localName) === "px-grid" ? y : w
109
+ ((i = this.parentElement) == null ? void 0 : i.localName) === "px-grid" ? A : y
110
110
  );
111
111
  break;
112
112
  case "justify-self":
@@ -118,7 +118,7 @@ class u extends HTMLElement {
118
118
  t,
119
119
  s,
120
120
  e,
121
- A
121
+ S
122
122
  );
123
123
  break;
124
124
  case "col-span":
@@ -126,20 +126,20 @@ class u extends HTMLElement {
126
126
  case "col-span--tablet":
127
127
  case "col-span--laptop":
128
128
  case "col-span--desktop":
129
- this.updateProperties(t, s, e, S);
129
+ this.updateProperties(t, s, e, $);
130
130
  break;
131
131
  case "order":
132
132
  case "order--mobile":
133
133
  case "order--tablet":
134
134
  case "order--laptop":
135
135
  case "order--desktop":
136
- this.updateProperties(t, s, e, $);
136
+ this.updateProperties(t, s, e, x);
137
137
  break;
138
138
  }
139
139
  }
140
- updateProperties(t, s, e, o) {
141
- o && (this.checkName(o, e) || v(
142
- `${e} is not an allowed ${o} value for ${this.tagName.toLowerCase()}`
140
+ updateProperties(t, s, e, i) {
141
+ i && (this.checkName(i, e) || w(
142
+ `${e} is not an allowed ${i} value for ${this.tagName.toLowerCase()}`
143
143
  ));
144
144
  const a = t.indexOf("--") > -1, l = a ? t.split("--")[0] : t;
145
145
  if (!a)
@@ -430,7 +430,7 @@ const b = class b extends u {
430
430
  static get observedAttributes() {
431
431
  return [
432
432
  ...super.observedAttributes,
433
- ...m(this.nativeName)
433
+ ...k(this.nativeName)
434
434
  ];
435
435
  }
436
436
  attributeChangedCallback(t, s, e) {
@@ -440,7 +440,7 @@ const b = class b extends u {
440
440
  return Object.getPrototypeOf(this).constructor;
441
441
  }
442
442
  constructor(...t) {
443
- super(...t), this.ctor.supportedPropertyNames || (this.ctor.supportedPropertyNames = f(
443
+ super(...t), this.ctor.supportedPropertyNames || (this.ctor.supportedPropertyNames = m(
444
444
  this.ctor.nativeName
445
445
  )), this.enhanceWithNativeProperties();
446
446
  }
@@ -473,12 +473,12 @@ const b = class b extends u {
473
473
  };
474
474
  b.accessorExclusions = [];
475
475
  let p = b;
476
- class C extends p {
476
+ class L extends p {
477
477
  connectedCallback() {
478
478
  this.isInsideGridOrStack && (this.$el.style.display = "block", this.$el.style.height = "100%");
479
479
  }
480
480
  }
481
- const L = ["", "default", "none", "l"], w = [
481
+ const M = ["", "default", "none", "l"], y = [
482
482
  "",
483
483
  "default",
484
484
  "auto",
@@ -487,21 +487,21 @@ const L = ["", "default", "none", "l"], w = [
487
487
  "center",
488
488
  "baseline",
489
489
  "stretch"
490
- ], y = [
490
+ ], A = [
491
491
  "",
492
492
  "default",
493
493
  "start",
494
494
  "end",
495
495
  "center",
496
496
  "stretch"
497
- ], A = [
497
+ ], S = [
498
498
  "",
499
499
  "default",
500
500
  "start",
501
501
  "end",
502
502
  "center",
503
503
  "stretch"
504
- ], S = [
504
+ ], $ = [
505
505
  "",
506
506
  "1",
507
507
  "2",
@@ -515,7 +515,7 @@ const L = ["", "default", "none", "l"], w = [
515
515
  "10",
516
516
  "11",
517
517
  "12"
518
- ], $ = [
518
+ ], x = [
519
519
  "",
520
520
  "-1",
521
521
  "0",
@@ -531,7 +531,7 @@ const L = ["", "default", "none", "l"], w = [
531
531
  "10",
532
532
  "11",
533
533
  "12"
534
- ], M = [
534
+ ], N = [
535
535
  "",
536
536
  "default",
537
537
  "auto",
@@ -539,7 +539,7 @@ const L = ["", "default", "none", "l"], w = [
539
539
  "end",
540
540
  "center",
541
541
  "stretch"
542
- ], N = [
542
+ ], D = [
543
543
  "",
544
544
  "default",
545
545
  "inherit",
@@ -555,7 +555,7 @@ const L = ["", "default", "none", "l"], w = [
555
555
  "heading-l",
556
556
  "heading-m",
557
557
  "heading-s"
558
- ], D = [
558
+ ], T = [
559
559
  "",
560
560
  "default",
561
561
  "inherit",
@@ -570,7 +570,7 @@ const L = ["", "default", "none", "l"], w = [
570
570
  "state-hover",
571
571
  "state-active",
572
572
  "state-disabled"
573
- ], T = [
573
+ ], O = [
574
574
  "",
575
575
  "default",
576
576
  "inherit",
@@ -578,11 +578,11 @@ const L = ["", "default", "none", "l"], w = [
578
578
  "title",
579
579
  "title-large",
580
580
  "subtitle"
581
- ], x = ["Xs", "S", "M", "L", "Xl"], O = [
581
+ ], j = ["Xs", "S", "M", "L", "Xl"], _ = [
582
582
  "",
583
583
  "default",
584
- ...x.map((i) => i.toLowerCase())
585
- ], _ = ["", "default", "left", "center", "right"], P = [
584
+ ...j.map((o) => o.toLowerCase())
585
+ ], P = ["", "default", "left", "center", "right"], q = [
586
586
  "",
587
587
  "none",
588
588
  "3xs",
@@ -592,7 +592,7 @@ const L = ["", "default", "none", "l"], w = [
592
592
  "m",
593
593
  "l",
594
594
  "xl"
595
- ], q = ["", "none", "s", "m", "l"], G = ["", "none", "main", "pill"], E = [
595
+ ], G = ["", "none", "s", "m", "l"], E = ["", "none", "main", "pill"], B = [
596
596
  "none",
597
597
  "main",
598
598
  "brand",
@@ -603,7 +603,7 @@ const L = ["", "default", "none", "l"], w = [
603
603
  "purpose-warning",
604
604
  "purpose-error",
605
605
  "purpose-unlimited"
606
- ], B = [
606
+ ], V = [
607
607
  "",
608
608
  "all",
609
609
  "top",
@@ -612,7 +612,7 @@ const L = ["", "default", "none", "l"], w = [
612
612
  "left",
613
613
  "block",
614
614
  "inline"
615
- ], V = [
615
+ ], R = [
616
616
  "",
617
617
  "none",
618
618
  "surface-light",
@@ -640,7 +640,7 @@ const L = ["", "default", "none", "l"], w = [
640
640
  "purpose-eco",
641
641
  "purpose-notification",
642
642
  "footer-sitemap"
643
- ], R = ["", "cover", "contain", "default"], z = ["", "none", "s", "m", "l", "xl"], H = [
643
+ ], z = ["", "cover", "contain", "default"], H = ["", "none", "s", "m", "l", "xl"], I = [
644
644
  "",
645
645
  "default",
646
646
  "title-4xl",
@@ -651,7 +651,7 @@ const L = ["", "default", "none", "l"], w = [
651
651
  "title-m",
652
652
  "title-s",
653
653
  "subtitle"
654
- ], I = [
654
+ ], W = [
655
655
  "",
656
656
  "purple-top-red",
657
657
  "purple-top-magenta",
@@ -701,7 +701,7 @@ const L = ["", "default", "none", "l"], w = [
701
701
  "color-bottom-right-blue",
702
702
  "color-bottom-right-turquoise",
703
703
  "color-bottom-right-green"
704
- ], W = [
704
+ ], X = [
705
705
  "none",
706
706
  "2xs",
707
707
  "xs",
@@ -711,14 +711,14 @@ const L = ["", "default", "none", "l"], w = [
711
711
  "heading-to-subtitle",
712
712
  "heading-to-content",
713
713
  "page-layout-between-sections"
714
- ], X = [
714
+ ], F = [
715
715
  "",
716
716
  "all",
717
717
  "top",
718
718
  "right",
719
719
  "bottom",
720
720
  "left"
721
- ], F = [
721
+ ], U = [
722
722
  "",
723
723
  "default",
724
724
  "xs",
@@ -727,20 +727,20 @@ const L = ["", "default", "none", "l"], w = [
727
727
  "l",
728
728
  "xl"
729
729
  ];
730
- function U(i) {
730
+ function J(o) {
731
731
  const t = document.createElement("style");
732
- t.innerHTML = i, document.head.appendChild(t);
732
+ t.innerHTML = o, document.head.appendChild(t);
733
733
  }
734
- function J(i) {
735
- return typeof i == "string" && (i === "false" || i === "0" || i === "null") || typeof i == "boolean" && !i;
734
+ function K(o) {
735
+ return typeof o == "string" && (o === "false" || o === "0" || o === "null") || typeof o == "boolean" && !o;
736
736
  }
737
- function K() {
737
+ function Q() {
738
738
  return window.matchMedia("only screen and (min-width: 768px)").matches ? "tablet" : window.matchMedia("only screen and (min-width: 1025px)").matches ? "laptop" : "mobile";
739
739
  }
740
- function Q(i, t) {
741
- return i.includes(t);
740
+ function Y(o, t) {
741
+ return o.includes(t);
742
742
  }
743
- const j = [
743
+ const C = [
744
744
  "aria-label",
745
745
  "aria-labelledby",
746
746
  "aria-describedby",
@@ -775,64 +775,64 @@ const j = [
775
775
  "aria-busy",
776
776
  "aria-owns"
777
777
  ];
778
- function Y(i, t, s = !0) {
778
+ function Z(o, t, s = !0) {
779
779
  var e;
780
- if (j.forEach((o) => {
781
- i.getAttribute(o) && (t.setAttribute(o, i.getAttribute(o)), i.removeAttribute(o));
780
+ if (C.forEach((i) => {
781
+ o.getAttribute(i) && (t.setAttribute(i, o.getAttribute(i)), o.removeAttribute(i));
782
782
  }), s) {
783
- const o = `px-${((e = t.localName) == null ? void 0 : e.toLowerCase()) ?? "component"}-${Math.random().toString(36).substring(2, 15)}`;
784
- t.setAttribute("id", o), i.setAttribute("aria-labelledby", o);
783
+ const i = `px-${((e = t.localName) == null ? void 0 : e.toLowerCase()) ?? "component"}-${Math.random().toString(36).substring(2, 15)}`;
784
+ t.setAttribute("id", i), o.setAttribute("aria-labelledby", i);
785
785
  }
786
786
  }
787
- function Z(i, t, s, e = "", o) {
788
- const a = new CSSStyleSheet(), l = s.reduce(
789
- (n, r) => n + `
790
- ${t(i, r)} {
791
- ${i}: var(--${e}-${r}-desktop);
792
- ${o ? `${o}:var(--${e}-${r}-desktop)` : ""}
787
+ function tt(o, t, s, e = "", i, a = o) {
788
+ const l = new CSSStyleSheet(), n = s.reduce(
789
+ (c, r) => c + `
790
+ ${t(a, r)} {
791
+ ${o}: var(--${e}-${r}-desktop);
792
+ ${i ? `${i}:var(--${e}-${r}-desktop)` : ""}
793
793
  }
794
794
  /* Mobile only - max 767px */
795
795
  @media only screen and (max-width: 47.938em) {
796
- ${t(i, r)} {
797
- ${i}: var(--${e}-${r}-mobile);
798
- ${o ? `${o}: var(--${e}-${r}-mobile)` : ""}
796
+ ${t(a, r)} {
797
+ ${o}: var(--${e}-${r}-mobile);
798
+ ${i ? `${i}: var(--${e}-${r}-mobile)` : ""}
799
799
  }
800
800
  }
801
- ${t(i, r, "mobile")} {
801
+ ${t(a, r, "mobile")} {
802
802
  /* Mobile only - max 767px */
803
803
  @media only screen and (max-width: 47.938em) {
804
- ${i}: var(--${e}-${r}-mobile) !important;
805
- ${o ? `${o}: var(--${e}-${r}-mobile)` : ""}
804
+ ${o}: var(--${e}-${r}-mobile) !important;
805
+ ${i ? `${i}: var(--${e}-${r}-mobile)` : ""}
806
806
  }
807
807
  }
808
- ${t(i, r, "tablet")} {
808
+ ${t(a, r, "tablet")} {
809
809
  /* Tablet - min 768px max 1024px */
810
810
  @media only screen and (min-width: 48em) and (max-width: 64em) {
811
- ${i}: var(--${e}-${r}-desktop) !important;
812
- ${o ? `${o}: var(--${e}-${r}-desktop)` : ""}
811
+ ${o}: var(--${e}-${r}-desktop) !important;
812
+ ${i ? `${i}: var(--${e}-${r}-desktop)` : ""}
813
813
  }
814
814
  }
815
- ${t(i, r, "laptop")} {
815
+ ${t(a, r, "laptop")} {
816
816
  /* Laptop - 1025px*/
817
817
  @media only screen and (min-width: 64.0625em) {
818
- ${i}: var(--${e}-${r}-desktop) !important;
819
- ${o ? `${o}: var(--${e}-${r}-desktop)` : ""}
818
+ ${o}: var(--${e}-${r}-desktop) !important;
819
+ ${i ? `${i}: var(--${e}-${r}-desktop)` : ""}
820
820
  }
821
821
  }
822
- ${t(i, r, "desktop")} {
822
+ ${t(a, r, "desktop")} {
823
823
  /* Desktop - 1025px*/
824
824
  @media only screen and (min-width: 64.0625em) {
825
- ${i}: var(--${e}-${r}-desktop) !important;
826
- ${o ? `${o}: var(--${e}-${r}-desktop)` : ""}
825
+ ${o}: var(--${e}-${r}-desktop) !important;
826
+ ${i ? `${i}: var(--${e}-${r}-desktop)` : ""}
827
827
  }
828
828
  }`,
829
829
  ""
830
830
  );
831
- return a.replaceSync(l), a;
831
+ return l.replaceSync(n), l;
832
832
  }
833
- class tt {
834
- constructor(t, s, e, o) {
835
- this.component = t, this.attributeName = s, this.cssVariable = o, this.attributeNameMobile = `${this.attributeName}--mobile`, this.attributeNameTablet = `${this.attributeName}--tablet`, this.attributeNameLaptop = `${this.attributeName}--laptop`, this.attributeNameDesktop = `${this.attributeName}--desktop`, this._attributeValue = e, Object.defineProperty(
833
+ class et {
834
+ constructor(t, s, e, i) {
835
+ this.component = t, this.attributeName = s, this.cssVariable = i, this.attributeNameMobile = `${this.attributeName}--mobile`, this.attributeNameTablet = `${this.attributeName}--tablet`, this.attributeNameLaptop = `${this.attributeName}--laptop`, this.attributeNameDesktop = `${this.attributeName}--desktop`, this._attributeValue = e, Object.defineProperty(
836
836
  this.component,
837
837
  this.toCamelCase(this.attributeName),
838
838
  {
@@ -864,10 +864,10 @@ class tt {
864
864
  }
865
865
  }
866
866
  setCSSProperty(t, s, e = !0) {
867
- const [, o = ""] = t.split("--");
867
+ const [, i = ""] = t.split("--");
868
868
  this.component.style.setProperty(
869
- `${this.cssVariable}${e ? "-all" : ""}${o ? `-${o}` : ""}`,
870
- `${this._attributeValue(s, o)}`
869
+ `${this.cssVariable}${e ? "-all" : ""}${i ? `-${i}` : ""}`,
870
+ `${this._attributeValue(s, i)}`
871
871
  );
872
872
  }
873
873
  setCSSProperties() {
@@ -889,12 +889,12 @@ class tt {
889
889
  e,
890
890
  !1
891
891
  );
892
- const o = this.component.getAttribute(
892
+ const i = this.component.getAttribute(
893
893
  this.attributeNameLaptop
894
894
  );
895
- o && this.setCSSProperty(
895
+ i && this.setCSSProperty(
896
896
  this.attributeNameLaptop,
897
- o,
897
+ i,
898
898
  !1
899
899
  );
900
900
  const a = this.component.getAttribute(
@@ -911,45 +911,45 @@ class tt {
911
911
  }
912
912
  }
913
913
  export {
914
- tt as AttributeBreakpointHandlerDelegate,
914
+ et as AttributeBreakpointHandlerDelegate,
915
915
  p as PxElement,
916
- C as VerticallyExtendedElement,
916
+ L as VerticallyExtendedElement,
917
917
  u as WithExtraAttributes,
918
- j as accessibilityAttributes,
919
- U as addGlobalStylesheet,
920
- F as assetContainerImgWidthValues,
921
- V as backgroundColorValues,
922
- R as backgroundSizeValues,
923
- E as borderColorValues,
924
- G as borderRadiusValues,
925
- B as borderSideValues,
926
- q as borderValues,
927
- z as boxShadowValues,
928
- Q as checkName,
929
- D as colorValues,
930
- y as cssGridAlignSelfValues,
931
- S as cssGridColSpanValues,
932
- A as cssGridJustifySelfValues,
933
- $ as cssGridOrderValues,
934
- M as cssGridPlaceSelfValues,
935
- Z as cssTokenBreakpoints,
936
- w as flexboxAlignSelfValues,
937
- N as fontsizeValues,
938
- T as fontweightValues,
939
- W as gapValues,
940
- m as getSupportedAttributeNames,
941
- f as getSupportedPropertyNames,
942
- K as getViewportFormat,
943
- I as gradientValues,
944
- L as gridGapValues,
945
- H as headingValues,
946
- x as iconSizeValues,
947
- O as iconSizeValuesKC,
918
+ C as accessibilityAttributes,
919
+ J as addGlobalStylesheet,
920
+ U as assetContainerImgWidthValues,
921
+ R as backgroundColorValues,
922
+ z as backgroundSizeValues,
923
+ B as borderColorValues,
924
+ E as borderRadiusValues,
925
+ V as borderSideValues,
926
+ G as borderValues,
927
+ H as boxShadowValues,
928
+ Y as checkName,
929
+ T as colorValues,
930
+ A as cssGridAlignSelfValues,
931
+ $ as cssGridColSpanValues,
932
+ S as cssGridJustifySelfValues,
933
+ x as cssGridOrderValues,
934
+ N as cssGridPlaceSelfValues,
935
+ tt as cssTokenBreakpoints,
936
+ y as flexboxAlignSelfValues,
937
+ D as fontsizeValues,
938
+ O as fontweightValues,
939
+ X as gapValues,
940
+ k as getSupportedAttributeNames,
941
+ m as getSupportedPropertyNames,
942
+ Q as getViewportFormat,
943
+ W as gradientValues,
944
+ M as gridGapValues,
945
+ I as headingValues,
946
+ j as iconSizeValues,
947
+ _ as iconSizeValuesKC,
948
948
  h as isComponentDebug,
949
- J as isFalsy,
950
- v as log,
951
- X as noBorderRadiusValues,
952
- P as paddingValues,
953
- _ as textalignValues,
954
- Y as transferAccessibilityAttributes
949
+ K as isFalsy,
950
+ w as log,
951
+ F as noBorderRadiusValues,
952
+ q as paddingValues,
953
+ P as textalignValues,
954
+ Z as transferAccessibilityAttributes
955
955
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@proximus/lavender-common",
3
- "version": "1.4.7-alpha.3",
3
+ "version": "1.4.7-alpha.5",
4
4
  "description": "",
5
5
  "main": "dist/index.es.js",
6
6
  "types": "dist/index.d.ts",