@progress/kendo-angular-notification 23.3.0-develop.21 → 23.3.0-develop.23

package/fesm2022/progress-kendo-angular-notification.mjs

@@ -94,6 +94,15 @@ class NotificationSettings {
      * This property is related to accessibility.
      */
     notificationLabel = 'Notification';
+    /**
+     * The value of the Notification element `role` attribute.
+     *
+     * @default 'status'
+     *
+     * @remarks
+     * This property is related to accessibility.
+     */
+    notificationRole = 'status';
     /**
      * Specifies a list of CSS classes that you add to the Notification.
      * To apply CSS rules to the component, set `encapsulation` to `ViewEncapsulation.None`
@@ -120,8 +129,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1774881281,
-    version: '23.3.0-develop.21',
+    publishDate: 1775110885,
+    version: '23.3.0-develop.23',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -222,6 +231,7 @@ class NotificationComponent {
     width = null;
     height = null;
     notificationLabel = 'Notification';
+    notificationRole = 'status';
     cssClass;
     hideAfter;
     closable;
@@ -360,7 +370,7 @@ class NotificationComponent {
         return onclose ? fadeCloseAnimation(duration) : fadeAnimation(duration);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: NotificationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1$1.AnimationBuilder }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: NotificationComponent, isStandalone: true, selector: "kendo-notification", inputs: { templateRef: "templateRef", templateString: "templateString", width: "width", height: "height", notificationLabel: "notificationLabel", cssClass: "cssClass", hideAfter: "hideAfter", closable: "closable", type: "type", animation: "animation" }, host: { properties: { "attr.dir": "this.direction" } }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: NotificationComponent, isStandalone: true, selector: "kendo-notification", inputs: { templateRef: "templateRef", templateString: "templateString", width: "width", height: "height", notificationLabel: "notificationLabel", notificationRole: "notificationRole", cssClass: "cssClass", hideAfter: "hideAfter", closable: "closable", type: "type", animation: "animation" }, host: { properties: { "attr.dir": "this.direction" } }, providers: [
             LocalizationService,
             {
                 provide: L10N_PREFIX,
@@ -376,7 +386,7 @@ class NotificationComponent {
       [ngClass]="cssClass"
       [style.height.px]="height"
       [style.width.px]="width"
-      role="alert"
+      [attr.role]="notificationRole"
       aria-live="polite"
       [attr.aria-describedby]="contentId"
       [attr.aria-label]="notificationLabel">
@@ -399,7 +409,7 @@ class NotificationComponent {
         }
         <ng-container #container></ng-container>
       </div>
-    
+
       @if (closable) {
         <span class="k-notification-actions" aria-hidden="true">
           <span class="k-notification-action k-notification-close-action" [attr.title]="closeButtonTitle" (click)="onCloseClick()">
@@ -424,7 +434,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
       [ngClass]="cssClass"
       [style.height.px]="height"
       [style.width.px]="width"
-      role="alert"
+      [attr.role]="notificationRole"
       aria-live="polite"
       [attr.aria-describedby]="contentId"
       [attr.aria-label]="notificationLabel">
@@ -447,7 +457,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
         }
         <ng-container #container></ng-container>
       </div>
-    
+
       @if (closable) {
         <span class="k-notification-actions" aria-hidden="true">
           <span class="k-notification-action k-notification-close-action" [attr.title]="closeButtonTitle" (click)="onCloseClick()">
@@ -480,6 +490,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Input
             }], notificationLabel: [{
                 type: Input
+            }], notificationRole: [{
+                type: Input
             }], cssClass: [{
                 type: Input
             }], hideAfter: [{
@@ -598,6 +610,9 @@ class NotificationContainerComponent {
         if (settings.notificationLabel) {
             notification.notificationLabel = settings.notificationLabel;
         }
+        if (settings.notificationRole) {
+            notification.notificationRole = settings.notificationRole;
+        }
         notification.closable = settings.closable;
         notification.hideAfter = settings.hideAfter;
         notification.width = settings.width;

package/models/notification-settings.d.ts

@@ -85,6 +85,15 @@ export declare class NotificationSettings {
      * This property is related to accessibility.
      */
     notificationLabel?: string;
+    /**
+     * The value of the Notification element `role` attribute.
+     *
+     * @default 'status'
+     *
+     * @remarks
+     * This property is related to accessibility.
+     */
+    notificationRole?: string;
     /**
      * Specifies a list of CSS classes that you add to the Notification.
      * To apply CSS rules to the component, set `encapsulation` to `ViewEncapsulation.None`

package/notification.component.d.ts

@@ -33,6 +33,7 @@ export declare class NotificationComponent implements OnInit, OnDestroy {
     width?: number;
     height?: number;
     notificationLabel: string;
+    notificationRole: string;
     cssClass?: string | Array<string> | object;
     hideAfter?: number;
     closable?: boolean;
@@ -66,5 +67,5 @@ export declare class NotificationComponent implements OnInit, OnDestroy {
     private slideAnimation;
     private fadeAnimation;
     static ɵfac: i0.ɵɵFactoryDeclaration<NotificationComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NotificationComponent, "kendo-notification", never, { "templateRef": { "alias": "templateRef"; "required": false; }; "templateString": { "alias": "templateString"; "required": false; }; "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "notificationLabel": { "alias": "notificationLabel"; "required": false; }; "cssClass": { "alias": "cssClass"; "required": false; }; "hideAfter": { "alias": "hideAfter"; "required": false; }; "closable": { "alias": "closable"; "required": false; }; "type": { "alias": "type"; "required": false; }; "animation": { "alias": "animation"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NotificationComponent, "kendo-notification", never, { "templateRef": { "alias": "templateRef"; "required": false; }; "templateString": { "alias": "templateString"; "required": false; }; "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "notificationLabel": { "alias": "notificationLabel"; "required": false; }; "notificationRole": { "alias": "notificationRole"; "required": false; }; "cssClass": { "alias": "cssClass"; "required": false; }; "hideAfter": { "alias": "hideAfter"; "required": false; }; "closable": { "alias": "closable"; "required": false; }; "type": { "alias": "type"; "required": false; }; "animation": { "alias": "animation"; "required": false; }; }, {}, never, never, true, never>;
 }

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1774881281,
-  "version": "23.3.0-develop.21",
+  "publishDate": 1775110885,
+  "version": "23.3.0-develop.23",
   "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-notification",
-  "version": "23.3.0-develop.21",
+  "version": "23.3.0-develop.23",
   "description": "Kendo UI Notification for Angular",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -17,7 +17,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1774881281,
+      "publishDate": 1775110885,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/"
     }
   },
@@ -27,14 +27,14 @@
     "@angular/core": "19 - 21",
     "@angular/platform-browser": "19 - 21",
     "@progress/kendo-licensing": "^1.10.0",
-    "@progress/kendo-angular-common": "23.3.0-develop.21",
-    "@progress/kendo-angular-l10n": "23.3.0-develop.21",
-    "@progress/kendo-angular-icons": "23.3.0-develop.21",
+    "@progress/kendo-angular-common": "23.3.0-develop.23",
+    "@progress/kendo-angular-l10n": "23.3.0-develop.23",
+    "@progress/kendo-angular-icons": "23.3.0-develop.23",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "23.3.0-develop.21"
+    "@progress/kendo-angular-schematics": "23.3.0-develop.23"
   },
   "schematics": "./schematics/collection.json",
   "module": "fesm2022/progress-kendo-angular-notification.mjs",