@formio/js 5.0.0-rc.19 → 5.0.0-rc.21

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

@@ -1,4 +1,229 @@
 declare namespace _default {
-    const bootstrap: any;
+    const bootstrap: {
+        webform: {
+            form: string;
+            builder: string;
+        };
+        well: {
+            form: string;
+        };
+        wizard: {
+            form: string;
+            builder: string;
+        };
+        wizardHeader: {
+            form: string;
+        };
+        wizardHeaderClassic: {
+            form: string;
+        };
+        wizardHeaderVertical: {
+            form: string;
+        };
+        wizardNav: {
+            form: string;
+        };
+        errorsList: {
+            form: string;
+        };
+        alert: {
+            form: string;
+        };
+        treeView: {
+            form: string;
+        };
+        treeEdit: {
+            form: string;
+        };
+        transform(type: any, text: any, instance: any): any;
+        defaultIconset: string;
+        iconClass: (iconset: any, name: any, spinning: any) => string;
+        cssClasses: {
+            'border-default': string;
+            'formio-tab-panel-active': string;
+            'formio-tab-link-active': string;
+            'formio-tab-link-container-active': string;
+            'formio-form-error': string;
+            'formio-form-alert': string;
+            'formio-label-error': string;
+            'formio-input-error': string;
+            'formio-alert-danger': string;
+            'formio-alert-success': string;
+            'formio-alert-warning': string;
+            'formio-modal-cancel-button': string;
+            'formio-modal-confirm-button': string;
+            'form-group': string;
+        };
+        address: {
+            form: string;
+            html: string;
+        };
+        builder: {
+            form: string;
+        };
+        builderComponent: {
+            form: string;
+        };
+        builderComponents: {
+            form: string;
+        };
+        builderEditForm: {
+            form: string;
+        };
+        builderPlaceholder: {
+            form: string;
+        };
+        builderSidebar: {
+            form: string;
+        };
+        builderSidebarGroup: {
+            form: string;
+        };
+        builderWizard: {
+            form: string;
+        };
+        button: {
+            form: string;
+            html: string;
+        };
+        checkbox: {
+            form: string;
+            html: string;
+        };
+        columns: {
+            form: string;
+        };
+        component: {
+            form: string;
+        };
+        componentModal: {
+            form: string;
+        };
+        components: {
+            form: string;
+        };
+        tableComponents: {
+            form: string;
+        };
+        container: {
+            form: string;
+        };
+        datagrid: {
+            form: string;
+            html: string;
+        };
+        day: {
+            form: string;
+        };
+        dialog: {
+            form: string;
+        };
+        editgrid: {
+            form: string;
+            html: string;
+        };
+        editgridTable: {
+            form: string;
+            html: string;
+        };
+        field: {
+            form: string;
+            align: string;
+        };
+        fieldset: {
+            form: string;
+        };
+        file: {
+            form: string;
+        };
+        html: {
+            form: string;
+        };
+        icon: {
+            form: string;
+        };
+        input: {
+            form: string;
+            html: string;
+        };
+        label: {
+            form: string;
+        };
+        loader: {
+            form: string;
+        };
+        loading: {
+            form: string;
+        };
+        map: {
+            form: string;
+        };
+        message: {
+            form: string;
+        };
+        modaledit: {
+            form: string;
+        };
+        modaldialog: {
+            form: string;
+        };
+        modalPreview: {
+            form: string;
+        };
+        multipleMasksInput: {
+            form: string;
+        };
+        multiValueRow: {
+            form: string;
+        };
+        multiValueTable: {
+            form: string;
+        };
+        panel: {
+            form: string;
+        };
+        pdf: {
+            form: string;
+        };
+        pdfBuilder: {
+            form: string;
+        };
+        pdfBuilderUpload: {
+            form: string;
+        };
+        radio: {
+            form: string;
+            html: string;
+        };
+        resourceAdd: {
+            form: string;
+        };
+        select: {
+            form: string;
+            html: string;
+        };
+        selectOption: {
+            form: string;
+            html: string;
+        };
+        signature: {
+            form: string;
+            html: string;
+        };
+        survey: {
+            form: string;
+            html: string;
+        };
+        tab: {
+            flat: string;
+            form: string;
+        };
+        table: {
+            form: string;
+        };
+        tree: {
+            form: string;
+        };
+    };
 }
 export default _default;

package/lib/cjs/utils/Evaluator.js

@@ -5,25 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const lodash_1 = __importDefault(require("lodash"));
 const string_hash_1 = __importDefault(require("string-hash"));
+const utils_1 = require("@formio/core/utils");
 const Evaluator = {
     noeval: false,
     protectedEval: false,
     cache: {},
-    templateSettings: {
-        evaluate: /\{%([\s\S]+?)%\}/g,
-        interpolate: /\{\{([\s\S]+?)\}\}/g,
-        escape: /\{\{\{([\s\S]+?)\}\}\}/g
-    },
-    evaluator(func, ...params) {
-        if (Evaluator.noeval) {
-            console.warn('No evaluations allowed for this renderer.');
-            return lodash_1.default.noop;
-        }
-        if (typeof params[0] === 'object') {
-            params = lodash_1.default.keys(params[0]);
-        }
-        return new Function(...params, func);
-    },
+    templateSettings: utils_1.Evaluator.templateSettings,
+    evaluator: utils_1.Evaluator.evaluator,
     template(template, hash) {
         hash = hash || (0, string_hash_1.default)(template);
         if (Evaluator.cache[hash]) {
@@ -53,24 +41,7 @@ const Evaluator = {
         rawTemplate = String(rawTemplate);
         let template;
         if (Evaluator.noeval || options.noeval) {
-            // No cached template methods available. Use poor-mans interpolate without eval.
-            return rawTemplate.replace(/({{\s*(.*?)\s*}})/g, (match, $1, $2) => {
-                // Allow for conditional values.
-                const parts = $2.split('||').map(item => item.trim());
-                let value = '';
-                let path = '';
-                for (let i = 0; i < parts.length; i++) {
-                    path = parts[i];
-                    value = lodash_1.default.get(data, path);
-                    if (value) {
-                        break;
-                    }
-                }
-                if (options.data) {
-                    lodash_1.default.set(options.data, path, value);
-                }
-                return value;
-            });
+            return utils_1.Evaluator.interpolateString(rawTemplate, data, _options);
         }
         else {
             template = Evaluator.template(rawTemplate);

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

@@ -0,0 +1,16 @@
+/**
+ * This file is used to mimic the i18n library interface.
+ */
+export class I18n {
+    static init(languages?: {}): I18n;
+    static createInstance(): I18n;
+    constructor(languages?: {});
+    languages: {};
+    language: string;
+    currentLanguage: any;
+    setLanguages(languages: any): void;
+    dir(lang?: string): "rtl" | "ltr";
+    changeLanguage(language: any, ready?: null): void;
+    addResourceBundle(language: any, type: any, strings: any): void;
+    t(text: any, ...args: any[]): any;
+}

package/lib/cjs/utils/i18n.js

@@ -0,0 +1,88 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.I18n = void 0;
+const utils_1 = require("@formio/core/utils");
+const i18n_1 = __importDefault(require("../i18n"));
+const i18Defaults = {};
+for (const lang in i18n_1.default.resources) {
+    if (i18n_1.default.resources.hasOwnProperty(lang)) {
+        i18Defaults[lang] = i18n_1.default.resources[lang].translation;
+    }
+}
+/**
+ * This file is used to mimic the i18n library interface.
+ */
+class I18n {
+    constructor(languages = {}) {
+        this.languages = i18Defaults;
+        this.language = 'en';
+        this.currentLanguage = i18Defaults.en;
+        this.setLanguages(languages);
+        this.changeLanguage(this.language);
+    }
+    setLanguages(languages) {
+        if (languages.resources) {
+            for (const lang in languages.resources) {
+                if (languages.resources.hasOwnProperty(lang)) {
+                    languages[lang] = languages.resources[lang].translation;
+                }
+            }
+            delete languages.resources;
+        }
+        if (languages.lng) {
+            languages.language = languages.lng;
+            delete languages.lng;
+        }
+        // Do not use these configurations.
+        delete languages.nsSeparator;
+        delete languages.keySeparator;
+        delete languages.pluralSeparator;
+        delete languages.contextSeparator;
+        // Now establish the languages default.
+        if (languages.language) {
+            this.language = languages.language;
+        }
+        for (const lang in languages) {
+            if (lang !== 'language' && languages.hasOwnProperty(lang)) {
+                if (!this.languages[lang]) {
+                    this.languages[lang] = {};
+                }
+                this.languages[lang] = Object.assign(Object.assign({}, this.languages[lang]), languages[lang]);
+            }
+        }
+    }
+    static init(languages = {}) {
+        return new I18n(languages);
+    }
+    dir(lang = '') {
+        lang = lang || this.language;
+        const rtls = ['ar', 'he', 'fa', 'ps', 'ur'];
+        return rtls.includes(lang) ? 'rtl' : 'ltr';
+    }
+    static createInstance() {
+        return new I18n();
+    }
+    changeLanguage(language, ready = null) {
+        if (!this.languages[language]) {
+            language = 'en';
+        }
+        this.language = language;
+        this.currentLanguage = this.languages[language] ? this.languages[language] : {};
+        if (ready) {
+            ready();
+        }
+    }
+    addResourceBundle(language, type, strings) {
+        this.languages[language] = strings;
+    }
+    t(text, ...args) {
+        if (this.currentLanguage[text]) {
+            return utils_1.Evaluator.interpolateString(this.currentLanguage[text], ...args);
+        }
+        return utils_1.Evaluator.interpolateString(text, ...args);
+    }
+}
+exports.I18n = I18n;

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

@@ -223,7 +223,7 @@ export function getNumberSeparators(lang?: string): {
 };
 export function getNumberDecimalLimit(component: any, defaultLimit: any): any;
 export function getCurrencyAffixes({ currency, decimalLimit, decimalSeparator, lang, }: {
-    currency?: string | undefined;
+    currency: any;
     decimalLimit: any;
     decimalSeparator: any;
     lang: any;
@@ -349,6 +349,7 @@ export function isPromise(value: any): boolean;
  */
 export function isInsideScopingComponent(componentInstance: any, firstPass?: boolean): boolean | boolean | any;
 export function getFocusableElements(element: any): any;
+export function getComponentSavedTypes(fullSchema: any): string[] | null;
 export * from "./formUtils";
 /**
  * Map values through unfold and return first non-nil value.
@@ -357,6 +358,15 @@ export * from "./formUtils";
  * @return {T}
  */
 export const firstNonNil: any;
+export namespace componentValueTypes {
+    const number: string;
+    const string: string;
+    const boolean: string;
+    const array: string;
+    const object: string;
+    const date: string;
+    const any: string;
+}
 import jsonLogic from 'json-logic-js';
 import ConditionOperators from './conditionOperators';
 import Evaluator from './Evaluator';

package/lib/cjs/utils/utils.js

@@ -1,5 +1,5 @@
 "use strict";
-/* global $ */
+/* global jQuery */
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -31,7 +31,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.observeOverload = exports.withSwitch = 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.setActionProperty = exports.checkTrigger = exports.checkCondition = exports.checkJsonConditional = exports.checkCustomConditional = exports.getComponentActualValue = exports.checkSimpleConditional = exports.checkCalculated = exports.isMongoId = exports.boolValue = exports.getElementRect = exports.getPropertyValue = exports.getRandomComponentId = exports.evaluate = exports.moment = exports.ConditionOperators = exports.jsonLogic = void 0;
-exports._ = exports.getFocusableElements = exports.isInsideScopingComponent = exports.isPromise = exports.getDataParentComponent = exports.getComponentPath = exports.getComponentPathWithoutIndicies = exports.getBrowserInfo = exports.getIEBrowserVersion = exports.round = exports.getStringFromComponentPath = exports.hasInvalidComponent = exports.getArrayFromComponentPath = exports.isInputComponent = exports.interpolate = exports.Evaluator = exports.fastCloneDeep = exports.sanitize = exports.translateHTMLTemplate = exports.getContextButtons = exports.getContextComponents = void 0;
+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.hasInvalidComponent = exports.getArrayFromComponentPath = exports.isInputComponent = exports.interpolate = exports.Evaluator = exports.fastCloneDeep = exports.sanitize = exports.translateHTMLTemplate = exports.getContextButtons = exports.getContextComponents = void 0;
 const lodash_1 = __importDefault(require("lodash"));
 exports._ = lodash_1.default;
 const fetch_ponyfill_1 = __importDefault(require("fetch-ponyfill"));
@@ -40,7 +40,6 @@ exports.jsonLogic = json_logic_js_1.default;
 const moment_timezone_1 = __importDefault(require("moment-timezone/moment-timezone"));
 const jstimezonedetect_1 = __importDefault(require("jstimezonedetect"));
 const operators_1 = require("./jsonlogic/operators");
-const native_promise_only_1 = __importDefault(require("native-promise-only"));
 const dompurify_1 = __importDefault(require("dompurify"));
 const formUtils_1 = require("./formUtils");
 const Evaluator_1 = __importDefault(require("./Evaluator"));
@@ -50,7 +49,7 @@ exports.ConditionOperators = conditionOperators_1.default;
 const interpolate = Evaluator_1.default.interpolate;
 exports.interpolate = interpolate;
 const { fetch } = (0, fetch_ponyfill_1.default)({
-    Promise: native_promise_only_1.default
+    Promise: Promise
 });
 __exportStar(require("./formUtils"), exports);
 // Configure JsonLogic
@@ -387,7 +386,7 @@ exports.checkCondition = checkCondition;
  */
 function checkTrigger(component, trigger, row, data, form, instance) {
     // If trigger is empty, don't fire it
-    if (!trigger[trigger.type]) {
+    if (!trigger || !trigger[trigger.type]) {
         return false;
     }
     switch (trigger.type) {
@@ -612,7 +611,7 @@ exports.shouldLoadZones = shouldLoadZones;
 function loadZones(url, timezone) {
     if (timezone && !shouldLoadZones(timezone)) {
         // Return non-resolving promise.
-        return new native_promise_only_1.default(lodash_1.default.noop);
+        return new Promise(lodash_1.default.noop);
     }
     if (moment_timezone_1.default.zonesPromise) {
         return moment_timezone_1.default.zonesPromise;
@@ -899,7 +898,7 @@ function getNumberDecimalLimit(component, defaultLimit) {
     return decimalLimit;
 }
 exports.getNumberDecimalLimit = getNumberDecimalLimit;
-function getCurrencyAffixes({ currency = 'USD', decimalLimit, decimalSeparator, lang, }) {
+function getCurrencyAffixes({ currency, decimalLimit, decimalSeparator, lang, }) {
     // Get the prefix and suffix from the localized string.
     let regex = `(.*)?${(100).toLocaleString(lang)}`;
     if (decimalLimit) {
@@ -908,7 +907,7 @@ function getCurrencyAffixes({ currency = 'USD', decimalLimit, decimalSeparator,
     regex += '(.*)?';
     const parts = (100).toLocaleString(lang, {
         style: 'currency',
-        currency,
+        currency: currency ? currency : 'USD',
         useGrouping: true,
         maximumFractionDigits: decimalLimit || 0,
         minimumFractionDigits: decimalLimit || 0
@@ -1032,8 +1031,8 @@ function bootstrapVersion(options) {
     if (options.bootstrap) {
         return options.bootstrap;
     }
-    if ((typeof $ === 'function') && (typeof $().collapse === 'function')) {
-        return parseInt($.fn.collapse.Constructor.VERSION.split('.')[0], 10);
+    if ((typeof jQuery === 'function') && (typeof jQuery().collapse === 'function')) {
+        return parseInt(jQuery.fn.collapse.Constructor.VERSION.split('.')[0], 10);
     }
     if (window.bootstrap && window.bootstrap.Collapse) {
         return parseInt(window.bootstrap.Collapse.VERSION.split('.')[0], 10);
@@ -1466,3 +1465,23 @@ function getFocusableElements(element) {
     return element.querySelectorAll(focusableSelector);
 }
 exports.getFocusableElements = getFocusableElements;
+exports.componentValueTypes = {
+    number: 'number',
+    string: 'string',
+    boolean: 'boolean',
+    array: 'array',
+    object: 'object',
+    date: 'date',
+    any: 'any',
+};
+function getComponentSavedTypes(fullSchema) {
+    const schema = fullSchema || {};
+    if (schema.persistent !== true) {
+        return [];
+    }
+    if (schema.multiple) {
+        return [exports.componentValueTypes.array];
+    }
+    return null;
+}
+exports.getComponentSavedTypes = getComponentSavedTypes;

package/lib/cjs/validator/Validator.d.ts

@@ -21,7 +21,7 @@ export class ValidationChecker {
             key: string;
             hasLabel: boolean;
             message(component: any): any;
-            check(component: any, setting: any, value: any): any;
+            check(component: any, setting: any, value: any): true | Promise<any>;
         };
         multiple: {
             key: string;
@@ -170,7 +170,35 @@ export class ValidationChecker {
         };
     };
     checkValidator(component: any, validator: any, setting: any, value: any, data: any, index: any, row: any, async: any): any;
-    validate(component: any, validatorName: any, value: any, data: any, index: any, row: any, async: any, conditionallyVisible: any, validationObj: any): any;
+    validate(component: any, validatorName: any, value: any, data: any, index: any, row: any, async: any, conditionallyVisible: any, validationObj: any): false | {
+        message: string;
+        level: string;
+        path: any;
+        context: {
+            validator: any;
+            hasLabel: any;
+            setting: any;
+            key: any;
+            label: any;
+            value: any;
+            index: any;
+            input: any;
+        };
+    } | Promise<false | {
+        message: string;
+        level: string;
+        path: any;
+        context: {
+            validator: any;
+            hasLabel: any;
+            setting: any;
+            key: any;
+            label: any;
+            value: any;
+            index: any;
+            input: any;
+        };
+    }>;
     checkComponent(component: any, data: any, row: any, includeWarnings?: boolean, async?: boolean): any;
     /**
      * Use the new validations engine to evaluate any errors.

package/lib/cjs/validator/Validator.js

@@ -7,10 +7,9 @@ exports.ValidationChecker = exports.default = void 0;
 const lodash_1 = __importDefault(require("lodash"));
 const utils_1 = require("../utils/utils");
 const moment_1 = __importDefault(require("moment"));
-const native_promise_only_1 = __importDefault(require("native-promise-only"));
 const fetch_ponyfill_1 = __importDefault(require("fetch-ponyfill"));
 const { fetch, Headers, Request } = (0, fetch_ponyfill_1.default)({
-    Promise: native_promise_only_1.default
+    Promise: Promise
 });
 const calendarUtils_1 = require("../utils/calendarUtils");
 const Rules_1 = __importDefault(require("./Rules"));
@@ -75,7 +74,8 @@ class ValidationChecker {
                     if (!this.config.db) {
                         return true;
                     }
-                    return new native_promise_only_1.default(resolve => {
+                    return new Promise(resolve => {
+                        var _a;
                         const form = this.config.form;
                         const submission = this.config.submission;
                         const path = `data.${component.path}`;
@@ -101,10 +101,19 @@ class ValidationChecker {
                         };
                         // Build the query
                         const query = { form: form._id };
+                        let collationOptions = {};
                         if (lodash_1.default.isString(value)) {
                             if (component.component.dbIndex) {
                                 addPathQueryParams(value, query, path);
                             }
+                            // These are kind of hacky but provides for a more efficient "unique" validation when the string is an email,
+                            // because we (by and large) only have to worry about ASCII and partial unicode; this way, we can use collation-
+                            // aware indexes with case insensitive email searches to make things like login and registration a whole lot faster
+                            else if (component.component.type === 'email' ||
+                                (component.component.type === 'textfield' && ((_a = component.component.validate) === null || _a === void 0 ? void 0 : _a.pattern) === '[A-Za-z0-9]+')) {
+                                addPathQueryParams(value, query, path);
+                                collationOptions = { collation: { locale: 'en', strength: 2 } };
+                            }
                             else {
                                 addPathQueryParams({
                                     $regex: new RegExp(`^${(0, utils_1.escapeRegExCharacters)(value)}$`),
@@ -132,8 +141,7 @@ class ValidationChecker {
                         // Only search for non-deleted items
                         query.deleted = { $eq: null };
                         query.state = 'submitted';
-                        // Try to find an existing value within the form
-                        this.config.db.findOne(query, (err, result) => {
+                        const uniqueValidationCallback = (err, result) => {
                             if (err) {
                                 return resolve(false);
                             }
@@ -150,6 +158,21 @@ class ValidationChecker {
                             else {
                                 return resolve(true);
                             }
+                        };
+                        // Try to find an existing value within the form
+                        this.config.db.findOne(query, null, collationOptions, (err, result) => {
+                            if (err && collationOptions.collation) {
+                                // presume this error comes from db compatibility, try again as regex
+                                delete query[path];
+                                addPathQueryParams({
+                                    $regex: new RegExp(`^${(0, utils_1.escapeRegExCharacters)(value)}$`),
+                                    $options: 'i'
+                                }, query, path);
+                                this.config.db.findOne(query, uniqueValidationCallback);
+                            }
+                            else {
+                                return uniqueValidationCallback(err, result);
+                            }
                         });
                     }).catch(() => false);
                 }
@@ -825,7 +848,7 @@ class ValidationChecker {
             return '';
         };
         if (async) {
-            return native_promise_only_1.default.resolve(resultOrPromise).then(processResult);
+            return Promise.resolve(resultOrPromise).then(processResult);
         }
         else {
             return processResult(resultOrPromise);
@@ -867,7 +890,7 @@ class ValidationChecker {
             }
         };
         if (async) {
-            return native_promise_only_1.default.resolve(resultOrPromise).then(processResult);
+            return Promise.resolve(resultOrPromise).then(processResult);
         }
         else {
             return processResult(resultOrPromise);
@@ -880,7 +903,7 @@ class ValidationChecker {
             && !lodash_1.default.defaultTo(component.component.persistent, true);
         // If we're server-side and it's not a persistent component, don't run validation at all
         if (isServerSidePersistent || component.component.validate === false) {
-            return async ? native_promise_only_1.default.resolve([]) : [];
+            return async ? Promise.resolve([]) : [];
         }
         data = data || component.rootValue;
         row = row || component.data;
@@ -1001,7 +1024,7 @@ class ValidationChecker {
         };
         // Wait for results if using async mode, otherwise process and return immediately
         if (async) {
-            return native_promise_only_1.default.all(resultsOrPromises).then(formatResults);
+            return Promise.all(resultsOrPromises).then(formatResults);
         }
         else {
             return formatResults(resultsOrPromises);