@descope/web-components-ui 2.2.54 → 2.2.55

package/dist/cjs/index.cjs.js

@@ -2988,6 +2988,19 @@ const activeableMixin = (superclass) =>
     }
   };
 
+const inputOverrideValidConstraintsMixin$1 = (superclass) =>
+  class InputOverrideValidConstraintsMixinClass extends superclass {
+    init() {
+      super.init?.();
+
+      // vaadin uses `validConstraints` (required, pattern, minlength, maxlength) to determine if it should validate
+      // the input or not. We want to override this behavior, so we can enforce validation even if these attributes are not present.
+      if (this.baseElement._hasValidConstraints) {
+        this.baseElement._hasValidConstraints = () => true;
+      }
+    }
+  };
+
 const getFileExtension = (path) => {
   const match = path.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);
   return match ? match[1] : null;
@@ -8239,7 +8252,7 @@ const componentName$V = getComponentName('combo-box');
 const ComboBoxMixin = (superclass) =>
   class ComboBoxMixinClass extends superclass {
     static get observedAttributes() {
-      return ['label-type'];
+      return ['label-type', 'require-match'];
     }
 
     // eslint-disable-next-line class-methods-use-this
@@ -8311,6 +8324,10 @@ const ComboBoxMixin = (superclass) =>
       }
     }
 
+    get requireMatch() {
+      return this.getAttribute('require-match') === 'true' && !this.allowCustomValue;
+    }
+
     // eslint-disable-next-line class-methods-use-this
     isValidDataType(data) {
       const isValid = Array.isArray(data);
@@ -8463,16 +8480,27 @@ const ComboBoxMixin = (superclass) =>
       }
     }
 
+    isValueMatch() {
+      return this.baseElement.items.some(val => val.getAttribute('data-id') === this.baseElement.querySelector('input').value);
+    }
+
     init() {
       super.init?.();
 
       // eslint-disable-next-line func-names
       this.getValidity = function () {
+        if (this.requireMatch && !this.isValueMatch()) {
+          return {
+            patternMismatch: true,
+          };
+        }
+
         if (!this.value && this.isRequired) {
           return {
             valueMissing: true,
           };
         }
+
         return {};
       };
 
@@ -8524,6 +8552,10 @@ const ComboBoxMixin = (superclass) =>
       }
     }
 
+    handleRequireMatchChange(shouldValidate) {
+      this.baseElement.allowCustomValue = shouldValidate || this.allowCustomValue;
+    }
+
     attributeChangedCallback(attrName, oldValue, newValue) {
       super.attributeChangedCallback?.(attrName, oldValue, newValue);
 
@@ -8534,6 +8566,8 @@ const ComboBoxMixin = (superclass) =>
           } else {
             this.removeEventListener('click', this.onLabelClick);
           }
+        } else if (attrName === 'require-match') {
+          this.handleRequireMatchChange(newValue === 'true');
         }
       }
     }
@@ -8831,6 +8865,7 @@ const ComboBoxClass = compose(
     proxyProps: ['selectionStart'],
     inputEvent: 'value-changed',
   }),
+  inputOverrideValidConstraintsMixin$1,
   componentNameValidationMixin$1,
   ComboBoxMixin,
 )(