@po-ui/ng-components 6.1.0 → 6.2.0

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

@@ -7645,7 +7645,7 @@ PoChartPieComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoChart
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.canDisplayLabels);
         }
-    }, directives: [i1.NgForOf, i1.NgIf, PoChartCircularPathComponent, PoChartCircularLabelComponent], encapsulation: 2 });
+    }, directives: [i1.NgForOf, PoChartCircularPathComponent, i1.NgIf, PoChartCircularLabelComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoChartPieComponent, [{
             type: Component,
@@ -7815,7 +7815,7 @@ PoChartDonutComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoCha
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.canDisplayLabels);
         }
-    }, directives: [i1.NgForOf, i1.NgIf, PoChartCircularPathComponent, PoChartCircularLabelComponent], encapsulation: 2 });
+    }, directives: [i1.NgForOf, PoChartCircularPathComponent, i1.NgIf, PoChartCircularLabelComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoChartDonutComponent, [{
             type: Component,
@@ -9111,7 +9111,7 @@ PoDisclaimerGroupComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
         if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.disclaimers.length > 0);
         }
-    }, directives: [i1.NgIf, i1.NgForOf, PoDisclaimerRemoveComponent, PoDisclaimerComponent], encapsulation: 2 });
+    }, directives: [i1.NgIf, PoDisclaimerRemoveComponent, i1.NgForOf, PoDisclaimerComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoDisclaimerGroupComponent, [{
             type: Component,
@@ -12053,7 +12053,7 @@ PoDatepickerComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoDat
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("p-error-pattern", ctx.getErrorPattern());
         }
-    }, directives: [PoFieldContainerComponent, i1.NgClass, i1.NgIf, PoCalendarComponent, i3.NgControlStatus, i3.NgModel, PoFieldContainerBottomComponent, PoCleanComponent], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgClass, i1.NgIf, PoCleanComponent, PoCalendarComponent, i3.NgControlStatus, i3.NgModel, PoFieldContainerBottomComponent], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoDatepickerComponent, [{
             type: Component,
@@ -16186,7 +16186,7 @@ PoTableSubtitleFooterComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ ty
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.showSubtitle);
         }
