primeng 18.0.0 → 18.0.2

package/fesm2022/primeng-orderlist.mjs

@@ -2,14 +2,14 @@ import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
 import * as i1 from '@angular/common';
 import { isPlatformBrowser, CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, inject, numberAttribute, booleanAttribute, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, ViewChild, ContentChild, NgModule } from '@angular/core';
+import { Injectable, EventEmitter, inject, numberAttribute, booleanAttribute, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, ViewChild, ContentChild, ContentChildren, NgModule } from '@angular/core';
 import * as i2 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import { uuid, find, scrollInView, findIndexInList, insertIntoOrderedArray, findSingle, hasClass, isHidden, setAttribute } from '@primeuix/utils';
-import { FilterService, SharedModule } from 'primeng/api';
+import { FilterService, PrimeTemplate, SharedModule } from 'primeng/api';
 import { BaseComponent } from 'primeng/basecomponent';
 import { ButtonDirective } from 'primeng/button';
-import { AngleDoubleDownIcon, AngleDoubleUpIcon, AngleUpIcon, AngleDownIcon, SearchIcon } from 'primeng/icons';
+import { AngleDoubleDownIcon, AngleDoubleUpIcon, AngleUpIcon, AngleDownIcon } from 'primeng/icons';
 import { Listbox } from 'primeng/listbox';
 import { Ripple } from 'primeng/ripple';
 import { BaseStyle } from 'primeng/base';
@@ -119,7 +119,7 @@ function OrderList_ng_container_17_ng_template_1_Template(rf, ctx) { if (rf & 1)
     i0.ɵɵtemplate(0, OrderList_ng_container_17_ng_template_1_0_Template, 1, 0, null, 7);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.headerTemplate);
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.headerTemplate || ctx_r1._headerTemplate);
 } }
 function OrderList_ng_container_17_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -137,7 +137,7 @@ function OrderList_ng_container_18_ng_template_1_Template(rf, ctx) { if (rf & 1)
     const selected_r4 = ctx.selected;
     const index_r5 = ctx.index;
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.itemTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c12, option_r3, selected_r4, index_r5));
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.itemTemplate || ctx_r1._itemTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c12, option_r3, selected_r4, index_r5));
 } }
 function OrderList_ng_container_18_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -355,12 +355,12 @@ class OrderList extends BaseComponent {
      * Custom empty template.
      * @group Templates
      */
-    emptymessageTemplate;
+    emptyMessageTemplate;
     /**
      * Custom empty filter template.
      * @group Templates
      */
-    emptyfiltermessageTemplate;
+    emptyFilterMessageTemplate;
     /**
      * Custom filter template.
      * @group Templates
@@ -375,27 +375,27 @@ class OrderList extends BaseComponent {
      * Custom move up icon template.
      * @group Templates
      */
-    moveupiconTemplate;
+    moveUpIconTemplate;
     /**
      * Custom move top icon template.
      * @group Templates
      */
-    movetopiconTemplate;
+    moveTopIconTemplate;
     /**
      * Custom move down icon template.
      * @group Templates
      */
-    movedowniconTemplate;
+    moveDownIconTemplate;
     /**
      * Custom move bottom icon template.
      * @group Templates
      */
-    movebottomiconTemplate;
+    moveBottomIconTemplate;
     /**
      * Custom filter icon template.
      * @group Templates
      */
-    filtericonTemplate;
+    filterIconTemplate;
     get moveUpAriaLabel() {
         return this.config.translation.aria ? this.config.translation.aria.moveUp : undefined;
     }
@@ -464,6 +464,56 @@ class OrderList extends BaseComponent {
             this.movedDown = false;
         }
     }
