web/elements: close dropdown when refresh event is dispatched
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
parent
b7f94df4d9
commit
42a9979d91
|
@ -1,17 +1,32 @@
|
|||
import { LitElement, TemplateResult, html } from "lit";
|
||||
import { customElement } from "lit/decorators.js";
|
||||
|
||||
import { EVENT_REFRESH } from "../../constants";
|
||||
|
||||
@customElement("ak-dropdown")
|
||||
export class DropdownButton extends LitElement {
|
||||
menu: HTMLElement | null;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
const menu = this.querySelector<HTMLElement>(".pf-c-dropdown__menu");
|
||||
this.menu = this.querySelector<HTMLElement>(".pf-c-dropdown__menu");
|
||||
this.querySelectorAll("button.pf-c-dropdown__toggle").forEach((btn) => {
|
||||
btn.addEventListener("click", () => {
|
||||
if (!menu) return;
|
||||
menu.hidden = !menu.hidden;
|
||||
if (!this.menu) return;
|
||||
this.menu.hidden = !this.menu.hidden;
|
||||
});
|
||||
});
|
||||
window.addEventListener(EVENT_REFRESH, this.clickHandler);
|
||||
}
|
||||
|
||||
clickHandler = (): void => {
|
||||
if (!this.menu) return;
|
||||
this.menu.hidden = true;
|
||||
};
|
||||
|
||||
disconnectedCallback(): void {
|
||||
super.disconnectedCallback();
|
||||
window.removeEventListener(EVENT_REFRESH, this.clickHandler);
|
||||
}
|
||||
|
||||
render(): TemplateResult {
|
||||
|
|
Reference in a new issue