-    }, directives: [i1.NgForOf, i1.NgIf, PoTableSubtitleCircleComponent, PoTableShowSubtitleComponent], encapsulation: 2 });
+    }, directives: [i1.NgForOf, PoTableSubtitleCircleComponent, i1.NgIf, PoTableShowSubtitleComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoTableSubtitleFooterComponent, [{
             type: Component,
@@ -17236,11 +17236,11 @@ function PoTableComponent_ng_template_4_ng_container_12_tbody_1_Template(rf, ctx
         i0.ɵɵelementStart(1, "tr", 61);
         i0.ɵɵtemplate(2, PoTableComponent_ng_template_4_ng_container_12_tbody_1_td_2_Template, 2, 4, "td", 64);
         i0.ɵɵtemplate(3, PoTableComponent_ng_template_4_ng_container_12_tbody_1_td_3_Template, 2, 5, "td", 65);
-        i0.ɵɵtemplate(4, PoTableComponent_ng_template_4_ng_container_12_tbody_1_4_Template, 1, 5, undefined, 21);
+        i0.ɵɵtemplate(4, PoTableComponent_ng_template_4_ng_container_12_tbody_1_4_Template, 1, 5, null, 21);
         i0.ɵɵtemplate(5, PoTableComponent_ng_template_4_ng_container_12_tbody_1_td_5_Template, 2, 5, "td", 65);
         i0.ɵɵtemplate(6, PoTableComponent_ng_template_4_ng_container_12_tbody_1_td_6_Template, 15, 31, "td", 66);
         i0.ɵɵtemplate(7, PoTableComponent_ng_template_4_ng_container_12_tbody_1_td_7_Template, 2, 5, "td", 65);
-        i0.ɵɵtemplate(8, PoTableComponent_ng_template_4_ng_container_12_tbody_1_8_Template, 1, 5, undefined, 21);
+        i0.ɵɵtemplate(8, PoTableComponent_ng_template_4_ng_container_12_tbody_1_8_Template, 1, 5, null, 21);
         i0.ɵɵtemplate(9, PoTableComponent_ng_template_4_ng_container_12_tbody_1_ng_container_9_Template, 2, 0, "ng-container", 21);
         i0.ɵɵtemplate(10, PoTableComponent_ng_template_4_ng_container_12_tbody_1_td_10_Template, 1, 0, "td", 67);
         i0.ɵɵelementEnd();
@@ -18083,7 +18083,7 @@ PoTableComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoTableCom
             i0.ɵɵadvance(16);
             i0.ɵɵproperty("ngIf", !ctx.hideColumnsManager);
         }
-    }, directives: [i1.NgIf, PoPopupComponent, PoContainerComponent, i1.NgTemplateOutlet, PoLoadingComponent, i1.NgForOf, PoTableSubtitleFooterComponent, PoButtonComponent, PoTooltipDirective, i1.NgClass, i1.NgSwitch, i1.NgSwitchCase, i1.NgSwitchDefault, PoTableColumnLinkComponent, PoTableColumnIconComponent, PoTableSubtitleCircleComponent, PoTableColumnLabelComponent, PoTableDetailComponent, PoIconComponent, PoTableColumnManagerComponent], pipes: [i1.CurrencyPipe, i1.DatePipe, PoTimePipe, i1.TitleCasePipe], encapsulation: 2 });
+    }, directives: [i1.NgIf, PoContainerComponent, i1.NgTemplateOutlet, PoLoadingComponent, i1.NgForOf, PoTableSubtitleFooterComponent, PoButtonComponent, PoTooltipDirective, i1.NgClass, i1.NgSwitch, i1.NgSwitchCase, PoTableColumnLinkComponent, PoTableColumnIconComponent, PoTableSubtitleCircleComponent, PoTableColumnLabelComponent, i1.NgSwitchDefault, PoTableDetailComponent, PoPopupComponent, PoIconComponent, PoTableColumnManagerComponent], pipes: [i1.CurrencyPipe, i1.DatePipe, PoTimePipe, i1.TitleCasePipe], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoTableComponent, [{
             type: Component,
@@ -20198,11 +20198,11 @@ PoComboComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoComboCom
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.isServerSearching)("ngIfThen", _r6)("ngIfElse", _r8);
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, i1.NgClass, PoFieldContainerBottomComponent, PoIconComponent, PoCleanComponent, PoLoadingComponent, i1.NgForOf, i1.NgTemplateOutlet], encapsulation: 2 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, PoIconComponent, i1.NgClass, PoCleanComponent, PoFieldContainerBottomComponent, PoLoadingComponent, i1.NgForOf, i1.NgTemplateOutlet], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoComboComponent, [{
             type: Component,
-            args: [{ selector: 'po-combo', providers: [
+            args: [{ selector: 'po-combo', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         PoComboFilterService,
                         PoControlPositionService,
                         {
@@ -21260,7 +21260,7 @@ PoDatepickerRangeComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.isCalendarVisible);
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, PoFieldContainerBottomComponent, PoCleanComponent, PoCalendarComponent, i3.NgControlStatus, i3.NgModel], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, PoCleanComponent, PoFieldContainerBottomComponent, PoCalendarComponent, i3.NgControlStatus, i3.NgModel], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoDatepickerRangeComponent, [{
             type: Component,
@@ -22310,7 +22310,7 @@ PoDecimalComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoDecima
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-error-pattern", ctx.getErrorPatternMessage());
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, PoFieldContainerBottomComponent, PoIconComponent, PoCleanComponent], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, PoIconComponent, PoCleanComponent, PoFieldContainerBottomComponent], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoDecimalComponent, [{
             type: Component,
@@ -22693,7 +22693,7 @@ PoEmailComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoEmailCom
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-error-pattern", ctx.getErrorPattern());
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, PoFieldContainerBottomComponent, PoIconComponent, PoCleanComponent], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, PoIconComponent, PoCleanComponent, PoFieldContainerBottomComponent], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoEmailComponent, [{
             type: Component,
@@ -22793,7 +22793,7 @@ PoLoginComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoLoginCom
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-error-pattern", ctx.getErrorPattern());
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, PoFieldContainerBottomComponent, PoCleanComponent], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, PoCleanComponent, PoFieldContainerBottomComponent], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoLoginComponent, [{
             type: Component,
@@ -24362,7 +24362,7 @@ PoLookupModalComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoLo
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("hidden", !ctx.isAdvancedFilter);
         }
-    }, directives: [PoModalComponent, PoFieldContainerComponent, i3.DefaultValueAccessor, i3.NgControlStatus, i3.NgModel, i1.NgIf, PoTableComponent, PoDisclaimerGroupComponent], encapsulation: 2 });
+    }, directives: [PoModalComponent, PoFieldContainerComponent, i3.DefaultValueAccessor, i3.NgControlStatus, i3.NgModel, i1.NgIf, PoDisclaimerGroupComponent, PoTableComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoLookupModalComponent, [{
             type: Component,
@@ -24874,7 +24874,7 @@ PoLookupComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoLookupC
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", !ctx.disclaimers.length)("ngIfElse", _r1);
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, PoFieldContainerBottomComponent, i1.NgClass, PoCleanComponent, i1.NgForOf, PoDisclaimerComponent], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, i1.NgClass, PoCleanComponent, PoFieldContainerBottomComponent, i1.NgForOf, PoDisclaimerComponent], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoLookupComponent, [{
             type: Component,
@@ -24969,7 +24969,8 @@ function PoMultiselectDropdownComponent_ng_container_7_Template(rf, ctx) {
  * Componente que construíra o dropdown, contendo o campo de pesquisa e os itens para seleção.
  */
 class PoMultiselectDropdownComponent {
-    constructor() {
+    constructor(cd) {
+        this.cd = cd;
         /** Propriedade que indica se deve exibir o loading. */
         this.isServerSearching = false;
         /** Propriedade que indica se o campo de pesquisa deverá ser escondido. */
@@ -25006,6 +25007,7 @@ class PoMultiselectDropdownComponent {
     }
     scrollTo(index) {
         this.scrollTop = index <= 2 ? 0 : index * 44 - 88;
+        this.cd.markForCheck();
     }
     isSelectedItem(option) {
         return this.selectedOptions.some(selectedItem => selectedItem.value === option.value);
@@ -25064,6 +25066,7 @@ class PoMultiselectDropdownComponent {
                 this.searchElement.clean();
             }
         });
+        this.cd.markForCheck();
     }
     uniqueSelectedOptions(selectedValues) {
         const newSelectedOptions = [...this.selectedOptions];
@@ -25075,7 +25078,7 @@ class PoMultiselectDropdownComponent {
         return newSelectedOptions;
     }
 }
-PoMultiselectDropdownComponent.ɵfac = function PoMultiselectDropdownComponent_Factory(t) { return new (t || PoMultiselectDropdownComponent)(); };
+PoMultiselectDropdownComponent.ɵfac = function PoMultiselectDropdownComponent_Factory(t) { return new (t || PoMultiselectDropdownComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
 PoMultiselectDropdownComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoMultiselectDropdownComponent, selectors: [["po-multiselect-dropdown"]], viewQuery: function PoMultiselectDropdownComponent_Query(rf, ctx) {
         if (rf & 1) {
             i0.ɵɵviewQuery(_c0$N, 7, ElementRef);
@@ -25116,12 +25119,12 @@ PoMultiselectDropdownComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ ty
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", !ctx.isServerSearching);
         }
-    }, encapsulation: 2 });
+    }, encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoMultiselectDropdownComponent, [{
             type: Component,
-            args: [{ selector: 'po-multiselect-dropdown', template: "<div #container class=\"po-multiselect-container\" [hidden]=\"!show\">\n  <po-multiselect-search\n    #searchElement\n    *ngIf=\"!hideSearch\"\n    [p-literals]=\"literals\"\n    [p-placeholder]=\"placeholderSearch\"\n    (p-change)=\"callChangeSearch($event)\"\n  >\n  </po-multiselect-search>\n\n  <ul class=\"po-multiselect-items-container\" [scrollTop]=\"scrollTop\" #ulElement>\n    <div *ngIf=\"!visibleOptions.length && !isServerSearching\" class=\"po-multiselect-container-no-data po-text-center\">\n      <span> {{ literals.noData }}</span>\n    </div>\n\n    <div *ngIf=\"isServerSearching\" class=\"po-multiselect-container-loading po-text-center\">\n      <po-loading></po-loading>\n    </div>\n\n    <ng-container *ngIf=\"!isServerSearching\">\n      <po-multiselect-item\n        *ngIf=\"!searchElement?.inputValue && visibleOptions.length && !hideSelectAll\"\n        [p-label]=\"literals?.selectAll\"\n        [p-selected]=\"getStateSelectAll()\"\n        (p-change)=\"onClickSelectAll()\"\n      >\n      </po-multiselect-item>\n\n      <po-multiselect-item\n        *ngFor=\"let option of visibleOptions\"\n        [p-label]=\"option.label\"\n        [p-selected]=\"isSelectedItem(option)\"\n        (p-change)=\"clickItem($event, option)\"\n      >\n      </po-multiselect-item>\n    </ng-container>\n  </ul>\n</div>\n" }]
-        }], null, { isServerSearching: [{
+            args: [{ selector: 'po-multiselect-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #container class=\"po-multiselect-container\" [hidden]=\"!show\">\n  <po-multiselect-search\n    #searchElement\n    *ngIf=\"!hideSearch\"\n    [p-literals]=\"literals\"\n    [p-placeholder]=\"placeholderSearch\"\n    (p-change)=\"callChangeSearch($event)\"\n  >\n  </po-multiselect-search>\n\n  <ul class=\"po-multiselect-items-container\" [scrollTop]=\"scrollTop\" #ulElement>\n    <div *ngIf=\"!visibleOptions.length && !isServerSearching\" class=\"po-multiselect-container-no-data po-text-center\">\n      <span> {{ literals.noData }}</span>\n    </div>\n\n    <div *ngIf=\"isServerSearching\" class=\"po-multiselect-container-loading po-text-center\">\n      <po-loading></po-loading>\n    </div>\n\n    <ng-container *ngIf=\"!isServerSearching\">\n      <po-multiselect-item\n        *ngIf=\"!searchElement?.inputValue && visibleOptions.length && !hideSelectAll\"\n        [p-label]=\"literals?.selectAll\"\n        [p-selected]=\"getStateSelectAll()\"\n        (p-change)=\"onClickSelectAll()\"\n      >\n      </po-multiselect-item>\n\n      <po-multiselect-item\n        *ngFor=\"let option of visibleOptions\"\n        [p-label]=\"option.label\"\n        [p-selected]=\"isSelectedItem(option)\"\n        (p-change)=\"clickItem($event, option)\"\n      >\n      </po-multiselect-item>\n    </ng-container>\n  </ul>\n</div>\n" }]
+        }], function () { return [{ type: i0.ChangeDetectorRef }]; }, { isServerSearching: [{
                 type: Input,
                 args: ['p-searching']
             }], hideSearch: [{
@@ -26028,6 +26031,7 @@ class PoMultiselectComponent extends PoMultiselectBaseComponent {
                 }
             }
         }
+        this.changeDetector.markForCheck();
     }
     changeItems(changedItems) {
         this.updateSelectedOptions(changedItems);
@@ -26054,6 +26058,7 @@ class PoMultiselectComponent extends PoMultiselectBaseComponent {
                 this.calculateVisibleItems();
             }, 200);
         }
+        this.changeDetector.markForCheck();
     }
     onBlur() {
         var _a;
@@ -26094,6 +26099,7 @@ class PoMultiselectComponent extends PoMultiselectBaseComponent {
     }
     setVisibleOptionsDropdown(options) {
         this.visibleOptionsDropdown = options;
+        this.changeDetector.markForCheck();
     }
     changeSearch(event) {
         if (event && event.value !== undefined) {
@@ -26191,6 +26197,7 @@ class PoMultiselectComponent extends PoMultiselectBaseComponent {
             this.resizeListener();
         }
         window.removeEventListener('scroll', this.onScroll, true);
+        this.changeDetector.markForCheck();
     }
     setPositionDropdown() {
         this.controlPosition.setElements(this.dropdown.container.nativeElement, poMultiselectContainerOffset, this.inputElement, ['top', 'bottom'], true);
@@ -26248,11 +26255,11 @@ PoMultiselectComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoMu
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("p-searching", ctx.isServerSearching)("p-hide-search", ctx.hideSearch)("p-hide-select-all", ctx.hideSelectAll)("p-literals", ctx.literals)("p-options", ctx.options)("p-visible-options", ctx.visibleOptionsDropdown)("p-selected-options", ctx.selectedOptions)("p-placeholder-search", ctx.placeholderSearch);
         }
-    }, encapsulation: 2 });
+    }, encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoMultiselectComponent, [{
             type: Component,
-            args: [{ selector: 'po-multiselect', providers: providers$1, template: "<po-field-container [p-label]=\"label\" [p-help]=\"help\" [p-optional]=\"!required && optional\">\n  <div class=\"po-field-container-content\" [class.po-multiselect-show]=\"dropdownOpen\">\n    <div\n      #inputElement\n      [tabindex]=\"disabled ? -1 : 0\"\n      class=\"po-input po-input-icon-right po-multiselect-input po-clickable\"\n      [class.po-multiselect-input-auto]=\"autoHeight\"\n      [class.po-multiselect-input-static]=\"!autoHeight\"\n      [class.po-multiselect-input-disabled]=\"disabled\"\n      (keyup.enter)=\"toggleDropdownVisibility()\"\n      (keydown)=\"onKeyDown($event)\"\n      (click)=\"toggleDropdownVisibility()\"\n      (blur)=\"onBlur()\"\n    >\n      <span *ngIf=\"placeholder && !visibleDisclaimers?.length\" class=\"po-multiselect-input-placeholder\">\n        {{ placeholder }}\n      </span>\n\n      <po-disclaimer\n        *ngFor=\"let disclaimer of visibleDisclaimers\"\n        class=\"po-multiselect-input-disclaimer\"\n        [p-label]=\"disclaimer.label\"\n        [p-value]=\"disclaimer.value\"\n        [p-hide-close]=\"disclaimer.value === '' || disabled\"\n        [class.po-clickable]=\"disclaimer.value === '' && !disabled\"\n        (click)=\"openDropdown(disclaimer.value === '')\"\n        (p-close-action)=\"closeDisclaimer(disclaimer.value)\"\n      >\n      </po-disclaimer>\n\n      <div class=\"po-field-icon-container-right\">\n        <span\n          #iconElement\n          class=\"po-icon po-field-icon {{ dropdownIcon }}\"\n          [ngClass]=\"disabled ? 'po-field-icon-disabled' : ''\"\n        >\n        </span>\n      </div>\n    </div>\n  </div>\n\n  <po-multiselect-dropdown\n    #dropdownElement\n    [p-searching]=\"isServerSearching\"\n    [p-hide-search]=\"hideSearch\"\n    [p-hide-select-all]=\"hideSelectAll\"\n    [p-literals]=\"literals\"\n    [p-options]=\"options\"\n    [p-visible-options]=\"visibleOptionsDropdown\"\n    [p-selected-options]=\"selectedOptions\"\n    [p-placeholder-search]=\"placeholderSearch\"\n    (p-change)=\"changeItems($event)\"\n    (p-change-search)=\"changeSearch($event)\"\n    (p-close-dropdown)=\"controlDropdownVisibility(false)\"\n  >\n  </po-multiselect-dropdown>\n\n  <po-field-container-bottom></po-field-container-bottom>\n</po-field-container>\n" }]
+            args: [{ selector: 'po-multiselect', changeDetection: ChangeDetectionStrategy.OnPush, providers: providers$1, template: "<po-field-container [p-label]=\"label\" [p-help]=\"help\" [p-optional]=\"!required && optional\">\n  <div class=\"po-field-container-content\" [class.po-multiselect-show]=\"dropdownOpen\">\n    <div\n      #inputElement\n      [tabindex]=\"disabled ? -1 : 0\"\n      class=\"po-input po-input-icon-right po-multiselect-input po-clickable\"\n      [class.po-multiselect-input-auto]=\"autoHeight\"\n      [class.po-multiselect-input-static]=\"!autoHeight\"\n      [class.po-multiselect-input-disabled]=\"disabled\"\n      (keyup.enter)=\"toggleDropdownVisibility()\"\n      (keydown)=\"onKeyDown($event)\"\n      (click)=\"toggleDropdownVisibility()\"\n      (blur)=\"onBlur()\"\n    >\n      <span *ngIf=\"placeholder && !visibleDisclaimers?.length\" class=\"po-multiselect-input-placeholder\">\n        {{ placeholder }}\n      </span>\n\n      <po-disclaimer\n        *ngFor=\"let disclaimer of visibleDisclaimers\"\n        class=\"po-multiselect-input-disclaimer\"\n        [p-label]=\"disclaimer.label\"\n        [p-value]=\"disclaimer.value\"\n        [p-hide-close]=\"disclaimer.value === '' || disabled\"\n        [class.po-clickable]=\"disclaimer.value === '' && !disabled\"\n        (click)=\"openDropdown(disclaimer.value === '')\"\n        (p-close-action)=\"closeDisclaimer(disclaimer.value)\"\n      >\n      </po-disclaimer>\n\n      <div class=\"po-field-icon-container-right\">\n        <span\n          #iconElement\n          class=\"po-icon po-field-icon {{ dropdownIcon }}\"\n          [ngClass]=\"disabled ? 'po-field-icon-disabled' : ''\"\n        >\n        </span>\n      </div>\n    </div>\n  </div>\n\n  <po-multiselect-dropdown\n    #dropdownElement\n    [p-searching]=\"isServerSearching\"\n    [p-hide-search]=\"hideSearch\"\n    [p-hide-select-all]=\"hideSelectAll\"\n    [p-literals]=\"literals\"\n    [p-options]=\"options\"\n    [p-visible-options]=\"visibleOptionsDropdown\"\n    [p-selected-options]=\"selectedOptions\"\n    [p-placeholder-search]=\"placeholderSearch\"\n    (p-change)=\"changeItems($event)\"\n    (p-change-search)=\"changeSearch($event)\"\n    (p-close-dropdown)=\"controlDropdownVisibility(false)\"\n  >\n  </po-multiselect-dropdown>\n\n  <po-field-container-bottom></po-field-container-bottom>\n</po-field-container>\n" }]
         }], function () { return [{ type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: PoControlPositionService }, { type: PoMultiselectFilterService }, { type: PoLanguageService }]; }, { dropdownElement: [{
                 type: ViewChild,
                 args: ['dropdownElement', { read: ElementRef, static: true }]
@@ -26334,7 +26341,8 @@ const _c0$L = ["inputElement"];
  * Componente de pesquisa que será criado dentro do dropdown do `po-multiselect`.
  */
 class PoMultiselectSearchComponent {
-    constructor() {
+    constructor(cd) {
+        this.cd = cd;
         /** Evento que será disparado a cada tecla digitada no campo de busca. */
         this.change = new EventEmitter();
     }
@@ -26366,9 +26374,10 @@ class PoMultiselectSearchComponent {
     }
     clean() {
         this.inputElement.nativeElement.value = '';
+        this.cd.markForCheck();
     }
 }
-PoMultiselectSearchComponent.ɵfac = function PoMultiselectSearchComponent_Factory(t) { return new (t || PoMultiselectSearchComponent)(); };
+PoMultiselectSearchComponent.ɵfac = function PoMultiselectSearchComponent_Factory(t) { return new (t || PoMultiselectSearchComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
 PoMultiselectSearchComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoMultiselectSearchComponent, selectors: [["po-multiselect-search"]], viewQuery: function PoMultiselectSearchComponent_Query(rf, ctx) {
         if (rf & 1) {
             i0.ɵɵviewQuery(_c0$L, 7, ElementRef);
@@ -26392,12 +26401,12 @@ PoMultiselectSearchComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("placeholder", ctx.placeholder);
         }
-    }, encapsulation: 2 });
+    }, encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoMultiselectSearchComponent, [{
             type: Component,
-            args: [{ selector: 'po-multiselect-search', template: "<div class=\"po-field-container-content po-multiselect-container-search\">\n  <div class=\"po-field-icon-container-left\">\n    <span class=\"po-icon po-icon-search po-field-icon\"></span>\n  </div>\n\n  <input\n    #inputElement\n    class=\"po-input po-input-icon-left po-multiselect-search-input\"\n    type=\"text\"\n    [placeholder]=\"placeholder\"\n    (keyup)=\"onChange($event)\"\n  />\n</div>\n" }]
-        }], null, { inputElement: [{
+            args: [{ selector: 'po-multiselect-search', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"po-field-container-content po-multiselect-container-search\">\n  <div class=\"po-field-icon-container-left\">\n    <span class=\"po-icon po-icon-search po-field-icon\"></span>\n  </div>\n\n  <input\n    #inputElement\n    class=\"po-input po-input-icon-left po-multiselect-search-input\"\n    type=\"text\"\n    [placeholder]=\"placeholder\"\n    (keyup)=\"onChange($event)\"\n  />\n</div>\n" }]
+        }], function () { return [{ type: i0.ChangeDetectorRef }]; }, { inputElement: [{
                 type: ViewChild,
                 args: ['inputElement', { read: ElementRef, static: true }]
             }], literals: [{
@@ -27931,6 +27940,72 @@ PoUploadDragDropAreaComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ typ
             }] });
 })();
 
+const _c0$I = ["DragDropAreaFixed"];
+class PoUploadDragDropAreaOverlayComponent {
+    constructor(renderer) {
+        this.renderer = renderer;
+        this.areaElement = new EventEmitter();
+    }
+    ngAfterViewInit() {
+        if (this.target) {
+            this.setPosition(this.target);
+        }
+        this.areaElement.emit(this.DragDropAreaFixed.nativeElement);
+    }
+    setPosition(targetElement) {
+        const boundingClientRect = targetElement.nativeElement.getBoundingClientRect();
+        const clientRectKeys = ['bottom', 'left', 'height', 'right', 'top', 'width'];
+        clientRectKeys.forEach(clientRectKey => {
+            const clientRectValue = boundingClientRect[clientRectKey];
+            this.renderer.setStyle(this.DragDropAreaFixed.nativeElement, clientRectKey, `${clientRectValue}px`);
+        });
+    }
+}
+PoUploadDragDropAreaOverlayComponent.ɵfac = function PoUploadDragDropAreaOverlayComponent_Factory(t) { return new (t || PoUploadDragDropAreaOverlayComponent)(i0.ɵɵdirectiveInject(i0.Renderer2)); };
+PoUploadDragDropAreaOverlayComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoUploadDragDropAreaOverlayComponent, selectors: [["po-upload-drag-drop-area-overlay"]], viewQuery: function PoUploadDragDropAreaOverlayComponent_Query(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵviewQuery(_c0$I, 7, ElementRef);
+        }
+        if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.DragDropAreaFixed = _t.first);
+        }
+    }, inputs: { directoryCompatible: ["p-directory-compatible", "directoryCompatible"], disabled: ["p-disabled", "disabled"], literals: ["p-literals", "literals"], target: ["p-target", "target"] }, outputs: { areaElement: "p-area-element" }, decls: 3, vars: 4, consts: [[1, "po-overlay-fixed"], [1, "po-upload-drag-drop-area-overlay", 3, "p-directory-compatible", "p-disabled", "p-literals", "p-overlay"], ["DragDropAreaFixed", ""]], template: function PoUploadDragDropAreaOverlayComponent_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0);
+            i0.ɵɵelement(1, "po-upload-drag-drop-area", 1, 2);
+            i0.ɵɵelementEnd();
+        }
+        if (rf & 2) {
+            i0.ɵɵadvance(1);
+            i0.ɵɵproperty("p-directory-compatible", ctx.directoryCompatible)("p-disabled", ctx.disabled)("p-literals", ctx.literals)("p-overlay", true);
+        }
+    }, directives: [PoUploadDragDropAreaComponent], encapsulation: 2, changeDetection: 0 });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoUploadDragDropAreaOverlayComponent, [{
+            type: Component,
+            args: [{ selector: 'po-upload-drag-drop-area-overlay', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"po-overlay-fixed\">\n  <po-upload-drag-drop-area\n    #DragDropAreaFixed\n    class=\"po-upload-drag-drop-area-overlay\"\n    [p-directory-compatible]=\"directoryCompatible\"\n    [p-disabled]=\"disabled\"\n    [p-literals]=\"literals\"\n    [p-overlay]=\"true\"\n  >\n  </po-upload-drag-drop-area>\n</div>\n" }]
+        }], function () { return [{ type: i0.Renderer2 }]; }, { DragDropAreaFixed: [{
+                type: ViewChild,
+                args: ['DragDropAreaFixed', { read: ElementRef, static: true }]
+            }], directoryCompatible: [{
+                type: Input,
+                args: ['p-directory-compatible']
+            }], disabled: [{
+                type: Input,
+                args: ['p-disabled']
+            }], literals: [{
+                type: Input,
+                args: ['p-literals']
+            }], target: [{
+                type: Input,
+                args: ['p-target']
+            }], areaElement: [{
+                type: Output,
+                args: ['p-area-element']
+            }] });
+})();
+
 /**
  * @description
  *
@@ -28308,72 +28383,6 @@ PoUploadDragDropDirective.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: P
             }] });
 })();
 
-const _c0$I = ["DragDropAreaFixed"];
-class PoUploadDragDropAreaOverlayComponent {
-    constructor(renderer) {
-        this.renderer = renderer;
-        this.areaElement = new EventEmitter();
-    }
-    ngAfterViewInit() {
-        if (this.target) {
-            this.setPosition(this.target);
-        }
-        this.areaElement.emit(this.DragDropAreaFixed.nativeElement);
-    }
-    setPosition(targetElement) {
-        const boundingClientRect = targetElement.nativeElement.getBoundingClientRect();
-        const clientRectKeys = ['bottom', 'left', 'height', 'right', 'top', 'width'];
-        clientRectKeys.forEach(clientRectKey => {
-            const clientRectValue = boundingClientRect[clientRectKey];
-            this.renderer.setStyle(this.DragDropAreaFixed.nativeElement, clientRectKey, `${clientRectValue}px`);
-        });
-    }
-}
-PoUploadDragDropAreaOverlayComponent.ɵfac = function PoUploadDragDropAreaOverlayComponent_Factory(t) { return new (t || PoUploadDragDropAreaOverlayComponent)(i0.ɵɵdirectiveInject(i0.Renderer2)); };
-PoUploadDragDropAreaOverlayComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoUploadDragDropAreaOverlayComponent, selectors: [["po-upload-drag-drop-area-overlay"]], viewQuery: function PoUploadDragDropAreaOverlayComponent_Query(rf, ctx) {
-        if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$I, 7, ElementRef);
-        }
-        if (rf & 2) {
-            let _t;
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.DragDropAreaFixed = _t.first);
-        }
-    }, inputs: { directoryCompatible: ["p-directory-compatible", "directoryCompatible"], disabled: ["p-disabled", "disabled"], literals: ["p-literals", "literals"], target: ["p-target", "target"] }, outputs: { areaElement: "p-area-element" }, decls: 3, vars: 4, consts: [[1, "po-overlay-fixed"], [1, "po-upload-drag-drop-area-overlay", 3, "p-directory-compatible", "p-disabled", "p-literals", "p-overlay"], ["DragDropAreaFixed", ""]], template: function PoUploadDragDropAreaOverlayComponent_Template(rf, ctx) {
-        if (rf & 1) {
-            i0.ɵɵelementStart(0, "div", 0);
-            i0.ɵɵelement(1, "po-upload-drag-drop-area", 1, 2);
-            i0.ɵɵelementEnd();
-        }
-        if (rf & 2) {
-            i0.ɵɵadvance(1);
-            i0.ɵɵproperty("p-directory-compatible", ctx.directoryCompatible)("p-disabled", ctx.disabled)("p-literals", ctx.literals)("p-overlay", true);
-        }
-    }, directives: [PoUploadDragDropAreaComponent], encapsulation: 2, changeDetection: 0 });
-(function () {
-    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoUploadDragDropAreaOverlayComponent, [{
-            type: Component,
-            args: [{ selector: 'po-upload-drag-drop-area-overlay', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"po-overlay-fixed\">\n  <po-upload-drag-drop-area\n    #DragDropAreaFixed\n    class=\"po-upload-drag-drop-area-overlay\"\n    [p-directory-compatible]=\"directoryCompatible\"\n    [p-disabled]=\"disabled\"\n    [p-literals]=\"literals\"\n    [p-overlay]=\"true\"\n  >\n  </po-upload-drag-drop-area>\n</div>\n" }]
-        }], function () { return [{ type: i0.Renderer2 }]; }, { DragDropAreaFixed: [{
-                type: ViewChild,
-                args: ['DragDropAreaFixed', { read: ElementRef, static: true }]
-            }], directoryCompatible: [{
-                type: Input,
-                args: ['p-directory-compatible']
-            }], disabled: [{
-                type: Input,
-                args: ['p-disabled']
-            }], literals: [{
-                type: Input,
-                args: ['p-literals']
-            }], target: [{
-                type: Input,
-                args: ['p-target']
-            }], areaElement: [{
-                type: Output,
-                args: ['p-area-element']
-            }] });
-})();
-
 const _c0$H = ["dragDropOverlay"];
 function PoUploadDragDropComponent_po_upload_drag_drop_area_overlay_0_Template(rf, ctx) {
     if (rf & 1) {
@@ -28446,7 +28455,7 @@ PoUploadDragDropComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: P
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-area-element", ctx.areaElement)("p-directory-compatible", ctx.directoryCompatible)("p-disabled", ctx.disabled)("p-height", ctx.dragDropHeight)("p-literals", ctx.literals)("p-overlay", false);
         }
-    }, directives: [i1.NgIf, PoUploadDragDropAreaComponent, PoUploadDragDropDirective, PoUploadDragDropAreaOverlayComponent], encapsulation: 2, changeDetection: 0 });
+    }, directives: [i1.NgIf, PoUploadDragDropAreaOverlayComponent, PoUploadDragDropAreaComponent, PoUploadDragDropDirective], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoUploadDragDropComponent, [{
             type: Component,
@@ -29221,7 +29230,7 @@ PoUrlComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoUrlCompone
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-error-pattern", ctx.getErrorPattern());
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, PoFieldContainerBottomComponent, PoIconComponent, PoCleanComponent], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, PoIconComponent, PoCleanComponent, PoFieldContainerBottomComponent], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoUrlComponent, [{
             type: Component,
@@ -29470,7 +29479,7 @@ PoInputComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoInputCom
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-error-pattern", ctx.getErrorPattern());
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, PoFieldContainerBottomComponent, PoIconComponent, PoCleanComponent], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, PoIconComponent, PoCleanComponent, PoFieldContainerBottomComponent], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoInputComponent, [{
             type: Component,
@@ -29883,7 +29892,7 @@ PoRichTextToolbarComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type:
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("p-buttons", ctx.mediaButtons);
         }
-    }, directives: [PoButtonGroupComponent, i1.NgIf, PoRichTextImageModalComponent, PoRichTextLinkModalComponent, PoTooltipDirective], encapsulation: 2 });
+    }, directives: [PoButtonGroupComponent, i1.NgIf, PoTooltipDirective, PoRichTextImageModalComponent, PoRichTextLinkModalComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoRichTextToolbarComponent, [{
             type: Component,
@@ -30349,7 +30358,7 @@ PoNumberComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoNumberC
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-error-pattern", ctx.getErrorPatternMessage());
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, PoFieldContainerBottomComponent, PoIconComponent, PoCleanComponent], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, PoIconComponent, PoCleanComponent, PoFieldContainerBottomComponent], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoNumberComponent, [{
             type: Component,
@@ -30508,7 +30517,7 @@ PoPasswordComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoPassw
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-error-pattern", ctx.getErrorPattern());
         }
-    }, directives: [PoFieldContainerComponent, i1.NgIf, PoFieldContainerBottomComponent, PoCleanComponent, i1.NgClass], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgIf, PoCleanComponent, i1.NgClass, PoFieldContainerBottomComponent], encapsulation: 2, changeDetection: 0 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoPasswordComponent, [{
             type: Component,
@@ -31604,7 +31613,7 @@ PoSelectComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoSelectC
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngForOf", ctx.options);
         }
-    }, directives: [PoFieldContainerComponent, i1.NgClass, i1.NgIf, i1.NgForOf, PoFieldContainerBottomComponent, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i1.NgTemplateOutlet], encapsulation: 2, changeDetection: 0 });
+    }, directives: [PoFieldContainerComponent, i1.NgClass, i1.NgIf, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i1.NgForOf, i1.NgTemplateOutlet, PoFieldContainerBottomComponent], encapsulation: 2, changeDetection: 0 });
 __decorate([
     InputBoolean()
 ], PoSelectComponent.prototype, "readonly", void 0);
@@ -34168,7 +34177,7 @@ PoDynamicViewComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoDy
         if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.visibleFields.length);
         }
-    }, directives: [i1.NgIf, i1.NgForOf, i1.NgTemplateOutlet, PoDividerComponent, PoInfoComponent, i1.NgClass, PoTagComponent], encapsulation: 2 });
+    }, directives: [i1.NgIf, i1.NgForOf, PoDividerComponent, i1.NgTemplateOutlet, PoInfoComponent, i1.NgClass, PoTagComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoDynamicViewComponent, [{
             type: Component,
@@ -36925,7 +36934,7 @@ PoListViewComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoListV
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-actions", ctx.actions)("p-target", ctx.popupTarget);
         }
-    }, directives: [i1.NgIf, i1.NgForOf, PoPopupComponent, i1.NgSwitch, i1.NgSwitchCase, i2.RouterLinkWithHref, PoButtonComponent, i1.NgTemplateOutlet], encapsulation: 2, data: { animation: [
+    }, directives: [i1.NgIf, i1.NgForOf, i1.NgSwitch, i1.NgSwitchCase, i2.RouterLinkWithHref, PoButtonComponent, i1.NgTemplateOutlet, PoPopupComponent], encapsulation: 2, data: { animation: [
             trigger('showHideDetail', [
                 state('*', style({ 'overflow-y': 'visible' })),
                 state('void', style({ 'overflow-y': 'hidden' })),
@@ -37681,7 +37690,7 @@ PoMenuFilterComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoMen
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("p-element-ref", ctx.inputFilterElement);
         }
-    }, directives: [i1.NgIf, PoCleanComponent, PoLoadingIconComponent], encapsulation: 2 });
+    }, directives: [i1.NgIf, PoLoadingIconComponent, PoCleanComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoMenuFilterComponent, [{
             type: Component,
@@ -38350,7 +38359,7 @@ class PoMenuComponent extends PoMenuBaseComponent {
             return menus.some(menu => {
                 const formattedMenuLink = getFormattedLink(menu.link);
                 const menuLinkPath = `${urlPathWithoutLastFragment}${formattedMenuLink.substr(formattedMenuLink.lastIndexOf('/'))}`;
-                if (menuLinkPath === urlPath) {
+                if (menuLinkPath === urlPath && menuLinkPath === formattedMenuLink) {
                     this.linkActive = formattedMenuLink;
                     this.activateMenuItem(menu);
                     return true;
@@ -38718,7 +38727,7 @@ PoMenuComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoMenuCompo
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.hasFooter);
         }
-    }, directives: [i1.NgIf, i1.NgClass, i1.NgForOf, i1.NgTemplateOutlet, PoMenuFilterComponent, PoIconComponent, PoMenuItemComponent], encapsulation: 2 });
+    }, directives: [i1.NgIf, i1.NgClass, i1.NgTemplateOutlet, PoMenuFilterComponent, PoIconComponent, i1.NgForOf, PoMenuItemComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoMenuComponent, [{
             type: Component,
@@ -39316,7 +39325,7 @@ PoNavbarActionsComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Po
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("p-icon-actions", ctx.iconActions);
         }
-    }, directives: [i1.NgForOf, PoNavbarActionPopupComponent, PoNavbarActionComponent], encapsulation: 2 });
+    }, directives: [i1.NgForOf, PoNavbarActionComponent, PoNavbarActionPopupComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoNavbarActionsComponent, [{
             type: Component,
@@ -40019,7 +40028,7 @@ PoNavbarComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoNavbarC
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", !ctx.applicationMenu);
         }
-    }, directives: [i1.NgClass, PoNavbarLogoComponent, PoNavbarItemsComponent, i1.NgIf, PoNavbarActionsComponent, PoNavbarItemNavigationComponent, PoMenuComponent], encapsulation: 2 });
+    }, directives: [i1.NgClass, PoNavbarLogoComponent, PoNavbarItemsComponent, i1.NgIf, PoNavbarItemNavigationComponent, PoNavbarActionsComponent, PoMenuComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoNavbarComponent, [{
             type: Component,
@@ -40635,7 +40644,7 @@ PoPageDefaultComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoPa
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.hasPageHeader());
         }
-    }, directives: [PoPageComponent, i1.NgIf, PoPageContentComponent, PoPageHeaderComponent, PoDropdownComponent, PoButtonComponent], encapsulation: 2 });
+    }, directives: [PoPageComponent, i1.NgIf, PoPageHeaderComponent, PoDropdownComponent, PoButtonComponent, PoPageContentComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoPageDefaultComponent, [{
             type: Component,
@@ -40937,7 +40946,7 @@ PoPageDetailComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoPag
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.hasPageHeader());
         }
-    }, directives: [PoPageComponent, i1.NgIf, PoPageContentComponent, PoPageHeaderComponent, PoButtonComponent], encapsulation: 2 });
+    }, directives: [PoPageComponent, i1.NgIf, PoPageHeaderComponent, PoButtonComponent, PoPageContentComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoPageDetailComponent, [{
             type: Component,
@@ -41249,7 +41258,7 @@ PoPageEditComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoPageE
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.hasPageHeader());
         }
-    }, directives: [PoPageComponent, i1.NgIf, PoPageContentComponent, PoPageHeaderComponent, PoButtonComponent], encapsulation: 2 });
+    }, directives: [PoPageComponent, i1.NgIf, PoPageHeaderComponent, PoButtonComponent, PoPageContentComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoPageEditComponent, [{
             type: Component,
@@ -41739,7 +41748,7 @@ PoPageListComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoPageL
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.hasPageHeader());
         }
-    }, directives: [PoPageComponent, i1.NgIf, PoPageContentComponent, PoPageHeaderComponent, PoButtonComponent, PoDropdownComponent, i1.NgClass, PoDisclaimerGroupComponent], encapsulation: 2 });
+    }, directives: [PoPageComponent, i1.NgIf, PoPageHeaderComponent, PoButtonComponent, PoDropdownComponent, i1.NgClass, PoDisclaimerGroupComponent, PoPageContentComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoPageListComponent, [{
             type: Component,
@@ -42948,7 +42957,7 @@ PoSlideComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoSlideCom
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.hasSlides && ctx.slides.length > 1);
         }
-    }, directives: [i1.NgForOf, i1.NgIf, PoSlideItemComponent, PoSlideControlComponent, PoSlideCirclesComponent], encapsulation: 2 });
+    }, directives: [i1.NgForOf, PoSlideItemComponent, i1.NgIf, PoSlideControlComponent, PoSlideCirclesComponent], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoSlideComponent, [{
             type: Component,
@@ -43835,7 +43844,7 @@ PoStepperComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PoSteppe
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.usePoSteps);
         }
-    }, directives: [i1.NgForOf, i1.NgIf, PoStepperStepComponent], encapsulation: 2 });
+    }, directives: [i1.NgForOf, PoStepperStepComponent, i1.NgIf], encapsulation: 2 });
 (function () {
     (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PoStepperComponent, [{
             type: Component,