@formio/js 5.0.0-dev.5642.f9208f7 → 5.0.0-dev.5643.17b8168

package/lib/cjs/WebformBuilder.js

@@ -986,8 +986,14 @@ class WebformBuilder extends Component_1.default {
             else if (parent.formioComponent && parent.formioComponent.removeChildComponent) {
                 parent.formioComponent.removeChildComponent(component);
             }
-            if (component.input && componentInstance && componentInstance.parent) {
-                lodash_1.default.unset(componentInstance._data, componentInstance.key);
+            if (component.input && componentInstance && parent.formioComponent) {
+                const parentDefaultValue = lodash_1.default.get(parent.formioComponent, 'component.defaultValue', null);
+                if (Array.isArray(parentDefaultValue)) {
+                    parentDefaultValue.forEach(v => lodash_1.default.unset(v, componentInstance.key));
+                }
+                else if (typeof parentDefaultValue === 'object') {
+                    lodash_1.default.unset(parentDefaultValue, componentInstance.key);
+                }
             }
             const rebuild = parent.formioComponent.rebuild() || Promise.resolve();
             rebuild.then(() => {

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

@@ -2559,7 +2559,7 @@ class Component extends Element_1.default {
         }
         this.calculatedValue = (0, utils_1.fastCloneDeep)(calculatedValue);
         if (changed) {
-            if (!flags.noPristineChangeOnModified) {
+            if (!flags.noPristineChangeOnModified && this.root.initialized) {
                 this.pristine = false;
             }
             flags.triggeredComponentId = this.id;

package/lib/cjs/components/datagrid/fixtures/comp-with-checkboxes.d.ts

@@ -0,0 +1,29 @@
+declare namespace _default {
+    let label: string;
+    let reorder: boolean;
+    let addAnotherPosition: string;
+    let layoutFixed: boolean;
+    let enableRowGroups: boolean;
+    let initEmpty: boolean;
+    let tableView: boolean;
+    let defaultValue: {}[];
+    let key: string;
+    let type: string;
+    let input: boolean;
+    let components: {
+        label: string;
+        optionsLabelPosition: string;
+        inline: boolean;
+        tableView: boolean;
+        values: {
+            label: string;
+            value: string;
+            shortcut: string;
+        }[];
+        key: string;
+        type: string;
+        input: boolean;
+        inputType: string;
+    }[];
+}
+export default _default;

package/lib/cjs/components/datagrid/fixtures/comp-with-checkboxes.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    'label': 'Data Grid',
+    'reorder': false,
+    'addAnotherPosition': 'bottom',
+    'layoutFixed': false,
+    'enableRowGroups': false,
+    'initEmpty': false,
+    'tableView': false,
+    'defaultValue': [
+        {}
+    ],
+    'key': 'dataGrid',
+    'type': 'datagrid',
+    'input': true,
+    'components': [
+        {
+            'label': 'Radio',
+            'optionsLabelPosition': 'right',
+            'inline': false,
+            'tableView': false,
+            'values': [
+                {
+                    'label': 'yes',
+                    'value': 'yes',
+                    'shortcut': ''
+                }
+            ],
+            'key': 'radio',
+            'type': 'radio',
+            'input': true,
+            'inputType': 'checkbox'
+        }
+    ]
+};

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

@@ -14,4 +14,5 @@ import withRowGroupsAndDefValue from './comp-row-groups-with-def-value';
 import modalWithRequiredFields from './comp-modal-with-required-fields';
 import withAllowCalculateOverride from './comp-with-allow-calculate-override';
 import twoWithAllowCalculatedOverride from './two-comp-with-allow-calculate-override';
-export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, withCollapsibleRowGroups, withConditionalFieldsAndValidations, withDefValue, withLogic, withRowGroupsAndDefValue, modalWithRequiredFields, withAllowCalculateOverride, twoWithAllowCalculatedOverride };
+import withCheckboxes from './comp-with-checkboxes';
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, withCollapsibleRowGroups, withConditionalFieldsAndValidations, withDefValue, withLogic, withRowGroupsAndDefValue, modalWithRequiredFields, withAllowCalculateOverride, twoWithAllowCalculatedOverride, withCheckboxes };

package/lib/cjs/components/datagrid/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.twoWithAllowCalculatedOverride = exports.withAllowCalculateOverride = exports.modalWithRequiredFields = exports.withRowGroupsAndDefValue = exports.withLogic = exports.withDefValue = exports.withConditionalFieldsAndValidations = exports.withCollapsibleRowGroups = exports.comp8 = exports.comp7 = exports.comp6 = exports.comp5 = exports.comp4 = exports.comp3 = exports.comp2 = exports.comp1 = void 0;
+exports.withCheckboxes = exports.twoWithAllowCalculatedOverride = exports.withAllowCalculateOverride = exports.modalWithRequiredFields = exports.withRowGroupsAndDefValue = exports.withLogic = exports.withDefValue = exports.withConditionalFieldsAndValidations = exports.withCollapsibleRowGroups = exports.comp8 = exports.comp7 = exports.comp6 = exports.comp5 = exports.comp4 = exports.comp3 = exports.comp2 = exports.comp1 = void 0;
 const comp1_1 = __importDefault(require("./comp1"));
 exports.comp1 = comp1_1.default;
 const comp2_1 = __importDefault(require("./comp2"));
@@ -36,3 +36,5 @@ const comp_with_allow_calculate_override_1 = __importDefault(require("./comp-wit
 exports.withAllowCalculateOverride = comp_with_allow_calculate_override_1.default;
 const two_comp_with_allow_calculate_override_1 = __importDefault(require("./two-comp-with-allow-calculate-override"));
 exports.twoWithAllowCalculatedOverride = two_comp_with_allow_calculate_override_1.default;
+const comp_with_checkboxes_1 = __importDefault(require("./comp-with-checkboxes"));
+exports.withCheckboxes = comp_with_checkboxes_1.default;

package/lib/cjs/components/file/File.js

@@ -652,7 +652,7 @@ class FileComponent extends Field_1.default {
         // Check if file with the same name is being uploaded
         const fileWithSameNameUploading = this.filesToSync.filesToUpload
             .some(fileToSync => { var _a; return ((_a = fileToSync.file) === null || _a === void 0 ? void 0 : _a.name) === file.name; });
-        const fileWithSameNameUploaded = this.dataValue && this.dataValue
+        const fileWithSameNameUploaded = this.dataValue
             .some(fileStatus => fileStatus.originalName === file.name);
         return fileWithSameNameUploaded || fileWithSameNameUploading
             ? {

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

@@ -431,7 +431,7 @@ class FormComponent extends Component_1.default {
      * Load the subform.
      */
     loadSubForm(fromAttach) {
-        var _a, _b, _c;
+        var _a, _b, _c, _d, _e;
         if (this.builderMode || this.isHidden() || (this.isSubFormLazyLoad() && !fromAttach)) {
             return Promise.resolve();
         }
@@ -445,7 +445,7 @@ class FormComponent extends Component_1.default {
         }
         else if (this.formSrc) {
             this.subFormLoading = true;
-            const options = ((_b = this.root.formio) === null || _b === void 0 ? void 0 : _b.base) && ((_c = this.root.formio) === null || _c === void 0 ? void 0 : _c.projectUrl)
+            const options = ((_c = (_b = this.root) === null || _b === void 0 ? void 0 : _b.formio) === null || _c === void 0 ? void 0 : _c.base) && ((_e = (_d = this.root) === null || _d === void 0 ? void 0 : _d.formio) === null || _e === void 0 ? void 0 : _e.projectUrl)
                 ? {
                     base: this.root.formio.base,
                     project: this.root.formio.projectUrl,
@@ -625,7 +625,7 @@ class FormComponent extends Component_1.default {
         return changed;
     }
     setSubFormValue(submission, flags) {
-        var _a, _b;
+        var _a, _b, _c, _d;
         const shouldLoadSubmissionById = submission
             && submission._id
             && this.subForm.formio
@@ -634,7 +634,7 @@ class FormComponent extends Component_1.default {
         if (shouldLoadSubmissionById || shouldLoadDraftById) {
             const formId = submission.form || this.formObj.form || this.component.form;
             const submissionUrl = `${this.subForm.formio.formsUrl}/${formId}/submission/${submission._id || this.subForm.submission._id}`;
-            const options = ((_a = this.root.formio) === null || _a === void 0 ? void 0 : _a.base) && ((_b = this.root.formio) === null || _b === void 0 ? void 0 : _b.projectUrl)
+            const options = ((_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.formio) === null || _b === void 0 ? void 0 : _b.base) && ((_d = (_c = this.root) === null || _c === void 0 ? void 0 : _c.formio) === null || _d === void 0 ? void 0 : _d.projectUrl)
                 ? {
                     base: this.root.formio.base,
                     project: this.root.formio.projectUrl,

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

@@ -200,7 +200,8 @@ class RadioComponent extends ListComponent_1.default {
         if (this.viewOnly || !this.refs.input || !this.refs.input.length) {
             return this.dataValue;
         }
-        let value = this.dataValue;
+        // If the input type of the component is checkbox the value should be determined by the checkboxes checked property
+        let value = this.component.inputType === 'checkbox' ? '' : this.dataValue;
         this.refs.input.forEach((input, index) => {
             if (input.checked) {
                 value = (this.isSelectURL && lodash_1.default.isObject(this.loadedOptions[index].value)) ?
@@ -322,7 +323,7 @@ class RadioComponent extends ListComponent_1.default {
             const value = this.dataValue;
             this.refs.wrapper.forEach((wrapper, index) => {
                 const input = this.refs.input[index];
-                const checked = (input.type === 'checkbox') ? value[input.value] : (input.value.toString() === value.toString());
+                const checked = (input.type === 'checkbox') ? value[input.value] || input.checked : (input.value.toString() === value.toString());
                 if (checked) {
                     //add class to container when selected
                     this.addClass(wrapper, this.optionSelectedClass);

package/lib/mjs/WebformBuilder.js

@@ -970,8 +970,14 @@ export default class WebformBuilder extends Component {
             else if (parent.formioComponent && parent.formioComponent.removeChildComponent) {
                 parent.formioComponent.removeChildComponent(component);
             }
-            if (component.input && componentInstance && componentInstance.parent) {
-                _.unset(componentInstance._data, componentInstance.key);
+            if (component.input && componentInstance && parent.formioComponent) {
+                const parentDefaultValue = _.get(parent.formioComponent, 'component.defaultValue', null);
+                if (Array.isArray(parentDefaultValue)) {
+                    parentDefaultValue.forEach(v => _.unset(v, componentInstance.key));
+                }
+                else if (typeof parentDefaultValue === 'object') {
+                    _.unset(parentDefaultValue, componentInstance.key);
+                }
             }
             const rebuild = parent.formioComponent.rebuild() || Promise.resolve();
             rebuild.then(() => {

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

@@ -2527,7 +2527,7 @@ export default class Component extends Element {
         }
         this.calculatedValue = fastCloneDeep(calculatedValue);
         if (changed) {
-            if (!flags.noPristineChangeOnModified) {
+            if (!flags.noPristineChangeOnModified && this.root.initialized) {
                 this.pristine = false;
             }
             flags.triggeredComponentId = this.id;

package/lib/mjs/components/datagrid/fixtures/comp-with-checkboxes.d.ts

@@ -0,0 +1,29 @@
+declare namespace _default {
+    let label: string;
+    let reorder: boolean;
+    let addAnotherPosition: string;
+    let layoutFixed: boolean;
+    let enableRowGroups: boolean;
+    let initEmpty: boolean;
+    let tableView: boolean;
+    let defaultValue: {}[];
+    let key: string;
+    let type: string;
+    let input: boolean;
+    let components: {
+        label: string;
+        optionsLabelPosition: string;
+        inline: boolean;
+        tableView: boolean;
+        values: {
+            label: string;
+            value: string;
+            shortcut: string;
+        }[];
+        key: string;
+        type: string;
+        input: boolean;
+        inputType: string;
+    }[];
+}
+export default _default;

package/lib/mjs/components/datagrid/fixtures/comp-with-checkboxes.js

@@ -0,0 +1,34 @@
+export default {
+    'label': 'Data Grid',
+    'reorder': false,
+    'addAnotherPosition': 'bottom',
+    'layoutFixed': false,
+    'enableRowGroups': false,
+    'initEmpty': false,
+    'tableView': false,
+    'defaultValue': [
+        {}
+    ],
+    'key': 'dataGrid',
+    'type': 'datagrid',
+    'input': true,
+    'components': [
+        {
+            'label': 'Radio',
+            'optionsLabelPosition': 'right',
+            'inline': false,
+            'tableView': false,
+            'values': [
+                {
+                    'label': 'yes',
+                    'value': 'yes',
+                    'shortcut': ''
+                }
+            ],
+            'key': 'radio',
+            'type': 'radio',
+            'input': true,
+            'inputType': 'checkbox'
+        }
+    ]
+};

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

@@ -14,4 +14,5 @@ import withRowGroupsAndDefValue from './comp-row-groups-with-def-value';
 import modalWithRequiredFields from './comp-modal-with-required-fields';
 import withAllowCalculateOverride from './comp-with-allow-calculate-override';
 import twoWithAllowCalculatedOverride from './two-comp-with-allow-calculate-override';
-export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, withCollapsibleRowGroups, withConditionalFieldsAndValidations, withDefValue, withLogic, withRowGroupsAndDefValue, modalWithRequiredFields, withAllowCalculateOverride, twoWithAllowCalculatedOverride };
+import withCheckboxes from './comp-with-checkboxes';
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, withCollapsibleRowGroups, withConditionalFieldsAndValidations, withDefValue, withLogic, withRowGroupsAndDefValue, modalWithRequiredFields, withAllowCalculateOverride, twoWithAllowCalculatedOverride, withCheckboxes };

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

@@ -14,4 +14,5 @@ import withLogic from './comp-with-logic';
 import withCollapsibleRowGroups from './comp-with-collapsible-groups';
 import withAllowCalculateOverride from './comp-with-allow-calculate-override';
 import twoWithAllowCalculatedOverride from './two-comp-with-allow-calculate-override';
-export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, withCollapsibleRowGroups, withConditionalFieldsAndValidations, withDefValue, withLogic, withRowGroupsAndDefValue, modalWithRequiredFields, withAllowCalculateOverride, twoWithAllowCalculatedOverride };
+import withCheckboxes from './comp-with-checkboxes';
+export { comp1, comp2, comp3, comp4, comp5, comp6, comp7, comp8, withCollapsibleRowGroups, withConditionalFieldsAndValidations, withDefValue, withLogic, withRowGroupsAndDefValue, modalWithRequiredFields, withAllowCalculateOverride, twoWithAllowCalculatedOverride, withCheckboxes };

package/lib/mjs/components/file/File.js

@@ -649,7 +649,7 @@ export default class FileComponent extends Field {
         // Check if file with the same name is being uploaded
         const fileWithSameNameUploading = this.filesToSync.filesToUpload
             .some(fileToSync => fileToSync.file?.name === file.name);
-        const fileWithSameNameUploaded = this.dataValue && this.dataValue
+        const fileWithSameNameUploaded = this.dataValue
             .some(fileStatus => fileStatus.originalName === file.name);
         return fileWithSameNameUploaded || fileWithSameNameUploading
             ? {

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

@@ -440,7 +440,7 @@ export default class FormComponent extends Component {
         }
         else if (this.formSrc) {
             this.subFormLoading = true;
-            const options = this.root.formio?.base && this.root.formio?.projectUrl
+            const options = this.root?.formio?.base && this.root?.formio?.projectUrl
                 ? {
                     base: this.root.formio.base,
                     project: this.root.formio.projectUrl,
@@ -624,7 +624,7 @@ export default class FormComponent extends Component {
         if (shouldLoadSubmissionById || shouldLoadDraftById) {
             const formId = submission.form || this.formObj.form || this.component.form;
             const submissionUrl = `${this.subForm.formio.formsUrl}/${formId}/submission/${submission._id || this.subForm.submission._id}`;
-            const options = this.root.formio?.base && this.root.formio?.projectUrl
+            const options = this.root?.formio?.base && this.root?.formio?.projectUrl
                 ? {
                     base: this.root.formio.base,
                     project: this.root.formio.projectUrl,

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

@@ -200,7 +200,8 @@ export default class RadioComponent extends ListComponent {
         if (this.viewOnly || !this.refs.input || !this.refs.input.length) {
             return this.dataValue;
         }
-        let value = this.dataValue;
+        // If the input type of the component is checkbox the value should be determined by the checkboxes checked property
+        let value = this.component.inputType === 'checkbox' ? '' : this.dataValue;
         this.refs.input.forEach((input, index) => {
             if (input.checked) {
                 value = (this.isSelectURL && _.isObject(this.loadedOptions[index].value)) ?
@@ -322,7 +323,7 @@ export default class RadioComponent extends ListComponent {
             const value = this.dataValue;
             this.refs.wrapper.forEach((wrapper, index) => {
                 const input = this.refs.input[index];
-                const checked = (input.type === 'checkbox') ? value[input.value] : (input.value.toString() === value.toString());
+                const checked = (input.type === 'checkbox') ? value[input.value] || input.checked : (input.value.toString() === value.toString());
                 if (checked) {
                     //add class to container when selected
                     this.addClass(wrapper, this.optionSelectedClass);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.0.0-dev.5642.f9208f7",
+  "version": "5.0.0-dev.5643.17b8168",
   "description": "JavaScript powered Forms with JSON Form Builder",
   "main": "lib/cjs/index.js",
   "exports": {