Skip to content

Commit b6bc4b4

Browse files
felipepetucoanderson-gregorio-totvs
felipepetuco
authored and
anderson-gregorio-totvs
committed
refactor(components): remove depreciações
1 parent 34cd0ed commit b6bc4b4

File tree

33 files changed

+100
-270
lines changed

33 files changed

+100
-270
lines changed

‎docs/guides/deprecations.md‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,16 @@ A tabela a seguir lista todos os recursos depreciados, organizados pelo release
2525
</tr>
2626
</thead>
2727
<tbody>
28+
<tr class="po-table-row">
29+
<th class="po-table-column"><a href="documentation/po-tabs">PoTabs</a></th>
30+
<td class="po-table-column">p-small</td>
31+
<td class="po-table-column" style="text-align: center;">v18</td>
32+
</tr>
33+
<tr class="po-table-row">
34+
<th class="po-table-column"><a href="documentation/po-tag">PoTag</a></th>
35+
<td class="po-table-column">p-inverse</td>
36+
<td class="po-table-column" style="text-align: center;">v18</td>
37+
</tr>
2838
<tr class="po-table-row">
2939
<th class="po-table-column"><a href="documentation/po-button">PoButton</a></th>
3040
<td class="po-table-column">p-small</td>
@@ -191,6 +201,18 @@ export class AppModule { }
191201
</tr>
192202
</thead>
193203
<tbody>
204+
<tr class="po-table-row">
205+
<th class="po-table-column"><a href="documentation/po-tabs">PoTabs</a></th>
206+
<td class="po-table-column">p-small</td>
207+
<td class="po-table-column">-</td>
208+
<td class="po-table-column" style="text-align: center;">v18</td>
209+
</tr>
210+
<tr class="po-table-row">
211+
<th class="po-table-column"><a href="documentation/po-tag">PoTag</a></th>
212+
<td class="po-table-column">p-inverse</td>
213+
<td class="po-table-column">-</td>
214+
<td class="po-table-column" style="text-align: center;">v18</td>
215+
</tr>
194216
<tr class="po-table-row">
195217
<th class="po-table-column"><a href="documentation/po-button">PoButton</a></th>
196218
<td class="po-table-column">p-small</td>

‎projects/ui/src/lib/components/po-disclaimer-group/po-disclaimer-remove/po-disclaimer-remove.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<po-tag class="po-clickable" [p-inverse]="true" p-type="danger" [p-value]="label" (p-click)="removeAction()"> </po-tag>
1+
<po-tag class="po-clickable" p-type="danger" [p-value]="label" (p-click)="removeAction()"> </po-tag>

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

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,6 @@ export class PoDynamicViewBaseComponent extends PoDynamicSharedBase {
4343
* updated: (new Date()).toString() // atribui valor ao campo novo
4444
* },
4545
* fields: [
46-
* { property: 'cnpj', tag: true, inverse: true }, // atribui novas propriedades ao field
4746
* { property: 'updated', tag: true } // inclui campo novo
4847
* ]
4948
* }

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

