@formio/js 5.0.0-rc.86 → 5.0.0-rc.87

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

@@ -20,7 +20,7 @@
 
 /*! @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 */
 
-/*! formiojs v5.0.0-rc.85 | https://unpkg.com/formiojs@5.0.0-rc.85/LICENSE.txt */
+/*! formiojs v5.0.0-rc.87 | https://unpkg.com/formiojs@5.0.0-rc.87/LICENSE.txt */
 
 /**
  * @license

package/lib/cjs/Webform.js

@@ -1244,7 +1244,7 @@ class Webform extends NestedDataComponent_1.default {
         const errors = shouldValidate
             ? this.validate(value.data, Object.assign(Object.assign({}, flags), { noValidate: false, process: 'change' }))
             : [];
-        value.isValid = errors.length === 0;
+        value.isValid = (errors || []).filter(err => !err.fromServer).length === 0;
         this.loading = false;
         if (this.submitted) {
             // show server errors while they are not cleaned/fixed

package/lib/cjs/Wizard.d.ts

@@ -105,6 +105,7 @@ declare class Wizard extends Webform {
     pageId(page: any): any;
     onChange(flags: any, changed: any, modified: any, changes: any): void;
     checkValidity(data: any, dirty: any, row: any, currentPageOnly: any, childErrors?: any[]): any;
+    showErrors(errors: any, triggerEvent: any): void | any[];
     focusOnComponent(key: any): void | Promise<void>;
 }
 declare namespace Wizard {

package/lib/cjs/Wizard.js

@@ -924,6 +924,17 @@ class Wizard extends Webform_1.default {
         }
         return super.errors;
     }
+    showErrors(errors, triggerEvent) {
+        if (this.hasExtraPages) {
+            this.subWizards.forEach((subWizard) => {
+                if (Array.isArray(subWizard.errors)) {
+                    errors = [...errors, ...subWizard.errors];
+                }
+            });
+        }
+        ;
+        return super.showErrors(errors, triggerEvent);
+    }
     focusOnComponent(key) {
         const component = this.getComponent(key);
         if (component) {
@@ -931,7 +942,7 @@ class Wizard extends Webform_1.default {
             while (!(topPanel.parent instanceof Wizard)) {
                 topPanel = topPanel.parent;
             }
-            const pageIndex = this.pages.findIndex(page => page === topPanel);
+            const pageIndex = this.pages.findIndex(page => page.id === topPanel.id);
             if (pageIndex >= 0) {
                 const page = this.pages[pageIndex];
                 if (page && page !== this.currentPage) {

package/lib/cjs/components/_classes/component/Component.d.ts

@@ -867,6 +867,11 @@ declare class Component extends Element {
      * @returns {boolean} - If the value changed.
      */
     setValue(value: any, flags?: any): boolean;
