@formio/js 5.1.0-rc.24 → 5.1.0-rc.26

package/lib/cjs/utils/utils.js

@@ -19,7 +19,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.firstNonNil = exports.unfold = exports.bootstrapVersion = exports.uniqueKey = exports.iterateKey = exports.delay = exports.fieldData = exports.getCurrencyAffixes = exports.getNumberDecimalLimit = exports.getNumberSeparators = exports.matchInputMask = exports.unmaskValue = exports.getInputMask = exports.convertFormatToMask = exports.convertFormatToMoment = exports.convertFormatToFlatpickr = exports.getLocaleDateFormatInfo = exports.formatOffset = exports.formatDate = exports.momentDate = exports.loadZones = exports.shouldLoadZones = exports.zonesLoaded = exports.offsetDate = exports.currentTimezone = exports.isValidDate = exports.getDateSetting = exports.guid = exports.uniqueName = exports.convertStringToHTMLElement = exports.unescapeHTML = exports.removeHTML = exports.setActionProperty = exports.checkTrigger = exports.checkCondition = exports.checkJsonConditional = exports.checkCustomConditional = exports.getComponentActualValue = exports.checkSimpleConditional = exports.checkCalculated = exports.isMongoId = exports.boolValue = exports.getScriptPlugin = exports.getElementRect = exports.getPropertyValue = exports.getRandomComponentId = exports.evaluate = exports.moment = exports.ConditionOperators = exports.jsonLogic = void 0;
-exports.interpolateErrors = exports.getComponentSavedTypes = exports.componentValueTypes = exports._ = exports.getFocusableElements = exports.isInsideScopingComponent = exports.isPromise = exports.getDataParentComponent = exports.getComponentPath = exports.getComponentPathWithoutIndicies = exports.getBrowserInfo = exports.getIEBrowserVersion = exports.round = exports.getStringFromComponentPath = exports.isChildOf = exports.getArrayFromComponentPath = exports.isInputComponent = exports.interpolate = exports.Evaluator = exports.fastCloneDeep = exports.sanitize = exports.translateHTMLTemplate = exports.getContextButtons = exports.getContextComponents = exports.observeOverload = exports.withSwitch = void 0;
+exports.interpolateErrors = exports.getComponentSavedTypes = exports.componentValueTypes = exports._ = exports.getFocusableElements = exports.isPromise = exports.getDataParentComponent = exports.getComponentPath = exports.getComponentPathWithoutIndicies = exports.getBrowserInfo = exports.getIEBrowserVersion = exports.round = exports.getStringFromComponentPath = exports.isChildOf = exports.getArrayFromComponentPath = exports.isInputComponent = exports.interpolate = exports.Evaluator = exports.fastCloneDeep = exports.sanitize = exports.translateHTMLTemplate = exports.getContextButtons = exports.getContextComponents = exports.observeOverload = exports.withSwitch = void 0;
 const lodash_1 = __importDefault(require("lodash"));
 exports._ = lodash_1.default;
 const json_logic_js_1 = __importDefault(require("json-logic-js"));
@@ -1593,27 +1593,6 @@ function isPromise(value) {
         && Object.prototype.toString.call(value) === '[object Promise]';
 }
 exports.isPromise = isPromise;
