extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2025-06-24 20:01:36 +02:00
Code Issues Packages Projects Releases Wiki Activity

Et2Select: If multiple and no value, overlap the search onto the widget

Browse Source
This commit is contained in:
nathan 2022-09-01 11:53:19 -06:00
parent 7fc28f9fb5
commit daf63d9c23
1 changed files with 20 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
api/js/etemplate/Et2Select/SearchMixin.ts
View File

@ -190,6 +190,10 @@ export const Et2WithSearchMixin = <T extends Constructor<LitElement>>(superclass
.search_input.editing{ .search_input.editing{
display: flex; display: flex;
} }
/* If multiple and no value, overlap search onto widget instead of below */
:host([multiple]) .search_input.active.novalue {
top: 0px;
}
/* Hide options that do not match current search text */ /* Hide options that do not match current search text */
::slotted(.no-match) { ::slotted(.no-match) {
@ -358,9 +362,6 @@ export const Et2WithSearchMixin = <T extends Constructor<LitElement>>(superclass
let control = this.shadowRoot.querySelector(".form-control-input"); let control = this.shadowRoot.querySelector(".form-control-input");
control.append(div); control.append(div);
// Move menu down to make space for search
this.dropdown.setAttribute("distance", parseInt(getComputedStyle(div).getPropertyValue("--sl-input-height-medium")));
}); });
} }
@ -513,6 +514,15 @@ export const Et2WithSearchMixin = <T extends Constructor<LitElement>>(superclass
{ {
return; return;
} }
// Move search (& menu) if there's no value
this._activeControls?.classList.toggle("novalue", this.multiple && this.value == '');
this.dropdown?.setAttribute("distance",
this._activeControls?.classList.contains("novalue") ?
"" :
// Make room for search below
parseInt(getComputedStyle(this._activeControls).getPropertyValue("--sl-input-height-medium"))
);
super.handleMenuShow(); super.handleMenuShow();
if(this.searchEnabled || this.allowFreeEntries) if(this.searchEnabled || this.allowFreeEntries)
@ -521,6 +531,7 @@ export const Et2WithSearchMixin = <T extends Constructor<LitElement>>(superclass
this._searchInputNode.focus(); this._searchInputNode.focus();
this._searchInputNode.select(); this._searchInputNode.select();
} }
if(this.editModeEnabled && this.allowFreeEntries && !this.multiple) if(this.editModeEnabled && this.allowFreeEntries && !this.multiple)
{ {
this.startEdit(); this.startEdit();
@ -607,6 +618,12 @@ export const Et2WithSearchMixin = <T extends Constructor<LitElement>>(superclass
this._searchInputNode.focus(); this._searchInputNode.focus();
this._searchInputNode.select(); this._searchInputNode.select();
// If we were overlapping, reset
if(this._activeControls.classList.contains("novalue"))
{
this.handleMenuShow();
}
// Scroll the new tag into view // Scroll the new tag into view
if(event.detail && event.detail.item) if(event.detail && event.detail.item)
{ {