@everymatrix/general-input 1.80.10 → 1.80.11

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.
Files changed (27) hide show
  1. package/dist/cjs/{checkbox-group-input_13.cjs.entry.js → checkbox-group-input_14.cjs.entry.js} +422 -19
  2. package/dist/cjs/general-input.cjs.js +1 -1
  3. package/dist/cjs/index-3b546c2c.js +2 -2
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/collection/collection-manifest.json +1 -0
  6. package/dist/collection/components/general-input/general-input.js +64 -4
  7. package/dist/collection/components/postalcode-input/postalcode-input.css +221 -0
  8. package/dist/collection/components/postalcode-input/postalcode-input.js +673 -0
  9. package/dist/collection/components/radio-input/radio-input.js +2 -2
  10. package/dist/collection/components/select-input/select-input.js +3 -3
  11. package/dist/collection/components/tel-input/tel-input.js +2 -2
  12. package/dist/collection/components/text-input/text-input.css +17 -0
  13. package/dist/collection/components/text-input/text-input.js +79 -6
  14. package/dist/collection/components/toggle-checkbox-input/toggle-checkbox-input.js +2 -2
  15. package/dist/collection/components/twofa-input/twofa-input.js +2 -2
  16. package/dist/collection/utils/locale.utils.js +3 -0
  17. package/dist/esm/{checkbox-group-input_13.entry.js → checkbox-group-input_14.entry.js} +422 -20
  18. package/dist/esm/general-input.js +1 -1
  19. package/dist/esm/index-ca174b7a.js +2 -2
  20. package/dist/esm/loader.js +1 -1
  21. package/dist/general-input/{checkbox-group-input_13.entry.js → checkbox-group-input_14.entry.js} +165 -165
  22. package/dist/general-input/general-input.esm.js +1 -1
  23. package/dist/types/components/general-input/general-input.d.ts +18 -2
  24. package/dist/types/components/postalcode-input/postalcode-input.d.ts +111 -0
  25. package/dist/types/components/text-input/text-input.d.ts +12 -0
  26. package/dist/types/components.d.ts +165 -4
  27. package/package.json +1 -1
@@ -78,8 +78,8 @@ export class RadioInput {
78
78
  return null;
79
79
  }