Lines changed: 8 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,14 @@ export interface PoDynamicViewField extends PoDynamicField {
4141
*/
4242
color?: string;
4343

44+
/**
45+
* Determina a cor do texto da tag. As maneiras de customizar as cores são:
46+
* - Hexadeximal, por exemplo `#c64840`;
47+
* - RGB, como `rgb(0, 0, 165)`;
48+
* - O nome da cor, por exemplo `blue`;
49+
*/
50+
textColor?: string;
51+
4452
/**
4553
* Permite que seja exibido em tela, de forma concatenada as propriedades `fieldLabel` + `fieldValue`.
4654
* A ordem sempre será `fieldLabel` e depois `fieldValue`, não sendo possível alterar.
@@ -74,17 +82,6 @@ export interface PoDynamicViewField extends PoDynamicField {
7482
*/
7583
icon?: string;
7684

77-
/**
78-
* Possibilita a inversão de cores para o campo do tipo `tag`,
79-
* tornando possível uma visualização de status ativo e inativo.
80-
*
81-
* > A cor do texto, do ícone e da borda ficam com a cor utilizada na propriedade `color` ou a cor default,
82-
* e a cor do fundo fica branca.
83-
*
84-
* @default `false`
85-
*/
86-
inverse?: boolean;
87-
8885
/**
8986
* Define que a propriedade `property` é uma lista ou um objeto.
9087
*

‎projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,8 +33,8 @@
3333
[ngClass]="field.cssClass"
3434
[p-color]="field.color"
3535
[p-icon]="field.icon"
36-
[p-inverse]="field.inverse"
3736
[p-label]="field.label"
37+
[p-text-color]="field.textColor"
3838
[p-value]="setFieldValue(field)"
3939
>
4040
</po-tag>

‎projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view.component.spec.ts‎

Lines changed: 13 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@ describe('PoDynamicViewComponent:', () => {
107107
}));
108108

109109
it(`getValuesAndFieldsFromLoad: should call 'dynamicViewService.onLoad' if 'component.load' is string`, async () => {
110-
const expectedValue = { value: { name: 'teste 2' }, fields: [{ property: 'name', tag: true, inverse: true }] };
110+
const expectedValue = { value: { name: 'teste 2' }, fields: [{ property: 'name', tag: true }] };
111111

112112
component.load = 'teste';
113113

@@ -172,11 +172,11 @@ describe('PoDynamicViewComponent:', () => {
172172

173173
it(`setFieldOnLoad: should update field value if it is an existing field`, () => {
174174
const field = { property: 'name', tag: true };
175-
const fakeFieldOnLoad = { ...field, inverse: true };
175+
const fakeFieldOnLoad = { ...field };
176176

177177
component.fields = [{ ...field }];
178178

179-
const expectedValue = <any>{ property: 'name', tag: true, inverse: true };
179+
const expectedValue = <any>{ property: 'name', tag: true };
180180

181181
component['setFieldOnLoad'](fakeFieldOnLoad);
182182

@@ -189,8 +189,7 @@ describe('PoDynamicViewComponent:', () => {
189189

190190
const fakeFieldOnLoad = {
191191
property: 'age',
192-
tag: true,
193-
inverse: true
192+
tag: true
194193
};
195194

196195
const expectedFields = [{ property: 'name' }, { ...fakeFieldOnLoad }];
@@ -201,7 +200,7 @@ describe('PoDynamicViewComponent:', () => {
201200
});
202201

203202
it(`setFieldsOnLoad: should call 'setFieldOnLoad' if 'fields' is array`, () => {
204-
const fakeField = { property: 'name', tag: true, inverse: true };
203+
const fakeField = { property: 'name', tag: true };
205204
const fakeFieldsOnLoad = [{ ...fakeField }];
206205

207206
spyOn(component, <any>'setFieldOnLoad');
@@ -213,7 +212,7 @@ describe('PoDynamicViewComponent:', () => {
213212

214213
it(`setFieldsOnLoad: shouldn't call 'setFieldOnLoad' if 'fields' is undefined`, () => {
215214
const fakeFieldsOnLoad = undefined;
216-
const fakeField = { property: 'name', tag: true, inverse: true };
215+
const fakeField = { property: 'name', tag: true };
217216

218217
spyOn(component, <any>'setFieldOnLoad');
219218

@@ -235,7 +234,7 @@ describe('PoDynamicViewComponent:', () => {
235234

236235
it(`updateValuesAndFieldsOnLoad: should call 'getValuesAndFieldsFromLoad', 'setValueOnLoad', 'setFieldsOnLoad'
237236
and 'getVisibleFields'`, async () => {
238-
const fakeDataOnLoad = { value: { name: 'teste 2' }, fields: [{ property: 'name', tag: true, inverse: true }] };
237+
const fakeDataOnLoad = { value: { name: 'teste 2' }, fields: [{ property: 'name', tag: true }] };
239238
spyOn(component, <any>'getValuesAndFieldsFromLoad').and.returnValue(fakeDataOnLoad);
240239
spyOn(component, <any>'setValueOnLoad');
241240
spyOn(component, <any>'setFieldsOnLoad');
@@ -507,22 +506,8 @@ describe('PoDynamicViewComponent:', () => {
507506
expect(nativeElement.querySelector('.po-color-07')).toBeFalsy();
508507
});
509508

510-
it(`should create 'po-tag-inverse' with custom and inverse colors if 'color', 'tag' and 'inverse' properties contain values.`, () => {
511-
component.fields = [{ property: 'cpf', label: 'CPF', tag: true, color: 'color-07', inverse: true }];
512-
513-
component.ngOnChanges({
514-
fields: new SimpleChange(null, component.fields, true)
515-
});
516-
517-
fixture.detectChanges();
518-
519-
expect(nativeElement.querySelector('po-tag')).toBeTruthy();
520-
expect(nativeElement.querySelector('.po-tag-inverse')).toBeTruthy();
521-
expect(nativeElement.querySelector('.po-text-color-07')).toBeTruthy();
522-
});
523-
524-
it(`should create 'po-tag' with a custom color and without 'inverse' if only 'tag' and 'color' contain values.`, () => {
525-
component.fields = [{ property: 'cpf', label: 'CPF', tag: true, color: 'color-07', inverse: false }];
509+
it(`should create 'po-tag' with a custom color if only 'tag' and 'color' contain values.`, () => {
510+
component.fields = [{ property: 'cpf', label: 'CPF', tag: true, color: 'color-07' }];
526511

527512
component.ngOnChanges({
528513
fields: new SimpleChange(null, component.fields, true)
@@ -531,13 +516,12 @@ describe('PoDynamicViewComponent:', () => {
531516
fixture.detectChanges();
532517

533518
expect(nativeElement.querySelector('po-tag')).toBeTruthy();
534-
expect(nativeElement.querySelector('.po-tag-inverse')).toBeFalsy();
535519
expect(nativeElement.querySelector('.po-text-color-07')).toBeFalsy();
536520
expect(nativeElement.querySelector('.po-color-07')).toBeTruthy();
537521
});
538522

539-
it(`should create 'po-tag-inverse' if 'tag' is 'default' and 'inverse'.`, () => {
540-
component.fields = [{ property: 'cpf', label: 'CPF', tag: true, inverse: true }];
523+
it(`should create 'po-tag' with a custom color and text-color if 'tag', 'color' and 'textColor' contain values.`, () => {
524+
component.fields = [{ property: 'cpf', label: 'CPF', tag: true, color: 'color-07', textColor: 'white' }];
541525

542526
component.ngOnChanges({
543527
fields: new SimpleChange(null, component.fields, true)
@@ -546,23 +530,8 @@ describe('PoDynamicViewComponent:', () => {
546530
fixture.detectChanges();
547531

548532
expect(nativeElement.querySelector('po-tag')).toBeTruthy();
549-
expect(nativeElement.querySelector('.po-tag-inverse')).toBeTruthy();
550-
expect(nativeElement.querySelector('.po-tag-info-inverse')).toBeTruthy();
551-
});
552-
553-
it(`shouldn't create 'po-tag-inverse' if 'tag' is 'default' and 'inverse' is false.`, () => {
554-
component.fields = [{ property: 'cpf', label: 'CPF', tag: true, inverse: false }];
555-
556-
component.ngOnChanges({
557-
fields: new SimpleChange(null, component.fields, true)
558-
});
559-
560-
fixture.detectChanges();
561-
562-
expect(nativeElement.querySelector('po-tag')).toBeTruthy();
563-
expect(nativeElement.querySelector('.po-tag-inverse')).toBeFalsy();
564-
expect(nativeElement.querySelector('.po-tag-info-inverse')).toBeFalsy();
565-
expect(nativeElement.querySelector('.po-tag-info')).toBeTruthy();
533+
expect(nativeElement.querySelector('.po-color-07')).toBeTruthy();
534+
expect(nativeElement.querySelector('po-tag span[style="color: white;"]')).toBeTruthy();
566535
});
567536
});
568537
});

‎projects/ui/src/lib/components/po-field/po-combo/samples/sample-po-combo-hotels/sample-po-combo-hotels.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@
5757
p-debounce-time="500"
5858
p-disabled-init-filter
5959
p-filter-minlength="1"
60-
p-icon="ICON_SEARCH"
60+
p-icon="po-icon-search"
6161
p-required
6262
p-field-label="name"
6363
p-field-value="value"

‎projects/ui/src/lib/components/po-field/po-combo/samples/sample-po-combo-scheduling/sample-po-combo-scheduling.component.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@
4848
class="po-lg-6"
4949
name="city"
5050
[(ngModel)]="city"
51-
p-icon="ICON_MAP"
51+
p-icon="po-icon-map"
5252
p-label="Select a location"
5353
p-placeholder="Select a location"
5454
p-required
@@ -90,7 +90,7 @@
9090
class="po-lg-6"
9191
name="medicalSpecialty"
9292
[(ngModel)]="medicalSpecialty"
93-
p-icon="ICON_EXAM"
93+
p-icon="po-icon-exam"
9494
p-label="Medical Specialty/Exam"
9595
p-required
9696
p-sort

‎projects/ui/src/lib/components/po-field/po-combo/samples/sample-po-combo-transfer/sample-po-combo-transfer.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
p-field-value="id"
2222
p-field-label="name"
2323
p-filter-service="https://po-sample-api.onrender.com/v1/people"
24-
p-icon="ICON_USER"
24+
p-icon="po-icon-user"
2525
p-label="To contact"
2626
p-placeholder="Select a contact"
2727
p-required

‎projects/ui/src/lib/components/po-field/po-decimal/samples/sample-po-decimal-hourly-wage-reactive-form/sample-po-decimal-hourly-wage-reactive-form.component.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
class="po-md-6"
1717
formControlName="salary"
1818
p-decimals-length="2"
19-
p-icon="ICON_FINANCE"
19+
p-icon="po-icon-finance"
2020
p-label="Salary"
2121
p-thousand-maxlength="13"
2222
(p-change)="calculate()"
@@ -30,7 +30,7 @@
3030
formControlName="hourlyWage"
3131
p-decimals-length="2"
3232
p-disabled
33-
p-icon="ICONS_FINANCE_SECURE"
33+
p-icon="po-icon-finance-secure"
3434
p-label="Hourly Wage"
3535
p-thousand-maxlength="13"
3636
>

0 commit comments

Comments
 (0)