@everymatrix/general-registration 1.66.0 → 1.66.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -12550,7 +12550,7 @@ Try polyfilling it using "@formatjs/intl-pluralrules"
12550
12550
 
12551
12551
  if(typeof window!="undefined"){let n=function(t){return function(...s){try{return t.apply(this,s)}catch(e){if(e instanceof DOMException&&e.message.includes("has already been used with this registry")||e.message.includes("Cannot define multiple custom elements with the same tag name"))return !1;throw e}}};customElements.define=n(customElements.define),Promise.resolve().then(()=>PlayerConsentsDrhcDBLh).then(({default:t})=>{!customElements.get("player-consents")&&customElements.define("player-consents",t.element);});}
12552
12552
 
12553
- const generalRegistrationCss = "*,\n*::before,\n*::after {\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n}\n\n.registration__form.hidden {\n display: none;\n}\n\n.registration {\n font-family: \"Roboto\";\n font-style: normal;\n font-family: sans-serif;\n display: flex;\n flex-direction: column;\n gap: 24px;\n width: 100%;\n height: 100%;\n container-type: inline-size;\n}\n.registration__wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.registration__error-message {\n color: var(--emw--color-error, var(--emw--color-red, #ed0909));\n font-size: 13px;\n display: block;\n justify-content: center;\n text-align: center;\n}\n.registration__form {\n display: grid;\n grid-template-columns: repeat(1, 1fr);\n gap: 40px;\n justify-items: stretch;\n align-content: flex-start;\n overflow: auto;\n width: 100%;\n height: 100%;\n}\n.registration__buttons-wrapper {\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n align-items: center;\n position: relative;\n}\n.registration__button {\n border-radius: 5px;\n background: var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n border: 1px solid var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n color: var(--emw--button-typography, var(--emw--color-white, #FFFFFF));\n text-transform: uppercase;\n font-size: 20px;\n height: 44px;\n width: 100%;\n margin: 0px auto;\n padding: 10px 20px;\n font-weight: normal;\n box-shadow: none;\n cursor: pointer;\n}\n.registration__button--disabled {\n background: var(--emw--color-gray-100, #E6E6E6);\n border: 1px solid var(--emw--color-gray-150, #828282);\n pointer-events: none;\n box-shadow: none;\n}\n.registration__button--first-step {\n display: none;\n}\n\n@container (min-width: 450px) {\n .registration__form {\n grid-template-columns: repeat(2, 1fr);\n }\n .registration__buttons-wrapper {\n flex-direction: row-reverse;\n gap: 15px;\n }\n}\n.spinner {\n animation: rotate 2s linear infinite;\n z-index: 2;\n position: absolute;\n top: 50%;\n left: 50%;\n margin: -25px 0 0 -25px;\n width: 50px;\n height: 50px;\n}\n.spinner .path {\n stroke: var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n stroke-linecap: round;\n animation: dash 1.5s ease-in-out infinite;\n}\n\n@keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n}\n@keyframes dash {\n 0% {\n stroke-dasharray: 1, 150;\n stroke-dashoffset: 0;\n }\n 50% {\n stroke-dasharray: 90, 150;\n stroke-dashoffset: -35;\n }\n 100% {\n stroke-dasharray: 90, 150;\n stroke-dashoffset: -124;\n }\n}";
12553
+ const generalRegistrationCss = "*,\n*::before,\n*::after {\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n}\n\n.registration__form.hidden {\n display: none;\n}\n\n.registration {\n font-family: \"Roboto\";\n font-style: normal;\n font-family: sans-serif;\n display: flex;\n flex-direction: column;\n gap: 24px;\n width: 100%;\n height: 100%;\n container-type: inline-size;\n}\n.registration__wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.registration__error-message {\n color: var(--emw--color-error, var(--emw--color-red, #ed0909));\n font-size: var(--emw-font-size-small, 13px);\n display: block;\n justify-content: center;\n text-align: center;\n}\n.registration__form {\n display: grid;\n grid-template-columns: repeat(1, 1fr);\n gap: 40px;\n justify-items: stretch;\n align-content: flex-start;\n overflow: auto;\n width: 100%;\n height: 100%;\n}\n.registration__buttons-wrapper {\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n align-items: center;\n position: relative;\n}\n.registration__button {\n border-radius: 5px;\n background: var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n border: 1px solid var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n color: var(--emw--button-typography, var(--emw--color-white, #FFFFFF));\n text-transform: uppercase;\n font-size: 20px;\n height: 44px;\n width: 100%;\n margin: 0px auto;\n padding: 10px 20px;\n font-weight: normal;\n box-shadow: none;\n cursor: pointer;\n}\n.registration__button--disabled {\n background: var(--emw--color-gray-100, #E6E6E6);\n border: 1px solid var(--emw--color-gray-150, #828282);\n pointer-events: none;\n box-shadow: none;\n}\n.registration__button--first-step {\n display: none;\n}\n\n@container (min-width: 450px) {\n .registration__form {\n grid-template-columns: repeat(2, 1fr);\n }\n .registration__buttons-wrapper {\n flex-direction: row-reverse;\n gap: 15px;\n }\n}\n.spinner {\n animation: rotate 2s linear infinite;\n z-index: 2;\n position: absolute;\n top: 50%;\n left: 50%;\n margin: -25px 0 0 -25px;\n width: 50px;\n height: 50px;\n}\n.spinner .path {\n stroke: var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n stroke-linecap: round;\n animation: dash 1.5s ease-in-out infinite;\n}\n\n.input-description {\n margin-top: 5px;\n font-size: var(--emw-font-size-x-small, 12px);\n}\n\n@keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n}\n@keyframes dash {\n 0% {\n stroke-dasharray: 1, 150;\n stroke-dashoffset: 0;\n }\n 50% {\n stroke-dasharray: 90, 150;\n stroke-dashoffset: -35;\n }\n 100% {\n stroke-dasharray: 90, 150;\n stroke-dashoffset: -124;\n }\n}";
12554
12554
  const GeneralRegistrationStyle0 = generalRegistrationCss;
12555
12555
 
