@everymatrix/general-input-hsl 0.2.3 → 0.2.5

package/dist/cjs/index.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const generalInputHsl = require('./general-input-hsl-a20b01f4.js');
+const generalInputHsl = require('./general-input-hsl-fd627b3d.js');
 require('./index-160616a9.js');
 
 

package/dist/collection/components/date-input/date-input.js

@@ -147,7 +147,9 @@ export class DateInput {
             return translate('dateError2', this.language);
         }
         if (!isMatch(this.formattedValue, this.dateFormat)) {
-            return translate('dateFormatError', this.language);
+            const screenSize = window.screen.width;
+            const isShowingKeyboard = screenSize > 450 && screenSize <= 550;
+            return `${translate('dateFormatError', this.language)} ${isShowingKeyboard ? `(${translate('forExample', this.language)} ${this.placeholder})` : ''}`;
         }
     }
     renderTooltip() {
@@ -161,8 +163,8 @@ export class DateInput {
         if (this.touched) {
             invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
         }
-        return h("div", { key: 'f2a2e6f7adf273e07934af51763f900f9051e5b1', class: `date__wrapper  ${this.autofilled ? 'date__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h("label", { key: '70b360618031d48816fedf22d55119af01514de1', class: `date__label ${this.validation.mandatory ? 'date__label--required' : ''}}`, htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), h("vaadin-date-picker", { key: 'c463d260a39cde5ccb98dde604d74cdb8ebde287', id: `${this.name}__input`, type: 'date', class: `date__input ${invalidClass}`, value: this.defaultValue, readOnly: this.autofilled, placeholder: `${this.placeholder}`, required: this.validation.mandatory, max: this.validation.max, min: this.validation.min, onChange: (e) => this.handleInput(e) }), h("small", { key: 'cb7fb9acafcedfa80321f5f1d16b705ad00d8bdd', class: 'date__error-message' }, this.errorMessage), this.tooltip &&
-            h("img", { key: '535e3a1875cd328c3dd5627672afdc4fd32b078c', class: 'date__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip());
+        return h("div", { key: '301d146ebbab317532abcc4a6c89ee39701d209f', class: `date__wrapper  ${this.autofilled ? 'date__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h("label", { key: '7d54ab1dd228b629b23c5a58aa9a8289c16f5da9', class: `date__label ${this.validation.mandatory ? 'date__label--required' : ''}}`, htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), h("vaadin-date-picker", { key: '47883cdb6b3391d39fb4e3dddeb2eb499ccd5f0f', id: `${this.name}__input`, type: 'date', class: `date__input ${invalidClass}`, value: this.defaultValue, readOnly: this.autofilled, placeholder: `${this.placeholder}`, required: this.validation.mandatory, max: this.validation.max, min: this.validation.min, onChange: (e) => this.handleInput(e) }), h("small", { key: '6f30b5737c42f11875ae834d2ef973c9bc6f6dd7', class: 'date__error-message' }, this.errorMessage), this.tooltip &&
+            h("img", { key: 'a0de5106dbfbb2f799963cfd5aa6692ae8f68532', class: 'date__tooltip-icon', src: tooltipIcon, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip());
     }
     static get is() { return "date-input"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/utils/locale.utils.js

@@ -25,6 +25,7 @@ export const TRANSLATIONS = {
         "twofaDescription": "<p> We have sent the verification code to <p> {destination}. </p> </p> <p> Please insert the PIN below. </p>",
         "twofaResendMessage": "Didn't receive the verification code?",
         "twofaResendButton": "Resend",
+        "forExample": 'e.g.'
     },
     "hu": {
         "dateError": "A választott dátumnak {min} és {max} között kell lennie",
@@ -50,7 +51,8 @@ export const TRANSLATIONS = {
         "InvalidDocumentNumber": "Csak számjegyek engedélyezettek.",
         "twofaDescription": "<p> A megerősítő kódot elküldtük a következő címre: <p> {destination}. </p> </p> <p> Kérjük, írja be az alábbi PIN-kódot. </p>",
         "twofaResendMessage": "Nem kapta meg a megerősítő kódot?",
-        "twofaResendButton": "Újraküldés"
+        "twofaResendButton": "Újraküldés",
+        "forExample": 'pl.'
     }
 };
 export const translate = (key, customLang, values) => {

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-b001401f.js';
-import { t as translate } from './general-input-hsl-1c14ae9b.js';
-export { G as general_input_hsl } from './general-input-hsl-1c14ae9b.js';
+import { t as translate } from './general-input-hsl-94db3149.js';
+export { G as general_input_hsl } from './general-input-hsl-94db3149.js';
 
 const tooltipIconSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTIiIHZpZXdCb3g9IjAgMCAxMiAxMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGNpcmNsZSBjeD0iNiIgY3k9IjYiIHI9IjUuNSIgc3Ryb2tlPSIjOTc5Nzk3Ii8+CjxyZWN0IHg9IjUiIHk9IjUiIHdpZHRoPSIyIiBoZWlnaHQ9IjUiIGZpbGw9IiM5Nzk3OTciLz4KPGNpcmNsZSBjeD0iNiIgY3k9IjMiIHI9IjEiIGZpbGw9IiM5Nzk3OTciLz4KPC9zdmc+Cg==';
 
@@ -5750,7 +5750,9 @@ const DateInput = class {
             return translate('dateError2', this.language);
         }
         if (!isMatch(this.formattedValue, this.dateFormat)) {
-            return translate('dateFormatError', this.language);
+            const screenSize = window.screen.width;
+            const isShowingKeyboard = screenSize > 450 && screenSize <= 550;
+            return `${translate('dateFormatError', this.language)} ${isShowingKeyboard ? `(${translate('forExample', this.language)} ${this.placeholder})` : ''}`;
         }
     }
     renderTooltip() {
@@ -5764,8 +5766,8 @@ const DateInput = class {
         if (this.touched) {
             invalidClass = this.isValid == true || this.isValid == undefined ? '' : 'text__input--invalid';
         }
-        return h("div", { key: 'f2a2e6f7adf273e07934af51763f900f9051e5b1', class: `date__wrapper  ${this.autofilled ? 'date__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h("label", { key: '70b360618031d48816fedf22d55119af01514de1', class: `date__label ${this.validation.mandatory ? 'date__label--required' : ''}}`, htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), h("vaadin-date-picker", { key: 'c463d260a39cde5ccb98dde604d74cdb8ebde287', id: `${this.name}__input`, type: 'date', class: `date__input ${invalidClass}`, value: this.defaultValue, readOnly: this.autofilled, placeholder: `${this.placeholder}`, required: this.validation.mandatory, max: this.validation.max, min: this.validation.min, onChange: (e) => this.handleInput(e) }), h("small", { key: 'cb7fb9acafcedfa80321f5f1d16b705ad00d8bdd', class: 'date__error-message' }, this.errorMessage), this.tooltip &&
-            h("img", { key: '535e3a1875cd328c3dd5627672afdc4fd32b078c', class: 'date__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip());
+        return h("div", { key: '301d146ebbab317532abcc4a6c89ee39701d209f', class: `date__wrapper  ${this.autofilled ? 'date__wrapper--autofilled' : ''} ${this.name}__input`, ref: el => this.stylingContainer = el }, h("label", { key: '7d54ab1dd228b629b23c5a58aa9a8289c16f5da9', class: `date__label ${this.validation.mandatory ? 'date__label--required' : ''}}`, htmlFor: `${this.name}__input` }, this.displayName, " ", this.validation.mandatory ? '*' : ''), h("vaadin-date-picker", { key: '47883cdb6b3391d39fb4e3dddeb2eb499ccd5f0f', id: `${this.name}__input`, type: 'date', class: `date__input ${invalidClass}`, value: this.defaultValue, readOnly: this.autofilled, placeholder: `${this.placeholder}`, required: this.validation.mandatory, max: this.validation.max, min: this.validation.min, onChange: (e) => this.handleInput(e) }), h("small", { key: '6f30b5737c42f11875ae834d2ef973c9bc6f6dd7', class: 'date__error-message' }, this.errorMessage), this.tooltip &&
+            h("img", { key: 'a0de5106dbfbb2f799963cfd5aa6692ae8f68532', class: 'date__tooltip-icon', src: tooltipIconSvg, alt: "", ref: (el) => this.tooltipIconReference = el, onClick: () => this.showTooltip = !this.showTooltip }), this.renderTooltip());
     }
     get element() { return getElement(this); }
     static get watchers() { return {