@formio/js 5.2.3 → 5.2.4-rc.0

package/lib/cjs/components/button/Button.js

@@ -21,7 +21,7 @@ class ButtonComponent extends Field_1.default {
             persistent: false,
             disableOnInvalid: false,
             theme: 'primary',
-            dataGridLabel: true
+            dataGridLabel: true,
         }, ...extend);
     }
     static get builderInfo() {
@@ -31,11 +31,13 @@ class ButtonComponent extends Field_1.default {
             icon: 'stop',
             documentation: '/userguide/form-building/form-components#button',
             weight: 110,
-            schema: ButtonComponent.schema()
+            schema: ButtonComponent.schema(),
         };
     }
     static savedValueTypes(schema) {
-        return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes.boolean];
+        return ((0, utils_1.getComponentSavedTypes)(schema) || [
+            utils_1.componentValueTypes.boolean,
+        ]);
     }
     constructor(component, options, data) {
         super(component, options, data);
@@ -47,7 +49,12 @@ class ButtonComponent extends Field_1.default {
     get inputInfo() {
         const info = super.elementInfo();
         info.type = 'button';
-        info.attr.type = (['submit', 'saveState'].includes(this.component.action)) ? 'submit' : 'button';
+        info.attr.type = [
+            'submit',
+            'saveState',
+        ].includes(this.component.action)
+            ? 'submit'
+            : 'button';
         this.component.theme = this.component.theme || 'default';
         info.attr.class = `btn btn-${this.component.theme}`;
         if (this.component.size) {
@@ -64,7 +71,7 @@ class ButtonComponent extends Field_1.default {
     }
     get labelInfo() {
         return {
-            hidden: true
+            hidden: true,
         };
     }
     set loading(loading) {
@@ -137,7 +144,9 @@ class ButtonComponent extends Field_1.default {
                 this.setContent(this.refs.buttonMessage, resultMessage);
             }, true);
             this.on('submitError', (message) => {
-                const resultMessage = lodash_1.default.isString(message) ? this.t(message) : this.t(this.errorMessage('submitError'));
+                const resultMessage = lodash_1.default.isString(message)
+                    ? this.t(message)
+                    : this.t(this.errorMessage('submitError'));
                 this.loading = false;
                 this.disabled = false;
                 this.hasError = true;
@@ -192,7 +201,11 @@ class ButtonComponent extends Field_1.default {
             const isSilent = flags && flags.silent;
             //check root validity only if disableOnInvalid is set and when it is not possible to make submission because of validation errors
             if (flags && flags.noValidate && (this.component.disableOnInvalid || this.hasError)) {
-                isValid = flags.rootValidity || (this.root ? (this.root.validate(this.root.data, { dirty: false, silentCheck: true }).length === 0) : true);
+                isValid =
+                    flags.rootValidity ||
+                        (this.root
+                            ? this.root.validate(this.root.data, { dirty: false, silentCheck: true }).length === 0
+                            : true);
                 flags.rootValidity = isValid;
             }
             this.isDisabledOnInvalid = this.component.disableOnInvalid && (isSilent || !isValid);
@@ -241,9 +254,9 @@ class ButtonComponent extends Field_1.default {
             return decodeURIComponent(results[1].replace(/\+/g, ' '));
         }
         // If this is an OpenID Provider initiated login, perform the click event immediately
-        if ((this.component.action === 'oauth') && this.oauthConfig && !this.oauthConfig.error) {
+        if (this.component.action === 'oauth' && this.oauthConfig && !this.oauthConfig.error) {
             const iss = getUrlParameter('iss');
-            if (iss && (this.oauthConfig.authURI.indexOf(iss) === 0)) {
+            if (iss && this.oauthConfig.authURI.indexOf(iss) === 0) {
                 this.openOauth(this.oauthConfig);
             }
         }
@@ -255,13 +268,12 @@ class ButtonComponent extends Field_1.default {
         this.loadRefs(element, {
             button: 'single',
             buttonMessageContainer: 'single',
-            buttonMessage: 'single'
+            buttonMessage: 'single',
         });
         const superAttach = super.attach(element);
         this.attachButton();
         return superAttach;
     }
-    /* eslint-enable max-statements */
     detach(element) {
         if (element && this.refs.button) {
             this.removeShortcut(this.refs.button);
@@ -288,7 +300,7 @@ class ButtonComponent extends Field_1.default {
                     noValidate: this.component.state === 'draft',
                     state: this.component.state || 'submitted',
                     component: this.component,
-                    instance: this
+                    instance: this,
                 });
                 break;
             case 'event':
@@ -298,7 +310,7 @@ class ButtonComponent extends Field_1.default {
                     type: this.interpolate(this.component.event),
                     component: this.component,
                     data: this.data,
-                    event: event
+                    event: event,
                 });
                 break;
             case 'custom': {
@@ -314,7 +326,7 @@ class ButtonComponent extends Field_1.default {
                 this.evaluate(this.component.custom, {
                     form,
                     flattened,
-                    components
+                    components,
                 });
                 this.triggerChange();
                 break;
@@ -323,11 +335,11 @@ class ButtonComponent extends Field_1.default {
                 this.loading = true;
                 this.emit('requestButton', {
                     component: this.component,
-                    instance: this
+                    instance: this,
                 });
                 this.emit('requestUrl', {
                     url: this.interpolate(this.component.url),
-                    headers: this.component.headers
+                    headers: this.component.headers,
                 });
                 break;
             case 'reset':
@@ -360,12 +372,13 @@ class ButtonComponent extends Field_1.default {
             console.warn('You must attach a Form API url to your form in order to use OAuth buttons.');
             return;
         }
-        /*eslint-disable camelcase */
         let params = {
             response_type: 'code',
             client_id: settings.clientId,
-            redirect_uri: (settings.redirectURI && this.interpolate(settings.redirectURI)) || window.location.origin || `${window.location.protocol}//${window.location.host}`,
-            scope: settings.scope
+            redirect_uri: (settings.redirectURI && this.interpolate(settings.redirectURI)) ||
+                window.location.origin ||
+                `${window.location.protocol}//${window.location.host}`,
+            scope: settings.scope,
         };
         if (settings.state) {
             params.state = settings.state;
@@ -374,16 +387,17 @@ class ButtonComponent extends Field_1.default {
             params.code_challenge = settings.code_challenge;
             params.code_challenge_method = 'S256';
         }
-        /*eslint-enable camelcase */
         // Needs for the correct redirection URI for the OpenID
         const originalRedirectUri = params.redirect_uri;
         // Make display optional.
         if (settings.display) {
             params.display = settings.display;
         }
-        params = Object.keys(params).map(key => {
+        params = Object.keys(params)
+            .map((key) => {
             return `${key}=${encodeURIComponent(params[key])}`;
-        }).join('&');
+        })
+            .join('&');
         const separator = settings.authURI.indexOf('?') !== -1 ? '&' : '?';
         const url = `${settings.authURI}${separator}${params}`;
         const popup = window.open(url, settings.provider, 'width=1020,height=618');
@@ -393,7 +407,10 @@ class ButtonComponent extends Field_1.default {
                 const currentHost = window.location.host;
                 if (popup && !popup.closed && popupHost === currentHost) {
                     popup.close();
-                    const params = popup.location.search.substr(1).split('&').reduce((params, param) => {
+                    const params = popup.location.search
+                        .substr(1)
+                        .split('&')
+                        .reduce((params, param) => {
                         const split = param.split('=');
                         params[split[0]] = split[1];
                         return params;
@@ -410,7 +427,8 @@ class ButtonComponent extends Field_1.default {
                     }
                     // Depending on where the settings came from, submit to either the submission endpoint (old) or oauth endpoint (new).
                     let requestPromise = Promise.resolve();
-                    if (lodash_1.default.has(this, 'root.form.config.oauth') && this.root.form.config.oauth[this.component.oauthProvider]) {
+                    if (lodash_1.default.has(this, 'root.form.config.oauth') &&
+                        this.root.form.config.oauth[this.component.oauthProvider]) {
                         params.provider = settings.provider;
                         params.redirectURI = originalRedirectUri;
                         // Needs for the exclude oAuth Actions that not related to this button
@@ -428,7 +446,8 @@ class ButtonComponent extends Field_1.default {
                         submission.oauth[settings.provider].triggeredBy = this.oauthComponentPath;
                         requestPromise = this.root.formio.saveSubmission(submission);
                     }
-                    requestPromise.then((result) => {
+                    requestPromise
+                        .then((result) => {
                         this.root.onSubmit(result, true);
                     })
                         .catch((err) => {
@@ -437,7 +456,8 @@ class ButtonComponent extends Field_1.default {
                 }
             }
             catch (error) {
-                if (error.name !== 'SecurityError' && (error.name !== 'Error' || error.message !== 'Permission denied')) {
+                if (error.name !== 'SecurityError' &&
+                    (error.name !== 'Error' || error.message !== 'Permission denied')) {
                     this.root.setAlert('danger', error.message || error);
                 }
             }
@@ -448,7 +468,10 @@ class ButtonComponent extends Field_1.default {
     }
     get oauthComponentPath() {
         const pathArray = (0, utils_1.getArrayFromComponentPath)(this.path);
-        return lodash_1.default.chain(pathArray).filter(pathPart => !lodash_1.default.isNumber(pathPart)).join('.').value();
+        return lodash_1.default.chain(pathArray)
+            .filter((pathPart) => !lodash_1.default.isNumber(pathPart))
+            .join('.')
+            .value();
     }
     focus() {
         if (this.refs.button) {

package/lib/cjs/components/button/editForm/Button.edit.display.js

@@ -61,7 +61,12 @@ exports.default = [
             ],
         },
         conditional: {
-            json: { '===': [{ var: 'data.action' }, 'oauth'] },
+            json: {
+                '===': [
+                    { var: 'data.action' },
+                    'oauth',
+                ],
+            },
         },
     },
     {
@@ -73,7 +78,12 @@ exports.default = [
         placeholder: 'submitted',
         input: true,
         conditional: {
-            json: { '===': [{ var: 'data.action' }, 'saveState'] },
+            json: {
+                '===': [
+                    { var: 'data.action' },
+                    'saveState',
+                ],
+            },
         },
     },
     {
@@ -85,7 +95,12 @@ exports.default = [
         weight: 113,
         tooltip: 'Use the Enter key to submit form.',
         conditional: {
-            json: { '===': [{ var: 'data.action' }, 'submit'] },
+            json: {
+                '===': [
+                    { var: 'data.action' },
+                    'submit',
+                ],
+            },
         },
     },
     {
@@ -97,7 +112,12 @@ exports.default = [
         weight: 115,
         tooltip: 'When the button is pressed, show any validation errors on the form.',
         conditional: {
-            json: { '!==': [{ var: 'data.action' }, 'submit'] },
+            json: {
+                '!==': [
+                    { var: 'data.action' },
+                    'submit',
+                ],
+            },
         },
     },
     {
@@ -108,7 +128,12 @@ exports.default = [
         weight: 120,
         tooltip: 'The event to fire when the button is clicked.',
         conditional: {
-            json: { '===': [{ var: 'data.action' }, 'event'] },
+            json: {
+                '===': [
+                    { var: 'data.action' },
+                    'event',
+                ],
+            },
         },
     },
     {
@@ -121,7 +146,12 @@ exports.default = [
         tooltip: 'The URL where the submission will be sent.',
         placeholder: 'https://example.form.io',
         conditional: {
-            json: { '===': [{ var: 'data.action' }, 'url'] },
+            json: {
+                '===': [
+                    { var: 'data.action' },
+                    'url',
+                ],
+            },
         },
     },
     {
@@ -144,10 +174,15 @@ exports.default = [
                 label: 'Value',
                 input: true,
                 type: 'textfield',
-            }
+            },
         ],
         conditional: {
-            json: { '===': [{ var: 'data.action' }, 'url'] },
+            json: {
+                '===': [
+                    { var: 'data.action' },
+                    'url',
+                ],
+            },
         },
     },
     {
@@ -161,7 +196,12 @@ exports.default = [
         weight: 120,
         placeholder: "data['mykey'] = data['anotherKey'];",
         conditional: {
-            json: { '===': [{ var: 'data.action' }, 'custom'] },
+            json: {
+                '===': [
+                    { var: 'data.action' },
+                    'custom',
+                ],
+            },
         },
     },
     {

package/lib/cjs/components/checkbox/Checkbox.d.ts

@@ -43,7 +43,7 @@ export default class CheckBoxComponent extends Field {
     attach(element: any): Promise<void>;
     input: any;
     detach(element: any): void;
-    get emptyValue(): false | null;
+    get emptyValue(): false | "";
     getValueAt(index: any): any;
     get checked(): boolean;
     setCheckedState(value: any): any;

package/lib/cjs/components/checkbox/Checkbox.form.js

@@ -16,15 +16,15 @@ function default_1(...extend) {
     return Components_1.default.baseEditForm([
         {
             key: 'data',
-            components: Checkbox_edit_data_1.default
+            components: Checkbox_edit_data_1.default,
         },
         {
             key: 'display',
-            components: Checkbox_edit_display_1.default
+            components: Checkbox_edit_display_1.default,
         },
         {
             key: 'validation',
-            components: Checkbox_edit_validation_1.default
+            components: Checkbox_edit_validation_1.default,
         },
     ], ...extend);
 }

package/lib/cjs/components/checkbox/Checkbox.js

@@ -16,7 +16,7 @@ class CheckBoxComponent extends Field_1.default {
             dataGridLabel: true,
             labelPosition: 'right',
             value: '',
-            name: ''
+            name: '',
         }, ...extend);
     }
     static get builderInfo() {
@@ -26,23 +26,25 @@ class CheckBoxComponent extends Field_1.default {
             icon: 'check-square',
             documentation: '/userguide/form-building/form-components#check-box',
             weight: 50,
-            schema: CheckBoxComponent.schema()
+            schema: CheckBoxComponent.schema(),
         };
     }
     static get serverConditionSettings() {
         return CheckBoxComponent.conditionOperatorsSettings;
     }
     static get conditionOperatorsSettings() {
-        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: ['isEqual'], valueComponent() {
+        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: [
+                'isEqual',
+            ], valueComponent() {
                 return {
                     valueType: 'boolean',
                     data: {
                         values: [
                             { label: 'Checked', value: 'true' },
                             { label: 'Not Checked', value: 'false' },
-                        ]
+                        ],
                     },
-                    type: 'select'
+                    type: 'select',
                 };
             } });
     }
@@ -53,19 +55,23 @@ class CheckBoxComponent extends Field_1.default {
             return types;
         }
         if (schema.inputType === 'radio') {
-            return [utils_1.componentValueTypes.string];
+            return [
+                utils_1.componentValueTypes.string,
+            ];
         }
-        return [utils_1.componentValueTypes.boolean];
+        return [
+            utils_1.componentValueTypes.boolean,
+        ];
     }
     get defaultSchema() {
         return CheckBoxComponent.schema();
     }
     get labelClass() {
         let className = '';
-        if (this.isInputComponent
-            && !this.options.inputsOnly
-            && this.component.validate
-            && this.component.validate.required) {
+        if (this.isInputComponent &&
+            !this.options.inputsOnly &&
+            this.component.validate &&
+            this.component.validate.required) {
             className += ' field-required';
         }
         return `${className}`;
@@ -89,14 +95,16 @@ class CheckBoxComponent extends Field_1.default {
     }
     get labelInfo() {
         return {
-            hidden: true
+            hidden: true,
         };
     }
     render() {
         return super.render(this.renderTemplate('checkbox', {
             input: this.inputInfo,
             checked: this.checked,
-            tooltip: this.interpolate(this.t(this.component.tooltip) || '', { _userInput: true }).replace(/(?:\r\n|\r|\n)/g, '<br />')
+            tooltip: this.interpolate(this.t(this.component.tooltip) || '', {
+                _userInput: true,
+            }).replace(/(?:\r\n|\r|\n)/g, '<br />'),
         }));
     }
     attach(element) {
@@ -104,7 +112,7 @@ class CheckBoxComponent extends Field_1.default {
         this.input = this.refs.input[0];
         if (this.refs.input) {
             this.addEventListener(this.input, this.inputInfo.changeEvent, () => this.updateValue(null, {
-                modified: true
+                modified: true,
             }));
             this.addShortcut(this.input);
         }
@@ -117,7 +125,7 @@ class CheckBoxComponent extends Field_1.default {
         super.detach();
     }
     get emptyValue() {
-        return this.component.inputType === 'radio' ? null : false;
+        return this.component.inputType === 'radio' ? '' : false;
     }
     isEmpty(value = this.dataValue) {
         return super.isEmpty(value) || value === false;
@@ -137,12 +145,12 @@ class CheckBoxComponent extends Field_1.default {
             return value ? this.setCheckedState(value) : this.setCheckedState(this.dataValue);
         }
         else {
-            return (value === '') ? this.dataValue : !!value;
+            return value === '' ? this.dataValue : !!value;
         }
     }
     get checked() {
         if (this.component.name) {
-            return (this.dataValue === this.component.value);
+            return this.dataValue === this.component.value;
         }
         return !!this.dataValue;
     }
@@ -151,8 +159,8 @@ class CheckBoxComponent extends Field_1.default {
             return;
         }
         if (this.component.name) {
-            this.input.value = (value === this.component.value) ? this.component.value : 0;
-            this.input.checked = (value === this.component.value) ? 1 : 0;
+            this.input.value = value === this.component.value ? this.component.value : 0;
+            this.input.checked = value === this.component.value ? 1 : 0;
         }
         else if (value === 'on') {
             this.input.value = 1;
@@ -192,7 +200,7 @@ class CheckBoxComponent extends Field_1.default {
     }
     updateValue(value, flags) {
         // If this is a radio and is alredy checked, uncheck it.
-        if (this.component.name && flags.modified && (this.dataValue === this.component.value)) {
+        if (this.component.name && flags.modified && this.dataValue === this.component.value) {
             this.input.checked = 0;
             this.input.value = 0;
             this.dataValue = '';

package/lib/cjs/components/checkbox/editForm/Checkbox.edit.data.js

@@ -3,6 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = [
     {
         key: 'multiple',
-        ignore: true
+        ignore: true,
     },
 ];

package/lib/cjs/components/checkbox/editForm/Checkbox.edit.display.js

@@ -16,7 +16,7 @@ exports.default = [
     },
     {
         key: 'labelMargin',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'placeholder',
@@ -62,7 +62,12 @@ exports.default = [
         tooltip: 'The key used to trigger the radio button toggle.',
         weight: 420,
         conditional: {
-            json: { '===': [{ var: 'data.inputType' }, 'radio'] },
+            json: {
+                '===': [
+                    { var: 'data.inputType' },
+                    'radio',
+                ],
+            },
         },
     },
     {
@@ -73,7 +78,12 @@ exports.default = [
         tooltip: 'The value used with this radio button.',
         weight: 430,
         conditional: {
-            json: { '===': [{ var: 'data.inputType' }, 'radio'] },
+            json: {
+                '===': [
+                    { var: 'data.inputType' },
+                    'radio',
+                ],
+            },
         },
     },
 ];

package/lib/cjs/components/checkbox/editForm/Checkbox.edit.validation.js

@@ -3,10 +3,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = [
     {
         key: 'validateOn',
-        ignore: true
+        ignore: true,
     },
     {
         key: 'unique',
-        ignore: true
+        ignore: true,
     },
 ];

package/lib/cjs/components/columns/Columns.form.js

@@ -14,7 +14,7 @@ function default_1(...extend) {
     return (0, NestedComponent_form_1.default)([
         {
             key: 'display',
-            components: Columns_edit_display_1.default
+            components: Columns_edit_display_1.default,
         },
     ], ...extend);
 }

package/lib/cjs/components/columns/Columns.js

@@ -13,13 +13,13 @@ class ColumnsComponent extends NestedComponent_1.default {
             type: 'columns',
             columns: [
                 { components: [], width: 6, offset: 0, push: 0, pull: 0, size: 'md' },
-                { components: [], width: 6, offset: 0, push: 0, pull: 0, size: 'md' }
+                { components: [], width: 6, offset: 0, push: 0, pull: 0, size: 'md' },
             ],
             clearOnHide: false,
             input: false,
             tableView: false,
             persistent: false,
-            autoAdjust: false
+            autoAdjust: false,
         }, ...extend);
     }
     static get builderInfo() {
@@ -30,7 +30,7 @@ class ColumnsComponent extends NestedComponent_1.default {
             documentation: '/userguide/form-building/layout-components#columns',
             showPreview: false,
             weight: 10,
-            schema: ColumnsComponent.schema()
+            schema: ColumnsComponent.schema(),
         };
     }
     static savedValueTypes() {
@@ -42,7 +42,9 @@ class ColumnsComponent extends NestedComponent_1.default {
     }
     get schema() {
         var _a;
-        const schema = lodash_1.default.omit(super.schema, ['components']);
+        const schema = lodash_1.default.omit(super.schema, [
+            'components',
+        ]);
         (_a = schema.columns) === null || _a === void 0 ? void 0 : _a.map((column, colIndex) => {
             column.components.map((comp, compIndex) => {
                 const clonedComp = lodash_1.default.clone(comp);
@@ -93,13 +95,13 @@ class ColumnsComponent extends NestedComponent_1.default {
     render() {
         return super.render(this.renderTemplate('columns', {
             columnKey: this.columnKey,
-            columnComponents: this.columns.map(column => this.renderComponents(column))
+            columnComponents: this.columns.map((column) => this.renderComponents(column)),
         }));
     }
     justifyColumn(items, index) {
-        const toAdjust = lodash_1.default.every(items, item => !item.visible);
+        const toAdjust = lodash_1.default.every(items, (item) => !item.visible);
         const column = this.component.columns[index];
-        const width = (toAdjust && items.length) ? 0 : column.width;
+        const width = toAdjust && items.length ? 0 : column.width;
         const shouldRedraw = !lodash_1.default.isEqual(width, column.currentWidth);
         column.currentWidth = width;
         return shouldRedraw;
@@ -124,20 +126,30 @@ class ColumnsComponent extends NestedComponent_1.default {
      */
     groupByRow() {
         const initVal = { stack: [], rows: [] };
-        const width = x => x.component.width;
+        const width = (x) => x.component.width;
         const result = lodash_1.default.reduce(this.components, (acc, next) => {
-            const stack = [...acc.stack, next];
+            const stack = [
+                ...acc.stack,
+                next,
+            ];
             if (lodash_1.default.sumBy(stack, width) <= this.gridSize) {
                 acc.stack = stack;
                 return acc;
             }
             else {
-                acc.rows = [...acc.rows, acc.stack];
-                acc.stack = [next];
+                acc.rows = [
+                    ...acc.rows,
+                    acc.stack,
+                ];
+                acc.stack = [
+                    next,
+                ];
                 return acc;
             }
         }, initVal);
-        return lodash_1.default.concat(result.rows, [result.stack]);
+        return lodash_1.default.concat(result.rows, [
+            result.stack,
+        ]);
     }
     checkData(data, flags, row, components) {
         super.checkData(data, flags, row, components);