@formio/js 5.2.3 → 5.2.4-rc.0

package/lib/mjs/components/form/Form.js

@@ -1,4 +1,3 @@
-/* eslint-disable max-statements */
 import _ from 'lodash';
 import Component from '../_classes/component/Component';
 import ComponentModal from '../_classes/componentModal/ComponentModal';
@@ -26,18 +25,20 @@ export default class FormComponent extends Component {
             group: 'premium',
             documentation: '/userguide/form-building/premium-components#nested-form',
             weight: 110,
-            schema: FormComponent.schema()
+            schema: FormComponent.schema(),
         };
     }
     static savedValueTypes() {
-        return [componentValueTypes.object];
+        return [
+            componentValueTypes.object,
+        ];
     }
     init() {
         super.init();
         this.formObj = {
             display: this.component.display,
             settings: this.component.settings,
-            components: this.component.components
+            components: this.component.components,
         };
         this.valueChanged = false;
         this.subForm = null;
@@ -89,9 +90,11 @@ export default class FormComponent extends Component {
             delete this.component.formRevision;
         }
         // Add revision version if set.
-        if (this.component.revision || this.component.revision === 0 ||
-            this.component.formRevision || this.component.formRevision === 0
-            || this.component.revisionId) {
+        if (this.component.revision ||
+            this.component.revision === 0 ||
+            this.component.formRevision ||
+            this.component.formRevision === 0 ||
+            this.component.revisionId) {
             this.setFormRevision(this.component.revisionId || this.component.revision || this.component.formRevision);
         }
         return this.createSubForm();
@@ -140,7 +143,6 @@ export default class FormComponent extends Component {
         }
         return this.subForm.getComponent(path);
     }
-    /* eslint-disable max-statements */
     getSubOptions(options = {}) {
         options.events = this.createEmitter();
         // Make sure to not show the submit button in wizards in the nested forms.
@@ -211,7 +213,6 @@ export default class FormComponent extends Component {
         options.parent = this;
         return options;
     }
-    /* eslint-enable max-statements */
     render() {
         if (this.builderMode) {
             return super.render(this.component.label || 'Nested form');
@@ -236,27 +237,27 @@ export default class FormComponent extends Component {
             return 'No data provided';
         }
         if (options?.email) {
-            let result = (`
+            let result = `
         <table border="1" style="width:100%">
           <tbody>
-      `);
+      `;
             this.everyComponent((component) => {
                 if (component.isInputComponent && component.visible && !component.skipInEmail) {
-                    result += (`
+                    result += `
             <tr>
               <th style="padding: 5px 10px;">${component.label}</th>
               <td style="width:100%;padding:5px 10px;">${component.getView(component.dataValue, options)}</td>
             </tr>
-          `);
+          `;
                 }
             }, {
                 ...options,
                 fromRoot: true,
             });
-            result += (`
+            result += `
           </tbody>
         </table>
-      `);
+      `;
             return result;
         }
         if (_.isEmpty(value)) {
@@ -269,8 +270,7 @@ export default class FormComponent extends Component {
         if (this.builderMode) {
             return super.attach(element);
         }
-        return super.attach(element)
-            .then(() => {
+        return super.attach(element).then(() => {
             if (this.isSubFormLazyLoad() && !this.hasLoadedForm && !this.subFormLoading) {
                 this.createSubForm(true);
             }
@@ -281,7 +281,7 @@ export default class FormComponent extends Component {
                 this.empty(element);
                 if (this.options.builder) {
                     this.setContent(element, this.ce('div', {
-                        class: 'text-muted text-center p-2'
+                        class: 'text-muted text-center p-2',
                     }, this.text(this.formObj.title)));
                     return;
                 }
@@ -289,9 +289,12 @@ export default class FormComponent extends Component {
                 const postAttach = () => {
                     if (!this.builderMode && this.component.modalEdit) {
                         const modalShouldBeOpened = this.componentModal ? this.componentModal.isOpened : false;
-                        const currentValue = modalShouldBeOpened ? this.componentModal.currentValue : this.dataValue;
+                        const currentValue = modalShouldBeOpened
+                            ? this.componentModal.currentValue
+                            : this.dataValue;
                         this.componentModal = new ComponentModal(this, element, modalShouldBeOpened, currentValue, this._referenceAttributeName);
-                        this.subForm.element = this.componentModal.refs.componentContent || this.subForm.element;
+                        this.subForm.element =
+                            this.componentModal.refs.componentContent || this.subForm.element;
                         this.setOpenModalElement();
                     }
                     this.calculateValue();
@@ -328,24 +331,24 @@ export default class FormComponent extends Component {
         return this._currentForm;
     }
     get hasLoadedForm() {
-        return this.formObj
-            && this.formObj.components
-            && Array.isArray(this.formObj.components)
-            && this.formObj.components.length;
+        return (this.formObj &&
+            this.formObj.components &&
+            Array.isArray(this.formObj.components) &&
+            this.formObj.components.length);
     }
     set currentForm(instance) {
         this._currentForm = instance;
         if (!this.subForm) {
             return;
         }
-        this.subForm.getComponents().forEach(component => {
+        this.subForm.getComponents().forEach((component) => {
             component.currentForm = this;
         });
     }
     get isRevisionChanged() {
-        return _.isNumber(this.subFormRevision)
-            && _.isNumber(this.formObj._vid)
-            && this.formObj._vid !== this.subFormRevision;
+        return (_.isNumber(this.subFormRevision) &&
+            _.isNumber(this.formObj._vid) &&
+            this.formObj._vid !== this.subFormRevision);
     }
     get subFormData() {
         return this.dataValue?.data || {};
@@ -380,7 +383,7 @@ export default class FormComponent extends Component {
     }
     updateSubWizards(subForm) {
         if (this.isNestedWizard && this.root?.subWizards && subForm?._form?.display === 'wizard') {
-            const existedForm = this.root.subWizards.findIndex(form => form.component.form === this.component.form);
+            const existedForm = this.root.subWizards.findIndex((form) => form.component.form === this.component.form);
             if (existedForm !== -1) {
                 this.root.subWizards[existedForm] = this;
             }
@@ -405,7 +408,8 @@ export default class FormComponent extends Component {
      * @returns {*} - The subform instance.
      */
     createSubForm(fromAttach, beforeSubmit) {
-        this.subFormReady = this.loadSubForm(fromAttach, beforeSubmit).then((form) => {
+        this.subFormReady = this.loadSubForm(fromAttach, beforeSubmit)
+            .then((form) => {
             if (!form) {
                 return;
             }
@@ -418,7 +422,8 @@ export default class FormComponent extends Component {
                 this.subForm.destroy();
             }
             // Render the form.
-            return (new Form(form, this.getSubOptions())).ready.then((instance) => {
+            return new Form(form, this.getSubOptions()).ready
+                .then((instance) => {
                 this.subForm = instance;
                 this.subForm.currentForm = this;
                 this.subForm.parentVisible = this.visible;
@@ -429,7 +434,7 @@ export default class FormComponent extends Component {
                     if (this.subForm && !this.shouldConditionallyClear()) {
                         this.dataValue = this.subForm.getValue();
                         this.triggerChange({
-                            noEmit: true
+                            noEmit: true,
                         });
                     }
                 });
@@ -441,10 +446,12 @@ export default class FormComponent extends Component {
                 this.valueChanged = this.hasSetValue;
                 this.onChange();
                 return this.subForm;
-            }).catch((err) => {
+            })
+                .catch((err) => {
                 console.log(err);
             });
-        }).then((subForm) => {
+        })
+            .then((subForm) => {
             this.updateSubWizards(subForm);
             return subForm;
         });
@@ -466,11 +473,17 @@ export default class FormComponent extends Component {
      */
     loadSubForm(fromAttach, beforeSubmit) {
         const loadHiddenForm = beforeSubmit && !this.component.clearOnHide;
-        if (this.builderMode || (this.conditionallyHidden() && !loadHiddenForm) || (this.isSubFormLazyLoad() && !fromAttach)) {
+        if (this.builderMode ||
+            (this.conditionallyHidden() && !loadHiddenForm) ||
+            (this.isSubFormLazyLoad() && !fromAttach)) {
             return Promise.resolve();
         }
-        if (this.hasLoadedForm && !this.isRevisionChanged &&
-            !(this.options.pdf && this.component?.useOriginalRevision && _.isNull(this.subForm) && !this.subFormLoading)) {
+        if (this.hasLoadedForm &&
+            !this.isRevisionChanged &&
+            !(this.options.pdf &&
+                this.component?.useOriginalRevision &&
+                _.isNull(this.subForm) &&
+                !this.subFormLoading)) {
             // Pass config down to sub forms.
             if (this.root && this.root.form && this.root.form.config && !this.formObj.config) {
                 this.formObj.config = this.root.form.config;
@@ -485,7 +498,8 @@ export default class FormComponent extends Component {
                     project: this.root.formio.projectUrl,
                 }
                 : {};
-            return (new Formio(this.formSrc, options)).loadForm({ params: { live: 1 } })
+            return new Formio(this.formSrc, options)
+                .loadForm({ params: { live: 1 } })
                 .then((formObj) => {
                 this.formObj = formObj;
                 if (this.options.pdf && this.component.useOriginalRevision) {
@@ -538,7 +552,9 @@ export default class FormComponent extends Component {
      * @returns {*|boolean} - TRUE if the subform should be submitted, FALSE if it should not.
      */
     get shouldSubmit() {
-        return this.subFormReady && (!this.component.hasOwnProperty('reference') || this.component.reference) && !this.shouldConditionallyClear();
+        return (this.subFormReady &&
+            (!this.component.hasOwnProperty('reference') || this.component.reference) &&
+            !this.shouldConditionallyClear());
     }
     /**
      * Returns the data for the subform.
@@ -565,12 +581,15 @@ export default class FormComponent extends Component {
                 }
                 this.subForm.nosubmit = false;
                 this.subForm.submitted = true;
-                return this.subForm.submitForm({}, true).then(result => {
+                return this.subForm
+                    .submitForm({}, true)
+                    .then((result) => {
                     this.subForm.loading = false;
                     this.subForm.showAllErrors = false;
                     this.dataValue = result.submission;
                     return this.dataValue;
-                }).catch(err => {
+                })
+                    .catch((err) => {
                     this.subForm.showAllErrors = true;
                     this.subForm.onSubmissionError(err);
                     return Promise.reject(err);
@@ -636,10 +655,10 @@ export default class FormComponent extends Component {
         this.valueChanged = true;
         if (this.subForm) {
             const revisionPath = submission._frid ? '_frid' : '_vid';
-            const shouldLoadOriginalRevision = this.useOriginalRevision
-                && (_.isNumber(submission[revisionPath]) || _.isNumber(submission._fvid))
-                && _.isNumber(this.subForm.form?.[revisionPath])
-                && submission._fvid !== this.subForm.form[revisionPath];
+            const shouldLoadOriginalRevision = this.useOriginalRevision &&
+                (_.isNumber(submission[revisionPath]) || _.isNumber(submission._fvid)) &&
+                _.isNumber(this.subForm.form?.[revisionPath]) &&
+                submission._fvid !== this.subForm.form[revisionPath];
             if (shouldLoadOriginalRevision) {
                 this.setFormRevision(submission._frid || submission._fvid);
                 this.createSubForm().then(() => {
@@ -653,10 +672,7 @@ export default class FormComponent extends Component {
         return changed;
     }
     setSubFormValue(submission, flags) {
-        const shouldLoadSubmissionById = submission
-            && submission._id
-            && this.subForm.formio
-            && _.isEmpty(submission.data);
+        const shouldLoadSubmissionById = submission && submission._id && this.subForm.formio && _.isEmpty(submission.data);
         const shouldLoadDraftById = this.options.saveDraft && _.isEmpty(submission.data) && _.get(this.subForm, 'submission._id');
         if (shouldLoadSubmissionById || shouldLoadDraftById) {
             const formId = submission.form || this.formObj.form || this.component.form;
@@ -722,7 +738,7 @@ export default class FormComponent extends Component {
      * @returns {boolean} - TRUE if this form is a Nested Wizard, FALSE otherwise
      */
     get isNestedWizard() {
-        return this.subForm?._form?.display === 'wizard' && this.parent?.parent?._form?.display === 'wizard';
+        return (this.subForm?._form?.display === 'wizard' && this.parent?.parent?._form?.display === 'wizard');
     }
     get visible() {
         return super.visible;
@@ -817,7 +833,7 @@ export default class FormComponent extends Component {
     deleteValue() {
         super.setValue(null, {
             noUpdateEvent: true,
-            noDefault: true
+            noDefault: true,
         });
         this.unset();
     }

package/lib/mjs/components/form/editForm/Form.edit.data.js

@@ -1,5 +1,4 @@
 import EditFormUtils from '../../_classes/component/editForm/utils';
-/* eslint-disable max-len */
 export default [
     EditFormUtils.javaScriptValue('Custom Default Value', 'customDefaultValue', 'customDefaultValue', 120, '<p><h4>Example:</h4><pre>value = data.firstName + " " + data.lastName;</pre></p>', '<p><h4>Example:</h4><pre>{"cat": [{"var": "data.firstName"}, " ", {"var": "data.lastName"}]}</pre>'),
     EditFormUtils.javaScriptValue('Calculated Value', 'calculateValue', 'calculateValue', 130, '<p><h4>Example:</h4><pre>value = data.a + data.b + data.c;</pre></p>', '<p><h4>Example:</h4><pre>{"+": [{"var": "data.a"}, {"var": "data.b"}, {"var": "data.c"}]}</pre><p><a href="https://help.form.io/userguide/form-building/logic-and-conditions#calculated-values" target="_blank" rel="noopener noreferrer">Click here for an example</a></p>'),
@@ -10,7 +9,6 @@ export default [
         key: 'clearOnHide',
         defaultValue: true,
         tooltip: 'When a field is hidden, clear the value.',
-        input: true
+        input: true,
     },
 ];
-/* eslint-enable max-len */

package/lib/mjs/components/form/editForm/Form.edit.display.js

@@ -1,27 +1,26 @@
 export default [
     {
         key: 'labelPosition',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'placeholder',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'description',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'tooltip',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'tabIndex',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'autofocus',
-        ignore: true
+        ignore: true,
     },
 ];
-/* eslint-enable max-len */

package/lib/mjs/components/form/editForm/Form.edit.form.js

@@ -4,7 +4,7 @@ export default [
         input: true,
         dataSrc: 'url',
         data: {
-            url: '/form?limit=1000000&select=_id,title,display'
+            url: '/form?limit=1000000&select=_id,title,display',
         },
         searchField: 'title__regex',
         template: '<span>{{ item.title }}</span>',
@@ -30,9 +30,11 @@ export default [
         tooltip: 'if it is checked, the subform is loaded after navigation to the page with this component within the wizard.',
         input: true,
         customConditional({ instance, data }) {
-            const formInfo = instance.root?.getComponent('form')?.defaultDownloadedResources.find(res => res._id === data.form);
+            const formComp = instance.root?.getComponent('form');
+            const formInfo = formComp?.defaultDownloadedResources.find((res) => res._id === data.form);
             const displayMode = 'wizard';
-            return instance.options?.editForm?.display === displayMode && formInfo && formInfo.display !== displayMode;
+            return (instance.options?.editForm?.display === displayMode &&
+                ((data.form && !formInfo) || (formInfo && formInfo.display !== displayMode)));
         },
     },
     {
@@ -40,7 +42,7 @@ export default [
         input: true,
         dataSrc: 'url',
         data: {
-            url: '/form/{{ data.form }}/v'
+            url: '/form/{{ data.form }}/v',
         },
         searchField: 'title__regex',
         template: '<span>{{ item._vid }}</span>',
@@ -51,7 +53,7 @@ export default [
         weight: 10,
         lazyLoad: true,
         tooltip: 'You can lock the nested form to a specific revision by choosing the revision number here.',
-        customConditional: 'show = !!data.form'
+        customConditional: 'show = !!data.form',
     },
     {
         type: 'checkbox',
@@ -59,7 +61,7 @@ export default [
         weight: 19,
         key: 'useOriginalRevision',
         label: 'Use Original Revision while Submissions Viewing',
-        tooltip: 'Using this option will make form load the original revision (the one which was used to make a submission) when viewing a submission.'
+        tooltip: 'Using this option will make form load the original revision (the one which was used to make a submission) when viewing a submission.',
     },
     {
         type: 'checkbox',
@@ -67,6 +69,6 @@ export default [
         weight: 20,
         key: 'reference',
         label: 'Save as reference',
-        tooltip: 'Using this option will save this field as a reference and link its value to the value of the origin record.'
-    }
+        tooltip: 'Using this option will save this field as a reference and link its value to the value of the origin record.',
+    },
 ];

package/lib/mjs/components/hidden/Hidden.form.js

@@ -10,19 +10,19 @@ export default function (...extend) {
     return Components.baseEditForm([
         {
             key: 'display',
-            components: HiddenEditDisplay
+            components: HiddenEditDisplay,
         },
         {
             key: 'data',
-            components: HiddenEditData
+            components: HiddenEditData,
         },
         {
             key: 'validation',
-            ignore: true
+            ignore: true,
         },
         {
             key: 'conditional',
-            ignore: true
+            ignore: true,
         },
     ], ...extend);
 }

package/lib/mjs/components/hidden/Hidden.js

@@ -4,7 +4,7 @@ export default class HiddenComponent extends Input {
         return Input.schema({
             type: 'hidden',
             tableView: false,
-            inputType: 'hidden'
+            inputType: 'hidden',
         }, ...extend);
     }
     static get builderInfo() {
@@ -15,7 +15,7 @@ export default class HiddenComponent extends Input {
             weight: 0,
             documentation: '/userguide/form-building/data-components#hidden',
             showPreview: false,
-            schema: HiddenComponent.schema()
+            schema: HiddenComponent.schema(),
         };
     }
     get defaultSchema() {

package/lib/mjs/components/hidden/editForm/Hidden.edit.data.js

@@ -1,14 +1,14 @@
 export default [
     {
         key: 'multiple',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'clearOnHide',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'allowCalculateOverride',
-        ignore: true
+        ignore: true,
     },
 ];

package/lib/mjs/components/hidden/editForm/Hidden.edit.display.js

@@ -1,42 +1,42 @@
 export default [
     {
         key: 'labelPosition',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'placeholder',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'description',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'tooltip',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'hideLabel',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'autofocus',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'tabindex',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'hidden',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'tableView',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'disabled',
-        ignore: true
+        ignore: true,
     },
 ];

package/lib/mjs/components/html/HTML.js

@@ -9,7 +9,7 @@ export default class HTMLComponent extends Component {
             attrs: [],
             content: '',
             input: false,
-            persistent: false
+            persistent: false,
         }, ...extend);
     }
     static get builderInfo() {
@@ -20,7 +20,7 @@ export default class HTMLComponent extends Component {
             weight: 0,
             documentation: '/userguide/form-building/layout-components#html-element',
             showPreview: false,
-            schema: HTMLComponent.schema()
+            schema: HTMLComponent.schema(),
         };
     }
     static savedValueTypes() {
@@ -38,28 +38,34 @@ export default class HTMLComponent extends Component {
             return ` ${this.component.content} `;
         }
         const submission = _.get(this.root, 'submission', {});
-        const content = this.component.content ? this.interpolate(this.sanitize(this.component.content, this.shouldSanitizeValue), {
-            metadata: submission.metadata || {},
-            submission: submission,
-            data: this.rootValue,
-            row: this.data
-        }) : '';
+        const content = this.component.content
+            ? this.interpolate(this.sanitize(this.component.content, this.shouldSanitizeValue), {
+                metadata: submission.metadata || {},
+                submission: submission,
+                data: this.rootValue,
+                row: this.data,
+            })
+            : '';
         return content;
     }
     get singleTags() {
-        return ['br', 'img', 'hr'];
+        return [
+            'br',
+            'img',
+            'hr',
+        ];
     }
     checkRefreshOn(changed) {
         super.checkRefreshOn(changed);
         const isVisible = () => {
             return this.hasCondition() ? !this.conditionallyHidden() : !this.component.hidden;
         };
-        const shouldSetContent = !this.builderMode
-            && this.component.refreshOnChange
-            && this.element
-            && !_.isUndefined(changed)
-            && ((_.isBoolean(changed) && changed) || !_.isEmpty(changed))
-            && isVisible();
+        const shouldSetContent = !this.builderMode &&
+            this.component.refreshOnChange &&
+            this.element &&
+            !_.isUndefined(changed) &&
+            ((_.isBoolean(changed) && changed) || !_.isEmpty(changed)) &&
+            isVisible();
         if (shouldSetContent) {
             this.setContent(this.element, this.renderContent());
         }
@@ -76,8 +82,8 @@ export default class HTMLComponent extends Component {
                         metadata: submission.metadata || {},
                         submission: submission,
                         data: this.rootValue,
-                        row: this.data
-                    })
+                        row: this.data,
+                    }),
                 };
             }),
             content: this.content,