igniteui-angular 13.2.11 → 13.2.14

package/fesm2020/igniteui-angular.mjs

@@ -7,7 +7,7 @@ import { NgModel, FormControlName, NG_VALUE_ACCESSOR, NG_VALIDATORS, CheckboxReq
 import * as i4 from '@angular/common';
 import { isPlatformBrowser, formatDate as formatDate$1, CurrencyPipe, formatPercent, formatNumber, getLocaleCurrencyCode, DatePipe, DOCUMENT, CommonModule, FormatWidth, getLocaleDateFormat, getLocaleNumberFormat, NumberFormatStyle, getCurrencySymbol } from '@angular/common';
 import { Observable, Subject, fromEvent, interval, animationFrameScheduler, noop, merge, Subscription, timer, pipe } from 'rxjs';
-import { takeUntil, filter, first as first$1, throttleTime, take, throttle, debounce, tap, switchMap, skipLast, map, debounceTime, shareReplay, takeWhile, pluck } from 'rxjs/operators';
+import { takeUntil, filter, first as first$1, throttleTime, take, throttle, startWith, debounce, tap, switchMap, skipLast, map, debounceTime, shareReplay, takeWhile, pluck } from 'rxjs/operators';
 import mergeWith from 'lodash.mergewith';
 import * as JSZip from 'jszip';
 import * as i1$1 from '@angular/platform-browser';
@@ -15253,7 +15253,9 @@ class IgxDragDirective {
         }
     }
     get ghostLeft() {
-        return parseInt(this.ghostElement.style.left, 10) + this._ghostHostX;
+        if (this.ghostElement) {
+            return parseInt(this.ghostElement.style.left, 10) + this._ghostHostX;
+        }
     }
     set ghostTop(pageY) {
         if (this.ghostElement) {
@@ -15264,7 +15266,9 @@ class IgxDragDirective {
         }
     }
     get ghostTop() {
-        return parseInt(this.ghostElement.style.top, 10) + this._ghostHostY;
+        if (this.ghostElement) {
+            return parseInt(this.ghostElement.style.top, 10) + this._ghostHostY;
+        }
     }
     get windowScrollTop() {
         return document.documentElement.scrollTop || window.scrollY;
@@ -15827,7 +15831,7 @@ class IgxDragDirective {
         const ghostMarginLeft = parseInt(document.defaultView.getComputedStyle(this.ghostElement)['margin-left'], 10);
         const ghostMarginTop = parseInt(document.defaultView.getComputedStyle(this.ghostElement)['margin-top'], 10);
         this.ghostElement.style.left = (this._ghostStartX - ghostMarginLeft + totalMovedX - this._ghostHostX) + 'px';
-        this.ghostElement.style.top = (this._ghostStartY - ghostMarginTop + totalMovedY - this._ghostHostX) + 'px';
+        this.ghostElement.style.top = (this._ghostStartY - ghostMarginTop + totalMovedY - this._ghostHostY) + 'px';
         if (this.pointerEventsEnabled) {
             // The ghostElement takes control for moving and dragging after it has been rendered.
             if (this._pointerDownId !== null) {
@@ -16014,7 +16018,7 @@ class IgxDragDirective {
         const elementHeight = this.ghost && this.ghostElement ? this.ghostElement.offsetHeight : this.element.nativeElement.offsetHeight;
         const bottomBorder = (!this.scrollContainer ? window.innerHeight : containerBounds.bottom) +
             this.windowScrollTop - this._scrollContainerThreshold - elementHeight;
-        // Same for window scroll left 
+        // Same for window scroll left
         const leftBorder = (!this.scrollContainer ? 0 : containerBounds.left) + this.windowScrollLeft + this._scrollContainerThreshold;
         // Subtract the element width again because we position it from top left corner.
         const elementWidth = this.ghost && this.ghostElement ? this.ghostElement.offsetWidth : this.element.nativeElement.offsetWidth;
@@ -17919,6 +17923,11 @@ let nextId$3 = 0;
 class IgxRadioComponent {
     constructor(cdr) {
         this.cdr = cdr;
+        /**
+         * @hidden
+         * @internal
+         */
+        this.destroy$ = new Subject();
         /**
          * Sets/gets the `id` of the radio component.
          * If not set, the `id` of the first radio component will be `"igx-radio-0"`.
@@ -18092,6 +18101,14 @@ class IgxRadioComponent {
     set disabled(value) {
         this._disabled = (value === '') || value;
     }
+    /**
+     * @hidden
+     * @internal
+     */
+    ngOnDestroy() {
+        this.destroy$.next(true);
+        this.destroy$.complete();
+    }
     /**
     * @hidden
     * @internal
@@ -18391,6 +18408,11 @@ class IgxRadioGroupDirective {
          * @internal
          */
         this.destroy$ = new Subject();
+        /**
+         * @hidden
+         * @internal
+         */
+        this.queryChange$ = new Subject();
     }
     /**
      * Sets/gets the `value` attribute.
@@ -18536,8 +18558,9 @@ class IgxRadioGroupDirective {
         // The initial value can possibly be set by NgModel and it is possible that
         // the OnInit of the NgModel occurs after the OnInit of this class.
         this._isInitialized = true;
-        setTimeout(() => {
-            this._initRadioButtons();
+        this.radioButtons.changes.pipe(startWith(0), takeUntil(this.destroy$)).subscribe(() => {
+            this.queryChange$.next();
+            setTimeout(() => this._initRadioButtons());
         });
     }
     /**
@@ -18615,7 +18638,7 @@ class IgxRadioGroupDirective {
                     button.checked = true;
                     this._selected = button;
                 }
-                button.change.pipe(takeUntil(this.destroy$)).subscribe((ev) => this._selectedRadioButtonChanged(ev));
+                button.change.pipe(takeUntil(button.destroy$), takeUntil(this.destroy$), takeUntil(this.queryChange$)).subscribe((ev) => this._selectedRadioButtonChanged(ev));
             });
         }
     }
@@ -24210,9 +24233,13 @@ class IgxGridSelectionService {
          */
         this.pointerEventInGridBody = false;
         this._ranges = new Set();
-        this.pointerOriginHandler = () => {
+        this.pointerOriginHandler = (event) => {
             this.pointerEventInGridBody = false;
             document.body.removeEventListener('pointerup', this.pointerOriginHandler);
+            const targetTagName = event.target.tagName.toLowerCase();
+            if (targetTagName !== 'igx-grid-cell' && targetTagName !== 'igx-tree-grid-cell') {
+                this.pointerUp(this._lastSelectedNode, this.grid.rangeSelected, true);
+            }
         };
         this.initPointerState();
         this.initKeyboardState();
@@ -24329,6 +24356,7 @@ class IgxGridSelectionService {
      * and the start node of the `state`.
      */
     generateRange(node, state) {
+        this._lastSelectedNode = node;
         if (!state) {
             return {
                 rowStart: node.row,
@@ -24446,8 +24474,8 @@ class IgxGridSelectionService {
         }
         return true;
     }
-    pointerUp(node, emitter) {
-        if (this.dragMode) {
+    pointerUp(node, emitter, firedOutsideGrid) {
+        if (this.dragMode || firedOutsideGrid) {
             this.restoreTextSelection();
             this.addRangeMeta(node, this.pointerState);
             this.mergeMap(this.selection, this.temp);
@@ -37586,7 +37614,12 @@ class IgxSimpleComboComponent extends IgxComboBaseDirective {
                     }
                     return current === this.selection[0];
                 });
-                this.dropdown.navigateItem(index);
+                if (!this.isRemote) {
+                    // navigate to item only if we have local data
+                    // as with remote data this will fiddle with igxFor's scroll handler
+                    // and will trigger another chunk load which will break the visualization
+                    this.dropdown.navigateItem(index);
+                }
             }
         });
         this.dropdown.opening.pipe(takeUntil(this.destroy$)).subscribe(() => {
@@ -38426,6 +38459,7 @@ class IgxDatePickerComponent extends PickerBaseDirective {
         this._onTouchedCallback = noop;
         this._onValidatorChange = noop;
         this.onStatusChanged = () => {
+            this.disabled = this._ngControl.disabled;
             this.updateValidity();
             this.inputGroup.isRequired = this.required;
         };
@@ -42383,7 +42417,8 @@ class IgxTimePickerComponent extends PickerBaseDirective {
     }
     onStatusChanged() {
         if ((this._ngControl.control.touched || this._ngControl.control.dirty) &&
-            (this._ngControl.control.validator || this._ngControl.control.asyncValidator)) {
+            (this._ngControl.control.validator || this._ngControl.control.asyncValidator) &&
+            !this._ngControl.disabled) {
             if (this._inputGroup.isFocused) {
                 this.inputDirective.valid = this._ngControl.valid ? IgxInputState.VALID : IgxInputState.INVALID;
             }
@@ -58614,8 +58649,13 @@ class IgxGridNavigationService {
             if (shouldClearSelection || (this.grid.cellSelection !== GridSelectionMode.multiple)) {
                 this.grid.clearCellSelection();
                 this.grid.navigateTo(this.activeNode.row, this.activeNode.column, (obj) => {
-                    obj.target?.activate(event);
-                    this.grid.cdr.detectChanges();
+                    if (this.activeNode.row === obj.target.row.index) {
+                        obj.target?.activate(event);
+                        this.grid.cdr.detectChanges();
+                    }
+                    else {
+                        this.grid.navigateTo(this.activeNode.row, this.activeNode.column);
+                    }
                 });
             }
             else {
@@ -83898,14 +83938,14 @@ class IgxDateRangePickerComponent extends PickerBaseDirective {
         this.onValidatorChange = noop;
         this.onStatusChanged = () => {
             if (this.inputGroup) {
-                this.inputDirective.valid = this.isTouchedOrDirty
+                this.inputDirective.valid = this.isTouchedOrDirty && !this._ngControl.disabled
                     ? this.getInputState(this.inputGroup.isFocused)
                     : IgxInputState.INITIAL;
             }
             else if (this.hasProjectedInputs) {
                 this.projectedInputs
                     .forEach(i => {
-                    i.inputDirective.valid = this.isTouchedOrDirty
+                    i.inputDirective.valid = this.isTouchedOrDirty && !this._ngControl.disabled
                         ? this.getInputState(i.isFocused)
                         : IgxInputState.INITIAL;
                     ;