Merge pull request #15261 from jacver/#15260-messages-closable-fix

#15260: Messages component uses `closable` and `id` from `Message`
primefaces · Apr 18, 2024 · 0038037 · 0038037
2 parents ca020d4 + 38df04c
commit 0038037
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 8 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/app/components/messages/messages.ts b/src/app/components/messages/messages.ts
@@ -42,7 +42,7 @@ import { Subscription, timer } from 'rxjs';
                     role="alert"
                     [@messageAnimation]="{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }"
                 >
-                    <div class="p-message-wrapper" [attr.data-pc-section]="'wrapper'">
+                    <div class="p-message-wrapper" [attr.data-pc-section]="'wrapper'" [attr.id]="msg.id || null">
                         <span *ngIf="msg.icon" [class]="'p-message-icon pi ' + msg.icon" [attr.data-pc-section]="'icon'"> </span>
                         <span class="p-message-icon" *ngIf="!msg.icon">
                             <ng-container>
@@ -60,7 +60,7 @@ import { Subscription, timer } from 'rxjs';
                             <span *ngIf="msg.summary" class="p-message-summary" [attr.data-pc-section]="'summary'">{{ msg.summary }}</span>
                             <span *ngIf="msg.detail" class="p-message-detail" [attr.data-pc-section]="'detail'">{{ msg.detail }}</span>
                         </ng-template>
-                        <button class="p-message-close p-link" (click)="removeMessage(i)" *ngIf="closable" type="button" pRipple [attr.aria-label]="closeAriaLabel" [attr.data-pc-section]="'closebutton'">
+                        <button class="p-message-close p-link" (click)="removeMessage(i)" *ngIf="closable && (msg.closable ?? true)" type="button" pRipple [attr.aria-label]="closeAriaLabel" [attr.data-pc-section]="'closebutton'">
                             <TimesIcon [styleClass]="'p-message-close-icon'" [attr.data-pc-section]="'closeicon'" />
                         </button>
                     </div>

diff --git a/src/app/showcase/doc/apidoc/index.json b/src/app/showcase/doc/apidoc/index.json
@@ -1313,7 +1313,7 @@
             "values": [
                 {
                     "name": "Message",
-                    "description": "Deines valid options for the message.",
+                    "description": "Defines valid options for the message.",
                     "props": [
                         {
                             "name": "severity",

diff --git a/src/app/showcase/doc/messages/servicedoc.ts b/src/app/showcase/doc/messages/servicedoc.ts
@@ -75,8 +75,8 @@ export class MessagesServiceDemo {
 
     addMultiple() {
         this.messageService.addAll([
-            {severity:'success', summary:'Service Message', detail:'Via MessageService'},
-            {severity:'info', summary:'Info Message', detail:'Via MessageService'}
+            { severity: 'success', summary: 'Service Message', detail: 'Via MessageService' },
+            { severity: 'info', summary: 'Info Message', detail: 'Via MessageService' }
         ]);
     }