+    templates;
+    _itemTemplate;
+    _emptyMessageTemplate;
+    _emptyFilterMessageTemplate;
+    _filterTemplate;
+    _headerTemplate;
+    _moveUpIconTemplate;
+    _moveTopIconTemplate;
+    _moveDownIconTemplate;
+    _moveBottomIconTemplate;
+    _filterIconTemplate;
+    ngAfterContentInit() {
+        this.templates.forEach((item) => {
+            switch (item.getType()) {
+                case 'item':
+                    this._itemTemplate = item.template;
+                    break;
+                case 'empty':
+                    this._emptyMessageTemplate = item.template;
+                    break;
+                case 'emptyfilter':
+                    this._emptyFilterMessageTemplate = item.template;
+                    break;
+                case 'filter':
+                    this._filterTemplate = item.template;
+                    break;
+                case 'header':
+                    this._headerTemplate = item.template;
+                    break;
+                case 'moveupicon':
+                    this._moveUpIconTemplate = item.template;
+                    break;
+                case 'movetopicon':
+                    this._moveTopIconTemplate = item.template;
+                    break;
+                case 'movedownicon':
+                    this._moveDownIconTemplate = item.template;
+                    break;
+                case 'movebottomicon':
+                    this._moveBottomIconTemplate = item.template;
+                    break;
+                case 'filtericon':
+                    this._filterIconTemplate = item.template;
+                    break;
+                default:
+                    this._itemTemplate = item.template;
+                    break;
+            }
+        });
+    }
     onItemClick(event, item, index, selectedId) {
         this.itemTouched = false;
         let focusedIndex = index ? index : findIndexInList(this.focusedOption, this.value);
@@ -853,28 +903,30 @@ class OrderList extends BaseComponent {
     }
     static ɵfac = /*@__PURE__*/ (() => { let ɵOrderList_BaseFactory; return function OrderList_Factory(__ngFactoryType__) { return (ɵOrderList_BaseFactory || (ɵOrderList_BaseFactory = i0.ɵɵgetInheritedFactory(OrderList)))(__ngFactoryType__ || OrderList); }; })();
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OrderList, selectors: [["p-orderList"], ["p-orderlist"], ["p-order-list"]], contentQueries: function OrderList_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-            i0.ɵɵcontentQuery(dirIndex, _c0, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c1, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c2, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c3, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c4, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c5, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c6, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c7, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c8, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c9, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c0, 4);
+            i0.ɵɵcontentQuery(dirIndex, _c1, 4);
+            i0.ɵɵcontentQuery(dirIndex, _c2, 4);
+            i0.ɵɵcontentQuery(dirIndex, _c3, 4);
+            i0.ɵɵcontentQuery(dirIndex, _c4, 4);
+            i0.ɵɵcontentQuery(dirIndex, _c5, 4);
+            i0.ɵɵcontentQuery(dirIndex, _c6, 4);
+            i0.ɵɵcontentQuery(dirIndex, _c7, 4);
+            i0.ɵɵcontentQuery(dirIndex, _c8, 4);
+            i0.ɵɵcontentQuery(dirIndex, _c9, 4);
+            i0.ɵɵcontentQuery(dirIndex, PrimeTemplate, 4);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.itemTemplate = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.emptymessageTemplate = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.emptyfiltermessageTemplate = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.emptyMessageTemplate = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.emptyFilterMessageTemplate = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.filterTemplate = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.headerTemplate = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.moveupiconTemplate = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.movetopiconTemplate = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.movedowniconTemplate = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.movebottomiconTemplate = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.filtericonTemplate = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.moveUpIconTemplate = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.moveTopIconTemplate = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.moveDownIconTemplate = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.moveBottomIconTemplate = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.filterIconTemplate = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.templates = _t);
         } }, viewQuery: function OrderList_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c10, 5);
             i0.ɵɵviewQuery(_c3, 5);
