@descope/web-components-ui 1.0.404 → 1.0.406

package/dist/index.esm.js

@@ -1436,10 +1436,14 @@ const inputEventsDispatchingMixin = (superclass) =>
       // we are comparing the previous value to the new one,
       // and if they have the same value, we are blocking the input event
       this.addEventListener('input', (e) => {
-        e.stopImmediatePropagation();
-        if (previousRootComponentValue !== this.value) {
-          previousRootComponentValue = this.value;
-          createDispatchEvent.call(this, 'input', { bubbles: true });
+        // We don't want to block our own event that we fire from handleInputEventDispatching
+        if (this !== e.target) {
+          e.stopImmediatePropagation();
+
+          if (previousRootComponentValue !== this.value) {
+            previousRootComponentValue = this.value;
+            createDispatchEvent.call(this, 'input', { bubbles: true, composed: true });
+          }
         }
       });
     }
@@ -8768,7 +8772,6 @@ class PhoneFieldInternal extends BaseInputClass$5 {
     });
 
     this.handleFocusEventsDispatching([this.phoneNumberInput]);
-    this.handleInputEventDispatching();
   }
 
   attributeChangedCallback(attrName, oldValue, newValue) {
@@ -15319,8 +15322,6 @@ const componentName$1 = getComponentName('hybrid-field');
 
 const attrs = {
   shared: [
-    'label',
-    'placeholder',
     'bordered',
     'full-width',
     'label-type',
@@ -15331,12 +15332,15 @@ const attrs = {
     'st-host-direction',
   ],
   email: [
+    'label',
+    'placeholder',
     'data-errormessage-value-missing-email',
     'data-errormessage-pattern-mismatch-email',
     'external-input',
   ],
   phone: {
     countryCode: [
+      'phone-input-label',
       'country-input-label',
       'country-input-placeholder',
       'restrict-countries',
@@ -15345,6 +15349,7 @@ const attrs = {
       'data-errormessage-value-missing-phone',
     ],
     inputBox: [
+      'label',
       'restrict-countries',
       'default-code',
       'phone-minlength',
@@ -15359,7 +15364,7 @@ const attrMap = {
     'data-errormessage-pattern-mismatch-email': 'data-errormessage-pattern-mismatch',
   },
   phone: {
-    placeholder: 'phone-input-placeholder',
+    'phone-input-label': 'label',
     'phone-minlength': 'minlength',
     'data-errormessage-value-missing-phone': 'data-errormessage-value-missing',
   },
@@ -15392,7 +15397,7 @@ class RawHybridField extends BaseClass {
       }
       .wrapper {
         display: grid;
-        place-content: center;
+        width: 100%;
       }
       descope-email-field,
       descope-phone-field,
@@ -15519,8 +15524,6 @@ class RawHybridField extends BaseClass {
   }
 
   updateAttrs() {
-    this.inputs.forEach((input) => forwardAttrs(this, input, { includeAttrs: attrs.shared }));
-
     forwardAttrs(this, this.emailInput, { includeAttrs: attrs.email, mapAttrs: attrMap.email });
 
     forwardAttrs(this, this.phoneCountryCodeInput, {
@@ -15533,6 +15536,8 @@ class RawHybridField extends BaseClass {
       mapAttrs: attrMap.phone,
     });
 
+    this.inputs.forEach((input) => forwardAttrs(this, input, { includeAttrs: attrs.shared }));
+
     setTimeout(() => this.phoneCountryCodeInput.setAttribute('default-code', this.defaultCode));
   }