@po-ui/ng-components 19.23.0 → 19.24.0

package/lib/components/components.module.d.ts

@@ -34,20 +34,21 @@ import * as i32 from "./po-slide/po-slide.module";
 import * as i33 from "./po-stepper/po-stepper.module";
 import * as i34 from "./po-table/po-table.module";
 import * as i35 from "./po-tabs/po-tabs.module";
-import * as i36 from "./po-tag/po-tag.module";
-import * as i37 from "./po-toolbar/po-toolbar.module";
-import * as i38 from "./po-tree-view/po-tree-view.module";
-import * as i39 from "./po-widget/po-widget.module";
-import * as i40 from "./po-link/po-link.module";
-import * as i41 from "./po-label/po-label.module";
-import * as i42 from "./po-image/po-image.module";
-import * as i43 from "./po-page/po-page-slide/po-page-slide.module";
-import * as i44 from "./po-field/po-switch/po-switch.module";
-import * as i45 from "./po-search/po-search.module";
-import * as i46 from "./po-badge/po-badge.module";
-import * as i47 from "./po-toaster/po-toaster.module";
+import * as i36 from "./po-context-tabs/po-context-tabs.module";
+import * as i37 from "./po-tag/po-tag.module";
+import * as i38 from "./po-toolbar/po-toolbar.module";
+import * as i39 from "./po-tree-view/po-tree-view.module";
+import * as i40 from "./po-widget/po-widget.module";
+import * as i41 from "./po-link/po-link.module";
+import * as i42 from "./po-label/po-label.module";
+import * as i43 from "./po-image/po-image.module";
+import * as i44 from "./po-page/po-page-slide/po-page-slide.module";
+import * as i45 from "./po-field/po-switch/po-switch.module";
+import * as i46 from "./po-search/po-search.module";
+import * as i47 from "./po-badge/po-badge.module";
+import * as i48 from "./po-toaster/po-toaster.module";
 export declare class PoComponentsModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<PoComponentsModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<PoComponentsModule, never, [typeof i1.PoAccordionModule, typeof i2.PoAvatarModule, typeof i3.PoBreadcrumbModule, typeof i4.PoButtonModule, typeof i5.PoButtonGroupModule, typeof i6.PoCalendarModule, typeof i7.PoChartModule, typeof i8.PoContainerModule, typeof i9.PoDisclaimerGroupModule, typeof i10.PoDisclaimerModule, typeof i11.PoDividerModule, typeof i12.PoDropdownModule, typeof i13.PoDynamicModule, typeof i14.PoFieldModule, typeof i15.PoGaugeModule, typeof i16.PoGridModule, typeof i17.PoIconModule, typeof i18.PoInfoModule, typeof i19.PoListViewModule, typeof i20.PoListBoxModule, typeof i21.PoLoadingModule, typeof i22.PoLogoModule, typeof i23.PoMenuModule, typeof i24.PoMenuPanelModule, typeof i25.PoModalModule, typeof i26.PoNavbarModule, typeof i27.PoOverlayModule, typeof i28.PoPageModule, typeof i29.PoPopoverModule, typeof i30.PoPopupModule, typeof i31.PoProgressModule, typeof i32.PoSlideModule, typeof i33.PoStepperModule, typeof i34.PoTableModule, typeof i35.PoTabsModule, typeof i36.PoTagModule, typeof i37.PoToolbarModule, typeof i38.PoTreeViewModule, typeof i39.PoWidgetModule, typeof i40.PoLinkModule, typeof i41.PoLabelModule, typeof i42.PoImageModule, typeof i43.PoPageSlideModule, typeof i44.PoSwitchModule, typeof i45.PoSearchModule, typeof i46.PoBadgeModule, typeof i47.PoToasterModule], [typeof i1.PoAccordionModule, typeof i2.PoAvatarModule, typeof i3.PoBreadcrumbModule, typeof i4.PoButtonModule, typeof i5.PoButtonGroupModule, typeof i6.PoCalendarModule, typeof i7.PoChartModule, typeof i8.PoContainerModule, typeof i9.PoDisclaimerGroupModule, typeof i10.PoDisclaimerModule, typeof i11.PoDividerModule, typeof i12.PoDropdownModule, typeof i13.PoDynamicModule, typeof i14.PoFieldModule, typeof i15.PoGaugeModule, typeof i16.PoGridModule, typeof i17.PoIconModule, typeof i18.PoInfoModule, typeof i19.PoListViewModule, typeof i20.PoListBoxModule, typeof i21.PoLoadingModule, typeof i22.PoLogoModule, typeof i23.PoMenuModule, typeof i24.PoMenuPanelModule, typeof i25.PoModalModule, typeof i26.PoNavbarModule, typeof i27.PoOverlayModule, typeof i28.PoPageModule, typeof i29.PoPopoverModule, typeof i30.PoPopupModule, typeof i31.PoProgressModule, typeof i32.PoSlideModule, typeof i33.PoStepperModule, typeof i34.PoTableModule, typeof i35.PoTabsModule, typeof i36.PoTagModule, typeof i37.PoToolbarModule, typeof i38.PoTreeViewModule, typeof i39.PoWidgetModule, typeof i40.PoLinkModule, typeof i41.PoLabelModule, typeof i42.PoImageModule, typeof i43.PoPageSlideModule, typeof i44.PoSwitchModule, typeof i45.PoSearchModule, typeof i46.PoBadgeModule, typeof i47.PoToasterModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PoComponentsModule, never, [typeof i1.PoAccordionModule, typeof i2.PoAvatarModule, typeof i3.PoBreadcrumbModule, typeof i4.PoButtonModule, typeof i5.PoButtonGroupModule, typeof i6.PoCalendarModule, typeof i7.PoChartModule, typeof i8.PoContainerModule, typeof i9.PoDisclaimerGroupModule, typeof i10.PoDisclaimerModule, typeof i11.PoDividerModule, typeof i12.PoDropdownModule, typeof i13.PoDynamicModule, typeof i14.PoFieldModule, typeof i15.PoGaugeModule, typeof i16.PoGridModule, typeof i17.PoIconModule, typeof i18.PoInfoModule, typeof i19.PoListViewModule, typeof i20.PoListBoxModule, typeof i21.PoLoadingModule, typeof i22.PoLogoModule, typeof i23.PoMenuModule, typeof i24.PoMenuPanelModule, typeof i25.PoModalModule, typeof i26.PoNavbarModule, typeof i27.PoOverlayModule, typeof i28.PoPageModule, typeof i29.PoPopoverModule, typeof i30.PoPopupModule, typeof i31.PoProgressModule, typeof i32.PoSlideModule, typeof i33.PoStepperModule, typeof i34.PoTableModule, typeof i35.PoTabsModule, typeof i36.PoContextTabsModule, typeof i37.PoTagModule, typeof i38.PoToolbarModule, typeof i39.PoTreeViewModule, typeof i40.PoWidgetModule, typeof i41.PoLinkModule, typeof i42.PoLabelModule, typeof i43.PoImageModule, typeof i44.PoPageSlideModule, typeof i45.PoSwitchModule, typeof i46.PoSearchModule, typeof i47.PoBadgeModule, typeof i48.PoToasterModule], [typeof i1.PoAccordionModule, typeof i2.PoAvatarModule, typeof i3.PoBreadcrumbModule, typeof i4.PoButtonModule, typeof i5.PoButtonGroupModule, typeof i6.PoCalendarModule, typeof i7.PoChartModule, typeof i8.PoContainerModule, typeof i9.PoDisclaimerGroupModule, typeof i10.PoDisclaimerModule, typeof i11.PoDividerModule, typeof i12.PoDropdownModule, typeof i13.PoDynamicModule, typeof i14.PoFieldModule, typeof i15.PoGaugeModule, typeof i16.PoGridModule, typeof i17.PoIconModule, typeof i18.PoInfoModule, typeof i19.PoListViewModule, typeof i20.PoListBoxModule, typeof i21.PoLoadingModule, typeof i22.PoLogoModule, typeof i23.PoMenuModule, typeof i24.PoMenuPanelModule, typeof i25.PoModalModule, typeof i26.PoNavbarModule, typeof i27.PoOverlayModule, typeof i28.PoPageModule, typeof i29.PoPopoverModule, typeof i30.PoPopupModule, typeof i31.PoProgressModule, typeof i32.PoSlideModule, typeof i33.PoStepperModule, typeof i34.PoTableModule, typeof i36.PoContextTabsModule, typeof i35.PoTabsModule, typeof i37.PoTagModule, typeof i38.PoToolbarModule, typeof i39.PoTreeViewModule, typeof i40.PoWidgetModule, typeof i41.PoLinkModule, typeof i42.PoLabelModule, typeof i43.PoImageModule, typeof i44.PoPageSlideModule, typeof i45.PoSwitchModule, typeof i46.PoSearchModule, typeof i47.PoBadgeModule, typeof i48.PoToasterModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<PoComponentsModule>;
 }

package/lib/components/index.d.ts

@@ -38,6 +38,7 @@ export * from './po-progress/index';
 export * from './po-slide/index';
 export * from './po-stepper/index';
 export * from './po-table/index';
+export * from './po-context-tabs/index';
 export * from './po-tabs/index';
 export * from './po-tag/index';
 export * from './po-toolbar/index';

package/lib/components/po-context-tabs/index.d.ts

@@ -0,0 +1,3 @@
+export * from './po-context-tab-button/po-context-tab-button.component';
+export * from './po-context-tabs.component';
+export * from './po-context-tabs.module';

package/lib/components/po-context-tabs/po-context-tab-button/po-context-tab-button.component.d.ts

@@ -0,0 +1,26 @@
+import { AfterViewInit, EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
+import { PoTabButtonComponent } from '../../po-tabs/po-tab-button/po-tab-button.component';
+import * as i0 from "@angular/core";
+/**
+ * @docsPrivate
+ *
+ * @description
+ *
+ * Componente responsável por manipular os botões de aba.
+ */
+export declare class PoContextTabButtonComponent extends PoTabButtonComponent implements OnChanges, AfterViewInit {
+    hideClose: boolean;
+    showTooltip: boolean;
+    literals: any;
+    close: EventEmitter<any>;
+    changeVisible: EventEmitter<any>;
+    activeCloseIcon: boolean;
+    afterViewChecked: boolean;
+    ngAfterViewInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    closeTab(event: any): void;
+    onFocusIn(): void;
+    onFocusOut(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PoContextTabButtonComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PoContextTabButtonComponent, "po-context-tab-button", never, { "hideClose": { "alias": "p-hide-close"; "required": false; }; "showTooltip": { "alias": "p-show-tooltip"; "required": false; }; "literals": { "alias": "p-literals"; "required": false; }; }, { "close": "p-close"; "changeVisible": "p-change-visible"; }, never, never, false, never>;
+}

package/lib/components/po-context-tabs/po-context-tabs.component.d.ts

@@ -0,0 +1,81 @@
+import { PoTabComponent, PoTabsComponent } from '../po-tabs';
+import * as i0 from "@angular/core";
+/**
+ * @docsExtends PoTabsBaseComponent
+ *
+ * @description
+ *
+ * O componente `po-context-tabs` é responsável por agrupar [abas](/documentation/po-tab) dispostas numa linha horizontal,
+ * ideal para facilitar a organização de conteúdos.
+ *
+ * O componente exibirá as abas enquanto houver espaço na tela, caso a aba ultrapasse o limite da tela a mesma será agrupada em um dropdown.
+ *
+ * > As abas que estiverem agrupadas serão dispostas numa cascata suspensa que será exibida ao clicar no botão.
+ *
+ * É possível realizar a navegação entre as abas através da tecla SETAS(direita e esquerda) do teclado.
+ * Caso uma aba estiver desabilitada, não receberá foco de navegação.
+ *
+ * #### Boas práticas
+ *
+ * - Evite utilizar um `po-context-tabs` dentro de outro `po-context-tabs`;
+ * - Evite utilizar uma quantidade excessiva de abas, pois irá gerar um *scroll* muito longo no `dropdown`;
+ * - Evite `labels` extensos para as `tabs` pois podem quebrar seu *layout*, use `labels` diretas, curtas e intuitivas.
+ *
+ *
+ * @example
+ *
+ * <example name="po-context-tabs-basic" title="PO Context Tabs Basic">
+ *  <file name="sample-po-context-tabs-basic/sample-po-context-tabs-basic.component.html"> </file>
+ *  <file name="sample-po-context-tabs-basic/sample-po-context-tabs-basic.component.ts"> </file>
+ * </example>
+ *
+ * <example name="po-context-tabs-labs" title="PO Context Tabs Labs">
+ *  <file name="sample-po-context-tabs-labs/sample-po-context-tabs-labs.component.html"> </file>
+ *  <file name="sample-po-context-tabs-labs/sample-po-context-tabs-labs.component.ts"> </file>
+ * </example>
+ *
+ * <example name="po-context-tabs-travel" title="PO Context Tabs - Travel">
+ *  <file name="sample-po-context-tabs-travel/sample-po-context-tabs-travel.component.html"> </file>
+ *  <file name="sample-po-context-tabs-travel/sample-po-context-tabs-travel.component.ts"> </file>
+ * </example>
+ *
+ * <example name="po-context-tabs-business-conf" title="PO Context Tabs - Business Conference">
+ *  <file name="sample-po-context-tabs-business-conf/sample-po-context-tabs-business-conf.component.html"> </file>
+ *  <file name="sample-po-context-tabs-business-conf/sample-po-context-tabs-business-conf.component.ts"> </file>
+ * </example>
+ */
+export declare class PoContextTabsComponent extends PoTabsComponent {
+    byQuantityFunction: number;
+    initialTabsWidth: any[];
+    private sumOfWidth;
+    get isShowTabDropdown(): boolean;
+    get overflowedTabs(): any;
+    get tabs(): any;
+    closeTab(tab: PoTabComponent): void;
+    onChangeVisibilityTab(tab: PoTabComponent): void;
+    private afterRemoveTab;
+    calculateTabs(initializeCalculation?: boolean): void;
+    updateTabsState(initialState?: boolean, tabs?: PoTabComponent): void;
+    private checkChangesTabs;
+    onTabActiveByDropdown(tab: PoTabComponent, eventEmitter?: boolean): void;
+    /**
+     * Função que atribui o número de tabs fora do dropdown.
+     *
+     * Para utilizá-la é necessário ter a instância do componente no DOM, podendo ser utilizado o ViewChild da seguinte forma:
+     *
+     * ```
+     * import { PoContextTabsComponent } from '@po-ui/ng-components';
+     *
+     * ...
+     *
+     * @ViewChild('poContextTabs', { static: true }) poContextTabs: PoContextTabsComponent;
+     *
+     * changeQuantityTabs() {
+     *   this.poContextTabs.setQuantityTabsButton(1); //Número de context-tabs
+     * }
+     * ```
+     */
+    setQuantityTabsButton(number: number): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PoContextTabsComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PoContextTabsComponent, "po-context-tabs", never, {}, {}, never, ["*"], false, never>;
+}

package/lib/components/po-context-tabs/po-context-tabs.module.d.ts

@@ -0,0 +1,16 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./po-context-tabs.component";
+import * as i2 from "./po-context-tab-button/po-context-tab-button.component";
+import * as i3 from "@angular/common";
+import * as i4 from "../po-icon/po-icon.module";
+import * as i5 from "../../directives/po-tooltip/po-tooltip.module";
+import * as i6 from "../po-tabs/po-tabs.module";
+/**
+ * @description
+ * Módulo do componente po-context-tabs
+ */
+export declare class PoContextTabsModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<PoContextTabsModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PoContextTabsModule, [typeof i1.PoContextTabsComponent, typeof i2.PoContextTabButtonComponent], [typeof i3.CommonModule, typeof i4.PoIconModule, typeof i5.PoTooltipModule, typeof i6.PoTabsModule], [typeof i1.PoContextTabsComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<PoContextTabsModule>;
+}

package/lib/components/po-tabs/index.d.ts

@@ -2,4 +2,6 @@ export * from './po-tab/po-tab.component';
 export * from './po-tab/po-tab.interface';
 export * from './po-tabs.component';
 export * from './po-tabs.service';
+export * from './po-tab-button/po-tab-button.component';
+export * from './po-tab-dropdown/po-tab-dropdown.component';
 export * from './po-tabs.module';

package/lib/components/po-tabs/po-tab/po-tab-base.component.d.ts

@@ -8,13 +8,36 @@ import * as i0 from "@angular/core";
  * Com este componente é possível atribuir um rótulo para auxiliar na identificação do conteúdo, ativar para que o mesmo seja exibido,
  * desabilitar para impossibilitar o acesso, bem como ocultar para indisponibilizar a aba.
  *
- * > Para controlar a navegação entre diversas abas, utilizar o componente [`po-tabs`](/documentation/po-tabs).
+ * > Para controlar a navegação entre diversas abas, utilizar o componente [`po-tabs`](/documentation/po-tabs) ou [`po-context-tabs`](/documentation/po-context-tabs).
  */
 export declare abstract class PoTabBaseComponent {
     /** Rótulo da aba. */
     label: string;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Esconde o botão de fechar a aba.
+     *
+     * > Atenção: Propriedade disponível somente no `po-context-tabs`.
+     *
+     * @default `false`
+     */
+    hideClose: boolean;
     /** Método disparado ao clicar na aba. */
     click: EventEmitter<any>;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Evento disparado ao clicar no botão de fechar a aba.
+     *
+     * > Atenção: Propriedade disponível somente no `po-context-tabs`.
+     *
+     */
+    closeTab: EventEmitter<any>;
     id?: string;
     private _active?;
     private _disabled?;
@@ -51,11 +74,14 @@ export declare abstract class PoTabBaseComponent {
      *
      * Oculta a aba.
      *
+     * > Atenção: Para correto funcionamento do componente, indicamos essa propriedade para esconder e exibir e não *ngIf.
+     *
      * @default `false`
      */
     set hide(hide: boolean);
     get hide(): boolean;
     protected abstract setDisplayOnActive(): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoTabBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoTabBaseComponent, never, never, { "label": { "alias": "p-label"; "required": false; }; "active": { "alias": "p-active"; "required": false; }; "disabled": { "alias": "p-disabled"; "required": false; }; "hide": { "alias": "p-hide"; "required": false; }; }, { "click": "p-click"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoTabBaseComponent, never, never, { "label": { "alias": "p-label"; "required": false; }; "hideClose": { "alias": "p-hide-close"; "required": false; }; "active": { "alias": "p-active"; "required": false; }; "disabled": { "alias": "p-disabled"; "required": false; }; "hide": { "alias": "p-hide"; "required": false; }; }, { "click": "p-click"; "closeTab": "p-close-tab"; }, never, never, true, never>;
+    static ngAcceptInputType_hideClose: any;
 }

package/lib/components/po-tabs/po-tab/po-tab.component.d.ts

@@ -6,8 +6,10 @@ import * as i0 from "@angular/core";
  * @docsExtends PoTabBaseComponent
  */
 export declare class PoTabComponent extends PoTabBaseComponent implements AfterContentInit, OnChanges {
-    private elementRef;
+    elementRef: ElementRef;
     private tabsService;
+    removed: boolean;
+    showTooltip: boolean;
     constructor(elementRef: ElementRef, tabsService: PoTabsService);
     ngAfterContentInit(): void;
     ngOnChanges(changes: SimpleChanges): void;

package/lib/components/po-tabs/po-tab/po-tab.interface.d.ts

@@ -24,6 +24,17 @@ export interface PoTab {
      * Método disparado ao clicar na aba.
      */
     click?: Function;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Método disparado ao clicar no botão de fechar a aba.
+     *
+     * > Atenção: Propriedade disponível somente no `po-context-tabs`.
+     *
+     */
+    closeTab?: Function;
     /**
      * @optional
      *
@@ -40,6 +51,18 @@ export interface PoTab {
      * Oculta a aba.
      */
     hide?: boolean;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Esconde o botão de fechar a aba.
+     *
+     * > Atenção: Propriedade disponível somente no `po-context-tabs`.
+     *
+     * @default `false`
+     */
+    hideClose?: boolean;
     /** Rótulo da aba. */
     label: string;
 }

package/lib/components/po-tabs/po-tab-button/po-tab-button.component.d.ts

@@ -8,8 +8,8 @@ import * as i0 from "@angular/core";
  * Componente responsável por manipular os botões de aba.
  */
 export declare class PoTabButtonComponent implements OnChanges, AfterViewInit {
+    changeDetector: ChangeDetectorRef;
     private elementRef;
-    private changeDetector;
     tabButtom: ElementRef;
     disabled: boolean;
     id: string;
@@ -24,7 +24,7 @@ export declare class PoTabButtonComponent implements OnChanges, AfterViewInit {
     get active(): boolean;
     set hide(value: boolean);
     get hide(): boolean;
-    constructor(elementRef: ElementRef, changeDetector: ChangeDetectorRef);
+    constructor(changeDetector: ChangeDetectorRef, elementRef: ElementRef);
     ngAfterViewInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     onClick(): void;

package/lib/components/po-tabs/po-tabs-base.component.d.ts

@@ -3,22 +3,6 @@ import * as i0 from "@angular/core";
 /**
  * @description
  *
- * O componente `po-tabs` é responsável por agrupar [abas](/documentation/po-tab) dispostas numa linha horizontal,
- * ideal para facilitar a organização de conteúdos.
- *
- * O componente exibirá as abas enquanto houver espaço na tela, caso a aba ultrapasse o limite da tela a mesma será agrupada em um dropdown.
- *
- * > As abas que estiverem agrupadas serão dispostas numa cascata suspensa que será exibida ao clicar no botão.
- *
- * É possível realizar a navegação entre as abas através da tecla SETAS(direita e esquerda) do teclado.
- * Caso uma aba estiver desabilitada, não receberá foco de navegação.
- *
- * #### Boas práticas
- *
- * - Evite utilizar um `po-tabs` dentro de outro `po-tabs`;
- * - Evite utilizar uma quantidade excessiva de abas, pois irá gerar um *scroll* muito longo no `dropdown`;
- * - Evite `labels` extensos para as `tabs` pois podem quebrar seu *layout*, use `labels` diretas, curtas e intuitivas.
- *
  * #### Tokens customizáveis
  *
  * É possível alterar o estilo do componente usando os seguintes tokens (CSS):
@@ -52,6 +36,7 @@ import * as i0 from "@angular/core";
  * | **Selected**                           |                                                                                 |                                                   |
  * | `--background-item-selected`           | Cor de background do item selecionado                                           | `var(--color-brand-01-lightest)`                  |
  *
+ * <br>
  */
 export declare class PoTabsBaseComponent {
     protected poThemeService: PoThemeService;

package/lib/components/po-tabs/po-tabs.component.d.ts

@@ -10,6 +10,25 @@ export declare const poTabsLiterals: object;
 /**
  * @docsExtends PoTabsBaseComponent
  *
+ * @description
+ *
+ * O componente `po-tabs` é responsável por agrupar [abas](/documentation/po-tab) dispostas numa linha horizontal,
+ * ideal para facilitar a organização de conteúdos.
+ *
+ * O componente exibirá as abas enquanto houver espaço na tela, caso a aba ultrapasse o limite da tela a mesma será agrupada em um dropdown.
+ *
+ * > As abas que estiverem agrupadas serão dispostas numa cascata suspensa que será exibida ao clicar no botão.
+ *
+ * É possível realizar a navegação entre as abas através da tecla SETAS(direita e esquerda) do teclado.
+ * Caso uma aba estiver desabilitada, não receberá foco de navegação.
+ *
+ * #### Boas práticas
+ *
+ * - Evite utilizar um `po-tabs` dentro de outro `po-tabs`;
+ * - Evite utilizar uma quantidade excessiva de abas, pois irá gerar um *scroll* muito longo no `dropdown`;
+ * - Evite `labels` extensos para as `tabs` pois podem quebrar seu *layout*, use `labels` diretas, curtas e intuitivas.
+ *
+ *
  * @example
  *
  * <example name="po-tabs-basic" title="PO Tabs Basic">
@@ -34,7 +53,7 @@ export declare const poTabsLiterals: object;
  */
 export declare class PoTabsComponent extends PoTabsBaseComponent implements OnInit, AfterViewInit, OnDestroy, AfterContentInit {
     protected poThemeService: PoThemeService;
-    private changeDetector;
+    changeDetector: ChangeDetectorRef;
     private languageService;
     private tabsService;
     tabsChildren: QueryList<PoTabComponent>;
@@ -47,6 +66,7 @@ export declare class PoTabsComponent extends PoTabsBaseComponent implements OnIn
     tabsDropdown: any[];
     initializeCalculation: boolean;
     initializeComponent: boolean;
+    initCheckChangesTab: boolean;
     quantityTabsButton: any;
     defaultLastTabWidth: number;
     private previousActiveTab;
@@ -67,14 +87,15 @@ export declare class PoTabsComponent extends PoTabsBaseComponent implements OnIn
     onTabActiveByDropdown(tab: PoTabComponent, eventEmitter?: boolean): void;
     onTabActive(tab: PoTabComponent): void;
     onTabChangeState(tab: PoTabComponent | any): void;
-    reorderTabs(tabToReorder: PoTabComponent): void;
+    reorderTabs(tabToReorder: PoTabComponent, lastTab?: any): void;
     selectedTab(tab: PoTabComponent | any): void;
     trackByFn(_i: any, tab: PoTabComponent): string;
     private activeDistinctTab;
     private activeFirstTab;
-    private changeTabPositionByDropdown;
+    changeTabPositionByDropdown(tabToActivate: PoTabComponent, byContextsTabs?: boolean): void;
     private deactivateTab;
-    private updateTabsState;
+    updateTabsState(initialState?: boolean, tab?: PoTabComponent): void;
+    executeTabsState(initialState: any, idByContextTabs?: string): void;
     calculateTabs(initializeCalculation?: boolean): void;
     handleKeyboardNavigationTab(initialIndex?: number): void;
     /**

package/lib/components/po-tabs/po-tabs.module.d.ts

@@ -15,6 +15,6 @@ import * as i10 from "../po-listbox/po-listbox.module";
  */
 export declare class PoTabsModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<PoTabsModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<PoTabsModule, [typeof i1.PoTabButtonComponent, typeof i2.PoTabComponent, typeof i3.PoTabDropdownComponent, typeof i4.PoTabsComponent], [typeof i5.CommonModule, typeof i6.PoPopoverModule, typeof i7.PoDropdownModule, typeof i8.PoTooltipModule, typeof i9.PoButtonModule, typeof i10.PoListBoxModule], [typeof i2.PoTabComponent, typeof i4.PoTabsComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PoTabsModule, [typeof i1.PoTabButtonComponent, typeof i2.PoTabComponent, typeof i3.PoTabDropdownComponent, typeof i4.PoTabsComponent], [typeof i5.CommonModule, typeof i6.PoPopoverModule, typeof i7.PoDropdownModule, typeof i8.PoTooltipModule, typeof i9.PoButtonModule, typeof i10.PoListBoxModule], [typeof i2.PoTabComponent, typeof i4.PoTabsComponent, typeof i1.PoTabButtonComponent, typeof i3.PoTabDropdownComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<PoTabsModule>;
 }

package/lib/components/po-tabs/po-tabs.service.d.ts

@@ -3,9 +3,9 @@ import * as i0 from "@angular/core";
 export declare class PoTabsService {
     private onChangesTriggeredSource;
     private onChangesTriggeredActiveSource;
-    onChangesTriggered$: import("rxjs").Observable<void>;
+    onChangesTriggered$: import("rxjs").Observable<any>;
     triggerActiveOnChanges$: import("rxjs").Observable<any>;
-    triggerOnChanges(): void;
+    triggerOnChanges(tab?: PoTabComponent): void;
     triggerActiveOnChanges(tab: PoTabComponent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoTabsService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<PoTabsService>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@po-ui/ng-components",
-  "version": "19.23.0",
+  "version": "19.24.0",
   "description": "PO UI - Components",
   "author": "PO UI",
   "license": "MIT",
@@ -22,8 +22,8 @@
   },
   "dependencies": {
     "@angular/cdk": "~19.0.3",
-    "@po-ui/style": "19.23.0",
-    "@po-ui/ng-schematics": "19.23.0",
+    "@po-ui/style": "19.24.0",
+    "@po-ui/ng-schematics": "19.24.0",
     "echarts": "^5.6.0",
     "tslib": "^2.6.2"
   },
@@ -38,7 +38,7 @@
     "@angular/platform-browser-dynamic": "^19",
     "@angular/router": "^19",
     "@angular-devkit/schematics": "^19",
-    "@po-ui/style": "19.23.0",
+    "@po-ui/style": "19.24.0",
     "rxjs": "~7.8.1",
     "zone.js": "~0.15.0"
   },

package/schematics/ng-add/index.js

@@ -18,7 +18,7 @@ function default_1(options) {
 }
 function addPoPackageAndInstall() {
     return (tree, context) => {
-        (0, package_config_1.addPackageToPackageJson)(tree, '@po-ui/ng-components', '19.23.0');
+        (0, package_config_1.addPackageToPackageJson)(tree, '@po-ui/ng-components', '19.24.0');
         // install packages
         context.addTask(new tasks_1.NodePackageInstallTask());
     };

package/schematics/ng-update/v14/index.js

@@ -6,7 +6,7 @@ const tasks_1 = require("@angular-devkit/schematics/tasks");
 const package_config_1 = require("@po-ui/ng-schematics/package-config");
 const changes_1 = require("./changes");
 function default_1() {
-    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), postUpdate()]);
 }
 function postUpdate() {
     return (_, context) => {

package/schematics/ng-update/v15/index.js

@@ -11,7 +11,7 @@ const changes_1 = require("./changes");
 const httpClientModuleName = 'HttpClientModule';
 const httpClientModuleSourcePath = '@angular/common/http';
 function default_1() {
-    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
 }
 function postUpdate() {
     return (_, context) => {

package/schematics/ng-update/v16/index.js

@@ -6,7 +6,7 @@ const tasks_1 = require("@angular-devkit/schematics/tasks");
 const package_config_1 = require("@po-ui/ng-schematics/package-config");
 const changes_1 = require("./changes");
 function default_1() {
-    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), postUpdate()]);
 }
 function postUpdate() {
     return (_, context) => {

package/schematics/ng-update/v17/index.js

@@ -6,7 +6,7 @@ const tasks_1 = require("@angular-devkit/schematics/tasks");
 const package_config_1 = require("@po-ui/ng-schematics/package-config");
 const changes_1 = require("./changes");
 function default_1() {
-    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), postUpdate()]);
 }
 function postUpdate() {
     return (_, context) => {

package/schematics/ng-update/v18/index.js

@@ -40,11 +40,11 @@ function main(options) {
             configureNewIcon.toLowerCase() === 'y' ||
             configureNewIcon.toLowerCase() === 'sim' ||
             configureNewIcon.toLowerCase() === '') {
-            return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+            return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
         }
         else {
             return (0, schematics_1.chain)([
-                (0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion),
+                (0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion),
                 addImportOnly(options, [IconsDictionaryName, poIconDictionary], poModuleSourcePath),
                 addProviderToAppModule(options, newProviderDictionary),
                 updateAppConfigFileRule(),

package/schematics/ng-update/v19/index.js

@@ -40,11 +40,11 @@ function main(options) {
             configureNewIcon.toLowerCase() === 'y' ||
             configureNewIcon.toLowerCase() === 'sim' ||
             configureNewIcon.toLowerCase() === '') {
-            return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+            return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
         }
         else {
             return (0, schematics_1.chain)([
-                (0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion),
+                (0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion),
                 addImportOnly(options, [IconsDictionaryName, poIconDictionary], poModuleSourcePath),
                 addProviderToAppModule(options, newProviderDictionary),
                 updateAppConfigFileRule(),

package/schematics/ng-update/v2/index.js

@@ -10,7 +10,7 @@ const package_config_1 = require("@po-ui/ng-schematics/package-config");
 const changes_1 = require("./changes");
 function updateToV2() {
     return (0, schematics_1.chain)([
-        updatePackageJson('19.23.0', changes_1.dependeciesChanges),
+        updatePackageJson('19.24.0', changes_1.dependeciesChanges),
         (0, replace_1.replaceInFile)('tslint.json', changes_1.tsLintReplaces),
         (0, replace_1.replaceInFile)('angular.json', changes_1.angularJsonReplaces),
         createUpgradeRule(),

package/schematics/ng-update/v3/index.js

@@ -7,7 +7,7 @@ const project_1 = require("@po-ui/ng-schematics/project");
 const package_config_1 = require("@po-ui/ng-schematics/package-config");
 const changes_1 = require("./changes");
 function updateToV3() {
-    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
 }
 function postUpdate() {
     return (_, context) => {

package/schematics/ng-update/v4/index.js

@@ -7,7 +7,7 @@ const project_1 = require("@po-ui/ng-schematics/project");
 const package_config_1 = require("@po-ui/ng-schematics/package-config");
 const changes_1 = require("./changes");
 function default_1() {
-    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
 }
 function postUpdate() {
     return (_, context) => {

package/schematics/ng-update/v5/index.js

@@ -7,7 +7,7 @@ const project_1 = require("@po-ui/ng-schematics/project");
 const package_config_1 = require("@po-ui/ng-schematics/package-config");
 const changes_1 = require("./changes");
 function default_1() {
-    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
 }
 function postUpdate() {
     return (_, context) => {

package/schematics/ng-update/v6/index.js

@@ -6,7 +6,7 @@ const tasks_1 = require("@angular-devkit/schematics/tasks");
 const package_config_1 = require("@po-ui/ng-schematics/package-config");
 const changes_1 = require("./changes");
 function default_1() {
-    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.23.0', changes_1.updateDepedenciesVersion), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('19.24.0', changes_1.updateDepedenciesVersion), postUpdate()]);
 }
 function postUpdate() {
     return (_, context) => {