igniteui-angular 13.0.11 → 13.0.12

package/fesm2020/igniteui-angular.mjs

@@ -18812,7 +18812,7 @@ class IgxTextSelectionDirective {
      */
     trigger() {
         if (this.selected && this.nativeElement.value.length) {
-            requestAnimationFrame(() => this.nativeElement.setSelectionRange(0, this.nativeElement.value.length));
+            this.nativeElement.select();
         }
     }
 }
@@ -34184,6 +34184,7 @@ class IgxComboBaseDirective extends DisplayDensityBase {
         this._data = [];
         this._value = '';
         this._groupKey = '';
+        this._searchValue = '';
         this._filteredData = [];
         this._remoteSelection = {};
         this._valid = IgxComboState.INITIAL;
@@ -34193,7 +34194,6 @@ class IgxComboBaseDirective extends DisplayDensityBase {
         this._onChangeCallback = noop;
         this._type = null;
         this._dataType = '';
-        this._searchValue = '';
         this._itemHeight = null;
         this._itemsMaxHeight = null;
         this._groupSortingDirection = SortingDirection.Asc;
@@ -35729,9 +35729,12 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
         /** @hidden @internal */
         this.composing = false;
         this._updateInput = true;
+        // stores the last filtered value - move to common?
+        this._internalFilter = '';
         this.findMatch = (element) => {
             const value = this.displayKey ? element[this.displayKey] : element;
-            return value.toString().toLowerCase().includes(this.searchValue.trim().toLowerCase());
+            const searchValue = this.searchValue || this.comboInput.value;
+            return !!searchValue && value.toString().toLowerCase().includes(searchValue.trim().toLowerCase());
         };
         this.comboAPI.register(this);
     }
@@ -35745,6 +35748,16 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
         this.checkMatch();
     }
     /** @hidden @internal */
+    get searchValue() {
+        return this._searchValue;
+    }
+    set searchValue(val) {
+        this._searchValue = val;
+    }
+    get selectedItem() {
+        return this.selectionService.get(this.id).values().next().value;
+    }
+    /** @hidden @internal */
     onArrowDown(event) {
         if (this.collapsed) {
             event.preventDefault();
@@ -35807,6 +35820,15 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
                 this.dropdown.navigateItem(index);
             }
         });
+        this.dropdown.opening.pipe(takeUntil(this.destroy$)).subscribe(() => {
+            const filtered = this.filteredData.find(this.findMatch);
+            if (filtered === undefined || filtered === null) {
+                this.filterValue = this.searchValue = this.comboInput.value;
+                return;
+            }
+            this._internalFilter = this.filterValue;
+            this.filterValue = this.searchValue = '';
+        });
         this.dropdown.opened.pipe(takeUntil(this.destroy$)).subscribe(() => {
             if (this.composing) {
                 this.comboInput.focus();
@@ -35821,23 +35843,29 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
                 this._onTouchedCallback();
             }
         });
+        this.dropdown.closed.pipe(takeUntil(this.destroy$)).subscribe(() => {
+            this.filterValue = this._internalFilter = this.comboInput.value;
+        });
         super.ngAfterViewInit();
     }
     /** @hidden @internal */
     handleInputChange(event) {
         if (event !== undefined) {
-            this.searchValue = typeof event === 'string' ? event : event.target.value;
+            this.filterValue = this._internalFilter = this.searchValue = typeof event === 'string' ? event : event.target.value;
         }
         this._onChangeCallback(this.searchValue);
         if (this.collapsed && this.comboInput.focused) {
             this.open();
-            this.dropdown.navigateFirst();
         }
         if (!this.comboInput.value.trim()) {
             // handle clearing of input by space
             this.clearSelection();
             this._onChangeCallback(null);
         }
+        // when filtering the focused item should be the first item or the currently selected item
+        if (!this.dropdown.focusedItem || this.dropdown.focusedItem.id !== this.dropdown.items[0].id) {
+            this.dropdown.navigateFirst();
+        }
         super.handleInputChange(event);
         this.composing = true;
     }
@@ -35854,15 +35882,15 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
             this.close();
             // manually trigger text selection as it will not be triggered during editing
             this.textSelection.trigger();
+            this.filterValue = this.getElementVal(filtered);
             return;
         }
         if (event.key === this.platformUtil.KEYMAP.BACKSPACE
             || event.key === this.platformUtil.KEYMAP.DELETE) {
             this._updateInput = false;
-            this.clearSelection();
+            this.clearSelection(true);
         }
         if (!this.collapsed && event.key === this.platformUtil.KEYMAP.TAB) {
-            this.close();
             this.clearOnBlur();
         }
         this.composing = false;
@@ -36007,10 +36035,26 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
     }
     clearOnBlur() {
         const filtered = this.filteredData.find(this.findMatch);
-        if ((filtered === undefined || filtered === null)) {
+        if (filtered === undefined || filtered === null || !this.selectedItem) {
+            this.clearAndClose();
+            return;
+        }
+        if (this.isPartialMatch(filtered) || this.selectedItem !== this._internalFilter) {
+            this.clearAndClose();
+        }
+    }
+    isPartialMatch(filtered) {
+        return !!this._internalFilter && this._internalFilter.length !== this.getElementVal(filtered).length;
+    }
+    getElementVal(element) {
+        return this.displayKey ? element[this.displayKey] : element;
+    }
+    clearAndClose() {
+        this.clearSelection(true);
+        this._internalFilter = '';
+        this.searchValue = '';
+        if (!this.collapsed) {
             this.close();
-            this.clearSelection();
-            this.searchValue = '';
         }
     }
 }