@formio/js 5.1.0-dev.6147.abe2ba0 → 5.1.0-dev.6150.1c5377f

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

@@ -2375,12 +2375,14 @@ class Component extends Element_1.default {
             ckeditor: {
                 image: {
                     toolbar: [
+                        'toggleImageCaption',
                         'imageTextAlternative',
                         '|',
-                        'imageStyle:full',
-                        'imageStyle:alignLeft',
-                        'imageStyle:alignCenter',
-                        'imageStyle:alignRight'
+                        'imageStyle:inline',
+                        'imageStyle:wrapText',
+                        'imageStyle:breakText',
+                        '|',
+                        'resizeImage'
                     ],
                     styles: [
                         'full',
@@ -2402,7 +2404,10 @@ class Component extends Element_1.default {
         if (this.component.isUploadEnabled) {
             settings.extraPlugins.push((0, uploadAdapter_1.getFormioUploadAdapterPlugin)(this.fileService, this));
         }
-        return Formio_1.Formio.requireLibrary('ckeditor', isIEBrowser ? 'CKEDITOR' : 'ClassicEditor', lodash_1.default.get(this.options, 'editors.ckeditor.src', `${Formio_1.Formio.cdn.ckeditor}/ckeditor.js`), true)
+        Formio_1.Formio.requireLibrary(`ckeditor-css`, isIEBrowser ? 'CKEDITOR' : 'ClassicEditor', [
+            { type: 'styles', src: `${Formio_1.Formio.cdn.ckeditor}/ckeditor.css` }
+        ], true);
+        return Formio_1.Formio.requireLibrary('ckeditor', isIEBrowser ? 'CKEDITOR' : 'ClassicEditor', lodash_1.default.get(this.options, 'editors.ckeditor.src', `${Formio_1.Formio.cdn.ckeditor}/ckeditor.umd.js`), true)
             .then(() => {
             if (!element.parentNode) {
                 return Promise.reject();

package/lib/cjs/components/datamap/DataMap.d.ts

@@ -1,5 +1,5 @@
 export default class DataMapComponent extends DataGridComponent {
-    static savedValueTypes(schema: any): any;
+    static savedValueTypes(schema: any): string[];
     constructor(component: any, options: any, data: any);
     get schema(): any;
     get emptyValue(): {};

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

@@ -7,7 +7,7 @@ const Component_1 = __importDefault(require("../_classes/component/Component"));
 const DataGrid_1 = __importDefault(require("../datagrid/DataGrid"));
 const lodash_1 = __importDefault(require("lodash"));
 const eventemitter3_1 = __importDefault(require("eventemitter3"));
-const formUtils_1 = require("../../utils/formUtils");
+const utils_1 = require("../../utils/utils");
 class DataMapComponent extends DataGrid_1.default {
     static schema(...extend) {
         return Component_1.default.schema({
@@ -50,7 +50,7 @@ class DataMapComponent extends DataGrid_1.default {
         return lodash_1.default.omit(schema, 'components');
     }
     static savedValueTypes(schema) {
-        return (0, formUtils_1.getComponentSavedTypes)(schema) || [formUtils_1.componentValueTypes.object];
+        return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes.object];
     }
     constructor(component, options, data) {
         super(component, options, data);
@@ -149,7 +149,7 @@ class DataMapComponent extends DataGrid_1.default {
     getRowKey(rowIndex) {
         const keys = Object.keys(this.dataValue);
         if (!keys[rowIndex]) {
-            keys[rowIndex] = (0, formUtils_1.uniqueKey)(this.dataValue, this.defaultRowKey);
+            keys[rowIndex] = (0, utils_1.uniqueKey)(this.dataValue, this.defaultRowKey);
         }
         return keys[rowIndex];
     }
@@ -232,7 +232,7 @@ class DataMapComponent extends DataGrid_1.default {
         components['__key'] = this.createComponent(this.keySchema, options, { __key: this.builderMode ? this.defaultRowKey : key });
         components['__key'].on('componentChange', (event) => {
             const dataValue = this.dataValue;
-            const newKey = (0, formUtils_1.uniqueKey)(dataValue, event.value);
+            const newKey = (0, utils_1.uniqueKey)(dataValue, event.value);
             dataValue[newKey] = dataValue[key];
             delete dataValue[key];
             const comp = components[this.valueKey];

package/lib/cjs/components/day/Day.js

@@ -53,7 +53,7 @@ class DayComponent extends Field_1.default {
         return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes.string];
     }
     constructor(component, options, data) {
-        if (!options.inFormBuilder && !options.building) {
+        if (options && !options.inFormBuilder && !options.building) {
             if (component.maxDate && component.maxDate.indexOf('moment(') === -1) {
                 component.maxDate = (0, moment_1.default)(component.maxDate, 'YYYY-MM-DD').toISOString();
             }

package/lib/cjs/components/textarea/TextArea.js

@@ -193,7 +193,12 @@ class TextAreaComponent extends TextField_1.default {
                                 const editorHeight = (numRows * 31) + 14;
                                 editor.ui.view.editable.editableElement.style.height = `${(editorHeight)}px`;
                             }
-                            editor.isReadOnly = isReadOnly;
+                            if (isReadOnly) {
+                                editor.enableReadOnlyMode(this.id);
+                            }
+                            else {
+                                editor.disableReadOnlyMode(this.id);
+                            }
                             editor.data.set(value);
                         }
                         editorReady(editor);

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

@@ -1,3 +1,10 @@
+/**
+ * For backwards compatibility we a standalone interpolate function. This merely calls the
+ * global mutable Evaluator instance's interpolate function.
+ * @param  {...any} args - interpolate arguments, typically "rawTemplate", "data", and "options"
+ * @returns {any} the interpolation result.
+ */
+export function interpolate(...args: any[]): any;
 /**
  * Set the evaluator to use for evaluating expressions.
  * @param {CoreEvaluator} override - The new evaluator instance to use.
@@ -11,5 +18,4 @@ export class DefaultEvaluator extends CoreEvaluator {
     interpolate(rawTemplate: any, data: any, _options: any): any;
 }
 export let Evaluator: DefaultEvaluator;
-export function interpolate(rawTemplate: any, data: any, _options: any): any;
 import { DefaultEvaluator as CoreEvaluator } from '@formio/core';

package/lib/cjs/utils/Evaluator.js

@@ -62,7 +62,16 @@ class DefaultEvaluator extends core_1.DefaultEvaluator {
 exports.DefaultEvaluator = DefaultEvaluator;
 exports.Evaluator = new DefaultEvaluator();
 // preserve the standalone interpolate function for backwards compatibility
-exports.interpolate = exports.Evaluator.interpolate;
+/**
+ * For backwards compatibility we a standalone interpolate function. This merely calls the
+ * global mutable Evaluator instance's interpolate function.
+ * @param  {...any} args - interpolate arguments, typically "rawTemplate", "data", and "options"
+ * @returns {any} the interpolation result.
+ */
+function interpolate(...args) {
+    return exports.Evaluator.interpolate(...args);
+}
+exports.interpolate = interpolate;
 /**
  * Set the evaluator to use for evaluating expressions.
  * @param {CoreEvaluator} override - The new evaluator instance to use.

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

@@ -3,7 +3,12 @@ export * from "./formUtils";
 export default FormioUtils;
 declare const FormioUtils: {
     Evaluator: import("./Evaluator").DefaultEvaluator;
-    interpolate: (rawTemplate: any, data: any, _options: any) => any;
+    interpolate: typeof interpolate;
+    ConditionOperators: {
+        [x: string]: typeof import("./conditionOperators/IsEqualTo").default | typeof import("./conditionOperators/DateGreaterThan").default;
+    };
+    _: any;
+    moment: typeof moment;
     flattenComponents: typeof import("@formio/core/lib/utils/formUtil").flattenComponents;
     guid: typeof import("@formio/core/lib/utils/formUtil").guid;
     uniqueName: typeof import("@formio/core/lib/utils/formUtil").uniqueName;
@@ -133,8 +138,8 @@ declare const FormioUtils: {
     translateHTMLTemplate(template: string, translate: Function): string;
     sanitize(string: string, options: any): string;
     fastCloneDeep(obj: any): any;
-    isInputComponent(componentJson: import("@formio/core").Component): bool;
-    getArrayFromComponentPath(pathStr: string): Arryay<number>;
+    isInputComponent(componentJson: import("@formio/core").Component): boolean;
+    getArrayFromComponentPath(pathStr: string): string[];
     isChildOf(child: any, parent: any): boolean;
     getStringFromComponentPath(path: number[]): string;
     round(number: number, precision: number): string;
@@ -160,4 +165,6 @@ declare const FormioUtils: {
 };
 import { Evaluator } from './Evaluator';
 import { registerEvaluator } from './Evaluator';
+import { interpolate } from './Evaluator';
+import moment from 'moment';
 export { FormioUtils as Utils, Evaluator, registerEvaluator };

package/lib/cjs/utils/index.js

@@ -25,6 +25,9 @@ var __importStar = (this && this.__importStar) || function (mod) {
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.registerEvaluator = exports.Evaluator = exports.Utils = void 0;
 const utils = __importStar(require("./utils"));
@@ -32,8 +35,14 @@ const formUtils = __importStar(require("./formUtils"));
 const Evaluator_1 = require("./Evaluator");
 Object.defineProperty(exports, "Evaluator", { enumerable: true, get: function () { return Evaluator_1.Evaluator; } });
 Object.defineProperty(exports, "registerEvaluator", { enumerable: true, get: function () { return Evaluator_1.registerEvaluator; } });
+const conditionOperators_1 = __importDefault(require("./conditionOperators"));
+const lodash_1 = __importDefault(require("lodash"));
+const moment_1 = __importDefault(require("moment"));
 const FormioUtils = Object.assign(Object.assign(Object.assign({}, utils), formUtils), { Evaluator: Evaluator_1.Evaluator,
-    interpolate: Evaluator_1.interpolate });
+    interpolate: Evaluator_1.interpolate,
+    ConditionOperators: conditionOperators_1.default,
+    _: lodash_1.default,
+    moment: moment_1.default });
 exports.Utils = FormioUtils;
 if (typeof global === 'object') {
     global.FormioUtils = FormioUtils;

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

@@ -403,15 +403,15 @@ export function fastCloneDeep(obj: any): any;
 /**
  * Returns if the component is an input component.
  * @param {import('@formio/core').Component} componentJson - The JSON of a component.
- * @returns {bool} - TRUE if the component is an input component; FALSE otherwise.
+ * @returns {boolean} - TRUE if the component is an input component; FALSE otherwise.
  */
-export function isInputComponent(componentJson: import('@formio/core').Component): bool;
+export function isInputComponent(componentJson: import('@formio/core').Component): boolean;
 /**
  * Takes a component path, and returns a component path array.
  * @param {string} pathStr - The path string to convert to an array.
- * @returns {Arryay<number>} - The array of paths.
+ * @returns {Array<string>} - The array of paths.
  */
-export function getArrayFromComponentPath(pathStr: string): Arryay<number>;
+export function getArrayFromComponentPath(pathStr: string): Array<string>;
 /**
  * Returns true if the component is a child of the parent.
  * @param {any} child - The child component to check.

package/lib/cjs/utils/utils.js

@@ -1317,7 +1317,7 @@ exports.fastCloneDeep = fastCloneDeep;
 /**
  * Returns if the component is an input component.
  * @param {import('@formio/core').Component} componentJson - The JSON of a component.
- * @returns {bool} - TRUE if the component is an input component; FALSE otherwise.
+ * @returns {boolean} - TRUE if the component is an input component; FALSE otherwise.
  */
 function isInputComponent(componentJson) {
     if (componentJson.input === false || componentJson.input === true) {
@@ -1342,7 +1342,7 @@ exports.isInputComponent = isInputComponent;
 /**
  * Takes a component path, and returns a component path array.
  * @param {string} pathStr - The path string to convert to an array.
- * @returns {Arryay<number>} - The array of paths.
+ * @returns {Array<string>} - The array of paths.
  */
 function getArrayFromComponentPath(pathStr) {
     if (!pathStr || !lodash_1.default.isString(pathStr)) {

package/lib/cjs/widgets/CalendarWidget.d.ts

@@ -77,7 +77,7 @@ export default class CalendarWidget extends InputWidget {
      * @returns {void}
      */
     setValue(value: any): void;
-    getValueAsString(value: any, format: any): string;
+    getValueAsString(value: any, format?: string): string;
     setErrorClasses(hasErrors: any): void;
     isCalendarElement(element: any): any;
     initFlatpickr(Flatpickr: any): void;

package/lib/cjs/widgets/CalendarWidget.js

@@ -265,9 +265,7 @@ class CalendarWidget extends InputWidget_1.default {
         }
         // If the component is a textfield that does not have timezone information included in the string value then skip
         // the timezone offset
-        if (this.component.type === 'textfield' && !(0, utils_1.hasEncodedTimezone)(value)) {
-            this.settings.skipOffset = true;
-        }
+        this.settings.skipOffset = this.component.type === 'textfield' && !(0, utils_1.hasEncodedTimezone)(value);
         if (value) {
             if (!saveAsText && this.settings.readOnly) {
                 this.calendar.setDate((0, utils_1.dayjsDate)(value, this.valueFormat, this.timezone).format(), false);
@@ -283,7 +281,7 @@ class CalendarWidget extends InputWidget_1.default {
             this.calendar.clear(false);
         }
     }
-    getValueAsString(value, format) {
+    getValueAsString(value, format = '') {
         const inputFormat = format || this.dateFormat;
         const valueFormat = this.calendar ? this.valueFormat : this.settings.dateFormat;
         if (this.settings.saveAs === 'text' && this.componentInstance.parent && !this.settings.readOnly) {

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

@@ -2364,12 +2364,14 @@ export default class Component extends Element {
             ckeditor: {
                 image: {
                     toolbar: [
+                        'toggleImageCaption',
                         'imageTextAlternative',
                         '|',
-                        'imageStyle:full',
-                        'imageStyle:alignLeft',
-                        'imageStyle:alignCenter',
-                        'imageStyle:alignRight'
+                        'imageStyle:inline',
+                        'imageStyle:wrapText',
+                        'imageStyle:breakText',
+                        '|',
+                        'resizeImage'
                     ],
                     styles: [
                         'full',
@@ -2391,7 +2393,10 @@ export default class Component extends Element {
         if (this.component.isUploadEnabled) {
             settings.extraPlugins.push(getFormioUploadAdapterPlugin(this.fileService, this));
         }
-        return Formio.requireLibrary('ckeditor', isIEBrowser ? 'CKEDITOR' : 'ClassicEditor', _.get(this.options, 'editors.ckeditor.src', `${Formio.cdn.ckeditor}/ckeditor.js`), true)
+        Formio.requireLibrary(`ckeditor-css`, isIEBrowser ? 'CKEDITOR' : 'ClassicEditor', [
+            { type: 'styles', src: `${Formio.cdn.ckeditor}/ckeditor.css` }
+        ], true);
+        return Formio.requireLibrary('ckeditor', isIEBrowser ? 'CKEDITOR' : 'ClassicEditor', _.get(this.options, 'editors.ckeditor.src', `${Formio.cdn.ckeditor}/ckeditor.umd.js`), true)
             .then(() => {
             if (!element.parentNode) {
                 return Promise.reject();

package/lib/mjs/components/datamap/DataMap.d.ts

@@ -1,5 +1,5 @@
 export default class DataMapComponent extends DataGridComponent {
-    static savedValueTypes(schema: any): any;
+    static savedValueTypes(schema: any): string[];
     constructor(component: any, options: any, data: any);
     get schema(): any;
     get emptyValue(): {};

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

@@ -2,7 +2,7 @@ import Component from '../_classes/component/Component';
 import DataGridComponent from '../datagrid/DataGrid';
 import _ from 'lodash';
 import EventEmitter from 'eventemitter3';
-import { componentValueTypes, getComponentSavedTypes, uniqueKey } from '../../utils/formUtils';
+import { componentValueTypes, getComponentSavedTypes, uniqueKey } from '../../utils/utils';
 export default class DataMapComponent extends DataGridComponent {
     static schema(...extend) {
         return Component.schema({

package/lib/mjs/components/day/Day.js

@@ -53,7 +53,7 @@ export default class DayComponent extends Field {
     // Empty value used before 9.3.x
     static oldEmptyValue = '00/00/0000';
     constructor(component, options, data) {
-        if (!options.inFormBuilder && !options.building) {
+        if (options && !options.inFormBuilder && !options.building) {
             if (component.maxDate && component.maxDate.indexOf('moment(') === -1) {
                 component.maxDate = moment(component.maxDate, 'YYYY-MM-DD').toISOString();
             }

package/lib/mjs/components/textarea/TextArea.js

@@ -188,7 +188,12 @@ export default class TextAreaComponent extends TextFieldComponent {
                                 const editorHeight = (numRows * 31) + 14;
                                 editor.ui.view.editable.editableElement.style.height = `${(editorHeight)}px`;
                             }
-                            editor.isReadOnly = isReadOnly;
+                            if (isReadOnly) {
+                                editor.enableReadOnlyMode(this.id);
+                            }
+                            else {
+                                editor.disableReadOnlyMode(this.id);
+                            }
                             editor.data.set(value);
                         }
                         editorReady(editor);

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

@@ -1,3 +1,10 @@
+/**
+ * For backwards compatibility we a standalone interpolate function. This merely calls the
+ * global mutable Evaluator instance's interpolate function.
+ * @param  {...any} args - interpolate arguments, typically "rawTemplate", "data", and "options"
+ * @returns {any} the interpolation result.
+ */
+export function interpolate(...args: any[]): any;
 /**
  * Set the evaluator to use for evaluating expressions.
  * @param {CoreEvaluator} override - The new evaluator instance to use.
@@ -11,5 +18,4 @@ export class DefaultEvaluator extends CoreEvaluator {
     interpolate(rawTemplate: any, data: any, _options: any): any;
 }
 export let Evaluator: DefaultEvaluator;
-export function interpolate(rawTemplate: any, data: any, _options: any): any;
 import { DefaultEvaluator as CoreEvaluator } from '@formio/core';

package/lib/mjs/utils/Evaluator.js

@@ -52,7 +52,15 @@ export class DefaultEvaluator extends CoreEvaluator {
 }
 export let Evaluator = new DefaultEvaluator();
 // preserve the standalone interpolate function for backwards compatibility
-export const interpolate = Evaluator.interpolate;
+/**
+ * For backwards compatibility we a standalone interpolate function. This merely calls the
+ * global mutable Evaluator instance's interpolate function.
+ * @param  {...any} args - interpolate arguments, typically "rawTemplate", "data", and "options"
+ * @returns {any} the interpolation result.
+ */
+export function interpolate(...args) {
+    return Evaluator.interpolate(...args);
+}
 /**
  * Set the evaluator to use for evaluating expressions.
  * @param {CoreEvaluator} override - The new evaluator instance to use.

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

@@ -3,7 +3,12 @@ export * from "./formUtils";
 export default FormioUtils;
 declare const FormioUtils: {
     Evaluator: import("./Evaluator").DefaultEvaluator;
-    interpolate: (rawTemplate: any, data: any, _options: any) => any;
+    interpolate: typeof interpolate;
+    ConditionOperators: {
+        [x: string]: typeof import("./conditionOperators/IsEqualTo").default | typeof import("./conditionOperators/DateGreaterThan").default;
+    };
+    _: any;
+    moment: typeof moment;
     flattenComponents: typeof import("@formio/core/lib/utils/formUtil").flattenComponents;
     guid: typeof import("@formio/core/lib/utils/formUtil").guid;
     uniqueName: typeof import("@formio/core/lib/utils/formUtil").uniqueName;
@@ -133,8 +138,8 @@ declare const FormioUtils: {
     translateHTMLTemplate(template: string, translate: Function): string;
     sanitize(string: string, options: any): string;
     fastCloneDeep(obj: any): any;
-    isInputComponent(componentJson: import("@formio/core").Component): bool;
-    getArrayFromComponentPath(pathStr: string): Arryay<number>;
+    isInputComponent(componentJson: import("@formio/core").Component): boolean;
+    getArrayFromComponentPath(pathStr: string): string[];
     isChildOf(child: any, parent: any): boolean;
     getStringFromComponentPath(path: number[]): string;
     round(number: number, precision: number): string;
@@ -160,4 +165,6 @@ declare const FormioUtils: {
 };
 import { Evaluator } from './Evaluator';
 import { registerEvaluator } from './Evaluator';
+import { interpolate } from './Evaluator';
+import moment from 'moment';
 export { FormioUtils as Utils, Evaluator, registerEvaluator };

package/lib/mjs/utils/index.js

@@ -1,11 +1,17 @@
 import * as utils from './utils';
 import * as formUtils from './formUtils';
 import { Evaluator, registerEvaluator, interpolate } from './Evaluator';
+import ConditionOperators from './conditionOperators';
+import _ from 'lodash';
+import moment from 'moment';
 const FormioUtils = {
     ...utils,
     ...formUtils,
     Evaluator,
-    interpolate
+    interpolate,
+    ConditionOperators,
+    _,
+    moment
 };
 if (typeof global === 'object') {
     global.FormioUtils = FormioUtils;

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

@@ -403,15 +403,15 @@ export function fastCloneDeep(obj: any): any;
 /**
  * Returns if the component is an input component.
  * @param {import('@formio/core').Component} componentJson - The JSON of a component.
- * @returns {bool} - TRUE if the component is an input component; FALSE otherwise.
+ * @returns {boolean} - TRUE if the component is an input component; FALSE otherwise.
  */
-export function isInputComponent(componentJson: import('@formio/core').Component): bool;
+export function isInputComponent(componentJson: import('@formio/core').Component): boolean;
 /**
  * Takes a component path, and returns a component path array.
  * @param {string} pathStr - The path string to convert to an array.
- * @returns {Arryay<number>} - The array of paths.
+ * @returns {Array<string>} - The array of paths.
  */
-export function getArrayFromComponentPath(pathStr: string): Arryay<number>;
+export function getArrayFromComponentPath(pathStr: string): Array<string>;
 /**
  * Returns true if the component is a child of the parent.
  * @param {any} child - The child component to check.

package/lib/mjs/utils/utils.js

@@ -1257,7 +1257,7 @@ export function fastCloneDeep(obj) {
 /**
  * Returns if the component is an input component.
  * @param {import('@formio/core').Component} componentJson - The JSON of a component.
- * @returns {bool} - TRUE if the component is an input component; FALSE otherwise.
+ * @returns {boolean} - TRUE if the component is an input component; FALSE otherwise.
  */
 export function isInputComponent(componentJson) {
     if (componentJson.input === false || componentJson.input === true) {
@@ -1281,7 +1281,7 @@ export function isInputComponent(componentJson) {
 /**
  * Takes a component path, and returns a component path array.
  * @param {string} pathStr - The path string to convert to an array.
- * @returns {Arryay<number>} - The array of paths.
+ * @returns {Array<string>} - The array of paths.
  */
 export function getArrayFromComponentPath(pathStr) {
     if (!pathStr || !_.isString(pathStr)) {

package/lib/mjs/widgets/CalendarWidget.d.ts

@@ -77,7 +77,7 @@ export default class CalendarWidget extends InputWidget {
      * @returns {void}
      */
     setValue(value: any): void;
-    getValueAsString(value: any, format: any): string;
+    getValueAsString(value: any, format?: string): string;
     setErrorClasses(hasErrors: any): void;
     isCalendarElement(element: any): any;
     initFlatpickr(Flatpickr: any): void;

package/lib/mjs/widgets/CalendarWidget.js

@@ -257,9 +257,7 @@ export default class CalendarWidget extends InputWidget {
         }
         // If the component is a textfield that does not have timezone information included in the string value then skip
         // the timezone offset
-        if (this.component.type === 'textfield' && !hasEncodedTimezone(value)) {
-            this.settings.skipOffset = true;
-        }
+        this.settings.skipOffset = this.component.type === 'textfield' && !hasEncodedTimezone(value);
         if (value) {
             if (!saveAsText && this.settings.readOnly) {
                 this.calendar.setDate(dayjsDate(value, this.valueFormat, this.timezone).format(), false);
@@ -275,7 +273,7 @@ export default class CalendarWidget extends InputWidget {
             this.calendar.clear(false);
         }
     }
-    getValueAsString(value, format) {
+    getValueAsString(value, format = '') {
         const inputFormat = format || this.dateFormat;
         const valueFormat = this.calendar ? this.valueFormat : this.settings.dateFormat;
         if (this.settings.saveAs === 'text' && this.componentInstance.parent && !this.settings.readOnly) {

package/package.json

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