@po-ui/ng-components 16.8.0 → 16.9.0

package/fesm2022/po-ui-ng-components.mjs

@@ -7,7 +7,7 @@ import { trigger, transition, style, animate, group, query, animateChild, state,
 import { Subject, filter, fromEvent, debounceTime, from, timer, of, Subscription, ReplaySubject, throwError, map as map$1, catchError as catchError$1, Observable } from 'rxjs';
 import * as i2 from '@angular/router';
 import { RouterModule, NavigationEnd, NavigationCancel } from '@angular/router';
-import * as i6 from '@angular/cdk/listbox';
+import * as i5 from '@angular/cdk/listbox';
 import { CdkListboxModule } from '@angular/cdk/listbox';
 import * as i1$1 from '@angular/platform-browser';
 import * as i2$1 from '@angular/forms';
@@ -15,7 +15,7 @@ import { NG_VALUE_ACCESSOR, FormsModule, NG_VALIDATORS, NgControl, ControlContai
 import * as i1$2 from '@angular/common/http';
 import { HttpHeaders, HttpEventType, HttpResponse, HttpRequest, HTTP_INTERCEPTORS, HttpClient } from '@angular/common/http';
 import { debounceTime as debounceTime$1, concatMap, mapTo, scan, tap, switchMap, take, delay, takeWhile, map, filter as filter$1, distinctUntilChanged, catchError, finalize } from 'rxjs/operators';
-import * as i5 from '@angular/cdk/overlay';
+import * as i5$1 from '@angular/cdk/overlay';
 import { OverlayModule } from '@angular/cdk/overlay';
 import * as i2$2 from '@angular/cdk/scrolling';
 import { CdkVirtualScrollViewport, ScrollingModule } from '@angular/cdk/scrolling';
@@ -4133,7 +4133,7 @@ class PoListBoxBaseComponent {
             args: ['p-combo-service']
         }] }); })();
 
-const poLoadingLiteralsDefault = {
+const poLoadingOverlayLiteralsDefault = {
     en: {
         loading: 'Loading'
     },
@@ -4148,43 +4148,152 @@ const poLoadingLiteralsDefault = {
     }
 };
 /**
- * @docsPrivate
  *
  * @description
  *
- * Este componente tem o objetivo de mostrar visualmente aos usuários que a aplicação está processando
- * ou aguardando a resposta de alguma requisição.
+ * Este componente mostra ao usuário uma imagem de _loading_ e bloqueia a página inteira ou o container escolhido,
+ * enquanto aguarda a resposta de alguma requisição.
  */
-class PoLoadingBaseComponent {
+class PoLoadingOverlayBaseComponent {
     languageService;
+    _screenLock = false;
     _text;
+    _size;
     /**
+     * @optional
+     *
+     * @description
+     *
+     * Define se o *overlay* será aplicado a um *container* ou a página inteira.
+     *
+     * Para utilizar o componente como um *container*, o elemento pai deverá receber uma posição relativa, por exemplo:
+     *
+     * ```
+     * <div style="position: relative">
+     *
+     *  <po-chart [p-series]="[{ value: 10, category: 'Example' }]">
+     *  </po-chart>
+     *
+     *  <po-loading-overlay>
+     *  </po-loading-overlay>
+     * </div>
+     * ```
+     *
+     * @default `false`
+     */
+    set screenLock(screenLock) {
+        this._screenLock = convertToBoolean(screenLock);
+    }
+    get screenLock() {
+        return this._screenLock;
+    }
+    /**
+     * @optional
+     *
+     * @description
+     *
      * Texto a ser exibido no componente.
+     *
+     * > O valor padrão será traduzido acordo com o idioma configurado no [**PoI18n**](/documentation/po-i18n) ou navegador.
+     *
+     * @default `Carregando`
      */
     set text(value) {
-        this._text = value || (value === '' ? '' : this.getTextDefault());
+        this._text = value || this.getTextDefault();
     }
     get text() {
         return this._text;
     }
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define o tamnho do componente.
+     *
+     * @default `lg`
+     */
+    set size(value) {
+        this._size = value === '' || !value ? 'lg' : value;
+    }
+    get size() {
+        return this._size;
+    }
     constructor(languageService) {
         this.languageService = languageService;
         this.text = this.getTextDefault();
     }
     getTextDefault() {
         const language = this.languageService.getShortLanguage();
-        return poLoadingLiteralsDefault[language].loading;
+        return poLoadingOverlayLiteralsDefault[language].loading;
     }
-    static ɵfac = function PoLoadingBaseComponent_Factory(t) { return new (t || PoLoadingBaseComponent)(i0.ɵɵdirectiveInject(PoLanguageService)); };
-    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: PoLoadingBaseComponent, inputs: { text: ["p-text", "text"] } });
+    static ɵfac = function PoLoadingOverlayBaseComponent_Factory(t) { return new (t || PoLoadingOverlayBaseComponent)(i0.ɵɵdirectiveInject(PoLanguageService)); };
+    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: PoLoadingOverlayBaseComponent, inputs: { screenLock: ["p-screen-lock", "screenLock"], text: ["p-text", "text"], size: ["p-size", "size"] } });
 }
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoLoadingBaseComponent, [{
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoLoadingOverlayBaseComponent, [{
         type: Directive
-    }], function () { return [{ type: PoLanguageService }]; }, { text: [{
+    }], function () { return [{ type: PoLanguageService }]; }, { screenLock: [{
+            type: Input,
+            args: ['p-screen-lock']
+        }], text: [{
             type: Input,
             args: ['p-text']
+        }], size: [{
+            type: Input,
+            args: ['p-size']
         }] }); })();
 
+class PoOverlayBaseComponent {
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define se o *overlay* será aplicado a um *container* ou a página inteira.
+     *
+     * Para utilizar o componente como um *container*, o elemento pai deverá receber uma posição relativa, por exemplo:
+     *
+     * ```
+     * <div style="position: relative">
+     *
+     *  <po-chart [p-series]="[{ value: 10, category: 'Example' }]">
+     *  </po-chart>
+     *
+     *  <po-overlay>
+     *  </po-overlay>
+     * </div>
+     * ```
+     *
+     * @default `false`
+     */
+    screenLock = false;
+    static ɵfac = function PoOverlayBaseComponent_Factory(t) { return new (t || PoOverlayBaseComponent)(); };
+    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: PoOverlayBaseComponent, inputs: { screenLock: ["p-screen-lock", "screenLock", convertToBoolean] }, features: [i0.ɵɵInputTransformsFeature] });
+}
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoOverlayBaseComponent, [{
+        type: Directive
+    }], null, { screenLock: [{
+            type: Input,
+            args: [{ alias: 'p-screen-lock', transform: convertToBoolean }]
+        }] }); })();
+
+const _c0$1B = ["*"];
+class PoOverlayComponent extends PoOverlayBaseComponent {
+    static ɵfac = /*@__PURE__*/ function () { let ɵPoOverlayComponent_BaseFactory; return function PoOverlayComponent_Factory(t) { return (ɵPoOverlayComponent_BaseFactory || (ɵPoOverlayComponent_BaseFactory = i0.ɵɵgetInheritedFactory(PoOverlayComponent)))(t || PoOverlayComponent); }; }();
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoOverlayComponent, selectors: [["po-overlay"]], features: [i0.ɵɵInheritDefinitionFeature], ngContentSelectors: _c0$1B, decls: 3, vars: 2, consts: [["role", "alert", "aria-busy", "true", 1, "po-overlay"], [1, "po-overlay-content"]], template: function PoOverlayComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
+            i0.ɵɵprojection(2);
+            i0.ɵɵelementEnd()();
+        } if (rf & 2) {
+            i0.ɵɵclassProp("po-overlay-fixed", ctx.screenLock);
+        } }, encapsulation: 2 });
+}
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoOverlayComponent, [{
+        type: Component,
+        args: [{ selector: 'po-overlay', template: "<div class=\"po-overlay\" [class.po-overlay-fixed]=\"screenLock\" role=\"alert\" aria-busy=\"true\">\n  <div class=\"po-overlay-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n" }]
+    }], null, null); })();
+
 var PoLoadingIconSize;
 (function (PoLoadingIconSize) {
     /** Extra small */
@@ -4197,6 +4306,79 @@ var PoLoadingIconSize;
     PoLoadingIconSize["lg"] = "lg";
 })(PoLoadingIconSize || (PoLoadingIconSize = {}));
 
