@lion/ui 0.6.0-beta.0 → 0.6.1

package/components/input-tel-dropdown/src/LionInputTelDropdown.js

@@ -180,6 +180,7 @@ export class LionInputTelDropdown extends LionInputTel {
 
         return {
           template: templates.dropdown(this._templateDataDropdown),
+          renderAsDirectHostChild: Boolean,
         };
       },
     };
@@ -324,7 +325,10 @@ export class LionInputTelDropdown extends LionInputTel {
    */
   _onDropdownValueChange(event) {
     const isInitializing = event.detail?.initialize || !this._phoneUtil;
-    const dropdownValue = /** @type {RegionCode} */ (event.target.modelValue || event.target.value);
+    const dropdownElement = event.target;
+    const dropdownValue = /** @type {RegionCode} */ (
+      dropdownElement.modelValue || dropdownElement.value
+    );
 
     if (isInitializing || this.activeRegion === dropdownValue) {
       return;
@@ -355,8 +359,13 @@ export class LionInputTelDropdown extends LionInputTel {
     }
 
     // Put focus on text box
-    const overlayController = event.target._overlayCtrl;
-    if (overlayController?.isShown) {
+    //
+    // A LionSelectRich with interactionMode set on windows/linux
+    // will set each item on arrow key up/down to activeElement
+    // which causes the focus to jump every time to the inputNode
+    const overlayController = dropdownElement._overlayCtrl;
+    // @ts-ignore interactionMode only exists on LionSelectRich not on HTMLSelectElement
+    if (overlayController?.isShown && dropdownElement.interactionMode !== 'windows/linux') {
       setTimeout(() => {
         this._inputNode.focus();
       });

package/components/input-tel-dropdown/test/LionInputTelDropdown.test.js

@@ -1,12 +1,12 @@
 import { runInputTelSuite } from '@lion/ui/input-tel-test-suites.js';
-import { html } from 'lit';
 import { repeat } from 'lit/directives/repeat.js';
 import { ref } from 'lit/directives/ref.js';
-
+import { aTimeout, expect, fixture, html } from '@open-wc/testing';
 import { LionInputTelDropdown } from '@lion/ui/input-tel-dropdown.js';
 import { LionOption } from '@lion/ui/listbox.js';
 import { LionSelectRich } from '@lion/ui/select-rich.js';
 import { runInputTelDropdownSuite } from '@lion/ui/input-tel-dropdown-test-suites.js';
+import { mimicUserChangingDropdown } from '@lion/ui/input-tel-dropdown-test-helpers.js';
 import { ScopedElementsMixin } from '../../core/src/ScopedElementsMixin.js';
 
 /**
@@ -62,4 +62,112 @@ describe('WithFormControlInputTelDropdown', () => {
   // @ts-expect-error
   // Runs it for LionSelectRich, which uses .modelValue/@model-value-changed instead of .value/@change
   runInputTelDropdownSuite({ klass: WithFormControlInputTelDropdown });
+
+  it('focuses the textbox right after selection if selected via opened dropdown if interaction-mode is mac', async () => {
+    class InputTelDropdownMac extends LionInputTelDropdown {
+      static templates = {
+        ...(super.templates || {}),
+        /**
+         * @param {TemplateDataForDropdownInputTel} templateDataForDropdown
+         */
+        dropdown: templateDataForDropdown => {
+          const { refs, data } = templateDataForDropdown;
+          // TODO: once spread directive available, use it per ref (like ref(refs?.dropdown?.ref))
+          return html`
+            <lion-select-rich
+              ${ref(refs?.dropdown?.ref)}
+              label="${refs?.dropdown?.labels?.country}"
+              label-sr-only
+              @model-value-changed="${refs?.dropdown?.listeners['model-value-changed']}"
+              style="${refs?.dropdown?.props?.style}"
+              interaction-mode="mac"
+            >
+              ${repeat(
+                data.regionMetaList,
+                regionMeta => regionMeta.regionCode,
+                regionMeta =>
+                  html` <lion-option .choiceValue="${regionMeta.regionCode}"> </lion-option> `,
+              )}
+            </lion-select-rich>
+          `;
+        },
+      };
+    }
+    customElements.define('input-tel-dropdown-mac', InputTelDropdownMac);
+    const el = /** @type {LionInputTelDropdown} */ (
+      await fixture(
+        html`
+          <input-tel-dropdown-mac
+            .allowedRegions="${['NL', 'BE']}"
+            .modelValue="${'+31612345678'}"
+          ></input-tel-dropdown-mac>
+        `,
+      )
+    );
+    const dropdownElement = el.refs.dropdown.value;
+    // @ts-expect-error [allow-protected-in-tests]
+    if (dropdownElement?._overlayCtrl) {
+      // @ts-expect-error [allow-protected-in-tests]
+      dropdownElement._overlayCtrl.show();
+      mimicUserChangingDropdown(dropdownElement, 'BE');
+      await el.updateComplete;
+      await aTimeout(0);
+      // @ts-expect-error [allow-protected-in-tests]
+      expect(el._inputNode).to.equal(document.activeElement);
+    }
+  });
+
+  it('does not focus the textbox right after selection if selected via opened dropdown if interaction-mode is windows/linux', async () => {
+    class InputTelDropdownWindows extends LionInputTelDropdown {
+      static templates = {
+        ...(super.templates || {}),
+        /**
+         * @param {TemplateDataForDropdownInputTel} templateDataForDropdown
+         */
+        dropdown: templateDataForDropdown => {
+          const { refs, data } = templateDataForDropdown;
+          // TODO: once spread directive available, use it per ref (like ref(refs?.dropdown?.ref))
+          return html`
+            <lion-select-rich
+              ${ref(refs?.dropdown?.ref)}
+              label="${refs?.dropdown?.labels?.country}"
+              label-sr-only
+              @model-value-changed="${refs?.dropdown?.listeners['model-value-changed']}"
+              style="${refs?.dropdown?.props?.style}"
+              interaction-mode="windows/linux"
+            >
+              ${repeat(
+                data.regionMetaList,
+                regionMeta => regionMeta.regionCode,
+                regionMeta =>
+                  html` <lion-option .choiceValue="${regionMeta.regionCode}"> </lion-option> `,
+              )}
+            </lion-select-rich>
+          `;
+        },
+      };
+    }
+    customElements.define('input-tel-dropdown-windows', InputTelDropdownWindows);
+    const el = /** @type {LionInputTelDropdown} */ (
+      await fixture(
+        html`
+          <input-tel-dropdown-windows
+            .allowedRegions="${['NL', 'BE']}"
+            .modelValue="${'+31612345678'}"
+          ></input-tel-dropdown-windows>
+        `,
+      )
+    );
+    const dropdownElement = el.refs.dropdown.value;
+    // @ts-expect-error [allow-protected-in-tests]
+    if (dropdownElement?._overlayCtrl) {
+      // @ts-expect-error [allow-protected-in-tests]
+      dropdownElement._overlayCtrl.show();
+      mimicUserChangingDropdown(dropdownElement, 'BE');
+      await el.updateComplete;
+      await aTimeout(0);
+      // @ts-expect-error [allow-protected-in-tests]
+      expect(el._inputNode).to.not.equal(document.activeElement);
+    }
+  });
 });

