@vaadin/upload 23.0.0-alpha3 → 23.0.0-beta2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/upload",
-  "version": "23.0.0-alpha3",
+  "version": "23.0.0-beta2",
   "publishConfig": {
     "access": "public"
   },
@@ -18,6 +18,7 @@
   },
   "main": "vaadin-upload.js",
   "module": "vaadin-upload.js",
+  "type": "module",
   "files": [
     "src",
     "theme",
@@ -33,18 +34,18 @@
   ],
   "dependencies": {
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/button": "23.0.0-alpha3",
-    "@vaadin/component-base": "23.0.0-alpha3",
-    "@vaadin/progress-bar": "23.0.0-alpha3",
-    "@vaadin/vaadin-lumo-styles": "23.0.0-alpha3",
-    "@vaadin/vaadin-material-styles": "23.0.0-alpha3",
-    "@vaadin/vaadin-themable-mixin": "23.0.0-alpha3"
+    "@vaadin/button": "23.0.0-beta2",
+    "@vaadin/component-base": "23.0.0-beta2",
+    "@vaadin/progress-bar": "23.0.0-beta2",
+    "@vaadin/vaadin-lumo-styles": "23.0.0-beta2",
+    "@vaadin/vaadin-material-styles": "23.0.0-beta2",
+    "@vaadin/vaadin-themable-mixin": "23.0.0-beta2"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
-    "@vaadin/form-layout": "23.0.0-alpha3",
+    "@vaadin/form-layout": "23.0.0-beta2",
     "@vaadin/testing-helpers": "^0.3.2",
     "sinon": "^9.2.0"
   },
-  "gitHead": "490037919a9e054cc002c1b3be0c94a1603e1a44"
+  "gitHead": "a276f7a0fd00e5459b87267468e0dd0d4fb6f7f3"
 }

package/src/vaadin-upload.js

@@ -8,6 +8,7 @@ import '@vaadin/button/src/vaadin-button.js';
 import './vaadin-upload-icons.js';
 import './vaadin-upload-file.js';
 import { html, PolymerElement } from '@polymer/polymer/polymer-element.js';
+import { announce } from '@vaadin/component-base/src/a11y-announcer.js';
 import { isTouch } from '@vaadin/component-base/src/browser-utils.js';
 import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
 import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
@@ -443,6 +444,10 @@ class Upload extends ElementMixin(ThemableMixin(PolymerElement)) {
     this.addEventListener('file-abort', this._onFileAbort.bind(this));
     this.addEventListener('file-remove', this._onFileRemove.bind(this));
     this.addEventListener('file-start', this._onFileStart.bind(this));
+    this.addEventListener('file-reject', this._onFileReject.bind(this));
+    this.addEventListener('upload-start', this._onUploadStart.bind(this));
+    this.addEventListener('upload-success', this._onUploadSuccess.bind(this));
+    this.addEventListener('upload-error', this._onUploadError.bind(this));
   }
 
   /** @private */
@@ -857,6 +862,26 @@ class Upload extends ElementMixin(ThemableMixin(PolymerElement)) {
     this._removeFile(event.detail.file);
   }
 
+  /** @private */
+  _onFileReject(event) {
+    announce(`${event.detail.file.name}: ${event.detail.file.error}`, { mode: 'alert' });
+  }
+
+  /** @private */
+  _onUploadStart(event) {
+    announce(`${event.detail.file.name}: 0%`, { mode: 'alert' });
+  }
+
+  /** @private */
+  _onUploadSuccess(event) {
+    announce(`${event.detail.file.name}: 100%`, { mode: 'alert' });
+  }
+
+  /** @private */
+  _onUploadError(event) {
+    announce(`${event.detail.file.name}: ${event.detail.file.error}`, { mode: 'alert' });
+  }
+
   /** @private */
   _dragoverChanged(dragover) {
     dragover ? this.setAttribute('dragover', dragover) : this.removeAttribute('dragover');