@formio/js 5.1.0-dev.6007.fade2e3 → 5.1.0-dev.6010.98e774d

package/lib/cjs/Webform.js

@@ -1539,11 +1539,11 @@ class Webform extends NestedDataComponent_1.default {
             return;
         }
         const captchaComponent = [];
-        this.eachComponent((component) => {
+        (0, formUtils_1.eachComponent)(this.components, (component) => {
             if (/^(re)?captcha$/.test(component.type) && component.component.eventType === 'formLoad') {
                 captchaComponent.push(component);
             }
-        });
+        }, true);
         if (captchaComponent.length > 0) {
             if (this.parent) {
                 this.parent.subFormReady.then(() => {

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

@@ -1951,15 +1951,21 @@ class Component extends Element_1.default {
         }
         // Check advanced conditions (and cache the result)
         const isConditionallyHidden = this.checkConditionallyHidden(data, row) || this._parentConditionallyHidden;
+        let shouldClear = false;
         if (isConditionallyHidden !== this._conditionallyHidden) {
             this._conditionallyHidden = isConditionallyHidden;
-            this.clearOnHide();
+            shouldClear = true;
         }
         // Check visibility
         const visible = (this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden);
         if (this.visible !== visible) {
             this.visible = visible;
         }
+        // Wait for visibility to update for nested components, so the component state is up-to-date when
+        // calling clearOnHide
+        if (shouldClear) {
+            this.clearOnHide();
+        }
         return visible;
     }
     /**

package/lib/cjs/components/datetime/DateTime.d.ts

@@ -20,6 +20,6 @@ export default class DateTimeComponent extends Input {
     get momentFormat(): string;
     createWrapper(): boolean;
     checkValidity(data: any, dirty: any, rowData: any): boolean;
-    getValueAsString(value: any): any;
+    getValueAsString(value: any, options: any): any;
 }
 import Input from '../_classes/input/Input';

package/lib/cjs/components/datetime/DateTime.js

@@ -104,8 +104,8 @@ class DateTimeComponent extends Input_1.default {
         /* eslint-disable camelcase */
         this.component.widget = Object.assign({ type: 'calendar', timezone, displayInTimezone: lodash_1.default.get(this.component, 'displayInTimezone', 'viewer'), locale: this.options.language, useLocaleSettings: lodash_1.default.get(this.component, 'useLocaleSettings', false), allowInput: lodash_1.default.get(this.component, 'allowInput', true), mode: 'single', enableTime: lodash_1.default.get(this.component, 'enableTime', true), noCalendar: !lodash_1.default.get(this.component, 'enableDate', true), format: this.component.format, hourIncrement: lodash_1.default.get(this.component, 'timePicker.hourStep', 1), minuteIncrement: lodash_1.default.get(this.component, 'timePicker.minuteStep', 5), time_24hr: time24hr, readOnly: this.options.readOnly, minDate: lodash_1.default.get(this.component, 'datePicker.minDate'), disabledDates: lodash_1.default.get(this.component, 'datePicker.disable'), disableWeekends: lodash_1.default.get(this.component, 'datePicker.disableWeekends'), disableWeekdays: lodash_1.default.get(this.component, 'datePicker.disableWeekdays'), disableFunction: lodash_1.default.get(this.component, 'datePicker.disableFunction'), maxDate: lodash_1.default.get(this.component, 'datePicker.maxDate') }, customOptions);
         // update originalComponent to include widget and other updated settings
-        // it is done here since these settings depend on properties present after the component is initialized 
-        // originalComponent is used to restore the component (and widget) after evaluating field logic 
+        // it is done here since these settings depend on properties present after the component is initialized
+        // originalComponent is used to restore the component (and widget) after evaluating field logic
         this.originalComponent = (0, utils_2.fastCloneDeep)(this.component);
         /* eslint-enable camelcase */
     }
@@ -153,15 +153,15 @@ class DateTimeComponent extends Input_1.default {
         }
         return super.checkValidity(data, dirty, rowData);
     }
-    getValueAsString(value) {
+    getValueAsString(value, options) {
         let format = utils_1.default.convertFormatToMoment(this.component.format);
         format += format.match(/z$/) ? '' : ' z';
         const timezone = this.timezone;
         if (value && !this.attached && timezone) {
             if (Array.isArray(value) && this.component.multiple) {
-                return value.map(item => lodash_1.default.trim(utils_1.default.momentDate(item, format, timezone).format(format))).join(', ');
+                return value.map(item => lodash_1.default.trim(utils_1.default.momentDate(item, format, timezone, options).format(format))).join(', ');
             }
-            return lodash_1.default.trim(utils_1.default.momentDate(value, format, timezone).format(format));
+            return lodash_1.default.trim(utils_1.default.momentDate(value, format, timezone, options).format(format));
         }
         if (Array.isArray(value) && this.component.multiple) {
             return value.map(item => lodash_1.default.trim((0, moment_1.default)(item).format(format))).join(', ');

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

@@ -115,7 +115,7 @@ function s3(formio) {
                 const { changeMessage } = multipart;
                 changeMessage('Completing AWS S3 multipart upload...');
                 const token = formio.getToken();
-                const response = yield fetch(`${formio.formUrl}/storage/s3/multipart/complete`, {
+                const response = yield xhr_1.default.fetch(`${formio.formUrl}/storage/s3/multipart/complete`, {
                     method: 'POST',
                     headers: Object.assign({ 'Content-Type': 'application/json' }, (token ? { 'x-jwt-token': token } : {})),
                     body: JSON.stringify({ parts, uploadId: serverResponse.uploadId, key: serverResponse.key })
@@ -134,7 +134,7 @@ function s3(formio) {
         abortMultipartUpload(serverResponse) {
             const { uploadId, key } = serverResponse;
             const token = formio.getToken();
-            fetch(`${formio.formUrl}/storage/s3/multipart/abort`, {
+            xhr_1.default.fetch(`${formio.formUrl}/storage/s3/multipart/abort`, {
                 method: 'POST',
                 headers: Object.assign({ 'Content-Type': 'application/json' }, (token ? { 'x-jwt-token': token } : {})),
                 body: JSON.stringify({ uploadId, key })
@@ -148,7 +148,7 @@ function s3(formio) {
                 const start = i * partSize;
                 const end = (i + 1) * partSize;
                 const blob = i < urls.length ? file.slice(start, end) : file.slice(start);
-                const promise = fetch(urls[i], {
+                const promise = xhr_1.default.fetch(urls[i], {
                     method: 'PUT',
                     headers,
                     body: blob,

package/lib/cjs/providers/storage/xhr.d.ts

@@ -3,6 +3,7 @@ export default XHR;
 declare namespace XHR {
     function trim(text: any): any;
     function path(items: any): any;
+    function fetch(url: any, options: any): Promise<Response>;
     function upload(formio: any, type: any, xhrCallback: any, file: any, fileName: any, dir: any, progressCallback: any, groupPermissions: any, groupId: any, abortCallback: any, multipartOptions: any): Promise<any>;
     function makeXhrRequest(formio: any, xhrCallback: any, serverResponse: any, progressCallback: any, abortCallback: any): Promise<any>;
 }

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

@@ -14,6 +14,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.setXhrHeaders = void 0;
 const trim_1 = __importDefault(require("lodash/trim"));
+const Formio_1 = require("../../Formio");
 const setXhrHeaders = (formio, xhr) => {
     const { headers } = formio.options;
     if (headers) {
@@ -36,13 +37,17 @@ const XHR = {
     path(items) {
         return items.filter(item => !!item).map(XHR.trim).join('/');
     },
+    fetch(url, options) {
+        options = Formio_1.Formio.pluginAlter('requestOptions', options, url);
+        return fetch(url, options);
+    },
     upload(formio, type, xhrCallback, file, fileName, dir, progressCallback, groupPermissions, groupId, abortCallback, multipartOptions) {
         return __awaiter(this, void 0, void 0, function* () {
             // make request to Form.io server
             const token = formio.getToken();
             let response;
             try {
-                response = yield fetch(`${formio.formUrl}/storage/${type}`, {
+                response = yield XHR.fetch(`${formio.formUrl}/storage/${type}`, {
                     method: 'POST',
                     headers: Object.assign({ 'Accept': 'application/json', 'Content-Type': 'application/json; charset=UTF-8' }, (token ? { 'x-jwt-token': token } : {})),
                     body: JSON.stringify({

package/lib/cjs/utils/utils.d.ts

@@ -208,9 +208,10 @@ export function loadZones(url: string, timezone: string): Promise<any> | any;
  * @param {string|Date} value - The value to convert into a moment date.
  * @param {string} format - The format to convert the date to.
  * @param {string} timezone - The timezone to convert the date to.
+ * @param {object} options - The options object
  * @returns {Date} - The moment date object.
  */
-export function momentDate(value: string | Date, format: string, timezone: string): Date;
+export function momentDate(value: string | Date, format: string, timezone: string, options: object): Date;
 /**
  * Format a date provided a value, format, and timezone object.
  * @param {string} timezonesUrl - The URL to load the timezone data from.

package/lib/cjs/utils/utils.js

@@ -687,9 +687,10 @@ exports.loadZones = loadZones;
  * @param {string|Date} value - The value to convert into a moment date.
  * @param {string} format - The format to convert the date to.
  * @param {string} timezone - The timezone to convert the date to.
+ * @param {object} options - The options object
  * @returns {Date} - The moment date object.
  */
-function momentDate(value, format, timezone) {
+function momentDate(value, format, timezone, options) {
     const momentDate = (0, moment_timezone_1.default)(value);
     if (!timezone) {
         return momentDate;
@@ -697,7 +698,7 @@ function momentDate(value, format, timezone) {
     if (timezone === 'UTC') {
         timezone = 'Etc/UTC';
     }
-    if ((timezone !== currentTimezone() || (format && format.match(/\s(z$|z\s)/))) && moment_timezone_1.default.zonesLoaded) {
+    if ((timezone !== currentTimezone() || (format && format.match(/\s(z$|z\s)/))) && (moment_timezone_1.default.zonesLoaded || (options === null || options === void 0 ? void 0 : options.email))) {
         return momentDate.tz(timezone);
     }
     return momentDate;

package/lib/mjs/Webform.js

@@ -1539,11 +1539,11 @@ export default class Webform extends NestedDataComponent {
             return;
         }
         const captchaComponent = [];
-        this.eachComponent((component) => {
+        eachComponent(this.components, (component) => {
             if (/^(re)?captcha$/.test(component.type) && component.component.eventType === 'formLoad') {
                 captchaComponent.push(component);
             }
-        });
+        }, true);
         if (captchaComponent.length > 0) {
             if (this.parent) {
                 this.parent.subFormReady.then(() => {

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

@@ -1917,15 +1917,21 @@ export default class Component extends Element {
         }
         // Check advanced conditions (and cache the result)
         const isConditionallyHidden = this.checkConditionallyHidden(data, row) || this._parentConditionallyHidden;
+        let shouldClear = false;
         if (isConditionallyHidden !== this._conditionallyHidden) {
             this._conditionallyHidden = isConditionallyHidden;
-            this.clearOnHide();
+            shouldClear = true;
         }
         // Check visibility
         const visible = (this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden);
         if (this.visible !== visible) {
             this.visible = visible;
         }
+        // Wait for visibility to update for nested components, so the component state is up-to-date when
+        // calling clearOnHide
+        if (shouldClear) {
+            this.clearOnHide();
+        }
         return visible;
     }
     /**

package/lib/mjs/components/datetime/DateTime.d.ts

@@ -20,6 +20,6 @@ export default class DateTimeComponent extends Input {
     get momentFormat(): string;
     createWrapper(): boolean;
     checkValidity(data: any, dirty: any, rowData: any): boolean;
-    getValueAsString(value: any): any;
+    getValueAsString(value: any, options: any): any;
 }
 import Input from '../_classes/input/Input';

package/lib/mjs/components/datetime/DateTime.js

@@ -128,8 +128,8 @@ export default class DateTimeComponent extends Input {
             ...customOptions,
         };
         // update originalComponent to include widget and other updated settings
-        // it is done here since these settings depend on properties present after the component is initialized 
-        // originalComponent is used to restore the component (and widget) after evaluating field logic 
+        // it is done here since these settings depend on properties present after the component is initialized
+        // originalComponent is used to restore the component (and widget) after evaluating field logic
         this.originalComponent = fastCloneDeep(this.component);
         /* eslint-enable camelcase */
     }
@@ -177,15 +177,15 @@ export default class DateTimeComponent extends Input {
         }
         return super.checkValidity(data, dirty, rowData);
     }
-    getValueAsString(value) {
+    getValueAsString(value, options) {
         let format = FormioUtils.convertFormatToMoment(this.component.format);
         format += format.match(/z$/) ? '' : ' z';
         const timezone = this.timezone;
         if (value && !this.attached && timezone) {
             if (Array.isArray(value) && this.component.multiple) {
-                return value.map(item => _.trim(FormioUtils.momentDate(item, format, timezone).format(format))).join(', ');
+                return value.map(item => _.trim(FormioUtils.momentDate(item, format, timezone, options).format(format))).join(', ');
             }
-            return _.trim(FormioUtils.momentDate(value, format, timezone).format(format));
+            return _.trim(FormioUtils.momentDate(value, format, timezone, options).format(format));
         }
         if (Array.isArray(value) && this.component.multiple) {
             return value.map(item => _.trim(moment(item).format(format))).join(', ');

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

@@ -75,7 +75,7 @@ function s3(formio) {
             const { changeMessage } = multipart;
             changeMessage('Completing AWS S3 multipart upload...');
             const token = formio.getToken();
-            const response = await fetch(`${formio.formUrl}/storage/s3/multipart/complete`, {
+            const response = await XHR.fetch(`${formio.formUrl}/storage/s3/multipart/complete`, {
                 method: 'POST',
                 headers: {
                     'Content-Type': 'application/json',
@@ -96,7 +96,7 @@ function s3(formio) {
         abortMultipartUpload(serverResponse) {
             const { uploadId, key } = serverResponse;
             const token = formio.getToken();
-            fetch(`${formio.formUrl}/storage/s3/multipart/abort`, {
+            XHR.fetch(`${formio.formUrl}/storage/s3/multipart/abort`, {
                 method: 'POST',
                 headers: {
                     'Content-Type': 'application/json',
@@ -113,7 +113,7 @@ function s3(formio) {
                 const start = i * partSize;
                 const end = (i + 1) * partSize;
                 const blob = i < urls.length ? file.slice(start, end) : file.slice(start);
-                const promise = fetch(urls[i], {
+                const promise = XHR.fetch(urls[i], {
                     method: 'PUT',
                     headers,
                     body: blob,

package/lib/mjs/providers/storage/xhr.d.ts

@@ -3,6 +3,7 @@ export default XHR;
 declare namespace XHR {
     function trim(text: any): any;
     function path(items: any): any;
+    function fetch(url: any, options: any): Promise<Response>;
     function upload(formio: any, type: any, xhrCallback: any, file: any, fileName: any, dir: any, progressCallback: any, groupPermissions: any, groupId: any, abortCallback: any, multipartOptions: any): Promise<any>;
     function makeXhrRequest(formio: any, xhrCallback: any, serverResponse: any, progressCallback: any, abortCallback: any): Promise<any>;
 }

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

@@ -1,4 +1,5 @@
 import _trim from 'lodash/trim';
+import { Formio } from '../../Formio';
 export const setXhrHeaders = (formio, xhr) => {
     const { headers } = formio.options;
     if (headers) {
@@ -20,12 +21,16 @@ const XHR = {
     path(items) {
         return items.filter(item => !!item).map(XHR.trim).join('/');
     },
+    fetch(url, options) {
+        options = Formio.pluginAlter('requestOptions', options, url);
+        return fetch(url, options);
+    },
     async upload(formio, type, xhrCallback, file, fileName, dir, progressCallback, groupPermissions, groupId, abortCallback, multipartOptions) {
         // make request to Form.io server
         const token = formio.getToken();
         let response;
         try {
-            response = await fetch(`${formio.formUrl}/storage/${type}`, {
+            response = await XHR.fetch(`${formio.formUrl}/storage/${type}`, {
                 method: 'POST',
                 headers: {
                     'Accept': 'application/json',

package/lib/mjs/utils/utils.d.ts

@@ -208,9 +208,10 @@ export function loadZones(url: string, timezone: string): Promise<any> | any;
  * @param {string|Date} value - The value to convert into a moment date.
  * @param {string} format - The format to convert the date to.
  * @param {string} timezone - The timezone to convert the date to.
+ * @param {object} options - The options object
  * @returns {Date} - The moment date object.
  */
-export function momentDate(value: string | Date, format: string, timezone: string): Date;
+export function momentDate(value: string | Date, format: string, timezone: string, options: object): Date;
 /**
  * Format a date provided a value, format, and timezone object.
  * @param {string} timezonesUrl - The URL to load the timezone data from.

package/lib/mjs/utils/utils.js

@@ -632,9 +632,10 @@ export function loadZones(url, timezone) {
  * @param {string|Date} value - The value to convert into a moment date.
  * @param {string} format - The format to convert the date to.
  * @param {string} timezone - The timezone to convert the date to.
+ * @param {object} options - The options object
  * @returns {Date} - The moment date object.
  */
-export function momentDate(value, format, timezone) {
+export function momentDate(value, format, timezone, options) {
     const momentDate = moment(value);
     if (!timezone) {
         return momentDate;
@@ -642,7 +643,7 @@ export function momentDate(value, format, timezone) {
     if (timezone === 'UTC') {
         timezone = 'Etc/UTC';
     }
-    if ((timezone !== currentTimezone() || (format && format.match(/\s(z$|z\s)/))) && moment.zonesLoaded) {
+    if ((timezone !== currentTimezone() || (format && format.match(/\s(z$|z\s)/))) && (moment.zonesLoaded || options?.email)) {
         return momentDate.tz(timezone);
     }
     return momentDate;

package/package.json

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