@vaadin/notification - npm Package Compare versions

Comparing version 24.5.0-rc2 to 24.6.0-alpha1

package.json

 {
   "name": "@vaadin/notification",
-  "version": "24.5.0-rc2",
+  "version": "24.6.0-alpha1",
   "publishConfig": {
@@ -41,12 +41,12 @@ "access": "public"
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/component-base": "24.5.0-rc2",
-    "@vaadin/lit-renderer": "24.5.0-rc2",
-    "@vaadin/vaadin-lumo-styles": "24.5.0-rc2",
-    "@vaadin/vaadin-material-styles": "24.5.0-rc2",
-    "@vaadin/vaadin-themable-mixin": "24.5.0-rc2",
+    "@vaadin/component-base": "24.6.0-alpha1",
+    "@vaadin/lit-renderer": "24.6.0-alpha1",
+    "@vaadin/vaadin-lumo-styles": "24.6.0-alpha1",
+    "@vaadin/vaadin-material-styles": "24.6.0-alpha1",
+    "@vaadin/vaadin-themable-mixin": "24.6.0-alpha1",
     "lit": "^3.0.0"
   },
   "devDependencies": {
-    "@vaadin/button": "24.5.0-rc2",
-    "@vaadin/chai-plugins": "24.5.0-rc2",
+    "@vaadin/button": "24.6.0-alpha1",
+    "@vaadin/chai-plugins": "24.6.0-alpha1",
     "@vaadin/testing-helpers": "^1.0.0",
@@ -59,3 +59,3 @@ "sinon": "^18.0.0"
   ],
-  "gitHead": "be5bf40aec33761c6defdb5b3093c7b6dd5d97fd"
+  "gitHead": "ae1fb0e6e7ce925999051c6cc62ba8476264c63f"
 }

src/vaadin-notification.d.ts

@@ -43,2 +43,3 @@ /**
 export interface ShowOptions {
+  assertive?: boolean;
   duration?: number;
@@ -120,2 +121,3 @@ position?: NotificationPosition;
    * {
+   *   assertive?: boolean
    *   position?: string
@@ -128,2 +130,3 @@ *   duration?: number
    * See the individual documentation for:
+   * - [`assertive`](#/elements/vaadin-notification#property-assertive)
    * - [`position`](#/elements/vaadin-notification#property-position)
@@ -138,2 +141,9 @@ * - [`duration`](#/elements/vaadin-notification#property-duration)
   /**
+   * When true, the notification card has `aria-live` attribute set to
+   * `assertive` instead of `polite`. This makes screen readers announce
+   * the notification content immediately when it appears.
+   */
+  assertive: boolean;
+
+  /**
    * The duration in milliseconds to show the notification.
@@ -140,0 +150,0 @@ * Set to `0` or a negative number to disable the notification auto-closing.

src/vaadin-notification.js

@@ -211,3 +211,2 @@ /**
     this.setAttribute('role', 'alert');
-    this.setAttribute('aria-live', 'polite');
   }
@@ -277,3 +276,6 @@ }
       </style>
-      <vaadin-notification-card theme$="[[_theme]]"> </vaadin-notification-card>
+      <vaadin-notification-card
+        theme$="[[_theme]]"
+        aria-live$="[[__computeAriaLive(assertive)]]"
+      ></vaadin-notification-card>
     `;
@@ -289,2 +291,12 @@ }
       /**
+       * When true, the notification card has `aria-live` attribute set to
+       * `assertive` instead of `polite`. This makes screen readers announce
+       * the notification content immediately when it appears.
+       */
+      assertive: {
+        type: Boolean,
+        value: false,
+      },
+
+      /**
        * The duration in milliseconds to show the notification.
@@ -346,2 +358,3 @@ * Set to `0` or a negative number to disable the notification auto-closing.
    * {
+   *   assertive?: boolean
    *   position?: string
@@ -354,2 +367,3 @@ *   duration?: number
    * See the individual documentation for:
+   * - [`assertive`](#/elements/vaadin-notification#property-assertive)
    * - [`position`](#/elements/vaadin-notification#property-position)
@@ -381,2 +395,5 @@ * - [`duration`](#/elements/vaadin-notification#property-duration)
     }
+    if (options && options.assertive) {
+      notification.assertive = options.assertive;
+    }
     if (options && options.theme) {
@@ -446,2 +463,7 @@ notification.setAttribute('theme', options.theme);
   /** @private */
