@vaadin/field-base 25.1.2 → 25.2.0-alpha10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/field-base",
-  "version": "25.1.2",
+  "version": "25.2.0-alpha10",
   "publishConfig": {
     "access": "public"
   },
@@ -32,17 +32,17 @@
   ],
   "dependencies": {
     "@open-wc/dedupe-mixin": "^1.3.0",
-    "@vaadin/a11y-base": "~25.1.2",
-    "@vaadin/component-base": "~25.1.2",
+    "@vaadin/a11y-base": "25.2.0-alpha10",
+    "@vaadin/component-base": "25.2.0-alpha10",
     "lit": "^3.0.0"
   },
   "devDependencies": {
-    "@vaadin/chai-plugins": "~25.1.2",
-    "@vaadin/input-container": "~25.1.2",
-    "@vaadin/test-runner-commands": "~25.1.2",
+    "@vaadin/chai-plugins": "25.2.0-alpha10",
+    "@vaadin/input-container": "25.2.0-alpha10",
+    "@vaadin/test-runner-commands": "25.2.0-alpha10",
     "@vaadin/testing-helpers": "^2.0.0",
     "sinon": "^21.0.2"
   },
   "customElements": "custom-elements.json",
-  "gitHead": "48e5dc507ac5eb8d34839be06cac652f1635fe1c"
+  "gitHead": "1303b6a3eeecb44a9d26f2b53cb56d9e906febdf"
 }

package/src/field-mixin.js

@@ -200,7 +200,7 @@ export const FieldMixin = (superclass) =>
         // Otherwise assistive technologies would announce the error, even if we hide it.
         if (invalid) {
           const node = this._errorNode;
-          this._fieldAriaController.setErrorId(node && node.id);
+          this._fieldAriaController.setErrorId(node?.id);
         } else {
           this._fieldAriaController.setErrorId(null);
         }

package/src/input-constraints-mixin.js

@@ -16,116 +16,117 @@ import { ValidateMixin } from './validate-mixin.js';
  * @mixes InputMixin
  * @mixes ValidateMixin
  */
