@formio/js 5.2.4-rc.0 → 5.2.5

package/lib/mjs/components/selectboxes/editForm/SelectBoxes.edit.validation.js

@@ -5,7 +5,7 @@ export default [
         key: 'validate.minSelectedCount',
         label: 'Minimum checked number',
         tooltip: 'Minimum checkboxes required before form can be submitted.',
-        weight: 250,
+        weight: 250
     },
     {
         type: 'number',
@@ -13,7 +13,7 @@ export default [
         key: 'validate.maxSelectedCount',
         label: 'Maximum checked number',
         tooltip: 'Maximum checkboxes possible before form can be submitted.',
-        weight: 250,
+        weight: 250
     },
     {
         type: 'textfield',
@@ -21,7 +21,7 @@ export default [
         key: 'minSelectedCountMessage',
         label: 'Minimum checked error message',
         tooltip: 'Error message displayed if minimum number of items not checked.',
-        weight: 250,
+        weight: 250
     },
     {
         type: 'textfield',
@@ -29,6 +29,6 @@ export default [
         key: 'maxSelectedCountMessage',
         label: 'Maximum checked error message',
         tooltip: 'Error message displayed if maximum number of items checked.',
-        weight: 250,
-    },
+        weight: 250
+    }
 ];

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

@@ -11,15 +11,15 @@ export default function (...extend) {
     return Components.baseEditForm([
         {
             key: 'display',
-            components: SignatureEditDisplay,
+            components: SignatureEditDisplay
         },
         {
             key: 'data',
-            components: SignatureEditData,
+            components: SignatureEditData
         },
         {
             key: 'validation',
-            components: SignatureEditValidation,
+            components: SignatureEditValidation
         },
     ], ...extend);
 }

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

@@ -25,7 +25,7 @@ export default class SignatureComponent extends Input {
             icon: 'pencil',
             weight: 120,
             documentation: '/developers/integrations/esign/esign-integrations#signature-component',
-            schema: SignatureComponent.schema(),
+            schema: SignatureComponent.schema()
         };
     }
     static get serverConditionSettings() {
@@ -34,17 +34,12 @@ export default class SignatureComponent extends Input {
     static get conditionOperatorsSettings() {
         return {
             ...super.conditionOperatorsSettings,
-            operators: [
-                'isEmpty',
-                'isNotEmpty',
-            ],
+            operators: ['isEmpty', 'isNotEmpty'],
         };
     }
     static savedValueTypes(schema) {
         schema = schema || {};
-        return (getComponentSavedTypes(schema) || [
-            componentValueTypes.string,
-        ]);
+        return getComponentSavedTypes(schema) || [componentValueTypes.string];
     }
     init() {
         super.init();
@@ -56,10 +51,10 @@ export default class SignatureComponent extends Input {
         if (!this.component.height) {
             this.component.height = '200px';
         }
-        if (this.component.keepOverlayRatio &&
-            this.options?.display === 'pdf' &&
-            this.component.overlay?.width &&
-            this.component.overlay?.height) {
+        if (this.component.keepOverlayRatio
+            && this.options?.display === 'pdf'
+            && this.component.overlay?.width
+            && this.component.overlay?.height) {
             this.ratio = this.component.overlay?.width / this.component.overlay?.height;
             this.component.width = '100%';
             this.component.height = 'auto';
@@ -94,7 +89,7 @@ export default class SignatureComponent extends Input {
                 this.signaturePad.clear();
             }
             else if (changed) {
-                this.triggerChange();
+                this.triggerChange?.();
             }
         }
         if (this.signaturePad && this.dataValue && this.signaturePad.isEmpty()) {
@@ -142,8 +137,7 @@ export default class SignatureComponent extends Input {
         }
     }
     checkSize(force, scale) {
-        if (this.refs.padBody &&
-            (force || (this.refs.padBody && this.refs.padBody.offsetWidth !== this.currentWidth))) {
+        if (this.refs.padBody && (force || this.refs.padBody && this.refs.padBody.offsetWidth !== this.currentWidth)) {
             this.scale = force ? scale : this.scale;
             this.currentWidth = this.refs.padBody.offsetWidth;
             const width = this.currentWidth * this.scale;
@@ -155,7 +149,7 @@ export default class SignatureComponent extends Input {
             this.refs.canvas.style.maxHeight = `${maxHeight}px`;
             const ctx = this.refs.canvas.getContext('2d');
             ctx.setTransform(1, 0, 0, 1, 0, 0);
-            ctx.scale(1 / this.scale, 1 / this.scale);
+            ctx.scale((1 / this.scale), (1 / this.scale));
             ctx.fillStyle = this.signaturePad.backgroundColor;
             ctx.fillRect(0, 0, this.refs.canvas.width, this.refs.canvas.height);
             this.signaturePad.clear();
@@ -178,18 +172,13 @@ export default class SignatureComponent extends Input {
     }
     getModalPreviewTemplate() {
         return this.renderModalPreview({
-            previewText: this.dataValue
-                ? `<img src=${this.dataValue} ${this._referenceAttributeName}='openModal' style="width: 100%;height: 100%;" />`
-                : this.t('Click to Sign'),
+            previewText: this.dataValue ?
+                `<img src=${this.dataValue} ${this._referenceAttributeName}='openModal' style="width: 100%;height: 100%;" />` :
+                this.t('Click to Sign')
         });
     }
     attach(element) {
-        this.loadRefs(element, {
-            canvas: 'single',
-            refresh: 'single',
-            padBody: 'single',
-            signatureImage: 'single',
-        });
+        this.loadRefs(element, { canvas: 'single', refresh: 'single', padBody: 'single', signatureImage: 'single' });
         const superAttach = super.attach(element);
         if (this.refs.refresh && this.options.readOnly) {
             this.refs.refresh.classList.add('disabled');
@@ -200,7 +189,7 @@ export default class SignatureComponent extends Input {
                 minWidth: this.component.minWidth,
                 maxWidth: this.component.maxWidth,
                 penColor: this.component.penColor,
-                backgroundColor: this.component.backgroundColor,
+                backgroundColor: this.component.backgroundColor
             });
             this.signaturePad.addEventListener('endStroke', () => this.setValue(this.signaturePad.toDataURL()));
             this.refs.signatureImage.setAttribute('src', this.signaturePad.toDataURL());
@@ -236,6 +225,7 @@ export default class SignatureComponent extends Input {
         this.setValue(this.dataValue);
         return superAttach;
     }
+    /* eslint-enable max-statements */
     detach() {
         if (this.observer) {
             this.observer.disconnect();

package/lib/mjs/components/signature/editForm/Signature.edit.display.js

@@ -6,7 +6,7 @@ export default [
         label: 'Footer Label',
         tooltip: 'The footer text that appears below the signature area.',
         placeholder: 'Footer Label',
-        weight: 10,
+        weight: 10
     },
     {
         type: 'textfield',
@@ -16,13 +16,9 @@ export default [
         tooltip: 'The width of the signature area.',
         placeholder: 'Width',
         conditional: {
-            json: {
-                '!': [
-                    { var: 'data.keepOverlayRatio' },
-                ],
-            },
+            json: { '!': [{ var: 'data.keepOverlayRatio' }] },
         },
-        weight: 50,
+        weight: 50
     },
     {
         type: 'textfield',
@@ -30,15 +26,10 @@ export default [
         key: 'height',
         label: 'Height',
         tooltip: 'The height of the signature area.',
-        placeholder: 'Height',
-        conditional: {
-            json: {
-                '!': [
-                    { var: 'data.keepOverlayRatio' },
-                ],
-            },
+        placeholder: 'Height', conditional: {
+            json: { '!': [{ var: 'data.keepOverlayRatio' }] },
         },
-        weight: 51,
+        weight: 51
     },
     {
         weight: 52,
@@ -46,8 +37,8 @@ export default [
         label: 'Keep Overlay Aspect Ratio',
         tooltip: 'If checked, the field will have the same aspect ratio as its preview.',
         key: 'keepOverlayRatio',
-        customConditional: ({ options }) => options?.editForm?.display === 'pdf',
-        input: true,
+        customConditional: ({ options }) => (options?.editForm?.display === 'pdf'),
+        input: true
     },
     {
         type: 'textfield',
@@ -56,7 +47,7 @@ export default [
         label: 'Background Color',
         tooltip: 'The background color of the signature area.',
         placeholder: 'Background Color',
-        weight: 52,
+        weight: 52
     },
     {
         type: 'textfield',
@@ -65,7 +56,7 @@ export default [
         label: 'Pen Color',
         tooltip: 'The ink color for the signature area.',
         placeholder: 'Pen Color',
-        weight: 53,
+        weight: 53
     },
     {
         key: 'placeholder',

package/lib/mjs/components/survey/Survey.form.js

@@ -11,15 +11,15 @@ export default function (...extend) {
     return Components.baseEditForm([
         {
             key: 'display',
-            components: SurveyEditDisplay,
+            components: SurveyEditDisplay
         },
         {
             key: 'data',
-            components: SurveyEditData,
+            components: SurveyEditData
         },
         {
             key: 'validation',
-            components: SurveyEditValidation,
+            components: SurveyEditValidation
         },
     ], ...extend);
 }

package/lib/mjs/components/survey/Survey.js

@@ -8,7 +8,7 @@ export default class SurveyComponent extends Field {
             label: 'Survey',
             key: 'survey',
             questions: [],
-            values: [],
+            values: []
         }, ...extend);
     }
     static get builderInfo() {
@@ -18,7 +18,7 @@ export default class SurveyComponent extends Field {
             icon: 'list',
             weight: 110,
             documentation: '/userguide/form-building/advanced-components#survey',
-            schema: SurveyComponent.schema(),
+            schema: SurveyComponent.schema()
         };
     }
     static get serverConditionSettings() {
@@ -27,16 +27,11 @@ export default class SurveyComponent extends Field {
     static get conditionOperatorsSettings() {
         return {
             ...super.conditionOperatorsSettings,
-            operators: [
-                'isEmpty',
-                'isNotEmpty',
-            ],
+            operators: ['isEmpty', 'isNotEmpty'],
         };
     }
     static savedValueTypes(schema) {
-        return (getComponentSavedTypes(schema) || [
-            componentValueTypes.object,
-        ]);
+        return getComponentSavedTypes(schema) || [componentValueTypes.object];
     }
     get defaultSchema() {
         return SurveyComponent.schema();
@@ -53,7 +48,7 @@ export default class SurveyComponent extends Field {
             }
             else {
                 this.addEventListener(input, 'change', () => this.updateValue(null, {
-                    modified: true,
+                    modified: true
                 }));
             }
         });
@@ -67,7 +62,7 @@ export default class SurveyComponent extends Field {
         _.each(this.component.questions, (question) => {
             _.each(this.refs.input, (input) => {
                 if (input.name === this.getInputName(question)) {
-                    input.checked = input.value === value[question.value];
+                    input.checked = (input.value === value[question.value]);
                 }
             });
         });
@@ -83,11 +78,9 @@ export default class SurveyComponent extends Field {
     get defaultValue() {
         const defaultValue = super.defaultValue;
         //support for default values created in old formio.js versions
-        if (defaultValue &&
-            !_.isObject(defaultValue) &&
-            this.component.values.some((value) => value.value === defaultValue)) {
+        if (defaultValue && !_.isObject(defaultValue) && this.component.values.some(value => value.value === defaultValue)) {
             const adoptedDefaultValue = {};
-            this.component.questions.forEach((question) => {
+            this.component.questions.forEach(question => {
                 adoptedDefaultValue[question.value] = defaultValue;
             });
             return adoptedDefaultValue;
@@ -101,7 +94,7 @@ export default class SurveyComponent extends Field {
         const value = {};
         _.each(this.component.questions, (question) => {
             _.each(this.refs.input, (input) => {
-                if (input.checked && input.name === this.getInputName(question)) {
+                if (input.checked && (input.name === this.getInputName(question))) {
                     value[question.value] = input.value;
                     return false;
                 }
@@ -129,7 +122,7 @@ export default class SurveyComponent extends Field {
     }
     getValueAsString(value, options) {
         if (options?.email) {
-            let result = `
+            let result = (`
         <table border="1" style="width:100%">
           <thead>
             <tr>
@@ -138,25 +131,19 @@ export default class SurveyComponent extends Field {
             </tr>
           </thead>
           <tbody>
-      `;
+      `);
             _.forIn(value, (value, key) => {
-                const question = _.find(this.component.questions, [
-                    'value',
-                    key,
-                ]);
-                const answer = _.find(this.component.values, [
-                    'value',
-                    value,
-                ]);
+                const question = _.find(this.component.questions, ['value', key]);
+                const answer = _.find(this.component.values, ['value', value]);
                 if (!question || !answer) {
                     return;
                 }
-                result += `
+                result += (`
             <tr>
               <td style="text-align:center;padding: 5px 10px;">${question.label}</td>
               <td style="text-align:center;padding: 5px 10px;">${answer.label}</td>
             </tr>
-          `;
+          `);
             });
             result += '</tbody></table>';
             return result;
@@ -166,8 +153,8 @@ export default class SurveyComponent extends Field {
             return _.isEmpty(value)
                 ? ''
                 : _.map(value, (v, q) => {
-                    const valueLabel = _.get(_.find(values, (val) => _.isEqual(val.value, v)), 'label', v);
-                    const questionLabel = _.get(_.find(questions, (quest) => _.isEqual(quest.value, q)), 'label', q);
+                    const valueLabel = _.get(_.find(values, val => _.isEqual(val.value, v)), 'label', v);
+                    const questionLabel = _.get(_.find(questions, quest => _.isEqual(quest.value, q)), 'label', q);
                     return `${questionLabel}: ${valueLabel}`;
                 }).join('; ');
         }

package/lib/mjs/components/survey/editForm/Survey.edit.data.js

@@ -1,7 +1,7 @@
 export default [
     {
         key: 'multiple',
-        ignore: true,
+        ignore: true
     },
     {
         type: 'datagrid',
@@ -11,15 +11,13 @@ export default [
         tooltip: 'The questions you would like to ask in this survey question.',
         weight: 0,
         reorder: true,
-        defaultValue: [
-            { label: '', value: '' },
-        ],
+        defaultValue: [{ label: '', value: '' }],
         components: [
             {
                 label: 'Label',
                 key: 'label',
                 input: true,
-                type: 'textfield',
+                type: 'textfield'
             },
             {
                 label: 'Value',
@@ -27,11 +25,7 @@ export default [
                 input: true,
                 type: 'textfield',
                 allowCalculateOverride: true,
-                calculateValue: {
-                    _camelCase: [
-                        { var: 'row.label' },
-                    ],
-                },
+                calculateValue: { _camelCase: [{ var: 'row.label' }] }
             },
             {
                 label: 'Tooltip',
@@ -39,25 +33,23 @@ export default [
                 input: true,
                 type: 'textfield',
             },
-        ],
+        ]
     },
     {
         type: 'datagrid',
         input: true,
         label: 'Values',
         key: 'values',
-        tooltip: "The values that can be selected per question. Example: 'Satisfied', 'Very Satisfied', etc.",
+        tooltip: 'The values that can be selected per question. Example: \'Satisfied\', \'Very Satisfied\', etc.',
         weight: 1,
         reorder: true,
-        defaultValue: [
-            { label: '', value: '' },
-        ],
+        defaultValue: [{ label: '', value: '' }],
         components: [
             {
                 label: 'Label',
                 key: 'label',
                 input: true,
-                type: 'textfield',
+                type: 'textfield'
             },
             {
                 label: 'Value',
@@ -65,11 +57,7 @@ export default [
                 input: true,
                 type: 'textfield',
                 allowCalculateOverride: true,
-                calculateValue: {
-                    _camelCase: [
-                        { var: 'row.label' },
-                    ],
-                },
+                calculateValue: { _camelCase: [{ var: 'row.label' }] }
             },
             {
                 label: 'Tooltip',
@@ -77,6 +65,6 @@ export default [
                 input: true,
                 type: 'textfield',
             },
-        ],
-    },
+        ]
+    }
 ];

package/lib/mjs/components/survey/editForm/Survey.edit.display.js

@@ -1,6 +1,6 @@
 export default [
     {
         key: 'placeholder',
-        ignore: true,
+        ignore: true
     },
 ];

package/lib/mjs/components/survey/editForm/Survey.edit.validation.js

@@ -1,6 +1,6 @@
 export default [
     {
         key: 'validateOn',
-        ignore: true,
+        ignore: true
     },
 ];

package/lib/mjs/components/table/Table.form.js

@@ -9,7 +9,7 @@ export default function (...extend) {
     return nestedComponentForm([
         {
             key: 'display',
-            components: TableEditDisplay,
+            components: TableEditDisplay
         },
     ], ...extend);
 }

package/lib/mjs/components/table/Table.js

@@ -29,7 +29,7 @@ export default class TableComponent extends NestedComponent {
             bordered: false,
             hover: false,
             condensed: false,
-            persistent: false,
+            persistent: false
         }, ...extend);
     }
     static get builderInfo() {
@@ -40,7 +40,7 @@ export default class TableComponent extends NestedComponent {
             weight: 40,
             documentation: '/userguide/form-building/layout-components#table',
             showPreview: false,
-            schema: TableComponent.schema(),
+            schema: TableComponent.schema()
         };
     }
     static savedValueTypes() {
@@ -103,9 +103,7 @@ export default class TableComponent extends NestedComponent {
         for (let rowIndex = 0; rowIndex < this.component.numRows; rowIndex++) {
             this.component.rows[rowIndex] = this.component.rows[rowIndex] || [];
             for (let colIndex = 0; colIndex < this.component.numCols; colIndex++) {
-                this.component.rows[rowIndex][colIndex] = this.component.rows[rowIndex][colIndex] || {
-                    components: [],
-                };
+                this.component.rows[rowIndex][colIndex] = this.component.rows[rowIndex][colIndex] || { components: [] };
             }
             this.component.rows[rowIndex] = this.component.rows[rowIndex].slice(0, this.component.numCols);
         }
@@ -122,7 +120,7 @@ export default class TableComponent extends NestedComponent {
                     }
                     else if (lastNonEmptyRow[colIndex]) {
                         column.components = _.cloneDeep(lastNonEmptyRow[colIndex].components);
-                        BuilderUtils.uniquify(this.root._form.components, column);
+                        BuilderUtils.uniquify(this.root?._form.components, column);
                     }
                 }
                 _.each(column.components, (comp) => {
@@ -132,7 +130,7 @@ export default class TableComponent extends NestedComponent {
                         columnComponent = comp;
                     }
                     else {
-                        columnComponent = { ...comp, id: comp.id + rowIndex };
+                        columnComponent = { ...comp, id: (comp.id + rowIndex) };
                     }
                     const component = this.createComponent(columnComponent);
                     component.tableRow = rowIndex;
@@ -147,7 +145,7 @@ export default class TableComponent extends NestedComponent {
             cellClassName: this.cellClassName,
             tableKey: this.tableKey,
             colWidth: this.colWidth,
-            tableComponents: this.table.map((row) => row.map((column) => this.renderComponents(column))),
+            tableComponents: this.table.map(row => row.map(column => this.renderComponents(column)))
         }));
     }
     attach(element) {