@proximus/lavender-common 2.0.0-alpha.5 → 2.0.0-alpha.51

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.
package/dist/common.d.ts CHANGED
@@ -1,5 +1,16 @@
1
1
  export declare function getSupportedPropertyNames(htmlElementName: string): string[];
2
2
  export declare function getSupportedAttributeNames(htmlElementName: string): string[];
3
+ declare global {
4
+ interface Window {
5
+ isComponentDebug?: () => boolean;
6
+ }
7
+ }
8
+ export declare function isComponentDebug(): boolean;
9
+ /**
10
+ * Logs an error message to the console if the global debug flag is set.
11
+ * Usage: log('message')
12
+ */
13
+ export declare function log(message: string): void;
3
14
  export declare class WithExtraAttributes extends HTMLElement {
4
15
  static get observedAttributes(): string[];
5
16
  constructor(...adoptedStylesheets: CSSStyleSheet[]);
@@ -9,8 +20,7 @@ export declare class WithExtraAttributes extends HTMLElement {
9
20
  checkName<T extends readonly string[]>(values: T, value: string): boolean;
10
21
  get $el(): Element;
11
22
  get $parentElementName(): string;
12
- get isGrid(): boolean;
13
- get isStack(): boolean;
23
+ get isInsideGridOrStack(): boolean;
14
24
  get grow(): string;
15
25
  set grow(value: string);
16
26
  get growMobile(): string;
@@ -92,16 +102,20 @@ export declare class WithExtraAttributes extends HTMLElement {
92
102
  }
93
103
  export declare abstract class PxElement<HTML_TYPE extends Element> extends WithExtraAttributes {
94
104
  static nativeName: string;
95
- nativeName: string;
96
- accessorExclusions: string[];
105
+ static supportedPropertyNames: string[];
106
+ static accessorExclusions: string[];
97
107
  static get observedAttributes(): string[];
98
108
  attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
109
+ protected get ctor(): any;
99
110
  protected constructor(...adoptedStylesheets: CSSStyleSheet[]);
100
- connectedCallback(): void;
111
+ enhanceWithNativeProperties(): void;
101
112
  get $el(): HTML_TYPE;
102
113
  protected _updateAttribute(name: string, value: string): void;
103
114
  protected _updateBooleanAttribute(name: string, value: boolean): void;
104
115
  }
116
+ export declare class VerticallyExtendedElement<HTML_TYPE extends Element> extends PxElement<HTML_TYPE> {
117
+ connectedCallback(): void;
118
+ }
105
119
  export declare const gridGapValues: string[];
106
120
  export declare const flexboxAlignSelfValues: readonly ["", "default", "auto", "flex-start", "flex-end", "center", "baseline", "stretch"];
107
121
  export declare const cssGridAlignSelfValues: readonly ["", "default", "start", "end", "center", "stretch"];
package/dist/index.es.js CHANGED
@@ -1,17 +1,26 @@
1
- const u = ":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}}";
2
- function b(i) {
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
3
  const t = document.createElement(i), s = Object.getPrototypeOf(t);
4
4
  return Object.getOwnPropertyNames(s);
5
5
  }
6
- function d(i) {
6
+ function m(i) {
7
7
  const t = document.createElement(i), s = Object.getPrototypeOf(t);
8
8
  return Object.getOwnPropertyNames(s).map(
9
9
  (e) => e.toLowerCase()
10
10
  );
11
11
  }
12
- const h = new CSSStyleSheet();
13
- h.replaceSync(u);
14
- class p extends HTMLElement {
12
+ const d = new CSSStyleSheet();
13
+ d.replaceSync(c);
14
+ const k = typeof import.meta < "u" && typeof g < "u" && !0;
15
+ typeof window < "u" && (window.isComponentDebug = h);
16
+ function h() {
17
+ return k;
18
+ }
19
+ function v(i) {
20
+ h() && console.error(i);
21
+ }
22
+ typeof window < "u" && (window.isComponentDebug = h);
23
+ class u extends HTMLElement {
15
24
  static get observedAttributes() {
16
25
  return [
17
26
  "grow",
@@ -63,12 +72,13 @@ class p extends HTMLElement {
63
72
  }
64
73
  constructor(...t) {
65
74
  super(), this.shadowRoot || this.attachShadow({ mode: "open" }), this.shadowRoot.adoptedStyleSheets = [
66
- h,
75
+ d,
67
76
  ...t
68
77
  ];
69
78
  }
70
79
  attributeChangedCallback(t, s, e) {
71
- if (p.observedAttributes.indexOf(t) !== -1)
80
+ var o;
81
+ if (u.observedAttributes.indexOf(t) !== -1)
72
82
  switch (t) {
73
83
  case "grow":
74
84
  case "grow--mobile":
@@ -96,7 +106,7 @@ class p extends HTMLElement {
96
106
  t,
97
107
  s,
98
108
  e,
99
- this.isGrid ? g : c
109
+ ((o = this.parentElement) == null ? void 0 : o.localName) === "px-grid" ? y : w
100
110
  );
101
111
  break;
102
112
  case "justify-self":
@@ -108,7 +118,7 @@ class p extends HTMLElement {
108
118
  t,
109
119
  s,
110
120
  e,
111
- f
121
+ A
112
122
  );
113
123
  break;
114
124
  case "col-span":
@@ -116,20 +126,22 @@ class p extends HTMLElement {
116
126
  case "col-span--tablet":
117
127
  case "col-span--laptop":
118
128
  case "col-span--desktop":
119
- this.updateProperties(t, s, e, m);
129
+ this.updateProperties(t, s, e, S);
120
130
  break;
121
131
  case "order":
122
132
  case "order--mobile":
123
133
  case "order--tablet":
124
134
  case "order--laptop":
125
135
  case "order--desktop":
126
- this.updateProperties(t, s, e, k);
136
+ this.updateProperties(t, s, e, $);
127
137
  break;
128
138
  }
129
139
  }
130
140
  updateProperties(t, s, e, o) {
131
141
  if (o && !this.checkName(o, e)) {
132
- console.error(`${e} is not a valid value for ${o}`);
142
+ v(
143
+ `${e} is not an allowed ${o} value for ${this.tagName.toLowerCase()}`
144
+ );
133
145
  return;
134
146
  }
135
147
  const a = t.indexOf("--") > -1, l = a ? t.split("--")[0] : t;
@@ -168,11 +180,18 @@ class p extends HTMLElement {
168
180
  var t;
169
181
  return (t = this.parentElement) == null ? void 0 : t.tagName.toLowerCase();
170
182
  }
171
- get isGrid() {
172
- return this.$parentElementName === "px-grid";
173
- }
174
- get isStack() {
175
- return this.$parentElementName === "px-stack";
183
+ get isInsideGridOrStack() {
184
+ let t = this.parentElement;
185
+ for (; t; ) {
186
+ if (t.localName === "px-grid" || t.localName === "px-stack" && (t == null ? void 0 : t.getAttribute("direction")) === "row")
187
+ return !0;
188
+ if (window.getComputedStyle(t).display === "contents") {
189
+ t = t.parentElement;
190
+ continue;
191
+ }
192
+ break;
193
+ }
194
+ return !1;
176
195
  }
177
196
  get grow() {
178
197
  return this.getAttribute("grow");
@@ -409,23 +428,29 @@ class p extends HTMLElement {
409
428
  this.setAttribute("order--desktop", t);
410
429
  }
411
430
  }
412
- class y extends p {
413
- constructor(...t) {
414
- super(...t), this.accessorExclusions = [], this.nativeName = Object.getPrototypeOf(this).constructor.nativeName, this.accessorExclusions = Object.getPrototypeOf(this).constructor.accessorExclusions || [];
415
- }
431
+ const b = class b extends u {
432
+ // nativeName: string;
416
433
  static get observedAttributes() {
417
434
  return [
418
435
  ...super.observedAttributes,
419
- ...d(this.nativeName)
436
+ ...m(this.nativeName)
420
437
  ];
421
438
  }
422
439
  attributeChangedCallback(t, s, e) {
423
440
  super.attributeChangedCallback(t, s, e), e === null ? this.$el.toggleAttribute(t) : this.$el.setAttribute(t, e);
424
441
  }
425
- connectedCallback() {
442
+ get ctor() {
443
+ return Object.getPrototypeOf(this).constructor;
444
+ }
445
+ constructor(...t) {
446
+ super(...t), this.ctor.supportedPropertyNames || (this.ctor.supportedPropertyNames = f(
447
+ this.ctor.nativeName
448
+ )), this.enhanceWithNativeProperties();
449
+ }
450
+ enhanceWithNativeProperties() {
426
451
  var t;
427
- for (const s of b(this.nativeName))
428
- if (!(s === "constructor" || this.accessorExclusions.includes(s)))
452
+ for (const s of this.ctor.supportedPropertyNames)
453
+ if (!(s === "constructor" || (((t = this.ctor) == null ? void 0 : t.accessorExclusions) ?? []).includes(s)))
429
454
  try {
430
455
  Object.defineProperty(this, s, {
431
456
  get() {
@@ -438,13 +463,9 @@ class y extends p {
438
463
  } catch (e) {
439
464
  console.warn(`Could not create property ${s} for`, this.$el, e);
440
465
  }
441
- if (this.isGrid || this.isStack) {
442
- const s = (t = this.parentElement) == null ? void 0 : t.getAttribute("direction");
443
- this.$el.style.display = "block", (this.isGrid || this.isStack && s === "row") && (this.$el.style.height = "100%");
444
- }
445
466
  }
446
467
  get $el() {
447
- return this.shadowRoot.querySelector(this.nativeName);
468
+ return this.shadowRoot.querySelector(this.ctor.nativeName);
448
469
  }
449
470
  _updateAttribute(t, s) {
450
471
  s ? this.setAttribute(t, s) : this.removeAttribute(t);
@@ -452,8 +473,15 @@ class y extends p {
452
473
  _updateBooleanAttribute(t, s) {
453
474
  s ? this.setAttribute(t, "") : this.removeAttribute(t);
454
475
  }
476
+ };
477
+ b.accessorExclusions = [];
478
+ let p = b;
479
+ class j extends p {
480
+ connectedCallback() {
481
+ this.isInsideGridOrStack && (this.$el.style.display = "block", this.$el.style.height = "100%");
482
+ }
455
483
  }
456
- const w = ["", "default", "none", "l"], c = [
484
+ const C = ["", "default", "none", "l"], w = [
457
485
  "",
458
486
  "default",
459
487
  "auto",
@@ -462,21 +490,21 @@ const w = ["", "default", "none", "l"], c = [
462
490
  "center",
463
491
  "baseline",
464
492
  "stretch"
465
- ], g = [
493
+ ], y = [
466
494
  "",
467
495
  "default",
468
496
  "start",
469
497
  "end",
470
498
  "center",
471
499
  "stretch"
472
- ], f = [
500
+ ], A = [
473
501
  "",
474
502
  "default",
475
503
  "start",
476
504
  "end",
477
505
  "center",
478
506
  "stretch"
479
- ], m = [
507
+ ], S = [
480
508
  "",
481
509
  "1",
482
510
  "2",
@@ -490,7 +518,7 @@ const w = ["", "default", "none", "l"], c = [
490
518
  "10",
491
519
  "11",
492
520
  "12"
493
- ], k = [
521
+ ], $ = [
494
522
  "",
495
523
  "-1",
496
524
  "0",
@@ -506,7 +534,7 @@ const w = ["", "default", "none", "l"], c = [
506
534
  "10",
507
535
  "11",
508
536
  "12"
509
- ], A = [
537
+ ], L = [
510
538
  "",
511
539
  "default",
512
540
  "auto",
@@ -514,7 +542,7 @@ const w = ["", "default", "none", "l"], c = [
514
542
  "end",
515
543
  "center",
516
544
  "stretch"
517
- ], S = [
545
+ ], M = [
518
546
  "",
519
547
  "default",
520
548
  "inherit",
@@ -530,7 +558,7 @@ const w = ["", "default", "none", "l"], c = [
530
558
  "heading-l",
531
559
  "heading-m",
532
560
  "heading-s"
533
- ], $ = [
561
+ ], N = [
534
562
  "",
535
563
  "default",
536
564
  "inherit",
@@ -545,7 +573,7 @@ const w = ["", "default", "none", "l"], c = [
545
573
  "state-hover",
546
574
  "state-active",
547
575
  "state-disabled"
548
- ], x = [
576
+ ], D = [
549
577
  "",
550
578
  "default",
551
579
  "inherit",
@@ -553,11 +581,11 @@ const w = ["", "default", "none", "l"], c = [
553
581
  "title",
554
582
  "title-large",
555
583
  "subtitle"
556
- ], v = ["Xs", "S", "M", "L", "Xl"], j = [
584
+ ], x = ["Xs", "S", "M", "L", "Xl"], T = [
557
585
  "",
558
586
  "default",
559
- ...v.map((i) => i.toLowerCase())
560
- ], C = ["", "default", "left", "center", "right"], L = [
587
+ ...x.map((i) => i.toLowerCase())
588
+ ], O = ["", "default", "left", "center", "right"], _ = [
561
589
  "",
562
590
  "none",
563
591
  "3xs",
@@ -567,7 +595,7 @@ const w = ["", "default", "none", "l"], c = [
567
595
  "m",
568
596
  "l",
569
597
  "xl"
570
- ], M = ["", "none", "s", "m", "l"], T = ["", "none", "main", "pill"], D = [
598
+ ], P = ["", "none", "s", "m", "l"], q = ["", "none", "main", "pill"], G = [
571
599
  "none",
572
600
  "main",
573
601
  "brand",
@@ -578,7 +606,7 @@ const w = ["", "default", "none", "l"], c = [
578
606
  "purpose-warning",
579
607
  "purpose-error",
580
608
  "purpose-unlimited"
581
- ], N = [
609
+ ], E = [
582
610
  "",
583
611
  "all",
584
612
  "top",
@@ -587,7 +615,7 @@ const w = ["", "default", "none", "l"], c = [
587
615
  "left",
588
616
  "block",
589
617
  "inline"
590
- ], O = [
618
+ ], B = [
591
619
  "",
592
620
  "none",
593
621
  "surface-light",
@@ -614,8 +642,8 @@ const w = ["", "default", "none", "l"], c = [
614
642
  "purpose-info",
615
643
  "purpose-eco",
616
644
  "purpose-notification",
617
- "footer"
618
- ], G = ["", "cover", "contain", "default"], q = ["", "none", "s", "m", "l", "xl"], E = [
645
+ "footer-sitemap"
646
+ ], V = ["", "cover", "contain", "default"], R = ["", "none", "s", "m", "l", "xl"], z = [
619
647
  "",
620
648
  "default",
621
649
  "title-4xl",
@@ -626,7 +654,7 @@ const w = ["", "default", "none", "l"], c = [
626
654
  "title-m",
627
655
  "title-s",
628
656
  "subtitle"
629
- ], P = [
657
+ ], H = [
630
658
  "",
631
659
  "purple-top-red",
632
660
  "purple-top-magenta",
@@ -676,7 +704,7 @@ const w = ["", "default", "none", "l"], c = [
676
704
  "color-bottom-right-blue",
677
705
  "color-bottom-right-turquoise",
678
706
  "color-bottom-right-green"
679
- ], _ = [
707
+ ], I = [
680
708
  "none",
681
709
  "2xs",
682
710
  "xs",
@@ -686,14 +714,14 @@ const w = ["", "default", "none", "l"], c = [
686
714
  "heading-to-subtitle",
687
715
  "heading-to-content",
688
716
  "page-layout-between-sections"
689
- ], B = [
717
+ ], W = [
690
718
  "",
691
719
  "all",
692
720
  "top",
693
721
  "right",
694
722
  "bottom",
695
723
  "left"
696
- ], R = [
724
+ ], X = [
697
725
  "",
698
726
  "default",
699
727
  "xs",
@@ -702,20 +730,20 @@ const w = ["", "default", "none", "l"], c = [
702
730
  "l",
703
731
  "xl"
704
732
  ];
705
- function V(i) {
733
+ function F(i) {
706
734
  const t = document.createElement("style");
707
735
  t.innerHTML = i, document.head.appendChild(t);
708
736
  }
709
- function z(i) {
737
+ function U(i) {
710
738
  return typeof i == "string" && (i === "false" || i === "0" || i === "null") || typeof i == "boolean" && !i;
711
739
  }
712
- function H() {
740
+ function J() {
713
741
  return window.matchMedia("only screen and (min-width: 768px)").matches ? "tablet" : window.matchMedia("only screen and (min-width: 1025px)").matches ? "laptop" : "mobile";
714
742
  }
715
- function F(i, t) {
743
+ function K(i, t) {
716
744
  return i.includes(t);
717
745
  }
718
- function X(i, t, s = !0) {
746
+ function Q(i, t, s = !0) {
719
747
  var e;
720
748
  if ([
721
749
  "aria-label",
@@ -758,7 +786,7 @@ function X(i, t, s = !0) {
758
786
  t.setAttribute("id", o), i.setAttribute("aria-labelledby", o);
759
787
  }
760
788
  }
761
- function I(i, t, s, e = "", o) {
789
+ function Y(i, t, s, e = "", o) {
762
790
  const a = new CSSStyleSheet(), l = s.reduce(
763
791
  (n, r) => n + `
764
792
  ${t(i, r)} {
@@ -804,7 +832,7 @@ function I(i, t, s, e = "", o) {
804
832
  );
805
833
  return a.replaceSync(l), a;
806
834
  }
807
- class J {
835
+ class Z {
808
836
  constructor(t, s, e, o) {
809
837
  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(
810
838
  this.component,
@@ -885,41 +913,44 @@ class J {
885
913
  }
886
914
  }
887
915
  export {
888
- J as AttributeBreakpointHandlerDelegate,
889
- y as PxElement,
890
- p as WithExtraAttributes,
891
- V as addGlobalStylesheet,
892
- R as assetContainerImgWidthValues,
893
- O as backgroundColorValues,
894
- G as backgroundSizeValues,
895
- D as borderColorValues,
896
- T as borderRadiusValues,
897
- N as borderSideValues,
898
- M as borderValues,
899
- q as boxShadowValues,
900
- F as checkName,
901
- $ as colorValues,
902
- g as cssGridAlignSelfValues,
903
- m as cssGridColSpanValues,
904
- f as cssGridJustifySelfValues,
905
- k as cssGridOrderValues,
906
- A as cssGridPlaceSelfValues,
907
- I as cssTokenBreakpoints,
908
- c as flexboxAlignSelfValues,
909
- S as fontsizeValues,
910
- x as fontweightValues,
911
- _ as gapValues,
912
- d as getSupportedAttributeNames,
913
- b as getSupportedPropertyNames,
914
- H as getViewportFormat,
915
- P as gradientValues,
916
- w as gridGapValues,
917
- E as headingValues,
918
- v as iconSizeValues,
919
- j as iconSizeValuesKC,
920
- z as isFalsy,
921
- B as noBorderRadiusValues,
922
- L as paddingValues,
923
- C as textalignValues,
924
- X as transferAccessibilityAttributes
916
+ Z as AttributeBreakpointHandlerDelegate,
917
+ p as PxElement,
918
+ j as VerticallyExtendedElement,
919
+ u as WithExtraAttributes,
920
+ F as addGlobalStylesheet,
921
+ X as assetContainerImgWidthValues,
922
+ B as backgroundColorValues,
923
+ V as backgroundSizeValues,
924
+ G as borderColorValues,
925
+ q as borderRadiusValues,
926
+ E as borderSideValues,
927
+ P as borderValues,
928
+ R as boxShadowValues,
929
+ K as checkName,
930
+ N as colorValues,
931
+ y as cssGridAlignSelfValues,
932
+ S as cssGridColSpanValues,
933
+ A as cssGridJustifySelfValues,
934
+ $ as cssGridOrderValues,
935
+ L as cssGridPlaceSelfValues,
936
+ Y as cssTokenBreakpoints,
937
+ w as flexboxAlignSelfValues,
938
+ M as fontsizeValues,
939
+ D as fontweightValues,
940
+ I as gapValues,
941
+ m as getSupportedAttributeNames,
942
+ f as getSupportedPropertyNames,
943
+ J as getViewportFormat,
944
+ H as gradientValues,
945
+ C as gridGapValues,
946
+ z as headingValues,
947
+ x as iconSizeValues,
948
+ T as iconSizeValuesKC,
949
+ h as isComponentDebug,
950
+ U as isFalsy,
951
+ v as log,
952
+ W as noBorderRadiusValues,
953
+ _ as paddingValues,
954
+ O as textalignValues,
955
+ Q as transferAccessibilityAttributes
925
956
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@proximus/lavender-common",
3
- "version": "2.0.0-alpha.5",
3
+ "version": "2.0.0-alpha.51",
4
4
  "description": "",
5
5
  "main": "dist/index.es.js",
6
6
  "types": "dist/index.d.ts",