Skip to content

feat(color-palette): expand PoColorPaletteEnum from 12 to 20 colors #2746

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
devin-ai-integration wants to merge 1 commit into
base: master
Choose a base branch
from
Open

feat(color-palette): expand PoColorPaletteEnum from 12 to 20 colors #2746

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion projects/ui/src/lib/components/po-badge/po-badge-base.component.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ describe('PoBadgeBaseComponent:', () => {
});

it('p-color: should update with invalid values and set value default `color-07`', () => {
component.color = 'color-13';
component.color = 'color-21';

expect(component['_color']).toBe('color-07');
});
Expand Down
8 changes: 8 additions & 0 deletions projects/ui/src/lib/components/po-badge/po-badge-base.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,14 @@ export class PoBadgeBaseComponent {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*
* @default `color-07`
*/
Expand Down
10 changes: 9 additions & 1 deletion projects/ui/src/lib/components/po-chart/interfaces/po-chart-serie.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,15 @@ export interface PoChartSerie {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - A partir da 13° série o valor da cor será preta caso não seja enviada uma cor customizada.
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
* - A partir da 21° série o valor da cor será preta caso não seja enviada uma cor customizada.
*/
color?: string;

Expand Down
8 changes: 8 additions & 0 deletions projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view-field.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,14 @@ export interface PoDynamicViewField extends PoDynamicField {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*/
color?: string;

Expand Down
8 changes: 8 additions & 0 deletions projects/ui/src/lib/components/po-gauge/interfaces/po-gauge-ranges.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,14 @@ export interface PoGaugeRanges {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*/
color?: string;
}
16 changes: 16 additions & 0 deletions projects/ui/src/lib/components/po-menu/po-menu-item/po-menu-item-badge.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,22 @@ export interface PoMenuItemBadge {
*
* <span class="dot po-color-12"></span> `color-12`
*
* <span class="dot po-color-13"></span> `color-13`
*
* <span class="dot po-color-14"></span> `color-14`
*
* <span class="dot po-color-15"></span> `color-15`
*
* <span class="dot po-color-16"></span> `color-16`
*
* <span class="dot po-color-17"></span> `color-17`
*
* <span class="dot po-color-18"></span> `color-18`
*
* <span class="dot po-color-19"></span> `color-19`
*
* <span class="dot po-color-20"></span> `color-20`
*
* @default `color-07`
*/
color?: string;
Expand Down
8 changes: 8 additions & 0 deletions projects/ui/src/lib/components/po-table/interfaces/po-table-column.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,14 @@ export interface PoTableColumn {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*
* > Existe a possibilidade de informar uma função que retorne um dos valores aceitos, serão passados
* por parâmetro a linha e a coluna atual, por exemplo:
Expand Down
8 changes: 8 additions & 0 deletions ...cts/ui/src/lib/components/po-table/po-table-column-icon/po-table-column-icon.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,14 @@ export interface PoTableColumnIcon {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*
*/
color?: string | Function;
Expand Down
16 changes: 16 additions & 0 deletions ...s/ui/src/lib/components/po-table/po-table-column-label/po-table-column-label.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,14 @@ export interface PoTableColumnLabel {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*/
color?: string;

Expand All @@ -55,6 +63,14 @@ export interface PoTableColumnLabel {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*
* - Para uma melhor acessibilidade no uso do componente é recomendável utilizar cores com um melhor contraste em relação ao background.
*
Expand Down
8 changes: 8 additions & 0 deletions ...rc/lib/components/po-table/po-table-subtitle-footer/po-table-subtitle-column.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,14 @@ export interface PoTableSubtitleColumn {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*
* @default `color-01`
*/
Expand Down
16 changes: 16 additions & 0 deletions projects/ui/src/lib/components/po-tag/po-tag-base.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -177,6 +177,14 @@ export class PoTagBaseComponent {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*
* - Para uma melhor acessibilidade no uso do componente é recomendável utilizar cores com um melhor contraste em relação ao background;
* - O componente ajusta automaticamente a cor do texto para garantir legibilidade, escolhendo dinamicamente entre texto claro ou escuro conforme o contraste necessário.
Expand Down Expand Up @@ -217,6 +225,14 @@ export class PoTagBaseComponent {
* - <span class="dot po-color-10"></span> `color-10`
* - <span class="dot po-color-11"></span> `color-11`
* - <span class="dot po-color-12"></span> `color-12`
* - <span class="dot po-color-13"></span> `color-13`
* - <span class="dot po-color-14"></span> `color-14`
* - <span class="dot po-color-15"></span> `color-15`
* - <span class="dot po-color-16"></span> `color-16`
* - <span class="dot po-color-17"></span> `color-17`
* - <span class="dot po-color-18"></span> `color-18`
* - <span class="dot po-color-19"></span> `color-19`
* - <span class="dot po-color-20"></span> `color-20`
*
* - Para uma melhor acessibilidade no uso do componente é recomendável utilizar cores com um melhor contraste em relação ao background.
*
Expand Down
28 changes: 26 additions & 2 deletions projects/ui/src/lib/enums/po-color-palette.enum.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
*
* @description
*
* Enum que contém paleta de 12 cores.
* Enum que contém paleta de 20 cores.
*/
export enum PoColorPaletteEnum {
/** #0c9abe */
Expand Down Expand Up @@ -40,5 +40,29 @@ export enum PoColorPaletteEnum {
Color11 = 'color-11',

/** #06a6a5 */
Color12 = 'color-12'
Color12 = 'color-12',

/** #1a7a4f */
Color13 = 'color-13',

/** #4a8c2a */
Color14 = 'color-14',

/** #d4a017 */
Color15 = 'color-15',

/** #d47217 */
Color16 = 'color-16',

/** #c43a6a */
Color17 = 'color-17',

/** #7a2dc8 */
Color18 = 'color-18',

/** #3f6ec8 */
Color19 = 'color-19',

/** #1ab5c8 */
Color20 = 'color-20'
}
4 changes: 2 additions & 2 deletions projects/ui/src/lib/services/po-color-palette/po-color-palette.service.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,12 +51,12 @@ describe('PoColorPaletteService:', () => {
});

it('getColor: should call `getColorFromType` and return `color-01` if `value.color` isn`t in colors range.', () => {
const value = { color: 'color-20' };
const value = { color: 'color-21' };

spyOn(service, <any>'getColorFromType').and.callThrough();

expect(service['getColor'](value)).toBe(PoColorPaletteEnum.Color01);
expect(service['getColorFromType']).toHaveBeenCalledWith('color-20');
expect(service['getColorFromType']).toHaveBeenCalledWith('color-21');
});

it('getColor: should call `getColorFromType` and return `color-07` if value type is `danger`.', () => {
Expand Down
Loading