Fix responsive css

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tp/tp-dropdown",
-  "version": "1.2.0",
+  "version": "1.3.1",
   "description": "",
   "main": "tp-dropdown.js",
   "scripts": {

tp-dropdown.js

@@ -214,7 +214,6 @@ class TpDropdown extends BaseElement {
 
           :host(:not([not-responsive])) #itemList {
             max-height: none !important;
-            display: flex;
           }
 
           :host(:not([not-responsive])) #filter {
@@ -349,6 +348,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 +525,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 +682,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 +703,6 @@ class TpDropdown extends BaseElement {
       if (this.isOpen) {
         e.preventDefault();
         this.close();
-        this.focus();
       }
       return;
     }
@@ -782,7 +791,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 +815,7 @@ class TpDropdown extends BaseElement {
 
     if (item) {
       this.value = item.value;
+      this.dispatchEvent(new CustomEvent('selection-changed', { detail: this.value, bubbles: true, composed: true }));
     }
   }