@everymatrix/general-registration 1.10.11 → 1.10.13

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

@@ -40,7 +40,17 @@ const CheckboxInput = class {
      * Default value for the input.
      */
     this.defaultValue = '';
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
+    this.limitStylingAppends = false;
     this.value = '';
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
   }
   validityChanged() {
     if (this.emitValue == true) {
@@ -58,6 +68,15 @@ const CheckboxInput = class {
   valueHandler(inputValueEvent) {
     this.sendInputValue.emit(inputValueEvent);
   }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
+  }
   componentDidLoad() {
     if (this.defaultValue) {
       this.value = this.defaultValue;
@@ -80,7 +99,7 @@ const CheckboxInput = class {
     }
   }
   render() {
-    return h$2("div", { class: 'checkbox__wrapper' }, h$2("input", { type: "checkbox", id: `${this.name}__input`, ref: (el) => this.inputReference = el, name: this.name, checked: !!this.defaultValue, readOnly: this.autofilled, required: this.validation.mandatory, value: this.value, onClick: () => this.handleClick() }), h$2("label", { class: 'checkbox__label', htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), h$2("small", { class: 'checkbox__error-message' }, this.errorMessage));
+    return h$2("div", { class: 'checkbox__wrapper', ref: el => this.stylingContainer = el }, h$2("input", { type: "checkbox", id: `${this.name}__input`, ref: (el) => this.inputReference = el, name: this.name, checked: !!this.defaultValue, readOnly: this.autofilled, required: this.validation.mandatory, value: this.value, onClick: () => this.handleClick() }), h$2("label", { class: 'checkbox__label', htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), h$2("small", { class: 'checkbox__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
     "isValid": ["validityChanged"],
@@ -23038,6 +23057,16 @@ const DateInput = class {
     registerInstance(this, hostRef);
     this.sendValidityState = createEvent(this, "sendValidityState", 7);
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
+    this.limitStylingAppends = false;
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
   }
   validityChanged() {
     this.validityStateHandler({ valid: this.isValid, name: this.name });
@@ -23056,6 +23085,15 @@ const DateInput = class {
   valueHandler(inputValueEvent) {
     this.sendInputValue.emit(inputValueEvent);
   }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
+  }
   componentDidLoad() {
     this.inputReference = this.element.shadowRoot.querySelector('input');
     if (this.defaultValue) {
@@ -23083,7 +23121,7 @@ const DateInput = class {
   }
   render() {
     const invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'date__input--invalid';
-    return h$2("div", { class: 'date__wrapper' }, h$2("label", { class: `date__label ${this.validation.mandatory ? 'date__label--required' : ''}}`, htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), h$2("vaadin-date-picker", { id: `${this.name}__input`, type: 'date', class: `date__input ${invalidClass}`, value: this.defaultValue, readOnly: this.autofilled, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, required: this.validation.mandatory, max: this.validation.max, min: this.validation.min, onBlur: (e) => this.handleInput(e) }), h$2("small", { class: 'date__error-message' }, this.errorMessage));
+    return h$2("div", { class: 'date__wrapper', ref: el => this.stylingContainer = el }, h$2("label", { class: `date__label ${this.validation.mandatory ? 'date__label--required' : ''}}`, htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), h$2("vaadin-date-picker", { id: `${this.name}__input`, type: 'date', class: `date__input ${invalidClass}`, value: this.defaultValue, readOnly: this.autofilled, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, required: this.validation.mandatory, max: this.validation.max, min: this.validation.min, onBlur: (e) => this.handleInput(e) }), h$2("small", { class: 'date__error-message' }, this.errorMessage));
   }
   get element() { return getElement(this); }
   static get watchers() { return {
@@ -23100,7 +23138,17 @@ const EmailInput = class {
     registerInstance(this, hostRef);
     this.sendValidityState = createEvent(this, "sendValidityState", 7);
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
+    this.limitStylingAppends = false;
     this.validationPattern = '';
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
   }
   validityChanged() {
     this.validityStateHandler({ valid: this.isValid, name: this.name });
@@ -23129,6 +23177,15 @@ const EmailInput = class {
   connectedCallback() {
     this.validationPattern = this.setPattern();
   }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
+  }
   componentDidLoad() {
     if (this.defaultValue) {
       this.value = this.defaultValue;
@@ -23168,7 +23225,7 @@ const EmailInput = class {
   }
   render() {
     const invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'email__input--invalid';
-    return h$2("div", { class: 'email__wrapper' }, h$2("input", { id: `${this.name}__input`, type: 'email', class: `email__input ${invalidClass}`, value: this.defaultValue, readOnly: this.autofilled, 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, onBlur: (e) => this.handleInput(e) }), h$2("label", { class: `email__label ${this.validation.mandatory ? 'email__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$2("small", { class: 'email__error-message' }, this.errorMessage));
+    return h$2("div", { class: 'email__wrapper', ref: el => this.stylingContainer = el }, h$2("input", { id: `${this.name}__input`, type: 'email', class: `email__input ${invalidClass}`, value: this.defaultValue, readOnly: this.autofilled, 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, onBlur: (e) => this.handleInput(e) }), h$2("label", { class: `email__label ${this.validation.mandatory ? 'email__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$2("small", { class: 'email__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
     "isValid": ["validityChanged"],
@@ -23186,27 +23243,46 @@ const GeneralInput = class {
      * Type the general-input should take. Can take the default HTML input values.
      */
     this.type = 'text';
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
+    this.limitStylingAppends = false;
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
+  }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
   }
   render() {
     switch (this.type.toLowerCase()) {
       case 'text':
-        return h$2("text-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language, isDuplicateInput: this.isDuplicateInput });
+        return h$2("text-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language, isDuplicateInput: this.isDuplicateInput, "client-styling": this.clientStyling });
       case 'email':
-        return h$2("email-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language, isDuplicateInput: this.isDuplicateInput });
+        return h$2("email-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language, isDuplicateInput: this.isDuplicateInput, "client-styling": this.clientStyling });
       case 'number':
-        return h$2("number-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language });
+        return h$2("number-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language, "client-styling": this.clientStyling });
       case 'checkbox':
-        return h$2("checkbox-input", { name: this.name, displayName: this.displayName, validation: this.validation, emitValue: this.emitValue, defaultValue: this.defaultValue, autofilled: this.autofilled, language: this.language });
+        return h$2("checkbox-input", { name: this.name, displayName: this.displayName, validation: this.validation, emitValue: this.emitValue, defaultValue: this.defaultValue, autofilled: this.autofilled, language: this.language, "client-styling": this.clientStyling });
       case 'datetime':
-        return h$2("date-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language });
+        return h$2("date-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language, "client-styling": this.clientStyling });
       case 'password':
-        return h$2("password-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language, isDuplicateInput: this.isDuplicateInput });
+        return h$2("password-input", { name: this.name, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, autofilled: this.autofilled, emitValue: this.emitValue, language: this.language, isDuplicateInput: this.isDuplicateInput, "client-styling": this.clientStyling });
       case 'radio':
-        return h$2("radio-input", { name: this.name, displayName: this.displayName, optionsGroup: this.options, validation: this.validation, emitValue: this.emitValue, language: this.language });
+        return h$2("radio-input", { name: this.name, displayName: this.displayName, optionsGroup: this.options, validation: this.validation, emitValue: this.emitValue, language: this.language, "client-styling": this.clientStyling });
       case 'tel':
-        return h$2("tel-input", { name: this.name, action: this.action, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, emitValue: this.emitValue, language: this.language, autofilled: this.autofilled });
+        return h$2("tel-input", { name: this.name, action: this.action, displayName: this.displayName, validation: this.validation, defaultValue: this.defaultValue, emitValue: this.emitValue, language: this.language, autofilled: this.autofilled, "client-styling": this.clientStyling });
       case 'dropdown':
-        return h$2("select-input", { name: this.name, action: this.action, defaultValue: this.defaultValue, displayName: this.displayName, options: this.options, validation: this.validation, emitValue: this.emitValue, autofilled: this.autofilled, language: this.language });
+        return h$2("select-input", { name: this.name, action: this.action, defaultValue: this.defaultValue, displayName: this.displayName, options: this.options, validation: this.validation, emitValue: this.emitValue, autofilled: this.autofilled, language: this.language, "client-styling": this.clientStyling });
       default:
         return h$2("p", null, "The ", this.type, " input type is not valid");
     }
@@ -23255,11 +23331,11 @@ const GeneralRegistration = class {
     */
     this.language = 'en';
     /**
-     * Client custom styling via string
+     * Client custom styling via inline styles
      */
     this.clientStyling = '';
     /**
-     * Client custom styling via url content
+     * Client custom styling via url
      */
     this.clientStylingUrl = '';
     this.emitValue = false;
@@ -23284,6 +23360,7 @@ const GeneralRegistration = class {
         .then((res) => res.text())
         .then((data) => {
         cssFile.innerHTML = data;
+        this.clientStyling = data;
         setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
       });
     };
@@ -23546,7 +23623,7 @@ const GeneralRegistration = class {
     return listOfInputs.filter(input => input.isValid == false).length > 0;
   }
   renderInputs() {
-    return (this.listOfInputs.map(input => h$2("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data ? input.data.values : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, isDuplicateInput: input.isDuplicateInput })));
+    return (this.listOfInputs.map(input => h$2("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data ? input.data.values : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, isDuplicateInput: input.isDuplicateInput, "client-styling": this.clientStyling })));
   }
   ;
   renderButtons() {
@@ -23571,6 +23648,16 @@ const NumberInput = class {
     registerInstance(this, hostRef);
     this.sendValidityState = createEvent(this, "sendValidityState", 7);
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
+    this.limitStylingAppends = false;
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
   }
   validityChanged() {
     this.validityStateHandler({ valid: this.isValid, name: this.name });
@@ -23589,6 +23676,15 @@ const NumberInput = class {
   valueHandler(inputValueEvent) {
     this.sendInputValue.emit(inputValueEvent);
   }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
+  }
   componentDidLoad() {
     if (this.defaultValue) {
       this.value = this.defaultValue;
@@ -23615,7 +23711,7 @@ const NumberInput = class {
   }
   render() {
     const invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'number__input--invalid';
-    return h$2("div", { class: 'number__wrapper' }, h$2("input", { ref: (el) => this.inputReference = el, type: "number", value: this.defaultValue, readOnly: this.autofilled, 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, onBlur: (e) => this.handleInput(e) }), h$2("label", { class: `number__label ${this.validation.mandatory ? 'number__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$2("small", { class: 'number__error-message' }, this.errorMessage));
+    return h$2("div", { class: 'number__wrapper', ref: el => this.stylingContainer = el }, h$2("input", { ref: (el) => this.inputReference = el, type: "number", value: this.defaultValue, readOnly: this.autofilled, 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, onBlur: (e) => this.handleInput(e) }), h$2("label", { class: `number__label ${this.validation.mandatory ? 'number__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$2("small", { class: 'number__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
     "isValid": ["validityChanged"],
@@ -24430,8 +24526,18 @@ const PasswordInput = class {
      * Default value for the input.
      */
     this.defaultValue = '';
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
+    this.limitStylingAppends = false;
     this.value = '';
     this.validationPattern = '';
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
   }
   validityChanged() {
     this.validityStateHandler({ valid: this.isValid, name: this.name });
@@ -24460,6 +24566,15 @@ const PasswordInput = class {
   connectedCallback() {
     this.validationPattern = this.setPattern();
   }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
+  }
   componentDidLoad() {
     this.inputReference = this.element.shadowRoot.querySelector('input');
     if (this.defaultValue) {
@@ -24500,7 +24615,7 @@ const PasswordInput = class {
   }
   render() {
     const invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'password__input--invalid';
-    return h$2("div", { class: 'password__wrapper' }, h$2("vaadin-password-field", { type: "password", id: `${this.name}__input`, class: `password__input ${invalidClass}`, name: this.name, readOnly: this.autofilled, value: this.defaultValue,
+    return h$2("div", { class: 'password__wrapper', ref: el => this.stylingContainer = el }, h$2("vaadin-password-field", { type: "password", id: `${this.name}__input`, class: `password__input ${invalidClass}`, name: this.name, readOnly: this.autofilled, value: this.defaultValue,
       // ref={(el) => this.inputReference = el as HTMLInputElement}
       required: this.validation.mandatory, maxlength: this.validation.maxLength, minlength: this.validation.minLength, pattern: this.validationPattern, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, onBlur: (e) => this.handleInput(e) }), h$2("label", { class: `password__label ${this.validation.mandatory ? 'password__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$2("small", { class: 'password__error-message' }, this.errorMessage));
   }
@@ -24519,6 +24634,16 @@ const RadioInput = class {
     registerInstance(this, hostRef);
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
     this.sendValidityState = createEvent(this, "sendValidityState", 7);
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
+    this.limitStylingAppends = false;
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
   }
   validityChanged() {
     this.validityStateHandler({ valid: this.isValid, name: this.name });
@@ -24537,7 +24662,14 @@ const RadioInput = class {
   validityStateHandler(inputStateEvent) {
     this.sendValidityState.emit(inputStateEvent);
   }
-  connectedCallback() {
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
   }
   handleClick(event) {
     this.value = event.target.value;
@@ -24555,7 +24687,7 @@ const RadioInput = class {
     }
   }
   render() {
-    return h$2("fieldset", { class: 'radio__fieldset' }, h$2("legend", { class: 'radio__legend' }, this.displayName, ":"), this.optionsGroup.map(option => h$2("div", { class: 'radio__wrapper' }, h$2("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$2("label", { htmlFor: `${option.label}__input` }, option.label))), h$2("small", { class: 'radio__error-message' }, this.errorMessage));
+    return h$2("fieldset", { class: 'radio__fieldset', ref: el => this.stylingContainer = el }, h$2("legend", { class: 'radio__legend' }, this.displayName, ":"), this.optionsGroup.map(option => h$2("div", { class: 'radio__wrapper' }, h$2("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$2("label", { htmlFor: `${option.label}__input` }, option.label))), h$2("small", { class: 'radio__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
     "isValid": ["validityChanged"],
@@ -28920,6 +29052,16 @@ const SelectInput = class {
      * Options of the input.
      */
     this.options = [];
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
+    this.limitStylingAppends = false;
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
   }
   validityChanged() {
     this.validityStateHandler({ valid: this.isValid, name: this.name });
@@ -28952,6 +29094,15 @@ const SelectInput = class {
       }
     }
   }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
+  }
   componentDidLoad() {
     this.inputReference = this.element.shadowRoot.querySelector('input');
     if (this.defaultValue) {
@@ -28990,7 +29141,7 @@ const SelectInput = class {
   }
   render() {
     const invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'select__input--invalid';
-    return h$2("div", { class: 'select__wrapper' }, h$2("label", { class: 'select__label', htmlFor: `${this.name}__input` }, `${this.displayName} ${this.validation.mandatory ? '*' : ''}`), h$2("vaadin-combo-box", { name: this.name, id: `${this.name}__input`, class: `select__input ${invalidClass}`, "item-label-path": "label", "item-value-path": "value", readOnly: this.autofilled, required: this.validation.mandatory, value: this.defaultValue, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, items: this.displayedOptions, onBlur: (e) => this.handleChange(e) }), h$2("small", { class: 'select__error-message' }, this.errorMessage));
+    return h$2("div", { class: 'select__wrapper', ref: el => this.stylingContainer = el }, h$2("label", { class: 'select__label', htmlFor: `${this.name}__input` }, `${this.displayName} ${this.validation.mandatory ? '*' : ''}`), h$2("vaadin-combo-box", { name: this.name, id: `${this.name}__input`, class: `select__input ${invalidClass}`, "item-label-path": "label", "item-value-path": "value", readOnly: this.autofilled, required: this.validation.mandatory, value: this.defaultValue, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, items: this.displayedOptions, onBlur: (e) => this.handleChange(e) }), h$2("small", { class: 'select__error-message' }, this.errorMessage));
   }
   get element() { return getElement(this); }
   static get watchers() { return {
@@ -29007,7 +29158,17 @@ const TelInput = class {
     registerInstance(this, hostRef);
     this.sendValidityState = createEvent(this, "sendValidityState", 7);
     this.sendInputValue = createEvent(this, "sendInputValue", 7);
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
+    this.limitStylingAppends = false;
     this.validationPattern = '';
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
   }
   validityChanged() {
     this.validityStateHandler({ valid: this.isValid, name: this.name });
@@ -29044,6 +29205,15 @@ const TelInput = class {
       }
     }
   }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
+  }
   componentDidLoad() {
     if (this.defaultValue) {
       this.value = `${this.prefixValue}|${this.phoneValue}`;
@@ -29095,7 +29265,7 @@ const TelInput = class {
   }
   render() {
     const invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'tel__wrapper--flex--invalid';
-    return h$2("div", { class: 'tel__wrapper' }, h$2("div", { class: `tel__wrapper--flex ${invalidClass}` }, h$2("vaadin-combo-box", { class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.autofilled, onBlur: (e) => this.prefixValue = e.target.value }), h$2("input", { type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: this.phoneValue, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onBlur: (e) => this.handleInput(e) })), h$2("label", { class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$2("small", { class: 'tel__error-message' }, this.errorMessage));
+    return h$2("div", { class: 'tel__wrapper', ref: el => this.stylingContainer = el }, h$2("div", { class: `tel__wrapper--flex ${invalidClass}` }, h$2("vaadin-combo-box", { class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.autofilled, onBlur: (e) => this.prefixValue = e.target.value }), h$2("input", { type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: this.phoneValue, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onBlur: (e) => this.handleInput(e) })), h$2("label", { class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$2("small", { class: 'tel__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
     "isValid": ["validityChanged"],
@@ -29115,10 +29285,20 @@ const TextInput = class {
      * Default value for the input.
      */
     this.defaultValue = '';
+    /**
+     * Client custom styling via inline style
+     */
+    this.clientStyling = '';
     this.errorMessage = '';
+    this.limitStylingAppends = false;
     this.value = '';
     this.customRules = [];
     this.validationPattern = '';
+    this.setClientStyling = () => {
+      let sheet = document.createElement('style');
+      sheet.innerHTML = this.clientStyling;
+      this.stylingContainer.prepend(sheet);
+    };
   }
   validityChanged() {
     if (this.emitValue == true) {
@@ -29146,6 +29326,15 @@ const TextInput = class {
   connectedCallback() {
     this.validationPattern = this.setPattern();
   }
+  componentDidRender() {
+    // start custom styling area
+    if (!this.limitStylingAppends && this.stylingContainer) {
+      if (this.clientStyling)
+        this.setClientStyling();
+      this.limitStylingAppends = true;
+    }
+    // end custom styling area
+  }
   componentDidLoad() {
     if (this.defaultValue) {
       this.value = this.defaultValue;
@@ -29185,7 +29374,7 @@ const TextInput = class {
   }
   render() {
     const invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
-    return h$2("div", { class: 'text__wrapper' }, h$2("label", { class: `text__label  ${this.validation.mandatory ? 'text__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$2("input", { name: this.name, id: `${this.name}__input`, value: this.defaultValue, type: 'text', class: `text__input ${invalidClass}`, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, ref: (el) => this.inputReference = el, readOnly: this.autofilled, pattern: this.validationPattern, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, onBlur: (e) => { this.handleInput(e); } }), h$2("small", { class: 'text__error-message' }, this.errorMessage));
+    return h$2("div", { class: 'text__wrapper', ref: el => this.stylingContainer = el }, h$2("label", { class: `text__label  ${this.validation.mandatory ? 'text__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$2("input", { name: this.name, id: `${this.name}__input`, value: this.defaultValue, type: 'text', class: `text__input ${invalidClass}`, placeholder: `${this.displayName} ${this.validation.mandatory ? '*' : ''}`, ref: (el) => this.inputReference = el, readOnly: this.autofilled, pattern: this.validationPattern, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, onBlur: (e) => { this.handleInput(e); } }), h$2("small", { class: 'text__error-message' }, this.errorMessage));
   }
   static get watchers() { return {
     "isValid": ["validityChanged"],

package/dist/esm/general-registration.js

@@ -13,5 +13,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return bootstrapLazy([["checkbox-input_11",[[1,"general-registration",{"endpoint":[1],"language":[1],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"errorMessage":[32],"emitValue":[32],"isFormValid":[32],"listOfInputs":[32],"isLoading":[32],"limitStylingAppends":[32],"registrationStep":[32]},[[0,"sendValidityState","checkInputsValidityHandler"],[0,"sendInputValue","getInputsValueHandler"]]],[1,"general-input",{"type":[1],"name":[1],"displayName":[1,"display-name"],"action":[1],"validation":[16],"options":[8],"language":[1],"autofilled":[4],"defaultValue":[8,"default-value"],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"]}],[1,"checkbox-input",{"name":[1],"displayName":[1,"display-name"],"defaultValue":[1,"default-value"],"autofilled":[4],"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"],"autofilled":[4],"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"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"errorMessage":[32],"isValid":[32]},[[16,"sendInputValue","valueChangedHandler"]]],[1,"number-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"password-input",{"name":[1],"displayName":[1,"display-name"],"defaultValue":[1,"default-value"],"autofilled":[4],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"isValid":[32],"errorMessage":[32]},[[16,"sendInputValue","valueChangedHandler"]]],[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],"defaultValue":[1,"default-value"],"autofilled":[4],"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":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"text-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"rules":[1],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"isValid":[32],"errorMessage":[32]},[[16,"sendInputValue","valueChangedHandler"]]]]]], options);
+  return bootstrapLazy([["checkbox-input_11",[[1,"general-registration",{"endpoint":[1],"language":[1],"clientStyling":[1025,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"errorMessage":[32],"emitValue":[32],"isFormValid":[32],"listOfInputs":[32],"isLoading":[32],"limitStylingAppends":[32],"registrationStep":[32]},[[0,"sendValidityState","checkInputsValidityHandler"],[0,"sendInputValue","getInputsValueHandler"]]],[1,"general-input",{"type":[1],"name":[1],"displayName":[1,"display-name"],"action":[1],"validation":[16],"options":[8],"language":[1],"autofilled":[4],"defaultValue":[8,"default-value"],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"clientStyling":[1,"client-styling"],"limitStylingAppends":[32]}],[1,"checkbox-input",{"name":[1],"displayName":[1,"display-name"],"defaultValue":[1,"default-value"],"autofilled":[4],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"date-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"email-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]},[[16,"sendInputValue","valueChangedHandler"]]],[1,"number-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"password-input",{"name":[1],"displayName":[1,"display-name"],"defaultValue":[1,"default-value"],"autofilled":[4],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"clientStyling":[1,"client-styling"],"isValid":[32],"errorMessage":[32],"limitStylingAppends":[32]},[[16,"sendInputValue","valueChangedHandler"]]],[1,"radio-input",{"name":[1],"displayName":[1,"display-name"],"optionsGroup":[16],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"select-input",{"name":[1],"displayName":[1,"display-name"],"action":[1],"defaultValue":[1,"default-value"],"autofilled":[4],"options":[16],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"tel-input",{"name":[1],"displayName":[1,"display-name"],"showLabels":[4,"show-labels"],"action":[1],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"isValid":[32],"errorMessage":[32],"limitStylingAppends":[32]}],[1,"text-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"rules":[1],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"clientStyling":[1,"client-styling"],"isValid":[32],"errorMessage":[32],"limitStylingAppends":[32]},[[16,"sendInputValue","valueChangedHandler"]]]]]], 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_11",[[1,"general-registration",{"endpoint":[1],"language":[1],"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"errorMessage":[32],"emitValue":[32],"isFormValid":[32],"listOfInputs":[32],"isLoading":[32],"limitStylingAppends":[32],"registrationStep":[32]},[[0,"sendValidityState","checkInputsValidityHandler"],[0,"sendInputValue","getInputsValueHandler"]]],[1,"general-input",{"type":[1],"name":[1],"displayName":[1,"display-name"],"action":[1],"validation":[16],"options":[8],"language":[1],"autofilled":[4],"defaultValue":[8,"default-value"],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"]}],[1,"checkbox-input",{"name":[1],"displayName":[1,"display-name"],"defaultValue":[1,"default-value"],"autofilled":[4],"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"],"autofilled":[4],"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"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"errorMessage":[32],"isValid":[32]},[[16,"sendInputValue","valueChangedHandler"]]],[1,"number-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"errorMessage":[32],"isValid":[32]}],[1,"password-input",{"name":[1],"displayName":[1,"display-name"],"defaultValue":[1,"default-value"],"autofilled":[4],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"isValid":[32],"errorMessage":[32]},[[16,"sendInputValue","valueChangedHandler"]]],[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],"defaultValue":[1,"default-value"],"autofilled":[4],"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":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"isValid":[32],"errorMessage":[32]}],[1,"text-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"rules":[1],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"isValid":[32],"errorMessage":[32]},[[16,"sendInputValue","valueChangedHandler"]]]]]], options);
+  return bootstrapLazy([["checkbox-input_11",[[1,"general-registration",{"endpoint":[1],"language":[1],"clientStyling":[1025,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"errorMessage":[32],"emitValue":[32],"isFormValid":[32],"listOfInputs":[32],"isLoading":[32],"limitStylingAppends":[32],"registrationStep":[32]},[[0,"sendValidityState","checkInputsValidityHandler"],[0,"sendInputValue","getInputsValueHandler"]]],[1,"general-input",{"type":[1],"name":[1],"displayName":[1,"display-name"],"action":[1],"validation":[16],"options":[8],"language":[1],"autofilled":[4],"defaultValue":[8,"default-value"],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"clientStyling":[1,"client-styling"],"limitStylingAppends":[32]}],[1,"checkbox-input",{"name":[1],"displayName":[1,"display-name"],"defaultValue":[1,"default-value"],"autofilled":[4],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"date-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"email-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]},[[16,"sendInputValue","valueChangedHandler"]]],[1,"number-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"password-input",{"name":[1],"displayName":[1,"display-name"],"defaultValue":[1,"default-value"],"autofilled":[4],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"clientStyling":[1,"client-styling"],"isValid":[32],"errorMessage":[32],"limitStylingAppends":[32]},[[16,"sendInputValue","valueChangedHandler"]]],[1,"radio-input",{"name":[1],"displayName":[1,"display-name"],"optionsGroup":[16],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"select-input",{"name":[1],"displayName":[1,"display-name"],"action":[1],"defaultValue":[1,"default-value"],"autofilled":[4],"options":[16],"validation":[16],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"errorMessage":[32],"isValid":[32],"limitStylingAppends":[32]}],[1,"tel-input",{"name":[1],"displayName":[1,"display-name"],"showLabels":[4,"show-labels"],"action":[1],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"language":[1],"emitValue":[4,"emit-value"],"clientStyling":[1,"client-styling"],"isValid":[32],"errorMessage":[32],"limitStylingAppends":[32]}],[1,"text-input",{"name":[1],"displayName":[1,"display-name"],"validation":[16],"defaultValue":[1,"default-value"],"autofilled":[4],"rules":[1],"language":[1],"checkValidity":[4,"check-validity"],"emitValue":[4,"emit-value"],"isDuplicateInput":[4,"is-duplicate-input"],"clientStyling":[1,"client-styling"],"isValid":[32],"errorMessage":[32],"limitStylingAppends":[32]},[[16,"sendInputValue","valueChangedHandler"]]]]]], options);
   });
 };
 

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

@@ -1 +1 @@
-import{p as a,b as e}from"./p-8f644809.js";(()=>{const e=import.meta.url,l={};return""!==e&&(l.resourcesUrl=new URL(".",e).href),a(l)})().then((a=>e([["p-b5f7ebdd",[[1,"general-registration",{endpoint:[1],language:[1],clientStyling:[1,"client-styling"],clientStylingUrl:[1,"client-styling-url"],errorMessage:[32],emitValue:[32],isFormValid:[32],listOfInputs:[32],isLoading:[32],limitStylingAppends:[32],registrationStep:[32]},[[0,"sendValidityState","checkInputsValidityHandler"],[0,"sendInputValue","getInputsValueHandler"]]],[1,"general-input",{type:[1],name:[1],displayName:[1,"display-name"],action:[1],validation:[16],options:[8],language:[1],autofilled:[4],defaultValue:[8,"default-value"],emitValue:[4,"emit-value"],isDuplicateInput:[4,"is-duplicate-input"]}],[1,"checkbox-input",{name:[1],displayName:[1,"display-name"],defaultValue:[1,"default-value"],autofilled:[4],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"],autofilled:[4],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"],autofilled:[4],language:[1],emitValue:[4,"emit-value"],isDuplicateInput:[4,"is-duplicate-input"],errorMessage:[32],isValid:[32]},[[16,"sendInputValue","valueChangedHandler"]]],[1,"number-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],autofilled:[4],language:[1],emitValue:[4,"emit-value"],errorMessage:[32],isValid:[32]}],[1,"password-input",{name:[1],displayName:[1,"display-name"],defaultValue:[1,"default-value"],autofilled:[4],validation:[16],language:[1],emitValue:[4,"emit-value"],isDuplicateInput:[4,"is-duplicate-input"],isValid:[32],errorMessage:[32]},[[16,"sendInputValue","valueChangedHandler"]]],[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],defaultValue:[1,"default-value"],autofilled:[4],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:[1,"default-value"],autofilled:[4],language:[1],emitValue:[4,"emit-value"],isValid:[32],errorMessage:[32]}],[1,"text-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],autofilled:[4],rules:[1],language:[1],checkValidity:[4,"check-validity"],emitValue:[4,"emit-value"],isDuplicateInput:[4,"is-duplicate-input"],isValid:[32],errorMessage:[32]},[[16,"sendInputValue","valueChangedHandler"]]]]]],a)));
+import{p as e,b as l}from"./p-8f644809.js";(()=>{const l=import.meta.url,i={};return""!==l&&(i.resourcesUrl=new URL(".",l).href),e(i)})().then((e=>l([["p-c7e0b72f",[[1,"general-registration",{endpoint:[1],language:[1],clientStyling:[1025,"client-styling"],clientStylingUrl:[1,"client-styling-url"],errorMessage:[32],emitValue:[32],isFormValid:[32],listOfInputs:[32],isLoading:[32],limitStylingAppends:[32],registrationStep:[32]},[[0,"sendValidityState","checkInputsValidityHandler"],[0,"sendInputValue","getInputsValueHandler"]]],[1,"general-input",{type:[1],name:[1],displayName:[1,"display-name"],action:[1],validation:[16],options:[8],language:[1],autofilled:[4],defaultValue:[8,"default-value"],emitValue:[4,"emit-value"],isDuplicateInput:[4,"is-duplicate-input"],clientStyling:[1,"client-styling"],limitStylingAppends:[32]}],[1,"checkbox-input",{name:[1],displayName:[1,"display-name"],defaultValue:[1,"default-value"],autofilled:[4],validation:[16],language:[1],emitValue:[4,"emit-value"],clientStyling:[1,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32]}],[1,"date-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],autofilled:[4],language:[1],emitValue:[4,"emit-value"],clientStyling:[1,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32]}],[1,"email-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],autofilled:[4],language:[1],emitValue:[4,"emit-value"],isDuplicateInput:[4,"is-duplicate-input"],clientStyling:[1,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32]},[[16,"sendInputValue","valueChangedHandler"]]],[1,"number-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],autofilled:[4],language:[1],emitValue:[4,"emit-value"],clientStyling:[1,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32]}],[1,"password-input",{name:[1],displayName:[1,"display-name"],defaultValue:[1,"default-value"],autofilled:[4],validation:[16],language:[1],emitValue:[4,"emit-value"],isDuplicateInput:[4,"is-duplicate-input"],clientStyling:[1,"client-styling"],isValid:[32],errorMessage:[32],limitStylingAppends:[32]},[[16,"sendInputValue","valueChangedHandler"]]],[1,"radio-input",{name:[1],displayName:[1,"display-name"],optionsGroup:[16],validation:[16],language:[1],emitValue:[4,"emit-value"],clientStyling:[1,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32]}],[1,"select-input",{name:[1],displayName:[1,"display-name"],action:[1],defaultValue:[1,"default-value"],autofilled:[4],options:[16],validation:[16],language:[1],emitValue:[4,"emit-value"],clientStyling:[1,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32]}],[1,"tel-input",{name:[1],displayName:[1,"display-name"],showLabels:[4,"show-labels"],action:[1],validation:[16],defaultValue:[1,"default-value"],autofilled:[4],language:[1],emitValue:[4,"emit-value"],clientStyling:[1,"client-styling"],isValid:[32],errorMessage:[32],limitStylingAppends:[32]}],[1,"text-input",{name:[1],displayName:[1,"display-name"],validation:[16],defaultValue:[1,"default-value"],autofilled:[4],rules:[1],language:[1],checkValidity:[4,"check-validity"],emitValue:[4,"emit-value"],isDuplicateInput:[4,"is-duplicate-input"],clientStyling:[1,"client-styling"],isValid:[32],errorMessage:[32],limitStylingAppends:[32]},[[16,"sendInputValue","valueChangedHandler"]]]]]],e)));