-/**
- * Determines if the component has a scoping parent in tree (a component which scopes its children and manages its
- * changes by itself, e.g. EditGrid)
- * @param {Component} componentInstance - The component to check for the scoping parent.
- * @param {boolean} firstPass - Whether it is the first pass of the function
- * @returns {boolean|*} - TRUE if the component has a scoping parent; FALSE otherwise
- */
-function isInsideScopingComponent(componentInstance, firstPass = true) {
-    if (!firstPass && (componentInstance === null || componentInstance === void 0 ? void 0 : componentInstance.hasScopedChildren)) {
-        return true;
-    }
-    const dataParent = getDataParentComponent(componentInstance);
-    if (dataParent === null || dataParent === void 0 ? void 0 : dataParent.hasScopedChildren) {
-        return true;
-    }
-    else if (dataParent === null || dataParent === void 0 ? void 0 : dataParent.parent) {
-        return isInsideScopingComponent(dataParent.parent, false);
-    }
-    return false;
-}
-exports.isInsideScopingComponent = isInsideScopingComponent;
 /**
  * Returns all the focusable elements within the provided dom element.
  * @param {HTMLElement} element - The element to get the focusable elements from.

package/lib/mjs/Embed.js

@@ -14,7 +14,7 @@ export class Formio {
         Formio._formioReady = ready;
         Formio._formioReadyReject = reject;
     });
-    static version = '5.1.0-rc.24';
+    static version = '5.1.0-rc.26';
     static setLicense(license, norecurse = false) {
         Formio.license = license;
         if (!norecurse && Formio.FormioClass) {

package/lib/mjs/Formio.js

@@ -4,7 +4,7 @@ import CDN from './CDN';
 import Providers from './providers';
 FormioCore.cdn = new CDN();
 FormioCore.Providers = Providers;
-FormioCore.version = '5.1.0-rc.24';
+FormioCore.version = '5.1.0-rc.26';
 CDN.defaultCDN = FormioCore.version.includes('rc') ? 'https://cdn.test-form.io' : 'https://cdn.form.io';
 const isNil = (val) => val === null || val === undefined;
 FormioCore.prototype.uploadFile = function (storage, file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, uploadStartCallback, abortCallback, multipartOptions) {

package/lib/mjs/WebformBuilder.js

@@ -1637,6 +1637,10 @@ export default class WebformBuilder extends Component {
             info.type);
     }
     hasEditTabs(type) {
+        // If the component type does not exist then it has no edit tabs
+        if (!Components.components[type]) {
+            return false;
+        }
         const editTabs = getComponent(Components.components[type === 'custom' ? 'unknown' : type].editForm().components, 'tabs', true).components;
         const hiddenEditTabs = _.filter(_.get(this.options, `editForm.${type}`, []), 'ignore');
         return _.intersectionBy(editTabs, hiddenEditTabs, 'key').length !== editTabs.length;

package/lib/mjs/Wizard.d.ts

@@ -106,6 +106,7 @@ declare class Wizard extends Webform {
     onChange(flags: any, changed: any, modified: any, changes: any): void;
     checkValidity(data: any, dirty: any, row: any, currentPageOnly: any, childErrors?: any[]): any;
     focusOnComponent(key: any): void | Promise<void>;
+    triggerButtonCaptcha(page: any): void;
 }
 declare namespace Wizard {
     let setBaseUrl: any;

package/lib/mjs/Wizard.js

@@ -594,7 +594,7 @@ export default class Wizard extends Webform {
             }
             this.redraw().then(() => {
                 this.checkData(this.submission.data);
-                this.triggerCaptcha(this.currentPanel.components);
+                this.triggerCaptcha(this.currentPage.components);
                 const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : this.validateCurrentPage();
                 if (this.alert) {
                     this.showErrors(errors, true, true);
@@ -660,6 +660,7 @@ export default class Wizard extends Webform {
     beforeSubmit() {
         const pages = this.getPages({ all: true });
         return Promise.all(pages.map((page) => {
+            this.triggerButtonCaptcha(page);
             page.options.beforeSubmit = true;
             return page.beforeSubmit();
         }));
@@ -718,7 +719,10 @@ export default class Wizard extends Webform {
     validateCurrentPage(flags = {}) {
         const components = this.currentPage?.components.map((component) => component.component);
         // Accessing the parent ensures the right instance (whether it's the parent Wizard or a nested Wizard) performs its validation
-        return this.currentPage?.parent.validateComponents(components, this.root.data, flags);
+        if (this.currentPage?.parent) {
+            return this.currentPage?.parent.validateComponents(components, this.root.data, flags);
+        }
+        return this.currentPage?.validateComponents(components, this.root ? this.root.data : this.data, flags);
     }
     emitPrevPage() {
         this.emit('prevPage', { page: this.page, submission: this.submission });
@@ -930,6 +934,22 @@ export default class Wizard extends Webform {
         }
         return super.focusOnComponent(key);
     }
+    triggerButtonCaptcha(page) {
+        if (!page.components) {
+            return;
+        }
+        let captchaComponent;
+        page.eachComponent((component) => {
+            if (/^(re)?captcha$/.test(component.component.type) &&
+                component.component.eventType === 'buttonClick' &&
+                component.component.buttonKey === 'submit') {
+                captchaComponent = component;
+            }
+        });
+        if (captchaComponent) {
+            captchaComponent.verify(`submitClick`);
+        }
+    }
 }
 Wizard.setBaseUrl = Formio.setBaseUrl;
 Wizard.setApiUrl = Formio.setApiUrl;

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

@@ -778,6 +778,10 @@ declare class Component extends Element {
      * @returns {void}
      */
     setElementInvalid(element: HTMLElement, invalid: boolean): void;
