@formio/js 5.0.0-dev.5723.99bf27e → 5.0.0-dev.5725.d52e1c4

package/lib/cjs/components/signature/editForm/Signature.edit.display.d.ts

@@ -7,7 +7,6 @@ declare const _default: ({
     placeholder: string;
     weight: number;
     conditional?: undefined;
-    customConditional?: undefined;
     ignore?: undefined;
 } | {
     type: string;
@@ -24,7 +23,6 @@ declare const _default: ({
         };
     };
     weight: number;
-    customConditional?: undefined;
     ignore?: undefined;
 } | {
     weight: number;
@@ -32,9 +30,6 @@ declare const _default: ({
     label: string;
     tooltip: string;
     key: string;
-    customConditional: ({ options }: {
-        options: any;
-    }) => boolean;
     input: boolean;
     placeholder?: undefined;
     conditional?: undefined;
@@ -49,6 +44,5 @@ declare const _default: ({
     placeholder?: undefined;
     weight?: undefined;
     conditional?: undefined;
-    customConditional?: undefined;
 })[];
 export default _default;

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

@@ -39,7 +39,6 @@ exports.default = [
         label: 'Keep Overlay Aspect Ratio',
         tooltip: 'If checked, the field will have the same aspect ratio as its preview.',
         key: 'keepOverlayRatio',
-        customConditional: ({ options }) => { var _a; return (((_a = options === null || options === void 0 ? void 0 : options.editForm) === null || _a === void 0 ? void 0 : _a.display) === 'pdf'); },
         input: true
     },
     {

package/lib/cjs/components/tags/Tags.js

@@ -118,12 +118,12 @@ class TagsComponent extends Input_1.default {
     }
     normalizeValue(value) {
         if (this.component.storeas === 'string' && Array.isArray(value)) {
-            return value.join(this.delimiter);
+            return super.normalizeValue(value.join(this.delimiter));
         }
         else if (this.component.storeas === 'array' && typeof value === 'string') {
-            return value.split(this.delimiter).filter(result => result);
+            return super.normalizeValue(value.split(this.delimiter).filter(result => result));
         }
-        return value;
+        return super.normalizeValue(value);
     }
     setValue(value, flags = {}) {
         const changed = super.setValue(value, flags);

package/lib/cjs/components/time/Time.form.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const Component_form_1 = __importDefault(require("../_classes/component/Component.form"));
+const Components_1 = __importDefault(require("../Components"));
 const Time_edit_data_1 = __importDefault(require("./editForm/Time.edit.data"));
 const Time_edit_display_1 = __importDefault(require("./editForm/Time.edit.display"));
 /**
@@ -12,7 +12,7 @@ const Time_edit_display_1 = __importDefault(require("./editForm/Time.edit.displa
  * @returns {import('@formio/core').Component[]} - The edit form components.
  */
 function default_1(...extend) {
-    return (0, Component_form_1.default)([
+    return Components_1.default.baseEditForm([
         {
             key: 'data',
             components: Time_edit_data_1.default,

package/lib/cjs/components/time/Time.js

@@ -18,11 +18,6 @@ class TimeComponent extends TextField_1.default {
             dataFormat: defaultDataFormat,
         }, ...extend);
     }
-    static get serverConditionSettings() {
-        return Object.assign(Object.assign({}, super.serverConditionSettings), { valueComponent(classComp) {
-                return Object.assign(Object.assign({}, classComp), { type: 'time' });
-            } });
-    }
     constructor(component, options, data) {
         super(component, options, data);
         const { edge: isEdgeBrowser, version: edgeVersion } = (0, utils_1.getBrowserInfo)();

package/lib/cjs/templates/Templates.js

@@ -6,5 +6,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const index_1 = __importDefault(require("./index"));
 const experimental_1 = require("@formio/core/experimental");
 experimental_1.Template.addTemplates(index_1.default);
-experimental_1.Template.defaultTemplates = index_1.default.bootstrap;
+experimental_1.Template.defaultTemplates = experimental_1.Template.templates.bootstrap;
 exports.default = experimental_1.Template;

package/lib/cjs/translations/en.d.ts

@@ -75,6 +75,7 @@ declare namespace _default {
     let typeRemaining: string;
     let typeCount: string;
     let requiredDayField: string;
+    let requiredDayEmpty: string;
     let requiredMonthField: string;
     let requiredYearField: string;
 }

package/lib/cjs/translations/en.js

@@ -77,6 +77,7 @@ exports.default = {
     typeRemaining: '{{ remaining }} {{ type }} remaining.',
     typeCount: '{{ count }} {{ type }}',
     requiredDayField: '{{ field }} is required',
+    requiredDayEmpty: '{{ field }} is required',
     requiredMonthField: '{{ field }} is required',
     requiredYearField: '{{ field }} is required'
 };

package/lib/mjs/CDN.js

@@ -63,8 +63,7 @@ class CDN {
             url += `/${lib}`;
         }
         // Only attach the version if this is the hosted cdn.
-        if (cdnUrl.includes('form.io') &&
-            version && version !== 'latest') {
+        if (cdnUrl.match(/cdn\.(test-)?form.io/) && version && version !== 'latest') {
             url += `/${version}`;
         }
         return url;

package/lib/mjs/Form.d.ts

@@ -398,10 +398,10 @@ export default class Form extends Element {
     getFormInitOptions(url: string, form: import('@formio/core').Form): object;
     /**
      * Sets the form to the JSON schema of a form.
-     * @param {import('@formio/core').Form} formParam - The form JSON to set this form to.
+     * @param {import('@formio/core').Form | string} formParam - The form JSON to set this form to.
      * @returns {Promise<Webform|Wizard|PDF>} - The webform instance that was created.
      */
-    setForm(formParam: import('@formio/core').Form): Promise<Webform | Wizard | PDF>;
+    setForm(formParam: import('@formio/core').Form | string): Promise<Webform | Wizard | PDF>;
     _form: any;
     getSubmission(formio: any, opts: any): any;
     /**

package/lib/mjs/Form.js

@@ -134,13 +134,13 @@ export default class Form extends Element {
         else {
             this.element = null;
         }
+        this.options = formOptions;
+        this.options.events = this.events;
         if (form) {
             this.setForm(form)
                 .then(() => this.readyResolve(this.instance))
                 .catch(this.readyReject);
         }
-        this.options = formOptions;
-        this.options.events = this.events;
         this.display = '';
     }
     createElement(tag, attrs, children) {
@@ -264,7 +264,7 @@ export default class Form extends Element {
     }
     /**
      * Sets the form to the JSON schema of a form.
-     * @param {import('@formio/core').Form} formParam - The form JSON to set this form to.
+     * @param {import('@formio/core').Form | string} formParam - The form JSON to set this form to.
      * @returns {Promise<Webform|Wizard|PDF>} - The webform instance that was created.
      */
     setForm(formParam) {
@@ -291,8 +291,14 @@ export default class Form extends Element {
                     }
                     this.loading = false;
                     this.instance = this.instance || this.create(form.display);
-                    const options = this.getFormInitOptions(formParam, form);
-                    this.instance.setUrl(formParam, options);
+                    // If we're in builder mode, instance.setUrl is not a function, so just manually set the URL.
+                    if (this.instance.setUrl) {
+                        const options = this.getFormInitOptions(formParam, form);
+                        this.instance.setUrl(formParam, options);
+                    }
+                    else {
+                        this.instance.url = formParam;
+                    }
                     this.instance.nosubmit = false;
                     this._form = this.instance.form = form;
                     if (submission) {

package/lib/mjs/PDF.js

@@ -65,7 +65,7 @@ export default class PDF extends Webform {
         super.destroy(all);
     }
     rebuild() {
-        if (this.attached && this.builderMode && this.component.components) {
+        if (this.builderMode && this.component.components) {
             this.destroyComponents();
             this.addComponents();
             return Promise.resolve();

package/lib/mjs/PDFBuilder.js

@@ -429,7 +429,7 @@ export default class PDFBuilder extends WebformBuilder {
             _.merge(schema, info);
         }
         // Set a unique key for this component.
-        BuilderUtils.uniquify([this.webform._form], schema);
+        BuilderUtils.uniquify(this.webform._form?.components || [], schema);
         this.webform._form.components.push(schema);
         schema.overlay = {
             top: layerY ? (layerY - this.itemOffsetY + HEIGHT) : (e.clientY - iframeRect.top - (this.itemOffsetY - HEIGHT) * 2),

package/lib/mjs/Webform.js

@@ -830,7 +830,6 @@ export default class Webform extends NestedDataComponent {
         if (!submission || !submission.data) {
             submission = {
                 data: {},
-                metadata: submission.metadata,
             };
         }
         // Metadata needs to be available before setValue

package/lib/mjs/WebformBuilder.js

@@ -187,7 +187,8 @@ export default class WebformBuilder extends Component {
             params: {
                 type: 'resource',
                 limit: 1000000,
-                select: '_id,title,name,components'
+                select: '_id,title,name,components',
+                'tags__ne': 'noBuilderResource'
             }
         };
         if (this.options && this.options.resourceTag) {
@@ -1048,7 +1049,10 @@ export default class WebformBuilder extends Component {
                     'calculateValue',
                     'conditional',
                     'customConditional',
-                    'id'
+                    'id',
+                    'fields.day.required',
+                    'fields.month.required',
+                    'fields.year.required',
                 ]));
                 const parentComponent = defaultValueComponent.parent;
                 let tabIndex = -1;
@@ -1235,6 +1239,7 @@ export default class WebformBuilder extends Component {
                     helplinks: this.helplinks,
                 }));
                 this.editForm.attach(this.componentEdit.querySelector(`[${this._referenceAttributeName}="editForm"]`));
+                this.updateComponent(this.editForm.submission.data ?? component);
                 this.attachEditComponentControls(component, parent, isNew, original, ComponentClass);
             });
         });

package/lib/mjs/Wizard.js

@@ -13,7 +13,7 @@ export default class Wizard extends Webform {
      */
     constructor(elementOrOptions = undefined, _options = undefined) {
         let element, options;
-        if (elementOrOptions instanceof HTMLElement || options) {
+        if (elementOrOptions instanceof HTMLElement || _options) {
             element = elementOrOptions;
             options = _options || {};
         }

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

@@ -1076,7 +1076,7 @@ declare class Component extends Element {
     elementInfo(): any;
     autofocus(): void;
     scrollIntoView(element?: any): void;
-    focus(index?: number): void;
+    focus(index: any): void;
     /**
      * Get `Formio` instance for working with files
      * @returns {import('@formio/core').Formio} - The Formio instance file service.

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

@@ -3425,10 +3425,11 @@ export default class Component extends Element {
         const { left, top } = element.getBoundingClientRect();
         window.scrollTo(left + window.scrollX, top + window.scrollY);
     }
-    focus(index = (this.refs.input.length - 1)) {
+    focus(index) {
         if ('beforeFocus' in this.parent) {
             this.parent.beforeFocus(this);
         }
+        index = index || this.refs.input?.length - 1;
         if (this.refs.input?.length) {
             const focusingInput = this.refs.input[index];
             if (this.component.widget?.type === 'calendar') {

package/lib/mjs/components/_classes/multivalue/Multivalue.d.ts

@@ -1,6 +1,5 @@
 export default class Multivalue extends Field {
     get addAnother(): string;
-    useWrapper(): any;
     /**
      * @returns {Field} - The created field.
      */

package/lib/mjs/components/_classes/multivalue/Multivalue.js

@@ -1,12 +1,40 @@
 import Field from '../field/Field';
 import _ from 'lodash';
 export default class Multivalue extends Field {
-    get dataValue() {
-        const parent = super.dataValue;
-        if (!parent && this.component.multiple) {
-            return [];
+    /**
+     * Normalize values coming into updateValue.
+     * @param {*} value - The value to normalize before setting.
+     * @returns {*} - The normalized value.
+     */
+    normalizeValue(value) {
+        if (this.component.multiple) {
+            if (Array.isArray(value)) {
+                if (value.length === 0) {
+                    return [this.emptyValue];
+                }
+                if (this.component.storeas === 'array') {
+                    return super.normalizeValue([value]);
+                }
+                return super.normalizeValue(value);
+            }
+            else {
+                return super.normalizeValue(value == null ? [this.emptyValue] : [value]);
+            }
+        }
+        else {
+            if (Array.isArray(value) && this.component.storeas !== 'array') {
+                if (this.component.storeas === 'string') {
+                    return super.normalizeValue(value.join(this.delimiter || ''));
+                }
+                return super.normalizeValue(value[0] || this.emptyValue);
+            }
+            else {
+                return super.normalizeValue(value);
+            }
         }
-        return parent;
+    }
+    get dataValue() {
+        return super.dataValue;
     }
     set dataValue(value) {
         super.dataValue = value;
@@ -26,30 +54,20 @@ export default class Multivalue extends Field {
     get addAnother() {
         return this.t(this.component.addAnother || 'Add Another');
     }
-    useWrapper() {
-        return this.component.hasOwnProperty('multiple') && this.component.multiple;
-    }
     /**
      * @returns {Field} - The created field.
      */
     render() {
-        // If single value field.
-        if (!this.useWrapper()) {
-            return super.render(`<div ${this._referenceAttributeName}="element">
-          ${this.renderElement(this.component.type !== 'hidden' ? this.dataValue : '')}
-        </div>`);
-        }
-        // Make sure dataValue is in the correct array format.
-        let dataValue = this.dataValue;
-        if (!Array.isArray(dataValue)) {
-            dataValue = dataValue ? [dataValue] : [];
-        }
-        // If multiple value field.
-        return super.render(this.renderTemplate('multiValueTable', {
-            rows: dataValue.map(this.renderRow.bind(this)).join(''),
-            disabled: this.disabled,
-            addAnother: this.addAnother,
-        }));
+        let dataValue = this.normalizeValue(this.dataValue);
+        return this.component.hasOwnProperty('multiple') && this.component.multiple
+            ? super.render(this.renderTemplate('multiValueTable', {
+                rows: dataValue.map(this.renderRow.bind(this)).join(''),
+                disabled: this.disabled,
+                addAnother: this.addAnother,
+            }))
+            : super.render(`<div ${this._referenceAttributeName}="element">
+            ${this.renderElement(this.component.type !== 'hidden' ? dataValue : '')}
+          </div>`);
     }
     renderElement() {
         return '';

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

@@ -493,6 +493,7 @@ export default class NestedComponent extends Field {
             header: 'single',
             collapsed: this.collapsed,
             [this.nestedKey]: 'single',
+            messageContainer: 'single-scope',
         });
         let childPromise = Promise.resolve();
         if (this.refs[this.nestedKey]) {
@@ -680,7 +681,7 @@ export default class NestedComponent extends Field {
     validationProcessor({ scope, data, row, instance, component }, flags) {
         const { dirty } = flags;
         if (this.root.hasExtraPages && this.page !== this.root.page) {
-            instance = this.getComponentById(component.id);
+            instance = this.getComponent(component.path);
         }
         if (!instance) {
             return;

package/lib/mjs/components/_classes/nestedarray/NestedArrayComponent.d.ts

@@ -12,6 +12,9 @@ export default class NestedArrayComponent extends NestedDataComponent {
     hasAddButton(): any;
     getComponent(path: any, fn: any, originalPath: any): any;
     everyComponent(fn: any, rowIndex: any, options?: {}): void;
+    _getEmailTableHeader(options: any): string;
+    _getEmailTableBody(options: any): string;
     getComponents(rowIndex: any): any;
+    removeSubmissionMetadataRow(index: any): void;
 }
 import NestedDataComponent from '../nesteddata/NestedDataComponent';

package/lib/mjs/components/_classes/nestedarray/NestedArrayComponent.js

@@ -1,6 +1,6 @@
 'use strict';
 import _ from 'lodash';
-import { componentValueTypes, getStringFromComponentPath } from '../../../utils/utils';
+import { componentValueTypes, getStringFromComponentPath, isLayoutComponent } from '../../../utils/utils';
 import Component from '../component/Component';
 import NestedDataComponent from '../nesteddata/NestedDataComponent';
 export default class NestedArrayComponent extends NestedDataComponent {
@@ -145,38 +145,60 @@ export default class NestedArrayComponent extends NestedDataComponent {
             }
         });
     }
+    _getEmailTableHeader(options) {
+        let row = '';
+        const getHeaderCell = (component) => {
+            if (!component.isInputComponent || !component.visible || component.skipInEmail) {
+                return '';
+            }
+            const label = component.label || component.key;
+            return `<th style="padding: 5px 10px;">${label}</th>`;
+        };
+        const components = this.getComponents(0);
+        for (const component of components) {
+            if (component.isInputComponent) {
+                row += getHeaderCell(component);
+            }
+            else if (isLayoutComponent(component) && typeof component.everyComponent === 'function') {
+                component.everyComponent((comp) => {
+                    row += getHeaderCell(comp);
+                }, options);
+            }
+        }
+        return `<thead><tr>${row}</tr></thead>`;
+    }
+    _getEmailTableBody(options) {
+        const getBodyCell = (component) => {
+            if (!component.isInputComponent || !component.visible || component.skipInEmail) {
+                return '';
+            }
+            return `<td style="padding: 5px 10px;">${component.getView(component.dataValue, options)}</td>`;
+        };
+        const rows = [];
+        for (const { components } of this.iteratableRows) {
+            let row = '';
+            for (const component of components) {
+                if (component.isInputComponent) {
+                    row += getBodyCell(component);
+                }
+                else if (isLayoutComponent(component) && typeof component.everyComponent === 'function') {
+                    component.everyComponent((comp) => {
+                        row += getBodyCell(comp);
+                    }, options);
+                }
+            }
+            rows.push(`<tr>${row}</tr>`);
+        }
+        return `<tbody>${rows.join('')}</tbody>`;
+    }
     getValueAsString(value, options) {
         if (options?.email) {
-            let result = (`
+            return `
         <table border="1" style="width:100%">
-          <thead>
-            <tr>
-      `);
-            this.component.components?.forEach((component) => {
-                const label = component.label || component.key;
-                result += `<th style="padding: 5px 10px;">${label}</th>`;
-            });
-            result += (`
-          </tr>
-        </thead>
-        <tbody>
-      `);
-            this.iteratableRows.forEach(({ components }) => {
-                result += '<tr>';
-                _.each(components, (component) => {
-                    result += '<td style="padding:5px 10px;">';
-                    if (component.isInputComponent && component.visible && !component.skipInEmail) {
-                        result += component.getView(component.dataValue, options);
-                    }
-                    result += '</td>';
-                });
-                result += '</tr>';
-            });
-            result += (`
-          </tbody>
+          ${this._getEmailTableHeader(options)}
+          ${this._getEmailTableBody(options)}
         </table>
-      `);
-            return result;
+      `;
         }
         if (!value || !value.length) {
             return '';
@@ -192,4 +214,10 @@ export default class NestedArrayComponent extends NestedDataComponent {
         }
         return super.getComponents();
     }
+    removeSubmissionMetadataRow(index) {
+        const componentMetadata = _.get(this.root, `submission.metadata.selectData.${this.path}`, null);
+        if (_.isArray(componentMetadata)) {
+            componentMetadata.splice(index, 1);
+        }
+    }
 }

package/lib/mjs/components/address/Address.d.ts

@@ -11,6 +11,12 @@ export default class AddressComponent extends ContainerComponent {
         weight: number;
         schema: any;
     };
+    static get serverConditionSettings(): {
+        operators: string[];
+    };
+    static get conditionOperatorsSettings(): {
+        operators: string[];
+    };
     static get modeSwitcherRef(): string;
     static get removeValueIconRef(): string;
     static get searchInputRef(): string;

package/lib/mjs/components/address/Address.js

@@ -91,6 +91,15 @@ export default class AddressComponent extends ContainerComponent {
             schema: AddressComponent.schema(),
         };
     }
+    static get serverConditionSettings() {
+        return AddressComponent.conditionOperatorsSettings;
+    }
+    static get conditionOperatorsSettings() {
+        return {
+            ...super.conditionOperatorsSettings,
+            operators: ['isEmpty', 'isNotEmpty'],
+        };
+    }
     mergeSchema(component = {}) {
         let { defaultSchema } = this;
         if (component.components) {
@@ -181,7 +190,7 @@ export default class AddressComponent extends ContainerComponent {
         return (this.manualModeEnabled && this.dataValue) ? this.dataValue.address : this.dataValue;
     }
     set address(value) {
-        if (this.manualModeEnabled && !this.isMultiple) {
+        if (this.manualModeEnabled && !this.isMultiple && !_.isEqual(value, this.emptyValue)) {
             this.dataValue.address = value;
         }
         else {

package/lib/mjs/components/datagrid/DataGrid.d.ts

@@ -59,7 +59,6 @@ export default class DataGridComponent extends NestedArrayComponent {
     getRows(): {}[];
     getColumns(): any[];
     hasHeader(): any;
-    loadRefs(element: any, refs: any): void;
     dragula: any;
     getComponentsContainer(): any;
     /**

package/lib/mjs/components/datagrid/DataGrid.js

@@ -260,13 +260,6 @@ export default class DataGridComponent extends NestedArrayComponent {
             return hasHeader || ((col.label || col.title) && !col.hideLabel);
         }, false);
     }
-    loadRefs(element, refs) {
-        super.loadRefs(element, refs);
-        if (refs['messageContainer'] === 'single') {
-            const container = _.last(element.querySelectorAll(`[${this._referenceAttributeName}=messageContainer]`));
-            this.refs['messageContainer'] = container || this.refs['messageContainer'];
-        }
-    }
     attach(element) {
         this.loadRefs(element, {
             [`${this.datagridKey}-row`]: 'multiple',
@@ -275,7 +268,6 @@ export default class DataGridComponent extends NestedArrayComponent {
             [`${this.datagridKey}-removeRow`]: 'multiple',
             [`${this.datagridKey}-group-header`]: 'multiple',
             [this.datagridKey]: 'multiple',
-            'messageContainer': 'single'
         });
         if (this.allowReorder) {
             this.refs[`${this.datagridKey}-row`].forEach((row, index) => {
@@ -440,10 +432,11 @@ export default class DataGridComponent extends NestedArrayComponent {
     }
     removeRow(index) {
         const makeEmpty = index === 0 && this.rows.length === 1;
-        const flags = { isReordered: !makeEmpty, resetValue: makeEmpty };
+        const flags = { isReordered: !makeEmpty, resetValue: makeEmpty, modified: true };
         this.splice(index, flags);
         this.emit('dataGridDeleteRow', { index });
         const [row] = this.rows.splice(index, 1);
+        this.removeSubmissionMetadataRow(index);
         this.removeRowComponents(row);
         this.updateRowsComponents(index);
         this.setValue(this.dataValue, flags);

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

@@ -0,0 +1,50 @@
+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;
+        key: string;
+        type: string;
+        input: boolean;
+        components: {
+            label: string;
+            widget: string;
+            tableView: boolean;
+            data: {
+                values: {
+                    label: string;
+                    value: string;
+                }[];
+            };
+            validateWhenHidden: boolean;
+            key: string;
+            type: string;
+            input: boolean;
+            defaultValue: string;
+        }[];
+        disableOnInvalid?: undefined;
+    } | {
+        type: string;
+        label: string;
+        key: string;
+        disableOnInvalid: boolean;
+        input: boolean;
+        tableView: boolean;
+        reorder?: undefined;
+        addAnotherPosition?: undefined;
+        layoutFixed?: undefined;
+        enableRowGroups?: undefined;
+        initEmpty?: undefined;
+        components?: undefined;
+    })[];
+}
+export default _default;