@vaadin/vaadin-select 2.4.4 → 2.5.0

package/package.json

@@ -10,7 +10,7 @@
   "repository": "vaadin/vaadin-select",
   "homepage": "https://vaadin.com/components",
   "name": "@vaadin/vaadin-select",
-  "version": "2.4.4",
+  "version": "2.5.0",
   "main": "vaadin-select.js",
   "author": "Vaadin Ltd",
   "license": "Apache-2.0",
@@ -36,7 +36,7 @@
     "@polymer/iron-resizable-behavior": "^3.0.0",
     "@vaadin/vaadin-control-state-mixin": "^2.2.1",
     "@vaadin/vaadin-themable-mixin": "^1.6.1",
-    "@vaadin/vaadin-text-field": "^2.8.0",
+    "@vaadin/vaadin-text-field": "^2.10.0",
     "@vaadin/vaadin-list-box": "^1.4.0",
     "@vaadin/vaadin-list-mixin": "^2.5.0",
     "@vaadin/vaadin-item": "^2.3.0",

package/src/vaadin-select.d.ts

@@ -214,9 +214,17 @@ declare class SelectElement extends
   notifyResize(): void;
   _onKeyDown(e: KeyboardEvent): void;
   _onKeyDownInside(e: KeyboardEvent): void;
+  _setInvalid(invalid: boolean): void;
 
   /**
-   * Returns true if `value` is valid, and sets the `invalid` flag appropriately.
+   * Override this method to define whether the given `invalid` state should be set.
+   */
+  _shouldSetInvalid(_invalid: boolean): boolean;
+
+  /**
+   * Validates the field and sets the `invalid` property based on the result.
+   *
+   * The method fires a `validated` event with the result of the validation.
    *
    * @returns True if the value is valid and sets the `invalid` flag appropriately
    */

package/src/vaadin-select.js

@@ -178,7 +178,7 @@ class SelectElement extends
   }
 
   static get version() {
-    return '2.4.4';
+    return '2.5.0';
   }
 
   static get properties() {
@@ -745,12 +745,38 @@ class SelectElement extends
   }
 
   /**
-   * Returns true if `value` is valid, and sets the `invalid` flag appropriately.
+   * @param {boolean} invalid
+   * @protected
+   */
+  _setInvalid(invalid) {
+    if (this._shouldSetInvalid(invalid)) {
+      this.invalid = invalid;
+    }
+  }
+
+  /**
+   * Override this method to define whether the given `invalid` state should be set.
+   *
+   * @param {boolean} _invalid
+   * @return {boolean}
+   * @protected
+   */
+  _shouldSetInvalid(_invalid) {
+    return true;
+  }
+
+  /**
+   * Validates the field and sets the `invalid` property based on the result.
+   *
+   * The method fires a `validated` event with the result of the validation.
    *
    * @return {boolean} True if the value is valid and sets the `invalid` flag appropriately
    */
   validate() {
-    return !(this.invalid = !(this.disabled || !this.required || this.value));
+    const isValid = !!(this.disabled || !this.required || this.value);
+    this._setInvalid(!isValid);
+    this.dispatchEvent(new CustomEvent('validated', {detail: {valid: isValid}}));
+    return isValid;
   }
 
   /**
@@ -758,6 +784,14 @@ class SelectElement extends
    *
    * @event change
    */
+
+  /**
+   * Fired whenever the field is validated.
+   *
+   * @event validated
+   * @param {Object} detail
+   * @param {boolean} detail.valid the result of the validation.
+   */
 }
 
 customElements.define(SelectElement.is, SelectElement);