Skip to content

Commit 639639c

Browse files
renanarosariorenanarosario
committed
feat(icon): anuncia depreciação
A Lib Po Icon está depreciada e será removida na v20 do PO UI. Fixes DTHFUI-9008 BREAKING CHANGE: Depreciação da Lib Po Icon A Lib Po Icon está depreciada e será removida na v20 do PO UI. Antes: É possível usar qualquer um dos ícones da [Lib PO Icon](/guides/icons). Depois: Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme documentação.
1 parent 03befd7 commit 639639c

19 files changed

+128
-24
lines changed

‎projects/templates/src/lib/components/po-page-dynamic-table/interfaces/po-page-dynamic-table-custom-action.interface.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -48,12 +48,18 @@ export interface PoPageDynamicTableCustomAction {
4848
*
4949
* Define um ícone que será exibido ao lado esquerdo do rótulo.
5050
*
51-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
51+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
5252
* ```
5353
* <po-component
5454
* [p-property]="[{ label: 'PO ICON', icon: 'po-icon-news' }]">
5555
* </po-component>
5656
* ```
57+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
58+
* ```
59+
* <po-component
60+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
61+
* </po-component>
62+
* ```
5763
*
5864
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca Font Awesome, da seguinte forma:
5965
* ```

‎projects/templates/src/lib/components/po-page-dynamic-table/interfaces/po-page-dynamic-table-custom-table-action.interface.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -57,13 +57,19 @@ export interface PoPageDynamicTableCustomTableAction {
5757
*
5858
* Define um ícone que será exibido ao lado esquerdo do rótulo.
5959
*
60-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
60+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
6161
* ```
6262
* <po-component
6363
* [p-property]="[{ label: 'PO ICON', icon: 'po-icon-news' }]">
6464
* </po-component>
6565
* ```
6666
*
67+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
68+
* ```
69+
* <po-component
70+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
71+
* </po-component>
72+
* ```
6773
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca Font Awesome, da seguinte forma:
6874
* ```
6975
* <po-component

‎projects/ui/src/lib/components/po-badge/po-badge-base.component.ts

+8-1
Original file line numberDiff line numberDiff line change
@@ -88,10 +88,17 @@ export class PoBadgeBaseComponent {
8888
* ```
8989
* <po-badge [p-icon]="true"></po-badge>
9090
* ```
91-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
91+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
9292
* ```
9393
* <po-badge p-icon="po-icon-user"></po-badge>
9494
* ```
95+
*
96+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
97+
* ```
98+
* <po-component
99+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
100+
* </po-component>
101+
* ```
95102
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
96103
* ```
97104
* <po-badge p-icon="fa fa-podcast"></po-badge>

‎projects/ui/src/lib/components/po-button-group/po-button-group-item.interface.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -22,12 +22,18 @@ export interface PoButtonGroupItem {
2222
/**
2323
* Ícone exibido ao lado esquerdo do label do botão.
2424
*
25-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
25+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
2626
* ```
2727
* buttons: Array<PoButtonGroupItem> = [
2828
* { label: 'Button 1', action: this.action.bind(this), icon: 'po-icon-user' },
2929
* ];
3030
* ```
31+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
32+
* ```
33+
* <po-component
34+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
35+
* </po-component>
36+
* ```
3137
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
3238
* ```
3339
* buttons: Array<PoButtonGroupItem> = [

‎projects/ui/src/lib/components/po-button/po-button-base.component.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -86,10 +86,16 @@ export class PoButtonBaseComponent {
8686
* @description
8787
* Ícone exibido ao lado esquerdo do label do botão.
8888
*
89-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
89+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
9090
* ```
9191
* <po-button p-icon="po-icon-user" p-label="PO button"></po-button>
9292
* ```
93+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
94+
* ```
95+
* <po-component
96+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
97+
* </po-component>
98+
* ```
9399
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
94100
* ```
95101
* <po-button p-icon="fa fa-podcast" p-label="PO button"></po-button>

‎projects/ui/src/lib/components/po-dynamic/po-dynamic-form/po-dynamic-form-field.interface.ts

+8-1
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,14 @@ export interface PoDynamicFormField extends PoDynamicField {
114114
* - Combo;
115115
* - Password;
116116
*
117-
* > Veja a disponibilidade de ícones em [biblioteca de ícones](guides/icons).
117+
* > **Deprecated v20.x.x.** Veja a disponibilidade de ícones em [biblioteca de ícones](guides/icons).
118+
*
119+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
120+
* ```
121+
* <po-component
122+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
123+
* </po-component>
124+
* ```
118125
*/
119126
icon?: string | TemplateRef<void>;
120127

‎projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view-field.interface.ts

+8-1
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,14 @@ export interface PoDynamicViewField extends PoDynamicField {
7070
/**
7171
* Define um ícone que será exibido ao lado do valor para o campo do tipo *tag*.
7272
*
73-
* > Veja os valores válidos na [biblioteca de ícones](guides/icons).
73+
* > **Deprecated v20.x.x.** Veja os valores válidos na [biblioteca de ícones](guides/icons).
74+
*
75+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
76+
* ```
77+
* <po-component
78+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
79+
* </po-component>
80+
* ```
7481
*/
7582
icon?: string;
7683

‎projects/ui/src/lib/components/po-field/po-combo/po-combo-base.component.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -163,10 +163,16 @@ export abstract class PoComboBaseComponent implements ControlValueAccessor, OnIn
163163
*
164164
* Define o ícone que será exibido no início do campo.
165165
*
166-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
166+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
167167
* ```
168168
* <po-combo p-icon="po-icon-user" p-label="PO combo"></po-combo>
169169
* ```
170+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
171+
* ```
172+
* <po-component
173+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
174+
* </po-component>
175+
* ```
170176
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
171177
* ```
172178
* <po-combo p-icon="fa fa-podcast" p-label="PO combo"></po-combo>

‎projects/ui/src/lib/components/po-field/po-input/po-input-base.component.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -72,10 +72,16 @@ export abstract class PoInputBaseComponent implements ControlValueAccessor, Vali
7272
*
7373
* Define o ícone que será exibido no início do campo.
7474
*
75-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
75+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
7676
* ```
7777
* <po-input p-icon="po-icon-user" p-label="PO input"></po-input>
7878
* ```
79+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
80+
* ```
81+
* <po-component
82+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
83+
* </po-component>
84+
* ```
7985
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
8086
* ```
8187
* <po-input p-icon="fa fa-podcast" p-label="PO input"></po-input>

‎projects/ui/src/lib/components/po-icon/po-icon.component.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -26,10 +26,16 @@ export class PoIconComponent {
2626
/**
2727
* Define o ícone a ser exibido.
2828
*
29-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
29+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
3030
* ```
3131
* <po-button p-icon="po-icon-user" p-label="PO button"></po-button>
3232
* ```
33+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
34+
* ```
35+
* <po-component
36+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
37+
* </po-component>
38+
* ```
3339
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
3440
* ```
3541
* <po-button p-icon="fa fa-podcast" p-label="PO button"></po-button>

‎projects/ui/src/lib/components/po-listbox/po-item-list/interfaces/po-item-list-action.interface.ts

+7-2
Original file line numberDiff line numberDiff line change
@@ -22,13 +22,18 @@ export interface PoItemListAction {
2222
*
2323
* Define um ícone que será exibido ao lado esquerdo do rótulo.
2424
*
25-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
25+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
2626
* ```
2727
* <po-component
2828
* [p-property]="[{ label: 'PO ICON', icon: 'po-icon-news' }]">
2929
* </po-component>
3030
* ```
31-
*
31+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
32+
* ```
33+
* <po-component
34+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
35+
* </po-component>
36+
* ```
3237
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca Font Awesome, da seguinte forma:
3338
* ```
3439
* <po-component

‎projects/ui/src/lib/components/po-menu/po-menu-item.interface.ts

+7-2
Original file line numberDiff line numberDiff line change
@@ -33,13 +33,18 @@ export interface PoMenuItem {
3333
action?: Function;
3434

3535
/**
36-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
36+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
3737
* ```
3838
* <po-menu
3939
* [p-menus]="[{ link: '/', label: 'PO ICON', icon: 'po-icon-news' }]">
4040
* </po-menu>
4141
* ```
42-
*
42+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
43+
* ```
44+
* <po-component
45+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
46+
* </po-component>
47+
* ```
4348
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca Font Awesome, da seguinte forma:
4449
* ```
4550
* <po-menu

‎projects/ui/src/lib/components/po-modal/po-modal-base.component.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -130,10 +130,16 @@ export class PoModalBaseComponent {
130130
* @description
131131
* Ícone exibido ao lado esquerdo do label do titúlo da modal.
132132
*
133-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
133+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
134134
* ```
135135
* <po-modal p-icon="po-icon-user" p-title="PO Modal"></po-modal>
136136
* ```
137+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
138+
* ```
139+
* <po-component
140+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
141+
* </po-component>
142+
* ```
137143
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
138144
* ```
139145
* <po-modal p-icon="fa fa-podcast" p-title="PO Modal"></po-modal>

‎projects/ui/src/lib/components/po-navbar/interfaces/po-navbar-icon-action.interface.ts

+7-2
Original file line numberDiff line numberDiff line change
@@ -20,13 +20,18 @@ export interface PoNavbarIconAction {
2020
/**
2121
* Ícone exibido.
2222
*
23-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
23+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
2424
* ```
2525
* <po-navbar
2626
* [p-icon-actions]="[{ link: '/', icon: 'po-icon-news' }]">
2727
* </po-navbar>
2828
* ```
29-
*
29+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
30+
* ```
31+
* <po-component
32+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
33+
* </po-component>
34+
* ```
3035
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca Font Awesome, da seguinte forma:
3136
* ```
3237
* <po-navbar

‎projects/ui/src/lib/components/po-popup/po-popup-action.interface.ts

+7-2
Original file line numberDiff line numberDiff line change
@@ -25,13 +25,18 @@ export interface PoPopupAction {
2525
*
2626
* Define um ícone que será exibido ao lado esquerdo do rótulo.
2727
*
28-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
28+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
2929
* ```
3030
* <po-component
3131
* [p-property]="[{ label: 'PO ICON', icon: 'po-icon-news' }]">
3232
* </po-component>
3333
* ```
34-
*
34+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
35+
* ```
36+
* <po-component
37+
* [p-property]="[{ label: 'ICON', icon: 'ph ph-user' }]">
38+
* </po-component>
39+
* ```
3540
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca Font Awesome, da seguinte forma:
3641
* ```
3742
* <po-component

‎projects/ui/src/lib/components/po-table/po-table-column-icon/po-table-column-icon.interface.ts

+5-2
Original file line numberDiff line numberDiff line change
@@ -41,11 +41,14 @@ export interface PoTableColumnIcon {
4141
disabled?: Function;
4242

4343
/**
44-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
44+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
4545
* ```
4646
* [ { icon: 'po-icon-plus' } ]
4747
* ```
48-
*
48+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
49+
* ```
50+
* [{ icon: 'ph ph-user' }]
51+
* ```
4952
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca Font Awesome, da seguinte forma:
5053
* ```
5154
* [ { icon: 'fas fa-plus' } ]

‎projects/ui/src/lib/components/po-table/po-table-column-label/po-table-column-label.interface.ts

+5-1
Original file line numberDiff line numberDiff line change
@@ -75,10 +75,14 @@ export interface PoTableColumnLabel {
7575
* - <span class="po-icon po-icon-close"></span> - `danger`
7676
* - <span class="po-icon po-icon-info"></span> - `info`
7777
*
78-
* Também É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
78+
* **Deprecated v20.x.x.** Também É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
7979
* ```
8080
* <po-tag p-icon="po-icon-user" p-value="PO Tag"></po-tag>
8181
* ```
82+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
83+
* ```
84+
* <po-tag p-icon="ph ph-user" p-value="PO Tag"></po-button>
85+
* ```
8286
* como também utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
8387
* ```
8488
* <po-tag p-icon="fa fa-podcast" p-value="PO Tag"></po-button>

‎projects/ui/src/lib/components/po-tag/po-tag-base.component.ts

+5-1
Original file line numberDiff line numberDiff line change
@@ -242,10 +242,14 @@ export class PoTagBaseComponent {
242242
* - <span class="po-icon po-icon-close"></span> - `danger`
243243
* - <span class="po-icon po-icon-info"></span> - `info`
244244
*
245-
* Também É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
245+
* **Deprecated v20.x.x.** Também É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
246246
* ```
247247
* <po-tag p-icon="po-icon-user" p-value="PO Tag"></po-tag>
248248
* ```
249+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
250+
* ```
251+
* <po-tag p-icon="ph ph-user" p-value="PO Tag"></po-button>
252+
* ```
249253
* como também utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
250254
* ```
251255
* <po-tag p-icon="fa fa-podcast" p-value="PO Tag"></po-button>

‎projects/ui/src/lib/components/po-toolbar/po-toolbar-base.component.ts

+5-1
Original file line numberDiff line numberDiff line change
@@ -28,10 +28,14 @@ export class PoToolbarBaseComponent {
2828
*
2929
* Define um [ícone](/guides/icons) para a propriedade `p-actions`.
3030
*
31-
* É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
31+
* **Deprecated v20.x.x.** É possível usar qualquer um dos ícones da [Biblioteca de ícones](/guides/icons). conforme exemplo abaixo:
3232
* ```
3333
* <po-toolbar p-actions-icon="po-icon-user" [p-actions]="actions"></po-toolbar>
3434
* ```
35+
* Utilize os ícones disponíveis na Lib [Phosphor](/guides/icons), conforme exemplo:
36+
* ```
37+
* <po-tag p-icon="ph ph-user" p-value="PO Tag"></po-button>
38+
* ```
3539
* Também é possível utilizar outras fontes de ícones, por exemplo a biblioteca *Font Awesome*, da seguinte forma:
3640
* ```
3741
* <po-toolbar p-actions-icon="far fa-comment-alt" [p-actions]="actions"></po-toolbar>

0 commit comments

Comments
 (0)