@proximus/lavender-layout 2.0.0-alpha.227 → 2.0.0-alpha.229
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/Stack.d.ts +24 -1
- package/dist/index.es.js +97 -3
- package/package.json +1 -1
package/dist/Stack.d.ts
CHANGED
|
@@ -9,13 +9,16 @@ export declare class Stack extends WithExtraAttributes {
|
|
|
9
9
|
constructor();
|
|
10
10
|
/**
|
|
11
11
|
* Defaults (direction: row, gap: none, align-items: stretch,
|
|
12
|
-
* justify-content: flex-start, wrap: nowrap, overflow-x: visible
|
|
12
|
+
* justify-content: flex-start, wrap: nowrap, overflow-x/y: visible,
|
|
13
|
+
* max-height: none) are
|
|
13
14
|
* provided by Stack.css; nothing is written to the DOM on connection.
|
|
14
15
|
* Kept for subclasses calling super.
|
|
15
16
|
*/
|
|
16
17
|
connectedCallback(): void;
|
|
17
18
|
static get observedAttributes(): string[];
|
|
18
19
|
attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
|
|
20
|
+
private isValidVerticalValue;
|
|
21
|
+
private updateVerticalStyles;
|
|
19
22
|
updateOverflowX(name: string, oldValue: string, newValue: string, attrValue: string[]): void;
|
|
20
23
|
updateFlexProperties(name: string, _oldValue: string | null, newValue: string | null, attrValue: string[]): void;
|
|
21
24
|
/**
|
|
@@ -84,6 +87,26 @@ export declare class Stack extends WithExtraAttributes {
|
|
|
84
87
|
set overflowXLaptop(value: string | null);
|
|
85
88
|
get overflowXDesktop(): string | null;
|
|
86
89
|
set overflowXDesktop(value: string | null);
|
|
90
|
+
get overflowY(): string | null;
|
|
91
|
+
set overflowY(value: string | null);
|
|
92
|
+
get overflowYMobile(): string | null;
|
|
93
|
+
set overflowYMobile(value: string | null);
|
|
94
|
+
get overflowYTablet(): string | null;
|
|
95
|
+
set overflowYTablet(value: string | null);
|
|
96
|
+
get overflowYLaptop(): string | null;
|
|
97
|
+
set overflowYLaptop(value: string | null);
|
|
98
|
+
get overflowYDesktop(): string | null;
|
|
99
|
+
set overflowYDesktop(value: string | null);
|
|
100
|
+
get maxHeight(): string | null;
|
|
101
|
+
set maxHeight(value: string | null);
|
|
102
|
+
get maxHeightMobile(): string | null;
|
|
103
|
+
set maxHeightMobile(value: string | null);
|
|
104
|
+
get maxHeightTablet(): string | null;
|
|
105
|
+
set maxHeightTablet(value: string | null);
|
|
106
|
+
get maxHeightLaptop(): string | null;
|
|
107
|
+
set maxHeightLaptop(value: string | null);
|
|
108
|
+
get maxHeightDesktop(): string | null;
|
|
109
|
+
set maxHeightDesktop(value: string | null);
|
|
87
110
|
get $el(): HTMLDivElement;
|
|
88
111
|
}
|
|
89
112
|
export declare class VStack extends Stack {
|
package/dist/index.es.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { AttributeBreakpointHandlerDelegate as e, WithExtraAttributes as t, backgroundColorValues as n, checkName as r, gapValues as i, log as a, propertyToAttributeSetter as o, renderTemplate as s } from "@proximus/lavender-common";
|
|
2
2
|
//#region src/Stack.css?inline
|
|
3
|
-
var c = ":host{--host-gap--mobile:var(--px-spacing-none-mobile);--host-gap--tablet:var(--px-spacing-none-tablet);--host-gap--laptop:var(--px-spacing-none-desktop);--host-gap--desktop:var(--px-spacing-none-desktop);--overflow-x-all:visible;--overflow-x-all-mobile:initial;--overflow-x-all-tablet:initial;--overflow-x-all-laptop:initial;--overflow-x-all-desktop:initial;display:block}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-mobile) - var(--host-gap--mobile))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-mobile) + var(--px-focus-offset-mobile)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-mobile) + var(--px-focus-offset-mobile))}.flex-container{--flex-direction--mobile-value:row;--flex-direction--tablet-value:row;--flex-direction--laptop-value:row;--flex-direction--desktop-value:row;--flex-gap--mobile-value:var(--px-spacing-none-mobile);--flex-gap--tablet-value:var(--px-spacing-none-tablet);--flex-gap--laptop-value:var(--px-spacing-none-desktop);--flex-gap--desktop-value:var(--px-spacing-none-desktop);--flex-align-items--mobile-value:stretch;--flex-align-items--tablet-value:stretch;--flex-align-items--laptop-value:stretch;--flex-align-items--desktop-value:stretch;--flex-justify-content--mobile-value:flex-start;--flex-justify-content--tablet-value:flex-start;--flex-justify-content--laptop-value:flex-start;--flex-justify-content--desktop-value:flex-start;--flex-wrap--mobile-value:nowrap;--flex-wrap--tablet-value:nowrap;--flex-wrap--laptop-value:nowrap;--flex-wrap--desktop-value:nowrap;box-sizing:border-box;flex-direction:var(--flex-direction--mobile-value);gap:var(--flex-gap--mobile-value);flex-wrap:var(--flex-wrap--mobile-value);justify-content:var(--flex-justify-content--mobile-value);align-items:var(--flex-align-items--mobile-value);width:100%;height:100%;overflow-x:var(--overflow-x-all);display:flex}@media screen and (width<=47.938rem){.flex-container{overflow-x:var(--overflow-x-all-mobile,var(--overflow-x-all));scrollbar-width:none}.flex-container::-webkit-scrollbar{display:none}}@media screen and (width>=48rem){.flex-container{flex-direction:var(--flex-direction--tablet-value);gap:var(--flex-gap--tablet-value);flex-wrap:var(--flex-wrap--tablet-value);justify-content:var(--flex-justify-content--tablet-value);align-items:var(--flex-align-items--tablet-value)}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-tablet) - var(--host-gap--tablet))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-tablet) + var(--px-focus-offset-tablet)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-tablet) + var(--px-focus-offset-tablet))}}@media screen and (width>=48rem) and (width<=64rem){.flex-container{overflow-x:var(--overflow-x-all-tablet,var(--overflow-x-all));scrollbar-width:none}.flex-container::-webkit-scrollbar{display:none}}@media screen and (width>=64.0625rem){.flex-container{flex-direction:var(--flex-direction--laptop-value);gap:var(--flex-gap--laptop-value);flex-wrap:var(--flex-wrap--laptop-value);justify-content:var(--flex-justify-content--laptop-value);align-items:var(--flex-align-items--laptop-value)}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-laptop) - var(--host-gap--laptop))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-laptop) + var(--px-focus-offset-laptop)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-laptop) + var(--px-focus-offset-laptop))}}@media screen and (width>=64.0625rem) and (width<=90rem){.flex-container{overflow-x:var(--overflow-x-all-laptop,var(--overflow-x-all))}}@media screen and (width>=90.0625rem){.flex-container{flex-direction:var(--flex-direction--desktop-value);gap:var(--flex-gap--desktop-value);flex-wrap:var(--flex-wrap--desktop-value);justify-content:var(--flex-justify-content--desktop-value);align-items:var(--flex-align-items--desktop-value);overflow-x:var(--overflow-x-all-desktop,var(--overflow-x-all))}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-desktop) - var(--host-gap--desktop))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-desktop) + var(--px-focus-offset-desktop)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-desktop) + var(--px-focus-offset-desktop))}}:host(px-vstack) .flex-container{--flex-direction--mobile-value:column!important;--flex-direction--tablet-value:column!important;--flex-direction--laptop-value:column!important;--flex-direction--desktop-value:column!important}:host(px-hstack) .flex-container{--flex-direction--mobile-value:row!important;--flex-direction--tablet-value:row!important;--flex-direction--laptop-value:row!important;--flex-direction--desktop-value:row!important}", l = new CSSStyleSheet();
|
|
3
|
+
var c = ":host{--host-gap--mobile:var(--px-spacing-none-mobile);--host-gap--tablet:var(--px-spacing-none-tablet);--host-gap--laptop:var(--px-spacing-none-desktop);--host-gap--desktop:var(--px-spacing-none-desktop);--overflow-x-all:visible;--overflow-x-all-mobile:initial;--overflow-x-all-tablet:initial;--overflow-x-all-laptop:initial;--overflow-x-all-desktop:initial;display:block}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-mobile) - var(--host-gap--mobile))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-mobile) + var(--px-focus-offset-mobile)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-mobile) + var(--px-focus-offset-mobile))}.flex-container{--flex-direction--mobile-value:row;--flex-direction--tablet-value:row;--flex-direction--laptop-value:row;--flex-direction--desktop-value:row;--flex-gap--mobile-value:var(--px-spacing-none-mobile);--flex-gap--tablet-value:var(--px-spacing-none-tablet);--flex-gap--laptop-value:var(--px-spacing-none-desktop);--flex-gap--desktop-value:var(--px-spacing-none-desktop);--flex-align-items--mobile-value:stretch;--flex-align-items--tablet-value:stretch;--flex-align-items--laptop-value:stretch;--flex-align-items--desktop-value:stretch;--flex-justify-content--mobile-value:flex-start;--flex-justify-content--tablet-value:flex-start;--flex-justify-content--laptop-value:flex-start;--flex-justify-content--desktop-value:flex-start;--flex-wrap--mobile-value:nowrap;--flex-wrap--tablet-value:nowrap;--flex-wrap--laptop-value:nowrap;--flex-wrap--desktop-value:nowrap;--flex-overflow-y--mobile-value:visible;--flex-overflow-y--tablet-value:visible;--flex-overflow-y--laptop-value:visible;--flex-overflow-y--desktop-value:visible;--flex-max-height--mobile-value:none;--flex-max-height--tablet-value:none;--flex-max-height--laptop-value:none;--flex-max-height--desktop-value:none;box-sizing:border-box;flex-direction:var(--flex-direction--mobile-value);gap:var(--flex-gap--mobile-value);flex-wrap:var(--flex-wrap--mobile-value);justify-content:var(--flex-justify-content--mobile-value);align-items:var(--flex-align-items--mobile-value);width:100%;height:100%;overflow-x:var(--overflow-x-all);overflow-y:var(--flex-overflow-y--mobile-value);max-height:var(--flex-max-height--mobile-value);display:flex}@media screen and (width<=47.938rem){.flex-container{overflow-x:var(--overflow-x-all-mobile,var(--overflow-x-all));scrollbar-width:none}.flex-container::-webkit-scrollbar{display:none}}@media screen and (width>=48rem){.flex-container{flex-direction:var(--flex-direction--tablet-value);gap:var(--flex-gap--tablet-value);flex-wrap:var(--flex-wrap--tablet-value);justify-content:var(--flex-justify-content--tablet-value);align-items:var(--flex-align-items--tablet-value);overflow-y:var(--flex-overflow-y--tablet-value);max-height:var(--flex-max-height--tablet-value)}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-tablet) - var(--host-gap--tablet))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-tablet) + var(--px-focus-offset-tablet)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-tablet) + var(--px-focus-offset-tablet))}}@media screen and (width>=48rem) and (width<=64rem){.flex-container{overflow-x:var(--overflow-x-all-tablet,var(--overflow-x-all));scrollbar-width:none}.flex-container::-webkit-scrollbar{display:none}}@media screen and (width>=64.0625rem){.flex-container{flex-direction:var(--flex-direction--laptop-value);gap:var(--flex-gap--laptop-value);flex-wrap:var(--flex-wrap--laptop-value);justify-content:var(--flex-justify-content--laptop-value);align-items:var(--flex-align-items--laptop-value);overflow-y:var(--flex-overflow-y--laptop-value);max-height:var(--flex-max-height--laptop-value)}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-laptop) - var(--host-gap--laptop))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-laptop) + var(--px-focus-offset-laptop)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-laptop) + var(--px-focus-offset-laptop))}}@media screen and (width>=64.0625rem) and (width<=90rem){.flex-container{overflow-x:var(--overflow-x-all-laptop,var(--overflow-x-all))}}@media screen and (width>=90.0625rem){.flex-container{flex-direction:var(--flex-direction--desktop-value);gap:var(--flex-gap--desktop-value);flex-wrap:var(--flex-wrap--desktop-value);justify-content:var(--flex-justify-content--desktop-value);align-items:var(--flex-align-items--desktop-value);overflow-y:var(--flex-overflow-y--desktop-value);max-height:var(--flex-max-height--desktop-value);overflow-x:var(--overflow-x-all-desktop,var(--overflow-x-all))}:host ::slotted(px-h1[auto-spacing]),:host ::slotted(px-h2[auto-spacing]),:host ::slotted(px-h3[auto-spacing]),:host ::slotted(px-h4[auto-spacing]),:host ::slotted(px-h5[auto-spacing]),:host ::slotted(px-h6[auto-spacing]){margin-bottom:calc(var(--px-spacing-heading-to-content-desktop) - var(--host-gap--desktop))}:host([overflow-x=auto]){margin:calc(calc(var(--px-focus-outline-desktop) + var(--px-focus-offset-desktop)) * -1)}:host([overflow-x=auto]) .flex-container{padding:calc(var(--px-focus-outline-desktop) + var(--px-focus-offset-desktop))}}:host(px-vstack) .flex-container{--flex-direction--mobile-value:column!important;--flex-direction--tablet-value:column!important;--flex-direction--laptop-value:column!important;--flex-direction--desktop-value:column!important}:host(px-hstack) .flex-container{--flex-direction--mobile-value:row!important;--flex-direction--tablet-value:row!important;--flex-direction--laptop-value:row!important;--flex-direction--desktop-value:row!important}", l = new CSSStyleSheet();
|
|
4
4
|
l.replaceSync(c);
|
|
5
5
|
var u = document.createElement("template");
|
|
6
6
|
u.innerHTML = "<div class=\"flex-container\"><slot></slot></div>";
|
|
@@ -81,7 +81,17 @@ var d = [
|
|
|
81
81
|
"overflow-x--mobile",
|
|
82
82
|
"overflow-x--tablet",
|
|
83
83
|
"overflow-x--laptop",
|
|
84
|
-
"overflow-x--desktop"
|
|
84
|
+
"overflow-x--desktop",
|
|
85
|
+
"overflow-y",
|
|
86
|
+
"overflow-y--mobile",
|
|
87
|
+
"overflow-y--tablet",
|
|
88
|
+
"overflow-y--laptop",
|
|
89
|
+
"overflow-y--desktop",
|
|
90
|
+
"max-height",
|
|
91
|
+
"max-height--mobile",
|
|
92
|
+
"max-height--tablet",
|
|
93
|
+
"max-height--laptop",
|
|
94
|
+
"max-height--desktop"
|
|
85
95
|
];
|
|
86
96
|
}
|
|
87
97
|
attributeChangedCallback(e, t, n) {
|
|
@@ -119,7 +129,19 @@ var d = [
|
|
|
119
129
|
case "direction--tablet":
|
|
120
130
|
case "direction--laptop":
|
|
121
131
|
case "direction--desktop":
|
|
122
|
-
this.updateFlexProperties(e, t, n, d);
|
|
132
|
+
this.updateFlexProperties(e, t, n, d), this.updateVerticalStyles();
|
|
133
|
+
break;
|
|
134
|
+
case "overflow-y":
|
|
135
|
+
case "overflow-y--mobile":
|
|
136
|
+
case "overflow-y--tablet":
|
|
137
|
+
case "overflow-y--laptop":
|
|
138
|
+
case "overflow-y--desktop":
|
|
139
|
+
case "max-height":
|
|
140
|
+
case "max-height--mobile":
|
|
141
|
+
case "max-height--tablet":
|
|
142
|
+
case "max-height--laptop":
|
|
143
|
+
case "max-height--desktop":
|
|
144
|
+
n && !this.isValidVerticalValue(e, n) && a(`"${n}" is not a valid ${e} value for ${this.tagName.toLowerCase()}.`), this.updateVerticalStyles();
|
|
123
145
|
break;
|
|
124
146
|
case "overflow-x":
|
|
125
147
|
case "overflow-x--mobile":
|
|
@@ -131,6 +153,18 @@ var d = [
|
|
|
131
153
|
default: super.attributeChangedCallback(e, t, n);
|
|
132
154
|
}
|
|
133
155
|
}
|
|
156
|
+
isValidVerticalValue(e, t) {
|
|
157
|
+
return e.startsWith("overflow-y") ? h.includes(t) : CSS.supports("max-height", t);
|
|
158
|
+
}
|
|
159
|
+
updateVerticalStyles() {
|
|
160
|
+
for (let e of n.breakpoints) {
|
|
161
|
+
let t = this.localName === "px-stack" && this.getAttribute(`direction--${e}`) || this.direction, n = t === "column" || t === "column-reverse";
|
|
162
|
+
for (let t of ["overflow-y", "max-height"]) {
|
|
163
|
+
let r = this.getAttribute(`${t}--${e}`) || this.getAttribute(t);
|
|
164
|
+
this.updateStyle(t, e, n && r && this.isValidVerticalValue(t, r) ? r : null);
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
}
|
|
134
168
|
updateOverflowX(e, t, n, i) {
|
|
135
169
|
r(i, n) ? this.overflowXAttributeDelegate.attributeChangedCallback(e, t, n) : a(`"${n}" is not a valid ${e} value for ${this.tagName.toLowerCase()}. Allowed values are: "${i.join("\", \"")}".`);
|
|
136
170
|
}
|
|
@@ -339,6 +373,66 @@ var d = [
|
|
|
339
373
|
set overflowXDesktop(e) {
|
|
340
374
|
o(this, "overflow-x--desktop", e);
|
|
341
375
|
}
|
|
376
|
+
get overflowY() {
|
|
377
|
+
return this.getAttribute("overflow-y") ?? "visible";
|
|
378
|
+
}
|
|
379
|
+
set overflowY(e) {
|
|
380
|
+
o(this, "overflow-y", e);
|
|
381
|
+
}
|
|
382
|
+
get overflowYMobile() {
|
|
383
|
+
return this.getAttribute("overflow-y--mobile");
|
|
384
|
+
}
|
|
385
|
+
set overflowYMobile(e) {
|
|
386
|
+
o(this, "overflow-y--mobile", e);
|
|
387
|
+
}
|
|
388
|
+
get overflowYTablet() {
|
|
389
|
+
return this.getAttribute("overflow-y--tablet");
|
|
390
|
+
}
|
|
391
|
+
set overflowYTablet(e) {
|
|
392
|
+
o(this, "overflow-y--tablet", e);
|
|
393
|
+
}
|
|
394
|
+
get overflowYLaptop() {
|
|
395
|
+
return this.getAttribute("overflow-y--laptop");
|
|
396
|
+
}
|
|
397
|
+
set overflowYLaptop(e) {
|
|
398
|
+
o(this, "overflow-y--laptop", e);
|
|
399
|
+
}
|
|
400
|
+
get overflowYDesktop() {
|
|
401
|
+
return this.getAttribute("overflow-y--desktop");
|
|
402
|
+
}
|
|
403
|
+
set overflowYDesktop(e) {
|
|
404
|
+
o(this, "overflow-y--desktop", e);
|
|
405
|
+
}
|
|
406
|
+
get maxHeight() {
|
|
407
|
+
return this.getAttribute("max-height") ?? "none";
|
|
408
|
+
}
|
|
409
|
+
set maxHeight(e) {
|
|
410
|
+
o(this, "max-height", e);
|
|
411
|
+
}
|
|
412
|
+
get maxHeightMobile() {
|
|
413
|
+
return this.getAttribute("max-height--mobile");
|
|
414
|
+
}
|
|
415
|
+
set maxHeightMobile(e) {
|
|
416
|
+
o(this, "max-height--mobile", e);
|
|
417
|
+
}
|
|
418
|
+
get maxHeightTablet() {
|
|
419
|
+
return this.getAttribute("max-height--tablet");
|
|
420
|
+
}
|
|
421
|
+
set maxHeightTablet(e) {
|
|
422
|
+
o(this, "max-height--tablet", e);
|
|
423
|
+
}
|
|
424
|
+
get maxHeightLaptop() {
|
|
425
|
+
return this.getAttribute("max-height--laptop");
|
|
426
|
+
}
|
|
427
|
+
set maxHeightLaptop(e) {
|
|
428
|
+
o(this, "max-height--laptop", e);
|
|
429
|
+
}
|
|
430
|
+
get maxHeightDesktop() {
|
|
431
|
+
return this.getAttribute("max-height--desktop");
|
|
432
|
+
}
|
|
433
|
+
set maxHeightDesktop(e) {
|
|
434
|
+
o(this, "max-height--desktop", e);
|
|
435
|
+
}
|
|
342
436
|
get $el() {
|
|
343
437
|
return this.shadowRoot.firstElementChild;
|
|
344
438
|
}
|