@po-ui/ng-components 19.15.0 → 19.16.0

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

@@ -1,10 +1,11 @@
-import { EventEmitter, OnChanges, SimpleChanges } from '@angular/core';
-import { PoChartContainerSize } from './interfaces/po-chart-container-size.interface';
-import { PoChartType } from './enums/po-chart-type.enum';
-import { PoChartOptions } from './interfaces/po-chart-options.interface';
-import { PoChartSerie } from './interfaces/po-chart-serie.interface';
-import { PoColorService } from '../../services/po-color/po-color.service';
-import { PoChartDataLabel } from './interfaces/po-chart-serie-data-label.interface';
+import { EventEmitter, OnInit } from '@angular/core';
+import { PoLanguageService } from '../../services/po-language/po-language.service';
+import { PoChartType } from '../po-chart/enums/po-chart-type.enum';
+import { PoChartLiterals } from '../po-chart/interfaces/po-chart-literals.interface';
+import { PoChartOptions } from '../po-chart/interfaces/po-chart-options.interface';
+import { PoChartDataLabel } from '../po-chart/interfaces/po-chart-serie-data-label.interface';
+import { PoChartSerie } from '../po-chart/interfaces/po-chart-serie.interface';
+import { PoPopupAction } from '../po-popup';
 import * as i0 from "@angular/core";
 /**
  * @description
@@ -23,96 +24,84 @@ import * as i0 from "@angular/core";
  *
  * > Veja nosso [guia de uso para gráficos](/guides/guide-charts) para auxiliar na construção do seu gráfico,
  * informando em qual caso utilizar, o que devemos evitar e boas práticas relacionada a cores.
+ *
+ * #### Tokens customizáveis
+ *
+ * É possível alterar o estilo do componente usando os seguintes tokens (CSS):
+ *
+ * > Para maiores informações, acesse o guia [Personalizando o Tema Padrão com Tokens CSS](https://po-ui.io/guides/theme-customization).
+ *
+ * | Propriedade                              | Descrição                                                               | Valor Padrão                                      |
+ * |------------------------------------------|-------------------------------------------------------------------------|---------------------------------------------------|
+ * | **Chart (po-chart)**                     |                                                                         |                                                   |
+ * | `--background-color-grid`                | Cor de background dos gráficos                                          | `var(--color-neutral-light-00)`                   |
+ * | `--color-description-chart`              | Cor da descrição dos gráficos                                           | `var(--color-neutral-dark-70)`                    |
+ * | `--font-family-description-chart`        | Fonte da descrição dos gráficos                                         | `var(--font-family-theme)`                        |
+ * | `--font-size-description-chart`          | Tamanho da fonte da descrição dos gráficos                              | `var(--font-size-sm)`                             |
+ * | `--font-weight-description-chart`        | Peso da fonte da descrição dos gráficos                                 | `var(--font-weight-normal)`                       |
+ * | **Header (po-chart .po-chart-header )**  |                                                                         |                                                   |
+ * | `--background-color`                     | Cor de background do cabeçalho                                          | `var(--color-neutral-light-00)`                   |
+ * | `--color`                                | Cor da fonte do cabeçalho                                               | `var(--color-neutral-dark-70)`                    |
+ * | `--font-family`                          | Família tipográfica usada                                               | `var(--font-family-theme)`                        |
+ * | `--font-size-title`                      | Tamanho da fonte                                                        | `var(--font-size-default)`                        |
+ * | `--font-size-icons`                      | Tamanho dos ícones                                                      | `var(--font-size-md)`                             |
+ * | `--font-weight`                          | Peso da fonte                                                           | `var(--font-weight-bold)`                         |
+ * | **Chart (po-chart .po-chart)**           |                                                                         |                                                   |
+ * | `--color-grid`                           | Cor da linha dos gráficos que possuem eixo                              | `var(--color-neutral-light-20)`                   |
+ * | `--font-family-grid`                     | Família tipográfica usada nos valores dos eixos                         | `var(--font-family-theme)`                        |
+ * | `--font-size-grid`                       | Tamanho da fonte usada nos valores dos eixos                            | `var(--font-size-xs)`                             |
+ * | `--font-weight-grid`                     | Peso da fonte usada nos valores dos eixos                               | `var(--font-weight-normal)`                       |
+ * | `--color-legend`                         | Cor da fonte da legenda                                                 | `var(--color-neutral-dark-70)`                    |
+ * | `--border-radius-bar`                    | Tamanho da borda nos graficos `Bar` e `Column`                          | `var(--border-radius-none)`                       |
+ * | `--border-color`                         | Cor da borda do gráfico nos Gráficos `Donut` e `Pie`                    | `var(--color-neutral-light-00)`                   |
+ * | `--color-hightlight-value`               | Cor do valor de destaque nos Gráficos `Donut` e `Gauge`                 | `var(--color-neutral-dark-70)`                    |
+ * | `--font-family-hightlight-value`         | Família tipográfica do valor de destaque nos Gráficos `Donut` e `Gauge` | `var(--font-family-theme)`                        |
+ * | `--font-weight-hightlight-value`         | Peso da fonte do valor de destaque nos Gráficos `Donut` e `Gauge`       | `var(--font-weight-bold)`                         |
+ * | `--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)`                   |
+ * | **Wrapper (.po-chart-container-gauge)**  |                                                                         |                                                   |
+ * | `--background-color-container-gauge`     | Cor de background do container do gauge                                 | `var(--color-neutral-light-00)`                   |
  */
