@formio/js 5.0.0-dev.5911.81fbc1f → 5.0.0-dev.5913.108f53e

package/dist/formio.utils.min.js.LICENSE.txt

@@ -20,6 +20,8 @@
 
 /*! @license DOMPurify 3.1.6 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.1.6/LICENSE */
 
+/*! @license DOMPurify 3.2.0 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.2.0/LICENSE */
+
 /*! formiojs v5.0.0-rc.59 | https://unpkg.com/formiojs@5.0.0-rc.59/LICENSE.txt */
 
 /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */

package/lib/cjs/WebformBuilder.js

@@ -808,18 +808,31 @@ class WebformBuilder extends Component_1.default {
         // Show an error if siblings are disabled for a component and such a component already exists.
         const compKey = (group === 'resource') ? `component-${key}` : key;
         const draggableComponent = ((_a = this.groups[group]) === null || _a === void 0 ? void 0 : _a.components[compKey]) || {};
-        if (draggableComponent.disableSiblings || draggableComponent.uniqueComponent) {
+        if (draggableComponent.disableSiblings) {
             let isCompAlreadyExists = false;
             (0, formUtils_1.eachComponent)(this.webform.components, (component) => {
-                if ((draggableComponent.disableSiblings && component.type === draggableComponent.schema.type) ||
-                    (draggableComponent.uniqueComponent && component.component.key === draggableComponent.schema.key)) {
+                if (component.type === draggableComponent.schema.type) {
                     isCompAlreadyExists = true;
                     return;
                 }
             }, true);
             if (isCompAlreadyExists) {
                 this.webform.redraw();
-                this.webform.setAlert('danger', `You cannot add more than one ${lodash_1.default.get(draggableComponent, draggableComponent.uniqueComponent ? 'title' : 'key')} component to one page.`);
+                this.webform.setAlert('danger', `You cannot add more than one ${draggableComponent.key} component to one page.`);
+                return;
+            }
+        }
+        if (draggableComponent.uniqueComponent) {
+            let isCompAlreadyExists = false;
+            (0, formUtils_1.eachComponent)(this.webform.components, (component) => {
+                if (component.key === draggableComponent.schema.key) {
+                    isCompAlreadyExists = true;
+                    return;
+                }
+            }, true);
+            if (isCompAlreadyExists) {
+                this.webform.redraw();
+                this.webform.setAlert('danger', `You cannot add more than one ${draggableComponent.title} component to one page.`);
                 return;
             }
         }

package/lib/cjs/Wizard.d.ts

@@ -6,7 +6,6 @@ declare class Wizard extends Webform {
     originalComponents: any[];
     page: number;
     currentPanel: any;
-    currentPanels: any[] | null;
     currentNextPage: number;
     _seenPages: number[];
     subWizards: any[];
@@ -17,7 +16,7 @@ declare class Wizard extends Webform {
     originalOptions: any;
     isLastPage(): any;
     getPages(args?: {}): any[];
-    get hasExtraPages(): boolean;
+    get hasSubWizards(): boolean;
     get localData(): any;
     get wizardKey(): string;
     set wizard(form: object);

package/lib/cjs/Wizard.js

@@ -34,7 +34,6 @@ class Wizard extends Webform_1.default {
         this.originalComponents = [];
         this.page = 0;
         this.currentPanel = null;
-        this.currentPanels = null;
         this.currentNextPage = 0;
         this._seenPages = [0];
         this.subWizards = [];
@@ -53,12 +52,12 @@ class Wizard extends Webform_1.default {
     }
     getPages(args = {}) {
         const { all = false } = args;
-        const pages = this.hasExtraPages ? this.components : this.pages;
+        const pages = this.hasSubWizards ? this.components : this.pages;
         const filteredPages = pages
             .filter(all ? lodash_1.default.identity : (p, index) => this._seenPages.includes(index));
         return filteredPages;
     }
-    get hasExtraPages() {
+    get hasSubWizards() {
         return !lodash_1.default.isEmpty(this.subWizards);
     }
     get data() {
@@ -187,9 +186,9 @@ class Wizard extends Webform_1.default {
     }
     render() {
         const ctx = this.renderContext;
-        if (this.component.key) {
+        if (this.component.id) {
             ctx.panels.map(panel => {
-                if (panel.key === this.component.key) {
+                if (panel.id === this.component.id) {
                     this.currentPanel = panel;
                     ctx.wizardPageTooltip = this.getFormattedTooltip(panel.tooltip);
                 }
@@ -587,7 +586,7 @@ class Wizard extends Webform_1.default {
             this.pageFieldLogic(num);
             this.getNextPage();
             let parentNum = num;
-            if (this.hasExtraPages) {
+            if (this.hasSubWizards) {
                 const pageFromPages = this.pages[num];
                 const pageFromComponents = this.components[num];
                 if (!pageFromComponents || (pageFromPages === null || pageFromPages === void 0 ? void 0 : pageFromPages.id) !== pageFromComponents.id) {
@@ -862,30 +861,25 @@ class Wizard extends Webform_1.default {
         }
     }
     onChange(flags, changed, modified, changes) {
-        var _a, _b;
+        var _a;
         super.onChange(flags, changed, modified, changes);
         const errors = this.validate(this.localData, { dirty: false });
         if (this.alert) {
             this.showErrors(errors, true, true);
         }
         // If the pages change, need to redraw the header.
-        let currentPanels;
-        let panels;
+        const currentPanels = this.pages;
+        // calling this.establishPages() updates/mutates this.pages to be the current pages
+        this.establishPages();
+        const newPanels = this.pages;
         const currentNextPage = this.currentNextPage;
-        if (this.hasExtraPages) {
-            currentPanels = this.pages.map(page => page.component.key);
-            this.establishPages();
-            panels = this.pages.map(page => page.component.key);
-        }
-        else {
-            currentPanels = this.currentPanels || this.pages.map(page => page.component.key);
-            panels = this.establishPages().map(panel => panel.key);
-            this.currentPanels = panels;
-            if (((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.key) && ((_b = this.currentPanels) === null || _b === void 0 ? void 0 : _b.length)) {
-                this.setPage(this.currentPanels.findIndex(panel => panel === this.currentPanel.key));
-            }
+        const panelsUpdated = !lodash_1.default.isEqual(newPanels, currentPanels);
+        if (((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.id) && this.pages.length && (!this.hasSubWizards || (this.hasSubWizards && panelsUpdated))) {
+            const newIndex = this.pages.findIndex(page => page.id === this.currentPanel.id);
+            if (newIndex !== -1)
+                this.setPage(newIndex);
         }
-        if (!lodash_1.default.isEqual(panels, currentPanels) || (flags && flags.fromSubmission)) {
+        if (panelsUpdated || (flags && flags.fromSubmission)) {
             this.redrawHeader();
         }
         // If the next page changes, then make sure to redraw navigation.
@@ -925,14 +919,13 @@ class Wizard extends Webform_1.default {
         return super.errors;
     }
     showErrors(errors, triggerEvent) {
-        if (this.hasExtraPages) {
+        if (this.hasSubWizards) {
             this.subWizards.forEach((subWizard) => {
                 if (Array.isArray(subWizard.errors)) {
                     errors = [...errors, ...subWizard.errors];
                 }
             });
         }
-        ;
         return super.showErrors(errors, triggerEvent);
     }
     focusOnComponent(key) {

package/lib/cjs/components/_classes/component/Component.js

@@ -2516,7 +2516,7 @@ class Component extends Element_1.default {
             }
             return value;
         };
-        if (this.defaultMask) {
+        if (Array.isArray(this.defaultMask) ? this.defaultMask.length > 0 : this.defaultMask) {
             if (Array.isArray(defaultValue)) {
                 defaultValue = defaultValue.map(checkMask);
             }
@@ -3252,12 +3252,6 @@ class Component extends Element_1.default {
         return (this.component.protected || !this.component.persistent || (this.component.persistent === 'client-only'));
     }
     shouldSkipValidation(data, row, flags = {}) {
-        const { validateWhenHidden = false } = this.component || {};
-        const forceValidOnHidden = (!this.visible || !this.checkCondition(row, data)) && !validateWhenHidden;
-        if (forceValidOnHidden) {
-            // If this component is forced valid when it is hidden, then we also need to reset the errors for this component.
-            this._errors = [];
-        }
         const rules = [
             // Do not validate if the flags say not too.
             () => flags.noValidate,
@@ -3268,7 +3262,14 @@ class Component extends Element_1.default {
             // Check to see if we are editing and if so, check component persistence.
             () => this.isValueHidden(),
             // Force valid if component is hidden.
-            () => forceValidOnHidden
+            () => {
+                if (!this.component.validateWhenHidden && (!this.visible || !this.checkCondition(row, data))) {
+                    // If this component is forced valid when it is hidden, then we also need to reset the errors for this component.
+                    this._errors = [];
+                    return true;
+                }
+                return false;
+            }
         ];
         return rules.some(pred => pred());
     }

package/lib/cjs/components/_classes/component/editForm/Component.edit.validation.js

@@ -27,7 +27,7 @@ exports.default = [
         weight: 100,
         type: 'checkbox',
         label: 'Validate When Hidden',
-        tooltip: 'Validates the component when it is hidden/conditionally hidden. Vaildation errors are displayed in the error alert on the form submission.',
+        tooltip: 'Validates the component when it is hidden/conditionally hidden. Vaildation errors are displayed in the error alert on the form submission. Use caution when enabling this setting, as it can cause a hidden component to be invalid with no way for the form user to correct it.',
         key: 'validateWhenHidden',
         input: true
     },

package/lib/cjs/components/_classes/nested/NestedComponent.js

@@ -685,7 +685,7 @@ class NestedComponent extends Field_1.default {
     validationProcessor({ scope, data, row, instance, component }, flags) {
         var _a;
         const { dirty } = flags;
-        if (this.root.hasExtraPages && this.page !== this.root.page) {
+        if (this.root.hasSubWizards && this.page !== this.root.page) {
             instance = ((_a = this.childComponentsMap) === null || _a === void 0 ? void 0 : _a.hasOwnProperty(component.path))
                 ? this.childComponentsMap[component.path]
                 : this.getComponent(component.path);

package/lib/cjs/components/signature/Signature.js

@@ -159,7 +159,9 @@ class SignatureComponent extends Input_1.default {
             if (this.dataValue) {
                 this.setDataToSigaturePad();
             }
-            this.showCanvas(true);
+            if (!this.disabled) {
+                this.showCanvas(true);
+            }
         }
     }
     renderElement(value, index) {

package/lib/cjs/utils/i18n.js

@@ -79,7 +79,12 @@ class I18n {
         this.languages[language] = strings;
     }
     t(text, ...args) {
+        var _a;
         if (this.currentLanguage[text]) {
+            const customTranslationFieldName = (_a = args[0]) === null || _a === void 0 ? void 0 : _a.field;
+            if (customTranslationFieldName && this.currentLanguage[customTranslationFieldName]) {
+                args[0].field = this.currentLanguage[customTranslationFieldName];
+            }
             return utils_1.Evaluator.interpolateString(this.currentLanguage[text], ...args);
         }
         return utils_1.Evaluator.interpolateString(text, ...args);

package/lib/mjs/WebformBuilder.js

@@ -793,18 +793,31 @@ export default class WebformBuilder extends Component {
         // Show an error if siblings are disabled for a component and such a component already exists.
         const compKey = (group === 'resource') ? `component-${key}` : key;
         const draggableComponent = this.groups[group]?.components[compKey] || {};
-        if (draggableComponent.disableSiblings || draggableComponent.uniqueComponent) {
+        if (draggableComponent.disableSiblings) {
             let isCompAlreadyExists = false;
             eachComponent(this.webform.components, (component) => {
-                if ((draggableComponent.disableSiblings && component.type === draggableComponent.schema.type) ||
-                    (draggableComponent.uniqueComponent && component.component.key === draggableComponent.schema.key)) {
+                if (component.type === draggableComponent.schema.type) {
                     isCompAlreadyExists = true;
                     return;
                 }
             }, true);
             if (isCompAlreadyExists) {
                 this.webform.redraw();
-                this.webform.setAlert('danger', `You cannot add more than one ${_.get(draggableComponent, draggableComponent.uniqueComponent ? 'title' : 'key')} component to one page.`);
+                this.webform.setAlert('danger', `You cannot add more than one ${draggableComponent.key} component to one page.`);
+                return;
+            }
+        }
+        if (draggableComponent.uniqueComponent) {
+            let isCompAlreadyExists = false;
+            eachComponent(this.webform.components, (component) => {
+                if (component.key === draggableComponent.schema.key) {
+                    isCompAlreadyExists = true;
+                    return;
+                }
+            }, true);
+            if (isCompAlreadyExists) {
+                this.webform.redraw();
+                this.webform.setAlert('danger', `You cannot add more than one ${draggableComponent.title} component to one page.`);
                 return;
             }
         }

package/lib/mjs/Wizard.d.ts

@@ -6,7 +6,6 @@ declare class Wizard extends Webform {
     originalComponents: any[];
     page: number;
     currentPanel: any;
-    currentPanels: any[] | null;
     currentNextPage: number;
     _seenPages: number[];
     subWizards: any[];
@@ -17,7 +16,7 @@ declare class Wizard extends Webform {
     originalOptions: any;
     isLastPage(): any;
     getPages(args?: {}): any[];
-    get hasExtraPages(): boolean;
+    get hasSubWizards(): boolean;
     get localData(): any;
     get wizardKey(): string;
     set wizard(form: object);

package/lib/mjs/Wizard.js

@@ -29,7 +29,6 @@ export default class Wizard extends Webform {
         this.originalComponents = [];
         this.page = 0;
         this.currentPanel = null;
-        this.currentPanels = null;
         this.currentNextPage = 0;
         this._seenPages = [0];
         this.subWizards = [];
@@ -48,12 +47,12 @@ export default class Wizard extends Webform {
     }
     getPages(args = {}) {
         const { all = false } = args;
-        const pages = this.hasExtraPages ? this.components : this.pages;
+        const pages = this.hasSubWizards ? this.components : this.pages;
         const filteredPages = pages
             .filter(all ? _.identity : (p, index) => this._seenPages.includes(index));
         return filteredPages;
     }
-    get hasExtraPages() {
+    get hasSubWizards() {
         return !_.isEmpty(this.subWizards);
     }
     get data() {
@@ -177,9 +176,9 @@ export default class Wizard extends Webform {
     }
     render() {
         const ctx = this.renderContext;
-        if (this.component.key) {
+        if (this.component.id) {
             ctx.panels.map(panel => {
-                if (panel.key === this.component.key) {
+                if (panel.id === this.component.id) {
                     this.currentPanel = panel;
                     ctx.wizardPageTooltip = this.getFormattedTooltip(panel.tooltip);
                 }
@@ -580,7 +579,7 @@ export default class Wizard extends Webform {
             this.pageFieldLogic(num);
             this.getNextPage();
             let parentNum = num;
-            if (this.hasExtraPages) {
+            if (this.hasSubWizards) {
                 const pageFromPages = this.pages[num];
                 const pageFromComponents = this.components[num];
                 if (!pageFromComponents || pageFromPages?.id !== pageFromComponents.id) {
@@ -857,23 +856,18 @@ export default class Wizard extends Webform {
             this.showErrors(errors, true, true);
         }
         // If the pages change, need to redraw the header.
-        let currentPanels;
-        let panels;
+        const currentPanels = this.pages;
+        // calling this.establishPages() updates/mutates this.pages to be the current pages
+        this.establishPages();
+        const newPanels = this.pages;
         const currentNextPage = this.currentNextPage;
-        if (this.hasExtraPages) {
-            currentPanels = this.pages.map(page => page.component.key);
-            this.establishPages();
-            panels = this.pages.map(page => page.component.key);
-        }
-        else {
-            currentPanels = this.currentPanels || this.pages.map(page => page.component.key);
-            panels = this.establishPages().map(panel => panel.key);
-            this.currentPanels = panels;
-            if (this.currentPanel?.key && this.currentPanels?.length) {
-                this.setPage(this.currentPanels.findIndex(panel => panel === this.currentPanel.key));
-            }
+        const panelsUpdated = !_.isEqual(newPanels, currentPanels);
+        if (this.currentPanel?.id && this.pages.length && (!this.hasSubWizards || (this.hasSubWizards && panelsUpdated))) {
+            const newIndex = this.pages.findIndex(page => page.id === this.currentPanel.id);
+            if (newIndex !== -1)
+                this.setPage(newIndex);
         }
-        if (!_.isEqual(panels, currentPanels) || (flags && flags.fromSubmission)) {
+        if (panelsUpdated || (flags && flags.fromSubmission)) {
             this.redrawHeader();
         }
         // If the next page changes, then make sure to redraw navigation.
@@ -912,14 +906,13 @@ export default class Wizard extends Webform {
         return super.errors;
     }
     showErrors(errors, triggerEvent) {
-        if (this.hasExtraPages) {
+        if (this.hasSubWizards) {
             this.subWizards.forEach((subWizard) => {
                 if (Array.isArray(subWizard.errors)) {
                     errors = [...errors, ...subWizard.errors];
                 }
             });
         }
-        ;
         return super.showErrors(errors, triggerEvent);
     }
     focusOnComponent(key) {

package/lib/mjs/components/_classes/component/Component.js

@@ -2482,7 +2482,7 @@ export default class Component extends Element {
             }
             return value;
         };
-        if (this.defaultMask) {
+        if (Array.isArray(this.defaultMask) ? this.defaultMask.length > 0 : this.defaultMask) {
             if (Array.isArray(defaultValue)) {
                 defaultValue = defaultValue.map(checkMask);
             }
@@ -3214,12 +3214,6 @@ export default class Component extends Element {
         return (this.component.protected || !this.component.persistent || (this.component.persistent === 'client-only'));
     }
     shouldSkipValidation(data, row, flags = {}) {
-        const { validateWhenHidden = false } = this.component || {};
-        const forceValidOnHidden = (!this.visible || !this.checkCondition(row, data)) && !validateWhenHidden;
-        if (forceValidOnHidden) {
-            // If this component is forced valid when it is hidden, then we also need to reset the errors for this component.
-            this._errors = [];
-        }
         const rules = [
             // Do not validate if the flags say not too.
             () => flags.noValidate,
@@ -3230,7 +3224,14 @@ export default class Component extends Element {
             // Check to see if we are editing and if so, check component persistence.
             () => this.isValueHidden(),
             // Force valid if component is hidden.
-            () => forceValidOnHidden
+            () => {
+                if (!this.component.validateWhenHidden && (!this.visible || !this.checkCondition(row, data))) {
+                    // If this component is forced valid when it is hidden, then we also need to reset the errors for this component.
+                    this._errors = [];
+                    return true;
+                }
+                return false;
+            }
         ];
         return rules.some(pred => pred());
     }

package/lib/mjs/components/_classes/component/editForm/Component.edit.validation.js

@@ -22,7 +22,7 @@ export default [
         weight: 100,
         type: 'checkbox',
         label: 'Validate When Hidden',
-        tooltip: 'Validates the component when it is hidden/conditionally hidden. Vaildation errors are displayed in the error alert on the form submission.',
+        tooltip: 'Validates the component when it is hidden/conditionally hidden. Vaildation errors are displayed in the error alert on the form submission. Use caution when enabling this setting, as it can cause a hidden component to be invalid with no way for the form user to correct it.',
         key: 'validateWhenHidden',
         input: true
     },

package/lib/mjs/components/_classes/nested/NestedComponent.js

@@ -680,7 +680,7 @@ export default class NestedComponent extends Field {
     }
     validationProcessor({ scope, data, row, instance, component }, flags) {
         const { dirty } = flags;
-        if (this.root.hasExtraPages && this.page !== this.root.page) {
+        if (this.root.hasSubWizards && this.page !== this.root.page) {
             instance = this.childComponentsMap?.hasOwnProperty(component.path)
                 ? this.childComponentsMap[component.path]
                 : this.getComponent(component.path);

package/lib/mjs/components/signature/Signature.js

@@ -156,7 +156,9 @@ export default class SignatureComponent extends Input {
             if (this.dataValue) {
                 this.setDataToSigaturePad();
             }
-            this.showCanvas(true);
+            if (!this.disabled) {
+                this.showCanvas(true);
+            }
         }
     }
     renderElement(value, index) {

package/lib/mjs/utils/i18n.js

@@ -74,6 +74,10 @@ export class I18n {
     }
     t(text, ...args) {
         if (this.currentLanguage[text]) {
+            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(text, ...args);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.0.0-dev.5911.81fbc1f",
+  "version": "5.0.0-dev.5913.108f53e",
   "description": "JavaScript powered Forms with JSON Form Builder",
   "main": "lib/cjs/index.js",
   "exports": {
@@ -82,7 +82,7 @@
   "dependencies": {
     "@formio/bootstrap": "3.0.0-dev.98.17ba6ea",
     "@formio/choices.js": "^10.2.1",
-    "@formio/core": "v2.1.0-dev.174.9a3c6ec",
+    "@formio/core": "2.1.0-dev.191.8c609ab",
     "@formio/text-mask-addons": "^3.8.0-formio.3",
     "@formio/vanilla-text-mask": "^5.1.1-formio.1",
     "abortcontroller-polyfill": "^1.7.5",