@formio/js 5.1.0-dev.6102.8eddaab → 5.1.0-dev.6102.9a0147c

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

@@ -20,6 +20,8 @@
 
 /*! @license DOMPurify 3.2.4 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.2.4/LICENSE */
 
+/*! @license DOMPurify 3.2.5 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.2.5/LICENSE */
+
 /*! formiojs v5.1.0-dev.2 | https://unpkg.com/formiojs@5.1.0-dev.2/LICENSE.txt */
 
 /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */

package/lib/cjs/Wizard.d.ts

@@ -6,7 +6,6 @@ declare class Wizard extends Webform {
     originalComponents: any[];
     page: number;
     currentPanel: any;
-    currentPanels: any[] | null;
     currentNextPage: number;
     _seenPages: number[];
     subWizards: any[];
@@ -17,7 +16,7 @@ declare class Wizard extends Webform {
     originalOptions: any;
     isLastPage(): any;
     getPages(args?: {}): any[];
-    get hasExtraPages(): boolean;
+    get hasSubWizards(): boolean;
     get localData(): any;
     get wizardKey(): string;
     set wizard(form: object);

package/lib/cjs/Wizard.js

@@ -34,7 +34,6 @@ class Wizard extends Webform_1.default {
         this.originalComponents = [];
         this.page = 0;
         this.currentPanel = null;
-        this.currentPanels = null;
         this.currentNextPage = 0;
         this._seenPages = [0];
         this.subWizards = [];
@@ -53,12 +52,12 @@ class Wizard extends Webform_1.default {
     }
     getPages(args = {}) {
         const { all = false } = args;
-        const pages = this.hasExtraPages ? this.components : this.pages;
+        const pages = this.hasSubWizards ? this.components : this.pages;
         const filteredPages = pages
             .filter(all ? lodash_1.default.identity : (p, index) => this._seenPages.includes(index));
         return filteredPages;
     }
-    get hasExtraPages() {
+    get hasSubWizards() {
         return !lodash_1.default.isEmpty(this.subWizards);
     }
     get data() {
@@ -187,9 +186,9 @@ class Wizard extends Webform_1.default {
     }
     render() {
         const ctx = this.renderContext;
-        if (this.component.key) {
-            ctx.panels.map(panel => {
-                if (panel.key === this.component.key) {
+        if (this.component.id) {
+            ctx.panels.forEach(panel => {
+                if (panel.id === this.component.id) {
                     this.currentPanel = panel;
                     ctx.wizardPageTooltip = this.getFormattedTooltip(panel.tooltip);
                 }
@@ -587,7 +586,7 @@ class Wizard extends Webform_1.default {
             this.pageFieldLogic(num);
             this.getNextPage();
             let parentNum = num;
-            if (this.hasExtraPages) {
+            if (this.hasSubWizards) {
                 const pageFromPages = this.pages[num];
                 const pageFromComponents = this.components[num];
                 if (!pageFromComponents || (pageFromPages === null || pageFromPages === void 0 ? void 0 : pageFromPages.id) !== pageFromComponents.id) {
@@ -873,7 +872,7 @@ class Wizard extends Webform_1.default {
         }
     }
     onChange(flags, changed, modified, changes) {
-        var _a, _b;
+        var _a;
         super.onChange(flags, changed, modified, changes);
         // The onChange loop doesn't need all components for wizards
         const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : this.validateCurrentPage();
@@ -881,23 +880,18 @@ class Wizard extends Webform_1.default {
             this.showErrors(errors, true, true);
         }
         // If the pages change, need to redraw the header.
-        let currentPanels;
-        let panels;
+        const currentPanels = this.pages;
+        // calling this.establishPages() updates/mutates this.pages to be the current pages
+        this.establishPages();
+        const newPanels = this.pages;
         const currentNextPage = this.currentNextPage;
-        if (this.hasExtraPages) {
-            currentPanels = this.pages.map(page => page.component.key);
-            this.establishPages();
-            panels = this.pages.map(page => page.component.key);
-        }
-        else {
-            currentPanels = this.currentPanels || this.pages.map(page => page.component.key);
-            panels = this.establishPages().map(panel => panel.key);
-            this.currentPanels = panels;
-            if (((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.key) && ((_b = this.currentPanels) === null || _b === void 0 ? void 0 : _b.length)) {
-                this.setPage(this.currentPanels.findIndex(panel => panel === this.currentPanel.key));
-            }
+        const panelsUpdated = !lodash_1.default.isEqual(newPanels, currentPanels);
+        if (((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.id) && this.pages.length && (!this.hasSubWizards || (this.hasSubWizards && panelsUpdated))) {
+            const newIndex = this.pages.findIndex(page => page.id === this.currentPanel.id);
+            if (newIndex !== -1)
+                this.setPage(newIndex);
         }
-        if (!lodash_1.default.isEqual(panels, currentPanels) || (flags && flags.fromSubmission)) {
+        if (panelsUpdated || (flags && flags.fromSubmission)) {
             this.redrawHeader();
         }
         // If the next page changes, then make sure to redraw navigation.

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

@@ -664,7 +664,7 @@ class NestedComponent extends Field_1.default {
     validationProcessor({ scope, data, row, instance, paths }, flags) {
         var _a;
         const { dirty } = flags;
-        if (this.root.hasExtraPages && this.page !== this.root.page) {
+        if (this.root.hasSubWizards && this.page !== this.root.page) {
             instance = ((_a = this.componentsMap) === null || _a === void 0 ? void 0 : _a.hasOwnProperty(paths.dataPath))
                 ? this.componentsMap[paths.dataPath]
                 : this.getComponent(paths.dataPath);

package/lib/cjs/components/button/Button.d.ts

@@ -9,7 +9,7 @@ export default class ButtonComponent extends Field {
     };
     static savedValueTypes(schema: any): any;
     constructor(component: any, options: any, data: any);
-    filesUploading: any[];
+    filesUploading: number;
     get inputInfo(): any;
     get labelInfo(): {
         hidden: boolean;

package/lib/cjs/components/button/Button.js

@@ -39,7 +39,7 @@ class ButtonComponent extends Field_1.default {
     }
     constructor(component, options, data) {
         super(component, options, data);
-        this.filesUploading = [];
+        this.filesUploading = 0;
     }
     get defaultSchema() {
         return ButtonComponent.schema();
@@ -147,16 +147,13 @@ class ButtonComponent extends Field_1.default {
                 this.addClass(this.refs.buttonMessageContainer, 'has-error');
                 this.setContent(this.refs.buttonMessage, resultMessage);
             }, true);
-            this.on('fileUploadingStart', (filePromise) => {
-                this.filesUploading.push(filePromise);
+            this.on('fileUploadingStart', () => {
+                this.filesUploading++;
                 this.disabled = true;
                 this.setDisabled(this.refs.button, this.disabled);
             }, true);
-            this.on('fileUploadingEnd', (filePromise) => {
-                const index = this.filesUploading.indexOf(filePromise);
-                if (index !== -1) {
-                    this.filesUploading.splice(index, 1);
-                }
+            this.on('fileUploadingEnd', () => {
+                this.filesUploading--;
                 this.disabled = this.shouldDisabled ? true : false;
                 this.setDisabled(this.refs.button, this.disabled);
             }, true);
@@ -252,8 +249,7 @@ class ButtonComponent extends Field_1.default {
         }
     }
     get shouldDisabled() {
-        var _a;
-        return super.shouldDisabled || !!((_a = this.filesUploading) === null || _a === void 0 ? void 0 : _a.length) || this.isDisabledOnInvalid;
+        return super.shouldDisabled || this.filesUploading > 0 || this.isDisabledOnInvalid;
     }
     attach(element) {
         this.loadRefs(element, {

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

@@ -492,6 +492,10 @@ class DataGridComponent extends NestedArrayComponent_1.default {
             options.row = `${rowIndex}-${colIndex}`;
             options.rowIndex = rowIndex;
             options.onChange = (flags, changed, modified) => {
+                if (changed.component.type === 'form') {
+                    const formComp = (0, utils_1.getComponent)(this.component.components, changed.component.key);
+                    lodash_1.default.set(formComp, 'components', changed.component.components);
+                }
                 this.triggerChange({ modified });
             };
             let columnComponent;

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

@@ -905,17 +905,16 @@ class FileComponent extends Field_1.default {
     }
     uploadFile(fileToSync) {
         return __awaiter(this, void 0, void 0, function* () {
-            const filePromise = this.fileService.uploadFile(fileToSync.storage, fileToSync.file, fileToSync.name, fileToSync.dir, 
+            return yield this.fileService.uploadFile(fileToSync.storage, fileToSync.file, fileToSync.name, fileToSync.dir, 
             // Progress callback
             this.updateProgress.bind(this, fileToSync), fileToSync.url, fileToSync.options, fileToSync.fileKey, fileToSync.groupPermissions, fileToSync.groupResourceId, () => {
-                this.emit('fileUploadingStart', filePromise);
+                this.emit('fileUploadingStart');
             }, 
             // Abort upload callback
             (abort) => this.abortUploads.push({
                 id: fileToSync.id,
                 abort,
             }), this.getMultipartOptions(fileToSync));
-            return yield filePromise;
         });
     }
     upload() {
@@ -937,7 +936,7 @@ class FileComponent extends Field_1.default {
                     fileToSync.message = this.t('succefullyUploaded');
                     fileInfo.originalName = fileToSync.originalName;
                     fileInfo.hash = fileToSync.hash;
-                    this.emit('fileUploadingEnd', Promise.resolve(fileInfo));
+                    this.emit('fileUploadingEnd');
                 }
                 catch (response) {
                     fileToSync.status = 'error';
@@ -947,7 +946,7 @@ class FileComponent extends Field_1.default {
                         : response.type === 'abort'
                             ? this.t('Request was aborted')
                             : response.toString();
-                    this.emit('fileUploadingEnd', Promise.reject(response));
+                    this.emit('fileUploadingEnd');
                     this.emit('fileUploadError', {
                         fileToSync,
                         response,

package/lib/cjs/providers/storage/uploadAdapter.js

@@ -27,7 +27,7 @@ class FormioUploadAdapter {
                 null,
                 null
             ];
-            const uploadPromise = this.fileService.uploadFile(...uploadParams, () => this.component.emit('fileUploadingStart', uploadPromise)).then((result) => {
+            this.fileService.uploadFile(...uploadParams, () => this.component.emit('fileUploadingStart')).then((result) => {
                 return this.fileService.downloadFile(result);
             }).then((result) => {
                 return resolve({
@@ -37,7 +37,7 @@ class FormioUploadAdapter {
                 console.warn('An Error occured while uploading file', err);
                 reject(err);
             }).finally(() => {
-                this.component.emit('fileUploadingEnd', uploadPromise);
+                this.component.emit('fileUploadingEnd');
             });
         }));
     }

package/lib/mjs/Wizard.d.ts

@@ -6,7 +6,6 @@ declare class Wizard extends Webform {
     originalComponents: any[];
     page: number;
     currentPanel: any;
-    currentPanels: any[] | null;
     currentNextPage: number;
     _seenPages: number[];
     subWizards: any[];
@@ -17,7 +16,7 @@ declare class Wizard extends Webform {
     originalOptions: any;
     isLastPage(): any;
     getPages(args?: {}): any[];
-    get hasExtraPages(): boolean;
+    get hasSubWizards(): boolean;
     get localData(): any;
     get wizardKey(): string;
     set wizard(form: object);

package/lib/mjs/Wizard.js

@@ -29,7 +29,6 @@ export default class Wizard extends Webform {
         this.originalComponents = [];
         this.page = 0;
         this.currentPanel = null;
-        this.currentPanels = null;
         this.currentNextPage = 0;
         this._seenPages = [0];
         this.subWizards = [];
@@ -48,12 +47,12 @@ export default class Wizard extends Webform {
     }
     getPages(args = {}) {
         const { all = false } = args;
-        const pages = this.hasExtraPages ? this.components : this.pages;
+        const pages = this.hasSubWizards ? this.components : this.pages;
         const filteredPages = pages
             .filter(all ? _.identity : (p, index) => this._seenPages.includes(index));
         return filteredPages;
     }
-    get hasExtraPages() {
+    get hasSubWizards() {
         return !_.isEmpty(this.subWizards);
     }
     get data() {
@@ -177,9 +176,9 @@ export default class Wizard extends Webform {
     }
     render() {
         const ctx = this.renderContext;
-        if (this.component.key) {
-            ctx.panels.map(panel => {
-                if (panel.key === this.component.key) {
+        if (this.component.id) {
+            ctx.panels.forEach(panel => {
+                if (panel.id === this.component.id) {
                     this.currentPanel = panel;
                     ctx.wizardPageTooltip = this.getFormattedTooltip(panel.tooltip);
                 }
@@ -580,7 +579,7 @@ export default class Wizard extends Webform {
             this.pageFieldLogic(num);
             this.getNextPage();
             let parentNum = num;
-            if (this.hasExtraPages) {
+            if (this.hasSubWizards) {
                 const pageFromPages = this.pages[num];
                 const pageFromComponents = this.components[num];
                 if (!pageFromComponents || pageFromPages?.id !== pageFromComponents.id) {
@@ -869,23 +868,18 @@ export default class Wizard extends Webform {
             this.showErrors(errors, true, true);
         }
         // If the pages change, need to redraw the header.
-        let currentPanels;
-        let panels;
+        const currentPanels = this.pages;
+        // calling this.establishPages() updates/mutates this.pages to be the current pages
+        this.establishPages();
+        const newPanels = this.pages;
         const currentNextPage = this.currentNextPage;
-        if (this.hasExtraPages) {
-            currentPanels = this.pages.map(page => page.component.key);
-            this.establishPages();
-            panels = this.pages.map(page => page.component.key);
-        }
-        else {
-            currentPanels = this.currentPanels || this.pages.map(page => page.component.key);
-            panels = this.establishPages().map(panel => panel.key);
-            this.currentPanels = panels;
-            if (this.currentPanel?.key && this.currentPanels?.length) {
-                this.setPage(this.currentPanels.findIndex(panel => panel === this.currentPanel.key));
-            }
+        const panelsUpdated = !_.isEqual(newPanels, currentPanels);
+        if (this.currentPanel?.id && this.pages.length && (!this.hasSubWizards || (this.hasSubWizards && panelsUpdated))) {
+            const newIndex = this.pages.findIndex(page => page.id === this.currentPanel.id);
+            if (newIndex !== -1)
+                this.setPage(newIndex);
         }
-        if (!_.isEqual(panels, currentPanels) || (flags && flags.fromSubmission)) {
+        if (panelsUpdated || (flags && flags.fromSubmission)) {
             this.redrawHeader();
         }
         // If the next page changes, then make sure to redraw navigation.

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

@@ -659,7 +659,7 @@ export default class NestedComponent extends Field {
     }
     validationProcessor({ scope, data, row, instance, paths }, flags) {
         const { dirty } = flags;
-        if (this.root.hasExtraPages && this.page !== this.root.page) {
+        if (this.root.hasSubWizards && this.page !== this.root.page) {
             instance = this.componentsMap?.hasOwnProperty(paths.dataPath)
                 ? this.componentsMap[paths.dataPath]
                 : this.getComponent(paths.dataPath);

package/lib/mjs/components/button/Button.d.ts

@@ -9,7 +9,7 @@ export default class ButtonComponent extends Field {
     };
     static savedValueTypes(schema: any): any;
     constructor(component: any, options: any, data: any);
-    filesUploading: any[];
+    filesUploading: number;
     get inputInfo(): any;
     get labelInfo(): {
         hidden: boolean;

package/lib/mjs/components/button/Button.js

@@ -34,7 +34,7 @@ export default class ButtonComponent extends Field {
     }
     constructor(component, options, data) {
         super(component, options, data);
-        this.filesUploading = [];
+        this.filesUploading = 0;
     }
     get defaultSchema() {
         return ButtonComponent.schema();
@@ -142,16 +142,13 @@ export default class ButtonComponent extends Field {
                 this.addClass(this.refs.buttonMessageContainer, 'has-error');
                 this.setContent(this.refs.buttonMessage, resultMessage);
             }, true);
-            this.on('fileUploadingStart', (filePromise) => {
-                this.filesUploading.push(filePromise);
+            this.on('fileUploadingStart', () => {
+                this.filesUploading++;
                 this.disabled = true;
                 this.setDisabled(this.refs.button, this.disabled);
             }, true);
-            this.on('fileUploadingEnd', (filePromise) => {
-                const index = this.filesUploading.indexOf(filePromise);
-                if (index !== -1) {
-                    this.filesUploading.splice(index, 1);
-                }
+            this.on('fileUploadingEnd', () => {
+                this.filesUploading--;
                 this.disabled = this.shouldDisabled ? true : false;
                 this.setDisabled(this.refs.button, this.disabled);
             }, true);
@@ -247,7 +244,7 @@ export default class ButtonComponent extends Field {
         }
     }
     get shouldDisabled() {
-        return super.shouldDisabled || !!this.filesUploading?.length || this.isDisabledOnInvalid;
+        return super.shouldDisabled || this.filesUploading > 0 || this.isDisabledOnInvalid;
     }
     attach(element) {
         this.loadRefs(element, {

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

@@ -1,6 +1,6 @@
 import _ from 'lodash';
 import NestedArrayComponent from '../_classes/nestedarray/NestedArrayComponent';
-import { fastCloneDeep, getFocusableElements } from '../../utils';
+import { fastCloneDeep, getFocusableElements, getComponent } from '../../utils';
 export default class DataGridComponent extends NestedArrayComponent {
     static schema(...extend) {
         return NestedArrayComponent.schema({
@@ -488,6 +488,10 @@ export default class DataGridComponent extends NestedArrayComponent {
             options.row = `${rowIndex}-${colIndex}`;
             options.rowIndex = rowIndex;
             options.onChange = (flags, changed, modified) => {
+                if (changed.component.type === 'form') {
+                    const formComp = getComponent(this.component.components, changed.component.key);
+                    _.set(formComp, 'components', changed.component.components);
+                }
                 this.triggerChange({ modified });
             };
             let columnComponent;

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

@@ -903,17 +903,16 @@ export default class FileComponent extends Field {
         } : false;
     }
     async uploadFile(fileToSync) {
-        const filePromise = this.fileService.uploadFile(fileToSync.storage, fileToSync.file, fileToSync.name, fileToSync.dir, 
+        return await this.fileService.uploadFile(fileToSync.storage, fileToSync.file, fileToSync.name, fileToSync.dir, 
         // Progress callback
         this.updateProgress.bind(this, fileToSync), fileToSync.url, fileToSync.options, fileToSync.fileKey, fileToSync.groupPermissions, fileToSync.groupResourceId, () => {
-            this.emit('fileUploadingStart', filePromise);
+            this.emit('fileUploadingStart');
         }, 
         // Abort upload callback
         (abort) => this.abortUploads.push({
             id: fileToSync.id,
             abort,
         }), this.getMultipartOptions(fileToSync));
-        return await filePromise;
     }
     async upload() {
         if (!this.filesToSync.filesToUpload.length) {
@@ -933,7 +932,7 @@ export default class FileComponent extends Field {
                 fileToSync.message = this.t('succefullyUploaded');
                 fileInfo.originalName = fileToSync.originalName;
                 fileInfo.hash = fileToSync.hash;
-                this.emit('fileUploadingEnd', Promise.resolve(fileInfo));
+                this.emit('fileUploadingEnd');
             }
             catch (response) {
                 fileToSync.status = 'error';
@@ -943,7 +942,7 @@ export default class FileComponent extends Field {
                     : response.type === 'abort'
                         ? this.t('Request was aborted')
                         : response.toString();
-                this.emit('fileUploadingEnd', Promise.reject(response));
+                this.emit('fileUploadingEnd');
                 this.emit('fileUploadError', {
                     fileToSync,
                     response,

package/lib/mjs/providers/storage/uploadAdapter.js

@@ -24,7 +24,7 @@ class FormioUploadAdapter {
                 null,
                 null
             ];
-            const uploadPromise = this.fileService.uploadFile(...uploadParams, () => this.component.emit('fileUploadingStart', uploadPromise)).then((result) => {
+            this.fileService.uploadFile(...uploadParams, () => this.component.emit('fileUploadingStart')).then((result) => {
                 return this.fileService.downloadFile(result);
             }).then((result) => {
                 return resolve({
@@ -34,7 +34,7 @@ class FormioUploadAdapter {
                 console.warn('An Error occured while uploading file', err);
                 reject(err);
             }).finally(() => {
-                this.component.emit('fileUploadingEnd', uploadPromise);
+                this.component.emit('fileUploadingEnd');
             });
         }));
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.1.0-dev.6102.8eddaab",
+  "version": "5.1.0-dev.6102.9a0147c",
   "description": "JavaScript powered Forms with JSON Form Builder",
   "main": "lib/cjs/index.js",
   "exports": {
@@ -81,12 +81,12 @@
   "homepage": "https://github.com/formio/formio.js#readme",
   "dependencies": {
     "@formio/bootstrap": "v3.0.0-dev.121.085d187",
-    "@formio/core": "2.4.0-dev.245.3d53057",
+    "@formio/core": "2.4.0-dev.245.326cac7",
     "@formio/text-mask-addons": "3.8.0-formio.4",
     "@formio/vanilla-text-mask": "^5.1.1-formio.1",
     "abortcontroller-polyfill": "^1.7.5",
     "autocompleter": "^8.0.4",
-    "bootstrap": "^5.3.3",
+    "bootstrap": "^5.3.4",
     "browser-cookies": "^1.2.0",
     "browser-md5-file": "^1.1.1",
     "choices.js": "^11.0.6",
@@ -94,7 +94,7 @@
     "core-js": "^3.37.1",
     "dialog-polyfill": "^0.5.6",
     "dom-autoscroller": "^2.3.4",
-    "dompurify": "^3.1.6",
+    "dompurify": "^3.2.5",
     "downloadjs": "^1.4.7",
     "dragula": "^3.7.3",
     "eventemitter3": "^5.0.1",