igniteui-angular 20.0.4 → 20.0.5

package/fesm2022/igniteui-angular.mjs

@@ -1,10 +1,10 @@
 import * as i0 from '@angular/core';
-import { Injectable, HostListener, Input, Directive, EventEmitter, InjectionToken, isDevMode, inject, PLATFORM_ID, Inject, ElementRef, ViewContainerRef, createComponent, DOCUMENT, HostBinding, Output, Self, Optional, booleanAttribute, SecurityContext, DestroyRef, Component, ContentChild, ContentChildren, RendererStyleFlags2, Pipe, ViewChild, contentChildren, QueryList, signal, effect, LOCALE_ID, forwardRef, Host, ViewChildren, TemplateRef, ChangeDetectionStrategy, SimpleChange, ChangeDetectorRef, NgZone, SkipSelf, CUSTOM_ELEMENTS_SCHEMA, reflectComponentType, NgModule } from '@angular/core';
+import { Injectable, HostListener, Input, Directive, EventEmitter, InjectionToken, isDevMode, inject, PLATFORM_ID, Inject, ElementRef, ViewContainerRef, createComponent, DOCUMENT, HostBinding, Output, Self, Optional, booleanAttribute, SecurityContext, DestroyRef, Component, ContentChild, ContentChildren, RendererStyleFlags2, Pipe, ViewChild, Renderer2, NgZone, contentChildren, QueryList, signal, effect, LOCALE_ID, forwardRef, Host, ViewChildren, TemplateRef, ChangeDetectionStrategy, SimpleChange, ChangeDetectorRef, SkipSelf, CUSTOM_ELEMENTS_SCHEMA, reflectComponentType, NgModule } from '@angular/core';
 import * as i4 from '@angular/forms';
 import { NgModel, NgControl, FormControlName, NG_VALUE_ACCESSOR, Validators, NG_VALIDATORS, FormGroup, FormsModule, RequiredValidator, MinValidator, MaxValidator, EmailValidator, MinLengthValidator, MaxLengthValidator, PatternValidator, FormControl, ReactiveFormsModule } from '@angular/forms';
 import { Observable, NEVER, Subject, fromEvent, BehaviorSubject, interval, animationFrameScheduler, noop, takeUntil as takeUntil$1, merge, Subscription, timer, sampleTime, filter as filter$1, pipe, take as take$1 } from 'rxjs';
 import { takeUntil, filter, throttle, throttleTime, first as first$2, take, debounce, tap, switchMap, skipLast, debounceTime, map, shareReplay, takeWhile, timeout, pluck } from 'rxjs/operators';
-import { isPlatformBrowser, formatDate as formatDate$1, CurrencyPipe, FormatWidth, getLocaleDateFormat, formatPercent, formatNumber, getLocaleCurrencyCode, DatePipe, getLocaleDateTimeFormat, NgTemplateOutlet, NgClass, TitleCasePipe, getLocaleFirstDayOfWeek, NgStyle, getLocaleCurrencySymbol, formatCurrency as formatCurrency$1, getLocaleNumberFormat, NumberFormatStyle, DecimalPipe, PercentPipe, getCurrencySymbol, AsyncPipe } from '@angular/common';
+import { isPlatformBrowser, formatDate as formatDate$1, CurrencyPipe, FormatWidth, getLocaleDateFormat, formatPercent, formatNumber, getLocaleCurrencyCode, DatePipe, getLocaleDateTimeFormat, NgTemplateOutlet, NgClass, DOCUMENT as DOCUMENT$1, TitleCasePipe, getLocaleFirstDayOfWeek, NgStyle, getLocaleCurrencySymbol, formatCurrency as formatCurrency$1, getLocaleNumberFormat, NumberFormatStyle, DecimalPipe, PercentPipe, getCurrencySymbol, AsyncPipe } from '@angular/common';
 import { mergeWith, isEqual as isEqual$1 } from 'lodash-es';
 import { strToU8, zip } from 'fflate';
 import { scaleOutVerTop, scaleInVerTop, AnimationUtil, fadeOut, fadeIn, slideOutTop, slideInTop, slideOutBottom, slideInBottom, scaleOutHorRight, scaleInHorRight, scaleOutHorLeft, scaleInHorLeft, scaleOutVerBottom, scaleInVerBottom, scaleInCenter, growVerOut, growVerIn, slideInLeft } from 'igniteui-angular/animations';