+const poLoadingLiteralsDefault = {
+    en: {
+        loading: 'Loading'
+    },
+    es: {
+        loading: 'Cargando'
+    },
+    pt: {
+        loading: 'Carregando'
+    },
+    ru: {
+        loading: 'Загрузка'
+    }
+};
+/**
+ * @docsPrivate
+ *
+ * @description
+ *
+ * Este componente tem o objetivo de mostrar visualmente aos usuários que a aplicação está processando
+ * ou aguardando a resposta de alguma requisição.
+ */
+class PoLoadingBaseComponent {
+    languageService;
+    _text;
+    _size;
+    /**
+     * Texto a ser exibido no componente.
+     */
+    set text(value) {
+        this._text = value || (value === '' ? '' : this.getTextDefault());
+    }
+    get text() {
+        return this._text;
+    }
+    /**
+     * Define o tamanho do ícone.
+     *
+     * @default `lg`
+     *
+     * Valores válidos:
+     *  - `xs`: tamanho `extra small`
+     *  - `sm`: tamanho `small`
+     *  - `md`: tamanho `medium`
+     *  - `lg`: tamanho `large`
+     */
+    set size(value) {
+        this._size = PoLoadingIconSize[value] ? PoLoadingIconSize[value] : PoLoadingIconSize.lg;
+    }
+    get size() {
+        return this._size;
+    }
+    constructor(languageService) {
+        this.languageService = languageService;
+        this.text = this.getTextDefault();
+    }
+    getTextDefault() {
+        const language = this.languageService.getShortLanguage();
+        return poLoadingLiteralsDefault[language].loading;
+    }
+    static ɵfac = function PoLoadingBaseComponent_Factory(t) { return new (t || PoLoadingBaseComponent)(i0.ɵɵdirectiveInject(PoLanguageService)); };
+    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: PoLoadingBaseComponent, inputs: { text: ["p-text", "text"], size: ["p-size", "size"] } });
+}
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoLoadingBaseComponent, [{
+        type: Directive
+    }], function () { return [{ type: PoLanguageService }]; }, { text: [{
+            type: Input,
+            args: ['p-text']
+        }], size: [{
+            type: Input,
+            args: ['p-size']
+        }] }); })();
+
 /**
  * @docsPrivate
  *
@@ -4285,16 +4467,16 @@ class PoLoadingIconComponent {
             args: ['p-size']
         }] }); })();
 
-function PoLoadingComponent_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 3);
+function PoLoadingComponent_span_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 2);
     i0.ɵɵtext(1);
-    i0.ɵɵelementStart(2, "div", 4);
+    i0.ɵɵelementStart(2, "div", 3);
     i0.ɵɵtext(3, ".");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 4);
+    i0.ɵɵelementStart(4, "div", 3);
     i0.ɵɵtext(5, ".");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 4);
+    i0.ɵɵelementStart(6, "div", 3);
     i0.ɵɵtext(7, ".");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -4309,161 +4491,22 @@ function PoLoadingComponent_ng_template_2_Template(rf, ctx) { if (rf & 1) {
  */
 class PoLoadingComponent extends PoLoadingBaseComponent {
     static ɵfac = /*@__PURE__*/ function () { let ɵPoLoadingComponent_BaseFactory; return function PoLoadingComponent_Factory(t) { return (ɵPoLoadingComponent_BaseFactory || (ɵPoLoadingComponent_BaseFactory = i0.ɵɵgetInheritedFactory(PoLoadingComponent)))(t || PoLoadingComponent); }; }();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoLoadingComponent, selectors: [["po-loading"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 1, consts: [[1, "po-loading"], ["p-size", "lg"], [3, "ngIf"], [1, "po-loading-label", "po-text-ellipsis"], ["aria-hidden", "true", 1, "po-loading-dot"]], template: function PoLoadingComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "div", 0);
-            i0.ɵɵelement(1, "po-loading-icon", 1);
-            i0.ɵɵtemplate(2, PoLoadingComponent_ng_template_2_Template, 8, 1, "ng-template", 2);
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoLoadingComponent, selectors: [["po-loading"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 5, consts: [[3, "p-size"], ["class", "po-loading-label po-text-ellipsis", 4, "ngIf"], [1, "po-loading-label", "po-text-ellipsis"], ["aria-hidden", "true", 1, "po-loading-dot"]], template: function PoLoadingComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div");
+            i0.ɵɵelement(1, "po-loading-icon", 0);
+            i0.ɵɵtemplate(2, PoLoadingComponent_span_2_Template, 8, 1, "span", 1);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
-            i0.ɵɵadvance(2);
+            i0.ɵɵclassMapInterpolate1("po-loading po-loading-", ctx.size, "");
+            i0.ɵɵadvance(1);
+            i0.ɵɵproperty("p-size", ctx.size);
+            i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.text);
         } }, dependencies: [i1.NgIf, PoLoadingIconComponent], encapsulation: 2 });
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoLoadingComponent, [{
         type: Component,
-        args: [{ selector: 'po-loading', template: "<div class=\"po-loading\">\n  <po-loading-icon p-size=\"lg\"></po-loading-icon>\n  <ng-template [ngIf]=\"text\">\n    <span class=\"po-loading-label po-text-ellipsis\"\n      >{{ text }}\n      <div class=\"po-loading-dot\" aria-hidden=\"true\">.</div>\n      <div class=\"po-loading-dot\" aria-hidden=\"true\">.</div>\n      <div class=\"po-loading-dot\" aria-hidden=\"true\">.</div>\n    </span>\n  </ng-template>\n</div>\n" }]
-    }], null, null); })();
-
-const poLoadingOverlayLiteralsDefault = {
-    en: {
-        loading: 'Loading'
-    },
-    es: {
-        loading: 'Cargando'
-    },
-    pt: {
-        loading: 'Carregando'
-    },
-    ru: {
-        loading: 'Загрузка'
-    }
-};
-/**
- *
- * @description
- *
- * Este componente mostra ao usuário uma imagem de _loading_ e bloqueia a página inteira ou o container escolhido,
- * enquanto aguarda a resposta de alguma requisição.
- */
-class PoLoadingOverlayBaseComponent {
-    languageService;
-    _screenLock = false;
-    _text;
-    /**
-     * @optional
-     *
-     * @description
-     *
-     * Define se o *overlay* será aplicado a um *container* ou a página inteira.
-     *
-     * Para utilizar o componente como um *container*, o elemento pai deverá receber uma posição relativa, por exemplo:
-     *
-     * ```
-     * <div style="position: relative">
-     *
-     *  <po-chart [p-series]="[{ value: 10, category: 'Example' }]">
-     *  </po-chart>
-     *
-     *  <po-loading-overlay>
-     *  </po-loading-overlay>
-     * </div>
-     * ```
-     *
-     * @default `false`
-     */
-    set screenLock(screenLock) {
-        this._screenLock = convertToBoolean(screenLock);
-    }
-    get screenLock() {
-        return this._screenLock;
-    }
-    /**
-     * @optional
-     *
-     * @description
-     *
-     * Texto a ser exibido no componente.
-     *
-     * > O valor padrão será traduzido acordo com o idioma configurado no [**PoI18n**](/documentation/po-i18n) ou navegador.
-     *
-     * @default `Carregando`
-     */
-    set text(value) {
-        this._text = value || this.getTextDefault();
-    }
-    get text() {
-        return this._text;
-    }
-    constructor(languageService) {
-        this.languageService = languageService;
-        this.text = this.getTextDefault();
-    }
-    getTextDefault() {
-        const language = this.languageService.getShortLanguage();
-        return poLoadingOverlayLiteralsDefault[language].loading;
-    }
-    static ɵfac = function PoLoadingOverlayBaseComponent_Factory(t) { return new (t || PoLoadingOverlayBaseComponent)(i0.ɵɵdirectiveInject(PoLanguageService)); };
-    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: PoLoadingOverlayBaseComponent, inputs: { screenLock: ["p-screen-lock", "screenLock"], text: ["p-text", "text"] } });
-}
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoLoadingOverlayBaseComponent, [{
-        type: Directive
-    }], function () { return [{ type: PoLanguageService }]; }, { screenLock: [{
-            type: Input,
-            args: ['p-screen-lock']
-        }], text: [{
-            type: Input,
-            args: ['p-text']
-        }] }); })();
-
-class PoOverlayBaseComponent {
-    /**
-     * @optional
-     *
-     * @description
-     *
-     * Define se o *overlay* será aplicado a um *container* ou a página inteira.
-     *
-     * Para utilizar o componente como um *container*, o elemento pai deverá receber uma posição relativa, por exemplo:
-     *
-     * ```
-     * <div style="position: relative">
-     *
-     *  <po-chart [p-series]="[{ value: 10, category: 'Example' }]">
-     *  </po-chart>
-     *
-     *  <po-overlay>
-     *  </po-overlay>
-     * </div>
-     * ```
-     *
-     * @default `false`
-     */
-    screenLock = false;
-    static ɵfac = function PoOverlayBaseComponent_Factory(t) { return new (t || PoOverlayBaseComponent)(); };
-    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: PoOverlayBaseComponent, inputs: { screenLock: ["p-screen-lock", "screenLock", convertToBoolean] }, features: [i0.ɵɵInputTransformsFeature] });
-}
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoOverlayBaseComponent, [{
-        type: Directive
-    }], null, { screenLock: [{
-            type: Input,
-            args: [{ alias: 'p-screen-lock', transform: convertToBoolean }]
-        }] }); })();
-
-const _c0$1B = ["*"];
-class PoOverlayComponent extends PoOverlayBaseComponent {
-    static ɵfac = /*@__PURE__*/ function () { let ɵPoOverlayComponent_BaseFactory; return function PoOverlayComponent_Factory(t) { return (ɵPoOverlayComponent_BaseFactory || (ɵPoOverlayComponent_BaseFactory = i0.ɵɵgetInheritedFactory(PoOverlayComponent)))(t || PoOverlayComponent); }; }();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoOverlayComponent, selectors: [["po-overlay"]], features: [i0.ɵɵInheritDefinitionFeature], ngContentSelectors: _c0$1B, decls: 3, vars: 2, consts: [["role", "alert", "aria-busy", "true", 1, "po-overlay"], [1, "po-overlay-content"]], template: function PoOverlayComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵprojectionDef();
-            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
-            i0.ɵɵprojection(2);
-            i0.ɵɵelementEnd()();
-        } if (rf & 2) {
-            i0.ɵɵclassProp("po-overlay-fixed", ctx.screenLock);
-        } }, encapsulation: 2 });
-}
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoOverlayComponent, [{
-        type: Component,
-        args: [{ selector: 'po-overlay', template: "<div class=\"po-overlay\" [class.po-overlay-fixed]=\"screenLock\" role=\"alert\" aria-busy=\"true\">\n  <div class=\"po-overlay-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n" }]
+        args: [{ selector: 'po-loading', template: "<div class=\"po-loading po-loading-{{ size }}\">\n  <po-loading-icon [p-size]=\"size\"></po-loading-icon>\n\n  <span *ngIf=\"text\" class=\"po-loading-label po-text-ellipsis\"\n    >{{ text }}\n    <div class=\"po-loading-dot\" aria-hidden=\"true\">.</div>\n    <div class=\"po-loading-dot\" aria-hidden=\"true\">.</div>\n    <div class=\"po-loading-dot\" aria-hidden=\"true\">.</div>\n  </span>\n</div>\n" }]
     }], null, null); })();
 
 /**
@@ -4494,19 +4537,19 @@ class PoLoadingOverlayComponent extends PoLoadingOverlayBaseComponent {
         this.changeDetector = changeDetector;
     }
     static ɵfac = function PoLoadingOverlayComponent_Factory(t) { return new (t || PoLoadingOverlayComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(PoLanguageService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoLoadingOverlayComponent, selectors: [["po-loading-overlay"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 2, vars: 2, consts: [[3, "p-screen-lock"], [3, "p-text"]], template: function PoLoadingOverlayComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoLoadingOverlayComponent, selectors: [["po-loading-overlay"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 2, vars: 3, consts: [[3, "p-screen-lock"], [3, "p-text", "p-size"]], template: function PoLoadingOverlayComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "po-overlay", 0);
             i0.ɵɵelement(1, "po-loading", 1);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵproperty("p-screen-lock", ctx.screenLock);
             i0.ɵɵadvance(1);
-            i0.ɵɵproperty("p-text", ctx.text);
+            i0.ɵɵproperty("p-text", ctx.text)("p-size", ctx.size);
         } }, dependencies: [PoOverlayComponent, PoLoadingComponent], encapsulation: 2 });
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoLoadingOverlayComponent, [{
         type: Component,
-        args: [{ selector: 'po-loading-overlay', template: "<po-overlay [p-screen-lock]=\"screenLock\">\n  <po-loading [p-text]=\"text\"></po-loading>\n</po-overlay>\n" }]
+        args: [{ selector: 'po-loading-overlay', template: "<po-overlay [p-screen-lock]=\"screenLock\">\n  <po-loading [p-text]=\"text\" [p-size]=\"size\"></po-loading>\n</po-overlay>\n" }]
     }], function () { return [{ type: i0.ChangeDetectorRef }, { type: PoLanguageService }]; }, null); })();
 
 /**
@@ -5419,70 +5462,70 @@ const _c0$1x = ["listbox"];
 const _c1$D = ["listboxItemList"];
 const _c2$g = ["searchElement"];
 function PoListBoxComponent_po_search_list_3_Template(rf, ctx) { if (rf & 1) {
-    const _r12 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "po-search-list", 8, 9);
-    i0.ɵɵlistener("p-change", function PoListBoxComponent_po_search_list_3_Template_po_search_list_p_change_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r11 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r11.callChangeSearch($event)); });
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "po-search-list", 6, 7);
+    i0.ɵɵlistener("p-change", function PoListBoxComponent_po_search_list_3_Template_po_search_list_p_change_0_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r7 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r7.callChangeSearch($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("p-literals", ctx_r1.literalSearch)("p-field-value", ctx_r1.fieldValueSearch)("p-placeholder", ctx_r1.placeholderSearch);
 } }
 function PoListBoxComponent_ng_container_4_li_3_Template(rf, ctx) { if (rf & 1) {
-    const _r17 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "li", 14);
-    i0.ɵɵlistener("click", function PoListBoxComponent_ng_container_4_li_3_Template_li_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r16 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r16.changeAll.emit()); })("keydown", function PoListBoxComponent_ng_container_4_li_3_Template_li_keydown_0_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r18 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r18.changeAllEmit($event)); });
-    i0.ɵɵelement(1, "po-item-list", 15);
+    const _r13 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "li", 12);
+    i0.ɵɵlistener("click", function PoListBoxComponent_ng_container_4_li_3_Template_li_click_0_listener() { i0.ɵɵrestoreView(_r13); const ctx_r12 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r12.changeAll.emit()); })("keydown", function PoListBoxComponent_ng_container_4_li_3_Template_li_keydown_0_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r14 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r14.changeAllEmit($event)); });
+    i0.ɵɵelement(1, "po-item-list", 13);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r14 = i0.ɵɵnextContext(2);
-    i0.ɵɵattribute("aria-checked", ctx_r14.checkboxAllValue === null ? "mixed" : ctx_r14.checkboxAllValue);
+    const ctx_r10 = i0.ɵɵnextContext(2);
+    i0.ɵɵattribute("aria-checked", ctx_r10.checkboxAllValue === null ? "mixed" : ctx_r10.checkboxAllValue);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("p-selected", ctx_r14.checkboxAllValue)("p-label", ctx_r14.literals.selectAll)("p-checkbox-value", ctx_r14.checkboxAllValue);
+    i0.ɵɵproperty("p-selected", ctx_r10.checkboxAllValue)("p-label", ctx_r10.literals.selectAll)("p-checkbox-value", ctx_r10.checkboxAllValue);
 } }
 function PoListBoxComponent_ng_container_4_li_4_label_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "label", 19);
+    i0.ɵɵelementStart(0, "label", 17);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const item_r19 = i0.ɵɵnextContext().$implicit;
+    const item_r15 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance(1);
-    i0.ɵɵtextInterpolate1(" ", item_r19.label, " ");
+    i0.ɵɵtextInterpolate1(" ", item_r15.label, " ");
 } }
 function PoListBoxComponent_ng_container_4_li_4_po_item_list_2_Template(rf, ctx) { if (rf & 1) {
-    const _r24 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "po-item-list", 20);
-    i0.ɵɵlistener("p-selectcheckbox-item", function PoListBoxComponent_ng_container_4_li_4_po_item_list_2_Template_po_item_list_p_selectcheckbox_item_0_listener($event) { i0.ɵɵrestoreView(_r24); const ctx_r23 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r23.checkboxClicked($event)); })("p-selectcombo-item", function PoListBoxComponent_ng_container_4_li_4_po_item_list_2_Template_po_item_list_p_selectcombo_item_0_listener($event) { i0.ɵɵrestoreView(_r24); const ctx_r25 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r25.optionClicked($event)); })("p-select-item", function PoListBoxComponent_ng_container_4_li_4_po_item_list_2_Template_po_item_list_p_select_item_0_listener() { i0.ɵɵrestoreView(_r24); const item_r19 = i0.ɵɵnextContext().$implicit; const ctx_r26 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r26.onSelectCheckBoxItem(item_r19)); });
+    const _r20 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "po-item-list", 18);
+    i0.ɵɵlistener("p-selectcheckbox-item", function PoListBoxComponent_ng_container_4_li_4_po_item_list_2_Template_po_item_list_p_selectcheckbox_item_0_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r19 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r19.checkboxClicked($event)); })("p-selectcombo-item", function PoListBoxComponent_ng_container_4_li_4_po_item_list_2_Template_po_item_list_p_selectcombo_item_0_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r21 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r21.optionClicked($event)); })("p-select-item", function PoListBoxComponent_ng_container_4_li_4_po_item_list_2_Template_po_item_list_p_select_item_0_listener() { i0.ɵɵrestoreView(_r20); const item_r15 = i0.ɵɵnextContext().$implicit; const ctx_r22 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r22.onSelectCheckBoxItem(item_r15)); });
     i0.ɵɵpipe(1, "json");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const item_r19 = i0.ɵɵnextContext().$implicit;
-    const ctx_r21 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("p-disabled", ctx_r21.returnBooleanValue(item_r19, "disabled"))("p-visible", ctx_r21.returnBooleanValue(item_r19, "visible"))("p-checkbox-value", ctx_r21.isSelectedItem(item_r19))("p-label", item_r19[ctx_r21.fieldLabel])("p-value", item_r19[ctx_r21.fieldValue])("p-selected", ctx_r21.isSelectedItem(item_r19) || item_r19.selected)("p-separator", item_r19.separator)("p-danger", item_r19.danger || item_r19.type === "danger")("p-icon", item_r19.icon)("p-type", ctx_r21.type)("p-item", item_r19)("p-field-value", ctx_r21.fieldValue)("p-field-label", ctx_r21.fieldLabel)("p-template", ctx_r21.template)("p-template-context", item_r19)("p-search-value", ctx_r21.searchValue)("p-filter-mode", ctx_r21.filterMode)("p-filtering", ctx_r21.isFiltering)("p-should-mark-letter", ctx_r21.shouldMarkLetters)("p-compare-cache", ctx_r21.compareCache)("p-combo-service", ctx_r21.comboService);
-    i0.ɵɵattribute("data-item-list", i0.ɵɵpipeBind1(1, 22, item_r19));
+    const item_r15 = i0.ɵɵnextContext().$implicit;
+    const ctx_r17 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("p-disabled", ctx_r17.returnBooleanValue(item_r15, "disabled"))("p-visible", ctx_r17.returnBooleanValue(item_r15, "visible"))("p-checkbox-value", ctx_r17.isSelectedItem(item_r15))("p-label", item_r15[ctx_r17.fieldLabel])("p-value", item_r15[ctx_r17.fieldValue])("p-selected", ctx_r17.isSelectedItem(item_r15) || item_r15.selected)("p-separator", item_r15.separator)("p-danger", item_r15.danger || item_r15.type === "danger")("p-icon", item_r15.icon)("p-type", ctx_r17.type)("p-item", item_r15)("p-field-value", ctx_r17.fieldValue)("p-field-label", ctx_r17.fieldLabel)("p-template", ctx_r17.template)("p-template-context", item_r15)("p-search-value", ctx_r17.searchValue)("p-filter-mode", ctx_r17.filterMode)("p-filtering", ctx_r17.isFiltering)("p-should-mark-letter", ctx_r17.shouldMarkLetters)("p-compare-cache", ctx_r17.compareCache)("p-combo-service", ctx_r17.comboService);
+    i0.ɵɵattribute("data-item-list", i0.ɵɵpipeBind1(1, 22, item_r15));
 } }
 function PoListBoxComponent_ng_container_4_li_4_Template(rf, ctx) { if (rf & 1) {
-    const _r30 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "li", 16);
-    i0.ɵɵlistener("click", function PoListBoxComponent_ng_container_4_li_4_Template_li_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r30); const item_r19 = restoredCtx.$implicit; const ctx_r29 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r29.onSelectItem(item_r19)); })("keydown", function PoListBoxComponent_ng_container_4_li_4_Template_li_keydown_0_listener($event) { const restoredCtx = i0.ɵɵrestoreView(_r30); const item_r19 = restoredCtx.$implicit; const ctx_r31 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r31.onKeyDown(item_r19, $event)); });
-    i0.ɵɵtemplate(1, PoListBoxComponent_ng_container_4_li_4_label_1_Template, 2, 1, "label", 17);
-    i0.ɵɵtemplate(2, PoListBoxComponent_ng_container_4_li_4_po_item_list_2_Template, 2, 24, "po-item-list", 18);
+    const _r26 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "li", 14);
+    i0.ɵɵlistener("click", function PoListBoxComponent_ng_container_4_li_4_Template_li_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r26); const item_r15 = restoredCtx.$implicit; const ctx_r25 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r25.onSelectItem(item_r15)); })("keydown", function PoListBoxComponent_ng_container_4_li_4_Template_li_keydown_0_listener($event) { const restoredCtx = i0.ɵɵrestoreView(_r26); const item_r15 = restoredCtx.$implicit; const ctx_r27 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r27.onKeyDown(item_r15, $event)); });
+    i0.ɵɵtemplate(1, PoListBoxComponent_ng_container_4_li_4_label_1_Template, 2, 1, "label", 15);
+    i0.ɵɵtemplate(2, PoListBoxComponent_ng_container_4_li_4_po_item_list_2_Template, 2, 24, "po-item-list", 16);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const item_r19 = ctx.$implicit;
-    const ctx_r15 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("po-listbox-item", ctx_r15.visible);
-    i0.ɵɵproperty("cdkOption", item_r19[ctx_r15.fieldLabel])("cdkOptionDisabled", ctx_r15.returnBooleanValue(item_r19, "disabled") || ctx_r15.returnBooleanValue(item_r19, "visible") === false || item_r19.options);
-    i0.ɵɵattribute("aria-selected", ctx_r15.isSelectedItem(item_r19) || item_r19.selected);
+    const item_r15 = ctx.$implicit;
+    const ctx_r11 = i0.ɵɵnextContext(2);
+    i0.ɵɵclassProp("po-listbox-item", ctx_r11.visible);
+    i0.ɵɵproperty("cdkOption", item_r15[ctx_r11.fieldLabel])("cdkOptionDisabled", ctx_r11.returnBooleanValue(item_r15, "disabled") || ctx_r11.returnBooleanValue(item_r15, "visible") === false || item_r15.options);
+    i0.ɵɵattribute("aria-selected", ctx_r11.isSelectedItem(item_r15) || item_r15.selected);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", item_r19.options);
+    i0.ɵɵproperty("ngIf", item_r15.options);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r15.returnBooleanValue(item_r19, "visible") !== false && !item_r19.options);
+    i0.ɵɵproperty("ngIf", ctx_r11.returnBooleanValue(item_r15, "visible") !== false && !item_r15.options);
 } }
 function PoListBoxComponent_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "ul", 10, 11);
-    i0.ɵɵtemplate(3, PoListBoxComponent_ng_container_4_li_3_Template, 2, 4, "li", 12);
-    i0.ɵɵtemplate(4, PoListBoxComponent_ng_container_4_li_4_Template, 3, 7, "li", 13);
+    i0.ɵɵelementStart(1, "ul", 8, 9);
+    i0.ɵɵtemplate(3, PoListBoxComponent_ng_container_4_li_3_Template, 2, 4, "li", 10);
+    i0.ɵɵtemplate(4, PoListBoxComponent_ng_container_4_li_4_Template, 3, 7, "li", 11);
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
@@ -5494,40 +5537,28 @@ function PoListBoxComponent_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngForOf", ctx_r2.items);
 } }
-function PoListBoxComponent_div_5_ng_container_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0);
-} }
 function PoListBoxComponent_div_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 21);
-    i0.ɵɵtemplate(1, PoListBoxComponent_div_5_ng_container_1_Template, 1, 0, "ng-container", 22);
+    i0.ɵɵelementStart(0, "div");
+    i0.ɵɵelement(1, "po-loading-overlay", 19);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext();
-    const _r4 = i0.ɵɵreference(7);
-    const _r6 = i0.ɵɵreference(9);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r3.infiniteLoading)("ngIfThen", _r4)("ngIfElse", _r6);
+    i0.ɵɵclassProp("po-listbox-container-loading-default", !ctx_r3.infiniteLoading);
 } }
-function PoListBoxComponent_ng_template_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "po-loading-overlay", 23);
-} }
-function PoListBoxComponent_ng_template_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "po-loading", 24);
-} }
-function PoListBoxComponent_ng_template_10_div_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 26)(1, "span");
+function PoListBoxComponent_ng_template_6_div_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 21)(1, "span");
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r33 = i0.ɵɵnextContext(2);
+    const ctx_r28 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", ctx_r33.literals.noItems, "");
+    i0.ɵɵtextInterpolate1(" ", ctx_r28.literals.noItems, "");
 } }
-function PoListBoxComponent_ng_template_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoListBoxComponent_ng_template_10_div_0_Template, 3, 1, "div", 25);
+function PoListBoxComponent_ng_template_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, PoListBoxComponent_ng_template_6_div_0_Template, 3, 1, "div", 20);
 } if (rf & 2) {
-    const ctx_r9 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngIf", !ctx_r9.items.length && !ctx_r9.isServerSearching && ctx_r9.type !== "action");
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngIf", !ctx_r5.items.length && !ctx_r5.isServerSearching && ctx_r5.type !== "action");
 } }
 const _c3$c = [[["", "p-popup-header-template", ""]]];
 const _c4$5 = ["[p-popup-header-template]"];
@@ -5697,33 +5728,31 @@ class PoListBoxComponent extends PoListBoxBaseComponent {
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.listbox = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.listboxItemList = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.searchElement = _t.first);
-        } }, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c4$5, decls: 12, vars: 8, consts: [[1, "po-listbox", 3, "hidden"], ["listbox", ""], [3, "p-literals", "p-field-value", "p-placeholder", "p-change", 4, "ngIf"], [4, "ngIf", "ngIfElse"], ["class", "po-text-center", 4, "ngIf"], ["scrollLoadingTemplate", ""], ["defaultLoadingTemplate", ""], ["noDataTemplate", ""], [3, "p-literals", "p-field-value", "p-placeholder", "p-change"], ["searchElement", ""], ["cdkListbox", "", 1, "po-listbox-list", 3, "cdkListboxMultiple"], ["listboxItemList", ""], ["cdkOption", "selectAll", 3, "click", "keydown", 4, "ngIf"], [3, "po-listbox-item", "cdkOption", "cdkOptionDisabled", "click", "keydown", 4, "ngFor", "ngForOf"], ["cdkOption", "selectAll", 3, "click", "keydown"], ["p-type", "check", "p-value", "selectAll", 3, "p-selected", "p-label", "p-checkbox-value"], [3, "cdkOption", "cdkOptionDisabled", "click", "keydown"], ["class", "po-combo-item-title", 4, "ngIf"], [3, "p-disabled", "p-visible", "p-checkbox-value", "p-label", "p-value", "p-selected", "p-separator", "p-danger", "p-icon", "p-type", "p-item", "p-field-value", "p-field-label", "p-template", "p-template-context", "p-search-value", "p-filter-mode", "p-filtering", "p-should-mark-letter", "p-compare-cache", "p-combo-service", "p-selectcheckbox-item", "p-selectcombo-item", "p-select-item", 4, "ngIf"], [1, "po-combo-item-title"], [3, "p-disabled", "p-visible", "p-checkbox-value", "p-label", "p-value", "p-selected", "p-separator", "p-danger", "p-icon", "p-type", "p-item", "p-field-value", "p-field-label", "p-template", "p-template-context", "p-search-value", "p-filter-mode", "p-filtering", "p-should-mark-letter", "p-compare-cache", "p-combo-service", "p-selectcheckbox-item", "p-selectcombo-item", "p-select-item"], [1, "po-text-center"], [4, "ngIf", "ngIfThen", "ngIfElse"], [1, "po-listbox-container-loading-scroll"], [1, "po-listbox-container-loading-default"], ["class", "po-listbox-container-no-data po-text-center", 4, "ngIf"], [1, "po-listbox-container-no-data", "po-text-center"]], template: function PoListBoxComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c4$5, decls: 8, vars: 8, consts: [[1, "po-listbox", 3, "hidden"], ["listbox", ""], [3, "p-literals", "p-field-value", "p-placeholder", "p-change", 4, "ngIf"], [4, "ngIf", "ngIfElse"], [3, "po-listbox-container-loading-default", 4, "ngIf"], ["noDataTemplate", ""], [3, "p-literals", "p-field-value", "p-placeholder", "p-change"], ["searchElement", ""], ["cdkListbox", "", 1, "po-listbox-list", 3, "cdkListboxMultiple"], ["listboxItemList", ""], ["cdkOption", "selectAll", 3, "click", "keydown", 4, "ngIf"], [3, "po-listbox-item", "cdkOption", "cdkOptionDisabled", "click", "keydown", 4, "ngFor", "ngForOf"], ["cdkOption", "selectAll", 3, "click", "keydown"], ["p-type", "check", "p-value", "selectAll", 3, "p-selected", "p-label", "p-checkbox-value"], [3, "cdkOption", "cdkOptionDisabled", "click", "keydown"], ["class", "po-combo-item-title", 4, "ngIf"], [3, "p-disabled", "p-visible", "p-checkbox-value", "p-label", "p-value", "p-selected", "p-separator", "p-danger", "p-icon", "p-type", "p-item", "p-field-value", "p-field-label", "p-template", "p-template-context", "p-search-value", "p-filter-mode", "p-filtering", "p-should-mark-letter", "p-compare-cache", "p-combo-service", "p-selectcheckbox-item", "p-selectcombo-item", "p-select-item", 4, "ngIf"], [1, "po-combo-item-title"], [3, "p-disabled", "p-visible", "p-checkbox-value", "p-label", "p-value", "p-selected", "p-separator", "p-danger", "p-icon", "p-type", "p-item", "p-field-value", "p-field-label", "p-template", "p-template-context", "p-search-value", "p-filter-mode", "p-filtering", "p-should-mark-letter", "p-compare-cache", "p-combo-service", "p-selectcheckbox-item", "p-selectcombo-item", "p-select-item"], ["p-size", "md"], ["class", "po-listbox-container-no-data po-text-center", 4, "ngIf"], [1, "po-listbox-container-no-data", "po-text-center"]], template: function PoListBoxComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c3$c);
             i0.ɵɵelementStart(0, "div", 0, 1);
             i0.ɵɵprojection(2);
             i0.ɵɵtemplate(3, PoListBoxComponent_po_search_list_3_Template, 2, 3, "po-search-list", 2);
             i0.ɵɵtemplate(4, PoListBoxComponent_ng_container_4_Template, 5, 3, "ng-container", 3);
-            i0.ɵɵtemplate(5, PoListBoxComponent_div_5_Template, 2, 3, "div", 4);
-            i0.ɵɵtemplate(6, PoListBoxComponent_ng_template_6_Template, 1, 0, "ng-template", null, 5, i0.ɵɵtemplateRefExtractor);
-            i0.ɵɵtemplate(8, PoListBoxComponent_ng_template_8_Template, 1, 0, "ng-template", null, 6, i0.ɵɵtemplateRefExtractor);
-            i0.ɵɵtemplate(10, PoListBoxComponent_ng_template_10_Template, 1, 1, "ng-template", null, 7, i0.ɵɵtemplateRefExtractor);
+            i0.ɵɵtemplate(5, PoListBoxComponent_div_5_Template, 2, 2, "div", 4);
+            i0.ɵɵtemplate(6, PoListBoxComponent_ng_template_6_Template, 1, 1, "ng-template", null, 5, i0.ɵɵtemplateRefExtractor);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
-            const _r8 = i0.ɵɵreference(11);
+            const _r4 = i0.ɵɵreference(7);
             i0.ɵɵclassProp("po-listbox-check", ctx.type === "check" || ctx.type === "option");
             i0.ɵɵproperty("hidden", ctx.visible);
             i0.ɵɵattribute("data-type", ctx.type);
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("ngIf", !ctx.hideSearch && ctx.type === "check");
             i0.ɵɵadvance(1);
-            i0.ɵɵproperty("ngIf", ctx.checkTemplate())("ngIfElse", _r8);
+            i0.ɵɵproperty("ngIf", ctx.checkTemplate())("ngIfElse", _r4);
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.isServerSearching && ctx.type !== "action");
-        } }, dependencies: [i1.NgForOf, i1.NgIf, PoLoadingComponent, PoLoadingOverlayComponent, i6.CdkListbox, i6.CdkOption, PoItemListComponent, PoSearchListComponent, i1.JsonPipe], encapsulation: 2 });
+        } }, dependencies: [i1.NgForOf, i1.NgIf, PoLoadingOverlayComponent, i5.CdkListbox, i5.CdkOption, PoItemListComponent, PoSearchListComponent, i1.JsonPipe], encapsulation: 2 });
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoListBoxComponent, [{
         type: Component,
-        args: [{ selector: 'po-listbox', template: "<div\n  #listbox\n  class=\"po-listbox\"\n  [class.po-listbox-check]=\"type === 'check' || type === 'option'\"\n  [attr.data-type]=\"type\"\n  [hidden]=\"visible\"\n>\n  <ng-content select=\"[p-popup-header-template]\"></ng-content>\n\n  <po-search-list\n    #searchElement\n    *ngIf=\"!hideSearch && type === 'check'\"\n    (p-change)=\"callChangeSearch($event)\"\n    [p-literals]=\"literalSearch\"\n    [p-field-value]=\"fieldValueSearch\"\n    [p-placeholder]=\"placeholderSearch\"\n  ></po-search-list>\n\n  <ng-container *ngIf=\"checkTemplate(); else noDataTemplate\">\n    <ul #listboxItemList cdkListbox [cdkListboxMultiple]=\"type === 'check'\" class=\"po-listbox-list\">\n      <li\n        cdkOption=\"selectAll\"\n        *ngIf=\"type === 'check' && items.length && !searchElement?.inputValue && !hideSelectAll\"\n        [attr.aria-checked]=\"checkboxAllValue === null ? 'mixed' : checkboxAllValue\"\n        (click)=\"changeAll.emit()\"\n        (keydown)=\"changeAllEmit($event)\"\n      >\n        <po-item-list\n          [p-selected]=\"checkboxAllValue\"\n          p-type=\"check\"\n          [p-label]=\"literals.selectAll\"\n          p-value=\"selectAll\"\n          [p-checkbox-value]=\"checkboxAllValue\"\n        >\n        </po-item-list>\n      </li>\n      <li\n        [class.po-listbox-item]=\"visible\"\n        *ngFor=\"let item of items\"\n        [cdkOption]=\"item[fieldLabel]\"\n        [cdkOptionDisabled]=\"\n          returnBooleanValue(item, 'disabled') || returnBooleanValue(item, 'visible') === false || item.options\n        \"\n        [attr.aria-selected]=\"isSelectedItem(item) || item.selected\"\n        (click)=\"onSelectItem(item)\"\n        (keydown)=\"onKeyDown(item, $event)\"\n      >\n        <label *ngIf=\"item.options\" class=\"po-combo-item-title\">\n          {{ item.label }}\n        </label>\n        <po-item-list\n          *ngIf=\"returnBooleanValue(item, 'visible') !== false && !item.options\"\n          [p-disabled]=\"returnBooleanValue(item, 'disabled')\"\n          [p-visible]=\"returnBooleanValue(item, 'visible')\"\n          [p-checkbox-value]=\"isSelectedItem(item)\"\n          [attr.data-item-list]=\"item | json\"\n          [p-label]=\"item[fieldLabel]\"\n          [p-value]=\"item[fieldValue]\"\n          [p-selected]=\"isSelectedItem(item) || item.selected\"\n          [p-separator]=\"item.separator\"\n          [p-danger]=\"item.danger || item.type === 'danger'\"\n          [p-icon]=\"item.icon\"\n          [p-type]=\"type\"\n          [p-item]=\"item\"\n          [p-field-value]=\"fieldValue\"\n          [p-field-label]=\"fieldLabel\"\n          [p-template]=\"template\"\n          [p-template-context]=\"item\"\n          (p-selectcheckbox-item)=\"checkboxClicked($event)\"\n          (p-selectcombo-item)=\"optionClicked($event)\"\n          (p-select-item)=\"onSelectCheckBoxItem(item)\"\n          [p-search-value]=\"searchValue\"\n          [p-filter-mode]=\"filterMode\"\n          [p-filtering]=\"isFiltering\"\n          [p-should-mark-letter]=\"shouldMarkLetters\"\n          [p-compare-cache]=\"compareCache\"\n          [p-combo-service]=\"comboService\"\n        ></po-item-list>\n      </li>\n    </ul>\n  </ng-container>\n\n  <div *ngIf=\"isServerSearching && type !== 'action'\" class=\"po-text-center\">\n    <ng-container *ngIf=\"infiniteLoading; then scrollLoadingTemplate; else defaultLoadingTemplate\"></ng-container>\n  </div>\n\n  <ng-template #scrollLoadingTemplate>\n    <po-loading-overlay class=\"po-listbox-container-loading-scroll\"></po-loading-overlay>\n  </ng-template>\n\n  <ng-template #defaultLoadingTemplate>\n    <po-loading class=\"po-listbox-container-loading-default\"></po-loading>\n  </ng-template>\n\n  <ng-template #noDataTemplate>\n    <div\n      *ngIf=\"!items.length && !isServerSearching && type !== 'action'\"\n      class=\"po-listbox-container-no-data po-text-center\"\n    >\n      <span> {{ literals.noItems }}</span>\n    </div>\n  </ng-template>\n</div>\n" }]
+        args: [{ selector: 'po-listbox', template: "<div\n  #listbox\n  class=\"po-listbox\"\n  [class.po-listbox-check]=\"type === 'check' || type === 'option'\"\n  [attr.data-type]=\"type\"\n  [hidden]=\"visible\"\n>\n  <ng-content select=\"[p-popup-header-template]\"></ng-content>\n\n  <po-search-list\n    #searchElement\n    *ngIf=\"!hideSearch && type === 'check'\"\n    (p-change)=\"callChangeSearch($event)\"\n    [p-literals]=\"literalSearch\"\n    [p-field-value]=\"fieldValueSearch\"\n    [p-placeholder]=\"placeholderSearch\"\n  ></po-search-list>\n\n  <ng-container *ngIf=\"checkTemplate(); else noDataTemplate\">\n    <ul #listboxItemList cdkListbox [cdkListboxMultiple]=\"type === 'check'\" class=\"po-listbox-list\">\n      <li\n        cdkOption=\"selectAll\"\n        *ngIf=\"type === 'check' && items.length && !searchElement?.inputValue && !hideSelectAll\"\n        [attr.aria-checked]=\"checkboxAllValue === null ? 'mixed' : checkboxAllValue\"\n        (click)=\"changeAll.emit()\"\n        (keydown)=\"changeAllEmit($event)\"\n      >\n        <po-item-list\n          [p-selected]=\"checkboxAllValue\"\n          p-type=\"check\"\n          [p-label]=\"literals.selectAll\"\n          p-value=\"selectAll\"\n          [p-checkbox-value]=\"checkboxAllValue\"\n        >\n        </po-item-list>\n      </li>\n      <li\n        [class.po-listbox-item]=\"visible\"\n        *ngFor=\"let item of items\"\n        [cdkOption]=\"item[fieldLabel]\"\n        [cdkOptionDisabled]=\"\n          returnBooleanValue(item, 'disabled') || returnBooleanValue(item, 'visible') === false || item.options\n        \"\n        [attr.aria-selected]=\"isSelectedItem(item) || item.selected\"\n        (click)=\"onSelectItem(item)\"\n        (keydown)=\"onKeyDown(item, $event)\"\n      >\n        <label *ngIf=\"item.options\" class=\"po-combo-item-title\">\n          {{ item.label }}\n        </label>\n        <po-item-list\n          *ngIf=\"returnBooleanValue(item, 'visible') !== false && !item.options\"\n          [p-disabled]=\"returnBooleanValue(item, 'disabled')\"\n          [p-visible]=\"returnBooleanValue(item, 'visible')\"\n          [p-checkbox-value]=\"isSelectedItem(item)\"\n          [attr.data-item-list]=\"item | json\"\n          [p-label]=\"item[fieldLabel]\"\n          [p-value]=\"item[fieldValue]\"\n          [p-selected]=\"isSelectedItem(item) || item.selected\"\n          [p-separator]=\"item.separator\"\n          [p-danger]=\"item.danger || item.type === 'danger'\"\n          [p-icon]=\"item.icon\"\n          [p-type]=\"type\"\n          [p-item]=\"item\"\n          [p-field-value]=\"fieldValue\"\n          [p-field-label]=\"fieldLabel\"\n          [p-template]=\"template\"\n          [p-template-context]=\"item\"\n          (p-selectcheckbox-item)=\"checkboxClicked($event)\"\n          (p-selectcombo-item)=\"optionClicked($event)\"\n          (p-select-item)=\"onSelectCheckBoxItem(item)\"\n          [p-search-value]=\"searchValue\"\n          [p-filter-mode]=\"filterMode\"\n          [p-filtering]=\"isFiltering\"\n          [p-should-mark-letter]=\"shouldMarkLetters\"\n          [p-compare-cache]=\"compareCache\"\n          [p-combo-service]=\"comboService\"\n        ></po-item-list>\n      </li>\n    </ul>\n  </ng-container>\n\n  <div *ngIf=\"isServerSearching && type !== 'action'\" [class.po-listbox-container-loading-default]=\"!infiniteLoading\">\n    <po-loading-overlay p-size=\"md\"></po-loading-overlay>\n  </div>\n\n  <ng-template #noDataTemplate>\n    <div\n      *ngIf=\"!items.length && !isServerSearching && type !== 'action'\"\n      class=\"po-listbox-container-no-data po-text-center\"\n    >\n      <span> {{ literals.noItems }}</span>\n    </div>\n  </ng-template>\n</div>\n" }]
     }], function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: PoLanguageService }, { type: i2.Router }, { type: i0.ChangeDetectorRef }]; }, { listbox: [{
             type: ViewChild,
             args: ['listbox', { static: true }]
@@ -20163,6 +20192,7 @@ class PoTableBaseComponent {
     itemsSelected = [];
     paramsFilter;
     filteredItems = [];
+    initialized = false;
     initialVisibleColumns = false;
     _spacing = PoTableColumnSpacing.Medium;
     _filteredColumns;
@@ -20627,6 +20657,10 @@ class PoTableBaseComponent {
         if (changes.height) {
             this.calculateHeightTableContainer(this.height);
         }
+        if ((changes.height || changes.items) && this.initialized) {
+            this.changeHeaderWidth();
+        }
+        this.changeSizeLoading();
     }
     selectAllRows() {
         if (!this.hideSelectAll) {
@@ -21419,20 +21453,17 @@ function PoTableComponent_po_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngTemplateOutlet", _r4);
 } }
-function PoTableComponent_ng_template_5_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 45);
-    i0.ɵɵelement(1, "po-loading", 46);
-    i0.ɵɵelementEnd();
+function PoTableComponent_ng_template_5_po_loading_overlay_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "po-loading-overlay", 45);
 } if (rf & 2) {
     const ctx_r41 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("p-text", ctx_r41.literals.loadingData);
+    i0.ɵɵproperty("p-text", ctx_r41.literals.loadingData)("p-size", ctx_r41.sizeLoading);
 } }
 function PoTableComponent_ng_template_5_div_5_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
 } }
 function PoTableComponent_ng_template_5_div_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 47)(1, "div", 48, 49);
+    i0.ɵɵelementStart(0, "div", 46)(1, "div", 47, 48);
     i0.ɵɵtemplate(3, PoTableComponent_ng_template_5_div_5_ng_container_3_Template, 1, 0, "ng-container", 37);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -21457,7 +21488,7 @@ function PoTableComponent_ng_template_5_div_6_Template(rf, ctx) { if (rf & 1) {
 } }
 function PoTableComponent_ng_template_5_div_7_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelement(1, "po-table-subtitle-footer", 52);
+    i0.ɵɵelement(1, "po-table-subtitle-footer", 51);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const column_r50 = ctx.$implicit;
@@ -21466,8 +21497,8 @@ function PoTableComponent_ng_template_5_div_7_ng_container_1_Template(rf, ctx) {
     i0.ɵɵproperty("p-literals", ctx_r49.literals)("p-subtitles", column_r50.subtitles);
 } }
 function PoTableComponent_ng_template_5_div_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 50);
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_5_div_7_ng_container_1_Template, 2, 2, "ng-container", 51);
+    i0.ɵɵelementStart(0, "div", 49);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_5_div_7_ng_container_1_Template, 2, 2, "ng-container", 50);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r45 = i0.ɵɵnextContext(2);
@@ -21476,7 +21507,7 @@ function PoTableComponent_ng_template_5_div_7_Template(rf, ctx) { if (rf & 1) {
 } }
 function PoTableComponent_ng_template_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div");
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_5_div_1_Template, 2, 1, "div", 38);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_5_po_loading_overlay_1_Template, 1, 2, "po-loading-overlay", 38);
     i0.ɵɵelementStart(2, "div", 39)(3, "div", 40, 41);
     i0.ɵɵtemplate(5, PoTableComponent_ng_template_5_div_5_Template, 4, 3, "div", 42);
     i0.ɵɵtemplate(6, PoTableComponent_ng_template_5_div_6_Template, 2, 1, "div", 43);
@@ -21484,7 +21515,7 @@ function PoTableComponent_ng_template_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtemplate(7, PoTableComponent_ng_template_5_div_7_Template, 2, 2, "div", 44);
 } if (rf & 2) {
     const ctx_r5 = i0.ɵɵnextContext();
-    i0.ɵɵclassProp("po-table-container-relative", ctx_r5.loading);
+    i0.ɵɵclassProp("po-table-container-sticky", ctx_r5.loading);
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngIf", ctx_r5.loading);
     i0.ɵɵadvance(2);
@@ -21499,7 +21530,7 @@ function PoTableComponent_ng_template_5_Template(rf, ctx) { if (rf & 1) {
 } }
 function PoTableComponent_div_7_Template(rf, ctx) { if (rf & 1) {
     const _r53 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 53, 54)(2, "po-button", 55);
+    i0.ɵɵelementStart(0, "div", 52, 53)(2, "po-button", 54);
     i0.ɵɵlistener("p-click", function PoTableComponent_div_7_Template_po_button_p_click_2_listener() { i0.ɵɵrestoreView(_r53); const ctx_r52 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r52.onShowMore()); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -21510,7 +21541,7 @@ function PoTableComponent_div_7_Template(rf, ctx) { if (rf & 1) {
 } }
 function PoTableComponent_ng_template_8_th_3_po_checkbox_2_Template(rf, ctx) { if (rf & 1) {
     const _r69 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "po-checkbox", 69);
+    i0.ɵɵelementStart(0, "po-checkbox", 68);
     i0.ɵɵlistener("p-change", function PoTableComponent_ng_template_8_th_3_po_checkbox_2_Template_po_checkbox_p_change_0_listener() { i0.ɵɵrestoreView(_r69); const ctx_r68 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r68.selectAllRows()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -21518,8 +21549,8 @@ function PoTableComponent_ng_template_8_th_3_po_checkbox_2_Template(rf, ctx) { i
     i0.ɵɵproperty("p-checkboxValue", ctx_r67.selectAll === null ? "mixed" : ctx_r67.selectAll);
 } }
 function PoTableComponent_ng_template_8_th_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "th", 67)(1, "div");
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_th_3_po_checkbox_2_Template, 1, 1, "po-checkbox", 68);
+    i0.ɵɵelementStart(0, "th", 66)(1, "div");
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_th_3_po_checkbox_2_Template, 1, 1, "po-checkbox", 67);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r54 = i0.ɵɵnextContext(2);
@@ -21530,10 +21561,10 @@ function PoTableComponent_ng_template_8_th_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵproperty("ngIf", !ctx_r54.hideSelectAll);
 } }
 function PoTableComponent_ng_template_8_th_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "th", 70);
+    i0.ɵɵelement(0, "th", 69);
 } }
 function PoTableComponent_ng_template_8_th_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "th", null, 71);
+    i0.ɵɵelement(0, "th", null, 70);
 } if (rf & 2) {
     const ctx_r56 = i0.ɵɵnextContext(2);
     i0.ɵɵclassProp("po-table-header-master-detail", !ctx_r56.isSingleAction)("po-table-header-single-action", ctx_r56.isSingleAction);
@@ -21542,8 +21573,8 @@ function PoTableComponent_ng_template_8_th_6_ng_container_2_Template(rf, ctx) {
     i0.ɵɵelementContainer(0);
 } }
 function PoTableComponent_ng_template_8_th_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "th", 72, 73);
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_th_6_ng_container_2_Template, 1, 0, "ng-container", 62);
+    i0.ɵɵelementStart(0, "th", 71, 72);
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_th_6_ng_container_2_Template, 1, 0, "ng-container", 61);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r57 = i0.ɵɵnextContext(2);
@@ -21558,8 +21589,8 @@ function PoTableComponent_ng_template_8_ng_container_7_Template(rf, ctx) { if (r
 function PoTableComponent_ng_template_8_ng_template_8_th_0_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(1, "svg", 78);
-    i0.ɵɵelement(2, "circle", 79)(3, "circle", 80)(4, "circle", 81)(5, "circle", 82)(6, "circle", 83)(7, "circle", 84);
+    i0.ɵɵelementStart(1, "svg", 77);
+    i0.ɵɵelement(2, "circle", 78)(3, "circle", 79)(4, "circle", 80)(5, "circle", 81)(6, "circle", 82)(7, "circle", 83);
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } }
@@ -21570,13 +21601,13 @@ const _c15 = function (a0) { return { "po-table-header-sorted": a0 }; };
 const _c16 = function (a0) { return { $implicit: a0 }; };
 function PoTableComponent_ng_template_8_ng_template_8_th_0_Template(rf, ctx) { if (rf & 1) {
     const _r79 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "th", 75);
+    i0.ɵɵelementStart(0, "th", 74);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_8_ng_template_8_th_0_Template_th_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r79); const column_r74 = restoredCtx.$implicit; const ctx_r78 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r78.sortColumn(column_r74)); });
     i0.ɵɵpipe(1, "lowercase");
     i0.ɵɵpipe(2, "titlecase");
-    i0.ɵɵelementStart(3, "div", 76);
+    i0.ɵɵelementStart(3, "div", 75);
     i0.ɵɵtemplate(4, PoTableComponent_ng_template_8_ng_template_8_th_0_ng_container_4_Template, 8, 0, "ng-container", 43);
-    i0.ɵɵtemplate(5, PoTableComponent_ng_template_8_ng_template_8_th_0_ng_container_5_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵtemplate(5, PoTableComponent_ng_template_8_ng_template_8_th_0_ng_container_5_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const column_r74 = ctx.$implicit;
@@ -21594,7 +21625,7 @@ function PoTableComponent_ng_template_8_ng_template_8_th_0_Template(rf, ctx) { i
     i0.ɵɵproperty("ngTemplateOutlet", _r18)("ngTemplateOutletContext", i0.ɵɵpureFunction1(31, _c16, column_r74));
 } }
 function PoTableComponent_ng_template_8_ng_template_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_8_ng_template_8_th_0_Template, 6, 33, "th", 74);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_8_ng_template_8_th_0_Template, 6, 33, "th", 73);
 } if (rf & 2) {
     const ctx_r60 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngForOf", ctx_r60.mainColumns)("ngForTrackBy", ctx_r60.trackBy);
@@ -21604,12 +21635,12 @@ function PoTableComponent_ng_template_8_ng_template_10_th_0_ng_container_4_Templ
 } }
 function PoTableComponent_ng_template_8_ng_template_10_th_0_Template(rf, ctx) { if (rf & 1) {
     const _r85 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "th", 86);
+    i0.ɵɵelementStart(0, "th", 85);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_8_ng_template_10_th_0_Template_th_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r85); const column_r81 = restoredCtx.$implicit; const ctx_r84 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r84.sortColumn(column_r81)); });
     i0.ɵɵpipe(1, "lowercase");
     i0.ɵɵpipe(2, "titlecase");
-    i0.ɵɵelementStart(3, "div", 76);
-    i0.ɵɵtemplate(4, PoTableComponent_ng_template_8_ng_template_10_th_0_ng_container_4_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵelementStart(3, "div", 75);
+    i0.ɵɵtemplate(4, PoTableComponent_ng_template_8_ng_template_10_th_0_ng_container_4_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const column_r81 = ctx.$implicit;
@@ -21625,13 +21656,13 @@ function PoTableComponent_ng_template_8_ng_template_10_th_0_Template(rf, ctx) {
     i0.ɵɵproperty("ngTemplateOutlet", _r18)("ngTemplateOutletContext", i0.ɵɵpureFunction1(27, _c16, column_r81));
 } }
 function PoTableComponent_ng_template_8_ng_template_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_8_ng_template_10_th_0_Template, 5, 29, "th", 85);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_8_ng_template_10_th_0_Template, 5, 29, "th", 84);
 } if (rf & 2) {
     const ctx_r62 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngForOf", ctx_r62.mainColumns)("ngForTrackBy", ctx_r62.trackBy);
 } }
 function PoTableComponent_ng_template_8_th_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "th", 70);
+    i0.ɵɵelement(0, "th", 69);
 } }
 function PoTableComponent_ng_template_8_th_13_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "th");
@@ -21640,7 +21671,7 @@ function PoTableComponent_ng_template_8_th_13_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵclassProp("po-table-header-single-action", ctx_r64.isSingleAction)("po-table-header-actions", !ctx_r64.isSingleAction);
 } }
 function PoTableComponent_ng_template_8_tbody_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tbody", 87)(1, "tr", 88)(2, "td", 89)(3, "span");
+    i0.ɵɵelementStart(0, "tbody", 86)(1, "tr", 87)(2, "td", 88)(3, "span");
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
@@ -21654,8 +21685,8 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_2_ng_containe
     i0.ɵɵelementContainer(0);
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "td", 67);
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_2_ng_container_1_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵelementStart(0, "td", 66);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_2_ng_container_1_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const row_r87 = i0.ɵɵnextContext().$implicit;
@@ -21669,9 +21700,9 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_3_ng_template
 const _c17 = function (a0, a1) { return { row: a0, rowIndex: a1 }; };
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_3_Template(rf, ctx) { if (rf & 1) {
     const _r103 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "td", 95);
+    i0.ɵɵelementStart(0, "td", 94);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_3_Template_td_click_0_listener() { i0.ɵɵrestoreView(_r103); const row_r87 = i0.ɵɵnextContext().$implicit; const ctx_r101 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r101.toggleDetail(row_r87)); });
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_3_ng_template_1_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_3_ng_template_1_Template, 0, 0, "ng-template", 95);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r104 = i0.ɵɵnextContext();
@@ -21684,7 +21715,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_3_Template(rf
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_4_ng_template_0_Template(rf, ctx) { }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_8_ng_container_15_tbody_1_4_ng_template_0_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_8_ng_container_15_tbody_1_4_ng_template_0_Template, 0, 0, "ng-template", 95);
 } if (rf & 2) {
     const ctx_r106 = i0.ɵɵnextContext();
     const row_r87 = ctx_r106.$implicit;
@@ -21696,9 +21727,9 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_4_Template(rf, c
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_5_ng_template_1_Template(rf, ctx) { }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_5_Template(rf, ctx) { if (rf & 1) {
     const _r110 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "td", 95);
+    i0.ɵɵelementStart(0, "td", 94);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_5_Template_td_click_0_listener() { i0.ɵɵrestoreView(_r110); const row_r87 = i0.ɵɵnextContext().$implicit; const ctx_r108 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r108.toggleDetail(row_r87)); });
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_5_ng_template_1_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_5_ng_template_1_Template, 0, 0, "ng-template", 95);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r111 = i0.ɵɵnextContext();
@@ -21714,7 +21745,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_2_ng_c
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_2_ng_container_1_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_2_ng_container_1_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const column_r112 = i0.ɵɵnextContext().$implicit;
@@ -21729,7 +21760,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_3_ng_c
 const _c18 = function (a0, a1) { return { row: a0, column: a1 }; };
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_3_ng_container_1_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_3_ng_container_1_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const column_r112 = i0.ɵɵnextContext().$implicit;
@@ -21810,7 +21841,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_9_Temp
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_po_table_column_link_10_Template(rf, ctx) { if (rf & 1) {
     const _r147 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "po-table-column-link", 103);
+    i0.ɵɵelementStart(0, "po-table-column-link", 102);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_po_table_column_link_10_Template_po_table_column_link_click_0_listener($event) { i0.ɵɵrestoreView(_r147); const column_r112 = i0.ɵɵnextContext().$implicit; const row_r87 = i0.ɵɵnextContext().$implicit; const ctx_r145 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r145.onClickLink($event, row_r87, column_r112)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -21820,7 +21851,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_po_table_co
     i0.ɵɵproperty("p-action", column_r112.action)("p-disabled", ctx_r122.checkDisabled(row_r87, column_r112))("p-link", row_r87[column_r112.link])("p-row", row_r87)("p-value", ctx_r122.getCellData(row_r87, column_r112));
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_po_table_column_icon_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "po-table-column-icon", 104);
+    i0.ɵɵelement(0, "po-table-column-icon", 103);
 } if (rf & 2) {
     const column_r112 = i0.ɵɵnextContext().$implicit;
     const row_r87 = i0.ɵɵnextContext().$implicit;
@@ -21829,7 +21860,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_po_table_co
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_12_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
-    i0.ɵɵelement(1, "po-table-subtitle-circle", 105);
+    i0.ɵɵelement(1, "po-table-subtitle-circle", 104);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const column_r112 = i0.ɵɵnextContext().$implicit;
@@ -21840,7 +21871,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_12_Tem
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_13_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
-    i0.ɵɵelement(1, "po-table-column-label", 106);
+    i0.ɵɵelement(1, "po-table-column-label", 105);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const column_r112 = i0.ɵɵnextContext().$implicit;
@@ -21862,23 +21893,23 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_14_Tem
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_Template(rf, ctx) { if (rf & 1) {
     const _r160 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "td", 97);
+    i0.ɵɵelementStart(0, "td", 96);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_Template_td_click_0_listener() { i0.ɵɵrestoreView(_r160); const row_r87 = i0.ɵɵnextContext().$implicit; const ctx_r159 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r159.hasSelectableRow() ? ctx_r159.selectRow(row_r87) : "javascript:;"); });
-    i0.ɵɵelementStart(1, "div", 98);
+    i0.ɵɵelementStart(1, "div", 97);
     i0.ɵɵlistener("mouseenter", function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_Template_div_mouseenter_1_listener($event) { const restoredCtx = i0.ɵɵrestoreView(_r160); const column_r112 = restoredCtx.$implicit; const row_r87 = i0.ɵɵnextContext().$implicit; const ctx_r162 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r162.tooltipMouseEnter($event, column_r112, row_r87)); })("mouseleave", function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_Template_div_mouseleave_1_listener() { i0.ɵɵrestoreView(_r160); const ctx_r164 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r164.tooltipMouseLeave()); });
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_2_Template, 2, 4, "span", 99);
-    i0.ɵɵtemplate(3, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_3_Template, 2, 5, "span", 99);
-    i0.ɵɵtemplate(4, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_4_Template, 2, 1, "span", 99);
-    i0.ɵɵtemplate(5, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_5_Template, 3, 6, "span", 99);
-    i0.ɵɵtemplate(6, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_6_Template, 3, 4, "span", 99);
-    i0.ɵɵtemplate(7, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_7_Template, 3, 4, "span", 99);
-    i0.ɵɵtemplate(8, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_8_Template, 3, 4, "span", 99);
-    i0.ɵɵtemplate(9, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_9_Template, 2, 1, "span", 99);
-    i0.ɵɵtemplate(10, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_po_table_column_link_10_Template, 1, 5, "po-table-column-link", 100);
-    i0.ɵɵtemplate(11, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_po_table_column_icon_11_Template, 1, 3, "po-table-column-icon", 101);
-    i0.ɵɵtemplate(12, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_12_Template, 2, 1, "span", 99);
-    i0.ɵɵtemplate(13, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_13_Template, 2, 1, "span", 99);
-    i0.ɵɵtemplate(14, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_14_Template, 2, 1, "span", 102);
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_2_Template, 2, 4, "span", 98);
+    i0.ɵɵtemplate(3, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_3_Template, 2, 5, "span", 98);
+    i0.ɵɵtemplate(4, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_4_Template, 2, 1, "span", 98);
+    i0.ɵɵtemplate(5, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_5_Template, 3, 6, "span", 98);
+    i0.ɵɵtemplate(6, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_6_Template, 3, 4, "span", 98);
+    i0.ɵɵtemplate(7, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_7_Template, 3, 4, "span", 98);
+    i0.ɵɵtemplate(8, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_8_Template, 3, 4, "span", 98);
+    i0.ɵɵtemplate(9, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_9_Template, 2, 1, "span", 98);
+    i0.ɵɵtemplate(10, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_po_table_column_link_10_Template, 1, 5, "po-table-column-link", 99);
+    i0.ɵɵtemplate(11, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_po_table_column_icon_11_Template, 1, 3, "po-table-column-icon", 100);
+    i0.ɵɵtemplate(12, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_12_Template, 2, 1, "span", 98);
+    i0.ɵɵtemplate(13, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_13_Template, 2, 1, "span", 98);
+    i0.ɵɵtemplate(14, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_span_14_Template, 2, 1, "span", 101);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const column_r112 = ctx.$implicit;
@@ -21917,9 +21948,9 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_Template(rf
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_7_ng_template_1_Template(rf, ctx) { }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_7_Template(rf, ctx) { if (rf & 1) {
     const _r169 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "td", 95);
+    i0.ɵɵelementStart(0, "td", 94);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_7_Template_td_click_0_listener() { i0.ɵɵrestoreView(_r169); const row_r87 = i0.ɵɵnextContext().$implicit; const ctx_r167 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r167.toggleDetail(row_r87)); });
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_7_ng_template_1_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_7_ng_template_1_Template, 0, 0, "ng-template", 95);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r170 = i0.ɵɵnextContext();
@@ -21932,7 +21963,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_7_Template(rf
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_8_ng_template_0_Template(rf, ctx) { }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_8_ng_container_15_tbody_1_8_ng_template_0_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_8_ng_container_15_tbody_1_8_ng_template_0_Template, 0, 0, "ng-template", 95);
 } if (rf & 2) {
     const ctx_r172 = i0.ɵɵnextContext();
     const row_r87 = ctx_r172.$implicit;
@@ -21944,8 +21975,8 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_8_Template(rf, c
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_tr_9_ng_template_2_Template(rf, ctx) { }
 const _c19 = function (a0, a1) { return { $implicit: a0, rowIndex: a1 }; };
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_tr_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr")(1, "td", 107);
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_ng_container_15_tbody_1_tr_9_ng_template_2_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵelementStart(0, "tr")(1, "td", 106);
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_ng_container_15_tbody_1_tr_9_ng_template_2_Template, 0, 0, "ng-template", 95);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r174 = i0.ɵɵnextContext();
@@ -21959,7 +21990,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_tr_9_Template(rf
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_tr_10_Template(rf, ctx) { if (rf & 1) {
     const _r176 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "tr")(1, "td", 108)(2, "po-table-detail", 109);
+    i0.ɵɵelementStart(0, "tr")(1, "td", 107)(2, "po-table-detail", 108);
     i0.ɵɵlistener("p-select-row", function PoTableComponent_ng_template_8_ng_container_15_tbody_1_tr_10_Template_po_table_detail_p_select_row_2_listener($event) { i0.ɵɵrestoreView(_r176); const ctx_r175 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r175.selectDetailRow($event)); });
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -21971,13 +22002,13 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_tr_10_Template(r
     i0.ɵɵproperty("p-selectable", ctx_r97.selectable && !ctx_r97.detailHideSelect)("p-detail", ctx_r97.columnMasterDetail.detail)("p-items", row_r87[ctx_r97.nameColumnDetail]);
 } }
 function PoTableComponent_ng_template_8_ng_container_15_tbody_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tbody", 87)(1, "tr", 91);
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_2_Template, 2, 4, "td", 92);
-    i0.ɵɵtemplate(3, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_3_Template, 2, 5, "td", 93);
+    i0.ɵɵelementStart(0, "tbody", 86)(1, "tr", 90);
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_2_Template, 2, 4, "td", 91);
+    i0.ɵɵtemplate(3, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_3_Template, 2, 5, "td", 92);
     i0.ɵɵtemplate(4, PoTableComponent_ng_template_8_ng_container_15_tbody_1_4_Template, 1, 5, null, 43);
-    i0.ɵɵtemplate(5, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_5_Template, 2, 5, "td", 93);
-    i0.ɵɵtemplate(6, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_Template, 15, 31, "td", 94);
-    i0.ɵɵtemplate(7, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_7_Template, 2, 5, "td", 93);
+    i0.ɵɵtemplate(5, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_5_Template, 2, 5, "td", 92);
+    i0.ɵɵtemplate(6, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_6_Template, 15, 31, "td", 93);
+    i0.ɵɵtemplate(7, PoTableComponent_ng_template_8_ng_container_15_tbody_1_td_7_Template, 2, 5, "td", 92);
     i0.ɵɵtemplate(8, PoTableComponent_ng_template_8_ng_container_15_tbody_1_8_Template, 1, 5, null, 43);
     i0.ɵɵelementEnd();
     i0.ɵɵtemplate(9, PoTableComponent_ng_template_8_ng_container_15_tbody_1_tr_9_Template, 3, 6, "tr", 43);
@@ -22010,7 +22041,7 @@ function PoTableComponent_ng_template_8_ng_container_15_tbody_1_Template(rf, ctx
 } }
 function PoTableComponent_ng_template_8_ng_container_15_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_Template, 11, 12, "tbody", 90);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_8_ng_container_15_tbody_1_Template, 11, 12, "tbody", 89);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const ctx_r66 = i0.ɵɵnextContext(2);
@@ -22021,19 +22052,19 @@ const _c20 = function (a0, a1, a2) { return { "po-table-interactive": a0, "po-ta
 const _c21 = function (a0, a1) { return { "no-hover": a0, "po-table-column-drag": a1 }; };
 function PoTableComponent_ng_template_8_Template(rf, ctx) { if (rf & 1) {
     const _r179 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "table", 56)(1, "thead")(2, "tr", 57);
+    i0.ɵɵelementStart(0, "table", 55)(1, "thead")(2, "tr", 56);
     i0.ɵɵlistener("cdkDropListDropped", function PoTableComponent_ng_template_8_Template_tr_cdkDropListDropped_2_listener($event) { i0.ɵɵrestoreView(_r179); const ctx_r178 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r178.drop($event)); });
-    i0.ɵɵtemplate(3, PoTableComponent_ng_template_8_th_3_Template, 3, 5, "th", 58);
-    i0.ɵɵtemplate(4, PoTableComponent_ng_template_8_th_4_Template, 1, 0, "th", 59);
-    i0.ɵɵtemplate(5, PoTableComponent_ng_template_8_th_5_Template, 2, 4, "th", 60);
-    i0.ɵɵtemplate(6, PoTableComponent_ng_template_8_th_6_Template, 3, 3, "th", 61);
-    i0.ɵɵtemplate(7, PoTableComponent_ng_template_8_ng_container_7_Template, 1, 0, "ng-container", 62);
-    i0.ɵɵtemplate(8, PoTableComponent_ng_template_8_ng_template_8_Template, 1, 2, "ng-template", null, 63, i0.ɵɵtemplateRefExtractor);
-    i0.ɵɵtemplate(10, PoTableComponent_ng_template_8_ng_template_10_Template, 1, 2, "ng-template", null, 64, i0.ɵɵtemplateRefExtractor);
-    i0.ɵɵtemplate(12, PoTableComponent_ng_template_8_th_12_Template, 1, 0, "th", 59);
-    i0.ɵɵtemplate(13, PoTableComponent_ng_template_8_th_13_Template, 1, 4, "th", 65);
+    i0.ɵɵtemplate(3, PoTableComponent_ng_template_8_th_3_Template, 3, 5, "th", 57);
+    i0.ɵɵtemplate(4, PoTableComponent_ng_template_8_th_4_Template, 1, 0, "th", 58);
+    i0.ɵɵtemplate(5, PoTableComponent_ng_template_8_th_5_Template, 2, 4, "th", 59);
+    i0.ɵɵtemplate(6, PoTableComponent_ng_template_8_th_6_Template, 3, 3, "th", 60);
+    i0.ɵɵtemplate(7, PoTableComponent_ng_template_8_ng_container_7_Template, 1, 0, "ng-container", 61);
+    i0.ɵɵtemplate(8, PoTableComponent_ng_template_8_ng_template_8_Template, 1, 2, "ng-template", null, 62, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(10, PoTableComponent_ng_template_8_ng_template_10_Template, 1, 2, "ng-template", null, 63, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(12, PoTableComponent_ng_template_8_th_12_Template, 1, 0, "th", 58);
+    i0.ɵɵtemplate(13, PoTableComponent_ng_template_8_th_13_Template, 1, 4, "th", 64);
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(14, PoTableComponent_ng_template_8_tbody_14_Template, 5, 2, "tbody", 66);
+    i0.ɵɵtemplate(14, PoTableComponent_ng_template_8_tbody_14_Template, 5, 2, "tbody", 65);
     i0.ɵɵtemplate(15, PoTableComponent_ng_template_8_ng_container_15_Template, 2, 2, "ng-container", 43);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -22066,7 +22097,7 @@ function PoTableComponent_ng_template_8_Template(rf, ctx) { if (rf & 1) {
 } }
 function PoTableComponent_ng_template_10_th_5_po_checkbox_2_Template(rf, ctx) { if (rf & 1) {
     const _r196 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "po-checkbox", 69);
+    i0.ɵɵelementStart(0, "po-checkbox", 68);
     i0.ɵɵlistener("p-change", function PoTableComponent_ng_template_10_th_5_po_checkbox_2_Template_po_checkbox_p_change_0_listener() { i0.ɵɵrestoreView(_r196); const ctx_r195 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r195.selectAllRows()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -22074,8 +22105,8 @@ function PoTableComponent_ng_template_10_th_5_po_checkbox_2_Template(rf, ctx) {
     i0.ɵɵproperty("p-checkboxValue", ctx_r194.selectAll === null ? "mixed" : ctx_r194.selectAll);
 } }
 function PoTableComponent_ng_template_10_th_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "th", 67)(1, "div");
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_th_5_po_checkbox_2_Template, 1, 1, "po-checkbox", 68);
+    i0.ɵɵelementStart(0, "th", 66)(1, "div");
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_th_5_po_checkbox_2_Template, 1, 1, "po-checkbox", 67);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r181 = i0.ɵɵnextContext(2);
@@ -22086,10 +22117,10 @@ function PoTableComponent_ng_template_10_th_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵproperty("ngIf", !ctx_r181.hideSelectAll);
 } }
 function PoTableComponent_ng_template_10_th_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "th", 70);
+    i0.ɵɵelement(0, "th", 69);
 } }
 function PoTableComponent_ng_template_10_th_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "th", null, 71);
+    i0.ɵɵelement(0, "th", null, 70);
 } if (rf & 2) {
     const ctx_r183 = i0.ɵɵnextContext(2);
     i0.ɵɵclassProp("po-table-header-master-detail", !ctx_r183.isSingleAction)("po-table-header-single-action", ctx_r183.isSingleAction);
@@ -22098,8 +22129,8 @@ function PoTableComponent_ng_template_10_th_8_ng_container_2_Template(rf, ctx) {
     i0.ɵɵelementContainer(0);
 } }
 function PoTableComponent_ng_template_10_th_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "th", 72, 73);
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_th_8_ng_container_2_Template, 1, 0, "ng-container", 62);
+    i0.ɵɵelementStart(0, "th", 71, 72);
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_th_8_ng_container_2_Template, 1, 0, "ng-container", 61);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r184 = i0.ɵɵnextContext(2);
@@ -22114,8 +22145,8 @@ function PoTableComponent_ng_template_10_ng_container_9_Template(rf, ctx) { if (
 function PoTableComponent_ng_template_10_ng_template_10_th_0_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(1, "svg", 78);
-    i0.ɵɵelement(2, "circle", 79)(3, "circle", 80)(4, "circle", 81)(5, "circle", 82)(6, "circle", 83)(7, "circle", 84);
+    i0.ɵɵelementStart(1, "svg", 77);
+    i0.ɵɵelement(2, "circle", 78)(3, "circle", 79)(4, "circle", 80)(5, "circle", 81)(6, "circle", 82)(7, "circle", 83);
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } }
@@ -22125,13 +22156,13 @@ function PoTableComponent_ng_template_10_ng_template_10_th_0_ng_container_5_Temp
 const _c22 = function (a0) { return { "width": a0 }; };
 function PoTableComponent_ng_template_10_ng_template_10_th_0_Template(rf, ctx) { if (rf & 1) {
     const _r206 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "th", 118);
+    i0.ɵɵelementStart(0, "th", 117);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_10_ng_template_10_th_0_Template_th_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r206); const column_r201 = restoredCtx.$implicit; const ctx_r205 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r205.sortColumn(column_r201)); });
     i0.ɵɵpipe(1, "lowercase");
     i0.ɵɵpipe(2, "titlecase");
-    i0.ɵɵelementStart(3, "div", 76);
+    i0.ɵɵelementStart(3, "div", 75);
     i0.ɵɵtemplate(4, PoTableComponent_ng_template_10_ng_template_10_th_0_ng_container_4_Template, 8, 0, "ng-container", 43);
-    i0.ɵɵtemplate(5, PoTableComponent_ng_template_10_ng_template_10_th_0_ng_container_5_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵtemplate(5, PoTableComponent_ng_template_10_ng_template_10_th_0_ng_container_5_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const column_r201 = ctx.$implicit;
@@ -22149,7 +22180,7 @@ function PoTableComponent_ng_template_10_ng_template_10_th_0_Template(rf, ctx) {
     i0.ɵɵproperty("ngTemplateOutlet", _r18)("ngTemplateOutletContext", i0.ɵɵpureFunction1(34, _c16, column_r201));
 } }
 function PoTableComponent_ng_template_10_ng_template_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_10_ng_template_10_th_0_Template, 6, 36, "th", 117);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_10_ng_template_10_th_0_Template, 6, 36, "th", 116);
 } if (rf & 2) {
     const ctx_r187 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngForOf", ctx_r187.mainColumns)("ngForTrackBy", ctx_r187.trackBy);
@@ -22159,12 +22190,12 @@ function PoTableComponent_ng_template_10_ng_template_12_th_0_ng_container_4_Temp
 } }
 function PoTableComponent_ng_template_10_ng_template_12_th_0_Template(rf, ctx) { if (rf & 1) {
     const _r212 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "th", 120);
+    i0.ɵɵelementStart(0, "th", 119);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_10_ng_template_12_th_0_Template_th_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r212); const column_r208 = restoredCtx.$implicit; const ctx_r211 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r211.sortColumn(column_r208)); });
     i0.ɵɵpipe(1, "lowercase");
     i0.ɵɵpipe(2, "titlecase");
-    i0.ɵɵelementStart(3, "div", 76);
-    i0.ɵɵtemplate(4, PoTableComponent_ng_template_10_ng_template_12_th_0_ng_container_4_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵelementStart(3, "div", 75);
+    i0.ɵɵtemplate(4, PoTableComponent_ng_template_10_ng_template_12_th_0_ng_container_4_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const column_r208 = ctx.$implicit;
@@ -22180,13 +22211,13 @@ function PoTableComponent_ng_template_10_ng_template_12_th_0_Template(rf, ctx) {
     i0.ɵɵproperty("ngTemplateOutlet", _r18)("ngTemplateOutletContext", i0.ɵɵpureFunction1(30, _c16, column_r208));
 } }
 function PoTableComponent_ng_template_10_ng_template_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_10_ng_template_12_th_0_Template, 5, 32, "th", 119);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_10_ng_template_12_th_0_Template, 5, 32, "th", 118);
 } if (rf & 2) {
     const ctx_r189 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngForOf", ctx_r189.mainColumns)("ngForTrackBy", ctx_r189.trackBy);
 } }
 function PoTableComponent_ng_template_10_th_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "th", 70);
+    i0.ɵɵelement(0, "th", 69);
 } }
 function PoTableComponent_ng_template_10_th_15_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "th");
@@ -22195,7 +22226,7 @@ function PoTableComponent_ng_template_10_th_15_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵclassProp("po-table-header-single-action", ctx_r191.isSingleAction)("po-table-header-actions", !ctx_r191.isSingleAction);
 } }
 function PoTableComponent_ng_template_10_tbody_16_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tbody", 87)(1, "tr", 88)(2, "td", 89)(3, "span");
+    i0.ɵɵelementStart(0, "tbody", 86)(1, "tr", 87)(2, "td", 88)(3, "span");
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
@@ -22209,8 +22240,8 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_2_ng_contain
     i0.ɵɵelementContainer(0);
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "td", 67);
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_2_ng_container_1_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵelementStart(0, "td", 66);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_2_ng_container_1_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const row_r214 = i0.ɵɵnextContext().$implicit;
@@ -22223,9 +22254,9 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_2_Template(r
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_3_ng_template_1_Template(rf, ctx) { }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_3_Template(rf, ctx) { if (rf & 1) {
     const _r230 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "td", 95);
+    i0.ɵɵelementStart(0, "td", 94);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_3_Template_td_click_0_listener() { i0.ɵɵrestoreView(_r230); const row_r214 = i0.ɵɵnextContext().$implicit; const ctx_r228 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r228.toggleDetail(row_r214)); });
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_3_ng_template_1_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_3_ng_template_1_Template, 0, 0, "ng-template", 95);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r231 = i0.ɵɵnextContext();
@@ -22238,7 +22269,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_3_Template(r
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_4_ng_template_0_Template(rf, ctx) { }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_10_ng_container_17_tbody_1_4_ng_template_0_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_10_ng_container_17_tbody_1_4_ng_template_0_Template, 0, 0, "ng-template", 95);
 } if (rf & 2) {
     const ctx_r233 = i0.ɵɵnextContext();
     const row_r214 = ctx_r233.$implicit;
@@ -22250,9 +22281,9 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_4_Template(rf,
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_5_ng_template_1_Template(rf, ctx) { }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_5_Template(rf, ctx) { if (rf & 1) {
     const _r237 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "td", 95);
+    i0.ɵɵelementStart(0, "td", 94);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_5_Template_td_click_0_listener() { i0.ɵɵrestoreView(_r237); const row_r214 = i0.ɵɵnextContext().$implicit; const ctx_r235 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r235.toggleDetail(row_r214)); });
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_5_ng_template_1_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_5_ng_template_1_Template, 0, 0, "ng-template", 95);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r238 = i0.ɵɵnextContext();
@@ -22268,7 +22299,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_2_ng_
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_2_ng_container_1_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_2_ng_container_1_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const column_r239 = i0.ɵɵnextContext().$implicit;
@@ -22282,7 +22313,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_3_ng_
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_3_ng_container_1_Template, 1, 0, "ng-container", 77);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_3_ng_container_1_Template, 1, 0, "ng-container", 76);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const column_r239 = i0.ɵɵnextContext().$implicit;
@@ -22363,7 +22394,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_9_Tem
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_po_table_column_link_10_Template(rf, ctx) { if (rf & 1) {
     const _r274 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "po-table-column-link", 103);
+    i0.ɵɵelementStart(0, "po-table-column-link", 102);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_po_table_column_link_10_Template_po_table_column_link_click_0_listener($event) { i0.ɵɵrestoreView(_r274); const column_r239 = i0.ɵɵnextContext().$implicit; const row_r214 = i0.ɵɵnextContext().$implicit; const ctx_r272 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r272.onClickLink($event, row_r214, column_r239)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -22373,7 +22404,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_po_table_c
     i0.ɵɵproperty("p-action", column_r239.action)("p-disabled", ctx_r249.checkDisabled(row_r214, column_r239))("p-link", row_r214[column_r239.link])("p-row", row_r214)("p-value", ctx_r249.getCellData(row_r214, column_r239));
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_po_table_column_icon_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "po-table-column-icon", 104);
+    i0.ɵɵelement(0, "po-table-column-icon", 103);
 } if (rf & 2) {
     const column_r239 = i0.ɵɵnextContext().$implicit;
     const row_r214 = i0.ɵɵnextContext().$implicit;
@@ -22382,7 +22413,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_po_table_c
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_12_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
-    i0.ɵɵelement(1, "po-table-subtitle-circle", 105);
+    i0.ɵɵelement(1, "po-table-subtitle-circle", 104);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const column_r239 = i0.ɵɵnextContext().$implicit;
@@ -22393,7 +22424,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_12_Te
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_13_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
-    i0.ɵɵelement(1, "po-table-column-label", 106);
+    i0.ɵɵelement(1, "po-table-column-label", 105);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const column_r239 = i0.ɵɵnextContext().$implicit;
@@ -22415,23 +22446,23 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_14_Te
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_Template(rf, ctx) { if (rf & 1) {
     const _r287 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "td", 123);
+    i0.ɵɵelementStart(0, "td", 122);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_Template_td_click_0_listener() { i0.ɵɵrestoreView(_r287); const row_r214 = i0.ɵɵnextContext().$implicit; const ctx_r286 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r286.hasSelectableRow() ? ctx_r286.selectRow(row_r214) : "javascript:;"); });
-    i0.ɵɵelementStart(1, "div", 98);
+    i0.ɵɵelementStart(1, "div", 97);
     i0.ɵɵlistener("mouseenter", function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_Template_div_mouseenter_1_listener($event) { const restoredCtx = i0.ɵɵrestoreView(_r287); const column_r239 = restoredCtx.$implicit; const row_r214 = i0.ɵɵnextContext().$implicit; const ctx_r289 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r289.tooltipMouseEnter($event, column_r239, row_r214)); })("mouseleave", function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_Template_div_mouseleave_1_listener() { i0.ɵɵrestoreView(_r287); const ctx_r291 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r291.tooltipMouseLeave()); });
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_2_Template, 2, 4, "span", 99);
-    i0.ɵɵtemplate(3, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_3_Template, 2, 5, "span", 99);
-    i0.ɵɵtemplate(4, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_4_Template, 2, 1, "span", 99);
-    i0.ɵɵtemplate(5, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_5_Template, 3, 6, "span", 99);
-    i0.ɵɵtemplate(6, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_6_Template, 3, 4, "span", 99);
-    i0.ɵɵtemplate(7, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_7_Template, 3, 4, "span", 99);
-    i0.ɵɵtemplate(8, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_8_Template, 3, 4, "span", 99);
-    i0.ɵɵtemplate(9, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_9_Template, 2, 1, "span", 99);
-    i0.ɵɵtemplate(10, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_po_table_column_link_10_Template, 1, 5, "po-table-column-link", 100);
-    i0.ɵɵtemplate(11, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_po_table_column_icon_11_Template, 1, 3, "po-table-column-icon", 101);
-    i0.ɵɵtemplate(12, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_12_Template, 2, 1, "span", 99);
-    i0.ɵɵtemplate(13, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_13_Template, 2, 1, "span", 99);
-    i0.ɵɵtemplate(14, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_14_Template, 2, 1, "span", 102);
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_2_Template, 2, 4, "span", 98);
+    i0.ɵɵtemplate(3, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_3_Template, 2, 5, "span", 98);
+    i0.ɵɵtemplate(4, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_4_Template, 2, 1, "span", 98);
+    i0.ɵɵtemplate(5, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_5_Template, 3, 6, "span", 98);
+    i0.ɵɵtemplate(6, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_6_Template, 3, 4, "span", 98);
+    i0.ɵɵtemplate(7, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_7_Template, 3, 4, "span", 98);
+    i0.ɵɵtemplate(8, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_8_Template, 3, 4, "span", 98);
+    i0.ɵɵtemplate(9, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_9_Template, 2, 1, "span", 98);
+    i0.ɵɵtemplate(10, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_po_table_column_link_10_Template, 1, 5, "po-table-column-link", 99);
+    i0.ɵɵtemplate(11, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_po_table_column_icon_11_Template, 1, 3, "po-table-column-icon", 100);
+    i0.ɵɵtemplate(12, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_12_Template, 2, 1, "span", 98);
+    i0.ɵɵtemplate(13, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_13_Template, 2, 1, "span", 98);
+    i0.ɵɵtemplate(14, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_span_14_Template, 2, 1, "span", 101);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const column_r239 = ctx.$implicit;
@@ -22470,9 +22501,9 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_Template(r
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_7_ng_template_1_Template(rf, ctx) { }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_7_Template(rf, ctx) { if (rf & 1) {
     const _r296 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "td", 95);
+    i0.ɵɵelementStart(0, "td", 94);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_7_Template_td_click_0_listener() { i0.ɵɵrestoreView(_r296); const row_r214 = i0.ɵɵnextContext().$implicit; const ctx_r294 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r294.toggleDetail(row_r214)); });
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_7_ng_template_1_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_7_ng_template_1_Template, 0, 0, "ng-template", 95);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r297 = i0.ɵɵnextContext();
@@ -22485,7 +22516,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_7_Template(r
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_8_ng_template_0_Template(rf, ctx) { }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_10_ng_container_17_tbody_1_8_ng_template_0_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_10_ng_container_17_tbody_1_8_ng_template_0_Template, 0, 0, "ng-template", 95);
 } if (rf & 2) {
     const ctx_r299 = i0.ɵɵnextContext();
     const row_r214 = ctx_r299.$implicit;
@@ -22496,8 +22527,8 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_8_Template(rf,
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_tr_9_ng_template_2_Template(rf, ctx) { }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_tr_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr")(1, "td", 107);
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_ng_container_17_tbody_1_tr_9_ng_template_2_Template, 0, 0, "ng-template", 96);
+    i0.ɵɵelementStart(0, "tr")(1, "td", 106);
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_ng_container_17_tbody_1_tr_9_ng_template_2_Template, 0, 0, "ng-template", 95);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r301 = i0.ɵɵnextContext();
@@ -22511,7 +22542,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_tr_9_Template(r
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_tr_10_Template(rf, ctx) { if (rf & 1) {
     const _r303 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "tr")(1, "td", 108)(2, "po-table-detail", 109);
+    i0.ɵɵelementStart(0, "tr")(1, "td", 107)(2, "po-table-detail", 108);
     i0.ɵɵlistener("p-select-row", function PoTableComponent_ng_template_10_ng_container_17_tbody_1_tr_10_Template_po_table_detail_p_select_row_2_listener($event) { i0.ɵɵrestoreView(_r303); const ctx_r302 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r302.selectDetailRow($event)); });
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -22523,13 +22554,13 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_tr_10_Template(
     i0.ɵɵproperty("p-selectable", ctx_r224.selectable && !ctx_r224.detailHideSelect)("p-detail", ctx_r224.columnMasterDetail.detail)("p-items", row_r214[ctx_r224.nameColumnDetail]);
 } }
 function PoTableComponent_ng_template_10_ng_container_17_tbody_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tbody", 87)(1, "tr", 91);
-    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_2_Template, 2, 4, "td", 92);
-    i0.ɵɵtemplate(3, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_3_Template, 2, 5, "td", 93);
+    i0.ɵɵelementStart(0, "tbody", 86)(1, "tr", 90);
+    i0.ɵɵtemplate(2, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_2_Template, 2, 4, "td", 91);
+    i0.ɵɵtemplate(3, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_3_Template, 2, 5, "td", 92);
     i0.ɵɵtemplate(4, PoTableComponent_ng_template_10_ng_container_17_tbody_1_4_Template, 1, 5, null, 43);
-    i0.ɵɵtemplate(5, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_5_Template, 2, 5, "td", 93);
-    i0.ɵɵtemplate(6, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_Template, 15, 31, "td", 122);
-    i0.ɵɵtemplate(7, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_7_Template, 2, 5, "td", 93);
+    i0.ɵɵtemplate(5, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_5_Template, 2, 5, "td", 92);
+    i0.ɵɵtemplate(6, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_6_Template, 15, 31, "td", 121);
+    i0.ɵɵtemplate(7, PoTableComponent_ng_template_10_ng_container_17_tbody_1_td_7_Template, 2, 5, "td", 92);
     i0.ɵɵtemplate(8, PoTableComponent_ng_template_10_ng_container_17_tbody_1_8_Template, 1, 5, null, 43);
     i0.ɵɵelementEnd();
     i0.ɵɵtemplate(9, PoTableComponent_ng_template_10_ng_container_17_tbody_1_tr_9_Template, 3, 6, "tr", 43);
@@ -22562,7 +22593,7 @@ function PoTableComponent_ng_template_10_ng_container_17_tbody_1_Template(rf, ct
 } }
 function PoTableComponent_ng_template_10_ng_container_17_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_Template, 11, 12, "tbody", 121);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_10_ng_container_17_tbody_1_Template, 11, 12, "tbody", 120);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const ctx_r193 = i0.ɵɵnextContext(2);
@@ -22572,19 +22603,19 @@ function PoTableComponent_ng_template_10_ng_container_17_Template(rf, ctx) { if
 const _c23 = function (a0) { return { "table-layout": a0 }; };
 function PoTableComponent_ng_template_10_Template(rf, ctx) { if (rf & 1) {
     const _r306 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "cdk-virtual-scroll-viewport", 110, 111)(2, "table", 112)(3, "thead", 113)(4, "tr", 114);
+    i0.ɵɵelementStart(0, "cdk-virtual-scroll-viewport", 109, 110)(2, "table", 111)(3, "thead", 112)(4, "tr", 113);
     i0.ɵɵlistener("cdkDropListDropped", function PoTableComponent_ng_template_10_Template_tr_cdkDropListDropped_4_listener($event) { i0.ɵɵrestoreView(_r306); const ctx_r305 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r305.drop($event)); });
-    i0.ɵɵtemplate(5, PoTableComponent_ng_template_10_th_5_Template, 3, 5, "th", 58);
-    i0.ɵɵtemplate(6, PoTableComponent_ng_template_10_th_6_Template, 1, 0, "th", 59);
-    i0.ɵɵtemplate(7, PoTableComponent_ng_template_10_th_7_Template, 2, 4, "th", 60);
-    i0.ɵɵtemplate(8, PoTableComponent_ng_template_10_th_8_Template, 3, 3, "th", 61);
-    i0.ɵɵtemplate(9, PoTableComponent_ng_template_10_ng_container_9_Template, 1, 0, "ng-container", 62);
-    i0.ɵɵtemplate(10, PoTableComponent_ng_template_10_ng_template_10_Template, 1, 2, "ng-template", null, 115, i0.ɵɵtemplateRefExtractor);
-    i0.ɵɵtemplate(12, PoTableComponent_ng_template_10_ng_template_12_Template, 1, 2, "ng-template", null, 116, i0.ɵɵtemplateRefExtractor);
-    i0.ɵɵtemplate(14, PoTableComponent_ng_template_10_th_14_Template, 1, 0, "th", 59);
-    i0.ɵɵtemplate(15, PoTableComponent_ng_template_10_th_15_Template, 1, 4, "th", 65);
+    i0.ɵɵtemplate(5, PoTableComponent_ng_template_10_th_5_Template, 3, 5, "th", 57);
+    i0.ɵɵtemplate(6, PoTableComponent_ng_template_10_th_6_Template, 1, 0, "th", 58);
+    i0.ɵɵtemplate(7, PoTableComponent_ng_template_10_th_7_Template, 2, 4, "th", 59);
+    i0.ɵɵtemplate(8, PoTableComponent_ng_template_10_th_8_Template, 3, 3, "th", 60);
+    i0.ɵɵtemplate(9, PoTableComponent_ng_template_10_ng_container_9_Template, 1, 0, "ng-container", 61);
+    i0.ɵɵtemplate(10, PoTableComponent_ng_template_10_ng_template_10_Template, 1, 2, "ng-template", null, 114, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(12, PoTableComponent_ng_template_10_ng_template_12_Template, 1, 2, "ng-template", null, 115, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(14, PoTableComponent_ng_template_10_th_14_Template, 1, 0, "th", 58);
+    i0.ɵɵtemplate(15, PoTableComponent_ng_template_10_th_15_Template, 1, 4, "th", 64);
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(16, PoTableComponent_ng_template_10_tbody_16_Template, 5, 2, "tbody", 66);
+    i0.ɵɵtemplate(16, PoTableComponent_ng_template_10_tbody_16_Template, 5, 2, "tbody", 65);
     i0.ɵɵtemplate(17, PoTableComponent_ng_template_10_ng_container_17_Template, 2, 2, "ng-container", 43);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -22620,13 +22651,13 @@ function PoTableComponent_ng_template_10_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵproperty("ngIf", ctx_r10.hasMainColumns);
 } }
 function PoTableComponent_ng_template_14_span_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 125);
+    i0.ɵɵelement(0, "span", 124);
 } if (rf & 2) {
     const row_r307 = i0.ɵɵnextContext().row;
     i0.ɵɵclassProp("po-icon-arrow-up", row_r307.$showDetail)("po-icon-arrow-down", !row_r307.$showDetail);
 } }
 function PoTableComponent_ng_template_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_14_span_0_Template, 1, 4, "span", 124);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_14_span_0_Template, 1, 4, "span", 123);
 } if (rf & 2) {
     const row_r307 = ctx.row;
     const rowIndex_r308 = ctx.rowIndex;
@@ -22635,7 +22666,7 @@ function PoTableComponent_ng_template_14_Template(rf, ctx) { if (rf & 1) {
 } }
 function PoTableComponent_ng_template_16_Template(rf, ctx) { if (rf & 1) {
     const _r313 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "po-radio", 126);
+    i0.ɵɵelementStart(0, "po-radio", 125);
     i0.ɵɵlistener("p-change-selected", function PoTableComponent_ng_template_16_Template_po_radio_p_change_selected_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r313); const row_r311 = restoredCtx.$implicit; const ctx_r312 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r312.selectRow(row_r311)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -22645,7 +22676,7 @@ function PoTableComponent_ng_template_16_Template(rf, ctx) { if (rf & 1) {
 } }
 function PoTableComponent_ng_template_18_Template(rf, ctx) { if (rf & 1) {
     const _r316 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "po-checkbox", 127);
+    i0.ɵɵelementStart(0, "po-checkbox", 126);
     i0.ɵɵlistener("p-change", function PoTableComponent_ng_template_18_Template_po_checkbox_p_change_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r316); const row_r314 = restoredCtx.$implicit; const ctx_r315 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r315.selectable ? ctx_r315.selectRow(row_r314) : "javascript:;"); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -22655,24 +22686,24 @@ function PoTableComponent_ng_template_18_Template(rf, ctx) { if (rf & 1) {
 function PoTableComponent_ng_template_20_span_4_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(1, "svg", 131);
-    i0.ɵɵelement(2, "path", 132);
+    i0.ɵɵelementStart(1, "svg", 130);
+    i0.ɵɵelement(2, "path", 131);
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } }
 function PoTableComponent_ng_template_20_span_4_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(1, "svg", 131);
-    i0.ɵɵelement(2, "path", 133);
+    i0.ɵɵelementStart(1, "svg", 130);
+    i0.ɵɵelement(2, "path", 132);
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } }
 function PoTableComponent_ng_template_20_span_4_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(1, "svg", 131);
-    i0.ɵɵelement(2, "path", 134);
+    i0.ɵɵelementStart(1, "svg", 130);
+    i0.ɵɵelement(2, "path", 133);
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } }
@@ -22695,12 +22726,12 @@ function PoTableComponent_ng_template_20_span_4_Template(rf, ctx) { if (rf & 1)
 } }
 function PoTableComponent_ng_template_20_Template(rf, ctx) { if (rf & 1) {
     const _r325 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 128, 129);
+    i0.ɵɵelementStart(0, "span", 127, 128);
     i0.ɵɵlistener("mouseenter", function PoTableComponent_ng_template_20_Template_span_mouseenter_0_listener($event) { i0.ɵɵrestoreView(_r325); const ctx_r324 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r324.tooltipMouseEnter($event)); })("mouseleave", function PoTableComponent_ng_template_20_Template_span_mouseleave_0_listener() { i0.ɵɵrestoreView(_r325); const ctx_r326 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r326.tooltipMouseLeave()); });
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "titlecase");
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(4, PoTableComponent_ng_template_20_span_4_Template, 4, 9, "span", 130);
+    i0.ɵɵtemplate(4, PoTableComponent_ng_template_20_span_4_Template, 4, 9, "span", 129);
 } if (rf & 2) {
     const column_r317 = ctx.$implicit;
     const ctx_r19 = i0.ɵɵnextContext();
@@ -22711,12 +22742,12 @@ function PoTableComponent_ng_template_20_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵproperty("ngIf", ctx_r19.sort && column_r317.sortable !== false);
 } }
 function PoTableComponent_ng_template_22_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 135);
+    i0.ɵɵelementStart(0, "div", 134);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r21 = i0.ɵɵnextContext();
-    i0.ɵɵstyleProp("width", ctx_r21.noColumnsHeader == null ? null : ctx_r21.noColumnsHeader.nativeElement.offsetWidth, "px");
+    i0.ɵɵstyleProp("width", ctx_r21.headerWidth, "px");
     i0.ɵɵadvance(1);
     i0.ɵɵtextInterpolate1(" ", ctx_r21.hasValidColumns ? ctx_r21.literals.noVisibleColumn : ctx_r21.literals.noColumns, " ");
 } }
@@ -22727,16 +22758,16 @@ function PoTableComponent_ng_template_24_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtextInterpolate1(" ", ctx_r23.hasValidColumns ? ctx_r23.literals.noVisibleColumn : ctx_r23.literals.noColumns, "\n");
 } }
 function PoTableComponent_ng_template_26_td_0_div_1_po_icon_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "po-icon", 142);
+    i0.ɵɵelement(0, "po-icon", 141);
 } if (rf & 2) {
     const ctx_r332 = i0.ɵɵnextContext(4);
     i0.ɵɵproperty("p-icon", ctx_r332.firstAction.icon);
 } }
 function PoTableComponent_ng_template_26_td_0_div_1_Template(rf, ctx) { if (rf & 1) {
     const _r335 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 140);
+    i0.ɵɵelementStart(0, "div", 139);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_26_td_0_div_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r335); const row_r327 = i0.ɵɵnextContext(2).row; const ctx_r333 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r333.executeTableAction(row_r327, ctx_r333.firstAction)); });
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_26_td_0_div_1_po_icon_1_Template, 1, 1, "po-icon", 141);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_26_td_0_div_1_po_icon_1_Template, 1, 1, "po-icon", 140);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -22749,8 +22780,8 @@ function PoTableComponent_ng_template_26_td_0_div_1_Template(rf, ctx) { if (rf &
     i0.ɵɵtextInterpolate1(" ", ctx_r331.firstAction.label, " ");
 } }
 function PoTableComponent_ng_template_26_td_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "td", 138);
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_26_td_0_div_1_Template, 3, 4, "div", 139);
+    i0.ɵɵelementStart(0, "td", 137);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_26_td_0_div_1_Template, 3, 4, "div", 138);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r329 = i0.ɵɵnextContext(2);
@@ -22760,13 +22791,13 @@ function PoTableComponent_ng_template_26_td_0_Template(rf, ctx) { if (rf & 1) {
 } }
 function PoTableComponent_ng_template_26_td_1_Template(rf, ctx) { if (rf & 1) {
     const _r340 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "td", 143)(1, "span", 144, 145);
+    i0.ɵɵelementStart(0, "td", 142)(1, "span", 143, 144);
     i0.ɵɵlistener("click", function PoTableComponent_ng_template_26_td_1_Template_span_click_1_listener() { i0.ɵɵrestoreView(_r340); const _r337 = i0.ɵɵreference(2); const row_r327 = i0.ɵɵnextContext().row; const ctx_r338 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r338.togglePopup(row_r327, _r337)); });
     i0.ɵɵelementEnd()();
 } }
 function PoTableComponent_ng_template_26_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, PoTableComponent_ng_template_26_td_0_Template, 2, 7, "td", 136);
-    i0.ɵɵtemplate(1, PoTableComponent_ng_template_26_td_1_Template, 3, 0, "td", 137);
+    i0.ɵɵtemplate(0, PoTableComponent_ng_template_26_td_0_Template, 2, 7, "td", 135);
+    i0.ɵɵtemplate(1, PoTableComponent_ng_template_26_td_1_Template, 3, 0, "td", 136);
 } if (rf & 2) {
     const ctx_r25 = i0.ɵɵnextContext();
     i0.ɵɵproperty("ngIf", ctx_r25.isSingleAction);
@@ -22775,7 +22806,7 @@ function PoTableComponent_ng_template_26_Template(rf, ctx) { if (rf & 1) {
 } }
 function PoTableComponent_po_table_column_manager_28_Template(rf, ctx) { if (rf & 1) {
     const _r342 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "po-table-column-manager", 146);
+    i0.ɵɵelementStart(0, "po-table-column-manager", 145);
     i0.ɵɵlistener("p-visible-columns-change", function PoTableComponent_po_table_column_manager_28_Template_po_table_column_manager_p_visible_columns_change_0_listener($event) { i0.ɵɵrestoreView(_r342); const ctx_r341 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r341.onVisibleColumnsChange($event)); })("p-change-visible-columns", function PoTableComponent_po_table_column_manager_28_Template_po_table_column_manager_p_change_visible_columns_0_listener($event) { i0.ɵɵrestoreView(_r342); const ctx_r343 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r343.onChangeVisibleColumns($event)); })("p-initial-columns", function PoTableComponent_po_table_column_manager_28_Template_po_table_column_manager_p_initial_columns_0_listener($event) { i0.ɵɵrestoreView(_r342); const ctx_r344 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r344.onColumnRestoreManager($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -22872,6 +22903,8 @@ class PoTableComponent extends PoTableBaseComponent {
     inputFieldValue = '';
     JSON;
     newOrderColumns;
+    sizeLoading = 'sm';
+    headerWidth;
     close = {
         action: () => {
             this.modalDelete.close();
@@ -22890,7 +22923,6 @@ class PoTableComponent extends PoTableBaseComponent {
     differ;
     footerHeight;
     headerHeight;
-    initialized = false;
     timeoutResize;
     visibleElement = false;
     scrollEvent$;
@@ -22986,8 +23018,16 @@ class PoTableComponent extends PoTableBaseComponent {
     ngOnInit() {
         this.idRadio = `po-radio-${uuid()}`;
     }
+    changeHeaderWidth() {
+        if (this.noColumnsHeader) {
+            this.headerWidth = this.noColumnsHeader?.nativeElement.offsetWidth;
+        }
+        this.changeDetector.detectChanges();
+    }
     ngAfterViewInit() {
         this.initialized = true;
+        this.changeHeaderWidth();
+        this.changeSizeLoading();
     }
     showMoreInfiniteScroll({ target }) {
         const scrollPosition = target.offsetHeight + target.scrollTop;
@@ -23354,6 +23394,18 @@ class PoTableComponent extends PoTableBaseComponent {
         this.poNotification.success(this.literals.deleteSuccessful);
         this.eventDelete.emit(newItemsFiltered);
     }
+    changeSizeLoading() {
+        const tableHeight = this.tableWrapperElement?.nativeElement?.offsetHeight;
+        if (tableHeight <= 150) {
+            this.sizeLoading = 'sm';
+        }
+        else if (tableHeight > 150 && tableHeight < 260) {
+            this.sizeLoading = 'md';
+        }
+        else {
+            this.sizeLoading = 'lg';
+        }
+    }
     checkChangesItems() {
         const changesItems = this.differ.diff(this.items);
         if (changesItems && this.selectAll) {
@@ -23529,7 +23581,7 @@ class PoTableComponent extends PoTableBaseComponent {
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.columnManagerTargetFixed = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.actionsIconElement = _t);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.actionsElement = _t);
-        } }, features: [i0.ɵɵProvidersFeature([PoDateService]), i0.ɵɵInheritDefinitionFeature], decls: 33, vars: 14, consts: [[1, "po-table-actions"], ["class", "po-table-actions-batch-actions", 4, "ngIf"], ["class", "po-table-actions-column-manager", 4, "ngIf"], ["class", "po-table-search", 4, "ngIf"], ["p-no-padding", "", 4, "ngIf", "ngIfElse"], ["tableContainerTemplate", ""], ["class", "po-row po-table-footer-show-more", 3, "po-invisible", 4, "ngIf"], ["tableTemplate", ""], ["tableVirtualScrollTemplate", ""], [3, "p-actions", "p-target"], ["popup", ""], ["poTableColumnDetail", ""], ["inputRadio", ""], ["inputCheckbox", ""], ["contentHeaderTemplate", ""], ["noColumnsWithHeight", ""], ["noColumnsWithoutHeight", ""], ["ActionsColumnTemplate", ""], [3, "p-columns", "p-max-columns", "p-target", "p-last-visible-columns-selected", "p-hide-action-fixed-columns", "p-columns-default", "p-visible-columns-change", "p-change-visible-columns", "p-initial-columns", 4, "ngIf"], [3, "p-title", "p-primary-action", "p-secondary-action", "p-click-out"], ["modalDelete", ""], [1, "po-font-text-large"], [1, "po-table-actions-batch-actions"], ["columnBatchActions", ""], [1, "po-table-actions-batch-actions__label", 3, "ngPlural"], ["ngPluralCase", "=0"], ["ngPluralCase", "=1"], ["ngPluralCase", "other"], [1, "po-table-actions-batch-actions__buttons"], ["p-icon", "po-icon-delete", 3, "p-danger", "p-disabled", "p-label", "p-click"], [1, "po-table-actions-column-manager"], ["columnManager", ""], ["p-icon", "po-icon-settings", "p-kind", "tertiary", "p-tooltip-position", "left", 3, "p-aria-label", "p-tooltip", "p-click"], ["columnManagerTarget", ""], [1, "po-table-search"], [3, "p-items", "p-filter-keys", "p-filter-type", "p-filtered-items-change"], ["p-no-padding", ""], [4, "ngTemplateOutlet"], ["class", "po-table-overlay", 4, "ngIf"], [1, "po-table-main-container"], [1, "po-table-wrapper"], ["tableWrapper", ""], ["class", "po-table-container", 3, "height", 4, "ngIf"], [4, "ngIf"], ["class", "po-table-footer", 4, "ngIf"], [1, "po-table-overlay"], [1, "po-table-overlay-content", 3, "p-text"], [1, "po-table-container"], [1, "po-table-container-fixed-inner"], ["poTableTbody", ""], [1, "po-table-footer"], [4, "ngFor", "ngForOf", "ngForTrackBy"], [3, "p-literals", "p-subtitles"], [1, "po-row", "po-table-footer-show-more"], ["tableFooter", ""], [1, "po-offset-xl-4", "po-offset-lg-4", "po-offset-md-3", "po-lg-4", "po-md-6", 3, "p-disabled", "p-label", "p-loading", "p-click"], [1, "po-table", 3, "ngClass"], ["cdkDropList", "", "cdkDropListOrientation", "horizontal", 3, "ngClass", "cdkDropListDropped"], ["class", "po-table-column-selectable", 3, "pointer-events", 4, "ngIf"], ["class", "po-table-header-column po-table-header-master-detail", 4, "ngIf"], [3, "po-table-header-master-detail", "po-table-header-single-action", 4, "ngIf"], ["class", "po-table-header-column po-text-center", 4, "ngIf"], [4, "ngIf", "ngIfThen", "ngIfElse"], ["tableDefaultThDragDrop", ""], ["tableDefaultThDefault", ""], [3, "po-table-header-single-action", "po-table-header-actions", 4, "ngIf"], ["class", "po-table-group-row", 4, "ngIf"], [1, "po-table-column-selectable"], ["name", "selectAll", 3, "p-checkboxValue", "p-change", 4, "ngIf"], ["name", "selectAll", 3, "p-checkboxValue", "p-change"], [1, "po-table-header-column", "po-table-header-master-detail"], ["columnActionLeft", ""], [1, "po-table-header-column", "po-text-center"], ["noColumnsHeader", ""], ["class", "po-table-header-ellipsis p-element po-frozen-column", "cdkDrag", "", "cdkDragLockAxis", "x", 3, "width", "max-width", "min-width", "po-clickable", "ngClass", "po-table-header-subtitle", "po-table-column-drag-box", "cdkDragDisabled", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], ["cdkDrag", "", "cdkDragLockAxis", "x", 1, "po-table-header-ellipsis", "p-element", "po-frozen-column", 3, "ngClass", "cdkDragDisabled", "pFrozenColumn", "click"], [1, "po-table-header-flex"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], ["cdkDragHandle", "", "width", "24", "height", "24", "viewBox", "0 0 24 24", "fill", "none", "xmlns", "http://www.w3.org/2000/svg"], ["cx", "9", "cy", "6", "r", "2", "fill", "black"], ["cx", "15", "cy", "6", "r", "2", "fill", "black"], ["cx", "9", "cy", "12", "r", "2", "fill", "black"], ["cx", "15", "cy", "12", "r", "2", "fill", "black"], ["cx", "9", "cy", "18", "r", "2", "fill", "black"], ["cx", "15", "cy", "18", "r", "2", "fill", "black"], ["class", "po-table-header-ellipsis p-element po-frozen-column", 3, "width", "max-width", "min-width", "po-clickable", "ngClass", "po-table-header-subtitle", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "po-table-header-ellipsis", "p-element", "po-frozen-column", 3, "ngClass", "pFrozenColumn", "click"], [1, "po-table-group-row"], [1, "po-table-row", "po-table-row-no-data"], [1, "po-table-no-data", "po-text-center", 3, "colSpan"], ["class", "po-table-group-row", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "po-table-row"], ["class", "po-table-column-selectable", 4, "ngIf"], ["class", "po-table-column-detail-toggle", 3, "click", 4, "ngIf"], ["class", "p-element po-frozen-column", 3, "width", "max-width", "min-width", "po-table-column", "po-table-column-right", "po-table-column-center", "po-table-column-icons", "pFrozenColumn", "ngClass", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "po-table-column-detail-toggle", 3, "click"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "p-element", "po-frozen-column", 3, "pFrozenColumn", "ngClass", "click"], [1, "po-table-column-cell", "po-table-body-ellipsis", "notranslate", 3, "ngSwitch", "p-tooltip", "p-append-in-body", "mouseenter", "mouseleave"], [4, "ngSwitchCase"], [3, "p-action", "p-disabled", "p-link", "p-row", "p-value", "click", 4, "ngSwitchCase"], [3, "p-column", "p-icons", "p-row", 4, "ngSwitchCase"], [4, "ngSwitchDefault"], [3, "p-action", "p-disabled", "p-link", "p-row", "p-value", "click"], [3, "p-column", "p-icons", "p-row"], [3, "p-subtitle"], [3, "p-value"], [1, "po-table-row-template-container", 3, "colSpan"], [1, "po-table-column-detail", 3, "colSpan"], [3, "p-selectable", "p-detail", "p-items", "p-select-row"], [3, "itemSize", "minBufferPx", "maxBufferPx"], ["tableVirtualScroll", ""], [1, "po-table", 3, "ngClass", "ngStyle"], [1, "po-table-header-sticky"], ["cdkDropList", "", "cdkDropListOrientation", "horizontal", 3, "cdkDropListDropped"], ["tableVirtualScrollThDragDrop", ""], ["tableVirtualScrollThDefault", ""], ["class", "po-table-header-ellipsis p-element po-frozen-column", "cdkDrag", "", "cdkDragLockAxis", "x", 3, "width", "max-width", "min-width", "po-clickable", "ngClass", "ngStyle", "po-table-header-subtitle", "po-table-column-drag-box", "cdkDragDisabled", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], ["cdkDrag", "", "cdkDragLockAxis", "x", 1, "po-table-header-ellipsis", "p-element", "po-frozen-column", 3, "ngClass", "ngStyle", "cdkDragDisabled", "pFrozenColumn", "click"], ["class", "po-table-header-ellipsis p-element po-frozen-column example-box", 3, "width", "max-width", "min-width", "po-clickable", "ngClass", "ngStyle", "po-table-header-subtitle", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "po-table-header-ellipsis", "p-element", "po-frozen-column", "example-box", 3, "ngClass", "ngStyle", "pFrozenColumn", "click"], ["class", "po-table-group-row", 4, "cdkVirtualFor", "cdkVirtualForOf", "cdkVirtualForTrackBy"], ["class", "p-element po-frozen-column", 3, "width", "max-width", "min-width", "po-table-column", "po-table-column-right", "po-table-column-center", "po-table-column-icons", "ngClass", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "p-element", "po-frozen-column", 3, "ngClass", "pFrozenColumn", "click"], ["class", "po-icon po-clickable", 3, "po-icon-arrow-up", "po-icon-arrow-down", 4, "ngIf"], [1, "po-icon", "po-clickable"], [3, "name", "p-checked", "p-change-selected"], ["name", "checkbox", 3, "p-checkboxValue", "p-change"], [1, "po-table-header-ellipsis", 3, "p-tooltip", "p-append-in-body", "mouseenter", "mouseleave"], ["columnHeader", ""], [3, "po-table-header-icon-unselected", "po-table-header-icon-descending", "po-table-header-icon-ascending", 4, "ngIf"], ["width", "24", "height", "24", "viewBox", "0 0 24 24", "fill", "none", "xmlns", "http://www.w3.org/2000/svg"], ["fill-rule", "evenodd", "clip-rule", "evenodd", "d", "M18.2929 15.2929L17 16.5858L17 10C17 9.44772 16.5523 9 16 9C15.4477 9 15 9.44772 15 10L15 16.5858L13.7071 15.2929C13.3166 14.9024 12.6834 14.9024 12.2929 15.2929C11.9024 15.6834 11.9024 16.3166 12.2929 16.7071L15.2929 19.7071C15.6834 20.0976 16.3166 20.0976 16.7071 19.7071L19.7071 16.7071C20.0976 16.3166 20.0976 15.6834 19.7071 15.2929C19.3166 14.9024 18.6834 14.9024 18.2929 15.2929ZM5.70716 8.7071L7.00006 7.4142L7.00003 14C7.00002 14.5523 7.44774 15 8.00002 15C8.55231 15 9.00002 14.5523 9.00003 14L9.00006 7.41418L10.2929 8.70707C10.6835 9.09759 11.3166 9.09758 11.7072 8.70706C12.0977 8.31653 12.0977 7.68336 11.7072 7.29284L8.70718 4.29286C8.31665 3.90234 7.68349 3.90235 7.29296 4.29287L4.29295 7.29289C3.90242 7.68342 3.90242 8.31658 4.29294 8.70711C4.68347 9.09763 5.31663 9.09762 5.70716 8.7071Z", "fill", "#1D1D30"], ["fill-rule", "evenodd", "clip-rule", "evenodd", "d", "M11 9.41421L9.70711 10.7071C9.31658 11.0976 8.68342 11.0976 8.29289 10.7071C7.90237 10.3166 7.90237 9.68342 8.29289 9.29289L11.2929 6.29289C11.6834 5.90237 12.3166 5.90237 12.7071 6.29289L15.7071 9.29289C16.0976 9.68342 16.0976 10.3166 15.7071 10.7071C15.3166 11.0976 14.6834 11.0976 14.2929 10.7071L13 9.41421V16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16V9.41421Z", "fill", "black"], ["fill-rule", "evenodd", "clip-rule", "evenodd", "d", "M9.70711 13.2929L11 14.5858V7C11 6.44772 11.4477 6 12 6C12.5523 6 13 6.44772 13 7V14.5858L14.2929 13.2929C14.6834 12.9024 15.3166 12.9024 15.7071 13.2929C16.0976 13.6834 16.0976 14.3166 15.7071 14.7071L12.7071 17.7071C12.3166 18.0976 11.6834 18.0976 11.2929 17.7071L8.29289 14.7071C7.90237 14.3166 7.90237 13.6834 8.29289 13.2929C8.68342 12.9024 9.31658 12.9024 9.70711 13.2929Z", "fill", "black"], [1, "po-table-header-fixed-inner"], ["class", "po-table-column po-table-column-single-action", 3, "width", "max-width", 4, "ngIf"], ["class", "po-table-column-actions", 4, "ngIf"], [1, "po-table-column", "po-table-column-single-action"], ["class", "po-table-single-action po-clickable", 3, "po-table-action-disabled", "click", 4, "ngIf"], [1, "po-table-single-action", "po-clickable", 3, "click"], ["class", "po-table-single-action-content", 3, "p-icon", 4, "ngIf"], [1, "po-table-single-action-content", 3, "p-icon"], [1, "po-table-column-actions"], [1, "po-icon", "po-icon-more", "po-clickable", 3, "click"], ["popupTarget", ""], [3, "p-columns", "p-max-columns", "p-target", "p-last-visible-columns-selected", "p-hide-action-fixed-columns", "p-columns-default", "p-visible-columns-change", "p-change-visible-columns", "p-initial-columns"]], template: function PoTableComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, features: [i0.ɵɵProvidersFeature([PoDateService]), i0.ɵɵInheritDefinitionFeature], decls: 33, vars: 14, consts: [[1, "po-table-actions"], ["class", "po-table-actions-batch-actions", 4, "ngIf"], ["class", "po-table-actions-column-manager", 4, "ngIf"], ["class", "po-table-search", 4, "ngIf"], ["p-no-padding", "", 4, "ngIf", "ngIfElse"], ["tableContainerTemplate", ""], ["class", "po-row po-table-footer-show-more", 3, "po-invisible", 4, "ngIf"], ["tableTemplate", ""], ["tableVirtualScrollTemplate", ""], [3, "p-actions", "p-target"], ["popup", ""], ["poTableColumnDetail", ""], ["inputRadio", ""], ["inputCheckbox", ""], ["contentHeaderTemplate", ""], ["noColumnsWithHeight", ""], ["noColumnsWithoutHeight", ""], ["ActionsColumnTemplate", ""], [3, "p-columns", "p-max-columns", "p-target", "p-last-visible-columns-selected", "p-hide-action-fixed-columns", "p-columns-default", "p-visible-columns-change", "p-change-visible-columns", "p-initial-columns", 4, "ngIf"], [3, "p-title", "p-primary-action", "p-secondary-action", "p-click-out"], ["modalDelete", ""], [1, "po-font-text-large"], [1, "po-table-actions-batch-actions"], ["columnBatchActions", ""], [1, "po-table-actions-batch-actions__label", 3, "ngPlural"], ["ngPluralCase", "=0"], ["ngPluralCase", "=1"], ["ngPluralCase", "other"], [1, "po-table-actions-batch-actions__buttons"], ["p-icon", "po-icon-delete", 3, "p-danger", "p-disabled", "p-label", "p-click"], [1, "po-table-actions-column-manager"], ["columnManager", ""], ["p-icon", "po-icon-settings", "p-kind", "tertiary", "p-tooltip-position", "left", 3, "p-aria-label", "p-tooltip", "p-click"], ["columnManagerTarget", ""], [1, "po-table-search"], [3, "p-items", "p-filter-keys", "p-filter-type", "p-filtered-items-change"], ["p-no-padding", ""], [4, "ngTemplateOutlet"], [3, "p-text", "p-size", 4, "ngIf"], [1, "po-table-main-container"], [1, "po-table-wrapper"], ["tableWrapper", ""], ["class", "po-table-container", 3, "height", 4, "ngIf"], [4, "ngIf"], ["class", "po-table-footer", 4, "ngIf"], [3, "p-text", "p-size"], [1, "po-table-container"], [1, "po-table-container-fixed-inner"], ["poTableTbody", ""], [1, "po-table-footer"], [4, "ngFor", "ngForOf", "ngForTrackBy"], [3, "p-literals", "p-subtitles"], [1, "po-row", "po-table-footer-show-more"], ["tableFooter", ""], [1, "po-offset-xl-4", "po-offset-lg-4", "po-offset-md-3", "po-lg-4", "po-md-6", 3, "p-disabled", "p-label", "p-loading", "p-click"], [1, "po-table", 3, "ngClass"], ["cdkDropList", "", "cdkDropListOrientation", "horizontal", 3, "ngClass", "cdkDropListDropped"], ["class", "po-table-column-selectable", 3, "pointer-events", 4, "ngIf"], ["class", "po-table-header-column po-table-header-master-detail", 4, "ngIf"], [3, "po-table-header-master-detail", "po-table-header-single-action", 4, "ngIf"], ["class", "po-table-header-column po-text-center", 4, "ngIf"], [4, "ngIf", "ngIfThen", "ngIfElse"], ["tableDefaultThDragDrop", ""], ["tableDefaultThDefault", ""], [3, "po-table-header-single-action", "po-table-header-actions", 4, "ngIf"], ["class", "po-table-group-row", 4, "ngIf"], [1, "po-table-column-selectable"], ["name", "selectAll", 3, "p-checkboxValue", "p-change", 4, "ngIf"], ["name", "selectAll", 3, "p-checkboxValue", "p-change"], [1, "po-table-header-column", "po-table-header-master-detail"], ["columnActionLeft", ""], [1, "po-table-header-column", "po-text-center"], ["noColumnsHeader", ""], ["class", "po-table-header-ellipsis p-element po-frozen-column", "cdkDrag", "", "cdkDragLockAxis", "x", 3, "width", "max-width", "min-width", "po-clickable", "ngClass", "po-table-header-subtitle", "po-table-column-drag-box", "cdkDragDisabled", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], ["cdkDrag", "", "cdkDragLockAxis", "x", 1, "po-table-header-ellipsis", "p-element", "po-frozen-column", 3, "ngClass", "cdkDragDisabled", "pFrozenColumn", "click"], [1, "po-table-header-flex"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], ["cdkDragHandle", "", "width", "24", "height", "24", "viewBox", "0 0 24 24", "fill", "none", "xmlns", "http://www.w3.org/2000/svg"], ["cx", "9", "cy", "6", "r", "2", "fill", "black"], ["cx", "15", "cy", "6", "r", "2", "fill", "black"], ["cx", "9", "cy", "12", "r", "2", "fill", "black"], ["cx", "15", "cy", "12", "r", "2", "fill", "black"], ["cx", "9", "cy", "18", "r", "2", "fill", "black"], ["cx", "15", "cy", "18", "r", "2", "fill", "black"], ["class", "po-table-header-ellipsis p-element po-frozen-column", 3, "width", "max-width", "min-width", "po-clickable", "ngClass", "po-table-header-subtitle", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "po-table-header-ellipsis", "p-element", "po-frozen-column", 3, "ngClass", "pFrozenColumn", "click"], [1, "po-table-group-row"], [1, "po-table-row", "po-table-row-no-data"], [1, "po-table-no-data", "po-text-center", 3, "colSpan"], ["class", "po-table-group-row", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "po-table-row"], ["class", "po-table-column-selectable", 4, "ngIf"], ["class", "po-table-column-detail-toggle", 3, "click", 4, "ngIf"], ["class", "p-element po-frozen-column", 3, "width", "max-width", "min-width", "po-table-column", "po-table-column-right", "po-table-column-center", "po-table-column-icons", "pFrozenColumn", "ngClass", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "po-table-column-detail-toggle", 3, "click"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "p-element", "po-frozen-column", 3, "pFrozenColumn", "ngClass", "click"], [1, "po-table-column-cell", "po-table-body-ellipsis", "notranslate", 3, "ngSwitch", "p-tooltip", "p-append-in-body", "mouseenter", "mouseleave"], [4, "ngSwitchCase"], [3, "p-action", "p-disabled", "p-link", "p-row", "p-value", "click", 4, "ngSwitchCase"], [3, "p-column", "p-icons", "p-row", 4, "ngSwitchCase"], [4, "ngSwitchDefault"], [3, "p-action", "p-disabled", "p-link", "p-row", "p-value", "click"], [3, "p-column", "p-icons", "p-row"], [3, "p-subtitle"], [3, "p-value"], [1, "po-table-row-template-container", 3, "colSpan"], [1, "po-table-column-detail", 3, "colSpan"], [3, "p-selectable", "p-detail", "p-items", "p-select-row"], [3, "itemSize", "minBufferPx", "maxBufferPx"], ["tableVirtualScroll", ""], [1, "po-table", 3, "ngClass", "ngStyle"], [1, "po-table-header-sticky"], ["cdkDropList", "", "cdkDropListOrientation", "horizontal", 3, "cdkDropListDropped"], ["tableVirtualScrollThDragDrop", ""], ["tableVirtualScrollThDefault", ""], ["class", "po-table-header-ellipsis p-element po-frozen-column", "cdkDrag", "", "cdkDragLockAxis", "x", 3, "width", "max-width", "min-width", "po-clickable", "ngClass", "ngStyle", "po-table-header-subtitle", "po-table-column-drag-box", "cdkDragDisabled", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], ["cdkDrag", "", "cdkDragLockAxis", "x", 1, "po-table-header-ellipsis", "p-element", "po-frozen-column", 3, "ngClass", "ngStyle", "cdkDragDisabled", "pFrozenColumn", "click"], ["class", "po-table-header-ellipsis p-element po-frozen-column example-box", 3, "width", "max-width", "min-width", "po-clickable", "ngClass", "ngStyle", "po-table-header-subtitle", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "po-table-header-ellipsis", "p-element", "po-frozen-column", "example-box", 3, "ngClass", "ngStyle", "pFrozenColumn", "click"], ["class", "po-table-group-row", 4, "cdkVirtualFor", "cdkVirtualForOf", "cdkVirtualForTrackBy"], ["class", "p-element po-frozen-column", 3, "width", "max-width", "min-width", "po-table-column", "po-table-column-right", "po-table-column-center", "po-table-column-icons", "ngClass", "pFrozenColumn", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "p-element", "po-frozen-column", 3, "ngClass", "pFrozenColumn", "click"], ["class", "po-icon po-clickable", 3, "po-icon-arrow-up", "po-icon-arrow-down", 4, "ngIf"], [1, "po-icon", "po-clickable"], [3, "name", "p-checked", "p-change-selected"], ["name", "checkbox", 3, "p-checkboxValue", "p-change"], [1, "po-table-header-ellipsis", 3, "p-tooltip", "p-append-in-body", "mouseenter", "mouseleave"], ["columnHeader", ""], [3, "po-table-header-icon-unselected", "po-table-header-icon-descending", "po-table-header-icon-ascending", 4, "ngIf"], ["width", "24", "height", "24", "viewBox", "0 0 24 24", "fill", "none", "xmlns", "http://www.w3.org/2000/svg"], ["fill-rule", "evenodd", "clip-rule", "evenodd", "d", "M18.2929 15.2929L17 16.5858L17 10C17 9.44772 16.5523 9 16 9C15.4477 9 15 9.44772 15 10L15 16.5858L13.7071 15.2929C13.3166 14.9024 12.6834 14.9024 12.2929 15.2929C11.9024 15.6834 11.9024 16.3166 12.2929 16.7071L15.2929 19.7071C15.6834 20.0976 16.3166 20.0976 16.7071 19.7071L19.7071 16.7071C20.0976 16.3166 20.0976 15.6834 19.7071 15.2929C19.3166 14.9024 18.6834 14.9024 18.2929 15.2929ZM5.70716 8.7071L7.00006 7.4142L7.00003 14C7.00002 14.5523 7.44774 15 8.00002 15C8.55231 15 9.00002 14.5523 9.00003 14L9.00006 7.41418L10.2929 8.70707C10.6835 9.09759 11.3166 9.09758 11.7072 8.70706C12.0977 8.31653 12.0977 7.68336 11.7072 7.29284L8.70718 4.29286C8.31665 3.90234 7.68349 3.90235 7.29296 4.29287L4.29295 7.29289C3.90242 7.68342 3.90242 8.31658 4.29294 8.70711C4.68347 9.09763 5.31663 9.09762 5.70716 8.7071Z", "fill", "#1D1D30"], ["fill-rule", "evenodd", "clip-rule", "evenodd", "d", "M11 9.41421L9.70711 10.7071C9.31658 11.0976 8.68342 11.0976 8.29289 10.7071C7.90237 10.3166 7.90237 9.68342 8.29289 9.29289L11.2929 6.29289C11.6834 5.90237 12.3166 5.90237 12.7071 6.29289L15.7071 9.29289C16.0976 9.68342 16.0976 10.3166 15.7071 10.7071C15.3166 11.0976 14.6834 11.0976 14.2929 10.7071L13 9.41421V16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16V9.41421Z", "fill", "black"], ["fill-rule", "evenodd", "clip-rule", "evenodd", "d", "M9.70711 13.2929L11 14.5858V7C11 6.44772 11.4477 6 12 6C12.5523 6 13 6.44772 13 7V14.5858L14.2929 13.2929C14.6834 12.9024 15.3166 12.9024 15.7071 13.2929C16.0976 13.6834 16.0976 14.3166 15.7071 14.7071L12.7071 17.7071C12.3166 18.0976 11.6834 18.0976 11.2929 17.7071L8.29289 14.7071C7.90237 14.3166 7.90237 13.6834 8.29289 13.2929C8.68342 12.9024 9.31658 12.9024 9.70711 13.2929Z", "fill", "black"], [1, "po-table-header-fixed-inner"], ["class", "po-table-column po-table-column-single-action", 3, "width", "max-width", 4, "ngIf"], ["class", "po-table-column-actions", 4, "ngIf"], [1, "po-table-column", "po-table-column-single-action"], ["class", "po-table-single-action po-clickable", 3, "po-table-action-disabled", "click", 4, "ngIf"], [1, "po-table-single-action", "po-clickable", 3, "click"], ["class", "po-table-single-action-content", 3, "p-icon", 4, "ngIf"], [1, "po-table-single-action-content", 3, "p-icon"], [1, "po-table-column-actions"], [1, "po-icon", "po-icon-more", "po-clickable", 3, "click"], ["popupTarget", ""], [3, "p-columns", "p-max-columns", "p-target", "p-last-visible-columns-selected", "p-hide-action-fixed-columns", "p-columns-default", "p-visible-columns-change", "p-change-visible-columns", "p-initial-columns"]], template: function PoTableComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵtemplate(1, PoTableComponent_div_1_Template, 9, 4, "div", 1);
             i0.ɵɵtemplate(2, PoTableComponent_div_2_Template, 4, 2, "div", 2);
@@ -23576,7 +23628,7 @@ class PoTableComponent extends PoTableBaseComponent {
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoTableComponent, [{
         type: Component,
-        args: [{ selector: 'po-table', providers: [PoDateService], template: "<div class=\"po-table-actions\">\n  <div\n    #columnBatchActions\n    *ngIf=\"hasValidColumns && itemsSelected.length > 0 && !hideBatchActions\"\n    class=\"po-table-actions-batch-actions\"\n  >\n    <div [ngPlural]=\"itemsSelected.length\" class=\"po-table-actions-batch-actions__label\">\n      <strong>\n        <ng-template ngPluralCase=\"=0\">{{ literals.noItem }}</ng-template>\n        <ng-template ngPluralCase=\"=1\">{{ literals.oneItem }}</ng-template>\n        <ng-template ngPluralCase=\"other\">{{ itemsSelected.length }} {{ literals.multipleItems }}</ng-template>\n      </strong>\n    </div>\n\n    <div class=\"po-table-actions-batch-actions__buttons\">\n      <po-button\n        p-icon=\"po-icon-delete\"\n        [p-danger]=\"true\"\n        [p-disabled]=\"itemsSelected.length > 1 && serviceDeleteApi !== undefined\"\n        [p-label]=\"literals.delete\"\n        (p-click)=\"modalDelete.open()\"\n      ></po-button>\n    </div>\n  </div>\n\n  <div #columnManager *ngIf=\"hasValidColumns && !hideColumnsManager\" class=\"po-table-actions-column-manager\">\n    <po-button\n      #columnManagerTarget\n      p-icon=\"po-icon-settings\"\n      p-kind=\"tertiary\"\n      p-tooltip-position=\"left\"\n      [p-aria-label]=\"literals.columnsManager\"\n      [p-tooltip]=\"literals.columnsManager\"\n      (p-click)=\"onOpenColumnManager()\"\n    ></po-button>\n  </div>\n\n  <div *ngIf=\"!hideTableSearch && hasValidColumns\" class=\"po-table-search\">\n    <po-search\n      [p-items]=\"items\"\n      [p-filter-keys]=\"filteredColumns\"\n      [p-filter-type]=\"filterType\"\n      (p-filtered-items-change)=\"onFilteredItemsChange($event)\"\n    >\n    </po-search>\n  </div>\n</div>\n<po-container *ngIf=\"container; else tableContainerTemplate\" p-no-padding>\n  <ng-container *ngTemplateOutlet=\"tableContainerTemplate\"></ng-container>\n</po-container>\n\n<ng-template #tableContainerTemplate>\n  <div [class.po-table-container-relative]=\"loading\">\n    <div *ngIf=\"loading\" class=\"po-table-overlay\">\n      <po-loading class=\"po-table-overlay-content\" [p-text]=\"literals.loadingData\"></po-loading>\n    </div>\n\n    <div class=\"po-table-main-container\">\n      <div\n        #tableWrapper\n        class=\"po-table-wrapper\"\n        [class.po-table-header-fixed-columns-pixels]=\"allColumnsWidthPixels\"\n        [style.opacity]=\"tableOpacity\"\n      >\n        <div *ngIf=\"height\" class=\"po-table-container\" [style.height.px]=\"heightTableContainer\">\n          <div #poTableTbody class=\"po-table-container-fixed-inner\">\n            <ng-container *ngTemplateOutlet=\"tableVirtualScrollTemplate\"></ng-container>\n          </div>\n        </div>\n\n        <div *ngIf=\"!height\">\n          <ng-container *ngTemplateOutlet=\"tableTemplate\"></ng-container>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"po-table-footer\" *ngIf=\"hasFooter\">\n    <ng-container *ngFor=\"let column of subtitleColumns; trackBy: trackBy\">\n      <po-table-subtitle-footer [p-literals]=\"literals\" [p-subtitles]=\"column.subtitles\"> </po-table-subtitle-footer>\n    </ng-container>\n  </div>\n</ng-template>\n\n<!-- Show More Button -->\n<div\n  *ngIf=\"!infiniteScroll\"\n  class=\"po-row po-table-footer-show-more\"\n  [class.po-invisible]=\"showMore.observers.length === 0 && !hasService\"\n  #tableFooter\n>\n  <po-button\n    class=\"po-offset-xl-4 po-offset-lg-4 po-offset-md-3 po-lg-4 po-md-6\"\n    [p-disabled]=\"showMoreDisabled\"\n    [p-label]=\"literals.loadMoreData\"\n    [p-loading]=\"loadingShowMore\"\n    (p-click)=\"onShowMore()\"\n  >\n  </po-button>\n</div>\n\n<!-- Table default-->\n<ng-template #tableTemplate>\n  <table\n    class=\"po-table\"\n    [ngClass]=\"{\n      'po-table-interactive': selectable || sort,\n      'po-table-selectable': selectable,\n      'po-table-striped': striped\n    }\"\n    [attr.p-spacing]=\"spacing\"\n  >\n    <thead>\n      <tr\n        [ngClass]=\"{ 'no-hover': hideSelectAll, 'po-table-column-drag': this.isDraggable }\"\n        [class.po-table-header]=\"!height\"\n        cdkDropList\n        cdkDropListOrientation=\"horizontal\"\n        (cdkDropListDropped)=\"drop($event)\"\n      >\n        <th\n          *ngIf=\"hasSelectableColumn\"\n          [style.pointer-events]=\"hideSelectAll ? 'none' : 'auto'\"\n          class=\"po-table-column-selectable\"\n        >\n          <div [class.po-table-header-fixed-inner]=\"height\">\n            <po-checkbox\n              name=\"selectAll\"\n              *ngIf=\"!hideSelectAll\"\n              (p-change)=\"selectAllRows()\"\n              [p-checkboxValue]=\"selectAll === null ? 'mixed' : selectAll\"\n            ></po-checkbox>\n          </div>\n        </th>\n\n        <th\n          *ngIf=\"(hasMasterDetailColumn || hasRowTemplate) && !hasRowTemplateWithArrowDirectionRight\"\n          class=\"po-table-header-column po-table-header-master-detail\"\n        ></th>\n\n        <!-- Coluna criada para caso as a\u00E7\u00F5es fiquem no lado esquerdo -->\n        <th\n          #columnActionLeft\n          *ngIf=\"!actionRight && (visibleActions.length > 1 || isSingleAction)\"\n          [class.po-table-header-master-detail]=\"!isSingleAction\"\n          [class.po-table-header-single-action]=\"isSingleAction\"\n        ></th>\n\n        <th *ngIf=\"!hasMainColumns\" #noColumnsHeader class=\"po-table-header-column po-text-center\">\n          <ng-container *ngIf=\"height; then noColumnsWithHeight; else noColumnsWithoutHeight\"> </ng-container>\n        </th>\n\n        <ng-container\n          *ngIf=\"this.isDraggable || hasSomeFixed(); then tableDefaultThDragDrop; else tableDefaultThDefault\"\n        >\n        </ng-container>\n        <ng-template #tableDefaultThDragDrop>\n          <th\n            *ngFor=\"let column of mainColumns; let i = index; trackBy: trackBy\"\n            class=\"po-table-header-ellipsis p-element po-frozen-column\"\n            [style.width]=\"column.width\"\n            [style.max-width]=\"column.width\"\n            [style.min-width]=\"column.width\"\n            [attr.data-po-table-column-name]=\"column.label || (column.property | titlecase) | lowercase\"\n            [class.po-clickable]=\"(sort && column.sortable !== false) || hasService\"\n            [ngClass]=\"{\n              'po-table-header-sorted':\n                sort &&\n                JSON.stringify(sortedColumn?.property) === JSON.stringify(column) &&\n                (sortedColumn.ascending || !sortedColumn.ascending)\n            }\"\n            [class.po-table-header-subtitle]=\"column.type === 'subtitle'\"\n            [class.po-table-column-drag-box]=\"this.isDraggable\"\n            (click)=\"sortColumn(column)\"\n            cdkDrag\n            cdkDragLockAxis=\"x\"\n            [cdkDragDisabled]=\"column.fixed ? 'true' : 'false'\"\n            [pFrozenColumn]=\"column.fixed\"\n          >\n            <div\n              class=\"po-table-header-flex\"\n              [class.po-table-header-fixed-inner]=\"height\"\n              [class.po-table-header-flex-right]=\"column.type === 'currency' || column.type === 'number'\"\n              [class.po-table-header-flex-center]=\"column.type === 'subtitle'\"\n            >\n              <ng-container *ngIf=\"this.isDraggable && !column.fixed\">\n                <svg\n                  cdkDragHandle\n                  width=\"24\"\n                  height=\"24\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                >\n                  <circle cx=\"9\" cy=\"6\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"15\" cy=\"6\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"9\" cy=\"12\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"15\" cy=\"12\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"9\" cy=\"18\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"15\" cy=\"18\" r=\"2\" fill=\"black\" />\n                </svg>\n              </ng-container>\n              <ng-container *ngTemplateOutlet=\"contentHeaderTemplate; context: { $implicit: column }\"> </ng-container>\n            </div>\n          </th>\n        </ng-template>\n        <ng-template #tableDefaultThDefault>\n          <th\n            *ngFor=\"let column of mainColumns; let i = index; trackBy: trackBy\"\n            class=\"po-table-header-ellipsis p-element po-frozen-column\"\n            [style.width]=\"column.width\"\n            [style.max-width]=\"column.width\"\n            [style.min-width]=\"column.width\"\n            [attr.data-po-table-column-name]=\"column.label || (column.property | titlecase) | lowercase\"\n            [class.po-clickable]=\"(sort && column.sortable !== false) || hasService\"\n            [ngClass]=\"{\n              'po-table-header-sorted':\n                sort &&\n                JSON.stringify(sortedColumn?.property) === JSON.stringify(column) &&\n                (sortedColumn.ascending || !sortedColumn.ascending)\n            }\"\n            [class.po-table-header-subtitle]=\"column.type === 'subtitle'\"\n            (click)=\"sortColumn(column)\"\n            [pFrozenColumn]=\"column.fixed\"\n          >\n            <div\n              class=\"po-table-header-flex\"\n              [class.po-table-header-fixed-inner]=\"height\"\n              [class.po-table-header-flex-right]=\"column.type === 'currency' || column.type === 'number'\"\n              [class.po-table-header-flex-center]=\"column.type === 'subtitle'\"\n            >\n              <ng-container *ngTemplateOutlet=\"contentHeaderTemplate; context: { $implicit: column }\"> </ng-container>\n            </div>\n          </th>\n        </ng-template>\n\n        <th\n          *ngIf=\"hasRowTemplateWithArrowDirectionRight && (hasVisibleActions || hideColumnsManager)\"\n          class=\"po-table-header-column po-table-header-master-detail\"\n        ></th>\n\n        <th\n          *ngIf=\"hasVisibleActions && actionRight && (visibleActions.length > 1 || isSingleAction)\"\n          [class.po-table-header-single-action]=\"isSingleAction\"\n          [class.po-table-header-actions]=\"!isSingleAction\"\n        ></th>\n      </tr>\n    </thead>\n\n    <tbody class=\"po-table-group-row\" *ngIf=\"!hasItems || !hasMainColumns\">\n      <tr class=\"po-table-row po-table-row-no-data\">\n        <td [colSpan]=\"columnCount\" class=\"po-table-no-data po-text-center\">\n          <span> {{ literals.noData }} </span>\n        </td>\n      </tr>\n    </tbody>\n\n    <ng-container *ngIf=\"hasMainColumns\">\n      <tbody class=\"po-table-group-row\" *ngFor=\"let row of filteredItems; let rowIndex = index; trackBy: trackBy\">\n        <tr class=\"po-table-row\" [class.po-table-row-active]=\"row.$selected || (row.$selected === null && selectable)\">\n          <td *ngIf=\"selectable\" class=\"po-table-column-selectable\">\n            <ng-container *ngTemplateOutlet=\"singleSelect ? inputRadio : inputCheckbox; context: { $implicit: row }\">\n            </ng-container>\n          </td>\n\n          <!-- Valida se a origem do detail \u00E9 pelo input do po-table -->\n          <td\n            *ngIf=\"columnMasterDetail && !hideDetail && !hasRowTemplate\"\n            class=\"po-table-column-detail-toggle\"\n            (click)=\"toggleDetail(row)\"\n          >\n            <ng-template\n              [ngTemplateOutlet]=\"poTableColumnDetail\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </td>\n\n          <!-- Coluna com as a\u00E7\u00F5es na esquerda (padr\u00E3o)-->\n          <ng-template\n            *ngIf=\"!actionRight && (visibleActions.length > 1 || isSingleAction)\"\n            [ngTemplateOutlet]=\"ActionsColumnTemplate\"\n            [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n          >\n          </ng-template>\n\n          <!-- Valida se a origem do detail \u00E9 pela diretiva -->\n          <td\n            *ngIf=\"hasRowTemplate && !hasRowTemplateWithArrowDirectionRight\"\n            class=\"po-table-column-detail-toggle\"\n            (click)=\"toggleDetail(row)\"\n          >\n            <ng-template\n              [ngTemplateOutlet]=\"poTableColumnDetail\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </td>\n\n          <td\n            *ngFor=\"let column of mainColumns; let columnIndex = index; trackBy: trackBy\"\n            [style.width]=\"column.width\"\n            [style.max-width]=\"column.width\"\n            [style.min-width]=\"column.width\"\n            [class.po-table-column]=\"column.type !== 'icon'\"\n            [class.po-table-column-right]=\"column.type === 'currency' || column.type === 'number'\"\n            [class.po-table-column-center]=\"column.type === 'subtitle'\"\n            [class.po-table-column-icons]=\"column.type === 'icon'\"\n            [pFrozenColumn]=\"column.fixed\"\n            class=\"p-element po-frozen-column\"\n            [ngClass]=\"getClassColor(row, column)\"\n            (click)=\"hasSelectableRow() ? selectRow(row) : 'javascript:;'\"\n          >\n            <div\n              class=\"po-table-column-cell po-table-body-ellipsis notranslate\"\n              [ngSwitch]=\"column.type\"\n              [p-tooltip]=\"tooltipText\"\n              [p-append-in-body]=\"true\"\n              (mouseenter)=\"tooltipMouseEnter($event, column, row)\"\n              (mouseleave)=\"tooltipMouseLeave()\"\n            >\n              <span *ngSwitchCase=\"'columnTemplate'\">\n                <ng-container *ngTemplateOutlet=\"getTemplate(column); context: { $implicit: getCellData(row, column) }\">\n                </ng-container>\n              </span>\n\n              <span *ngSwitchCase=\"'cellTemplate'\">\n                <ng-container *ngTemplateOutlet=\"tableCellTemplate?.templateRef; context: { row: row, column: column }\">\n                </ng-container>\n              </span>\n\n              <span *ngSwitchCase=\"'boolean'\">\n                {{ getBooleanLabel(getCellData(row, column), column) }}\n              </span>\n\n              <span *ngSwitchCase=\"'currency'\">\n                {{ getCellData(row, column) | currency: column.format:'symbol':'1.2-2' }}\n              </span>\n\n              <span *ngSwitchCase=\"'date'\">\n                {{ getCellData(row, column) | date: column.format || 'dd/MM/yyyy' }}\n              </span>\n\n              <span *ngSwitchCase=\"'time'\">\n                {{ getCellData(row, column) | po_time: column.format || 'HH:mm:ss.ffffff' }}\n              </span>\n\n              <span *ngSwitchCase=\"'dateTime'\">\n                {{ getCellData(row, column) | date: column.format || 'dd/MM/yyyy HH:mm:ss' }}\n              </span>\n\n              <span *ngSwitchCase=\"'number'\">\n                {{ formatNumber(getCellData(row, column), column.format) }}\n              </span>\n\n              <po-table-column-link\n                *ngSwitchCase=\"'link'\"\n                [p-action]=\"column.action\"\n                [p-disabled]=\"checkDisabled(row, column)\"\n                [p-link]=\"row[column.link]\"\n                [p-row]=\"row\"\n                [p-value]=\"getCellData(row, column)\"\n                (click)=\"onClickLink($event, row, column)\"\n              >\n              </po-table-column-link>\n\n              <po-table-column-icon\n                *ngSwitchCase=\"'icon'\"\n                [p-column]=\"column\"\n                [p-icons]=\"getColumnIcons(row, column)\"\n                [p-row]=\"row\"\n              >\n              </po-table-column-icon>\n\n              <span *ngSwitchCase=\"'subtitle'\">\n                <po-table-subtitle-circle [p-subtitle]=\"getSubtitleColumn(row, column)\"></po-table-subtitle-circle>\n              </span>\n              <span *ngSwitchCase=\"'label'\">\n                <po-table-column-label [p-value]=\"getColumnLabel(row, column)\"> </po-table-column-label>\n              </span>\n              <span *ngSwitchDefault>{{ getCellData(row, column) }}</span>\n            </div>\n          </td>\n\n          <td\n            *ngIf=\"hasRowTemplateWithArrowDirectionRight\"\n            class=\"po-table-column-detail-toggle\"\n            (click)=\"toggleDetail(row)\"\n          >\n            <ng-template\n              [ngTemplateOutlet]=\"poTableColumnDetail\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </td>\n\n          <!-- Coluna de a\u00E7oes na direita -->\n          <ng-template\n            *ngIf=\"actionRight\"\n            [ngTemplateOutlet]=\"ActionsColumnTemplate\"\n            [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n          >\n          </ng-template>\n        </tr>\n\n        <tr *ngIf=\"hasMainColumns && hasRowTemplate && row.$showDetail && isShowRowTemplate(row, rowIndex)\">\n          <td class=\"po-table-row-template-container\" [colSpan]=\"columnCountForMasterDetail\">\n            <ng-template\n              [ngTemplateOutlet]=\"tableRowTemplate.templateRef\"\n              [ngTemplateOutletContext]=\"{ $implicit: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </td>\n        </tr>\n\n        <tr *ngIf=\"hasMainColumns && isShowMasterDetail(row)\">\n          <td class=\"po-table-column-detail\" [colSpan]=\"columnCountForMasterDetail\">\n            <po-table-detail\n              [p-selectable]=\"selectable && !detailHideSelect\"\n              [p-detail]=\"columnMasterDetail.detail\"\n              [p-items]=\"row[nameColumnDetail]\"\n              (p-select-row)=\"selectDetailRow($event)\"\n            >\n            </po-table-detail>\n          </td>\n        </tr>\n      </tbody>\n    </ng-container>\n  </table>\n</ng-template>\n\n<!-- Table with virtual scroll -->\n<ng-template #tableVirtualScrollTemplate>\n  <cdk-virtual-scroll-viewport\n    #tableVirtualScroll\n    [itemSize]=\"itemSize\"\n    [style.height.px]=\"heightTableContainer\"\n    [minBufferPx]=\"heightTableContainer < 100 ? 100 : heightTableContainer\"\n    [maxBufferPx]=\"heightTableContainer < 200 ? 200 : heightTableContainer\"\n  >\n    <table\n      class=\"po-table\"\n      [ngClass]=\"{\n        'po-table-interactive': selectable || sort,\n        'po-table-selectable': selectable,\n        'po-table-striped': striped\n      }\"\n      [ngStyle]=\"{ 'table-layout': !hasItems ? 'fixed' : 'auto' }\"\n      [attr.p-spacing]=\"spacing\"\n    >\n      <thead class=\"po-table-header-sticky\" [style.top]=\"inverseOfTranslation\">\n        <tr\n          [class.po-table-header]=\"!height\"\n          cdkDropList\n          cdkDropListOrientation=\"horizontal\"\n          (cdkDropListDropped)=\"drop($event)\"\n        >\n          <th\n            *ngIf=\"hasSelectableColumn\"\n            [style.pointer-events]=\"hideSelectAll ? 'none' : 'auto'\"\n            class=\"po-table-column-selectable\"\n          >\n            <div [class.po-table-header-fixed-inner]=\"height\">\n              <po-checkbox\n                name=\"selectAll\"\n                *ngIf=\"!hideSelectAll\"\n                (p-change)=\"selectAllRows()\"\n                [p-checkboxValue]=\"selectAll === null ? 'mixed' : selectAll\"\n              ></po-checkbox>\n            </div>\n          </th>\n\n          <th\n            *ngIf=\"(hasMasterDetailColumn || hasRowTemplate) && !hasRowTemplateWithArrowDirectionRight\"\n            class=\"po-table-header-column po-table-header-master-detail\"\n          ></th>\n\n          <!-- Coluna criada para caso as a\u00E7\u00F5es fiquem no lado esquerdo -->\n          <th\n            #columnActionLeft\n            *ngIf=\"!actionRight && (visibleActions.length > 1 || isSingleAction)\"\n            [class.po-table-header-master-detail]=\"!isSingleAction\"\n            [class.po-table-header-single-action]=\"isSingleAction\"\n          ></th>\n\n          <th *ngIf=\"!hasMainColumns\" #noColumnsHeader class=\"po-table-header-column po-text-center\">\n            <ng-container *ngIf=\"height; then noColumnsWithHeight; else noColumnsWithoutHeight\"> </ng-container>\n          </th>\n\n          <ng-container\n            *ngIf=\"\n              this.isDraggable || hasSomeFixed();\n              then tableVirtualScrollThDragDrop;\n              else tableVirtualScrollThDefault\n            \"\n          >\n          </ng-container>\n          <ng-template #tableVirtualScrollThDragDrop>\n            <th\n              *ngFor=\"let column of mainColumns; let i = index; trackBy: trackBy\"\n              class=\"po-table-header-ellipsis p-element po-frozen-column\"\n              [style.width]=\"column.width\"\n              [style.max-width]=\"column.width\"\n              [style.min-width]=\"column.width\"\n              [attr.data-po-table-column-name]=\"column.label || (column.property | titlecase) | lowercase\"\n              [class.po-clickable]=\"(sort && column.sortable !== false) || hasService\"\n              [ngClass]=\"{\n                'po-table-header-sorted':\n                  sort &&\n                  JSON.stringify(sortedColumn?.property) === JSON.stringify(column) &&\n                  (sortedColumn.ascending || !sortedColumn.ascending)\n              }\"\n              [ngStyle]=\"{ 'width': !hasItems ? '100%' : 'auto' }\"\n              [class.po-table-header-subtitle]=\"column.type === 'subtitle'\"\n              [class.po-table-column-drag-box]=\"this.isDraggable\"\n              (click)=\"sortColumn(column)\"\n              cdkDrag\n              cdkDragLockAxis=\"x\"\n              [cdkDragDisabled]=\"column.fixed ? 'true' : 'false'\"\n              [pFrozenColumn]=\"column.fixed\"\n            >\n              <div\n                class=\"po-table-header-flex\"\n                [class.po-table-header-fixed-inner]=\"height\"\n                [class.po-table-header-flex-right]=\"column.type === 'currency' || column.type === 'number'\"\n                [class.po-table-header-flex-center]=\"column.type === 'subtitle'\"\n              >\n                <ng-container *ngIf=\"this.isDraggable && !column.fixed\">\n                  <svg\n                    cdkDragHandle\n                    width=\"24\"\n                    height=\"24\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                  >\n                    <circle cx=\"9\" cy=\"6\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"15\" cy=\"6\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"9\" cy=\"12\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"15\" cy=\"12\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"9\" cy=\"18\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"15\" cy=\"18\" r=\"2\" fill=\"black\" />\n                  </svg>\n                </ng-container>\n                <ng-container *ngTemplateOutlet=\"contentHeaderTemplate; context: { $implicit: column }\"> </ng-container>\n              </div>\n            </th>\n          </ng-template>\n          <ng-template #tableVirtualScrollThDefault>\n            <th\n              *ngFor=\"let column of mainColumns; let i = index; trackBy: trackBy\"\n              class=\"po-table-header-ellipsis p-element po-frozen-column example-box\"\n              [style.width]=\"column.width\"\n              [style.max-width]=\"column.width\"\n              [style.min-width]=\"column.width\"\n              [attr.data-po-table-column-name]=\"column.label || (column.property | titlecase) | lowercase\"\n              [class.po-clickable]=\"(sort && column.sortable !== false) || hasService\"\n              [ngClass]=\"{\n                'po-table-header-sorted':\n                  sort &&\n                  JSON.stringify(sortedColumn?.property) === JSON.stringify(column) &&\n                  (sortedColumn.ascending || !sortedColumn.ascending)\n              }\"\n              [ngStyle]=\"{ 'width': !hasItems ? '100%' : 'auto' }\"\n              [class.po-table-header-subtitle]=\"column.type === 'subtitle'\"\n              (click)=\"sortColumn(column)\"\n              [pFrozenColumn]=\"column.fixed\"\n            >\n              <div\n                class=\"po-table-header-flex\"\n                [class.po-table-header-fixed-inner]=\"height\"\n                [class.po-table-header-flex-right]=\"column.type === 'currency' || column.type === 'number'\"\n                [class.po-table-header-flex-center]=\"column.type === 'subtitle'\"\n              >\n                <ng-container *ngTemplateOutlet=\"contentHeaderTemplate; context: { $implicit: column }\"> </ng-container>\n              </div>\n            </th>\n          </ng-template>\n\n          <th\n            *ngIf=\"hasRowTemplateWithArrowDirectionRight && (hasVisibleActions || hideColumnsManager)\"\n            class=\"po-table-header-column po-table-header-master-detail\"\n          ></th>\n\n          <th\n            *ngIf=\"hasVisibleActions && actionRight && (visibleActions.length > 1 || isSingleAction)\"\n            [class.po-table-header-single-action]=\"isSingleAction\"\n            [class.po-table-header-actions]=\"!isSingleAction\"\n          ></th>\n        </tr>\n      </thead>\n\n      <tbody class=\"po-table-group-row\" *ngIf=\"!hasItems || !hasMainColumns\">\n        <tr class=\"po-table-row po-table-row-no-data\">\n          <td [colSpan]=\"columnCount\" class=\"po-table-no-data po-text-center\">\n            <span> {{ literals.noData }} </span>\n          </td>\n        </tr>\n      </tbody>\n\n      <ng-container *ngIf=\"hasMainColumns\">\n        <tbody\n          class=\"po-table-group-row\"\n          *cdkVirtualFor=\"let row of filteredItems; let rowIndex = index; trackBy: trackBy\"\n        >\n          <tr\n            class=\"po-table-row\"\n            [class.po-table-row-active]=\"row.$selected || (row.$selected === null && selectable)\"\n          >\n            <td *ngIf=\"selectable\" class=\"po-table-column-selectable\">\n              <ng-container *ngTemplateOutlet=\"singleSelect ? inputRadio : inputCheckbox; context: { $implicit: row }\">\n              </ng-container>\n            </td>\n\n            <!-- Valida se a origem do detail \u00E9 pelo input do po-table -->\n            <td\n              *ngIf=\"columnMasterDetail && !hideDetail && !hasRowTemplate\"\n              class=\"po-table-column-detail-toggle\"\n              (click)=\"toggleDetail(row)\"\n            >\n              <ng-template\n                [ngTemplateOutlet]=\"poTableColumnDetail\"\n                [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n              >\n              </ng-template>\n            </td>\n\n            <!-- Coluna com as a\u00E7\u00F5es na esquerda (padr\u00E3o)-->\n            <ng-template\n              *ngIf=\"!actionRight && (visibleActions.length > 1 || isSingleAction)\"\n              [ngTemplateOutlet]=\"ActionsColumnTemplate\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n\n            <!-- Valida se a origem do detail \u00E9 pela diretiva -->\n            <td\n              *ngIf=\"hasRowTemplate && !hasRowTemplateWithArrowDirectionRight\"\n              class=\"po-table-column-detail-toggle\"\n              (click)=\"toggleDetail(row)\"\n            >\n              <ng-template\n                [ngTemplateOutlet]=\"poTableColumnDetail\"\n                [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n              >\n              </ng-template>\n            </td>\n\n            <td\n              *ngFor=\"let column of mainColumns; let columnIndex = index; trackBy: trackBy\"\n              [style.width]=\"column.width\"\n              [style.max-width]=\"column.width\"\n              [style.min-width]=\"column.width\"\n              [class.po-table-column]=\"column.type !== 'icon'\"\n              [class.po-table-column-right]=\"column.type === 'currency' || column.type === 'number'\"\n              [class.po-table-column-center]=\"column.type === 'subtitle'\"\n              [class.po-table-column-icons]=\"column.type === 'icon'\"\n              [ngClass]=\"getClassColor(row, column)\"\n              [pFrozenColumn]=\"column.fixed\"\n              class=\"p-element po-frozen-column\"\n              (click)=\"hasSelectableRow() ? selectRow(row) : 'javascript:;'\"\n            >\n              <div\n                class=\"po-table-column-cell po-table-body-ellipsis notranslate\"\n                [ngSwitch]=\"column.type\"\n                [p-tooltip]=\"tooltipText\"\n                [p-append-in-body]=\"true\"\n                (mouseenter)=\"tooltipMouseEnter($event, column, row)\"\n                (mouseleave)=\"tooltipMouseLeave()\"\n              >\n                <span *ngSwitchCase=\"'columnTemplate'\">\n                  <ng-container\n                    *ngTemplateOutlet=\"getTemplate(column); context: { $implicit: getCellData(row, column) }\"\n                  >\n                  </ng-container>\n                </span>\n\n                <span *ngSwitchCase=\"'cellTemplate'\">\n                  <ng-container\n                    *ngTemplateOutlet=\"tableCellTemplate?.templateRef; context: { row: row, column: column }\"\n                  >\n                  </ng-container>\n                </span>\n\n                <span *ngSwitchCase=\"'boolean'\">\n                  {{ getBooleanLabel(getCellData(row, column), column) }}\n                </span>\n\n                <span *ngSwitchCase=\"'currency'\">\n                  {{ getCellData(row, column) | currency: column.format:'symbol':'1.2-2' }}\n                </span>\n\n                <span *ngSwitchCase=\"'date'\">\n                  {{ getCellData(row, column) | date: column.format || 'dd/MM/yyyy' }}\n                </span>\n\n                <span *ngSwitchCase=\"'time'\">\n                  {{ getCellData(row, column) | po_time: column.format || 'HH:mm:ss.ffffff' }}\n                </span>\n\n                <span *ngSwitchCase=\"'dateTime'\">\n                  {{ getCellData(row, column) | date: column.format || 'dd/MM/yyyy HH:mm:ss' }}\n                </span>\n\n                <span *ngSwitchCase=\"'number'\">\n                  {{ formatNumber(getCellData(row, column), column.format) }}\n                </span>\n\n                <po-table-column-link\n                  *ngSwitchCase=\"'link'\"\n                  [p-action]=\"column.action\"\n                  [p-disabled]=\"checkDisabled(row, column)\"\n                  [p-link]=\"row[column.link]\"\n                  [p-row]=\"row\"\n                  [p-value]=\"getCellData(row, column)\"\n                  (click)=\"onClickLink($event, row, column)\"\n                >\n                </po-table-column-link>\n\n                <po-table-column-icon\n                  *ngSwitchCase=\"'icon'\"\n                  [p-column]=\"column\"\n                  [p-icons]=\"getColumnIcons(row, column)\"\n                  [p-row]=\"row\"\n                >\n                </po-table-column-icon>\n\n                <span *ngSwitchCase=\"'subtitle'\">\n                  <po-table-subtitle-circle [p-subtitle]=\"getSubtitleColumn(row, column)\"></po-table-subtitle-circle>\n                </span>\n                <span *ngSwitchCase=\"'label'\">\n                  <po-table-column-label [p-value]=\"getColumnLabel(row, column)\"> </po-table-column-label>\n                </span>\n                <span *ngSwitchDefault>{{ getCellData(row, column) }}</span>\n              </div>\n            </td>\n\n            <td\n              *ngIf=\"hasRowTemplateWithArrowDirectionRight\"\n              class=\"po-table-column-detail-toggle\"\n              (click)=\"toggleDetail(row)\"\n            >\n              <ng-template\n                [ngTemplateOutlet]=\"poTableColumnDetail\"\n                [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n              >\n              </ng-template>\n            </td>\n\n            <!-- Coluna de a\u00E7oes na direita -->\n            <ng-template\n              *ngIf=\"actionRight\"\n              [ngTemplateOutlet]=\"ActionsColumnTemplate\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </tr>\n\n          <tr *ngIf=\"hasMainColumns && hasRowTemplate && row.$showDetail && isShowRowTemplate(row, rowIndex)\">\n            <td class=\"po-table-row-template-container\" [colSpan]=\"columnCountForMasterDetail\">\n              <ng-template\n                [ngTemplateOutlet]=\"tableRowTemplate.templateRef\"\n                [ngTemplateOutletContext]=\"{ $implicit: row, rowIndex: rowIndex }\"\n              >\n              </ng-template>\n            </td>\n          </tr>\n\n          <tr *ngIf=\"hasMainColumns && isShowMasterDetail(row)\">\n            <td class=\"po-table-column-detail\" [colSpan]=\"columnCountForMasterDetail\">\n              <po-table-detail\n                [p-selectable]=\"selectable && !detailHideSelect\"\n                [p-detail]=\"columnMasterDetail.detail\"\n                [p-items]=\"row[nameColumnDetail]\"\n                (p-select-row)=\"selectDetailRow($event)\"\n              >\n              </po-table-detail>\n            </td>\n          </tr>\n        </tbody>\n      </ng-container>\n    </table>\n  </cdk-virtual-scroll-viewport>\n</ng-template>\n\n<po-popup #popup [p-actions]=\"actions\" [p-target]=\"popupTarget\"> </po-popup>\n\n<ng-template #poTableColumnDetail let-row=\"row\" let-rowIndex=\"rowIndex\">\n  <span\n    *ngIf=\"(containsMasterDetail(row) && !hasRowTemplate) || (isShowRowTemplate(row, rowIndex) && hasRowTemplate)\"\n    class=\"po-icon po-clickable\"\n    [class.po-icon-arrow-up]=\"row.$showDetail\"\n    [class.po-icon-arrow-down]=\"!row.$showDetail\"\n  >\n  </span>\n</ng-template>\n\n<ng-template #inputRadio let-row>\n  <po-radio [name]=\"idRadio\" [p-checked]=\"row.$selected\" (p-change-selected)=\"selectRow(row)\"></po-radio>\n</ng-template>\n\n<ng-template #inputCheckbox let-row>\n  <po-checkbox\n    name=\"checkbox\"\n    (p-change)=\"selectable ? selectRow(row) : 'javascript:;'\"\n    [p-checkboxValue]=\"row.$selected\"\n  ></po-checkbox>\n</ng-template>\n\n<ng-template #contentHeaderTemplate let-column>\n  <span\n    #columnHeader\n    class=\"po-table-header-ellipsis\"\n    [p-tooltip]=\"tooltipText\"\n    [p-append-in-body]=\"true\"\n    (mouseenter)=\"tooltipMouseEnter($event)\"\n    (mouseleave)=\"tooltipMouseLeave()\"\n  >\n    {{ column.label || (column.property | titlecase) }}\n  </span>\n\n  <span\n    *ngIf=\"sort && column.sortable !== false\"\n    [class.po-table-header-icon-unselected]=\"JSON.stringify(sortedColumn?.property) !== JSON.stringify(column)\"\n    [class.po-table-header-icon-descending]=\"\n      JSON.stringify(sortedColumn?.property) === JSON.stringify(column) && sortedColumn.ascending\n    \"\n    [class.po-table-header-icon-ascending]=\"\n      JSON.stringify(sortedColumn?.property) === JSON.stringify(column) && !sortedColumn.ascending\n    \"\n  >\n    <ng-container *ngIf=\"JSON.stringify(sortedColumn?.property) !== JSON.stringify(column)\">\n      <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M18.2929 15.2929L17 16.5858L17 10C17 9.44772 16.5523 9 16 9C15.4477 9 15 9.44772 15 10L15 16.5858L13.7071 15.2929C13.3166 14.9024 12.6834 14.9024 12.2929 15.2929C11.9024 15.6834 11.9024 16.3166 12.2929 16.7071L15.2929 19.7071C15.6834 20.0976 16.3166 20.0976 16.7071 19.7071L19.7071 16.7071C20.0976 16.3166 20.0976 15.6834 19.7071 15.2929C19.3166 14.9024 18.6834 14.9024 18.2929 15.2929ZM5.70716 8.7071L7.00006 7.4142L7.00003 14C7.00002 14.5523 7.44774 15 8.00002 15C8.55231 15 9.00002 14.5523 9.00003 14L9.00006 7.41418L10.2929 8.70707C10.6835 9.09759 11.3166 9.09758 11.7072 8.70706C12.0977 8.31653 12.0977 7.68336 11.7072 7.29284L8.70718 4.29286C8.31665 3.90234 7.68349 3.90235 7.29296 4.29287L4.29295 7.29289C3.90242 7.68342 3.90242 8.31658 4.29294 8.70711C4.68347 9.09763 5.31663 9.09762 5.70716 8.7071Z\"\n          fill=\"#1D1D30\"\n        />\n      </svg>\n    </ng-container>\n\n    <ng-container *ngIf=\"JSON.stringify(sortedColumn?.property) === JSON.stringify(column) && sortedColumn.ascending\">\n      <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M11 9.41421L9.70711 10.7071C9.31658 11.0976 8.68342 11.0976 8.29289 10.7071C7.90237 10.3166 7.90237 9.68342 8.29289 9.29289L11.2929 6.29289C11.6834 5.90237 12.3166 5.90237 12.7071 6.29289L15.7071 9.29289C16.0976 9.68342 16.0976 10.3166 15.7071 10.7071C15.3166 11.0976 14.6834 11.0976 14.2929 10.7071L13 9.41421V16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16V9.41421Z\"\n          fill=\"black\"\n        />\n      </svg>\n    </ng-container>\n\n    <ng-container *ngIf=\"JSON.stringify(sortedColumn?.property) === JSON.stringify(column) && !sortedColumn.ascending\">\n      <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M9.70711 13.2929L11 14.5858V7C11 6.44772 11.4477 6 12 6C12.5523 6 13 6.44772 13 7V14.5858L14.2929 13.2929C14.6834 12.9024 15.3166 12.9024 15.7071 13.2929C16.0976 13.6834 16.0976 14.3166 15.7071 14.7071L12.7071 17.7071C12.3166 18.0976 11.6834 18.0976 11.2929 17.7071L8.29289 14.7071C7.90237 14.3166 7.90237 13.6834 8.29289 13.2929C8.68342 12.9024 9.31658 12.9024 9.70711 13.2929Z\"\n          fill=\"black\"\n        />\n      </svg>\n    </ng-container>\n  </span>\n</ng-template>\n\n<ng-template #noColumnsWithHeight>\n  <div class=\"po-table-header-fixed-inner\" [style.width.px]=\"noColumnsHeader?.nativeElement.offsetWidth\">\n    {{ hasValidColumns ? literals.noVisibleColumn : literals.noColumns }}\n  </div>\n</ng-template>\n\n<ng-template #noColumnsWithoutHeight>\n  {{ hasValidColumns ? literals.noVisibleColumn : literals.noColumns }}\n</ng-template>\n\n<!-- Template de a\u00E7\u00F5es -->\n<ng-template #ActionsColumnTemplate let-row=\"row\" let-rowIndex=\"rowIndex\">\n  <td\n    *ngIf=\"isSingleAction\"\n    class=\"po-table-column po-table-column-single-action\"\n    [style.width.px]=\"height && actionRight ? getWidthColumnManager() : ''\"\n    [style.max-width.px]=\"height && !actionRight ? getColumnWidthActionsLeft() : ''\"\n    [style.width.px]=\"height && !actionRight ? getColumnWidthActionsLeft() : ''\"\n  >\n    <div\n      *ngIf=\"firstAction.visible !== false\"\n      class=\"po-table-single-action po-clickable\"\n      [class.po-table-action-disabled]=\"firstAction.disabled ? validateTableAction(row, firstAction) : false\"\n      (click)=\"executeTableAction(row, firstAction)\"\n    >\n      <po-icon *ngIf=\"firstAction.icon\" class=\"po-table-single-action-content\" [p-icon]=\"firstAction.icon\"></po-icon>\n      {{ firstAction.label }}\n    </div>\n  </td>\n\n  <td *ngIf=\"visibleActions.length > 1\" class=\"po-table-column-actions\">\n    <span #popupTarget class=\"po-icon po-icon-more po-clickable\" (click)=\"togglePopup(row, popupTarget)\"></span>\n  </td>\n</ng-template>\n\n<po-table-column-manager\n  *ngIf=\"!hideColumnsManager\"\n  [p-columns]=\"columns\"\n  [p-max-columns]=\"maxColumns\"\n  [p-target]=\"columnManagerTarget\"\n  [p-last-visible-columns-selected]=\"lastVisibleColumnsSelected\"\n  [p-hide-action-fixed-columns]=\"hideActionFixedColumns\"\n  (p-visible-columns-change)=\"onVisibleColumnsChange($event)\"\n  (p-change-visible-columns)=\"onChangeVisibleColumns($event)\"\n  [p-columns-default]=\"initialColumns\"\n  (p-initial-columns)=\"onColumnRestoreManager($event)\"\n>\n</po-table-column-manager>\n\n<po-modal\n  #modalDelete\n  [p-title]=\"literals.delete\"\n  [p-primary-action]=\"confirm\"\n  [p-secondary-action]=\"close\"\n  [p-click-out]=\"true\"\n>\n  <p class=\"po-font-text-large\">{{ literals.bodyDelete }}</p>\n</po-modal>\n" }]
+        args: [{ selector: 'po-table', providers: [PoDateService], template: "<div class=\"po-table-actions\">\n  <div\n    #columnBatchActions\n    *ngIf=\"hasValidColumns && itemsSelected.length > 0 && !hideBatchActions\"\n    class=\"po-table-actions-batch-actions\"\n  >\n    <div [ngPlural]=\"itemsSelected.length\" class=\"po-table-actions-batch-actions__label\">\n      <strong>\n        <ng-template ngPluralCase=\"=0\">{{ literals.noItem }}</ng-template>\n        <ng-template ngPluralCase=\"=1\">{{ literals.oneItem }}</ng-template>\n        <ng-template ngPluralCase=\"other\">{{ itemsSelected.length }} {{ literals.multipleItems }}</ng-template>\n      </strong>\n    </div>\n\n    <div class=\"po-table-actions-batch-actions__buttons\">\n      <po-button\n        p-icon=\"po-icon-delete\"\n        [p-danger]=\"true\"\n        [p-disabled]=\"itemsSelected.length > 1 && serviceDeleteApi !== undefined\"\n        [p-label]=\"literals.delete\"\n        (p-click)=\"modalDelete.open()\"\n      ></po-button>\n    </div>\n  </div>\n\n  <div #columnManager *ngIf=\"hasValidColumns && !hideColumnsManager\" class=\"po-table-actions-column-manager\">\n    <po-button\n      #columnManagerTarget\n      p-icon=\"po-icon-settings\"\n      p-kind=\"tertiary\"\n      p-tooltip-position=\"left\"\n      [p-aria-label]=\"literals.columnsManager\"\n      [p-tooltip]=\"literals.columnsManager\"\n      (p-click)=\"onOpenColumnManager()\"\n    ></po-button>\n  </div>\n\n  <div *ngIf=\"!hideTableSearch && hasValidColumns\" class=\"po-table-search\">\n    <po-search\n      [p-items]=\"items\"\n      [p-filter-keys]=\"filteredColumns\"\n      [p-filter-type]=\"filterType\"\n      (p-filtered-items-change)=\"onFilteredItemsChange($event)\"\n    >\n    </po-search>\n  </div>\n</div>\n<po-container *ngIf=\"container; else tableContainerTemplate\" p-no-padding>\n  <ng-container *ngTemplateOutlet=\"tableContainerTemplate\"></ng-container>\n</po-container>\n\n<ng-template #tableContainerTemplate>\n  <div [class.po-table-container-sticky]=\"loading\">\n    <po-loading-overlay *ngIf=\"loading\" [p-text]=\"literals.loadingData\" [p-size]=\"sizeLoading\"></po-loading-overlay>\n    <div class=\"po-table-main-container\">\n      <div\n        #tableWrapper\n        class=\"po-table-wrapper\"\n        [class.po-table-header-fixed-columns-pixels]=\"allColumnsWidthPixels\"\n        [style.opacity]=\"tableOpacity\"\n      >\n        <div *ngIf=\"height\" class=\"po-table-container\" [style.height.px]=\"heightTableContainer\">\n          <div #poTableTbody class=\"po-table-container-fixed-inner\">\n            <ng-container *ngTemplateOutlet=\"tableVirtualScrollTemplate\"></ng-container>\n          </div>\n        </div>\n\n        <div *ngIf=\"!height\">\n          <ng-container *ngTemplateOutlet=\"tableTemplate\"></ng-container>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"po-table-footer\" *ngIf=\"hasFooter\">\n    <ng-container *ngFor=\"let column of subtitleColumns; trackBy: trackBy\">\n      <po-table-subtitle-footer [p-literals]=\"literals\" [p-subtitles]=\"column.subtitles\"> </po-table-subtitle-footer>\n    </ng-container>\n  </div>\n</ng-template>\n\n<!-- Show More Button -->\n<div\n  *ngIf=\"!infiniteScroll\"\n  class=\"po-row po-table-footer-show-more\"\n  [class.po-invisible]=\"showMore.observers.length === 0 && !hasService\"\n  #tableFooter\n>\n  <po-button\n    class=\"po-offset-xl-4 po-offset-lg-4 po-offset-md-3 po-lg-4 po-md-6\"\n    [p-disabled]=\"showMoreDisabled\"\n    [p-label]=\"literals.loadMoreData\"\n    [p-loading]=\"loadingShowMore\"\n    (p-click)=\"onShowMore()\"\n  >\n  </po-button>\n</div>\n\n<!-- Table default-->\n<ng-template #tableTemplate>\n  <table\n    class=\"po-table\"\n    [ngClass]=\"{\n      'po-table-interactive': selectable || sort,\n      'po-table-selectable': selectable,\n      'po-table-striped': striped\n    }\"\n    [attr.p-spacing]=\"spacing\"\n  >\n    <thead>\n      <tr\n        [ngClass]=\"{ 'no-hover': hideSelectAll, 'po-table-column-drag': this.isDraggable }\"\n        [class.po-table-header]=\"!height\"\n        cdkDropList\n        cdkDropListOrientation=\"horizontal\"\n        (cdkDropListDropped)=\"drop($event)\"\n      >\n        <th\n          *ngIf=\"hasSelectableColumn\"\n          [style.pointer-events]=\"hideSelectAll ? 'none' : 'auto'\"\n          class=\"po-table-column-selectable\"\n        >\n          <div [class.po-table-header-fixed-inner]=\"height\">\n            <po-checkbox\n              name=\"selectAll\"\n              *ngIf=\"!hideSelectAll\"\n              (p-change)=\"selectAllRows()\"\n              [p-checkboxValue]=\"selectAll === null ? 'mixed' : selectAll\"\n            ></po-checkbox>\n          </div>\n        </th>\n\n        <th\n          *ngIf=\"(hasMasterDetailColumn || hasRowTemplate) && !hasRowTemplateWithArrowDirectionRight\"\n          class=\"po-table-header-column po-table-header-master-detail\"\n        ></th>\n\n        <!-- Coluna criada para caso as a\u00E7\u00F5es fiquem no lado esquerdo -->\n        <th\n          #columnActionLeft\n          *ngIf=\"!actionRight && (visibleActions.length > 1 || isSingleAction)\"\n          [class.po-table-header-master-detail]=\"!isSingleAction\"\n          [class.po-table-header-single-action]=\"isSingleAction\"\n        ></th>\n\n        <th *ngIf=\"!hasMainColumns\" #noColumnsHeader class=\"po-table-header-column po-text-center\">\n          <ng-container *ngIf=\"height; then noColumnsWithHeight; else noColumnsWithoutHeight\"> </ng-container>\n        </th>\n\n        <ng-container\n          *ngIf=\"this.isDraggable || hasSomeFixed(); then tableDefaultThDragDrop; else tableDefaultThDefault\"\n        >\n        </ng-container>\n        <ng-template #tableDefaultThDragDrop>\n          <th\n            *ngFor=\"let column of mainColumns; let i = index; trackBy: trackBy\"\n            class=\"po-table-header-ellipsis p-element po-frozen-column\"\n            [style.width]=\"column.width\"\n            [style.max-width]=\"column.width\"\n            [style.min-width]=\"column.width\"\n            [attr.data-po-table-column-name]=\"column.label || (column.property | titlecase) | lowercase\"\n            [class.po-clickable]=\"(sort && column.sortable !== false) || hasService\"\n            [ngClass]=\"{\n              'po-table-header-sorted':\n                sort &&\n                JSON.stringify(sortedColumn?.property) === JSON.stringify(column) &&\n                (sortedColumn.ascending || !sortedColumn.ascending)\n            }\"\n            [class.po-table-header-subtitle]=\"column.type === 'subtitle'\"\n            [class.po-table-column-drag-box]=\"this.isDraggable\"\n            (click)=\"sortColumn(column)\"\n            cdkDrag\n            cdkDragLockAxis=\"x\"\n            [cdkDragDisabled]=\"column.fixed ? 'true' : 'false'\"\n            [pFrozenColumn]=\"column.fixed\"\n          >\n            <div\n              class=\"po-table-header-flex\"\n              [class.po-table-header-fixed-inner]=\"height\"\n              [class.po-table-header-flex-right]=\"column.type === 'currency' || column.type === 'number'\"\n              [class.po-table-header-flex-center]=\"column.type === 'subtitle'\"\n            >\n              <ng-container *ngIf=\"this.isDraggable && !column.fixed\">\n                <svg\n                  cdkDragHandle\n                  width=\"24\"\n                  height=\"24\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                >\n                  <circle cx=\"9\" cy=\"6\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"15\" cy=\"6\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"9\" cy=\"12\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"15\" cy=\"12\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"9\" cy=\"18\" r=\"2\" fill=\"black\" />\n                  <circle cx=\"15\" cy=\"18\" r=\"2\" fill=\"black\" />\n                </svg>\n              </ng-container>\n              <ng-container *ngTemplateOutlet=\"contentHeaderTemplate; context: { $implicit: column }\"> </ng-container>\n            </div>\n          </th>\n        </ng-template>\n        <ng-template #tableDefaultThDefault>\n          <th\n            *ngFor=\"let column of mainColumns; let i = index; trackBy: trackBy\"\n            class=\"po-table-header-ellipsis p-element po-frozen-column\"\n            [style.width]=\"column.width\"\n            [style.max-width]=\"column.width\"\n            [style.min-width]=\"column.width\"\n            [attr.data-po-table-column-name]=\"column.label || (column.property | titlecase) | lowercase\"\n            [class.po-clickable]=\"(sort && column.sortable !== false) || hasService\"\n            [ngClass]=\"{\n              'po-table-header-sorted':\n                sort &&\n                JSON.stringify(sortedColumn?.property) === JSON.stringify(column) &&\n                (sortedColumn.ascending || !sortedColumn.ascending)\n            }\"\n            [class.po-table-header-subtitle]=\"column.type === 'subtitle'\"\n            (click)=\"sortColumn(column)\"\n            [pFrozenColumn]=\"column.fixed\"\n          >\n            <div\n              class=\"po-table-header-flex\"\n              [class.po-table-header-fixed-inner]=\"height\"\n              [class.po-table-header-flex-right]=\"column.type === 'currency' || column.type === 'number'\"\n              [class.po-table-header-flex-center]=\"column.type === 'subtitle'\"\n            >\n              <ng-container *ngTemplateOutlet=\"contentHeaderTemplate; context: { $implicit: column }\"> </ng-container>\n            </div>\n          </th>\n        </ng-template>\n\n        <th\n          *ngIf=\"hasRowTemplateWithArrowDirectionRight && (hasVisibleActions || hideColumnsManager)\"\n          class=\"po-table-header-column po-table-header-master-detail\"\n        ></th>\n\n        <th\n          *ngIf=\"hasVisibleActions && actionRight && (visibleActions.length > 1 || isSingleAction)\"\n          [class.po-table-header-single-action]=\"isSingleAction\"\n          [class.po-table-header-actions]=\"!isSingleAction\"\n        ></th>\n      </tr>\n    </thead>\n\n    <tbody class=\"po-table-group-row\" *ngIf=\"!hasItems || !hasMainColumns\">\n      <tr class=\"po-table-row po-table-row-no-data\">\n        <td [colSpan]=\"columnCount\" class=\"po-table-no-data po-text-center\">\n          <span> {{ literals.noData }} </span>\n        </td>\n      </tr>\n    </tbody>\n\n    <ng-container *ngIf=\"hasMainColumns\">\n      <tbody class=\"po-table-group-row\" *ngFor=\"let row of filteredItems; let rowIndex = index; trackBy: trackBy\">\n        <tr class=\"po-table-row\" [class.po-table-row-active]=\"row.$selected || (row.$selected === null && selectable)\">\n          <td *ngIf=\"selectable\" class=\"po-table-column-selectable\">\n            <ng-container *ngTemplateOutlet=\"singleSelect ? inputRadio : inputCheckbox; context: { $implicit: row }\">\n            </ng-container>\n          </td>\n\n          <!-- Valida se a origem do detail \u00E9 pelo input do po-table -->\n          <td\n            *ngIf=\"columnMasterDetail && !hideDetail && !hasRowTemplate\"\n            class=\"po-table-column-detail-toggle\"\n            (click)=\"toggleDetail(row)\"\n          >\n            <ng-template\n              [ngTemplateOutlet]=\"poTableColumnDetail\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </td>\n\n          <!-- Coluna com as a\u00E7\u00F5es na esquerda (padr\u00E3o)-->\n          <ng-template\n            *ngIf=\"!actionRight && (visibleActions.length > 1 || isSingleAction)\"\n            [ngTemplateOutlet]=\"ActionsColumnTemplate\"\n            [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n          >\n          </ng-template>\n\n          <!-- Valida se a origem do detail \u00E9 pela diretiva -->\n          <td\n            *ngIf=\"hasRowTemplate && !hasRowTemplateWithArrowDirectionRight\"\n            class=\"po-table-column-detail-toggle\"\n            (click)=\"toggleDetail(row)\"\n          >\n            <ng-template\n              [ngTemplateOutlet]=\"poTableColumnDetail\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </td>\n\n          <td\n            *ngFor=\"let column of mainColumns; let columnIndex = index; trackBy: trackBy\"\n            [style.width]=\"column.width\"\n            [style.max-width]=\"column.width\"\n            [style.min-width]=\"column.width\"\n            [class.po-table-column]=\"column.type !== 'icon'\"\n            [class.po-table-column-right]=\"column.type === 'currency' || column.type === 'number'\"\n            [class.po-table-column-center]=\"column.type === 'subtitle'\"\n            [class.po-table-column-icons]=\"column.type === 'icon'\"\n            [pFrozenColumn]=\"column.fixed\"\n            class=\"p-element po-frozen-column\"\n            [ngClass]=\"getClassColor(row, column)\"\n            (click)=\"hasSelectableRow() ? selectRow(row) : 'javascript:;'\"\n          >\n            <div\n              class=\"po-table-column-cell po-table-body-ellipsis notranslate\"\n              [ngSwitch]=\"column.type\"\n              [p-tooltip]=\"tooltipText\"\n              [p-append-in-body]=\"true\"\n              (mouseenter)=\"tooltipMouseEnter($event, column, row)\"\n              (mouseleave)=\"tooltipMouseLeave()\"\n            >\n              <span *ngSwitchCase=\"'columnTemplate'\">\n                <ng-container *ngTemplateOutlet=\"getTemplate(column); context: { $implicit: getCellData(row, column) }\">\n                </ng-container>\n              </span>\n\n              <span *ngSwitchCase=\"'cellTemplate'\">\n                <ng-container *ngTemplateOutlet=\"tableCellTemplate?.templateRef; context: { row: row, column: column }\">\n                </ng-container>\n              </span>\n\n              <span *ngSwitchCase=\"'boolean'\">\n                {{ getBooleanLabel(getCellData(row, column), column) }}\n              </span>\n\n              <span *ngSwitchCase=\"'currency'\">\n                {{ getCellData(row, column) | currency: column.format:'symbol':'1.2-2' }}\n              </span>\n\n              <span *ngSwitchCase=\"'date'\">\n                {{ getCellData(row, column) | date: column.format || 'dd/MM/yyyy' }}\n              </span>\n\n              <span *ngSwitchCase=\"'time'\">\n                {{ getCellData(row, column) | po_time: column.format || 'HH:mm:ss.ffffff' }}\n              </span>\n\n              <span *ngSwitchCase=\"'dateTime'\">\n                {{ getCellData(row, column) | date: column.format || 'dd/MM/yyyy HH:mm:ss' }}\n              </span>\n\n              <span *ngSwitchCase=\"'number'\">\n                {{ formatNumber(getCellData(row, column), column.format) }}\n              </span>\n\n              <po-table-column-link\n                *ngSwitchCase=\"'link'\"\n                [p-action]=\"column.action\"\n                [p-disabled]=\"checkDisabled(row, column)\"\n                [p-link]=\"row[column.link]\"\n                [p-row]=\"row\"\n                [p-value]=\"getCellData(row, column)\"\n                (click)=\"onClickLink($event, row, column)\"\n              >\n              </po-table-column-link>\n\n              <po-table-column-icon\n                *ngSwitchCase=\"'icon'\"\n                [p-column]=\"column\"\n                [p-icons]=\"getColumnIcons(row, column)\"\n                [p-row]=\"row\"\n              >\n              </po-table-column-icon>\n\n              <span *ngSwitchCase=\"'subtitle'\">\n                <po-table-subtitle-circle [p-subtitle]=\"getSubtitleColumn(row, column)\"></po-table-subtitle-circle>\n              </span>\n              <span *ngSwitchCase=\"'label'\">\n                <po-table-column-label [p-value]=\"getColumnLabel(row, column)\"> </po-table-column-label>\n              </span>\n              <span *ngSwitchDefault>{{ getCellData(row, column) }}</span>\n            </div>\n          </td>\n\n          <td\n            *ngIf=\"hasRowTemplateWithArrowDirectionRight\"\n            class=\"po-table-column-detail-toggle\"\n            (click)=\"toggleDetail(row)\"\n          >\n            <ng-template\n              [ngTemplateOutlet]=\"poTableColumnDetail\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </td>\n\n          <!-- Coluna de a\u00E7oes na direita -->\n          <ng-template\n            *ngIf=\"actionRight\"\n            [ngTemplateOutlet]=\"ActionsColumnTemplate\"\n            [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n          >\n          </ng-template>\n        </tr>\n\n        <tr *ngIf=\"hasMainColumns && hasRowTemplate && row.$showDetail && isShowRowTemplate(row, rowIndex)\">\n          <td class=\"po-table-row-template-container\" [colSpan]=\"columnCountForMasterDetail\">\n            <ng-template\n              [ngTemplateOutlet]=\"tableRowTemplate.templateRef\"\n              [ngTemplateOutletContext]=\"{ $implicit: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </td>\n        </tr>\n\n        <tr *ngIf=\"hasMainColumns && isShowMasterDetail(row)\">\n          <td class=\"po-table-column-detail\" [colSpan]=\"columnCountForMasterDetail\">\n            <po-table-detail\n              [p-selectable]=\"selectable && !detailHideSelect\"\n              [p-detail]=\"columnMasterDetail.detail\"\n              [p-items]=\"row[nameColumnDetail]\"\n              (p-select-row)=\"selectDetailRow($event)\"\n            >\n            </po-table-detail>\n          </td>\n        </tr>\n      </tbody>\n    </ng-container>\n  </table>\n</ng-template>\n\n<!-- Table with virtual scroll -->\n<ng-template #tableVirtualScrollTemplate>\n  <cdk-virtual-scroll-viewport\n    #tableVirtualScroll\n    [itemSize]=\"itemSize\"\n    [style.height.px]=\"heightTableContainer\"\n    [minBufferPx]=\"heightTableContainer < 100 ? 100 : heightTableContainer\"\n    [maxBufferPx]=\"heightTableContainer < 200 ? 200 : heightTableContainer\"\n  >\n    <table\n      class=\"po-table\"\n      [ngClass]=\"{\n        'po-table-interactive': selectable || sort,\n        'po-table-selectable': selectable,\n        'po-table-striped': striped\n      }\"\n      [ngStyle]=\"{ 'table-layout': !hasItems ? 'fixed' : 'auto' }\"\n      [attr.p-spacing]=\"spacing\"\n    >\n      <thead class=\"po-table-header-sticky\" [style.top]=\"inverseOfTranslation\">\n        <tr\n          [class.po-table-header]=\"!height\"\n          cdkDropList\n          cdkDropListOrientation=\"horizontal\"\n          (cdkDropListDropped)=\"drop($event)\"\n        >\n          <th\n            *ngIf=\"hasSelectableColumn\"\n            [style.pointer-events]=\"hideSelectAll ? 'none' : 'auto'\"\n            class=\"po-table-column-selectable\"\n          >\n            <div [class.po-table-header-fixed-inner]=\"height\">\n              <po-checkbox\n                name=\"selectAll\"\n                *ngIf=\"!hideSelectAll\"\n                (p-change)=\"selectAllRows()\"\n                [p-checkboxValue]=\"selectAll === null ? 'mixed' : selectAll\"\n              ></po-checkbox>\n            </div>\n          </th>\n\n          <th\n            *ngIf=\"(hasMasterDetailColumn || hasRowTemplate) && !hasRowTemplateWithArrowDirectionRight\"\n            class=\"po-table-header-column po-table-header-master-detail\"\n          ></th>\n\n          <!-- Coluna criada para caso as a\u00E7\u00F5es fiquem no lado esquerdo -->\n          <th\n            #columnActionLeft\n            *ngIf=\"!actionRight && (visibleActions.length > 1 || isSingleAction)\"\n            [class.po-table-header-master-detail]=\"!isSingleAction\"\n            [class.po-table-header-single-action]=\"isSingleAction\"\n          ></th>\n\n          <th *ngIf=\"!hasMainColumns\" #noColumnsHeader class=\"po-table-header-column po-text-center\">\n            <ng-container *ngIf=\"height; then noColumnsWithHeight; else noColumnsWithoutHeight\"> </ng-container>\n          </th>\n\n          <ng-container\n            *ngIf=\"\n              this.isDraggable || hasSomeFixed();\n              then tableVirtualScrollThDragDrop;\n              else tableVirtualScrollThDefault\n            \"\n          >\n          </ng-container>\n          <ng-template #tableVirtualScrollThDragDrop>\n            <th\n              *ngFor=\"let column of mainColumns; let i = index; trackBy: trackBy\"\n              class=\"po-table-header-ellipsis p-element po-frozen-column\"\n              [style.width]=\"column.width\"\n              [style.max-width]=\"column.width\"\n              [style.min-width]=\"column.width\"\n              [attr.data-po-table-column-name]=\"column.label || (column.property | titlecase) | lowercase\"\n              [class.po-clickable]=\"(sort && column.sortable !== false) || hasService\"\n              [ngClass]=\"{\n                'po-table-header-sorted':\n                  sort &&\n                  JSON.stringify(sortedColumn?.property) === JSON.stringify(column) &&\n                  (sortedColumn.ascending || !sortedColumn.ascending)\n              }\"\n              [ngStyle]=\"{ 'width': !hasItems ? '100%' : 'auto' }\"\n              [class.po-table-header-subtitle]=\"column.type === 'subtitle'\"\n              [class.po-table-column-drag-box]=\"this.isDraggable\"\n              (click)=\"sortColumn(column)\"\n              cdkDrag\n              cdkDragLockAxis=\"x\"\n              [cdkDragDisabled]=\"column.fixed ? 'true' : 'false'\"\n              [pFrozenColumn]=\"column.fixed\"\n            >\n              <div\n                class=\"po-table-header-flex\"\n                [class.po-table-header-fixed-inner]=\"height\"\n                [class.po-table-header-flex-right]=\"column.type === 'currency' || column.type === 'number'\"\n                [class.po-table-header-flex-center]=\"column.type === 'subtitle'\"\n              >\n                <ng-container *ngIf=\"this.isDraggable && !column.fixed\">\n                  <svg\n                    cdkDragHandle\n                    width=\"24\"\n                    height=\"24\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                  >\n                    <circle cx=\"9\" cy=\"6\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"15\" cy=\"6\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"9\" cy=\"12\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"15\" cy=\"12\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"9\" cy=\"18\" r=\"2\" fill=\"black\" />\n                    <circle cx=\"15\" cy=\"18\" r=\"2\" fill=\"black\" />\n                  </svg>\n                </ng-container>\n                <ng-container *ngTemplateOutlet=\"contentHeaderTemplate; context: { $implicit: column }\"> </ng-container>\n              </div>\n            </th>\n          </ng-template>\n          <ng-template #tableVirtualScrollThDefault>\n            <th\n              *ngFor=\"let column of mainColumns; let i = index; trackBy: trackBy\"\n              class=\"po-table-header-ellipsis p-element po-frozen-column example-box\"\n              [style.width]=\"column.width\"\n              [style.max-width]=\"column.width\"\n              [style.min-width]=\"column.width\"\n              [attr.data-po-table-column-name]=\"column.label || (column.property | titlecase) | lowercase\"\n              [class.po-clickable]=\"(sort && column.sortable !== false) || hasService\"\n              [ngClass]=\"{\n                'po-table-header-sorted':\n                  sort &&\n                  JSON.stringify(sortedColumn?.property) === JSON.stringify(column) &&\n                  (sortedColumn.ascending || !sortedColumn.ascending)\n              }\"\n              [ngStyle]=\"{ 'width': !hasItems ? '100%' : 'auto' }\"\n              [class.po-table-header-subtitle]=\"column.type === 'subtitle'\"\n              (click)=\"sortColumn(column)\"\n              [pFrozenColumn]=\"column.fixed\"\n            >\n              <div\n                class=\"po-table-header-flex\"\n                [class.po-table-header-fixed-inner]=\"height\"\n                [class.po-table-header-flex-right]=\"column.type === 'currency' || column.type === 'number'\"\n                [class.po-table-header-flex-center]=\"column.type === 'subtitle'\"\n              >\n                <ng-container *ngTemplateOutlet=\"contentHeaderTemplate; context: { $implicit: column }\"> </ng-container>\n              </div>\n            </th>\n          </ng-template>\n\n          <th\n            *ngIf=\"hasRowTemplateWithArrowDirectionRight && (hasVisibleActions || hideColumnsManager)\"\n            class=\"po-table-header-column po-table-header-master-detail\"\n          ></th>\n\n          <th\n            *ngIf=\"hasVisibleActions && actionRight && (visibleActions.length > 1 || isSingleAction)\"\n            [class.po-table-header-single-action]=\"isSingleAction\"\n            [class.po-table-header-actions]=\"!isSingleAction\"\n          ></th>\n        </tr>\n      </thead>\n\n      <tbody class=\"po-table-group-row\" *ngIf=\"!hasItems || !hasMainColumns\">\n        <tr class=\"po-table-row po-table-row-no-data\">\n          <td [colSpan]=\"columnCount\" class=\"po-table-no-data po-text-center\">\n            <span> {{ literals.noData }} </span>\n          </td>\n        </tr>\n      </tbody>\n\n      <ng-container *ngIf=\"hasMainColumns\">\n        <tbody\n          class=\"po-table-group-row\"\n          *cdkVirtualFor=\"let row of filteredItems; let rowIndex = index; trackBy: trackBy\"\n        >\n          <tr\n            class=\"po-table-row\"\n            [class.po-table-row-active]=\"row.$selected || (row.$selected === null && selectable)\"\n          >\n            <td *ngIf=\"selectable\" class=\"po-table-column-selectable\">\n              <ng-container *ngTemplateOutlet=\"singleSelect ? inputRadio : inputCheckbox; context: { $implicit: row }\">\n              </ng-container>\n            </td>\n\n            <!-- Valida se a origem do detail \u00E9 pelo input do po-table -->\n            <td\n              *ngIf=\"columnMasterDetail && !hideDetail && !hasRowTemplate\"\n              class=\"po-table-column-detail-toggle\"\n              (click)=\"toggleDetail(row)\"\n            >\n              <ng-template\n                [ngTemplateOutlet]=\"poTableColumnDetail\"\n                [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n              >\n              </ng-template>\n            </td>\n\n            <!-- Coluna com as a\u00E7\u00F5es na esquerda (padr\u00E3o)-->\n            <ng-template\n              *ngIf=\"!actionRight && (visibleActions.length > 1 || isSingleAction)\"\n              [ngTemplateOutlet]=\"ActionsColumnTemplate\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n\n            <!-- Valida se a origem do detail \u00E9 pela diretiva -->\n            <td\n              *ngIf=\"hasRowTemplate && !hasRowTemplateWithArrowDirectionRight\"\n              class=\"po-table-column-detail-toggle\"\n              (click)=\"toggleDetail(row)\"\n            >\n              <ng-template\n                [ngTemplateOutlet]=\"poTableColumnDetail\"\n                [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n              >\n              </ng-template>\n            </td>\n\n            <td\n              *ngFor=\"let column of mainColumns; let columnIndex = index; trackBy: trackBy\"\n              [style.width]=\"column.width\"\n              [style.max-width]=\"column.width\"\n              [style.min-width]=\"column.width\"\n              [class.po-table-column]=\"column.type !== 'icon'\"\n              [class.po-table-column-right]=\"column.type === 'currency' || column.type === 'number'\"\n              [class.po-table-column-center]=\"column.type === 'subtitle'\"\n              [class.po-table-column-icons]=\"column.type === 'icon'\"\n              [ngClass]=\"getClassColor(row, column)\"\n              [pFrozenColumn]=\"column.fixed\"\n              class=\"p-element po-frozen-column\"\n              (click)=\"hasSelectableRow() ? selectRow(row) : 'javascript:;'\"\n            >\n              <div\n                class=\"po-table-column-cell po-table-body-ellipsis notranslate\"\n                [ngSwitch]=\"column.type\"\n                [p-tooltip]=\"tooltipText\"\n                [p-append-in-body]=\"true\"\n                (mouseenter)=\"tooltipMouseEnter($event, column, row)\"\n                (mouseleave)=\"tooltipMouseLeave()\"\n              >\n                <span *ngSwitchCase=\"'columnTemplate'\">\n                  <ng-container\n                    *ngTemplateOutlet=\"getTemplate(column); context: { $implicit: getCellData(row, column) }\"\n                  >\n                  </ng-container>\n                </span>\n\n                <span *ngSwitchCase=\"'cellTemplate'\">\n                  <ng-container\n                    *ngTemplateOutlet=\"tableCellTemplate?.templateRef; context: { row: row, column: column }\"\n                  >\n                  </ng-container>\n                </span>\n\n                <span *ngSwitchCase=\"'boolean'\">\n                  {{ getBooleanLabel(getCellData(row, column), column) }}\n                </span>\n\n                <span *ngSwitchCase=\"'currency'\">\n                  {{ getCellData(row, column) | currency: column.format:'symbol':'1.2-2' }}\n                </span>\n\n                <span *ngSwitchCase=\"'date'\">\n                  {{ getCellData(row, column) | date: column.format || 'dd/MM/yyyy' }}\n                </span>\n\n                <span *ngSwitchCase=\"'time'\">\n                  {{ getCellData(row, column) | po_time: column.format || 'HH:mm:ss.ffffff' }}\n                </span>\n\n                <span *ngSwitchCase=\"'dateTime'\">\n                  {{ getCellData(row, column) | date: column.format || 'dd/MM/yyyy HH:mm:ss' }}\n                </span>\n\n                <span *ngSwitchCase=\"'number'\">\n                  {{ formatNumber(getCellData(row, column), column.format) }}\n                </span>\n\n                <po-table-column-link\n                  *ngSwitchCase=\"'link'\"\n                  [p-action]=\"column.action\"\n                  [p-disabled]=\"checkDisabled(row, column)\"\n                  [p-link]=\"row[column.link]\"\n                  [p-row]=\"row\"\n                  [p-value]=\"getCellData(row, column)\"\n                  (click)=\"onClickLink($event, row, column)\"\n                >\n                </po-table-column-link>\n\n                <po-table-column-icon\n                  *ngSwitchCase=\"'icon'\"\n                  [p-column]=\"column\"\n                  [p-icons]=\"getColumnIcons(row, column)\"\n                  [p-row]=\"row\"\n                >\n                </po-table-column-icon>\n\n                <span *ngSwitchCase=\"'subtitle'\">\n                  <po-table-subtitle-circle [p-subtitle]=\"getSubtitleColumn(row, column)\"></po-table-subtitle-circle>\n                </span>\n                <span *ngSwitchCase=\"'label'\">\n                  <po-table-column-label [p-value]=\"getColumnLabel(row, column)\"> </po-table-column-label>\n                </span>\n                <span *ngSwitchDefault>{{ getCellData(row, column) }}</span>\n              </div>\n            </td>\n\n            <td\n              *ngIf=\"hasRowTemplateWithArrowDirectionRight\"\n              class=\"po-table-column-detail-toggle\"\n              (click)=\"toggleDetail(row)\"\n            >\n              <ng-template\n                [ngTemplateOutlet]=\"poTableColumnDetail\"\n                [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n              >\n              </ng-template>\n            </td>\n\n            <!-- Coluna de a\u00E7oes na direita -->\n            <ng-template\n              *ngIf=\"actionRight\"\n              [ngTemplateOutlet]=\"ActionsColumnTemplate\"\n              [ngTemplateOutletContext]=\"{ row: row, rowIndex: rowIndex }\"\n            >\n            </ng-template>\n          </tr>\n\n          <tr *ngIf=\"hasMainColumns && hasRowTemplate && row.$showDetail && isShowRowTemplate(row, rowIndex)\">\n            <td class=\"po-table-row-template-container\" [colSpan]=\"columnCountForMasterDetail\">\n              <ng-template\n                [ngTemplateOutlet]=\"tableRowTemplate.templateRef\"\n                [ngTemplateOutletContext]=\"{ $implicit: row, rowIndex: rowIndex }\"\n              >\n              </ng-template>\n            </td>\n          </tr>\n\n          <tr *ngIf=\"hasMainColumns && isShowMasterDetail(row)\">\n            <td class=\"po-table-column-detail\" [colSpan]=\"columnCountForMasterDetail\">\n              <po-table-detail\n                [p-selectable]=\"selectable && !detailHideSelect\"\n                [p-detail]=\"columnMasterDetail.detail\"\n                [p-items]=\"row[nameColumnDetail]\"\n                (p-select-row)=\"selectDetailRow($event)\"\n              >\n              </po-table-detail>\n            </td>\n          </tr>\n        </tbody>\n      </ng-container>\n    </table>\n  </cdk-virtual-scroll-viewport>\n</ng-template>\n\n<po-popup #popup [p-actions]=\"actions\" [p-target]=\"popupTarget\"> </po-popup>\n\n<ng-template #poTableColumnDetail let-row=\"row\" let-rowIndex=\"rowIndex\">\n  <span\n    *ngIf=\"(containsMasterDetail(row) && !hasRowTemplate) || (isShowRowTemplate(row, rowIndex) && hasRowTemplate)\"\n    class=\"po-icon po-clickable\"\n    [class.po-icon-arrow-up]=\"row.$showDetail\"\n    [class.po-icon-arrow-down]=\"!row.$showDetail\"\n  >\n  </span>\n</ng-template>\n\n<ng-template #inputRadio let-row>\n  <po-radio [name]=\"idRadio\" [p-checked]=\"row.$selected\" (p-change-selected)=\"selectRow(row)\"></po-radio>\n</ng-template>\n\n<ng-template #inputCheckbox let-row>\n  <po-checkbox\n    name=\"checkbox\"\n    (p-change)=\"selectable ? selectRow(row) : 'javascript:;'\"\n    [p-checkboxValue]=\"row.$selected\"\n  ></po-checkbox>\n</ng-template>\n\n<ng-template #contentHeaderTemplate let-column>\n  <span\n    #columnHeader\n    class=\"po-table-header-ellipsis\"\n    [p-tooltip]=\"tooltipText\"\n    [p-append-in-body]=\"true\"\n    (mouseenter)=\"tooltipMouseEnter($event)\"\n    (mouseleave)=\"tooltipMouseLeave()\"\n  >\n    {{ column.label || (column.property | titlecase) }}\n  </span>\n\n  <span\n    *ngIf=\"sort && column.sortable !== false\"\n    [class.po-table-header-icon-unselected]=\"JSON.stringify(sortedColumn?.property) !== JSON.stringify(column)\"\n    [class.po-table-header-icon-descending]=\"\n      JSON.stringify(sortedColumn?.property) === JSON.stringify(column) && sortedColumn.ascending\n    \"\n    [class.po-table-header-icon-ascending]=\"\n      JSON.stringify(sortedColumn?.property) === JSON.stringify(column) && !sortedColumn.ascending\n    \"\n  >\n    <ng-container *ngIf=\"JSON.stringify(sortedColumn?.property) !== JSON.stringify(column)\">\n      <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M18.2929 15.2929L17 16.5858L17 10C17 9.44772 16.5523 9 16 9C15.4477 9 15 9.44772 15 10L15 16.5858L13.7071 15.2929C13.3166 14.9024 12.6834 14.9024 12.2929 15.2929C11.9024 15.6834 11.9024 16.3166 12.2929 16.7071L15.2929 19.7071C15.6834 20.0976 16.3166 20.0976 16.7071 19.7071L19.7071 16.7071C20.0976 16.3166 20.0976 15.6834 19.7071 15.2929C19.3166 14.9024 18.6834 14.9024 18.2929 15.2929ZM5.70716 8.7071L7.00006 7.4142L7.00003 14C7.00002 14.5523 7.44774 15 8.00002 15C8.55231 15 9.00002 14.5523 9.00003 14L9.00006 7.41418L10.2929 8.70707C10.6835 9.09759 11.3166 9.09758 11.7072 8.70706C12.0977 8.31653 12.0977 7.68336 11.7072 7.29284L8.70718 4.29286C8.31665 3.90234 7.68349 3.90235 7.29296 4.29287L4.29295 7.29289C3.90242 7.68342 3.90242 8.31658 4.29294 8.70711C4.68347 9.09763 5.31663 9.09762 5.70716 8.7071Z\"\n          fill=\"#1D1D30\"\n        />\n      </svg>\n    </ng-container>\n\n    <ng-container *ngIf=\"JSON.stringify(sortedColumn?.property) === JSON.stringify(column) && sortedColumn.ascending\">\n      <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M11 9.41421L9.70711 10.7071C9.31658 11.0976 8.68342 11.0976 8.29289 10.7071C7.90237 10.3166 7.90237 9.68342 8.29289 9.29289L11.2929 6.29289C11.6834 5.90237 12.3166 5.90237 12.7071 6.29289L15.7071 9.29289C16.0976 9.68342 16.0976 10.3166 15.7071 10.7071C15.3166 11.0976 14.6834 11.0976 14.2929 10.7071L13 9.41421V16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16V9.41421Z\"\n          fill=\"black\"\n        />\n      </svg>\n    </ng-container>\n\n    <ng-container *ngIf=\"JSON.stringify(sortedColumn?.property) === JSON.stringify(column) && !sortedColumn.ascending\">\n      <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M9.70711 13.2929L11 14.5858V7C11 6.44772 11.4477 6 12 6C12.5523 6 13 6.44772 13 7V14.5858L14.2929 13.2929C14.6834 12.9024 15.3166 12.9024 15.7071 13.2929C16.0976 13.6834 16.0976 14.3166 15.7071 14.7071L12.7071 17.7071C12.3166 18.0976 11.6834 18.0976 11.2929 17.7071L8.29289 14.7071C7.90237 14.3166 7.90237 13.6834 8.29289 13.2929C8.68342 12.9024 9.31658 12.9024 9.70711 13.2929Z\"\n          fill=\"black\"\n        />\n      </svg>\n    </ng-container>\n  </span>\n</ng-template>\n\n<ng-template #noColumnsWithHeight>\n  <div class=\"po-table-header-fixed-inner\" [style.width.px]=\"headerWidth\">\n    {{ hasValidColumns ? literals.noVisibleColumn : literals.noColumns }}\n  </div>\n</ng-template>\n\n<ng-template #noColumnsWithoutHeight>\n  {{ hasValidColumns ? literals.noVisibleColumn : literals.noColumns }}\n</ng-template>\n\n<!-- Template de a\u00E7\u00F5es -->\n<ng-template #ActionsColumnTemplate let-row=\"row\" let-rowIndex=\"rowIndex\">\n  <td\n    *ngIf=\"isSingleAction\"\n    class=\"po-table-column po-table-column-single-action\"\n    [style.width.px]=\"height && actionRight ? getWidthColumnManager() : ''\"\n    [style.max-width.px]=\"height && !actionRight ? getColumnWidthActionsLeft() : ''\"\n    [style.width.px]=\"height && !actionRight ? getColumnWidthActionsLeft() : ''\"\n  >\n    <div\n      *ngIf=\"firstAction.visible !== false\"\n      class=\"po-table-single-action po-clickable\"\n      [class.po-table-action-disabled]=\"firstAction.disabled ? validateTableAction(row, firstAction) : false\"\n      (click)=\"executeTableAction(row, firstAction)\"\n    >\n      <po-icon *ngIf=\"firstAction.icon\" class=\"po-table-single-action-content\" [p-icon]=\"firstAction.icon\"></po-icon>\n      {{ firstAction.label }}\n    </div>\n  </td>\n\n  <td *ngIf=\"visibleActions.length > 1\" class=\"po-table-column-actions\">\n    <span #popupTarget class=\"po-icon po-icon-more po-clickable\" (click)=\"togglePopup(row, popupTarget)\"></span>\n  </td>\n</ng-template>\n\n<po-table-column-manager\n  *ngIf=\"!hideColumnsManager\"\n  [p-columns]=\"columns\"\n  [p-max-columns]=\"maxColumns\"\n  [p-target]=\"columnManagerTarget\"\n  [p-last-visible-columns-selected]=\"lastVisibleColumnsSelected\"\n  [p-hide-action-fixed-columns]=\"hideActionFixedColumns\"\n  (p-visible-columns-change)=\"onVisibleColumnsChange($event)\"\n  (p-change-visible-columns)=\"onChangeVisibleColumns($event)\"\n  [p-columns-default]=\"initialColumns\"\n  (p-initial-columns)=\"onColumnRestoreManager($event)\"\n>\n</po-table-column-manager>\n\n<po-modal\n  #modalDelete\n  [p-title]=\"literals.delete\"\n  [p-primary-action]=\"confirm\"\n  [p-secondary-action]=\"close\"\n  [p-click-out]=\"true\"\n>\n  <p class=\"po-font-text-large\">{{ literals.bodyDelete }}</p>\n</po-modal>\n" }]
     }], function () { return [{ type: PoDateService }, { type: i0.IterableDiffers }, { type: i0.Renderer2 }, { type: PoLanguageService }, { type: i0.ChangeDetectorRef }, { type: i1.DecimalPipe }, { type: i2.Router }, { type: PoTableService }]; }, { tableRowTemplate: [{
             type: ContentChild,
             args: [PoTableRowTemplateDirective, { static: true }]
@@ -26151,7 +26203,7 @@ class PoComboComponent extends PoComboBaseComponent {
             i0.ɵɵproperty("ngIf", ctx.appendBox)("ngIfThen", _r8)("ngIfElse", _r6);
             i0.ɵɵadvance(5);
             i0.ɵɵproperty("p-help", ctx.help)("p-disabled", ctx.disabled);
-        } }, dependencies: [i1.NgClass, i1.NgIf, i1.NgTemplateOutlet, i5.CdkConnectedOverlay, i5.CdkOverlayOrigin, PoFieldContainerBottomComponent, PoFieldContainerComponent, PoIconComponent, PoListBoxComponent], encapsulation: 2, changeDetection: 0 });
+        } }, dependencies: [i1.NgClass, i1.NgIf, i1.NgTemplateOutlet, i5$1.CdkConnectedOverlay, i5$1.CdkOverlayOrigin, PoFieldContainerBottomComponent, PoFieldContainerComponent, PoIconComponent, PoListBoxComponent], encapsulation: 2, changeDetection: 0 });
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoComboComponent, [{
         type: Component,
@@ -38466,7 +38518,7 @@ class PoTableModule {
         PoTableRowTemplateDirective,
         PoTableCellTemplateDirective,
         PoTableColumnTemplateDirective] }); })();
-i0.ɵɵsetComponentScope(PoTableComponent, [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle, i1.NgSwitch, i1.NgSwitchCase, i1.NgSwitchDefault, i1.NgPlural, i1.NgPluralCase, i2$2.CdkFixedSizeVirtualScroll, i2$2.CdkVirtualForOf, i2$2.CdkVirtualScrollViewport, i3.CdkDropList, i3.CdkDrag, i3.CdkDragHandle, PoButtonComponent, PoContainerComponent, PoLoadingComponent, PoModalComponent, PoPopupComponent, PoTooltipDirective, PoIconComponent, PoCheckboxComponent, PoRadioComponent, PoSearchComponent, PoTableColumnIconComponent,
+i0.ɵɵsetComponentScope(PoTableComponent, [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle, i1.NgSwitch, i1.NgSwitchCase, i1.NgSwitchDefault, i1.NgPlural, i1.NgPluralCase, i2$2.CdkFixedSizeVirtualScroll, i2$2.CdkVirtualForOf, i2$2.CdkVirtualScrollViewport, i3.CdkDropList, i3.CdkDrag, i3.CdkDragHandle, PoButtonComponent, PoContainerComponent, PoLoadingOverlayComponent, PoModalComponent, PoPopupComponent, PoTooltipDirective, PoIconComponent, PoCheckboxComponent, PoRadioComponent, PoSearchComponent, PoTableColumnIconComponent,
     PoTableColumnLabelComponent,
     PoTableColumnLinkComponent,
     PoTableColumnManagerComponent,
@@ -38916,7 +38968,7 @@ class PoFieldModule {
         PoSwitchModule,
         PoTagModule] }); })();
 i0.ɵɵsetComponentScope(PoLookupModalComponent, function () { return [i1.NgIf, i2$1.DefaultValueAccessor, i2$1.NgControlStatus, i2$1.NgModel, PoDisclaimerGroupComponent, PoFieldContainerComponent, PoModalComponent, PoTableComponent]; }, []);
-i0.ɵɵsetComponentScope(PoMultiselectComponent, function () { return [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i5.CdkConnectedOverlay, i5.CdkOverlayOrigin, PoFieldContainerBottomComponent, PoFieldContainerComponent, PoTagComponent, PoMultiselectDropdownComponent]; }, []);
+i0.ɵɵsetComponentScope(PoMultiselectComponent, function () { return [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i5$1.CdkConnectedOverlay, i5$1.CdkOverlayOrigin, PoFieldContainerBottomComponent, PoFieldContainerComponent, PoTagComponent, PoMultiselectDropdownComponent]; }, []);
 
 /**
  * @usedBy PoInfoComponent