Add selection-changed event

This commit is contained in:
trading_peter 2022-12-15 00:48:27 +01:00
parent 44d5fa8c1d
commit d8792aa947

View File

@ -235,7 +235,7 @@ class TpDropdown extends BaseElement {
}
render() {
const { label, isOpen, errorMessage, filterPlaceholder, extensible, filterable, items} = this;
const { label, isOpen, errorMessage, filterPlaceholder, extensible, filterable, items } = this;
return html`
<tp-media-query query="(min-width: 0) and (max-width: 480px)" @media-query-update=${this._queryUpdated}></tp-media-query>
@ -349,6 +349,10 @@ class TpDropdown extends BaseElement {
this._itemsChanged();
}
if (changes.has('isOpen')) {
this.dispatchEvent(new CustomEvent('is-open-changed', { detail: this.isOpen, bubbles: true, composed: true }));
}
return true;
}
@ -522,6 +526,12 @@ class TpDropdown extends BaseElement {
this.label = this.items[idx].label;
}
if (this.isOpen) {
setTimeout(() => {
this.focus();
});
}
this.isOpen = false;
window.removeEventListener('resize', this._boundSetListPosition);
document.removeEventListener('scroll', this._boundSetListPosition);
@ -673,6 +683,7 @@ class TpDropdown extends BaseElement {
}, 20);
} else {
this.value = itemEl.value;
this.dispatchEvent(new CustomEvent('selection-changed', { detail: this.value, bubbles: true, composed: true }));
}
var rootTarget = e.composedPath()[0];
@ -693,7 +704,6 @@ class TpDropdown extends BaseElement {
if (this.isOpen) {
e.preventDefault();
this.close();
this.focus();
}
return;
}
@ -782,7 +792,7 @@ class TpDropdown extends BaseElement {
var label = this.$.filter.value;
if (label !== '') {
if (!this._selectByLabel(label)) {
this.fire('add-item', { label: label });
this.dispatchEvent(new CustomEvent('add-item', { detail: { label }, bubbles: true, composed: true }));
}
}
}
@ -806,6 +816,7 @@ class TpDropdown extends BaseElement {
if (item) {
this.value = item.value;
this.dispatchEvent(new CustomEvent('selection-changed', { detail: this.value, bubbles: true, composed: true }));
}
}