@proximus/lavender-drawer 2.0.0-alpha.120 → 2.0.0-alpha.121
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/Drawer.d.ts +1 -0
- package/dist/index.es.js +12 -11
- package/package.json +1 -1
package/dist/Drawer.d.ts
CHANGED
|
@@ -7,6 +7,7 @@ import { type Icon } from '@proximus/lavender-icon';
|
|
|
7
7
|
export declare const HIDE_EVENT = "px.lavender.drawer.hide";
|
|
8
8
|
export declare class Drawer extends HTMLElement {
|
|
9
9
|
observer: MutationObserver;
|
|
10
|
+
private previousFocusedElement;
|
|
10
11
|
template: string;
|
|
11
12
|
constructor();
|
|
12
13
|
connectedCallback(): void;
|
package/dist/index.es.js
CHANGED
|
@@ -8,7 +8,7 @@ n.replaceSync(l);
|
|
|
8
8
|
const d = "px.lavender.drawer.hide";
|
|
9
9
|
class h extends HTMLElement {
|
|
10
10
|
constructor() {
|
|
11
|
-
super(), this.template = `<dialog popover role="dialog" aria-modal="true" >
|
|
11
|
+
super(), this.previousFocusedElement = null, this.template = `<dialog popover role="dialog" aria-modal="true" >
|
|
12
12
|
<div id="container">
|
|
13
13
|
<px-vstack gap="heading-to-subtitle" id="header">
|
|
14
14
|
<px-h1 variant="title-2xl">
|
|
@@ -65,23 +65,23 @@ class h extends HTMLElement {
|
|
|
65
65
|
];
|
|
66
66
|
}
|
|
67
67
|
attributeChangedCallback(e, t, o) {
|
|
68
|
-
var
|
|
68
|
+
var i, r, a;
|
|
69
69
|
switch (e) {
|
|
70
70
|
case "open":
|
|
71
71
|
o !== null ? this.show() : this.hide();
|
|
72
72
|
break;
|
|
73
73
|
case "close-button-aria-label":
|
|
74
|
-
o ? (a = (
|
|
75
|
-
|
|
74
|
+
o ? (a = (r = this.$closeButton) == null ? void 0 : r.setAttribute) == null || a.call(
|
|
75
|
+
r,
|
|
76
76
|
"aria-label",
|
|
77
77
|
o || "Close drawer"
|
|
78
|
-
) : (
|
|
78
|
+
) : (i = this.$closeButton) == null || i.removeAttribute("aria-label");
|
|
79
79
|
break;
|
|
80
80
|
case "openedby":
|
|
81
81
|
if (o !== t) {
|
|
82
82
|
if (t) {
|
|
83
|
-
const
|
|
84
|
-
|
|
83
|
+
const s = document.querySelector(`#${t}`);
|
|
84
|
+
s == null || s.removeEventListener("click", () => this.show());
|
|
85
85
|
}
|
|
86
86
|
this.addOpenListener();
|
|
87
87
|
}
|
|
@@ -99,12 +99,13 @@ class h extends HTMLElement {
|
|
|
99
99
|
), (t = this.observer) == null || t.disconnect(), this.$opener && this.$opener.removeEventListener("click", () => this.show()), this.$closer && this.$closer.removeEventListener("click", () => this.hide());
|
|
100
100
|
}
|
|
101
101
|
show() {
|
|
102
|
-
var
|
|
103
|
-
|
|
102
|
+
var t, o, i;
|
|
103
|
+
const e = document.activeElement;
|
|
104
|
+
this.previousFocusedElement = ((t = e == null ? void 0 : e.shadowRoot) == null ? void 0 : t.activeElement) ?? e, (i = (o = this.$dialog).showPopover) == null || i.call(o), document.body.style.overflow = "hidden";
|
|
104
105
|
}
|
|
105
106
|
hide() {
|
|
106
|
-
var e, t;
|
|
107
|
-
(t = (e = this.$dialog).hidePopover) == null || t.call(e), document.body.style.overflow = "", this.dispatchEvent(
|
|
107
|
+
var e, t, o;
|
|
108
|
+
(t = (e = this.$dialog).hidePopover) == null || t.call(e), document.body.style.overflow = "", (o = this.previousFocusedElement) == null || o.focus(), this.previousFocusedElement = null, this.dispatchEvent(
|
|
108
109
|
new Event(d, {
|
|
109
110
|
bubbles: !0,
|
|
110
111
|
composed: !0
|