igniteui-angular 21.0.0-beta.0 → 21.0.0-beta.2

package/fesm2022/igniteui-angular-carousel.mjs

@@ -181,18 +181,18 @@ class IgxCarouselComponentBase {
         });
         this.leaveAnimationPlayer.play();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselComponentBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: IgxCarouselComponentBase, isStandalone: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselComponentBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: IgxCarouselComponentBase, isStandalone: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselComponentBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselComponentBase, decorators: [{
             type: Directive
         }] });
 
 class IgxCarouselIndicatorDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselIndicatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: IgxCarouselIndicatorDirective, isStandalone: true, selector: "[igxCarouselIndicator]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselIndicatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: IgxCarouselIndicatorDirective, isStandalone: true, selector: "[igxCarouselIndicator]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselIndicatorDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselIndicatorDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxCarouselIndicator]',
@@ -200,10 +200,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
                 }]
         }] });
 class IgxCarouselNextButtonDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselNextButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: IgxCarouselNextButtonDirective, isStandalone: true, selector: "[igxCarouselNextButton]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselNextButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: IgxCarouselNextButtonDirective, isStandalone: true, selector: "[igxCarouselNextButton]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselNextButtonDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselNextButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxCarouselNextButton]',
@@ -211,10 +211,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
                 }]
         }] });
 class IgxCarouselPrevButtonDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselPrevButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: IgxCarouselPrevButtonDirective, isStandalone: true, selector: "[igxCarouselPrevButton]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselPrevButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: IgxCarouselPrevButtonDirective, isStandalone: true, selector: "[igxCarouselPrevButton]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselPrevButtonDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselPrevButtonDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxCarouselPrevButton]',