@@ -915,30 +967,30 @@ class OrderList extends BaseComponent {
             i0.ɵɵproperty("disabled", ctx.moveDisabled())("buttonProps", ctx.getButtonProps("up"));
             i0.ɵɵattribute("aria-label", ctx.moveUpAriaLabel)("data-pc-section", "moveUpButton");
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", !ctx.moveupiconTemplate);
+            i0.ɵɵproperty("ngIf", !ctx.moveUpIconTemplate && !ctx._moveUpIconTemplate);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngTemplateOutlet", ctx.moveupiconTemplate);
+            i0.ɵɵproperty("ngTemplateOutlet", ctx.moveUpIconTemplate || ctx._moveUpIconTemplate);
             i0.ɵɵadvance();
             i0.ɵɵproperty("disabled", ctx.moveDisabled())("buttonProps", ctx.getButtonProps("top"));
             i0.ɵɵattribute("aria-label", ctx.moveTopAriaLabel)("data-pc-section", "moveTopButton");
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", !ctx.movetopiconTemplate);
+            i0.ɵɵproperty("ngIf", !ctx.moveTopIconTemplate && !ctx._moveTopIconTemplate);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngTemplateOutlet", ctx.movetopiconTemplate);
+            i0.ɵɵproperty("ngTemplateOutlet", ctx.moveTopIconTemplate || ctx._moveTopIconTemplate);
             i0.ɵɵadvance();
             i0.ɵɵproperty("disabled", ctx.moveDisabled())("buttonProps", ctx.getButtonProps("down"));
             i0.ɵɵattribute("aria-label", ctx.moveDownAriaLabel)("data-pc-section", "moveDownButton");
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", !ctx.movedowniconTemplate);
+            i0.ɵɵproperty("ngIf", !ctx.moveDownIconTemplate && !ctx._moveDownIconTemplate);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngTemplateOutlet", ctx.movedowniconTemplate);
+            i0.ɵɵproperty("ngTemplateOutlet", ctx.moveDownIconTemplate || ctx._moveDownIconTemplate);
             i0.ɵɵadvance();
             i0.ɵɵproperty("disabled", ctx.moveDisabled())("buttonProps", ctx.getButtonProps("bottom"));
             i0.ɵɵattribute("aria-label", ctx.moveBottomAriaLabel)("data-pc-section", "moveBottomButton");
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", !ctx.movebottomiconTemplate);
+            i0.ɵɵproperty("ngIf", !ctx.moveBottomIconTemplate && !ctx._moveBottomIconTemplate);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngTemplateOutlet", ctx.movebottomiconTemplate);
+            i0.ɵɵproperty("ngTemplateOutlet", ctx.moveBottomIconTemplate || ctx._moveBottomIconTemplate);
             i0.ɵɵadvance();
             i0.ɵɵattribute("data-pc-section", "container");
             i0.ɵɵadvance();
@@ -946,9 +998,9 @@ class OrderList extends BaseComponent {
             i0.ɵɵtwoWayProperty("ngModel", ctx.d_selection);
             i0.ɵɵproperty("id", ctx.id + "_list")("listStyle", ctx.listStyle)("striped", ctx.stripedRows)("tabindex", ctx.tabindex)("ariaLabel", ctx.ariaLabel)("disabled", ctx.disabled)("metaKeySelection", ctx.metaKeySelection)("scrollHeight", ctx.scrollHeight)("autoOptionFocus", ctx.autoOptionFocus)("filter", ctx.filterBy)("filterBy", ctx.filterBy)("filterLocale", ctx.filterLocale)("filterPlaceHolder", ctx.filterPlaceholder);
             i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.headerTemplate);
+            i0.ɵɵproperty("ngIf", ctx.headerTemplate || ctx._headerTemplate);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.itemTemplate);
+            i0.ɵɵproperty("ngIf", ctx.itemTemplate || ctx._itemTemplate);
         } }, dependencies: [CommonModule, i1.NgClass, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle, ButtonDirective, Ripple, DragDropModule, AngleDoubleDownIcon, AngleDoubleUpIcon, AngleUpIcon, AngleDownIcon, Listbox, FormsModule, i2.NgControlStatus, i2.NgModel, SharedModule], encapsulation: 2, changeDetection: 0 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(OrderList, [{
@@ -956,7 +1008,7 @@ class OrderList extends BaseComponent {
         args: [{
                 selector: 'p-orderList, p-orderlist, p-order-list',
                 standalone: true,
-                imports: [CommonModule, ButtonDirective, Ripple, DragDropModule, AngleDoubleDownIcon, AngleDoubleUpIcon, AngleUpIcon, AngleDownIcon, SearchIcon, Listbox, FormsModule, SharedModule],
+                imports: [CommonModule, ButtonDirective, Ripple, DragDropModule, AngleDoubleDownIcon, AngleDoubleUpIcon, AngleUpIcon, AngleDownIcon, Listbox, FormsModule, SharedModule],
                 template: `
         <div
             [ngClass]="{
@@ -971,16 +1023,16 @@ class OrderList extends BaseComponent {
         >
             <div class="p-orderlist-controls" [attr.data-pc-section]="'controls'">
                 <button type="button" [disabled]="moveDisabled()" pButton pRipple class="p-button-icon-only" (click)="moveUp()" [attr.aria-label]="moveUpAriaLabel" [attr.data-pc-section]="'moveUpButton'" [buttonProps]="getButtonProps('up')">
-                    <AngleUpIcon *ngIf="!moveupiconTemplate" [attr.data-pc-section]="'moveupicon'" />
-                    <ng-template *ngTemplateOutlet="moveupiconTemplate"></ng-template>
+                    <AngleUpIcon *ngIf="!moveUpIconTemplate && !_moveUpIconTemplate" [attr.data-pc-section]="'moveupicon'" />
+                    <ng-template *ngTemplateOutlet="moveUpIconTemplate || _moveUpIconTemplate"></ng-template>
                 </button>
                 <button type="button" [disabled]="moveDisabled()" pButton pRipple class="p-button-icon-only" (click)="moveTop()" [attr.aria-label]="moveTopAriaLabel" [attr.data-pc-section]="'moveTopButton'" [buttonProps]="getButtonProps('top')">
-                    <AngleDoubleUpIcon *ngIf="!movetopiconTemplate" [attr.data-pc-section]="'movetopicon'" />
-                    <ng-template *ngTemplateOutlet="movetopiconTemplate"></ng-template>
+                    <AngleDoubleUpIcon *ngIf="!moveTopIconTemplate && !_moveTopIconTemplate" [attr.data-pc-section]="'movetopicon'" />
+                    <ng-template *ngTemplateOutlet="moveTopIconTemplate || _moveTopIconTemplate"></ng-template>
                 </button>
                 <button type="button" [disabled]="moveDisabled()" pButton pRipple class="p-button-icon-only" (click)="moveDown()" [attr.aria-label]="moveDownAriaLabel" [attr.data-pc-section]="'moveDownButton'" [buttonProps]="getButtonProps('down')">
-                    <AngleDownIcon *ngIf="!movedowniconTemplate" [attr.data-pc-section]="'movedownicon'" />
-                    <ng-template *ngTemplateOutlet="movedowniconTemplate"></ng-template>
+                    <AngleDownIcon *ngIf="!moveDownIconTemplate && !_moveDownIconTemplate" [attr.data-pc-section]="'movedownicon'" />
+                    <ng-template *ngTemplateOutlet="moveDownIconTemplate || _moveDownIconTemplate"></ng-template>
                 </button>
                 <button
                     type="button"
@@ -993,8 +1045,8 @@ class OrderList extends BaseComponent {
                     [attr.data-pc-section]="'moveBottomButton'"
                     [buttonProps]="getButtonProps('bottom')"
                 >
-                    <AngleDoubleDownIcon *ngIf="!movebottomiconTemplate" [attr.data-pc-section]="'movebottomicon'" />
-                    <ng-template *ngTemplateOutlet="movebottomiconTemplate"></ng-template>
+                    <AngleDoubleDownIcon *ngIf="!moveBottomIconTemplate && !_moveBottomIconTemplate" [attr.data-pc-section]="'movebottomicon'" />
+                    <ng-template *ngTemplateOutlet="moveBottomIconTemplate || _moveBottomIconTemplate"></ng-template>
                 </button>
             </div>
             <div class="p-orderlist-list-container" [attr.data-pc-section]="'container'">
@@ -1021,14 +1073,14 @@ class OrderList extends BaseComponent {
                     [filterLocale]="filterLocale"
                     [filterPlaceHolder]="filterPlaceholder"
                 >
-                    <ng-container *ngIf="headerTemplate">
+                    <ng-container *ngIf="headerTemplate || _headerTemplate">
                         <ng-template #header>
-                            <ng-template *ngTemplateOutlet="headerTemplate"></ng-template>
+                            <ng-template *ngTemplateOutlet="headerTemplate || _headerTemplate"></ng-template>
                         </ng-template>
                     </ng-container>
-                    <ng-container *ngIf="itemTemplate">
+                    <ng-container *ngIf="itemTemplate || _itemTemplate">
                         <ng-template #item let-option let-selected="selected" let-index="index">
-                            <ng-template *ngTemplateOutlet="itemTemplate; context: { $implicit: option, selected: selected, index: index }"></ng-template>
+                            <ng-template *ngTemplateOutlet="itemTemplate || _itemTemplate; context: { $implicit: option, selected: selected, index: index }"></ng-template>
                         </ng-template>
                     </ng-container>
                 </p-listbox>
@@ -1124,34 +1176,37 @@ class OrderList extends BaseComponent {
             args: ['filter']
         }], itemTemplate: [{
             type: ContentChild,
-            args: ['item']
-        }], emptymessageTemplate: [{
+            args: ['item', { descendants: false }]
+        }], emptyMessageTemplate: [{
             type: ContentChild,
-            args: ['empty']
-        }], emptyfiltermessageTemplate: [{
+            args: ['empty', { descendants: false }]
+        }], emptyFilterMessageTemplate: [{
             type: ContentChild,
-            args: ['emptyfilter']
+            args: ['emptyfilter', { descendants: false }]
         }], filterTemplate: [{
             type: ContentChild,
-            args: ['filter']
+            args: ['filter', { descendants: false }]
         }], headerTemplate: [{
             type: ContentChild,
-            args: ['header']
-        }], moveupiconTemplate: [{
+            args: ['header', { descendants: false }]
+        }], moveUpIconTemplate: [{
             type: ContentChild,
-            args: ['moveupicon']
-        }], movetopiconTemplate: [{
+            args: ['moveupicon', { descendants: false }]
+        }], moveTopIconTemplate: [{
             type: ContentChild,
-            args: ['movetopicon']
-        }], movedowniconTemplate: [{
+            args: ['movetopicon', { descendants: false }]
+        }], moveDownIconTemplate: [{
             type: ContentChild,
-            args: ['movedownicon']
-        }], movebottomiconTemplate: [{
+            args: ['movedownicon', { descendants: false }]
+        }], moveBottomIconTemplate: [{
             type: ContentChild,
-            args: ['movebottomicon']
-        }], filtericonTemplate: [{
+            args: ['movebottomicon', { descendants: false }]
+        }], filterIconTemplate: [{
             type: ContentChild,
-            args: ['filtericon']
+            args: ['filtericon', { descendants: false }]
+        }], templates: [{
+            type: ContentChildren,
+            args: [PrimeTemplate]
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OrderList, { className: "OrderList" }); })();
 class OrderListModule {