package/components/input-tel-dropdown/test-helpers/mimicUserChangingDropdown.js

@@ -0,0 +1,22 @@
+/**
+ * @typedef {HTMLSelectElement|HTMLElement & {modelValue:string}} DropdownElement
+ */
+
+/**
+ * @param {DropdownElement} dropdownEl
+ * @param {string} value
+ */
+export function mimicUserChangingDropdown(dropdownEl, value) {
+  if ('modelValue' in dropdownEl) {
+    // eslint-disable-next-line no-param-reassign
+    dropdownEl.modelValue = value;
+    dropdownEl.dispatchEvent(
+      new CustomEvent('model-value-changed', { detail: { isTriggeredByUser: true } }),
+    );
+  } else {
+    // eslint-disable-next-line no-param-reassign
+    dropdownEl.value = value;
+    dropdownEl.dispatchEvent(new Event('change'));
+    dropdownEl.dispatchEvent(new Event('input'));
+  }
+}

package/components/input-tel-dropdown/test-suites/LionInputTelDropdown.suite.js

@@ -11,6 +11,7 @@ import {
 } from '@open-wc/testing';
 import sinon from 'sinon';
 import { LionInputTelDropdown } from '@lion/ui/input-tel-dropdown.js';
+import { mimicUserChangingDropdown } from '@lion/ui/input-tel-dropdown-test-helpers.js';
 
 /**
  * @typedef {import('lit').TemplateResult} TemplateResult
@@ -36,24 +37,6 @@ function getDropdownValue(dropdownEl) {
   return dropdownEl.value;
 }
 
-/**
- * @param {DropdownElement} dropdownEl
- * @param {string} value
- */
-function mimicUserChangingDropdown(dropdownEl, value) {
-  if ('modelValue' in dropdownEl) {
-    // eslint-disable-next-line no-param-reassign
-    dropdownEl.modelValue = value;
-    dropdownEl.dispatchEvent(
-      new CustomEvent('model-value-changed', { detail: { isTriggeredByUser: true } }),
-    );
-  } else {
-    // eslint-disable-next-line no-param-reassign
-    dropdownEl.value = value;
-    dropdownEl.dispatchEvent(new Event('change'));
-  }
-}
-
 /**
  * @param {{ klass:LionInputTelDropdown }} config
  */