@@ -325,10 +325,10 @@ class IgxSlideComponent {
         this._destroy$.next(true);
         this._destroy$.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxSlideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.0.0", type: IgxSlideComponent, isStandalone: true, selector: "igx-slide", inputs: { index: "index", direction: "direction", total: "total", active: ["active", "active", booleanAttribute], previous: ["previous", "previous", booleanAttribute] }, outputs: { activeChange: "activeChange" }, host: { properties: { "attr.tabindex": "this.tabIndex", "attr.id": "this.id", "attr.role": "this.tab", "attr.aria-labelledby": "this.ariaLabelledBy", "class.igx-slide": "this.cssClass", "class.igx-slide--current": "this.active", "class.igx-slide--previous": "this.previous" } }, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxSlideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.0.2", type: IgxSlideComponent, isStandalone: true, selector: "igx-slide", inputs: { index: "index", direction: "direction", total: "total", active: ["active", "active", booleanAttribute], previous: ["previous", "previous", booleanAttribute] }, outputs: { activeChange: "activeChange" }, host: { properties: { "attr.tabindex": "this.tabIndex", "attr.id": "this.id", "attr.role": "this.tab", "attr.aria-labelledby": "this.ariaLabelledBy", "class.igx-slide": "this.cssClass", "class.igx-slide--current": "this.active", "class.igx-slide--previous": "this.previous" } }, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxSlideComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxSlideComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-slide', standalone: true, template: "<ng-content></ng-content>\n" }]
         }], propDecorators: { index: [{
@@ -376,10 +376,10 @@ class CarouselHammerConfig extends HammerGestureConfig {
             pan: { direction: HammerGesturesManager.Hammer?.DIRECTION_HORIZONTAL }
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: CarouselHammerConfig, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: CarouselHammerConfig }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: CarouselHammerConfig, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: CarouselHammerConfig }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: CarouselHammerConfig, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: CarouselHammerConfig, decorators: [{
             type: Injectable
         }] });
 /**
@@ -1258,15 +1258,15 @@ class IgxCarouselComponent extends IgxCarouselComponentBase {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxCarouselComponent, isStandalone: true, selector: "igx-carousel", inputs: { id: "id", loop: ["loop", "loop", booleanAttribute], pause: ["pause", "pause", booleanAttribute], navigation: ["navigation", "navigation", booleanAttribute], indicators: ["indicators", "indicators", booleanAttribute], vertical: ["vertical", "vertical", booleanAttribute], gesturesSupport: ["gesturesSupport", "gesturesSupport", booleanAttribute], maximumIndicatorsCount: "maximumIndicatorsCount", indicatorsOrientation: "indicatorsOrientation", animationType: "animationType", resourceStrings: "resourceStrings", interval: "interval" }, outputs: { slideChanged: "slideChanged", slideAdded: "slideAdded", slideRemoved: "slideRemoved", carouselPaused: "carouselPaused", carouselPlaying: "carouselPlaying" }, host: { listeners: { "tap": "onTap($event)", "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "panleft": "onPanLeft($event)", "panright": "onPanRight($event)", "panup": "onPanUp($event)", "pandown": "onPanDown($event)", "panend": "onPanEnd($event)" }, properties: { "attr.id": "this.id", "attr.role": "this.role", "attr.aria-roledescription": "this.roleDescription", "attr.aria-labelledby": "this.labelId", "class.igx-carousel--vertical": "this.isVertical", "class.igx-carousel": "this.cssClass", "style.touch-action": "this.touchAction" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxCarouselComponent, isStandalone: true, selector: "igx-carousel", inputs: { id: "id", loop: ["loop", "loop", booleanAttribute], pause: ["pause", "pause", booleanAttribute], navigation: ["navigation", "navigation", booleanAttribute], indicators: ["indicators", "indicators", booleanAttribute], vertical: ["vertical", "vertical", booleanAttribute], gesturesSupport: ["gesturesSupport", "gesturesSupport", booleanAttribute], maximumIndicatorsCount: "maximumIndicatorsCount", indicatorsOrientation: "indicatorsOrientation", animationType: "animationType", resourceStrings: "resourceStrings", interval: "interval" }, outputs: { slideChanged: "slideChanged", slideAdded: "slideAdded", slideRemoved: "slideRemoved", carouselPaused: "carouselPaused", carouselPlaying: "carouselPlaying" }, host: { listeners: { "tap": "onTap($event)", "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "panleft": "onPanLeft($event)", "panright": "onPanRight($event)", "panup": "onPanUp($event)", "pandown": "onPanDown($event)", "panend": "onPanEnd($event)" }, properties: { "attr.id": "this.id", "attr.role": "this.role", "attr.aria-roledescription": "this.roleDescription", "attr.aria-labelledby": "this.labelId", "class.igx-carousel--vertical": "this.isVertical", "class.igx-carousel": "this.cssClass", "style.touch-action": "this.touchAction" } }, providers: [
             {
                 provide: HAMMER_GESTURE_CONFIG,
                 useClass: CarouselHammerConfig
             }
         ], queries: [{ propertyName: "indicatorTemplate", first: true, predicate: IgxCarouselIndicatorDirective, descendants: true, read: TemplateRef }, { propertyName: "nextButtonTemplate", first: true, predicate: IgxCarouselNextButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "prevButtonTemplate", first: true, predicate: IgxCarouselPrevButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "slides", predicate: IgxSlideComponent }], viewQueries: [{ propertyName: "defaultIndicator", first: true, predicate: ["defaultIndicator"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultNextButton", first: true, predicate: ["defaultNextButton"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultPrevButton", first: true, predicate: ["defaultPrevButton"], descendants: true, read: TemplateRef, static: true }, { propertyName: "_indicators", predicate: ["indicators"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #defaultIndicator let-slide>\n    <div class=\"igx-nav-dot\"\n        [class.igx-nav-dot--active]=\"slide.active\">\n    </div>\n</ng-template>\n\n<ng-template #defaultNextButton>\n    <igx-icon aria-hidden=\"true\" family=\"default\" name=\"carousel_next\"\n        class=\"igx-nav-arrow\">\n    </igx-icon>\n</ng-template>\n\n<ng-template #defaultPrevButton>\n    <igx-icon aria-hidden=\"true\" family=\"default\" name=\"carousel_prev\"\n        class=\"igx-nav-arrow\">\n    </igx-icon>\n</ng-template>\n\n@if (navigation && slides.length) {\n    <button\n        igxButton\n        class=\"igx-carousel__arrow--prev\"\n        [attr.aria-label]=\"resourceStrings.igx_carousel_previous_slide\"\n        [disabled]=\"prevButtonDisabled\"\n        (click)=\"prev()\"\n        (keydown)=\"handleKeydownPrev($event)\">\n        <ng-container *ngTemplateOutlet=\"getPrevButtonTemplate; context: {$implicit: prevButtonDisabled};\"></ng-container>\n    </button>\n}\n\n@if (navigation && slides.length) {\n    <button\n        igxButton\n        class=\"igx-carousel__arrow--next\"\n        [attr.aria-label]=\"resourceStrings.igx_carousel_next_slide\"\n        [disabled]=\"nextButtonDisabled\"\n        (click)=\"next()\"\n        (keydown)=\"handleKeydownNext($event)\">\n        <ng-container *ngTemplateOutlet=\"getNextButtonTemplate; context: {$implicit: nextButtonDisabled};\"></ng-container>\n    </button>\n}\n\n@if (showIndicators) {\n    <div [ngClass]=\"indicatorsClass\" [attr.role]=\"'tablist'\" (keyup)=\"handleKeyUp($event)\" (focusout)=\"handleFocusOut($event)\" (click)=\"handleClick()\" (keydown)=\"handleKeydown($event)\">\n        @for (slide of slides; track slide) {\n            <div #indicators\n                class=\"igx-carousel-indicators__indicator\"\n                (click)=\"select(slide)\"\n                [id]=\"'tab-'+ slide.index + '-' + total\"\n                [attr.role]=\"'tab'\"\n                [attr.tabindex]=\"slide.active ? 0 : -1\"\n                [attr.aria-label]=\"resourceStrings.igx_carousel_slide + ' ' + (slide.index + 1) + ' ' + resourceStrings.igx_carousel_of + ' ' + this.total\"\n                [attr.aria-controls]=\"'panel-' + slide.index\"\n                [attr.aria-selected]=\"slide.active\">\n                <ng-container *ngTemplateOutlet=\"getIndicatorTemplate; context: {$implicit: slide};\"></ng-container>\n            </div>\n        }\n    </div>\n}\n\n@if (showIndicatorsLabel) {\n    <div [ngClass]=\"indicatorsClass\" class=\"igx-carousel-label-indicator\">\n        <span [id]=\"labelId\" class=\"igx-carousel__label\">{{getCarouselLabel}}</span>\n    </div>\n}\n\n<div class=\"igx-carousel__inner\" [attr.aria-live]=\"!interval || stoppedByInteraction ? 'polite' : 'off'\">\n    <ng-content></ng-content>\n</div>\n", styles: [":host{display:block;outline-style:none}\n"], dependencies: [{ kind: "directive", type: IgxButtonDirective, selector: "[igxButton]", inputs: ["selected", "igxButton", "igxLabel"], outputs: ["buttonSelected"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselComponent, decorators: [{
             type: Component,
             args: [{ providers: [
                         {
@@ -1399,11 +1399,11 @@ const IGX_CAROUSEL_DIRECTIVES = [
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
  */
 class IgxCarouselModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselModule, imports: [IgxCarouselComponent, IgxSlideComponent, IgxCarouselIndicatorDirective, IgxCarouselNextButtonDirective, IgxCarouselPrevButtonDirective], exports: [IgxCarouselComponent, IgxSlideComponent, IgxCarouselIndicatorDirective, IgxCarouselNextButtonDirective, IgxCarouselPrevButtonDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselModule, imports: [IgxCarouselComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselModule, imports: [IgxCarouselComponent, IgxSlideComponent, IgxCarouselIndicatorDirective, IgxCarouselNextButtonDirective, IgxCarouselPrevButtonDirective], exports: [IgxCarouselComponent, IgxSlideComponent, IgxCarouselIndicatorDirective, IgxCarouselNextButtonDirective, IgxCarouselPrevButtonDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselModule, imports: [IgxCarouselComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCarouselModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCarouselModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/igniteui-angular-chat-extras.mjs

@@ -53,10 +53,10 @@ class IgxChatMarkdownService {
         await this._isInitialized;
         return await this._instance.parse(text);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatMarkdownService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatMarkdownService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatMarkdownService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatMarkdownService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatMarkdownService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatMarkdownService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
@@ -69,10 +69,10 @@ class MarkdownPipe {
     async transform(text) {
         return this._sanitizer.bypassSecurityTrustHtml(DOMPurify.sanitize(await this._service.parse(text ?? '')));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: MarkdownPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: MarkdownPipe, isStandalone: true, name: "fromMarkdown" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MarkdownPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: MarkdownPipe, isStandalone: true, name: "fromMarkdown" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: MarkdownPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: MarkdownPipe, decorators: [{
             type: Pipe,
             args: [{ name: 'fromMarkdown' }]
         }] });

package/fesm2022/igniteui-angular-chat.mjs

@@ -40,7 +40,7 @@ class IgxChatComponent {
         this._view = inject(ViewContainerRef);
         this._templateViewRefs = new Map();
         this._oldTemplates = {};
-        this._transformedTemplates = signal({}, ...(ngDevMode ? [{ debugName: "_transformedTemplates" }] : []));
+        this._transformedTemplates = signal({}, { ...(ngDevMode ? { debugName: "_transformedTemplates" } : {}) });
         this._mergedOptions = computed(() => {
             const options = this.options();
             const transformedTemplates = this._transformedTemplates();
@@ -48,17 +48,17 @@ class IgxChatComponent {
                 ...options,
                 renderers: transformedTemplates
             };
-        }, ...(ngDevMode ? [{ debugName: "_mergedOptions" }] : []));
+        }, { ...(ngDevMode ? { debugName: "_mergedOptions" } : {}) });
         //#endregion
         //#region Inputs
         /** Array of chat messages to display */
-        this.messages = input([], ...(ngDevMode ? [{ debugName: "messages" }] : []));
+        this.messages = input([], { ...(ngDevMode ? { debugName: "messages" } : {}) });
         /** Draft message with text and optional attachments */
-        this.draftMessage = input({ text: '' }, ...(ngDevMode ? [{ debugName: "draftMessage" }] : []));
+        this.draftMessage = input({ text: '' }, { ...(ngDevMode ? { debugName: "draftMessage" } : {}) });
         /** Configuration options for the chat component */
-        this.options = input({}, ...(ngDevMode ? [{ debugName: "options" }] : []));
+        this.options = input({}, { ...(ngDevMode ? { debugName: "options" } : {}) });
         /** Custom templates for rendering chat elements */
-        this.templates = input({}, ...(ngDevMode ? [{ debugName: "templates" }] : []));
+        this.templates = input({}, { ...(ngDevMode ? { debugName: "templates" } : {}) });
         //#endregion
         //#region Outputs
         /** Emitted when a new message is created */
@@ -139,10 +139,10 @@ class IgxChatComponent {
             return viewRef.rootNodes;
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.0", type: IgxChatComponent, isStandalone: true, selector: "igx-chat", inputs: { messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, draftMessage: { classPropertyName: "draftMessage", publicName: "draftMessage", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { messageCreated: "messageCreated", messageReact: "messageReact", attachmentClick: "attachmentClick", attachmentDrag: "attachmentDrag", attachmentDrop: "attachmentDrop", typingChange: "typingChange", inputFocus: "inputFocus", inputBlur: "inputBlur", inputChange: "inputChange" }, ngImport: i0, template: "<igc-chat\n  [messages]=\"messages()\"\n  [draftMessage]=\"draftMessage()\"\n  [options]=\"_mergedOptions()\"\n  (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n  (igcMessageReact)=\"messageReact.emit($event.detail)\"\n  (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n  (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n  (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n  (igcTypingChange)=\"typingChange.emit($event.detail)\"\n  (igcInputFocus)=\"inputFocus.emit()\"\n  (igcInputBlur)=\"inputBlur.emit()\"\n  (igcInputChange)=\"inputChange.emit($event.detail)\"\n>\n    <ng-content></ng-content>\n</igc-chat>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.2", type: IgxChatComponent, isStandalone: true, selector: "igx-chat", inputs: { messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, draftMessage: { classPropertyName: "draftMessage", publicName: "draftMessage", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { messageCreated: "messageCreated", messageReact: "messageReact", attachmentClick: "attachmentClick", attachmentDrag: "attachmentDrag", attachmentDrop: "attachmentDrop", typingChange: "typingChange", inputFocus: "inputFocus", inputBlur: "inputBlur", inputChange: "inputChange" }, ngImport: i0, template: "<igc-chat\n  [messages]=\"messages()\"\n  [draftMessage]=\"draftMessage()\"\n  [options]=\"_mergedOptions()\"\n  (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n  (igcMessageReact)=\"messageReact.emit($event.detail)\"\n  (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n  (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n  (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n  (igcTypingChange)=\"typingChange.emit($event.detail)\"\n  (igcInputFocus)=\"inputFocus.emit()\"\n  (igcInputBlur)=\"inputBlur.emit()\"\n  (igcInputChange)=\"inputChange.emit($event.detail)\"\n>\n    <ng-content></ng-content>\n</igc-chat>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-chat', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<igc-chat\n  [messages]=\"messages()\"\n  [draftMessage]=\"draftMessage()\"\n  [options]=\"_mergedOptions()\"\n  (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n  (igcMessageReact)=\"messageReact.emit($event.detail)\"\n  (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n  (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n  (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n  (igcTypingChange)=\"typingChange.emit($event.detail)\"\n  (igcInputFocus)=\"inputFocus.emit()\"\n  (igcInputBlur)=\"inputBlur.emit()\"\n  (igcInputChange)=\"inputChange.emit($event.detail)\"\n>\n    <ng-content></ng-content>\n</igc-chat>\n" }]
         }], ctorParameters: () => [], propDecorators: { messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], draftMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "draftMessage", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], templates: [{ type: i0.Input, args: [{ isSignal: true, alias: "templates", required: false }] }], messageCreated: [{ type: i0.Output, args: ["messageCreated"] }], messageReact: [{ type: i0.Output, args: ["messageReact"] }], attachmentClick: [{ type: i0.Output, args: ["attachmentClick"] }], attachmentDrag: [{ type: i0.Output, args: ["attachmentDrag"] }], attachmentDrop: [{ type: i0.Output, args: ["attachmentDrop"] }], typingChange: [{ type: i0.Output, args: ["typingChange"] }], inputFocus: [{ type: i0.Output, args: ["inputFocus"] }], inputBlur: [{ type: i0.Output, args: ["inputBlur"] }], inputChange: [{ type: i0.Output, args: ["inputChange"] }] } });
