@po-ui/ng-components 20.11.0 → 20.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/fesm2022/po-ui-ng-components.mjs +423 -88
  2. package/fesm2022/po-ui-ng-components.mjs.map +1 -1
  3. package/index.d.ts +277 -69
  4. package/lib/components/po-chart/enums/po-chart-type.enum.d.ts +5 -1
  5. package/lib/components/po-chart/index.d.ts +4 -4
  6. package/lib/components/po-chart/interfaces/po-chart-indicator-options.interface.d.ts +50 -0
  7. package/lib/components/po-chart/interfaces/po-chart-options.interface.d.ts +17 -1
  8. package/lib/components/po-chart/interfaces/po-chart-radar-options.interface.d.ts +38 -0
  9. package/lib/components/po-chart/interfaces/po-chart-serie-data-label.interface.d.ts +1 -2
  10. package/lib/components/po-chart/interfaces/po-chart-serie.interface.d.ts +15 -5
  11. package/lib/components/po-chart/po-chart-base.component.d.ts +22 -9
  12. package/lib/components/po-chart/po-chart-grid-utils.d.ts +45 -0
  13. package/lib/components/po-chart/po-chart.component.d.ts +7 -0
  14. package/lib/components/po-field/po-input/po-input-base.component.d.ts +12 -0
  15. package/lib/components/po-icon/po-icon.component.d.ts +3 -1
  16. package/lib/components/po-listbox/po-item-list/po-item-list-base.component.d.ts +8 -0
  17. package/lib/components/po-listbox/po-listbox.component.d.ts +2 -1
  18. package/lib/components/po-popup/po-popup-action.interface.d.ts +1 -0
  19. package/lib/components/po-popup/po-popup-base.component.d.ts +1 -0
  20. package/lib/components/po-popup/po-popup.component.d.ts +4 -2
  21. package/lib/components/po-tag/po-tag-base.component.d.ts +2 -1
  22. package/lib/components/po-tag/po-tag.component.d.ts +0 -2
  23. package/lib/utils/util.d.ts +12 -0
  24. package/package.json +4 -4
  25. package/po-ui-ng-components-20.12.0.tgz +0 -0
  26. package/schematics/ng-add/index.js +1 -1
  27. package/schematics/ng-update/v14/index.js +1 -1
  28. package/schematics/ng-update/v15/index.js +1 -1
  29. package/schematics/ng-update/v16/index.js +1 -1
  30. package/schematics/ng-update/v17/index.js +1 -1
  31. package/schematics/ng-update/v18/index.js +2 -2
  32. package/schematics/ng-update/v19/index.js +2 -2
  33. package/schematics/ng-update/v2/index.js +1 -1
  34. package/schematics/ng-update/v20/index.js +2 -2
  35. package/schematics/ng-update/v3/index.js +1 -1
  36. package/schematics/ng-update/v4/index.js +1 -1
  37. package/schematics/ng-update/v5/index.js +1 -1
  38. package/schematics/ng-update/v6/index.js +1 -1
  39. package/po-ui-ng-components-20.11.0.tgz +0 -0
@@ -0,0 +1,50 @@
1
+ /**
2
+ * @usedBy PoChartComponent
3
+ *
4
+ * @description
5
+ *
6
+ * Interface para configurações dos indicadores do gráfico `radar`.
7
+ */
8
+ export interface PoChartIndicatorOptions {
9
+ /**
10
+ * @optional
11
+ *
12
+ * @description
13
+ *
14
+ * Cor do texto do indicator.
15
+ * Recomendamos avaliar o contraste da cor definida para garantir melhor acessibilidade.
16
+ *
17
+ * > Nome da cor, hexadecimal ou RGB.
18
+ */
19
+ color?: string;
20
+ /**
21
+ * @optional
22
+ *
23
+ * @description
24
+ *
25
+ * Nome do indicator.
26
+ */
27
+ name?: string;
28
+ /**
29
+ * @optional
30
+ *
31
+ * @description
32
+ *
33
+ * Valor máximo do indicator.
34
+ *
35
+ * A propriedade `max` não impede que a série contenha valores superiores ao máximo definido.
36
+ * Caso isso ocorra, os valores poderão extrapolar os limites do gráfico.
37
+ */
38
+ max?: number;
39
+ /**
40
+ * @optional
41
+ *
42
+ * @description
43
+ *
44
+ * Valor mínimo do indicator, com valor padrão de 0.
45
+ *
46
+ * A propriedade `min` não impede que a série contenha valores inferiores ao mínimo definido.
47
+ * Caso isso ocorra, os valores serão apresentados ao centro do gráfico.
48
+ */
49
+ min?: number;
50
+ }
@@ -8,6 +8,7 @@ import { PoChartHeaderOptions } from './po-chart-header-options.interface';
8
8
  * *Interface* para configurações dos elementos do gráfico.
