@proximus/lavender-common 2.0.0-alpha.69 → 2.0.0-alpha.73
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 +8 -0
- package/dist/index.es.js +228 -150
- package/package.json +1 -1
package/dist/common.d.ts
CHANGED
|
@@ -11,6 +11,14 @@ export declare function isComponentDebug(): boolean;
|
|
|
11
11
|
* Usage: log('message')
|
|
12
12
|
*/
|
|
13
13
|
export declare function log(message: string): void;
|
|
14
|
+
export declare class WrappedInteractiveStateController {
|
|
15
|
+
#private;
|
|
16
|
+
constructor(host: HTMLElement, interactiveElement: HTMLElement, canSetInteractiveState: () => boolean);
|
|
17
|
+
clearInteractiveState: () => void;
|
|
18
|
+
connect(): void;
|
|
19
|
+
disconnect(): void;
|
|
20
|
+
setInteractiveState(state: 'hover' | null): void;
|
|
21
|
+
}
|
|
14
22
|
export declare class WithExtraAttributes extends HTMLElement {
|
|
15
23
|
static get observedAttributes(): string[];
|
|
16
24
|
constructor(...adoptedStylesheets: CSSStyleSheet[]);
|
package/dist/index.es.js
CHANGED
|
@@ -1,26 +1,101 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
var A = (i) => {
|
|
2
|
+
throw TypeError(i);
|
|
3
|
+
};
|
|
4
|
+
var S = (i, t, s) => t.has(i) || A("Cannot " + s);
|
|
5
|
+
var a = (i, t, s) => (S(i, t, "read from private field"), s ? s.call(i) : t.get(i)), d = (i, t, s) => t.has(i) ? A("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(i) : t.set(i, s), p = (i, t, s, e) => (S(i, t, "write to private field"), e ? e.call(i, s) : t.set(i, s), s);
|
|
6
|
+
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-self-value)}:host([order]),::slotted([order]){order:var(--order-value)}:host([sticky-top]){position:sticky;top:0}:host([sticky-bottom]){position:sticky;bottom:0}: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}}", L = {};
|
|
7
|
+
function N(i) {
|
|
8
|
+
const t = document.createElement(i), s = Object.getPrototypeOf(t);
|
|
4
9
|
return Object.getOwnPropertyNames(s);
|
|
5
10
|
}
|
|
6
|
-
function
|
|
7
|
-
const t = document.createElement(
|
|
11
|
+
function M(i) {
|
|
12
|
+
const t = document.createElement(i), s = Object.getPrototypeOf(t);
|
|
8
13
|
return Object.getOwnPropertyNames(s).map(
|
|
9
14
|
(e) => e.toLowerCase()
|
|
10
15
|
);
|
|
11
16
|
}
|
|
12
|
-
const
|
|
13
|
-
|
|
14
|
-
const
|
|
15
|
-
typeof window < "u" && (window.isComponentDebug =
|
|
16
|
-
function
|
|
17
|
-
return
|
|
17
|
+
const $ = new CSSStyleSheet();
|
|
18
|
+
$.replaceSync(C);
|
|
19
|
+
const D = typeof import.meta < "u" && typeof L < "u" && !0;
|
|
20
|
+
typeof window < "u" && (window.isComponentDebug = v);
|
|
21
|
+
function v() {
|
|
22
|
+
return D;
|
|
23
|
+
}
|
|
24
|
+
function T(i) {
|
|
25
|
+
v() && console.error(i);
|
|
18
26
|
}
|
|
19
|
-
|
|
20
|
-
|
|
27
|
+
var c, n, g, h, u, m, x;
|
|
28
|
+
class R {
|
|
29
|
+
constructor(t, s, e) {
|
|
30
|
+
d(this, m);
|
|
31
|
+
d(this, c);
|
|
32
|
+
d(this, n);
|
|
33
|
+
d(this, g);
|
|
34
|
+
d(this, h);
|
|
35
|
+
d(this, u);
|
|
36
|
+
p(this, h, !1), p(this, u, () => {
|
|
37
|
+
this.setInteractiveState("hover");
|
|
38
|
+
}), this.clearInteractiveState = () => {
|
|
39
|
+
this.setInteractiveState(null);
|
|
40
|
+
}, p(this, c, t), p(this, n, s), p(this, g, e);
|
|
41
|
+
}
|
|
42
|
+
connect() {
|
|
43
|
+
a(this, h) || (a(this, n).addEventListener(
|
|
44
|
+
"pointerenter",
|
|
45
|
+
a(this, u)
|
|
46
|
+
), a(this, n).addEventListener(
|
|
47
|
+
"pointerleave",
|
|
48
|
+
this.clearInteractiveState
|
|
49
|
+
), a(this, n).addEventListener(
|
|
50
|
+
"focusin",
|
|
51
|
+
a(this, u)
|
|
52
|
+
), a(this, n).addEventListener(
|
|
53
|
+
"focusout",
|
|
54
|
+
this.clearInteractiveState
|
|
55
|
+
), p(this, h, !0));
|
|
56
|
+
}
|
|
57
|
+
disconnect() {
|
|
58
|
+
a(this, h) && (a(this, n).removeEventListener(
|
|
59
|
+
"pointerenter",
|
|
60
|
+
a(this, u)
|
|
61
|
+
), a(this, n).removeEventListener(
|
|
62
|
+
"pointerleave",
|
|
63
|
+
this.clearInteractiveState
|
|
64
|
+
), a(this, n).removeEventListener(
|
|
65
|
+
"focusin",
|
|
66
|
+
a(this, u)
|
|
67
|
+
), a(this, n).removeEventListener(
|
|
68
|
+
"focusout",
|
|
69
|
+
this.clearInteractiveState
|
|
70
|
+
), p(this, h, !1));
|
|
71
|
+
}
|
|
72
|
+
setInteractiveState(t) {
|
|
73
|
+
const s = a(this, m, x);
|
|
74
|
+
if (!a(this, g).call(this)) {
|
|
75
|
+
s.forEach((e) => e.removeAttribute("interactive-state"));
|
|
76
|
+
return;
|
|
77
|
+
}
|
|
78
|
+
s.forEach((e) => {
|
|
79
|
+
t ? e.setAttribute("interactive-state", t) : e.removeAttribute("interactive-state");
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
c = new WeakMap(), n = new WeakMap(), g = new WeakMap(), h = new WeakMap(), u = new WeakMap(), m = new WeakSet(), x = function() {
|
|
84
|
+
return Array.from(a(this, c).querySelectorAll("*")).filter(
|
|
85
|
+
E
|
|
86
|
+
);
|
|
87
|
+
};
|
|
88
|
+
function E(i) {
|
|
89
|
+
var s;
|
|
90
|
+
if (i.hasAttribute("interactive-state"))
|
|
91
|
+
return !0;
|
|
92
|
+
const t = customElements.get(
|
|
93
|
+
i.localName
|
|
94
|
+
);
|
|
95
|
+
return ((s = t == null ? void 0 : t.observedAttributes) == null ? void 0 : s.includes("interactive-state")) ?? !1;
|
|
21
96
|
}
|
|
22
|
-
typeof window < "u" && (window.isComponentDebug =
|
|
23
|
-
class
|
|
97
|
+
typeof window < "u" && (window.isComponentDebug = v);
|
|
98
|
+
class y extends HTMLElement {
|
|
24
99
|
static get observedAttributes() {
|
|
25
100
|
return [
|
|
26
101
|
"grow",
|
|
@@ -67,18 +142,20 @@ class u extends HTMLElement {
|
|
|
67
142
|
"order--mobile",
|
|
68
143
|
"order--tablet",
|
|
69
144
|
"order--laptop",
|
|
70
|
-
"order--desktop"
|
|
145
|
+
"order--desktop",
|
|
146
|
+
"sticky-top",
|
|
147
|
+
"sticky-bottom"
|
|
71
148
|
];
|
|
72
149
|
}
|
|
73
150
|
constructor(...t) {
|
|
74
151
|
super(), this.shadowRoot || this.attachShadow({ mode: "open" }), this.shadowRoot.adoptedStyleSheets = [
|
|
75
|
-
|
|
152
|
+
$,
|
|
76
153
|
...t
|
|
77
154
|
];
|
|
78
155
|
}
|
|
79
156
|
attributeChangedCallback(t, s, e) {
|
|
80
|
-
var
|
|
81
|
-
if (
|
|
157
|
+
var o;
|
|
158
|
+
if (y.observedAttributes.indexOf(t) !== -1)
|
|
82
159
|
switch (t) {
|
|
83
160
|
case "grow":
|
|
84
161
|
case "grow--mobile":
|
|
@@ -106,7 +183,7 @@ class u extends HTMLElement {
|
|
|
106
183
|
t,
|
|
107
184
|
s,
|
|
108
185
|
e,
|
|
109
|
-
((
|
|
186
|
+
((o = this.parentElement) == null ? void 0 : o.localName) === "px-grid" ? I : O
|
|
110
187
|
);
|
|
111
188
|
break;
|
|
112
189
|
case "justify-self":
|
|
@@ -118,7 +195,7 @@ class u extends HTMLElement {
|
|
|
118
195
|
t,
|
|
119
196
|
s,
|
|
120
197
|
e,
|
|
121
|
-
|
|
198
|
+
_
|
|
122
199
|
);
|
|
123
200
|
break;
|
|
124
201
|
case "col-span":
|
|
@@ -126,37 +203,37 @@ class u extends HTMLElement {
|
|
|
126
203
|
case "col-span--tablet":
|
|
127
204
|
case "col-span--laptop":
|
|
128
205
|
case "col-span--desktop":
|
|
129
|
-
this.updateProperties(t, s, e,
|
|
206
|
+
this.updateProperties(t, s, e, q);
|
|
130
207
|
break;
|
|
131
208
|
case "order":
|
|
132
209
|
case "order--mobile":
|
|
133
210
|
case "order--tablet":
|
|
134
211
|
case "order--laptop":
|
|
135
212
|
case "order--desktop":
|
|
136
|
-
this.updateProperties(t, s, e,
|
|
213
|
+
this.updateProperties(t, s, e, P);
|
|
137
214
|
break;
|
|
138
215
|
}
|
|
139
216
|
}
|
|
140
|
-
updateProperties(t, s, e,
|
|
141
|
-
|
|
142
|
-
`${e} is not an allowed ${
|
|
217
|
+
updateProperties(t, s, e, o) {
|
|
218
|
+
o && (this.checkName(o, e) || T(
|
|
219
|
+
`${e} is not an allowed ${o} value for ${this.tagName.toLowerCase()}`
|
|
143
220
|
));
|
|
144
|
-
const
|
|
145
|
-
if (!
|
|
221
|
+
const l = t.indexOf("--") > -1, b = l ? t.split("--")[0] : t;
|
|
222
|
+
if (!l)
|
|
146
223
|
this.style.setProperty(
|
|
147
|
-
`--${
|
|
224
|
+
`--${b}-value`,
|
|
148
225
|
s
|
|
149
226
|
), this.style.setProperty(
|
|
150
|
-
`--${
|
|
227
|
+
`--${b}-value`,
|
|
151
228
|
e
|
|
152
229
|
);
|
|
153
230
|
else {
|
|
154
|
-
const
|
|
231
|
+
const f = t.split("--")[1];
|
|
155
232
|
this.style.setProperty(
|
|
156
|
-
`--${
|
|
233
|
+
`--${b}--${f}-value`,
|
|
157
234
|
s
|
|
158
235
|
), this.style.setProperty(
|
|
159
|
-
`--${
|
|
236
|
+
`--${b}--${f}-value`,
|
|
160
237
|
e
|
|
161
238
|
);
|
|
162
239
|
}
|
|
@@ -425,12 +502,12 @@ class u extends HTMLElement {
|
|
|
425
502
|
this.setAttribute("order--desktop", t);
|
|
426
503
|
}
|
|
427
504
|
}
|
|
428
|
-
const
|
|
505
|
+
const w = class w extends y {
|
|
429
506
|
// nativeName: string;
|
|
430
507
|
static get observedAttributes() {
|
|
431
508
|
return [
|
|
432
509
|
...super.observedAttributes,
|
|
433
|
-
...
|
|
510
|
+
...M(this.nativeName)
|
|
434
511
|
];
|
|
435
512
|
}
|
|
436
513
|
attributeChangedCallback(t, s, e) {
|
|
@@ -440,7 +517,7 @@ const b = class b extends u {
|
|
|
440
517
|
return Object.getPrototypeOf(this).constructor;
|
|
441
518
|
}
|
|
442
519
|
constructor(...t) {
|
|
443
|
-
super(...t), this.ctor.supportedPropertyNames || (this.ctor.supportedPropertyNames =
|
|
520
|
+
super(...t), this.ctor.supportedPropertyNames || (this.ctor.supportedPropertyNames = N(
|
|
444
521
|
this.ctor.nativeName
|
|
445
522
|
)), this.enhanceWithNativeProperties();
|
|
446
523
|
}
|
|
@@ -471,14 +548,14 @@ const b = class b extends u {
|
|
|
471
548
|
s ? this.setAttribute(t, "") : this.removeAttribute(t);
|
|
472
549
|
}
|
|
473
550
|
};
|
|
474
|
-
|
|
475
|
-
let
|
|
476
|
-
class
|
|
551
|
+
w.accessorExclusions = [];
|
|
552
|
+
let k = w;
|
|
553
|
+
class z extends k {
|
|
477
554
|
connectedCallback() {
|
|
478
555
|
this.isInsideGridOrStack && (this.$el.style.display = "block", this.$el.style.height = "100%");
|
|
479
556
|
}
|
|
480
557
|
}
|
|
481
|
-
const
|
|
558
|
+
const W = ["", "default", "none", "l"], O = [
|
|
482
559
|
"",
|
|
483
560
|
"default",
|
|
484
561
|
"auto",
|
|
@@ -487,21 +564,21 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
487
564
|
"center",
|
|
488
565
|
"baseline",
|
|
489
566
|
"stretch"
|
|
490
|
-
],
|
|
567
|
+
], I = [
|
|
491
568
|
"",
|
|
492
569
|
"default",
|
|
493
570
|
"start",
|
|
494
571
|
"end",
|
|
495
572
|
"center",
|
|
496
573
|
"stretch"
|
|
497
|
-
],
|
|
574
|
+
], _ = [
|
|
498
575
|
"",
|
|
499
576
|
"default",
|
|
500
577
|
"start",
|
|
501
578
|
"end",
|
|
502
579
|
"center",
|
|
503
580
|
"stretch"
|
|
504
|
-
],
|
|
581
|
+
], q = [
|
|
505
582
|
"",
|
|
506
583
|
"1",
|
|
507
584
|
"2",
|
|
@@ -515,7 +592,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
515
592
|
"10",
|
|
516
593
|
"11",
|
|
517
594
|
"12"
|
|
518
|
-
],
|
|
595
|
+
], P = [
|
|
519
596
|
"",
|
|
520
597
|
"-1",
|
|
521
598
|
"0",
|
|
@@ -531,7 +608,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
531
608
|
"10",
|
|
532
609
|
"11",
|
|
533
610
|
"12"
|
|
534
|
-
],
|
|
611
|
+
], H = [
|
|
535
612
|
"",
|
|
536
613
|
"default",
|
|
537
614
|
"auto",
|
|
@@ -539,7 +616,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
539
616
|
"end",
|
|
540
617
|
"center",
|
|
541
618
|
"stretch"
|
|
542
|
-
],
|
|
619
|
+
], X = [
|
|
543
620
|
"",
|
|
544
621
|
"default",
|
|
545
622
|
"inherit",
|
|
@@ -555,7 +632,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
555
632
|
"heading-l",
|
|
556
633
|
"heading-m",
|
|
557
634
|
"heading-s"
|
|
558
|
-
],
|
|
635
|
+
], F = [
|
|
559
636
|
"",
|
|
560
637
|
"default",
|
|
561
638
|
"inherit",
|
|
@@ -570,7 +647,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
570
647
|
"state-hover",
|
|
571
648
|
"state-active",
|
|
572
649
|
"state-disabled"
|
|
573
|
-
],
|
|
650
|
+
], U = [
|
|
574
651
|
"",
|
|
575
652
|
"default",
|
|
576
653
|
"inherit",
|
|
@@ -578,11 +655,11 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
578
655
|
"title",
|
|
579
656
|
"title-large",
|
|
580
657
|
"subtitle"
|
|
581
|
-
],
|
|
658
|
+
], G = ["Xs", "S", "M", "L", "Xl"], J = [
|
|
582
659
|
"",
|
|
583
660
|
"default",
|
|
584
|
-
...
|
|
585
|
-
],
|
|
661
|
+
...G.map((i) => i.toLowerCase())
|
|
662
|
+
], K = ["", "default", "left", "center", "right"], Q = [
|
|
586
663
|
"",
|
|
587
664
|
"none",
|
|
588
665
|
"3xs",
|
|
@@ -592,7 +669,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
592
669
|
"m",
|
|
593
670
|
"l",
|
|
594
671
|
"xl"
|
|
595
|
-
],
|
|
672
|
+
], Y = ["", "none", "s", "m", "l"], Z = ["", "none", "main", "pill"], tt = [
|
|
596
673
|
"none",
|
|
597
674
|
"main",
|
|
598
675
|
"brand",
|
|
@@ -603,7 +680,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
603
680
|
"purpose-warning",
|
|
604
681
|
"purpose-error",
|
|
605
682
|
"purpose-unlimited"
|
|
606
|
-
],
|
|
683
|
+
], et = [
|
|
607
684
|
"",
|
|
608
685
|
"all",
|
|
609
686
|
"top",
|
|
@@ -612,7 +689,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
612
689
|
"left",
|
|
613
690
|
"block",
|
|
614
691
|
"inline"
|
|
615
|
-
],
|
|
692
|
+
], st = [
|
|
616
693
|
"",
|
|
617
694
|
"none",
|
|
618
695
|
"surface-light",
|
|
@@ -640,7 +717,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
640
717
|
"purpose-eco",
|
|
641
718
|
"purpose-notification",
|
|
642
719
|
"footer-sitemap"
|
|
643
|
-
],
|
|
720
|
+
], it = ["", "cover", "contain", "default"], ot = ["", "none", "s", "m", "l", "xl"], rt = [
|
|
644
721
|
"",
|
|
645
722
|
"default",
|
|
646
723
|
"title-4xl",
|
|
@@ -651,7 +728,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
651
728
|
"title-m",
|
|
652
729
|
"title-s",
|
|
653
730
|
"subtitle"
|
|
654
|
-
],
|
|
731
|
+
], at = [
|
|
655
732
|
"",
|
|
656
733
|
"purple-top-red",
|
|
657
734
|
"purple-top-magenta",
|
|
@@ -701,7 +778,7 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
701
778
|
"color-bottom-right-blue",
|
|
702
779
|
"color-bottom-right-turquoise",
|
|
703
780
|
"color-bottom-right-green"
|
|
704
|
-
],
|
|
781
|
+
], lt = [
|
|
705
782
|
"none",
|
|
706
783
|
"2xs",
|
|
707
784
|
"xs",
|
|
@@ -711,14 +788,14 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
711
788
|
"heading-to-subtitle",
|
|
712
789
|
"heading-to-content",
|
|
713
790
|
"page-layout-between-sections"
|
|
714
|
-
],
|
|
791
|
+
], nt = [
|
|
715
792
|
"",
|
|
716
793
|
"all",
|
|
717
794
|
"top",
|
|
718
795
|
"right",
|
|
719
796
|
"bottom",
|
|
720
797
|
"left"
|
|
721
|
-
],
|
|
798
|
+
], pt = [
|
|
722
799
|
"",
|
|
723
800
|
"default",
|
|
724
801
|
"xs",
|
|
@@ -727,20 +804,20 @@ const M = ["", "default", "none", "l"], y = [
|
|
|
727
804
|
"l",
|
|
728
805
|
"xl"
|
|
729
806
|
];
|
|
730
|
-
function
|
|
807
|
+
function ht(i) {
|
|
731
808
|
const t = document.createElement("style");
|
|
732
|
-
t.innerHTML =
|
|
809
|
+
t.innerHTML = i, document.head.appendChild(t);
|
|
733
810
|
}
|
|
734
|
-
function
|
|
735
|
-
return typeof
|
|
811
|
+
function ut(i) {
|
|
812
|
+
return typeof i == "string" && (i === "false" || i === "0" || i === "null") || typeof i == "boolean" && !i;
|
|
736
813
|
}
|
|
737
|
-
function
|
|
814
|
+
function bt() {
|
|
738
815
|
return window.matchMedia("only screen and (min-width: 768px)").matches ? "tablet" : window.matchMedia("only screen and (min-width: 1025px)").matches ? "laptop" : "mobile";
|
|
739
816
|
}
|
|
740
|
-
function
|
|
741
|
-
return
|
|
817
|
+
function dt(i, t) {
|
|
818
|
+
return i.includes(t);
|
|
742
819
|
}
|
|
743
|
-
const
|
|
820
|
+
const B = [
|
|
744
821
|
"aria-label",
|
|
745
822
|
"aria-labelledby",
|
|
746
823
|
"aria-describedby",
|
|
@@ -775,70 +852,70 @@ const C = [
|
|
|
775
852
|
"aria-busy",
|
|
776
853
|
"aria-owns"
|
|
777
854
|
];
|
|
778
|
-
function
|
|
855
|
+
function ct(i, t, s = !1) {
|
|
779
856
|
var e;
|
|
780
|
-
if (
|
|
781
|
-
|
|
782
|
-
}), s) {
|
|
783
|
-
const
|
|
784
|
-
t.setAttribute("id",
|
|
857
|
+
if (B.forEach((o) => {
|
|
858
|
+
i.getAttribute(o) && (t.setAttribute(o, i.getAttribute(o)), i.removeAttribute(o));
|
|
859
|
+
}), s && !i.getAttribute("aria-labelledby")) {
|
|
860
|
+
const o = `px-${((e = t.localName) == null ? void 0 : e.toLowerCase()) ?? "component"}-${Math.random().toString(36).substring(2, 15)}`;
|
|
861
|
+
t.setAttribute("id", o), i.setAttribute("aria-labelledby", o);
|
|
785
862
|
}
|
|
786
863
|
}
|
|
787
|
-
function
|
|
788
|
-
const
|
|
789
|
-
(
|
|
790
|
-
${t(
|
|
791
|
-
${
|
|
792
|
-
${
|
|
864
|
+
function gt(i, t, s, e = "", o, l = i) {
|
|
865
|
+
const b = new CSSStyleSheet(), f = s.reduce(
|
|
866
|
+
(j, r) => j + `
|
|
867
|
+
${t(l, r)} {
|
|
868
|
+
${i}: var(--${e}-${r}-desktop);
|
|
869
|
+
${o ? `${o}:var(--${e}-${r}-desktop)` : ""}
|
|
793
870
|
}
|
|
794
871
|
/* Mobile only - max 767px */
|
|
795
872
|
@media only screen and (max-width: 47.938em) {
|
|
796
|
-
${t(
|
|
797
|
-
${
|
|
798
|
-
${
|
|
873
|
+
${t(l, r)} {
|
|
874
|
+
${i}: var(--${e}-${r}-mobile);
|
|
875
|
+
${o ? `${o}: var(--${e}-${r}-mobile)` : ""}
|
|
799
876
|
}
|
|
800
877
|
}
|
|
801
|
-
${t(
|
|
878
|
+
${t(l, r, "mobile")} {
|
|
802
879
|
/* Mobile only - max 767px */
|
|
803
880
|
@media only screen and (max-width: 47.938em) {
|
|
804
|
-
${
|
|
805
|
-
${
|
|
881
|
+
${i}: var(--${e}-${r}-mobile) !important;
|
|
882
|
+
${o ? `${o}: var(--${e}-${r}-mobile)` : ""}
|
|
806
883
|
}
|
|
807
884
|
}
|
|
808
|
-
${t(
|
|
885
|
+
${t(l, r, "tablet")} {
|
|
809
886
|
/* Tablet - min 768px max 1024px */
|
|
810
887
|
@media only screen and (min-width: 48em) and (max-width: 64em) {
|
|
811
|
-
${
|
|
812
|
-
${
|
|
888
|
+
${i}: var(--${e}-${r}-desktop) !important;
|
|
889
|
+
${o ? `${o}: var(--${e}-${r}-desktop)` : ""}
|
|
813
890
|
}
|
|
814
891
|
}
|
|
815
|
-
${t(
|
|
892
|
+
${t(l, r, "laptop")} {
|
|
816
893
|
/* Laptop - 1025px*/
|
|
817
894
|
@media only screen and (min-width: 64.0625em) {
|
|
818
|
-
${
|
|
819
|
-
${
|
|
895
|
+
${i}: var(--${e}-${r}-desktop) !important;
|
|
896
|
+
${o ? `${o}: var(--${e}-${r}-desktop)` : ""}
|
|
820
897
|
}
|
|
821
898
|
}
|
|
822
|
-
${t(
|
|
899
|
+
${t(l, r, "desktop")} {
|
|
823
900
|
/* Desktop - 1025px*/
|
|
824
901
|
@media only screen and (min-width: 64.0625em) {
|
|
825
|
-
${
|
|
826
|
-
${
|
|
902
|
+
${i}: var(--${e}-${r}-desktop) !important;
|
|
903
|
+
${o ? `${o}: var(--${e}-${r}-desktop)` : ""}
|
|
827
904
|
}
|
|
828
905
|
}`,
|
|
829
906
|
""
|
|
830
907
|
);
|
|
831
|
-
return
|
|
908
|
+
return b.replaceSync(f), b;
|
|
832
909
|
}
|
|
833
|
-
class
|
|
834
|
-
constructor(t, s, e,
|
|
835
|
-
this.component = t, this.attributeName = s, this.cssVariable =
|
|
910
|
+
class ft {
|
|
911
|
+
constructor(t, s, e, o) {
|
|
912
|
+
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(
|
|
836
913
|
this.component,
|
|
837
914
|
this.toCamelCase(this.attributeName),
|
|
838
915
|
{
|
|
839
916
|
get: () => this.component.getAttribute(this.attributeName),
|
|
840
|
-
set: (
|
|
841
|
-
this.component.setAttribute(this.attributeName,
|
|
917
|
+
set: (l) => {
|
|
918
|
+
this.component.setAttribute(this.attributeName, l);
|
|
842
919
|
}
|
|
843
920
|
}
|
|
844
921
|
);
|
|
@@ -864,10 +941,10 @@ class et {
|
|
|
864
941
|
}
|
|
865
942
|
}
|
|
866
943
|
setCSSProperty(t, s, e = !0) {
|
|
867
|
-
const [,
|
|
944
|
+
const [, o = ""] = t.split("--");
|
|
868
945
|
this.component.style.setProperty(
|
|
869
|
-
`${this.cssVariable}${e ? "-all" : ""}${
|
|
870
|
-
`${this._attributeValue(s,
|
|
946
|
+
`${this.cssVariable}${e ? "-all" : ""}${o ? `-${o}` : ""}`,
|
|
947
|
+
`${this._attributeValue(s, o)}`
|
|
871
948
|
);
|
|
872
949
|
}
|
|
873
950
|
setCSSProperties() {
|
|
@@ -889,20 +966,20 @@ class et {
|
|
|
889
966
|
e,
|
|
890
967
|
!1
|
|
891
968
|
);
|
|
892
|
-
const
|
|
969
|
+
const o = this.component.getAttribute(
|
|
893
970
|
this.attributeNameLaptop
|
|
894
971
|
);
|
|
895
|
-
|
|
972
|
+
o && this.setCSSProperty(
|
|
896
973
|
this.attributeNameLaptop,
|
|
897
|
-
|
|
974
|
+
o,
|
|
898
975
|
!1
|
|
899
976
|
);
|
|
900
|
-
const
|
|
977
|
+
const l = this.component.getAttribute(
|
|
901
978
|
this.attributeNameDesktop
|
|
902
979
|
);
|
|
903
|
-
|
|
980
|
+
l && this.setCSSProperty(
|
|
904
981
|
this.attributeNameDesktop,
|
|
905
|
-
|
|
982
|
+
l,
|
|
906
983
|
!1
|
|
907
984
|
);
|
|
908
985
|
}
|
|
@@ -911,45 +988,46 @@ class et {
|
|
|
911
988
|
}
|
|
912
989
|
}
|
|
913
990
|
export {
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
991
|
+
ft as AttributeBreakpointHandlerDelegate,
|
|
992
|
+
k as PxElement,
|
|
993
|
+
z as VerticallyExtendedElement,
|
|
994
|
+
y as WithExtraAttributes,
|
|
995
|
+
R as WrappedInteractiveStateController,
|
|
996
|
+
B as accessibilityAttributes,
|
|
997
|
+
ht as addGlobalStylesheet,
|
|
998
|
+
pt as assetContainerImgWidthValues,
|
|
999
|
+
st as backgroundColorValues,
|
|
1000
|
+
it as backgroundSizeValues,
|
|
1001
|
+
tt as borderColorValues,
|
|
1002
|
+
Z as borderRadiusValues,
|
|
1003
|
+
et as borderSideValues,
|
|
1004
|
+
Y as borderValues,
|
|
1005
|
+
ot as boxShadowValues,
|
|
1006
|
+
dt as checkName,
|
|
1007
|
+
F as colorValues,
|
|
1008
|
+
I as cssGridAlignSelfValues,
|
|
1009
|
+
q as cssGridColSpanValues,
|
|
1010
|
+
_ as cssGridJustifySelfValues,
|
|
1011
|
+
P as cssGridOrderValues,
|
|
1012
|
+
H as cssGridPlaceSelfValues,
|
|
1013
|
+
gt as cssTokenBreakpoints,
|
|
1014
|
+
O as flexboxAlignSelfValues,
|
|
1015
|
+
X as fontsizeValues,
|
|
1016
|
+
U as fontweightValues,
|
|
1017
|
+
lt as gapValues,
|
|
1018
|
+
M as getSupportedAttributeNames,
|
|
1019
|
+
N as getSupportedPropertyNames,
|
|
1020
|
+
bt as getViewportFormat,
|
|
1021
|
+
at as gradientValues,
|
|
1022
|
+
W as gridGapValues,
|
|
1023
|
+
rt as headingValues,
|
|
1024
|
+
G as iconSizeValues,
|
|
1025
|
+
J as iconSizeValuesKC,
|
|
1026
|
+
v as isComponentDebug,
|
|
1027
|
+
ut as isFalsy,
|
|
1028
|
+
T as log,
|
|
1029
|
+
nt as noBorderRadiusValues,
|
|
1030
|
+
Q as paddingValues,
|
|
1031
|
+
K as textalignValues,
|
|
1032
|
+
ct as transferAccessibilityAttributes
|
|
955
1033
|
};
|