-export const InputConstraintsMixin = dedupeMixin(
-  (superclass) =>
-    class InputConstraintsMixinClass extends DelegateStateMixin(ValidateMixin(InputMixin(superclass))) {
-      /**
-       * An array of attributes which participate in the input validation.
-       * Changing these attributes will cause the input to re-validate.
-       *
-       * IMPORTANT: The attributes should be properly delegated to the input element
-       * from the host using `delegateAttrs` getter (see `DelegateStateMixin`).
-       * The `required` attribute is already delegated.
-       */
-      static get constraints() {
-        return ['required'];
-      }
+const InputConstraintsMixinImplementation = (superclass) => {
+  return class InputConstraintsMixinClass extends DelegateStateMixin(ValidateMixin(InputMixin(superclass))) {
+    /**
+     * An array of attributes which participate in the input validation.
+     * Changing these attributes will cause the input to re-validate.
+     *
+     * IMPORTANT: The attributes should be properly delegated to the input element
+     * from the host using `delegateAttrs` getter (see `DelegateStateMixin`).
+     * The `required` attribute is already delegated.
+     */
+    static get constraints() {
+      return ['required'];
+    }
 
-      static get delegateAttrs() {
-        return [...super.delegateAttrs, 'required'];
-      }
+    static get delegateAttrs() {
+      return [...super.delegateAttrs, 'required'];
+    }
 
-      /** @protected */
-      ready() {
-        super.ready();
+    /** @protected */
+    ready() {
+      super.ready();
 
-        this._createConstraintsObserver();
-      }
+      this._createConstraintsObserver();
+    }
 
-      /**
-       * Returns true if the current input value satisfies all constraints (if any).
-       * @return {boolean}
-       */
-      checkValidity() {
-        if (this.inputElement && this._hasValidConstraints(this.constructor.constraints.map((c) => this[c]))) {
-          return this.inputElement.checkValidity();
-        }
-        return !this.invalid;
+    /**
+     * Returns true if the current input value satisfies all constraints (if any).
+     * @return {boolean}
+     */
+    checkValidity() {
+      if (this.inputElement && this._hasValidConstraints(this.constructor.constraints.map((c) => this[c]))) {
+        return this.inputElement.checkValidity();
       }
+      return !this.invalid;
+    }
 
-      /**
-       * Returns true if some of the provided set of constraints are valid.
-       * @param {Array} constraints
-       * @return {boolean}
-       * @protected
-       */
-      _hasValidConstraints(constraints) {
-        return constraints.some((c) => this.__isValidConstraint(c));
-      }
+    /**
+     * Returns true if some of the provided set of constraints are valid.
+     * @param {Array} constraints
+     * @return {boolean}
+     * @protected
+     */
+    _hasValidConstraints(constraints) {
+      return constraints.some((c) => this.__isValidConstraint(c));
+    }
 
-      /**
-       * Override this method to customize setting up constraints observer.
-       * @protected
-       */
-      _createConstraintsObserver() {
-        // This complex observer needs to be added dynamically instead of using `static get observers()`
-        // to make it possible to tweak this behavior in classes that apply this mixin.
-        this._createMethodObserver(`_constraintsChanged(stateTarget, ${this.constructor.constraints.join(', ')})`);
-      }
+    /**
+     * Override this method to customize setting up constraints observer.
+     * @protected
+     */
+    _createConstraintsObserver() {
+      // This complex observer needs to be added dynamically instead of using `static get observers()`
+      // to make it possible to tweak this behavior in classes that apply this mixin.
+      this._createMethodObserver(`_constraintsChanged(stateTarget, ${this.constructor.constraints.join(', ')})`);
+    }
 
-      /**
-       * Override this method to implement custom validation constraints.
-       * @param {HTMLElement | undefined} stateTarget
-       * @param {unknown[]} constraints
-       * @protected
-       */
-      _constraintsChanged(stateTarget, ...constraints) {
-        // The input element's validity cannot be determined until
-        // all the necessary constraint attributes aren't set on it.
-        if (!stateTarget) {
-          return;
-        }
-
-        const hasConstraints = this._hasValidConstraints(constraints);
-        const isLastConstraintRemoved = this.__previousHasConstraints && !hasConstraints;
-
-        if ((this._hasValue || this.invalid) && hasConstraints) {
-          this._requestValidation();
-        } else if (isLastConstraintRemoved && !this.manualValidation) {
-          this._setInvalid(false);
-        }
-
-        this.__previousHasConstraints = hasConstraints;
+    /**
+     * Override this method to implement custom validation constraints.
+     * @param {HTMLElement | undefined} stateTarget
+     * @param {unknown[]} constraints
+     * @protected
+     */
+    _constraintsChanged(stateTarget, ...constraints) {
+      // The input element's validity cannot be determined until
+      // all the necessary constraint attributes aren't set on it.
+      if (!stateTarget) {
+        return;
       }
 
-      /**
-       * Override an event listener inherited from `InputMixin`
-       * to capture native `change` event and make sure that
-       * a new one is dispatched after validation runs.
-       * @param {Event} event
-       * @protected
-       * @override
-       */
-      _onChange(event) {
-        event.stopPropagation();
+      const hasConstraints = this._hasValidConstraints(constraints);
+      const isLastConstraintRemoved = this.__previousHasConstraints && !hasConstraints;
 
+      if ((this._hasValue || this.invalid) && hasConstraints) {
         this._requestValidation();
-
-        this.dispatchEvent(
-          new CustomEvent('change', {
-            detail: {
-              sourceEvent: event,
-            },
-            bubbles: event.bubbles,
-            cancelable: event.cancelable,
-          }),
-        );
+      } else if (isLastConstraintRemoved && !this.manualValidation) {
+        this._setInvalid(false);
       }
 
-      /** @private */
-      __isValidConstraint(constraint) {
-        // 0 is valid for `minlength` and `maxlength`
-        return Boolean(constraint) || constraint === 0;
-      }
-    },
-);
+      this.__previousHasConstraints = hasConstraints;
+    }
+
+    /**
+     * Override an event listener inherited from `InputMixin`
+     * to capture native `change` event and make sure that
+     * a new one is dispatched after validation runs.
+     * @param {Event} event
+     * @protected
+     * @override
+     */
+    _onChange(event) {
+      event.stopPropagation();
+
+      this._requestValidation();
+
+      this.dispatchEvent(
+        new CustomEvent('change', {
+          detail: {
+            sourceEvent: event,
+          },
+          bubbles: event.bubbles,
+          cancelable: event.cancelable,
+        }),
+      );
+    }
+
+    /** @private */
+    __isValidConstraint(constraint) {
+      // 0 is valid for `minlength` and `maxlength`
+      return Boolean(constraint) || constraint === 0;
+    }
+  };
+};
+
+export const InputConstraintsMixin = dedupeMixin(InputConstraintsMixinImplementation);

package/src/input-control-mixin.js

@@ -250,17 +250,4 @@ export const InputControlMixin = (superclass) =>
         }
       }
     }
-
-    /**
-     * Fired when the user commits a value change.
-     *
-     * @event change
-     */
-
-    /**
-     * Fired when the value is changed by the user: on every typing keystroke,
-     * and the value is cleared using the clear button.
-     *
-     * @event input
-     */
   };