primeng 15.3.0 → 15.4.0

package/fesm2020/primeng-messages.mjs

@@ -8,6 +8,11 @@ import { PrimeTemplate } from 'primeng/api';
 import { timer } from 'rxjs';
 import * as i3 from 'primeng/ripple';
 import { RippleModule } from 'primeng/ripple';
+import { CheckIcon } from 'primeng/icons/check';
+import { InfoCircleIcon } from 'primeng/icons/infocircle';
+import { TimesCircleIcon } from 'primeng/icons/timescircle';
+import { ExclamationTriangleIcon } from 'primeng/icons/exclamationtriangle';
+import { TimesIcon } from 'primeng/icons/times';
 
 class Messages {
     constructor(messageService, el, cd) {
@@ -129,9 +134,18 @@ Messages.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
                 >
                     <div class="p-message-wrapper">
                         <span
-                            [class]="'p-message-icon pi' + (msg.icon ? ' ' + msg.icon : '')"
-                            [ngClass]="{ 'pi-info-circle': msg.severity === 'info', 'pi-check': msg.severity === 'success', 'pi-exclamation-triangle': msg.severity === 'warn', 'pi-times-circle': msg.severity === 'error' }"
-                        ></span>
+                            *ngIf="msg.icon"
+                            [class]="'p-message-icon pi ' + msg.icon"
+                        >
+                        </span>
+                        <span class="p-message-icon" *ngIf="!msg.icon">
+                            <ng-container>
+                                <CheckIcon *ngIf="msg.severity === 'success'"/>
+                                <InfoCircleIcon *ngIf="msg.severity === 'info'"/>
+                                <TimesCircleIcon *ngIf="msg.severity === 'error'"/>
+                                <ExclamationTriangleIcon *ngIf="msg.severity === 'warn'"/>
+                            </ng-container>
+                        </span>
                         <ng-container *ngIf="!escape; else escapeOut">
                             <span *ngIf="msg.summary" class="p-message-summary" [innerHTML]="msg.summary"></span>
                             <span *ngIf="msg.detail" class="p-message-detail" [innerHTML]="msg.detail"></span>
@@ -141,7 +155,7 @@ Messages.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
                             <span *ngIf="msg.detail" class="p-message-detail">{{ msg.detail }}</span>
                         </ng-template>
                         <button class="p-message-close p-link" (click)="removeMessage(i)" *ngIf="closable" type="button" pRipple>
-                            <i class="p-message-close-icon pi pi-times"></i>
+                            <TimesIcon [styleClass]="'p-message-close-icon'"/>
                         </button>
                     </div>
                 </div>
@@ -154,7 +168,7 @@ Messages.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
                 </div>
             </ng-template>
         </div>
-    `, isInline: true, styles: [".p-message-wrapper{display:flex;align-items:center}.p-message-close{display:flex;align-items:center;justify-content:center}.p-message-close.p-link{margin-left:auto;overflow:hidden;position:relative}.p-messages .p-message.ng-animating{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.Ripple, selector: "[pRipple]" }], animations: [
+    `, isInline: true, styles: [".p-message-wrapper{display:flex;align-items:center}.p-message-close{display:flex;align-items:center;justify-content:center}.p-message-close.p-link{margin-left:auto;overflow:hidden;position:relative}.p-messages .p-message.ng-animating{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i2.NgClass; }), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgTemplateOutlet; }), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgStyle; }), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i0.forwardRef(function () { return i3.Ripple; }), selector: "[pRipple]" }, { kind: "component", type: i0.forwardRef(function () { return CheckIcon; }), selector: "CheckIcon" }, { kind: "component", type: i0.forwardRef(function () { return InfoCircleIcon; }), selector: "InfoCircleIcon" }, { kind: "component", type: i0.forwardRef(function () { return TimesCircleIcon; }), selector: "TimesCircleIcon" }, { kind: "component", type: i0.forwardRef(function () { return ExclamationTriangleIcon; }), selector: "ExclamationTriangleIcon" }, { kind: "component", type: i0.forwardRef(function () { return TimesIcon; }), selector: "TimesIcon" }], animations: [
         trigger('messageAnimation', [
             transition(':enter', [style({ opacity: 0, transform: 'translateY(-25%)' }), animate('{{showTransitionParams}}')]),
             transition(':leave', [animate('{{hideTransitionParams}}', style({ height: 0, marginTop: 0, marginBottom: 0, marginLeft: 0, marginRight: 0, opacity: 0 }))])
@@ -173,9 +187,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
                 >
                     <div class="p-message-wrapper">
                         <span
-                            [class]="'p-message-icon pi' + (msg.icon ? ' ' + msg.icon : '')"
-                            [ngClass]="{ 'pi-info-circle': msg.severity === 'info', 'pi-check': msg.severity === 'success', 'pi-exclamation-triangle': msg.severity === 'warn', 'pi-times-circle': msg.severity === 'error' }"
-                        ></span>
+                            *ngIf="msg.icon"
+                            [class]="'p-message-icon pi ' + msg.icon"
+                        >
+                        </span>
+                        <span class="p-message-icon" *ngIf="!msg.icon">
+                            <ng-container>
+                                <CheckIcon *ngIf="msg.severity === 'success'"/>
+                                <InfoCircleIcon *ngIf="msg.severity === 'info'"/>
+                                <TimesCircleIcon *ngIf="msg.severity === 'error'"/>
+                                <ExclamationTriangleIcon *ngIf="msg.severity === 'warn'"/>
+                            </ng-container>
+                        </span>
                         <ng-container *ngIf="!escape; else escapeOut">
                             <span *ngIf="msg.summary" class="p-message-summary" [innerHTML]="msg.summary"></span>
                             <span *ngIf="msg.detail" class="p-message-detail" [innerHTML]="msg.detail"></span>
@@ -185,7 +208,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
                             <span *ngIf="msg.detail" class="p-message-detail">{{ msg.detail }}</span>
                         </ng-template>
                         <button class="p-message-close p-link" (click)="removeMessage(i)" *ngIf="closable" type="button" pRipple>
-                            <i class="p-message-close-icon pi pi-times"></i>
+                            <TimesIcon [styleClass]="'p-message-close-icon'"/>
                         </button>
                     </div>
                 </div>
@@ -237,12 +260,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
 class MessagesModule {
 }
 MessagesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MessagesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-MessagesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.4", ngImport: i0, type: MessagesModule, declarations: [Messages], imports: [CommonModule, RippleModule], exports: [Messages] });
-MessagesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MessagesModule, imports: [CommonModule, RippleModule] });
+MessagesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.4", ngImport: i0, type: MessagesModule, declarations: [Messages], imports: [CommonModule, RippleModule, CheckIcon, InfoCircleIcon, TimesCircleIcon, ExclamationTriangleIcon, TimesIcon], exports: [Messages] });
+MessagesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MessagesModule, imports: [CommonModule, RippleModule, CheckIcon, InfoCircleIcon, TimesCircleIcon, ExclamationTriangleIcon, TimesIcon] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MessagesModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [CommonModule, RippleModule],
+                    imports: [CommonModule, RippleModule, CheckIcon, InfoCircleIcon, TimesCircleIcon, ExclamationTriangleIcon, TimesIcon],
                     exports: [Messages],
                     declarations: [Messages]
                 }]

package/fesm2020/primeng-messages.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"primeng-messages.mjs","sources":["../../src/app/components/messages/messages.ts","../../src/app/components/messages/primeng-messages.ts"],"sourcesContent":["import { NgModule, Component, OnDestroy, Input, Output, EventEmitter, AfterContentInit, Optional, ElementRef, ChangeDetectionStrategy, ContentChildren, QueryList, TemplateRef, ViewEncapsulation, ChangeDetectorRef } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { trigger, style, transition, animate } from '@angular/animations';\nimport { Message, PrimeTemplate, MessageService } from 'primeng/api';\nimport { Subscription, timer } from 'rxjs';\nimport { RippleModule } from 'primeng/ripple';\n\n@Component({\n    selector: 'p-messages',\n    template: `\n        <div class=\"p-messages p-component\" role=\"alert\" [ngStyle]=\"style\" [class]=\"styleClass\">\n            <ng-container *ngIf=\"!contentTemplate; else staticMessage\">\n                <div\n                    *ngFor=\"let msg of messages; let i = index\"\n                    [class]=\"'p-message p-message-' + msg.severity\"\n                    role=\"alert\"\n                    [@messageAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\n                >\n                    <div class=\"p-message-wrapper\">\n                        <span\n                            [class]=\"'p-message-icon pi' + (msg.icon ? ' ' + msg.icon : '')\"\n                            [ngClass]=\"{ 'pi-info-circle': msg.severity === 'info', 'pi-check': msg.severity === 'success', 'pi-exclamation-triangle': msg.severity === 'warn', 'pi-times-circle': msg.severity === 'error' }\"\n                        ></span>\n                        <ng-container *ngIf=\"!escape; else escapeOut\">\n                            <span *ngIf=\"msg.summary\" class=\"p-message-summary\" [innerHTML]=\"msg.summary\"></span>\n                            <span *ngIf=\"msg.detail\" class=\"p-message-detail\" [innerHTML]=\"msg.detail\"></span>\n                        </ng-container>\n                        <ng-template #escapeOut>\n                            <span *ngIf=\"msg.summary\" class=\"p-message-summary\">{{ msg.summary }}</span>\n                            <span *ngIf=\"msg.detail\" class=\"p-message-detail\">{{ msg.detail }}</span>\n                        </ng-template>\n                        <button class=\"p-message-close p-link\" (click)=\"removeMessage(i)\" *ngIf=\"closable\" type=\"button\" pRipple>\n                            <i class=\"p-message-close-icon pi pi-times\"></i>\n                        </button>\n                    </div>\n                </div>\n            </ng-container>\n            <ng-template #staticMessage>\n                <div [ngClass]=\"'p-message p-message-' + severity\" role=\"alert\">\n                    <div class=\"p-message-wrapper\">\n                        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n                    </div>\n                </div>\n            </ng-template>\n        </div>\n    `,\n    animations: [\n        trigger('messageAnimation', [\n            transition(':enter', [style({ opacity: 0, transform: 'translateY(-25%)' }), animate('{{showTransitionParams}}')]),\n            transition(':leave', [animate('{{hideTransitionParams}}', style({ height: 0, marginTop: 0, marginBottom: 0, marginLeft: 0, marginRight: 0, opacity: 0 }))])\n        ])\n    ],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./messages.css'],\n    host: {\n        class: 'p-element'\n    }\n})\nexport class Messages implements AfterContentInit, OnDestroy {\n    @Input() set value(messages: Message[]) {\n        this.messages = messages;\n        this.startMessageLifes(this.messages);\n    }\n\n    @Input() closable: boolean = true;\n\n    @Input() style: any;\n\n    @Input() styleClass: string;\n\n    @Input() enableService: boolean = true;\n\n    @Input() key: string;\n\n    @Input() escape: boolean = true;\n\n    @Input() severity: string;\n\n    @Input() showTransitionOptions: string = '300ms ease-out';\n\n    @Input() hideTransitionOptions: string = '200ms cubic-bezier(0.86, 0, 0.07, 1)';\n\n    @ContentChildren(PrimeTemplate) templates: QueryList<any>;\n\n    @Output() valueChange: EventEmitter<Message[]> = new EventEmitter<Message[]>();\n\n    messages: Message[];\n\n    messageSubscription: Subscription;\n\n    clearSubscription: Subscription;\n\n    timerSubscriptions: Subscription[] = [];\n\n    contentTemplate: TemplateRef<any>;\n\n    constructor(@Optional() public messageService: MessageService, public el: ElementRef, public cd: ChangeDetectorRef) {}\n\n    ngAfterContentInit() {\n        this.templates.forEach((item) => {\n            switch (item.getType()) {\n                case 'content':\n                    this.contentTemplate = item.template;\n                    break;\n\n                default:\n                    this.contentTemplate = item.template;\n                    break;\n            }\n        });\n\n        if (this.messageService && this.enableService && !this.contentTemplate) {\n            this.messageSubscription = this.messageService.messageObserver.subscribe((messages: Message | Message[]) => {\n                if (messages) {\n                    if (!Array.isArray(messages)) {\n                        messages = [messages];\n                    }\n\n                    const filteredMessages = messages.filter((m) => this.key === m.key);\n                    this.messages = this.messages ? [...this.messages, ...filteredMessages] : [...filteredMessages];\n                    this.startMessageLifes(filteredMessages);\n                    this.cd.markForCheck();\n                }\n            });\n\n            this.clearSubscription = this.messageService.clearObserver.subscribe((key) => {\n                if (key) {\n                    if (this.key === key) {\n                        this.messages = null;\n                    }\n                } else {\n                    this.messages = null;\n                }\n\n                this.cd.markForCheck();\n            });\n        }\n    }\n\n    hasMessages() {\n        let parentEl = this.el.nativeElement.parentElement;\n        if (parentEl && parentEl.offsetParent) {\n            return this.contentTemplate != null || (this.messages && this.messages.length > 0);\n        }\n\n        return false;\n    }\n\n    clear() {\n        this.messages = [];\n        this.valueChange.emit(this.messages);\n    }\n\n    removeMessage(i: number) {\n        this.messages = this.messages.filter((msg, index) => index !== i);\n        this.valueChange.emit(this.messages);\n    }\n\n    get icon(): string {\n        const severity = this.severity || (this.hasMessages() ? this.messages[0].severity : null);\n\n        if (this.hasMessages()) {\n            switch (severity) {\n                case 'success':\n                    return 'pi-check';\n\n                case 'info':\n                    return 'pi-info-circle';\n\n                case 'error':\n                    return 'pi-times';\n\n                case 'warn':\n                    return 'pi-exclamation-triangle';\n\n                default:\n                    return 'pi-info-circle';\n            }\n        }\n\n        return null;\n    }\n\n    ngOnDestroy() {\n        if (this.messageSubscription) {\n            this.messageSubscription.unsubscribe();\n        }\n\n        if (this.clearSubscription) {\n            this.clearSubscription.unsubscribe();\n        }\n\n        this.timerSubscriptions?.forEach((subscription) => subscription.unsubscribe());\n    }\n\n    private startMessageLifes(messages: Message[]): void {\n        messages?.forEach((message) => message.life && this.startMessageLife(message));\n    }\n\n    private startMessageLife(message: Message): void {\n        const timerSubsctiption = timer(message.life).subscribe(() => {\n            this.messages = this.messages?.filter((msgEl) => msgEl !== message);\n            this.timerSubscriptions = this.timerSubscriptions?.filter((timerEl) => timerEl !== timerSubsctiption);\n            this.valueChange.emit(this.messages);\n            this.cd.markForCheck();\n        });\n        this.timerSubscriptions.push(timerSubsctiption);\n    }\n}\n\n@NgModule({\n    imports: [CommonModule, RippleModule],\n    exports: [Messages],\n    declarations: [Messages]\n})\nexport class MessagesModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"primeng-messages.mjs","sources":["../../src/app/components/messages/messages.ts","../../src/app/components/messages/primeng-messages.ts"],"sourcesContent":["import { NgModule, Component, OnDestroy, Input, Output, EventEmitter, AfterContentInit, Optional, ElementRef, ChangeDetectionStrategy, ContentChildren, QueryList, TemplateRef, ViewEncapsulation, ChangeDetectorRef } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { trigger, style, transition, animate } from '@angular/animations';\nimport { Message, PrimeTemplate, MessageService } from 'primeng/api';\nimport { Subscription, timer } from 'rxjs';\nimport { RippleModule } from 'primeng/ripple';\nimport { CheckIcon } from 'primeng/icons/check';\nimport { InfoCircleIcon } from 'primeng/icons/infocircle';\nimport { TimesCircleIcon } from 'primeng/icons/timescircle';\nimport { ExclamationTriangleIcon } from 'primeng/icons/exclamationtriangle';\nimport { TimesIcon } from 'primeng/icons/times';\n\n@Component({\n    selector: 'p-messages',\n    template: `\n        <div class=\"p-messages p-component\" role=\"alert\" [ngStyle]=\"style\" [class]=\"styleClass\">\n            <ng-container *ngIf=\"!contentTemplate; else staticMessage\">\n                <div\n                    *ngFor=\"let msg of messages; let i = index\"\n                    [class]=\"'p-message p-message-' + msg.severity\"\n                    role=\"alert\"\n                    [@messageAnimation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\n                >\n                    <div class=\"p-message-wrapper\">\n                        <span\n                            *ngIf=\"msg.icon\"\n                            [class]=\"'p-message-icon pi ' + msg.icon\"\n                        >\n                        </span>\n                        <span class=\"p-message-icon\" *ngIf=\"!msg.icon\">\n                            <ng-container>\n                                <CheckIcon *ngIf=\"msg.severity === 'success'\"/>\n                                <InfoCircleIcon *ngIf=\"msg.severity === 'info'\"/>\n                                <TimesCircleIcon *ngIf=\"msg.severity === 'error'\"/>\n                                <ExclamationTriangleIcon *ngIf=\"msg.severity === 'warn'\"/>\n                            </ng-container>\n                        </span>\n                        <ng-container *ngIf=\"!escape; else escapeOut\">\n                            <span *ngIf=\"msg.summary\" class=\"p-message-summary\" [innerHTML]=\"msg.summary\"></span>\n                            <span *ngIf=\"msg.detail\" class=\"p-message-detail\" [innerHTML]=\"msg.detail\"></span>\n                        </ng-container>\n                        <ng-template #escapeOut>\n                            <span *ngIf=\"msg.summary\" class=\"p-message-summary\">{{ msg.summary }}</span>\n                            <span *ngIf=\"msg.detail\" class=\"p-message-detail\">{{ msg.detail }}</span>\n                        </ng-template>\n                        <button class=\"p-message-close p-link\" (click)=\"removeMessage(i)\" *ngIf=\"closable\" type=\"button\" pRipple>\n                            <TimesIcon [styleClass]=\"'p-message-close-icon'\"/>\n                        </button>\n                    </div>\n                </div>\n            </ng-container>\n            <ng-template #staticMessage>\n                <div [ngClass]=\"'p-message p-message-' + severity\" role=\"alert\">\n                    <div class=\"p-message-wrapper\">\n                        <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\n                    </div>\n                </div>\n            </ng-template>\n        </div>\n    `,\n    animations: [\n        trigger('messageAnimation', [\n            transition(':enter', [style({ opacity: 0, transform: 'translateY(-25%)' }), animate('{{showTransitionParams}}')]),\n            transition(':leave', [animate('{{hideTransitionParams}}', style({ height: 0, marginTop: 0, marginBottom: 0, marginLeft: 0, marginRight: 0, opacity: 0 }))])\n        ])\n    ],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./messages.css'],\n    host: {\n        class: 'p-element'\n    }\n})\nexport class Messages implements AfterContentInit, OnDestroy {\n    @Input() set value(messages: Message[]) {\n        this.messages = messages;\n        this.startMessageLifes(this.messages);\n    }\n\n    @Input() closable: boolean = true;\n\n    @Input() style: any;\n\n    @Input() styleClass: string;\n\n    @Input() enableService: boolean = true;\n\n    @Input() key: string;\n\n    @Input() escape: boolean = true;\n\n    @Input() severity: string;\n\n    @Input() showTransitionOptions: string = '300ms ease-out';\n\n    @Input() hideTransitionOptions: string = '200ms cubic-bezier(0.86, 0, 0.07, 1)';\n\n    @ContentChildren(PrimeTemplate) templates: QueryList<any>;\n\n    @Output() valueChange: EventEmitter<Message[]> = new EventEmitter<Message[]>();\n\n    messages: Message[];\n\n    messageSubscription: Subscription;\n\n    clearSubscription: Subscription;\n\n    timerSubscriptions: Subscription[] = [];\n\n    contentTemplate: TemplateRef<any>;\n\n    constructor(@Optional() public messageService: MessageService, public el: ElementRef, public cd: ChangeDetectorRef) {}\n\n    ngAfterContentInit() {\n        this.templates.forEach((item) => {\n            switch (item.getType()) {\n                case 'content':\n                    this.contentTemplate = item.template;\n                    break;\n\n                default:\n                    this.contentTemplate = item.template;\n                    break;\n            }\n        });\n\n        if (this.messageService && this.enableService && !this.contentTemplate) {\n            this.messageSubscription = this.messageService.messageObserver.subscribe((messages: Message | Message[]) => {\n                if (messages) {\n                    if (!Array.isArray(messages)) {\n                        messages = [messages];\n                    }\n\n                    const filteredMessages = messages.filter((m) => this.key === m.key);\n                    this.messages = this.messages ? [...this.messages, ...filteredMessages] : [...filteredMessages];\n                    this.startMessageLifes(filteredMessages);\n                    this.cd.markForCheck();\n                }\n            });\n\n            this.clearSubscription = this.messageService.clearObserver.subscribe((key) => {\n                if (key) {\n                    if (this.key === key) {\n                        this.messages = null;\n                    }\n                } else {\n                    this.messages = null;\n                }\n\n                this.cd.markForCheck();\n            });\n        }\n    }\n\n    hasMessages() {\n        let parentEl = this.el.nativeElement.parentElement;\n        if (parentEl && parentEl.offsetParent) {\n            return this.contentTemplate != null || (this.messages && this.messages.length > 0);\n        }\n\n        return false;\n    }\n\n    clear() {\n        this.messages = [];\n        this.valueChange.emit(this.messages);\n    }\n\n    removeMessage(i: number) {\n        this.messages = this.messages.filter((msg, index) => index !== i);\n        this.valueChange.emit(this.messages);\n    }\n\n    get icon(): string {\n        const severity = this.severity || (this.hasMessages() ? this.messages[0].severity : null);\n\n        if (this.hasMessages()) {\n            switch (severity) {\n                case 'success':\n                    return 'pi-check';\n\n                case 'info':\n                    return 'pi-info-circle';\n\n                case 'error':\n                    return 'pi-times';\n\n                case 'warn':\n                    return 'pi-exclamation-triangle';\n\n                default:\n                    return 'pi-info-circle';\n            }\n        }\n\n        return null;\n    }\n\n    ngOnDestroy() {\n        if (this.messageSubscription) {\n            this.messageSubscription.unsubscribe();\n        }\n\n        if (this.clearSubscription) {\n            this.clearSubscription.unsubscribe();\n        }\n\n        this.timerSubscriptions?.forEach((subscription) => subscription.unsubscribe());\n    }\n\n    private startMessageLifes(messages: Message[]): void {\n        messages?.forEach((message) => message.life && this.startMessageLife(message));\n    }\n\n    private startMessageLife(message: Message): void {\n        const timerSubsctiption = timer(message.life).subscribe(() => {\n            this.messages = this.messages?.filter((msgEl) => msgEl !== message);\n            this.timerSubscriptions = this.timerSubscriptions?.filter((timerEl) => timerEl !== timerSubsctiption);\n            this.valueChange.emit(this.messages);\n            this.cd.markForCheck();\n        });\n        this.timerSubscriptions.push(timerSubsctiption);\n    }\n}\n\n@NgModule({\n    imports: [CommonModule, RippleModule, CheckIcon, InfoCircleIcon, TimesCircleIcon, ExclamationTriangleIcon, TimesIcon],\n    exports: [Messages],\n    declarations: [Messages]\n})\nexport class MessagesModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2020/primeng-multiselect.mjs

@@ -15,6 +15,11 @@ import { ScrollerModule } from 'primeng/scroller';
 import * as i5 from 'primeng/tooltip';
 import { TooltipModule } from 'primeng/tooltip';
 import { ObjectUtils } from 'primeng/utils';
+import { CheckIcon } from 'primeng/icons/check';
+import { SearchIcon } from 'primeng/icons/search';
+import { TimesCircleIcon } from 'primeng/icons/timescircle';
+import { TimesIcon } from 'primeng/icons/times';
+import { ChevronDownIcon } from 'primeng/icons/chevrondown';
 
 const MULTISELECT_VALUE_ACCESSOR = {
     provide: NG_VALUE_ACCESSOR,
@@ -41,7 +46,7 @@ class MultiSelectItem {
     }
 }
 MultiSelectItem.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MultiSelectItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
-MultiSelectItem.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.4", type: MultiSelectItem, selector: "p-multiSelectItem", inputs: { option: "option", selected: "selected", label: "label", disabled: "disabled", itemSize: "itemSize", template: "template" }, outputs: { onClick: "onClick", onKeydown: "onKeydown" }, host: { classAttribute: "p-element" }, ngImport: i0, template: `
+MultiSelectItem.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.4", type: MultiSelectItem, selector: "p-multiSelectItem", inputs: { option: "option", selected: "selected", label: "label", disabled: "disabled", itemSize: "itemSize", template: "template", checkIconTemplate: "checkIconTemplate" }, outputs: { onClick: "onClick", onKeydown: "onKeydown" }, host: { classAttribute: "p-element" }, ngImport: i0, template: `
         <li
             class="p-multiselect-item"
             (click)="onOptionClick($event)"
@@ -54,13 +59,18 @@ MultiSelectItem.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
         >
             <div class="p-checkbox p-component">
                 <div class="p-checkbox-box" [ngClass]="{ 'p-highlight': selected }">
-                    <span class="p-checkbox-icon" [ngClass]="{ 'pi pi-check': selected }"></span>
+                    <ng-container *ngIf="selected">    
+                        <CheckIcon *ngIf="!checkIconTemplate" [styleClass]="'p-checkbox-icon'"/>
+                        <span *ngIf="checkIconTemplate" class="p-checkbox-icon">
+                            <ng-template *ngTemplateOutlet="checkIconTemplate"></ng-template>
+                        </span>
+                    </ng-container>
                 </div>
             </div>
             <span *ngIf="!template">{{ label }}</span>
             <ng-container *ngTemplateOutlet="template; context: { $implicit: option }"></ng-container>
         </li>
-    `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.Ripple, selector: "[pRipple]" }], encapsulation: i0.ViewEncapsulation.None });
+    `, isInline: true, dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i1.NgClass; }), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgTemplateOutlet; }), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgStyle; }), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.Ripple; }), selector: "[pRipple]" }, { kind: "component", type: i0.forwardRef(function () { return CheckIcon; }), selector: "CheckIcon" }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MultiSelectItem, decorators: [{
             type: Component,
             args: [{
@@ -78,7 +88,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
         >
             <div class="p-checkbox p-component">
                 <div class="p-checkbox-box" [ngClass]="{ 'p-highlight': selected }">
-                    <span class="p-checkbox-icon" [ngClass]="{ 'pi pi-check': selected }"></span>
+                    <ng-container *ngIf="selected">    
+                        <CheckIcon *ngIf="!checkIconTemplate" [styleClass]="'p-checkbox-icon'"/>
+                        <span *ngIf="checkIconTemplate" class="p-checkbox-icon">
+                            <ng-template *ngTemplateOutlet="checkIconTemplate"></ng-template>
+                        </span>
+                    </ng-container>
                 </div>
             </div>
             <span *ngIf="!template">{{ label }}</span>
@@ -102,6 +117,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
                 type: Input
             }], template: [{
                 type: Input
+            }], checkIconTemplate: [{
+                type: Input
             }], onClick: [{
                 type: Output
             }], onKeydown: [{
@@ -124,7 +141,6 @@ class MultiSelect {
         this.emptyFilterMessage = '';
         this.emptyMessage = '';
         this.resetFilterOnHide = false;
-        this.dropdownIcon = 'pi pi-chevron-down';
         this.optionGroupChildren = 'items';
         this.showHeader = true;
         this.scrollHeight = '200px';
@@ -252,6 +268,24 @@ class MultiSelect {
                 case 'loader':
                     this.loaderTemplate = item.template;
                     break;
+                case 'checkicon':
+                    this.checkIconTemplate = item.template;
+                    break;
+                case 'filtericon':
+                    this.filterIconTemplate = item.template;
+                    break;
+                case 'removetokenicon':
+                    this.removeTokenIconTemplate = item.template;
+                    break;
+                case 'closeicon':
+                    this.closeIconTemplate = item.template;
+                    break;
+                case 'clearicon':
+                    this.clearIconTemplate = item.tempate;
+                    break;
+                case 'dropdownicon':
+                    this.dropdownIconTemplate = item.template;
+                    break;
                 default:
                     this.itemTemplate = item.template;
                     break;
@@ -786,17 +820,33 @@ MultiSelect.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
                         <ng-container *ngIf="display === 'chip'">
                             <div #token *ngFor="let item of value; let i = index" class="p-multiselect-token">
                                 <span class="p-multiselect-token-label">{{ findLabelByValue(item) }}</span>
-                                <span *ngIf="!disabled" class="p-multiselect-token-icon pi pi-times-circle" (click)="removeChip(item, $event)"></span>
+                                <ng-container *ngIf="!disabled">
+                                    <TimesCircleIcon *ngIf="!removeTokenIconTemplate" [styleClass]="'p-multiselect-token-icon'" (click)="removeChip(item,event)"/>
+                                    <span *ngIf="removeTokenIconTemplate" class="p-multiselect-token-icon" (click)="removeChip(item,event)">
+                                        <ng-container *ngTemplateOutlet="removeTokenIconTemplate"></ng-container>
+                                    </span>
+                                </ng-container>
                             </div>
                             <ng-container *ngIf="!value || value.length === 0">{{ placeholder || defaultLabel || 'empty' }}</ng-container>
                         </ng-container>
                     </ng-container>
                     <ng-container *ngTemplateOutlet="selectedItemsTemplate; context: { $implicit: value }"></ng-container>
                 </div>
-                <i *ngIf="value != null && filled && !disabled && showClear" class="p-multiselect-clear-icon pi pi-times" (click)="clear($event)"></i>
+                <ng-container  *ngIf="value != null && filled && !disabled && showClear">
+                <TimesIcon *ngIf="!clearIconTemplate" [styleClass]="'p-multiselect-clear-icon'" (click)="clear($event)" />
+                <span *ngIf="clearIconTemplate" class="p-multiselect-clear-icon" (click)="clear($event)">
+                    <ng-tempate *ngTemplateOutlet="clearIconTemplate"></ng-tempate>
+                </span>
+                </ng-container>
             </div>
             <div [ngClass]="{ 'p-multiselect-trigger': true }">
-                <span class="p-multiselect-trigger-icon" [ngClass]="dropdownIcon"></span>
+                <ng-container *ngIf="!dropdownIconTemplate"> 
+                <span *ngIf="dropdownIcon" class="p-multiselect-trigger-icon" [ngClass]="dropdownIcon"></span>
+                <ChevronDownIcon *ngIf="!dropdownIcon" [styleClass]="'p-multiselect-trigger-icon'" />
+            </ng-container>
+            <span *ngIf="dropdownIconTemplate" class="p-multiselect-trigger-icon">
+                <ng-template *ngTemplateOutlet="dropdownIconTemplate"></ng-template>
+            </span>
             </div>
             <p-overlay
                 #overlay
@@ -839,7 +889,12 @@ MultiSelect.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
                                         [ngClass]="{ 'p-highlight': allChecked, 'p-focus': headerCheckboxFocus, 'p-disabled': disabled || toggleAllDisabled }"
                                         (click)="toggleAll($event)"
                                     >
-                                        <span class="p-checkbox-icon" [ngClass]="{ 'pi pi-check': allChecked }"></span>
+                                    <ng-container *ngIf="allChecked">
+                                        <CheckIcon [styleClass]="'p-checkbox-icon'" *ngIf="!checkIconTemplate" />
+                                        <span *ngIf="checkIconTemplate" class="p-checkbox-icon">
+                                            <ng-template *ngTemplateOutlet="checkIconTemplate"></ng-template>
+                                        </span>
+                                        </ng-container>
                                     </div>
                                 </div>
                                 <div class="p-multiselect-filter-container" *ngIf="filter">
@@ -855,10 +910,17 @@ MultiSelect.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
                                         [attr.placeholder]="filterPlaceHolder"
                                         [attr.aria-label]="ariaFilterLabel"
                                     />
-                                    <span class="p-multiselect-filter-icon pi pi-search"></span>
+                                    <SearchIcon [styleClass]="'p-multiselect-filter-icon'" *ngIf="!filterIconTemplate"/>
+                                    <span *ngIf="filterIconTemplate" class="p-multiselect-filter-icon">
+                                        <ng-template *ngTemplateOutlet="filterIconTemplate"></ng-template>
+                                    </span>
                                 </div>
-                                <button class="p-multiselect-close p-link" type="button" (click)="close($event)" pRipple>
-                                    <span class="p-multiselect-close-icon pi pi-times"></span>
+
+                                <button class="p-multiselect-close p-link p-button-icon-only" type="button" (click)="close($event)" pRipple>
+                                    <TimesIcon [styleClass]="'p-multiselect-close-icon'" *ngIf="!closeIconTemplate"/>
+                                    <span *ngIf="closeIconTemplate" class="p-multiselect-close-icon">
+                                        <ng-tempate *ngTemplateOutlet="closeIconTemplate"></ng-tempate>
+                                    </span>
                                 </button>
                             </ng-template>
                         </div>
@@ -912,6 +974,7 @@ MultiSelect.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
                                                 (onClick)="onOptionClick($event)"
                                                 (onKeydown)="onOptionKeydown($event)"
                                                 [template]="itemTemplate"
+                                                [checkIconTemplate]="checkIconTemplate"
                                                 [itemSize]="scrollerOptions.itemSize"
                                             ></p-multiSelectItem>
                                         </ng-template>
@@ -939,7 +1002,7 @@ MultiSelect.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
                 </ng-template>
             </p-overlay>
         </div>
-    `, isInline: true, styles: [".p-multiselect{display:inline-flex;cursor:pointer;position:relative;-webkit-user-select:none;user-select:none}.p-multiselect-trigger{display:flex;align-items:center;justify-content:center;flex-shrink:0}.p-multiselect-label-container{overflow:hidden;flex:1 1 auto;cursor:pointer}.p-multiselect-label{display:block;white-space:nowrap;cursor:pointer;overflow:hidden;text-overflow:ellipsis}.p-multiselect-chip .p-multiselect-label{display:flex}.p-multiselect-label-empty{overflow:hidden;visibility:hidden}.p-multiselect-token{cursor:default;display:inline-flex;align-items:center;flex:0 0 auto}.p-multiselect-token-icon{cursor:pointer}.p-multiselect-items-wrapper{overflow:auto}.p-multiselect-items{margin:0;padding:0;list-style-type:none}.p-multiselect-item{cursor:pointer;display:flex;align-items:center;font-weight:400;white-space:nowrap;position:relative;overflow:hidden}.p-multiselect-header{display:flex;align-items:center;justify-content:space-between}.p-multiselect-filter-container{position:relative;flex:1 1 auto}.p-multiselect-filter-icon{position:absolute;top:50%;margin-top:-.5rem}.p-multiselect-filter-container .p-inputtext{width:100%}.p-multiselect-close{display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;position:relative}.p-fluid .p-multiselect{display:flex}.p-multiselect-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}.p-multiselect-clearable{position:relative}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.Overlay, selector: "p-overlay", inputs: ["visible", "mode", "style", "styleClass", "contentStyle", "contentStyleClass", "target", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "listener", "responsive", "options"], outputs: ["visibleChange", "onBeforeShow", "onShow", "onBeforeHide", "onHide", "onAnimationStart", "onAnimationDone"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i5.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i2.Ripple, selector: "[pRipple]" }, { kind: "component", type: i6.Scroller, selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "component", type: MultiSelectItem, selector: "p-multiSelectItem", inputs: ["option", "selected", "label", "disabled", "itemSize", "template"], outputs: ["onClick", "onKeydown"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    `, isInline: true, styles: [".p-multiselect{display:inline-flex;cursor:pointer;position:relative;-webkit-user-select:none;user-select:none}.p-multiselect-trigger{display:flex;align-items:center;justify-content:center;flex-shrink:0}.p-multiselect-label-container{overflow:hidden;flex:1 1 auto;cursor:pointer}.p-multiselect-label{display:block;white-space:nowrap;cursor:pointer;overflow:hidden;text-overflow:ellipsis}.p-multiselect-label-empty{overflow:hidden;visibility:hidden}.p-multiselect-token{cursor:default;display:inline-flex;align-items:center;flex:0 0 auto}.p-multiselect-token-icon{cursor:pointer}.p-multiselect-items-wrapper{overflow:auto}.p-multiselect-items{margin:0;padding:0;list-style-type:none}.p-multiselect-item{cursor:pointer;display:flex;align-items:center;font-weight:400;white-space:nowrap;position:relative;overflow:hidden}.p-multiselect-header{display:flex;align-items:center;justify-content:space-between}.p-multiselect-filter-container{position:relative;flex:1 1 auto}.p-multiselect-filter-icon{position:absolute;top:50%;margin-top:-.5rem}.p-multiselect-filter-container .p-inputtext{width:100%}.p-multiselect-close{display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;position:relative}.p-fluid .p-multiselect{display:flex}.p-multiselect-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}.p-multiselect-clearable{position:relative}\n"], dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i1.NgClass; }), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgTemplateOutlet; }), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i0.forwardRef(function () { return i1.NgStyle; }), selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i0.forwardRef(function () { return i4.Overlay; }), selector: "p-overlay", inputs: ["visible", "mode", "style", "styleClass", "contentStyle", "contentStyleClass", "target", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "listener", "responsive", "options"], outputs: ["visibleChange", "onBeforeShow", "onShow", "onBeforeHide", "onHide", "onAnimationStart", "onAnimationDone"] }, { kind: "directive", type: i0.forwardRef(function () { return i3.PrimeTemplate; }), selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i5.Tooltip; }), selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.Ripple; }), selector: "[pRipple]" }, { kind: "component", type: i0.forwardRef(function () { return i6.Scroller; }), selector: "p-scroller", inputs: ["id", "style", "styleClass", "tabindex", "items", "itemSize", "scrollHeight", "scrollWidth", "orientation", "step", "delay", "resizeDelay", "appendOnly", "inline", "lazy", "disabled", "loaderDisabled", "columns", "showSpacer", "showLoader", "numToleratedItems", "loading", "autoSize", "trackBy", "options"], outputs: ["onLazyLoad", "onScroll", "onScrollIndexChange"] }, { kind: "component", type: i0.forwardRef(function () { return CheckIcon; }), selector: "CheckIcon" }, { kind: "component", type: i0.forwardRef(function () { return SearchIcon; }), selector: "SearchIcon" }, { kind: "component", type: i0.forwardRef(function () { return TimesCircleIcon; }), selector: "TimesCircleIcon" }, { kind: "component", type: i0.forwardRef(function () { return TimesIcon; }), selector: "TimesIcon" }, { kind: "component", type: i0.forwardRef(function () { return ChevronDownIcon; }), selector: "ChevronDownIcon" }, { kind: "component", type: i0.forwardRef(function () { return MultiSelectItem; }), selector: "p-multiSelectItem", inputs: ["option", "selected", "label", "disabled", "itemSize", "template", "checkIconTemplate"], outputs: ["onClick", "onKeydown"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MultiSelect, decorators: [{
             type: Component,
             args: [{ selector: 'p-multiSelect', template: `
@@ -979,17 +1042,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
                         <ng-container *ngIf="display === 'chip'">
                             <div #token *ngFor="let item of value; let i = index" class="p-multiselect-token">
                                 <span class="p-multiselect-token-label">{{ findLabelByValue(item) }}</span>
-                                <span *ngIf="!disabled" class="p-multiselect-token-icon pi pi-times-circle" (click)="removeChip(item, $event)"></span>
+                                <ng-container *ngIf="!disabled">
+                                    <TimesCircleIcon *ngIf="!removeTokenIconTemplate" [styleClass]="'p-multiselect-token-icon'" (click)="removeChip(item,event)"/>
+                                    <span *ngIf="removeTokenIconTemplate" class="p-multiselect-token-icon" (click)="removeChip(item,event)">
+                                        <ng-container *ngTemplateOutlet="removeTokenIconTemplate"></ng-container>
+                                    </span>
+                                </ng-container>
                             </div>
                             <ng-container *ngIf="!value || value.length === 0">{{ placeholder || defaultLabel || 'empty' }}</ng-container>
                         </ng-container>
                     </ng-container>
                     <ng-container *ngTemplateOutlet="selectedItemsTemplate; context: { $implicit: value }"></ng-container>
                 </div>
-                <i *ngIf="value != null && filled && !disabled && showClear" class="p-multiselect-clear-icon pi pi-times" (click)="clear($event)"></i>
+                <ng-container  *ngIf="value != null && filled && !disabled && showClear">
+                <TimesIcon *ngIf="!clearIconTemplate" [styleClass]="'p-multiselect-clear-icon'" (click)="clear($event)" />
+                <span *ngIf="clearIconTemplate" class="p-multiselect-clear-icon" (click)="clear($event)">
+                    <ng-tempate *ngTemplateOutlet="clearIconTemplate"></ng-tempate>
+                </span>
+                </ng-container>
             </div>
             <div [ngClass]="{ 'p-multiselect-trigger': true }">
-                <span class="p-multiselect-trigger-icon" [ngClass]="dropdownIcon"></span>
+                <ng-container *ngIf="!dropdownIconTemplate"> 
+                <span *ngIf="dropdownIcon" class="p-multiselect-trigger-icon" [ngClass]="dropdownIcon"></span>
+                <ChevronDownIcon *ngIf="!dropdownIcon" [styleClass]="'p-multiselect-trigger-icon'" />
+            </ng-container>
+            <span *ngIf="dropdownIconTemplate" class="p-multiselect-trigger-icon">
+                <ng-template *ngTemplateOutlet="dropdownIconTemplate"></ng-template>
+            </span>
             </div>
             <p-overlay
                 #overlay
@@ -1032,7 +1111,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
                                         [ngClass]="{ 'p-highlight': allChecked, 'p-focus': headerCheckboxFocus, 'p-disabled': disabled || toggleAllDisabled }"
                                         (click)="toggleAll($event)"
                                     >
-                                        <span class="p-checkbox-icon" [ngClass]="{ 'pi pi-check': allChecked }"></span>
+                                    <ng-container *ngIf="allChecked">
+                                        <CheckIcon [styleClass]="'p-checkbox-icon'" *ngIf="!checkIconTemplate" />
+                                        <span *ngIf="checkIconTemplate" class="p-checkbox-icon">
+                                            <ng-template *ngTemplateOutlet="checkIconTemplate"></ng-template>
+                                        </span>
+                                        </ng-container>
                                     </div>
                                 </div>
                                 <div class="p-multiselect-filter-container" *ngIf="filter">
@@ -1048,10 +1132,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
                                         [attr.placeholder]="filterPlaceHolder"
                                         [attr.aria-label]="ariaFilterLabel"
                                     />
-                                    <span class="p-multiselect-filter-icon pi pi-search"></span>
+                                    <SearchIcon [styleClass]="'p-multiselect-filter-icon'" *ngIf="!filterIconTemplate"/>
+                                    <span *ngIf="filterIconTemplate" class="p-multiselect-filter-icon">
+                                        <ng-template *ngTemplateOutlet="filterIconTemplate"></ng-template>
+                                    </span>
                                 </div>
-                                <button class="p-multiselect-close p-link" type="button" (click)="close($event)" pRipple>
-                                    <span class="p-multiselect-close-icon pi pi-times"></span>
+
+                                <button class="p-multiselect-close p-link p-button-icon-only" type="button" (click)="close($event)" pRipple>
+                                    <TimesIcon [styleClass]="'p-multiselect-close-icon'" *ngIf="!closeIconTemplate"/>
+                                    <span *ngIf="closeIconTemplate" class="p-multiselect-close-icon">
+                                        <ng-tempate *ngTemplateOutlet="closeIconTemplate"></ng-tempate>
+                                    </span>
                                 </button>
                             </ng-template>
                         </div>
@@ -1105,6 +1196,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
                                                 (onClick)="onOptionClick($event)"
                                                 (onKeydown)="onOptionKeydown($event)"
                                                 [template]="itemTemplate"
+                                                [checkIconTemplate]="checkIconTemplate"
                                                 [itemSize]="scrollerOptions.itemSize"
                                             ></p-multiSelectItem>
                                         </ng-template>
@@ -1137,7 +1229,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
                         '[class.p-inputwrapper-filled]': 'filled',
                         '[class.p-inputwrapper-focus]': 'focus || overlayVisible',
                         '[class.p-multiselect-clearable]': 'showClear && !disabled'
-                    }, providers: [MULTISELECT_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".p-multiselect{display:inline-flex;cursor:pointer;position:relative;-webkit-user-select:none;user-select:none}.p-multiselect-trigger{display:flex;align-items:center;justify-content:center;flex-shrink:0}.p-multiselect-label-container{overflow:hidden;flex:1 1 auto;cursor:pointer}.p-multiselect-label{display:block;white-space:nowrap;cursor:pointer;overflow:hidden;text-overflow:ellipsis}.p-multiselect-chip .p-multiselect-label{display:flex}.p-multiselect-label-empty{overflow:hidden;visibility:hidden}.p-multiselect-token{cursor:default;display:inline-flex;align-items:center;flex:0 0 auto}.p-multiselect-token-icon{cursor:pointer}.p-multiselect-items-wrapper{overflow:auto}.p-multiselect-items{margin:0;padding:0;list-style-type:none}.p-multiselect-item{cursor:pointer;display:flex;align-items:center;font-weight:400;white-space:nowrap;position:relative;overflow:hidden}.p-multiselect-header{display:flex;align-items:center;justify-content:space-between}.p-multiselect-filter-container{position:relative;flex:1 1 auto}.p-multiselect-filter-icon{position:absolute;top:50%;margin-top:-.5rem}.p-multiselect-filter-container .p-inputtext{width:100%}.p-multiselect-close{display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;position:relative}.p-fluid .p-multiselect{display:flex}.p-multiselect-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}.p-multiselect-clearable{position:relative}\n"] }]
+                    }, providers: [MULTISELECT_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".p-multiselect{display:inline-flex;cursor:pointer;position:relative;-webkit-user-select:none;user-select:none}.p-multiselect-trigger{display:flex;align-items:center;justify-content:center;flex-shrink:0}.p-multiselect-label-container{overflow:hidden;flex:1 1 auto;cursor:pointer}.p-multiselect-label{display:block;white-space:nowrap;cursor:pointer;overflow:hidden;text-overflow:ellipsis}.p-multiselect-label-empty{overflow:hidden;visibility:hidden}.p-multiselect-token{cursor:default;display:inline-flex;align-items:center;flex:0 0 auto}.p-multiselect-token-icon{cursor:pointer}.p-multiselect-items-wrapper{overflow:auto}.p-multiselect-items{margin:0;padding:0;list-style-type:none}.p-multiselect-item{cursor:pointer;display:flex;align-items:center;font-weight:400;white-space:nowrap;position:relative;overflow:hidden}.p-multiselect-header{display:flex;align-items:center;justify-content:space-between}.p-multiselect-filter-container{position:relative;flex:1 1 auto}.p-multiselect-filter-icon{position:absolute;top:50%;margin-top:-.5rem}.p-multiselect-filter-container .p-inputtext{width:100%}.p-multiselect-close{display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;position:relative}.p-fluid .p-multiselect{display:flex}.p-multiselect-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}.p-multiselect-clearable{position:relative}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i3.FilterService }, { type: i3.PrimeNGConfig }, { type: i3.OverlayService }]; }, propDecorators: { style: [{
                 type: Input
             }], styleClass: [{
@@ -1307,12 +1399,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImpor
 class MultiSelectModule {
 }
 MultiSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MultiSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-MultiSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.4", ngImport: i0, type: MultiSelectModule, declarations: [MultiSelect, MultiSelectItem], imports: [CommonModule, OverlayModule, SharedModule, TooltipModule, RippleModule, ScrollerModule], exports: [MultiSelect, OverlayModule, SharedModule, ScrollerModule] });
-MultiSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MultiSelectModule, imports: [CommonModule, OverlayModule, SharedModule, TooltipModule, RippleModule, ScrollerModule, OverlayModule, SharedModule, ScrollerModule] });
+MultiSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.4", ngImport: i0, type: MultiSelectModule, declarations: [MultiSelect, MultiSelectItem], imports: [CommonModule, OverlayModule, SharedModule, TooltipModule, RippleModule, ScrollerModule, CheckIcon, SearchIcon, TimesCircleIcon, TimesIcon, ChevronDownIcon, CheckIcon], exports: [MultiSelect, OverlayModule, SharedModule, ScrollerModule] });
+MultiSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MultiSelectModule, imports: [CommonModule, OverlayModule, SharedModule, TooltipModule, RippleModule, ScrollerModule, CheckIcon, SearchIcon, TimesCircleIcon, TimesIcon, ChevronDownIcon, CheckIcon, OverlayModule, SharedModule, ScrollerModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.4", ngImport: i0, type: MultiSelectModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [CommonModule, OverlayModule, SharedModule, TooltipModule, RippleModule, ScrollerModule],
+                    imports: [CommonModule, OverlayModule, SharedModule, TooltipModule, RippleModule, ScrollerModule, CheckIcon, SearchIcon, TimesCircleIcon, TimesIcon, ChevronDownIcon, CheckIcon],
                     exports: [MultiSelect, OverlayModule, SharedModule, ScrollerModule],
                     declarations: [MultiSelect, MultiSelectItem]
                 }]