@po-ui/ng-components 21.7.0 → 21.8.0

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

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Directive, Input, Component, ChangeDetectionStrategy, NgModule, TemplateRef, ViewChild, HostBinding, Injectable, EventEmitter, Output, ElementRef, SecurityContext, HostListener, inject, ChangeDetectorRef, ViewChildren, ContentChildren, InjectionToken, ViewContainerRef, Optional, Inject, input, forwardRef, Renderer2, IterableDiffers, ContentChild, Pipe, Injector, provideAppInitializer, computed } from '@angular/core';
+import { Directive, Input, Component, ChangeDetectionStrategy, NgModule, TemplateRef, ViewChild, HostBinding, Injectable, EventEmitter, Output, ElementRef, SecurityContext, HostListener, inject, ChangeDetectorRef, ViewChildren, ContentChildren, InjectionToken, ViewContainerRef, Optional, Inject, input, forwardRef, Renderer2, IterableDiffers, ContentChild, model, output, signal, effect, Pipe, Injector, provideAppInitializer, computed } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, CurrencyPipe, DecimalPipe, DOCUMENT, TitleCasePipe, DatePipe, NgOptimizedImage, Location } from '@angular/common';
 import * as i2 from '@angular/platform-browser';
@@ -231,6 +231,8 @@ const AnimaliaIconDictionary = {
     ICON_REFRESH: 'an an-arrow-clockwise',
     ICON_SEARCH: 'an an-magnifying-glass',
     ICON_SETTINGS: 'an an-gear-six',
+    ICON_SIDEBAR: 'an an-sidebar',
+    ICON_SIDEBAR_SIMPLES: 'an an-sidebar-simple',
     ICON_SORT: 'an an-arrows-down-up',
     ICON_SORT_ASC: 'an an-arrow-up',
     ICON_SORT_ASCENDING: 'an an-sort-ascending',
@@ -5905,8 +5907,6 @@ class PoCheckboxBaseComponent {
      */
     appendBox = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6053,8 +6053,6 @@ class PoCheckboxBaseComponent {
         return this._size ?? getDefaultSizeFn(PoCheckboxSize);
     }
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6066,8 +6064,6 @@ class PoCheckboxBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6241,8 +6237,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
  */
 class PoHelperBaseComponent {
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6266,8 +6260,6 @@ class PoHelperBaseComponent {
     helper = input(undefined, { ...(ngDevMode ? { debugName: "helper" } : {}), alias: 'p-helper',
         transform: this.transformHelper.bind(this) });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6286,8 +6278,6 @@ class PoHelperBaseComponent {
         return validateSizeFn(this.size(), PoFieldSize);
     }
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6298,8 +6288,6 @@ class PoHelperBaseComponent {
      */
     disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), alias: 'p-disabled' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6476,8 +6464,6 @@ var PoButtonType;
  */
 class PoButtonBaseComponent {
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6486,8 +6472,6 @@ class PoButtonBaseComponent {
      */
     label = input(undefined, { ...(ngDevMode ? { debugName: "label" } : {}), alias: 'p-label' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6514,8 +6498,6 @@ class PoButtonBaseComponent {
      */
     icon = input(undefined, { ...(ngDevMode ? { debugName: "icon" } : {}), alias: 'p-icon' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6601,8 +6583,6 @@ class PoButtonBaseComponent {
         return this._disabled;
     }
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -6979,8 +6959,6 @@ class PoPopoverBaseComponent {
         return this._trigger;
     }
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -7084,6 +7062,11 @@ class PoPopoverComponent extends PoPopoverBaseComponent {
         this.poControlPosition = poControlPosition;
         this.cd = cd;
     }
+    onThemeChange() {
+        requestAnimationFrame(() => {
+            this.setPopoverPosition();
+        });
+    }
     ngOnChanges(changes) {
         if (changes['appendBox']) {
             this.cd.detectChanges();
@@ -7362,7 +7345,7 @@ class PoPopoverComponent extends PoPopoverBaseComponent {
         this.resizeObserver = null;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoPopoverComponent, deps: [{ token: i0.Renderer2 }, { token: PoControlPositionService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoPopoverComponent, isStandalone: false, selector: "po-popover", providers: [PoControlPositionService], viewQueries: [{ propertyName: "popoverElement", first: true, predicate: ["popoverElement"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (appendBox) {\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"target\"\n    [cdkConnectedOverlayOpen]=\"true\"\n    [cdkConnectedOverlayDisableClose]=\"true\"\n  >\n    <ng-container *ngTemplateOutlet=\"sharedPopoverContent\"></ng-container>\n  </ng-template>\n} @else {\n  <ng-container *ngTemplateOutlet=\"sharedPopoverContent\"></ng-container>\n}\n\n<ng-template #sharedPopoverContent>\n  <div\n    #popoverElement\n    [hidden]=\"isHidden\"\n    class=\"po-popover\"\n    [style.width.px]=\"width ?? widthPopover\"\n    [ngClass]=\"customClasses()\"\n  >\n    @if (!hideArrow) {\n      <div class=\"po-popover-arrow po-arrow-{{ arrowDirection }}\"></div>\n    }\n\n    <div class=\"po-popover-content\">\n      @if (title) {\n        <span class=\"po-popover-title\">{{ title }}</span>\n      }\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoPopoverComponent, isStandalone: false, selector: "po-popover", host: { listeners: { "window:PoUiThemeChange": "onThemeChange()" } }, providers: [PoControlPositionService], viewQueries: [{ propertyName: "popoverElement", first: true, predicate: ["popoverElement"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (appendBox) {\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"target\"\n    [cdkConnectedOverlayOpen]=\"true\"\n    [cdkConnectedOverlayDisableClose]=\"true\"\n  >\n    <ng-container *ngTemplateOutlet=\"sharedPopoverContent\"></ng-container>\n  </ng-template>\n} @else {\n  <ng-container *ngTemplateOutlet=\"sharedPopoverContent\"></ng-container>\n}\n\n<ng-template #sharedPopoverContent>\n  <div\n    #popoverElement\n    [hidden]=\"isHidden\"\n    class=\"po-popover\"\n    [style.width.px]=\"width ?? widthPopover\"\n    [ngClass]=\"customClasses()\"\n  >\n    @if (!hideArrow) {\n      <div class=\"po-popover-arrow po-arrow-{{ arrowDirection }}\"></div>\n    }\n\n    <div class=\"po-popover-content\">\n      @if (title) {\n        <span class=\"po-popover-title\">{{ title }}</span>\n      }\n      <ng-content></ng-content>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoPopoverComponent, decorators: [{
             type: Component,
@@ -7370,6 +7353,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: PoControlPositionService }, { type: i0.ChangeDetectorRef }], propDecorators: { popoverElement: [{
                 type: ViewChild,
                 args: ['popoverElement', { read: ElementRef, static: false }]
+            }], onThemeChange: [{
+                type: HostListener,
+                args: ['window:PoUiThemeChange']
             }] } });
 
 /**
@@ -7885,8 +7871,6 @@ class PoFieldContainerComponent {
     /** Define o tamanho do componente. */
     size;
     /**
-     * @Input
-     *
      * Define se o título do campo será exibido de forma compacta.
      *
      * Quando habilitado (`true`), o modo compacto afeta o conjunto composto por:
@@ -9427,8 +9411,6 @@ const PO_TOGGLE_TYPE_DEFAULT = 'none';
  */
 class PoButtonGroupBaseComponent {
     /**
-     * @Input
-     *
      * @description
      *
      * Lista de botões.
@@ -9897,8 +9879,6 @@ class PoComboBaseComponent {
      */
     autoFocus = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -10178,8 +10158,6 @@ class PoComboBaseComponent {
      */
     listboxControlPosition = poMultiselectContainerPositionDefault$1;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -10191,8 +10169,6 @@ class PoComboBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -16360,6 +16336,264 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
                 }]
         }] });
 
+/**
+ * @description
+ *
+ * O componente `po-context-menu` é uma barra lateral de contexto (sidebar) para navegação interna entre contextos.
+ * Inspirado visualmente no `po-menu`, porém independente e focado em navegação contextual.
+ *
+ * No caso de uso do componente `po-page-default` em conjunto, ambos devem estar no mesmo nível
+ * e inseridos em uma div com a classe **po-context-menu-wrapper**.
+ * Esta classe é responsável por fazer os cálculos necessários para o alinhamento dos componentes.
+ *
+ * O uso simultâneo dos componentes `po-menu` e `po-context-menu` não é recomendado.
+ * Porém, se os mesmos forem necessários na mesma interface, certifique-se de que não permaneçam expandidos
+ * simultaneamente para não comprometer a usabilidade.
+ *
+ * #### Tokens customizáveis
+ *
+ * É possível alterar o estilo do componente usando os seguintes tokens (CSS):
+ *
+ * > Para maiores informações, acesse o guia [Personalizando o Tema Padrão com Tokens CSS](https://po-ui.io/guides/theme-customization).
+ *
+ * | Propriedade                            | Descrição                                                    | Valor Padrão                                    |
+ * |----------------------------------------|--------------------------------------------------------------|-------------------------------------------------|
+ * | **Default Values**                     |                                                              |                                                 |
+ * | `--font-family`                        | Família tipográfica usada                                    | `var(--font-family-theme)`                      |
+ * | `--font-size`                          | Tamanho da fonte dos itens                                   | `var(--font-size-default)`                      |
+ * | `--font-size-context-title`            | Tamanho da fonte do título de contexto                       | `var(--font-size-sm)`                           |
+ * | `--font-size-title`                    | Tamanho da fonte do título principal                         | `var(--font-size-lg)`                           |
+ * | `--line-height`                        | Altura da linha                                              | `var(--line-height-md)`                         |
+ * | `--border-radius`                      | Raio dos cantos dos itens                                    | `var(--border-radius-md)`                       |
+ * | `--border-color`                       | Cor da borda lateral direita do componente                   | `var(--color-neutral-light-20)`                 |
+ * | `--background-color`                   | Cor de fundo do componente                                   | `var(--color-neutral-light-05)`                 |
+ * | `--color`                              | Cor do texto dos itens                                       | `var(--color-action-default)`                   |
+ * | `--color-context-title`                | Cor do texto do título de contexto                           | `var(--color-neutral-mid-40)`                   |
+ * | `--color-title`                        | Cor do texto do título principal                             | `var(--color-neutral-dark-80)`                  |
+ * | `--font-weight`                        | Peso da fonte dos itens                                      | `var(--font-weight-bold)`                       |
+ * | `--font-weight-title`                  | Peso da fonte do título principal                            | `var(--font-weight-bold)`                       |
+ * | `--outline-color-focused`              | Cor do outline no estado de focus                            | `var(--color-action-focus)`                     |
+ * | **Hover**                              |                                                              |                                                 |
+ * | `--color-hover`                        | Cor do texto no estado hover                                 | `var(--color-brand-01-darkest)`                 |
+ * | `--background-color-hover`             | Cor de fundo no estado hover                                 | `var(--color-brand-01-lighter)`                 |
+ * | **Pressed**                            |                                                              |                                                 |
+ * | `--background-color-pressed`           | Cor de fundo no estado pressed                               | `var(--color-brand-01-light)`                   |
+ * | **Active (Selected)**                  |                                                              |                                                 |
+ * | `--background-color-actived`           | Cor de fundo do item selecionado                             | `var(--color-brand-01-lightest)`                |
+ * | `--color-actived`                      | Cor do texto do item selecionado                             | `var(--color-action-pressed)`                   |
+ *
+ */
+class PoContextMenuBaseComponent {
+    /**
+     * Título do contexto superior
+     */
+    contextTitle = input('', { ...(ngDevMode ? { debugName: "contextTitle" } : {}), alias: 'p-context-title' });
+    /**
+     * Título principal do menu
+     */
+    title = input('', { ...(ngDevMode ? { debugName: "title" } : {}), alias: 'p-title' });
+    /**
+     * Lista de itens para renderização.
+     *
+     * > Ao receber os itens, o componente valida que apenas um item pode ter `selected: true`.
+     * > Se mais de um item estiver com `selected: true`, apenas o primeiro será mantido como selecionado.
+     */
+    items = input([], { ...(ngDevMode ? { debugName: "items" } : {}), alias: 'p-items' });
+    /**
+     * Define se o menu está aberto ou fechado.
+     *
+     * Suporta two-way binding:
+     *
+     * ```html
+     * <po-context-menu
+     *   [(p-expanded)]="expanded"
+     * />
+     * ```
+     *
+     * ou
+     *
+     * ```html
+     * <po-context-menu
+     *   [(p-expanded)]="expanded"
+     *   (p-expandedChange)="handlerExpanded($event)"
+     * />
+     * ```
+     *
+     * @default `true`
+     */
+    expanded = model(true, { ...(ngDevMode ? { debugName: "expanded" } : {}), alias: 'p-expanded' });
+    /**
+     * Evento emitido ao selecionar um item. Emite o item selecionado.
+     */
+    itemSelected = output({ alias: 'p-item-selected' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoContextMenuBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.9", type: PoContextMenuBaseComponent, isStandalone: true, inputs: { contextTitle: { classPropertyName: "contextTitle", publicName: "p-context-title", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "p-title", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "p-items", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "p-expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "p-expandedChange", itemSelected: "p-item-selected" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoContextMenuBaseComponent, decorators: [{
+            type: Directive
+        }], propDecorators: { contextTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "p-context-title", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "p-title", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "p-items", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "p-expanded", required: false }] }, { type: i0.Output, args: ["p-expandedChange"] }], itemSelected: [{ type: i0.Output, args: ["p-item-selected"] }] } });
+
+const poContextMenuLiteralsDefault = {
+    en: {
+        close: 'Close menu',
+        open: 'Open menu'
+    },
+    es: {
+        close: 'Cerrar menú',
+        open: 'Abrir menú'
+    },
+    pt: {
+        close: 'Fechar menu',
+        open: 'Abrir menu'
+    },
+    ru: {
+        close: 'Закрыть меню',
+        open: 'Открыть меню'
+    }
+};
+/**
+ * @docsExtends PoContextMenuBaseComponent
+ *
+ * @example
+ *
+ * <example name="po-context-menu-basic" title="PO Context Menu Basic">
+ *  <file name="sample-po-context-menu-basic/sample-po-context-menu-basic.component.html"> </file>
+ *  <file name="sample-po-context-menu-basic/sample-po-context-menu-basic.component.ts"> </file>
+ * </example>
+ *
+ * <example name="po-context-menu-labs" title="PO Context Menu Labs">
+ *  <file name="sample-po-context-menu-labs/sample-po-context-menu-labs.component.html"> </file>
+ *  <file name="sample-po-context-menu-labs/sample-po-context-menu-labs.component.ts"> </file>
+ * </example>
+ *
+ * <example name="po-context-menu-user" title="PO Context - Cadastro de Usuário">
+ *  <file name="sample-po-context-menu-user/sample-po-context-menu-user.component.html"> </file>
+ *  <file name="sample-po-context-menu-user/sample-po-context-menu-user.component.ts"> </file>
+ *  <file name="sample-po-context-menu-user/sample-po-context-menu-user.component.css"> </file>
+ * </example>
+ */
+class PoContextMenuComponent extends PoContextMenuBaseComponent {
+    languageService = inject(PoLanguageService);
+    literals;
+    _items = signal([], ...(ngDevMode ? [{ debugName: "_items" }] : []));
+    _titleTooltipCalculated = false;
+    _contextTitleTooltipCalculated = false;
+    titleTooltip = signal(null, ...(ngDevMode ? [{ debugName: "titleTooltip" }] : []));
+    contextTitleTooltip = signal(null, ...(ngDevMode ? [{ debugName: "contextTitleTooltip" }] : []));
+    constructor() {
+        super();
+        this.setLiterals();
+        effect(() => {
+            const currentItems = this.items();
+            if (this.hasMultipleSelected(currentItems)) {
+                this._items.set(this.sanitizeSelection(currentItems));
+            }
+            else {
+                this._items.set(currentItems);
+            }
+            if (this.title() !== this.titleTooltip()) {
+                this.titleTooltip.set(null);
+                this._titleTooltipCalculated = false;
+            }
+            if (this.contextTitle() !== this.contextTitleTooltip()) {
+                this.contextTitleTooltip.set(null);
+                this._contextTitleTooltipCalculated = false;
+            }
+        });
+    }
+    toggleExpand() {
+        this.expanded.update(v => !v);
+    }
+    selectItem(item) {
+        let selectedItem;
+        const updatedItems = this._items().map(i => {
+            const updated = { ...i, selected: i === item };
+            if (updated.selected) {
+                selectedItem = updated;
+            }
+            return updated;
+        });
+        this._items.set(updatedItems);
+        this.itemSelected.emit(selectedItem);
+        if (item.action) {
+            item.action(selectedItem);
+        }
+    }
+    handlerItemTooltip(item, value) {
+        if (item.tooltip) {
+            return;
+        }
+        const label = value.firstElementChild;
+        if (label.scrollHeight > label.offsetHeight) {
+            this._items.update(items => items.map(i => (i === item ? { ...i, tooltip: item.label } : i)));
+        }
+    }
+    handlerTitleTooltip(value) {
+        if (this._titleTooltipCalculated) {
+            return;
+        }
+        this.applyTooltipIfOverflows(value, this.title(), this.titleTooltip);
+        this._titleTooltipCalculated = true;
+    }
+    handlerContextTitleTooltip(value) {
+        if (this._contextTitleTooltipCalculated) {
+            return;
+        }
+        this.applyTooltipIfOverflows(value, this.contextTitle(), this.contextTitleTooltip);
+        this._contextTitleTooltipCalculated = true;
+    }
+    setLiterals() {
+        this.literals = {
+            ...poContextMenuLiteralsDefault[this.languageService?.getLanguageDefault()],
+            ...poContextMenuLiteralsDefault[this.languageService?.getShortLanguage()]
+        };
+    }
+    hasMultipleSelected(items) {
+        let count = 0;
+        for (const item of items) {
+            if (item.selected && ++count > 1) {
+                return true;
+            }
+        }
+        return false;
+    }
+    sanitizeSelection(items) {
+        const firstIndex = items.findIndex(i => i.selected);
+        return items.map((item, index) => (item.selected && index !== firstIndex ? { ...item, selected: false } : item));
+    }
+    applyTooltipIfOverflows(element, textValue, storageSignal) {
+        const hasOverflow = element.scrollHeight > element.offsetHeight;
+        if (hasOverflow) {
+            storageSignal.set(textValue);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoContextMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoContextMenuComponent, isStandalone: false, selector: "po-context-menu", usesInheritance: true, ngImport: i0, template: "<div class=\"po-context-menu\" [class.po-context-menu-collapsed]=\"!expanded()\">\n  <div class=\"po-context-menu-header\">\n    <button\n      class=\"po-context-menu-toggle\"\n      type=\"button\"\n      [attr.aria-label]=\"expanded() ? literals.close : literals.open\"\n      (click)=\"toggleExpand()\"\n    >\n      <po-icon [p-icon]=\"expanded() ? 'ICON_SIDEBAR' : 'ICON_SIDEBAR_SIMPLES'\" />\n    </button>\n\n    @if (expanded()) {\n      <div class=\"po-context-menu-header-content\">\n        @if (contextTitle()) {\n          <span\n            #contextTitleRef\n            class=\"po-context-menu-context-title\"\n            (mouseenter)=\"handlerContextTitleTooltip(contextTitleRef)\"\n            p-tooltip-position=\"right\"\n            [p-tooltip]=\"contextTitleTooltip()\"\n          >\n            {{ contextTitle() }}\n          </span>\n        }\n        @if (title()) {\n          <span\n            #titleRef\n            class=\"po-context-menu-title\"\n            (mouseenter)=\"handlerTitleTooltip(titleRef)\"\n            p-tooltip-position=\"right\"\n            [p-tooltip]=\"titleTooltip()\"\n          >\n            {{ title() }}\n          </span>\n        }\n      </div>\n    }\n  </div>\n\n  @if (expanded()) {\n    <nav class=\"po-context-menu-body\">\n      <ul class=\"po-context-menu-list\" role=\"menu\">\n        @for (item of _items(); track $index) {\n          <li\n            #itemRef\n            class=\"po-context-menu-list-item\"\n            role=\"menuitem\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"item.label\"\n            [class.po-context-menu-item-selected]=\"item.selected\"\n            (click)=\"selectItem(item)\"\n            (keydown.enter)=\"selectItem(item)\"\n            (keydown.space)=\"selectItem(item)\"\n            (mouseenter)=\"handlerItemTooltip(item, itemRef)\"\n            p-tooltip-position=\"right\"\n            [p-tooltip]=\"item.tooltip\"\n          >\n            <span class=\"po-context-menu-item-label\">{{ item.label }}</span>\n          </li>\n        }\n      </ul>\n    </nav>\n  }\n</div>\n", dependencies: [{ kind: "component", type: PoIconComponent, selector: "po-icon", inputs: ["p-icon"] }, { kind: "directive", type: PoTooltipDirective, selector: "[p-tooltip]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoContextMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'po-context-menu', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div class=\"po-context-menu\" [class.po-context-menu-collapsed]=\"!expanded()\">\n  <div class=\"po-context-menu-header\">\n    <button\n      class=\"po-context-menu-toggle\"\n      type=\"button\"\n      [attr.aria-label]=\"expanded() ? literals.close : literals.open\"\n      (click)=\"toggleExpand()\"\n    >\n      <po-icon [p-icon]=\"expanded() ? 'ICON_SIDEBAR' : 'ICON_SIDEBAR_SIMPLES'\" />\n    </button>\n\n    @if (expanded()) {\n      <div class=\"po-context-menu-header-content\">\n        @if (contextTitle()) {\n          <span\n            #contextTitleRef\n            class=\"po-context-menu-context-title\"\n            (mouseenter)=\"handlerContextTitleTooltip(contextTitleRef)\"\n            p-tooltip-position=\"right\"\n            [p-tooltip]=\"contextTitleTooltip()\"\n          >\n            {{ contextTitle() }}\n          </span>\n        }\n        @if (title()) {\n          <span\n            #titleRef\n            class=\"po-context-menu-title\"\n            (mouseenter)=\"handlerTitleTooltip(titleRef)\"\n            p-tooltip-position=\"right\"\n            [p-tooltip]=\"titleTooltip()\"\n          >\n            {{ title() }}\n          </span>\n        }\n      </div>\n    }\n  </div>\n\n  @if (expanded()) {\n    <nav class=\"po-context-menu-body\">\n      <ul class=\"po-context-menu-list\" role=\"menu\">\n        @for (item of _items(); track $index) {\n          <li\n            #itemRef\n            class=\"po-context-menu-list-item\"\n            role=\"menuitem\"\n            tabindex=\"0\"\n            [attr.aria-label]=\"item.label\"\n            [class.po-context-menu-item-selected]=\"item.selected\"\n            (click)=\"selectItem(item)\"\n            (keydown.enter)=\"selectItem(item)\"\n            (keydown.space)=\"selectItem(item)\"\n            (mouseenter)=\"handlerItemTooltip(item, itemRef)\"\n            p-tooltip-position=\"right\"\n            [p-tooltip]=\"item.tooltip\"\n          >\n            <span class=\"po-context-menu-item-label\">{{ item.label }}</span>\n          </li>\n        }\n      </ul>\n    </nav>\n  }\n</div>\n" }]
+        }], ctorParameters: () => [] });
+
+/**
+ * @description
+ *
+ * Módulo do componente po-context-menu.
+ */
+class PoContextMenuModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoContextMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.9", ngImport: i0, type: PoContextMenuModule, declarations: [PoContextMenuComponent], imports: [CommonModule, PoIconModule, PoTooltipModule], exports: [PoContextMenuComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoContextMenuModule, imports: [CommonModule, PoIconModule, PoTooltipModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoContextMenuModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, PoIconModule, PoTooltipModule],
+                    declarations: [PoContextMenuComponent],
+                    exports: [PoContextMenuComponent]
+                }]
+        }] });
+
 const PoDisclaimerLiterals = {
     en: {
         remove: 'Remove'
@@ -17291,8 +17525,6 @@ class PoCheckboxGroupBaseComponent {
      */
     autoFocus = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -17374,8 +17606,6 @@ class PoCheckboxGroupBaseComponent {
      */
     errorLimit = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -17387,8 +17617,6 @@ class PoCheckboxGroupBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -18077,8 +18305,6 @@ class PoRadioGroupBaseComponent {
      */
     autoFocus = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -18156,8 +18382,6 @@ class PoRadioGroupBaseComponent {
      */
     errorLimit = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -18169,8 +18393,6 @@ class PoRadioGroupBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -19656,8 +19878,6 @@ class PoDatepickerBaseComponent {
      */
     autoFocus = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -19791,8 +20011,6 @@ class PoDatepickerBaseComponent {
      */
     keydown = new EventEmitter();
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -19804,8 +20022,6 @@ class PoDatepickerBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -25273,9 +25489,6 @@ class PoSwitchComponent extends PoFieldModel {
     _initialSize = undefined;
     statusChangesSubscription;
     /**
-     *
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -25453,8 +25666,6 @@ class PoSwitchComponent extends PoFieldModel {
         return this._size ?? getDefaultSizeFn(PoFieldSize);
     }
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -25466,8 +25677,6 @@ class PoSwitchComponent extends PoFieldModel {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -30875,8 +31084,6 @@ class PoDatepickerRangeBaseComponent {
      */
     autoFocus = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -31004,8 +31211,6 @@ class PoDatepickerRangeBaseComponent {
      */
     errorLimit = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -31017,8 +31222,6 @@ class PoDatepickerRangeBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -32367,8 +32570,6 @@ class PoInputBaseComponent {
      */
     autoFocus = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -32820,8 +33021,6 @@ class PoInputBaseComponent {
         }
     }
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -32833,8 +33032,6 @@ class PoInputBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -36327,8 +36524,6 @@ class PoLookupBaseComponent {
      */
     virtualScroll = true;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -36340,8 +36535,6 @@ class PoLookupBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -36354,8 +36547,6 @@ class PoLookupBaseComponent {
      */
     labelTextWrap = input(false, { ...(ngDevMode ? { debugName: "labelTextWrap" } : {}), alias: 'p-label-text-wrap' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -37631,8 +37822,6 @@ class PoMultiselectBaseComponent {
      */
     autoFocus = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -37805,8 +37994,6 @@ class PoMultiselectBaseComponent {
      */
     listboxControlPosition = poMultiselectContainerPositionDefault;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -37818,8 +38005,6 @@ class PoMultiselectBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -40014,8 +40199,6 @@ class PoRichTextBaseComponent {
      */
     label;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -40097,8 +40280,6 @@ class PoRichTextBaseComponent {
         return this._hideToolbarActions;
     }
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -40110,8 +40291,6 @@ class PoRichTextBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -41333,8 +41512,6 @@ class PoUploadBaseComponent {
     /** Rótulo do campo. */
     label;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -41445,8 +41622,6 @@ class PoUploadBaseComponent {
      */
     requiredUrl = true;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -41458,8 +41633,6 @@ class PoUploadBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -44269,8 +44442,6 @@ class PoSelectComponent extends PoFieldValidateModel {
      */
     readonly = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -44469,8 +44640,6 @@ class PoSelectComponent extends PoFieldValidateModel {
         return this._size ?? getDefaultSizeFn(PoFieldSize);
     }
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -44482,8 +44651,6 @@ class PoSelectComponent extends PoFieldValidateModel {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -44868,8 +45035,6 @@ class PoTextareaBaseComponent {
      */
     autoFocus = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -44951,8 +45116,6 @@ class PoTextareaBaseComponent {
      */
     errorLimit = false;
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -44964,8 +45127,6 @@ class PoTextareaBaseComponent {
      */
     poHelperComponent = input(undefined, { ...(ngDevMode ? { debugName: "poHelperComponent" } : {}), alias: 'p-helper' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -50923,6 +51084,18 @@ class PoMenuBaseComponent {
      * @default `false`
      */
     automaticToggle = false;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Evento emitido toda vez que o estado do menu muda, enviando `true` quando expandido e `false` quando colapsado.
+     *
+     * ```html
+     * <po-menu (p-toggle)="onMenuToggle($event)"></po-menu>
+     * ```
+     */
+    toggleChange = output({ alias: 'p-toggle' });
     /**
      * @optional
      *
@@ -51261,14 +51434,14 @@ class PoMenuBaseComponent {
         this._componentsSize = size;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoMenuBaseComponent, deps: [{ token: PoMenuGlobalService }, { token: PoMenuService }, { token: PoLanguageService }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.0.9", type: PoMenuBaseComponent, isStandalone: true, inputs: { automaticToggle: ["p-automatic-toggle", "automaticToggle", convertToBoolean], collapsed: ["p-collapsed", "collapsed"], componentsSize: ["p-components-size", "componentsSize"], menus: ["p-menus", "menus"], filter: ["p-filter", "filter"], searchTreeItems: ["p-search-tree-items", "searchTreeItems"], service: ["p-service", "service"], params: ["p-params", "params"], logo: ["p-logo", "logo"], menuid: ["p-menu-id", "menuid"], logoAlt: ["p-logo-alt", "logoAlt"], shortLogo: ["p-short-logo", "shortLogo"], onlyMenuItem: ["p-only-menu-item", "onlyMenuItem"], logoLink: ["p-logo-link", "logoLink"] }, host: { listeners: { "window:PoUiThemeChange": "onThemeChange()" }, properties: { "attr.p-components-size": "this.componentsSize" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.0.9", type: PoMenuBaseComponent, isStandalone: true, inputs: { automaticToggle: ["p-automatic-toggle", "automaticToggle", convertToBoolean], collapsed: ["p-collapsed", "collapsed"], componentsSize: ["p-components-size", "componentsSize"], menus: ["p-menus", "menus"], filter: ["p-filter", "filter"], searchTreeItems: ["p-search-tree-items", "searchTreeItems"], service: ["p-service", "service"], params: ["p-params", "params"], logo: ["p-logo", "logo"], menuid: ["p-menu-id", "menuid"], logoAlt: ["p-logo-alt", "logoAlt"], shortLogo: ["p-short-logo", "shortLogo"], onlyMenuItem: ["p-only-menu-item", "onlyMenuItem"], logoLink: ["p-logo-link", "logoLink"] }, outputs: { toggleChange: "p-toggle" }, host: { listeners: { "window:PoUiThemeChange": "onThemeChange()" }, properties: { "attr.p-components-size": "this.componentsSize" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoMenuBaseComponent, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: PoMenuGlobalService }, { type: PoMenuService }, { type: PoLanguageService }], propDecorators: { automaticToggle: [{
                 type: Input,
                 args: [{ alias: 'p-automatic-toggle', transform: convertToBoolean }]
-            }], collapsed: [{
+            }], toggleChange: [{ type: i0.Output, args: ["p-toggle"] }], collapsed: [{
                 type: Input,
                 args: ['p-collapsed']
             }], componentsSize: [{
@@ -51559,13 +51732,13 @@ class PoMenuComponent extends PoMenuBaseComponent {
     }
     onMouseEnter() {
         if (this.collapsed && this.automaticToggle) {
-            this.collapsed = false;
+            this.setCollapsed(false);
             this.allowCollapseHover = true;
         }
     }
     onMouseLeave() {
         if (!this.collapsed && this.allowCollapseHover && this.automaticToggle) {
-            this.collapsed = true;
+            this.setCollapsed(true);
         }
     }
     checkingRouterChildrenFragments() {
@@ -51774,7 +51947,7 @@ class PoMenuComponent extends PoMenuBaseComponent {
         this.groupedMenuItem['isOpened'] = !this.collapsed && this.allowCollapseMenu;
     }
     toggleMenuCollapse(collapsed = false) {
-        this.collapsed = collapsed;
+        this.setCollapsed(collapsed);
         if (this.groupedMenuItem && this.activeMenuItem) {
             this.groupedMenuItem =
                 this.getActiveMenuParent(this.menus, this.activeMenuItem, this.groupedMenuItem) || this.groupedMenuItem;
@@ -51810,6 +51983,10 @@ class PoMenuComponent extends PoMenuBaseComponent {
         this.menuPrevious = this.stringify(this.menus);
         this.validateMenus(this.menus);
     }
+    setCollapsed(value) {
+        this.collapsed = value;
+        this.toggleChange.emit(!value);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoMenuComponent, isStandalone: false, selector: "po-menu", providers: [PoMenuItemsService, PoMenuService], queries: [{ propertyName: "menuHeaderTemplate", first: true, predicate: PoMenuHeaderTemplateDirective, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (onlyMenuItem) {\n  <ng-container *ngTemplateOutlet=\"menuItemsTemplate; context: { showFilter: true, showTemplate: true }\"></ng-container>\n} @else {\n  @if (mobileOpened) {\n    <div class=\"po-menu-overlay\" (click)=\"toggleMenuMobile()\"></div>\n  }\n  <div>\n    <div class=\"po-menu-mobile po-clickable\" (click)=\"toggleMenuMobile()\">\n      <po-icon p-icon=\"ICON_MENU\"></po-icon>\n    </div>\n    <div class=\"po-menu\" [attr.aria-expanded]=\"!collapsed\" [ngClass]=\"{ 'po-menu-animation': mobileOpened }\">\n      <div class=\"po-menu-container\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n        <div class=\"po-menu-header\">\n          @if (logo || (shortLogo && enableCollapse)) {\n            <div class=\"po-menu-header-container-logo\">\n              <po-logo\n                [p-class]=\"enableCollapse ? 'po-menu-short-logo' : 'po-menu-logo'\"\n                [p-logo]=\"enableCollapse ? shortLogo || logo : logo\"\n                [p-logo-alt]=\"logoAlt\"\n                [p-link]=\"logoLink\"\n              ></po-logo>\n            </div>\n          }\n          @if (!enableCollapse && menuHeaderTemplate) {\n            <div class=\"po-menu-header-template\">\n              <ng-container *ngTemplateOutlet=\"menuCustomTemplate\"></ng-container>\n            </div>\n          }\n          @if (filter) {\n            <ng-container *ngTemplateOutlet=\"menuFilterTemplate\"></ng-container>\n          }\n        </div>\n        <div class=\"po-menu-body\">\n          <div class=\"po-menu-outer\">\n            <div class=\"po-menu-inner\">\n              <nav class=\"po-menu-nav\">\n                <ng-container\n                  *ngTemplateOutlet=\"menuItemsTemplate; context: { showFilter: false, showTemplate: false }\"\n                ></ng-container>\n              </nav>\n            </div>\n          </div>\n        </div>\n      </div>\n      @if (hasFooter) {\n        <div class=\"po-menu-footer\">\n          <button\n            class=\"po-menu-collapse-button-icon\"\n            type=\"button\"\n            [attr.aria-label]=\"enableCollapseButton ? literals.close : literals.open\"\n            (click)=\"toggle()\"\n          >\n            @if (enableCollapseButton) {\n              <span aria-hidden=\"true\">{{ literals.close }}</span>\n            }\n            <po-icon [p-icon]=\"enableCollapse ? 'ICON_MENU_OPEN' : 'ICON_MENU_CLOSE'\"></po-icon>\n          </button>\n        </div>\n      }\n    </div>\n  </div>\n}\n\n<ng-template #menuCustomTemplate>\n  <ng-container *ngTemplateOutlet=\"menuHeaderTemplate.templateRef\"></ng-container>\n</ng-template>\n\n<ng-template #menuFilterTemplate>\n  <po-menu-filter\n    [p-enable-collapse]=\"enableCollapse\"\n    [p-loading]=\"filterLoading\"\n    [p-components-size]=\"componentsSize\"\n    (p-filter)=\"debounceFilter($event)\"\n  ></po-menu-filter>\n</ng-template>\n\n<ng-template #menuItemsTemplate let-showFilter=\"showFilter\" let-showTemplate=\"showTemplate\">\n  @if (menuHeaderTemplate && showTemplate) {\n    <ng-container *ngTemplateOutlet=\"menuCustomTemplate\"></ng-container>\n  }\n\n  @if (filter && showFilter) {\n    <ng-container *ngTemplateOutlet=\"menuFilterTemplate\"></ng-container>\n  }\n\n  <ul class=\"po-menu-list\" role=\"menu\">\n    @if (noData) {\n      <li class=\"po-menu-list-item\" role=\"presentation\">\n        <po-menu-item\n          p-icon=\"ICON_INFO\"\n          p-type=\"noData\"\n          [p-level]=\"1\"\n          [p-label]=\"literals.itemNotFound\"\n          [p-short-label]=\"literals.itemNotFound\"\n        ></po-menu-item>\n      </li>\n    }\n    @for (menu of filteredItems; track menu; let menuIndex = $index) {\n      <li\n        class=\"po-menu-list-item\"\n        role=\"presentation\"\n        [attr.aria-level]=\"menu.level\"\n        [class.po-menu-item-first]=\"menuIndex === 0\"\n      >\n        <po-menu-item\n          [p-action]=\"menu.action\"\n          [p-badge-alert]=\"menu.badgeAlert\"\n          [p-badge-color]=\"menu.badge?.color\"\n          [p-badge-value]=\"menu.badge?.value\"\n          [p-collapsed-menu]=\"enableCollapse\"\n          [p-icon]=\"allowIcons ? menu.icon : null\"\n          [p-id]=\"menu.id\"\n          [p-label]=\"menu.label\"\n          [p-level]=\"menu.level\"\n          [p-link]=\"menu.link\"\n          [p-short-label]=\"menu.shortLabel\"\n          [p-sub-items]=\"menu.subItems\"\n          [p-type]=\"menu.type\"\n        ></po-menu-item>\n      </li>\n    }\n  </ul>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PoLogoComponent, selector: "po-logo", inputs: ["p-class", "p-link", "p-logo", "p-logo-alt"] }, { kind: "component", type: PoIconComponent, selector: "po-icon", inputs: ["p-icon"] }, { kind: "component", type: PoMenuFilterComponent, selector: "po-menu-filter", inputs: ["p-components-size", "p-loading", "p-enable-collapse"], outputs: ["p-filter"] }, { kind: "component", type: PoMenuItemComponent, selector: "po-menu-item", inputs: ["p-action", "p-badge-alert", "p-badge-color", "p-collapsed-menu", "p-icon", "p-id", "p-is-opened", "p-label", "p-level", "p-link", "p-short-label", "p-type", "p-badge-value", "p-is-selected", "p-is-sub-item", "p-sub-items"] }] });
 }
@@ -54253,9 +54430,6 @@ var PoSkeletonVariant;
  */
 class PoSkeletonBaseComponent {
     /**
-     *
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -54272,9 +54446,6 @@ class PoSkeletonBaseComponent {
      */
     variant = input(PoSkeletonVariant.text, { ...(ngDevMode ? { debugName: "variant" } : {}), alias: 'p-variant' });
     /**
-     *
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -54290,9 +54461,6 @@ class PoSkeletonBaseComponent {
      */
     type = input(PoSkeletonType.normal, { ...(ngDevMode ? { debugName: "type" } : {}), alias: 'p-type' });
     /**
-     *
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -54308,9 +54476,6 @@ class PoSkeletonBaseComponent {
      */
     animation = input(PoSkeletonAnimation.shimmer, { ...(ngDevMode ? { debugName: "animation" } : {}), alias: 'p-animation' });
     /**
-     *
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -54331,9 +54496,6 @@ class PoSkeletonBaseComponent {
      */
     size = input(PoSkeletonSize.md, { ...(ngDevMode ? { debugName: "size" } : {}), alias: 'p-size' });
     /**
-     *
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -54347,8 +54509,6 @@ class PoSkeletonBaseComponent {
      */
     width = input('', { ...(ngDevMode ? { debugName: "width" } : {}), alias: 'p-width' });
     /**
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -54360,9 +54520,6 @@ class PoSkeletonBaseComponent {
      */
     height = input('', { ...(ngDevMode ? { debugName: "height" } : {}), alias: 'p-height' });
     /**
-     *
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -54374,9 +54531,6 @@ class PoSkeletonBaseComponent {
      */
     borderRadius = input('', { ...(ngDevMode ? { debugName: "borderRadius" } : {}), alias: 'p-border-radius' });
     /**
-     *
-     * @Input
-     *
      * @optional
      *
      * @description
@@ -56383,6 +56537,8 @@ class PoTabBaseComponent {
      * @default `false`
      */
     hideClose = false;
+    /** ID da Tab */
+    id = uuid();
     /** Método disparado ao clicar na aba. */
     click = new EventEmitter();
     /**
@@ -56396,8 +56552,15 @@ class PoTabBaseComponent {
      *
      */
     closeTab = new EventEmitter();
-    // ID da aba
-    id = uuid();
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Evento emitido quando a aba é ativada.
+     * Emite a instância do componente da aba que foi ativada.
+     */
+    activatedTab = output({ alias: 'p-activated-tab' });
     _active = false;
     _disabled = false;
     _hide = false;
@@ -56453,7 +56616,7 @@ class PoTabBaseComponent {
         return this._hide;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoTabBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.0.9", type: PoTabBaseComponent, isStandalone: true, inputs: { label: ["p-label", "label"], hideClose: ["p-hide-close", "hideClose", convertToBoolean], active: ["p-active", "active"], disabled: ["p-disabled", "disabled"], hide: ["p-hide", "hide"] }, outputs: { click: "p-click", closeTab: "p-close-tab" }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.0.9", type: PoTabBaseComponent, isStandalone: true, inputs: { label: ["p-label", "label"], hideClose: ["p-hide-close", "hideClose", convertToBoolean], id: "id", active: ["p-active", "active"], disabled: ["p-disabled", "disabled"], hide: ["p-hide", "hide"] }, outputs: { click: "p-click", closeTab: "p-close-tab", activatedTab: "p-activated-tab" }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoTabBaseComponent, decorators: [{
             type: Directive
@@ -56463,13 +56626,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
             }], hideClose: [{
                 type: Input,
                 args: [{ alias: 'p-hide-close', transform: convertToBoolean }]
+            }], id: [{
+                type: Input,
+                args: ['id']
             }], click: [{
                 type: Output,
                 args: ['p-click']
             }], closeTab: [{
                 type: Output,
                 args: ['p-close-tab']
-            }], active: [{
+            }], activatedTab: [{ type: i0.Output, args: ["p-activated-tab"] }], active: [{
                 type: Input,
                 args: ['p-active']
             }], disabled: [{
@@ -56987,6 +57153,7 @@ class PoTabsComponent extends PoTabsBaseComponent {
     // Função disparada quando alguma tab ficar ativa
     onTabActive(tab) {
         this.previousActiveTab = this.tabsChildren.find(tabChild => tabChild.active && tabChild.id !== tab.id);
+        tab.activatedTab.emit(tab);
         this.deactivateTab();
     }
     // funcao será disparada quando mudar o estado do poTab para desabilitado ou escondido.
@@ -57243,6 +57410,31 @@ class PoTabsComponent extends PoTabsBaseComponent {
             this.setTabIndex(tabRemoveElements[0], 0);
         }
     }
+    /**
+     * Ativa a aba correspondente ao `id` informado.
+     *
+     * Para utilizá-la é necessário ter a instância do componente no DOM, podendo ser utilizado o ViewChild da seguinte forma:
+     *
+     * ```
+     * import { PoTabsComponent } from '@po-ui/ng-components';
+     *
+     * ...
+     *
+     * @ViewChild('poTab', { static: true }) poTab: PoTabsComponent;
+     *
+     * focusOnTab() {
+     *   this.poTab.activateTab('meu-id-da-aba');
+     * }
+     * ```
+     *
+     * @param id Identificador único da aba a ser ativada.
+     */
+    activateTab(id) {
+        const tab = this.tabsChildrenArray.find(x => x.id === id);
+        if (tab) {
+            this.selectedTab(tab);
+        }
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoTabsComponent, isStandalone: false, selector: "po-tabs", queries: [{ propertyName: "tabsChildren", predicate: PoTabComponent }], viewQueries: [{ propertyName: "tabDropdown", first: true, predicate: ["tabDropdown"], descendants: true, static: true }, { propertyName: "containerTabs", first: true, predicate: ["containerTabs"], descendants: true, read: ElementRef, static: true }, { propertyName: "tabButton", predicate: ["tabButton"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<div class=\"po-tabs-container\">\n  <div #containerTabs class=\"po-tabs-header\">\n    <div class=\"po-tabs-button-wrapper\" role=\"tablist\">\n      @for (tab of tabs; track trackByFn($index, tab)) {\n        <po-tab-button\n          #tabButton\n          class=\"po-tab-button\"\n          [p-active]=\"tab.active\"\n          [p-disabled]=\"tab.disabled\"\n          [p-hide]=\"tab.hide\"\n          [p-id]=\"tab.id\"\n          [hidden]=\"tab.hide\"\n          [attr.disabled]=\"tab.disabled\"\n          [p-label]=\"tab.label\"\n          [id]=\"tab.id\"\n          (keyup.enter)=\"closeListbox()\"\n          (p-activated)=\"onTabActive(tab)\"\n          (p-change-state)=\"onTabChangeState(tab)\"\n          (p-click)=\"selectedTab(tab)\"\n        >\n        </po-tab-button>\n      }\n\n      @if (isShowTabDropdown) {\n        <po-tab-dropdown\n          #tabDropdown\n          class=\"po-tab-dropdown\"\n          [class.po-tab-dropdown-device]=\"!tabsDefault?.length\"\n          [p-label]=\"literals.moreTabs\"\n          [p-size]=\"size\"\n          [p-tabs]=\"overflowedTabs\"\n          (p-change-state)=\"onTabChangeState($event)\"\n          (p-click)=\"onTabActiveByDropdown($event)\"\n        >\n        </po-tab-dropdown>\n      }\n    </div>\n  </div>\n</div>\n<div class=\"po-tabs-content\">\n  <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "component", type: PoTabButtonComponent, selector: "po-tab-button", inputs: ["p-disabled", "p-id", "p-label", "p-active", "p-hide"], outputs: ["p-activated", "p-change-state", "p-click"] }, { kind: "component", type: PoTabDropdownComponent, selector: "po-tab-dropdown", inputs: ["p-label", "p-tabs", "p-size"], outputs: ["p-activated", "p-change-state", "p-click"] }] });
 }
@@ -58674,8 +58866,6 @@ class PoWidgetBaseComponent {
      */
     tagIcon;
     /**
-     * @Input p-tag-position
-     *
      * @optional
      *
      * @description
@@ -58718,8 +58908,6 @@ class PoWidgetBaseComponent {
         return this._size ?? getDefaultSizeFn(PoFieldSize);
     }
     /**
-     * @Input p-avatar
-     *
      * @optional
      *
      * @description
@@ -59401,24 +59589,27 @@ const poNavbarLiteralsDefault = {
  * | `--border-radius-bottom-left`            | Valor do radius do lado esquerdo do header                 | `var(--border-radius-md)`                         |
  * | `--border-radius-bottom-right`           | Valor do radius do lado direito do header                  | `var(--border-radius-md)`                         |
  * | `--base shadow`                          | Cor da sombra do header                                    | `0 1px 8px rgba(0, 0, 0, 0.1)`                  |
+ * | `--stroke-color`                         | Cor da borda inferior do header                            | `var(--color-brand-01-base)`                      |
  * | **Sub-menu**                             |                                                            |                                                   |
  * | `--border-radius`                        | Valor do radius dos itens do sub-menu                      | `var(--border-radius-md);`                        |
  * | `--text-color-submenu`                   | Cor do texto dos itens do sub-menu                         | `var(--color-brand-01-base)`                      |
  * | `--icon-color`                           | Cor do ícone do sub-menu com itens                         | `var(--color-brand-01-base)`                      |
  * | `--border-color`                         | Cor da borda                                               | `var(--color-transparent)`                        |
  * | `--shadow`                               | Contém o valor da sombra do elemento                       | `var(--shadow-none)`                              |
+ * | `--font-family-submenu`                  | Fonte do texto dos itens de sub-menu                       | `var(--font-family-theme)`                        |
+ * | `--font-weight-submenu`                  | Peso da fonte do texto dos itens de sub-menu               | `var(--font-weight-bold)`                         |
  * | **Sub-menu - Hover**                     |                                                            |                                                   |
  * | `--background-hover`                     | Cor de background dos itens do sub-menu no estado hover    | `var(--color-brand-01-lighter)`                   |
  * | `--icon-color-hover`                     | Cor do ícone dos itens de sub-menu no estado hover         | `var(--color-brand-01-darkest)`                   |
- * | `--text-color-hover`                     | Cor do texo dos itens de sub-menu no estado hover          | `var(--color-brand-01-darkest)`                   |
+ * | `--text-color-hover`                     | Cor do texto dos itens de sub-menu no estado hover         | `var(--color-brand-01-darkest)`                   |
  * | **Sub-menu - pressed**                   |                                                            |                                                   |
  * | `--background-pressed`                   | Cor de background dos itens do sub-menu no estado pressed  | `var(--color-brand-01-light)`                     |
  * | `--icon-color-pressed`                   | Cor do ícone dos itens de sub-menu no estado pressed       | `var(--color-brand-01-darkest)`                   |
- * | `--text-color-pressed`                   | Cor do texo dos itens de sub-menu no estado pressed        | `var(--color-brand-01-darkest)`                   |
+ * | `--text-color-pressed`                   | Cor do texto dos itens de sub-menu no estado pressed       | `var(--color-brand-01-darkest)`                   |
  * | **Sub-menu - selected**                  |                                                            |                                                   |
  * | `--background-selected`                  | Cor de background dos itens do sub-menu no estado selected | `var(--color-brand-01-light)`                     |
  * | `--icon-color-selected`                  | Cor do ícone dos itens de sub-menu no estado selected      | `var(--color-neutral-dark-95)`                    |
- * | `--text-color-selected`                  | Cor do texo dos itens de sub-menu no estado selected       | `var(--color-brand-01-darkest)`                   |
+ * | `--text-color-selected`                  | Cor do texto dos itens de sub-menu no estado selected      | `var(--color-brand-01-darkest)`                   |
  * | **Customer**                             |                                                            |                                                   |
  * | `--background-color-customer`            | Cor do background da seção customer                        | `var(--color-neutral-light-00)`                   |
  * | `--border-color`                         | Cor da borda da seção customer                             | `var(--color-neutral-light-10)`                   |
@@ -59426,9 +59617,9 @@ const poNavbarLiteralsDefault = {
  * | `--border-width`                         | Largura da borda da seção customer                         | `var(--border-width-sm)`                          |
  * | **Customer - hover**                     |                                                            |                                                   |
  * | `--background-color-customer-hover`      | Cor do background da seção customer no estado hover        | `var(--color-brand-01-lighter)`                   |
- * | `--background-color-customer-hover`      | Cor do background da seção customer no estado hover        | `var(--color-brand-01-lighter)`                   |
  * | **Customer - pressed**                   |                                                            |                                                   |
  * | `--background-color-customer-pressed`    | Cor do background da seção customer no estado pressed      | `var(--color-brand-01-light)`                     |
+ * | `--border-width-pressed`                 | Largura da borda da seção customer no estado pressed       | `var(--border-width-md)`                          |
  *
  */
 class PoHeaderBaseComponent {
@@ -59438,6 +59629,7 @@ class PoHeaderBaseComponent {
     _brand;
     _literals;
     language = poLocaleDefault;
+    themeChangeSignal = signal(0, ...(ngDevMode ? [{ debugName: "themeChangeSignal" }] : []));
     /**
      * @optional
      *
@@ -59599,6 +59791,31 @@ class PoHeaderBaseComponent {
     get literals() {
         return this._literals || poNavbarLiteralsDefault[this.language];
     }
+    /**
+     * @optional
+     *
+     * @Input
+     *
+     * @description
+     *
+     * Define o tamanho do componente:
+     * - `small`: altura de 44px (disponível apenas para acessibilidade AA).
+     * - `medium`: altura de 56px.
+     *
+     * > Caso a acessibilidade AA não esteja configurada, o tamanho `medium` será mantido.
+     * Para mais detalhes, consulte a documentação do [po-theme](https://po-ui.io/documentation/po-theme).
+     *
+     * @default `medium`
+     */
+    sizeInput = input('', { ...(ngDevMode ? { debugName: "sizeInput" } : {}), alias: 'p-size' });
+    size = computed(() => {
+        this.themeChangeSignal();
+        const value = this.sizeInput();
+        return value ? validateSizeFn(value, PoFieldSize) : getDefaultSizeFn(PoFieldSize);
+    }, ...(ngDevMode ? [{ debugName: "size" }] : []));
+    get hostSize() {
+        return this.sizeInput() ? validateSizeFn(this.sizeInput(), PoFieldSize) : getDefaultSizeFn(PoFieldSize);
+    }
     /**
      * @optional
      *
@@ -59617,8 +59834,19 @@ class PoHeaderBaseComponent {
     generateRandomId() {
         return String(Math.floor(Math.random() * 9999 + 1));
     }
+    onThemeChange() {
+        this.themeChangeSignal.update(v => v + 1);
+        requestAnimationFrame(() => {
+            try {
+                this.updateMenu();
+            }
+            catch {
+                console.error('updateMenu with errors. probably tried to execute before the component was rendered.');
+            }
+        });
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderBaseComponent, deps: [{ token: PoLanguageService }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.0.9", type: PoHeaderBaseComponent, isStandalone: true, inputs: { amountMore: ["p-amount-more", "amountMore"], hideButtonMenu: ["p-hide-button-menu", "hideButtonMenu"], filterMenu: ["p-filter-menu", "filterMenu", convertToBoolean], sideMenuOnlyAction: ["p-side-menu-only-action", "sideMenuOnlyAction"], forceActionTools: ["p-force-actions-tools", "forceActionTools"], notChangeContext: ["p-not-change-context", "notChangeContext"], brand: ["p-brand", "brand"], actionsTools: ["p-actions-tools", "actionsTools"], headerUser: ["p-header-user", "headerUser"], menuItems: ["p-menu-items", "menuItems"], menuCollapse: ["p-menus", "menuCollapse"], headerTemplate: ["p-header-template", "headerTemplate"], literals: ["p-literals", "literals"] }, outputs: { colapsedMenuEvent: "p-colapsed-menu" }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.9", type: PoHeaderBaseComponent, isStandalone: true, inputs: { amountMore: { classPropertyName: "amountMore", publicName: "p-amount-more", isSignal: false, isRequired: false, transformFunction: null }, hideButtonMenu: { classPropertyName: "hideButtonMenu", publicName: "p-hide-button-menu", isSignal: false, isRequired: false, transformFunction: null }, filterMenu: { classPropertyName: "filterMenu", publicName: "p-filter-menu", isSignal: false, isRequired: false, transformFunction: convertToBoolean }, sideMenuOnlyAction: { classPropertyName: "sideMenuOnlyAction", publicName: "p-side-menu-only-action", isSignal: false, isRequired: false, transformFunction: null }, forceActionTools: { classPropertyName: "forceActionTools", publicName: "p-force-actions-tools", isSignal: false, isRequired: false, transformFunction: null }, notChangeContext: { classPropertyName: "notChangeContext", publicName: "p-not-change-context", isSignal: false, isRequired: false, transformFunction: null }, brand: { classPropertyName: "brand", publicName: "p-brand", isSignal: false, isRequired: false, transformFunction: null }, actionsTools: { classPropertyName: "actionsTools", publicName: "p-actions-tools", isSignal: false, isRequired: false, transformFunction: null }, headerUser: { classPropertyName: "headerUser", publicName: "p-header-user", isSignal: false, isRequired: false, transformFunction: null }, menuItems: { classPropertyName: "menuItems", publicName: "p-menu-items", isSignal: false, isRequired: false, transformFunction: null }, menuCollapse: { classPropertyName: "menuCollapse", publicName: "p-menus", isSignal: false, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "p-header-template", isSignal: false, isRequired: false, transformFunction: null }, literals: { classPropertyName: "literals", publicName: "p-literals", isSignal: false, isRequired: false, transformFunction: null }, sizeInput: { classPropertyName: "sizeInput", publicName: "p-size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { colapsedMenuEvent: "p-colapsed-menu" }, host: { listeners: { "window:PoUiThemeChange": "onThemeChange()" }, properties: { "attr.p-size": "this.hostSize" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderBaseComponent, decorators: [{
             type: Directive
@@ -59661,9 +59889,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
             }], literals: [{
                 type: Input,
                 args: ['p-literals']
+            }], sizeInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "p-size", required: false }] }], hostSize: [{
+                type: HostBinding,
+                args: ['attr.p-size']
             }], colapsedMenuEvent: [{
                 type: Output,
                 args: ['p-colapsed-menu']
+            }], onThemeChange: [{
+                type: HostListener,
+                args: ['window:PoUiThemeChange']
             }] } });
 
 class PoHeaderbrandComponent {
@@ -59680,6 +59914,7 @@ class PoHeaderbrandComponent {
     // itens do menu caso não seja enviado um menu externo pelo usuário
     menuCollapse = [];
     externalMenu;
+    size = input(undefined, { ...(ngDevMode ? { debugName: "size" } : {}), alias: 'p-size' });
     constructor(cd, router) {
         this.cd = cd;
         this.router = router;
@@ -59716,11 +59951,11 @@ class PoHeaderbrandComponent {
         return this.titleBrand?.nativeElement.offsetWidth >= 151;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderbrandComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderbrandComponent, isStandalone: false, selector: "po-header-brand", inputs: { brand: ["p-brand", "brand"], hideButtonMenu: ["p-hide-button-menu", "hideButtonMenu"], menuCollapse: ["p-menus", "menuCollapse"], externalMenu: ["p-external", "externalMenu"] }, outputs: { clickMenu: "p-click-menu" }, viewQueries: [{ propertyName: "targetRef", first: true, predicate: ["target"], descendants: true, read: ElementRef, static: true }, { propertyName: "titleBrand", first: true, predicate: ["titleBrand"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"po-header-nav-brand\">\n  @if (externalMenu) {\n    <po-button\n      #target\n      class=\"po-nav-header-medium\"\n      p-size=\"medium\"\n      p-icon=\"ICON_MENU\"\n      p-kind=\"tertiary\"\n      (p-click)=\"clickMenu.emit()\"\n    >\n    </po-button>\n  } @else if (menuCollapse.length && !hideButtonMenu) {\n    <po-button p-size=\"medium\" #target p-icon=\"ICON_MENU\" p-kind=\"tertiary\" (p-click)=\"clickMenu.emit()\"> </po-button>\n  }\n\n  @if (brand?.logo && !smallLogo) {\n    <div class=\"po-header-nav-brand-logo\" (click)=\"onClickLogo()\">\n      <img [src]=\"brand.logo\" alt=\"Logo\" />\n    </div>\n  }\n\n  @if ((brand?.logo || brand?.smallLogo) && smallLogo) {\n    <div class=\"po-header-nav-brand-logo-small\" (click)=\"onClickLogo()\">\n      <img [src]=\"brand?.smallLogo || brand?.logo\" alt=\"Logo\" />\n    </div>\n  }\n  <span #titleBrand [p-tooltip]=\"showTooltip ? brand?.title : ''\" class=\"po-header-nav-brand-text\">{{\n    brand?.title\n  }}</span>\n</div>\n", dependencies: [{ kind: "component", type: PoButtonComponent, selector: "po-button" }, { kind: "directive", type: PoTooltipDirective, selector: "[p-tooltip]" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderbrandComponent, isStandalone: false, selector: "po-header-brand", inputs: { brand: { classPropertyName: "brand", publicName: "p-brand", isSignal: false, isRequired: false, transformFunction: null }, hideButtonMenu: { classPropertyName: "hideButtonMenu", publicName: "p-hide-button-menu", isSignal: false, isRequired: false, transformFunction: null }, menuCollapse: { classPropertyName: "menuCollapse", publicName: "p-menus", isSignal: false, isRequired: false, transformFunction: null }, externalMenu: { classPropertyName: "externalMenu", publicName: "p-external", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "p-size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clickMenu: "p-click-menu" }, viewQueries: [{ propertyName: "targetRef", first: true, predicate: ["target"], descendants: true, read: ElementRef, static: true }, { propertyName: "titleBrand", first: true, predicate: ["titleBrand"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"po-header-nav-brand\">\n  @if (externalMenu) {\n    <po-button\n      #target\n      class=\"po-nav-header-medium\"\n      [p-size]=\"size()\"\n      p-icon=\"ICON_MENU\"\n      p-kind=\"tertiary\"\n      (p-click)=\"clickMenu.emit()\"\n    >\n    </po-button>\n  } @else if (menuCollapse.length && !hideButtonMenu) {\n    <po-button [p-size]=\"size()\" #target p-icon=\"ICON_MENU\" p-kind=\"tertiary\" (p-click)=\"clickMenu.emit()\"> </po-button>\n  }\n\n  @if (brand?.logo && !smallLogo) {\n    <div class=\"po-header-nav-brand-logo\" (click)=\"onClickLogo()\">\n      <img [src]=\"brand.logo\" alt=\"Logo\" />\n    </div>\n  }\n\n  @if ((brand?.logo || brand?.smallLogo) && smallLogo) {\n    <div class=\"po-header-nav-brand-logo-small\" (click)=\"onClickLogo()\">\n      <img [src]=\"brand?.smallLogo || brand?.logo\" alt=\"Logo\" />\n    </div>\n  }\n  <span #titleBrand [p-tooltip]=\"showTooltip ? brand?.title : ''\" class=\"po-header-nav-brand-text\">{{\n    brand?.title\n  }}</span>\n</div>\n", dependencies: [{ kind: "component", type: PoButtonComponent, selector: "po-button" }, { kind: "directive", type: PoTooltipDirective, selector: "[p-tooltip]" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderbrandComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'po-header-brand', standalone: false, template: "<div class=\"po-header-nav-brand\">\n  @if (externalMenu) {\n    <po-button\n      #target\n      class=\"po-nav-header-medium\"\n      p-size=\"medium\"\n      p-icon=\"ICON_MENU\"\n      p-kind=\"tertiary\"\n      (p-click)=\"clickMenu.emit()\"\n    >\n    </po-button>\n  } @else if (menuCollapse.length && !hideButtonMenu) {\n    <po-button p-size=\"medium\" #target p-icon=\"ICON_MENU\" p-kind=\"tertiary\" (p-click)=\"clickMenu.emit()\"> </po-button>\n  }\n\n  @if (brand?.logo && !smallLogo) {\n    <div class=\"po-header-nav-brand-logo\" (click)=\"onClickLogo()\">\n      <img [src]=\"brand.logo\" alt=\"Logo\" />\n    </div>\n  }\n\n  @if ((brand?.logo || brand?.smallLogo) && smallLogo) {\n    <div class=\"po-header-nav-brand-logo-small\" (click)=\"onClickLogo()\">\n      <img [src]=\"brand?.smallLogo || brand?.logo\" alt=\"Logo\" />\n    </div>\n  }\n  <span #titleBrand [p-tooltip]=\"showTooltip ? brand?.title : ''\" class=\"po-header-nav-brand-text\">{{\n    brand?.title\n  }}</span>\n</div>\n" }]
+            args: [{ selector: 'po-header-brand', standalone: false, template: "<div class=\"po-header-nav-brand\">\n  @if (externalMenu) {\n    <po-button\n      #target\n      class=\"po-nav-header-medium\"\n      [p-size]=\"size()\"\n      p-icon=\"ICON_MENU\"\n      p-kind=\"tertiary\"\n      (p-click)=\"clickMenu.emit()\"\n    >\n    </po-button>\n  } @else if (menuCollapse.length && !hideButtonMenu) {\n    <po-button [p-size]=\"size()\" #target p-icon=\"ICON_MENU\" p-kind=\"tertiary\" (p-click)=\"clickMenu.emit()\"> </po-button>\n  }\n\n  @if (brand?.logo && !smallLogo) {\n    <div class=\"po-header-nav-brand-logo\" (click)=\"onClickLogo()\">\n      <img [src]=\"brand.logo\" alt=\"Logo\" />\n    </div>\n  }\n\n  @if ((brand?.logo || brand?.smallLogo) && smallLogo) {\n    <div class=\"po-header-nav-brand-logo-small\" (click)=\"onClickLogo()\">\n      <img [src]=\"brand?.smallLogo || brand?.logo\" alt=\"Logo\" />\n    </div>\n  }\n  <span #titleBrand [p-tooltip]=\"showTooltip ? brand?.title : ''\" class=\"po-header-nav-brand-text\">{{\n    brand?.title\n  }}</span>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.Router }], propDecorators: { targetRef: [{
                 type: ViewChild,
                 args: ['target', { read: ElementRef, static: true }]
@@ -59742,7 +59977,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
             }], externalMenu: [{
                 type: Input,
                 args: ['p-external']
-            }] } });
+            }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "p-size", required: false }] }] } });
 
 const poHeaderMoreLiteralsDefault = {
     en: {
@@ -59772,6 +60007,7 @@ class PoHeaderMenuItemComponent {
     item;
     itemOverFlow;
     overflowButton = false;
+    size = input(undefined, { ...(ngDevMode ? { debugName: "size" } : {}), alias: 'p-size' });
     itemClick = new EventEmitter();
     constructor(cd, router, languageService) {
         this.cd = cd;
@@ -59871,11 +60107,11 @@ class PoHeaderMenuItemComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderMenuItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.Router }, { token: PoLanguageService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderMenuItemComponent, isStandalone: false, selector: "po-header-menu-item", inputs: { item: ["p-item", "item"], itemOverFlow: ["p-item-overflow", "itemOverFlow"], overflowButton: ["p-button-overflow", "overflowButton"] }, outputs: { itemClick: "p-item-click" }, viewQueries: [{ propertyName: "buttonMoreElement", first: true, predicate: ["buttonMoreElement"], descendants: true, read: ElementRef }, { propertyName: "poPopupElement", first: true, predicate: PoPopupComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (overflowButton) {\n  <li\n    #buttonMoreElement\n    #overflowButton\n    class=\"po-header-nav-submenu-more\"\n    tabindex=\"0\"\n    (click)=\"openListButtonMore()\"\n    (keydown)=\"onKeyDownButtonMore($event)\"\n  >\n    <div\n      role=\"button\"\n      [attr.aria-expanded]=\"poPopupElement?.showPopup\"\n      class=\"po-header-nav-submenu-button-more\"\n      [class.open]=\"poPopupElement?.showPopup\"\n    >\n      <span>{{ literals.more }}</span>\n      <po-icon\n        class=\"po-header-icon po-header-nav-submenu-more-icon\"\n        [p-icon]=\"poPopupElement?.showPopup ? 'ICON_ARROW_UP' : 'ICON_ARROW_DOWN'\"\n      ></po-icon>\n    </div>\n  </li>\n} @else {\n  <li\n    #menusubmenuitem\n    tabindex=\"0\"\n    [p-tooltip]=\"item?.label\"\n    class=\"po-header-nav-submenu\"\n    (click)=\"onAction(item)\"\n    (keydown)=\"onKeyDownButtonList($event, item)\"\n    [attr.aria-current]=\"selectedItem\"\n  >\n    <div\n      class=\"po-header-nav-submenu-button\"\n      [attr.aria-selected]=\"item?.$selected\"\n      [class.submenu-item-selected]=\"selectedItem\"\n    >\n      <span>{{ item?.label }}</span>\n    </div>\n  </li>\n}\n\n@if (overflowButton) {\n  <po-popup\n    #popup\n    p-size=\"medium\"\n    [p-actions]=\"itemOverFlow\"\n    [p-target]=\"buttonMoreElement\"\n    [p-hide-arrow]=\"true\"\n    (p-click-item)=\"onAction($event, false)\"\n    (p-close)=\"onClosePopup()\"\n  >\n  </po-popup>\n}\n", dependencies: [{ kind: "component", type: PoIconComponent, selector: "po-icon", inputs: ["p-icon"] }, { kind: "directive", type: PoTooltipDirective, selector: "[p-tooltip]" }, { kind: "component", type: PoPopupComponent, selector: "po-popup" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderMenuItemComponent, isStandalone: false, selector: "po-header-menu-item", inputs: { item: { classPropertyName: "item", publicName: "p-item", isSignal: false, isRequired: false, transformFunction: null }, itemOverFlow: { classPropertyName: "itemOverFlow", publicName: "p-item-overflow", isSignal: false, isRequired: false, transformFunction: null }, overflowButton: { classPropertyName: "overflowButton", publicName: "p-button-overflow", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "p-size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "p-item-click" }, viewQueries: [{ propertyName: "buttonMoreElement", first: true, predicate: ["buttonMoreElement"], descendants: true, read: ElementRef }, { propertyName: "poPopupElement", first: true, predicate: PoPopupComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (overflowButton) {\n  <li\n    #buttonMoreElement\n    #overflowButton\n    class=\"po-header-nav-submenu-more\"\n    tabindex=\"0\"\n    (click)=\"openListButtonMore()\"\n    (keydown)=\"onKeyDownButtonMore($event)\"\n  >\n    <div\n      role=\"button\"\n      [attr.aria-expanded]=\"poPopupElement?.showPopup\"\n      class=\"po-header-nav-submenu-button-more\"\n      [class.open]=\"poPopupElement?.showPopup\"\n    >\n      <span>{{ literals.more }}</span>\n      <po-icon\n        class=\"po-header-icon po-header-nav-submenu-more-icon\"\n        [p-icon]=\"poPopupElement?.showPopup ? 'ICON_ARROW_UP' : 'ICON_ARROW_DOWN'\"\n      ></po-icon>\n    </div>\n  </li>\n} @else {\n  <li\n    #menusubmenuitem\n    tabindex=\"0\"\n    [p-tooltip]=\"item?.label\"\n    class=\"po-header-nav-submenu\"\n    (click)=\"onAction(item)\"\n    (keydown)=\"onKeyDownButtonList($event, item)\"\n    [attr.aria-current]=\"selectedItem\"\n  >\n    <div\n      class=\"po-header-nav-submenu-button\"\n      [attr.aria-selected]=\"item?.$selected\"\n      [class.submenu-item-selected]=\"selectedItem\"\n    >\n      <span>{{ item?.label }}</span>\n    </div>\n  </li>\n}\n\n@if (overflowButton) {\n  <po-popup\n    #popup\n    [p-size]=\"size()\"\n    [p-actions]=\"itemOverFlow\"\n    [p-target]=\"buttonMoreElement\"\n    [p-hide-arrow]=\"true\"\n    (p-click-item)=\"onAction($event, false)\"\n    (p-close)=\"onClosePopup()\"\n  >\n  </po-popup>\n}\n", dependencies: [{ kind: "component", type: PoIconComponent, selector: "po-icon", inputs: ["p-icon"] }, { kind: "directive", type: PoTooltipDirective, selector: "[p-tooltip]" }, { kind: "component", type: PoPopupComponent, selector: "po-popup" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderMenuItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'po-header-menu-item', standalone: false, template: "@if (overflowButton) {\n  <li\n    #buttonMoreElement\n    #overflowButton\n    class=\"po-header-nav-submenu-more\"\n    tabindex=\"0\"\n    (click)=\"openListButtonMore()\"\n    (keydown)=\"onKeyDownButtonMore($event)\"\n  >\n    <div\n      role=\"button\"\n      [attr.aria-expanded]=\"poPopupElement?.showPopup\"\n      class=\"po-header-nav-submenu-button-more\"\n      [class.open]=\"poPopupElement?.showPopup\"\n    >\n      <span>{{ literals.more }}</span>\n      <po-icon\n        class=\"po-header-icon po-header-nav-submenu-more-icon\"\n        [p-icon]=\"poPopupElement?.showPopup ? 'ICON_ARROW_UP' : 'ICON_ARROW_DOWN'\"\n      ></po-icon>\n    </div>\n  </li>\n} @else {\n  <li\n    #menusubmenuitem\n    tabindex=\"0\"\n    [p-tooltip]=\"item?.label\"\n    class=\"po-header-nav-submenu\"\n    (click)=\"onAction(item)\"\n    (keydown)=\"onKeyDownButtonList($event, item)\"\n    [attr.aria-current]=\"selectedItem\"\n  >\n    <div\n      class=\"po-header-nav-submenu-button\"\n      [attr.aria-selected]=\"item?.$selected\"\n      [class.submenu-item-selected]=\"selectedItem\"\n    >\n      <span>{{ item?.label }}</span>\n    </div>\n  </li>\n}\n\n@if (overflowButton) {\n  <po-popup\n    #popup\n    p-size=\"medium\"\n    [p-actions]=\"itemOverFlow\"\n    [p-target]=\"buttonMoreElement\"\n    [p-hide-arrow]=\"true\"\n    (p-click-item)=\"onAction($event, false)\"\n    (p-close)=\"onClosePopup()\"\n  >\n  </po-popup>\n}\n" }]
+            args: [{ selector: 'po-header-menu-item', standalone: false, template: "@if (overflowButton) {\n  <li\n    #buttonMoreElement\n    #overflowButton\n    class=\"po-header-nav-submenu-more\"\n    tabindex=\"0\"\n    (click)=\"openListButtonMore()\"\n    (keydown)=\"onKeyDownButtonMore($event)\"\n  >\n    <div\n      role=\"button\"\n      [attr.aria-expanded]=\"poPopupElement?.showPopup\"\n      class=\"po-header-nav-submenu-button-more\"\n      [class.open]=\"poPopupElement?.showPopup\"\n    >\n      <span>{{ literals.more }}</span>\n      <po-icon\n        class=\"po-header-icon po-header-nav-submenu-more-icon\"\n        [p-icon]=\"poPopupElement?.showPopup ? 'ICON_ARROW_UP' : 'ICON_ARROW_DOWN'\"\n      ></po-icon>\n    </div>\n  </li>\n} @else {\n  <li\n    #menusubmenuitem\n    tabindex=\"0\"\n    [p-tooltip]=\"item?.label\"\n    class=\"po-header-nav-submenu\"\n    (click)=\"onAction(item)\"\n    (keydown)=\"onKeyDownButtonList($event, item)\"\n    [attr.aria-current]=\"selectedItem\"\n  >\n    <div\n      class=\"po-header-nav-submenu-button\"\n      [attr.aria-selected]=\"item?.$selected\"\n      [class.submenu-item-selected]=\"selectedItem\"\n    >\n      <span>{{ item?.label }}</span>\n    </div>\n  </li>\n}\n\n@if (overflowButton) {\n  <po-popup\n    #popup\n    [p-size]=\"size()\"\n    [p-actions]=\"itemOverFlow\"\n    [p-target]=\"buttonMoreElement\"\n    [p-hide-arrow]=\"true\"\n    (p-click-item)=\"onAction($event, false)\"\n    (p-close)=\"onClosePopup()\"\n  >\n  </po-popup>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.Router }, { type: PoLanguageService }], propDecorators: { buttonMoreElement: [{
                 type: ViewChild,
                 args: ['buttonMoreElement', { read: ElementRef }]
@@ -59891,7 +60127,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
             }], overflowButton: [{
                 type: Input,
                 args: ['p-button-overflow']
-            }], itemClick: [{
+            }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "p-size", required: false }] }], itemClick: [{
                 type: Output,
                 args: ['p-item-click']
             }] } });
@@ -59915,6 +60151,7 @@ class PoHeaderToolsComponent {
         this.cd.detectChanges();
     }
     literals;
+    size = input(undefined, { ...(ngDevMode ? { debugName: "size" } : {}), alias: 'p-size' });
     get actionTools() {
         return this._actionTools;
     }
@@ -59973,11 +60210,11 @@ class PoHeaderToolsComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderToolsComponent, deps: [{ token: i1$1.Router }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderToolsComponent, isStandalone: false, selector: "po-header-tools", inputs: { forceActionTools: ["p-force-actions-tools", "forceActionTools"], actionTools: ["p-actions-tools", "actionTools"], literals: ["p-literals", "literals"], headerTemplate: ["p-header-template", "headerTemplate"] }, viewQueries: [{ propertyName: "buttonActionElements", predicate: ["buttonActionElement"], descendants: true, read: ElementRef }, { propertyName: "buttonActionComponents", predicate: ["buttonActionElement"], descendants: true }, { propertyName: "poPopupActions", predicate: ["poPopupAction"], descendants: true }, { propertyName: "poPopoverActions", predicate: ["poPopoverAction"], descendants: true }], ngImport: i0, template: "<div class=\"po-header-nav-tools\">\n  @if (headerTemplate) {\n    <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n  }\n  @for (action of actionTools; track action?.label; let i = $index) {\n    <li [class.po-header-nav-item-small]=\"i !== actionTools.length - 1\">\n      <po-button\n        #buttonActionElement\n        [p-tooltip]=\"action?.tooltip\"\n        [p-icon]=\"action?.badge ? badge : action?.icon || 'an an-dots-nine'\"\n        p-kind=\"tertiary\"\n        (p-click)=\"onClickAction(i)\"\n        [class.po-header-selected-tool]=\"checkSelected(i)\"\n        [p-aria-expanded]=\"checkSelected(i)\"\n        [p-aria-label]=\"getAriaLabel(action)\"\n        p-size=\"medium\"\n      >\n      </po-button>\n\n      <ng-template #badge>\n        <i class=\"po-header-badge\" [class]=\"action?.icon || 'an an-bell'\">\n          <po-badge class=\"po-header-status\" [p-value]=\"action?.badge\"></po-badge>\n        </i>\n      </ng-template>\n\n      <po-popup\n        #poPopupAction\n        [p-actions]=\"action?.items\"\n        [p-target]=\"buttonActionElements?.get(i)\"\n        [p-hide-arrow]=\"true\"\n        (p-close)=\"onClosePopup(i)\"\n        p-size=\"medium\"\n      >\n      </po-popup>\n\n      @if (action?.popover) {\n        <po-popover\n          #poPopoverAction\n          p-position=\"bottom-right\"\n          [p-width]=\"action.popover.width\"\n          [p-target]=\"buttonActionElements?.get(i)\"\n          [p-hide-arrow]=\"true\"\n          [p-corner-aligned]=\"true\"\n        >\n          <ng-container *ngTemplateOutlet=\"action.popover?.content\"></ng-container>\n        </po-popover>\n      }\n    </li>\n  }\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PoButtonComponent, selector: "po-button" }, { kind: "component", type: PoBadgeComponent, selector: "po-badge" }, { kind: "component", type: PoPopoverComponent, selector: "po-popover" }, { kind: "directive", type: PoTooltipDirective, selector: "[p-tooltip]" }, { kind: "component", type: PoPopupComponent, selector: "po-popup" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderToolsComponent, isStandalone: false, selector: "po-header-tools", inputs: { forceActionTools: { classPropertyName: "forceActionTools", publicName: "p-force-actions-tools", isSignal: false, isRequired: false, transformFunction: null }, actionTools: { classPropertyName: "actionTools", publicName: "p-actions-tools", isSignal: false, isRequired: false, transformFunction: null }, literals: { classPropertyName: "literals", publicName: "p-literals", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "p-size", isSignal: true, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "p-header-template", isSignal: false, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "buttonActionElements", predicate: ["buttonActionElement"], descendants: true, read: ElementRef }, { propertyName: "buttonActionComponents", predicate: ["buttonActionElement"], descendants: true }, { propertyName: "poPopupActions", predicate: ["poPopupAction"], descendants: true }, { propertyName: "poPopoverActions", predicate: ["poPopoverAction"], descendants: true }], ngImport: i0, template: "<div class=\"po-header-nav-tools\">\n  @if (headerTemplate) {\n    <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n  }\n  @for (action of actionTools; track action?.label; let i = $index) {\n    <li [class.po-header-nav-item-small]=\"i !== actionTools.length - 1\">\n      <po-button\n        #buttonActionElement\n        [p-tooltip]=\"action?.tooltip\"\n        [p-icon]=\"action?.badge ? badge : action?.icon || 'an an-dots-nine'\"\n        p-kind=\"tertiary\"\n        (p-click)=\"onClickAction(i)\"\n        [class.po-header-selected-tool]=\"checkSelected(i)\"\n        [p-aria-expanded]=\"checkSelected(i)\"\n        [p-aria-label]=\"getAriaLabel(action)\"\n        [p-size]=\"size()\"\n      >\n      </po-button>\n\n      <ng-template #badge>\n        <i class=\"po-header-badge\" [class]=\"action?.icon || 'an an-bell'\">\n          <po-badge class=\"po-header-status\" [p-value]=\"action?.badge\"></po-badge>\n        </i>\n      </ng-template>\n\n      <po-popup\n        #poPopupAction\n        [p-actions]=\"action?.items\"\n        [p-target]=\"buttonActionElements?.get(i)\"\n        [p-hide-arrow]=\"true\"\n        (p-close)=\"onClosePopup(i)\"\n        [p-size]=\"size()\"\n      >\n      </po-popup>\n\n      @if (action?.popover) {\n        <po-popover\n          #poPopoverAction\n          p-position=\"bottom-right\"\n          [p-width]=\"action.popover.width\"\n          [p-target]=\"buttonActionElements?.get(i)\"\n          [p-hide-arrow]=\"true\"\n          [p-corner-aligned]=\"true\"\n        >\n          <ng-container *ngTemplateOutlet=\"action.popover?.content\"></ng-container>\n        </po-popover>\n      }\n    </li>\n  }\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PoButtonComponent, selector: "po-button" }, { kind: "component", type: PoBadgeComponent, selector: "po-badge" }, { kind: "component", type: PoPopoverComponent, selector: "po-popover" }, { kind: "directive", type: PoTooltipDirective, selector: "[p-tooltip]" }, { kind: "component", type: PoPopupComponent, selector: "po-popup" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderToolsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'po-header-tools', standalone: false, template: "<div class=\"po-header-nav-tools\">\n  @if (headerTemplate) {\n    <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n  }\n  @for (action of actionTools; track action?.label; let i = $index) {\n    <li [class.po-header-nav-item-small]=\"i !== actionTools.length - 1\">\n      <po-button\n        #buttonActionElement\n        [p-tooltip]=\"action?.tooltip\"\n        [p-icon]=\"action?.badge ? badge : action?.icon || 'an an-dots-nine'\"\n        p-kind=\"tertiary\"\n        (p-click)=\"onClickAction(i)\"\n        [class.po-header-selected-tool]=\"checkSelected(i)\"\n        [p-aria-expanded]=\"checkSelected(i)\"\n        [p-aria-label]=\"getAriaLabel(action)\"\n        p-size=\"medium\"\n      >\n      </po-button>\n\n      <ng-template #badge>\n        <i class=\"po-header-badge\" [class]=\"action?.icon || 'an an-bell'\">\n          <po-badge class=\"po-header-status\" [p-value]=\"action?.badge\"></po-badge>\n        </i>\n      </ng-template>\n\n      <po-popup\n        #poPopupAction\n        [p-actions]=\"action?.items\"\n        [p-target]=\"buttonActionElements?.get(i)\"\n        [p-hide-arrow]=\"true\"\n        (p-close)=\"onClosePopup(i)\"\n        p-size=\"medium\"\n      >\n      </po-popup>\n\n      @if (action?.popover) {\n        <po-popover\n          #poPopoverAction\n          p-position=\"bottom-right\"\n          [p-width]=\"action.popover.width\"\n          [p-target]=\"buttonActionElements?.get(i)\"\n          [p-hide-arrow]=\"true\"\n          [p-corner-aligned]=\"true\"\n        >\n          <ng-container *ngTemplateOutlet=\"action.popover?.content\"></ng-container>\n        </po-popover>\n      }\n    </li>\n  }\n</div>\n" }]
+            args: [{ selector: 'po-header-tools', standalone: false, template: "<div class=\"po-header-nav-tools\">\n  @if (headerTemplate) {\n    <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n  }\n  @for (action of actionTools; track action?.label; let i = $index) {\n    <li [class.po-header-nav-item-small]=\"i !== actionTools.length - 1\">\n      <po-button\n        #buttonActionElement\n        [p-tooltip]=\"action?.tooltip\"\n        [p-icon]=\"action?.badge ? badge : action?.icon || 'an an-dots-nine'\"\n        p-kind=\"tertiary\"\n        (p-click)=\"onClickAction(i)\"\n        [class.po-header-selected-tool]=\"checkSelected(i)\"\n        [p-aria-expanded]=\"checkSelected(i)\"\n        [p-aria-label]=\"getAriaLabel(action)\"\n        [p-size]=\"size()\"\n      >\n      </po-button>\n\n      <ng-template #badge>\n        <i class=\"po-header-badge\" [class]=\"action?.icon || 'an an-bell'\">\n          <po-badge class=\"po-header-status\" [p-value]=\"action?.badge\"></po-badge>\n        </i>\n      </ng-template>\n\n      <po-popup\n        #poPopupAction\n        [p-actions]=\"action?.items\"\n        [p-target]=\"buttonActionElements?.get(i)\"\n        [p-hide-arrow]=\"true\"\n        (p-close)=\"onClosePopup(i)\"\n        [p-size]=\"size()\"\n      >\n      </po-popup>\n\n      @if (action?.popover) {\n        <po-popover\n          #poPopoverAction\n          p-position=\"bottom-right\"\n          [p-width]=\"action.popover.width\"\n          [p-target]=\"buttonActionElements?.get(i)\"\n          [p-hide-arrow]=\"true\"\n          [p-corner-aligned]=\"true\"\n        >\n          <ng-container *ngTemplateOutlet=\"action.popover?.content\"></ng-container>\n        </po-popover>\n      }\n    </li>\n  }\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$1.Router }, { type: i0.ChangeDetectorRef }], propDecorators: { buttonActionElements: [{
                 type: ViewChildren,
                 args: ['buttonActionElement', { read: ElementRef }]
@@ -59999,7 +60236,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
             }], literals: [{
                 type: Input,
                 args: ['p-literals']
-            }], headerTemplate: [{
+            }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "p-size", required: false }] }], headerTemplate: [{
                 type: Input,
                 args: ['p-header-template']
             }] } });
@@ -60023,6 +60260,7 @@ class PoHeaderCustomerComponent {
     poPopupAction;
     poPopoverAction;
     headerUser;
+    size = input(undefined, { ...(ngDevMode ? { debugName: "size" } : {}), alias: 'p-size' });
     constructor(languageService) {
         const language = languageService.getShortLanguage();
         this.literals = {
@@ -60056,11 +60294,11 @@ class PoHeaderCustomerComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderCustomerComponent, deps: [{ token: PoLanguageService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderCustomerComponent, isStandalone: false, selector: "po-header-customer", inputs: { headerUser: ["p-header-user", "headerUser"] }, viewQueries: [{ propertyName: "poPopupAction", first: true, predicate: ["poPopupAction"], descendants: true }, { propertyName: "poPopoverAction", first: true, predicate: ["poPopoverAction"], descendants: true }], ngImport: i0, template: "<div class=\"po-header-nav-tools\" (click)=\"onClickUserSection()\" (keydown)=\"onKeyDownCustomer($event)\">\n  <li\n    #targetRef\n    tabindex=\"0\"\n    class=\"po-header-nav-customer-container\"\n    (click)=\"onClickPopup()\"\n    role=\"menu\"\n    [attr.aria-label]=\"literals.labelUser\"\n  >\n    <div class=\"po-header-nav-customer-brand\">\n      <img [src]=\"headerUser?.customerBrand\" alt=\"User\" />\n    </div>\n\n    <div class=\"po-header-nav-customer-divider\"></div>\n\n    <div class=\"po-header-nav-customer-avatar-wrapper\">\n      <div class=\"po-header-nav-customer-avatar\">\n        <img [src]=\"headerUser?.avatar\" alt=\"Avatar\" />\n      </div>\n      @if (headerUser?.status) {\n        <po-badge class=\"po-header-nav-avatar-status\" p-size=\"small\" [p-status]=\"headerUser.status\"></po-badge>\n      }\n    </div>\n  </li>\n\n  <li class=\"po-header-nav-customer-avatar-wrapper po-header-icon-small\">\n    <div class=\"po-header-nav-customer-avatar\">\n      <img [src]=\"headerUser?.avatar\" alt=\"Avatar\" />\n    </div>\n    @if (headerUser?.status) {\n      <po-badge class=\"po-header-nav-avatar-status\" p-size=\"small\" [p-status]=\"headerUser.status\"></po-badge>\n    }\n  </li>\n</div>\n\n@if (headerUser?.items?.length) {\n  <po-popup\n    #poPopupAction\n    [p-actions]=\"headerUser.items\"\n    [p-target]=\"targetRef\"\n    [p-hide-arrow]=\"true\"\n    p-position=\"bottom-left\"\n    p-size=\"medium\"\n  >\n  </po-popup>\n}\n\n@if (headerUser?.popover) {\n  <po-popover\n    #poPopoverAction\n    p-position=\"bottom-right\"\n    [p-width]=\"headerUser.popover.width\"\n    [p-target]=\"targetRef\"\n    [p-hide-arrow]=\"true\"\n    [p-corner-aligned]=\"true\"\n  >\n    <ng-container *ngTemplateOutlet=\"headerUser.popover.content\"></ng-container>\n  </po-popover>\n}\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PoBadgeComponent, selector: "po-badge" }, { kind: "component", type: PoPopoverComponent, selector: "po-popover" }, { kind: "component", type: PoPopupComponent, selector: "po-popup" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderCustomerComponent, isStandalone: false, selector: "po-header-customer", inputs: { headerUser: { classPropertyName: "headerUser", publicName: "p-header-user", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "p-size", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "poPopupAction", first: true, predicate: ["poPopupAction"], descendants: true }, { propertyName: "poPopoverAction", first: true, predicate: ["poPopoverAction"], descendants: true }], ngImport: i0, template: "<div class=\"po-header-nav-tools\" (click)=\"onClickUserSection()\" (keydown)=\"onKeyDownCustomer($event)\">\n  <li\n    #targetRef\n    tabindex=\"0\"\n    class=\"po-header-nav-customer-container\"\n    (click)=\"onClickPopup()\"\n    role=\"menu\"\n    [attr.aria-label]=\"literals.labelUser\"\n  >\n    <div class=\"po-header-nav-customer-brand\">\n      <img [src]=\"headerUser?.customerBrand\" alt=\"User\" />\n    </div>\n\n    <div class=\"po-header-nav-customer-divider\"></div>\n\n    <div class=\"po-header-nav-customer-avatar-wrapper\">\n      <div class=\"po-header-nav-customer-avatar\">\n        <img [src]=\"headerUser?.avatar\" alt=\"Avatar\" />\n      </div>\n      @if (headerUser?.status) {\n        <po-badge class=\"po-header-nav-avatar-status\" p-size=\"small\" [p-status]=\"headerUser.status\"></po-badge>\n      }\n    </div>\n  </li>\n\n  <li class=\"po-header-nav-customer-avatar-wrapper po-header-icon-small\">\n    <div class=\"po-header-nav-customer-avatar\">\n      <img [src]=\"headerUser?.avatar\" alt=\"Avatar\" />\n    </div>\n    @if (headerUser?.status) {\n      <po-badge class=\"po-header-nav-avatar-status\" p-size=\"small\" [p-status]=\"headerUser.status\"></po-badge>\n    }\n  </li>\n</div>\n\n@if (headerUser?.items?.length) {\n  <po-popup\n    #poPopupAction\n    [p-actions]=\"headerUser.items\"\n    [p-target]=\"targetRef\"\n    [p-hide-arrow]=\"true\"\n    p-position=\"bottom-left\"\n    [p-size]=\"size()\"\n  >\n  </po-popup>\n}\n\n@if (headerUser?.popover) {\n  <po-popover\n    #poPopoverAction\n    p-position=\"bottom-right\"\n    [p-width]=\"headerUser.popover.width\"\n    [p-target]=\"targetRef\"\n    [p-hide-arrow]=\"true\"\n    [p-corner-aligned]=\"true\"\n  >\n    <ng-container *ngTemplateOutlet=\"headerUser.popover.content\"></ng-container>\n  </po-popover>\n}\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PoBadgeComponent, selector: "po-badge" }, { kind: "component", type: PoPopoverComponent, selector: "po-popover" }, { kind: "component", type: PoPopupComponent, selector: "po-popup" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderCustomerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'po-header-customer', standalone: false, template: "<div class=\"po-header-nav-tools\" (click)=\"onClickUserSection()\" (keydown)=\"onKeyDownCustomer($event)\">\n  <li\n    #targetRef\n    tabindex=\"0\"\n    class=\"po-header-nav-customer-container\"\n    (click)=\"onClickPopup()\"\n    role=\"menu\"\n    [attr.aria-label]=\"literals.labelUser\"\n  >\n    <div class=\"po-header-nav-customer-brand\">\n      <img [src]=\"headerUser?.customerBrand\" alt=\"User\" />\n    </div>\n\n    <div class=\"po-header-nav-customer-divider\"></div>\n\n    <div class=\"po-header-nav-customer-avatar-wrapper\">\n      <div class=\"po-header-nav-customer-avatar\">\n        <img [src]=\"headerUser?.avatar\" alt=\"Avatar\" />\n      </div>\n      @if (headerUser?.status) {\n        <po-badge class=\"po-header-nav-avatar-status\" p-size=\"small\" [p-status]=\"headerUser.status\"></po-badge>\n      }\n    </div>\n  </li>\n\n  <li class=\"po-header-nav-customer-avatar-wrapper po-header-icon-small\">\n    <div class=\"po-header-nav-customer-avatar\">\n      <img [src]=\"headerUser?.avatar\" alt=\"Avatar\" />\n    </div>\n    @if (headerUser?.status) {\n      <po-badge class=\"po-header-nav-avatar-status\" p-size=\"small\" [p-status]=\"headerUser.status\"></po-badge>\n    }\n  </li>\n</div>\n\n@if (headerUser?.items?.length) {\n  <po-popup\n    #poPopupAction\n    [p-actions]=\"headerUser.items\"\n    [p-target]=\"targetRef\"\n    [p-hide-arrow]=\"true\"\n    p-position=\"bottom-left\"\n    p-size=\"medium\"\n  >\n  </po-popup>\n}\n\n@if (headerUser?.popover) {\n  <po-popover\n    #poPopoverAction\n    p-position=\"bottom-right\"\n    [p-width]=\"headerUser.popover.width\"\n    [p-target]=\"targetRef\"\n    [p-hide-arrow]=\"true\"\n    [p-corner-aligned]=\"true\"\n  >\n    <ng-container *ngTemplateOutlet=\"headerUser.popover.content\"></ng-container>\n  </po-popover>\n}\n" }]
+            args: [{ selector: 'po-header-customer', standalone: false, template: "<div class=\"po-header-nav-tools\" (click)=\"onClickUserSection()\" (keydown)=\"onKeyDownCustomer($event)\">\n  <li\n    #targetRef\n    tabindex=\"0\"\n    class=\"po-header-nav-customer-container\"\n    (click)=\"onClickPopup()\"\n    role=\"menu\"\n    [attr.aria-label]=\"literals.labelUser\"\n  >\n    <div class=\"po-header-nav-customer-brand\">\n      <img [src]=\"headerUser?.customerBrand\" alt=\"User\" />\n    </div>\n\n    <div class=\"po-header-nav-customer-divider\"></div>\n\n    <div class=\"po-header-nav-customer-avatar-wrapper\">\n      <div class=\"po-header-nav-customer-avatar\">\n        <img [src]=\"headerUser?.avatar\" alt=\"Avatar\" />\n      </div>\n      @if (headerUser?.status) {\n        <po-badge class=\"po-header-nav-avatar-status\" p-size=\"small\" [p-status]=\"headerUser.status\"></po-badge>\n      }\n    </div>\n  </li>\n\n  <li class=\"po-header-nav-customer-avatar-wrapper po-header-icon-small\">\n    <div class=\"po-header-nav-customer-avatar\">\n      <img [src]=\"headerUser?.avatar\" alt=\"Avatar\" />\n    </div>\n    @if (headerUser?.status) {\n      <po-badge class=\"po-header-nav-avatar-status\" p-size=\"small\" [p-status]=\"headerUser.status\"></po-badge>\n    }\n  </li>\n</div>\n\n@if (headerUser?.items?.length) {\n  <po-popup\n    #poPopupAction\n    [p-actions]=\"headerUser.items\"\n    [p-target]=\"targetRef\"\n    [p-hide-arrow]=\"true\"\n    p-position=\"bottom-left\"\n    [p-size]=\"size()\"\n  >\n  </po-popup>\n}\n\n@if (headerUser?.popover) {\n  <po-popover\n    #poPopoverAction\n    p-position=\"bottom-right\"\n    [p-width]=\"headerUser.popover.width\"\n    [p-target]=\"targetRef\"\n    [p-hide-arrow]=\"true\"\n    [p-corner-aligned]=\"true\"\n  >\n    <ng-container *ngTemplateOutlet=\"headerUser.popover.content\"></ng-container>\n  </po-popover>\n}\n" }]
         }], ctorParameters: () => [{ type: PoLanguageService }], propDecorators: { poPopupAction: [{
                 type: ViewChild,
                 args: ['poPopupAction']
@@ -60070,7 +60308,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
             }], headerUser: [{
                 type: Input,
                 args: ['p-header-user']
-            }] } });
+            }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "p-size", required: false }] }] } });
 
 /**
  * @docsExtends PoHeaderBaseComponent
@@ -60371,11 +60609,11 @@ class PoHeaderComponent extends PoHeaderBaseComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: PoMenuGlobalService }, { token: PoLanguageService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderComponent, isStandalone: false, selector: "po-header", queries: [{ propertyName: "menuHeaderTemplate", first: true, predicate: PoMenuHeaderTemplateDirective, descendants: true, static: true }], viewQueries: [{ propertyName: "buttonFirstAction", first: true, predicate: ["buttonFirstAction"], descendants: true, read: ElementRef }, { propertyName: "navElement", first: true, predicate: ["navElement"], descendants: true, read: ElementRef }, { propertyName: "menuWrapperBrand", first: true, predicate: ["menuWrapperBrand"], descendants: true }, { propertyName: "menuWrapperTools", first: true, predicate: ["menuWrapperTools"], descendants: true }, { propertyName: "overflowButton", first: true, predicate: ["overflowButton"], descendants: true, static: true }, { propertyName: "overflowButtonComponentEl", first: true, predicate: ["overflowButton"], descendants: true }, { propertyName: "menuComponent", first: true, predicate: PoMenuComponent, descendants: true }, { propertyName: "menuSubItems", predicate: ["menusubmenuitem"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<nav #navElement class=\"po-header-nav\">\n  <div #menuWrapperBrand>\n    <po-header-brand\n      [p-brand]=\"brand\"\n      (p-click-menu)=\"onClickMenu()\"\n      [p-menus]=\"menuCollapseJoin\"\n      [p-external]=\"applicationMenu\"\n      [p-hide-button-menu]=\"hideButtonMenu\"\n    ></po-header-brand>\n  </div>\n\n  <ul #menuWrapperItens class=\"po-header-nav-submenus-wrapper\">\n    @for (item of visibleMenuItems; track item.id) {\n      <po-header-menu-item #menusubmenuitem [p-item]=\"item\" (p-item-click)=\"onSelected($event)\"></po-header-menu-item>\n    }\n  </ul>\n\n  @if (showOverflow && overflowItems.length) {\n    <po-header-menu-item\n      #overflowButton\n      #menusubmenuitem\n      [p-button-overflow]=\"true\"\n      [p-item-overflow]=\"overflowItems\"\n      (p-item-click)=\"onSelected($event)\"\n    ></po-header-menu-item>\n  }\n\n  <ul #menuWrapperTools class=\"po-header-tools-wrapper\">\n    <po-header-tools\n      [p-force-actions-tools]=\"forceActionTools\"\n      [p-actions-tools]=\"actionsTools\"\n      [p-header-template]=\"headerTemplate\"\n      [p-literals]=\"literals\"\n    ></po-header-tools>\n\n    @if (headerUser?.customerBrand && headerUser?.avatar) {\n      <po-header-customer [p-header-user]=\"headerUser\"></po-header-customer>\n    }\n  </ul>\n</nav>\n\n@if (!sideMenuOnlyAction && !applicationMenu && menuCollapseJoin.length) {\n  <div class=\"po-header-overlay\" [class.show]=\"showMenu\" (click)=\"onCloseMenu()\"></div>\n\n  <aside class=\"po-header-side-menu\" [class.open]=\"showMenu\">\n    <div class=\"po-header-sidemenu-outer\">\n      <po-menu\n        [p-only-menu-item]=\"true\"\n        [p-menus]=\"menuCollapseJoin\"\n        [p-filter]=\"filterMenu\"\n        p-menu-id=\"po-header-nav-bar\"\n      >\n        <div *p-menu-header-template>\n          <ng-template *ngTemplateOutlet=\"menuHeaderTemplate?.templateRef\"></ng-template>\n        </div>\n      </po-menu>\n    </div>\n  </aside>\n}\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PoMenuComponent, selector: "po-menu" }, { kind: "directive", type: PoMenuHeaderTemplateDirective, selector: "[p-menu-header-template]" }, { kind: "component", type: PoHeaderbrandComponent, selector: "po-header-brand", inputs: ["p-brand", "p-hide-button-menu", "p-menus", "p-external"], outputs: ["p-click-menu"] }, { kind: "component", type: PoHeaderMenuItemComponent, selector: "po-header-menu-item", inputs: ["p-item", "p-item-overflow", "p-button-overflow"], outputs: ["p-item-click"] }, { kind: "component", type: PoHeaderToolsComponent, selector: "po-header-tools", inputs: ["p-force-actions-tools", "p-actions-tools", "p-literals", "p-header-template"] }, { kind: "component", type: PoHeaderCustomerComponent, selector: "po-header-customer", inputs: ["p-header-user"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: PoHeaderComponent, isStandalone: false, selector: "po-header", queries: [{ propertyName: "menuHeaderTemplate", first: true, predicate: PoMenuHeaderTemplateDirective, descendants: true, static: true }], viewQueries: [{ propertyName: "buttonFirstAction", first: true, predicate: ["buttonFirstAction"], descendants: true, read: ElementRef }, { propertyName: "navElement", first: true, predicate: ["navElement"], descendants: true, read: ElementRef }, { propertyName: "menuWrapperBrand", first: true, predicate: ["menuWrapperBrand"], descendants: true }, { propertyName: "menuWrapperTools", first: true, predicate: ["menuWrapperTools"], descendants: true }, { propertyName: "overflowButton", first: true, predicate: ["overflowButton"], descendants: true, static: true }, { propertyName: "overflowButtonComponentEl", first: true, predicate: ["overflowButton"], descendants: true }, { propertyName: "menuComponent", first: true, predicate: PoMenuComponent, descendants: true }, { propertyName: "menuSubItems", predicate: ["menusubmenuitem"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<nav #navElement class=\"po-header-nav\">\n  <div #menuWrapperBrand>\n    <po-header-brand\n      [p-brand]=\"brand\"\n      (p-click-menu)=\"onClickMenu()\"\n      [p-menus]=\"menuCollapseJoin\"\n      [p-external]=\"applicationMenu\"\n      [p-hide-button-menu]=\"hideButtonMenu\"\n      [p-size]=\"size()\"\n    ></po-header-brand>\n  </div>\n\n  <ul #menuWrapperItens class=\"po-header-nav-submenus-wrapper\">\n    @for (item of visibleMenuItems; track item.id) {\n      <po-header-menu-item\n        #menusubmenuitem\n        [p-item]=\"item\"\n        (p-item-click)=\"onSelected($event)\"\n        [p-size]=\"size()\"\n      ></po-header-menu-item>\n    }\n  </ul>\n\n  @if (showOverflow && overflowItems.length) {\n    <po-header-menu-item\n      #overflowButton\n      #menusubmenuitem\n      [p-button-overflow]=\"true\"\n      [p-item-overflow]=\"overflowItems\"\n      (p-item-click)=\"onSelected($event)\"\n      [p-size]=\"size()\"\n    ></po-header-menu-item>\n  }\n\n  <ul #menuWrapperTools class=\"po-header-tools-wrapper\">\n    <po-header-tools\n      [p-force-actions-tools]=\"forceActionTools\"\n      [p-actions-tools]=\"actionsTools\"\n      [p-header-template]=\"headerTemplate\"\n      [p-literals]=\"literals\"\n      [p-size]=\"size()\"\n    ></po-header-tools>\n\n    @if (headerUser?.customerBrand && headerUser?.avatar) {\n      <po-header-customer [p-header-user]=\"headerUser\" [p-size]=\"size()\"></po-header-customer>\n    }\n  </ul>\n</nav>\n\n@if (!sideMenuOnlyAction && !applicationMenu && menuCollapseJoin.length) {\n  <div class=\"po-header-overlay\" [class.show]=\"showMenu\" (click)=\"onCloseMenu()\"></div>\n\n  <aside class=\"po-header-side-menu\" [class.open]=\"showMenu\">\n    <div class=\"po-header-sidemenu-outer\">\n      <po-menu\n        [p-only-menu-item]=\"true\"\n        [p-menus]=\"menuCollapseJoin\"\n        [p-filter]=\"filterMenu\"\n        p-menu-id=\"po-header-nav-bar\"\n      >\n        <div *p-menu-header-template>\n          <ng-template *ngTemplateOutlet=\"menuHeaderTemplate?.templateRef\"></ng-template>\n        </div>\n      </po-menu>\n    </div>\n  </aside>\n}\n", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PoMenuComponent, selector: "po-menu" }, { kind: "directive", type: PoMenuHeaderTemplateDirective, selector: "[p-menu-header-template]" }, { kind: "component", type: PoHeaderbrandComponent, selector: "po-header-brand", inputs: ["p-brand", "p-hide-button-menu", "p-menus", "p-external", "p-size"], outputs: ["p-click-menu"] }, { kind: "component", type: PoHeaderMenuItemComponent, selector: "po-header-menu-item", inputs: ["p-item", "p-item-overflow", "p-button-overflow", "p-size"], outputs: ["p-item-click"] }, { kind: "component", type: PoHeaderToolsComponent, selector: "po-header-tools", inputs: ["p-force-actions-tools", "p-actions-tools", "p-literals", "p-size", "p-header-template"] }, { kind: "component", type: PoHeaderCustomerComponent, selector: "po-header-customer", inputs: ["p-header-user", "p-size"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: PoHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'po-header', standalone: false, template: "<nav #navElement class=\"po-header-nav\">\n  <div #menuWrapperBrand>\n    <po-header-brand\n      [p-brand]=\"brand\"\n      (p-click-menu)=\"onClickMenu()\"\n      [p-menus]=\"menuCollapseJoin\"\n      [p-external]=\"applicationMenu\"\n      [p-hide-button-menu]=\"hideButtonMenu\"\n    ></po-header-brand>\n  </div>\n\n  <ul #menuWrapperItens class=\"po-header-nav-submenus-wrapper\">\n    @for (item of visibleMenuItems; track item.id) {\n      <po-header-menu-item #menusubmenuitem [p-item]=\"item\" (p-item-click)=\"onSelected($event)\"></po-header-menu-item>\n    }\n  </ul>\n\n  @if (showOverflow && overflowItems.length) {\n    <po-header-menu-item\n      #overflowButton\n      #menusubmenuitem\n      [p-button-overflow]=\"true\"\n      [p-item-overflow]=\"overflowItems\"\n      (p-item-click)=\"onSelected($event)\"\n    ></po-header-menu-item>\n  }\n\n  <ul #menuWrapperTools class=\"po-header-tools-wrapper\">\n    <po-header-tools\n      [p-force-actions-tools]=\"forceActionTools\"\n      [p-actions-tools]=\"actionsTools\"\n      [p-header-template]=\"headerTemplate\"\n      [p-literals]=\"literals\"\n    ></po-header-tools>\n\n    @if (headerUser?.customerBrand && headerUser?.avatar) {\n      <po-header-customer [p-header-user]=\"headerUser\"></po-header-customer>\n    }\n  </ul>\n</nav>\n\n@if (!sideMenuOnlyAction && !applicationMenu && menuCollapseJoin.length) {\n  <div class=\"po-header-overlay\" [class.show]=\"showMenu\" (click)=\"onCloseMenu()\"></div>\n\n  <aside class=\"po-header-side-menu\" [class.open]=\"showMenu\">\n    <div class=\"po-header-sidemenu-outer\">\n      <po-menu\n        [p-only-menu-item]=\"true\"\n        [p-menus]=\"menuCollapseJoin\"\n        [p-filter]=\"filterMenu\"\n        p-menu-id=\"po-header-nav-bar\"\n      >\n        <div *p-menu-header-template>\n          <ng-template *ngTemplateOutlet=\"menuHeaderTemplate?.templateRef\"></ng-template>\n        </div>\n      </po-menu>\n    </div>\n  </aside>\n}\n" }]
+            args: [{ selector: 'po-header', standalone: false, template: "<nav #navElement class=\"po-header-nav\">\n  <div #menuWrapperBrand>\n    <po-header-brand\n      [p-brand]=\"brand\"\n      (p-click-menu)=\"onClickMenu()\"\n      [p-menus]=\"menuCollapseJoin\"\n      [p-external]=\"applicationMenu\"\n      [p-hide-button-menu]=\"hideButtonMenu\"\n      [p-size]=\"size()\"\n    ></po-header-brand>\n  </div>\n\n  <ul #menuWrapperItens class=\"po-header-nav-submenus-wrapper\">\n    @for (item of visibleMenuItems; track item.id) {\n      <po-header-menu-item\n        #menusubmenuitem\n        [p-item]=\"item\"\n        (p-item-click)=\"onSelected($event)\"\n        [p-size]=\"size()\"\n      ></po-header-menu-item>\n    }\n  </ul>\n\n  @if (showOverflow && overflowItems.length) {\n    <po-header-menu-item\n      #overflowButton\n      #menusubmenuitem\n      [p-button-overflow]=\"true\"\n      [p-item-overflow]=\"overflowItems\"\n      (p-item-click)=\"onSelected($event)\"\n      [p-size]=\"size()\"\n    ></po-header-menu-item>\n  }\n\n  <ul #menuWrapperTools class=\"po-header-tools-wrapper\">\n    <po-header-tools\n      [p-force-actions-tools]=\"forceActionTools\"\n      [p-actions-tools]=\"actionsTools\"\n      [p-header-template]=\"headerTemplate\"\n      [p-literals]=\"literals\"\n      [p-size]=\"size()\"\n    ></po-header-tools>\n\n    @if (headerUser?.customerBrand && headerUser?.avatar) {\n      <po-header-customer [p-header-user]=\"headerUser\" [p-size]=\"size()\"></po-header-customer>\n    }\n  </ul>\n</nav>\n\n@if (!sideMenuOnlyAction && !applicationMenu && menuCollapseJoin.length) {\n  <div class=\"po-header-overlay\" [class.show]=\"showMenu\" (click)=\"onCloseMenu()\"></div>\n\n  <aside class=\"po-header-side-menu\" [class.open]=\"showMenu\">\n    <div class=\"po-header-sidemenu-outer\">\n      <po-menu\n        [p-only-menu-item]=\"true\"\n        [p-menus]=\"menuCollapseJoin\"\n        [p-filter]=\"filterMenu\"\n        p-menu-id=\"po-header-nav-bar\"\n      >\n        <div *p-menu-header-template>\n          <ng-template *ngTemplateOutlet=\"menuHeaderTemplate?.templateRef\"></ng-template>\n        </div>\n      </po-menu>\n    </div>\n  </aside>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: PoMenuGlobalService }, { type: PoLanguageService }], propDecorators: { buttonFirstAction: [{
                 type: ViewChild,
                 args: ['buttonFirstAction', { read: ElementRef }]
@@ -60475,6 +60713,7 @@ const PO_MODULES = [
     PoCalendarModule,
     PoChartModule,
     PoContainerModule,
+    PoContextMenuModule,
     PoDisclaimerGroupModule,
     PoDisclaimerModule,
     PoDividerModule,
@@ -60529,6 +60768,7 @@ class PoComponentsModule {
             PoCalendarModule,
             PoChartModule,
             PoContainerModule,
+            PoContextMenuModule,
             PoDisclaimerGroupModule,
             PoDisclaimerModule,
             PoDividerModule,
@@ -60579,6 +60819,7 @@ class PoComponentsModule {
             PoCalendarModule,
             PoChartModule,
             PoContainerModule,
+            PoContextMenuModule,
             PoDisclaimerGroupModule,
             PoDisclaimerModule,
             PoDividerModule,
@@ -60630,6 +60871,7 @@ class PoComponentsModule {
             PoCalendarModule,
             PoChartModule,
             PoContainerModule,
+            PoContextMenuModule,
             PoDisclaimerGroupModule,
             PoDisclaimerModule,
             PoDividerModule,
@@ -61687,5 +61929,5 @@ function validateProperty(property, target) {
  * Generated bundle index. Do not edit.
  */
 
-export { AnimaliaIconDictionary, ForceBooleanComponentEnum, ForceOptionComponentEnum, I18N_CONFIG, InputBoolean, InputRequired, LOADING_ICON_COMPONENT, PO_CONTROL_POSITIONS, PoAccordionComponent, PoAccordionItemComponent, PoAccordionModule, PoActiveOverlayModule, PoActiveOverlayService, PoAvatarComponent, PoAvatarModule, PoBadgeComponent, PoBadgeModule, PoBreadcrumbComponent, PoBreadcrumbModule, PoButtonComponent, PoButtonGroupComponent, PoButtonGroupModule, PoButtonGroupToggle, PoButtonKind, PoButtonModule, PoButtonSize, PoButtonType, PoCalendarComponent, PoCalendarMode, PoCalendarModule, PoChartComponent, PoChartLabelFormat, PoChartModule, PoChartType, PoCheckboxComponent, PoCheckboxGroupComponent, PoCheckboxGroupModule, PoCheckboxModule, PoCheckboxSize, PoCleanComponent, PoCleanModule, PoColorPaletteModule, PoColorPaletteService, PoComboComponent, PoComboFilterMode, PoComboModule, PoComboOptionTemplateDirective, PoComponentInjectorModule, PoComponentInjectorService, PoComponentsModule, PoContainerComponent, PoContainerModule, PoContextTabButtonComponent, PoContextTabsComponent, PoContextTabsModule, PoControlPositionModule, PoDateService, PoDateTimeModule, PoDatepickerComponent, PoDatepickerIsoFormat, PoDatepickerModule, PoDatepickerRangeComponent, PoDecimalComponent, PoDialogComponent, PoDialogModule, PoDialogService, PoDialogType, PoDirectivesModule, PoDisclaimerComponent, PoDisclaimerGroupComponent, PoDisclaimerGroupModule, PoDisclaimerModule, PoDividerComponent, PoDividerModule, PoDividerSize, PoDropdownComponent, PoDropdownModule, PoDynamicContainerComponent, PoDynamicFieldType, PoDynamicFormComponent, PoDynamicModule, PoDynamicSharedBase, PoDynamicViewComponent, PoEmailComponent, PoFieldContainerBottomComponent, PoFieldContainerComponent, PoFieldContainerModule, PoFieldModule, PoGaugeComponent, PoGaugeModule, PoGridComponent, PoGridModule, PoGuardsModule, PoHeaderComponent, PoHeaderModule, PoHelperComponent, PoHelperModule, PoHttpInterceptorModule, PoHttpInterceptorService, PoHttpRequestInterceptorService, PoHttpRequestModule, PoI18nModule, PoI18nPipe, PoI18nService, PoIconComponent, PoIconModule, PoImageComponent, PoImageModule, PoInfoComponent, PoInfoModule, PoInfoOrientation, PoInputComponent, PoInterceptorsModule, PoItemListComponent, PoLabelComponent, PoLabelModule, PoLanguageModule, PoLanguageService, PoLinkComponent, PoLinkModule, PoListBoxComponent, PoListBoxModule, PoListViewComponent, PoListViewContentTemplateDirective, PoListViewDetailTemplateDirective, PoListViewModule, PoLoadingComponent, PoLoadingIconComponent, PoLoadingModule, PoLoadingOverlayComponent, PoLoginComponent, PoLogoComponent, PoLogoModule, PoLookupComponent, PoLookupModalComponent, PoMask, PoMediaQueryModule, PoMediaQueryService, PoMenuComponent, PoMenuGlobalService, PoMenuHeaderTemplateDirective, PoMenuModule, PoMenuPanelComponent, PoMenuPanelModule, PoModalComponent, PoModalFooterComponent, PoModalModule, PoModule, PoMultiselectComponent, PoMultiselectFilterMode, PoMultiselectOptionTemplateDirective, PoNavbarComponent, PoNavbarModule, PoNotificationModule, PoNotificationService, PoNumberComponent, PoOverlayComponent, PoOverlayModule, PoPageDefaultComponent, PoPageDetailComponent, PoPageEditComponent, PoPageListComponent, PoPageModule, PoPageSlideComponent, PoPageSlideFooterComponent, PoPageSlideModule, PoPasswordComponent, PoPipesModule, PoPopoverComponent, PoPopoverModule, PoPopupComponent, PoPopupModule, PoProgressComponent, PoProgressModule, PoProgressSize, PoProgressStatus, PoRadioComponent, PoRadioGroupComponent, PoRadioGroupModule, PoRadioModule, PoRichTextComponent, PoRichTextToolbarActions, PoSearchComponent, PoSearchFilterMode, PoSearchListComponent, PoSearchModule, PoSelectComponent, PoServicesModule, PoSkeletonAnimation, PoSkeletonComponent, PoSkeletonModule, PoSkeletonSize, PoSkeletonType, PoSkeletonVariant, PoSlideComponent, PoSlideContentTemplateDirective, PoSlideModule, PoStepComponent, PoStepperComponent, PoStepperModule, PoStepperOrientation, PoStepperStatus, PoSwitchComponent, PoSwitchLabelPosition, PoSwitchModule, PoTabButtonComponent, PoTabComponent, PoTabDropdownComponent, PoTableCellTemplateDirective, PoTableColumnFrozenDirective, PoTableColumnSortType, PoTableColumnSpacing, PoTableColumnTemplateDirective, PoTableComponent, PoTableModule, PoTableRowTemplateArrowDirection, PoTableRowTemplateDirective, PoTabsComponent, PoTabsModule, PoTabsService, PoTagComponent, PoTagModule, PoTagOrientation, PoTagType, PoTextareaComponent, PoThemeA11yEnum, PoThemeModule, PoThemeService, PoThemeTypeEnum, PoTimeModule, PoTimePipe, PoToasterComponent, PoToasterMode, PoToasterModule, PoToasterOrientation, PoToasterType, PoToolbarComponent, PoToolbarModule, PoTooltipDirective, PoTooltipModule, PoTreeViewComponent, PoTreeViewModule, PoUploadComponent, PoUploadFile, PoUploadStatus, PoUrlComponent, PoWidgetComponent, PoWidgetModule, initializeLanguageDefault, mergePoI18nConfigs, poBreadcrumbLiterals, poChartLiteralsDefault, poDialogAlertLiteralsDefault, poDialogConfirmLiteralsDefault, poLanguageDefault, poLocaleDateSeparatorList, poLocaleDecimalSeparatorList, poLocaleDefault, poLocaleThousandSeparatorList, poLocales, poPageSlideLiteralsDefault, poTabsLiterals, poThemeDefault, poThemeDefaultAA, poThemeDefaultAAA, poThemeDefaultActions, poThemeDefaultActionsDark, poThemeDefaultBrands, poThemeDefaultBrandsDark, poThemeDefaultCategoricals, poThemeDefaultCategoricalsAA, poThemeDefaultCategoricalsDark, poThemeDefaultCategoricalsDarkAA, poThemeDefaultCategoricalsOverlayDark, poThemeDefaultCategoricalsOverlayDarkAA, poThemeDefaultDark, poThemeDefaultDarkValues, poThemeDefaultDarkValuesAA, poThemeDefaultFeedback, poThemeDefaultFeedbackDark, poThemeDefaultLight, poThemeDefaultLightValues, poThemeDefaultLightValuesAA, poThemeDefaultNeutrals, poThemeDefaultNeutralsDark, poThemeDefaultOverlayCategoricals, poThemeDefaultOverlayCategoricalsAA, poToasterLiterals, returnPoI18nService };
+export { AnimaliaIconDictionary, ForceBooleanComponentEnum, ForceOptionComponentEnum, I18N_CONFIG, InputBoolean, InputRequired, LOADING_ICON_COMPONENT, PO_CONTROL_POSITIONS, PoAccordionComponent, PoAccordionItemComponent, PoAccordionModule, PoActiveOverlayModule, PoActiveOverlayService, PoAvatarComponent, PoAvatarModule, PoBadgeComponent, PoBadgeModule, PoBreadcrumbComponent, PoBreadcrumbModule, PoButtonComponent, PoButtonGroupComponent, PoButtonGroupModule, PoButtonGroupToggle, PoButtonKind, PoButtonModule, PoButtonSize, PoButtonType, PoCalendarComponent, PoCalendarMode, PoCalendarModule, PoChartComponent, PoChartLabelFormat, PoChartModule, PoChartType, PoCheckboxComponent, PoCheckboxGroupComponent, PoCheckboxGroupModule, PoCheckboxModule, PoCheckboxSize, PoCleanComponent, PoCleanModule, PoColorPaletteModule, PoColorPaletteService, PoComboComponent, PoComboFilterMode, PoComboModule, PoComboOptionTemplateDirective, PoComponentInjectorModule, PoComponentInjectorService, PoComponentsModule, PoContainerComponent, PoContainerModule, PoContextMenuComponent, PoContextMenuModule, PoContextTabButtonComponent, PoContextTabsComponent, PoContextTabsModule, PoControlPositionModule, PoDateService, PoDateTimeModule, PoDatepickerComponent, PoDatepickerIsoFormat, PoDatepickerModule, PoDatepickerRangeComponent, PoDecimalComponent, PoDialogComponent, PoDialogModule, PoDialogService, PoDialogType, PoDirectivesModule, PoDisclaimerComponent, PoDisclaimerGroupComponent, PoDisclaimerGroupModule, PoDisclaimerModule, PoDividerComponent, PoDividerModule, PoDividerSize, PoDropdownComponent, PoDropdownModule, PoDynamicContainerComponent, PoDynamicFieldType, PoDynamicFormComponent, PoDynamicModule, PoDynamicSharedBase, PoDynamicViewComponent, PoEmailComponent, PoFieldContainerBottomComponent, PoFieldContainerComponent, PoFieldContainerModule, PoFieldModule, PoGaugeComponent, PoGaugeModule, PoGridComponent, PoGridModule, PoGuardsModule, PoHeaderComponent, PoHeaderModule, PoHelperComponent, PoHelperModule, PoHttpInterceptorModule, PoHttpInterceptorService, PoHttpRequestInterceptorService, PoHttpRequestModule, PoI18nModule, PoI18nPipe, PoI18nService, PoIconComponent, PoIconModule, PoImageComponent, PoImageModule, PoInfoComponent, PoInfoModule, PoInfoOrientation, PoInputComponent, PoInterceptorsModule, PoItemListComponent, PoLabelComponent, PoLabelModule, PoLanguageModule, PoLanguageService, PoLinkComponent, PoLinkModule, PoListBoxComponent, PoListBoxModule, PoListViewComponent, PoListViewContentTemplateDirective, PoListViewDetailTemplateDirective, PoListViewModule, PoLoadingComponent, PoLoadingIconComponent, PoLoadingModule, PoLoadingOverlayComponent, PoLoginComponent, PoLogoComponent, PoLogoModule, PoLookupComponent, PoLookupModalComponent, PoMask, PoMediaQueryModule, PoMediaQueryService, PoMenuComponent, PoMenuGlobalService, PoMenuHeaderTemplateDirective, PoMenuModule, PoMenuPanelComponent, PoMenuPanelModule, PoModalComponent, PoModalFooterComponent, PoModalModule, PoModule, PoMultiselectComponent, PoMultiselectFilterMode, PoMultiselectOptionTemplateDirective, PoNavbarComponent, PoNavbarModule, PoNotificationModule, PoNotificationService, PoNumberComponent, PoOverlayComponent, PoOverlayModule, PoPageDefaultComponent, PoPageDetailComponent, PoPageEditComponent, PoPageListComponent, PoPageModule, PoPageSlideComponent, PoPageSlideFooterComponent, PoPageSlideModule, PoPasswordComponent, PoPipesModule, PoPopoverComponent, PoPopoverModule, PoPopupComponent, PoPopupModule, PoProgressComponent, PoProgressModule, PoProgressSize, PoProgressStatus, PoRadioComponent, PoRadioGroupComponent, PoRadioGroupModule, PoRadioModule, PoRichTextComponent, PoRichTextToolbarActions, PoSearchComponent, PoSearchFilterMode, PoSearchListComponent, PoSearchModule, PoSelectComponent, PoServicesModule, PoSkeletonAnimation, PoSkeletonComponent, PoSkeletonModule, PoSkeletonSize, PoSkeletonType, PoSkeletonVariant, PoSlideComponent, PoSlideContentTemplateDirective, PoSlideModule, PoStepComponent, PoStepperComponent, PoStepperModule, PoStepperOrientation, PoStepperStatus, PoSwitchComponent, PoSwitchLabelPosition, PoSwitchModule, PoTabButtonComponent, PoTabComponent, PoTabDropdownComponent, PoTableCellTemplateDirective, PoTableColumnFrozenDirective, PoTableColumnSortType, PoTableColumnSpacing, PoTableColumnTemplateDirective, PoTableComponent, PoTableModule, PoTableRowTemplateArrowDirection, PoTableRowTemplateDirective, PoTabsComponent, PoTabsModule, PoTabsService, PoTagComponent, PoTagModule, PoTagOrientation, PoTagType, PoTextareaComponent, PoThemeA11yEnum, PoThemeModule, PoThemeService, PoThemeTypeEnum, PoTimeModule, PoTimePipe, PoToasterComponent, PoToasterMode, PoToasterModule, PoToasterOrientation, PoToasterType, PoToolbarComponent, PoToolbarModule, PoTooltipDirective, PoTooltipModule, PoTreeViewComponent, PoTreeViewModule, PoUploadComponent, PoUploadFile, PoUploadStatus, PoUrlComponent, PoWidgetComponent, PoWidgetModule, initializeLanguageDefault, mergePoI18nConfigs, poBreadcrumbLiterals, poChartLiteralsDefault, poDialogAlertLiteralsDefault, poDialogConfirmLiteralsDefault, poLanguageDefault, poLocaleDateSeparatorList, poLocaleDecimalSeparatorList, poLocaleDefault, poLocaleThousandSeparatorList, poLocales, poPageSlideLiteralsDefault, poTabsLiterals, poThemeDefault, poThemeDefaultAA, poThemeDefaultAAA, poThemeDefaultActions, poThemeDefaultActionsDark, poThemeDefaultBrands, poThemeDefaultBrandsDark, poThemeDefaultCategoricals, poThemeDefaultCategoricalsAA, poThemeDefaultCategoricalsDark, poThemeDefaultCategoricalsDarkAA, poThemeDefaultCategoricalsOverlayDark, poThemeDefaultCategoricalsOverlayDarkAA, poThemeDefaultDark, poThemeDefaultDarkValues, poThemeDefaultDarkValuesAA, poThemeDefaultFeedback, poThemeDefaultFeedbackDark, poThemeDefaultLight, poThemeDefaultLightValues, poThemeDefaultLightValuesAA, poThemeDefaultNeutrals, poThemeDefaultNeutralsDark, poThemeDefaultOverlayCategoricals, poThemeDefaultOverlayCategoricalsAA, poToasterLiterals, returnPoI18nService };
 //# sourceMappingURL=po-ui-ng-components.mjs.map