Fix Shoelace context menu did not properly hide on Esc / click out

(cherry picked from commit 5fed37087b30512af0483fb86902b0fe412ec88d)
This commit is contained in:
nathan 2024-07-09 15:35:46 -06:00 committed by milan
parent ee51a6cf09
commit 05c5073f34

View File

@ -41,16 +41,24 @@ export class EgwMenuShoelace extends LitElement
{ {
super(); super();
this.structure = _structure; this.structure = _structure;
this.handleDocumentClick = this.handleDocumentClick.bind(this);
this.handleKeypress = this.handleKeypress.bind(this);
} }
connectedCallback() connectedCallback()
{ {
super.connectedCallback(); super.connectedCallback();
document.addEventListener("click", this.handleDocumentClick);
document.addEventListener("keydown", this.handleKeypress);
} }
disconnectedCallback() disconnectedCallback()
{ {
super.disconnectedCallback(); super.disconnectedCallback();
document.removeEventListener("click", this.handleDocumentClick);
document.removeEventListener("keydown", this.handleKeypress);
if(this.popup) if(this.popup)
{ {
this.popup.remove(); this.popup.remove();
@ -102,7 +110,10 @@ export class EgwMenuShoelace extends LitElement
public hide() public hide()
{ {
this.popup.active = false; if(this.popup)
{
this.popup.active = false;
}
// egw_menu always creates a new menu // egw_menu always creates a new menu
this.remove(); this.remove();
@ -131,6 +142,24 @@ export class EgwMenuShoelace extends LitElement
} }
} }
handleDocumentClick(event)
{
if(!event.composedPath().includes(this))
{
this.hide();
}
}
handleKeypress(event : KeyboardEvent)
{
if(event.key == "Escape")
{
event.preventDefault();
event.stopPropagation();
this.hide();
}
}
private itemTemplate(item : egwMenuItem) private itemTemplate(item : egwMenuItem)
{ {
if(item.caption == "-") if(item.caption == "-")