@everymatrix/general-input 1.10.0 → 1.10.2

package/dist/esm/checkbox-input_9.entry.js

@@ -60,6 +60,7 @@ const CheckboxInput = class {
     this.errorMessage = this.setErrorMessage();
     this.isValid = this.setValidity();
     this.validityStateHandler({ valid: this.isValid, name: this.name });
+    this.emitValueHandler(true);
   }
   setValidity() {
     return this.inputReference.validity.valid;
@@ -87,17 +88,8 @@ const DateInput = class {
     this.sendValidityState = createEvent(this, "sendValidityState", 7);
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
   }
-  checkValidityHandler(newValue) {
-    if (newValue == true) {
-      this.isValid = this.setValidity();
-      this.errorMessage = this.setErrorMessage();
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
-  }
   validityChanged() {
-    if (this.checkValidity == true) {
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
     if (this.emitValue == true) {
       this.valueHandler({ name: this.name, value: this.value });
     }
@@ -117,6 +109,8 @@ const DateInput = class {
     this.value = event.target.value;
     this.errorMessage = this.setErrorMessage();
     this.isValid = this.setValidity();
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
+    this.emitValueHandler(true);
   }
   setValidity() {
     return this.inputReference.validity.valid;
@@ -133,7 +127,6 @@ const DateInput = class {
     return h("div", { class: 'date__wrapper' }, h("input", { id: `${this.name}__input`, type: 'date', class: `date__input`, value: this.defaultValue, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, ref: (el) => this.inputReference = el, required: this.validation.mandatory, max: this.validation.max, min: this.validation.min, onInput: (e) => this.handleInput(e) }), h("label", { class: `date__label ${this.validation.mandatory ? 'date__label--required' : ''}}`, htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), h("small", { class: 'date__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
-    "checkValidity": ["checkValidityHandler"],
     "isValid": ["validityChanged"],
     "emitValue": ["emitValueHandler"]
   }; }
@@ -149,17 +142,8 @@ const EmailInput = class {
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
     this.validationPattern = '';
   }
-  checkValidityHandler(newValue) {
-    if (newValue == true) {
-      this.isValid = this.setValidity();
-      this.errorMessage = this.setErrorMessage();
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
-  }
   validityChanged() {
-    if (this.checkValidity == true) {
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
     if (this.emitValue == true) {
       this.valueHandler({ name: this.name, value: this.value });
     }
@@ -180,13 +164,10 @@ const EmailInput = class {
   }
   handleInput(event) {
     this.value = event.target.value;
-    if (this.debounceTime) {
-      clearTimeout(this.debounceTime);
-    }
-    this.debounceTime = setTimeout(() => {
-      this.errorMessage = this.setErrorMessage();
-      this.isValid = this.setValidity();
-    }, 500);
+    this.errorMessage = this.setErrorMessage();
+    this.isValid = this.setValidity();
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
+    this.emitValueHandler(true);
   }
   setValidity() {
     return this.inputReference.validity.valid;
@@ -212,7 +193,6 @@ const EmailInput = class {
     return h("div", { class: 'email__wrapper' }, h("input", { id: `${this.name}__input`, type: 'email', class: `email__input`, value: this.defaultValue, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, ref: (el) => this.inputReference = el, pattern: this.validationPattern, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, onInput: (e) => this.handleInput(e) }), h("label", { class: `email__label ${this.validation.mandatory ? 'email__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h("small", { class: 'email__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
-    "checkValidity": ["checkValidityHandler"],
     "isValid": ["validityChanged"],
     "emitValue": ["emitValueHandler"]
   }; }
@@ -227,17 +207,8 @@ const NumberInput = class {
     this.sendValidityState = createEvent(this, "sendValidityState", 7);
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
   }
-  checkValidityHandler(newValue) {
-    if (newValue == true) {
-      this.isValid = this.setValidity();
-      this.errorMessage = this.setErrorMessage();
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
-  }
   validityChanged() {
-    if (this.checkValidity == true) {
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
     if (this.emitValue == true) {
       this.valueHandler({ name: this.name, value: this.value });
     }
@@ -255,13 +226,10 @@ const NumberInput = class {
   }
   handleInput(event) {
     this.value = event.target.value;
-    if (this.debounceTime) {
-      clearTimeout(this.debounceTime);
-    }
-    this.debounceTime = setTimeout(() => {
-      this.errorMessage = this.setErrorMessage();
-      this.isValid = this.setValidity();
-    }, 500);
+    this.errorMessage = this.setErrorMessage();
+    this.isValid = this.setValidity();
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
+    this.emitValueHandler(true);
   }
   setValidity() {
     return this.inputReference.validity.valid;
@@ -279,7 +247,6 @@ const NumberInput = class {
     return h("div", { class: 'number__wrapper' }, h("input", { ref: (el) => this.inputReference = el, type: "number", value: this.defaultValue, id: `${this.name}__input`, class: `number__input ${invalidClass}`, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, required: this.validation.mandatory, max: this.validation.max, min: this.validation.min, onInput: (e) => this.handleInput(e) }), h("label", { class: `number__label ${this.validation.mandatory ? 'number__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h("small", { class: 'number__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
-    "checkValidity": ["checkValidityHandler"],
     "isValid": ["validityChanged"],
     "emitValue": ["emitValueHandler"]
   }; }
@@ -320,6 +287,7 @@ const PasswordInput = class {
     this.errorMessage = this.setErrorMessage();
     this.isValid = this.setValidity();
     this.validityStateHandler({ valid: this.isValid, name: this.name });
+    this.emitValueHandler(true);
   }
   setValidity() {
     return this.inputReference.validity.valid;
@@ -360,17 +328,8 @@ const RadioInput = class {
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
     this.sendValidityState = createEvent(this, "sendValidityState", 7);
   }
-  checkValidityHandler(newValue) {
-    if (newValue == true) {
-      this.isValid = this.setValidity();
-      this.errorMessage = this.setErrorMessage();
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
-  }
   validityChanged() {
-    if (this.checkValidity == true) {
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
     if (this.emitValue == true) {
       this.valueHandler({ name: this.name, value: this.value });
     }
@@ -392,6 +351,8 @@ const RadioInput = class {
     this.value = event.target.value;
     this.isValid = this.setValidity();
     this.errorMessage = this.setErrorMessage();
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
+    this.emitValueHandler(true);
   }
   setValidity() {
     return this.inputReference.validity.valid;
@@ -405,7 +366,6 @@ const RadioInput = class {
     return h("fieldset", { class: 'radio__fieldset' }, h("legend", { class: 'radio__legend' }, this.displayName, ":"), this.optionsGroup.map(option => h("div", { class: 'radio__wrapper' }, h("input", { type: "radio", class: 'radio__input', id: `${option.label}__input`, ref: (el) => this.inputReference = el, value: option.value, name: this.name, required: this.validation.mandatory, onClick: (e) => this.handleClick(e) }), h("label", { htmlFor: `${option.label}__input` }, option.label))), h("small", { class: 'radio__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
-    "checkValidity": ["checkValidityHandler"],
     "isValid": ["validityChanged"],
     "emitValue": ["emitValueHandler"]
   }; }
@@ -424,17 +384,8 @@ const SelectInput = class {
      */
     this.options = [];
   }
-  checkValidityHandler(newValue) {
-    if (newValue == true) {
-      this.isValid = this.setValidity();
-      this.errorMessage = this.setErrorMessage();
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
-  }
   validityChanged() {
-    if (this.checkValidity == true) {
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
     if (this.emitValue == true) {
       this.valueHandler({ name: this.name, value: this.value });
     }
@@ -452,10 +403,8 @@ const SelectInput = class {
   }
   connectedCallback() {
     this.displayedOptions = this.options;
-    console.log(this.displayedOptions);
   }
   componentWillLoad() {
-    console.log(this.action, this.options);
     if (this.action && !this.options.length) {
       if (this.action.split(" ")[0] == 'GET') {
         return this.getOptions().then((options) => {
@@ -484,8 +433,9 @@ const SelectInput = class {
     this.value = event.target.value;
     this.errorMessage = this.setErrorMessage();
     this.isValid = this.setValidity();
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
+    this.emitValueHandler(true);
     this.inputReference.previousElementSibling.classList.remove('select__label--hidden');
-    console.log(this.action, this.options);
   }
   setValidity() {
     return this.inputReference.validity.valid;
@@ -502,7 +452,6 @@ const SelectInput = class {
     })), h("small", { class: 'select__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
-    "checkValidity": ["checkValidityHandler"],
     "isValid": ["validityChanged"],
     "emitValue": ["emitValueHandler"]
   }; }
@@ -518,17 +467,8 @@ const TelInput = class {
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
     this.validationPattern = '';
   }
-  checkValidityHandler(newValue) {
-    if (newValue == true) {
-      this.isValid = this.setValidity();
-      this.errorMessage = this.setErrorMessage();
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
-  }
   validityChanged() {
-    if (this.checkValidity == true) {
-      this.validityStateHandler({ valid: this.isValid, name: this.name });
-    }
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
     if (this.emitValue == true) {
       this.valueHandler({ name: this.name, value: this.value });
     }
@@ -549,13 +489,10 @@ const TelInput = class {
   }
   handleInput(event) {
     this.value = event.target.value;
-    if (this.debounceTime) {
-      clearTimeout(this.debounceTime);
-    }
-    this.debounceTime = setTimeout(() => {
-      this.errorMessage = this.setErrorMessage();
-      this.isValid = this.setValidity();
-    }, 500);
+    this.errorMessage = this.setErrorMessage();
+    this.isValid = this.setValidity();
+    this.validityStateHandler({ valid: this.isValid, name: this.name });
+    this.emitValueHandler(true);
   }
   setValidity() {
     return this.inputReference.validity.valid;
@@ -582,7 +519,6 @@ const TelInput = class {
     return h("div", { class: 'tel__wrapper' }, h("input", { type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, value: this.defaultValue, class: `tel__input ${invalidClass}`, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: (e) => this.handleInput(e) }), h("label", { class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h("small", { class: 'tel__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
-    "checkValidity": ["checkValidityHandler"],
     "isValid": ["validityChanged"],
     "emitValue": ["emitValueHandler"]
   }; }
@@ -631,6 +567,7 @@ const TextInput = class {
     this.isValid = this.setValidity();
     this.errorMessage = this.setErrorMessage();
     this.validityStateHandler({ valid: this.isValid, name: this.name });
+    this.emitValueHandler(true);
   }
   setValidity() {
     return this.inputReference.validity.valid;

package/dist/esm/general-input.js

@@ -13,5 +13,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return bootstrapLazy([["checkbox-input_9",[[1,"checkbox-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"date-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"email-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"checkValidity":[4,"check-validity"],"errorMessage":[32],"isValid":[32]}],[1,"number-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[2,"default-value"],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"password-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"radio-input",{"name":[1],"displayName":[1,"display-name"],"optionsGroup":[16],"validation":[16],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"select-input",{"name":[1],"displayName":[1,"display-name"],"action":[1],"options":[16],"validation":[16],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"tel-input",{"name":[1],"displayName":[1,"display-name"],"showLabels":[4,"show-labels"],"action":[1],"validation":[16],"defaultValue":[8,"default-value"],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"text-input",{"name":[1025],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1025,"default-value"],"rules":[1],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}]]],["general-input",[[1,"general-input",{"type":[1],"name":[1],"displayName":[1,"display-name"],"action":[1],"validation":[16],"options":[8],"language":[1],"defaultValue":[8,"default-value"],"emitValue":[4,"emit-value"]}]]]], options);
+  return bootstrapLazy([["checkbox-input_9",[[1,"checkbox-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"date-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"email-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"number-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[2,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"password-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"radio-input",{"name":[1],"displayName":[1,"display-name"],"optionsGroup":[16],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"select-input",{"name":[1],"displayName":[1,"display-name"],"action":[1],"options":[16],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"tel-input",{"name":[1],"displayName":[1,"display-name"],"showLabels":[4,"show-labels"],"action":[1],"validation":[16],"defaultValue":[8,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"text-input",{"name":[1025],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1025,"default-value"],"rules":[1],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}]]],["general-input",[[1,"general-input",{"type":[1],"name":[1],"displayName":[1,"display-name"],"action":[1],"validation":[16],"options":[8],"language":[1],"defaultValue":[8,"default-value"],"emitValue":[4,"emit-value"]}]]]], options);
 });

package/dist/esm/loader.js

@@ -10,7 +10,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return bootstrapLazy([["checkbox-input_9",[[1,"checkbox-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"date-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"email-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"checkValidity":[4,"check-validity"],"errorMessage":[32],"isValid":[32]}],[1,"number-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[2,"default-value"],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"password-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"radio-input",{"name":[1],"displayName":[1,"display-name"],"optionsGroup":[16],"validation":[16],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"select-input",{"name":[1],"displayName":[1,"display-name"],"action":[1],"options":[16],"validation":[16],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"tel-input",{"name":[1],"displayName":[1,"display-name"],"showLabels":[4,"show-labels"],"action":[1],"validation":[16],"defaultValue":[8,"default-value"],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"text-input",{"name":[1025],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1025,"default-value"],"rules":[1],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}]]],["general-input",[[1,"general-input",{"type":[1],"name":[1],"displayName":[1,"display-name"],"action":[1],"validation":[16],"options":[8],"language":[1],"defaultValue":[8,"default-value"],"emitValue":[4,"emit-value"]}]]]], options);
+  return bootstrapLazy([["checkbox-input_9",[[1,"checkbox-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"date-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"email-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"number-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[2,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"password-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"radio-input",{"name":[1],"displayName":[1,"display-name"],"optionsGroup":[16],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"select-input",{"name":[1],"displayName":[1,"display-name"],"action":[1],"options":[16],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"tel-input",{"name":[1],"displayName":[1,"display-name"],"showLabels":[4,"show-labels"],"action":[1],"validation":[16],"defaultValue":[8,"default-value"],"language":[1],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"text-input",{"name":[1025],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1025,"default-value"],"rules":[1],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}]]],["general-input",[[1,"general-input",{"type":[1],"name":[1],"displayName":[1,"display-name"],"action":[1],"validation":[16],"options":[8],"language":[1],"defaultValue":[8,"default-value"],"emitValue":[4,"emit-value"]}]]]], options);
   });
 };
 

package/dist/general-input/general-input.esm.js

@@ -1 +1 @@
-import{p as a,b as e}from"./p-d9f7fa2e.js";(()=>{const e=import.meta.url,i={};return""!==e&&(i.resourcesUrl=new URL(".",e).href),a(i)})().then((a=>e([["p-c9e79656",[[1,"checkbox-input",{name:[1],displayName:[1,"display-name"],validation:[16],language:[1],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"date-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],language:[1],checkValidity:[4,"check-validity"],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"email-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],language:[1],emitValue:[4,"emit-value"],checkValidity:[4,"check-validity"],errorMessage:[32],isValid:[32]}],[1,"number-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[2,"default-value"],language:[1],checkValidity:[4,"check-validity"],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"password-input",{name:[1],displayName:[1,"display-name"],validation:[16],language:[1],emitValue:[4,"emit-value"],isValid:[32],errorMessage:[32]}],[1,"radio-input",{name:[1],displayName:[1,"display-name"],optionsGroup:[16],validation:[16],language:[1],checkValidity:[4,"check-validity"],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"select-input",{name:[1],displayName:[1,"display-name"],action:[1],options:[16],validation:[16],language:[1],checkValidity:[4,"check-validity"],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"tel-input",{name:[1],displayName:[1,"display-name"],showLabels:[4,"show-labels"],action:[1],validation:[16],defaultValue:[8,"default-value"],language:[1],checkValidity:[4,"check-validity"],emitValue:[4,"emit-value"],isValid:[32],errorMessage:[32]}],[1,"text-input",{name:[1025],displayName:[1,"display-name"],validation:[16],defaultValue:[1025,"default-value"],rules:[1],language:[1],checkValidity:[4,"check-validity"],emitValue:[4,"emit-value"],isValid:[32],errorMessage:[32]}]]],["p-dea0a4ac",[[1,"general-input",{type:[1],name:[1],displayName:[1,"display-name"],action:[1],validation:[16],options:[8],language:[1],defaultValue:[8,"default-value"],emitValue:[4,"emit-value"]}]]]],a)));
+import{p as a,b as e}from"./p-d9f7fa2e.js";(()=>{const e=import.meta.url,l={};return""!==e&&(l.resourcesUrl=new URL(".",e).href),a(l)})().then((a=>e([["p-1703fce3",[[1,"checkbox-input",{name:[1],displayName:[1,"display-name"],validation:[16],language:[1],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"date-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],language:[1],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"email-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],language:[1],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"number-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[2,"default-value"],language:[1],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"password-input",{name:[1],displayName:[1,"display-name"],validation:[16],language:[1],emitValue:[4,"emit-value"],isValid:[32],errorMessage:[32]}],[1,"radio-input",{name:[1],displayName:[1,"display-name"],optionsGroup:[16],validation:[16],language:[1],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"select-input",{name:[1],displayName:[1,"display-name"],action:[1],options:[16],validation:[16],language:[1],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"tel-input",{name:[1],displayName:[1,"display-name"],showLabels:[4,"show-labels"],action:[1],validation:[16],defaultValue:[8,"default-value"],language:[1],emitValue:[4,"emit-value"],isValid:[32],errorMessage:[32]}],[1,"text-input",{name:[1025],displayName:[1,"display-name"],validation:[16],defaultValue:[1025,"default-value"],rules:[1],language:[1],checkValidity:[4,"check-validity"],emitValue:[4,"emit-value"],isValid:[32],errorMessage:[32]}]]],["p-dea0a4ac",[[1,"general-input",{type:[1],name:[1],displayName:[1,"display-name"],action:[1],validation:[16],options:[8],language:[1],defaultValue:[8,"default-value"],emitValue:[4,"emit-value"]}]]]],a)));

package/dist/general-input/p-1703fce3.entry.js

@@ -0,0 +1 @@
+import{r as t,c as i,h as e}from"./p-d9f7fa2e.js";const s=["ro","en"],r={en:{dateError:"The selected date should be between {min} and {max}",numberLengthError:"The number should be between ${min} and ${max}",lengthError:"The length should be between {minLength} and {maxLength}",requiredError:"This input is required.",nextButton:"Next",backButton:"Back"},ro:{lengthError:"Cuvântul introdus este prea scurt. {minLength} and {maxLength}",requiredError:"Acest câmp este obligatoriu."}},a=(t,i,e)=>{const a=i;let l=r[void 0!==a&&s.includes(a)?a:"en"][t];if(void 0!==e)for(const[t,i]of Object.entries(e.values)){const e=new RegExp(`{${t}}`,"g");l=l.replace(e,i)}return l},l=class{constructor(e){t(this,e),this.sendValidityState=i(this,"sendValidityState",7),this.sendInputValue=i(this,"sendInputValue",7)}validityChanged(){this.validityStateHandler({valid:this.isValid,name:this.name}),1==this.emitValue&&this.valueHandler({name:this.name,value:this.value})}validityStateHandler(t){this.sendValidityState.emit(t)}emitValueHandler(t){1==t&&this.isValid&&this.valueHandler({name:this.name,value:this.value})}valueHandler(t){this.sendInputValue.emit(t)}connectedCallback(){}handleClick(){this.value=this.inputReference.checked,this.errorMessage=this.setErrorMessage(),this.isValid=this.setValidity(),this.validityStateHandler({valid:this.isValid,name:this.name}),this.emitValueHandler(!0)}setValidity(){return this.inputReference.validity.valid}setErrorMessage(){if(this.inputReference.validity.valueMissing)return a("requiredError",this.language)}render(){return e("div",{class:"checkbox__wrapper"},e("input",{type:"checkbox",id:`${this.name}__input`,ref:t=>this.inputReference=t,name:this.name,required:this.validation.mandatory,value:"jdjdj",onClick:()=>this.handleClick()}),e("label",{htmlFor:`${this.name}__input`},this.displayName," ",this.validation.mandatory?"*":""),e("small",{class:"checkbox__error-message"},this.errorMessage))}static get watchers(){return{isValid:["validityChanged"],emitValue:["emitValueHandler"]}}};l.style="*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.checkbox__wrapper{display:flex;gap:10px;position:relative;align-items:baseline}.checkbox__error-message{position:absolute;top:calc(100% + 5px);left:0;color:red}";const n=class{constructor(e){t(this,e),this.sendValidityState=i(this,"sendValidityState",7),this.sendInputValue=i(this,"sendInputValue",7)}validityChanged(){this.validityStateHandler({valid:this.isValid,name:this.name}),1==this.emitValue&&this.valueHandler({name:this.name,value:this.value})}validityStateHandler(t){this.sendValidityState.emit(t)}emitValueHandler(t){1==t&&this.isValid&&this.valueHandler({name:this.name,value:this.value})}valueHandler(t){this.sendInputValue.emit(t)}handleInput(t){this.value=t.target.value,this.errorMessage=this.setErrorMessage(),this.isValid=this.setValidity(),this.validityStateHandler({valid:this.isValid,name:this.name}),this.emitValueHandler(!0)}setValidity(){return this.inputReference.validity.valid}setErrorMessage(){return this.inputReference.validity.rangeUnderflow||this.inputReference.validity.rangeOverflow?a("dateError",this.language,{values:{min:this.validation.min,max:this.validation.max}}):this.inputReference.validity.valueMissing?a("requiredError",this.language):void 0}render(){return e("div",{class:"date__wrapper"},e("input",{id:`${this.name}__input`,type:"date",class:"date__input",value:this.defaultValue,placeholder:`${this.displayName} ${this.validation.mandatory?"*":""}`,ref:t=>this.inputReference=t,required:this.validation.mandatory,max:this.validation.max,min:this.validation.min,onInput:t=>this.handleInput(t)}),e("label",{class:`date__label ${this.validation.mandatory?"date__label--required":""}}`,htmlFor:`${this.name}__input`},this.displayName," ",this.validation.mandatory?"*":""),e("small",{class:"date__error-message"},this.errorMessage))}static get watchers(){return{isValid:["validityChanged"],emitValue:["emitValueHandler"]}}};n.style='*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.date__wrapper{position:relative;display:flex;flex-direction:column-reverse;padding-top:10px}.date__label{color:#474747;font-size:16px;position:absolute;bottom:15px;left:5px;transform:translateY(-25px);transition:all 0.3s cubic-bezier(0.5, 0, 0.5, 1)}.date__label--required::after{content:"*";margin-left:5px;color:#666666}.date__input{width:inherit;padding:15px 6px;position:relative;border:none;border-bottom:3px solid #666666;background-color:transparent;color:#666666;font-size:16px;font-family:inherit}.date__input:focus{outline:none;box-shadow:0 5px 5px rgba(16, 15, 15, 0.1)}.date__input::placeholder{color:#666666}.date__input--invalid{border-bottom:3px solid #cc0000}.date__input:placeholder-shown+.date__label{opacity:0;visibility:hidden;transform:translateY(0)}.date__error-message{position:absolute;top:calc(100% + 5px);left:0;color:#cc0000}';const o=class{constructor(e){t(this,e),this.sendValidityState=i(this,"sendValidityState",7),this.sendInputValue=i(this,"sendInputValue",7),this.validationPattern=""}validityChanged(){this.validityStateHandler({valid:this.isValid,name:this.name}),1==this.emitValue&&this.valueHandler({name:this.name,value:this.value})}validityStateHandler(t){this.sendValidityState.emit(t)}emitValueHandler(t){1==t&&this.isValid&&this.valueHandler({name:this.name,value:this.value})}valueHandler(t){this.sendInputValue.emit(t)}connectedCallback(){this.validationPattern=this.setPattern()}handleInput(t){this.value=t.target.value,this.errorMessage=this.setErrorMessage(),this.isValid=this.setValidity(),this.validityStateHandler({valid:this.isValid,name:this.name}),this.emitValueHandler(!0)}setValidity(){return this.inputReference.validity.valid}setPattern(){var t;if((null===(t=this.validation.custom)||void 0===t?void 0:t.length)>0)return this.validation.custom.find((t=>"regex"===t.rule)).pattern}setErrorMessage(){return this.inputReference.validity.patternMismatch?this.validation.custom.find((t=>"regex"===t.rule)).errorMessage:this.inputReference.validity.tooShort||this.inputReference.validity.tooLong?a("lengthError",this.language,{values:{minLength:this.validation.minLength,maxLength:this.validation.maxLength}}):this.inputReference.validity.valueMissing?a("requiredError",this.language):void 0}render(){return e("div",{class:"email__wrapper"},e("input",{id:`${this.name}__input`,type:"email",class:"email__input",value:this.defaultValue,placeholder:`${this.displayName} ${this.validation.mandatory?"*":""}`,ref:t=>this.inputReference=t,pattern:this.validationPattern,required:this.validation.mandatory,minlength:this.validation.minLength,maxlength:this.validation.maxLength,onInput:t=>this.handleInput(t)}),e("label",{class:"email__label "+(this.validation.mandatory?"email__label--required":""),htmlFor:`${this.name}__input`},this.displayName),e("small",{class:"email__error-message"},this.errorMessage))}static get watchers(){return{isValid:["validityChanged"],emitValue:["emitValueHandler"]}}};o.style='*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.email__wrapper{position:relative;display:flex;flex-direction:column-reverse;padding-top:10px}.email__label{color:#474747;font-size:16px;position:absolute;bottom:15px;left:5px;transform:translateY(-25px);transition:all 0.3s cubic-bezier(0.5, 0, 0.5, 1)}.email__label--required::after{content:"*";margin-left:5px;color:#666666}.email__input{width:inherit;padding:15px 6px;position:relative;border:none;border-bottom:3px solid #666666;background-color:transparent;color:#666666;font-size:16px;font-family:inherit}.email__input:focus{outline:none;box-shadow:0 5px 5px rgba(16, 15, 15, 0.1)}.email__input::placeholder{color:#666666}.email__input--invalid{border-bottom:3px solid #cc0000}.email__input:placeholder-shown+.email__label{opacity:0;visibility:hidden;transform:translateY(0)}.email__error-message{position:absolute;top:calc(100% + 5px);left:0;color:#cc0000}';const h=class{constructor(e){t(this,e),this.sendValidityState=i(this,"sendValidityState",7),this.sendInputValue=i(this,"sendInputValue",7)}validityChanged(){this.validityStateHandler({valid:this.isValid,name:this.name}),1==this.emitValue&&this.valueHandler({name:this.name,value:this.value})}validityStateHandler(t){this.sendValidityState.emit(t)}emitValueHandler(t){1==t&&this.isValid&&this.valueHandler({name:this.name,value:this.value})}valueHandler(t){this.sendInputValue.emit(t)}handleInput(t){this.value=t.target.value,this.errorMessage=this.setErrorMessage(),this.isValid=this.setValidity(),this.validityStateHandler({valid:this.isValid,name:this.name}),this.emitValueHandler(!0)}setValidity(){return this.inputReference.validity.valid}setErrorMessage(){return this.inputReference.validity.rangeUnderflow||this.inputReference.validity.rangeOverflow?a("numberLengthError",this.language,{values:{min:this.validation.min,max:this.validation.max}}):this.inputReference.validity.valueMissing?a("requiredError",this.language):void 0}render(){return e("div",{class:"number__wrapper"},e("input",{ref:t=>this.inputReference=t,type:"number",value:this.defaultValue,id:`${this.name}__input`,class:"number__input "+(1==this.isValid||null==this.isValid?"":"number__input--invalid"),placeholder:`${this.displayName} ${this.validation.mandatory?"*":""}`,required:this.validation.mandatory,max:this.validation.max,min:this.validation.min,onInput:t=>this.handleInput(t)}),e("label",{class:"number__label "+(this.validation.mandatory?"number__label--required":""),htmlFor:`${this.name}__input`},this.displayName),e("small",{class:"number__error-message"},this.errorMessage))}static get watchers(){return{isValid:["validityChanged"],emitValue:["emitValueHandler"]}}};h.style='*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.number__wrapper{position:relative;display:flex;flex-direction:column-reverse;padding-top:10px}.number__label{color:#474747;font-size:16px;position:absolute;bottom:15px;left:5px;transform:translateY(-25px);transition:all 0.3s cubic-bezier(0.5, 0, 0.5, 1)}.number__label--required::after{content:"*";margin-left:5px;color:#666666}.number__input{width:inherit;padding:15px 6px;position:relative;border:none;border-bottom:3px solid #666666;background-color:transparent;color:#666666;font-size:16px;font-family:inherit;-moz-appearance:textfield;}.number__input::-webkit-outer-spin-button,.number__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.number__input:focus{outline:none;box-shadow:0 5px 5px rgba(16, 15, 15, 0.1)}.number__input::placeholder{color:#666666}.number__input--invalid{border-bottom:3px solid #cc0000}.number__input:placeholder-shown+.number__label{opacity:0;visibility:hidden;transform:translateY(0)}.number__error-message{position:absolute;top:calc(100% + 5px);left:0;color:#cc0000}';const d=class{constructor(e){t(this,e),this.sendValidityState=i(this,"sendValidityState",7),this.sendInputValue=i(this,"sendInputValue",7),this.validationPattern=""}validityChanged(){this.validityStateHandler({valid:this.isValid,name:this.name}),1==this.emitValue&&this.valueHandler({name:this.name,value:this.value})}validityStateHandler(t){this.sendValidityState.emit(t)}emitValueHandler(t){1==t&&this.isValid&&this.valueHandler({name:this.name,value:this.value})}valueHandler(t){this.sendInputValue.emit(t)}connectedCallback(){this.validationPattern=this.setPattern()}handleInput(t){this.value=t.target.value,this.errorMessage=this.setErrorMessage(),this.isValid=this.setValidity(),this.validityStateHandler({valid:this.isValid,name:this.name}),this.emitValueHandler(!0)}setValidity(){return this.inputReference.validity.valid}setPattern(){var t;if((null===(t=this.validation.custom)||void 0===t?void 0:t.length)>0)return this.validation.custom.find((t=>"regex"===t.rule)).pattern}setErrorMessage(){return this.inputReference.validity.patternMismatch?this.validation.custom.find((t=>"regex"===t.rule)).errorMessage:this.inputReference.validity.tooShort||this.inputReference.validity.tooLong?a("lengthError",this.language,{values:{minLength:this.validation.minLength,maxLength:this.validation.maxLength}}):this.inputReference.validity.valueMissing?a("requiredError",this.language):void 0}render(){return e("div",{class:"password__wrapper"},e("input",{type:"password",id:`${this.name}__input`,class:"password__input "+(1==this.isValid||null==this.isValid?"":"password__input--invalid"),name:this.name,ref:t=>this.inputReference=t,required:this.validation.mandatory,maxlength:this.validation.maxLength,minlength:this.validation.minLength,pattern:this.validationPattern,placeholder:`${this.displayName} ${this.validation.mandatory?"*":""}`,onBlur:t=>this.handleInput(t)}),e("label",{class:"password__label "+(this.validation.mandatory?"password__label--required":""),htmlFor:`${this.name}__input`},this.displayName),e("small",{class:"password__error-message"},this.errorMessage))}static get watchers(){return{isValid:["validityChanged"],emitValue:["emitValueHandler"]}}};d.style='*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.password__wrapper{position:relative;display:flex;flex-direction:column-reverse;padding-top:10px}.password__label{color:#474747;font-size:16px;position:absolute;bottom:15px;left:5px;transform:translateY(-25px);transition:all 0.3s cubic-bezier(0.5, 0, 0.5, 1)}.password__label--required::after{content:"*";margin-left:5px;color:#666666}.password__input{width:inherit;padding:15px 6px;position:relative;border:none;border-bottom:3px solid #666666;background-color:transparent;color:#666666;font-size:16px;font-family:inherit}.password__input:focus{outline:none;box-shadow:0 5px 5px rgba(16, 15, 15, 0.1)}.password__input::placeholder{color:#666666}.password__input--invalid{border-bottom:3px solid #cc0000}.password__input:placeholder-shown+.password__label{opacity:0;visibility:hidden;transform:translateY(0)}.password__error-message{position:absolute;top:calc(100% + 5px);left:0;color:#cc0000}';const p=class{constructor(e){t(this,e),this.sendInputValue=i(this,"sendInputValue",7),this.sendValidityState=i(this,"sendValidityState",7)}validityChanged(){this.validityStateHandler({valid:this.isValid,name:this.name}),1==this.emitValue&&this.valueHandler({name:this.name,value:this.value})}emitValueHandler(t){1==t&&this.isValid&&this.valueHandler({name:this.name,value:this.value})}valueHandler(t){this.sendInputValue.emit(t)}validityStateHandler(t){this.sendValidityState.emit(t)}connectedCallback(){}handleClick(t){this.value=t.target.value,this.isValid=this.setValidity(),this.errorMessage=this.setErrorMessage(),this.validityStateHandler({valid:this.isValid,name:this.name}),this.emitValueHandler(!0)}setValidity(){return this.inputReference.validity.valid}setErrorMessage(){if(this.inputReference.validity.valueMissing)return a("requiredError",this.language)}render(){return e("fieldset",{class:"radio__fieldset"},e("legend",{class:"radio__legend"},this.displayName,":"),this.optionsGroup.map((t=>e("div",{class:"radio__wrapper"},e("input",{type:"radio",class:"radio__input",id:`${t.label}__input`,ref:t=>this.inputReference=t,value:t.value,name:this.name,required:this.validation.mandatory,onClick:t=>this.handleClick(t)}),e("label",{htmlFor:`${t.label}__input`},t.label)))),e("small",{class:"radio__error-message"},this.errorMessage))}static get watchers(){return{isValid:["validityChanged"],emitValue:["emitValueHandler"]}}};p.style="*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.radio__fieldset{border:none;position:relative}.radio__wrapper{display:flex;gap:5px}.radio__error-message{position:absolute;top:calc(100% + 5px);left:0;color:red}";const u=class{constructor(e){t(this,e),this.sendValidityState=i(this,"sendValidityState",7),this.sendInputValue=i(this,"sendInputValue",7),this.options=[]}validityChanged(){this.validityStateHandler({valid:this.isValid,name:this.name}),1==this.emitValue&&this.valueHandler({name:this.name,value:this.value})}validityStateHandler(t){this.sendValidityState.emit(t)}emitValueHandler(t){1==t&&this.isValid&&this.valueHandler({name:this.name,value:this.value})}valueHandler(t){this.sendInputValue.emit(t)}connectedCallback(){this.displayedOptions=this.options}componentWillLoad(){if(this.action&&!this.options.length&&"GET"==this.action.split(" ")[0])return this.getOptions().then((t=>{this.displayedOptions=t.countries.map((t=>({label:t.Name,value:t.Alpha2Code})))}))}getOptions(){const t=new URL("https://demo-api.stage.norway.everymatrix.com/v1/player/countries");return new Promise(((i,e)=>{fetch(t.href).then((t=>t.json())).then((t=>{i(t)})).catch((t=>{console.error(t),e(t)}))}))}handleChange(t){this.value=t.target.value,this.errorMessage=this.setErrorMessage(),this.isValid=this.setValidity(),this.validityStateHandler({valid:this.isValid,name:this.name}),this.emitValueHandler(!0),this.inputReference.previousElementSibling.classList.remove("select__label--hidden")}setValidity(){return this.inputReference.validity.valid}setErrorMessage(){if(this.inputReference.validity.valueMissing)return a("requiredError",this.language)}render(){return console.log("RENDER"),e("div",{class:"select__wrapper"},e("label",{class:"select__label select__label--hidden",htmlFor:`${this.name}__input`},this.displayName,":"),e("select",{ref:t=>this.inputReference=t,name:this.name,id:`${this.name}__input`,required:this.validation.mandatory,class:"select__input",onChange:t=>this.handleChange(t)},e("option",{value:"",selected:!0,disabled:!0}," ",this.displayName," "),this.displayedOptions.map((t=>e("option",{value:t.value}," ",t.label," ")))),e("small",{class:"select__error-message"},this.errorMessage))}static get watchers(){return{isValid:["validityChanged"],emitValue:["emitValueHandler"]}}};u.style="*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.select__wrapper{position:relative;display:flex;padding-top:10px;width:100%}.select__label{color:#474747;font-size:16px;position:absolute;bottom:15px;left:5px;transform:translateY(-25px);transition:all 0.3s cubic-bezier(0.5, 0, 0.5, 1)}.select__label--hidden{opacity:0;visibility:hidden;transform:translateY(0)}.select__input{width:inherit;padding:15px 6px;position:relative;border:none;border-bottom:3px solid #666666;background-color:transparent;color:#666666;font-size:16px;font-family:inherit}.select__input:focus{outline:none;box-shadow:0 5px 5px rgba(16, 15, 15, 0.1)}.select__error-message{position:absolute;top:calc(100% + 5px);left:0;color:#cc0000}";const c=class{constructor(e){t(this,e),this.sendValidityState=i(this,"sendValidityState",7),this.sendInputValue=i(this,"sendInputValue",7),this.validationPattern=""}validityChanged(){this.validityStateHandler({valid:this.isValid,name:this.name}),1==this.emitValue&&this.valueHandler({name:this.name,value:this.value})}validityStateHandler(t){this.sendValidityState.emit(t)}emitValueHandler(t){1==t&&this.isValid&&this.valueHandler({name:this.name,value:this.value})}valueHandler(t){this.sendInputValue.emit(t)}connectedCallback(){this.validationPattern=this.setPattern()}handleInput(t){this.value=t.target.value,this.errorMessage=this.setErrorMessage(),this.isValid=this.setValidity(),this.validityStateHandler({valid:this.isValid,name:this.name}),this.emitValueHandler(!0)}setValidity(){return this.inputReference.validity.valid}setPattern(){var t;if((null===(t=this.validation.custom)||void 0===t?void 0:t.length)>0)return this.validation.custom.find((t=>"regex"===t.rule)).pattern}setErrorMessage(){return this.inputReference.validity.patternMismatch?this.validation.custom.find((t=>"regex"===t.rule)).errorMessage:this.inputReference.validity.tooShort||this.inputReference.validity.tooLong?a("lengthError",this.language,{values:{minLength:this.validation.minLength,maxLength:this.validation.maxLength}}):this.inputReference.validity.valueMissing?a("requiredError",this.language):void 0}render(){return e("div",{class:"tel__wrapper"},e("input",{type:"tel",ref:t=>this.inputReference=t,id:`${this.name}__input`,value:this.defaultValue,class:"tel__input "+(1==this.isValid||null==this.isValid?"":"tel__input--invalid"),placeholder:`${this.displayName} ${this.validation.mandatory?"*":""}`,required:this.validation.mandatory,minlength:this.validation.minLength,maxlength:this.validation.maxLength,pattern:this.validationPattern,onInput:t=>this.handleInput(t)}),e("label",{class:"tel__label "+(this.validation.mandatory?"tel__label--required":""),htmlFor:`${this.name}__input`},this.displayName),e("small",{class:"tel__error-message"},this.errorMessage))}static get watchers(){return{isValid:["validityChanged"],emitValue:["emitValueHandler"]}}};c.style='*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.tel__wrapper{position:relative;display:flex;flex-direction:column-reverse;padding-top:10px}.tel__label{color:#474747;font-size:16px;position:absolute;bottom:15px;left:5px;transform:translateY(-25px);transition:all 0.3s cubic-bezier(0.5, 0, 0.5, 1)}.tel__label--required::after{content:"*";margin-left:5px;color:#666666}.tel__input{width:inherit;padding:15px 6px;position:relative;border:none;border-bottom:3px solid #666666;background-color:transparent;color:#666666;font-size:16px;font-family:inherit;-moz-appearance:textfield;}.tel__input::-webkit-outer-spin-button,.tel__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.tel__input:focus{outline:none;box-shadow:0 5px 5px rgba(16, 15, 15, 0.1)}.tel__input::placeholder{color:#666666}.tel__input--invalid{border-bottom:3px solid #cc0000}.tel__input:placeholder-shown+.tel__label{opacity:0;visibility:hidden;transform:translateY(0)}.tel__error-message{position:absolute;top:calc(100% + 5px);left:0;color:#cc0000}';const _=class{constructor(e){t(this,e),this.sendValidityState=i(this,"sendValidityState",7),this.sendInputValue=i(this,"sendInputValue",7),this.defaultValue="",this.errorMessage="",this.value="",this.customRules=[],this.validationPattern=""}validityChanged(){1==this.emitValue&&this.valueHandler({name:this.name,value:this.value})}validityStateHandler(t){this.sendValidityState.emit(t)}emitValueHandler(t){1==t&&this.isValid&&this.valueHandler({name:this.name,value:this.value})}valueHandler(t){this.sendInputValue.emit(t)}connectedCallback(){this.customRules=this.setCustomRules(),this.validationPattern=this.setPattern()}handleInput(t){this.value=t.target.value,this.isValid=this.setValidity(),this.errorMessage=this.setErrorMessage(),this.validityStateHandler({valid:this.isValid,name:this.name}),this.emitValueHandler(!0)}setValidity(){return this.inputReference.validity.valid}setCustomRules(){var t;if((null===(t=this.validation.custom)||void 0===t?void 0:t.length)>0)return this.validation.custom.filter((t=>"regex"!==t.rule))}setPattern(){var t;if((null===(t=this.validation.custom)||void 0===t?void 0:t.length)>0)return this.validation.custom.find((t=>"regex"===t.rule)).pattern}setErrorMessage(){return this.inputReference.validity.patternMismatch?this.validation.custom.find((t=>"regex"===t.rule)).errorMessage:this.inputReference.validity.tooShort||this.inputReference.validity.tooLong?a("lengthError",this.language,{values:{minLength:this.validation.minLength,maxLength:this.validation.maxLength}}):this.inputReference.validity.valueMissing?a("requiredError",this.language):void 0}render(){const t=1==this.isValid||null==this.isValid?"":"text__input--invalid";return console.log("this",this.name,this.defaultValue,this.displayName),e("div",{class:"text__wrapper"},e("input",{id:`${this.name}__input`,value:this.defaultValue,type:"text",class:`text__input ${t}`,placeholder:`${this.displayName} ${this.validation.mandatory?"*":""}`,ref:t=>this.inputReference=t,pattern:this.validationPattern,required:this.validation.mandatory,minlength:this.validation.minLength,maxlength:this.validation.maxLength,onBlur:t=>{this.handleInput(t)}}),e("label",{class:"text__label  "+(this.validation.mandatory?"text__label--required":""),htmlFor:`${this.name}__input`},this.displayName),e("small",{class:"text__error-message"},this.errorMessage))}static get watchers(){return{isValid:["validityChanged"],emitValue:["emitValueHandler"]}}};_.style='*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.text__wrapper{position:relative;display:flex;flex-direction:column-reverse;padding-top:10px}.text__label{color:#474747;font-size:16px;position:absolute;bottom:15px;left:5px;transform:translateY(-25px);transition:all 0.3s cubic-bezier(0.5, 0, 0.5, 1)}.text__label--required::after{content:"*";margin-left:5px;color:#666666}.text__input{width:inherit;padding:15px 6px;position:relative;border:none;border-bottom:3px solid #666666;background-color:transparent;color:#666666;font-size:16px;font-family:inherit}.text__input:focus{outline:none;box-shadow:0 5px 5px rgba(16, 15, 15, 0.1)}.text__input::placeholder{color:#666666}.text__input--invalid{border-bottom:3px solid #cc0000}.text__input:placeholder-shown+.text__label{opacity:0;visibility:hidden;transform:translateY(0)}.text__error-message{position:absolute;top:calc(100% + 5px);left:0;color:#cc0000}';export{l as checkbox_input,n as date_input,o as email_input,h as number_input,d as password_input,p as radio_input,u as select_input,c as tel_input,_ as text_input}

package/dist/types/components/date-input/date-input.d.ts

@@ -21,10 +21,6 @@ export declare class DateInput {
    * Currently selected language.
    */
   language: string;
-  /**
-   * State passed down from the parent element. Will trigger the input to check for validity.
-   */
-  checkValidity: boolean;
   /**
    * State passed down from the parent element. Will trigger the input to send it's value through an event.
    */
@@ -33,7 +29,6 @@ export declare class DateInput {
   isValid: boolean;
   inputReference: HTMLInputElement;
   value: string;
-  checkValidityHandler(newValue: boolean): void;
   validityChanged(): void;
   sendValidityState: EventEmitter<InputStateEvent>;
   validityStateHandler(inputStateEvent: InputStateEvent): void;

package/dist/types/components/email-input/email-input.d.ts

@@ -25,17 +25,12 @@ export declare class EmailInput {
    * State passed down from the parent element. Will trigger the input to send it's value through an event.
    */
   emitValue: boolean;
-  /**
-   * State passed down from the parent element. Will trigger the input to check for validity.
-   */
-  checkValidity: boolean;
   errorMessage: string;
   isValid: boolean;
   value: string;
   inputReference: HTMLInputElement;
   debounceTime: ReturnType<typeof setTimeout>;
   validationPattern: string;
-  checkValidityHandler(newValue: boolean): void;
   validityChanged(): void;
   sendValidityState: EventEmitter<InputStateEvent>;
   validityStateHandler(inputStateEvent: InputStateEvent): void;

package/dist/types/components/number-input/number-input.d.ts

@@ -21,10 +21,6 @@ export declare class NumberInput {
    * Currently selected language.
    */
   language: string;
-  /**
-   * State passed down from the parent element. Will trigger the input to check for validity.
-   */
-  checkValidity: boolean;
   /**
    * State passed down from the parent element. Will trigger the input to send it's value through an event.
    */
@@ -34,7 +30,6 @@ export declare class NumberInput {
   value: string;
   inputReference: HTMLInputElement;
   debounceTime: ReturnType<typeof setTimeout>;
-  checkValidityHandler(newValue: boolean): void;
   validityChanged(): void;
   sendValidityState: EventEmitter<InputStateEvent>;
   validityStateHandler(inputStateEvent: InputStateEvent): void;

package/dist/types/components/radio-input/radio-input.d.ts

@@ -21,10 +21,6 @@ export declare class RadioInput {
    * Currently selected language.
    */
   language: string;
-  /**
-   * State passed down from the parent element. Will trigger the input to check for validity.
-   */
-  checkValidity: boolean;
   /**
    * State passed down from the parent element. Will trigger the input to send it's value through an event.
    */
@@ -33,7 +29,6 @@ export declare class RadioInput {
   isValid: boolean;
   private inputReference;
   value: any;
-  checkValidityHandler(newValue: boolean): void;
   validityChanged(): void;
   emitValueHandler(newValue: boolean): void;
   sendInputValue: EventEmitter<InputValueEvent>;

package/dist/types/components/select-input/select-input.d.ts

@@ -25,10 +25,6 @@ export declare class SelectInput {
    * Currently selected language.
    */
   language: string;
-  /**
-   * State passed down from the parent element. Will trigger the input to check for validity.
-   */
-  checkValidity: boolean;
   /**
    * State passed down from the parent element. Will trigger the input to send it's value through an event.
    */
@@ -38,7 +34,6 @@ export declare class SelectInput {
   private inputReference;
   value: string;
   displayedOptions: Option[];
-  checkValidityHandler(newValue: boolean): void;
   validityChanged(): void;
   sendValidityState: EventEmitter<InputStateEvent>;
   validityStateHandler(inputStateEvent: InputStateEvent): void;

package/dist/types/components/tel-input/tel-input.d.ts

@@ -29,10 +29,6 @@ export declare class TelInput {
    * Currently selected language.
    */
   language: string;
-  /**
-   * State passed down from the parent element. Will trigger the input to check for validity.
-   */
-  checkValidity: boolean;
   /**
    * State passed down from the parent element. Will trigger the input to send it's value through an event.
    */
@@ -43,7 +39,6 @@ export declare class TelInput {
   validationPattern: string;
   debounceTime: ReturnType<typeof setTimeout>;
   value: string;
-  checkValidityHandler(newValue: boolean): void;
   validityChanged(): void;
   sendValidityState: EventEmitter<InputStateEvent>;
   validityStateHandler(inputStateEvent: InputStateEvent): void;

package/dist/types/components.d.ts

@@ -30,10 +30,6 @@ export namespace Components {
         "validation": ValidationSchema;
     }
     interface DateInput {
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity": boolean;
         /**
           * Default value for the input.
          */
@@ -60,10 +56,6 @@ export namespace Components {
         "validation": ValidationSchema;
     }
     interface EmailInput {
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity": boolean;
         /**
           * Default value for the input.
          */
@@ -128,10 +120,6 @@ export namespace Components {
         "validation": ValidationSchema;
     }
     interface NumberInput {
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity": boolean;
         /**
           * Default value for the input.
          */
@@ -180,10 +168,6 @@ export namespace Components {
         "validation": ValidationSchema;
     }
     interface RadioInput {
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity": boolean;
         /**
           * Name of input to be shown to the user.
          */
@@ -214,10 +198,6 @@ export namespace Components {
           * Special behaviour an input should have. Can be fetching for data.
          */
         "action": string;
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity": boolean;
         /**
           * Name of input to be shown to the user.
          */
@@ -248,10 +228,6 @@ export namespace Components {
           * Special behaviour an input should have. Can be fetching for data.
          */
         "action": string;
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity": boolean;
         /**
           * Default value for the input.
          */
@@ -416,10 +392,6 @@ declare namespace LocalJSX {
         "validation"?: ValidationSchema;
     }
     interface DateInput {
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity"?: boolean;
         /**
           * Default value for the input.
          */
@@ -448,10 +420,6 @@ declare namespace LocalJSX {
         "validation"?: ValidationSchema;
     }
     interface EmailInput {
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity"?: boolean;
         /**
           * Default value for the input.
          */
@@ -518,10 +486,6 @@ declare namespace LocalJSX {
         "validation"?: ValidationSchema;
     }
     interface NumberInput {
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity"?: boolean;
         /**
           * Default value for the input.
          */
@@ -574,10 +538,6 @@ declare namespace LocalJSX {
         "validation"?: ValidationSchema;
     }
     interface RadioInput {
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity"?: boolean;
         /**
           * Name of input to be shown to the user.
          */
@@ -610,10 +570,6 @@ declare namespace LocalJSX {
           * Special behaviour an input should have. Can be fetching for data.
          */
         "action"?: string;
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity"?: boolean;
         /**
           * Name of input to be shown to the user.
          */
@@ -646,10 +602,6 @@ declare namespace LocalJSX {
           * Special behaviour an input should have. Can be fetching for data.
          */
         "action"?: string;
-        /**
-          * State passed down from the parent element. Will trigger the input to check for validity.
-         */
-        "checkValidity"?: boolean;
         /**
           * Default value for the input.
          */