80
80
  render() {
81
- return h("fieldset", { key: '8dd2ac2660557c45e3e7e1a514d94e8e0f90d4f2', class: `radio__fieldset ${this.name}__input`, ref: el => this.stylingContainer = el }, h("legend", { key: '609396bda45ad1d2ceb49a023bdc090833724ed4', class: 'radio__legend' }, this.displayName, ":"), this.optionsGroup.map(option => h("div", { class: 'radio__wrapper' }, h("input", { type: "radio", class: 'radio__input', id: `${option.label}__input`, ref: (el) => this.inputReference = el, value: option.value, name: this.name, required: this.validation.mandatory, onClick: (e) => this.handleClick(e) }), h("label", { htmlFor: `${option.label}__input` }, option.label))), h("small", { key: 'e3c097e5f460316759d74e1f06a4f9f805deb29e', class: 'radio__error-message' }, this.errorMessage), this.tooltip &&
82
- h("img", { key: 'a71bf8fe647776214c36a87befff42b39b95106a', class: 'radio__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip());
81
+ return h("fieldset", { key: '88357307488334074a397c636210575b8af1e2c3', class: `radio__fieldset ${this.name}__input`, ref: el => this.stylingContainer = el }, h("legend", { key: '25f656d5b155c392cad79c89410833c3491531f8', class: 'radio__legend' }, this.displayName, ":"), this.optionsGroup.map(option => h("div", { class: 'radio__wrapper' }, h("input", { type: "radio", class: 'radio__input', id: `${option.label}__input`, ref: (el) => this.inputReference = el, value: option.value, name: this.name, required: this.validation.mandatory, onClick: (e) => this.handleClick(e) }), h("label", { htmlFor: `${option.label}__input` }, option.label))), h("small", { key: '08def575050905f964d6921d4ed4f071fccdf4da', class: 'radio__error-message' }, this.errorMessage), this.tooltip &&
82
+ h("img", { key: '485fa4888f626f1cf44f179f498f257af6c41b58', class: 'radio__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip());
83
83
  }
84
84
  static get is() { return "radio-input"; }
85
85
  static get encapsulation() { return "shadow"; }
@@ -183,10 +183,10 @@ export class SelectInput {
183
183
  if (this.touched) {
184
184
  invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
185
185
  }
186
- return h("div", { key: '493268c1af30e1120317b916ed911598737405bd', class: `select__wrapper ${this.autofilled ? 'select__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h("div", { key: '232dc6989da291dfaececee8199081394d33ee41', class: 'select__wrapper--flex' }, h("label", { key: 'fb03628e1953f679c21bd8da88bfe47f1bcbab4e', class: 'select__label', htmlFor: `${this.name}__input` }, `${this.displayName} ${this.validation.mandatory ? '*' : ''}`), h("div", { key: '02581db26e8093b6968fd91fbd08782dfc24118e', class: 'select__wrapper--relative' }, this.tooltip &&
187
- h("img", { key: '4da026564dcee19491e055070341317266a888f9', class: 'select__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), this.isComboBox ? 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 })
186
+ return h("div", { key: '68a8d63f045706ea65a8a9edf3aeec381ff93c52', class: `select__wrapper ${this.autofilled ? 'select__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h("div", { key: '1e4c7d1ad9add75ff495ab2aec2bc1556339c8d7', class: 'select__wrapper--flex' }, h("label", { key: '8698e76f945ed1c9d94597ca9f12d8c03d54ce31', class: 'select__label', htmlFor: `${this.name}__input` }, `${this.displayName} ${this.validation.mandatory ? '*' : ''}`), h("div", { key: 'bf34dd8c2155e9eca8d9da427e9775ee5685c3c6', class: 'select__wrapper--relative' }, this.tooltip &&
187
+ h("img", { key: 'f396770070f3e2710120bb87d059f78aa1b5e372', class: 'select__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), this.isComboBox ? 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 })
188
188
  :
189
- h("vaadin-select", { name: this.name, popover: false, 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, "no-vertical-overlap": true, noVerticalOverlap: true }), h("small", { key: 'f0f0de66fe7a135a2d514e41725be1c7b29c17c0', class: 'select__error-message' }, this.errorMessage));
189
+ h("vaadin-select", { name: this.name, popover: false, 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, "no-vertical-overlap": true, noVerticalOverlap: true }), h("small", { key: '21327ad926828b95552046b42ac14f69d7012513', class: 'select__error-message' }, this.errorMessage));
190
190
  }
191
191
  static get is() { return "select-input"; }
192
192
  static get encapsulation() { return "shadow"; }
@@ -178,8 +178,8 @@ export class TelInput {
178
178
  if (this.touched) {
179
179
  invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
180
180
  }
181
- return h("div", { key: '698bb9cc01d144ccf2f20fbac7d519c8b4523c23', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h("div", { key: '08792dad79d529f079011d1bd82a77b74865f1f0', class: 'tel__wrapper--flex-label' }, h("label", { key: '5528ee07e57b5855d03bb55c5d77608019983bde', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h("div", { key: '5e62f2fe0751d9108422db4670c17ce623e97e8d', class: 'tel__wrapper--relative' }, this.tooltip &&
182
- h("img", { key: '050486adda9b04f3ce3502bf7fe25450e564c54b', class: 'tel__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h("div", { key: '8944d4b99907ab9c355ac392379064150bc73d70', class: `tel__wrapper--flex ${invalidClass}` }, h("vaadin-combo-box", { key: 'adcbc0cb5f371c10fe5a21a577647f5354a45428', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.disablePhonePrefix, onChange: (e) => this.handlePrefixInput(e) }), h("input", { key: '701228afeca7ccb0bccfde015fec41638a7901ec', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: (_a = this.phoneValue) !== null && _a !== void 0 ? _a : '', placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), h("small", { key: '5230fb8be4b5b47cedc088f5ed777a3462492ed5', class: 'tel__error-message' }, this.errorMessage));
181
+ return h("div", { key: '9b01d1059b470ec9f57c6f852df12aa17d7a58e2', class: `tel__wrapper ${this.autofilled ? 'tel__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h("div", { key: '7ad94c73b7b14f63d1b0aa395cd4b2220d80bf7f', class: 'tel__wrapper--flex-label' }, h("label", { key: '2995bfd5f655c71a454281edf967ab4afff2b61c', class: `tel__label ${this.validation.mandatory ? 'tel__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h("div", { key: '45c874ffd76f0c56eb971728acc6bcf3c31afc64', class: 'tel__wrapper--relative' }, this.tooltip &&
182
+ h("img", { key: '3ecfbb61507ea4fbe02c804679293adf7961ce18', class: 'tel__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h("div", { key: 'b2dc1d8af7ea60bc56347ae73c315cf5539d6e7a', class: `tel__wrapper--flex ${invalidClass}` }, h("vaadin-combo-box", { key: '3ad4d43799026bd4f3b06d9ad94eee17e81daced', class: 'tel__prefix', items: this.phoneCodesOptions, value: this.prefixValue, readOnly: this.disablePhonePrefix, onChange: (e) => this.handlePrefixInput(e) }), h("input", { key: '6773fa69b3f657ccc4798db91b3c9966ef1ad6bc', type: "tel", ref: (el) => this.inputReference = el, id: `${this.name}__input`, readOnly: this.autofilled, class: `tel__input`, value: (_a = this.phoneValue) !== null && _a !== void 0 ? _a : '', placeholder: `${this.placeholder}`, required: this.validation.mandatory, minlength: this.validation.minLength, maxlength: this.validation.maxLength, pattern: this.validationPattern, onInput: this.handleInput, onBlur: this.handleBlur })), h("small", { key: '799b137bb4cf96cb7cffa77a6934eeab3e34f4ee', class: 'tel__error-message' }, this.errorMessage));
183
183
  }
184
184
  static get is() { return "tel-input"; }
185
185
  static get encapsulation() { return "shadow"; }
@@ -94,4 +94,21 @@
94
94
  }
95
95
  .text__tooltip.visible {
96
96
  opacity: 1;
97
+ }
98
+
99
+ .pulse-border {
100
+ border: 1px solid var(--emw--registration-red-600, #cc4c4c);
101
+ animation: pulse 0.5s ease-in-out 2 forwards;
102
+ }
103
+
104
+ @keyframes pulse {
105
+ 0% {
106
+ border-color: var(--emw--registration-red-600, #cc4c4c);
107
+ }
108
+ 50% {
109
+ border-color: var(--emw--registration-red-400, #e57373);
110
+ }
111
+ 100% {
112
+ border-color: var(--emw--color-gray-100, #E6E6E6);
113
+ }
97
114
  }
@@ -6,6 +6,7 @@ export class TextInput {
6
6
  this.value = '';
7
7
  this.validationPattern = '';
8
8
  this.duplicateInputValue = null;
9
+ this.postalcodelength = 5;
9
10
  this.touched = false;
10
11
  this.handleInput = (event) => {
11
12
  this.value = event.target.value;
@@ -44,10 +45,12 @@ export class TextInput {
44
45
  this.emitValue = undefined;
45
46
  this.isDuplicateInput = undefined;
46
47
  this.clientStyling = '';
48
+ this.haspostalcodelookup = undefined;
47
49
  this.isValid = undefined;
48
50
  this.errorMessage = '';
49
51
  this.limitStylingAppends = false;
50
52
  this.showTooltip = false;
53
+ this.selectedCountryCode = '';
51
54
  }
52
55
  handleStylingChange(newValue, oldValue) {
53
56
  if (newValue !== oldValue)
@@ -102,6 +105,42 @@ export class TextInput {
102
105
  this.errorMessage = this.setErrorMessage();
103
106
  }
104
107
  }
108
+ handleCountryCodeUpdate(event) {
109
+ const { name, value } = event.detail;
110
+ this.selectedCountryCode = value;
111
+ if (name === 'CountryCode' && ['address1', 'address2', 'City'].includes(this.name)) {
112
+ this.value = '';
113
+ this.touched = false;
114
+ this.errorMessage = '';
115
+ this.isValid = false;
116
+ if (this.inputReference) {
117
+ this.inputReference.value = '';
118
+ }
119
+ this.valueHandler({ name: this.name, value: '' });
120
+ this.validityStateHandler({ valid: false, name: this.name });
121
+ }
122
+ }
123
+ handleAddressSelection(event) {
124
+ const { city, address1, address2 } = event.detail;
125
+ if (!['address1', 'address2', 'City'].includes(this.name)) {
126
+ return;
127
+ }
128
+ let newValue = '';
129
+ if (this.name === 'address1') {
130
+ newValue = address1;
131
+ }
132
+ else if (this.name === 'address2') {
133
+ newValue = address2;
134
+ }
135
+ else if (this.name === 'City') {
136
+ newValue = city;
137
+ }
138
+ this.value = newValue;
139
+ this.touched = true;
140
+ this.isValid = true;
141
+ this.valueHandler({ name: this.name, value: newValue });
142
+ this.validityStateHandler({ valid: true, name: this.name });
143
+ }
105
144
  connectedCallback() {
106
145
  this.validationPattern = this.setPattern();
107
146
  }
@@ -122,12 +161,15 @@ export class TextInput {
122
161
  this.touched = true;
123
162
  }
124
163
  }
164
+ if (this.haspostalcodelookup) {
165
+ if (['address1', 'address2', 'City', 'PostalCode'].includes(this.name)) {
166
+ window.targetInputRefs = window.targetInputRefs || {};
167
+ window.targetInputRefs[this.name] = this.inputReference;
168
+ }
169
+ }
125
170
  this.isValid = this.setValidity();
126
171
  }
127
172
  setValidity() {
128
- if (this.isDuplicateInput && this.duplicateInputValue !== this.value) {
129
- return false;
130
- }
131
173
  if (!this.inputReference) {
132
174
  return false;
133
175
  }
@@ -171,8 +213,9 @@ export class TextInput {
171
213
  if (this.touched) {
172
214
  invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
173
215
  }
174
- return h("div", { key: 'a769be49d47bf5eac45467f9355aa2d51cb1ff81', class: `text__wrapper ${this.name}__input ${this.autofilled ? 'text__wrapper--autofilled' : ''}`, ref: el => this.stylingContainer = el }, h("div", { key: '3885727132e83f4381c455ec04fe49bb3feb58a2', class: 'text__wrapper--flex' }, h("label", { key: '36132d614d6f921af8dda5fef9466fdbc8b83f2f', class: `text__label ${this.validation.mandatory ? 'text__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h("div", { key: 'ac112a8be59094ee2c347c1853e1f36781246831', class: 'text__wrapper--relative' }, this.tooltip &&
175
- h("img", { key: '31d5bc82b517facc92cc84e4191bc33946bbc06c', class: 'text__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h("input", { key: '3bea6c3cbd01c55ac8e120078afdb784b5d65aee', 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("small", { key: '6139392a22701626a0001d41c558593be83aabf2', class: 'text__error-message' }, this.errorMessage));
216
+ const displayValue = this.value || this.defaultValue;
217
+ return h("div", { key: '2126d45a756f9f10a1428f6f2f296d119833949e', class: `text__wrapper ${this.name}__input ${this.autofilled ? 'text__wrapper--autofilled' : ''}`, ref: el => this.stylingContainer = el }, h("div", { key: '86adc0243bf02a5d68e8fe2ad25fddbf042041ca', class: 'text__wrapper--flex' }, h("label", { key: '81bf4d3010bd780471d97d7356062ed6c762151b', class: `text__label ${this.validation.mandatory ? 'text__label--required' : ''}`, htmlFor: `${this.name}__input` }, this.displayName), h("div", { key: '2b1cc8ad108901ab8bd0d42b5d59d5f59faf923c', class: 'text__wrapper--relative' }, this.tooltip &&
218
+ h("img", { key: 'dc3714a7e7924972454c0532ced7c1928f998e01', class: 'text__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip())), h("input", { key: 'c615746d8604f9ef6fb1ec2ad3075ba4aa1dc928', name: this.name, id: `${this.name}__input`, value: displayValue, 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("small", { key: '4f4e50d2593f32a40ec8c71aa452ac890cb51751', class: 'text__error-message' }, this.errorMessage));
176
219
  }
177
220
  static get is() { return "text-input"; }
178
221
  static get encapsulation() { return "shadow"; }
@@ -397,6 +440,23 @@ export class TextInput {
397
440
  "attribute": "client-styling",
398
441
  "reflect": true,
399
442
  "defaultValue": "''"
443
+ },
444
+ "haspostalcodelookup": {
445
+ "type": "boolean",
446
+ "mutable": false,
447
+ "complexType": {
448
+ "original": "boolean",
449
+ "resolved": "boolean",
450
+ "references": {}
451
+ },
452
+ "required": false,
453
+ "optional": false,
454
+ "docs": {
455
+ "tags": [],
456
+ "text": "Boolean. Enable the addresses dropdown based on postal code"
457
+ },
458
+ "attribute": "haspostalcodelookup",
459
+ "reflect": true
400
460
  }
401
461
  };
402
462
  }
@@ -405,7 +465,8 @@ export class TextInput {
405
465
  "isValid": {},
406
466
  "errorMessage": {},
407
467
  "limitStylingAppends": {},
408
- "showTooltip": {}
468
+ "showTooltip": {},
469
+ "selectedCountryCode": {}
409
470
  };
410
471
  }
411
472
  static get events() {
@@ -484,6 +545,18 @@ export class TextInput {
484
545
  "target": "body",
485
546
  "capture": false,
486
547
  "passive": false
548
+ }, {
549
+ "name": "countryCodeUpdated",
550
+ "method": "handleCountryCodeUpdate",
551
+ "target": "window",
552
+ "capture": false,
553
+ "passive": false
554
+ }, {
555
+ "name": "sendAddressValue",
556
+ "method": "handleAddressSelection",
557
+ "target": "body",
558
+ "capture": false,
559
+ "passive": false
487
560
  }];
488
561
  }
489
562
  }
@@ -93,8 +93,8 @@ export class ToggleCheckboxInput {
93
93
  return null;
94
94
  }
95
95
  render() {
96
- return h("div", { key: '355926a9da2977c88b7ae205ddd6468d1a86e2d2', class: `togglecheckbox__wrapper ${this.name}__input`, ref: el => this.stylingContainer = el }, h("div", { key: '3bbf491f4fdf22800ad091de584bcac3c2018308', class: 'togglecheckbox__wrapper--flex' }, h("input", { key: '14654df4ce258c95c7bc23ffd2420c5f0d5eb65e', 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("small", { key: 'db4624ed73f644db0a8f0b92738497fca64ea035', class: 'togglecheckbox__error-message' }, this.errorMessage), h("div", { key: '898d353c570f9ce19c758585f721f6cb50c35fb0', class: 'togglecheckbox__wrapper--relative' }, this.tooltip &&
97
- h("img", { key: '1007896417922d0e2bcaaf4c65a5f362e5e3bb49', class: 'togglecheckbox__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip()), h("div", { key: '260480a129168c8868ae0539ba9f9edbec35f87b', class: `togglecheckbox__fields-wrapper ${this.showFields ? '' : 'hidden'}` }, this.options.map(subfield => {
96
+ return h("div", { key: '58e1c4145712f9547f59eaf43015d46c13e04f2c', class: `togglecheckbox__wrapper ${this.name}__input`, ref: el => this.stylingContainer = el }, h("div", { key: '5230bc70f55ee7d3d4db2eed2b17c3e4f3ce9a23', class: 'togglecheckbox__wrapper--flex' }, h("input", { key: '063c24818b3f4c5fa8362751640c8e51b9ff2868', 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("small", { key: 'df35a1484f167b4bad9e4c82d82e069260be6608', class: 'togglecheckbox__error-message' }, this.errorMessage), h("div", { key: '6783791e9d5e882cc47cfdf501737c0309deb9ec', class: 'togglecheckbox__wrapper--relative' }, this.tooltip &&
97
+ h("img", { key: '8bc868f9d6828fe65a6ad684c0c50d6dbf434239', class: 'togglecheckbox__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip()), h("div", { key: '9258e49a1730b9bcec06ae2be98644a729a8741b', class: `togglecheckbox__fields-wrapper ${this.showFields ? '' : 'hidden'}` }, this.options.map(subfield => {
98
98
  return 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 });
99
99
  })));
100
100
  }
@@ -195,9 +195,9 @@ export class TwofaInput {
195
195
  return null;
196
196
  }
197
197
  render() {
198
- return (h("div", { key: '0f7d2f80e6335fcb08b1c61f6e52f51205a30092', class: "twofa" }, h("div", { key: 'd23240ccceb2ac4af5c5a2a1800eccd6013271e3', class: 'twofa__error-message' }, h("p", { key: '72fafd1608f5ae7402be900800100a141fefb72a' }, this.errorMessage)), h("div", { key: '98f5a5614fb895672a175d0415f66b5849b82f85', class: "twofa__description", innerHTML: translate('twofaDescription', this.language, { values: { destination: this.destination } }) }), h("div", { key: '5fd4f8999dc44e372369f03223d53c1d56a1eab4', class: "twofa__input-wrapper", ref: this.setContainerRef }, this.code.map((char, idx) => {
198
+ return (h("div", { key: '6f6970837475ec226a3e9320da15998942d92464', class: "twofa" }, h("div", { key: '24d47b33f8bdd451cbb5b6d465b3f1a740e64ab0', class: 'twofa__error-message' }, h("p", { key: '1e3861424d30847e0a305f1cdd993cd3d618e897' }, this.errorMessage)), h("div", { key: 'ee066577765ba5b043e25c485fed8469577b4fd4', class: "twofa__description", innerHTML: translate('twofaDescription', this.language, { values: { destination: this.destination } }) }), h("div", { key: '57aa9f39ce301ec25c5116c1945467499432d26a', class: "twofa__input-wrapper", ref: this.setContainerRef }, this.code.map((char, idx) => {
199
199
  return (h("input", { key: idx, ref: el => this.setInputRef(el, idx), id: `otp-input-${idx}`, type: "text", maxLength: 2, value: char, onInput: (event) => this.handleInput(event, idx), onKeyDown: (event) => this.handleKeyDown(event, idx), onPaste: (event) => this.handlePaste(event) }));
200
- })), h("div", { key: 'b6e5b2ba4e10cbbd092aaef4d13e0f6a640b3c29', class: "twofa__button-wrapper" }, h("p", { key: 'eba4ae1393d89db6729cfff7d5bc4eb5a4ab0b43', class: "twofa__resend-message" }, translate('twofaResendMessage', this.language)), h("button", { key: '58069e9cb76ecf1776f0733a9f8bc20387e71ad3', class: "twofa__resend-button", onClick: this.resendCodeHandler, disabled: !this.isResendButtonAvailable }, this.isResendButtonAvailable
200
+ })), h("div", { key: '3217a0a6fbf088158bfb9319a937ff876fe352ad', class: "twofa__button-wrapper" }, h("p", { key: 'cae0c235946f0f6596505790e64991b8008fc728', class: "twofa__resend-message" }, translate('twofaResendMessage', this.language)), h("button", { key: '4b7bb013e04a61e03f7a6961de898fa7b8d80d23', class: "twofa__resend-button", onClick: this.resendCodeHandler, disabled: !this.isResendButtonAvailable }, this.isResendButtonAvailable
201
201
  ? translate('twofaResendButton', this.language)
202
202
  : this.formatTime()))));
203
203
  }
@@ -26,6 +26,9 @@ export const TRANSLATIONS = {
26
26
  "twofaDescription": "<p> We have sent the verification code to <p> {destination}. </p> </p> <p> Please insert the PIN below. </p>",
27
27
  "twofaResendMessage": "Didn't receive the verification code?",
28
28
  "twofaResendButton": "Resend",
29
+ "enterIEAddressManually": "For IRE, enter the address manually",
30
+ "postalLookUpNoAddressFound": "No addresses found for this postal code",
31
+ "searchingForAddresses": "Searching for addresses...",
29
32
  },
30
33
  "hu": {
31
34
  "dateError": "A választott dátumnak {min} és {max} között kell lennie",