+    /**
+     * Clear any conditionally hidden components for this component only.
+     */
+    clearComponentOnHide(): void;
     /**
      * Clears the components data if it is conditionally hidden AND clearOnHide is set to true for this component.
      */
@@ -881,7 +885,12 @@ declare class Component extends Element {
      */
     deleteValue(): void;
     getCustomDefaultValue(defaultValue: any): any;
-    get shouldAddDefaultValue(): any;
+    /**
+     * Returns if a component has a default value set.
+     * @returns {boolean} - TRUE if a default value is set.
+     */
+    get hasDefaultValue(): boolean;
+    get shouldAddDefaultValue(): boolean;
     get defaultValue(): any;
     /**
      * Get the input value of this component.
@@ -1055,6 +1064,7 @@ declare class Component extends Element {
      * @returns {void|boolean} - TRUE if no check should be performed on the component.
      */
     checkData(data?: any, flags?: any, row?: any): void | boolean;
+    checkingData: boolean | undefined;
     checkModal(errors?: any[], dirty?: boolean): void;
     get validationValue(): any;
     isEmpty(value?: any): any;

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

@@ -6,7 +6,7 @@ import isMobile from 'ismobilejs';
 import { processOne, processOneSync, validateProcessInfo } from '@formio/core/process';
 import { Formio } from '../../../Formio';
 import * as FormioUtils from '../../../utils/utils';
-import { fastCloneDeep, boolValue, isInsideScopingComponent, currentTimezone, getScriptPlugin, getContextualRowData } from '../../../utils/utils';
+import { fastCloneDeep, boolValue, currentTimezone, getScriptPlugin, getContextualRowData } from '../../../utils/utils';
 import Element from '../../../Element';
 import ComponentModal from '../componentModal/ComponentModal';
 import Widgets from '../../../widgets';
@@ -1915,7 +1915,7 @@ export default class Component extends Element {
         if (this.visible !== visible) {
             this.visible = visible;
         }
-        this.clearOnHide();
+        this.clearComponentOnHide();
         return visible;
     }
     /**
@@ -2175,16 +2175,11 @@ export default class Component extends Element {
         element.setAttribute('aria-invalid', invalid ? 'true' : 'false');
     }
     /**
-     * Clears the components data if it is conditionally hidden AND clearOnHide is set to true for this component.
+     * Clear any conditionally hidden components for this component only.
      */
-    clearOnHide() {
+    clearComponentOnHide() {
         // clearOnHide defaults to true for old forms (without the value set) so only trigger if the value is false.
-        if (
-        // if change happens inside EditGrid's row, it doesn't trigger change on the root level, so rootPristine will be true
-        (!this.rootPristine || this.options.server || isInsideScopingComponent(this)) &&
-            this.component.clearOnHide !== false &&
-            !this.options.readOnly &&
-            !this.options.showHiddenFields) {
+        if (this.component.clearOnHide !== false && !this.options.readOnly && !this.options.showHiddenFields) {
             if (this.conditionallyHidden()) {
                 this.deleteValue();
             }
@@ -2196,6 +2191,12 @@ export default class Component extends Element {
             }
         }
     }
+    /**
+     * Clears the components data if it is conditionally hidden AND clearOnHide is set to true for this component.
+     */
+    clearOnHide() {
+        this.clearComponentOnHide();
+    }
     /**
      * Triggers a debounced onChange event for the root component (usually Webform).
      * @param {...any} args - The arguments to pass to the onChange event.
@@ -2492,12 +2493,27 @@ export default class Component extends Element {
     }
     getCustomDefaultValue(defaultValue) {
         if (this.component.customDefaultValue && !this.options.preview) {
-            defaultValue = this.evaluate(this.component.customDefaultValue, { value: '' }, 'value');
+            defaultValue = this.evaluate(this.component.customDefaultValue, { value: this.dataValue }, 'value');
         }
         return defaultValue;
     }
+    /**
+     * Returns if a component has a default value set.
+     * @returns {boolean} - TRUE if a default value is set.
+     */
+    get hasDefaultValue() {
+        return this.component.customDefaultValue || (this.component.hasOwnProperty('defaultValue') &&
+            (this.component.defaultValue !== null) &&
+            (this.component.defaultValue !== undefined));
+    }
     get shouldAddDefaultValue() {
-        return !this.options.noDefaults || (this.component.defaultValue && !this.isEmpty(this.component.defaultValue)) || this.component.customDefaultValue;
+        // It should add a default value if...
+        //  1.) Ensure they have not set "noDefaults". If that is true, then will always return false.  AND
+        //  2.) The component is pristine (user has not manually modified it).  AND
+        //  3.) There is a default value setting present and it is not NULL or UNDEFINED.
+        return !this.options.noDefaults && this.pristine && (this.hasDefaultValue ||
+            // Empty strings and booleans are allowed primitives whose defaults are automatically added.
+            (this.emptyValue === '' || (typeof this.emptyValue === 'boolean')));
     }
     get defaultValue() {
         let defaultValue = this.emptyValue;
@@ -3088,6 +3104,14 @@ export default class Component extends Element {
         data = data || this.rootValue;
         flags = flags || {};
         row = row || this.data;
+        // Some components (for legacy reasons) have calls to "checkData" in inappropriate places such
+        // as setValue. Historically, this was bypassed by a series of cached states around the data model
+        // which caused its own problems. We need to ensure that premium and custom components do not fall into 
+        // an infinite loop by only checking this component once.
+        if (this.checkingData) {
+            return;
+        }
+        this.checkingData = true;
         // Needs for Nextgen Rules Engine
         this.resetCaches();
         // Do not trigger refresh if change was triggered on blur event since components with Refresh on Blur have their own listeners
@@ -3101,6 +3125,8 @@ export default class Component extends Element {
         if (this.id !== flags.triggeredComponentId) {
             this.calculateComponentValue(data, flags, row);
         }
+        // We are done checking data.
+        this.checkingData = false;
     }
     checkModal(errors = [], dirty = false) {
         const messages = errors.filter(error => !error.fromServer);

package/lib/mjs/components/_classes/nested/NestedComponent.d.ts

@@ -181,7 +181,6 @@ export default class NestedComponent extends Field {
     checkData(data: any, flags: any, row: any, components: any): true | undefined;
     checkConditions(data: any, flags: any, row: any): boolean;
     clearOnHide(show: any): void;
-    restoreComponentsContext(): void;
     /**
      * Allow components to hook into the next page trigger to perform their own logic.
      * @param {Function} next - The callback to continue to the next page.

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

@@ -627,19 +627,8 @@ export default class NestedComponent extends Field {
     }
     clearOnHide(show) {
         super.clearOnHide(show);
-        if (this.component.clearOnHide) {
-            if (this.allowData && !this.hasValue() && !this.conditionallyHidden()) {
-                this.dataValue = this.defaultValue;
-            }
-            if (this.hasValue()) {
-                this.restoreComponentsContext();
-            }
-        }
         this.getComponents().forEach(component => component.clearOnHide(show));
     }
-    restoreComponentsContext() {
-        this.getComponents().forEach((component) => component.data = this.dataValue);
-    }
     /**
      * Allow components to hook into the next page trigger to perform their own logic.
      * @param {Function} next - The callback to continue to the next page.
@@ -827,7 +816,7 @@ export default class NestedComponent extends Field {
         else if (value && component.hasValue(value)) {
             return component.setValue(_.get(value, component.key), flags);
         }
-        else if ((!this.rootPristine || component.visible) && component.shouldAddDefaultValue) {
+        else if ((!this.rootPristine || component.visible) && (flags.resetValue || component.shouldAddDefaultValue)) {
             flags.noValidate = !flags.dirty;
             flags.resetValue = true;
             return component.setValue(component.defaultValue, flags);
@@ -837,6 +826,13 @@ export default class NestedComponent extends Field {
         if (!value) {
             return false;
         }
+        // If the value is equal to the empty value, then this means we need to reset the values.
+        if (_.isEqual(value, this.emptyValue)) {
+            // TO-DO: For a future major release, we need to investigate removing the need for the
+            // "resetValue" flag. This seems like a hack that is no longer necessary and the renderer
+            // may behave more deterministically without it.
+            flags.resetValue = true;
+        }
         return this.getComponents().reduce((changed, component) => {
             return this.setNestedValue(component, value, flags, changed) || changed;
         }, false);

package/lib/mjs/components/_classes/nesteddata/NestedDataComponent.d.ts

@@ -3,11 +3,9 @@ export default class NestedDataComponent extends NestedComponent {
     hasChanged(newValue: any, oldValue: any): boolean;
     get allowData(): boolean;
     get emptyValue(): {};
-    get shouldAddDefaultValue(): boolean;
     componentContext(): any;
     getValueAsString(value: any, options: any): string;
     getDataValueAsTable(value: any, options: any): string;
-    everyComponent(fn: any, options?: {}): void;
     /**
      * Get the value of this component.
      * @returns {any} - Return the value of this component.

package/lib/mjs/components/_classes/nesteddata/NestedDataComponent.js

@@ -90,17 +90,6 @@ export default class NestedDataComponent extends NestedComponent {
     `);
         return result;
     }
-    everyComponent(fn, options = {}) {
-        if (options?.email) {
-            if (options.fromRoot) {
-                delete options.fromRoot;
-            }
-            else {
-                return;
-            }
-        }
-        return super.everyComponent(fn, options);
-    }
     /**
      * Get the value of this component.
      * @returns {any} - Return the value of this component.

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

@@ -36,12 +36,21 @@ export default class AddressComponent extends ContainerComponent {
     get autocompleteMode(): boolean;
     get manualMode(): boolean;
     get manualModeEnabled(): boolean;
+    restoreComponentsContext(): void;
     get isMultiple(): boolean;
     set address(value: any);
     get address(): any;
     isValueInLegacyFormat(value: any): any;
     normalizeValue(value: any): any;
     get modeSwitcher(): any;
+    get providerOptions(): {
+        params: any;
+        url: any;
+        queryProperty: any;
+        responseProperty: any;
+        displayValueProperty: any;
+        autocompleteOptions: any;
+    };
     get removeValueIcon(): any;
     get searchInput(): any;
     get addRowButton(): any;

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

@@ -20,7 +20,6 @@ export default class AddressComponent extends ContainerComponent {
             key: 'address',
             switchToManualModeLabel: 'Can\'t find address? Switch to manual mode.',
             provider: '',
-            providerOptions: {},
             manualModeViewString: '',
             hideLabel: false,
             disableClearIcon: false,
@@ -113,20 +112,20 @@ export default class AddressComponent extends ContainerComponent {
             NestedComponent.prototype.addComponents.call(this, this.manualMode ? this.address : {});
         }
         Field.prototype.init.call(this);
+        let provider = this.component.provider;
+        const providerOptions = this.providerOptions;
+        const map = this.component.map;
         if (!this.builderMode) {
-            if (this.component.provider) {
-                const { provider, providerOptions, } = this.component;
+            if (provider) {
                 if (_.get(providerOptions, 'params.subscriptionKey')) {
                     _.set(providerOptions, "params['subscription-key']", _.get(providerOptions, 'params.subscriptionKey'));
                     _.unset(providerOptions, 'params.subscriptionKey');
                 }
                 this.provider = this.initializeProvider(provider, providerOptions);
             }
-            else if (this.component.map) {
+            else if (map) {
                 // Fallback to legacy version where Google Maps was the only provider.
-                this.component.provider = GoogleAddressProvider.name;
-                this.component.providerOptions = this.component.providerOptions || {};
-                const { map, provider, providerOptions, } = this.component;
+                provider = this.component.provider = GoogleAddressProvider.name;
                 const { key, region, } = map;
                 if (key) {
                     _.set(providerOptions, 'params.key', key);
@@ -258,6 +257,16 @@ export default class AddressComponent extends ContainerComponent {
             ? (this.refs[AddressComponent.modeSwitcherRef] || null)
             : null;
     }
+    get providerOptions() {
+        return {
+            params: { subscriptionKey: this.component.subscriptionKey, key: this.component.apiKey, ...this.component.params },
+            url: this.component.url,
+            queryProperty: this.component.queryProperty,
+            responseProperty: this.component.responseProperty,
+            displayValueProperty: this.component.displayValueProperty,
+            autocompleteOptions: this.component.autocompleteOptions
+        };
+    }
     get removeValueIcon() {
         return this.refs
             ? (this.refs[AddressComponent.removeValueIconRef] || null)
@@ -371,7 +380,8 @@ export default class AddressComponent extends ContainerComponent {
         const result = ((this.builderMode || this.manualMode) ? super.attach : Field.prototype.attach).call(this, element);
         if (!this.builderMode) {
             if (!this.provider && this.component.provider) {
-                const { provider, providerOptions, } = this.component;
+                const provider = this.component.provider;
+                const providerOptions = this.providerOptions;
                 this.provider = this.initializeProvider(provider, providerOptions);
             }
         }

package/lib/mjs/components/address/editForm/Address.edit.provider.js

@@ -26,7 +26,7 @@ export default [
     {
         type: 'textfield',
         input: true,
-        key: "providerOptions.params.subscriptionKey",
+        key: "subscriptionKey",
         label: 'Subscription Key',
         placeholder: 'Enter Subscription Key',
         weight: 10,
@@ -41,7 +41,7 @@ export default [
     {
         type: 'textfield',
         input: true,
-        key: 'providerOptions.url',
+        key: 'url',
         label: 'Url',
         placeholder: 'Enter Url',
         weight: 10,
@@ -56,7 +56,7 @@ export default [
     {
         type: 'textfield',
         input: true,
-        key: 'providerOptions.queryProperty',
+        key: 'queryProperty',
         label: 'Query Property',
         defaultValue: 'query',
         placeholder: 'Enter Query Property',
@@ -69,7 +69,7 @@ export default [
     {
         type: 'textfield',
         input: true,
-        key: 'providerOptions.responseProperty',
+        key: 'responseProperty',
         label: 'Response Property',
         placeholder: 'Enter Response Property',
         weight: 30,
@@ -81,7 +81,7 @@ export default [
     {
         type: 'textfield',
         input: true,
-        key: 'providerOptions.displayValueProperty',
+        key: 'displayValueProperty',
         label: 'Display Value Property',
         placeholder: 'Display Value Property',
         weight: 40,
@@ -93,7 +93,7 @@ export default [
     {
         type: 'textarea',
         input: true,
-        key: 'providerOptions.params',
+        key: 'params',
         label: 'Params',
         placeholder: '{ ... }',
         weight: 50,
@@ -108,7 +108,7 @@ export default [
     {
         type: 'textfield',
         input: true,
-        key: 'providerOptions.params.key',
+        key: 'apiKey',
         label: 'API Key',
         placeholder: 'Enter API Key',
         weight: 10,
@@ -123,7 +123,7 @@ export default [
     {
         type: 'textarea',
         input: true,
-        key: 'providerOptions.params.autocompleteOptions',
+        key: 'autocompleteOptions',
         label: 'Provider options',
         placeholder: 'Enter provider options as JSON object',
         defaultValue: {},

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

@@ -594,9 +594,6 @@ export default class DataGridComponent extends NestedArrayComponent {
         this.updateOnChange(flags, changed);
         return changed;
     }
-    restoreComponentsContext() {
-        this.rows.forEach((row, index) => _.forIn(row, (component) => component.data = this.dataValue[index]));
-    }
     toggleGroup(element, index) {
         element.classList.toggle('collapsed');
         _.each(this.refs.chunks[index], row => {

package/lib/mjs/components/editgrid/EditGrid.js

@@ -543,13 +543,6 @@ export default class EditGridComponent extends NestedArrayComponent {
             }
         });
     }
-    restoreComponentsContext() {
-        this.getComponents().forEach((component) => {
-            const rowData = this.dataValue[component.rowIndex];
-            const editRowData = this.editRows[component.rowIndex]?.data;
-            component.data = rowData || editRowData;
-        });
-    }
     flattenComponents(rowIndex) {
         const result = {};
         this.everyComponent((component) => {

package/lib/mjs/components/file/editForm/File.edit.file.d.ts

@@ -16,6 +16,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -45,6 +46,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -91,6 +93,7 @@ declare const _default: ({
     data?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -120,6 +123,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -149,6 +153,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -160,6 +165,7 @@ declare const _default: ({
     tooltip: string;
     rows: number;
     editor: string;
+    as: string;
     input: boolean;
     weight: number;
     placeholder: string;
@@ -207,6 +213,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -227,6 +234,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -247,6 +255,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -276,6 +285,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -305,6 +315,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;
@@ -332,6 +343,7 @@ declare const _default: ({
     components?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
 } | {
     type: string;
     input: boolean;
@@ -353,6 +365,7 @@ declare const _default: ({
     tableView?: undefined;
     rows?: undefined;
     editor?: undefined;
+    as?: undefined;
     optionsLabelPosition?: undefined;
     inline?: undefined;
     defaultValue?: undefined;

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

@@ -115,6 +115,7 @@ export default [
         tooltip: 'Pass your custom xhr options(optional)',
         rows: 5,
         editor: 'ace',
+        as: 'json',
         input: true,
         weight: 15,
         placeholder: `{

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

@@ -109,6 +109,10 @@ export default class FormComponent extends Component {
     get emptyValue() {
         return { data: {} };
     }
+    // In order for the subform values to set properly, we must always say that nested forms have a default value.
+    get hasDefaultValue() {
+        return true;
+    }
     get ready() {
         return this.subFormReady || Promise.resolve();
     }