@po-ui/ng-components 20.11.0-beta.1 → 20.12.0

package/index.d.ts

@@ -521,7 +521,8 @@ declare class PoTagBaseComponent {
      *   - <span class="dot po-color-11"></span> `color-11`
      *   - <span class="dot po-color-12"></span> `color-12`
      *
-     * - Para uma melhor acessibilidade no uso do componente é recomendável utilizar cores com um melhor contraste em relação ao background.
+     * - Para uma melhor acessibilidade no uso do componente é recomendável utilizar cores com um melhor contraste em relação ao background;
+     * - O componente ajusta automaticamente a cor do texto para garantir legibilidade, escolhendo dinamicamente entre texto claro ou escuro conforme o contraste necessário.
      *
      * > **Atenção:** A propriedade `p-type` sobrepõe esta definição.
      */
@@ -697,10 +698,8 @@ declare class PoTagComponent extends PoTagBaseComponent implements OnInit {
     onKeyPressed(event: any): void;
     styleTag(): {
         'background-color': any;
-        color: string;
     } | {
         'background-color'?: undefined;
-        color?: undefined;
     };
     getWidthTag(): boolean;
     setAriaLabel(): string;
@@ -719,9 +718,11 @@ declare class PoTagComponent extends PoTagBaseComponent implements OnInit {
  * Permite a exibição de ícones.
  */
 declare class PoIconComponent {
+    iconElement: ElementRef;
     class: string;
     private _icon;
     private _iconToken;
+    hostPIcon: string | null;
     constructor(value: {
         [key: string]: string;
     });
@@ -1795,6 +1796,14 @@ declare class PoItemListBaseComponent {
      * Define um ícone que será exibido ao lado esquerdo do rótulo.
      */
     icon: string | TemplateRef<void>;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define se deve ser exibido o ícone indicando subnível.
+     */
+    iconArrowRight: string;
     iconPosition: 'left' | 'right';
     /**
      * @optional
@@ -1826,7 +1835,7 @@ declare class PoItemListBaseComponent {
     keysLabel?: Array<string>;
     protected emitActiveTabs(tab: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoItemListBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoItemListBaseComponent, never, never, { "type": { "alias": "p-type"; "required": false; }; "visible": { "alias": "p-visible"; "required": false; }; "item": { "alias": "p-item"; "required": false; }; "label": { "alias": "p-label"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; "value": { "alias": "p-value"; "required": false; }; "danger": { "alias": "p-danger"; "required": false; }; "disabled": { "alias": "p-disabled"; "required": false; }; "selected": { "alias": "p-selected"; "required": false; }; "separator": { "alias": "p-separator"; "required": false; }; "icon": { "alias": "p-icon"; "required": false; }; "iconPosition": { "alias": "p-icon-position"; "required": false; }; "checkboxValue": { "alias": "p-checkbox-value"; "required": false; }; "fieldValue": { "alias": "p-field-value"; "required": false; }; "fieldLabel": { "alias": "p-field-label"; "required": false; }; "template": { "alias": "p-template"; "required": false; }; "templateContext": { "alias": "p-template-context"; "required": false; }; "searchValue": { "alias": "p-search-value"; "required": false; }; "filterMode": { "alias": "p-filter-mode"; "required": false; }; "isFiltering": { "alias": "p-filtering"; "required": false; }; "shouldMarkLetters": { "alias": "p-should-mark-letter"; "required": false; }; "compareCache": { "alias": "p-compare-cache"; "required": false; }; "comboService": { "alias": "p-combo-service"; "required": false; }; "isTabs": { "alias": "p-is-tabs"; "required": false; }; "tabHide": { "alias": "p-tab-hide"; "required": false; }; "activeTabs": { "alias": "p-active-tabs"; "required": false; }; "keysLabel": { "alias": "p-keys-label"; "required": false; }; }, { "clickItem": "p-click-item"; "checkboxItem": "p-selectcheckbox-item"; "comboItem": "p-selectcombo-item"; "tabsItem": "p-emit-item-tabs"; "activatedTab": "p-activated-tabs"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoItemListBaseComponent, never, never, { "type": { "alias": "p-type"; "required": false; }; "visible": { "alias": "p-visible"; "required": false; }; "item": { "alias": "p-item"; "required": false; }; "label": { "alias": "p-label"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; "value": { "alias": "p-value"; "required": false; }; "danger": { "alias": "p-danger"; "required": false; }; "disabled": { "alias": "p-disabled"; "required": false; }; "selected": { "alias": "p-selected"; "required": false; }; "separator": { "alias": "p-separator"; "required": false; }; "icon": { "alias": "p-icon"; "required": false; }; "iconArrowRight": { "alias": "p-icon-arrow-right"; "required": false; }; "iconPosition": { "alias": "p-icon-position"; "required": false; }; "checkboxValue": { "alias": "p-checkbox-value"; "required": false; }; "fieldValue": { "alias": "p-field-value"; "required": false; }; "fieldLabel": { "alias": "p-field-label"; "required": false; }; "template": { "alias": "p-template"; "required": false; }; "templateContext": { "alias": "p-template-context"; "required": false; }; "searchValue": { "alias": "p-search-value"; "required": false; }; "filterMode": { "alias": "p-filter-mode"; "required": false; }; "isFiltering": { "alias": "p-filtering"; "required": false; }; "shouldMarkLetters": { "alias": "p-should-mark-letter"; "required": false; }; "compareCache": { "alias": "p-compare-cache"; "required": false; }; "comboService": { "alias": "p-combo-service"; "required": false; }; "isTabs": { "alias": "p-is-tabs"; "required": false; }; "tabHide": { "alias": "p-tab-hide"; "required": false; }; "activeTabs": { "alias": "p-active-tabs"; "required": false; }; "keysLabel": { "alias": "p-keys-label"; "required": false; }; }, { "clickItem": "p-click-item"; "checkboxItem": "p-selectcheckbox-item"; "comboItem": "p-selectcombo-item"; "tabsItem": "p-emit-item-tabs"; "activatedTab": "p-activated-tabs"; }, never, never, true, never>;
     static ngAcceptInputType_danger: any;
     static ngAcceptInputType_selected: any;
     static ngAcceptInputType_separator: any;
@@ -2118,6 +2127,7 @@ interface PoPopupAction {
      */
     visible?: boolean | Function;
     $id?: string;
+    $subItemTemplate?: TemplateRef<any>;
 }
 
 /**
@@ -2164,7 +2174,8 @@ declare class PoListBoxComponent extends PoListBoxBaseComponent implements OnIni
     ngOnDestroy(): void;
     openGroup(group: PoDropdownAction, event?: MouseEvent | KeyboardEvent): void;
     goBack(event: MouseEvent | KeyboardEvent): void;
-    onKeydownGoBack(event: KeyboardEvent): void;
+    onKeydownGoBack(event: KeyboardEvent, currentGroup?: PoDropdownAction): void;
+    protected onKeydownTemplate(event: KeyboardEvent): void;
     onSelectItem(itemListAction: PoItemListOption | PoItemListOptionGroup | any, event?: MouseEvent | KeyboardEvent): void | Promise<boolean>;
     onSelectAllCheckboxKeyDown(event: KeyboardEvent): void;
     onKeyDown(itemListAction: PoItemListOption | PoItemListOptionGroup | any, event?: KeyboardEvent): void;
@@ -3974,6 +3985,7 @@ declare class PoPopupBaseComponent {
     private _size?;
     private _target;
     listboxSubitems: boolean;
+    templateIcon: boolean;
     /** Lista de ações que serão exibidas no componente. */
     set actions(value: Array<PoPopupAction>);
     get actions(): Array<PoPopupAction>;
@@ -4105,7 +4117,7 @@ declare class PoPopupBaseComponent {
     closeEvent: EventEmitter<any>;
     clickItem: EventEmitter<any>;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoPopupBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoPopupBaseComponent, never, never, { "listboxSubitems": { "alias": "p-listbox-subitems"; "required": false; }; "actions": { "alias": "p-actions"; "required": false; }; "hideArrow": { "alias": "p-hide-arrow"; "required": false; }; "isCornerAlign": { "alias": "p-is-corner-align"; "required": false; }; "position": { "alias": "p-position"; "required": false; }; "customPositions": { "alias": "p-custom-positions"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; "target": { "alias": "p-target"; "required": false; }; }, { "closeEvent": "p-close"; "clickItem": "p-click-item"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoPopupBaseComponent, never, never, { "listboxSubitems": { "alias": "p-listbox-subitems"; "required": false; }; "templateIcon": { "alias": "p-template-icon"; "required": false; }; "actions": { "alias": "p-actions"; "required": false; }; "hideArrow": { "alias": "p-hide-arrow"; "required": false; }; "isCornerAlign": { "alias": "p-is-corner-align"; "required": false; }; "position": { "alias": "p-position"; "required": false; }; "customPositions": { "alias": "p-custom-positions"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; "target": { "alias": "p-target"; "required": false; }; }, { "closeEvent": "p-close"; "clickItem": "p-click-item"; }, never, never, true, never>;
 }
 
 /**
@@ -4130,7 +4142,8 @@ declare class PoPopupBaseComponent {
  * </example>
  *
  */
-declare class PoPopupComponent extends PoPopupBaseComponent {
+declare class PoPopupComponent extends PoPopupBaseComponent implements AfterViewInit {
+    id: string;
     private renderer;
     private router;
     private poControlPosition;
@@ -4138,6 +4151,7 @@ declare class PoPopupComponent extends PoPopupBaseComponent {
     popupRef: ElementRef;
     listbox: ElementRef;
     poListBoxRef: PoListBoxComponent;
+    ngAfterViewInit(): void;
     /**
      * Fecha o componente *popup*.
      *
@@ -10466,42 +10480,24 @@ declare class PoTableModule {
  *
  * @description
  *
- * *Enum* `PoChartType` para especificação dos tipos de gráficos.
+ * Interface que define as propriedades de exibição dos rótulos das séries no `po-chart`.
+ *
  */
-declare enum PoChartType {
-    /**
-     * Tipo de gráfico que exibe os dados de modo quantitativo, utilizando linhas contínuas demarcadas por pontos para cada valor de série definido.
-     * Similar ao gráfico de linha, diferencia-se pela área localizada abaixo da linha das séries, que é preenchida com cores para um destaque explícita da evolução e mudança dos dados.
-     */
-    Area = "area",
-    /**
-     * Exibe os dados em formato de rosca, dividindo em partes proporcionais.
-     */
-    Donut = "donut",
-    /**
-     * Exibe os dados em formato circular, dividindo proporcionalmente em fatias.
-     */
-    Pie = "pie",
-    /**
-     * Gráfico que mostra os dados de modo linear e contínuo. É útil, por exemplo, para fazer comparações de tendência durante determinado período.
-     * Pode ser utilizado em conjunto com gráficos dos tipos `column` e `area`, definindo-se o tipo através da propriedade `PoChartSerie.type`.
-     */
-    Line = "line",
-    /**
-     * Gráfico que exibe os dados em forma de barras verticais e sua extensão varia de acordo com seus valores. É comumente usado como comparativo entre diversas séries.
-     * As séries são exibidas lado-a-lado, com um pequeno espaço entre elas.
-     */
-    Column = "column",
-    /**
-     * Gráfico que exibe os dados em forma de barras horizontais e sua extensão varia de acordo com seus valores. É comumente usado como comparativo de séries e categorias.
-     */
-    Bar = "bar",
+interface PoChartDataLabel {
     /**
-     * Gráfico que provê a representação de um valor através de um arco. Possui dois tipos de tratamentos:
-     * - É possível demonstrar um dado percentual simples em conjunto com uma descrição resumida em seu interior;
-     * - Para um demonstrativo mais elaborado, consegue-se definir alcances em cores, um breve texto descritivo e um ponteiro indicando o valor desejado.
+     * @optional
+     *
+     * @description
+     *
+     * Indica se o texto associado aos pontos da série deve permanecer fixo na exibição do gráfico.
+     *
+     * - Quando definido como `true`:
+     *   - O *tooltip* não será exibido.
+     *   - As outras séries ficarão com opacidade reduzida ao passar o mouse sobre a série ativa.
+     *
+     * > Disponível para os tipo de gráfico `PoChartType.Line`, `PoChartType.Area`, `PoChartType.Column`, `PoChartType.Bar e PoChartType.Radar`.
      */
-    Gauge = "gauge"
+    fixed?: boolean;
 }
 
 /**
@@ -10578,6 +10574,95 @@ interface PoChartLiterals {
     category?: string;
 }
 
+/**
+ * @usedBy PoChartComponent
+ *
+ * @description
+ *
+ * Interface para configurações dos indicadores do gráfico `radar`.
+ */
+interface PoChartIndicatorOptions {
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Cor do texto do indicator.
+     * Recomendamos avaliar o contraste da cor definida para garantir melhor acessibilidade.
+     *
+     * > Nome da cor, hexadecimal ou RGB.
+     */
+    color?: string;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Nome do indicator.
+     */
+    name?: string;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Valor máximo do indicator.
+     *
+     * A propriedade `max` não impede que a série contenha valores superiores ao máximo definido.
+     * Caso isso ocorra, os valores poderão extrapolar os limites do gráfico.
+     */
+    max?: number;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Valor mínimo do indicator, com valor padrão de 0.
+     *
+     * A propriedade `min` não impede que a série contenha valores inferiores ao mínimo definido.
+     * Caso isso ocorra, os valores serão apresentados ao centro do gráfico.
+     */
+    min?: number;
+}
+
+/**
+ * @usedBy PoChartComponent
+ *
+ * @description
+ *
+ * *Interface* para configurações do gráfico `radar`.
+ */
+interface PoChartRadarOptions {
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define as configurações dos indicadores do gráfico, como nome, cor, valor mínimo e valor máximo.
+     */
+    indicator?: Array<PoChartIndicatorOptions>;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define o formato da grid, podendo ser exibida como polígono ou círculo.
+     *
+     * @default `polygon`
+     */
+    shape?: 'polygon' | 'circle';
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define o efeito zebrado na grid.
+     *
+     * @default 'false'
+     */
+    splitArea?: boolean;
+}
+
 /**
  * @usedBy PoChartComponent
  *
@@ -10784,6 +10869,7 @@ interface PoChartHeaderOptions {
  * *Interface* para configurações dos elementos do gráfico.
  */
 interface PoChartOptions {
+    [key: string]: any;
     /**
      * @optional
      *
@@ -10818,11 +10904,24 @@ interface PoChartOptions {
      * Define se os pontos do gráfico serão preenchidos.
      * Quando true, os pontos são totalmente coloridos. Quando false, apenas a borda dos pontos será exibida, mantendo o interior transparente.
      *
-     * > Esta propriedade é utilizável para os gráficos dos tipos `Area` e `Line`.
+     * > Esta propriedade é utilizável para os gráficos dos tipos `Area`, `Line` e `Radar`.
+     * > Para o tipo `Radar`, o valor padrão é `true`.
      *
      * @default `false`
      */
     fillPoints?: boolean;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define se as séries terão sua área preenchida.
+     *
+     * > Esta propriedade tem precedência sobre a definição de `areaStyle` em cada série, `fillpoints` não funciona quando `areaStyle` está definido como `true`.
+     *
+     * @default `false`
+     */
+    areaStyle?: boolean;
     /**
      * @optional
      *
@@ -10868,6 +10967,8 @@ interface PoChartOptions {
      * @description
      *
      * Define a exibição da legenda do gráfico. Valor padrão é `true`
+     *
+     * @default `true`
      */
     legend?: boolean;
     /**
@@ -11016,25 +11117,46 @@ interface PoChartOptions {
  *
  * @description
  *
- * Interface que define as propriedades de exibição dos rótulos das séries no `po-chart`.
- *
- * > Aplicável apenas para gráficos do tipo `line`.
+ * *Enum* `PoChartType` para especificação dos tipos de gráficos.
  */
-interface PoChartDataLabel {
+declare enum PoChartType {
     /**
-     * @optional
-     *
-     * @description
-     *
-     * Indica se o texto associado aos pontos da série deve permanecer fixo na exibição do gráfico.
-     *
-     * - Quando definido como `true`:
-     *   - O *tooltip* não será exibido.
-     *   - As outras séries ficarão com opacidade reduzida ao passar o mouse sobre a série ativa.
-     *
-     * > Disponível para os tipo de gráfico `PoChartType.Line`, `PoChartType.Area`, `PoChartType.Column` e `PoChartType.Bar`.
+     * Tipo de gráfico que exibe os dados de modo quantitativo, utilizando linhas contínuas demarcadas por pontos para cada valor de série definido.
+     * Similar ao gráfico de linha, diferencia-se pela área localizada abaixo da linha das séries, que é preenchida com cores para um destaque explícita da evolução e mudança dos dados.
      */
-    fixed?: boolean;
+    Area = "area",
+    /**
+     * Exibe os dados em formato de rosca, dividindo em partes proporcionais.
+     */
+    Donut = "donut",
+    /**
+     * Exibe os dados em formato circular, dividindo proporcionalmente em fatias.
+     */
+    Pie = "pie",
+    /**
+     * Gráfico que mostra os dados de modo linear e contínuo. É útil, por exemplo, para fazer comparações de tendência durante determinado período.
+     * Pode ser utilizado em conjunto com gráficos dos tipos `column` e `area`, definindo-se o tipo através da propriedade `PoChartSerie.type`.
+     */
+    Line = "line",
+    /**
+     * Gráfico que exibe os dados em forma de barras verticais e sua extensão varia de acordo com seus valores. É comumente usado como comparativo entre diversas séries.
+     * As séries são exibidas lado-a-lado, com um pequeno espaço entre elas.
+     */
+    Column = "column",
+    /**
+     * Gráfico que exibe os dados em forma de barras horizontais e sua extensão varia de acordo com seus valores. É comumente usado como comparativo de séries e categorias.
+     */
+    Bar = "bar",
+    /**
+     * Gráfico que provê a representação de um valor através de um arco. Possui dois tipos de tratamentos:
+     * - É possível demonstrar um dado percentual simples em conjunto com uma descrição resumida em seu interior;
+     * - Para um demonstrativo mais elaborado, consegue-se definir alcances em cores, um breve texto descritivo e um ponteiro indicando o valor desejado.
+     */
+    Gauge = "gauge",
+    /**
+     * Tipo de gráfico utilizado para visualizar e comparar o desempenho de diferentes itens em múltiplas categorias.
+     */
+    Radar = "radar"
 }
 
 /**
@@ -11042,7 +11164,7 @@ interface PoChartDataLabel {
  *
  * @description
  *
- * Interface das series dinâmicas do `po-chart` que possibilita desenhar gráficos dos tipos `area`, `bar`, `column`, `line`, `donut` e `pie`
+ * Interface das series dinâmicas do `po-chart` que possibilita desenhar gráficos dos tipos `area`, `bar`, `column`, `line`, `donut`, `pie` e `radar`
  */
 interface PoChartSerie {
     /**
@@ -11077,12 +11199,22 @@ interface PoChartSerie {
      *
      * Define a lista de valores para a série. Os tipos esperados são de acordo com o tipo de gráfico:
      * - Para gráficos dos tipos `donut` e `pie`, espera-se *number*;
-     * - Para gráficos dos tipos `area`, `bar`, `column` e `line`, espera-se um *array* de `data`.
+     * - Para gráficos dos tipos `area`, `bar`, `column`, `line` e `radar`, espera-se um *array* de `data`.
      *
      * > Se passado valor `null` em determinado item da lista, a iteração irá ignorá-lo.
      */
     data?: number | Array<number>;
-    /** Rótulo referência da série;. */
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define se a série terá sua área preenchida.
+     *
+     * > Propriedade válida para gráficos do tipo `Radar`, `fillpoints` não funciona quando `areaStyle` está definido como `true`.
+     */
+    areaStyle?: boolean;
+    /** Rótulo referência da série. */
     label?: string;
     /**
      * @optional
@@ -11109,7 +11241,8 @@ interface PoChartSerie {
      * - `__texto__` → itálico (`<i>`).
      *
      * > Caso não seja informado um valor para o *tooltip*, será exibido da seguinte forma:
-     * - `donut`: `label`: valor proporcional ao total em porcentagem.
+     * - `donut`, `label`: valor proporcional ao total em porcentagem.
+     * - `radar`: nome da série, o nome do indicator e os valores correspondentes.
      * - `area`, `bar`, `column`, `line` e `pie`: `label`: `data`.
      *
      * ### Exemplos:
@@ -11172,7 +11305,6 @@ interface PoChartSerie {
      * > Válido para gráfico do tipo `Column` e `Bar`. Essa propriedade é ignorada caso a propriedade `stacked` da interface `PoChartOptions` esteja como `true`.
      *
      * > Essa propriedade habilita a propriedade `p-data-label` por padrão, podendo ser desabilitada passando `[p-data-label]={ fixed: false }`.
-     *
      */
     stackGroupName?: string;
 }
@@ -11230,6 +11362,9 @@ interface PoChartSerie {
  * | `--color-base-gauge`                     | Cor da base do gráfico `Gauge`                                          | `var(--color-neutral-light-20)`                   |
  * | `--color-gauge-pointer-color`            | Cor do ponteiro do gráfico `Gauge`                                      | `var(--color-neutral-dark-70)`                    |
  * | `--color-chart-line-point-fill`          | Cor de dentro do círculo dos gráficos `Line` e `Area`                   | `var(--color-neutral-light-00)`                   |
+ * | `--border-color-radar`                   | Cor do eixo da grid do gráfico `Radar`                                  | `var(--color-neutral-light-30)`                   |
+ * | `--color-background-zebra`               | Cor das áreas alternadas (efeito zebrado) da grid do gráfico `Radar`    | `var(--color-neutral-light-10)`                   |
+ * | `--color-background-line`                | Cor das áreas entre as faixas zebradas da grade do `Radar`              | `none`                                            |
  * | **Wrapper (.po-chart-container-gauge)**  |                                                                         |                                                   |
  * | `--background-color-container-gauge`     | Cor de background do container do gauge                                 | `var(--color-neutral-light-00)`                   |
  */
@@ -11257,13 +11392,20 @@ declare abstract class PoChartBaseComponent implements OnInit {
      *
      * @description
      *
-     * Define os nomes das categorias que serão plotadas no eixo X do gráfico caso seja do tipo `bar`, ou então nos eixos Y do grid de gráficos dos tipos `area`, `columnn` e `line`.
+     * Define os valores utilizados na construção das categorias do gráfico.
+     *
+     * Para gráficos dos tipos *bar*, *area*, *column* e *line*, representa os nomes das categorias exibidas no eixo.
+     *
+     * Para gráficos do tipo *radar*, representa a configuração dos indicadores, formato (shape), áreas de divisão (splitArea)
+     * e demais opções específicas do gráfico `Radar`.
      *
-     * > Gráficos do tipo `bar` dimensionam a área do gráfico de acordo com a largura do maior texto de categorias. No entanto, é uma boa prática optar por palavras curtas para que a leitura do gráfico não seja prejudicada.
+     * > Caso nenhum valor seja informado, será utilizado um hífen como categoria
+     *   correspondente para cada série.
      *
-     * > Caso não seja especificado um valor para a categoria, será plotado um hífen na categoria referente a cada série.
+     * > Gráficos do tipo bar dimensionam sua área considerando a largura do maior texto
+     *   da categoria, sendo recomendável utilizar rótulos curtos para facilitar a leitura.
      */
-    categories?: Array<string>;
+    categories?: Array<string> | PoChartRadarOptions;
     /**
      * @optional
      *
@@ -11280,7 +11422,7 @@ declare abstract class PoChartBaseComponent implements OnInit {
      * Objeto com as configurações usadas no `po-chart`.
      *
      * É possível, por exemplo, definir as configurações de exibição das legendas,
-     * configurar os eixos(*axis*) para os gráficos dos tipos `area`, `line`, `column` e `bar` da seguinte forma:
+     * configurar os eixos(*axis*) para os gráficos dos tipos `area`, `line`, `column`, `bar` e `radar` da seguinte forma:
      *
      * ```
      *  chartOptions: PoChartOptions = {
@@ -11307,7 +11449,7 @@ declare abstract class PoChartBaseComponent implements OnInit {
      * - Os marcadores (*bullets*) terão seu estilo ajustado.
      * - As outras séries ficarão com opacidade reduzida ao passar o mouse sobre a série ativa.
      *
-     * > Disponível apenas para gráficos do tipo `line`.
+     * > Disponível para gráficos do tipo `line` e `radar`.
      *
      * #### Exemplo de utilização:
      * ```typescript
@@ -11386,6 +11528,7 @@ declare abstract class PoChartBaseComponent implements OnInit {
      *
      * O evento emitirá o seguinte parâmetro:
      * - *donut* e *pie*: um objeto contendo a categoria e valor da série.
+     * - *radar*: um objeto contendo o nome da série e os valores.
      * - *area*, *line*, *column* e *bar*: um objeto contendo o nome da série, valor e categoria do eixo do gráfico.
      */
     seriesClick: EventEmitter<any>;
@@ -11398,6 +11541,7 @@ declare abstract class PoChartBaseComponent implements OnInit {
      *
      * O evento emitirá o seguinte parâmetro de acordo com o tipo de gráfico:
      * - *donut* e *pie*: um objeto contendo a categoria e valor da série.
+     * - *radar*: um objeto contendo o nome da série e os valores.
      * - *area*, *line*, *column* e *bar*: um objeto contendo a categoria, valor da série e categoria do eixo do gráfico.
      */
     seriesHover: EventEmitter<any>;
@@ -11429,6 +11573,51 @@ declare class PoChartGridUtils {
     private hasTopLegendOrNoZoom;
     private hasBottomLegendWithZoom;
     private getPaddingTopGrid;
+    private isRadarOptions;
+    convertRadarConfig(indicators: Array<string>): {
+        shape: string;
+        splitArea: boolean;
+        indicator: {
+            name: string;
+        }[];
+    };
+    setListTypeRadar(): {
+        shape: string;
+        radius: string;
+        splitLine: {
+            show: boolean;
+            lineStyle: {
+                color: string[];
+                width: number;
+            };
+        };
+        axisLine: {
+            show: boolean;
+            lineStyle: {
+                color: string;
+                width: number;
+            };
+        };
+        splitArea: {
+            show: boolean;
+            areaStyle: {
+                color: string[];
+            };
+        };
+        indicator: {
+            name: any;
+            max: any;
+            min: any;
+            color: any;
+        }[];
+    };
+    setSerieTypeRadar(serie: any, tokenBorderWidthMd: number, color: string): any;
+    setTooltipRadar(params: any): void;
+    buildRadarTooltip(params: any): string;
+    finalizeSerieTypeRadar(seriesUpdated: any): {
+        type: string;
+        data: any;
+    }[];
 }
 
 declare class PoChartGaugeUtils {
@@ -11487,6 +11676,11 @@ declare class PoChartGaugeUtils {
  *  <file name="sample-po-chart-world-exports/sample-po-chart-world-exports.component.html"> </file>
  *  <file name="sample-po-chart-world-exports/sample-po-chart-world-exports.component.ts"> </file>
  * </example>
+ *
+ * <example name="po-chart-technology-skill" title="PO Chart - Radar">
+ *  <file name="sample-po-chart-technology-skill/sample-po-chart-technology-skill.component.html"> </file>
+ *  <file name="sample-po-chart-technology-skill/sample-po-chart-technology-skill.component.ts"> </file>
+ * </example>
  */
 declare class PoChartComponent extends PoChartBaseComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {
     el: ElementRef<any>;
@@ -11502,6 +11696,7 @@ declare class PoChartComponent extends PoChartBaseComponent implements OnInit, A
     originalRadiusGauge: any;
     chartMarginTop: string;
     isTypeBar: boolean;
+    isTypeRadar: boolean;
     boundaryGap: boolean;
     listTypePieDonut: Array<any>;
     itemsTypeDonut: Array<any>;
@@ -11565,6 +11760,7 @@ declare class PoChartComponent extends PoChartBaseComponent implements OnInit, A
     private setTableProperties;
     private setTablePropertiesTypeBar;
     private setTablePropertiesTypeGauge;
+    private setTablePropertiesTypeRadar;
     private setTableColumns;
     private downloadCsv;
     private exportImage;
@@ -14357,6 +14553,16 @@ declare abstract class PoInputBaseComponent implements ControlValueAccessor, Val
      * @default `false`
      */
     errorLimit: boolean;
+    /**
+     * @optional
+     *
+     * @description
+     * Exibe um ícone de carregamento no lado direito do campo para sinalizar que uma operação está em andamento.
+     *
+     * @default `false`
+     */
+    set loading(value: boolean);
+    get loading(): boolean;
     /**
      * @optional
      *
@@ -14479,6 +14685,7 @@ declare abstract class PoInputBaseComponent implements ControlValueAccessor, Val
     protected onTouched: any;
     protected passedWriteValue: boolean;
     protected validatorChange: any;
+    private _loading;
     private _maxlength?;
     private _minlength?;
     private _noAutocomplete?;
@@ -14679,6 +14886,7 @@ declare abstract class PoInputBaseComponent implements ControlValueAccessor, Val
     writeValue(value: any): void;
     protected validateModel(): void;
     protected isAdditionalHelpEventTriggered(): boolean;
+    mapSizeToIcon(size: string): string;
     private validatePatternOnWriteValue;
     /**
      * Função que atribui foco ao componente.
@@ -14704,7 +14912,7 @@ declare abstract class PoInputBaseComponent implements ControlValueAccessor, Val
     };
     abstract getScreenValue(): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoInputBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoInputBaseComponent, never, never, { "additionalHelpEventTrigger": { "alias": "additionalHelpEventTrigger"; "required": false; }; "additionalHelpTooltip": { "alias": "p-additional-help-tooltip"; "required": false; }; "appendBox": { "alias": "p-append-in-body"; "required": false; }; "autoFocus": { "alias": "p-auto-focus"; "required": false; }; "icon": { "alias": "p-icon"; "required": false; }; "emitAllChanges": { "alias": "p-emit-all-changes"; "required": false; }; "label": { "alias": "p-label"; "required": false; }; "help": { "alias": "p-help"; "required": false; }; "name": { "alias": "name"; "required": false; }; "errorAsyncProperties": { "alias": "p-error-async-properties"; "required": false; }; "errorPattern": { "alias": "p-error-pattern"; "required": false; }; "errorLimit": { "alias": "p-error-limit"; "required": false; }; "optional": { "alias": "p-optional"; "required": false; }; "showErrorMessageRequired": { "alias": "p-required-field-error-message"; "required": false; }; "upperCase": { "alias": "p-upper-case"; "required": false; }; "maskNoLengthValidation": { "alias": "p-mask-no-length-validation"; "required": false; }; "noAutocomplete": { "alias": "p-no-autocomplete"; "required": false; }; "placeholder": { "alias": "p-placeholder"; "required": false; }; "setDisabled": { "alias": "p-disabled"; "required": false; }; "setReadonly": { "alias": "p-readonly"; "required": false; }; "setRequired": { "alias": "p-required"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; "showRequired": { "alias": "p-show-required"; "required": false; }; "setClean": { "alias": "p-clean"; "required": false; }; "setPattern": { "alias": "p-pattern"; "required": false; }; "maxlength": { "alias": "p-maxlength"; "required": false; }; "minlength": { "alias": "p-minlength"; "required": false; }; "setMask": { "alias": "p-mask"; "required": false; }; "setMaskFormatModel": { "alias": "p-mask-format-model"; "required": false; }; "poHelperComponent": { "alias": "p-helper"; "required": false; "isSignal": true; }; "labelTextWrap": { "alias": "p-label-text-wrap"; "required": false; "isSignal": true; }; }, { "additionalHelp": "p-additional-help"; "blur": "p-blur"; "enter": "p-enter"; "change": "p-change"; "changeModel": "p-change-model"; "keydown": "p-keydown"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoInputBaseComponent, never, never, { "additionalHelpEventTrigger": { "alias": "additionalHelpEventTrigger"; "required": false; }; "additionalHelpTooltip": { "alias": "p-additional-help-tooltip"; "required": false; }; "appendBox": { "alias": "p-append-in-body"; "required": false; }; "autoFocus": { "alias": "p-auto-focus"; "required": false; }; "icon": { "alias": "p-icon"; "required": false; }; "emitAllChanges": { "alias": "p-emit-all-changes"; "required": false; }; "label": { "alias": "p-label"; "required": false; }; "help": { "alias": "p-help"; "required": false; }; "name": { "alias": "name"; "required": false; }; "errorAsyncProperties": { "alias": "p-error-async-properties"; "required": false; }; "errorPattern": { "alias": "p-error-pattern"; "required": false; }; "errorLimit": { "alias": "p-error-limit"; "required": false; }; "loading": { "alias": "p-loading"; "required": false; }; "optional": { "alias": "p-optional"; "required": false; }; "showErrorMessageRequired": { "alias": "p-required-field-error-message"; "required": false; }; "upperCase": { "alias": "p-upper-case"; "required": false; }; "maskNoLengthValidation": { "alias": "p-mask-no-length-validation"; "required": false; }; "noAutocomplete": { "alias": "p-no-autocomplete"; "required": false; }; "placeholder": { "alias": "p-placeholder"; "required": false; }; "setDisabled": { "alias": "p-disabled"; "required": false; }; "setReadonly": { "alias": "p-readonly"; "required": false; }; "setRequired": { "alias": "p-required"; "required": false; }; "size": { "alias": "p-size"; "required": false; }; "showRequired": { "alias": "p-show-required"; "required": false; }; "setClean": { "alias": "p-clean"; "required": false; }; "setPattern": { "alias": "p-pattern"; "required": false; }; "maxlength": { "alias": "p-maxlength"; "required": false; }; "minlength": { "alias": "p-minlength"; "required": false; }; "setMask": { "alias": "p-mask"; "required": false; }; "setMaskFormatModel": { "alias": "p-mask-format-model"; "required": false; }; "poHelperComponent": { "alias": "p-helper"; "required": false; "isSignal": true; }; "labelTextWrap": { "alias": "p-label-text-wrap"; "required": false; "isSignal": true; }; }, { "additionalHelp": "p-additional-help"; "blur": "p-blur"; "enter": "p-enter"; "change": "p-change"; "changeModel": "p-change-model"; "keydown": "p-keydown"; }, never, never, true, never>;
     static ngAcceptInputType_appendBox: any;
     static ngAcceptInputType_autoFocus: any;
     static ngAcceptInputType_emitAllChanges: any;

package/lib/components/po-chart/enums/po-chart-type.enum.d.ts

@@ -38,5 +38,9 @@ export declare enum PoChartType {
      * - É possível demonstrar um dado percentual simples em conjunto com uma descrição resumida em seu interior;
      * - Para um demonstrativo mais elaborado, consegue-se definir alcances em cores, um breve texto descritivo e um ponteiro indicando o valor desejado.
      */
-    Gauge = "gauge"
+    Gauge = "gauge",
+    /**
+     * Tipo de gráfico utilizado para visualizar e comparar o desempenho de diferentes itens em múltiplas categorias.
+     */
+    Radar = "radar"
 }

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

@@ -1,11 +1,11 @@
-export * from './enums/po-chart-type.enum';
 export * from './enums/po-chart-label-format.enum';
-export * from './interfaces/po-chart-serie.interface';
+export * from './enums/po-chart-type.enum';
 export * from './interfaces/po-chart-serie-data-label.interface';
-export * from './interfaces/po-chart-options.interface';
-export * from './interfaces/po-chart-literals.interface';
 export * from './interfaces/po-chart-literals-default.interface';
 export * from './interfaces/po-chart-header-options.interface';
 export * from './interfaces/po-chart-axis-options.interface';
+export * from './interfaces/po-chart-literals.interface';
+export * from './interfaces/po-chart-options.interface';
+export * from './interfaces/po-chart-serie.interface';
 export * from './po-chart.component';
 export * from './po-chart.module';