+    /**
+     * Returns if the value (e.g. array) should be divided between several inputs
+     * @returns {boolean}
+     */
+    isSingleInputValue(): boolean;
     /**
      * Set the value at a specific index.
      * @param {number} index - The index to set the value at.

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

@@ -2558,11 +2558,18 @@ class Component extends Element_1.default {
         }
         for (const i in this.refs.input) {
             if (this.refs.input.hasOwnProperty(i)) {
-                this.setValueAt(i, isArray ? value[i] : value, flags);
+                this.setValueAt(i, isArray && !this.isSingleInputValue() ? value[i] : value, flags);
             }
         }
         return changed;
     }
+    /**
+     * Returns if the value (e.g. array) should be divided between several inputs
+     * @returns {boolean}
+     */
+    isSingleInputValue() {
+        return false;
+    }
     /**
      * Set the value at a specific index.
      * @param {number} index - The index to set the value at.

package/lib/cjs/components/datagrid/fixtures/comp10.d.ts

@@ -0,0 +1,81 @@
+declare namespace _default {
+    let title: string;
+    let name: string;
+    let path: string;
+    let type: string;
+    let display: string;
+    let components: ({
+        label: string;
+        reorder: boolean;
+        addAnotherPosition: string;
+        layoutFixed: boolean;
+        enableRowGroups: boolean;
+        initEmpty: boolean;
+        tableView: boolean;
+        defaultValue: {}[];
+        validate: {
+            required: boolean;
+        };
+        key: string;
+        type: string;
+        input: boolean;
+        components: {
+            label: string;
+            columns: ({
+                components: {
+                    label: string;
+                    applyMaskOn: string;
+                    tableView: boolean;
+                    key: string;
+                    type: string;
+                    input: boolean;
+                }[];
+                width: number;
+                offset: number;
+                push: number;
+                pull: number;
+                size: string;
+                currentWidth: number;
+            } | {
+                components: {
+                    label: string;
+                    tableView: boolean;
+                    key: string;
+                    type: string;
+                    input: boolean;
+                }[];
+                width: number;
+                offset: number;
+                push: number;
+                pull: number;
+                size: string;
+                currentWidth: number;
+            })[];
+            key: string;
+            type: string;
+            input: boolean;
+            tableView: boolean;
+        }[];
+        disableOnInvalid?: undefined;
+    } | {
+        type: string;
+        label: string;
+        key: string;
+        disableOnInvalid: boolean;
+        input: boolean;
+        tableView: boolean;
+        reorder?: undefined;
+        addAnotherPosition?: undefined;
+        layoutFixed?: undefined;
+        enableRowGroups?: undefined;
+        initEmpty?: undefined;
+        defaultValue?: undefined;
+        validate?: undefined;
+        components?: undefined;
+    })[];
+    let pdfComponents: never[];
+    namespace settings {
+        let logs: string;
+    }
+}
+export default _default;

package/lib/cjs/components/datagrid/fixtures/comp10.js

@@ -0,0 +1,87 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    title: 'randomName',
+    name: 'randomName',
+    path: 'randomName',
+    type: 'form',
+    display: 'form',
+    components: [
+        {
+            label: 'Data Grid',
+            reorder: false,
+            addAnotherPosition: 'bottom',
+            layoutFixed: false,
+            enableRowGroups: false,
+            initEmpty: false,
+            tableView: false,
+            defaultValue: [
+                {}
+            ],
+            validate: {
+                required: true
+            },
+            key: 'dataGrid',
+            type: 'datagrid',
+            input: true,
+            components: [
+                {
+                    label: 'Columns',
+                    columns: [
+                        {
+                            components: [
+                                {
+                                    label: 'Text Field',
+                                    applyMaskOn: 'change',
+                                    tableView: true,
+                                    key: 'textField',
+                                    type: 'textfield',
+                                    input: true
+                                }
+                            ],
+                            width: 6,
+                            offset: 0,
+                            push: 0,
+                            pull: 0,
+                            size: 'md',
+                            currentWidth: 6
+                        },
+                        {
+                            components: [
+                                {
+                                    label: 'Checkbox',
+                                    tableView: false,
+                                    key: 'checkbox',
+                                    type: 'checkbox',
+                                    input: true
+                                }
+                            ],
+                            width: 6,
+                            offset: 0,
+                            push: 0,
+                            pull: 0,
+                            size: 'md',
+                            currentWidth: 6
+                        }
+                    ],
+                    key: 'columns',
+                    type: 'columns',
+                    input: false,
+                    tableView: false
+                }
+            ]
+        },
+        {
+            type: 'button',
+            label: 'Submit',
+            key: 'submit',
+            disableOnInvalid: true,
+            input: true,
+            tableView: false
+        }
+    ],
+    pdfComponents: [],
+    settings: {
+        logs: 'true'
+    }
+};

package/lib/cjs/components/datagrid/fixtures/index.d.ts

@@ -7,6 +7,7 @@ import comp6 from './comp6';
 import comp7 from './comp7';
 import comp8 from './comp8';
 import comp9 from './comp9';
+import comp10 from './comp10';
 import comp11 from './comp11';
 import withCollapsibleRowGroups from './comp-with-collapsible-groups';
 import withConditionalFieldsAndValidations from './comp-with-conditional-components-and-validations';

package/lib/cjs/components/textarea/TextArea.d.ts

@@ -19,6 +19,13 @@ export default class TextAreaComponent extends TextFieldComponent {
     setContent(element: any, content: any, forceSanitize: any): void;
     setReadOnlyValue(value: any, index: any): void;
     get isJsonValue(): any;
+    /**
+   * Normalize values coming into updateValue. For example, depending on the configuration, string value `"true"` will be normalized to boolean `true`.
+   * @param {*} value - The value to normalize
+   * @returns {*} - Returns the normalized value
+   */
+    normalizeValue(value: any): any;
+    normalizeSingleValue(value: any): any;
     setConvertedValue(value: any, index: any): any;
     setAsyncConvertedValue(value: any): Promise<any>;
     setImagesUrl(images: any): Promise<any>;

