@everymatrix/general-registration 1.87.24 → 1.87.26

package/dist/cjs/checkbox-group-input_15.cjs.entry.js

@@ -14212,6 +14212,7 @@ const GeneralRegistration = class {
         this.validationChange = index.createEvent(this, "validationChange", 7);
         this.isSelectingAddress = false;
         this.lastPostalCode = null;
+        this.isRestoringAfterError = false;
         this.selectedCountry = '';
         this.listOfInputValues = [];
         this.listOfInputValidity = [];
@@ -14338,10 +14339,12 @@ const GeneralRegistration = class {
                 if (value === 'GB') {
                     this.selectedCountry = 'UK';
                 }
-                this.resetAllAddressFields();
-                window.dispatchEvent(new CustomEvent('countryCodeUpdated', {
-                    detail: { name, value: this.selectedCountry }
-                }));
+                if (!this.isRestoringAfterError) {
+                    this.resetAllAddressFields();
+                    window.dispatchEvent(new CustomEvent('countryCodeUpdated', {
+                        detail: { name, value: this.selectedCountry }
+                    }));
+                }
             }
             if (name === 'PostalCode') {
                 if (!this.listOfInputs.some(i => i.name === 'CountryCode')) {
@@ -14411,6 +14414,10 @@ const GeneralRegistration = class {
         this.isSelectingAddress = false;
     }
     handleCountryCodeUpdateGlobal(event) {
+        // Prevents clearing the fields when restoring after error
+        if (this.isRestoringAfterError) {
+            return;
+        }
         const { name } = event.detail;
         if (name === 'CountryCode') {
             const savedState = localStorage.getItem('registrationStepsState');
@@ -14565,6 +14572,9 @@ const GeneralRegistration = class {
     }
     nextHandler(e) {
         e.preventDefault();
+        // Set flag before emitting values to prevent countryCodeUpdated from clearing fields
+        // This protects against clearing during both submission and error restoration
+        this.isRestoringAfterError = true;
         // Trigger events in subwidgets.
         this.emitValue = true;
         this.errorMessage = '';
@@ -14865,6 +14875,7 @@ const GeneralRegistration = class {
             console.error(err);
         }).finally(() => {
             this.isLoadingPOST = false;
+            this.isRestoringAfterError = false;
         });
     }
     setRegister() {
@@ -16282,17 +16293,15 @@ const TelInput = class {
                 clearTimeout(this.debounceTime);
             }
             this.debounceTime = setTimeout(() => {
-                this.isValid = this.setValidity();
+                this.isValid = this.isValidValue();
                 this.errorMessage = this.setErrorMessage();
                 this.emitValueHandler(true);
             }, 500);
         };
         this.handleBlur = () => {
-            if (!this.touched) {
-                this.isValid = this.setValidity();
-                this.errorMessage = this.setErrorMessage();
-                this.touched = true;
-            }
+            this.touched = true;
+            this.isValid = this.isValidValue();
+            this.errorMessage = this.setErrorMessage();
         };
         this.setClientStyling = () => {
             let sheet = document.createElement('style');
@@ -16388,7 +16397,7 @@ const TelInput = class {
         // end custom styling area
     }
     componentDidLoad() {
-        this.isValid = this.setValidity();
+        this.isValid = this.isValidValue();
         if (this.defaultValue) {
             this.value = this.defaultValue;
             this.valueHandler({ name: this.name, value: this.value, type: 'tel' });
@@ -16412,8 +16421,29 @@ const TelInput = class {
         this.value = { prefix: this.prefixValue, phone: this.phoneValue };
         this.emitValueHandler(true);
     }
-    setValidity() {
-        return this.inputReference.validity.valid;
+    isValidValue() {
+        if (!this.inputReference) {
+            return false;
+        }
+        if (this.validation.mandatory && (!this.phoneValue || this.phoneValue.trim() === '')) {
+            return false;
+        }
+        if (!this.phoneValue || this.phoneValue.trim() === '') {
+            return !this.validation.mandatory;
+        }
+        if (this.validation.minLength && this.phoneValue.length < this.validation.minLength) {
+            return false;
+        }
+        if (this.validation.maxLength && this.phoneValue.length > this.validation.maxLength) {
+            return false;
+        }
+        if (this.validationPattern) {
+            const patternRegex = new RegExp(this.validationPattern);
+            if (!patternRegex.test(this.phoneValue)) {
+                return false;
+            }
+        }
+        return true;
     }
     setPattern() {
         var _a, _b;
@@ -16428,7 +16458,10 @@ const TelInput = class {
             const errorMessage = (_b = this.validation.custom.find(customValidation => customValidation.rule === 'regex')) === null || _b === void 0 ? void 0 : _b.errorMessage;
             return translate$1(`${errorCode}`, this.language) ? translate$1(`${errorCode}`, this.language) : errorMessage;
         }
-        if (this.inputReference.validity.tooShort || this.inputReference.validity.tooLong) {
+        if (this.inputReference.validity.tooShort
+            || this.inputReference.validity.tooLong
+            || (this.validation.minLength && this.phoneValue && this.phoneValue.length < this.validation.minLength)
+            || (this.validation.maxLength && this.phoneValue && this.phoneValue.length > this.validation.maxLength)) {
             return translate$1('lengthError', this.language, { values: { minLength: this.validation.minLength, maxLength: this.validation.maxLength } });
         }
         if (this.inputReference.validity.valueMissing) {
@@ -16447,8 +16480,8 @@ const TelInput = class {
         if (this.touched) {
             invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
         }
-        return index.h("div", { key: '7296f134bff80795ab52a1a27eb059ab2f3c0c87', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, index.h("div", { key: 'c9b1fdf501299398bcda1e59e65bb0a7d6b7de43', class: 'tel__wrapper--flex-label' }, index.h("label", { key: 'e7e6858fc61e2b6ea8974f8b4dc8d67a5fcb07b4', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), index.h("div", { key: '6c9cc9a3c74e8cd06224e2663d4c363e5d8fb3c0', class: 'tel__wrapper--relative' }, this.tooltip &&
-            index.h("img", { key: '17e85d6050d4796bf5b057c901631a87b25d3b40', class: 'tel__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), index.h("div", { key: 'cb2e8b93e5663c92a2fd114d1fe1c9d9e09ebc83', class: `tel__wrapper--flex ${invalidClass}` }, index.h("vaadin-combo-box", { key: 'fb1c3ab06d19e9ed7bbdf7effe8f25a1f7d9fe15', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.disablePhonePrefix, onChange: (e) => this.handlePrefixInput(e) }), index.h("input", { key: 'd2701f0bdca4122c18fd43d311ea8c5e2536b1f5', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: (_a = this.phoneValue) !== null && _a !== void 0 ? _a : '', placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), index.h("small", { key: 'a685ceea5c99f29d992fd5291f67934a22d6997c', class: 'tel__error-message' }, this.errorMessage));
+        return index.h("div", { key: 'f534de21d5597a3e90912eb87fff893511d09920', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, index.h("div", { key: '431fb8cbaea0d2244847823ea4d04d8c73a5341c', class: 'tel__wrapper--flex-label' }, index.h("label", { key: '2eb210b2f0c2e0e632997f59fe7aa667578f72fd', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), index.h("div", { key: '2d912b828f7d9475a1bbb5bac13495779f31198e', class: 'tel__wrapper--relative' }, this.tooltip &&
+            index.h("img", { key: 'ce4433263d27dc9d3fb2caf45069d7a92e9ae3a7', class: 'tel__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), index.h("div", { key: '480cd17eafb4f2ff1e396531429177cb3130eb95', class: `tel__wrapper--flex ${invalidClass}` }, index.h("vaadin-combo-box", { key: '5f2292c8509e5f68786d0f462c689102b1c75dc3', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.disablePhonePrefix, onChange: (e) => this.handlePrefixInput(e) }), index.h("input", { key: '77232e119eed4960f5e1d809507b8585dd112256', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: (_a = this.phoneValue) !== null && _a !== void 0 ? _a : '', placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), index.h("small", { key: '0d925cee41881c8c822073790e26ca7dc4a81049', class: 'tel__error-message' }, this.errorMessage));
     }
     static get watchers() { return {
         "clientStyling": ["handleStylingChange"],

package/dist/collection/components/general-registration/general-registration.js

@@ -8,6 +8,7 @@ export class GeneralRegistration {
     constructor() {
         this.isSelectingAddress = false;
         this.lastPostalCode = null;
+        this.isRestoringAfterError = false;
         this.selectedCountry = '';
         this.listOfInputValues = [];
         this.listOfInputValidity = [];
@@ -134,10 +135,12 @@ export class GeneralRegistration {
                 if (value === 'GB') {
                     this.selectedCountry = 'UK';
                 }
-                this.resetAllAddressFields();
-                window.dispatchEvent(new CustomEvent('countryCodeUpdated', {
-                    detail: { name, value: this.selectedCountry }
-                }));
+                if (!this.isRestoringAfterError) {
+                    this.resetAllAddressFields();
+                    window.dispatchEvent(new CustomEvent('countryCodeUpdated', {
+                        detail: { name, value: this.selectedCountry }
+                    }));
+                }
             }
             if (name === 'PostalCode') {
                 if (!this.listOfInputs.some(i => i.name === 'CountryCode')) {
@@ -207,6 +210,10 @@ export class GeneralRegistration {
         this.isSelectingAddress = false;
     }
     handleCountryCodeUpdateGlobal(event) {
+        // Prevents clearing the fields when restoring after error
+        if (this.isRestoringAfterError) {
+            return;
+        }
         const { name } = event.detail;
         if (name === 'CountryCode') {
             const savedState = localStorage.getItem('registrationStepsState');
@@ -361,6 +368,9 @@ export class GeneralRegistration {
     }
     nextHandler(e) {
         e.preventDefault();
+        // Set flag before emitting values to prevent countryCodeUpdated from clearing fields
+        // This protects against clearing during both submission and error restoration
+        this.isRestoringAfterError = true;
         // Trigger events in subwidgets.
         this.emitValue = true;
         this.errorMessage = '';
@@ -661,6 +671,7 @@ export class GeneralRegistration {
             console.error(err);
         }).finally(() => {
             this.isLoadingPOST = false;
+            this.isRestoringAfterError = false;
         });
     }
     setRegister() {

package/dist/esm/checkbox-group-input_15.entry.js

@@ -14208,6 +14208,7 @@ const GeneralRegistration = class {
         this.validationChange = createEvent(this, "validationChange", 7);
         this.isSelectingAddress = false;
         this.lastPostalCode = null;
+        this.isRestoringAfterError = false;
         this.selectedCountry = '';
         this.listOfInputValues = [];
         this.listOfInputValidity = [];
@@ -14334,10 +14335,12 @@ const GeneralRegistration = class {
                 if (value === 'GB') {
                     this.selectedCountry = 'UK';
                 }
-                this.resetAllAddressFields();
-                window.dispatchEvent(new CustomEvent('countryCodeUpdated', {
-                    detail: { name, value: this.selectedCountry }
-                }));
+                if (!this.isRestoringAfterError) {
+                    this.resetAllAddressFields();
+                    window.dispatchEvent(new CustomEvent('countryCodeUpdated', {
+                        detail: { name, value: this.selectedCountry }
+                    }));
+                }
             }
             if (name === 'PostalCode') {
                 if (!this.listOfInputs.some(i => i.name === 'CountryCode')) {
@@ -14407,6 +14410,10 @@ const GeneralRegistration = class {
         this.isSelectingAddress = false;
     }
     handleCountryCodeUpdateGlobal(event) {
+        // Prevents clearing the fields when restoring after error
+        if (this.isRestoringAfterError) {
+            return;
+        }
         const { name } = event.detail;
         if (name === 'CountryCode') {
             const savedState = localStorage.getItem('registrationStepsState');
@@ -14561,6 +14568,9 @@ const GeneralRegistration = class {
     }
     nextHandler(e) {
         e.preventDefault();
+        // Set flag before emitting values to prevent countryCodeUpdated from clearing fields
+        // This protects against clearing during both submission and error restoration
+        this.isRestoringAfterError = true;
         // Trigger events in subwidgets.
         this.emitValue = true;
         this.errorMessage = '';
@@ -14861,6 +14871,7 @@ const GeneralRegistration = class {
             console.error(err);
         }).finally(() => {
             this.isLoadingPOST = false;
+            this.isRestoringAfterError = false;
         });
     }
     setRegister() {
@@ -16278,17 +16289,15 @@ const TelInput = class {
                 clearTimeout(this.debounceTime);
             }
             this.debounceTime = setTimeout(() => {
-                this.isValid = this.setValidity();
+                this.isValid = this.isValidValue();
                 this.errorMessage = this.setErrorMessage();
                 this.emitValueHandler(true);
             }, 500);
         };
         this.handleBlur = () => {
-            if (!this.touched) {
-                this.isValid = this.setValidity();
-                this.errorMessage = this.setErrorMessage();
-                this.touched = true;
-            }
+            this.touched = true;
+            this.isValid = this.isValidValue();
+            this.errorMessage = this.setErrorMessage();
         };
         this.setClientStyling = () => {
             let sheet = document.createElement('style');
@@ -16384,7 +16393,7 @@ const TelInput = class {
         // end custom styling area
     }
     componentDidLoad() {
-        this.isValid = this.setValidity();
+        this.isValid = this.isValidValue();
         if (this.defaultValue) {
             this.value = this.defaultValue;
             this.valueHandler({ name: this.name, value: this.value, type: 'tel' });
@@ -16408,8 +16417,29 @@ const TelInput = class {
         this.value = { prefix: this.prefixValue, phone: this.phoneValue };
         this.emitValueHandler(true);
     }
-    setValidity() {
-        return this.inputReference.validity.valid;
+    isValidValue() {
+        if (!this.inputReference) {
+            return false;
+        }
+        if (this.validation.mandatory && (!this.phoneValue || this.phoneValue.trim() === '')) {
+            return false;
+        }
+        if (!this.phoneValue || this.phoneValue.trim() === '') {
+            return !this.validation.mandatory;
+        }
+        if (this.validation.minLength && this.phoneValue.length < this.validation.minLength) {
+            return false;
+        }
+        if (this.validation.maxLength && this.phoneValue.length > this.validation.maxLength) {
+            return false;
+        }
+        if (this.validationPattern) {
+            const patternRegex = new RegExp(this.validationPattern);
+            if (!patternRegex.test(this.phoneValue)) {
+                return false;
+            }
+        }
+        return true;
     }
     setPattern() {
         var _a, _b;
@@ -16424,7 +16454,10 @@ const TelInput = class {
             const errorMessage = (_b = this.validation.custom.find(customValidation => customValidation.rule === 'regex')) === null || _b === void 0 ? void 0 : _b.errorMessage;
             return translate$1(`${errorCode}`, this.language) ? translate$1(`${errorCode}`, this.language) : errorMessage;
         }
-        if (this.inputReference.validity.tooShort || this.inputReference.validity.tooLong) {
+        if (this.inputReference.validity.tooShort
+            || this.inputReference.validity.tooLong
+            || (this.validation.minLength && this.phoneValue && this.phoneValue.length < this.validation.minLength)
+            || (this.validation.maxLength && this.phoneValue && this.phoneValue.length > this.validation.maxLength)) {
             return translate$1('lengthError', this.language, { values: { minLength: this.validation.minLength, maxLength: this.validation.maxLength } });
         }
         if (this.inputReference.validity.valueMissing) {
@@ -16443,8 +16476,8 @@ const TelInput = class {
         if (this.touched) {
             invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
         }
-        return h$1("div", { key: '7296f134bff80795ab52a1a27eb059ab2f3c0c87', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h$1("div", { key: 'c9b1fdf501299398bcda1e59e65bb0a7d6b7de43', class: 'tel__wrapper--flex-label' }, h$1("label", { key: 'e7e6858fc61e2b6ea8974f8b4dc8d67a5fcb07b4', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$1("div", { key: '6c9cc9a3c74e8cd06224e2663d4c363e5d8fb3c0', class: 'tel__wrapper--relative' }, this.tooltip &&
-            h$1("img", { key: '17e85d6050d4796bf5b057c901631a87b25d3b40', class: 'tel__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h$1("div", { key: 'cb2e8b93e5663c92a2fd114d1fe1c9d9e09ebc83', class: `tel__wrapper--flex ${invalidClass}` }, h$1("vaadin-combo-box", { key: 'fb1c3ab06d19e9ed7bbdf7effe8f25a1f7d9fe15', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.disablePhonePrefix, onChange: (e) => this.handlePrefixInput(e) }), h$1("input", { key: 'd2701f0bdca4122c18fd43d311ea8c5e2536b1f5', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: (_a = this.phoneValue) !== null && _a !== void 0 ? _a : '', placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), h$1("small", { key: 'a685ceea5c99f29d992fd5291f67934a22d6997c', class: 'tel__error-message' }, this.errorMessage));
+        return h$1("div", { key: 'f534de21d5597a3e90912eb87fff893511d09920', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h$1("div", { key: '431fb8cbaea0d2244847823ea4d04d8c73a5341c', class: 'tel__wrapper--flex-label' }, h$1("label", { key: '2eb210b2f0c2e0e632997f59fe7aa667578f72fd', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$1("div", { key: '2d912b828f7d9475a1bbb5bac13495779f31198e', class: 'tel__wrapper--relative' }, this.tooltip &&
+            h$1("img", { key: 'ce4433263d27dc9d3fb2caf45069d7a92e9ae3a7', class: 'tel__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h$1("div", { key: '480cd17eafb4f2ff1e396531429177cb3130eb95', class: `tel__wrapper--flex ${invalidClass}` }, h$1("vaadin-combo-box", { key: '5f2292c8509e5f68786d0f462c689102b1c75dc3', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.disablePhonePrefix, onChange: (e) => this.handlePrefixInput(e) }), h$1("input", { key: '77232e119eed4960f5e1d809507b8585dd112256', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: (_a = this.phoneValue) !== null && _a !== void 0 ? _a : '', placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), h$1("small", { key: '0d925cee41881c8c822073790e26ca7dc4a81049', class: 'tel__error-message' }, this.errorMessage));
     }
     static get watchers() { return {
         "clientStyling": ["handleStylingChange"],