@formio/js 5.0.0-rc.95 → 5.0.0-rc.97

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

package/lib/cjs/Wizard.js

@@ -716,7 +716,7 @@ class Wizard extends Webform_1.default {
         else {
             this.currentPage.components.forEach((comp) => comp.setPristine(false));
             this.scrollIntoView(this.element, true);
-            return Promise.reject(this.showErrors(errors, true));
+            return Promise.reject(super.showErrors(errors, true));
         }
     }
     validateCurrentPage(flags = {}) {

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

@@ -693,6 +693,9 @@ class NestedComponent extends Field_1.default {
         if (!instance) {
             return;
         }
+        if (!instance.component.path) {
+            instance.component.path = component.path;
+        }
         instance.checkComponentValidity(data, dirty, row, flags, scope.errors);
         if (instance.processOwnValidation) {
             scope.noRecurse = true;

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

@@ -476,7 +476,7 @@ class FormComponent extends Component_1.default {
     checkComponentValidity(data, dirty, row, options, errors = []) {
         options = options || {};
         const silentCheck = options.silentCheck || false;
-        if (this.subForm) {
+        if (this.subForm && !this.isNestedWizard) {
             return this.subForm.checkValidity(this.subFormData, dirty, null, silentCheck, errors);
         }
         return super.checkComponentValidity(data, dirty, row, options, errors);

package/lib/cjs/components/radio/Radio.js

@@ -302,12 +302,13 @@ class RadioComponent extends ListComponent_1.default {
             .then((response) => {
             this.loading = false;
             this.setItems(response);
-            this.optionsLoaded = true;
-            this.redraw();
         })
             .catch((err) => {
-            this.optionsLoaded = true;
             this.handleLoadingError(err);
+        })
+            .finally(() => {
+            this.optionsLoaded = true;
+            this.redraw();
         });
     }
     loadItemsFromMetadata() {

package/lib/cjs/components/select/Select.js

@@ -1217,7 +1217,7 @@ class SelectComponent extends ListComponent_1.default {
         }
         // Check to see if we need to save off the template data into our metadata.
         const templateValue = this.component.reference && (value === null || value === void 0 ? void 0 : value._id) ? value._id.toString() : value;
-        const shouldSaveData = !valueIsObject || this.component.reference;
+        const shouldSaveData = (!valueIsObject || this.component.reference) && !this.inDataTable;
         if (!lodash_1.default.isNil(templateValue) && shouldSaveData && this.templateData && this.templateData[templateValue] && ((_a = this.root) === null || _a === void 0 ? void 0 : _a.submission)) {
             const submission = this.root.submission;
             if (!submission.metadata) {
@@ -1240,7 +1240,7 @@ class SelectComponent extends ListComponent_1.default {
             }
             lodash_1.default.set(submission.metadata.selectData, this.path, templateData);
         }
-        if (flags.resetValue && ((_b = this.root) === null || _b === void 0 ? void 0 : _b.submission)) {
+        if (flags.resetValue && ((_b = this.root) === null || _b === void 0 ? void 0 : _b.submission) && !this.options.readOnly) {
             const submission = this.root.submission;
             if (!submission.metadata) {
                 submission.metadata = {};

package/lib/cjs/components/select/fixtures/comp28.d.ts

@@ -0,0 +1,93 @@
+declare namespace _default {
+    let _id: string;
+    let title: string;
+    let name: string;
+    let path: string;
+    let type: string;
+    let display: string;
+    let components: ({
+        label: string;
+        applyMaskOn: string;
+        mask: boolean;
+        tableView: boolean;
+        delimiter: boolean;
+        requireDecimal: boolean;
+        inputFormat: string;
+        truncateMultipleSpaces: boolean;
+        validateWhenHidden: boolean;
+        key: string;
+        type: string;
+        input: boolean;
+        widget?: undefined;
+        dataSrc?: undefined;
+        data?: undefined;
+        valueProperty?: undefined;
+        template?: undefined;
+        validate?: undefined;
+        searchField?: undefined;
+        noRefreshOnScroll?: undefined;
+        addResource?: undefined;
+        reference?: undefined;
+        searchThreshold?: undefined;
+        disableOnInvalid?: undefined;
+    } | {
+        label: string;
+        widget: string;
+        tableView: boolean;
+        dataSrc: string;
+        data: {
+            resource: string;
+        };
+        valueProperty: string;
+        template: string;
+        validate: {
+            select: boolean;
+        };
+        validateWhenHidden: boolean;
+        key: string;
+        type: string;
+        searchField: string;
+        noRefreshOnScroll: boolean;
+        addResource: boolean;
+        reference: boolean;
+        input: boolean;
+        searchThreshold: number;
+        applyMaskOn?: undefined;
+        mask?: undefined;
+        delimiter?: undefined;
+        requireDecimal?: undefined;
+        inputFormat?: undefined;
+        truncateMultipleSpaces?: undefined;
+        disableOnInvalid?: undefined;
+    } | {
+        type: string;
+        label: string;
+        key: string;
+        disableOnInvalid: boolean;
+        input: boolean;
+        tableView: boolean;
+        applyMaskOn?: undefined;
+        mask?: undefined;
+        delimiter?: undefined;
+        requireDecimal?: undefined;
+        inputFormat?: undefined;
+        truncateMultipleSpaces?: undefined;
+        validateWhenHidden?: undefined;
+        widget?: undefined;
+        dataSrc?: undefined;
+        data?: undefined;
+        valueProperty?: undefined;
+        template?: undefined;
+        validate?: undefined;
+        searchField?: undefined;
+        noRefreshOnScroll?: undefined;
+        addResource?: undefined;
+        reference?: undefined;
+        searchThreshold?: undefined;
+    })[];
+    let project: string;
+    let created: string;
+    let modified: string;
+    let machineName: string;
+}
+export default _default;

package/lib/cjs/components/select/fixtures/comp28.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    _id: '672483c1d9abe46bcd70bca4',
+    title: 'yyyyyyy',
+    name: 'yyyyyyy',
+    path: 'yyyyyyy',
+    type: 'form',
+    display: 'form',
+    components: [
+        {
+            label: 'Number',
+            applyMaskOn: 'change',
+            mask: false,
+            tableView: false,
+            delimiter: false,
+            requireDecimal: false,
+            inputFormat: 'plain',
+            truncateMultipleSpaces: false,
+            validateWhenHidden: false,
+            key: 'number',
+            type: 'number',
+            input: true,
+        },
+        {
+            label: 'Select - Resource',
+            widget: 'choicesjs',
+            tableView: true,
+            dataSrc: 'resource',
+            data: {
+                resource: '672482f2d9abe46bcd70a0dc',
+            },
+            valueProperty: 'data.textField',
+            template: '<span>{{ item.data.textField }}</span>',
+            validate: {
+                select: false,
+            },
+            validateWhenHidden: false,
+            key: 'selectResource',
+            type: 'select',
+            searchField: 'data.textField__regex',
+            noRefreshOnScroll: false,
+            addResource: false,
+            reference: false,
+            input: true,
+            searchThreshold: 0.3,
+        },
+        {
+            type: 'button',
+            label: 'Submit',
+            key: 'submit',
+            disableOnInvalid: true,
+            input: true,
+            tableView: false,
+        },
+    ],
+    project: '67211a9aa929e4e6ebc2bf77',
+    created: '2024-11-01T07:31:13.647Z',
+    modified: '2024-11-01T12:51:23.213Z',
+    machineName: 'izutenexavvxnws:yyyyyyy',
+};

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

@@ -24,5 +24,6 @@ import comp24 from './comp24';
 import comp25 from './comp25';
 import comp26 from './comp26';
 import comp27 from './comp27';
-export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25, comp26, comp27 };
+import comp28 from './comp28';
+export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25, comp26, comp27, comp28 };
 export { multiSelect, multiSelectOptions } from "./comp3";

package/lib/cjs/components/select/fixtures/index.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 });
-exports.comp27 = exports.comp26 = exports.comp25 = exports.comp24 = exports.comp23 = exports.comp22 = exports.comp21 = exports.comp20 = exports.comp19 = exports.comp18 = exports.comp17 = exports.comp16 = exports.comp15 = exports.comp14 = exports.comp13 = exports.comp12 = exports.comp11 = exports.comp10 = exports.comp9 = exports.comp8 = exports.comp7 = exports.comp6 = exports.comp5 = exports.comp4 = exports.comp2 = exports.comp1 = exports.multiSelectOptions = exports.multiSelect = void 0;
+exports.comp28 = exports.comp27 = exports.comp26 = exports.comp25 = exports.comp24 = exports.comp23 = exports.comp22 = exports.comp21 = exports.comp20 = exports.comp19 = exports.comp18 = exports.comp17 = exports.comp16 = exports.comp15 = exports.comp14 = exports.comp13 = exports.comp12 = exports.comp11 = exports.comp10 = exports.comp9 = exports.comp8 = exports.comp7 = exports.comp6 = exports.comp5 = exports.comp4 = exports.comp2 = exports.comp1 = exports.multiSelectOptions = exports.multiSelect = void 0;
 const comp1_1 = __importDefault(require("./comp1"));
 exports.comp1 = comp1_1.default;
 const comp2_1 = __importDefault(require("./comp2"));
@@ -59,3 +59,5 @@ const comp26_1 = __importDefault(require("./comp26"));
 exports.comp26 = comp26_1.default;
 const comp27_1 = __importDefault(require("./comp27"));
 exports.comp27 = comp27_1.default;
+const comp28_1 = __importDefault(require("./comp28"));
+exports.comp28 = comp28_1.default;

package/lib/cjs/components/selectboxes/SelectBoxes.js

@@ -257,6 +257,18 @@ class SelectBoxesComponent extends Radio_1.default {
         }
         return super.checkComponentValidity(data, dirty, rowData, options, errors);
     }
+    setCustomValidity(messages, dirty, external) {
+        if (this.options.building && lodash_1.default.find(messages, { ruleName: 'invalidValueProperty' })) {
+            setTimeout(() => {
+                this.root && (0, utils_1.getComponent)(this.root.components, 'valueProperty').setCustomValidity(messages, dirty);
+            }, 0);
+            return super.setCustomValidity(lodash_1.default.filter(messages, (message) => message.ruleName !== 'invalidValueProperty'), dirty, external);
+        }
+        else {
+            return super.setCustomValidity(messages, dirty, external);
+        }
+        ;
+    }
     validateValueAvailability(setting, value) {
         if (!(0, utils_1.boolValue)(setting) || !value) {
             return true;

package/lib/mjs/Wizard.js

@@ -706,7 +706,7 @@ export default class Wizard extends Webform {
         else {
             this.currentPage.components.forEach((comp) => comp.setPristine(false));
             this.scrollIntoView(this.element, true);
-            return Promise.reject(this.showErrors(errors, true));
+            return Promise.reject(super.showErrors(errors, true));
         }
     }
     validateCurrentPage(flags = {}) {

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

@@ -688,6 +688,9 @@ export default class NestedComponent extends Field {
         if (!instance) {
             return;
         }
+        if (!instance.component.path) {
+            instance.component.path = component.path;
+        }
         instance.checkComponentValidity(data, dirty, row, flags, scope.errors);
         if (instance.processOwnValidation) {
             scope.noRecurse = true;

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

@@ -470,7 +470,7 @@ export default class FormComponent extends Component {
     checkComponentValidity(data, dirty, row, options, errors = []) {
         options = options || {};
         const silentCheck = options.silentCheck || false;
-        if (this.subForm) {
+        if (this.subForm && !this.isNestedWizard) {
             return this.subForm.checkValidity(this.subFormData, dirty, null, silentCheck, errors);
         }
         return super.checkComponentValidity(data, dirty, row, options, errors);

package/lib/mjs/components/radio/Radio.js

@@ -302,12 +302,13 @@ export default class RadioComponent extends ListComponent {
             .then((response) => {
             this.loading = false;
             this.setItems(response);
-            this.optionsLoaded = true;
-            this.redraw();
         })
             .catch((err) => {
-            this.optionsLoaded = true;
             this.handleLoadingError(err);
+        })
+            .finally(() => {
+            this.optionsLoaded = true;
+            this.redraw();
         });
     }
     loadItemsFromMetadata() {

package/lib/mjs/components/select/Select.js

@@ -1245,7 +1245,7 @@ export default class SelectComponent extends ListComponent {
         }
         // Check to see if we need to save off the template data into our metadata.
         const templateValue = this.component.reference && value?._id ? value._id.toString() : value;
-        const shouldSaveData = !valueIsObject || this.component.reference;
+        const shouldSaveData = (!valueIsObject || this.component.reference) && !this.inDataTable;
         if (!_.isNil(templateValue) && shouldSaveData && this.templateData && this.templateData[templateValue] && this.root?.submission) {
             const submission = this.root.submission;
             if (!submission.metadata) {
@@ -1268,7 +1268,7 @@ export default class SelectComponent extends ListComponent {
             }
             _.set(submission.metadata.selectData, this.path, templateData);
         }
-        if (flags.resetValue && this.root?.submission) {
+        if (flags.resetValue && this.root?.submission && !this.options.readOnly) {
             const submission = this.root.submission;
             if (!submission.metadata) {
                 submission.metadata = {};

package/lib/mjs/components/select/fixtures/comp28.d.ts

@@ -0,0 +1,93 @@
+declare namespace _default {
+    let _id: string;
+    let title: string;
+    let name: string;
+    let path: string;
+    let type: string;
+    let display: string;
+    let components: ({
+        label: string;
+        applyMaskOn: string;
+        mask: boolean;
+        tableView: boolean;
+        delimiter: boolean;
+        requireDecimal: boolean;
+        inputFormat: string;
+        truncateMultipleSpaces: boolean;
+        validateWhenHidden: boolean;
+        key: string;
+        type: string;
+        input: boolean;
+        widget?: undefined;
+        dataSrc?: undefined;
+        data?: undefined;
+        valueProperty?: undefined;
+        template?: undefined;
+        validate?: undefined;
+        searchField?: undefined;
+        noRefreshOnScroll?: undefined;
+        addResource?: undefined;
+        reference?: undefined;
+        searchThreshold?: undefined;
+        disableOnInvalid?: undefined;
+    } | {
+        label: string;
+        widget: string;
+        tableView: boolean;
+        dataSrc: string;
+        data: {
+            resource: string;
+        };
+        valueProperty: string;
+        template: string;
+        validate: {
+            select: boolean;
+        };
+        validateWhenHidden: boolean;
+        key: string;
+        type: string;
+        searchField: string;
+        noRefreshOnScroll: boolean;
+        addResource: boolean;
+        reference: boolean;
+        input: boolean;
+        searchThreshold: number;
+        applyMaskOn?: undefined;
+        mask?: undefined;
+        delimiter?: undefined;
+        requireDecimal?: undefined;
+        inputFormat?: undefined;
+        truncateMultipleSpaces?: undefined;
+        disableOnInvalid?: undefined;
+    } | {
+        type: string;
+        label: string;
+        key: string;
+        disableOnInvalid: boolean;
+        input: boolean;
+        tableView: boolean;
+        applyMaskOn?: undefined;
+        mask?: undefined;
+        delimiter?: undefined;
+        requireDecimal?: undefined;
+        inputFormat?: undefined;
+        truncateMultipleSpaces?: undefined;
+        validateWhenHidden?: undefined;
+        widget?: undefined;
+        dataSrc?: undefined;
+        data?: undefined;
+        valueProperty?: undefined;
+        template?: undefined;
+        validate?: undefined;
+        searchField?: undefined;
+        noRefreshOnScroll?: undefined;
+        addResource?: undefined;
+        reference?: undefined;
+        searchThreshold?: undefined;
+    })[];
+    let project: string;
+    let created: string;
+    let modified: string;
+    let machineName: string;
+}
+export default _default;

package/lib/mjs/components/select/fixtures/comp28.js

@@ -0,0 +1,59 @@
+export default {
+    _id: '672483c1d9abe46bcd70bca4',
+    title: 'yyyyyyy',
+    name: 'yyyyyyy',
+    path: 'yyyyyyy',
+    type: 'form',
+    display: 'form',
+    components: [
+        {
+            label: 'Number',
+            applyMaskOn: 'change',
+            mask: false,
+            tableView: false,
+            delimiter: false,
+            requireDecimal: false,
+            inputFormat: 'plain',
+            truncateMultipleSpaces: false,
+            validateWhenHidden: false,
+            key: 'number',
+            type: 'number',
+            input: true,
+        },
+        {
+            label: 'Select - Resource',
+            widget: 'choicesjs',
+            tableView: true,
+            dataSrc: 'resource',
+            data: {
+                resource: '672482f2d9abe46bcd70a0dc',
+            },
+            valueProperty: 'data.textField',
+            template: '<span>{{ item.data.textField }}</span>',
+            validate: {
+                select: false,
+            },
+            validateWhenHidden: false,
+            key: 'selectResource',
+            type: 'select',
+            searchField: 'data.textField__regex',
+            noRefreshOnScroll: false,
+            addResource: false,
+            reference: false,
+            input: true,
+            searchThreshold: 0.3,
+        },
+        {
+            type: 'button',
+            label: 'Submit',
+            key: 'submit',
+            disableOnInvalid: true,
+            input: true,
+            tableView: false,
+        },
+    ],
+    project: '67211a9aa929e4e6ebc2bf77',
+    created: '2024-11-01T07:31:13.647Z',
+    modified: '2024-11-01T12:51:23.213Z',
+    machineName: 'izutenexavvxnws:yyyyyyy',
+};

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

@@ -24,5 +24,6 @@ import comp24 from './comp24';
 import comp25 from './comp25';
 import comp26 from './comp26';
 import comp27 from './comp27';
-export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25, comp26, comp27 };
+import comp28 from './comp28';
+export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25, comp26, comp27, comp28 };
 export { multiSelect, multiSelectOptions } from "./comp3";

package/lib/mjs/components/select/fixtures/index.js

@@ -25,4 +25,5 @@ import comp24 from './comp24';
 import comp25 from './comp25';
 import comp26 from './comp26';
 import comp27 from './comp27';
-export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25, comp26, comp27 };
+import comp28 from './comp28';
+export { comp1, comp2, comp4, comp5, comp6, comp7, comp8, comp9, comp10, comp11, comp12, comp13, comp14, comp15, comp16, comp17, comp18, comp19, comp20, comp21, comp22, comp23, comp24, comp25, comp26, comp27, comp28 };

package/lib/mjs/components/selectboxes/SelectBoxes.js

@@ -1,5 +1,5 @@
 import _ from 'lodash';
-import { componentValueTypes, getComponentSavedTypes, boolValue } from '../../utils/utils';
+import { componentValueTypes, getComponentSavedTypes, boolValue, getComponent } from '../../utils/utils';
 import RadioComponent from '../radio/Radio';
 export default class SelectBoxesComponent extends RadioComponent {
     static schema(...extend) {
@@ -258,6 +258,18 @@ export default class SelectBoxesComponent extends RadioComponent {
         }
         return super.checkComponentValidity(data, dirty, rowData, options, errors);
     }
+    setCustomValidity(messages, dirty, external) {
+        if (this.options.building && _.find(messages, { ruleName: 'invalidValueProperty' })) {
+            setTimeout(() => {
+                this.root && getComponent(this.root.components, 'valueProperty').setCustomValidity(messages, dirty);
+            }, 0);
+            return super.setCustomValidity(_.filter(messages, (message) => message.ruleName !== 'invalidValueProperty'), dirty, external);
+        }
+        else {
+            return super.setCustomValidity(messages, dirty, external);
+        }
+        ;
+    }
     validateValueAvailability(setting, value) {
         if (!boolValue(setting) || !value) {
             return true;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.0.0-rc.95",
+  "version": "5.0.0-rc.97",
   "description": "JavaScript powered Forms with JSON Form Builder",
   "main": "lib/cjs/index.js",
   "exports": {
@@ -81,7 +81,7 @@
   "dependencies": {
     "@formio/bootstrap": "3.0.0-rc.41",
     "@formio/choices.js": "^10.2.1",
-    "@formio/core": "2.3.0-rc.17",
+    "@formio/core": "2.3.0-rc.21",
     "@formio/text-mask-addons": "^3.8.0-formio.3",
     "@formio/vanilla-text-mask": "^5.1.1-formio.1",
     "abortcontroller-polyfill": "^1.7.5",