package/lib/cjs/components/textarea/TextArea.js

@@ -309,6 +309,26 @@ class TextAreaComponent extends TextField_1.default {
     get isJsonValue() {
         return this.component.as && this.component.as === 'json';
     }
+    /**
+   * Normalize values coming into updateValue. For example, depending on the configuration, string value `"true"` will be normalized to boolean `true`.
+   * @param {*} value - The value to normalize
+   * @returns {*} - Returns the normalized value
+   */
+    normalizeValue(value) {
+        if (this.component.multiple && Array.isArray(value)) {
+            return value.map((singleValue) => this.normalizeSingleValue(singleValue));
+        }
+        return super.normalizeValue(this.normalizeSingleValue(value));
+    }
+    normalizeSingleValue(value) {
+        if (lodash_1.default.isNil(value)) {
+            return;
+        }
+        return this.isJsonValue ? value : String(value);
+    }
+    isSingleInputValue() {
+        return !this.component.multiple;
+    }
     setConvertedValue(value, index) {
         if (this.isJsonValue && !lodash_1.default.isNil(value)) {
             try {

package/lib/mjs/Webform.js

@@ -1250,7 +1250,7 @@ export default class Webform extends NestedDataComponent {
                 process: 'change'
             })
             : [];
-        value.isValid = errors.length === 0;
+        value.isValid = (errors || []).filter(err => !err.fromServer).length === 0;
         this.loading = false;
         if (this.submitted) {
             // show server errors while they are not cleaned/fixed

package/lib/mjs/Wizard.d.ts

@@ -105,6 +105,7 @@ declare class Wizard extends Webform {
     pageId(page: any): any;
     onChange(flags: any, changed: any, modified: any, changes: any): void;
     checkValidity(data: any, dirty: any, row: any, currentPageOnly: any, childErrors?: any[]): any;
+    showErrors(errors: any, triggerEvent: any): void | any[];
     focusOnComponent(key: any): void | Promise<void>;
 }
 declare namespace Wizard {

package/lib/mjs/Wizard.js

@@ -911,6 +911,17 @@ export default class Wizard extends Webform {
         }
         return super.errors;
     }
+    showErrors(errors, triggerEvent) {
+        if (this.hasExtraPages) {
+            this.subWizards.forEach((subWizard) => {
+                if (Array.isArray(subWizard.errors)) {
+                    errors = [...errors, ...subWizard.errors];
+                }
+            });
+        }
+        ;
+        return super.showErrors(errors, triggerEvent);
+    }
     focusOnComponent(key) {
         const component = this.getComponent(key);
         if (component) {
@@ -918,7 +929,7 @@ export default class Wizard extends Webform {
             while (!(topPanel.parent instanceof Wizard)) {
                 topPanel = topPanel.parent;
             }
-            const pageIndex = this.pages.findIndex(page => page === topPanel);
+            const pageIndex = this.pages.findIndex(page => page.id === topPanel.id);
             if (pageIndex >= 0) {
                 const page = this.pages[pageIndex];
                 if (page && page !== this.currentPage) {

package/lib/mjs/components/_classes/component/Component.d.ts

@@ -867,6 +867,11 @@ declare class Component extends Element {
      * @returns {boolean} - If the value changed.
      */
     setValue(value: any, flags?: any): boolean;
+    /**
+     * Returns if the value (e.g. array) should be divided between several inputs
+     * @returns {boolean}
+     */
+    isSingleInputValue(): boolean;
     /**
      * Set the value at a specific index.
      * @param {number} index - The index to set the value at.

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

@@ -2527,11 +2527,18 @@ export default class Component extends Element {
         }
         for (const i in this.refs.input) {
             if (this.refs.input.hasOwnProperty(i)) {
-                this.setValueAt(i, isArray ? value[i] : value, flags);
+                this.setValueAt(i, isArray && !this.isSingleInputValue() ? value[i] : value, flags);
             }
         }
         return changed;
     }
+    /**
+     * Returns if the value (e.g. array) should be divided between several inputs
+     * @returns {boolean}
+     */
+    isSingleInputValue() {
+        return false;
+    }
     /**
      * Set the value at a specific index.
      * @param {number} index - The index to set the value at.

package/lib/mjs/components/datagrid/fixtures/comp10.d.ts

@@ -0,0 +1,81 @@
+declare namespace _default {
+    let title: string;
+    let name: string;
+    let path: string;
+    let type: string;
+    let display: string;
+    let components: ({
+        label: string;
+        reorder: boolean;
+        addAnotherPosition: string;
+        layoutFixed: boolean;
+        enableRowGroups: boolean;
+        initEmpty: boolean;
+        tableView: boolean;
+        defaultValue: {}[];
+        validate: {
+            required: boolean;
+        };
+        key: string;
+        type: string;
+        input: boolean;
+        components: {
+            label: string;
+            columns: ({
+                components: {
+                    label: string;
+                    applyMaskOn: string;
+                    tableView: boolean;
+                    key: string;
+                    type: string;
+                    input: boolean;
+                }[];
+                width: number;
+                offset: number;
+                push: number;
+                pull: number;
+                size: string;
+                currentWidth: number;
+            } | {
+                components: {
+                    label: string;
+                    tableView: boolean;
+                    key: string;
+                    type: string;
+                    input: boolean;
+                }[];
+                width: number;
+                offset: number;
+                push: number;
+                pull: number;
+                size: string;
+                currentWidth: number;
+            })[];
+            key: string;
+            type: string;
+            input: boolean;
+            tableView: boolean;
+        }[];
+        disableOnInvalid?: undefined;
+    } | {
+        type: string;
+        label: string;
+        key: string;
+        disableOnInvalid: boolean;
+        input: boolean;
+        tableView: boolean;
+        reorder?: undefined;
+        addAnotherPosition?: undefined;
+        layoutFixed?: undefined;
+        enableRowGroups?: undefined;
+        initEmpty?: undefined;
+        defaultValue?: undefined;
+        validate?: undefined;
+        components?: undefined;
+    })[];
+    let pdfComponents: never[];
+    namespace settings {
+        let logs: string;
+    }
+}
+export default _default;

package/lib/mjs/components/datagrid/fixtures/comp10.js

@@ -0,0 +1,85 @@
+export default {
+    title: 'randomName',
+    name: 'randomName',
+    path: 'randomName',
+    type: 'form',
+    display: 'form',
+    components: [
+        {
+            label: 'Data Grid',
+            reorder: false,
+            addAnotherPosition: 'bottom',
+            layoutFixed: false,
+            enableRowGroups: false,
+            initEmpty: false,
+            tableView: false,
+            defaultValue: [
+                {}
+            ],
+            validate: {
+                required: true
+            },
+            key: 'dataGrid',
+            type: 'datagrid',
+            input: true,
+            components: [
+                {
+                    label: 'Columns',
+                    columns: [
+                        {
+                            components: [
+                                {
+                                    label: 'Text Field',
+                                    applyMaskOn: 'change',
+                                    tableView: true,
+                                    key: 'textField',
+                                    type: 'textfield',
+                                    input: true
+                                }
+                            ],
+                            width: 6,
+                            offset: 0,
+                            push: 0,
+                            pull: 0,
+                            size: 'md',
+                            currentWidth: 6
+                        },
+                        {
+                            components: [
+                                {
+                                    label: 'Checkbox',
+                                    tableView: false,
+                                    key: 'checkbox',
+                                    type: 'checkbox',
+                                    input: true
+                                }
+                            ],
+                            width: 6,
+                            offset: 0,
+                            push: 0,
+                            pull: 0,
+                            size: 'md',
+                            currentWidth: 6
+                        }
+                    ],
+                    key: 'columns',
+                    type: 'columns',
+                    input: false,
+                    tableView: false
+                }
+            ]
+        },
+        {
+            type: 'button',
+            label: 'Submit',
+            key: 'submit',
+            disableOnInvalid: true,
+            input: true,
+            tableView: false
+        }
+    ],
+    pdfComponents: [],
+    settings: {
+        logs: 'true'
+    }
+};

package/lib/mjs/components/datagrid/fixtures/index.d.ts

@@ -7,6 +7,7 @@ import comp6 from './comp6';
 import comp7 from './comp7';
 import comp8 from './comp8';
 import comp9 from './comp9';
+import comp10 from './comp10';
 import comp11 from './comp11';
 import withCollapsibleRowGroups from './comp-with-collapsible-groups';
 import withConditionalFieldsAndValidations from './comp-with-conditional-components-and-validations';

package/lib/mjs/components/textarea/TextArea.d.ts

@@ -19,6 +19,13 @@ export default class TextAreaComponent extends TextFieldComponent {
     setContent(element: any, content: any, forceSanitize: any): void;
     setReadOnlyValue(value: any, index: any): void;
     get isJsonValue(): any;
+    /**
+   * Normalize values coming into updateValue. For example, depending on the configuration, string value `"true"` will be normalized to boolean `true`.
+   * @param {*} value - The value to normalize
+   * @returns {*} - Returns the normalized value
+   */
+    normalizeValue(value: any): any;
+    normalizeSingleValue(value: any): any;
     setConvertedValue(value: any, index: any): any;
     setAsyncConvertedValue(value: any): Promise<any>;
     setImagesUrl(images: any): Promise<any>;

package/lib/mjs/components/textarea/TextArea.js

@@ -304,6 +304,26 @@ export default class TextAreaComponent extends TextFieldComponent {
     get isJsonValue() {
         return this.component.as && this.component.as === 'json';
     }
+    /**
+   * Normalize values coming into updateValue. For example, depending on the configuration, string value `"true"` will be normalized to boolean `true`.
+   * @param {*} value - The value to normalize
+   * @returns {*} - Returns the normalized value
+   */
+    normalizeValue(value) {
+        if (this.component.multiple && Array.isArray(value)) {
+            return value.map((singleValue) => this.normalizeSingleValue(singleValue));
+        }
+        return super.normalizeValue(this.normalizeSingleValue(value));
+    }
+    normalizeSingleValue(value) {
+        if (_.isNil(value)) {
+            return;
+        }
+        return this.isJsonValue ? value : String(value);
+    }
+    isSingleInputValue() {
+        return !this.component.multiple;
+    }
     setConvertedValue(value, index) {
         if (this.isJsonValue && !_.isNil(value)) {
             try {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.0.0-rc.86",
+  "version": "5.0.0-rc.87",
   "description": "JavaScript powered Forms with JSON Form Builder",
   "main": "lib/cjs/index.js",
   "exports": {