@formio/js 5.1.0-dev.6155.8178240 → 5.1.0-dev.6156.9cd5779

package/lib/cjs/PDFBuilder.d.ts

@@ -51,6 +51,5 @@ export default class PDFBuilder extends WebformBuilder {
     onDropzoneDrop(e: any): boolean;
     dropEvent: any;
     onDragEnd(e: any): void;
-    repeatablePathsComps: any[] | undefined;
 }
 import WebformBuilder from './WebformBuilder';

package/lib/cjs/PDFBuilder.js

@@ -451,21 +451,21 @@ class PDFBuilder extends WebformBuilder_1.default {
         e.target.style.cursor = 'default';
     }
     highlightInvalidComponents() {
-        const repeatablePathsComps = this.findComponentsWithRepeatablePaths();
+        const repeatablePaths = this.findRepeatablePaths();
         // update elements which path was duplicated if any pathes have been changed
-        if (!lodash_1.default.isEqual(this.repeatablePathsComps, repeatablePathsComps)) {
-            (0, utils_1.eachComponent)(this.webform.getComponents(), (comp) => {
-                if (this.repeatablePathsComps.includes(comp.component)) {
+        if (!lodash_1.default.isEqual(this.repeatablePaths, repeatablePaths)) {
+            (0, utils_1.eachComponent)(this.webform.getComponents(), (comp, path) => {
+                if (this.repeatablePaths.includes(path)) {
                     this.webform.postMessage({ name: 'updateElement', data: comp.component });
                 }
             });
-            this.repeatablePathsComps = repeatablePathsComps;
+            this.repeatablePaths = repeatablePaths;
         }
-        if (!repeatablePathsComps.length) {
+        if (!repeatablePaths.length) {
             return;
         }
-        (0, utils_1.eachComponent)(this.webform.getComponents(), (comp) => {
-            if (this.repeatablePathsComps.includes(comp)) {
+        (0, utils_1.eachComponent)(this.webform.getComponents(), (comp, path) => {
+            if (this.repeatablePaths.includes(path)) {
                 this.webform.postMessage({
                     name: 'showBuilderErrors',
                     data: {

package/lib/cjs/WebformBuilder.d.ts

@@ -78,7 +78,7 @@ export default class WebformBuilder extends Component {
     replaceDoubleQuotes(data: any, fieldsToRemoveDoubleQuotes?: any[]): any;
     updateComponent(component: any, changed: any): void;
     originalDefaultValue: any;
-    findComponentsWithRepeatablePaths(): any[];
+    findRepeatablePaths(): any[];
     highlightInvalidComponents(): void;
     /**
      * Called when a new component is saved.

package/lib/cjs/WebformBuilder.js

@@ -1125,37 +1125,25 @@ class WebformBuilder extends Component_1.default {
         // Called when we update a component.
         this.emit('updateComponent', component);
     }
-    findComponentsWithRepeatablePaths() {
-        const repeatablePaths = {};
+    findRepeatablePaths() {
+        const repeatablePaths = [];
         const keys = new Map();
         (0, utils_1.eachComponent)(this.form.components, (comp, path, components, parent, paths) => {
-            var _a, _b;
-            const isRadioCheckbox = comp.type === 'checkbox' && comp.inputType === 'radio';
             if (keys.has(paths.dataPath)) {
-                const onlyRadioCheckboxes = ((_a = repeatablePaths[paths.dataPath]) === null || _a === void 0 ? void 0 : _a.onlyRadioCheckboxes) === false ? false : isRadioCheckbox;
-                repeatablePaths[paths.dataPath] = {
-                    comps: [...(((_b = repeatablePaths[paths.dataPath]) === null || _b === void 0 ? void 0 : _b.comps) || []), keys.get(paths.dataPath), comp],
-                    onlyRadioCheckboxes,
-                };
+                repeatablePaths.push(paths.dataPath);
             }
             else {
-                keys.set(paths.dataPath, comp);
+                keys.set(paths.dataPath, true);
             }
         }, true);
-        const componentsWithRepeatablePaths = [];
-        Object.keys(repeatablePaths).forEach((path) => {
-            const { comps, onlyRadioCheckboxes } = repeatablePaths[path];
-            if (!onlyRadioCheckboxes) {
-                componentsWithRepeatablePaths.push(...comps);
-            }
-        });
-        return componentsWithRepeatablePaths;
+        return repeatablePaths;
     }
     highlightInvalidComponents() {
-        const repeatablePathsComps = this.findComponentsWithRepeatablePaths();
+        const repeatablePaths = this.findRepeatablePaths();
         let hasInvalidComponents = false;
         this.webform.everyComponent((comp) => {
-            if (repeatablePathsComps.includes(comp.component)) {
+            const path = comp.path;
+            if (repeatablePaths.includes(path)) {
                 comp.setCustomValidity(this.t('apiKey', { key: comp.key }));
                 hasInvalidComponents = true;
             }

package/lib/cjs/components/datamap/DataMap.js

@@ -228,6 +228,9 @@ class DataMapComponent extends DataGrid_1.default {
         options.name += `[${rowIndex}]`;
         options.row = `${rowIndex}`;
         options.rowIndex = rowIndex;
+        options.onChange = (flags, changed, modified) => {
+            this.triggerChange({ modified });
+        };
         const components = {};
         components['__key'] = this.createComponent(this.keySchema, options, { __key: this.builderMode ? this.defaultRowKey : key });
         components['__key'].on('componentChange', (event) => {
@@ -243,7 +246,9 @@ class DataMapComponent extends DataGrid_1.default {
         valueComponent.key = key;
         const componentOptions = this.options;
         componentOptions.row = options.row;
-        components[this.valueKey] = this.createComponent(valueComponent, componentOptions, this.dataValue);
+        const componentOptionsCloned = lodash_1.default.clone(componentOptions);
+        componentOptionsCloned.onChange = options.onChange;
+        components[this.valueKey] = this.createComponent(valueComponent, componentOptionsCloned, this.dataValue);
         return components;
     }
     get canAddColumn() {
@@ -266,7 +271,7 @@ class DataMapComponent extends DataGrid_1.default {
         const index = this.rows.length;
         this.rows[index] = this.createRowComponents(this.dataValue, index);
         this.redraw();
-        this.triggerChange();
+        this.triggerChange({ modified: true });
     }
     removeRow(index) {
         const keys = Object.keys(this.dataValue);

package/lib/mjs/PDFBuilder.d.ts

@@ -51,6 +51,5 @@ export default class PDFBuilder extends WebformBuilder {
     onDropzoneDrop(e: any): boolean;
     dropEvent: any;
     onDragEnd(e: any): void;
-    repeatablePathsComps: any[] | undefined;
 }
 import WebformBuilder from './WebformBuilder';

package/lib/mjs/PDFBuilder.js

@@ -444,21 +444,21 @@ export default class PDFBuilder extends WebformBuilder {
         e.target.style.cursor = 'default';
     }
     highlightInvalidComponents() {
-        const repeatablePathsComps = this.findComponentsWithRepeatablePaths();
+        const repeatablePaths = this.findRepeatablePaths();
         // update elements which path was duplicated if any pathes have been changed
-        if (!_.isEqual(this.repeatablePathsComps, repeatablePathsComps)) {
-            eachComponent(this.webform.getComponents(), (comp) => {
-                if (this.repeatablePathsComps.includes(comp.component)) {
+        if (!_.isEqual(this.repeatablePaths, repeatablePaths)) {
+            eachComponent(this.webform.getComponents(), (comp, path) => {
+                if (this.repeatablePaths.includes(path)) {
                     this.webform.postMessage({ name: 'updateElement', data: comp.component });
                 }
             });
-            this.repeatablePathsComps = repeatablePathsComps;
+            this.repeatablePaths = repeatablePaths;
         }
-        if (!repeatablePathsComps.length) {
+        if (!repeatablePaths.length) {
             return;
         }
-        eachComponent(this.webform.getComponents(), (comp) => {
-            if (this.repeatablePathsComps.includes(comp)) {
+        eachComponent(this.webform.getComponents(), (comp, path) => {
+            if (this.repeatablePaths.includes(path)) {
                 this.webform.postMessage({
                     name: 'showBuilderErrors',
                     data: {

package/lib/mjs/WebformBuilder.d.ts

@@ -78,7 +78,7 @@ export default class WebformBuilder extends Component {
     replaceDoubleQuotes(data: any, fieldsToRemoveDoubleQuotes?: any[]): any;
     updateComponent(component: any, changed: any): void;
     originalDefaultValue: any;
-    findComponentsWithRepeatablePaths(): any[];
+    findRepeatablePaths(): any[];
     highlightInvalidComponents(): void;
     /**
      * Called when a new component is saved.

package/lib/mjs/WebformBuilder.js

@@ -1108,36 +1108,25 @@ export default class WebformBuilder extends Component {
         // Called when we update a component.
         this.emit('updateComponent', component);
     }
-    findComponentsWithRepeatablePaths() {
-        const repeatablePaths = {};
+    findRepeatablePaths() {
+        const repeatablePaths = [];
         const keys = new Map();
         eachComponent(this.form.components, (comp, path, components, parent, paths) => {
-            const isRadioCheckbox = comp.type === 'checkbox' && comp.inputType === 'radio';
             if (keys.has(paths.dataPath)) {
-                const onlyRadioCheckboxes = repeatablePaths[paths.dataPath]?.onlyRadioCheckboxes === false ? false : isRadioCheckbox;
-                repeatablePaths[paths.dataPath] = {
-                    comps: [...(repeatablePaths[paths.dataPath]?.comps || []), keys.get(paths.dataPath), comp],
-                    onlyRadioCheckboxes,
-                };
+                repeatablePaths.push(paths.dataPath);
             }
             else {
-                keys.set(paths.dataPath, comp);
+                keys.set(paths.dataPath, true);
             }
         }, true);
-        const componentsWithRepeatablePaths = [];
-        Object.keys(repeatablePaths).forEach((path) => {
-            const { comps, onlyRadioCheckboxes } = repeatablePaths[path];
-            if (!onlyRadioCheckboxes) {
-                componentsWithRepeatablePaths.push(...comps);
-            }
-        });
-        return componentsWithRepeatablePaths;
+        return repeatablePaths;
     }
     highlightInvalidComponents() {
-        const repeatablePathsComps = this.findComponentsWithRepeatablePaths();
+        const repeatablePaths = this.findRepeatablePaths();
         let hasInvalidComponents = false;
         this.webform.everyComponent((comp) => {
-            if (repeatablePathsComps.includes(comp.component)) {
+            const path = comp.path;
+            if (repeatablePaths.includes(path)) {
                 comp.setCustomValidity(this.t('apiKey', { key: comp.key }));
                 hasInvalidComponents = true;
             }

package/lib/mjs/components/datamap/DataMap.js

@@ -223,6 +223,9 @@ export default class DataMapComponent extends DataGridComponent {
         options.name += `[${rowIndex}]`;
         options.row = `${rowIndex}`;
         options.rowIndex = rowIndex;
+        options.onChange = (flags, changed, modified) => {
+            this.triggerChange({ modified });
+        };
         const components = {};
         components['__key'] = this.createComponent(this.keySchema, options, { __key: this.builderMode ? this.defaultRowKey : key });
         components['__key'].on('componentChange', (event) => {
@@ -238,7 +241,9 @@ export default class DataMapComponent extends DataGridComponent {
         valueComponent.key = key;
         const componentOptions = this.options;
         componentOptions.row = options.row;
-        components[this.valueKey] = this.createComponent(valueComponent, componentOptions, this.dataValue);
+        const componentOptionsCloned = _.clone(componentOptions);
+        componentOptionsCloned.onChange = options.onChange;
+        components[this.valueKey] = this.createComponent(valueComponent, componentOptionsCloned, this.dataValue);
         return components;
     }
     get canAddColumn() {
@@ -261,7 +266,7 @@ export default class DataMapComponent extends DataGridComponent {
         const index = this.rows.length;
         this.rows[index] = this.createRowComponents(this.dataValue, index);
         this.redraw();
-        this.triggerChange();
+        this.triggerChange({ modified: true });
     }
     removeRow(index) {
         const keys = Object.keys(this.dataValue);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.1.0-dev.6155.8178240",
+  "version": "5.1.0-dev.6156.9cd5779",
   "description": "JavaScript powered Forms with JSON Form Builder",
   "main": "lib/cjs/index.js",
   "exports": {