@po-ui/ng-components 16.7.0 → 16.9.0

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

@@ -18,13 +18,27 @@ export declare const poLoadingLiteralsDefault: {
 export declare class PoLoadingBaseComponent {
     private languageService;
     private _text?;
+    private _size?;
     /**
      * Texto a ser exibido no componente.
      */
     set text(value: string);
     get text(): string;
+    /**
+     * Define o tamanho do ícone.
+     *
+     * @default `lg`
+     *
+     * Valores válidos:
+     *  - `xs`: tamanho `extra small`
+     *  - `sm`: tamanho `small`
+     *  - `md`: tamanho `medium`
+     *  - `lg`: tamanho `large`
+     */
+    set size(value: string);
+    get size(): string;
     constructor(languageService: PoLanguageService);
     private getTextDefault;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoLoadingBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoLoadingBaseComponent, never, never, { "text": { "alias": "p-text"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoLoadingBaseComponent, never, never, { "text": { "alias": "p-text"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/components/po-loading/po-loading-overlay/po-loading-overlay-base.component.d.ts

@@ -18,6 +18,7 @@ export declare class PoLoadingOverlayBaseComponent {
     private languageService;
     private _screenLock?;
     private _text?;
+    private _size?;
     /**
      * @optional
      *
@@ -55,8 +56,19 @@ export declare class PoLoadingOverlayBaseComponent {
      */
     set text(value: string);
     get text(): string;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define o tamnho do componente.
+     *
+     * @default `lg`
+     */
+    set size(value: string | null);
+    get size(): string;
     constructor(languageService: PoLanguageService);
     private getTextDefault;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoLoadingOverlayBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoLoadingOverlayBaseComponent, never, never, { "screenLock": { "alias": "p-screen-lock"; "required": false; }; "text": { "alias": "p-text"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoLoadingOverlayBaseComponent, never, never, { "screenLock": { "alias": "p-screen-lock"; "required": false; }; "text": { "alias": "p-text"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; }, {}, never, never, false, never>;
 }

package/lib/components/po-progress/enums/po-progress-size.enum.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @usedBy PoProgressComponent
+ *
+ * @description
+ *
+ * *Enum* `PoProgressSize` para o tamanho da altura da barra de progresso.
+ */
+export declare enum PoProgressSize {
+    medium = "medium",
+    large = "large"
+}

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

@@ -1,3 +1,4 @@
 export * from './enums/po-progress-status.enum';
+export * from './enums/po-progress-size.enum';
 export * from './po-progress.component';
 export * from './po-progress.module';

package/lib/components/po-progress/literals/po-progress.literals.d.ts

@@ -0,0 +1,18 @@
+export declare const poProgressLiterals: {
+    en: {
+        cancel: string;
+        retry: string;
+    };
+    es: {
+        cancel: string;
+        retry: string;
+    };
+    pt: {
+        cancel: string;
+        retry: string;
+    };
+    ru: {
+        cancel: string;
+        retry: string;
+    };
+};

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

@@ -1,4 +1,4 @@
-import { EventEmitter } from '@angular/core';
+import { EventEmitter, TemplateRef } from '@angular/core';
 import { PoProgressStatus } from './enums/po-progress-status.enum';
 import * as i0 from "@angular/core";
 /**
@@ -26,7 +26,7 @@ export declare class PoProgressBaseComponent {
      *
      * Exemplo: `po-icon-ok`.
      */
-    infoIcon?: string;
+    infoIcon?: string | TemplateRef<void>;
     /**
      * @optional
      *
@@ -72,6 +72,7 @@ export declare class PoProgressBaseComponent {
     retry: EventEmitter<any>;
     private _indeterminate?;
     private _value?;
+    private _size;
     /**
      * @optional
      *
@@ -100,7 +101,33 @@ export declare class PoProgressBaseComponent {
      */
     set value(value: number);
     get value(): number;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Definição do tamanho da altura da barra de progresso.
+     *
+     * Valores válidos:
+     *  - `medium`: tamanho médio
+     *  - `large`: tamanho grande
+     *
+     * @default `large`
+     */
+    set size(value: string);
+    get size(): string;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Ativa a exibição da porcentagem atual da barra de progresso.
+     *
+     * @default `false`
+     */
+    showPercentage: boolean;
     private isProgressRangeValue;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoProgressBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoProgressBaseComponent, never, never, { "info": { "alias": "p-info"; "required": false; }; "infoIcon": { "alias": "p-info-icon"; "required": false; }; "status": { "alias": "p-status"; "required": false; }; "text": { "alias": "p-text"; "required": false; }; "indeterminate": { "alias": "p-indeterminate"; "required": false; }; "value": { "alias": "p-value"; "required": false; }; }, { "cancel": "p-cancel"; "retry": "p-retry"; }, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoProgressBaseComponent, never, never, { "info": { "alias": "p-info"; "required": false; }; "infoIcon": { "alias": "p-info-icon"; "required": false; }; "status": { "alias": "p-status"; "required": false; }; "text": { "alias": "p-text"; "required": false; }; "indeterminate": { "alias": "p-indeterminate"; "required": false; }; "value": { "alias": "p-value"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; "showPercentage": { "alias": "p-show-percentage"; "required": false; }; }, { "cancel": "p-cancel"; "retry": "p-retry"; }, never, never, false, never>;
+    static ngAcceptInputType_showPercentage: any;
 }

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

@@ -20,10 +20,14 @@ import * as i0 from "@angular/core";
  * </example>
  */
 export declare class PoProgressComponent extends PoProgressBaseComponent {
+    language: any;
+    literals: any;
     get isAllowCancel(): boolean;
-    get isAllowProgressInfo(): boolean;
+    get isAllowInfoError(): boolean;
     get isAllowRetry(): boolean;
     get statusClass(): string;
+    private poLanguageService;
+    ngOnInit(): void;
     emitCancellation(): void;
     emitRetry(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoProgressComponent, never>;

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

@@ -2,6 +2,9 @@ import * as i0 from "@angular/core";
 import * as i1 from "./po-progress-bar/po-progress-bar.component";
 import * as i2 from "./po-progress.component";
 import * as i3 from "@angular/common";
+import * as i4 from "../po-button/po-button.module";
+import * as i5 from "../po-icon/po-icon.module";
+import * as i6 from "../po-label/po-label.module";
 /**
  * @description
  *
@@ -9,6 +12,6 @@ import * as i3 from "@angular/common";
  */
 export declare class PoProgressModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<PoProgressModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<PoProgressModule, [typeof i1.PoProgressBarComponent, typeof i2.PoProgressComponent], [typeof i3.CommonModule], [typeof i2.PoProgressComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PoProgressModule, [typeof i1.PoProgressBarComponent, typeof i2.PoProgressComponent], [typeof i3.CommonModule, typeof i4.PoButtonModule, typeof i5.PoIconModule, typeof i6.PoLabelModule], [typeof i2.PoProgressComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<PoProgressModule>;
 }

package/lib/components/po-search/{po-search-filter-mode.enum.d.ts → enum/po-search-filter-mode.enum.d.ts}

@@ -3,9 +3,9 @@
  *
  * @description
  *
- * Define o tipo de busca usado no po-seach.
+ * Define o tipo de busca usado no po-search.
  */
-export declare enum PoFilterMode {
+export declare enum PoSearchFilterMode {
     /** Verifica se o texto *inicia* com o valor pesquisado. */
     startsWith = 0,
     /** Verifica se o texto *contém* o valor pesquisado. */

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

@@ -1,3 +1,4 @@
 export * from './po-search.component';
 export * from './po-search.module';
-export * from './po-search-filter-mode.enum';
+export * from './enum/po-search-filter-mode.enum';
+export * from './literals/po-search-literals';

package/lib/components/po-search/literals/po-search-literals-default.d.ts

@@ -0,0 +1,7 @@
+import { PoSearchLiterals } from './po-search-literals';
+export declare const poSearchLiteralsDefault: {
+    en: PoSearchLiterals;
+    es: PoSearchLiterals;
+    pt: PoSearchLiterals;
+    ru: PoSearchLiterals;
+};

package/lib/components/po-search/literals/po-search-literals.d.ts

@@ -6,7 +6,17 @@ export interface PoSearchLiterals {
      *
      * @description
      *
-     * search: Texto exibido no *placeholder*  do filtro do componente menu.
+     * search: Texto exibido no *placeholder*  do filtro do componente `po-search`.
      */
     search?: string;
+    /**
+     * @usedBy PoSearchComponent
+     *
+     * @optional
+     *
+     * @description
+     *
+     * search: Texto usado no leitor de tela para acessibilidade.
+     */
+    clean?: string;
 }

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

@@ -1,15 +1,150 @@
-import { PoFilterMode } from './po-search-filter-mode.enum';
-import { EventEmitter } from '@angular/core';
+import { PoLanguageService } from '../../services/po-language/po-language.service';
+import { EventEmitter, TemplateRef } from '@angular/core';
+import { PoSearchLiterals } from './literals/po-search-literals';
+import { PoSearchFilterMode } from './enum/po-search-filter-mode.enum';
 import * as i0 from "@angular/core";
+/**
+ * @description
+ *
+ * O componente search, também conhecido como barra de pesquisa, é utilizado para ajudar os usuários a localizar um determinado conteúdo
+ *
+ * Normalmente localizado no canto superior direito, junto com o ícone de lupa, uma vez que este ícone é amplamente reconhecido.
+ *
+ * Portanto, é de extrema importância que, ao utilizar este componente, as pessoas responsáveis por seu desenvolvimento considerem os seguintes critérios.
+ *
+ * #### Boas práticas
+ *
+ * Foram estruturados os padrões de usabilidade para auxiliar na utilização do componente e garantir uma boa experiência aos usuários. Por isso, é muito importante que ao utilizar este componente, as pessoas que o projetarem devem levar em consideração os seguintes critérios:
+ * - Utilize labels para apresentar resultados que estão sendo exibidos e apresente os resultados mais relevantes primeiro.
+ * - Exiba uma mensagem clara quando não forem encontrados resultados para busca e sempre que possível ofereça outras sugestões de busca.
+ * - Mantenha o texto original no campo de input, que facilita a ação do usuário caso queira fazer uma nova busca com alguma modificação na pesquisa.
+ * - Caso seja possível detectar um erro de digitação, mostre os resultados para a palavra "corrigida", isso evita a frustração de não obter resultados e não força o usuário a realizar uma nova busca.
+ * - Quando apropriado, destaque os termos da busca nos resultados.
+ * - A entrada do campo de pesquisa deve caber em uma linha. Não use entradas de pesquisa de várias linhas.
+ * - Recomenda-se ter apenas uma pesquisa por página. Se você precisar de várias pesquisas, rotule-as claramente para indicar sua finalidade.
+ * - Se possível, forneça sugestões de pesquisa, seja em um helptext ou sugestão de pesquisa que é um autocomplete. Isso ajuda os usuários a encontrar o que estão procurando, especialmente se os itens pesquisáveis forem complexos.
+ *
+ * #### Acessibilidade tratada no componente
+ *
+ *  Algumas diretrizes de acessibilidade já são tratadas no componente, internamente, e não podem ser alteradas pelo proprietário do conteúdo. São elas:
+ *
+ * - Permitir a interação via teclado (2.1.1: Keyboard (A));
+ * - Alteração entre os estados precisa ser indicada por mais de um elemento além da cor (1.4.1: Use of Color);
+ */
 export declare class PoSearchBaseComponent {
+    private _literals?;
+    private _ariaLabel?;
+    private language;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Desabilita o po-search e não permite que o usuário interaja com o mesmo.
+     *
+     * @default `false`
+     */
     disabled?: boolean;
-    loading: boolean;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Lista de itens que serão utilizados para pesquisa
+     */
     items: Array<any>;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define um aria-label para o po-search.
+     *
+     * > Devido o componente não possuir uma label assim como outros campos de texto, o `aria-label` é utilizado para acessibilidade.
+     */
+    set ariaLabel(value: string);
+    get ariaLabel(): string;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Deve ser informado o nome da propriedade do objeto que será utilizado para a conversão dos itens apresentados na lista do componente (p-items), esta propriedade será responsável pelo texto de apresentação de cada item da lista.
+     */
     filterKeys: Array<any>;
-    filterType: PoFilterMode;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Deve ser informado o nome da propriedade do objeto que será utilizado para a conversão dos itens apresentados na lista do componente (p-items), esta propriedade será responsável pelo texto de apresentação de cada item da lista.
+     */
+    icon: string | TemplateRef<void>;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Objeto com as literais usadas no `po-search`.
+     *
+     * Para utilizar basta passar a literal que deseja customizar:
+     *
+     * ```
+     *  const customLiterals: PoSearchLiterals = {
+     *    search: 'Pesquisar',
+     *    clean: 'Limpar',
+     *  };
+     * ```
+     *
+     * E para carregar a literal customizada, basta apenas passar o objeto para o componente.
+     *
+     * ```
+     * <po-search
+     *   [p-literals]="customLiterals">
+     * </po-search>
+     * ```
+     *
+     * > O objeto padrão de literais será traduzido de acordo com o idioma do
+     * [`PoI18nService`](/documentation/po-i18n) ou do browser.
+     */
+    set literals(value: PoSearchLiterals);
+    get literals(): PoSearchLiterals;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define o modo de pesquisa utilizado no campo de busca, quando habilitado. Valores definidos no enum: PoSearchFilterMode
+     *
+     * @default `startsWith`
+     */
+    filterType: PoSearchFilterMode;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Evento disparado ao alterar valor do model.
+     */
+    changeModel: EventEmitter<any>;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Pode ser informada uma função que será disparada quando houver alterações no input.
+     */
     filteredItemsChange: EventEmitter<any[]>;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Pode ser informada uma função que será disparada quando houver alterações nos filtros.
+     */
     filter: EventEmitter<any>;
+    constructor(languageService: PoLanguageService);
     static ɵfac: i0.ɵɵFactoryDeclaration<PoSearchBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoSearchBaseComponent, never, never, { "disabled": { "alias": "p-disabled"; "required": false; }; "loading": { "alias": "p-loading"; "required": false; }; "items": { "alias": "p-items"; "required": false; }; "filterKeys": { "alias": "p-filter-keys"; "required": false; }; "filterType": { "alias": "p-filter-type"; "required": false; }; }, { "filteredItemsChange": "p-filtered-items-change"; "filter": "p-filter"; }, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoSearchBaseComponent, never, never, { "disabled": { "alias": "p-disabled"; "required": false; }; "items": { "alias": "p-items"; "required": false; }; "ariaLabel": { "alias": "p-aria-label"; "required": false; }; "filterKeys": { "alias": "p-filter-keys"; "required": false; }; "icon": { "alias": "p-icon"; "required": false; }; "literals": { "alias": "p-literals"; "required": false; }; "filterType": { "alias": "p-filter-type"; "required": false; }; }, { "changeModel": "p-change-model"; "filteredItemsChange": "p-filtered-items-change"; "filter": "p-filter"; }, never, never, false, never>;
     static ngAcceptInputType_disabled: any;
 }

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

@@ -1,20 +1,35 @@
 import { ElementRef, OnInit, Renderer2 } from '@angular/core';
 import { PoLanguageService } from '../../services/po-language/po-language.service';
-import { PoSearchLiterals } from './literals/po-search-literals';
 import { PoSearchBaseComponent } from './po-search-base.component';
 import * as i0 from "@angular/core";
-export declare const poSearchLiteralsDefault: {
-    en: PoSearchLiterals;
-    es: PoSearchLiterals;
-    pt: PoSearchLiterals;
-    ru: PoSearchLiterals;
-};
+/**
+ * @docsExtends PoSearchBaseComponent
+ *
+ * @example
+ *
+ * <example name="po-search-basic" title="PO Search Basic">
+ *  <file name="sample-po-search-basic/sample-po-search-basic.component.html"> </file>
+ *  <file name="sample-po-search-basic/sample-po-search-basic.component.ts"> </file>
+ * </example>
+ *
+ * <example name="po-search-labs" title="PO Search Labs">
+ *  <file name="sample-po-search-labs/sample-po-search-labs.component.html"> </file>
+ *  <file name="sample-po-search-labs/sample-po-search-labs.component.ts"> </file>
+ *  <file name="sample-po-search-labs/sample-po-search-labs.service.ts"> </file>
+ * </example>
+ *
+ * <example name="po-search-find-people" title="PO Search Find People">
+ *  <file name="sample-po-search-find-people/sample-po-search-find-people.component.html"> </file>
+ *  <file name="sample-po-search-find-people/sample-po-search-find-people.component.ts"> </file>
+ *  <file name="sample-po-search-find-people/sample-po-search-find-people.service.ts"> </file>
+ * </example>
+ *
+ */
 export declare class PoSearchComponent extends PoSearchBaseComponent implements OnInit {
     languageService: PoLanguageService;
     private renderer;
     poSearchInput: ElementRef;
     filteredItems: Array<any>;
-    literals?: any;
     constructor(languageService: PoLanguageService, renderer: Renderer2);
     ngOnInit(): void;
     clearSearch(): void;

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

@@ -2,7 +2,7 @@ import { EventEmitter, OnChanges, OnDestroy, SimpleChanges } from '@angular/core
 import { Observable } from 'rxjs';
 import { PoDateService } from '../../services/po-date/po-date.service';
 import { PoLanguageService } from '../../services/po-language/po-language.service';
-import { PoFilterMode } from '../po-search/po-search-filter-mode.enum';
+import { PoSearchFilterMode } from '../po-search/enum/po-search-filter-mode.enum';
 import { PoTableColumnSpacing } from './enums/po-table-spacing.enum';
 import { PoTableAction } from './interfaces/po-table-action.interface';
 import { PoTableColumnSort } from './interfaces/po-table-column-sort.interface';
@@ -212,7 +212,7 @@ export declare abstract class PoTableBaseComponent implements OnChanges, OnDestr
      *
      * @default `startsWith`
      */
-    filterType: PoFilterMode;
+    filterType: PoSearchFilterMode;
     /**
      * @optional
      *
@@ -345,6 +345,7 @@ export declare abstract class PoTableBaseComponent implements OnChanges, OnDestr
     itemsSelected: Array<any>;
     paramsFilter: {};
     filteredItems: Array<any>;
+    initialized: boolean;
     private initialVisibleColumns;
     private _spacing;
     private _filteredColumns;
@@ -694,6 +695,8 @@ export declare abstract class PoTableBaseComponent implements OnChanges, OnDestr
     private removePropertyFixed;
     protected abstract calculateHeightTableContainer(height: any): any;
     protected abstract checkInfiniteScroll(): any;
+    protected abstract changeSizeLoading(): any;
+    protected abstract changeHeaderWidth(): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoTableBaseComponent, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<PoTableBaseComponent, never, never, { "hideTextOverflow": { "alias": "p-hide-text-overflow"; "required": false; }; "hideColumnsManager": { "alias": "p-hide-columns-manager"; "required": false; }; "hideBatchActions": { "alias": "p-hide-batch-actions"; "required": false; }; "hideActionFixedColumns": { "alias": "p-hide-action-fixed-columns"; "required": false; }; "hideTableSearch": { "alias": "p-hide-table-search"; "required": false; }; "autoCollapse": { "alias": "p-auto-collapse"; "required": false; }; "loadingShowMore": { "alias": "p-loading-show-more"; "required": false; }; "sort": { "alias": "p-sort"; "required": false; }; "showMoreDisabled": { "alias": "p-show-more-disabled"; "required": false; }; "striped": { "alias": "p-striped"; "required": false; }; "hideSelectAll": { "alias": "p-hide-select-all"; "required": false; }; "singleSelect": { "alias": "p-single-select"; "required": false; }; "selectableEntireLine": { "alias": "p-selectable-entire-line"; "required": false; }; "actionRight": { "alias": "p-actions-right"; "required": false; }; "maxColumns": { "alias": "p-max-columns"; "required": false; }; "filterType": { "alias": "p-filter-type"; "required": false; }; "items": { "alias": "p-items"; "required": false; }; "columns": { "alias": "p-columns"; "required": false; }; "container": { "alias": "p-container"; "required": false; }; "paramDeleteApi": { "alias": "p-param-delete-api"; "required": false; }; "height": { "alias": "p-height"; "required": false; }; "hideDetail": { "alias": "p-hide-detail"; "required": false; }; "literals": { "alias": "p-literals"; "required": false; }; "loading": { "alias": "p-loading"; "required": false; }; "actions": { "alias": "p-actions"; "required": false; }; "selectable": { "alias": "p-selectable"; "required": false; }; "infiniteScroll": { "alias": "p-infinite-scroll"; "required": false; }; "infiniteScrollDistance": { "alias": "p-infinite-scroll-distance"; "required": false; }; "serviceApi": { "alias": "p-service-api"; "required": false; }; "serviceDeleteApi": { "alias": "p-service-delete"; "required": false; }; "spacing": { "alias": "p-spacing"; "required": false; }; "filteredColumns": { "alias": "p-filtered-columns"; "required": false; }; "draggable": { "alias": "p-draggable"; "required": false; }; }, { "allSelected": "p-all-selected"; "allUnselected": "p-all-unselected"; "collapsed": "p-collapsed"; "expanded": "p-expanded"; "eventDelete": "p-delete-items"; "selected": "p-selected"; "showMore": "p-show-more"; "sortBy": "p-sort-by"; "unselected": "p-unselected"; "changeVisibleColumns": "p-change-visible-columns"; "columnRestoreManager": "p-restore-column-manager"; }, never, never, false, never>;
     static ngAcceptInputType_hideTextOverflow: any;

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

@@ -108,6 +108,8 @@ export declare class PoTableComponent extends PoTableBaseComponent implements Af
     inputFieldValue: string;
     JSON: JSON;
     newOrderColumns: Array<PoTableColumn>;
+    sizeLoading: string;
+    headerWidth: number;
     close: PoModalAction;
     confirm: PoModalAction;
     private _columnManagerTarget;
@@ -115,7 +117,6 @@ export declare class PoTableComponent extends PoTableBaseComponent implements Af
     private differ;
     private footerHeight;
     private headerHeight;
-    private initialized;
     private timeoutResize;
     private visibleElement;
     private scrollEvent$;
@@ -144,6 +145,7 @@ export declare class PoTableComponent extends PoTableBaseComponent implements Af
     get isDraggable(): boolean;
     get inverseOfTranslation(): string;
     ngOnInit(): void;
+    changeHeaderWidth(): void;
     ngAfterViewInit(): void;
     showMoreInfiniteScroll({ target }: {
         target: any;
@@ -277,6 +279,7 @@ export declare class PoTableComponent extends PoTableBaseComponent implements Af
     protected verifyCalculateHeightTableContainer(): void;
     protected checkInfiniteScroll(): void;
     private changesAfterDelete;
+    protected changeSizeLoading(): void;
     private checkChangesItems;
     private checkingIfColumnHasTooltip;
     private debounceResize;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@po-ui/ng-components",
-  "version": "16.7.0",
+  "version": "16.9.0",
   "tag": "next",
   "description": "PO UI - Components",
   "author": "PO UI",
@@ -22,8 +22,8 @@
   },
   "dependencies": {
     "@angular/cdk": "~16.2.0",
-    "@po-ui/style": "16.7.0",
-    "@po-ui/ng-schematics": "16.7.0",
+    "@po-ui/style": "16.9.0",
+    "@po-ui/ng-schematics": "16.9.0",
     "tslib": "^2.3.0"
   },
   "peerDependencies": {
@@ -36,7 +36,7 @@
     "@angular/platform-browser": "~16.2.0",
     "@angular/platform-browser-dynamic": "~16.2.0",
     "@angular/router": "~16.2.0",
-    "@po-ui/style": "16.7.0",
+    "@po-ui/style": "16.9.0",
     "rxjs": "~7.5.5",
     "zone.js": "~0.13.1"
   },

package/schematics/ng-add/index.js

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

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

@@ -5,7 +5,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)('16.7.0', changes_1.updateDepedenciesVersion), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('16.9.0', changes_1.updateDepedenciesVersion), postUpdate()]);
 }
 exports.default = default_1;
 function postUpdate() {

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

@@ -10,7 +10,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)('16.7.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('16.9.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
 }
 exports.default = default_1;
 function postUpdate() {

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

@@ -5,7 +5,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)('16.7.0', changes_1.updateDepedenciesVersion), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('16.9.0', changes_1.updateDepedenciesVersion), postUpdate()]);
 }
 exports.default = default_1;
 function postUpdate() {

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('16.7.0', changes_1.dependeciesChanges),
+        updatePackageJson('16.9.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)('16.7.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('16.9.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
 }
 exports.updateToV3 = updateToV3;
 function postUpdate() {

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

@@ -6,7 +6,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)('16.7.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('16.9.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
 }
 exports.default = default_1;
 function postUpdate() {

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

@@ -6,7 +6,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)('16.7.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('16.9.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
 }
 exports.default = default_1;
 function postUpdate() {

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

@@ -5,7 +5,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)('16.7.0', changes_1.updateDepedenciesVersion), postUpdate()]);
+    return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('16.9.0', changes_1.updateDepedenciesVersion), postUpdate()]);
 }
 exports.default = default_1;
 function postUpdate() {