12556
12556
  const GeneralRegistration = class {
@@ -12905,7 +12905,7 @@ const GeneralRegistration = class {
12905
12905
  }
12906
12906
  setRegisterStep() {
12907
12907
  this.isLoadingPOST = true;
12908
- const url = new URL(`${this.endpoint}/v1/player/legislation/registration/step`);
12908
+ const url = new URL('/v1/player/legislation/registration/step/', this.endpoint);
12909
12909
  const registerStep = {
12910
12910
  registrationId: this.registrationID,
12911
12911
  registerUserDto: this.listOfInputValues
@@ -13267,11 +13267,14 @@ const GeneralRegistration = class {
13267
13267
  }
13268
13268
  renderForm() {
13269
13269
  return this.forms.map((form, index$1) => {
13270
- return index.h("form", { action: '.', id: `RegistrationForm${this.registrationStep}`, class: `registration__form ${this.registrationStep !== `Step${index$1 + 1}` ? 'hidden' : ''}`, ref: el => this.form = el, onClick: this.handleInitialClick }, form[this.registrationStep] && form[this.registrationStep].map(input => index.h("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data
13271
- ? (input.inputType.toLowerCase() == 'checkboxgroup' || input.inputType.toLowerCase() == 'togglecheckbox')
13272
- ? input.data.subFields
13273
- : input.data.values
13274
- : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, isDuplicateInput: input.isDuplicateInput, "client-styling": this.clientStyling, tooltip: input.tooltip, placeholder: input.placeholder == null ? '' : input.placeholder, dateFormat: this.dateFormat, "translation-url": this.translationUrl, emitOnClick: this.emitOnClick, onClick: this.handleInitialClick })), this.isConsentReady && this.renderConsents(), this.buttonInsideForm && this.renderButtons(), index.h("div", { class: 'registration__wrapper--flex' }, index.h("p", { class: 'registration__error-message', innerHTML: this.errorMessage })));
13270
+ return index.h("form", { action: '.', id: `RegistrationForm${this.registrationStep}`, class: `registration__form ${this.registrationStep !== `Step${index$1 + 1}` ? 'hidden' : ''}`, ref: el => this.form = el, onClick: this.handleInitialClick }, form[this.registrationStep] && form[this.registrationStep].map((input) => {
13271
+ var _a;
13272
+ return index.h("div", { key: input.name, class: "input-wrapper" }, index.h("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data
13273
+ ? (input.inputType.toLowerCase() === 'checkboxgroup' || input.inputType.toLowerCase() === 'togglecheckbox')
13274
+ ? input.data.subFields
13275
+ : input.data.values
13276
+ : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, isDuplicateInput: input.isDuplicateInput, "client-styling": this.clientStyling, tooltip: input.tooltip, placeholder: input.placeholder == null ? '' : input.placeholder, dateFormat: this.dateFormat, "translation-url": this.translationUrl, emitOnClick: this.emitOnClick, onClick: this.handleInitialClick }), ((_a = input.customInfo) === null || _a === void 0 ? void 0 : _a.description) && (index.h("div", { class: "input-description" }, input.customInfo.description)));
13277
+ }), this.isConsentReady && this.renderConsents(), this.buttonInsideForm && this.renderButtons(), index.h("div", { class: 'registration__wrapper--flex' }, index.h("p", { class: 'registration__error-message', innerHTML: this.errorMessage })));
13275
13278
  });
13276
13279
  }
13277
13280
  ;
@@ -13776,7 +13779,7 @@ const RadioInput = class {
13776
13779
  };
13777
13780
  RadioInput.style = RadioInputStyle0;
13778
13781
 
13779
- const selectInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}:host{height:100%}vaadin-combo-box>input{background-color:var(--emw--color-white, #FFFFFF);color:var(--emw--registration-typography, var(--emw--color-black, #000000));font-weight:300;font-size:16px;-webkit-font-smoothing:initial;}.select{font-family:\"Roboto\";font-style:normal}.select__wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:5px}.select__wrapper--autofilled{pointer-events:none}.select__wrapper--autofilled .select__label{color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.select__wrapper--autofilled .select__input::part(input-field){color:var(--emw--color-black, #000000)}.select__wrapper--flex{display:flex;gap:5px}.select__wrapper--relative{position:relative}.select__label{font-family:inherit;font-style:normal;font-weight:500;font-size:16px;line-height:20px;color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.select__label--required::after{content:\"*\";font-family:inherit;color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));margin-left:2px}.select__input{border:none;width:inherit;position:relative}.select__input[focused]::part(input-field){border-color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E))}.select__input vaadin-date-picker-overlay-content>vaadin-button{color:var(--emw--color-black, #000000)}.select__input::part(input-field){border-radius:4px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--color-black, #000000);font-family:inherit;font-style:normal;font-size:16px;font-weight:300;line-height:1.5;padding:0;height:44px}.select__input::part(toggle-button){position:relative;right:10px}.select__input>input{padding:5px 15px}.select__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.select__tooltip-icon{width:16px;height:auto}.select__tooltip{position:absolute;top:0;left:20px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.select__tooltip.visible{opacity:1}.text__input--invalid{border:1px solid var(--emw--color-error, var(--emw--color-red, #ed0909))}";
13782
+ const selectInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}:host{height:100%;--_invalid-hover-highlight:transparent;--vaadin-input-field-invalid-hover-highlight:transparent}vaadin-combo-box>input{background-color:var(--emw--color-white, #FFFFFF);color:var(--emw--registration-typography, var(--emw--color-black, #000000));font-weight:300;font-size:16px;-webkit-font-smoothing:initial;}.select{font-family:\"Roboto\";font-style:normal}.select__wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:5px}.select__wrapper--autofilled{pointer-events:none}.select__wrapper--autofilled .select__label{color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.select__wrapper--autofilled .select__input::part(input-field){color:var(--emw--color-black, #000000)}.select__wrapper--flex{display:flex;gap:5px}.select__wrapper--relative{position:relative}.select__label{font-family:inherit;font-style:normal;font-weight:500;font-size:16px;line-height:20px;color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.select__label--required::after{content:\"*\";font-family:inherit;color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));margin-left:2px}.select__input{border:none;width:inherit;position:relative}.select__input[focused]::part(input-field){border-color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E))}.select__input vaadin-date-picker-overlay-content>vaadin-button{color:var(--emw--color-black, #000000)}.select__input::part(input-field){border-radius:4px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--color-black, #000000);font-family:inherit;font-style:normal;font-size:16px;font-weight:300;line-height:1.5;padding:5px 15px;height:44px}.select__input::part(toggle-button){position:relative;right:10px}.select__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.select__tooltip-icon{width:16px;height:auto}.select__tooltip{position:absolute;top:0;left:20px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.select__tooltip.visible{opacity:1}.text__input--invalid{border:1px solid var(--emw--color-error, var(--emw--color-red, #ed0909))}";
13780
13783
  const SelectInputStyle0 = selectInputCss;
13781
13784
 
13782
13785
  const SelectInput = class {
@@ -13785,7 +13788,7 @@ const SelectInput = class {
13785
13788
  this.sendValidityState = index.createEvent(this, "sendValidityState", 7);
13786
13789
  this.sendInputValue = index.createEvent(this, "sendInputValue", 7);
13787
13790
  this.touched = false;
13788
- this.handleChange = (event) => {
13791
+ this.handleComboChange = (event) => {
13789
13792
  this.touched = true;
13790
13793
  const selectedValue = event.target.value;
13791
13794
  // Find the original option based on case-insensitive comparison
@@ -13801,12 +13804,23 @@ const SelectInput = class {
13801
13804
  this.emitValueHandler(true);
13802
13805
  };
13803
13806
  this.handleBlur = (event) => {
13804
- this.value = event.target.value;
13807
+ const field = event.currentTarget;
13808
+ if (field.opened)
13809
+ return;
13805
13810
  this.touched = true;
13811
+ this.value = field.value;
13806
13812
  this.isValid = this.setValidity();
13807
13813
  this.errorMessage = this.setErrorMessage();
13808
13814
  this.validityStateHandler({ valid: this.isValid, name: this.name });
13809
13815
  };
13816
+ this.handleSelectChange = (event) => {
13817
+ this.touched = true;
13818
+ this.value = event.target.value;
13819
+ this.isValid = this.setValidity();
13820
+ this.errorMessage = this.setErrorMessage();
13821
+ this.validityStateHandler({ valid: this.isValid, name: this.name });
13822
+ this.emitValueHandler(true);
13823
+ };
13810
13824
  this.setClientStyling = () => {
13811
13825
  let sheet = document.createElement('style');
13812
13826
  sheet.innerHTML = this.clientStyling;
@@ -13851,29 +13865,32 @@ const SelectInput = class {
13851
13865
  this.sendInputValue.emit(inputValueEvent);
13852
13866
  }
13853
13867
  handleClickOutside(event) {
13854
- //Check for empty field when closing the dropdown
13855
- if (this.vaadinCombo.attributes['invalid'])
13856
- this.errorMessage = this.setErrorMessage();
13857
13868
  if (event.composedPath()[0] === this.tooltipIconReference)
13858
13869
  return;
13859
13870
  if (event.composedPath()[0] !== this.tooltipReference)
13860
13871
  this.showTooltip = false;
13861
13872
  }
13862
13873
  connectedCallback() {
13874
+ var _a;
13863
13875
  this.displayedOptions = this.options.map(option => ({
13864
13876
  label: option.label,
13865
13877
  value: option.value
13866
13878
  }));
13879
+ // Use the searchable select if there are more then 6 values
13880
+ this.isComboBox = ((_a = this.displayedOptions) === null || _a === void 0 ? void 0 : _a.length) > 6;
13867
13881
  }
13868
13882
  componentWillLoad() {
13869
13883
  if (this.action && !this.options.length) {
13870
13884
  if (this.action.split(" ")[0] == 'GET') {
13871
13885
  const endpoint = this.action.split(" ")[1];
13872
13886
  return this.getOptions(endpoint).then((options) => {
13887
+ var _a;
13873
13888
  const firstKey = Object.keys(options)[0];
13874
13889
  this.displayedOptions = options[firstKey].map(option => {
13875
13890
  return { label: option.Name, value: option.Alpha2Code };
13876
13891
  });
13892
+ // Use the searchable select if there are more then 6 values
13893
+ this.isComboBox = ((_a = this.displayedOptions) === null || _a === void 0 ? void 0 : _a.length) > 6;
13877
13894
  });
13878
13895
  }
13879
13896
  }
@@ -13911,10 +13928,14 @@ const SelectInput = class {
13911
13928
  });
13912
13929
  }
13913
13930
  setValidity() {
13914
- return this.inputReference.validity.valid;
13931
+ if (this.vaadinCombo && 'validate' in this.vaadinCombo) {
13932
+ return this.vaadinCombo.validate();
13933
+ }
13934
+ return false;
13915
13935
  }
13916
13936
  setErrorMessage() {
13917
- if (this.inputReference.validity.valueMissing) {
13937
+ var _a, _b, _c;
13938
+ if (((_b = (_a = this.inputReference) === null || _a === void 0 ? void 0 : _a.validity) === null || _b === void 0 ? void 0 : _b.valueMissing) || ((_c = this.vaadinCombo) === null || _c === void 0 ? void 0 : _c.invalid)) {
13918
13939
  return translate$1('requiredError', this.language);
13919
13940
  }
13920
13941
  }
@@ -13925,12 +13946,15 @@ const SelectInput = class {
13925
13946
  return null;
13926
13947
  }
13927
13948
  render() {
13949
+ var _a, _b;
13928
13950
  let invalidClass = '';
13929
13951
  if (this.touched) {
13930
13952
  invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
13931
13953
  }
13932
- return index.h("div", { key: '0b687e6a1bc7ec0cb6dba02c41b04315f4196fcf', class: `select__wrapper ${this.autofilled ? 'select__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, index.h("div", { key: '8c9d7987b209bc6ee991535fa91abf874d06046f', class: 'select__wrapper--flex' }, index.h("label", { key: 'f11ccc0c319bf3053615e4b7cdff8e640a9d2318', class: 'select__label', htmlFor: `${this.name}__input` }, `${this.displayName} ${this.validation.mandatory ? '*' : ''}`), index.h("div", { key: 'd2dd7a3b1d8a20ccb9b1222cb30835ed0193a39c', class: 'select__wrapper--relative' }, this.tooltip &&
13933
- index.h("img", { key: 'bae994b4791c2afeb2fb8b15db1c4198ab9f8502', class: 'select__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), index.h("vaadin-combo-box", { key: '58e05a1edbce76612f93f2b7aac63360479b3c0a', name: this.name, id: `${this.name}__input`, class: `select__input ${invalidClass} ${this.autofilled ? 'select__input--autofilled' : ''}`, "item-label-path": "label", "item-value-path": "value", ref: (el) => this.vaadinCombo = el, readOnly: this.autofilled, required: this.validation.mandatory, value: this.value, placeholder: `${this.placeholder}`, items: this.displayedOptions, onChange: this.handleChange, onBlur: this.handleBlur }), index.h("small", { key: '1f3a5ea3b1611b53e04deb8e903ab1785daaadb6', class: 'select__error-message' }, this.errorMessage));
13954
+ return index.h("div", { key: '064b5084b26c1c18300b91bc4e5c5199d6e57616', class: `select__wrapper ${this.autofilled ? 'select__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, index.h("div", { key: '7d2adb9d5dd527a8a3e48fc5432f8f7c77de6d17', class: 'select__wrapper--flex' }, index.h("label", { key: 'f9e8d1a0e7f211a10d36916b76f60b6525d012cd', class: 'select__label', htmlFor: `${this.name}__input` }, `${this.displayName} ${this.validation.mandatory ? '*' : ''}`), index.h("div", { key: '13a01b566a332b4085ff44dc283ed34b302ca8e5', class: 'select__wrapper--relative' }, this.tooltip &&
13955
+ index.h("img", { key: '411d50bd0864fe021609436611fb2989c002c8a6', class: 'select__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), this.isComboBox ? index.h("vaadin-combo-box", { name: this.name, id: `${this.name}__input`, class: `select__input ${invalidClass} ${this.autofilled ? 'select__input--autofilled' : ''}`, "item-label-path": "label", "item-value-path": "value", ref: (el) => this.vaadinCombo = el, readOnly: this.autofilled, required: (_a = this.validation) === null || _a === void 0 ? void 0 : _a.mandatory, value: this.value, placeholder: `${this.placeholder}`, items: this.displayedOptions, onChange: this.handleComboChange, onBlur: this.handleBlur })
13956
+ :
13957
+ index.h("vaadin-select", { name: this.name, id: `${this.name}__input`, class: `select__input ${invalidClass} ${this.autofilled ? 'select__input--autofilled' : ''}`, "item-label-path": "label", "item-value-path": "value", ref: (el) => this.vaadinCombo = el, readOnly: this.autofilled, required: (_b = this.validation) === null || _b === void 0 ? void 0 : _b.mandatory, value: this.value, placeholder: `${this.placeholder}`, items: this.displayedOptions, onChange: this.handleSelectChange, onBlur: this.handleBlur }), index.h("small", { key: '6a39b060f974030f00cd27a01d805077de70bca3', class: 'select__error-message' }, this.errorMessage));
13934
13958
  }
13935
13959
  static get watchers() { return {
13936
13960
  "clientStyling": ["handleStylingChange"],
@@ -14108,8 +14132,8 @@ const TelInput = class {
14108
14132
  if (this.touched) {
14109
14133
  invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
14110
14134
  }
14111
- return index.h("div", { key: '32e4ff12127da0f261d4580f7f89774cc705264f', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, index.h("div", { key: 'ede5ef576ea22d3ede41e757d7f699f97ecd0833', class: 'tel__wrapper--flex-label' }, index.h("label", { key: '1379ab17cb2fec886419de769d6d2013c16c0338', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), index.h("div", { key: '8fdfdf05e90268678a0260024fd021ddceb50f02', class: 'tel__wrapper--relative' }, this.tooltip &&
14112
- index.h("img", { key: 'f214c0175f211055c69c1f46f556521d7007eb8d', class: 'tel__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), index.h("div", { key: 'b9634dea14fa7f3ccabdf4b46bebe31f74f207e9', class: `tel__wrapper--flex ${invalidClass}` }, index.h("vaadin-combo-box", { key: '4a20c8dfc0162f9c82c04c345cb24c69c7e043f6', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.autofilled, onChange: (e) => this.handlePrefixInput(e) }), index.h("input", { key: '16bc2873fa89d882ff862f79b293e125ff4c30ba', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: this.phoneValue, placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), index.h("small", { key: '0b3a96f3a727b469ed116053139cc5d5008c1b76', class: 'tel__error-message' }, this.errorMessage));
14135
+ return index.h("div", { key: 'a38531b8b0fa40e745a3a2b8ac39a56d0001c09f', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, index.h("div", { key: '70c35c825dafc0aee70835e87aeadab141dc22d3', class: 'tel__wrapper--flex-label' }, index.h("label", { key: '5ff2f5df35dcec4ea76f3b9496b193183c03188d', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), index.h("div", { key: 'dc1625d8c724596b05ca2b0069f492ef9172bc10', class: 'tel__wrapper--relative' }, this.tooltip &&
14136
+ index.h("img", { key: 'a6e94e7598b6734b4c83d95e13a113d6f835d755', class: 'tel__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), index.h("div", { key: 'd3865c4a88ea5b6de6791883b3b6955b6b3a0c15', class: `tel__wrapper--flex ${invalidClass}` }, index.h("vaadin-combo-box", { key: '6d845d492057a29590bffb86c509d3f8cfbf6260', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.autofilled, onChange: (e) => this.handlePrefixInput(e) }), index.h("input", { key: '0cb8fe81d26828c0997379352ee25e5a416b5675', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: this.phoneValue, placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), index.h("small", { key: '1de6d39f83643e86d76659946d2996cc6e82c495', class: 'tel__error-message' }, this.errorMessage));
14113
14137
  }
14114
14138
  static get watchers() { return {
14115
14139
  "clientStyling": ["handleStylingChange"],
@@ -14119,7 +14143,7 @@ const TelInput = class {
14119
14143
  };
14120
14144
  TelInput.style = TelInputStyle0;
14121
14145
 
14122
- const textInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.text{font-family:\"Roboto\";font-style:normal}.text__wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:5px;height:100%}.text__wrapper--autofilled{pointer-events:none}.text__wrapper--autofilled .text__label{color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.text__wrapper--autofilled .text__input::part(input-field){color:var(--emw--color-black, #000000)}.text__wrapper--flex{display:flex;gap:5px}.text__wrapper--relative{position:relative}.text__label{font-family:inherit;font-style:normal;font-weight:500;font-size:16px;line-height:20px;color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.text__label--required::after{content:\"*\";font-family:inherit;color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));margin-left:2px}.text__input{font-family:inherit;width:100%;height:44px;border:1px solid var(--emw--color-gray-100, #E6E6E6);background-color:var(--emw--color-white, #FFFFFF);color:var(--emw--color-black, #000000);border-radius:5px;font-size:16px;font-weight:300;line-height:1.5;padding:5px 15px}.text__input:focus{border:1px solid var(--emw--login-color-primary, var(--emw--color-primary, #22B04E))}.text__input--invalid{border:1px solid var(--emw--color-error, var(--emw--color-red, #ed0909))}.text__input::placeholder{color:var(--emw--color-gray-150, #828282)}.text__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.text__tooltip-icon{width:16px;height:auto}.text__tooltip{position:absolute;top:0;left:20px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.text__tooltip.visible{opacity:1}";
14146
+ const textInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.text{font-family:\"Roboto\";font-style:normal}.text__wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:5px}.text__wrapper--autofilled{pointer-events:none}.text__wrapper--autofilled .text__label{color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.text__wrapper--autofilled .text__input::part(input-field){color:var(--emw--color-black, #000000)}.text__wrapper--flex{display:flex;gap:5px}.text__wrapper--relative{position:relative}.text__label{font-family:inherit;font-style:normal;font-weight:500;font-size:16px;line-height:20px;color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.text__label--required::after{content:\"*\";font-family:inherit;color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));margin-left:2px}.text__input{font-family:inherit;width:100%;height:44px;border:1px solid var(--emw--color-gray-100, #E6E6E6);background-color:var(--emw--color-white, #FFFFFF);color:var(--emw--color-black, #000000);border-radius:5px;font-size:16px;font-weight:300;line-height:1.5;padding:5px 15px}.text__input:focus{border:1px solid var(--emw--login-color-primary, var(--emw--color-primary, #22B04E))}.text__input--invalid{border:1px solid var(--emw--color-error, var(--emw--color-red, #ed0909))}.text__input::placeholder{color:var(--emw--color-gray-150, #828282)}.text__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.text__tooltip-icon{width:16px;height:auto}.text__tooltip{position:absolute;top:0;left:20px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.text__tooltip.visible{opacity:1}";
14123
14147
  const TextInputStyle0 = textInputCss;
14124
14148
 
14125
14149
  const TextInput = class {
@@ -14295,8 +14319,8 @@ const TextInput = class {
14295
14319
  if (this.touched) {
14296
14320
  invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
14297
14321
  }
14298
- return index.h("div", { key: '2ec10d73e5c4f98498da30137bc5aa7e7a2bdd3d', class: `text__wrapper ${this.name}__input ${this.autofilled ? 'text__wrapper--autofilled' : ''}`, ref: el => this.stylingContainer = el }, index.h("div", { key: '920b3d13c49ff0c445ae05f7f613185fa211d17a', class: 'text__wrapper--flex' }, index.h("label", { key: '0133d6982eeadb94d7ec1012a4d29a606d8798d0', class: `text__label ${this.validation.mandatory ? 'text__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), index.h("div", { key: '53155bf52cf3145ccb89f4d262d6127bbb316163', class: 'text__wrapper--relative' }, this.tooltip &&
14299
- index.h("img", { key: 'a6e0e575bb2a4732e55f10429c6fea0692f90fc1', class: 'text__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), index.h("input", { key: '5e0678f82cebd2a682854b877c5412d106c871d8', name: this.name, id: `${this.name}__input`, value: this.defaultValue, type: 'text', class: `text__input ${invalidClass}`, placeholder: `${this.placeholder}`, ref: (el) => this.inputReference = el, readOnly: this.autofilled, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, onInput: this.handleInput, onBlur: this.handleBlur }), index.h("small", { key: '1ff3d090a3d26c422bb60bda942015315462e1da', class: 'text__error-message' }, this.errorMessage));
14322
+ return index.h("div", { key: '65f086c89daa3c3ebc40e6f0c58fbd24ff6e9050', class: `text__wrapper ${this.name}__input ${this.autofilled ? 'text__wrapper--autofilled' : ''}`, ref: el => this.stylingContainer = el }, index.h("div", { key: '970d4aa2de6419ab7904e1315c669aadc7f462b3', class: 'text__wrapper--flex' }, index.h("label", { key: '6e3d033ebcf3ecd4a8c3f3a3a35f1e2e4bc8261a', class: `text__label ${this.validation.mandatory ? 'text__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), index.h("div", { key: '7247b4e12c1caf287534541d0cf019ddeaa78182', class: 'text__wrapper--relative' }, this.tooltip &&
14323
+ index.h("img", { key: '3b96da6c25789e12cbbc3408246650d6d1c72712', class: 'text__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), index.h("input", { key: '8fc695313a9e2e19898380dfff97ee76b6e509df', name: this.name, id: `${this.name}__input`, value: this.defaultValue, type: 'text', class: `text__input ${invalidClass}`, placeholder: `${this.placeholder}`, ref: (el) => this.inputReference = el, readOnly: this.autofilled, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, onInput: this.handleInput, onBlur: this.handleBlur }), index.h("small", { key: '90f0552125dbf888c915aa1b2e20446df6a48b9c', class: 'text__error-message' }, this.errorMessage));
14300
14324
  }
14301
14325
  static get watchers() { return {
14302
14326
  "clientStyling": ["handleStylingChange"],
@@ -14404,8 +14428,8 @@ const ToggleCheckboxInput = class {
14404
14428
  return null;
14405
14429
  }
14406
14430
  render() {
14407
- return index.h("div", { key: 'd7084a7f82d45b3d1e7f8ae373b663b2aefdf5ec', class: `togglecheckbox__wrapper ${this.name}__input`, ref: el => this.stylingContainer = el }, index.h("div", { key: 'f065f4611805dd8490234bcec1fecdbcfcaefab8', class: 'togglecheckbox__wrapper--flex' }, index.h("input", { key: 'c5196d5a4cd2f114a610037285ee644fcabc37bd', class: 'togglecheckbox__input', type: "checkbox", id: `${this.name}__input`, ref: (el) => this.checkboxReference = el, name: this.name, checked: this.defaultValue === "true", readOnly: this.autofilled, required: this.validation.mandatory, value: this.value, onClick: () => this.handleClick() }), this.renderLabel()), index.h("small", { key: '06d5db0994272ec9dde1b5cd0d525bb53ff1a058', class: 'togglecheckbox__error-message' }, this.errorMessage), index.h("div", { key: 'aff16ac9ed0adb896f2c1822014c5c8c4d6db2d4', class: 'togglecheckbox__wrapper--relative' }, this.tooltip &&
14408
- index.h("img", { key: '6b049cecc095a2127eb566f50fd0f8feaa8cb3d5', class: 'togglecheckbox__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip()), index.h("div", { key: '372c3eb72cffd482fe1c179047ec3900cef00d46', class: `togglecheckbox__fields-wrapper ${this.showFields ? '' : 'hidden'}` }, this.options.map(subfield => {
14431
+ return index.h("div", { key: '1f359a8390bb4296e94573131009eeff1bd2293c', class: `togglecheckbox__wrapper ${this.name}__input`, ref: el => this.stylingContainer = el }, index.h("div", { key: '76033e62f8d111e3071b1a09a6d8f9b909a05244', class: 'togglecheckbox__wrapper--flex' }, index.h("input", { key: '6d944818346ce6e62117856ff5dfd2278c1ccad4', class: 'togglecheckbox__input', type: "checkbox", id: `${this.name}__input`, ref: (el) => this.checkboxReference = el, name: this.name, checked: this.defaultValue === "true", readOnly: this.autofilled, required: this.validation.mandatory, value: this.value, onClick: () => this.handleClick() }), this.renderLabel()), index.h("small", { key: '7e2b7612f6dc179035027b551a6ac9801a1ba3c5', class: 'togglecheckbox__error-message' }, this.errorMessage), index.h("div", { key: '3a77da5b3544107d49137e6024888f8e774be170', class: 'togglecheckbox__wrapper--relative' }, this.tooltip &&
14432
+ index.h("img", { key: '7edd9a8cce9d66e7f6fb2d61a4513754df62d5df', class: 'togglecheckbox__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip()), index.h("div", { key: '49de8d42d4b9f4c5668de6379f015c92098578a6', class: `togglecheckbox__fields-wrapper ${this.showFields ? '' : 'hidden'}` }, this.options.map(subfield => {
14409
14433
  return index.h("general-input", { type: subfield.inputType, name: subfield.name, displayName: subfield.displayName, validation: subfield.validate, action: subfield.action || null, defaultValue: subfield.defaultValue, autofilled: subfield.autofill, emitValue: this.emitValue, language: this.language, "client-styling": this.clientStyling, tooltip: subfield.tooltip, placeholder: subfield.placeholder == null ? '' : subfield.placeholder, ref: el => this.subFieldsObject[subfield.name] = el });
14410
14434
  })));
14411
14435
  }
@@ -28,7 +28,7 @@
28
28
  }
29
29
  .registration__error-message {
30
30
  color: var(--emw--color-error, var(--emw--color-red, #ed0909));
31
- font-size: 13px;
31
+ font-size: var(--emw-font-size-small, 13px);
32
32
  display: block;
33
33
  justify-content: center;
34
34
  text-align: center;
@@ -100,6 +100,11 @@
100
100
  animation: dash 1.5s ease-in-out infinite;
101
101
  }
102
102
 
103
+ .input-description {
104
+ margin-top: 5px;
105
+ font-size: var(--emw-font-size-x-small, 12px);
106
+ }
107
+
103
108
  @keyframes rotate {
104
109
  100% {
105
110
  transform: rotate(360deg);
@@ -351,7 +351,7 @@ export class GeneralRegistration {
351
351
  }
352
352
  setRegisterStep() {
353
353
  this.isLoadingPOST = true;
354
- const url = new URL(`${this.endpoint}/v1/player/legislation/registration/step`);
354
+ const url = new URL('/v1/player/legislation/registration/step/', this.endpoint);
355
355
  const registerStep = {
356
356
  registrationId: this.registrationID,
357
357
  registerUserDto: this.listOfInputValues
@@ -714,11 +714,14 @@ export class GeneralRegistration {
714
714
  }
715
715
  renderForm() {
716
716
  return this.forms.map((form, index) => {
717
- return h("form", { action: '.', id: `RegistrationForm${this.registrationStep}`, class: `registration__form ${this.registrationStep !== `Step${index + 1}` ? 'hidden' : ''}`, ref: el => this.form = el, onClick: this.handleInitialClick }, form[this.registrationStep] && form[this.registrationStep].map(input => h("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data
718
- ? (input.inputType.toLowerCase() == 'checkboxgroup' || input.inputType.toLowerCase() == 'togglecheckbox')
719
- ? input.data.subFields
720
- : input.data.values
721
- : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, isDuplicateInput: input.isDuplicateInput, "client-styling": this.clientStyling, tooltip: input.tooltip, placeholder: input.placeholder == null ? '' : input.placeholder, dateFormat: this.dateFormat, "translation-url": this.translationUrl, emitOnClick: this.emitOnClick, onClick: this.handleInitialClick })), this.isConsentReady && this.renderConsents(), this.buttonInsideForm && this.renderButtons(), h("div", { class: 'registration__wrapper--flex' }, h("p", { class: 'registration__error-message', innerHTML: this.errorMessage })));
717
+ return h("form", { action: '.', id: `RegistrationForm${this.registrationStep}`, class: `registration__form ${this.registrationStep !== `Step${index + 1}` ? 'hidden' : ''}`, ref: el => this.form = el, onClick: this.handleInitialClick }, form[this.registrationStep] && form[this.registrationStep].map((input) => {
718
+ var _a;
719
+ return h("div", { key: input.name, class: "input-wrapper" }, h("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data
720
+ ? (input.inputType.toLowerCase() === 'checkboxgroup' || input.inputType.toLowerCase() === 'togglecheckbox')
721
+ ? input.data.subFields
722
+ : input.data.values
723
+ : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, isDuplicateInput: input.isDuplicateInput, "client-styling": this.clientStyling, tooltip: input.tooltip, placeholder: input.placeholder == null ? '' : input.placeholder, dateFormat: this.dateFormat, "translation-url": this.translationUrl, emitOnClick: this.emitOnClick, onClick: this.handleInitialClick }), ((_a = input.customInfo) === null || _a === void 0 ? void 0 : _a.description) && (h("div", { class: "input-description" }, input.customInfo.description)));
724
+ }), this.isConsentReady && this.renderConsents(), this.buttonInsideForm && this.renderButtons(), h("div", { class: 'registration__wrapper--flex' }, h("p", { class: 'registration__error-message', innerHTML: this.errorMessage })));
722
725
  });
723
726
  }
724
727
  ;
@@ -12546,7 +12546,7 @@ Try polyfilling it using "@formatjs/intl-pluralrules"
12546
12546
 
12547
12547
  if(typeof window!="undefined"){let n=function(t){return function(...s){try{return t.apply(this,s)}catch(e){if(e instanceof DOMException&&e.message.includes("has already been used with this registry")||e.message.includes("Cannot define multiple custom elements with the same tag name"))return !1;throw e}}};customElements.define=n(customElements.define),Promise.resolve().then(()=>PlayerConsentsDrhcDBLh).then(({default:t})=>{!customElements.get("player-consents")&&customElements.define("player-consents",t.element);});}
12548
12548
 
12549
- const generalRegistrationCss = "*,\n*::before,\n*::after {\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n}\n\n.registration__form.hidden {\n display: none;\n}\n\n.registration {\n font-family: \"Roboto\";\n font-style: normal;\n font-family: sans-serif;\n display: flex;\n flex-direction: column;\n gap: 24px;\n width: 100%;\n height: 100%;\n container-type: inline-size;\n}\n.registration__wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.registration__error-message {\n color: var(--emw--color-error, var(--emw--color-red, #ed0909));\n font-size: 13px;\n display: block;\n justify-content: center;\n text-align: center;\n}\n.registration__form {\n display: grid;\n grid-template-columns: repeat(1, 1fr);\n gap: 40px;\n justify-items: stretch;\n align-content: flex-start;\n overflow: auto;\n width: 100%;\n height: 100%;\n}\n.registration__buttons-wrapper {\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n align-items: center;\n position: relative;\n}\n.registration__button {\n border-radius: 5px;\n background: var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n border: 1px solid var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n color: var(--emw--button-typography, var(--emw--color-white, #FFFFFF));\n text-transform: uppercase;\n font-size: 20px;\n height: 44px;\n width: 100%;\n margin: 0px auto;\n padding: 10px 20px;\n font-weight: normal;\n box-shadow: none;\n cursor: pointer;\n}\n.registration__button--disabled {\n background: var(--emw--color-gray-100, #E6E6E6);\n border: 1px solid var(--emw--color-gray-150, #828282);\n pointer-events: none;\n box-shadow: none;\n}\n.registration__button--first-step {\n display: none;\n}\n\n@container (min-width: 450px) {\n .registration__form {\n grid-template-columns: repeat(2, 1fr);\n }\n .registration__buttons-wrapper {\n flex-direction: row-reverse;\n gap: 15px;\n }\n}\n.spinner {\n animation: rotate 2s linear infinite;\n z-index: 2;\n position: absolute;\n top: 50%;\n left: 50%;\n margin: -25px 0 0 -25px;\n width: 50px;\n height: 50px;\n}\n.spinner .path {\n stroke: var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n stroke-linecap: round;\n animation: dash 1.5s ease-in-out infinite;\n}\n\n@keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n}\n@keyframes dash {\n 0% {\n stroke-dasharray: 1, 150;\n stroke-dashoffset: 0;\n }\n 50% {\n stroke-dasharray: 90, 150;\n stroke-dashoffset: -35;\n }\n 100% {\n stroke-dasharray: 90, 150;\n stroke-dashoffset: -124;\n }\n}";
12549
+ const generalRegistrationCss = "*,\n*::before,\n*::after {\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n}\n\n.registration__form.hidden {\n display: none;\n}\n\n.registration {\n font-family: \"Roboto\";\n font-style: normal;\n font-family: sans-serif;\n display: flex;\n flex-direction: column;\n gap: 24px;\n width: 100%;\n height: 100%;\n container-type: inline-size;\n}\n.registration__wrapper {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.registration__error-message {\n color: var(--emw--color-error, var(--emw--color-red, #ed0909));\n font-size: var(--emw-font-size-small, 13px);\n display: block;\n justify-content: center;\n text-align: center;\n}\n.registration__form {\n display: grid;\n grid-template-columns: repeat(1, 1fr);\n gap: 40px;\n justify-items: stretch;\n align-content: flex-start;\n overflow: auto;\n width: 100%;\n height: 100%;\n}\n.registration__buttons-wrapper {\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n align-items: center;\n position: relative;\n}\n.registration__button {\n border-radius: 5px;\n background: var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n border: 1px solid var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n color: var(--emw--button-typography, var(--emw--color-white, #FFFFFF));\n text-transform: uppercase;\n font-size: 20px;\n height: 44px;\n width: 100%;\n margin: 0px auto;\n padding: 10px 20px;\n font-weight: normal;\n box-shadow: none;\n cursor: pointer;\n}\n.registration__button--disabled {\n background: var(--emw--color-gray-100, #E6E6E6);\n border: 1px solid var(--emw--color-gray-150, #828282);\n pointer-events: none;\n box-shadow: none;\n}\n.registration__button--first-step {\n display: none;\n}\n\n@container (min-width: 450px) {\n .registration__form {\n grid-template-columns: repeat(2, 1fr);\n }\n .registration__buttons-wrapper {\n flex-direction: row-reverse;\n gap: 15px;\n }\n}\n.spinner {\n animation: rotate 2s linear infinite;\n z-index: 2;\n position: absolute;\n top: 50%;\n left: 50%;\n margin: -25px 0 0 -25px;\n width: 50px;\n height: 50px;\n}\n.spinner .path {\n stroke: var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));\n stroke-linecap: round;\n animation: dash 1.5s ease-in-out infinite;\n}\n\n.input-description {\n margin-top: 5px;\n font-size: var(--emw-font-size-x-small, 12px);\n}\n\n@keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n}\n@keyframes dash {\n 0% {\n stroke-dasharray: 1, 150;\n stroke-dashoffset: 0;\n }\n 50% {\n stroke-dasharray: 90, 150;\n stroke-dashoffset: -35;\n }\n 100% {\n stroke-dasharray: 90, 150;\n stroke-dashoffset: -124;\n }\n}";
12550
12550
  const GeneralRegistrationStyle0 = generalRegistrationCss;
12551
12551
 
12552
12552
  const GeneralRegistration = class {
@@ -12901,7 +12901,7 @@ const GeneralRegistration = class {
12901
12901
  }
12902
12902
  setRegisterStep() {
12903
12903
  this.isLoadingPOST = true;
12904
- const url = new URL(`${this.endpoint}/v1/player/legislation/registration/step`);
12904
+ const url = new URL('/v1/player/legislation/registration/step/', this.endpoint);
12905
12905
  const registerStep = {
12906
12906
  registrationId: this.registrationID,
12907
12907
  registerUserDto: this.listOfInputValues
@@ -13263,11 +13263,14 @@ const GeneralRegistration = class {
13263
13263
  }
13264
13264
  renderForm() {
13265
13265
  return this.forms.map((form, index) => {
13266
- return h$1("form", { action: '.', id: `RegistrationForm${this.registrationStep}`, class: `registration__form ${this.registrationStep !== `Step${index + 1}` ? 'hidden' : ''}`, ref: el => this.form = el, onClick: this.handleInitialClick }, form[this.registrationStep] && form[this.registrationStep].map(input => h$1("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data
13267
- ? (input.inputType.toLowerCase() == 'checkboxgroup' || input.inputType.toLowerCase() == 'togglecheckbox')
13268
- ? input.data.subFields
13269
- : input.data.values
13270
- : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, isDuplicateInput: input.isDuplicateInput, "client-styling": this.clientStyling, tooltip: input.tooltip, placeholder: input.placeholder == null ? '' : input.placeholder, dateFormat: this.dateFormat, "translation-url": this.translationUrl, emitOnClick: this.emitOnClick, onClick: this.handleInitialClick })), this.isConsentReady && this.renderConsents(), this.buttonInsideForm && this.renderButtons(), h$1("div", { class: 'registration__wrapper--flex' }, h$1("p", { class: 'registration__error-message', innerHTML: this.errorMessage })));
13266
+ return h$1("form", { action: '.', id: `RegistrationForm${this.registrationStep}`, class: `registration__form ${this.registrationStep !== `Step${index + 1}` ? 'hidden' : ''}`, ref: el => this.form = el, onClick: this.handleInitialClick }, form[this.registrationStep] && form[this.registrationStep].map((input) => {
13267
+ var _a;
13268
+ return h$1("div", { key: input.name, class: "input-wrapper" }, h$1("general-input", { type: input.inputType, name: input.name, displayName: input.displayName, validation: input.validate, action: input.action || null, options: input.data
13269
+ ? (input.inputType.toLowerCase() === 'checkboxgroup' || input.inputType.toLowerCase() === 'togglecheckbox')
13270
+ ? input.data.subFields
13271
+ : input.data.values
13272
+ : [], defaultValue: input.defaultValue, autofilled: input.autofill, emitValue: this.emitValue, language: this.language, isDuplicateInput: input.isDuplicateInput, "client-styling": this.clientStyling, tooltip: input.tooltip, placeholder: input.placeholder == null ? '' : input.placeholder, dateFormat: this.dateFormat, "translation-url": this.translationUrl, emitOnClick: this.emitOnClick, onClick: this.handleInitialClick }), ((_a = input.customInfo) === null || _a === void 0 ? void 0 : _a.description) && (h$1("div", { class: "input-description" }, input.customInfo.description)));
13273
+ }), this.isConsentReady && this.renderConsents(), this.buttonInsideForm && this.renderButtons(), h$1("div", { class: 'registration__wrapper--flex' }, h$1("p", { class: 'registration__error-message', innerHTML: this.errorMessage })));
13271
13274
  });
13272
13275
  }
13273
13276
  ;
@@ -13772,7 +13775,7 @@ const RadioInput = class {
13772
13775
  };
13773
13776
  RadioInput.style = RadioInputStyle0;
13774
13777
 
13775
- const selectInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}:host{height:100%}vaadin-combo-box>input{background-color:var(--emw--color-white, #FFFFFF);color:var(--emw--registration-typography, var(--emw--color-black, #000000));font-weight:300;font-size:16px;-webkit-font-smoothing:initial;}.select{font-family:\"Roboto\";font-style:normal}.select__wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:5px}.select__wrapper--autofilled{pointer-events:none}.select__wrapper--autofilled .select__label{color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.select__wrapper--autofilled .select__input::part(input-field){color:var(--emw--color-black, #000000)}.select__wrapper--flex{display:flex;gap:5px}.select__wrapper--relative{position:relative}.select__label{font-family:inherit;font-style:normal;font-weight:500;font-size:16px;line-height:20px;color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.select__label--required::after{content:\"*\";font-family:inherit;color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));margin-left:2px}.select__input{border:none;width:inherit;position:relative}.select__input[focused]::part(input-field){border-color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E))}.select__input vaadin-date-picker-overlay-content>vaadin-button{color:var(--emw--color-black, #000000)}.select__input::part(input-field){border-radius:4px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--color-black, #000000);font-family:inherit;font-style:normal;font-size:16px;font-weight:300;line-height:1.5;padding:0;height:44px}.select__input::part(toggle-button){position:relative;right:10px}.select__input>input{padding:5px 15px}.select__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.select__tooltip-icon{width:16px;height:auto}.select__tooltip{position:absolute;top:0;left:20px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.select__tooltip.visible{opacity:1}.text__input--invalid{border:1px solid var(--emw--color-error, var(--emw--color-red, #ed0909))}";
13778
+ const selectInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}:host{height:100%;--_invalid-hover-highlight:transparent;--vaadin-input-field-invalid-hover-highlight:transparent}vaadin-combo-box>input{background-color:var(--emw--color-white, #FFFFFF);color:var(--emw--registration-typography, var(--emw--color-black, #000000));font-weight:300;font-size:16px;-webkit-font-smoothing:initial;}.select{font-family:\"Roboto\";font-style:normal}.select__wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:5px}.select__wrapper--autofilled{pointer-events:none}.select__wrapper--autofilled .select__label{color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.select__wrapper--autofilled .select__input::part(input-field){color:var(--emw--color-black, #000000)}.select__wrapper--flex{display:flex;gap:5px}.select__wrapper--relative{position:relative}.select__label{font-family:inherit;font-style:normal;font-weight:500;font-size:16px;line-height:20px;color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.select__label--required::after{content:\"*\";font-family:inherit;color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));margin-left:2px}.select__input{border:none;width:inherit;position:relative}.select__input[focused]::part(input-field){border-color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E))}.select__input vaadin-date-picker-overlay-content>vaadin-button{color:var(--emw--color-black, #000000)}.select__input::part(input-field){border-radius:4px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--color-black, #000000);font-family:inherit;font-style:normal;font-size:16px;font-weight:300;line-height:1.5;padding:5px 15px;height:44px}.select__input::part(toggle-button){position:relative;right:10px}.select__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.select__tooltip-icon{width:16px;height:auto}.select__tooltip{position:absolute;top:0;left:20px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.select__tooltip.visible{opacity:1}.text__input--invalid{border:1px solid var(--emw--color-error, var(--emw--color-red, #ed0909))}";
13776
13779
  const SelectInputStyle0 = selectInputCss;
13777
13780
 
13778
13781
  const SelectInput = class {
@@ -13781,7 +13784,7 @@ const SelectInput = class {
13781
13784
  this.sendValidityState = createEvent(this, "sendValidityState", 7);
13782
13785
  this.sendInputValue = createEvent(this, "sendInputValue", 7);
13783
13786
  this.touched = false;
13784
- this.handleChange = (event) => {
13787
+ this.handleComboChange = (event) => {
13785
13788
  this.touched = true;
13786
13789
  const selectedValue = event.target.value;
13787
13790
  // Find the original option based on case-insensitive comparison
@@ -13797,12 +13800,23 @@ const SelectInput = class {
13797
13800
  this.emitValueHandler(true);
13798
13801
  };
13799
13802
  this.handleBlur = (event) => {
13800
- this.value = event.target.value;
13803
+ const field = event.currentTarget;
13804
+ if (field.opened)
13805
+ return;
13801
13806
  this.touched = true;
13807
+ this.value = field.value;
13802
13808
  this.isValid = this.setValidity();
13803
13809
  this.errorMessage = this.setErrorMessage();
13804
13810
  this.validityStateHandler({ valid: this.isValid, name: this.name });
13805
13811
  };
13812
+ this.handleSelectChange = (event) => {
13813
+ this.touched = true;
13814
+ this.value = event.target.value;
13815
+ this.isValid = this.setValidity();
13816
+ this.errorMessage = this.setErrorMessage();
13817
+ this.validityStateHandler({ valid: this.isValid, name: this.name });
13818
+ this.emitValueHandler(true);
13819
+ };
13806
13820
  this.setClientStyling = () => {
13807
13821
  let sheet = document.createElement('style');
13808
13822
  sheet.innerHTML = this.clientStyling;
@@ -13847,29 +13861,32 @@ const SelectInput = class {
13847
13861
  this.sendInputValue.emit(inputValueEvent);
13848
13862
  }
13849
13863
  handleClickOutside(event) {
13850
- //Check for empty field when closing the dropdown
13851
- if (this.vaadinCombo.attributes['invalid'])
13852
- this.errorMessage = this.setErrorMessage();
13853
13864
  if (event.composedPath()[0] === this.tooltipIconReference)
13854
13865
  return;
13855
13866
  if (event.composedPath()[0] !== this.tooltipReference)
13856
13867
  this.showTooltip = false;
13857
13868
  }
13858
13869
  connectedCallback() {
13870
+ var _a;
13859
13871
  this.displayedOptions = this.options.map(option => ({
13860
13872
  label: option.label,
13861
13873
  value: option.value
13862
13874
  }));
13875
+ // Use the searchable select if there are more then 6 values
13876
+ this.isComboBox = ((_a = this.displayedOptions) === null || _a === void 0 ? void 0 : _a.length) > 6;
13863
13877
  }
13864
13878
  componentWillLoad() {
13865
13879
  if (this.action && !this.options.length) {
13866
13880
  if (this.action.split(" ")[0] == 'GET') {
13867
13881
  const endpoint = this.action.split(" ")[1];
13868
13882
  return this.getOptions(endpoint).then((options) => {
13883
+ var _a;
13869
13884
  const firstKey = Object.keys(options)[0];
13870
13885
  this.displayedOptions = options[firstKey].map(option => {
13871
13886
  return { label: option.Name, value: option.Alpha2Code };
13872
13887
  });
13888
+ // Use the searchable select if there are more then 6 values
13889
+ this.isComboBox = ((_a = this.displayedOptions) === null || _a === void 0 ? void 0 : _a.length) > 6;
13873
13890
  });
13874
13891
  }
13875
13892
  }
@@ -13907,10 +13924,14 @@ const SelectInput = class {
13907
13924
  });
13908
13925
  }
13909
13926
  setValidity() {
13910
- return this.inputReference.validity.valid;
13927
+ if (this.vaadinCombo && 'validate' in this.vaadinCombo) {
13928
+ return this.vaadinCombo.validate();
13929
+ }
13930
+ return false;
13911
13931
  }
13912
13932
  setErrorMessage() {
13913
- if (this.inputReference.validity.valueMissing) {
13933
+ var _a, _b, _c;
13934
+ if (((_b = (_a = this.inputReference) === null || _a === void 0 ? void 0 : _a.validity) === null || _b === void 0 ? void 0 : _b.valueMissing) || ((_c = this.vaadinCombo) === null || _c === void 0 ? void 0 : _c.invalid)) {
13914
13935
  return translate$1('requiredError', this.language);
13915
13936
  }
13916
13937
  }
@@ -13921,12 +13942,15 @@ const SelectInput = class {
13921
13942
  return null;
13922
13943
  }
13923
13944
  render() {
13945
+ var _a, _b;
13924
13946
  let invalidClass = '';
13925
13947
  if (this.touched) {
13926
13948
  invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
13927
13949
  }
13928
- return h$1("div", { key: '0b687e6a1bc7ec0cb6dba02c41b04315f4196fcf', class: `select__wrapper ${this.autofilled ? 'select__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h$1("div", { key: '8c9d7987b209bc6ee991535fa91abf874d06046f', class: 'select__wrapper--flex' }, h$1("label", { key: 'f11ccc0c319bf3053615e4b7cdff8e640a9d2318', class: 'select__label', htmlFor: `${this.name}__input` }, `${this.displayName} ${this.validation.mandatory ? '*' : ''}`), h$1("div", { key: 'd2dd7a3b1d8a20ccb9b1222cb30835ed0193a39c', class: 'select__wrapper--relative' }, this.tooltip &&
13929
- h$1("img", { key: 'bae994b4791c2afeb2fb8b15db1c4198ab9f8502', class: 'select__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h$1("vaadin-combo-box", { key: '58e05a1edbce76612f93f2b7aac63360479b3c0a', name: this.name, id: `${this.name}__input`, class: `select__input ${invalidClass} ${this.autofilled ? 'select__input--autofilled' : ''}`, "item-label-path": "label", "item-value-path": "value", ref: (el) => this.vaadinCombo = el, readOnly: this.autofilled, required: this.validation.mandatory, value: this.value, placeholder: `${this.placeholder}`, items: this.displayedOptions, onChange: this.handleChange, onBlur: this.handleBlur }), h$1("small", { key: '1f3a5ea3b1611b53e04deb8e903ab1785daaadb6', class: 'select__error-message' }, this.errorMessage));
13950
+ return h$1("div", { key: '064b5084b26c1c18300b91bc4e5c5199d6e57616', class: `select__wrapper ${this.autofilled ? 'select__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h$1("div", { key: '7d2adb9d5dd527a8a3e48fc5432f8f7c77de6d17', class: 'select__wrapper--flex' }, h$1("label", { key: 'f9e8d1a0e7f211a10d36916b76f60b6525d012cd', class: 'select__label', htmlFor: `${this.name}__input` }, `${this.displayName} ${this.validation.mandatory ? '*' : ''}`), h$1("div", { key: '13a01b566a332b4085ff44dc283ed34b302ca8e5', class: 'select__wrapper--relative' }, this.tooltip &&
13951
+ h$1("img", { key: '411d50bd0864fe021609436611fb2989c002c8a6', class: 'select__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), this.isComboBox ? h$1("vaadin-combo-box", { name: this.name, id: `${this.name}__input`, class: `select__input ${invalidClass} ${this.autofilled ? 'select__input--autofilled' : ''}`, "item-label-path": "label", "item-value-path": "value", ref: (el) => this.vaadinCombo = el, readOnly: this.autofilled, required: (_a = this.validation) === null || _a === void 0 ? void 0 : _a.mandatory, value: this.value, placeholder: `${this.placeholder}`, items: this.displayedOptions, onChange: this.handleComboChange, onBlur: this.handleBlur })
13952
+ :
13953
+ h$1("vaadin-select", { name: this.name, id: `${this.name}__input`, class: `select__input ${invalidClass} ${this.autofilled ? 'select__input--autofilled' : ''}`, "item-label-path": "label", "item-value-path": "value", ref: (el) => this.vaadinCombo = el, readOnly: this.autofilled, required: (_b = this.validation) === null || _b === void 0 ? void 0 : _b.mandatory, value: this.value, placeholder: `${this.placeholder}`, items: this.displayedOptions, onChange: this.handleSelectChange, onBlur: this.handleBlur }), h$1("small", { key: '6a39b060f974030f00cd27a01d805077de70bca3', class: 'select__error-message' }, this.errorMessage));
13930
13954
  }
13931
13955
  static get watchers() { return {
13932
13956
  "clientStyling": ["handleStylingChange"],
@@ -14104,8 +14128,8 @@ const TelInput = class {
14104
14128
  if (this.touched) {
14105
14129
  invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
14106
14130
  }
14107
- return h$1("div", { key: '32e4ff12127da0f261d4580f7f89774cc705264f', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h$1("div", { key: 'ede5ef576ea22d3ede41e757d7f699f97ecd0833', class: 'tel__wrapper--flex-label' }, h$1("label", { key: '1379ab17cb2fec886419de769d6d2013c16c0338', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$1("div", { key: '8fdfdf05e90268678a0260024fd021ddceb50f02', class: 'tel__wrapper--relative' }, this.tooltip &&
14108
- h$1("img", { key: 'f214c0175f211055c69c1f46f556521d7007eb8d', class: 'tel__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h$1("div", { key: 'b9634dea14fa7f3ccabdf4b46bebe31f74f207e9', class: `tel__wrapper--flex ${invalidClass}` }, h$1("vaadin-combo-box", { key: '4a20c8dfc0162f9c82c04c345cb24c69c7e043f6', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.autofilled, onChange: (e) => this.handlePrefixInput(e) }), h$1("input", { key: '16bc2873fa89d882ff862f79b293e125ff4c30ba', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: this.phoneValue, placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), h$1("small", { key: '0b3a96f3a727b469ed116053139cc5d5008c1b76', class: 'tel__error-message' }, this.errorMessage));
14131
+ return h$1("div", { key: 'a38531b8b0fa40e745a3a2b8ac39a56d0001c09f', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h$1("div", { key: '70c35c825dafc0aee70835e87aeadab141dc22d3', class: 'tel__wrapper--flex-label' }, h$1("label", { key: '5ff2f5df35dcec4ea76f3b9496b193183c03188d', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$1("div", { key: 'dc1625d8c724596b05ca2b0069f492ef9172bc10', class: 'tel__wrapper--relative' }, this.tooltip &&
14132
+ h$1("img", { key: 'a6e94e7598b6734b4c83d95e13a113d6f835d755', class: 'tel__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h$1("div", { key: 'd3865c4a88ea5b6de6791883b3b6955b6b3a0c15', class: `tel__wrapper--flex ${invalidClass}` }, h$1("vaadin-combo-box", { key: '6d845d492057a29590bffb86c509d3f8cfbf6260', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.autofilled, onChange: (e) => this.handlePrefixInput(e) }), h$1("input", { key: '0cb8fe81d26828c0997379352ee25e5a416b5675', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: this.phoneValue, placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), h$1("small", { key: '1de6d39f83643e86d76659946d2996cc6e82c495', class: 'tel__error-message' }, this.errorMessage));
14109
14133
  }
14110
14134
  static get watchers() { return {
14111
14135
  "clientStyling": ["handleStylingChange"],
@@ -14115,7 +14139,7 @@ const TelInput = class {
14115
14139
  };
14116
14140
  TelInput.style = TelInputStyle0;
14117
14141
 
14118
- const textInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.text{font-family:\"Roboto\";font-style:normal}.text__wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:5px;height:100%}.text__wrapper--autofilled{pointer-events:none}.text__wrapper--autofilled .text__label{color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.text__wrapper--autofilled .text__input::part(input-field){color:var(--emw--color-black, #000000)}.text__wrapper--flex{display:flex;gap:5px}.text__wrapper--relative{position:relative}.text__label{font-family:inherit;font-style:normal;font-weight:500;font-size:16px;line-height:20px;color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.text__label--required::after{content:\"*\";font-family:inherit;color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));margin-left:2px}.text__input{font-family:inherit;width:100%;height:44px;border:1px solid var(--emw--color-gray-100, #E6E6E6);background-color:var(--emw--color-white, #FFFFFF);color:var(--emw--color-black, #000000);border-radius:5px;font-size:16px;font-weight:300;line-height:1.5;padding:5px 15px}.text__input:focus{border:1px solid var(--emw--login-color-primary, var(--emw--color-primary, #22B04E))}.text__input--invalid{border:1px solid var(--emw--color-error, var(--emw--color-red, #ed0909))}.text__input::placeholder{color:var(--emw--color-gray-150, #828282)}.text__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.text__tooltip-icon{width:16px;height:auto}.text__tooltip{position:absolute;top:0;left:20px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.text__tooltip.visible{opacity:1}";
14142
+ const textInputCss = "*,*::before,*::after{padding:0;margin:0;box-sizing:border-box}.text{font-family:\"Roboto\";font-style:normal}.text__wrapper{position:relative;width:100%;display:flex;flex-direction:column;gap:5px}.text__wrapper--autofilled{pointer-events:none}.text__wrapper--autofilled .text__label{color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.text__wrapper--autofilled .text__input::part(input-field){color:var(--emw--color-black, #000000)}.text__wrapper--flex{display:flex;gap:5px}.text__wrapper--relative{position:relative}.text__label{font-family:inherit;font-style:normal;font-weight:500;font-size:16px;line-height:20px;color:var(--emw--registration-typography, var(--emw--color-black, #000000))}.text__label--required::after{content:\"*\";font-family:inherit;color:var(--emw--login-color-primary, var(--emw--color-primary, #22B04E));margin-left:2px}.text__input{font-family:inherit;width:100%;height:44px;border:1px solid var(--emw--color-gray-100, #E6E6E6);background-color:var(--emw--color-white, #FFFFFF);color:var(--emw--color-black, #000000);border-radius:5px;font-size:16px;font-weight:300;line-height:1.5;padding:5px 15px}.text__input:focus{border:1px solid var(--emw--login-color-primary, var(--emw--color-primary, #22B04E))}.text__input--invalid{border:1px solid var(--emw--color-error, var(--emw--color-red, #ed0909))}.text__input::placeholder{color:var(--emw--color-gray-150, #828282)}.text__error-message{position:absolute;top:calc(100% + 5px);left:0;color:var(--emw--color-error, var(--emw--color-red, #ed0909))}.text__tooltip-icon{width:16px;height:auto}.text__tooltip{position:absolute;top:0;left:20px;background-color:var(--emw--color-white, #FFFFFF);border:1px solid var(--emw--color-gray-100, #E6E6E6);color:var(--emw--registration-typography, var(--emw--color-black, #000000));padding:10px;border-radius:5px;opacity:0;transition:opacity 0.3s ease-in-out;z-index:10}.text__tooltip.visible{opacity:1}";
14119
14143
  const TextInputStyle0 = textInputCss;
14120
14144
 
14121
14145
  const TextInput = class {
@@ -14291,8 +14315,8 @@ const TextInput = class {
14291
14315
  if (this.touched) {
14292
14316
  invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
14293
14317
  }
14294
- return h$1("div", { key: '2ec10d73e5c4f98498da30137bc5aa7e7a2bdd3d', class: `text__wrapper ${this.name}__input ${this.autofilled ? 'text__wrapper--autofilled' : ''}`, ref: el => this.stylingContainer = el }, h$1("div", { key: '920b3d13c49ff0c445ae05f7f613185fa211d17a', class: 'text__wrapper--flex' }, h$1("label", { key: '0133d6982eeadb94d7ec1012a4d29a606d8798d0', class: `text__label ${this.validation.mandatory ? 'text__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$1("div", { key: '53155bf52cf3145ccb89f4d262d6127bbb316163', class: 'text__wrapper--relative' }, this.tooltip &&
14295
- h$1("img", { key: 'a6e0e575bb2a4732e55f10429c6fea0692f90fc1', class: 'text__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h$1("input", { key: '5e0678f82cebd2a682854b877c5412d106c871d8', name: this.name, id: `${this.name}__input`, value: this.defaultValue, type: 'text', class: `text__input ${invalidClass}`, placeholder: `${this.placeholder}`, ref: (el) => this.inputReference = el, readOnly: this.autofilled, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, onInput: this.handleInput, onBlur: this.handleBlur }), h$1("small", { key: '1ff3d090a3d26c422bb60bda942015315462e1da', class: 'text__error-message' }, this.errorMessage));
14318
+ return h$1("div", { key: '65f086c89daa3c3ebc40e6f0c58fbd24ff6e9050', class: `text__wrapper ${this.name}__input ${this.autofilled ? 'text__wrapper--autofilled' : ''}`, ref: el => this.stylingContainer = el }, h$1("div", { key: '970d4aa2de6419ab7904e1315c669aadc7f462b3', class: 'text__wrapper--flex' }, h$1("label", { key: '6e3d033ebcf3ecd4a8c3f3a3a35f1e2e4bc8261a', class: `text__label ${this.validation.mandatory ? 'text__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h$1("div", { key: '7247b4e12c1caf287534541d0cf019ddeaa78182', class: 'text__wrapper--relative' }, this.tooltip &&
14319
+ h$1("img", { key: '3b96da6c25789e12cbbc3408246650d6d1c72712', class: 'text__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h$1("input", { key: '8fc695313a9e2e19898380dfff97ee76b6e509df', name: this.name, id: `${this.name}__input`, value: this.defaultValue, type: 'text', class: `text__input ${invalidClass}`, placeholder: `${this.placeholder}`, ref: (el) => this.inputReference = el, readOnly: this.autofilled, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, onInput: this.handleInput, onBlur: this.handleBlur }), h$1("small", { key: '90f0552125dbf888c915aa1b2e20446df6a48b9c', class: 'text__error-message' }, this.errorMessage));
14296
14320
  }
14297
14321
  static get watchers() { return {
14298
14322
  "clientStyling": ["handleStylingChange"],
@@ -14400,8 +14424,8 @@ const ToggleCheckboxInput = class {
14400
14424
  return null;
14401
14425
  }
14402
14426
  render() {
14403
- return h$1("div", { key: 'd7084a7f82d45b3d1e7f8ae373b663b2aefdf5ec', class: `togglecheckbox__wrapper ${this.name}__input`, ref: el => this.stylingContainer = el }, h$1("div", { key: 'f065f4611805dd8490234bcec1fecdbcfcaefab8', class: 'togglecheckbox__wrapper--flex' }, h$1("input", { key: 'c5196d5a4cd2f114a610037285ee644fcabc37bd', class: 'togglecheckbox__input', type: "checkbox", id: `${this.name}__input`, ref: (el) => this.checkboxReference = el, name: this.name, checked: this.defaultValue === "true", readOnly: this.autofilled, required: this.validation.mandatory, value: this.value, onClick: () => this.handleClick() }), this.renderLabel()), h$1("small", { key: '06d5db0994272ec9dde1b5cd0d525bb53ff1a058', class: 'togglecheckbox__error-message' }, this.errorMessage), h$1("div", { key: 'aff16ac9ed0adb896f2c1822014c5c8c4d6db2d4', class: 'togglecheckbox__wrapper--relative' }, this.tooltip &&
14404
- h$1("img", { key: '6b049cecc095a2127eb566f50fd0f8feaa8cb3d5', class: 'togglecheckbox__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip()), h$1("div", { key: '372c3eb72cffd482fe1c179047ec3900cef00d46', class: `togglecheckbox__fields-wrapper ${this.showFields ? '' : 'hidden'}` }, this.options.map(subfield => {
14427
+ return h$1("div", { key: '1f359a8390bb4296e94573131009eeff1bd2293c', class: `togglecheckbox__wrapper ${this.name}__input`, ref: el => this.stylingContainer = el }, h$1("div", { key: '76033e62f8d111e3071b1a09a6d8f9b909a05244', class: 'togglecheckbox__wrapper--flex' }, h$1("input", { key: '6d944818346ce6e62117856ff5dfd2278c1ccad4', class: 'togglecheckbox__input', type: "checkbox", id: `${this.name}__input`, ref: (el) => this.checkboxReference = el, name: this.name, checked: this.defaultValue === "true", readOnly: this.autofilled, required: this.validation.mandatory, value: this.value, onClick: () => this.handleClick() }), this.renderLabel()), h$1("small", { key: '7e2b7612f6dc179035027b551a6ac9801a1ba3c5', class: 'togglecheckbox__error-message' }, this.errorMessage), h$1("div", { key: '3a77da5b3544107d49137e6024888f8e774be170', class: 'togglecheckbox__wrapper--relative' }, this.tooltip &&
14428
+ h$1("img", { key: '7edd9a8cce9d66e7f6fb2d61a4513754df62d5df', class: 'togglecheckbox__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip()), h$1("div", { key: '49de8d42d4b9f4c5668de6379f015c92098578a6', class: `togglecheckbox__fields-wrapper ${this.showFields ? '' : 'hidden'}` }, this.options.map(subfield => {
14405
14429
  return h$1("general-input", { type: subfield.inputType, name: subfield.name, displayName: subfield.displayName, validation: subfield.validate, action: subfield.action || null, defaultValue: subfield.defaultValue, autofilled: subfield.autofill, emitValue: this.emitValue, language: this.language, "client-styling": this.clientStyling, tooltip: subfield.tooltip, placeholder: subfield.placeholder == null ? '' : subfield.placeholder, ref: el => this.subFieldsObject[subfield.name] = el });
14406
14430
  })));
14407
14431
  }
@@ -1 +1 @@
1
- import{p as e,b as l}from"./p-59a2915a.js";export{s as setNonce}from"./p-59a2915a.js";import{g as i}from"./p-e1255160.js";(()=>{const l=import.meta.url,i={};return""!==l&&(i.resourcesUrl=new URL(".",l).href),e(i)})().then((async e=>(await i(),l([["p-5359c468",[[1,"general-registration",{endpoint:[513],language:[513],clientStyling:[1537,"client-styling"],mbSource:[1,"mb-source"],clientStylingUrl:[513,"client-styling-url"],translationUrl:[513,"translation-url"],dateFormat:[513,"date-format"],buttonInsideForm:[516,"button-inside-form"],btag:[513],emitOnClick:[516,"emit-on-click"],errorMessage:[32],isFormValid:[32],isConsentValid:[32],isConsentReady:[32],isLoading:[32],isLoadingPOST:[32],registrationStep:[32],forms:[32],limitStylingAppends:[32],autofilled:[32],isInitalInteraction:[32]},[[0,"sendValidityState","checkInputsValidityHandler"],[0,"sendInputValue","getInputsValueHandler"],[8,"message","messageHandler"]],{registrationStep:["sendStep"],clientStyling:["handleStylingChange"],clientStylingUrl:["handleStylingUrlChange"],forms:["setFormValidity"],btag:["addBtag"]}],[1,"general-input",{type:[513],name:[513],displayName:[513,"display-name"],placeholder:[513],action:[513],validation:[16],options:[520],language:[513],autofilled:[516],tooltip:[513],defaultValue:[520,"default-value"],emitValue:[516,"emit-value"],isDuplicateInput:[516,"is-duplicate-input"],clientStyling:[520,"client-styling"],dateFormat:[513,"date-format"],translationUrl:[513,"translation-url"],emitOnClick:[516,"emit-on-click"]}],[1,"toggle-checkbox-input",{name:[513],displayName:[513,"display-name"],defaultValue:[513,"default-value"],options:[16],autofilled:[516],tooltip:[513],validation:[16],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32],showFields:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"]}],[1,"checkbox-group-input",{name:[513],displayName:[513,"display-name"],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],options:[16],validation:[16],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32],selectedValues:[32],showCheckboxes:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],selectedValues:["setValue"],emitValue:["emitValueHandler"]}],[1,"checkbox-input",{name:[513],displayName:[513,"display-name"],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],validation:[16],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"date-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],validation:[16],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],dateFormat:[513,"date-format"],emitOnClick:[516,"emit-on-click"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"email-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],validation:[16],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],language:[513],emitValue:[516,"emit-value"],isDuplicateInput:[516,"is-duplicate-input"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"],[16,"sendInputValue","valueChangedHandler"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"number-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],validation:[16],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"password-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],validation:[16],language:[513],emitValue:[516,"emit-value"],isDuplicateInput:[516,"is-duplicate-input"],clientStyling:[513,"client-styling"],isValid:[32],errorMessage:[32],limitStylingAppends:[32],showTooltip:[32],passwordComplexity:[32],showPopup:[32],value:[32]},[[16,"sendOriginalValidityState","originalValidityChangedHandler"],[16,"sendInputValue","valueChangedHandler"],[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],value:["valueChanged"],emitValue:["emitValueHandler"]}],[1,"radio-input",{name:[513],displayName:[513,"display-name"],optionsGroup:[16],validation:[16],tooltip:[513],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"select-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],action:[513],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],options:[16],validation:[16],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"tel-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],showLabels:[516,"show-labels"],action:[513],validation:[16],defaultValue:[520,"default-value"],autofilled:[516],tooltip:[513],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],isValid:[32],errorMessage:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"text-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],validation:[16],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],language:[513],checkValidity:[516,"check-validity"],emitValue:[516,"emit-value"],isDuplicateInput:[516,"is-duplicate-input"],clientStyling:[513,"client-styling"],isValid:[32],errorMessage:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"],[16,"sendInputValue","valueChangedHandler"],[16,"validationChange","handleValidationChange"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}]]]],e))));
1
+ import{p as e,b as l}from"./p-59a2915a.js";export{s as setNonce}from"./p-59a2915a.js";import{g as i}from"./p-e1255160.js";(()=>{const l=import.meta.url,i={};return""!==l&&(i.resourcesUrl=new URL(".",l).href),e(i)})().then((async e=>(await i(),l([["p-6dad2d58",[[1,"general-registration",{endpoint:[513],language:[513],clientStyling:[1537,"client-styling"],mbSource:[1,"mb-source"],clientStylingUrl:[513,"client-styling-url"],translationUrl:[513,"translation-url"],dateFormat:[513,"date-format"],buttonInsideForm:[516,"button-inside-form"],btag:[513],emitOnClick:[516,"emit-on-click"],errorMessage:[32],isFormValid:[32],isConsentValid:[32],isConsentReady:[32],isLoading:[32],isLoadingPOST:[32],registrationStep:[32],forms:[32],limitStylingAppends:[32],autofilled:[32],isInitalInteraction:[32]},[[0,"sendValidityState","checkInputsValidityHandler"],[0,"sendInputValue","getInputsValueHandler"],[8,"message","messageHandler"]],{registrationStep:["sendStep"],clientStyling:["handleStylingChange"],clientStylingUrl:["handleStylingUrlChange"],forms:["setFormValidity"],btag:["addBtag"]}],[1,"general-input",{type:[513],name:[513],displayName:[513,"display-name"],placeholder:[513],action:[513],validation:[16],options:[520],language:[513],autofilled:[516],tooltip:[513],defaultValue:[520,"default-value"],emitValue:[516,"emit-value"],isDuplicateInput:[516,"is-duplicate-input"],clientStyling:[520,"client-styling"],dateFormat:[513,"date-format"],translationUrl:[513,"translation-url"],emitOnClick:[516,"emit-on-click"]}],[1,"toggle-checkbox-input",{name:[513],displayName:[513,"display-name"],defaultValue:[513,"default-value"],options:[16],autofilled:[516],tooltip:[513],validation:[16],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32],showFields:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"]}],[1,"checkbox-group-input",{name:[513],displayName:[513,"display-name"],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],options:[16],validation:[16],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32],selectedValues:[32],showCheckboxes:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],selectedValues:["setValue"],emitValue:["emitValueHandler"]}],[1,"checkbox-input",{name:[513],displayName:[513,"display-name"],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],validation:[16],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"date-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],validation:[16],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],dateFormat:[513,"date-format"],emitOnClick:[516,"emit-on-click"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"email-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],validation:[16],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],language:[513],emitValue:[516,"emit-value"],isDuplicateInput:[516,"is-duplicate-input"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"],[16,"sendInputValue","valueChangedHandler"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"number-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],validation:[16],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"password-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],validation:[16],language:[513],emitValue:[516,"emit-value"],isDuplicateInput:[516,"is-duplicate-input"],clientStyling:[513,"client-styling"],isValid:[32],errorMessage:[32],limitStylingAppends:[32],showTooltip:[32],passwordComplexity:[32],showPopup:[32],value:[32]},[[16,"sendOriginalValidityState","originalValidityChangedHandler"],[16,"sendInputValue","valueChangedHandler"],[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],value:["valueChanged"],emitValue:["emitValueHandler"]}],[1,"radio-input",{name:[513],displayName:[513,"display-name"],optionsGroup:[16],validation:[16],tooltip:[513],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"select-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],action:[513],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],options:[16],validation:[16],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],errorMessage:[32],isValid:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"tel-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],showLabels:[516,"show-labels"],action:[513],validation:[16],defaultValue:[520,"default-value"],autofilled:[516],tooltip:[513],language:[513],emitValue:[516,"emit-value"],clientStyling:[513,"client-styling"],isValid:[32],errorMessage:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}],[1,"text-input",{name:[513],displayName:[513,"display-name"],placeholder:[513],validation:[16],defaultValue:[513,"default-value"],autofilled:[516],tooltip:[513],language:[513],checkValidity:[516,"check-validity"],emitValue:[516,"emit-value"],isDuplicateInput:[516,"is-duplicate-input"],clientStyling:[513,"client-styling"],isValid:[32],errorMessage:[32],limitStylingAppends:[32],showTooltip:[32]},[[4,"click","handleClickOutside"],[16,"sendInputValue","valueChangedHandler"],[16,"validationChange","handleValidationChange"]],{clientStyling:["handleStylingChange"],isValid:["validityChanged"],emitValue:["emitValueHandler"]}]]]],e))));