+  __computeAriaLive(assertive) {
+    return assertive ? 'assertive' : 'polite';
+  }
+
+  /** @private */
   _rendererChanged(renderer, opened, card) {
@@ -448,0 +470,0 @@ if (!card) {

web-types.json

 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/notification",
-  "version": "24.5.0-rc2",
+  "version": "24.6.0-alpha1",
   "description-markup": "markdown",
@@ -25,2 +25,13 @@ "contributions": {
             {
+              "name": "assertive",
+              "description": "When true, the notification card has `aria-live` attribute set to\n`assertive` instead of `polite`. This makes screen readers announce\nthe notification content immediately when it appears.",
+              "value": {
+                "type": [
+                  "boolean",
+                  "null",
+                  "undefined"
+                ]
+              }
+            },
+            {
               "name": "duration",
@@ -78,2 +89,13 @@ "description": "The duration in milliseconds to show the notification.\nSet to `0` or a negative number to disable the notification auto-closing.",
               {
+                "name": "assertive",
+                "description": "When true, the notification card has `aria-live` attribute set to\n`assertive` instead of `polite`. This makes screen readers announce\nthe notification content immediately when it appears.",
+                "value": {
+                  "type": [
+                    "boolean",
+                    "null",
+                    "undefined"
+                  ]
+                }
+              },
+              {
                 "name": "duration",
@@ -80,0 +102,0 @@ "description": "The duration in milliseconds to show the notification.\nSet to `0` or a negative number to disable the notification auto-closing.",

web-types.lit.json

 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/notification",
-  "version": "24.5.0-rc2",
+  "version": "24.6.0-alpha1",
   "description-markup": "markdown",
@@ -23,2 +23,9 @@ "framework": "lit",
             {
+              "name": "?assertive",
+              "description": "When true, the notification card has `aria-live` attribute set to\n`assertive` instead of `polite`. This makes screen readers announce\nthe notification content immediately when it appears.",
+              "value": {
+                "kind": "expression"
+              }
+            },
+            {
               "name": "?opened",
@@ -25,0 +32,0 @@ "description": "True if the notification is currently displayed.",

No alert changes

Improved metrics

Total package byte prevSize

65592

increased by3.66%

Lines of code

1422

increased by4.25%

Dependency changes

• + Added@vaadin/component-base@24.6.0-alpha1(transitive)

• + Added@vaadin/icon@24.6.0-alpha1(transitive)

• + Added@vaadin/lit-renderer@24.6.0-alpha1(transitive)

• + Added@vaadin/vaadin-lumo-styles@24.6.0-alpha1(transitive)

• + Added@vaadin/vaadin-material-styles@24.6.0-alpha1(transitive)

• + Added@vaadin/vaadin-themable-mixin@24.6.0-alpha1(transitive)

• - Removed@vaadin/component-base@24.5.0-rc2(transitive)

• - Removed@vaadin/icon@24.5.0-rc2(transitive)

• - Removed@vaadin/lit-renderer@24.5.0-rc2(transitive)

• - Removed@vaadin/vaadin-lumo-styles@24.5.0-rc2(transitive)

• - Removed@vaadin/vaadin-material-styles@24.5.0-rc2(transitive)

• - Removed@vaadin/vaadin-themable-mixin@24.5.0-rc2(transitive)

• Updated@vaadin/component-base@24.6.0-alpha1

• Updated@vaadin/lit-renderer@24.6.0-alpha1

• Updated@vaadin/vaadin-lumo-styles@24.6.0-alpha1

• Updated@vaadin/vaadin-material-styles@24.6.0-alpha1

• Updated@vaadin/vaadin-themable-mixin@24.6.0-alpha1