-export declare abstract class PoChartBaseComponent implements OnChanges {
-    protected colorService: PoColorService;
+export declare abstract class PoChartBaseComponent implements OnInit {
+    private _literals?;
+    private setHeightGauge;
+    private readonly language;
+    id: string;
     /** Define o título do gráfico. */
     title?: string;
     /**
-     * @optional
-     *
-     * @description
-     *
-     * Evento executado quando o usuário clicar sobre um elemento do gráfico.
-     *
-     * O evento emitirá o seguinte parâmetro:
-     * - *donut* e *pie*: um objeto contendo a categoria e valor da série.
-     * - *area*, *line*, *column* e *bar*: um objeto contendo o nome da série, valor e categoria do eixo do gráfico.
-     */
-    seriesClick: EventEmitter<PoChartSerie>;
-    /**
-     * @optional
-     *
      * @description
      *
-     * Evento executado quando o usuário passar o *mouse* sobre um elemento do gráfico.
-     *
-     * 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.
-     * - *area*, *line*, *column* e *bar*: um objeto contendo a categoria, valor da série e categoria do eixo do gráfico.
+     * Define os elementos do gráfico que serão criados dinamicamente.
      */
-    seriesHover: EventEmitter<PoChartSerie>;
-    chartSeries: Array<PoChartSerie>;
-    chartType: PoChartType;
-    svgContainerSize: PoChartContainerSize;
-    private _options;
-    private _categories;
-    private _height;
-    private _series;
-    private _type;
-    private defaultType;
+    series: Array<PoChartSerie>;
     /**
-     * @optional
-     *
      * @description
      *
-     * Define a altura do gráfico.
-     *
-     * > O valor mínimo aceito nesta propriedade é 200.
-     *
-     * @default `400px`
+     * Define o valor do gráfico do tipo `Gauge` quando utliza as propriedades `From` `To`.
      */
-    set height(value: number);
-    get height(): number;
+    valueGaugeMultiple?: number;
     /**
      * @optional
      *
      * @description
      *
-     * Define o tipo de gráfico.
-     *
-     * É possível também combinar gráficos dos tipos linha e coluna. Para isso, opte pela declaração de `type` conforme a interface `PoChartSerie`.
-     *
-     * > Note que, se houver declaração de tipo de gráfico tanto em `p-type` quanto em `PochartSerie.type`, o valor `{ type }` da primeira série anulará o valor definido em `p-type`.
-     *
-     * Se não passado valor, o padrão será relativo à primeira série passada em `p-series`:
-     * - Se `p-series = [{ data: [1,2,3] }]`: será `PoChartType.Column`.
-     * - Se `p-series = [{ data: 1 }]`: será `PoChartType.Pie`.
+     * 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`.
      *
-     * > Veja os valores válidos no *enum* `PoChartType`.
-     */
-    set type(value: PoChartType);
-    get type(): PoChartType;
-    /**
-     * @description
+     * > 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.
      *
-     * Define os elementos do gráfico que serão criados dinamicamente.
+     * > Caso não seja especificado um valor para a categoria, será plotado um hífen na categoria referente a cada série.
      */
-    set series(value: Array<PoChartSerie>);
-    get series(): Array<PoChartSerie>;
+    categories?: Array<string>;
     /**
      * @optional
      *
      * @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`.
-     *
-     * > 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 não seja especificado um valor para a categoria, será plotado um hífen na categoria referente a cada série.
+     * Essa propriedade permite que o desenvolvedor adicione ações customizadas no popup do header, oferecendo mais flexibilidade e controle sobre as interações do componente.
      */
-    set categories(value: Array<string>);
-    get categories(): Array<string>;
+    customActions?: Array<PoPopupAction>;
     /**
      * @optional
      *
@@ -134,8 +123,7 @@ export declare abstract class PoChartBaseComponent implements OnChanges {
      *  };
      * ```
      */
-    set options(value: PoChartOptions);
-    get options(): PoChartOptions;
+    options?: PoChartOptions;
     /**
      * @optional
      *
@@ -159,20 +147,92 @@ export declare abstract class PoChartBaseComponent implements OnChanges {
      * ```
      */
     dataLabel?: PoChartDataLabel;
-    constructor(colorService: PoColorService);
-    get isTypeCircular(): boolean;
-    ngOnChanges(changes: SimpleChanges): void;
-    onSeriesClick(event: any): void;
-    onSeriesHover(event: any): void;
-    private setDefaultHeight;
-    private transformObjectToArrayObject;
-    private setTypeDefault;
-    private validateSerieAndAddType;
-    private appendColors;
-    private appendType;
-    abstract rebuildComponentRef(): void;
-    protected abstract getSvgContainerSize(): void;
-    protected abstract calculateAxisXLabelArea(): number;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define a altura do gráfico em px.
+     *
+     * > No caso do tipo `Gauge`, o valor padrão é `300` e esse é seu valor minimo aceito. Nos outros tipos, o valor mínimo aceito nesta propriedade é 200.
+     *
+     * @default `400`
+     */
+    set height(value: number);
+    get height(): number;
+    private _height;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define o tipo de gráfico.
+     *
+     * É possível também combinar gráficos dos tipos linha e coluna. Para isso, opte pela declaração de `type` conforme a interface `PoChartSerie`.
+     *
+     * > Note que, se houver declaração de tipo de gráfico tanto em `p-type` quanto em `PochartSerie.type`, o valor `{ type }` da primeira série anulará o valor definido em `p-type`.
+     *
+     * Se não passado valor, o padrão será relativo à primeira série passada em `p-series`:
+     * - Se `p-series = [{ data: [1,2,3] }]`: será `PoChartType.Column`.
+     * - Se `p-series = [{ data: 1 }]`: será `PoChartType.Pie`.
+     *
+     * > Veja os valores válidos no *enum* `PoChartType`.
+     */
+    type: PoChartType;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Objeto com as literais usadas no `po-chart`.
+     *
+     * Para utilizar basta passar a literal que deseja customizar:
+     *
+     * ```
+     *  const customLiterals: PoChartLiterals = {
+     *    downloadCSV: 'Obter CSV',
+     *  };
+     * ```
+     *
+     * E para carregar a literal customizada, basta apenas passar o objeto para o componente.
+     *
+     * ```
+     * <po-chart
+     *   [p-literals]="customLiterals">
+     * </po-chart>
+     * ```
+     *
+     * > O objeto padrão de literais será traduzido de acordo com o idioma do
+     * [`PoI18nService`](/documentation/po-i18n) ou do browser.
+     */
+    set literals(value: PoChartLiterals);
+    get literals(): PoChartLiterals;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Evento executado quando o usuário clicar sobre um elemento do gráfico.
+     *
+     * O evento emitirá o seguinte parâmetro:
+     * - *donut* e *pie*: um objeto contendo a categoria e valor da série.
+     * - *area*, *line*, *column* e *bar*: um objeto contendo o nome da série, valor e categoria do eixo do gráfico.
+     */
+    seriesClick: EventEmitter<any>;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Evento executado quando o usuário passar o *mouse* sobre um elemento do gráfico.
+     *
+     * 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.
+     * - *area*, *line*, *column* e *bar*: um objeto contendo a categoria, valor da série e categoria do eixo do gráfico.
+     */
+    seriesHover: EventEmitter<any>;
+    constructor(languageService: PoLanguageService);
+    ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoChartBaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<PoChartBaseComponent, never, never, { "title": { "alias": "p-title"; "required": false; }; "height": { "alias": "p-height"; "required": false; }; "type": { "alias": "p-type"; "required": false; }; "series": { "alias": "p-series"; "required": false; }; "categories": { "alias": "p-categories"; "required": false; }; "options": { "alias": "p-options"; "required": false; }; "dataLabel": { "alias": "p-data-label"; "required": false; }; }, { "seriesClick": "p-series-click"; "seriesHover": "p-series-hover"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PoChartBaseComponent, never, never, { "id": { "alias": "t-id"; "required": false; }; "title": { "alias": "p-title"; "required": false; }; "series": { "alias": "p-series"; "required": false; }; "valueGaugeMultiple": { "alias": "p-value-gauge-multiple"; "required": false; }; "categories": { "alias": "p-categories"; "required": false; }; "customActions": { "alias": "p-custom-actions"; "required": false; }; "options": { "alias": "p-options"; "required": false; }; "dataLabel": { "alias": "p-data-label"; "required": false; }; "height": { "alias": "p-height"; "required": false; }; "type": { "alias": "p-type"; "required": false; }; "literals": { "alias": "p-literals"; "required": false; }; }, { "seriesClick": "p-series-click"; "seriesHover": "p-series-hover"; }, never, never, true, never>;
 }

package/lib/components/po-chart/po-chart-gauge-utils.d.ts

@@ -0,0 +1,22 @@
+import { PoChartComponent } from './po-chart.component';
+export declare class PoChartGaugeUtils {
+    private readonly component;
+    constructor(component: PoChartComponent);
+    setGaugeOptions(options: any, fontSizeText: any): void;
+    setListTypeGauge(serie: any, fontSizes: {
+        fontSizeMd: number;
+        fontSizeLg: number;
+        fontSizeSubtitle: number;
+    }): any;
+    private setPropertiesGauge;
+    setPropertiesDefaultHeight(center: [string, string]): {
+        radius: string;
+        lengthPointer: string;
+        center: [string, string];
+        widthSubtitle: number;
+    };
+    setSerieTypeGauge(serie: any, color: string): void;
+    private normalizeToRelativePercentage;
+    finalizeSerieTypeGauge(serie: any): any[];
+    private buildGaugeAxisLineColorsWithGaps;
+}

package/lib/components/{po-chart-new → po-chart}/po-chart-grid-utils.d.ts

@@ -1,9 +1,9 @@
-import { PoChartNewComponent } from './po-chart-new.component';
+import { PoChartComponent } from './po-chart.component';
 import { PoChartType } from '../po-chart/enums/po-chart-type.enum';
 export declare class PoChartGridUtils {
     private readonly component;
     private isTypeDonut;
-    constructor(component: PoChartNewComponent);
+    constructor(component: PoChartComponent);
     setGridOption(options: any): void;
     setOptionsAxis(options: any): void;
     setOptionDataZoom(options: any): void;

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

@@ -0,0 +1,11 @@
+import { PoModalComponent } from '../../po-modal';
+import * as i0 from "@angular/core";
+export declare class PoChartModalTableComponent {
+    modalComponent: PoModalComponent;
+    title: string;
+    itemsTable: Array<any>;
+    columnsTable: Array<any>;
+    actionModal: any;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PoChartModalTableComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PoChartModalTableComponent, "po-chart-modal-table", never, { "title": { "alias": "title"; "required": false; }; "itemsTable": { "alias": "itemsTable"; "required": false; }; "columnsTable": { "alias": "columnsTable"; "required": false; }; "actionModal": { "alias": "actionModal"; "required": false; }; }, {}, never, never, true, never>;
+}

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

@@ -1,8 +1,14 @@
-import { AfterViewInit, ChangeDetectorRef, ComponentFactoryResolver, DoCheck, ElementRef, OnDestroy, ViewContainerRef, OnInit, Renderer2 } from '@angular/core';
+import { AfterViewInit, ChangeDetectorRef, ElementRef, OnChanges, OnDestroy, OnInit, QueryList, SimpleChanges } from '@angular/core';
+import { CurrencyPipe, DecimalPipe } from '@angular/common';
+import { PoTooltipDirective } from '../../directives';
+import { PoColorService } from '../../services/po-color';
+import { PoLanguageService } from '../../services/po-language/po-language.service';
+import { PoModalAction } from '../po-modal';
+import { PoPopupAction } from '../po-popup';
+import { PoTableColumn } from '../po-table';
 import { PoChartBaseComponent } from './po-chart-base.component';
-import { PoChartSvgContainerService } from './services/po-chart-svg-container.service';
-import { PoColorService } from '../../services/po-color/po-color.service';
-import { PoChartMathsService } from './services/po-chart-maths.service';
+import { PoChartGridUtils } from './po-chart-grid-utils';
+import { PoChartGaugeUtils } from './po-chart-gauge-utils';
 import * as i0 from "@angular/core";
 /**
  * @docsExtends PoChartBaseComponent
@@ -24,51 +30,97 @@ import * as i0 from "@angular/core";
  *  <file name="sample-po-chart-coffee-ranking/sample-po-chart-coffee-ranking.component.ts"> </file>
  * </example>
  *
+ * <example name="po-chart-summary" title="PO Chart - Summary">
+ *  <file name="sample-po-chart-summary/sample-po-chart-summary.component.html"> </file>
+ *  <file name="sample-po-chart-summary/sample-po-chart-summary.component.ts"> </file>
+ * </example>
+ *
  * <example name="po-chart-world-exports" title="PO Chart - World Exports">
  *  <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>
  */
-export declare class PoChartComponent extends PoChartBaseComponent implements AfterViewInit, DoCheck, OnDestroy, OnInit {
-    protected colorService: PoColorService;
-    private changeDetector;
-    private containerService;
-    private componentFactoryResolver;
-    private elementRef;
-    private mathsService;
-    private renderer;
-    chartContainer: ViewContainerRef;
-    chartHeader: ElementRef;
-    chartLegend: ElementRef;
-    chartWrapper: ElementRef;
-    private calculatedComponentRefElement;
-    private calculatedSvgContainerElement;
-    private componentRef;
-    private initialized;
-    private windowResizeListener;
-    private subscription;
-    private mappings;
-    constructor(colorService: PoColorService, changeDetector: ChangeDetectorRef, containerService: PoChartSvgContainerService, componentFactoryResolver: ComponentFactoryResolver, elementRef: ElementRef, mathsService: PoChartMathsService, renderer: Renderer2);
-    onResize: () => void;
+export declare class PoChartComponent extends PoChartBaseComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {
+    el: ElementRef;
+    private readonly currencyPipe;
+    private readonly decimalPipe;
+    private readonly colorService;
+    private readonly cdr;
+    poTooltip: QueryList<PoTooltipDirective>;
+    targetRef: ElementRef;
+    chartContainer: ElementRef;
+    tooltipText: string;
+    originalHeight: number;
+    originalRadiusGauge: any;
+    chartMarginTop: string;
+    isTypeBar: boolean;
+    boundaryGap: boolean;
+    listTypePieDonut: Array<any>;
+    itemsTypeDonut: Array<any>;
+    isGaugeSingle: boolean;
+    itemsTypeGauge: Array<any>;
+    itemsColorTypeGauge: any[];
+    protected actionModal: PoModalAction;
+    showPopup: boolean;
+    protected itemsTable: any[];
+    protected columnsTable: Array<PoTableColumn>;
+    protected isExpanded: boolean;
+    protected legendData: Array<{
+        name: string;
+        color: string;
+    }>;
+    protected headerHeight: number;
+    protected paddingContainerGauge: number;
+    protected descriptionHeight: number;
+    protected positionTooltip: string;
+    protected tooltipTitle: any;
+    protected tooltipDescriptionGauge: any;
+    protected chartGridUtils: PoChartGridUtils;
+    protected chartGaugeUtils: PoChartGaugeUtils;
+    protected isTypeGauge: boolean;
+    protected popupActions: Array<PoPopupAction>;
+    private chartInstance;
+    private currentRenderer;
+    private resizeObserver;
+    private intersectionObserver;
+    private hideDomEchartsDiv;
+    private readonly vcr;
+    get showHeader(): string | boolean;
+    constructor(el: ElementRef, currencyPipe: CurrencyPipe, decimalPipe: DecimalPipe, colorService: PoColorService, cdr: ChangeDetectorRef, languageService: PoLanguageService);
+    changeTheme: (event: any) => void;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
-    ngDoCheck(): void;
     ngOnDestroy(): void;
-    resizeAction(): void;
-    ngOnInit(): void;
-    rebuildComponentRef(): void;
-    protected calculateAxisXLabelArea(): number;
-    protected getSvgContainerSize(): void;
-    private chartLegendHeight;
-    private createComponent;
-    private dynamicComponentSetting;
-    private getAxisXLabelArea;
-    private getComponentType;
-    private getChartMeasurements;
-    private removeWindowResizeListener;
-    private setComponentRefProperties;
-    private setClickSubscribe;
-    private setHoverSubscribe;
-    private setResizeListenerSubscribe;
+    showTooltipTitle(e: MouseEvent): void;
+    showTooltipDescription(e: MouseEvent): void;
+    getCSSVariable(variable: string, selector?: string): string;
+    openModal(): Promise<void>;
+    toggleExpand(): void;
+    private observeContainerResize;
+    private checkShowCEcharts;
+    private setInitialPopupActions;
+    private setHeightProperties;
+    private initECharts;
+    private initEChartsEvents;
+    private setTooltipProperties;
+    private setChartsProperties;
+    private setOptions;
+    private formatLabelOption;
+    private setOptionLegend;
+    private setSeries;
+    private setSerieEmphasis;
+    private setTypeSerie;
+    private setTableProperties;
+    private setTablePropertiesTypeBar;
+    private setTablePropertiesTypeGauge;
+    private setTableColumns;
+    private downloadCsv;
+    private exportImage;
+    private exportSvgAsImage;
+    private configureImageCanvas;
+    private setHeaderProperties;
+    private setPopupActions;
     static ɵfac: i0.ɵɵFactoryDeclaration<PoChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<PoChartComponent, "po-chart-old", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<PoChartComponent, "po-chart", never, {}, {}, never, never, false, never>;
 }

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

@@ -1,26 +1,9 @@
 import * as i0 from "@angular/core";
-import * as i1 from "./po-chart-container/po-chart-line/po-chart-area/po-chart-area.component";
-import * as i2 from "./po-chart-container/po-chart-axis/po-chart-axis.component";
-import * as i3 from "./po-chart-container/po-chart-axis/po-chart-axis-path/po-chart-axis-path.component";
-import * as i4 from "./po-chart-container/po-chart-axis/po-chart-axis-label/po-chart-axis-label.component";
-import * as i5 from "./po-chart.component";
-import * as i6 from "./po-chart-container/po-chart-container.component";
-import * as i7 from "./po-chart-legend/po-chart-legend.component";
-import * as i8 from "./po-chart-container/po-chart-line/po-chart-line.component";
-import * as i9 from "./po-chart-container/po-chart-line/po-chart-path/po-chart-path.component";
-import * as i10 from "./po-chart-container/po-chart-circular/po-chart-pie/po-chart-pie.component";
-import * as i11 from "./po-chart-container/po-chart-circular/po-chart-donut/po-chart-donut.component";
-import * as i12 from "./po-chart-container/po-chart-line/po-chart-series-point/po-chart-series-point.component";
-import * as i13 from "./po-chart-container/po-chart-bar/po-chart-bar.component";
-import * as i14 from "./po-chart-container/po-chart-bar/po-chart-column/po-chart-column.component";
-import * as i15 from "./po-chart-container/po-chart-bar/po-chart-bar-path/po-chart-bar-path.component";
-import * as i16 from "./po-chart-container/po-chart-circular/po-chart-circular-path/po-chart-circular-path.component";
-import * as i17 from "./po-chart-container/po-chart-circular/po-chart-circular-label/po-chart-circular-label.component";
-import * as i18 from "./po-chart-container/po-chart-circular/po-chart-circular-path/po-chart-tooltip.directive";
-import * as i19 from "./directives/po-resize-observer.directive";
-import * as i20 from "./po-chart-switch.component";
-import * as i21 from "@angular/common";
-import * as i22 from "../../directives/po-tooltip/po-tooltip.module";
+import * as i1 from "./po-chart.component";
+import * as i2 from "@angular/common";
+import * as i3 from "../../directives/po-tooltip/po-tooltip.module";
+import * as i4 from "../po-button/po-button.module";
+import * as i5 from "../po-popup/po-popup.module";
 /**
  * @description
  *
@@ -28,6 +11,6 @@ import * as i22 from "../../directives/po-tooltip/po-tooltip.module";
  */
 export declare class PoChartModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<PoChartModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<PoChartModule, [typeof i1.PoChartAreaComponent, typeof i2.PoChartAxisComponent, typeof i3.PoChartAxisPathComponent, typeof i4.PoChartAxisLabelComponent, typeof i5.PoChartComponent, typeof i6.PoChartContainerComponent, typeof i7.PoChartLegendComponent, typeof i8.PoChartLineComponent, typeof i9.PoChartPathComponent, typeof i10.PoChartPieComponent, typeof i11.PoChartDonutComponent, typeof i12.PoChartSeriesPointComponent, typeof i13.PoChartBarComponent, typeof i14.PoChartColumnComponent, typeof i15.PoChartBarPathComponent, typeof i16.PoChartCircularPathComponent, typeof i17.PoChartCircularLabelComponent, typeof i18.PoChartTooltipDirective, typeof i19.PoResizeObserverDirective, typeof i20.PoChartSwitchComponent], [typeof i21.CommonModule, typeof i22.PoTooltipModule], [typeof i5.PoChartComponent, typeof i20.PoChartSwitchComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<PoChartModule, [typeof i1.PoChartComponent], [typeof i2.CommonModule, typeof i3.PoTooltipModule, typeof i4.PoButtonModule, typeof i5.PoPopupModule], [typeof i1.PoChartComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<PoChartModule>;
 }

package/lib/components/po-field/po-multiselect/po-multiselect-base.component.d.ts

@@ -33,8 +33,6 @@ export declare const poMultiselectLiteralsDefault: {
  *
  * - Caso a lista apresente menos de 5 itens, considere utilizar outro componente;
  * - Não utilize o multiselect caso o usuário possa selecionar apenas uma opção. Para esse caso, opte por utilizar po-radio ou po-select;
- * - Sempre que possível, agrupe as opções e use labels curtas para descrever o conteúdo. Exemplo: em uma combinação de alimentos,
- * as opções podem ser agrupadas por Vegetais, Frutas, etc;
  *
  * #### Acessibilidade tratada no componente
  *

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

@@ -1,3 +1,4 @@
 export * from './interfaces/po-gauge-ranges.interface';
+export * from './interfaces/po-gauge-options.interface';
 export * from './po-gauge.component';
 export * from './po-gauge.module';

package/lib/components/po-gauge/interfaces/po-gauge-options.interface.d.ts

@@ -0,0 +1,69 @@
+import { PoChartHeaderOptions } from '../../po-chart';
+/**
+ * @usedBy PoGaugeComponent
+ *
+ * @description
+ *
+ * *Interface* para configurações dos elementos do gráfico.
+ */
+export interface PoGaugeOptions {
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define a descrição do gráfico exibido acima do gráfico.
+     *
+     */
+    descriptionChart?: string;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define um objeto do tipo `PoChartHeaderOptions` para configurar a exibição de botões no cabeçalho do gráfico.
+     */
+    header?: PoChartHeaderOptions;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Esconde a estilização do container em volta do gráfico.
+     *
+     * @default `true`
+     */
+    showContainerGauge?: boolean;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Exibe os valores das propriedades `from` e `to` no gráfico do  no texto da legenda entre parênteses.
+     *
+     * > Válido para gráfico do tipo `Gauge`.
+     *
+     */
+    showFromToLegend?: boolean;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define um subtítulo para o Gauge. Indicamos um subtítulo pequeno, com uma quantidade máxima de 32 caracteres na altura padrão.
+     *
+     */
+    subtitleGauge?: string;
+    /**
+     * @optional
+     *
+     * @description
+     *
+     * Define a exibição do ponteiro.
+     *
+     * > Válido para gráfico do tipo `Gauge`.
+     *
+     * @default `true`
+     */
+    pointer?: boolean;
+}