@@ -232,7 +215,7 @@ export function runInputTelDropdownSuite({ klass } = { klass: LionInputTelDropdo
       it('renders to prefix slot in light dom', async () => {
         const el = await fixture(html` <${tag} .allowedRegions="${['DE']}"></${tag}> `);
         const prefixSlot = /** @type {HTMLElement} */ (
-          /** @type {HTMLElement} */ (el.refs.dropdown.value).parentElement
+          /** @type {HTMLElement} */ (el.refs.dropdown.value)
         );
         expect(prefixSlot.getAttribute('slot')).to.equal('prefix');
         expect(prefixSlot.slot).to.equal('prefix');
@@ -335,26 +318,6 @@ export function runInputTelDropdownSuite({ klass } = { klass: LionInputTelDropdo
         expect(el.value).to.equal('+32');
       });
 
-      it('focuses the textbox right after selection if selected via opened dropdown', async () => {
-        const el = await fixture(
-          html` <${tag} .allowedRegions="${[
-            'NL',
-            'BE',
-          ]}" .modelValue="${'+31612345678'}"></${tag}> `,
-        );
-        const dropdownElement = el.refs.dropdown.value;
-        // @ts-expect-error [allow-protected-in-tests]
-        if (dropdownElement?._overlayCtrl) {
-          // @ts-expect-error [allow-protected-in-tests]
-          dropdownElement._overlayCtrl.show();
-          mimicUserChangingDropdown(dropdownElement, 'BE');
-          await el.updateComplete;
-          await aTimeout(0);
-          // @ts-expect-error [allow-protected-in-tests]
-          expect(el._inputNode).to.equal(document.activeElement);
-        }
-      });
-
       it('keeps focus on dropdownElement after selection if selected via unopened dropdown', async () => {
         const el = await fixture(
           html` <${tag} .allowedRegions="${[

package/components/localize/src/LocalizeMixin.js

@@ -64,11 +64,11 @@ const LocalizeMixinImplementation = superclass =>
      * hook into LitElement to only render once all translations are loaded
      * @returns {Promise.<void>}
      */
-    async performUpdate() {
+    async scheduleUpdate() {
       if (Object.getPrototypeOf(this).constructor.waitForLocalizeNamespaces) {
         await this.localizeNamespacesLoaded;
       }
-      super.performUpdate();
+      super.scheduleUpdate();
     }
 
     connectedCallback() {

package/components/overlays/src/OverlayController.js

@@ -931,7 +931,7 @@ export class OverlayController extends EventTarget {
       return;
     }
 
-    if (this.elementToFocusAfterHide) {
+    if (this.elementToFocusAfterHide instanceof HTMLElement) {
       this.elementToFocusAfterHide.focus();
       this.elementToFocusAfterHide.scrollIntoView({ block: 'nearest' });
     } else {

package/components/select/src/LionSelect.js

@@ -57,6 +57,11 @@ class LionFieldWithSelect extends LionField {
  * @customElement lion-select
  */
 export class LionSelect extends LionFieldWithSelect {
+  // eslint-disable-next-line class-methods-use-this
+  get operationMode() {
+    return 'select';
+  }
+
   connectedCallback() {
     super.connectedCallback();
     this._inputNode.addEventListener('change', this._proxyChangeEvent);

package/components/validate-messages/src/getLocalizedMessage.js

@@ -6,6 +6,11 @@
 /** @type {Promise<void | object>} */
 let pendingPromise;
 
+/**
+ * @param {string} string
+ */
+const capitalize = string => (string && string[0].toUpperCase() + string.slice(1)) || '';
+
 /**
  * @param {{localize: LocalizeManager}} opts
  */
@@ -105,7 +110,13 @@ export async function loadValidateNamespace({ localize }) {
 export const getLocalizedMessage = async ({ data, localize }) => {
   await loadValidateNamespace({ localize });
   if (data) {
-    return localize.msg(`lion-validate:${data.type}.${data.name}`, data);
+    const operationMode =
+      data.formControl?.operationMode !== 'enter' && data.name === 'Required'
+        ? capitalize(data.formControl?.operationMode)
+        : undefined;
+    const validatorName = operationMode ? `_${data.name}${operationMode}` : data.name;
+
+    return localize.msg(`lion-validate:${data.type}.${validatorName}`, data);
   }
   return '';
 };

package/components/validate-messages/test/loadDefaultFeedbackMessagesNoSideEffects.test.js

@@ -0,0 +1,105 @@
+/* eslint-disable no-unused-vars, no-param-reassign */
+import { expect } from '@open-wc/testing';
+import { getLocalizeManager } from '@lion/ui/localize-no-side-effects.js';
+import { MinDate, MinLength, Required } from '@lion/ui/form-core.js';
+import { loadDefaultFeedbackMessagesNoSideEffects } from '@lion/ui/validate-messages-no-side-effects.js';
+
+/**
+ * @typedef {import('../../form-core/src/validate/Validator.js').Validator} Validator
+ */
+
+/**
+ * @param {Validator} validatorEl
+ */
+function getProtectedMembers(validatorEl) {
+  // @ts-ignore protected members allowed in test
+  return {
+    // @ts-ignore
+    getMessage: (...args) => validatorEl._getMessage(...args),
+  };
+}
+
+/**
+ * @typedef {import('@lion/ui/types/form-core.js').FormControlHost} FormControlHost
+ * @typedef {ArrayConstructor | ObjectConstructor | NumberConstructor | BooleanConstructor | StringConstructor | DateConstructor | 'iban' | 'email'} modelValueType
+ */
+
+describe('loadDefaultFeedbackMessagesNoSideEffects', () => {
+  const localizeManager = getLocalizeManager();
+
+  it('will set default feedback message for Required', async () => {
+    const el = new Required();
+    const { getMessage } = getProtectedMembers(el);
+    expect(await getMessage()).to.equals(
+      'Please configure an error message for "Required" by overriding "static async getMessage()"',
+    );
+
+    loadDefaultFeedbackMessagesNoSideEffects({ localize: localizeManager });
+    expect(await getMessage({ fieldName: 'password' })).to.equal('Please enter a(n) password.');
+  });
+
+  it('passes data to the feedback message', async () => {
+    const el = new MinLength(10);
+    const { getMessage } = getProtectedMembers(el);
+
+    loadDefaultFeedbackMessagesNoSideEffects({ localize: localizeManager });
+    expect(await getMessage({ fieldName: 'password' })).to.equal(
+      'Please enter a correct password (at least 10 characters).',
+    );
+
+    const el2 = new MinDate(new Date('2024-01-29'));
+    // @ts-ignore protected members allowed in test
+    expect(await el2._getMessage({ fieldName: 'date' })).to.equal(
+      'Please enter a(n) date after or equal to 29/01/2024.',
+    );
+  });
+
+  it('will set select specific feedback message for Required when operationMode is set', async () => {
+    const el = new Required();
+    loadDefaultFeedbackMessagesNoSideEffects({ localize: localizeManager });
+    const { getMessage } = getProtectedMembers(el);
+    const formControl = { operationMode: 'select' };
+    expect(await getMessage({ fieldName: 'password', formControl })).to.equal(
+      'Please select a(n) password.',
+    );
+  });
+
+  it('will set upload specific feedback message for Required when operationMode is set', async () => {
+    const el = new Required();
+    const { getMessage } = getProtectedMembers(el);
+
+    loadDefaultFeedbackMessagesNoSideEffects({ localize: localizeManager });
+    const formControl = { operationMode: 'upload' };
+    expect(await getMessage({ fieldName: 'password', formControl })).to.equal(
+      'Please upload a(n) password.',
+    );
+  });
+
+  it('will set ignore the operationMode for any other validator then Required, e.g. MinLength', async () => {
+    const el = new MinLength(10);
+    const { getMessage } = getProtectedMembers(el);
+
+    loadDefaultFeedbackMessagesNoSideEffects({ localize: localizeManager });
+    const formControl = { operationMode: 'select' };
+    expect(await getMessage({ fieldName: 'password', formControl })).to.equal(
+      'Please enter a correct password (at least 10 characters).',
+    );
+  });
+
+  it('will await loading of translations when switching locale', async () => {
+    const el = new Required();
+    const { getMessage } = getProtectedMembers(el);
+    loadDefaultFeedbackMessagesNoSideEffects({ localize: localizeManager });
+    expect(await getMessage({ fieldName: 'password' })).to.equal('Please enter a(n) password.');
+    expect(await getMessage({ fieldName: 'user name' })).to.equal('Please enter a(n) user name.');
+
+    localizeManager.locale = 'de-DE';
+    await localizeManager.loadingComplete;
+    expect(await getMessage({ fieldName: 'Password' })).to.equal(
+      'Password muss ausgefüllt werden.',
+    );
+    expect(await getMessage({ fieldName: 'Benutzername' })).to.equal(
+      'Benutzername muss ausgefüllt werden.',
+    );
+  });
+});

package/components/validate-messages/translations/bg.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Моля, въведете също {fieldName}.',
+    _RequiredUpload: 'Моля, качете {fieldName}.',
+    _RequiredSelect: 'Wählen Sie auch einen Wert für {fieldName} aus.',
     EqualsLength: 'Моля, въведете правилно {fieldName} от точно {params} знака.',
     MinLength: 'Моля, въведете правилен {fieldName} (поне {params}).',
     MaxLength: 'Моля, въведете правилен {fieldName} (до {params} знака).',
@@ -22,6 +24,8 @@ export default {
   },
   warning: {
     Required: 'Моля, въведете също {fieldName}.',
+    _RequiredUpload: 'Моля, качете {fieldName}.',
+    _RequiredSelect: 'Wählen Sie auch einen Wert für {fieldName} aus.',
     EqualsLength: 'Моля, въведете правилно {fieldName} от точно {params} знака.',
     MinLength: 'Моля, въведете правилен {fieldName} (поне {params}).',
     MaxLength: 'Моля, въведете правилен {fieldName} (до {params} знака).',

package/components/validate-messages/translations/cs.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Zadejte rovněž {fieldName}.',
+    _RequiredUpload: 'Nahrajte {fieldname}.',
+    _RequiredSelect: 'Vyberte rovněž {fieldname}.',
     EqualsLength: 'Zadejte správné {fieldName}, přesně {params} znaků.',
     MinLength: 'Zadejte správné {fieldName} (alespoň {params}).',
     MaxLength: 'Zadejte správné {fieldName} (až {params} znaků).',
@@ -21,6 +23,8 @@ export default {
   },
   warning: {
     Required: 'Zadejte rovněž {fieldName}.',
+    _RequiredUpload: 'Nahrajte {fieldname}.',
+    _RequiredSelect: 'Vyberte rovněž {fieldname}.',
     EqualsLength: 'Zadejte správné {fieldName}, přesně {params} znaků.',
     MinLength: 'Zadejte správné {fieldName} (alespoň {params}).',
     MaxLength: 'Zadejte správné {fieldName} (až {params} znaků).',

package/components/validate-messages/translations/de.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: '{fieldName} muss ausgefüllt werden.',
+    _RequiredUpload: 'Bitte laden Sie ein/e/n {fieldName} hoch.',
+    _RequiredSelect: 'Wählen Sie auch einen Wert für {fieldName} aus.',
     EqualsLength: 'Geben Sie einen korrekten Wert für {fieldName} mit exakt {params} Zeichen ein.',
     MinLength: 'Du musst mindestens {params} Zeichen eingeben.',
     MaxLength: 'Du kannst maximal {params} Zeichen eingeben.',
@@ -23,6 +25,8 @@ export default {
   },
   warning: {
     Required: '{fieldName} sollte ausgefüllt werden.',
+    _RequiredUpload: 'Bitte laden Sie ein/e/n {fieldName} hoch.',
+    _RequiredSelect: 'Wählen Sie auch einen Wert für {fieldName} aus.',
     EqualsLength: 'Geben Sie einen korrekten Wert für {fieldName} mit exakt {params} Zeichen ein.',
     MinLength: 'Du solltest mindestens {params} Zeichen eingeben.',
     MaxLength: 'Du kannst maximal {params} Zeichen eingeben.',

package/components/validate-messages/translations/en.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Please enter a(n) {fieldName}.',
+    _RequiredUpload: 'Please upload a(n) {fieldName}.',
+    _RequiredSelect: 'Please select a(n) {fieldName}.',
     EqualsLength: 'Please enter a correct {fieldName} of exactly {params} characters.',
     MinLength: 'Please enter a correct {fieldName} (at least {params} characters).',
     MaxLength: 'Please enter a correct {fieldName} (up to {params} characters).',
@@ -22,8 +24,10 @@ export default {
   },
   warning: {
     Required: 'Please enter a(n) {fieldName}.',
+    _RequiredUpload: 'Please upload a(n) {fieldName}.',
+    _RequiredSelect: 'Please select a(n) {fieldName}.',
     EqualsLength: 'Please enter a correct {fieldName} of exactly {params} characters.',
-    MinLength: 'Please enter a correct {fieldName} (at least {params}).',
+    MinLength: 'Please enter a correct {fieldName} (at least {params} characters).',
     MaxLength: 'Please enter a correct {fieldName} (up to {params} characters).',
     MinMaxLength:
       'Please enter a correct {fieldName} (between {params.min} and {params.max} characters).',

package/components/validate-messages/translations/es.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Introduzca también un/a {fieldName}.',
+    _RequiredUpload: 'Cargue un {fieldName}.',
+    _RequiredSelect: 'Seleccione también un/a {fieldname}.',
     EqualsLength: 'Introduzca un/a {fieldName} correcto/a de exactamente {params} caracteres.',
     MinLength: 'Introduzca un/a {fieldName} correcto/a (de al menos {params} caracteres).',
     MaxLength: 'Introduzca un/a {fieldName} correcto/a (hasta {params} caracteres).',
@@ -23,6 +25,8 @@ export default {
   },
   warning: {
     Required: 'Introduzca también un/a {fieldName}.',
+    _RequiredUpload: 'Cargue un {fieldName}.',
+    _RequiredSelect: 'Seleccione también un/a {fieldname}.',
     EqualsLength: 'Introduzca un/a {fieldName} correcto/a de exactamente {params} caracteres.',
     MinLength: 'Introduzca un/a {fieldName} correcto/a (de al menos {params} caracteres).',
     MaxLength: 'Introduzca un/a {fieldName} correcto/a (hasta {params} caracteres).',

package/components/validate-messages/translations/fr.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Veuillez également indiquer un(e) {fieldName}.',
+    _RequiredUpload: 'Veuillez télécharger un(e) {fieldName}.',
+    _RequiredSelect: 'Veuillez également sélectionner un(e) {fieldName}.',
     EqualsLength:
       'Veuillez saisir un(e) {fieldName} correct(e) comptant précisément {params} caractères.',
     MinLength: 'Veuillez indiquer un(e) {fieldName} correct(e) (au moins {params}).',
@@ -24,6 +26,8 @@ export default {
   },
   warning: {
     Required: 'Veuillez également indiquer un(e) {fieldName}.',
+    _RequiredUpload: 'Veuillez télécharger un(e) {fieldName}.',
+    _RequiredSelect: 'Veuillez également sélectionner un(e) {fieldName}.',
     EqualsLength:
       'Veuillez saisir un(e) {fieldName} correct(e) comptant précisément {params} caractères.',
     MinLength: 'Veuillez indiquer un(e) {fieldName} correct(e) (au moins {params}).',

package/components/validate-messages/translations/hu.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Továbbá adjon meg egy {fieldName} értéket.',
+    _RequiredUpload: 'Töltsön fel egy {fieldName} elemet.',
+    _RequiredSelect: 'Továbbá válasszon ki egy {fieldname} értéket.',
     EqualsLength: 'Adjon meg egy helyes {fieldName} értéket (pontosan {params} karakter).',
     MinLength: 'Adjon meg egy helyes {fieldName} értéket (legalább {params}).',
     MaxLength: 'Adjon meg egy helyes {fieldName} értéket (legfeljebb {params} karakter).',
@@ -23,6 +25,8 @@ export default {
   },
   warning: {
     Required: 'Továbbá adjon meg egy {fieldName} értéket.',
+    _RequiredUpload: 'Töltsön fel egy {fieldName} elemet.',
+    _RequiredSelect: 'Továbbá válasszon ki egy {fieldname} értéket.',
     EqualsLength: 'Adjon meg egy helyes {fieldName} értéket (pontosan {params} karakter).',
     MinLength: 'Adjon meg egy helyes {fieldName} értéket (legalább {params}).',
     MaxLength: 'Adjon meg egy helyes {fieldName} értéket (legfeljebb {params} karakter).',

package/components/validate-messages/translations/it.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Inserire anche un(a) {fieldName}.',
+    _RequiredUpload: 'Caricare un {fieldName}.',
+    _RequiredSelect: 'Selezionare anche un(a) {fieldname}.',
     EqualsLength: 'Inserire un(a) {fieldName} corretto(a) di esattamente {params} caratteri.',
     MinLength: 'Inserire un(a) {fieldName} corretto(a) (almeno {params}).',
     MaxLength: 'Inserire un(a) {fieldName} corretto(a) (fino a {params} caratteri).',
@@ -23,6 +25,8 @@ export default {
   },
   warning: {
     Required: 'Inserire anche un(a) {fieldName}.',
+    _RequiredUpload: 'Caricare un {fieldName}.',
+    _RequiredSelect: 'Selezionare anche un(a) {fieldname}.',
     EqualsLength: 'Inserire un(a) {fieldName} corretto(a) di esattamente {params} caratteri.',
     MinLength: 'Inserire un(a) {fieldName} corretto(a) (almeno {params}).',
     MaxLength: 'Inserire un(a) {fieldName} corretto(a) (fino a {params} caratteri).',

package/components/validate-messages/translations/nl.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Vul een {fieldName} in.',
+    _RequiredUpload: 'Upload een {fieldName}.',
+    _RequiredSelect: 'Selecteer een {fieldname}.',
     EqualsLength: 'Vul een {fieldName} in gelijk aan {params} karakters.',
     MinLength: 'Vul een {fieldName} in van minimaal {params} karakters.',
     MaxLength: 'Vul een {fieldName} in van maximaal {params} karakters.',
@@ -22,6 +24,8 @@ export default {
   },
   warning: {
     Required: 'Vul een {fieldName} in.',
+    _RequiredUpload: 'Upload een {fieldName}.',
+    _RequiredSelect: 'Selecteer een {fieldname}.',
     EqualsLength: 'Vul een {fieldName} in gelijk aan {params} karakters.',
     MinLength: 'Vul een {fieldName} in van minimaal {params} karakters.',
     MaxLength: 'Vul een {fieldName} in van maximaal {params} karakters.',

package/components/validate-messages/translations/pl.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Proszę również podać wartość {fieldName}.',
+    _RequiredUpload: 'Prześlij plik {fieldName}.',
+    _RequiredSelect: 'Wprowadź prawidłową wartość w polu {fieldname}.',
     EqualsLength: 'Wprowadź prawidłową wartość w polu {fieldName} (maks. liczba znaków: {params}).',
     MinLength: 'Proszę podać prawidłową wartość {fieldName} (co najmniej {params} znaków).',
     MaxLength: 'Proszę podać prawidłową wartość {fieldName} (maks. {params} znaków).',
@@ -22,6 +24,8 @@ export default {
   },
   warning: {
     Required: 'Proszę również podać wartość {fieldName}.',
+    _RequiredUpload: 'Prześlij plik {fieldName}.',
+    _RequiredSelect: 'Wprowadź prawidłową wartość w polu {fieldname}.',
     EqualsLength: 'Wprowadź prawidłową wartość w polu {fieldName} (maks. liczba znaków: {params}).',
     MinLength: 'Proszę podać prawidłową wartość {fieldName} (co najmniej {params} znaków).',
     MaxLength: 'Proszę podać prawidłową wartość {fieldName} (maks. {params} znaków).',

package/components/validate-messages/translations/ro.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Introduceți un/o {fieldName}.',
+    _RequiredUpload: 'Încărcaţi un {fieldName}.',
+    _RequiredSelect: 'Selectați un/o {fieldName}.',
     EqualsLength: 'Introduceți un/o {fieldName} corect(ă) de exact {params} (de) caractere.',
     MinLength: 'Introduceți un/o {fieldName} corect(ă) (cel puțin {params}).',
     MaxLength: 'Introduceți un/o {fieldName} corect(ă) (până la {params} (de) caractere).',
@@ -23,6 +25,8 @@ export default {
   },
   warning: {
     Required: 'Introduceți un/o {fieldName}.',
+    _RequiredUpload: 'Încărcaţi un {fieldName}.',
+    _RequiredSelect: 'Selectați un/o {fieldName}.',
     EqualsLength: 'Introduceți un/o {fieldName} corect(ă) de exact {params} (de) caractere.',
     MinLength: 'Introduceți un/o {fieldName} corect(ă) (cel puțin {params}).',
     MaxLength: 'Introduceți un/o {fieldName} corect(ă) (până la {params} (de) caractere).',

package/components/validate-messages/translations/ru.js

@@ -1,6 +1,8 @@
 export default {
   error: {
     Required: 'Введите значение поля {fieldName}.',
+    _RequiredUpload: 'Загрузите {fieldName}.',
+    _RequiredSelect: 'Также выберите значение поля {fieldname}.',
     EqualsLength: 'Введите корректное значение поля {fieldName} — ровно {params} симв.',
     MinLength: 'Введите корректное значение поля {fieldName} (не менее {params}).',
     MaxLength: 'Введите корректное значение поля {fieldName} (до {params} симв.).',
@@ -23,6 +25,8 @@ export default {
   },
   warning: {
     Required: 'Введите значение поля {fieldName}.',
+    _RequiredUpload: 'Загрузите {fieldName}.',
+    _RequiredSelect: 'Также выберите значение поля {fieldname}.',
     EqualsLength: 'Введите корректное значение поля {fieldName} — ровно {paramsn} симв.',
     MinLength: 'Введите корректное значение поля {fieldName} (не менее {params}).',
     MaxLength: 'Введите корректное значение поля {fieldName} (до {params} симв.).',