@@ -161,10 +161,10 @@ class IgxChatMessageContextDirective {
     static ngTemplateContextGuard(_, ctx) {
         return true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatMessageContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: IgxChatMessageContextDirective, isStandalone: true, selector: "[igxChatMessageContext]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatMessageContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: IgxChatMessageContextDirective, isStandalone: true, selector: "[igxChatMessageContext]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatMessageContextDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatMessageContextDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[igxChatMessageContext]', standalone: true }]
         }] });
@@ -183,10 +183,10 @@ class IgxChatAttachmentContextDirective {
     static ngTemplateContextGuard(_, ctx) {
         return true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatAttachmentContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: IgxChatAttachmentContextDirective, isStandalone: true, selector: "[igxChatAttachmentContext]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatAttachmentContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: IgxChatAttachmentContextDirective, isStandalone: true, selector: "[igxChatAttachmentContext]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatAttachmentContextDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatAttachmentContextDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[igxChatAttachmentContext]', standalone: true }]
         }] });
@@ -205,10 +205,10 @@ class IgxChatInputContextDirective {
     static ngTemplateContextGuard(_, ctx) {
         return true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatInputContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: IgxChatInputContextDirective, isStandalone: true, selector: "[igxChatInputContext]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatInputContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: IgxChatInputContextDirective, isStandalone: true, selector: "[igxChatInputContext]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChatInputContextDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChatInputContextDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[igxChatInputContext]', standalone: true }]
         }] });

