Skip to content
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.

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

Component: Message - Theme: Aura light and dark variants #15881

Closed
mjlux opened this issue Jun 21, 2024 · 3 comments · Fixed by #15928
Closed

Component: Message - Theme: Aura light and dark variants #15881

mjlux opened this issue Jun 21, 2024 · 3 comments · Fixed by #15928
Assignees
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone

Comments

@mjlux
Copy link

mjlux commented Jun 21, 2024

Describe the bug

In primeNG 17.18 the severities for <p-message> are now strictly typed.
If <p-message> is used as inline message the Aura Themes are missing support for the changed severity types "warning" (was warn), "danger" (was error) and the new severity types "secondary" and "contrast"

Environment

PrimeNg 17.18
Angular 18.0
Windows 11

Reproducer

No response

Angular version

18.0

PrimeNG version

17.18

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

20.11.1

Browser(s)

No response

Steps to reproduce the behavior

Use one of the Aura themes from primeNG
index.scss

@import "../../node_modules/primeng/resources/themes/aura-dark-noir/theme.css";

add p-messages as inline messages to app.component.html

<p-message severity="warning" text="Message Content"></p-message>
<p-message severity="danger" text="Message Content"></p-message>
<p-message severity="secondary" text="Message Content"></p-message>
<p-message severity="contrast" text="Message Content"></p-message>

no severity styles will apply

The following css classes are missing in _inlinemessage.scss

  • .p-inline-message-secondary
  • .p-inline-message-contrast
  • .p-inline-message-warning
  • .p-inline-message-danger

Expected behavior

The inline <p-message> should be styled according to the set severity.

@mjlux mjlux added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Jun 21, 2024
@tarockx
Copy link

tarockx commented Jun 25, 2024

I can confirm this bug also on other themes (for example "saga-blue"), the p-messages of type warning and danger are not styled.

Another note: the documentation seems to be missing all information about the inline <p-message>, it now only talks about <p-messages>... I'm sure this wasn't the case in the PrimeNG 16 docs... am I missing something?

@angularinterviews
Copy link

Related to those
#15534
primefaces/primeng-sass-theme#134

@cetincakiroglu cetincakiroglu added Type: Bug Issue contains a bug related to a specific component. Something about the component is not working and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Jul 1, 2024
@cetincakiroglu cetincakiroglu added this to the 17.18.3 milestone Jul 1, 2024
@cetincakiroglu
Copy link
Contributor

cetincakiroglu commented Jul 1, 2024

Hi all,

As of 17.18.0, correct severity options for the message and toast components should be as follows:

severity: 'success' | 'info' | 'warn' | 'error' | 'secondary' | 'contrast' | undefined;

Possibly, this issue stems from a problem occurring when merging branches. We'll address the issue in 17.18.3 this week.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants