@formio/js 5.0.2-rc.3 → 5.1.0-dev.5936.fa0f253

package/lib/mjs/translations/en.js

@@ -1,11 +1,11 @@
+import bootstrap from '@formio/bootstrap';
 export default {
+    ...(bootstrap?.translations?.en || {}),
     unsavedRowsError: 'Please save all rows before proceeding.',
     invalidRowsError: 'Please correct invalid rows before proceeding.',
     invalidRowError: 'Invalid row. Please correct it or delete.',
     invalidOption: '{{field}} is an invalid value.',
     invalidDay: '{{field}} is not a valid day.',
-    alertMessageWithLabel: '{{label}}: {{message}}',
-    alertMessage: '{{message}}',
     complete: 'Submission Complete',
     error: 'Please fix the following errors before submitting.',
     errorListHotkey: 'Press Ctrl + Alt + X to go back to the error list.',
@@ -77,5 +77,89 @@ export default {
     requiredDayField: '{{ field }} is required',
     requiredDayEmpty: '{{ field }} is required',
     requiredMonthField: '{{ field }} is required',
-    requiredYearField: '{{ field }} is required'
+    requiredYearField: '{{ field }} is required',
+    formNotReady: 'Form not ready. Use form.ready promise',
+    noFormElement: 'No DOM element for form.',
+    notUniqueKey: 'API Key is not unique',
+    newFormSchema: 'Form schema is for a newer version, please upgrade your renderer. Some functionality may not work.',
+    missingUrl: 'Missing URL argument',
+    urlNotAttachedToBtn: 'You should add a URL to this button.',
+    loadingProjectSettingsError: 'Could not load project settings',
+    sessionStorageSupportError: 'Session storage is not supported in this browser.',
+    builderUniqueError: `You cannot add more than one {{componentKeyOrTitle}} component to one page.`,
+    pageNotFound: 'Page not found',
+    noDragInfoError: 'There is no Drag Info available for either dragged or sibling element',
+    addonSupportTypeError: 'Addon {{label}} does not support component of type {{type}}',
+    setPathError: 'Should not be setting the path of a component.',
+    calculatedPathDeprecation: 'component.calculatedPath was deprecated, use component.path instead.',
+    unknownTemplate: 'Unknown template: {{name}}',
+    unknownComponent: 'Unknown component: {{type}}',
+    renderTemplateFunctionDeprecation: `Form.io 'render' template function is deprecated.
+    If you need to render template (template A) inside of another template (template B),
+    pass pre-compiled template A (use this.renderTemplate('template_A_name') as template context variable for template B`,
+    whenReadyDeprecation: 'The whenReady() method has been deprecated. Please use the dataReady property instead.',
+    loadResourcesError: 'Unable to load resources for {{componentKey}}',
+    noSelectDataConfiguration: 'Select component {{componentKey}} does not have data configuration.',
+    indexedDBSupportError: "Your browser doesn't support current version of indexedDB",
+    caretPositionSavingError: 'An error occurred while trying to save caret position',
+    iteratableRowsError: 'Getter #iteratableRows() is not implemented',
+    checkRowDeprecation: 'Deprecation Warning: checkRow method has been replaced with processRow',
+    noOAuthBtn: 'You must add the OAuth button to a form for it to function properly',
+    noOAuthConfiguration: 'OAuth not configured. You must configure oauth for your project before it will work.',
+    oAuthErrorsTitle: 'The Following Error Has Occured',
+    noOAuthFormUrl: 'You must attach a Form API url to your form in order to use OAuth buttons.',
+    oAuthStateError: 'OAuth state does not match. Please try logging in again.',
+    componentInvalidRowValidation: 'Invalid row validation for {{componentKey}}',
+    videoPlayerNotFound: 'Video player not found in template.',
+    synchronizationFailed: 'Synchronization is failed',
+    fileWithDuplicatedNameInProgress: 'File with the same name is already being uploaded',
+    fileWithDuplicatedNameLoaded: 'File with the same name is already uploaded',
+    nestedForm: 'Nested form',
+    noDataProvided: 'No data provided',
+    subformSubmissionLoadingError: 'Unable to load subform submission {{submissionId}}:',
+    noDelimiterSet: 'In order for thousands separator to work properly, you must set the delimiter to true in the component json',
+    noSiteKey: 'There is no Site Key specified in settings in form JSON',
+    failedToNormalize: 'Failed to normalize value',
+    failedToCompareItems: 'Error while comparing items',
+    editorFocusError: 'An editor did not initialize properly when trying to focus:',
+    quillImageUploadFailed: 'Quill image upload failed',
+    noFilesSelected: 'No files selected',
+    needConfigurationForQuill: 'The WYSIWYG settings are configured for CKEditor. For this renderer, you will need to use configurations for the Quill Editor. See https://quilljs.com/docs/configuration for more information.',
+    waitPdfConverting: 'Converting PDF. Please wait.',
+    uploading: 'Uploading',
+    pasteBelow: 'Paste below',
+    copy: 'Copy',
+    move: 'Move',
+    edit: 'Edit',
+    editJson: 'Edit JSON',
+    remove: 'Remove',
+    clickToSetValue: 'Click to set value',
+    words: 'words',
+    characters: 'characters',
+    addAnother: 'Add Another',
+    yes: 'Yes',
+    no: 'No',
+    wantToClearData: 'Do you want to clear data?',
+    yesDelete: 'Yes, delete it',
+    waitFileProcessing: 'Processing file. Please wait...',
+    wrongFileType: 'File is the wrong type; it must be {{ pattern }}',
+    fileTooSmall: 'File is too small; it must be at least {{ size }}',
+    fileTooBig: 'File is too big; it must be at most {{ size }}',
+    noFileService: 'File Service not provided.',
+    fileProcessingFailed: 'File processing has been failed.',
+    readyForUpload: 'Ready to be uploaded into storage',
+    readyForRemovingFromStorage: 'Ready to be removed from storage',
+    preparingFileToRemove: 'Preparing file to remove',
+    succefullyRemoved: 'Succefully removed',
+    succefullyUploaded: 'Succefully uploaded',
+    maxSelectItems: 'You may only select up to {{maxCount}} items',
+    minSelectItems: 'You must select at least {{minCount}} items',
+    clickToSign: 'Click to Sign',
+    surveyQuestion: 'Question',
+    surveyQuestionValue: 'Value',
+    success: 'Success',
+    noResultsFound: 'No results found',
+    noChoices: 'No choices to choose from',
+    typeToSearch: 'Type to search',
+    loading: 'Loading',
 };

package/lib/mjs/utils/ChoicesWrapper.d.ts

@@ -1,38 +1,17 @@
-export namespace KEY_CODES {
-    let BACK_KEY: number;
-    let DELETE_KEY: number;
-    let TAB_KEY: number;
-    let ENTER_KEY: number;
-    let A_KEY: number;
-    let ESC_KEY: number;
-    let UP_KEY: number;
-    let DOWN_KEY: number;
-    let PAGE_UP_KEY: number;
-    let PAGE_DOWN_KEY: number;
-}
 export default ChoicesWrapper;
 declare class ChoicesWrapper extends Choices {
     constructor(...args: any[]);
-    _onTabKey({ activeItems, hasActiveDropdown }: {
-        activeItems: any;
-        hasActiveDropdown: any;
-    }): void;
+    _onTabKey(): void;
     isDirectionUsing: boolean;
     shouldOpenDropDown: boolean;
     _onTouchEnd(event: any): void;
-    _handleButtonAction(activeItems: any, element: any): void;
-    _onEnterKey(args: any): void;
+    _onEnterKey(...args: any[]): void;
     _onDirectionKey(...args: any[]): void;
     timeout: NodeJS.Timeout | undefined;
     _selectHighlightedChoice(): void;
     _onKeyDown(event: any): void;
-    onSelectValue({ event, activeItems, hasActiveDropdown }: {
-        event: any;
-        activeItems: any;
-        hasActiveDropdown: any;
-    }): void;
+    onSelectValue(event: any, hasActiveDropdown: any): void;
     showDropdown(...args: any[]): void;
     hideDropdown(...args: any[]): void;
-    _onBlur(...args: any[]): void;
 }
-import Choices from '@formio/choices.js';
+import Choices from 'choices.js';

package/lib/mjs/utils/ChoicesWrapper.js

@@ -1,41 +1,7 @@
-import Choices from '@formio/choices.js';
-/**
- * TODO: REMOVE THIS ONCE THE PULL REQUEST HAS BEEN RESOLVED.
- *
- * https://github.com/jshjohnson/Choices/pull/788
- *
- * This is intentionally not part of the extended class, since other components use Choices and need this fix as well.
- * @type {Choices._generatePlaceholderValue}
- * @private
- */
-Choices.prototype._generatePlaceholderValue = function () {
-    if (this._isSelectElement && this.passedElement.placeholderOption) {
-        const { placeholderOption } = this.passedElement;
-        return placeholderOption ? placeholderOption.text : false;
-    }
-    const { placeholder, placeholderValue } = this.config;
-    const { element: { dataset }, } = this.passedElement;
-    if (placeholder) {
-        if (placeholderValue) {
-            return placeholderValue;
-        }
-        if (dataset.placeholder) {
-            return dataset.placeholder;
-        }
-    }
-    return false;
-};
-export const KEY_CODES = {
-    BACK_KEY: 46,
-    DELETE_KEY: 8,
+import Choices, { KeyCodeMap } from 'choices.js';
+const ExtendedKeyCodeMap = {
+    ...KeyCodeMap,
     TAB_KEY: 9,
-    ENTER_KEY: 13,
-    A_KEY: 65,
-    ESC_KEY: 27,
-    UP_KEY: 38,
-    DOWN_KEY: 40,
-    PAGE_UP_KEY: 33,
-    PAGE_DOWN_KEY: 34,
 };
 class ChoicesWrapper extends Choices {
     constructor(...args) {
@@ -63,24 +29,13 @@ class ChoicesWrapper extends Choices {
         }
         this._wasTap = true;
     }
-    _handleButtonAction(activeItems, element) {
-        if (!this._isSelectOneElement) {
-            return super._handleButtonAction(activeItems, element);
-        }
-        if (!activeItems ||
-            !element ||
-            !this.config.removeItems ||
-            !this.config.removeItemButton) {
-            return;
-        }
-        super._handleButtonAction(activeItems, element);
-    }
-    _onEnterKey(args) {
+    _onEnterKey(...args) {
+        const [event] = args;
         // Prevent dropdown form opening when removeItemButton was pressed using 'Enter' on keyboard
-        if (args.event.target.className === 'choices__button') {
+        if (event.target.className === 'choices__button') {
             this.shouldOpenDropDown = false;
         }
-        super._onEnterKey(args);
+        super._onEnterKey(...args);
     }
     _onDirectionKey(...args) {
         if (!this._isSelectOneElement) {
@@ -94,17 +49,18 @@ class ChoicesWrapper extends Choices {
             this.isDirectionUsing = false;
         }, 250);
     }
-    _onTabKey({ activeItems, hasActiveDropdown }) {
-        if (hasActiveDropdown) {
-            this._selectHighlightedChoice(activeItems);
+    _onTabKey() {
+        if (this.dropdown.isActive) {
+            this._selectHighlightedChoice();
         }
     }
     _selectHighlightedChoice() {
-        const highlightedChoice = this.dropdown.getChild(`.${this.config.classNames.highlightedState}`);
+        const highlightedChoice = this.dropdown.element.querySelector(`.${this.config.classNames.highlightedState}`);
         if (highlightedChoice) {
             const id = highlightedChoice.dataset.id;
-            const choice = id && this._store.getChoiceById(id);
+            const choice = id && this._store.getChoiceById(Number(id));
             this._addItem({
+                id: choice.id,
                 value: choice.value,
                 label: choice.label,
                 choiceId: choice.id,
@@ -115,61 +71,16 @@ class ChoicesWrapper extends Choices {
             });
             this._triggerChange(choice.value);
         }
-        event.preventDefault();
     }
     _onKeyDown(event) {
-        if (!this._isSelectOneElement) {
-            return super._onKeyDown(event);
-        }
-        const { target, keyCode, ctrlKey, metaKey } = event;
-        if (target !== this.input.element &&
-            !this.containerOuter.element.contains(target)) {
-            return;
-        }
-        const activeItems = this._store.activeItems;
-        const hasFocusedInput = this.input.isFocussed;
-        const hasActiveDropdown = this.dropdown.isActive;
-        const hasItems = this.itemList.hasChildren;
-        const keyString = String.fromCharCode(keyCode);
-        const { BACK_KEY, DELETE_KEY, TAB_KEY, ENTER_KEY, A_KEY, ESC_KEY, UP_KEY, DOWN_KEY, PAGE_UP_KEY, PAGE_DOWN_KEY, } = KEY_CODES;
-        const hasCtrlDownKeyPressed = ctrlKey || metaKey;
-        // If a user is typing and the dropdown is not active
-        if (!hasActiveDropdown && !this._isTextElement && /[a-zA-Z0-9-_ ]/.test(keyString)) {
-            const currentValue = this.input.element.value;
-            this.input.element.value = currentValue ? `${currentValue}${keyString}` : keyString;
-            this.showDropdown();
-        }
-        // Map keys to key actions
-        const keyDownActions = {
-            [A_KEY]: this._onAKey,
-            [TAB_KEY]: this._onTabKey,
-            [ENTER_KEY]: this._onEnterKey,
-            [ESC_KEY]: this._onEscapeKey,
-            [UP_KEY]: this._onDirectionKey,
-            [PAGE_UP_KEY]: this._onDirectionKey,
-            [DOWN_KEY]: this._onDirectionKey,
-            [PAGE_DOWN_KEY]: this._onDirectionKey,
-            [DELETE_KEY]: this._onDeleteKey,
-            [BACK_KEY]: this._onDeleteKey,
-        };
-        // If keycode has a function, run it
-        if (keyDownActions[keyCode]) {
-            keyDownActions[keyCode]({
-                event,
-                target,
-                keyCode,
-                metaKey,
-                activeItems,
-                hasFocusedInput,
-                hasActiveDropdown,
-                hasItems,
-                hasCtrlDownKeyPressed,
-            });
-        }
+        const keyCode = event.keyCode;
+        return this._isSelectOneElement && keyCode === ExtendedKeyCodeMap.TAB_KEY
+            ? this._onTabKey()
+            : super._onKeyDown(event);
     }
-    onSelectValue({ event, activeItems, hasActiveDropdown }) {
+    onSelectValue(event, hasActiveDropdown) {
         if (hasActiveDropdown) {
-            this._selectHighlightedChoice(activeItems);
+            this._selectHighlightedChoice();
         }
         else if (this._isSelectOneElement) {
             this.showDropdown();
@@ -177,11 +88,13 @@ class ChoicesWrapper extends Choices {
         }
     }
     showDropdown(...args) {
-        if (!this.shouldOpenDropDown) {
-            this.shouldOpenDropDown = true;
-            return;
-        }
-        super.showDropdown(...args);
+        setTimeout(() => {
+            if (!this.shouldOpenDropDown) {
+                this.shouldOpenDropDown = true;
+                return;
+            }
+            super.showDropdown(...args);
+        }, 0);
     }
     hideDropdown(...args) {
         if (this.isDirectionUsing) {
@@ -189,11 +102,5 @@ class ChoicesWrapper extends Choices {
         }
         super.hideDropdown(...args);
     }
-    _onBlur(...args) {
-        if (this._isScrollingOnIe) {
-            return;
-        }
-        super._onBlur(...args);
-    }
 }
 export default ChoicesWrapper;

package/lib/mjs/utils/conditionOperators/DateGreaterThan.js

@@ -14,13 +14,13 @@ export default class DateGeaterThan extends ConditionOperator {
         return { date, comparedDate };
     }
     execute(options, functionName = 'isAfter') {
-        const { value, instance, conditionComponentPath } = options;
+        const { value, instance, path } = options;
         if (!value) {
             return false;
         }
         let conditionTriggerComponent = null;
         if (instance?.root?.getComponent) {
-            conditionTriggerComponent = instance.root.getComponent(conditionComponentPath);
+            conditionTriggerComponent = instance.root.getComponent(path);
         }
         if (conditionTriggerComponent && conditionTriggerComponent.isPartialDay && conditionTriggerComponent.isPartialDay(value)) {
             return false;

package/lib/mjs/utils/conditionOperators/IsEmptyValue.d.ts

@@ -1,8 +1,8 @@
 export default class IsEmptyValue extends ConditionOperator {
-    execute({ value, instance, conditionComponentPath }: {
+    execute({ value, instance, path }: {
         value: any;
         instance: any;
-        conditionComponentPath: any;
+        path: any;
     }): any;
     getResult(options: any): any;
 }

package/lib/mjs/utils/conditionOperators/IsEmptyValue.js

@@ -10,10 +10,10 @@ export default class IsEmptyValue extends ConditionOperator {
     static get requireValue() {
         return false;
     }
-    execute({ value, instance, conditionComponentPath }) {
+    execute({ value, instance, path }) {
         const isEmptyValue = _.isEmpty(_.isNumber(value) ? String(value) : value);
         if (instance?.root?.getComponent) {
-            const conditionTriggerComponent = instance.root.getComponent(conditionComponentPath);
+            const conditionTriggerComponent = instance.root.getComponent(path);
             return conditionTriggerComponent?.isEmpty ? conditionTriggerComponent.isEmpty() : isEmptyValue;
         }
         return isEmptyValue;

package/lib/mjs/utils/conditionOperators/IsEqualTo.d.ts

@@ -1,9 +1,9 @@
 export default class IsEqualTo extends ConditionOperator {
-    execute({ value, comparedValue, instance, conditionComponentPath }: {
+    execute({ value, comparedValue, instance, path }: {
         value: any;
         comparedValue: any;
         instance: any;
-        conditionComponentPath: any;
+        path: any;
     }): any;
 }
 import ConditionOperator from './ConditionOperator';

package/lib/mjs/utils/conditionOperators/IsEqualTo.js

@@ -8,7 +8,7 @@ export default class IsEqualTo extends ConditionOperator {
     static get displayedName() {
         return 'Is Equal To';
     }
-    execute({ value, comparedValue, instance, conditionComponentPath }) {
+    execute({ value, comparedValue, instance, path }) {
         if ((value || value === false) && comparedValue && typeof value !== typeof comparedValue && _.isString(comparedValue)) {
             try {
                 comparedValue = JSON.parse(comparedValue);
@@ -17,7 +17,7 @@ export default class IsEqualTo extends ConditionOperator {
             catch (e) { }
         }
         if (instance?.root?.getComponent) {
-            const conditionTriggerComponent = instance.root.getComponent(conditionComponentPath);
+            const conditionTriggerComponent = instance.root.getComponent(path);
             if (conditionTriggerComponent
                 && isSelectResourceWithObjectValue(conditionTriggerComponent.component)
                 && conditionTriggerComponent.component?.template) {

package/lib/mjs/utils/formUtils.d.ts

@@ -1,22 +1,33 @@
-/**
- * Deprecated version of findComponents. Renamed to searchComponents.
- * @param {import('@formio/core').Component[]} components - The components to find components within.
- * @param {object} query - The query to use when searching for the components.
- * @returns {import('@formio/core').Component[]} - The result of the component that is found.
- */
-export function findComponents(components: import('@formio/core').Component[], query: object): import('@formio/core').Component[];
 export const flattenComponents: typeof Utils.flattenComponents;
 export const guid: typeof Utils.guid;
 export const uniqueName: typeof Utils.uniqueName;
-export const MODEL_TYPES: any;
+export const MODEL_TYPES_OF_KNOWN_COMPONENTS: {
+    nestedArray: string[];
+    nestedDataArray: string[];
+    dataObject: string[];
+    object: string[];
+    map: string[];
+    content: string[];
+    string: string[];
+    number: string[];
+    boolean: string[];
+    none: string[];
+    any: string[];
+};
 export const getModelType: typeof Utils.getModelType;
-export const getComponentAbsolutePath: typeof Utils.getComponentAbsolutePath;
-export const getComponentPath: typeof Utils.getComponentPath;
+export const getComponentPath: any;
+export const setComponentScope: typeof Utils.setComponentScope;
+export const resetComponentScope: typeof Utils.resetComponentScope;
 export const isComponentNestedDataType: typeof Utils.isComponentNestedDataType;
 export const componentPath: typeof Utils.componentPath;
-export const componentChildPath: any;
-export const eachComponentDataAsync: (components: Component[], data: DataObject, fn: EachComponentDataAsyncCallback, path?: string | undefined, index?: number | undefined, parent?: any, includeAll?: boolean | undefined) => Promise<void>;
-export const eachComponentData: (components: Component[], data: DataObject, fn: EachComponentDataCallback, path?: string | undefined, index?: number | undefined, parent?: any, includeAll?: boolean | undefined) => void;
+export const getComponentPaths: typeof Utils.getComponentPaths;
+export const componentMatches: typeof Utils.componentMatches;
+export const getBestMatch: typeof Utils.getBestMatch;
+export const getComponentFromPath: typeof Utils.getComponentFromPath;
+export const getComponentValue: typeof Utils.getComponentValue;
+export const findComponents: typeof Utils.findComponents;
+export const eachComponentDataAsync: (components: import("@formio/core").Component[], data: import("@formio/core").DataObject, fn: import("@formio/core").EachComponentDataAsyncCallback, includeAll?: boolean | undefined, local?: boolean | undefined, parent?: import("@formio/core").Component | undefined, parentPaths?: import("@formio/core").ComponentPaths | undefined) => Promise<void>;
+export const eachComponentData: (components: import("@formio/core").Component[], data: import("@formio/core").DataObject, fn: import("@formio/core").EachComponentDataCallback, includeAll?: boolean | undefined, local?: boolean | undefined, parent?: import("@formio/core").Component | undefined, parentPaths?: import("@formio/core").ComponentPaths | undefined) => void;
 export const getComponentKey: typeof Utils.getComponentKey;
 export const getContextualRowPath: typeof Utils.getContextualRowPath;
 export const getContextualRowData: typeof Utils.getContextualRowData;
@@ -24,7 +35,7 @@ export const componentInfo: typeof Utils.componentInfo;
 export const eachComponent: typeof Utils.eachComponent;
 export const eachComponentAsync: typeof Utils.eachComponentAsync;
 export const getComponentData: typeof Utils.getComponentData;
-export const getComponentActualValue: typeof Utils.getComponentActualValue;
+export const getComponentActualValue: any;
 export const isLayoutComponent: typeof Utils.isLayoutComponent;
 export const matchComponent: typeof Utils.matchComponent;
 export const getComponent: typeof Utils.getComponent;

package/lib/mjs/utils/formUtils.js

@@ -1,13 +1,3 @@
 import { Utils } from '@formio/core';
-const { flattenComponents, guid, uniqueName, MODEL_TYPES, getModelType, getComponentAbsolutePath, getComponentPath, isComponentNestedDataType, componentPath, componentChildPath, eachComponentDataAsync, eachComponentData, getComponentKey, getContextualRowPath, getContextualRowData, componentInfo, eachComponent, eachComponentAsync, getComponentData, getComponentActualValue, isLayoutComponent, matchComponent, getComponent, searchComponents, removeComponent, hasCondition, parseFloatExt, formatAsCurrency, escapeRegExCharacters, getValue, getStrings, generateFormChange, applyFormChanges, findComponent, getEmptyValue, isComponentDataEmpty, isSelectResourceWithObjectValue, compareSelectResourceWithObjectTypeValues, getItemTemplateKeys } = Utils;
-/**
- * Deprecated version of findComponents. Renamed to searchComponents.
- * @param {import('@formio/core').Component[]} components - The components to find components within.
- * @param {object} query - The query to use when searching for the components.
- * @returns {import('@formio/core').Component[]} - The result of the component that is found.
- */
-export function findComponents(components, query) {
-    console.warn('formio.js/utils findComponents is deprecated. Use searchComponents instead.');
-    return searchComponents(components, query);
-}
-export { flattenComponents, guid, uniqueName, MODEL_TYPES, getModelType, getComponentAbsolutePath, getComponentPath, isComponentNestedDataType, componentPath, componentChildPath, eachComponentDataAsync, eachComponentData, getComponentKey, getContextualRowPath, getContextualRowData, componentInfo, eachComponent, eachComponentAsync, getComponentData, getComponentActualValue, isLayoutComponent, matchComponent, getComponent, searchComponents, removeComponent, hasCondition, parseFloatExt, formatAsCurrency, escapeRegExCharacters, getValue, getStrings, generateFormChange, applyFormChanges, findComponent, getEmptyValue, isComponentDataEmpty, isSelectResourceWithObjectValue, compareSelectResourceWithObjectTypeValues, getItemTemplateKeys };
+const { flattenComponents, guid, uniqueName, MODEL_TYPES_OF_KNOWN_COMPONENTS, getModelType, getComponentPath, setComponentScope, resetComponentScope, isComponentNestedDataType, componentPath, getComponentPaths, componentMatches, getBestMatch, getComponentFromPath, getComponentValue, findComponents, eachComponentDataAsync, eachComponentData, getComponentKey, getContextualRowPath, getContextualRowData, componentInfo, eachComponent, eachComponentAsync, getComponentData, getComponentActualValue, isLayoutComponent, matchComponent, getComponent, searchComponents, removeComponent, hasCondition, parseFloatExt, formatAsCurrency, escapeRegExCharacters, getValue, getStrings, generateFormChange, applyFormChanges, findComponent, getEmptyValue, isComponentDataEmpty, isSelectResourceWithObjectValue, compareSelectResourceWithObjectTypeValues, getItemTemplateKeys } = Utils;
+export { flattenComponents, guid, uniqueName, MODEL_TYPES_OF_KNOWN_COMPONENTS, getModelType, getComponentPath, setComponentScope, resetComponentScope, isComponentNestedDataType, componentPath, getComponentPaths, componentMatches, getBestMatch, getComponentFromPath, getComponentValue, findComponents, eachComponentDataAsync, eachComponentData, getComponentKey, getContextualRowPath, getContextualRowData, componentInfo, eachComponent, eachComponentAsync, getComponentData, getComponentActualValue, isLayoutComponent, matchComponent, getComponent, searchComponents, removeComponent, hasCondition, parseFloatExt, formatAsCurrency, escapeRegExCharacters, getValue, getStrings, generateFormChange, applyFormChanges, findComponent, getEmptyValue, isComponentDataEmpty, isSelectResourceWithObjectValue, compareSelectResourceWithObjectTypeValues, getItemTemplateKeys };

package/lib/mjs/utils/i18n.d.ts

@@ -2,13 +2,16 @@
  * This file is used to mimic the i18n library interface.
  */
 export class I18n {
+    static languages: {};
+    static setDefaultTranslations(languages: any): void;
     static init(languages?: {}): I18n;
     static createInstance(): I18n;
     constructor(languages?: {});
-    languages: {};
+    languages: any;
+    defaultKeys: any;
     language: string;
     currentLanguage: any;
-    setLanguages(languages: any): void;
+    setLanguages(languages: any, noDefaultOverride: any): void;
     dir(lang?: string): "rtl" | "ltr";
     changeLanguage(language: any, ready?: null): void;
     addResourceBundle(language: any, type: any, strings: any): void;

package/lib/mjs/utils/i18n.js

@@ -1,5 +1,7 @@
 import { Evaluator } from '@formio/core/utils';
 import i18n from '../i18n';
+import { isEmpty } from 'lodash';
+import { fastCloneDeep } from '@formio/core';
 const i18Defaults = {};
 for (const lang in i18n.resources) {
     if (i18n.resources.hasOwnProperty(lang)) {
@@ -10,14 +12,29 @@ for (const lang in i18n.resources) {
  * This file is used to mimic the i18n library interface.
  */
 export class I18n {
-    languages = i18Defaults;
+    static languages = i18Defaults;
+    languages = fastCloneDeep(I18n.languages || {});
+    defaultKeys = I18n.languages?.en || {};
     language = 'en';
     currentLanguage = i18Defaults.en;
     constructor(languages = {}) {
         this.setLanguages(languages);
         this.changeLanguage(this.language);
     }
-    setLanguages(languages) {
+    static setDefaultTranslations(languages) {
+        if (isEmpty(languages)) {
+            return;
+        }
+        for (const lang in languages) {
+            if (lang !== 'language' && languages.hasOwnProperty(lang)) {
+                if (!this.languages[lang]) {
+                    this.languages[lang] = {};
+                }
+                this.languages[lang] = { ...languages[lang], ...this.languages[lang], };
+            }
+        }
+    }
+    setLanguages(languages, noDefaultOverride) {
         if (languages.resources) {
             for (const lang in languages.resources) {
                 if (languages.resources.hasOwnProperty(lang)) {
@@ -44,7 +61,9 @@ export class I18n {
                 if (!this.languages[lang]) {
                     this.languages[lang] = {};
                 }
-                this.languages[lang] = { ...this.languages[lang], ...languages[lang] };
+                this.languages[lang] = noDefaultOverride
+                    ? { ...languages[lang], ...this.languages[lang] }
+                    : { ...this.languages[lang], ...languages[lang] };
             }
         }
     }
@@ -73,12 +92,20 @@ export class I18n {
         this.languages[language] = strings;
     }
     t(text, ...args) {
-        if (this.currentLanguage[text]) {
+        let currentTranslation = this.currentLanguage[text];
+        // provide compatibility with cases where the entire phrase is used as a key
+        // get the phrase that is possibly being used as a key
+        const defaultKey = this.defaultKeys[text];
+        if (defaultKey && this.currentLanguage[defaultKey]) {
+            // get translation using the phrase as a key
+            currentTranslation = this.currentLanguage[defaultKey];
+        }
+        if (currentTranslation) {
             const customTranslationFieldName = args[0]?.field;
             if (customTranslationFieldName && this.currentLanguage[customTranslationFieldName]) {
                 args[0].field = this.currentLanguage[customTranslationFieldName];
             }
-            return Evaluator.interpolateString(this.currentLanguage[text], ...args);
+            return Evaluator.interpolateString(currentTranslation, ...args);
         }
         return Evaluator.interpolateString(text, ...args);
     }

package/lib/mjs/utils/utils.d.ts

@@ -208,9 +208,10 @@ export function loadZones(url: string, timezone: string): Promise<any> | any;
  * @param {string|Date} value - The value to convert into a moment date.
  * @param {string} format - The format to convert the date to.
  * @param {string} timezone - The timezone to convert the date to.
+ * @param {object} options - The options object
  * @returns {Date} - The moment date object.
  */
-export function momentDate(value: string | Date, format: string, timezone: string): Date;
+export function momentDate(value: string | Date, format: string, timezone: string, options: object): Date;
 /**
  * Format a date provided a value, format, and timezone object.
  * @param {string} timezonesUrl - The URL to load the timezone data from.
@@ -462,10 +463,9 @@ export function getComponentPathWithoutIndicies(path?: string): string;
 /**
  * Returns a path to the component which based on its schema
  * @param {import('@formio/core').Component} component - Component containing link to its parent's schema in the 'parent' property
- * @param {string} path - Path to the component
  * @returns {string} - Path to the component
  */
-export function getComponentPath(component: import('@formio/core').Component, path?: string): string;
+export function getComponentPath(component: import('@formio/core').Component): string;
 /**
  * Returns a parent component of the passed component instance skipping all the Layout components
  * @param {Component} componentInstance - The component to check for the parent.
@@ -478,14 +478,6 @@ export function getDataParentComponent(componentInstance: Component): Component
  * @returns {boolean} - TRUE if the value is a promise; FALSE otherwise
  */
 export function isPromise(value: any): boolean;
-/**
- * Determines if the component has a scoping parent in tree (a component which scopes its children and manages its
- * changes by itself, e.g. EditGrid)
- * @param {Component} componentInstance - The component to check for the scoping parent.
- * @param {boolean} firstPass - Whether it is the first pass of the function
- * @returns {boolean|*} - TRUE if the component has a scoping parent; FALSE otherwise
- */
-export function isInsideScopingComponent(componentInstance: Component, firstPass?: boolean): boolean | any;
 /**
  * Returns all the focusable elements within the provided dom element.
  * @param {HTMLElement} element - The element to get the focusable elements from.
@@ -498,6 +490,15 @@ export function getFocusableElements(element: HTMLElement): NodeList<HTMLElement
  * @returns {Array<string>|null} - The saved types for the component
  */
 export function getComponentSavedTypes(fullSchema: import('@formio/core').Component): Array<string> | null;
+/**
+ * Checks if a string has timezone information encoded in it
+ * Example: 2024-01-01T00:00:00Z -> true
+ * Example: 2024-01-01T00:00:00+03:00 -> true
+ * Example: 2011-05-03T00:00:00 -> false
+ * @param {string} value the string value to check
+ * @returns {boolean} if value has encoded timezone
+ */
+export function hasEncodedTimezone(value: string): boolean;
 export * from "./formUtils";
 /**
  * Map values through unfold and return first non-nil value.
@@ -515,7 +516,6 @@ export namespace componentValueTypes {
     let any: string;
 }
 export function interpolateErrors(component: Component, errors: FieldError[], interpolateFn: Function): [];
-import jsonLogic from 'json-logic-js';
 import ConditionOperators from './conditionOperators';
 import { Evaluator } from './Evaluator';
 export const interpolate: typeof Evaluator.interpolate;