package/fesm2022/igniteui-angular-chat.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"igniteui-angular-chat.mjs","sources":["../../../projects/igniteui-angular/chat/src/chat.component.ts","../../../projects/igniteui-angular/chat/src/chat.component.html","../../../projects/igniteui-angular/chat/src/igniteui-angular-chat.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    Component,\n    CUSTOM_ELEMENTS_SCHEMA,\n    Directive,\n    effect,\n    inject,\n    input,\n    OnInit,\n    output,\n    signal,\n    TemplateRef,\n    ViewContainerRef,\n    OnDestroy,\n    ViewRef,\n    computed,\n} from '@angular/core';\nimport {\n    IgcChatComponent,\n    type IgcChatMessageAttachment,\n    type IgcChatMessage,\n    type IgcChatOptions,\n    type ChatRenderContext,\n    type ChatRenderers,\n    type ChatAttachmentRenderContext,\n    type ChatInputRenderContext,\n    type ChatMessageRenderContext,\n    type IgcChatMessageReaction,\n} from 'igniteui-webcomponents';\n\ntype ChatContextUnion =\n    | ChatAttachmentRenderContext\n    | ChatMessageRenderContext\n    | ChatInputRenderContext\n    | ChatRenderContext;\n\ntype ChatContextType<T extends ChatContextUnion> =\n    T extends ChatAttachmentRenderContext\n    ? IgcChatMessageAttachment\n    : T extends ChatMessageRenderContext\n    ? IgcChatMessage\n    : T extends ChatInputRenderContext\n    ? string\n    : T extends ChatRenderContext\n    ? { instance: IgcChatComponent }\n    : never;\n\ntype ExtractChatContext<T> = T extends (ctx: infer R) => any ? R : never;\n\ntype ChatTemplatesContextMap = {\n    [K in keyof ChatRenderers]: {\n        $implicit: ChatContextType<\n            ExtractChatContext<NonNullable<ChatRenderers[K]>> & ChatContextUnion\n        >;\n    };\n};\n\n/**\n * Template references for customizing chat component rendering.\n * Each property corresponds to a specific part of the chat UI that can be customized.\n *\n * @example\n * ```typescript\n * templates = {\n *   messageContent: this.customMessageTemplate,\n *   attachment: this.customAttachmentTemplate\n * }\n * ```\n */\nexport type IgxChatTemplates = {\n    [K in keyof Omit<ChatRenderers, 'typingIndicator'>]?: TemplateRef<ChatTemplatesContextMap[K]>;\n};\n\n/**\n * Configuration options for the chat component.\n */\nexport type IgxChatOptions = Omit<IgcChatOptions, 'renderers'>;\n\n\n/**\n * Angular wrapper component for the Ignite UI Web Components Chat component.\n *\n * This component provides an Angular-friendly interface to the igc-chat web component,\n * including support for Angular templates, signals, and change detection.\n *\n * Uses OnPush change detection strategy for optimal performance. All inputs are signals,\n * so changes are automatically tracked and propagated to the underlying web component.\n *\n * @example\n * ```typescript\n * <igx-chat\n *   [messages]=\"messages\"\n *   [draftMessage]=\"draft\"\n *   [options]=\"chatOptions\"\n *   [templates]=\"chatTemplates\"\n *   (messageCreated)=\"onMessageCreated($event)\"\n * />\n * ```\n */\n@Component({\n    selector: 'igx-chat',\n    standalone: true,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    schemas: [CUSTOM_ELEMENTS_SCHEMA],\n    templateUrl: './chat.component.html'\n})\nexport class IgxChatComponent implements OnInit, OnDestroy {\n    //#region Internal state\n\n    private readonly _view = inject(ViewContainerRef);\n    private readonly _templateViewRefs = new Map<TemplateRef<any>, Set<ViewRef>>();\n    private _oldTemplates: IgxChatTemplates = {};\n\n    protected readonly _transformedTemplates = signal<ChatRenderers>({});\n\n    protected readonly _mergedOptions = computed<IgcChatOptions>(() => {\n        const options = this.options();\n        const transformedTemplates = this._transformedTemplates();\n        return {\n            ...options,\n            renderers: transformedTemplates\n        };\n    });\n\n    //#endregion\n\n    //#region Inputs\n\n    /** Array of chat messages to display */\n    public readonly messages = input<IgcChatMessage[]>([]);\n\n    /** Draft message with text and optional attachments */\n    public readonly draftMessage = input<\n        { text: string; attachments?: IgcChatMessageAttachment[] } | undefined\n    >({ text: '' });\n\n    /** Configuration options for the chat component */\n    public readonly options = input<IgxChatOptions>({});\n\n    /** Custom templates for rendering chat elements */\n    public readonly templates = input<IgxChatTemplates>({});\n\n    //#endregion\n\n    //#region Outputs\n\n    /** Emitted when a new message is created */\n    public readonly messageCreated = output<IgcChatMessage>();\n\n    /** Emitted when a user reacts to a message */\n    public readonly messageReact = output<IgcChatMessageReaction>();\n\n    /** Emitted when an attachment is clicked */\n    public readonly attachmentClick = output<IgcChatMessageAttachment>();\n\n    /** Emitted when attachment drag starts */\n    public readonly attachmentDrag = output<void>();\n\n    /** Emitted when attachment is dropped */\n    public readonly attachmentDrop = output<void>();\n\n    /** Emitted when typing indicator state changes */\n    public readonly typingChange = output<boolean>();\n\n    /** Emitted when the input receives focus */\n    public readonly inputFocus = output<void>();\n\n    /** Emitted when the input loses focus */\n    public readonly inputBlur = output<void>();\n\n    /** Emitted when the input value changes */\n    public readonly inputChange = output<string>();\n\n    //#endregion\n\n    /** @internal */\n    public ngOnInit(): void {\n        IgcChatComponent.register();\n    }\n\n    /** @internal */\n    public ngOnDestroy(): void {\n        for (const viewSet of this._templateViewRefs.values()) {\n            viewSet.forEach(viewRef => viewRef.destroy());\n        }\n        this._templateViewRefs.clear();\n    }\n\n    constructor() {\n        // Templates changed - update transformed templates and viewRefs\n        effect(() => {\n            const templates = this.templates();\n            this._setTemplates(templates ?? {});\n        });\n    }\n\n    private _setTemplates(newTemplates: IgxChatTemplates): void {\n        const templateCopies: ChatRenderers = {};\n        const newTemplateKeys = Object.keys(newTemplates) as Array<keyof IgxChatTemplates>;\n\n        const oldTemplates = this._oldTemplates;\n        const oldTemplateKeys = Object.keys(oldTemplates) as Array<keyof IgxChatTemplates>;\n\n        for (const key of oldTemplateKeys) {\n            const oldRef = oldTemplates[key];\n            const newRef = newTemplates[key];\n\n            if (oldRef && oldRef !== newRef) {\n                const obsolete = this._templateViewRefs.get(oldRef);\n                if (obsolete) {\n                    obsolete.forEach(viewRef => viewRef.destroy());\n                    this._templateViewRefs.delete(oldRef);\n                }\n            }\n        }\n\n        this._oldTemplates = {};\n\n        for (const key of newTemplateKeys) {\n            const ref = newTemplates[key];\n            if (ref) {\n                (this._oldTemplates as Record<string, TemplateRef<unknown>>)[key] = ref;\n                templateCopies[key] = this._createTemplateRenderer(ref);\n            }\n        }\n\n        this._transformedTemplates.set(templateCopies);\n    }\n\n    private _createTemplateRenderer<K extends keyof IgxChatTemplates>(ref: NonNullable<IgxChatTemplates[K]>) {\n        type ChatContext = ExtractChatContext<NonNullable<ChatRenderers[K]>>;\n\n        if (!this._templateViewRefs.has(ref)) {\n            this._templateViewRefs.set(ref, new Set<ViewRef>());\n        }\n\n        const viewSet = this._templateViewRefs.get(ref)!;\n\n        return (ctx: ChatContext) => {\n            const context = ctx as ChatContextUnion;\n            let angularContext: any;\n\n            if ('message' in context && 'attachment' in context) {\n                angularContext = { $implicit: context.attachment };\n            } else if ('message' in context) {\n                angularContext = { $implicit: context.message };\n            } else if ('value' in context) {\n                angularContext = {\n                    $implicit: context.value,\n                    attachments: context.attachments\n                };\n            } else {\n                angularContext = { $implicit: { instance: context.instance } };\n            }\n\n            const viewRef = this._view.createEmbeddedView(ref, angularContext);\n            viewSet.add(viewRef);\n\n            return viewRef.rootNodes;\n        }\n    }\n}\n\n/**\n * Context provided to the chat input template.\n */\nexport interface ChatInputContext {\n    /** The current input value */\n    $implicit: string;\n    /** Array of attachments associated with the input */\n    attachments: IgcChatMessageAttachment[];\n}\n\n/**\n * Directive providing type information for chat message template contexts.\n * Use this directive on ng-template elements that render chat messages.\n *\n * @example\n * ```html\n * <ng-template igxChatMessageContext let-message>\n *   <div>{{ message.text }}</div>\n * </ng-template>\n * ```\n */\n@Directive({ selector: '[igxChatMessageContext]', standalone: true })\nexport class IgxChatMessageContextDirective {\n\n    public static ngTemplateContextGuard(_: IgxChatMessageContextDirective, ctx: unknown): ctx is { $implicit: IgcChatMessage } {\n        return true;\n    }\n}\n\n/**\n * Directive providing type information for chat attachment template contexts.\n * Use this directive on ng-template elements that render message attachments.\n *\n * @example\n * ```html\n * <ng-template igxChatAttachmentContext let-attachment>\n *   <img [src]=\"attachment.url\" />\n * </ng-template>\n * ```\n */\n@Directive({ selector: '[igxChatAttachmentContext]', standalone: true })\nexport class IgxChatAttachmentContextDirective {\n\n    public static ngTemplateContextGuard(_: IgxChatAttachmentContextDirective, ctx: unknown): ctx is { $implicit: IgcChatMessageAttachment } {\n        return true;\n    }\n}\n\n/**\n * Directive providing type information for chat input template contexts.\n * Use this directive on ng-template elements that render the chat input.\n *\n * @example\n * ```html\n * <ng-template igxChatInputContext let-value let-attachments=\"attachments\">\n *   <input [value]=\"value\" />\n * </ng-template>\n * ```\n */\n@Directive({ selector: '[igxChatInputContext]', standalone: true })\nexport class IgxChatInputContextDirective {\n\n    public static ngTemplateContextGuard(_: IgxChatInputContextDirective, ctx: unknown): ctx is ChatInputContext {\n        return true;\n    }\n}\n","<igc-chat\n  [messages]=\"messages()\"\n  [draftMessage]=\"draftMessage()\"\n  [options]=\"_mergedOptions()\"\n  (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n  (igcMessageReact)=\"messageReact.emit($event.detail)\"\n  (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n  (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n  (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n  (igcTypingChange)=\"typingChange.emit($event.detail)\"\n  (igcInputFocus)=\"inputFocus.emit()\"\n  (igcInputBlur)=\"inputBlur.emit()\"\n  (igcInputChange)=\"inputChange.emit($event.detail)\"\n>\n    <ng-content></ng-content>\n</igc-chat>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"igniteui-angular-chat.mjs","sources":["../../../projects/igniteui-angular/chat/src/chat.component.ts","../../../projects/igniteui-angular/chat/src/chat.component.html","../../../projects/igniteui-angular/chat/src/igniteui-angular-chat.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    Component,\n    CUSTOM_ELEMENTS_SCHEMA,\n    Directive,\n    effect,\n    inject,\n    input,\n    OnInit,\n    output,\n    signal,\n    TemplateRef,\n    ViewContainerRef,\n    OnDestroy,\n    ViewRef,\n    computed,\n} from '@angular/core';\nimport {\n    IgcChatComponent,\n    type IgcChatMessageAttachment,\n    type IgcChatMessage,\n    type IgcChatOptions,\n    type ChatRenderContext,\n    type ChatRenderers,\n    type ChatAttachmentRenderContext,\n    type ChatInputRenderContext,\n    type ChatMessageRenderContext,\n    type IgcChatMessageReaction,\n} from 'igniteui-webcomponents';\n\ntype ChatContextUnion =\n    | ChatAttachmentRenderContext\n    | ChatMessageRenderContext\n    | ChatInputRenderContext\n    | ChatRenderContext;\n\ntype ChatContextType<T extends ChatContextUnion> =\n    T extends ChatAttachmentRenderContext\n    ? IgcChatMessageAttachment\n    : T extends ChatMessageRenderContext\n    ? IgcChatMessage\n    : T extends ChatInputRenderContext\n    ? string\n    : T extends ChatRenderContext\n    ? { instance: IgcChatComponent }\n    : never;\n\ntype ExtractChatContext<T> = T extends (ctx: infer R) => any ? R : never;\n\ntype ChatTemplatesContextMap = {\n    [K in keyof ChatRenderers]: {\n        $implicit: ChatContextType<\n            ExtractChatContext<NonNullable<ChatRenderers[K]>> & ChatContextUnion\n        >;\n    };\n};\n\n/**\n * Template references for customizing chat component rendering.\n * Each property corresponds to a specific part of the chat UI that can be customized.\n *\n * @example\n * ```typescript\n * templates = {\n *   messageContent: this.customMessageTemplate,\n *   attachment: this.customAttachmentTemplate\n * }\n * ```\n */\nexport type IgxChatTemplates = {\n    [K in keyof Omit<ChatRenderers, 'typingIndicator'>]?: TemplateRef<ChatTemplatesContextMap[K]>;\n};\n\n/**\n * Configuration options for the chat component.\n */\nexport type IgxChatOptions = Omit<IgcChatOptions, 'renderers'>;\n\n\n/**\n * Angular wrapper component for the Ignite UI Web Components Chat component.\n *\n * This component provides an Angular-friendly interface to the igc-chat web component,\n * including support for Angular templates, signals, and change detection.\n *\n * Uses OnPush change detection strategy for optimal performance. All inputs are signals,\n * so changes are automatically tracked and propagated to the underlying web component.\n *\n * @example\n * ```typescript\n * <igx-chat\n *   [messages]=\"messages\"\n *   [draftMessage]=\"draft\"\n *   [options]=\"chatOptions\"\n *   [templates]=\"chatTemplates\"\n *   (messageCreated)=\"onMessageCreated($event)\"\n * />\n * ```\n */\n@Component({\n    selector: 'igx-chat',\n    standalone: true,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    schemas: [CUSTOM_ELEMENTS_SCHEMA],\n    templateUrl: './chat.component.html'\n})\nexport class IgxChatComponent implements OnInit, OnDestroy {\n    //#region Internal state\n\n    private readonly _view = inject(ViewContainerRef);\n    private readonly _templateViewRefs = new Map<TemplateRef<any>, Set<ViewRef>>();\n    private _oldTemplates: IgxChatTemplates = {};\n\n    protected readonly _transformedTemplates = signal<ChatRenderers>({});\n\n    protected readonly _mergedOptions = computed<IgcChatOptions>(() => {\n        const options = this.options();\n        const transformedTemplates = this._transformedTemplates();\n        return {\n            ...options,\n            renderers: transformedTemplates\n        };\n    });\n\n    //#endregion\n\n    //#region Inputs\n\n    /** Array of chat messages to display */\n    public readonly messages = input<IgcChatMessage[]>([]);\n\n    /** Draft message with text and optional attachments */\n    public readonly draftMessage = input<\n        { text: string; attachments?: IgcChatMessageAttachment[] } | undefined\n    >({ text: '' });\n\n    /** Configuration options for the chat component */\n    public readonly options = input<IgxChatOptions>({});\n\n    /** Custom templates for rendering chat elements */\n    public readonly templates = input<IgxChatTemplates>({});\n\n    //#endregion\n\n    //#region Outputs\n\n    /** Emitted when a new message is created */\n    public readonly messageCreated = output<IgcChatMessage>();\n\n    /** Emitted when a user reacts to a message */\n    public readonly messageReact = output<IgcChatMessageReaction>();\n\n    /** Emitted when an attachment is clicked */\n    public readonly attachmentClick = output<IgcChatMessageAttachment>();\n\n    /** Emitted when attachment drag starts */\n    public readonly attachmentDrag = output<void>();\n\n    /** Emitted when attachment is dropped */\n    public readonly attachmentDrop = output<void>();\n\n    /** Emitted when typing indicator state changes */\n    public readonly typingChange = output<boolean>();\n\n    /** Emitted when the input receives focus */\n    public readonly inputFocus = output<void>();\n\n    /** Emitted when the input loses focus */\n    public readonly inputBlur = output<void>();\n\n    /** Emitted when the input value changes */\n    public readonly inputChange = output<string>();\n\n    //#endregion\n\n    /** @internal */\n    public ngOnInit(): void {\n        IgcChatComponent.register();\n    }\n\n    /** @internal */\n    public ngOnDestroy(): void {\n        for (const viewSet of this._templateViewRefs.values()) {\n            viewSet.forEach(viewRef => viewRef.destroy());\n        }\n        this._templateViewRefs.clear();\n    }\n\n    constructor() {\n        // Templates changed - update transformed templates and viewRefs\n        effect(() => {\n            const templates = this.templates();\n            this._setTemplates(templates ?? {});\n        });\n    }\n\n    private _setTemplates(newTemplates: IgxChatTemplates): void {\n        const templateCopies: ChatRenderers = {};\n        const newTemplateKeys = Object.keys(newTemplates) as Array<keyof IgxChatTemplates>;\n\n        const oldTemplates = this._oldTemplates;\n        const oldTemplateKeys = Object.keys(oldTemplates) as Array<keyof IgxChatTemplates>;\n\n        for (const key of oldTemplateKeys) {\n            const oldRef = oldTemplates[key];\n            const newRef = newTemplates[key];\n\n            if (oldRef && oldRef !== newRef) {\n                const obsolete = this._templateViewRefs.get(oldRef);\n                if (obsolete) {\n                    obsolete.forEach(viewRef => viewRef.destroy());\n                    this._templateViewRefs.delete(oldRef);\n                }\n            }\n        }\n\n        this._oldTemplates = {};\n\n        for (const key of newTemplateKeys) {\n            const ref = newTemplates[key];\n            if (ref) {\n                (this._oldTemplates as Record<string, TemplateRef<unknown>>)[key] = ref;\n                templateCopies[key] = this._createTemplateRenderer(ref);\n            }\n        }\n\n        this._transformedTemplates.set(templateCopies);\n    }\n\n    private _createTemplateRenderer<K extends keyof IgxChatTemplates>(ref: NonNullable<IgxChatTemplates[K]>) {\n        type ChatContext = ExtractChatContext<NonNullable<ChatRenderers[K]>>;\n\n        if (!this._templateViewRefs.has(ref)) {\n            this._templateViewRefs.set(ref, new Set<ViewRef>());\n        }\n\n        const viewSet = this._templateViewRefs.get(ref)!;\n\n        return (ctx: ChatContext) => {\n            const context = ctx as ChatContextUnion;\n            let angularContext: any;\n\n            if ('message' in context && 'attachment' in context) {\n                angularContext = { $implicit: context.attachment };\n            } else if ('message' in context) {\n                angularContext = { $implicit: context.message };\n            } else if ('value' in context) {\n                angularContext = {\n                    $implicit: context.value,\n                    attachments: context.attachments\n                };\n            } else {\n                angularContext = { $implicit: { instance: context.instance } };\n            }\n\n            const viewRef = this._view.createEmbeddedView(ref, angularContext);\n            viewSet.add(viewRef);\n\n            return viewRef.rootNodes;\n        }\n    }\n}\n\n/**\n * Context provided to the chat input template.\n */\nexport interface ChatInputContext {\n    /** The current input value */\n    $implicit: string;\n    /** Array of attachments associated with the input */\n    attachments: IgcChatMessageAttachment[];\n}\n\n/**\n * Directive providing type information for chat message template contexts.\n * Use this directive on ng-template elements that render chat messages.\n *\n * @example\n * ```html\n * <ng-template igxChatMessageContext let-message>\n *   <div>{{ message.text }}</div>\n * </ng-template>\n * ```\n */\n@Directive({ selector: '[igxChatMessageContext]', standalone: true })\nexport class IgxChatMessageContextDirective {\n\n    public static ngTemplateContextGuard(_: IgxChatMessageContextDirective, ctx: unknown): ctx is { $implicit: IgcChatMessage } {\n        return true;\n    }\n}\n\n/**\n * Directive providing type information for chat attachment template contexts.\n * Use this directive on ng-template elements that render message attachments.\n *\n * @example\n * ```html\n * <ng-template igxChatAttachmentContext let-attachment>\n *   <img [src]=\"attachment.url\" />\n * </ng-template>\n * ```\n */\n@Directive({ selector: '[igxChatAttachmentContext]', standalone: true })\nexport class IgxChatAttachmentContextDirective {\n\n    public static ngTemplateContextGuard(_: IgxChatAttachmentContextDirective, ctx: unknown): ctx is { $implicit: IgcChatMessageAttachment } {\n        return true;\n    }\n}\n\n/**\n * Directive providing type information for chat input template contexts.\n * Use this directive on ng-template elements that render the chat input.\n *\n * @example\n * ```html\n * <ng-template igxChatInputContext let-value let-attachments=\"attachments\">\n *   <input [value]=\"value\" />\n * </ng-template>\n * ```\n */\n@Directive({ selector: '[igxChatInputContext]', standalone: true })\nexport class IgxChatInputContextDirective {\n\n    public static ngTemplateContextGuard(_: IgxChatInputContextDirective, ctx: unknown): ctx is ChatInputContext {\n        return true;\n    }\n}\n","<igc-chat\n  [messages]=\"messages()\"\n  [draftMessage]=\"draftMessage()\"\n  [options]=\"_mergedOptions()\"\n  (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n  (igcMessageReact)=\"messageReact.emit($event.detail)\"\n  (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n  (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n  (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n  (igcTypingChange)=\"typingChange.emit($event.detail)\"\n  (igcInputFocus)=\"inputFocus.emit()\"\n  (igcInputBlur)=\"inputBlur.emit()\"\n  (igcInputChange)=\"inputChange.emit($event.detail)\"\n>\n    <ng-content></ng-content>\n</igc-chat>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/igniteui-angular-checkbox.mjs

@@ -179,8 +179,8 @@ class IgxCheckboxComponent extends CheckboxBaseDirective {
     get checked() {
         return super.checked;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxCheckboxComponent, isStandalone: true, selector: "igx-checkbox", inputs: { indeterminate: ["indeterminate", "indeterminate", booleanAttribute], checked: ["checked", "checked", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], invalid: ["invalid", "invalid", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], disableTransitions: ["disableTransitions", "disableTransitions", booleanAttribute] }, host: { properties: { "class.igx-checkbox": "this.cssClass", "class.igx-checkbox--material": "this.material", "class.igx-checkbox--indigo": "this.indigo", "class.igx-checkbox--bootstrap": "this.bootstrap", "class.igx-checkbox--fluent": "this.fluent", "class.igx-checkbox--focused": "this.focused", "class.igx-checkbox--indeterminate": "this.indeterminate", "class.igx-checkbox--checked": "this.checked", "class.igx-checkbox--disabled": "this.disabled", "class.igx-checkbox--invalid": "this.invalid", "class.igx-checkbox--plain": "this.disableTransitions" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxCheckboxComponent, isStandalone: true, selector: "igx-checkbox", inputs: { indeterminate: ["indeterminate", "indeterminate", booleanAttribute], checked: ["checked", "checked", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], invalid: ["invalid", "invalid", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], disableTransitions: ["disableTransitions", "disableTransitions", booleanAttribute] }, host: { properties: { "class.igx-checkbox": "this.cssClass", "class.igx-checkbox--material": "this.material", "class.igx-checkbox--indigo": "this.indigo", "class.igx-checkbox--bootstrap": "this.bootstrap", "class.igx-checkbox--fluent": "this.fluent", "class.igx-checkbox--focused": "this.focused", "class.igx-checkbox--indeterminate": "this.indeterminate", "class.igx-checkbox--checked": "this.checked", "class.igx-checkbox--disabled": "this.disabled", "class.igx-checkbox--invalid": "this.invalid", "class.igx-checkbox--plain": "this.disableTransitions" } }, providers: [
             {
                 provide: EDITOR_PROVIDER,
                 useExisting: IgxCheckboxComponent,
@@ -188,7 +188,7 @@ class IgxCheckboxComponent extends CheckboxBaseDirective {
             },
         ], usesInheritance: true, ngImport: i0, template: "<input #checkbox class=\"igx-checkbox__input\"\n    type=\"checkbox\"\n    [id]=\"inputId\"\n    [name]=\"name\"\n    [value]=\"value\"\n    [tabindex]=\"tabindex\"\n    [disabled]=\"disabled\"\n    [indeterminate]=\"indeterminate\"\n    [checked]=\"checked\"\n    [required]=\"required\"\n    [attr.aria-required]=\"required\"\n    [attr.aria-invalid]=\"invalid\"\n    [attr.aria-checked]=\"ariaChecked\"\n    [attr.aria-labelledby]=\"ariaLabel ? null : ariaLabelledBy\"\n    [attr.aria-label]=\"ariaLabel\"\n    (change)=\"_onCheckboxChange($event)\"\n    (blur)=\"onBlur()\" />\n\n<div\n    igxRipple\n    igxRippleTarget=\".igx-checkbox__ripple\"\n    [igxRippleDisabled]=\"disableRipple\"\n    [igxRippleCentered]=\"true\"\n    [igxRippleDuration]=\"300\"\n    class=\"igx-checkbox__composite-wrapper\"\n>\n    <span #label class=\"igx-checkbox__composite\">\n        @if (theme === 'indigo') {\n            <svg class=\"igx-checkbox__composite-mark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n                <rect width=\"18\" height=\"4\" x=\"2\" y=\"9\" rx=\"1.85\"/>\n                <path d=\"M19.033 5a1.966 1.966 0 0 0-1.418.586l-8.479 8.577-2.753-2.77a1.971 1.971 0 0 0-2.8 0 1.998 1.998 0 0 0 0 2.822l4.155 4.196a1.955 1.955 0 0 0 2.8 0l9.879-9.99a1.998 1.998 0 0 0 0-2.821 1.966 1.966 0 0 0-1.384-.6Z\"/>\n            </svg>\n        } @else {\n            <svg class=\"igx-checkbox__composite-mark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n                <path d=\"M4.1,12.7 9,17.6 20.3,6.3\"/>\n            </svg>\n        }\n    </span>\n\n    <div class=\"igx-checkbox__ripple\"></div>\n</div>\n\n<span #placeholderLabel\n    [class]=\"labelClass\"\n    [id]=\"labelId\">\n    <ng-content></ng-content>\n</span>\n", dependencies: [{ kind: "directive", type: IgxRippleDirective, selector: "[igxRipple]", inputs: ["igxRippleTarget", "igxRipple", "igxRippleDuration", "igxRippleCentered", "igxRippleDisabled"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCheckboxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCheckboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-checkbox', providers: [
                         {
@@ -255,11 +255,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImpor
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
  */
 class IgxCheckboxModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxCheckboxModule, imports: [IgxCheckboxComponent], exports: [IgxCheckboxComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCheckboxModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxCheckboxModule, imports: [IgxCheckboxComponent], exports: [IgxCheckboxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCheckboxModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxCheckboxModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxCheckboxModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [IgxCheckboxComponent],

package/fesm2022/igniteui-angular-chips.mjs

@@ -670,10 +670,10 @@ class IgxChipComponent {
         this.destroy$.next();
         this.destroy$.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxChipComponent, isStandalone: true, selector: "igx-chip", inputs: { variant: "variant", id: "id", tabIndex: "tabIndex", data: "data", draggable: ["draggable", "draggable", booleanAttribute], animateOnRelease: ["animateOnRelease", "animateOnRelease", booleanAttribute], hideBaseOnDrag: ["hideBaseOnDrag", "hideBaseOnDrag", booleanAttribute], removable: ["removable", "removable", booleanAttribute], removeIcon: "removeIcon", selectable: ["selectable", "selectable", booleanAttribute], selectIcon: "selectIcon", class: "class", disabled: ["disabled", "disabled", booleanAttribute], selected: ["selected", "selected", booleanAttribute], color: "color", resourceStrings: "resourceStrings" }, outputs: { selectedChange: "selectedChange", moveStart: "moveStart", moveEnd: "moveEnd", remove: "remove", chipClick: "chipClick", selectedChanging: "selectedChanging", selectedChanged: "selectedChanged", keyDown: "keyDown", dragEnter: "dragEnter", dragLeave: "dragLeave", dragOver: "dragOver", dragDrop: "dragDrop" }, host: { listeners: { "keydown": "keyEvent($event)" }, properties: { "attr.id": "this.id", "attr.role": "this.role", "attr.tabIndex": "this.tabIndex", "class.igx-chip--disabled": "this.disabled", "attr.aria-selected": "this.selected", "class.igx-chip": "this.defaultClass", "class.igx-chip--primary": "this.isPrimary", "class.igx-chip--info": "this.isInfo", "class.igx-chip--success": "this.isSuccess", "class.igx-chip--warning": "this.isWarning", "class.igx-chip--danger": "this.isDanger" } }, viewQueries: [{ propertyName: "dragDirective", first: true, predicate: ["chipArea"], descendants: true, read: IgxDragDirective, static: true }, { propertyName: "chipArea", first: true, predicate: ["chipArea"], descendants: true, read: ElementRef, static: true }, { propertyName: "defaultRemoveIcon", first: true, predicate: ["defaultRemoveIcon"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultSelectIcon", first: true, predicate: ["defaultSelectIcon"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<div #chipArea class=\"igx-chip__item\"\n    [igxDrag]=\"{chip: this}\"\n    [style.visibility]='hideBaseElement ? \"hidden\" : \"visible\"'\n    ghostClass=\"igx-chip__ghost\"\n    [ghostStyle]=\"ghostStyles\"\n    (dragStart)=\"onChipDragStart($event)\"\n    (ghostCreate)=\"onChipGhostCreate()\"\n    (ghostDestroy)=\"onChipGhostDestroy()\"\n    (dragEnd)=\"onChipDragEnd()\"\n    (transitioned)=\"onChipMoveEnd($event)\"\n    (dragClick)=\"onChipDragClicked($event)\"\n    igxDrop\n    (enter)=\"onChipDragEnterHandler($event)\"\n    (leave)=\"onChipDragLeaveHandler($event)\"\n    (over)=\"onChipOverHandler($event)\"\n    (dropped)=\"onChipDrop($event)\">\n\n    <div class=\"igx-chip__start\" #selectContainer>\n        @if (selected) {\n            <div [ngClass]=\"selectClass(selected)\">\n                <ng-container *ngTemplateOutlet=\"selectIconTemplate\"></ng-container>\n            </div>\n        }\n\n        <ng-content select=\"igx-prefix,[igxPrefix]\"></ng-content>\n    </div>\n\n    <div class=\"igx-chip__content\">\n        <ng-content></ng-content>\n    </div>\n\n    <div class=\"igx-chip__end\">\n        <ng-content select=\"igx-suffix,[igxSuffix]\"></ng-content>\n\n        @if (removable) {\n            <div class=\"igx-chip__remove\"\n                [attr.tabIndex]=\"tabIndex\"\n                (keydown)=\"onRemoveBtnKeyDown($event)\"\n                (pointerdown)=\"onRemoveMouseDown($event)\"\n                (mousedown)=\"onRemoveMouseDown($event)\"\n                (click)=\"onRemoveClick($event)\"\n                (touchmove)=\"onRemoveTouchMove()\"\n                (touchend)=\"onRemoveTouchEnd($event)\">\n                <ng-container *ngTemplateOutlet=\"removeButtonTemplate\"></ng-container>\n            </div>\n        }\n    </div>\n</div>\n\n<ng-template #defaultSelectIcon>\n    <igx-icon\n        [attr.aria-label]=\"resourceStrings.igx_chip_select\"\n        family=\"default\"\n        name=\"selected\"\n    ></igx-icon>\n</ng-template>\n\n<ng-template #defaultRemoveIcon>\n    <igx-icon\n        [attr.aria-label]=\"resourceStrings.igx_chip_remove\"\n        family=\"default\"\n        name=\"remove\"\n    ></igx-icon>\n</ng-template>\n", dependencies: [{ kind: "directive", type: IgxDropDirective, selector: "[igxDrop]", inputs: ["igxDrop", "dropChannel", "dropStrategy"], outputs: ["enter", "over", "leave", "dropped"], exportAs: ["drop"] }, { kind: "directive", type: IgxDragDirective, selector: "[igxDrag]", inputs: ["igxDrag", "dragTolerance", "dragDirection", "dragChannel", "ghost", "ghostClass", "ghostStyle", "ghostTemplate", "ghostHost", "scrollContainer", "ghostOffsetX", "ghostOffsetY"], outputs: ["dragStart", "dragMove", "dragEnd", "dragClick", "ghostCreate", "ghostDestroy", "transitioned"], exportAs: ["drag"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxChipComponent, isStandalone: true, selector: "igx-chip", inputs: { variant: "variant", id: "id", tabIndex: "tabIndex", data: "data", draggable: ["draggable", "draggable", booleanAttribute], animateOnRelease: ["animateOnRelease", "animateOnRelease", booleanAttribute], hideBaseOnDrag: ["hideBaseOnDrag", "hideBaseOnDrag", booleanAttribute], removable: ["removable", "removable", booleanAttribute], removeIcon: "removeIcon", selectable: ["selectable", "selectable", booleanAttribute], selectIcon: "selectIcon", class: "class", disabled: ["disabled", "disabled", booleanAttribute], selected: ["selected", "selected", booleanAttribute], color: "color", resourceStrings: "resourceStrings" }, outputs: { selectedChange: "selectedChange", moveStart: "moveStart", moveEnd: "moveEnd", remove: "remove", chipClick: "chipClick", selectedChanging: "selectedChanging", selectedChanged: "selectedChanged", keyDown: "keyDown", dragEnter: "dragEnter", dragLeave: "dragLeave", dragOver: "dragOver", dragDrop: "dragDrop" }, host: { listeners: { "keydown": "keyEvent($event)" }, properties: { "attr.id": "this.id", "attr.role": "this.role", "attr.tabIndex": "this.tabIndex", "class.igx-chip--disabled": "this.disabled", "attr.aria-selected": "this.selected", "class.igx-chip": "this.defaultClass", "class.igx-chip--primary": "this.isPrimary", "class.igx-chip--info": "this.isInfo", "class.igx-chip--success": "this.isSuccess", "class.igx-chip--warning": "this.isWarning", "class.igx-chip--danger": "this.isDanger" } }, viewQueries: [{ propertyName: "dragDirective", first: true, predicate: ["chipArea"], descendants: true, read: IgxDragDirective, static: true }, { propertyName: "chipArea", first: true, predicate: ["chipArea"], descendants: true, read: ElementRef, static: true }, { propertyName: "defaultRemoveIcon", first: true, predicate: ["defaultRemoveIcon"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultSelectIcon", first: true, predicate: ["defaultSelectIcon"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<div #chipArea class=\"igx-chip__item\"\n    [igxDrag]=\"{chip: this}\"\n    [style.visibility]='hideBaseElement ? \"hidden\" : \"visible\"'\n    ghostClass=\"igx-chip__ghost\"\n    [ghostStyle]=\"ghostStyles\"\n    (dragStart)=\"onChipDragStart($event)\"\n    (ghostCreate)=\"onChipGhostCreate()\"\n    (ghostDestroy)=\"onChipGhostDestroy()\"\n    (dragEnd)=\"onChipDragEnd()\"\n    (transitioned)=\"onChipMoveEnd($event)\"\n    (dragClick)=\"onChipDragClicked($event)\"\n    igxDrop\n    (enter)=\"onChipDragEnterHandler($event)\"\n    (leave)=\"onChipDragLeaveHandler($event)\"\n    (over)=\"onChipOverHandler($event)\"\n    (dropped)=\"onChipDrop($event)\">\n\n    <div class=\"igx-chip__start\" #selectContainer>\n        @if (selected) {\n            <div [ngClass]=\"selectClass(selected)\">\n                <ng-container *ngTemplateOutlet=\"selectIconTemplate\"></ng-container>\n            </div>\n        }\n\n        <ng-content select=\"igx-prefix,[igxPrefix]\"></ng-content>\n    </div>\n\n    <div class=\"igx-chip__content\">\n        <ng-content></ng-content>\n    </div>\n\n    <div class=\"igx-chip__end\">\n        <ng-content select=\"igx-suffix,[igxSuffix]\"></ng-content>\n\n        @if (removable) {\n            <div class=\"igx-chip__remove\"\n                [attr.tabIndex]=\"tabIndex\"\n                (keydown)=\"onRemoveBtnKeyDown($event)\"\n                (pointerdown)=\"onRemoveMouseDown($event)\"\n                (mousedown)=\"onRemoveMouseDown($event)\"\n                (click)=\"onRemoveClick($event)\"\n                (touchmove)=\"onRemoveTouchMove()\"\n                (touchend)=\"onRemoveTouchEnd($event)\">\n                <ng-container *ngTemplateOutlet=\"removeButtonTemplate\"></ng-container>\n            </div>\n        }\n    </div>\n</div>\n\n<ng-template #defaultSelectIcon>\n    <igx-icon\n        [attr.aria-label]=\"resourceStrings.igx_chip_select\"\n        family=\"default\"\n        name=\"selected\"\n    ></igx-icon>\n</ng-template>\n\n<ng-template #defaultRemoveIcon>\n    <igx-icon\n        [attr.aria-label]=\"resourceStrings.igx_chip_remove\"\n        family=\"default\"\n        name=\"remove\"\n    ></igx-icon>\n</ng-template>\n", dependencies: [{ kind: "directive", type: IgxDropDirective, selector: "[igxDrop]", inputs: ["igxDrop", "dropChannel", "dropStrategy"], outputs: ["enter", "over", "leave", "dropped"], exportAs: ["drop"] }, { kind: "directive", type: IgxDragDirective, selector: "[igxDrag]", inputs: ["igxDrag", "dragTolerance", "dragDirection", "dragChannel", "ghost", "ghostClass", "ghostStyle", "ghostTemplate", "ghostHost", "scrollContainer", "ghostOffsetX", "ghostOffsetY"], outputs: ["dragStart", "dragMove", "dragEnd", "dragClick", "ghostCreate", "ghostDestroy", "transitioned"], exportAs: ["drag"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChipComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChipComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-chip', imports: [IgxDropDirective, IgxDragDirective, NgClass, NgTemplateOutlet, IgxIconComponent], template: "<div #chipArea class=\"igx-chip__item\"\n    [igxDrag]=\"{chip: this}\"\n    [style.visibility]='hideBaseElement ? \"hidden\" : \"visible\"'\n    ghostClass=\"igx-chip__ghost\"\n    [ghostStyle]=\"ghostStyles\"\n    (dragStart)=\"onChipDragStart($event)\"\n    (ghostCreate)=\"onChipGhostCreate()\"\n    (ghostDestroy)=\"onChipGhostDestroy()\"\n    (dragEnd)=\"onChipDragEnd()\"\n    (transitioned)=\"onChipMoveEnd($event)\"\n    (dragClick)=\"onChipDragClicked($event)\"\n    igxDrop\n    (enter)=\"onChipDragEnterHandler($event)\"\n    (leave)=\"onChipDragLeaveHandler($event)\"\n    (over)=\"onChipOverHandler($event)\"\n    (dropped)=\"onChipDrop($event)\">\n\n    <div class=\"igx-chip__start\" #selectContainer>\n        @if (selected) {\n            <div [ngClass]=\"selectClass(selected)\">\n                <ng-container *ngTemplateOutlet=\"selectIconTemplate\"></ng-container>\n            </div>\n        }\n\n        <ng-content select=\"igx-prefix,[igxPrefix]\"></ng-content>\n    </div>\n\n    <div class=\"igx-chip__content\">\n        <ng-content></ng-content>\n    </div>\n\n    <div class=\"igx-chip__end\">\n        <ng-content select=\"igx-suffix,[igxSuffix]\"></ng-content>\n\n        @if (removable) {\n            <div class=\"igx-chip__remove\"\n                [attr.tabIndex]=\"tabIndex\"\n                (keydown)=\"onRemoveBtnKeyDown($event)\"\n                (pointerdown)=\"onRemoveMouseDown($event)\"\n                (mousedown)=\"onRemoveMouseDown($event)\"\n                (click)=\"onRemoveClick($event)\"\n                (touchmove)=\"onRemoveTouchMove()\"\n                (touchend)=\"onRemoveTouchEnd($event)\">\n                <ng-container *ngTemplateOutlet=\"removeButtonTemplate\"></ng-container>\n            </div>\n        }\n    </div>\n</div>\n\n<ng-template #defaultSelectIcon>\n    <igx-icon\n        [attr.aria-label]=\"resourceStrings.igx_chip_select\"\n        family=\"default\"\n        name=\"selected\"\n    ></igx-icon>\n</ng-template>\n\n<ng-template #defaultRemoveIcon>\n    <igx-icon\n        [attr.aria-label]=\"resourceStrings.igx_chip_remove\"\n        family=\"default\"\n        name=\"remove\"\n    ></igx-icon>\n</ng-template>\n" }]
         }], propDecorators: { variant: [{
@@ -1071,10 +1071,10 @@ class IgxChipsAreaComponent {
             owner: this
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChipsAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0", type: IgxChipsAreaComponent, isStandalone: true, selector: "igx-chips-area", inputs: { width: "width", height: "height" }, outputs: { reorder: "reorder", selectionChange: "selectionChange", moveStart: "moveStart", moveEnd: "moveEnd" }, host: { properties: { "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "style.width.rem": "this._widthToRem", "style.height.rem": "this._heightToRem", "class": "this.hostClass" } }, queries: [{ propertyName: "chipsList", predicate: IgxChipComponent, descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChipsAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: IgxChipsAreaComponent, isStandalone: true, selector: "igx-chips-area", inputs: { width: "width", height: "height" }, outputs: { reorder: "reorder", selectionChange: "selectionChange", moveStart: "moveStart", moveEnd: "moveEnd" }, host: { properties: { "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "style.width.rem": "this._widthToRem", "style.height.rem": "this._heightToRem", "class": "this.hostClass" } }, queries: [{ propertyName: "chipsList", predicate: IgxChipComponent, descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChipsAreaComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChipsAreaComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-chips-area', standalone: true, template: "<ng-content></ng-content>\n" }]
         }], ctorParameters: () => [], propDecorators: { role: [{
@@ -1122,11 +1122,11 @@ const IGX_CHIPS_DIRECTIVES = [
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
  */
 class IgxChipsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxChipsModule, imports: [IgxChipsAreaComponent, IgxChipComponent, i3.IgxPrefixDirective, i3.IgxSuffixDirective], exports: [IgxChipsAreaComponent, IgxChipComponent, i3.IgxPrefixDirective, i3.IgxSuffixDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChipsModule, imports: [IgxChipComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxChipsModule, imports: [IgxChipsAreaComponent, IgxChipComponent, i3.IgxPrefixDirective, i3.IgxSuffixDirective], exports: [IgxChipsAreaComponent, IgxChipComponent, i3.IgxPrefixDirective, i3.IgxSuffixDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChipsModule, imports: [IgxChipComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxChipsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxChipsModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [