@formio/js 5.0.0-rc.39 → 5.0.0-rc.41

package/lib/mjs/translations/en.js

@@ -14,7 +14,7 @@ export default {
     required: '{{field}} is required',
     unique: '{{field}} must be unique',
     array: '{{field}} must be an array',
-    array_nonempty: '{{field}} must be a non-empty array',
+    array_nonempty: '{{field}} must be a non-empty array', // eslint-disable-line camelcase
     nonarray: '{{field}} must not be an array',
     select: '{{field}} contains an invalid selection',
     pattern: '{{field}} does not match the pattern {{pattern}}',
@@ -30,11 +30,11 @@ export default {
     minYear: '{{field}} should not contain year less than {{minYear}}',
     minSelectedCount: 'You must select at least {{minCount}} items',
     maxSelectedCount: 'You may only select up to {{maxCount}} items',
-    invalid_email: '{{field}} must be a valid email.',
-    invalid_url: '{{field}} must be a valid url.',
-    invalid_regex: '{{field}} does not match the pattern {{regex}}.',
-    invalid_date: '{{field}} is not a valid date.',
-    invalid_day: '{{field}} is not a valid day.',
+    invalid_email: '{{field}} must be a valid email.', // eslint-disable-line camelcase
+    invalid_url: '{{field}} must be a valid url.', // eslint-disable-line camelcase
+    invalid_regex: '{{field}} does not match the pattern {{regex}}.', // eslint-disable-line camelcase
+    invalid_date: '{{field}} is not a valid date.', // eslint-disable-line camelcase
+    invalid_day: '{{field}} is not a valid day.', // eslint-disable-line camelcase
     invalidValueProperty: 'Invalid Value Property',
     mask: '{{field}} does not match the mask.',
     valueIsNotAvailable: '{{ field }} is an invalid value.',
@@ -62,9 +62,13 @@ export default {
     saveDraftInstanceError: 'Cannot save draft because there is no formio instance.',
     saveDraftAuthError: 'Cannot save draft unless a user is authenticated.',
     restoreDraftInstanceError: 'Cannot restore draft because there is no formio instance.',
+    saveDraftError: 'Unable to save draft.',
+    restoreDraftError: 'Unable to restore draft.',
     time: 'Invalid time',
     cancelButtonAriaLabel: 'Cancel button. Click to reset the form',
     previousButtonAriaLabel: 'Previous button. Click to go back to the previous tab',
     nextButtonAriaLabel: 'Next button. Click to go to the next tab',
     submitButtonAriaLabel: 'Submit Form button. Click to submit the form',
+    reCaptchaTokenValidationError: 'ReCAPTCHA: Token validation error',
+    reCaptchaTokenNotSpecifiedError: 'ReCAPTCHA: Token is not specified in submission',
 };

package/lib/mjs/utils/Evaluator.js

@@ -3,7 +3,7 @@ import stringHash from 'string-hash';
 import { Evaluator as CoreEvaluator } from '@formio/core/utils';
 const Evaluator = {
     noeval: false,
-    protectedEval: false,
+    protectedEval: false, // This property can be customized only by plugins
     cache: {},
     templateSettings: CoreEvaluator.templateSettings,
     evaluator: CoreEvaluator.evaluator,

package/lib/mjs/utils/conditionOperators/IsEqualTo.js

@@ -9,7 +9,7 @@ export default class IsEqualTo extends ConditionOperator {
         return 'Is Equal To';
     }
     execute({ value, comparedValue, instance, conditionComponentPath }) {
-        if (value && comparedValue && typeof value !== typeof comparedValue && _.isString(comparedValue)) {
+        if ((value || value === false) && comparedValue && typeof value !== typeof comparedValue && _.isString(comparedValue)) {
             try {
                 comparedValue = JSON.parse(comparedValue);
             }
@@ -33,7 +33,7 @@ export default class IsEqualTo extends ConditionOperator {
             }
         }
         //special check for select boxes
-        if (_.isObject(value) && comparedValue && _.isString(comparedValue)) {
+        if (_.isObject(value) && comparedValue && _.isBoolean(value[comparedValue])) {
             return value[comparedValue];
         }
         return _.isEqual(value, comparedValue);

package/lib/mjs/utils/formUtils.js

@@ -257,9 +257,9 @@ export function generateFormChange(type, data) {
             change = {
                 op: 'add',
                 key: data.component.key,
-                container: data.parent.key,
-                path: data.path,
-                index: data.index,
+                container: data.parent.key, // Parent component
+                path: data.path, // Path to container within parent component.
+                index: data.index, // Index of component in parent container.
                 component: data.component
             };
             break;

package/lib/mjs/utils/utils.js

@@ -394,21 +394,6 @@ export function unescapeHTML(str) {
     const doc = new window.DOMParser().parseFromString(str, 'text/html');
     return doc.documentElement.textContent;
 }
-/**
- * Escape HTML characters like <, >, & and etc.
- * @param str
- * @returns {string}
- */
-export function escapeHTML(html) {
-    if (html) {
-        return html.replace(/&/g, '&amp;')
-            .replace(/</g, '&lt;')
-            .replace(/>/g, '&gt;')
-            .replace(/"/g, '&quot;')
-            .replace(/'/g, '&#39;');
-    }
-    return '';
-}
 /**
  * Make HTML element from string
  * @param str
@@ -1183,7 +1168,8 @@ export function sanitize(string, options) {
     }
     // Allowd URI Regex
     if (options.sanitizeConfig && options.sanitizeConfig.allowedUriRegex) {
-        sanitizeOptions.ALLOWED_URI_REGEXP = options.sanitizeConfig.allowedUriRegex;
+        const allowedUriRegex = options.sanitizeConfig.allowedUriRegex;
+        sanitizeOptions.ALLOWED_URI_REGEXP = _.isString(allowedUriRegex) ? new RegExp(allowedUriRegex) : allowedUriRegex;
     }
     // Allow to extend the existing array of elements that are safe for URI-like values
     if (options.sanitizeConfig && Array.isArray(options.sanitizeConfig.addUriSafeAttr) && options.sanitizeConfig.addUriSafeAttr.length > 0) {

package/lib/mjs/widgets/CalendarWidget.js

@@ -436,7 +436,7 @@ export default class CalendarWidget extends InputWidget {
         return (date, format) => {
             // Only format this if this is the altFormat and the form is readOnly.
             if (this.settings.readOnly && (format === this.settings.altFormat)) {
-                if (this.loadZones()) {
+                if (!this.settings.enableTime || this.loadZones()) {
                     return Flatpickr.formatDate(date, format);
                 }
                 const currentValue = new Date(this.getValue());

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@formio/js",
-  "version": "5.0.0-rc.39",
+  "version": "5.0.0-rc.41",
   "description": "JavaScript powered Forms with JSON Form Builder",
   "main": "lib/cjs/index.js",
   "exports": {
@@ -84,21 +84,21 @@
   },
   "homepage": "https://github.com/formio/formio.js#readme",
   "dependencies": {
-    "@formio/bootstrap": "^3.0.0-rc.20",
-    "@formio/choices.js": "^10.2.0",
-    "@formio/core": "^2.0.0-rc.6",
+    "@formio/bootstrap": "^3.0.0-rc.21",
+    "@formio/choices.js": "^10.2.1",
+    "@formio/core": "^2.0.0-rc.18",
     "@formio/text-mask-addons": "^3.8.0-formio.2",
     "@formio/vanilla-text-mask": "^5.1.1-formio.1",
     "abortcontroller-polyfill": "^1.7.5",
     "autocompleter": "^8.0.4",
-    "bootstrap": "^5.3.0",
+    "bootstrap": "^5.3.3",
     "browser-cookies": "^1.2.0",
     "browser-md5-file": "^1.1.1",
     "compare-versions": "^6.0.0-rc.2",
-    "core-js": "^3.32.1",
+    "core-js": "^3.36.0",
     "dialog-polyfill": "^0.5.6",
     "dom-autoscroller": "^2.3.4",
-    "dompurify": "^3.0.5",
+    "dompurify": "^3.0.9",
     "downloadjs": "^1.4.7",
     "dragula": "^3.7.3",
     "eventemitter3": "^5.0.1",
@@ -106,27 +106,28 @@
     "fast-json-patch": "^3.1.1",
     "fetch-ponyfill": "^7.1.0",
     "idb": "^7.1.1",
+    "inputmask": "^5.0.8",
     "ismobilejs": "^1.1.1",
     "json-logic-js": "^2.0.2",
     "jstimezonedetect": "^1.0.7",
     "jwt-decode": "^3.1.2",
     "lodash": "^4.17.21",
     "moment": "^2.29.4",
-    "moment-timezone": "^0.5.43",
+    "moment-timezone": "^0.5.44",
     "quill": "^2.0.0-dev.3",
-    "signature_pad": "^4.1.4",
+    "signature_pad": "^4.2.0",
     "string-hash": "^1.1.3",
     "tippy.js": "^6.3.7",
     "uuid": "^9.0.0",
     "vanilla-picker": "^2.12.2"
   },
   "devDependencies": {
-    "@typescript-eslint/eslint-plugin": "^5.60.1",
-    "@typescript-eslint/parser": "^5.60.1",
-    "ace-builds": "1.23.4",
+    "@typescript-eslint/eslint-plugin": "^7.3.0",
+    "@typescript-eslint/parser": "^7.3.0",
+    "ace-builds": "1.32.7",
     "async-limiter": "^2.0.0",
     "bootstrap-icons": "^1.10.5",
-    "bootswatch": "^5.3.0",
+    "bootswatch": "^5.3.3",
     "browser-env": "^3.3.0",
     "chai": "^4.3.7",
     "chance": "^1.1.9",
@@ -135,7 +136,7 @@
     "esdoc": "^1.1.0",
     "esdoc-ecmascript-proposal-plugin": "^1.0.0",
     "esdoc-standard-plugin": "^1.0.0",
-    "eslint": "^8.43.0",
+    "eslint": "^8.57.0",
     "eslint-config-formio": "^1.1.4",
     "fetch-mock": "^9.11.0",
     "file-loader": "^6.2.0",
@@ -153,15 +154,15 @@
     "gulp-sync": "^0.1.4",
     "gulp-watch": "^5.0.1",
     "hoek": "^6.1.3",
-    "jsdom": "^22.1.0",
+    "jsdom": "^24.0.0",
     "jsdom-global": "^3.0.2",
-    "karma": "^6.4.2",
+    "karma": "^6.4.3",
     "karma-chrome-launcher": "^3.2.0",
     "karma-mocha": "^2.0.1",
     "karma-mocha-reporter": "^2.2.5",
     "karma-phantomjs-launcher": "^1.0.4",
-    "karma-webpack": "^5.0.0",
-    "mocha": "^10.2.0",
+    "karma-webpack": "^5.0.1",
+    "mocha": "^10.3.0",
     "mock-local-storage": "^1.1.24",
     "natives": "^1.1.6",
     "power-assert": "^1.6.1",
@@ -169,14 +170,14 @@
     "pretty": "^2.0.0",
     "pygments-css": "^1.0.0",
     "raw-loader": "^4.0.2",
-    "sass": "^1.63.6",
+    "sass": "^1.72.0",
     "shortcut-buttons-flatpickr": "^0.4.0",
-    "sinon": "^15.2.0",
+    "sinon": "^17.0.1",
     "string-replace-loader": "^3.1.0",
     "ts-loader": "^9.4.4",
     "ts-node": "^10.9.1",
-    "typescript": "~5.0.4",
-    "webpack": "^5.88.1",
+    "typescript": "5.3.3",
+    "webpack": "^5.90.3",
     "webpack-bundle-analyzer": "^4.9.0",
     "webpack-cli": "^5.1.1",
     "webpack-node-externals": "^3.0.0",

package/lib/cjs/components/html/fixtures/comp3.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    type: 'form',
-    display: 'form',
-    components: [
-        {
-            label: 'HTML',
-            attrs: [
-                {
-                    attr: '',
-                    value: '',
-                },
-            ],
-            content: '<img src=1 onerror=alert("htmlContent")>',
-            refreshOnChange: false,
-            key: 'html',
-            type: 'htmlelement',
-            input: false,
-            tableView: false,
-        },
-        {
-            type: 'button',
-            label: 'Submit',
-            key: 'submit',
-            disableOnInvalid: true,
-            input: true,
-            tableView: false,
-        },
-    ],
-};

package/lib/cjs/components/resource/Resource.form.js

@@ -1,16 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const Components_1 = __importDefault(require("../Components"));
-const Resource_edit_display_1 = __importDefault(require("./editForm/Resource.edit.display"));
-function default_1(...extend) {
-    return Components_1.default.baseEditForm([
-        {
-            key: 'display',
-            components: Resource_edit_display_1.default
-        },
-    ], ...extend);
-}
-exports.default = default_1;

package/lib/cjs/components/resource/Resource.js

@@ -1,39 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const Select_1 = __importDefault(require("../select/Select"));
-class ResourceComponent extends Select_1.default {
-    static schema(...extend) {
-        return Select_1.default.schema({
-            type: 'resource',
-            label: 'Resource',
-            key: 'resource',
-            dataSrc: 'resource',
-            resource: '',
-            project: '',
-            template: '<span>{{ item.data }}</span>',
-        }, ...extend);
-    }
-    static get builderInfo() {
-        return {
-            title: 'Resource',
-            icon: 'files-o',
-            weight: 90,
-            documentation: '/userguide/form-building/form-components#resource',
-            schema: ResourceComponent.schema(),
-        };
-    }
-    init() {
-        super.init();
-        this.component.dataSrc = 'resource';
-        this.component.data = {
-            resource: this.component.resource,
-        };
-    }
-    get defaultSchema() {
-        return ResourceComponent.schema();
-    }
-}
-exports.default = ResourceComponent;

package/lib/cjs/components/resource/editForm/Resource.edit.display.js

@@ -1,102 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = [
-    {
-        key: 'resourceInfo',
-        weight: -10,
-        type: 'htmlelement',
-        tag: 'div',
-        className: 'alert alert-danger',
-        content: 'This component has been deprecated and will be removed in a future version of Formio.js.',
-    },
-    {
-        type: 'select',
-        input: true,
-        dataSrc: 'url',
-        data: {
-            url: '/form?type=resource&limit=1000000&select=_id,title',
-        },
-        authenticate: true,
-        template: '<span>{{ item.title }}</span>',
-        valueProperty: '_id',
-        label: 'Resource',
-        key: 'resource',
-        weight: 50,
-        tooltip: 'The resource to be used with this field.',
-    },
-    {
-        type: 'tags',
-        input: true,
-        key: 'selectFields',
-        label: 'Select Fields',
-        tooltip: 'The properties on the resource to return as part of the options. If left blank, all properties will be returned.',
-        placeholder: 'Enter the fields to select.',
-        weight: 51,
-    },
-    {
-        type: 'tags',
-        input: true,
-        key: 'searchFields',
-        label: 'Search Fields',
-        tooltip: 'A list of search filters based on the fields of the resource. See the <a target=\'_blank\' href=\'https://github.com/travist/resourcejs#filtering-the-results\'>Resource.js documentation</a> for the format of these filters.',
-        placeholder: 'The fields to query on the server',
-        weight: 52,
-    },
-    {
-        type: 'textfield',
-        input: true,
-        key: 'filter',
-        label: 'Filter Query',
-        weight: 53,
-        description: 'The filter query for results.',
-        tooltip: 'Use this to provide additional filtering using query parameters.',
-    },
-    {
-        type: 'textfield',
-        input: true,
-        key: 'sort',
-        label: 'Sort Query',
-        weight: 53,
-        description: 'The sort query for results',
-        tooltip: 'Use this to provide additional sorting using query parameters',
-    },
-    {
-        type: 'textarea',
-        input: true,
-        key: 'template',
-        label: 'Item Template',
-        editor: 'ace',
-        as: 'html',
-        rows: 3,
-        weight: 53,
-        tooltip: 'The HTML template for the result data items.',
-    },
-    {
-        type: 'checkbox',
-        input: true,
-        weight: 54,
-        key: 'addResource',
-        label: 'Add Resource',
-        tooltip: 'Allows to create a new resource while entering a submission.',
-        conditional: {
-            json: { '===': [{ var: 'data.dataSrc' }, 'resource'] },
-        },
-    },
-    {
-        type: 'textfield',
-        label: 'Add Resource Label',
-        key: 'addResourceLabel',
-        tooltip: 'Set the text of the Add Resource button.',
-        placeholder: 'Add Resource',
-        weight: 55,
-        input: true,
-        conditional: {
-            json: {
-                and: [
-                    { '===': [{ var: 'data.dataSrc' }, 'resource'] },
-                    { '!!': { var: 'data.addResource' } },
-                ],
-            },
-        },
-    },
-];

package/lib/cjs/components/resource/fixtures/comp1.js

@@ -1,30 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    'conditional': {
-        'eq': '',
-        'when': null,
-        'show': ''
-    },
-    'tags': [],
-    'type': 'resource',
-    'defaultPermission': '',
-    'validate': {
-        'required': false
-    },
-    'clearOnHide': true,
-    'persistent': true,
-    'protected': false,
-    'multiple': false,
-    'searchFields': '',
-    'selectFields': '',
-    'template': '<span>{{ item.data }}</span>',
-    'defaultValue': '',
-    'project': '58c21742e4d02b009660a6ee',
-    'resource': '58c21742e4d02b009660a6f2',
-    'placeholder': 'Select the user',
-    'key': 'user',
-    'label': 'User',
-    'tableView': true,
-    'input': true
-};

package/lib/cjs/components/resource/fixtures/comp2.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    title: 'FIO-3744',
-    name: 'fio3744',
-    path: 'fio3744',
-    type: 'form',
-    display: 'form',
-    components: [
-        {
-            label: 'Resource',
-            resource: '61377a53c202989e4ed9ff21',
-            template: '<span>{{ item.data.textField }}</span>',
-            tableView: true,
-            unique: true,
-            key: 'resource',
-            type: 'resource',
-            input: true,
-            data: { resource: '61377a53c202989e4ed9ff21' },
-            addResource: false,
-        },
-        {
-            type: 'button',
-            label: 'Submit',
-            key: 'submit',
-            disableOnInvalid: true,
-            input: true,
-            tableView: false,
-        },
-    ],
-};

package/lib/cjs/components/resource/fixtures/index.js

@@ -1,10 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.comp2 = exports.comp1 = void 0;
-const comp1_1 = __importDefault(require("./comp1"));
-exports.comp1 = comp1_1.default;
-const comp2_1 = __importDefault(require("./comp2"));
-exports.comp2 = comp2_1.default;

package/lib/mjs/components/html/fixtures/comp3.js

@@ -1,29 +0,0 @@
-export default {
-    type: 'form',
-    display: 'form',
-    components: [
-        {
-            label: 'HTML',
-            attrs: [
-                {
-                    attr: '',
-                    value: '',
-                },
-            ],
-            content: '<img src=1 onerror=alert("htmlContent")>',
-            refreshOnChange: false,
-            key: 'html',
-            type: 'htmlelement',
-            input: false,
-            tableView: false,
-        },
-        {
-            type: 'button',
-            label: 'Submit',
-            key: 'submit',
-            disableOnInvalid: true,
-            input: true,
-            tableView: false,
-        },
-    ],
-};

package/lib/mjs/components/resource/Resource.form.js

@@ -1,10 +0,0 @@
-import Components from '../Components';
-import ResourceEditDisplay from './editForm/Resource.edit.display';
-export default function (...extend) {
-    return Components.baseEditForm([
-        {
-            key: 'display',
-            components: ResourceEditDisplay
-        },
-    ], ...extend);
-}

package/lib/mjs/components/resource/Resource.js

@@ -1,33 +0,0 @@
-import SelectComponent from '../select/Select';
-export default class ResourceComponent extends SelectComponent {
-    static schema(...extend) {
-        return SelectComponent.schema({
-            type: 'resource',
-            label: 'Resource',
-            key: 'resource',
-            dataSrc: 'resource',
-            resource: '',
-            project: '',
-            template: '<span>{{ item.data }}</span>',
-        }, ...extend);
-    }
-    static get builderInfo() {
-        return {
-            title: 'Resource',
-            icon: 'files-o',
-            weight: 90,
-            documentation: '/userguide/form-building/form-components#resource',
-            schema: ResourceComponent.schema(),
-        };
-    }
-    init() {
-        super.init();
-        this.component.dataSrc = 'resource';
-        this.component.data = {
-            resource: this.component.resource,
-        };
-    }
-    get defaultSchema() {
-        return ResourceComponent.schema();
-    }
-}