@@ -15585,6 +15585,9 @@ class VirtualHelperBaseDirective {
         this.destroy$ = new Subject();
         this._afterViewInit = false;
         this._detached = false;
+        this.renderer = inject(Renderer2);
+        this.platformId = inject(PLATFORM_ID);
+        this.ngZone = inject(NgZone);
         this._scrollNativeSize = this.calculateScrollNativeSize();
     }
     onScroll(event) {
@@ -15640,6 +15643,30 @@ class VirtualHelperBaseDirective {
     get isAttachedToDom() {
         return this.document.body.contains(this.nativeElement);
     }
+    toggleClass(element, className, shouldHaveClass) {
+        if (shouldHaveClass) {
+            this.renderer.addClass(element, className);
+        }
+        else {
+            this.renderer.removeClass(element, className);
+        }
+    }
+    updateScrollbarClass() {
+        if (!isPlatformBrowser(this.platformId)) {
+            return;
+        }
+        this.ngZone.runOutsideAngular(() => {
+            requestAnimationFrame(() => {
+                const el = this.nativeElement;
+                const hasScrollbar = el.scrollHeight > el.clientHeight;
+                const prevSibling = el.previousElementSibling;
+                const scrollbarClass = 'igx-display-container--scrollbar';
+                if (prevSibling?.tagName.toLowerCase() === 'igx-display-container') {
+                    this.toggleClass(prevSibling, scrollbarClass, hasScrollbar);
+                }
+            });
+        });
+    }
     handleMutations(event) {
         const hasSize = !(event[0].contentRect.height === 0 && event[0].contentRect.width === 0);
         if (!hasSize && !this.isAttachedToDom) {
@@ -15650,9 +15677,10 @@ class VirtualHelperBaseDirective {
             // attached back now.
             this.restoreScroll();
         }
+        this.updateScrollbarClass();
     }
     restoreScroll() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: VirtualHelperBaseDirective, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: DOCUMENT }, { token: PlatformUtil }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: VirtualHelperBaseDirective, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: DOCUMENT$1 }, { token: PlatformUtil }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.0", type: VirtualHelperBaseDirective, isStandalone: true, selector: "[igxVirtualHelperBase]", host: { listeners: { "scroll": "onScroll($event)" } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: VirtualHelperBaseDirective, decorators: [{
@@ -15663,7 +15691,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [DOCUMENT]
+                    args: [DOCUMENT$1]
                 }] }, { type: PlatformUtil }], propDecorators: { onScroll: [{
                 type: HostListener,
                 args: ['scroll', ['$event']]
@@ -15680,7 +15708,7 @@ class HVirtualHelperComponent extends VirtualHelperBaseDirective {
     restoreScroll() {
         this.nativeElement.scrollLeft = this.scrollAmount;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: HVirtualHelperComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: DOCUMENT }, { token: PlatformUtil }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: HVirtualHelperComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: DOCUMENT$1 }, { token: PlatformUtil }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.0", type: HVirtualHelperComponent, isStandalone: true, selector: "igx-horizontal-virtual-helper", inputs: { width: "width" }, host: { properties: { "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "_vcr", first: true, predicate: ["horizontal_container"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: '<div #horizontal_container class="igx-vhelper__placeholder-content" [style.width.px]="size"></div>', isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: HVirtualHelperComponent, decorators: [{
@@ -15692,7 +15720,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [DOCUMENT]
+                    args: [DOCUMENT$1]
                 }] }, { type: PlatformUtil }], propDecorators: { _vcr: [{
                 type: ViewChild,
                 args: ['horizontal_container', { read: ViewContainerRef, static: true }]
@@ -15715,7 +15743,7 @@ class VirtualHelperComponent extends VirtualHelperBaseDirective {
     restoreScroll() {
         this.nativeElement.scrollTop = this.scrollAmount;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: VirtualHelperComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: DOCUMENT }, { token: PlatformUtil }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: VirtualHelperComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: DOCUMENT$1 }, { token: PlatformUtil }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.0", type: VirtualHelperComponent, isStandalone: true, selector: "igx-virtual-helper", inputs: { itemsLength: "itemsLength" }, host: { properties: { "scrollTop": "this.scrollTop", "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "_vcr", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: '<div #container class="igx-vhelper__placeholder-content" [style.height.px]="size"></div>', isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: VirtualHelperComponent, decorators: [{
@@ -15727,7 +15755,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
                     type: Inject,
-                    args: [DOCUMENT]
+                    args: [DOCUMENT$1]
                 }] }, { type: PlatformUtil }], propDecorators: { scrollTop: [{
                 type: HostBinding,
                 args: ['scrollTop']
@@ -47160,19 +47188,20 @@ class IgxSelectComponent extends IgxDropDownComponent {
     }
     manageRequiredAsterisk() {
         const hasRequiredHTMLAttribute = this.elementRef.nativeElement.hasAttribute('required');
+        let isRequired = false;
         if (this.ngControl && this.ngControl.control.validator) {
-            // Run the validation with empty object to check if required is enabled.
             const error = this.ngControl.control.validator({});
-            this.inputGroup.isRequired = error && error.required;
-            this.cdr.markForCheck();
-            // If validator is dynamically cleared and no required HTML attribute is set,
-            // reset label's required class(asterisk) and IgxInputState #6896
+            isRequired = !!(error && error.required);
+        }
+        this.inputGroup.isRequired = isRequired;
+        if (this.input?.nativeElement) {
+            this.input.nativeElement.setAttribute('aria-required', isRequired.toString());
         }
-        else if (this.inputGroup.isRequired && this.ngControl && !this.ngControl.control.validator && !hasRequiredHTMLAttribute) {
+        // Handle validator removal case
+        if (!isRequired && !hasRequiredHTMLAttribute) {
             this.input.valid = IgxInputState.INITIAL;
-            this.inputGroup.isRequired = false;
-            this.cdr.markForCheck();
         }
+        this.cdr.markForCheck();
     }
     setSelection(item) {
         if (item && item.value !== undefined && item.value !== null) {
@@ -68397,7 +68426,7 @@ class IgxGridBaseDirective {
         let sum = 0;
         for (const col of fc) {
             if (col.level === 0) {
-                sum += parseInt(col.calcWidth, 10);
+                sum += parseFloat(col.calcWidth);
             }
         }
         if (this.isPinningToStart) {
@@ -69067,7 +69096,7 @@ class IgxGridBaseDirective {
      * @hidden @internal
      */
     hasHorizontalScroll() {
-        return this.totalWidth - this.unpinnedWidth > 0 && this.width !== null;
+        return Math.round(this.totalWidth - this.unpinnedWidth) > 0 && this.width !== null;
     }
     /**
      * @hidden @internal
@@ -69103,6 +69132,9 @@ class IgxGridBaseDirective {
     // TODO: do not remove this, as it is used in rowEditTemplate, but mark is as internal and hidden
     /* blazorCSSuppress */
     endEdit(commit = true, event) {
+        if (!this.crudService.cellInEditMode && !this.crudService.rowInEditMode) {
+            return;
+        }
         const document = this.nativeElement?.getRootNode();
         const focusWithin = this.nativeElement?.contains(document.activeElement);
         const success = this.crudService.endEdit(commit, event);
@@ -73427,6 +73459,10 @@ class IgxGridCellComponent {
                 this.highlight.lastSearchInfo.caseSensitive = this.grid.lastSearchInfo.caseSensitive;
                 this.highlight.lastSearchInfo.exactMatch = this.grid.lastSearchInfo.exactMatch;
             }
+            const isInEdit = this.grid.rowEditable ? this.row.inEditMode : this.editMode;
+            if (this.formControl && this.formControl.value !== changes.value.currentValue && !isInEdit) {
+                this.formControl.setValue(changes.value.currentValue);
+            }
         }
     }
     /**
@@ -77687,8 +77723,8 @@ class IgxPivotRowComponent extends IgxRowDirective {
             keyValueMap.set(dim.memberName, path.shift());
         }
         let pivotValue;
-        if (this.grid.hasMultipleValues) {
-            pivotValue = this.grid.values.find(x => x.member === path.shift());
+        if (this.grid.hasMultipleValues && path.length) {
+            pivotValue = this.grid.values.find(x => x.member === path[0]);
         }
         else {
             pivotValue = this.grid.values ? this.grid.values[0] : undefined;
@@ -87672,7 +87708,9 @@ class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirective {
                 }
             ];
             entities[0].childEntities = this.childLayoutList.reduce((acc, rowIsland) => {
-                return acc.concat(this.generateChildEntity(rowIsland, this.data[0][rowIsland.key][0]));
+                const childFirstRowData = this.data?.length > 0 && this.data[0][rowIsland.key]?.length > 0 ?
+                    this.data[0][rowIsland.key][0] : null;
+                return acc.concat(this.generateChildEntity(rowIsland, childFirstRowData));
             }, []);
         }
         return entities;
@@ -87701,7 +87739,9 @@ class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirective {
             if (!firstRowData) {
                 return null;
             }
-            return acc.concat(this.generateChildEntity(childRowIsland, firstRowData[childRowIsland.key][0]));
+            const childFirstRowData = firstRowData.length > 0 && firstRowData[childRowIsland.key]?.length > 0 ?
+                firstRowData[childRowIsland.key][0] : null;
+            return acc.concat(this.generateChildEntity(childRowIsland, childFirstRowData));
         }, []);
         if (rowIslandChildEntities?.length > 0) {
             childEntities = rowIslandChildEntities;