Merge pull request #39 from Travelopia/fix/multi-select-input-search

Fix Multi-Select

Author: junaid-travelopia

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@travelopia/web-components",
-  "version": "0.5.17",
+  "version": "0.5.18",
   "description": "Accessible web components for the modern web",
   "files": [
     "dist"

src/multi-select/tp-multi-select-pill.ts

@@ -13,16 +13,24 @@ export class TPMultiSelectPillElement extends HTMLElement {
 	connectedCallback(): void {
 		this.querySelector( 'button' )?.addEventListener( 'click', this.handleButtonClick.bind( this ) );
 	}
-
 	/**
 	 * Handle button click.
 	 *
-	 * @param {Event} e Click event.
+	 * @param {any} e Click event.
 	 */
-	handleButtonClick( e: Event | null ): void {
+	handleButtonClick( e: any | null ): void {
 		e?.preventDefault();
 		e?.stopPropagation();
-		this.removePill();
+
+		/**
+		 * If the event is has a pointerType, which means it's a mouse event or touch event
+		 * Only then we remove pill.
+		 * This will ensure, it will not get fired when a enter button is pressed.
+		 * We do this so that it does not remove the pills when enter button is pressed.
+		 */
+		if ( e?.pointerType ) {
+			this.removePill();
+		}
 	}
 
 	/**