9
9
  */
10
10
  export interface PoChartOptions {
11
+ [key: string]: any;
11
12
  /**
12
13
  * @optional
13
14
  *
@@ -42,11 +43,24 @@ export interface PoChartOptions {
42
43
  * Define se os pontos do gráfico serão preenchidos.
43
44
  * Quando true, os pontos são totalmente coloridos. Quando false, apenas a borda dos pontos será exibida, mantendo o interior transparente.
44
45
  *
45
- * > Esta propriedade é utilizável para os gráficos dos tipos `Area` e `Line`.
46
+ * > Esta propriedade é utilizável para os gráficos dos tipos `Area`, `Line` e `Radar`.
47
+ * > Para o tipo `Radar`, o valor padrão é `true`.
46
48
  *
47
49
  * @default `false`
48
50
  */
49
51
  fillPoints?: boolean;
52
+ /**
53
+ * @optional
54
+ *
55
+ * @description
56
+ *
57
+ * Define se as séries terão sua área preenchida.
58
+ *
59
+ * > 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`.
60
+ *
61
+ * @default `false`
62
+ */
63
+ areaStyle?: boolean;
50
64
  /**
51
65
  * @optional
52
66
  *
@@ -92,6 +106,8 @@ export interface PoChartOptions {
92
106
  * @description
93
107
  *
94
108
  * Define a exibição da legenda do gráfico. Valor padrão é `true`
109
+ *
110
+ * @default `true`
95
111
  */
96
112
  legend?: boolean;
97
113
  /**
@@ -0,0 +1,38 @@
1
+ import { PoChartIndicatorOptions } from './po-chart-indicator-options.interface';
2
+ /**
3
+ * @usedBy PoChartComponent
4
+ *
5
+ * @description
6
+ *
7
+ * *Interface* para configurações do gráfico `radar`.
8
+ */
9
+ export interface PoChartRadarOptions {
10
+ /**
11
+ * @optional
12
+ *
13
+ * @description
14
+ *
15
+ * Define as configurações dos indicadores do gráfico, como nome, cor, valor mínimo e valor máximo.
16
+ */
17
+ indicator?: Array<PoChartIndicatorOptions>;
18
+ /**
19
+ * @optional
20
+ *
21
+ * @description
22
+ *
23
+ * Define o formato da grid, podendo ser exibida como polígono ou círculo.
24
+ *
25
+ * @default `polygon`
26
+ */
27
+ shape?: 'polygon' | 'circle';
28
+ /**
29
+ * @optional
30
+ *
31
+ * @description
32
+ *
33
+ * Define o efeito zebrado na grid.
34
+ *
35
+ * @default 'false'
36
+ */
37
+ splitArea?: boolean;
38
+ }
@@ -5,7 +5,6 @@
5
5
  *
6
6
  * Interface que define as propriedades de exibição dos rótulos das séries no `po-chart`.
7
7
  *
8
- * > Aplicável apenas para gráficos do tipo `line`.
9
8
  */
10
9
  export interface PoChartDataLabel {
11
10
  /**
@@ -19,7 +18,7 @@ export interface PoChartDataLabel {
19
18
  * - O *tooltip* não será exibido.
20
19
  * - As outras séries ficarão com opacidade reduzida ao passar o mouse sobre a série ativa.
21
20
  *
22
- * > Disponível para os tipo de gráfico `PoChartType.Line`, `PoChartType.Area`, `PoChartType.Column` e `PoChartType.Bar`.
21
+ * > Disponível para os tipo de gráfico `PoChartType.Line`, `PoChartType.Area`, `PoChartType.Column`, `PoChartType.Bar e PoChartType.Radar`.
23
22
  */
24
23
  fixed?: boolean;
25
24
  }
@@ -4,7 +4,7 @@ import { PoChartType } from '../enums/po-chart-type.enum';
4
4
  *
5
5
  * @description
6
6
  *
7
- * Interface das series dinâmicas do `po-chart` que possibilita desenhar gráficos dos tipos `area`, `bar`, `column`, `line`, `donut` e `pie`
7
+ * Interface das series dinâmicas do `po-chart` que possibilita desenhar gráficos dos tipos `area`, `bar`, `column`, `line`, `donut`, `pie` e `radar`
8
8
  */
9
9
  export interface PoChartSerie {
10
10
  /**
@@ -39,12 +39,22 @@ export interface PoChartSerie {
39
39
  *
40
40
  * Define a lista de valores para a série. Os tipos esperados são de acordo com o tipo de gráfico:
41
41
  * - Para gráficos dos tipos `donut` e `pie`, espera-se *number*;
42
- * - Para gráficos dos tipos `area`, `bar`, `column` e `line`, espera-se um *array* de `data`.
42
+ * - Para gráficos dos tipos `area`, `bar`, `column`, `line` e `radar`, espera-se um *array* de `data`.
43
43
  *
44
44
  * > Se passado valor `null` em determinado item da lista, a iteração irá ignorá-lo.
45
45
  */
46
46
  data?: number | Array<number>;
47
- /** Rótulo referência da série;. */
47
+ /**
48
+ * @optional
49
+ *
50
+ * @description
51
+ *
52
+ * Define se a série terá sua área preenchida.
53
+ *
54
+ * > Propriedade válida para gráficos do tipo `Radar`, `fillpoints` não funciona quando `areaStyle` está definido como `true`.
55
+ */
56
+ areaStyle?: boolean;
57
+ /** Rótulo referência da série. */
48
58
  label?: string;
49
59
  /**
50
60
  * @optional
@@ -71,7 +81,8 @@ export interface PoChartSerie {
71
81
  * - `__texto__` → itálico (`<i>`).
72
82
  *
73
83
  * > Caso não seja informado um valor para o *tooltip*, será exibido da seguinte forma:
74
- * - `donut`: `label`: valor proporcional ao total em porcentagem.
84
+ * - `donut`, `label`: valor proporcional ao total em porcentagem.
85
+ * - `radar`: nome da série, o nome do indicator e os valores correspondentes.
75
86
  * - `area`, `bar`, `column`, `line` e `pie`: `label`: `data`.
76
87
  *
77
88
  * ### Exemplos:
@@ -134,7 +145,6 @@ export interface PoChartSerie {
134
145
  * > Válido para gráfico do tipo `Column` e `Bar`. Essa propriedade é ignorada caso a propriedade `stacked` da interface `PoChartOptions` esteja como `true`.
135
146
  *
136
147
  * > Essa propriedade habilita a propriedade `p-data-label` por padrão, podendo ser desabilitada passando `[p-data-label]={ fixed: false }`.
137
- *
138
148
  */
139
149
  stackGroupName?: string;
140
150
  }
@@ -1,10 +1,11 @@
1
1
  import { EventEmitter, OnInit } from '@angular/core';
2
- import { PoLanguageService } from '../../services/po-language/po-language.service';
3
- import { PoChartType } from '../po-chart/enums/po-chart-type.enum';
2
+ import { PoChartDataLabel } from '../po-chart/interfaces/po-chart-serie-data-label.interface';
4
3
  import { PoChartLiterals } from '../po-chart/interfaces/po-chart-literals.interface';
4
+ import { PoChartRadarOptions } from './interfaces/po-chart-radar-options.interface';
5
+ import { PoLanguageService } from '../../services/po-language/po-language.service';
5
6
  import { PoChartOptions } from '../po-chart/interfaces/po-chart-options.interface';
6
- import { PoChartDataLabel } from '../po-chart/interfaces/po-chart-serie-data-label.interface';
7
7
  import { PoChartSerie } from '../po-chart/interfaces/po-chart-serie.interface';
8
+ import { PoChartType } from '../po-chart/enums/po-chart-type.enum';
8
9
  import { PoPopupAction } from '../po-popup';
9
10
  /**
10
11
  * @description
@@ -59,6 +60,9 @@ import { PoPopupAction } from '../po-popup';
59
60
  * | `--color-base-gauge` | Cor da base do gráfico `Gauge` | `var(--color-neutral-light-20)` |
60
61
  * | `--color-gauge-pointer-color` | Cor do ponteiro do gráfico `Gauge` | `var(--color-neutral-dark-70)` |
61
62
  * | `--color-chart-line-point-fill` | Cor de dentro do círculo dos gráficos `Line` e `Area` | `var(--color-neutral-light-00)` |
63
+ * | `--border-color-radar` | Cor do eixo da grid do gráfico `Radar` | `var(--color-neutral-light-30)` |
64
+ * | `--color-background-zebra` | Cor das áreas alternadas (efeito zebrado) da grid do gráfico `Radar` | `var(--color-neutral-light-10)` |
65
+ * | `--color-background-line` | Cor das áreas entre as faixas zebradas da grade do `Radar` | `none` |
62
66
  * | **Wrapper (.po-chart-container-gauge)** | | |
63
67
  * | `--background-color-container-gauge` | Cor de background do container do gauge | `var(--color-neutral-light-00)` |
64
68
  */
@@ -86,13 +90,20 @@ export declare abstract class PoChartBaseComponent implements OnInit {
86
90
  *
87
91
  * @description
88
92
  *
89
- * 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`.
93
+ * Define os valores utilizados na construção das categorias do gráfico.
94
+ *
95
+ * Para gráficos dos tipos *bar*, *area*, *column* e *line*, representa os nomes das categorias exibidas no eixo.
96
+ *
97
+ * Para gráficos do tipo *radar*, representa a configuração dos indicadores, formato (shape), áreas de divisão (splitArea)
98
+ * e demais opções específicas do gráfico `Radar`.
90
99
  *
91
- * > 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.
100
+ * > Caso nenhum valor seja informado, será utilizado um hífen como categoria
101
+ * correspondente para cada série.
92
102
  *
93
- * > Caso não seja especificado um valor para a categoria, será plotado um hífen na categoria referente a cada série.
103
+ * > Gráficos do tipo bar dimensionam sua área considerando a largura do maior texto
104
+ * da categoria, sendo recomendável utilizar rótulos curtos para facilitar a leitura.
94
105
  */
95
- categories?: Array<string>;
106
+ categories?: Array<string> | PoChartRadarOptions;
96
107
  /**
97
108
  * @optional
98
109
  *
@@ -109,7 +120,7 @@ export declare abstract class PoChartBaseComponent implements OnInit {
109
120
  * Objeto com as configurações usadas no `po-chart`.
110
121
  *
111
122
  * É possível, por exemplo, definir as configurações de exibição das legendas,
112
- * configurar os eixos(*axis*) para os gráficos dos tipos `area`, `line`, `column` e `bar` da seguinte forma:
123
+ * configurar os eixos(*axis*) para os gráficos dos tipos `area`, `line`, `column`, `bar` e `radar` da seguinte forma:
113
124
  *
114
125
  * ```
115
126
  * chartOptions: PoChartOptions = {
@@ -136,7 +147,7 @@ export declare abstract class PoChartBaseComponent implements OnInit {
136
147
  * - Os marcadores (*bullets*) terão seu estilo ajustado.
137
148
  * - As outras séries ficarão com opacidade reduzida ao passar o mouse sobre a série ativa.
138
149
  *
139
- * > Disponível apenas para gráficos do tipo `line`.
150
+ * > Disponível para gráficos do tipo `line` e `radar`.
140
151
  *
141
152
  * #### Exemplo de utilização:
142
153
  * ```typescript
@@ -215,6 +226,7 @@ export declare abstract class PoChartBaseComponent implements OnInit {
215
226
  *
216
227
  * O evento emitirá o seguinte parâmetro:
217
228
  * - *donut* e *pie*: um objeto contendo a categoria e valor da série.
229
+ * - *radar*: um objeto contendo o nome da série e os valores.
218
230
  * - *area*, *line*, *column* e *bar*: um objeto contendo o nome da série, valor e categoria do eixo do gráfico.
219
231
  */
220
232
  seriesClick: EventEmitter<any>;
@@ -227,6 +239,7 @@ export declare abstract class PoChartBaseComponent implements OnInit {
227
239
  *
228
240
  * O evento emitirá o seguinte parâmetro de acordo com o tipo de gráfico:
229
241
  * - *donut* e *pie*: um objeto contendo a categoria e valor da série.
242
+ * - *radar*: um objeto contendo o nome da série e os valores.
230
243
  * - *area*, *line*, *column* e *bar*: um objeto contendo a categoria, valor da série e categoria do eixo do gráfico.
231
244
  */
232
245
  seriesHover: EventEmitter<any>;
@@ -22,4 +22,49 @@ export declare class PoChartGridUtils {
22
22
  private hasTopLegendOrNoZoom;
23
23
  private hasBottomLegendWithZoom;
24
24
  private getPaddingTopGrid;
25
+ private isRadarOptions;
26
+ convertRadarConfig(indicators: Array<string>): {
27
+ shape: string;
28
+ splitArea: boolean;
29
+ indicator: {
30
+ name: string;
31
+ }[];
32
+ };
33
+ setListTypeRadar(): {
34
+ shape: string;
35
+ radius: string;
36
+ splitLine: {
37
+ show: boolean;
38
+ lineStyle: {
39
+ color: string[];
40
+ width: number;
41
+ };
42
+ };
43
+ axisLine: {
44
+ show: boolean;
45
+ lineStyle: {
46
+ color: string;
47
+ width: number;
48
+ };
49
+ };
50
+ splitArea: {
51
+ show: boolean;
52
+ areaStyle: {
53
+ color: string[];
54
+ };
55
+ };
56
+ indicator: {
57
+ name: any;
58
+ max: any;
59
+ min: any;
60
+ color: any;
61
+ }[];
62
+ };
63
+ setSerieTypeRadar(serie: any, tokenBorderWidthMd: number, color: string): any;
64
+ setTooltipRadar(params: any): void;
65
+ buildRadarTooltip(params: any): string;
66
+ finalizeSerieTypeRadar(seriesUpdated: any): {
67
+ type: string;
68
+ data: any;
69
+ }[];
25
70
  }
@@ -40,6 +40,11 @@ import { PoChartGaugeUtils } from './po-chart-gauge-utils';
40
40
  * <file name="sample-po-chart-world-exports/sample-po-chart-world-exports.component.html"> </file>
41
41
  * <file name="sample-po-chart-world-exports/sample-po-chart-world-exports.component.ts"> </file>
42
42
  * </example>
43
+ *
44
+ * <example name="po-chart-technology-skill" title="PO Chart - Radar">
45
+ * <file name="sample-po-chart-technology-skill/sample-po-chart-technology-skill.component.html"> </file>
46
+ * <file name="sample-po-chart-technology-skill/sample-po-chart-technology-skill.component.ts"> </file>
47
+ * </example>
43
48
  */
44
49
  export declare class PoChartComponent extends PoChartBaseComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {
45
50
  el: ElementRef<any>;
@@ -55,6 +60,7 @@ export declare class PoChartComponent extends PoChartBaseComponent implements On
55
60
  originalRadiusGauge: any;
56
61
  chartMarginTop: string;
57
62
  isTypeBar: boolean;
63
+ isTypeRadar: boolean;
58
64
  boundaryGap: boolean;
59
65
  listTypePieDonut: Array<any>;
60
66
  itemsTypeDonut: Array<any>;
@@ -118,6 +124,7 @@ export declare class PoChartComponent extends PoChartBaseComponent implements On
118
124
  private setTableProperties;
119
125
  private setTablePropertiesTypeBar;
120
126
  private setTablePropertiesTypeGauge;
127
+ private setTablePropertiesTypeRadar;
121
128
  private setTableColumns;
122
129
  private downloadCsv;
123
130
  private exportImage;
@@ -169,6 +169,16 @@ export declare abstract class PoInputBaseComponent implements ControlValueAccess
169
169
  * @default `false`
170
170
  */
171
171
  errorLimit: boolean;
172
+ /**
173
+ * @optional
174
+ *
175
+ * @description
176
+ * Exibe um ícone de carregamento no lado direito do campo para sinalizar que uma operação está em andamento.
177
+ *
178
+ * @default `false`
179
+ */
180
+ set loading(value: boolean);
181
+ get loading(): boolean;
172
182
  /**
173
183
  * @optional
174
184
  *
@@ -291,6 +301,7 @@ export declare abstract class PoInputBaseComponent implements ControlValueAccess
291
301
  protected onTouched: any;
292
302
  protected passedWriteValue: boolean;
293
303
  protected validatorChange: any;
304
+ private _loading;
294
305
  private _maxlength?;
295
306
  private _minlength?;
296
307
  private _noAutocomplete?;
@@ -491,6 +502,7 @@ export declare abstract class PoInputBaseComponent implements ControlValueAccess
491
502
  writeValue(value: any): void;
492
503
  protected validateModel(): void;
493
504
  protected isAdditionalHelpEventTriggered(): boolean;
505
+ mapSizeToIcon(size: string): string;
494
506
  private validatePatternOnWriteValue;
495
507
  /**
496
508
  * Função que atribui foco ao componente.
@@ -1,4 +1,4 @@
1
- import { TemplateRef } from '@angular/core';
1
+ import { ElementRef, TemplateRef } from '@angular/core';
2
2
  /**
3
3
  * @docsPrivate
4
4
  *
@@ -9,9 +9,11 @@ import { TemplateRef } from '@angular/core';
9
9
  * Permite a exibição de ícones.
10
10
  */
11
11
  export declare class PoIconComponent {
12
+ iconElement: ElementRef;
12
13
  class: string;
13
14
  private _icon;
14
15
  private _iconToken;
16
+ hostPIcon: string | null;
15
17
  constructor(value: {
16
18
  [key: string]: string;
17
19
  });
@@ -76,6 +76,14 @@ export declare class PoItemListBaseComponent {
76
76
  * Define um ícone que será exibido ao lado esquerdo do rótulo.
77
77
  */
78
78
  icon: string | TemplateRef<void>;
79
+ /**
80
+ * @optional
81
+ *
82
+ * @description
83
+ *
84
+ * Define se deve ser exibido o ícone indicando subnível.
85
+ */
86
+ iconArrowRight: string;
79
87
  iconPosition: 'left' | 'right';
80
88
  /**
81
89
  * @optional
@@ -28,7 +28,8 @@ export declare class PoListBoxComponent extends PoListBoxBaseComponent implement
28
28
  ngOnDestroy(): void;
29
29
  openGroup(group: PoDropdownAction, event?: MouseEvent | KeyboardEvent): void;
30
30
  goBack(event: MouseEvent | KeyboardEvent): void;
31
- onKeydownGoBack(event: KeyboardEvent): void;
31
+ onKeydownGoBack(event: KeyboardEvent, currentGroup?: PoDropdownAction): void;
32
+ protected onKeydownTemplate(event: KeyboardEvent): void;
32
33
  onSelectItem(itemListAction: PoItemListOption | PoItemListOptionGroup | any, event?: MouseEvent | KeyboardEvent): void | Promise<boolean>;
33
34
  onSelectAllCheckboxKeyDown(event: KeyboardEvent): void;
34
35
  onKeyDown(itemListAction: PoItemListOption | PoItemListOptionGroup | any, event?: KeyboardEvent): void;
@@ -128,4 +128,5 @@ export interface PoPopupAction {
128
128
  */
129
129
  visible?: boolean | Function;
130
130
  $id?: string;
131
+ $subItemTemplate?: TemplateRef<any>;
131
132
  }
@@ -76,6 +76,7 @@ export declare class PoPopupBaseComponent {
76
76
  private _size?;
77
77
  private _target;
78
78
  listboxSubitems: boolean;
79
+ templateIcon: boolean;
79
80
  /** Lista de ações que serão exibidas no componente. */
80
81
  set actions(value: Array<PoPopupAction>);
81
82
  get actions(): Array<PoPopupAction>;
@@ -1,4 +1,4 @@
1
- import { ChangeDetectorRef, ElementRef } from '@angular/core';
1
+ import { AfterViewInit, ChangeDetectorRef, ElementRef } from '@angular/core';
2
2
  import { PoListBoxComponent } from '../po-listbox';
3
3
  import { PoPopupAction } from './po-popup-action.interface';
4
4
  import { PoPopupBaseComponent } from './po-popup-base.component';
@@ -24,7 +24,8 @@ import { PoPopupBaseComponent } from './po-popup-base.component';
24
24
  * </example>
25
25
  *
26
26
  */
27
- export declare class PoPopupComponent extends PoPopupBaseComponent {
27
+ export declare class PoPopupComponent extends PoPopupBaseComponent implements AfterViewInit {
28
+ id: string;
28
29
  private renderer;
29
30
  private router;
30
31
  private poControlPosition;
@@ -32,6 +33,7 @@ export declare class PoPopupComponent extends PoPopupBaseComponent {
32
33
  popupRef: ElementRef;
33
34
  listbox: ElementRef;
34
35
  poListBoxRef: PoListBoxComponent;
36
+ ngAfterViewInit(): void;
35
37
  /**
36
38
  * Fecha o componente *popup*.
37
39
  *
@@ -157,7 +157,8 @@ export declare class PoTagBaseComponent {
157
157
  * - <span class="dot po-color-11"></span> `color-11`
158
158
  * - <span class="dot po-color-12"></span> `color-12`
159
159
  *
160
- * - Para uma melhor acessibilidade no uso do componente é recomendável utilizar cores com um melhor contraste em relação ao background.
160
+ * - Para uma melhor acessibilidade no uso do componente é recomendável utilizar cores com um melhor contraste em relação ao background;
161
+ * - O componente ajusta automaticamente a cor do texto para garantir legibilidade, escolhendo dinamicamente entre texto claro ou escuro conforme o contraste necessário.
161
162
  *
162
163
  * > **Atenção:** A propriedade `p-type` sobrepõe esta definição.
163
164
  */
@@ -37,10 +37,8 @@ export declare class PoTagComponent extends PoTagBaseComponent implements OnInit
37
37
  onKeyPressed(event: any): void;
38
38
  styleTag(): {
39
39
  'background-color': any;
40
- color: string;
41
40
  } | {
42
41
  'background-color'?: undefined;
43
- color?: undefined;
44
42
  };
45
43
  getWidthTag(): boolean;
46
44
  setAriaLabel(): string;
@@ -302,3 +302,15 @@ export declare function updateTooltip(isTooltipActive: boolean, labelElement: El
302
302
  * @returns O elemento que deve ser medido para verificar se está com ellipsis.
303
303
  */
304
304
  export declare function getMeasurableEl(labelElement: ElementRef<HTMLElement>): Element;
305
+ /**
306
+ * Retorna a cor do texto baseada no tema atual.
307
+ * @param type Tipo de cor do texto, pode ser 'lightest' ou 'darkest'.
308
+ * @returns Valor da cor no formato definido pela propriedade customizada CSS (por exemplo, '#ffffff', 'rgb(255,255,255)').
309
+ */
310
+ export declare function getTextColor(type: 'lightest' | 'darkest'): string;
311
+ /**
312
+ * Retorna a cor do texto baseada na cor de fundo informada.
313
+ * @param backgroundColor Cor de fundo em formato 'rgb(r,g,b)' ou 'rgba(r,g,b,a)'.
314
+ * @returns Valor da cor do texto (por exemplo, '#ffffff', 'rgb(255,255,255)') baseado no brilho percebido da cor de fundo usando a fórmula do espaço de cor YIQ.
315
+ */
316
+ export declare function getTextColorFromBackgroundColor(backgroundColor: string): string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@po-ui/ng-components",
3
- "version": "20.11.0",
3
+ "version": "20.12.0",
4
4
  "description": "PO UI - Components",
5
5
  "author": "PO UI",
6
6
  "license": "MIT",
@@ -22,8 +22,8 @@
22
22
  },
23
23
  "dependencies": {
24
24
  "@angular/cdk": "~20.0.3",
25
- "@po-ui/style": "20.11.0",
26
- "@po-ui/ng-schematics": "20.11.0",
25
+ "@po-ui/style": "20.12.0",
26
+ "@po-ui/ng-schematics": "20.12.0",
27
27
  "echarts": "^5.6.0",
28
28
  "tslib": "^2.3.0"
29
29
  },
@@ -38,7 +38,7 @@
38
38
  "@angular/platform-browser-dynamic": "^20",
39
39
  "@angular/router": "^20",
40
40
  "@angular-devkit/schematics": "^20",
41
- "@po-ui/style": "20.11.0",
41
+ "@po-ui/style": "20.12.0",
42
42
  "rxjs": "~7.8.1",
43
43
  "zone.js": "~0.15.0"
44
44
  },
Binary file
@@ -18,7 +18,7 @@ function default_1(options) {
18
18
  }
19
19
  function addPoPackageAndInstall() {
20
20
  return (tree, context) => {
21
- (0, package_config_1.addPackageToPackageJson)(tree, '@po-ui/ng-components', '20.11.0');
21
+ (0, package_config_1.addPackageToPackageJson)(tree, '@po-ui/ng-components', '20.12.0');
22
22
  // install packages
23
23
  context.addTask(new tasks_1.NodePackageInstallTask());
24
24
  };
@@ -6,7 +6,7 @@ const tasks_1 = require("@angular-devkit/schematics/tasks");
6
6
  const package_config_1 = require("@po-ui/ng-schematics/package-config");
7
7
  const changes_1 = require("./changes");
8
8
  function default_1() {
9
- return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.11.0', changes_1.updateDepedenciesVersion), postUpdate()]);
9
+ return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.12.0', changes_1.updateDepedenciesVersion), postUpdate()]);
10
10
  }
11
11
  function postUpdate() {
12
12
  return (_, context) => {
@@ -11,7 +11,7 @@ const changes_1 = require("./changes");
11
11
  const httpClientModuleName = 'HttpClientModule';
12
12
  const httpClientModuleSourcePath = '@angular/common/http';
13
13
  function default_1() {
14
- return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.11.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
14
+ return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.12.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
15
15
  }
16
16
  function postUpdate() {
17
17
  return (_, context) => {
@@ -6,7 +6,7 @@ const tasks_1 = require("@angular-devkit/schematics/tasks");
6
6
  const package_config_1 = require("@po-ui/ng-schematics/package-config");
7
7
  const changes_1 = require("./changes");
8
8
  function default_1() {
9
- return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.11.0', changes_1.updateDepedenciesVersion), postUpdate()]);
9
+ return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.12.0', changes_1.updateDepedenciesVersion), postUpdate()]);
10
10
  }
11
11
  function postUpdate() {
12
12
  return (_, context) => {
@@ -6,7 +6,7 @@ const tasks_1 = require("@angular-devkit/schematics/tasks");
6
6
  const package_config_1 = require("@po-ui/ng-schematics/package-config");
7
7
  const changes_1 = require("./changes");
8
8
  function default_1() {
9
- return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.11.0', changes_1.updateDepedenciesVersion), postUpdate()]);
9
+ return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.12.0', changes_1.updateDepedenciesVersion), postUpdate()]);
10
10
  }
11
11
  function postUpdate() {
12
12
  return (_, context) => {
@@ -40,11 +40,11 @@ function main(options) {
40
40
  configureNewIcon.toLowerCase() === 'y' ||
41
41
  configureNewIcon.toLowerCase() === 'sim' ||
42
42
  configureNewIcon.toLowerCase() === '') {
43
- return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.11.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
43
+ return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.12.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
44
44
  }
45
45
  else {
46
46
  return (0, schematics_1.chain)([
47
- (0, package_config_1.updatePackageJson)('20.11.0', changes_1.updateDepedenciesVersion),
47
+ (0, package_config_1.updatePackageJson)('20.12.0', changes_1.updateDepedenciesVersion),
48
48
  addImportOnly(options, [IconsDictionaryName, poIconDictionary], poModuleSourcePath),
49
49
  addProviderToAppModule(options, newProviderDictionary),
50
50
  updateAppConfigFileRule(),
@@ -40,11 +40,11 @@ function main(options) {
40
40
  configureNewIcon.toLowerCase() === 'y' ||
41
41
  configureNewIcon.toLowerCase() === 'sim' ||
42
42
  configureNewIcon.toLowerCase() === '') {
43
- return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.11.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
43
+ return (0, schematics_1.chain)([(0, package_config_1.updatePackageJson)('20.12.0', changes_1.updateDepedenciesVersion), createUpgradeRule(), postUpdate()]);
44
44
  }
45
45
  else {
46
46
  return (0, schematics_1.chain)([
47
- (0, package_config_1.updatePackageJson)('20.11.0', changes_1.updateDepedenciesVersion),
47
+ (0, package_config_1.updatePackageJson)('20.12.0', changes_1.updateDepedenciesVersion),
48
48
  addImportOnly(options, [IconsDictionaryName, poIconDictionary], poModuleSourcePath),
49
49
  addProviderToAppModule(options, newProviderDictionary),
50
50
  updateAppConfigFileRule(),
@@ -10,7 +10,7 @@ const package_config_1 = require("@po-ui/ng-schematics/package-config");
10
10
  const changes_1 = require("./changes");
11
11
  function updateToV2() {
12
12
  return (0, schematics_1.chain)([
13
- updatePackageJson('20.11.0', changes_1.dependeciesChanges),
13
+ updatePackageJson('20.12.0', changes_1.dependeciesChanges),
14
14
  (0, replace_1.replaceInFile)('tslint.json', changes_1.tsLintReplaces),
15
15
  (0, replace_1.replaceInFile)('angular.json', changes_1.angularJsonReplaces),
16
16
  createUpgradeRule(),