mirror of
https://github.com/EGroupware/egroupware.git
synced 2025-06-21 18:31:37 +02:00
Et2TreeDropdown: close search results & tree on tab
This commit is contained in:
parent
1294220e7e
commit
cfbcaf3bab
@ -575,13 +575,18 @@ export class Et2TreeDropdown extends SearchMixin<Constructor<any> & Et2InputWidg
|
|||||||
this.show();
|
this.show();
|
||||||
}
|
}
|
||||||
|
|
||||||
private handleSearchBlur(event)
|
private handleInternalBlur(event)
|
||||||
{
|
{
|
||||||
// Focus lost to some other internal component - ignore it
|
// Focus lost to some other internal component - ignore it
|
||||||
if(event.composedPath().includes(this.shadowRoot))
|
let o = event.relatedTarget;
|
||||||
|
while(o)
|
||||||
|
{
|
||||||
|
if(o == this.shadowRoot)
|
||||||
{
|
{
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
o = o.parentNode;
|
||||||
|
}
|
||||||
this.handleBlur();
|
this.handleBlur();
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -589,9 +594,17 @@ export class Et2TreeDropdown extends SearchMixin<Constructor<any> & Et2InputWidg
|
|||||||
{
|
{
|
||||||
super.handleSearchKeyDown(event);
|
super.handleSearchKeyDown(event);
|
||||||
|
|
||||||
|
// Show options if popup is closed
|
||||||
if(event.key == "ArrowDown" && !this.open && !this.resultsOpen)
|
if(event.key == "ArrowDown" && !this.open && !this.resultsOpen)
|
||||||
{
|
{
|
||||||
this.show();
|
this.show();
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
// Move to tree if popup is open & tree is showing
|
||||||
|
else if(event.key == "ArrowDown" && this.treeOrSearch == "tree")
|
||||||
|
{
|
||||||
|
this._tree.focus();
|
||||||
|
event.stopPropagation();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Left at beginning goes to tags
|
// Left at beginning goes to tags
|
||||||
@ -752,7 +765,7 @@ export class Et2TreeDropdown extends SearchMixin<Constructor<any> & Et2InputWidg
|
|||||||
tabindex="0"
|
tabindex="0"
|
||||||
.value=${this.hasFocus ? "" : this.displayLabel}
|
.value=${this.hasFocus ? "" : this.displayLabel}
|
||||||
@keydown=${this.handleSearchKeyDown}
|
@keydown=${this.handleSearchKeyDown}
|
||||||
@blur=${this.handleSearchBlur}
|
@blur=${this.handleInternalBlur}
|
||||||
@focus=${this.handleSearchFocus}
|
@focus=${this.handleSearchFocus}
|
||||||
@paste=${this.handlePaste}
|
@paste=${this.handlePaste}
|
||||||
/>
|
/>
|
||||||
@ -944,6 +957,7 @@ export class Et2TreeDropdown extends SearchMixin<Constructor<any> & Et2InputWidg
|
|||||||
.autoloading="${this.autoloading}"
|
.autoloading="${this.autoloading}"
|
||||||
?leafOnly = ${this.leafOnly}
|
?leafOnly = ${this.leafOnly}
|
||||||
|
|
||||||
|
@blur=${this.handleInternalBlur}
|
||||||
@sl-selection-change=${this.handleTreeChange}
|
@sl-selection-change=${this.handleTreeChange}
|
||||||
>
|
>
|
||||||
</et2-tree>
|
</et2-tree>
|
||||||
|
@ -566,7 +566,7 @@ export const SearchMixin = <T extends Constructor<Et2InputWidgetInterface &
|
|||||||
this.setCurrentResult(suggestions[newIndex]);
|
this.setCurrentResult(suggestions[newIndex]);
|
||||||
}
|
}
|
||||||
// Close results on escape
|
// Close results on escape
|
||||||
else if(["Escape"].includes(event.key))
|
else if(["Escape", "Tab"].includes(event.key))
|
||||||
{
|
{
|
||||||
this.resultsOpen = false;
|
this.resultsOpen = false;
|
||||||
this._searchNode.focus();
|
this._searchNode.focus();
|
||||||
|
Loading…
x
Reference in New Issue
Block a user