@formio/js 5.2.1-rc.5 → 5.2.1-rc.6

package/dist/formio.form.js

@@ -1972,7 +1972,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.interpolate = exports.evaluate = exports.attachResourceToDom = exports.unescapeHTML = exports.boolValue = exports.escapeRegExCharacters = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst Evaluator_1 = __webpack_require__(/*! ./Evaluator */ \"./node_modules/@formio/core/lib/utils/Evaluator.js\");\nconst formUtil_1 = __webpack_require__(/*! ./formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\n/**\n * Escapes RegEx characters in provided String value.\n *\n * @param {String} value\n *   String for escaping RegEx characters.\n * @returns {string}\n *   String with escaped RegEx characters.\n */\nfunction escapeRegExCharacters(value) {\n    return value.replace(/[-[\\]/{}()*+?.\\\\^$|]/g, '\\\\$&');\n}\nexports.escapeRegExCharacters = escapeRegExCharacters;\n/**\n * Determines the boolean value of a setting.\n *\n * @param value\n * @return {boolean}\n */\nfunction boolValue(value) {\n    if ((0, lodash_1.isBoolean)(value)) {\n        return value;\n    }\n    else if ((0, lodash_1.isString)(value)) {\n        return value.toLowerCase() === 'true';\n    }\n    else {\n        return !!value;\n    }\n}\nexports.boolValue = boolValue;\n/**\n * Unescape HTML characters like &lt, &gt, &amp and etc.\n * @param str\n * @returns {string}\n */\nfunction unescapeHTML(str) {\n    if (typeof window === 'undefined' || !('DOMParser' in window)) {\n        return str;\n    }\n    const doc = new window.DOMParser().parseFromString(str, 'text/html');\n    return doc.documentElement.textContent;\n}\nexports.unescapeHTML = unescapeHTML;\nfunction attachResourceToDom(options) {\n    const { name, formio, onload, rootElement } = options;\n    let { src } = options;\n    src = Array.isArray(src) ? src : [src];\n    src.forEach((lib) => {\n        let attrs = {};\n        let elementType = '';\n        if (typeof lib === 'string') {\n            lib = {\n                type: 'script',\n                src: lib,\n            };\n        }\n        switch (lib.type) {\n            case 'script':\n                elementType = 'script';\n                attrs = {\n                    src: lib.src,\n                    type: 'text/javascript',\n                    defer: true,\n                    async: true,\n                    referrerpolicy: 'origin',\n                };\n                break;\n            case 'styles':\n                elementType = 'link';\n                attrs = {\n                    href: lib.src,\n                    rel: 'stylesheet',\n                };\n                break;\n        }\n        // Add the script to the top of the page.\n        const element = document.createElement(elementType);\n        if (element.setAttribute) {\n            for (const attr in attrs) {\n                element.setAttribute(attr, attrs[attr]);\n            }\n        }\n        if (onload) {\n            element.addEventListener('load', () => {\n                formio.libraries[name].loaded = true;\n                onload(formio.libraries[name].ready);\n            });\n        }\n        if (rootElement) {\n            rootElement.insertAdjacentElement('afterend', element);\n            return;\n        }\n        const { head } = document;\n        if (head) {\n            head.appendChild(element);\n        }\n    });\n}\nexports.attachResourceToDom = attachResourceToDom;\n/**\n * A convenience function that wraps Evaluator.evaluate and normalizes context values\n * @param evaluation - The code string to evaluate\n * @param context - The processor context\n * @param ret - The return value\n * @param interpolate - Whether or not to interpolate the code string before evaluating\n * @param evalContextFn - A callback to mutate the context value after it has been normalized\n * @param options - Options to pass to the Evaluator\n * @returns {*} - Returns the result of the evaluation\n */\nfunction evaluate(evaluation, context, ret = 'result', interpolate = false, evalContextFn, options = {}) {\n    const { instance, form } = context;\n    const normalizedContext = (0, formUtil_1.normalizeContext)(context);\n    if (evalContextFn) {\n        evalContextFn(normalizedContext);\n    }\n    if (form === null || form === void 0 ? void 0 : form.module) {\n        options = Object.assign(Object.assign({}, options), { formModule: form.module });\n    }\n    if (instance && instance.evaluate) {\n        return instance.evaluate(evaluation, normalizedContext, ret, interpolate, options);\n    }\n    return Evaluator_1.Evaluator.evaluate(evaluation, normalizedContext, ret, interpolate, context, options);\n}\nexports.evaluate = evaluate;\nfunction interpolate(evaluation, context, evalContextFn) {\n    const { instance } = context;\n    const normalizedContext = (0, formUtil_1.normalizeContext)(context);\n    if (evalContextFn) {\n        evalContextFn(normalizedContext);\n    }\n    if (instance && instance.interpolate) {\n        return instance.interpolate(evaluation, normalizedContext, {\n            noeval: true,\n        });\n    }\n    return Evaluator_1.Evaluator.interpolate(evaluation, normalizedContext, {\n        noeval: true,\n    });\n}\nexports.interpolate = interpolate;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/utils.js?");
+eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.interpolate = exports.evaluate = exports.attachResourceToDom = exports.unescapeHTML = exports.boolValue = exports.escapeRegExCharacters = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst Evaluator_1 = __webpack_require__(/*! ./Evaluator */ \"./node_modules/@formio/core/lib/utils/Evaluator.js\");\nconst formUtil_1 = __webpack_require__(/*! ./formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\n/**\n * Escapes RegEx characters in provided String value.\n *\n * @param {String} value\n *   String for escaping RegEx characters.\n * @returns {string}\n *   String with escaped RegEx characters.\n */\nfunction escapeRegExCharacters(value) {\n    return value.replace(/[-[\\]/{}()*+?.\\\\^$|]/g, '\\\\$&');\n}\nexports.escapeRegExCharacters = escapeRegExCharacters;\n/**\n * Determines the boolean value of a setting.\n *\n * @param value\n * @return {boolean}\n */\nfunction boolValue(value) {\n    if ((0, lodash_1.isBoolean)(value)) {\n        return value;\n    }\n    else if ((0, lodash_1.isString)(value)) {\n        return value.toLowerCase() === 'true';\n    }\n    else {\n        return !!value;\n    }\n}\nexports.boolValue = boolValue;\n/**\n * Unescape HTML characters like &lt, &gt, &amp and etc.\n * @param str\n * @returns {string}\n */\nfunction unescapeHTML(str) {\n    if (typeof window === 'undefined' || !('DOMParser' in window)) {\n        return str;\n    }\n    const doc = new window.DOMParser().parseFromString(str, 'text/html');\n    return doc.documentElement.textContent;\n}\nexports.unescapeHTML = unescapeHTML;\nfunction attachResourceToDom(options) {\n    const { name, formio, onload, rootElement, onerror } = options;\n    let { src } = options;\n    src = Array.isArray(src) ? src : [src];\n    src.forEach((lib) => {\n        let attrs = {};\n        let elementType = '';\n        if (typeof lib === 'string') {\n            lib = {\n                type: 'script',\n                src: lib,\n            };\n        }\n        switch (lib.type) {\n            case 'script':\n                elementType = 'script';\n                attrs = {\n                    src: lib.src,\n                    type: 'text/javascript',\n                    defer: true,\n                    async: true,\n                    referrerpolicy: 'origin',\n                };\n                break;\n            case 'styles':\n                elementType = 'link';\n                attrs = {\n                    href: lib.src,\n                    rel: 'stylesheet',\n                };\n                break;\n        }\n        // Add the script to the top of the page.\n        const element = document.createElement(elementType);\n        if (element.setAttribute) {\n            for (const attr in attrs) {\n                element.setAttribute(attr, attrs[attr]);\n            }\n        }\n        if (onload) {\n            element.addEventListener('load', () => {\n                formio.libraries[name].loaded = true;\n                onload(formio.libraries[name].ready);\n            });\n        }\n        element.addEventListener('error', (e) => {\n            console.warn(`Unable to load script ${name}`);\n            if (typeof onerror === 'function') {\n                onerror(e);\n            }\n        });\n        if (rootElement) {\n            rootElement.insertAdjacentElement('afterend', element);\n            return;\n        }\n        const { head } = document;\n        if (head) {\n            head.appendChild(element);\n        }\n    });\n}\nexports.attachResourceToDom = attachResourceToDom;\n/**\n * A convenience function that wraps Evaluator.evaluate and normalizes context values\n * @param evaluation - The code string to evaluate\n * @param context - The processor context\n * @param ret - The return value\n * @param interpolate - Whether or not to interpolate the code string before evaluating\n * @param evalContextFn - A callback to mutate the context value after it has been normalized\n * @param options - Options to pass to the Evaluator\n * @returns {*} - Returns the result of the evaluation\n */\nfunction evaluate(evaluation, context, ret = 'result', interpolate = false, evalContextFn, options = {}) {\n    const { instance, form } = context;\n    const normalizedContext = (0, formUtil_1.normalizeContext)(context);\n    if (evalContextFn) {\n        evalContextFn(normalizedContext);\n    }\n    if (form === null || form === void 0 ? void 0 : form.module) {\n        options = Object.assign(Object.assign({}, options), { formModule: form.module });\n    }\n    if (instance && instance.evaluate) {\n        return instance.evaluate(evaluation, normalizedContext, ret, interpolate, options);\n    }\n    return Evaluator_1.Evaluator.evaluate(evaluation, normalizedContext, ret, interpolate, context, options);\n}\nexports.evaluate = evaluate;\nfunction interpolate(evaluation, context, evalContextFn) {\n    const { instance } = context;\n    const normalizedContext = (0, formUtil_1.normalizeContext)(context);\n    if (evalContextFn) {\n        evalContextFn(normalizedContext);\n    }\n    if (instance && instance.interpolate) {\n        return instance.interpolate(evaluation, normalizedContext, {\n            noeval: true,\n        });\n    }\n    return Evaluator_1.Evaluator.interpolate(evaluation, normalizedContext, {\n        noeval: true,\n    });\n}\nexports.interpolate = interpolate;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/utils.js?");
 
 /***/ }),
 
@@ -4587,7 +4587,7 @@ eval("\n\nfunction hash(str) {\n  var hash = 5381,\n      i    = str.length;\n\n
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Formio = exports.FormioPathType = void 0;\nconst fetch_ponyfill_1 = __importDefault(__webpack_require__(/*! fetch-ponyfill */ \"./node_modules/fetch-ponyfill/build/fetch-browser.js\"));\nconst fastCloneDeep_1 = __webpack_require__(/*! ../utils/fastCloneDeep */ \"./node_modules/@formio/core/lib/utils/fastCloneDeep.js\");\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst formUtil_1 = __webpack_require__(/*! ../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst jwtDecode_1 = __webpack_require__(/*! ../utils/jwtDecode */ \"./node_modules/@formio/core/lib/utils/jwtDecode.js\");\nconst eventemitter3_1 = __importDefault(__webpack_require__(/*! eventemitter3 */ \"./node_modules/eventemitter3/index.js\"));\nconst browser_cookies_1 = __importDefault(__webpack_require__(/*! browser-cookies */ \"./node_modules/browser-cookies/src/browser-cookies.js\"));\nconst { fetch, Headers } = (0, fetch_ponyfill_1.default)();\nconst Plugins_1 = __importDefault(__webpack_require__(/*! ./Plugins */ \"./node_modules/@formio/core/lib/sdk/Plugins.js\"));\nconst utils_1 = __webpack_require__(/*! ../utils */ \"./node_modules/@formio/core/lib/utils/index.js\");\n/**\n * The different path types for a project.\n */\nvar FormioPathType;\n(function (FormioPathType) {\n    FormioPathType[\"Subdirectories\"] = \"Subdirectories\";\n    FormioPathType[\"Subdomains\"] = \"Subdomains\";\n})(FormioPathType || (exports.FormioPathType = FormioPathType = {}));\n/**\n * The Formio interface class. This is a minimalistic API library that allows you to work with the Form.io API's within JavaScript.\n *\n * ## Usage\n * Creating an instance of Formio is simple, and takes only a path (URL String). The path can be different, depending on the desired output.\n * The Formio instance can also access higher level operations, depending on how granular of a path you start with.\n *\n * ```ts\n * var formio = new Formio(<endpoint>, [options]);\n * ```\n *\n * Where **endpoint** is any valid API endpoint within Form.io. These URL's can provide a number of different methods depending on the granularity of the endpoint. This allows you to use the same interface but have access to different methods depending on how granular the endpoint url is.\n * **options** is defined within the {link Formio.constructor} documentation.\n *\n * Here is an example of how this library can be used to load a form JSON from the Form.io API's\n *\n * ```ts\n * const formio = new Formio('https://examples.form.io/example');\n * formio.loadForm().then((form) => {\n *   console.log(form);\n * });\n * ```\n */\nclass Formio {\n    /**\n     * @constructor\n     * @param {string} path - A project, form, and submission API Url.\n     * @param {FormioOptions} options - Available options to configure the Javascript API.\n     */\n    constructor(path, options = {}) {\n        this.path = path;\n        this.options = options;\n        /**\n         * The base API url of the Form.io Platform. Example: https://api.form.io\n         */\n        this.base = '';\n        /**\n         * The Projects Endpoint derived from the provided source.\n         *\n         * @example https://api.form.io/project\n         */\n        this.projectsUrl = '';\n        /**\n         * A specific project endpoint derived from the provided source.\n         *\n         * @example https://examples.form.io\n         */\n        this.projectUrl = '';\n        /**\n         * The Project ID found within the provided source.\n         */\n        this.projectId = '';\n        /**\n         * A specific Role URL provided the source.\n         *\n         * @example https://examples.form.io/role/2342343234234234\n         */\n        this.roleUrl = '';\n        /**\n         * The roles endpoint derived from the provided source.\n         *\n         * @example https://examples.form.io/role\n         */\n        this.rolesUrl = '';\n        /**\n         * The roleID derieved from the provided source.\n         */\n        this.roleId = '';\n        /**\n         * A specific form url derived from the provided source.\n         *\n         * @example https://examples.form.io/example\n         */\n        this.formUrl = '';\n        /**\n         * The forms url derived from the provided source.\n         *\n         * @example https://example.form.io/form\n         */\n        this.formsUrl = '';\n        /**\n         * The Form ID derived from the provided source.\n         */\n        this.formId = '';\n        /**\n         * The submissions URL derived from the provided source.\n         *\n         * @example https://examples.form.io/example/submission\n         */\n        this.submissionsUrl = '';\n        /**\n         * A specific submissions URL derived from a provided source.\n         *\n         * @example https://examples.form.io/example/submission/223423423423\n         */\n        this.submissionUrl = '';\n        /**\n         * The submission ID provided a submission url.\n         */\n        this.submissionId = '';\n        /**\n         * The actions url provided a form url as the source.\n         *\n         * @example https://examples.form.io/example/action\n         */\n        this.actionsUrl = '';\n        /**\n         * The Action ID derived from a provided Action url.\n         */\n        this.actionId = '';\n        /**\n         * A specific action api endoint.\n         */\n        this.actionUrl = '';\n        this.vsUrl = '';\n        this.vId = '';\n        this.vUrl = '';\n        /**\n         * The query string derived from the provided src url.\n         */\n        this.query = '';\n        /**\n         * If this is a non-project url, such is the case for Open Source API.\n         */\n        this.noProject = false;\n        // Ensure we have an instance of Formio.\n        if (!(this instanceof Formio)) {\n            return new Formio(path);\n        }\n        if (options.useSessionToken) {\n            Formio.useSessionToken(options);\n        }\n        if (options.hasOwnProperty('base') && options.base) {\n            this.base = options.base;\n        }\n        else if (Formio.baseUrl) {\n            this.base = Formio.baseUrl;\n        }\n        else if (window && window.location) {\n            const match = window.location.href.match(/http[s]?:\\/\\/api./);\n            this.base = match ? match[0] : window.location.origin;\n        }\n        if (!path) {\n            // Allow user to create new projects if this was instantiated without\n            // a url\n            this.projectUrl = Formio.projectUrl || `${this.base}/project`;\n            this.projectsUrl = `${this.base}/project`;\n            this.projectId = '';\n            this.query = '';\n            return;\n        }\n        if (options.hasOwnProperty('project') && options.project) {\n            this.projectUrl = options.project;\n        }\n        const project = this.projectUrl || Formio.projectUrl;\n        const projectRegEx = /(^|\\/)(project)($|\\/[^/]+)/;\n        const isProjectUrl = path.search(projectRegEx) !== -1;\n        // The baseURL is the same as the projectUrl, and does not contain \"/project/MONGO_ID\" in\n        // its domain. This is almost certainly against the Open Source server.\n        if (project && this.base === project && !isProjectUrl) {\n            this.noProject = true;\n            this.projectUrl = this.base;\n        }\n        // Normalize to an absolute path.\n        if (path.indexOf('http') !== 0 && path.indexOf('//') !== 0) {\n            path = this.base + path;\n        }\n        const hostparts = this.getUrlParts(path);\n        let hostName = '';\n        let parts = [];\n        if (hostparts) {\n            hostName = hostparts[1] + hostparts[2];\n            path = hostparts.length > 3 ? hostparts[3] : '';\n            const queryparts = path.split('?');\n            if (queryparts.length > 1) {\n                path = queryparts[0];\n                this.query = `?${queryparts[1]}`;\n            }\n        }\n        // Register a specific path.\n        const registerPath = (name, base) => {\n            this[`${name}sUrl`] = `${base}/${name}`;\n            const regex = new RegExp(`/${name}/([^/]+)`);\n            if (path && path.search(regex) !== -1) {\n                parts = path.match(regex);\n                this[`${name}Url`] = parts ? base + parts[0] : '';\n                this[`${name}Id`] = parts.length > 1 ? parts[1] : '';\n                base += parts[0];\n            }\n            return base;\n        };\n        // Register an array of items.\n        const registerItems = (items, base, staticBase) => {\n            for (const i in items) {\n                if (items.hasOwnProperty(i)) {\n                    const item = items[i];\n                    if (Array.isArray(item)) {\n                        registerItems(item, base, true);\n                    }\n                    else {\n                        const newBase = registerPath(item, base);\n                        base = staticBase ? base : newBase;\n                    }\n                }\n            }\n        };\n        if (!this.projectUrl || this.projectUrl === this.base) {\n            // If a project uses Subdirectories path type, we need to specify a projectUrl\n            if (!this.projectUrl && !isProjectUrl && Formio.pathType === 'Subdirectories') {\n                const regex = `^${hostName.replace(/\\//g, '\\\\/')}.[^/]+`;\n                const match = project.match(new RegExp(regex));\n                this.projectUrl = match ? match[0] : hostName;\n            }\n            else {\n                this.projectUrl = hostName;\n            }\n        }\n        // Check if we have a specified path type.\n        let isNotSubdomainType = false;\n        if (Formio.pathType) {\n            isNotSubdomainType = Formio.pathType !== 'Subdomains';\n        }\n        if (!this.noProject) {\n            // Determine the projectUrl and projectId\n            if (isProjectUrl) {\n                // Get project id as project/:projectId.\n                registerItems(['project'], hostName);\n                path = path.replace(projectRegEx, '');\n            }\n            else if (hostName === this.base) {\n                // Get project id as first part of path (subdirectory).\n                if (hostparts && hostparts.length > 3 && path.split('/').length > 1) {\n                    const isFile = path.match(/.json/);\n                    const pathParts = path.split('/');\n                    if (isFile) {\n                        this.projectUrl = hostName;\n                    }\n                    else {\n                        pathParts.shift(); // Throw away the first /.\n                        const projectId = pathParts.shift();\n                        if (projectId) {\n                            this.projectId = projectId;\n                            path = `/${pathParts.join('/')}`;\n                            this.projectUrl = `${hostName}/${this.projectId}`;\n                        }\n                    }\n                }\n            }\n            else {\n                // Get project id from subdomain.\n                if (hostparts &&\n                    hostparts.length > 2 &&\n                    (hostparts[2].split('.').length > 2 || hostName.includes('localhost')) &&\n                    !isNotSubdomainType) {\n                    this.projectUrl = hostName;\n                    this.projectId = hostparts[2].split('.')[0];\n                }\n            }\n            this.projectsUrl = this.projectsUrl || `${this.base}/project`;\n        }\n        // Configure Role urls and role ids.\n        registerItems(['role'], this.projectUrl);\n        // Configure Form urls and form ids.\n        if (/(^|\\/)(form)($|\\/)/.test(path)) {\n            registerItems(['form', ['submission', 'action', 'v']], this.projectUrl);\n        }\n        else {\n            const subRegEx = new RegExp('/(submission|action|v)($|/.*)');\n            const subs = path.match(subRegEx);\n            if (subs && subs.length > 1) {\n                this.pathType = subs[1];\n            }\n            path = path.replace(subRegEx, '');\n            path = path.replace(/\\/$/, '');\n            this.formsUrl = `${this.projectUrl}/form`;\n            this.formUrl = path ? this.projectUrl + path : '';\n            this.formId = path.replace(/^\\/+|\\/+$/g, '');\n            const items = ['submission', 'action', 'v'];\n            for (const i in items) {\n                if (items.hasOwnProperty(i)) {\n                    const item = items[i];\n                    this[`${item}sUrl`] = `${this.projectUrl + path}/${item}`;\n                    if (this.pathType === item && subs && subs.length > 2 && subs[2]) {\n                        this[`${item}Id`] = subs[2].replace(/^\\/+|\\/+$/g, '');\n                        this[`${item}Url`] = this.projectUrl + path + subs[0];\n                    }\n                }\n            }\n        }\n        // Set the app url if it is not set.\n        if (!Formio.projectUrlSet) {\n            Formio.projectUrl = this.projectUrl;\n        }\n    }\n    /**\n     * Deletes a remote resource of any provided type.\n     *\n     * @param {string} type - The type of resource to delete. \"submission\", \"form\", etc.\n     * @param {object} options - The options passed to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    delete(type, opts) {\n        const _id = `${type}Id`;\n        const _url = `${type}Url`;\n        if (!this[_id]) {\n            return Promise.reject('Nothing to delete');\n        }\n        Formio.cache = {};\n        return this.makeRequest(type, this[_url], 'delete', null, opts);\n    }\n    /**\n     * Returns the index (array of records) for any provided type.\n     *\n     * @param {string} type - The type of resource to fetch the index of. \"submission\", \"form\", etc.\n     * @param {object} query - A query object to pass to the request.\n     * @param {object} query.params - A map (key-value pairs) of URL query parameters to add to the url.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    index(type, query, opts) {\n        const _url = `${type}Url`;\n        query = query || '';\n        if (query && (0, lodash_1.isObject)(query)) {\n            query = `?${Formio.serialize(query.params)}`;\n        }\n        return this.makeRequest(type, this[_url] + query, 'get', null, opts);\n    }\n    /**\n     * Save a document record using \"upsert\". If the document does not exist, it will be created, if the _id is provided,\n     * it will be updated.\n     *\n     * @param {string} type - The type of resource to fetch the index of. \"submission\", \"form\", etc.\n     * @param {object} data - The resource data object.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    save(type, data, opts) {\n        const _id = `${type}Id`;\n        const _url = `${type}Url`;\n        const method = this[_id] || data._id ? 'put' : 'post';\n        let reqUrl = this[_id] ? this[_url] : this[`${type}sUrl`];\n        if (!this[_id] && data._id && method === 'put' && !reqUrl.includes(data._id)) {\n            reqUrl += `/${data._id}`;\n        }\n        Formio.cache = {};\n        return this.makeRequest(type, reqUrl + this.query, method, data, opts);\n    }\n    /**\n     * @summary Load (GET) a document record.\n     *\n     * @param {string} type - The type of resource to fetch the index of. \"submission\", \"form\", etc.\n     * @param {object} query - A query object to pass to the request.\n     * @param {object} query.params - A map (key-value pairs) of URL query parameters to add to the url.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    load(type, query, opts) {\n        const _id = `${type}Id`;\n        const _url = `${type}Url`;\n        if (query && (0, lodash_1.isObject)(query)) {\n            query = Formio.serialize(query.params);\n        }\n        if (query) {\n            query = this.query ? `${this.query}&${query}` : `?${query}`;\n        }\n        else {\n            query = this.query;\n        }\n        if (!this[_id]) {\n            return Promise.reject(`Missing ${_id}`);\n        }\n        let url = this[_url] + query;\n        if (type === 'form' && !isNaN(parseInt(this.vId))) {\n            url += url.indexOf('?') === -1 ? '?' : '&';\n            url += `formRevision=${this.vId}`;\n        }\n        return this.makeRequest(type, url, 'get', null, opts);\n    }\n    /**\n     * @summary Call {@link Formio.makeRequest} for this Formio instance.\n     *\n     * @param {string} type - The request resource type. \"submission\", \"form\", etc.\n     * @param {string} url - The URL to request.\n     * @param {string} method - The request method. GET, PUT, POST, DELETE, or PATCH\n     * @param {object} data - The data to pass to the request (for PUT, POST, and PATCH methods)\n     * @param {object} options - An object of options to pass to the request method.\n     * @param {boolean} options.ignoreCache - To ignore internal caching of the request.\n     * @param {object} options.headers - An object of headers to pass along to the request.\n     * @param {boolean} options.noToken - If set to true, this will not include the Form.io x-jwt-token along with the request.\n     * @param {string} options.namespace - The Form.io namespace to prepend to all LocalStorage variables such as formioToken.\n     * @param {boolean} options.getHeaders - Set this if you wish to include the response headers with the return of this method.\n     * @return {Promise<Response>}\n     */\n    makeRequest(type, url, method, data, opts) {\n        return Formio.makeRequest(this, type, url, method, data, opts);\n    }\n    /**\n     * @summary Loads a project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.loadProject().then((project) => {\n     *   console.log(project);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters to pass to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    loadProject(query, opts) {\n        return this.load('project', query, opts);\n    }\n    /**\n     * Saves or Updates a project.\n     *\n     * ### Create a new project\n     * ```ts\n     * const formio = new Formio();\n     * formio.saveProject({\n     *   title: 'My Project',\n     *   path: 'myproject',\n     *   name: 'myproject'\n     * });\n     * ```\n     *\n     * ### Update an existing project\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.loadProject().then((project) => {\n     *   project.title = 'Title changed';\n     *   formio.saveProject(project).then(() => {\n     *     console.log('Done saving project!');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} data - The project JSON to create or update.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveProject(data, opts) {\n        return this.save('project', data, opts);\n    }\n    /**\n     * Deletes a project\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.deleteProject();\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    deleteProject(opts) {\n        return this.delete('project', opts);\n    }\n    /**\n     * Loads a list of all projects.\n     *\n     * ```ts\n     * Formio.loadProjects().then((projects) => {\n     *   console.log(projects);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {*}\n     */\n    static loadProjects(query, opts) {\n        query = query || '';\n        if ((0, lodash_1.isObject)(query)) {\n            query = `?${Formio.serialize(query.params)}`;\n        }\n        return Formio.makeStaticRequest(`${Formio.baseUrl}/project${query}`, 'GET', null, opts);\n    }\n    /**\n     * Loads a role within a project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/role/234234234234');\n     * formio.loadRole().then((role) => {\n     *   console.log(role);\n     * });\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    loadRole(opts) {\n        return this.load('role', null, opts);\n    }\n    /**\n     * Create a new or Update an existing role within a project.\n     *\n     * ### Create new Role example\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.saveRole({\n     *   title: 'Employee',\n     *   description: 'A person who belongs to a company.'\n     * }).then((role) => {\n     *   console.log(role);\n     * });\n     * ```\n     *\n     * ### Update existing role example\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/role/234234234234234');\n     * formio.loadRole().then((role) => {\n     *   role.title = 'Manager';\n     *   formio.saveRole(role).then(() => {\n     *     console.log('DONE');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} role - The Role JSON to create or update.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveRole(data, opts) {\n        return this.save('role', data, opts);\n    }\n    /**\n     * Deletes a role within a project.\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    deleteRole(opts) {\n        return this.delete('role', opts);\n    }\n    /**\n     * Load all roles within a project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.loadRoles().then((roles) => {\n     *   console.log(roles);\n     * });\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    loadRoles(opts) {\n        return this.index('roles', null, opts);\n    }\n    /**\n     * Loads a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.loadForm().then((form) => {\n     *   console.log(form);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    loadForm(query, opts) {\n        return this.load('form', query, opts).then((currentForm) => {\n            // Check to see if there isn't a number in vId.\n            if (!currentForm.revisions || isNaN(parseInt(this.vId))) {\n                return currentForm;\n            }\n            // If a submission already exists but form is marked to load current version of form.\n            if (currentForm.revisions === 'current' && this.submissionId) {\n                return currentForm;\n            }\n            if (currentForm._vid == this.vId || currentForm.revisionId === this.vId) {\n                return currentForm;\n            }\n            // If they specified a revision form, load the revised form components.\n            if (query && (0, lodash_1.isObject)(query)) {\n                query = Formio.serialize(query.params);\n            }\n            if (query) {\n                query = this.query ? `${this.query}&${query}` : `?${query}`;\n            }\n            else {\n                query = this.query;\n            }\n            return (this.makeRequest('form', this.vUrl + query, 'get', null, opts)\n                .then((revisionForm) => {\n                currentForm._vid = revisionForm._vid;\n                currentForm.components = revisionForm.components;\n                currentForm.settings = revisionForm.settings;\n                currentForm.revisionId = revisionForm.revisionId;\n                // Using object.assign so we don't cross polinate multiple form loads.\n                return Object.assign({}, currentForm);\n            })\n                // If we couldn't load the revision, just return the original form.\n                .catch(() => Object.assign({}, currentForm)));\n        });\n    }\n    /**\n     * Create or Update a specific form.\n     *\n     * ### Create form example\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.saveForm({\n     *   title: 'Employee',\n     *   type: 'resource',\n     *   path: 'employee',\n     *   name: 'employee',\n     *   components: [\n     *     {\n     *       type: 'textfield',\n     *       key: 'firstName',\n     *       label: 'First Name'\n     *     },\n     *     {\n     *       type: 'textfield',\n     *       key: 'lastName',\n     *       label: 'Last Name'\n     *     }\n     *   ]\n     * });\n     * ```\n     *\n     * ### Update a form example\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.loadForm().then((form) => {\n     *   form.title = 'Changed Title';\n     *   formio.saveForm(form).then(() => {\n     *     console.log('DONE!!!');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} data - The Form JSON to create or update.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveForm(data, opts) {\n        return this.save('form', data, opts);\n    }\n    /**\n     * Deletes a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.deleteForm().then(() => {\n     *   console.log('Deleted!');\n     * });\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    deleteForm(opts) {\n        return this.delete('form', opts);\n    }\n    /**\n     * Loads all forms within a project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.loadForms().then((forms) => {\n     *   console.log(forms);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    loadForms(query, opts) {\n        return this.index('forms', query, opts);\n    }\n    /**\n     * Loads a specific submissionn.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/submission/23423423423423423');\n     * formio.loadSubmission().then((submission) => {\n     *   console.log(submission);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    loadSubmission(query, opts) {\n        return this.load('submission', query, opts).then((submission) => {\n            this.vId = submission._frid || submission._fvid;\n            this.vUrl = `${this.formUrl}/v/${this.vId}`;\n            return submission;\n        });\n    }\n    /**\n     * Creates a new or Updates an existing submission.\n     *\n     * ### Create a new submission\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.saveSubmission({\n     *   data: {\n     *     firstName: 'Joe',\n     *     lastName: 'Smith'\n     *   }\n     * }).then((submission) => {\n     *   // This will now be the complete submission object saved on the server.\n     *   console.log(submission);\n     * });\n     * ```\n     *\n     * ### Update an existing submission\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/submission/23423423423423423');\n     * formio.loadSubmission().then((submission) => {\n     *   submission.data.lastName = 'Thompson';\n     *   formio.saveSubmission(submission).then(() => {\n     *     console.log('DONE');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} data - The submission JSON object.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveSubmission(data, opts) {\n        if (!isNaN(parseInt(this.vId)) && !data._fvid) {\n            data._fvid = this.vId;\n        }\n        return this.save('submission', data, opts);\n    }\n    /**\n     * Deletes a submission.\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    deleteSubmission(opts) {\n        return this.delete('submission', opts);\n    }\n    /**\n     * Loads all submissions within a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.loadSubmissions({\n     *   params: {\n     *     limit: 25,\n     *     'data.lastName__regex': 'smith'\n     *   }\n     * }).then((submissions) => {\n     *   // Should print out 25 submissions where the last name contains \"smith\".\n     *   console.log(submissions);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    loadSubmissions(query, opts) {\n        return this.index('submissions', query, opts);\n    }\n    /**\n     * Loads a form action.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/action/234234234234');\n     * formio.loadAction().then((action) => {\n     *   console.log(action);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    loadAction(query, opts) {\n        return this.load('action', query, opts);\n    }\n    /**\n     * Create a new or update an existing action.\n     *\n     * ### Create a new action for a form.\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.saveAction({\n     *   data: {\n     *     name: 'webhook',\n     *     title: 'Webhook Action',\n     *     method: ['create', 'update', 'delete'],\n     *     handler: ['after'],\n     *     condition: {},\n     *     settings: {\n     *       url: 'https://example.com',\n     *       headers: [{}],\n     *       block: false,\n     *       forwardHeaders: false\n     *     }\n     *   }\n     * }).then((action) => {\n     *   console.log(action);\n     * });\n     * ```\n     *\n     * ### Update an action\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/action/234234234234');\n     * formio.loadAction().then((action) => {\n     *   action.title = 'Updated title';\n     *   formio.saveAction(action).then(() => {\n     *     console.log('Done!');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} data - The action JSON\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveAction(data, opts) {\n        return this.save('action', data, opts);\n    }\n    /**\n     * Delete an action\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/action/234234234234');\n     * formio.deleteAction().then(() => {\n     *   console.log('Action was deleted.');\n     * });\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    deleteAction(opts) {\n        return this.delete('action', opts);\n    }\n    /**\n     * Loads all actions within a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.loadActions().then((actions) => {\n     *   console.log(actions);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    loadActions(query, opts) {\n        return this.index('actions', query, opts);\n    }\n    /**\n     * Returns a list of available actions\n     *\n     * @return {Promise<Response>}\n     */\n    availableActions() {\n        return this.makeRequest('availableActions', `${this.formUrl}/actions`);\n    }\n    /**\n     * Returns the action information for a specific action, such as \"save\".\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/actions/save');\n     * formio.actionInfo().then((info) => {\n     *   console.log(info);\n     * });\n     * ```\n     *\n     * @param {string} name - The name of the action you would like to get information for. i.e. \"save\", \"webhook\", etc.\n     * @return {Promise<Response>}\n     */\n    actionInfo(name) {\n        return this.makeRequest('actionInfo', `${this.formUrl}/actions/${name}`);\n    }\n    /**\n     * Determine if a string ID is a valid MongoID.\n     *\n     * @param {string} id - The id that should be tested if it is avalid id.\n     * @return {boolean} - true if it is a valid MongoId, false otherwise.\n     */\n    isObjectId(id) {\n        const checkForHexRegExp = new RegExp('^[0-9a-fA-F]{24}$');\n        return checkForHexRegExp.test(id);\n    }\n    /**\n     * Get the project ID of project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.getProjectId().then((projectId) => {\n     *   console.log(projectId);\n     * };\n     * ```\n     *\n     * @return {Promise<string>}\n     */\n    getProjectId() {\n        if (!this.projectId) {\n            return Promise.resolve('');\n        }\n        if (this.isObjectId(this.projectId)) {\n            return Promise.resolve(this.projectId);\n        }\n        else {\n            return this.loadProject().then((project) => {\n                return project._id;\n            });\n        }\n    }\n    /**\n     * Get the ID of a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.getFormId().then((formId) => {\n     *   console.log(formId);\n     * });\n     * ```\n     *\n     * @return {Promise<string>}\n     */\n    getFormId() {\n        if (!this.formId) {\n            return Promise.resolve('');\n        }\n        if (this.isObjectId(this.formId)) {\n            return Promise.resolve(this.formId);\n        }\n        else {\n            return this.loadForm().then((form) => {\n                return form._id;\n            });\n        }\n    }\n    /**\n     * Instance method for {@link Formio.currentUser}\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    currentUser(options) {\n        return Formio.currentUser(this, options);\n    }\n    /**\n     * Instance method for {@link Formio.accessInfo}\n     *\n     * @return {Promise<Response>}\n     */\n    accessInfo() {\n        return Formio.accessInfo(this);\n    }\n    /**\n     * Sets OAuth Logout URL.\n     *\n     * @param {string} uri - Logout URL.\n     * @param {string} options.namespace - The localStorage namespace to use when retrieving tokens from storage.\n     * @return {string}\n     */\n    oauthLogoutURI(uri, options) {\n        return Formio.oauthLogoutURI(uri, Object.assign({ formio: this }, this.options, options));\n    }\n    /**\n     * Returns the JWT token for this instance.\n     *\n     * @param {object} options - The following options are provided.\n     * @param {string} options.namespace - The localStorage namespace to use when retrieving tokens from storage.\n     * @return {string} - The JWT token for this user.\n     */\n    getToken(options) {\n        return Formio.getToken(Object.assign({ formio: this }, this.options, options));\n    }\n    /**\n     * Sets the JWT token for this instance.\n     *\n     * @param {string} token - The JWT token to set.\n     * @param {object} options - The following options are provided.\n     * @param {string} options.namespace - The localStorage namespace to use when retrieving tokens from storage.\n     * @return {string} - The JWT token that was set.\n     */\n    setToken(token, options) {\n        return Formio.setToken(token, Object.assign({ formio: this }, this.options, options));\n    }\n    /**\n     * Returns a temporary authentication token for single purpose token generation.\n     *\n     * @param {number|string} expire - The amount of seconds to wait before this temp token expires.\n     * @param {string} allowed - The allowed path string inn the format GET:/path\n     * @param {object} options - The options passed to {@link Formio#getToken}\n     */\n    getTempToken(expire, allowed, options) {\n        const token = Formio.getToken(options);\n        if (!token) {\n            return Promise.reject('You must be authenticated to generate a temporary auth token.');\n        }\n        const authUrl = Formio.authUrl || this.projectUrl;\n        return this.makeRequest('tempToken', `${authUrl}/token`, 'GET', null, {\n            ignoreCache: true,\n            header: new Headers({\n                'x-expire': expire,\n                'x-allow': allowed,\n            }),\n        });\n    }\n    /**\n     * Get a PDF download url for a submission, which will generate a new PDF of the submission. This method will first\n     * fetch a temporary download token, and then append this to the download url for this form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/submission/324234234234234');\n     * formio.getDownloadUrl().then((url) => {\n     *   console.log(url);\n     * });\n     * ```\n     *\n     * @param {object} [form] - The form JSON to fetch a download url for.\n     * @return {Promise<string>} - The download url.\n     */\n    getDownloadUrl(form) {\n        if (!this.submissionId) {\n            return Promise.resolve('');\n        }\n        if (!form) {\n            // Make sure to load the form first.\n            return this.loadForm().then((_form) => {\n                if (!_form) {\n                    return '';\n                }\n                return this.getDownloadUrl(_form);\n            });\n        }\n        let apiUrl = `/project/${form.project}`;\n        apiUrl += `/form/${form._id}`;\n        apiUrl += `/submission/${this.submissionId}`;\n        const postfix = form.submissionRevisions && form.settings.changeLog ? '/download/changelog' : '/download';\n        apiUrl += postfix;\n        let download = this.base + apiUrl;\n        return new Promise((resolve, reject) => {\n            this.getTempToken(3600, `GET:${apiUrl}`)\n                .then((tempToken) => {\n                download += `?token=${tempToken.key}`;\n                resolve(download);\n            }, () => {\n                resolve(download);\n            })\n                .catch(reject);\n        });\n    }\n    /**\n     * Returns the user permissions to a form and submission.\n     *\n     * @param user - The user or current user if undefined. For anonymous, use \"null\"\n     * @param form - The form or current form if undefined. For no form check, use \"null\"\n     * @param submission - The submisison or \"index\" if undefined.\n     *\n     * @return {{create: boolean, read: boolean, edit: boolean, delete: boolean}}\n     */\n    userPermissions(user, form, submission) {\n        return Promise.all([\n            form !== undefined ? Promise.resolve(form) : this.loadForm(),\n            user !== undefined ? Promise.resolve(user) : this.currentUser(),\n            submission !== undefined || !this.submissionId\n                ? Promise.resolve(submission)\n                : this.loadSubmission(),\n            this.accessInfo(),\n        ]).then((results) => {\n            const form = results.shift();\n            const user = results.shift() || { _id: false, roles: [] };\n            const submission = results.shift();\n            const access = results.shift();\n            const permMap = {\n                create: 'create',\n                read: 'read',\n                update: 'edit',\n                delete: 'delete',\n            };\n            const perms = {\n                user: user,\n                form: form,\n                access: access,\n                create: false,\n                read: false,\n                edit: false,\n                delete: false,\n            };\n            for (const roleName in access.roles) {\n                if (access.roles.hasOwnProperty(roleName)) {\n                    const role = access.roles[roleName];\n                    if (role.default && user._id === false) {\n                        // User is anonymous. Add the anonymous role.\n                        user.roles.push(role._id);\n                    }\n                    else if (role.admin && user.roles.indexOf(role._id) !== -1) {\n                        perms.create = true;\n                        perms.read = true;\n                        perms.delete = true;\n                        perms.edit = true;\n                        return perms;\n                    }\n                }\n            }\n            if (form && form.submissionAccess) {\n                for (let i = 0; i < form.submissionAccess.length; i++) {\n                    const permission = form.submissionAccess[i];\n                    const [perm, scope] = permission.type.split('_');\n                    if (['create', 'read', 'update', 'delete'].includes(perm)) {\n                        if ((0, lodash_1.intersection)(permission.roles, user.roles).length) {\n                            perms[permMap[perm]] =\n                                scope === 'all' || !submission || user._id === submission.owner;\n                        }\n                    }\n                }\n            }\n            // check for Group Permissions\n            if (submission) {\n                // we would anyway need to loop through components for create permission, so we'll do that for all of them\n                (0, formUtil_1.eachComponent)(form.components, (component, path) => {\n                    if (component && component.defaultPermission) {\n                        const value = (0, lodash_1.get)(submission.data, path);\n                        // make it work for single-select Group and multi-select Group\n                        const groups = Array.isArray(value) ? value : [value];\n                        groups.forEach((group) => {\n                            if (group &&\n                                group._id && // group id is present\n                                user.roles.indexOf(group._id) > -1 // user has group id in his roles\n                            ) {\n                                if (component.defaultPermission === 'read') {\n                                    perms[permMap.read] = true;\n                                }\n                                if (component.defaultPermission === 'create') {\n                                    perms[permMap.create] = true;\n                                    perms[permMap.read] = true;\n                                }\n                                if (component.defaultPermission === 'write') {\n                                    perms[permMap.create] = true;\n                                    perms[permMap.read] = true;\n                                    perms[permMap.update] = true;\n                                }\n                                if (component.defaultPermission === 'admin') {\n                                    perms[permMap.create] = true;\n                                    perms[permMap.read] = true;\n                                    perms[permMap.update] = true;\n                                    perms[permMap.delete] = true;\n                                }\n                            }\n                        });\n                    }\n                });\n            }\n            return perms;\n        });\n    }\n    /**\n     * `Determine if the current user can submit a form.\n     * @return {*}\n     */\n    canSubmit() {\n        return this.userPermissions().then((perms) => {\n            // If there is user and they cannot create, then check anonymous user permissions.\n            if (!perms.create && Formio.getUser()) {\n                return this.userPermissions(null).then((anonPerms) => {\n                    if (anonPerms.create) {\n                        Formio.setUser(null);\n                        return true;\n                    }\n                    return false;\n                });\n            }\n            return perms.create;\n        });\n    }\n    getUrlParts(url) {\n        return Formio.getUrlParts(url, this);\n    }\n    static getUrlParts(url, formio) {\n        const base = formio && formio.base ? formio.base : Formio.baseUrl;\n        let regex = '^(http[s]?:\\\\/\\\\/)';\n        if (base && url.indexOf(base) === 0) {\n            regex += `(${base.replace(/^http[s]?:\\/\\//, '')})`;\n        }\n        else {\n            regex += '([^/]+)';\n        }\n        regex += '($|\\\\/.*)';\n        return url.match(new RegExp(regex));\n    }\n    static serialize(obj, _interpolate) {\n        const str = [];\n        const interpolate = (item) => {\n            return _interpolate ? _interpolate(item) : item;\n        };\n        for (const p in obj) {\n            if (Object.prototype.hasOwnProperty.call(obj, p)) {\n                str.push(`${encodeURIComponent(p)}=${encodeURIComponent(interpolate(obj[p]))}`);\n            }\n        }\n        return str.join('&');\n    }\n    static getRequestArgs(formio, type, url, method, data, opts) {\n        method = (method || 'GET').toUpperCase();\n        if (!opts || !(0, lodash_1.isObject)(opts)) {\n            opts = {};\n        }\n        const requestArgs = {\n            url,\n            method,\n            data: data || null,\n            opts,\n        };\n        if (type) {\n            requestArgs.type = type;\n        }\n        if (formio) {\n            requestArgs.formio = formio;\n        }\n        return requestArgs;\n    }\n    static makeStaticRequest(url, method, data, opts) {\n        const requestArgs = Formio.getRequestArgs(null, '', url, method, data, opts);\n        const request = Plugins_1.default.pluginWait('preRequest', requestArgs).then(() => Plugins_1.default.pluginGet('staticRequest', requestArgs).then((result) => {\n            if ((0, lodash_1.isNil)(result)) {\n                return Formio.request(requestArgs.url, requestArgs.method, requestArgs.data, requestArgs.opts.header, requestArgs.opts);\n            }\n            return result;\n        }));\n        return Plugins_1.default.pluginAlter('wrapStaticRequestPromise', request, requestArgs);\n    }\n    /**\n     * Make an API request and wrap that request with the Form.io Request plugin system.  This is very similar to the\n     * {Formio.request} method with a difference being that it will pass the request through the Form.io request plugin.\n     *\n     * @param {Formio} formio - An instance of the Formio class.\n     * @param {string} type - The request resource type. \"submission\", \"form\", etc.\n     * @param {string} url - The URL to request.\n     * @param {string} method - The request method. GET, PUT, POST, DELETE, or PATCH\n     * @param {object} data - The data to pass to the request (for PUT, POST, and PATCH methods)\n     * @param {object} options - An object of options to pass to the request method.\n     * @param {boolean} options.ignoreCache - To ignore internal caching of the request.\n     * @param {object} options.headers - An object of headers to pass along to the request.\n     * @param {boolean} options.noToken - If set to true, this will not include the Form.io x-jwt-token along with the request.\n     * @param {string} options.namespace - The Form.io namespace to prepend to all LocalStorage variables such as formioToken.\n     * @param {boolean} options.getHeaders - Set this if you wish to include the response headers with the return of this method.\n     * @return {Promise<Response>}\n     */\n    static makeRequest(formio, type, url, method, data, opts) {\n        if (!formio) {\n            return Formio.makeStaticRequest(url, method, data, opts);\n        }\n        const requestArgs = Formio.getRequestArgs(formio, type, url, method, data, opts);\n        requestArgs.opts = requestArgs.opts || {};\n        requestArgs.opts.formio = formio;\n        //for Formio requests default Accept and Content-type headers\n        if (!requestArgs.opts.headers) {\n            requestArgs.opts.headers = {};\n        }\n        requestArgs.opts.headers = (0, lodash_1.defaults)(requestArgs.opts.headers, {\n            Accept: 'application/json',\n            'Content-type': 'application/json',\n        });\n        const request = Plugins_1.default.pluginWait('preRequest', requestArgs).then(() => Plugins_1.default.pluginGet('request', requestArgs).then((result) => {\n            if ((0, lodash_1.isNil)(result)) {\n                return Formio.request(requestArgs.url, requestArgs.method, requestArgs.data, requestArgs.opts.header, requestArgs.opts);\n            }\n            return result;\n        }));\n        return Plugins_1.default.pluginAlter('wrapRequestPromise', request, requestArgs);\n    }\n    /**\n     * Execute an API request to any external system. This is a wrapper around the Web fetch method.\n     *\n     * ```ts\n     * Formio.request('https://examples.form.io').then((form) => {\n     *   console.log(form);\n     * });\n     * ```\n     *\n     * @param {string} url - The URL to request.\n     * @param {string} method - The request method. GET, PUT, POST, DELETE, or PATCH\n     * @param {object} data - The data to pass to the request (for PUT, POST, and PATCH methods)\n     * @param {Headers} header - An object of headers to pass to the request.\n     * @param {object} options - An object of options to pass to the request method.\n     * @param {boolean} options.ignoreCache - To ignore internal caching of the request.\n     * @param {object} options.headers - An object of headers to pass along to the request.\n     * @param {boolean} options.noToken - If set to true, this will not include the Form.io x-jwt-token along with the request.\n     * @param {string} options.namespace - The Form.io namespace to prepend to all LocalStorage variables such as formioToken.\n     * @param {boolean} options.getHeaders - Set this if you wish to include the response headers with the return of this method.\n     * @return {Promise<Response>|*}\n     */\n    static request(url, method, data, header, opts) {\n        if (!url) {\n            return Promise.reject('No url provided');\n        }\n        method = (method || 'GET').toUpperCase();\n        // For reverse compatibility, if they provided the ignoreCache parameter,\n        // then change it back to the options format where that is a parameter.\n        if ((0, lodash_1.isBoolean)(opts)) {\n            opts = { ignoreCache: opts };\n        }\n        if (!opts || !(0, lodash_1.isObject)(opts)) {\n            opts = {};\n        }\n        // Generate a cachekey.\n        const cacheKey = btoa(encodeURI(url));\n        // Get the cached promise to save multiple loads.\n        if (!opts.ignoreCache && method === 'GET' && Formio.cache.hasOwnProperty(cacheKey)) {\n            return Promise.resolve(Formio.cloneResponse(Formio.cache[cacheKey]));\n        }\n        if (url[0] === '/') {\n            url = Formio.baseUrl + url;\n        }\n        // Set up and fetch request\n        const headers = header ||\n            new Headers(opts.headers || {\n                Accept: 'application/json',\n                'Content-type': 'application/json',\n            });\n        const token = Formio.getToken(opts);\n        if (token && !opts.noToken) {\n            headers.set('x-jwt-token', token);\n        }\n        // The fetch-ponyfill can't handle a proper Headers class anymore. Change it back to an object.\n        const headerObj = {};\n        headers.forEach(function (value, name) {\n            headerObj[name] = value;\n        });\n        let options = {\n            method: method,\n            headers: headerObj,\n            mode: 'cors',\n        };\n        if (data) {\n            options.body = JSON.stringify(data);\n        }\n        // Allow plugins to alter the options.\n        options = Plugins_1.default.pluginAlter('requestOptions', options, url);\n        if (options.namespace || Formio.namespace) {\n            opts.namespace = options.namespace || Formio.namespace;\n        }\n        const requestToken = options.headers['x-jwt-token'];\n        const result = Plugins_1.default.pluginAlter('wrapFetchRequestPromise', Formio.fetch(url, options), {\n            url,\n            method,\n            data,\n            opts,\n        })\n            .then((response) => {\n            // Allow plugins to respond.\n            response = Plugins_1.default.pluginAlter('requestResponse', response, Formio, data);\n            if (!response.ok) {\n                if (response.status === 440) {\n                    Formio.setToken(null, opts);\n                    Formio.events.emit('formio.sessionExpired', response.body || response);\n                }\n                else if (response.status === 401) {\n                    Formio.events.emit('formio.unauthorized', response.body || response);\n                }\n                else if (response.status === 416) {\n                    Formio.events.emit('formio.rangeIsNotSatisfiable', response.body || response);\n                }\n                else if (response.status === 504) {\n                    return Promise.reject(new Error('Network request failed'));\n                }\n                // Parse and return the error as a rejected promise to reject this promise\n                return (response.headers.get('content-type').includes('application/json')\n                    ? response.json()\n                    : response.text()).then((error) => {\n                    return Promise.reject(error);\n                });\n            }\n            // Handle fetch results\n            const respToken = response.headers.get('x-jwt-token');\n            // In some strange cases, the fetch library will return an x-jwt-token without sending\n            // one to the server. This has even been debugged on the server to verify that no token\n            // was introduced with the request, but the response contains a token. This is an Invalid\n            // case where we do not send an x-jwt-token and get one in return for any GET request.\n            let tokenIntroduced = false;\n            if (method === 'GET' &&\n                !requestToken &&\n                respToken &&\n                !opts.external &&\n                !url.includes('token=') &&\n                !url.includes('x-jwt-token=')) {\n                console.warn('Token was introduced in request.');\n                tokenIntroduced = true;\n            }\n            if (response.status >= 200 &&\n                response.status < 300 &&\n                respToken &&\n                respToken !== '' &&\n                !tokenIntroduced) {\n                Formio.setToken(respToken, Object.assign(Object.assign({}, opts), { fromCurrent: opts.fromCurrent || !!requestToken }));\n            }\n            // 204 is no content. Don't try to .json() it.\n            if (response.status === 204) {\n                return {};\n            }\n            const getResult = response.headers.get('content-type').includes('application/json')\n                ? response.json()\n                : response.text();\n            return getResult.then((result) => {\n                // Add some content-range metadata to the result here\n                let range = response.headers.get('content-range');\n                if (range && (0, lodash_1.isObject)(result)) {\n                    range = range.split('/');\n                    if (range[0] !== '*') {\n                        const skipLimit = range[0].split('-');\n                        result.skip = Number(skipLimit[0]);\n                        result.limit = skipLimit[1] - skipLimit[0] + 1;\n                    }\n                    result.serverCount = range[1] === '*' ? range[1] : Number(range[1]);\n                }\n                if (!opts.getHeaders) {\n                    return result;\n                }\n                const headers = {};\n                response.headers.forEach((item, key) => {\n                    headers[key] = item;\n                });\n                // Return the result with the headers.\n                return {\n                    result,\n                    headers,\n                };\n            });\n        })\n            .then((result) => {\n            if (opts.getHeaders) {\n                return result;\n            }\n            // Cache the response.\n            if (method === 'GET') {\n                Formio.cache[cacheKey] = result;\n            }\n            return Formio.cloneResponse(result);\n        })\n            .catch((err) => {\n            if (err === 'Bad Token' && opts.noToken !== false) {\n                Formio.setToken(null, opts);\n                Formio.events.emit('formio.badToken', err);\n            }\n            if (err.message) {\n                err = new Error(`Could not connect to API server (${err.message}): ${url}`);\n                err.networkError = true;\n            }\n            if (method === 'GET') {\n                delete Formio.cache[cacheKey];\n            }\n            return Promise.reject(err);\n        });\n        return result;\n    }\n    // Needed to maintain reverse compatability...\n    static get token() {\n        return Formio.tokens.formioToken || '';\n    }\n    // Needed to maintain reverse compatability...\n    static set token(token) {\n        Formio.tokens.formioToken = token || '';\n    }\n    static useSessionToken(options) {\n        if (typeof localStorage === 'undefined') {\n            return;\n        }\n        const namespace = options;\n        if (typeof options === 'object') {\n            options = options.namespace;\n        }\n        const tokenName = `${namespace || Formio.namespace || 'formio'}Token`;\n        const token = localStorage.getItem(tokenName);\n        if (token) {\n            localStorage.removeItem(tokenName);\n            sessionStorage.setItem(tokenName, token);\n        }\n        const userName = `${namespace || Formio.namespace || 'formio'}User`;\n        const user = localStorage.getItem(userName);\n        if (user) {\n            localStorage.removeItem(userName);\n            sessionStorage.setItem(userName, user);\n        }\n        localStorage.setItem('useSessionToken', 'true');\n    }\n    /**\n     * Sets the JWT in storage to be used within an application.\n     *\n     * @param {string} token - The JWT token to set.\n     * @param {object} options - Options as follows\n     * @param {string} options.namespace - The namespace to save the token within. i.e. \"formio\"\n     * @param {Formio} options.formio - The Formio instance.\n     * @return {Promise<object>|void}\n     */\n    static setToken(token = '', opts = {}) {\n        token = token || '';\n        opts = typeof opts === 'string' ? { namespace: opts } : opts || {};\n        const tokenName = `${opts.namespace || Formio.namespace || 'formio'}Token`;\n        if (!Formio.tokens) {\n            Formio.tokens = {};\n        }\n        const storage = localStorage.getItem('useSessionToken') ? sessionStorage : localStorage;\n        if (!token) {\n            if (!opts.fromUser) {\n                opts.fromToken = true;\n                Formio.setUser(null, opts);\n            }\n            // iOS in private browse mode will throw an error but we can't detect ahead of time that we are in private mode.\n            try {\n                storage.removeItem(tokenName);\n            }\n            catch (ignoreErr) {\n                browser_cookies_1.default.erase(tokenName, { path: '/' });\n            }\n            Formio.tokens[tokenName] = token;\n            return Promise.resolve(null);\n        }\n        if (Formio.tokens[tokenName] !== token) {\n            Formio.tokens[tokenName] = token;\n            // iOS in private browse mode will throw an error but we can't detect ahead of time that we are in private mode.\n            try {\n                storage.setItem(tokenName, token);\n            }\n            catch (ignoreErr) {\n                browser_cookies_1.default.set(tokenName, token, { path: '/' });\n            }\n        }\n        // Return or updates the current user\n        return Formio.currentUser(opts.formio, opts);\n    }\n    /**\n     * Returns the token set within the application for the user.\n     *\n     * @param {object} options - The options as follows.\n     * @param {string} options.namespace - The namespace of the token you wish to fetch.\n     * @param {boolean} options.decode - If you would like the token returned as decoded JSON.\n     * @return {*}\n     */\n    static getToken(options) {\n        options = typeof options === 'string' ? { namespace: options } : options || {};\n        const tokenName = `${options.namespace || Formio.namespace || 'formio'}Token`;\n        const decodedTokenName = options.decode ? `${tokenName}Decoded` : tokenName;\n        if (!Formio.tokens) {\n            Formio.tokens = {};\n        }\n        if (Formio.tokens[decodedTokenName]) {\n            return Formio.tokens[decodedTokenName];\n        }\n        try {\n            const token = localStorage.getItem('useSessionToken')\n                ? sessionStorage.getItem(tokenName)\n                : localStorage.getItem(tokenName);\n            Formio.tokens[tokenName] = token || '';\n            if (options.decode) {\n                Formio.tokens[decodedTokenName] = Formio.tokens[tokenName]\n                    ? (0, jwtDecode_1.jwtDecode)(Formio.tokens[tokenName])\n                    : {};\n                return Formio.tokens[decodedTokenName];\n            }\n            return Formio.tokens[tokenName];\n        }\n        catch (ignoreError) {\n            Formio.tokens[tokenName] = browser_cookies_1.default.get(tokenName);\n            return '';\n        }\n    }\n    /**\n     * Sets the current user within the application cache.\n     *\n     * @param {object} user - JSON object of the user you wish to set.\n     * @param {object} options - Options as follows\n     * @param {string} options.namespace - The namespace of the tokens\n     */\n    static setUser(user, opts = {}) {\n        const userName = `${opts.namespace || Formio.namespace || 'formio'}User`;\n        const storage = localStorage.getItem('useSessionToken') ? sessionStorage : localStorage;\n        if (!user) {\n            if (!opts.fromToken) {\n                opts.fromUser = true;\n                Formio.setToken(null, opts);\n            }\n            // Emit an event on the cleared user.\n            Formio.events.emit('formio.user', null);\n            // iOS in private browse mode will throw an error but we can't detect ahead of time that we are in private mode.\n            try {\n                return storage.removeItem(userName);\n            }\n            catch (ignoreError) {\n                return browser_cookies_1.default.erase(userName, { path: '/' });\n            }\n        }\n        // iOS in private browse mode will throw an error but we can't detect ahead of time that we are in private mode.\n        try {\n            storage.setItem(userName, JSON.stringify(user));\n        }\n        catch (ignoreError) {\n            browser_cookies_1.default.set(userName, JSON.stringify(user), { path: '/' });\n        }\n        // Emit an event on the authenticated user.\n        Formio.events.emit('formio.user', user);\n    }\n    /**\n     * Returns the user JSON.\n     *\n     * @param {object} options - Options as follows\n     * @param {string} namespace - The namespace of the tokens stored within this application.\n     * @return {object} - The user object.\n     */\n    static getUser(options) {\n        options = options || {};\n        const userName = `${options.namespace || Formio.namespace || 'formio'}User`;\n        try {\n            return JSON.parse((localStorage.getItem('useSessionToken') ? sessionStorage : localStorage).getItem(userName) || '');\n        }\n        catch (ignoreError) {\n            return JSON.parse(browser_cookies_1.default.get(userName));\n        }\n    }\n    /**\n     * Sets the BaseURL for the application.\n     *\n     * @description Every application developed using the JavaScript SDK must set both the {@link Formio.setBaseUrl} and\n     * {@link Formio.setProjectUrl} methods. These two functions ensure that every URL passed into the constructor of this\n     * class can determine the \"project\" context for which the application is running.\n     *\n     * Any Open Source server applications will set both the {@link Formio.setBaseUrl} and {@link Formio.setProjectUrl}\n     * values will be the same value.\n     *\n     * ```ts\n     * Formio.setBaseUrl('https://yourwebsite.com/forms');\n     * Formio.setProjectUrl('https://yourwebsite.com/forms/project');\n     *\n     * // Now the Formio constructor will know what is the \"project\" and what is the form alias name. Without setBaseUrl\n     * // and setProjectUrl, this would throw an error.\n     *\n     * const formio = new Formio('https://yourwebsite.com/forms/project/user');\n     * formio.loadForm().then((form) => {\n     *   console.log(form);\n     * });\n     * ```\n     *\n     * @param {string} url - The URL of the Base API url.\n     */\n    static setBaseUrl(url) {\n        Formio.baseUrl = url;\n        if (!Formio.projectUrlSet) {\n            Formio.projectUrl = url;\n        }\n    }\n    /**\n     * Returns the current base url described at {@link Formio.setBaseUrl}\n     *\n     * @return {string} - The base url of the application.\n     */\n    static getBaseUrl() {\n        return Formio.baseUrl;\n    }\n    static setApiUrl(url) {\n        return Formio.setBaseUrl(url);\n    }\n    static getApiUrl() {\n        return Formio.getBaseUrl();\n    }\n    static setAppUrl(url) {\n        console.warn('Formio.setAppUrl() is deprecated. Use Formio.setProjectUrl instead.');\n        Formio.projectUrl = url;\n        Formio.projectUrlSet = true;\n    }\n    /**\n     * Sets the Project Url for the application. This is an important method that needs to be set for all applications. It\n     * is documented @ {@link Formio.setBaseUrl}.\n     *\n     * @param {string} url - The project api url.\n     */\n    static setProjectUrl(url) {\n        Formio.projectUrl = url;\n        Formio.projectUrlSet = true;\n    }\n    /**\n     * The Auth URL can be set to customize the authentication requests made from an application. By default, this is\n     * just the same value as {@link Formio.projectUrl}\n     *\n     * @param {string} url - The authentication url\n     */\n    static setAuthUrl(url) {\n        Formio.authUrl = url;\n    }\n    static getAppUrl() {\n        console.warn('Formio.getAppUrl() is deprecated. Use Formio.getProjectUrl instead.');\n        return Formio.projectUrl;\n    }\n    /**\n     * Returns the Project url described at {@link Formio.setProjectUrl}\n     *\n     * @return {string|string} - The Project Url.\n     */\n    static getProjectUrl() {\n        return Formio.projectUrl;\n    }\n    /**\n     * Clears the runtime internal API cache.\n     *\n     * @description By default, the Formio class will cache all API requests in memory so that any subsequent requests\n     * using GET method will return the cached results as long as the API URl is the same as what was cached previously.\n     * This cache can be cleared using this method as follows.\n     *\n     * ```ts\n     * Formio.clearCache();\n     * ```\n     *\n     * Or, if you just wish to clear a single request, then the {@link Formio.request#options.ignoreCache} option can be\n     * provided when making an API request as follows.\n     *\n     * ```ts\n     * Formio.loadForm({}, {\n     *   ignoreCache: true\n     * }).then((form) => {\n     *   console.log(form);\n     * });\n     * ```\n     *\n     * Both of the following will ensure that a new request is made to the API server and that the results will not be\n     * from the cached result.\n     */\n    static clearCache() {\n        Formio.cache = {};\n    }\n    /**\n     * Return the access information about a Project, such as the Role ID's for that project, and if the server is\n     * configured to do so, the Form and Resource access configurations that the authenticated user has access to.\n     *\n     * @description This is useful for an application to determine the UI for a specific user to identify which forms they have\n     * access to submit or read.\n     *\n     * @param {Formio} formio - The Formio instance.\n     * @return {Promise<Response>}\n     */\n    static accessInfo(formio) {\n        const projectUrl = formio ? formio.projectUrl : Formio.projectUrl;\n        return Formio.makeRequest(formio, 'accessInfo', `${projectUrl}/access`);\n    }\n    /**\n     * Returns an array of roles for the project, which includes the ID's and names of those roles.\n     *\n     * @param {Formio} formio - The Formio instance.\n     * @return {Promise<Response>}\n     */\n    static projectRoles(formio) {\n        const projectUrl = formio ? formio.projectUrl : Formio.projectUrl;\n        return Formio.makeRequest(formio, 'projectRoles', `${projectUrl}/role`);\n    }\n    /**\n     * Return the currentUser object. This will fetch the user from the server and respond with the Submission JSON\n     * of that user object.\n     *\n     * @param {Formio} formio - The Formio instance\n     * @param {object} options - The options passed to {@link Formio.getUser}\n     * @return {Promise<R>|*}\n     */\n    static currentUser(formio, options = {}) {\n        let authUrl = Formio.authUrl;\n        if (!authUrl) {\n            authUrl = formio ? formio.projectUrl : Formio.projectUrl || Formio.baseUrl;\n        }\n        authUrl += '/current';\n        if (!options.ignoreCache || options.fromCurrent) {\n            const user = Formio.getUser(options);\n            if (user) {\n                return Plugins_1.default.pluginAlter('wrapStaticRequestPromise', Promise.resolve(user), {\n                    url: authUrl,\n                    method: 'GET',\n                    options,\n                });\n            }\n        }\n        const token = Formio.getToken(options);\n        if ((!options || !options.external) && !token) {\n            return Plugins_1.default.pluginAlter('wrapStaticRequestPromise', Promise.resolve(null), {\n                url: authUrl,\n                method: 'GET',\n                options,\n            });\n        }\n        options.fromCurrent = true;\n        return Formio.makeRequest(formio, 'currentUser', authUrl, 'GET', null, options).then((response) => {\n            Formio.setUser(response, options);\n            return response;\n        });\n    }\n    /**\n     * Performs a logout of the Form.io application. This will reset all cache, as well as make a request to the logout\n     * endpoint of the Form.io api platform.\n     *\n     * @param {Formio} formio - A Formio instance.\n     * @param {object} options - Options passed to both {@link Formio.setToken} as well as {@link Formio.setUser}\n     * @return {Promise<Response>}\n     */\n    static logout(formio, options = {}) {\n        options.formio = formio;\n        const projectUrl = Formio.authUrl\n            ? Formio.authUrl\n            : formio\n                ? formio.projectUrl\n                : Formio.baseUrl;\n        const logout = () => {\n            Formio.setToken(null, options);\n            Formio.setUser(null, options);\n            Formio.clearCache();\n            localStorage.removeItem('useSessionToken');\n        };\n        return Formio.makeRequest(formio, 'logout', `${projectUrl}/logout`)\n            .then(function (result) {\n            logout();\n            if (result.shouldRedirect && result.url) {\n                window.location.href = result.url;\n            }\n            return result;\n        })\n            .catch(function (err) {\n            logout();\n            throw err;\n        });\n    }\n    /**\n     * Returns the query passed to a page in JSON object format.\n     *\n     * @description For example, lets say you visit your application using\n     * the url as follows.\n     *\n     * ```\n     *   https://yourapplication.com/?token=23423423423&username=Joe\n     * ```\n     *\n     * The following code will provide your application with the following.\n     *\n     * ```ts\n     * const query Formio.pageQuery();\n     * console.log(query.token); // Will print 23423423423\n     * console.log(query.username); // Will print Joe\n     * ```\n     *\n     * @return {{}} - A JSON object representation of the query that was passed to the URL of an application.\n     */\n    static pageQuery() {\n        const pageQuery = {};\n        pageQuery.paths = [];\n        const hashes = location.hash.substr(1).replace(/\\?/g, '&').split('&');\n        let parts = [];\n        location.search\n            .substr(1)\n            .split('&')\n            .forEach(function (item) {\n            parts = item.split('=');\n            if (parts.length > 1) {\n                pageQuery[parts[0]] = parts[1] && decodeURIComponent(parts[1]);\n            }\n        });\n        hashes.forEach(function (item) {\n            parts = item.split('=');\n            if (parts.length > 1) {\n                pageQuery[parts[0]] = parts[1] && decodeURIComponent(parts[1]);\n            }\n            else if (item.indexOf('/') === 0) {\n                pageQuery.paths = item.substr(1).split('/');\n            }\n        });\n        return pageQuery;\n    }\n    /**\n     * Much like {@link Formio.currentUser}, but instead automatically injects the Bearer tokens into the headers to\n     * perform a Token swap of the OAuth token which will then return the JWT token for that user.\n     *\n     * @param {Formio} formio - The Formio instance\n     * @param {string} token - An OAuth Bearer token to use for a token swap between the OAuth provider and Form.io\n     * @return {Promise<R>|*}\n     */\n    static oAuthCurrentUser(formio, token) {\n        return Formio.currentUser(formio, {\n            external: true,\n            headers: {\n                Authorization: `Bearer ${token}`,\n            },\n        });\n    }\n    static oauthLogoutURI(uri, options) {\n        options = typeof options === 'string' ? { namespace: options } : options || {};\n        const logoutURIName = `${options.namespace || Formio.namespace || 'formio'}LogoutAuthUrl`;\n        localStorage.setItem(logoutURIName, uri);\n        return Formio.tokens[logoutURIName];\n    }\n    /**\n     * Perform a SAML initialization.\n     *\n     * @description Typically, you would use the {@link Formio.ssoInit} method to perform this function\n     * since this method is an alias for the following.\n     *\n     * ```ts\n     * Formio.samlInit();\n     * Formio.ssoInit('saml');  // This is the exact same thing as calling Formio.samlInit\n     * ```\n     *\n     * This method will return false if the process is just starting. The code below is a typical block of code that is\n     * used to automatically trigger the SAML authentication process within your application using a Button component.\n     *\n     * ```ts\n     * if (Formio.pageQuery().saml) {\n     *   const sso = Formio.samlInit();\n     *   if (sso) {\n     *     sso.then((user) => {\n     *       // The SSO user is now loaded!\n     *       console.log(user);\n     *     });\n     *   }\n     * }\n     * ```\n     *\n     * You can then place the following code withiin the \"Custom\" action of a Button component on your form.\n     *\n     * ```ts\n     * Formio.samlInit();\n     * ```\n     *\n     * Now when you click on this button, it will start the handshake process with SAML, and once it returns, will pass\n     * a \"saml\" query parameter back to your application which will execute the code to load the current user from SAML.\n     *\n     * @param {object} options - Options to pass to the SAML initialization process.\n     * @param {string} options.relay - The URL that will be used as the authentication \"relay\" that occurs during a SAML handshake process.\n     * @return {boolean|Promise<Object>|void}\n     */\n    static samlInit(options = {}) {\n        const query = Formio.pageQuery();\n        if (query.saml) {\n            Formio.setUser(null);\n            const retVal = Formio.setToken(query.saml);\n            let uri = window.location.toString();\n            uri = uri.substring(0, uri.indexOf('?'));\n            if (window.location.hash) {\n                uri += window.location.hash;\n            }\n            window.history.replaceState({}, document.title, uri);\n            return retVal;\n        }\n        // Set the relay if not provided.\n        if (!options.relay) {\n            options.relay = window.location.href;\n        }\n        // go to the saml sso endpoint for this project.\n        const authUrl = Formio.authUrl || Formio.projectUrl;\n        window.location.href = `${authUrl}/saml/sso?relay=${encodeURI(options.relay)}`;\n        return false;\n    }\n    /**\n     * Perform an Okta Authentication process using the {@link https://developer.okta.com/code/javascript/okta_auth_sdk|Okta SDK}.\n     *\n     * @description This method does require that you first include the Okta JavaScript SDK within your application as follows.\n     *\n     * First you need to include the Okta Authentication script.\n     *\n     * ```html\n     * <script src=\"https://ok1static.oktacdn.com/assets/js/sdk/okta-auth-js/2.0.1/okta-auth-js.min.js\" type=\"text/javascript\"></script>\n     * ```\n     *\n     * Then you can call this method as follows.\n     *\n     * ```ts\n     * Formio.oktaInit();\n     * ```\n     *\n     * @param {object} options - Options that are passed directly to the {@link https://github.com/okta/okta-auth-js#configuration-reference|Okta SDK constructor}\n     * @param {constructor} options.OktaAuth - If the OktaAuth constructor is not provided global to the application, it can be provided to this method using this property.\n     * @param {Formio} options.formio - The Formio instance.\n     * @param {Array<string>} options.scopes - Scopes that are passed to the {@link https://github.com/okta/okta-auth-js#tokengetwithredirectoptions|getWithRedirect} method from the Okta SDK.\n     * @return {Promise<Object>}\n     */\n    static oktaInit(options = {}) {\n        if (typeof OktaAuth !== 'undefined') {\n            options.OktaAuth = OktaAuth;\n        }\n        if (typeof options.OktaAuth === 'undefined') {\n            const errorMessage = 'Cannot find OktaAuth. Please include the Okta JavaScript SDK within your application. See https://developer.okta.com/code/javascript/okta_auth_sdk for an example.';\n            console.warn(errorMessage);\n            return Promise.reject(errorMessage);\n        }\n        return new Promise((resolve, reject) => {\n            const Okta = options.OktaAuth;\n            delete options.OktaAuth;\n            const authClient = new Okta(options);\n            authClient.tokenManager\n                .get('accessToken')\n                .then((accessToken) => {\n                if (accessToken) {\n                    resolve(Formio.oAuthCurrentUser(options.formio, accessToken.accessToken));\n                }\n                else if (location.hash) {\n                    authClient.token\n                        .parseFromUrl()\n                        .then((token) => {\n                        authClient.tokenManager.add('accessToken', token);\n                        resolve(Formio.oAuthCurrentUser(options.formio, token.accessToken));\n                    })\n                        .catch((err) => {\n                        console.warn(err);\n                        reject(err);\n                    });\n                }\n                else {\n                    authClient.token.getWithRedirect({\n                        responseType: 'token',\n                        scopes: options.scopes,\n                    });\n                    resolve(false);\n                }\n            })\n                .catch((error) => {\n                reject(error);\n            });\n        });\n    }\n    /**\n     * A common static method to trigger any SSO processes. This method is really just an alias for other static methods.\n     *\n     * @param {('saml'|'okta')} type - The type of SSO to trigger. 'saml' is an alias for {@link Formio.samlInit}, and 'okta' is an alias for {@link Formio.oktaInit}.\n     * @param {object} options - Options to pass to the specific sso methods\n     * @return {*|Promise<Object>|boolean|void}\n     */\n    static ssoInit(type, options = {}) {\n        switch (type) {\n            case 'saml':\n                return Formio.samlInit(options);\n            case 'okta':\n                return Formio.oktaInit(options);\n            default:\n                console.warn('Unknown SSO type');\n                return Promise.reject('Unknown SSO type');\n        }\n    }\n    /**\n     * Lazy load a remote library dependency.\n     *\n     * @description This is useful for components that wish to lazy load a required library\n     * by adding that library to the <scripts> section of the HTML webpage, and then provide a promise that will resolve\n     * when the library becomes available for use.\n     *\n     * @example Load Google Maps API.\n     * ```ts\n     * Formio.requireLibrary('googleMaps', 'google.maps.Map', 'https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap', true).then(() => {\n     *   // Once the promise resolves, the following can now be used within your application.\n     *   const map = new google.maps.Map(document.getElementById(\"map\"), {...});\n     * });\n     * ```\n     *\n     * @param {string} name - The internal name to give to the library you are loading. This is useful for caching the library for later use.\n     * @param {string} property - The name of the global property that will be added to the global namespace once the library has been loaded. This is used to check to see if the property exists before resolving the promise that the library is ready for use.\n     * @param {string} src - The URL of the library to lazy load.\n     * @param {boolean} polling - Determines if polling should be used to determine if they library is ready to use. If set to false, then it will rely on a global callback called ${name}Callback where \"name\" is the first property passed to this method. When this is called, that will indicate when the library is ready. In most cases, you will want to pass true to this parameter to initiate a polling method to check for the library availability in the global context.\n     * @param {HTMLElement} rootElement - The element after which the resource would be attached (useful when requiring resources from ShadowRoot).\n     * @return {Promise<object>} - A promise that will resolve when the plugin is ready to be used.\n     */\n    static requireLibrary(name, property, src, polling = false, onload, rootElement) {\n        const resourceToDomOptions = {\n            name,\n            src,\n            formio: Formio,\n            onload,\n            rootElement,\n        };\n        let hasResourceBeenAdded = false;\n        if (!Formio.libraries.hasOwnProperty(name)) {\n            Formio.libraries[name] = {};\n            Formio.libraries[name].ready = new Promise((resolve, reject) => {\n                Formio.libraries[name].resolve = resolve;\n                Formio.libraries[name].reject = reject;\n            });\n            const callbackName = `${name}Callback`;\n            if (!polling && !window[callbackName]) {\n                window[callbackName] = () => Formio.libraries[name].resolve();\n            }\n            // See if the plugin already exists.\n            const plugin = (0, lodash_1.get)(window, property);\n            if (plugin) {\n                Formio.libraries[name].resolve(plugin);\n            }\n            else {\n                (0, utils_1.attachResourceToDom)(resourceToDomOptions);\n                hasResourceBeenAdded = true;\n                // if no callback is provided, then check periodically for the script.\n                if (polling) {\n                    const interval = setInterval(() => {\n                        const plugin = (0, lodash_1.get)(window, property);\n                        if (plugin) {\n                            clearInterval(interval);\n                            Formio.libraries[name].resolve(plugin);\n                        }\n                    }, 200);\n                }\n            }\n        }\n        const lib = Formio.libraries[name];\n        if (rootElement && !hasResourceBeenAdded) {\n            (0, utils_1.attachResourceToDom)(resourceToDomOptions);\n        }\n        return onload && lib.loaded ? onload(lib.ready) : lib.ready;\n    }\n    /**\n     * Determines if a lazy loaded library is ready to be used.\n     *\n     * @description Example: Let's assume that the example provided at {@link Formio.requireLibrary} was used elsewhere in your application.\n     * You could now use the following within a separate place that will also resolve once the library is ready to be used.\n     *\n     * ```js\n     * Formio.libraryReady('googleMaps').then(() => {\n     *   // Once the promise resolves, the following can now be used within your application.\n     *   const map = new google.maps.Map(document.getElementById(\"map\"), {...});\n     * });\n     * ```\n     *\n     * @param {string} name - The name of the library to check.\n     * @return {Promise<object>} - A promise that will resolve when the library is ready to be used.\n     */\n    static libraryReady(name) {\n        if (Formio.libraries.hasOwnProperty(name) && Formio.libraries[name].ready) {\n            return Formio.libraries[name].ready;\n        }\n        return Promise.reject(`${name} library was not required.`);\n    }\n    /**\n     * Clones the response from the API so that it cannot be mutated.\n     *\n     * @param response\n     */\n    static cloneResponse(response) {\n        const copy = (0, fastCloneDeep_1.fastCloneDeep)(response);\n        if (Array.isArray(response)) {\n            copy.skip = response.skip;\n            copy.limit = response.limit;\n            copy.serverCount = response.serverCount;\n        }\n        return copy;\n    }\n    /**\n     * Sets the project path type.\n     *\n     * @param type\n     */\n    static setPathType(type) {\n        if (typeof type === 'string') {\n            Formio.pathType = type;\n        }\n    }\n    /**\n     * Gets the project path type.\n     */\n    static getPathType() {\n        return Formio.pathType;\n    }\n}\nexports.Formio = Formio;\n/**\n * The base API url of the Form.io Platform. Example: https://api.form.io\n */\nFormio.baseUrl = 'https://api.form.io';\n/**\n * The project API url of the Form.io Project. Example: https://examples.form.io\n */\nFormio.projectUrl = '';\n/**\n * The project url to use for Authentication.\n */\nFormio.authUrl = '';\n/**\n * Set to true if the project url has been established with ```Formio.setProjectUrl()```\n */\nFormio.projectUrlSet = false;\n/**\n * The Form.io API Cache. This ensures that requests to the same API endpoint are cached.\n */\nFormio.cache = {};\n/**\n * The namespace used to save the Form.io Token's and variables within an application.\n */\nFormio.namespace = '';\n/**\n * Handles events fired within this SDK library.\n */\nFormio.events = new eventemitter3_1.default();\n/**\n * Stores all of the libraries lazy loaded with ```Formio.requireLibrary``` method.\n */\nFormio.libraries = {};\n/**\n * A direct interface to the Form.io fetch polyfill.\n */\nFormio.fetch = fetch;\n/**\n * A direct interface to the Form.io fetch Headers polyfill.\n */\nFormio.Headers = Headers;\n/**\n * All of the auth tokens for this session.\n */\nFormio.tokens = {};\n/**\n * The version of this library.\n */\nFormio.version = '---VERSION---';\n/**\n * The global options for the Formio library.\n */\nFormio.options = {};\n// Add Plugin methods.\nFormio.plugins = Plugins_1.default.plugins;\nFormio.deregisterPlugin = Plugins_1.default.deregisterPlugin;\nFormio.registerPlugin = Plugins_1.default.registerPlugin;\nFormio.getPlugin = Plugins_1.default.getPlugin;\nFormio.pluginWait = Plugins_1.default.pluginWait;\nFormio.pluginGet = Plugins_1.default.pluginGet;\nFormio.pluginAlter = Plugins_1.default.pluginAlter;\n// Adds Formio to the Plugins Interface.\nPlugins_1.default.Formio = Formio;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/sdk/Formio.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Formio = exports.FormioPathType = void 0;\nconst fetch_ponyfill_1 = __importDefault(__webpack_require__(/*! fetch-ponyfill */ \"./node_modules/fetch-ponyfill/build/fetch-browser.js\"));\nconst fastCloneDeep_1 = __webpack_require__(/*! ../utils/fastCloneDeep */ \"./node_modules/@formio/core/lib/utils/fastCloneDeep.js\");\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst formUtil_1 = __webpack_require__(/*! ../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst jwtDecode_1 = __webpack_require__(/*! ../utils/jwtDecode */ \"./node_modules/@formio/core/lib/utils/jwtDecode.js\");\nconst eventemitter3_1 = __importDefault(__webpack_require__(/*! eventemitter3 */ \"./node_modules/eventemitter3/index.js\"));\nconst browser_cookies_1 = __importDefault(__webpack_require__(/*! browser-cookies */ \"./node_modules/browser-cookies/src/browser-cookies.js\"));\nconst { fetch, Headers } = (0, fetch_ponyfill_1.default)();\nconst Plugins_1 = __importDefault(__webpack_require__(/*! ./Plugins */ \"./node_modules/@formio/core/lib/sdk/Plugins.js\"));\nconst utils_1 = __webpack_require__(/*! ../utils */ \"./node_modules/@formio/core/lib/utils/index.js\");\n/**\n * The different path types for a project.\n */\nvar FormioPathType;\n(function (FormioPathType) {\n    FormioPathType[\"Subdirectories\"] = \"Subdirectories\";\n    FormioPathType[\"Subdomains\"] = \"Subdomains\";\n})(FormioPathType || (exports.FormioPathType = FormioPathType = {}));\n/**\n * The Formio interface class. This is a minimalistic API library that allows you to work with the Form.io API's within JavaScript.\n *\n * ## Usage\n * Creating an instance of Formio is simple, and takes only a path (URL String). The path can be different, depending on the desired output.\n * The Formio instance can also access higher level operations, depending on how granular of a path you start with.\n *\n * ```ts\n * var formio = new Formio(<endpoint>, [options]);\n * ```\n *\n * Where **endpoint** is any valid API endpoint within Form.io. These URL's can provide a number of different methods depending on the granularity of the endpoint. This allows you to use the same interface but have access to different methods depending on how granular the endpoint url is.\n * **options** is defined within the {link Formio.constructor} documentation.\n *\n * Here is an example of how this library can be used to load a form JSON from the Form.io API's\n *\n * ```ts\n * const formio = new Formio('https://examples.form.io/example');\n * formio.loadForm().then((form) => {\n *   console.log(form);\n * });\n * ```\n */\nclass Formio {\n    /**\n     * @constructor\n     * @param {string} path - A project, form, and submission API Url.\n     * @param {FormioOptions} options - Available options to configure the Javascript API.\n     */\n    constructor(path, options = {}) {\n        this.path = path;\n        this.options = options;\n        /**\n         * The base API url of the Form.io Platform. Example: https://api.form.io\n         */\n        this.base = '';\n        /**\n         * The Projects Endpoint derived from the provided source.\n         *\n         * @example https://api.form.io/project\n         */\n        this.projectsUrl = '';\n        /**\n         * A specific project endpoint derived from the provided source.\n         *\n         * @example https://examples.form.io\n         */\n        this.projectUrl = '';\n        /**\n         * The Project ID found within the provided source.\n         */\n        this.projectId = '';\n        /**\n         * A specific Role URL provided the source.\n         *\n         * @example https://examples.form.io/role/2342343234234234\n         */\n        this.roleUrl = '';\n        /**\n         * The roles endpoint derived from the provided source.\n         *\n         * @example https://examples.form.io/role\n         */\n        this.rolesUrl = '';\n        /**\n         * The roleID derieved from the provided source.\n         */\n        this.roleId = '';\n        /**\n         * A specific form url derived from the provided source.\n         *\n         * @example https://examples.form.io/example\n         */\n        this.formUrl = '';\n        /**\n         * The forms url derived from the provided source.\n         *\n         * @example https://example.form.io/form\n         */\n        this.formsUrl = '';\n        /**\n         * The Form ID derived from the provided source.\n         */\n        this.formId = '';\n        /**\n         * The submissions URL derived from the provided source.\n         *\n         * @example https://examples.form.io/example/submission\n         */\n        this.submissionsUrl = '';\n        /**\n         * A specific submissions URL derived from a provided source.\n         *\n         * @example https://examples.form.io/example/submission/223423423423\n         */\n        this.submissionUrl = '';\n        /**\n         * The submission ID provided a submission url.\n         */\n        this.submissionId = '';\n        /**\n         * The actions url provided a form url as the source.\n         *\n         * @example https://examples.form.io/example/action\n         */\n        this.actionsUrl = '';\n        /**\n         * The Action ID derived from a provided Action url.\n         */\n        this.actionId = '';\n        /**\n         * A specific action api endoint.\n         */\n        this.actionUrl = '';\n        this.vsUrl = '';\n        this.vId = '';\n        this.vUrl = '';\n        /**\n         * The query string derived from the provided src url.\n         */\n        this.query = '';\n        /**\n         * If this is a non-project url, such is the case for Open Source API.\n         */\n        this.noProject = false;\n        // Ensure we have an instance of Formio.\n        if (!(this instanceof Formio)) {\n            return new Formio(path);\n        }\n        if (options.useSessionToken) {\n            Formio.useSessionToken(options);\n        }\n        if (options.hasOwnProperty('base') && options.base) {\n            this.base = options.base;\n        }\n        else if (Formio.baseUrl) {\n            this.base = Formio.baseUrl;\n        }\n        else if (window && window.location) {\n            const match = window.location.href.match(/http[s]?:\\/\\/api./);\n            this.base = match ? match[0] : window.location.origin;\n        }\n        if (!path) {\n            // Allow user to create new projects if this was instantiated without\n            // a url\n            this.projectUrl = Formio.projectUrl || `${this.base}/project`;\n            this.projectsUrl = `${this.base}/project`;\n            this.projectId = '';\n            this.query = '';\n            return;\n        }\n        if (options.hasOwnProperty('project') && options.project) {\n            this.projectUrl = options.project;\n        }\n        const project = this.projectUrl || Formio.projectUrl;\n        const projectRegEx = /(^|\\/)(project)($|\\/[^/]+)/;\n        const isProjectUrl = path.search(projectRegEx) !== -1;\n        // The baseURL is the same as the projectUrl, and does not contain \"/project/MONGO_ID\" in\n        // its domain. This is almost certainly against the Open Source server.\n        if (project && this.base === project && !isProjectUrl) {\n            this.noProject = true;\n            this.projectUrl = this.base;\n        }\n        // Normalize to an absolute path.\n        if (path.indexOf('http') !== 0 && path.indexOf('//') !== 0) {\n            path = this.base + path;\n        }\n        const hostparts = this.getUrlParts(path);\n        let hostName = '';\n        let parts = [];\n        if (hostparts) {\n            hostName = hostparts[1] + hostparts[2];\n            path = hostparts.length > 3 ? hostparts[3] : '';\n            const queryparts = path.split('?');\n            if (queryparts.length > 1) {\n                path = queryparts[0];\n                this.query = `?${queryparts[1]}`;\n            }\n        }\n        // Register a specific path.\n        const registerPath = (name, base) => {\n            this[`${name}sUrl`] = `${base}/${name}`;\n            const regex = new RegExp(`/${name}/([^/]+)`);\n            if (path && path.search(regex) !== -1) {\n                parts = path.match(regex);\n                this[`${name}Url`] = parts ? base + parts[0] : '';\n                this[`${name}Id`] = parts.length > 1 ? parts[1] : '';\n                base += parts[0];\n            }\n            return base;\n        };\n        // Register an array of items.\n        const registerItems = (items, base, staticBase) => {\n            for (const i in items) {\n                if (items.hasOwnProperty(i)) {\n                    const item = items[i];\n                    if (Array.isArray(item)) {\n                        registerItems(item, base, true);\n                    }\n                    else {\n                        const newBase = registerPath(item, base);\n                        base = staticBase ? base : newBase;\n                    }\n                }\n            }\n        };\n        if (!this.projectUrl || this.projectUrl === this.base) {\n            // If a project uses Subdirectories path type, we need to specify a projectUrl\n            if (!this.projectUrl && !isProjectUrl && Formio.pathType === 'Subdirectories') {\n                const regex = `^${hostName.replace(/\\//g, '\\\\/')}.[^/]+`;\n                const match = project.match(new RegExp(regex));\n                this.projectUrl = match ? match[0] : hostName;\n            }\n            else {\n                this.projectUrl = hostName;\n            }\n        }\n        // Check if we have a specified path type.\n        let isNotSubdomainType = false;\n        if (Formio.pathType) {\n            isNotSubdomainType = Formio.pathType !== 'Subdomains';\n        }\n        if (!this.noProject) {\n            // Determine the projectUrl and projectId\n            if (isProjectUrl) {\n                // Get project id as project/:projectId.\n                registerItems(['project'], hostName);\n                path = path.replace(projectRegEx, '');\n            }\n            else if (hostName === this.base) {\n                // Get project id as first part of path (subdirectory).\n                if (hostparts && hostparts.length > 3 && path.split('/').length > 1) {\n                    const isFile = path.match(/.json/);\n                    const pathParts = path.split('/');\n                    if (isFile) {\n                        this.projectUrl = hostName;\n                    }\n                    else {\n                        pathParts.shift(); // Throw away the first /.\n                        const projectId = pathParts.shift();\n                        if (projectId) {\n                            this.projectId = projectId;\n                            path = `/${pathParts.join('/')}`;\n                            this.projectUrl = `${hostName}/${this.projectId}`;\n                        }\n                    }\n                }\n            }\n            else {\n                // Get project id from subdomain.\n                if (hostparts &&\n                    hostparts.length > 2 &&\n                    (hostparts[2].split('.').length > 2 || hostName.includes('localhost')) &&\n                    !isNotSubdomainType) {\n                    this.projectUrl = hostName;\n                    this.projectId = hostparts[2].split('.')[0];\n                }\n            }\n            this.projectsUrl = this.projectsUrl || `${this.base}/project`;\n        }\n        // Configure Role urls and role ids.\n        registerItems(['role'], this.projectUrl);\n        // Configure Form urls and form ids.\n        if (/(^|\\/)(form)($|\\/)/.test(path)) {\n            registerItems(['form', ['submission', 'action', 'v']], this.projectUrl);\n        }\n        else {\n            const subRegEx = new RegExp('/(submission|action|v)($|/.*)');\n            const subs = path.match(subRegEx);\n            if (subs && subs.length > 1) {\n                this.pathType = subs[1];\n            }\n            path = path.replace(subRegEx, '');\n            path = path.replace(/\\/$/, '');\n            this.formsUrl = `${this.projectUrl}/form`;\n            this.formUrl = path ? this.projectUrl + path : '';\n            this.formId = path.replace(/^\\/+|\\/+$/g, '');\n            const items = ['submission', 'action', 'v'];\n            for (const i in items) {\n                if (items.hasOwnProperty(i)) {\n                    const item = items[i];\n                    this[`${item}sUrl`] = `${this.projectUrl + path}/${item}`;\n                    if (this.pathType === item && subs && subs.length > 2 && subs[2]) {\n                        this[`${item}Id`] = subs[2].replace(/^\\/+|\\/+$/g, '');\n                        this[`${item}Url`] = this.projectUrl + path + subs[0];\n                    }\n                }\n            }\n        }\n        // Set the app url if it is not set.\n        if (!Formio.projectUrlSet) {\n            Formio.projectUrl = this.projectUrl;\n        }\n    }\n    /**\n     * Deletes a remote resource of any provided type.\n     *\n     * @param {string} type - The type of resource to delete. \"submission\", \"form\", etc.\n     * @param {object} options - The options passed to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    delete(type, opts) {\n        const _id = `${type}Id`;\n        const _url = `${type}Url`;\n        if (!this[_id]) {\n            return Promise.reject('Nothing to delete');\n        }\n        Formio.cache = {};\n        return this.makeRequest(type, this[_url], 'delete', null, opts);\n    }\n    /**\n     * Returns the index (array of records) for any provided type.\n     *\n     * @param {string} type - The type of resource to fetch the index of. \"submission\", \"form\", etc.\n     * @param {object} query - A query object to pass to the request.\n     * @param {object} query.params - A map (key-value pairs) of URL query parameters to add to the url.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    index(type, query, opts) {\n        const _url = `${type}Url`;\n        query = query || '';\n        if (query && (0, lodash_1.isObject)(query)) {\n            query = `?${Formio.serialize(query.params)}`;\n        }\n        return this.makeRequest(type, this[_url] + query, 'get', null, opts);\n    }\n    /**\n     * Save a document record using \"upsert\". If the document does not exist, it will be created, if the _id is provided,\n     * it will be updated.\n     *\n     * @param {string} type - The type of resource to fetch the index of. \"submission\", \"form\", etc.\n     * @param {object} data - The resource data object.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    save(type, data, opts) {\n        const _id = `${type}Id`;\n        const _url = `${type}Url`;\n        const method = this[_id] || data._id ? 'put' : 'post';\n        let reqUrl = this[_id] ? this[_url] : this[`${type}sUrl`];\n        if (!this[_id] && data._id && method === 'put' && !reqUrl.includes(data._id)) {\n            reqUrl += `/${data._id}`;\n        }\n        Formio.cache = {};\n        return this.makeRequest(type, reqUrl + this.query, method, data, opts);\n    }\n    /**\n     * @summary Load (GET) a document record.\n     *\n     * @param {string} type - The type of resource to fetch the index of. \"submission\", \"form\", etc.\n     * @param {object} query - A query object to pass to the request.\n     * @param {object} query.params - A map (key-value pairs) of URL query parameters to add to the url.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    load(type, query, opts) {\n        const _id = `${type}Id`;\n        const _url = `${type}Url`;\n        if (query && (0, lodash_1.isObject)(query)) {\n            query = Formio.serialize(query.params);\n        }\n        if (query) {\n            query = this.query ? `${this.query}&${query}` : `?${query}`;\n        }\n        else {\n            query = this.query;\n        }\n        if (!this[_id]) {\n            return Promise.reject(`Missing ${_id}`);\n        }\n        let url = this[_url] + query;\n        if (type === 'form' && !isNaN(parseInt(this.vId))) {\n            url += url.indexOf('?') === -1 ? '?' : '&';\n            url += `formRevision=${this.vId}`;\n        }\n        return this.makeRequest(type, url, 'get', null, opts);\n    }\n    /**\n     * @summary Call {@link Formio.makeRequest} for this Formio instance.\n     *\n     * @param {string} type - The request resource type. \"submission\", \"form\", etc.\n     * @param {string} url - The URL to request.\n     * @param {string} method - The request method. GET, PUT, POST, DELETE, or PATCH\n     * @param {object} data - The data to pass to the request (for PUT, POST, and PATCH methods)\n     * @param {object} options - An object of options to pass to the request method.\n     * @param {boolean} options.ignoreCache - To ignore internal caching of the request.\n     * @param {object} options.headers - An object of headers to pass along to the request.\n     * @param {boolean} options.noToken - If set to true, this will not include the Form.io x-jwt-token along with the request.\n     * @param {string} options.namespace - The Form.io namespace to prepend to all LocalStorage variables such as formioToken.\n     * @param {boolean} options.getHeaders - Set this if you wish to include the response headers with the return of this method.\n     * @return {Promise<Response>}\n     */\n    makeRequest(type, url, method, data, opts) {\n        return Formio.makeRequest(this, type, url, method, data, opts);\n    }\n    /**\n     * @summary Loads a project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.loadProject().then((project) => {\n     *   console.log(project);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters to pass to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    loadProject(query, opts) {\n        return this.load('project', query, opts);\n    }\n    /**\n     * Saves or Updates a project.\n     *\n     * ### Create a new project\n     * ```ts\n     * const formio = new Formio();\n     * formio.saveProject({\n     *   title: 'My Project',\n     *   path: 'myproject',\n     *   name: 'myproject'\n     * });\n     * ```\n     *\n     * ### Update an existing project\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.loadProject().then((project) => {\n     *   project.title = 'Title changed';\n     *   formio.saveProject(project).then(() => {\n     *     console.log('Done saving project!');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} data - The project JSON to create or update.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveProject(data, opts) {\n        return this.save('project', data, opts);\n    }\n    /**\n     * Deletes a project\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.deleteProject();\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    deleteProject(opts) {\n        return this.delete('project', opts);\n    }\n    /**\n     * Loads a list of all projects.\n     *\n     * ```ts\n     * Formio.loadProjects().then((projects) => {\n     *   console.log(projects);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {*}\n     */\n    static loadProjects(query, opts) {\n        query = query || '';\n        if ((0, lodash_1.isObject)(query)) {\n            query = `?${Formio.serialize(query.params)}`;\n        }\n        return Formio.makeStaticRequest(`${Formio.baseUrl}/project${query}`, 'GET', null, opts);\n    }\n    /**\n     * Loads a role within a project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/role/234234234234');\n     * formio.loadRole().then((role) => {\n     *   console.log(role);\n     * });\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    loadRole(opts) {\n        return this.load('role', null, opts);\n    }\n    /**\n     * Create a new or Update an existing role within a project.\n     *\n     * ### Create new Role example\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.saveRole({\n     *   title: 'Employee',\n     *   description: 'A person who belongs to a company.'\n     * }).then((role) => {\n     *   console.log(role);\n     * });\n     * ```\n     *\n     * ### Update existing role example\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/role/234234234234234');\n     * formio.loadRole().then((role) => {\n     *   role.title = 'Manager';\n     *   formio.saveRole(role).then(() => {\n     *     console.log('DONE');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} role - The Role JSON to create or update.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveRole(data, opts) {\n        return this.save('role', data, opts);\n    }\n    /**\n     * Deletes a role within a project.\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    deleteRole(opts) {\n        return this.delete('role', opts);\n    }\n    /**\n     * Load all roles within a project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.loadRoles().then((roles) => {\n     *   console.log(roles);\n     * });\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    loadRoles(opts) {\n        return this.index('roles', null, opts);\n    }\n    /**\n     * Loads a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.loadForm().then((form) => {\n     *   console.log(form);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    loadForm(query, opts) {\n        return this.load('form', query, opts).then((currentForm) => {\n            // Check to see if there isn't a number in vId.\n            if (!currentForm.revisions || isNaN(parseInt(this.vId))) {\n                return currentForm;\n            }\n            // If a submission already exists but form is marked to load current version of form.\n            if (currentForm.revisions === 'current' && this.submissionId) {\n                return currentForm;\n            }\n            if (currentForm._vid == this.vId || currentForm.revisionId === this.vId) {\n                return currentForm;\n            }\n            // If they specified a revision form, load the revised form components.\n            if (query && (0, lodash_1.isObject)(query)) {\n                query = Formio.serialize(query.params);\n            }\n            if (query) {\n                query = this.query ? `${this.query}&${query}` : `?${query}`;\n            }\n            else {\n                query = this.query;\n            }\n            return (this.makeRequest('form', this.vUrl + query, 'get', null, opts)\n                .then((revisionForm) => {\n                currentForm._vid = revisionForm._vid;\n                currentForm.components = revisionForm.components;\n                currentForm.settings = revisionForm.settings;\n                currentForm.revisionId = revisionForm.revisionId;\n                // Using object.assign so we don't cross polinate multiple form loads.\n                return Object.assign({}, currentForm);\n            })\n                // If we couldn't load the revision, just return the original form.\n                .catch(() => Object.assign({}, currentForm)));\n        });\n    }\n    /**\n     * Create or Update a specific form.\n     *\n     * ### Create form example\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.saveForm({\n     *   title: 'Employee',\n     *   type: 'resource',\n     *   path: 'employee',\n     *   name: 'employee',\n     *   components: [\n     *     {\n     *       type: 'textfield',\n     *       key: 'firstName',\n     *       label: 'First Name'\n     *     },\n     *     {\n     *       type: 'textfield',\n     *       key: 'lastName',\n     *       label: 'Last Name'\n     *     }\n     *   ]\n     * });\n     * ```\n     *\n     * ### Update a form example\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.loadForm().then((form) => {\n     *   form.title = 'Changed Title';\n     *   formio.saveForm(form).then(() => {\n     *     console.log('DONE!!!');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} data - The Form JSON to create or update.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveForm(data, opts) {\n        return this.save('form', data, opts);\n    }\n    /**\n     * Deletes a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.deleteForm().then(() => {\n     *   console.log('Deleted!');\n     * });\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    deleteForm(opts) {\n        return this.delete('form', opts);\n    }\n    /**\n     * Loads all forms within a project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.loadForms().then((forms) => {\n     *   console.log(forms);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    loadForms(query, opts) {\n        return this.index('forms', query, opts);\n    }\n    /**\n     * Loads a specific submissionn.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/submission/23423423423423423');\n     * formio.loadSubmission().then((submission) => {\n     *   console.log(submission);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    loadSubmission(query, opts) {\n        return this.load('submission', query, opts).then((submission) => {\n            this.vId = submission._frid || submission._fvid;\n            this.vUrl = `${this.formUrl}/v/${this.vId}`;\n            return submission;\n        });\n    }\n    /**\n     * Creates a new or Updates an existing submission.\n     *\n     * ### Create a new submission\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.saveSubmission({\n     *   data: {\n     *     firstName: 'Joe',\n     *     lastName: 'Smith'\n     *   }\n     * }).then((submission) => {\n     *   // This will now be the complete submission object saved on the server.\n     *   console.log(submission);\n     * });\n     * ```\n     *\n     * ### Update an existing submission\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/submission/23423423423423423');\n     * formio.loadSubmission().then((submission) => {\n     *   submission.data.lastName = 'Thompson';\n     *   formio.saveSubmission(submission).then(() => {\n     *     console.log('DONE');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} data - The submission JSON object.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveSubmission(data, opts) {\n        if (!isNaN(parseInt(this.vId)) && !data._fvid) {\n            data._fvid = this.vId;\n        }\n        return this.save('submission', data, opts);\n    }\n    /**\n     * Deletes a submission.\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    deleteSubmission(opts) {\n        return this.delete('submission', opts);\n    }\n    /**\n     * Loads all submissions within a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.loadSubmissions({\n     *   params: {\n     *     limit: 25,\n     *     'data.lastName__regex': 'smith'\n     *   }\n     * }).then((submissions) => {\n     *   // Should print out 25 submissions where the last name contains \"smith\".\n     *   console.log(submissions);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    loadSubmissions(query, opts) {\n        return this.index('submissions', query, opts);\n    }\n    /**\n     * Loads a form action.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/action/234234234234');\n     * formio.loadAction().then((action) => {\n     *   console.log(action);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    loadAction(query, opts) {\n        return this.load('action', query, opts);\n    }\n    /**\n     * Create a new or update an existing action.\n     *\n     * ### Create a new action for a form.\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.saveAction({\n     *   data: {\n     *     name: 'webhook',\n     *     title: 'Webhook Action',\n     *     method: ['create', 'update', 'delete'],\n     *     handler: ['after'],\n     *     condition: {},\n     *     settings: {\n     *       url: 'https://example.com',\n     *       headers: [{}],\n     *       block: false,\n     *       forwardHeaders: false\n     *     }\n     *   }\n     * }).then((action) => {\n     *   console.log(action);\n     * });\n     * ```\n     *\n     * ### Update an action\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/action/234234234234');\n     * formio.loadAction().then((action) => {\n     *   action.title = 'Updated title';\n     *   formio.saveAction(action).then(() => {\n     *     console.log('Done!');\n     *   });\n     * });\n     * ```\n     *\n     * @param {object} data - The action JSON\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Object>}\n     */\n    saveAction(data, opts) {\n        return this.save('action', data, opts);\n    }\n    /**\n     * Delete an action\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/action/234234234234');\n     * formio.deleteAction().then(() => {\n     *   console.log('Action was deleted.');\n     * });\n     * ```\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    deleteAction(opts) {\n        return this.delete('action', opts);\n    }\n    /**\n     * Loads all actions within a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.loadActions().then((actions) => {\n     *   console.log(actions);\n     * });\n     * ```\n     *\n     * @param {object} query - Query parameters similar to {@link Formio#load}.\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<Response>}\n     */\n    loadActions(query, opts) {\n        return this.index('actions', query, opts);\n    }\n    /**\n     * Returns a list of available actions\n     *\n     * @return {Promise<Response>}\n     */\n    availableActions() {\n        return this.makeRequest('availableActions', `${this.formUrl}/actions`);\n    }\n    /**\n     * Returns the action information for a specific action, such as \"save\".\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/actions/save');\n     * formio.actionInfo().then((info) => {\n     *   console.log(info);\n     * });\n     * ```\n     *\n     * @param {string} name - The name of the action you would like to get information for. i.e. \"save\", \"webhook\", etc.\n     * @return {Promise<Response>}\n     */\n    actionInfo(name) {\n        return this.makeRequest('actionInfo', `${this.formUrl}/actions/${name}`);\n    }\n    /**\n     * Determine if a string ID is a valid MongoID.\n     *\n     * @param {string} id - The id that should be tested if it is avalid id.\n     * @return {boolean} - true if it is a valid MongoId, false otherwise.\n     */\n    isObjectId(id) {\n        const checkForHexRegExp = new RegExp('^[0-9a-fA-F]{24}$');\n        return checkForHexRegExp.test(id);\n    }\n    /**\n     * Get the project ID of project.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io');\n     * formio.getProjectId().then((projectId) => {\n     *   console.log(projectId);\n     * };\n     * ```\n     *\n     * @return {Promise<string>}\n     */\n    getProjectId() {\n        if (!this.projectId) {\n            return Promise.resolve('');\n        }\n        if (this.isObjectId(this.projectId)) {\n            return Promise.resolve(this.projectId);\n        }\n        else {\n            return this.loadProject().then((project) => {\n                return project._id;\n            });\n        }\n    }\n    /**\n     * Get the ID of a form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example');\n     * formio.getFormId().then((formId) => {\n     *   console.log(formId);\n     * });\n     * ```\n     *\n     * @return {Promise<string>}\n     */\n    getFormId() {\n        if (!this.formId) {\n            return Promise.resolve('');\n        }\n        if (this.isObjectId(this.formId)) {\n            return Promise.resolve(this.formId);\n        }\n        else {\n            return this.loadForm().then((form) => {\n                return form._id;\n            });\n        }\n    }\n    /**\n     * Instance method for {@link Formio.currentUser}\n     *\n     * @param {object} options - Options to pass to {@link Formio.request}\n     * @return {Promise<object>}\n     */\n    currentUser(options) {\n        return Formio.currentUser(this, options);\n    }\n    /**\n     * Instance method for {@link Formio.accessInfo}\n     *\n     * @return {Promise<Response>}\n     */\n    accessInfo() {\n        return Formio.accessInfo(this);\n    }\n    /**\n     * Sets OAuth Logout URL.\n     *\n     * @param {string} uri - Logout URL.\n     * @param {string} options.namespace - The localStorage namespace to use when retrieving tokens from storage.\n     * @return {string}\n     */\n    oauthLogoutURI(uri, options) {\n        return Formio.oauthLogoutURI(uri, Object.assign({ formio: this }, this.options, options));\n    }\n    /**\n     * Returns the JWT token for this instance.\n     *\n     * @param {object} options - The following options are provided.\n     * @param {string} options.namespace - The localStorage namespace to use when retrieving tokens from storage.\n     * @return {string} - The JWT token for this user.\n     */\n    getToken(options) {\n        return Formio.getToken(Object.assign({ formio: this }, this.options, options));\n    }\n    /**\n     * Sets the JWT token for this instance.\n     *\n     * @param {string} token - The JWT token to set.\n     * @param {object} options - The following options are provided.\n     * @param {string} options.namespace - The localStorage namespace to use when retrieving tokens from storage.\n     * @return {string} - The JWT token that was set.\n     */\n    setToken(token, options) {\n        return Formio.setToken(token, Object.assign({ formio: this }, this.options, options));\n    }\n    /**\n     * Returns a temporary authentication token for single purpose token generation.\n     *\n     * @param {number|string} expire - The amount of seconds to wait before this temp token expires.\n     * @param {string} allowed - The allowed path string inn the format GET:/path\n     * @param {object} options - The options passed to {@link Formio#getToken}\n     */\n    getTempToken(expire, allowed, options) {\n        const token = Formio.getToken(options);\n        if (!token) {\n            return Promise.reject('You must be authenticated to generate a temporary auth token.');\n        }\n        const authUrl = Formio.authUrl || this.projectUrl;\n        return this.makeRequest('tempToken', `${authUrl}/token`, 'GET', null, {\n            ignoreCache: true,\n            header: new Headers({\n                'x-expire': expire,\n                'x-allow': allowed,\n            }),\n        });\n    }\n    /**\n     * Get a PDF download url for a submission, which will generate a new PDF of the submission. This method will first\n     * fetch a temporary download token, and then append this to the download url for this form.\n     *\n     * ```ts\n     * const formio = new Formio('https://examples.form.io/example/submission/324234234234234');\n     * formio.getDownloadUrl().then((url) => {\n     *   console.log(url);\n     * });\n     * ```\n     *\n     * @param {object} [form] - The form JSON to fetch a download url for.\n     * @return {Promise<string>} - The download url.\n     */\n    getDownloadUrl(form) {\n        if (!this.submissionId) {\n            return Promise.resolve('');\n        }\n        if (!form) {\n            // Make sure to load the form first.\n            return this.loadForm().then((_form) => {\n                if (!_form) {\n                    return '';\n                }\n                return this.getDownloadUrl(_form);\n            });\n        }\n        let apiUrl = `/project/${form.project}`;\n        apiUrl += `/form/${form._id}`;\n        apiUrl += `/submission/${this.submissionId}`;\n        const postfix = form.submissionRevisions && form.settings.changeLog ? '/download/changelog' : '/download';\n        apiUrl += postfix;\n        let download = this.base + apiUrl;\n        return new Promise((resolve, reject) => {\n            this.getTempToken(3600, `GET:${apiUrl}`)\n                .then((tempToken) => {\n                download += `?token=${tempToken.key}`;\n                resolve(download);\n            }, () => {\n                resolve(download);\n            })\n                .catch(reject);\n        });\n    }\n    /**\n     * Returns the user permissions to a form and submission.\n     *\n     * @param user - The user or current user if undefined. For anonymous, use \"null\"\n     * @param form - The form or current form if undefined. For no form check, use \"null\"\n     * @param submission - The submisison or \"index\" if undefined.\n     *\n     * @return {{create: boolean, read: boolean, edit: boolean, delete: boolean}}\n     */\n    userPermissions(user, form, submission) {\n        return Promise.all([\n            form !== undefined ? Promise.resolve(form) : this.loadForm(),\n            user !== undefined ? Promise.resolve(user) : this.currentUser(),\n            submission !== undefined || !this.submissionId\n                ? Promise.resolve(submission)\n                : this.loadSubmission(),\n            this.accessInfo(),\n        ]).then((results) => {\n            const form = results.shift();\n            const user = results.shift() || { _id: false, roles: [] };\n            const submission = results.shift();\n            const access = results.shift();\n            const permMap = {\n                create: 'create',\n                read: 'read',\n                update: 'edit',\n                delete: 'delete',\n            };\n            const perms = {\n                user: user,\n                form: form,\n                access: access,\n                create: false,\n                read: false,\n                edit: false,\n                delete: false,\n            };\n            for (const roleName in access.roles) {\n                if (access.roles.hasOwnProperty(roleName)) {\n                    const role = access.roles[roleName];\n                    if (role.default && user._id === false) {\n                        // User is anonymous. Add the anonymous role.\n                        user.roles.push(role._id);\n                    }\n                    else if (role.admin && user.roles.indexOf(role._id) !== -1) {\n                        perms.create = true;\n                        perms.read = true;\n                        perms.delete = true;\n                        perms.edit = true;\n                        return perms;\n                    }\n                }\n            }\n            if (form && form.submissionAccess) {\n                for (let i = 0; i < form.submissionAccess.length; i++) {\n                    const permission = form.submissionAccess[i];\n                    const [perm, scope] = permission.type.split('_');\n                    if (['create', 'read', 'update', 'delete'].includes(perm)) {\n                        if ((0, lodash_1.intersection)(permission.roles, user.roles).length) {\n                            perms[permMap[perm]] =\n                                scope === 'all' || !submission || user._id === submission.owner;\n                        }\n                    }\n                }\n            }\n            // check for Group Permissions\n            if (submission) {\n                // we would anyway need to loop through components for create permission, so we'll do that for all of them\n                (0, formUtil_1.eachComponent)(form.components, (component, path) => {\n                    if (component && component.defaultPermission) {\n                        const value = (0, lodash_1.get)(submission.data, path);\n                        // make it work for single-select Group and multi-select Group\n                        const groups = Array.isArray(value) ? value : [value];\n                        groups.forEach((group) => {\n                            if (group &&\n                                group._id && // group id is present\n                                user.roles.indexOf(group._id) > -1 // user has group id in his roles\n                            ) {\n                                if (component.defaultPermission === 'read') {\n                                    perms[permMap.read] = true;\n                                }\n                                if (component.defaultPermission === 'create') {\n                                    perms[permMap.create] = true;\n                                    perms[permMap.read] = true;\n                                }\n                                if (component.defaultPermission === 'write') {\n                                    perms[permMap.create] = true;\n                                    perms[permMap.read] = true;\n                                    perms[permMap.update] = true;\n                                }\n                                if (component.defaultPermission === 'admin') {\n                                    perms[permMap.create] = true;\n                                    perms[permMap.read] = true;\n                                    perms[permMap.update] = true;\n                                    perms[permMap.delete] = true;\n                                }\n                            }\n                        });\n                    }\n                });\n            }\n            return perms;\n        });\n    }\n    /**\n     * `Determine if the current user can submit a form.\n     * @return {*}\n     */\n    canSubmit() {\n        return this.userPermissions().then((perms) => {\n            // If there is user and they cannot create, then check anonymous user permissions.\n            if (!perms.create && Formio.getUser()) {\n                return this.userPermissions(null).then((anonPerms) => {\n                    if (anonPerms.create) {\n                        Formio.setUser(null);\n                        return true;\n                    }\n                    return false;\n                });\n            }\n            return perms.create;\n        });\n    }\n    getUrlParts(url) {\n        return Formio.getUrlParts(url, this);\n    }\n    static getUrlParts(url, formio) {\n        const base = formio && formio.base ? formio.base : Formio.baseUrl;\n        let regex = '^(http[s]?:\\\\/\\\\/)';\n        if (base && url.indexOf(base) === 0) {\n            regex += `(${base.replace(/^http[s]?:\\/\\//, '')})`;\n        }\n        else {\n            regex += '([^/]+)';\n        }\n        regex += '($|\\\\/.*)';\n        return url.match(new RegExp(regex));\n    }\n    static serialize(obj, _interpolate) {\n        const str = [];\n        const interpolate = (item) => {\n            return _interpolate ? _interpolate(item) : item;\n        };\n        for (const p in obj) {\n            if (Object.prototype.hasOwnProperty.call(obj, p)) {\n                str.push(`${encodeURIComponent(p)}=${encodeURIComponent(interpolate(obj[p]))}`);\n            }\n        }\n        return str.join('&');\n    }\n    static getRequestArgs(formio, type, url, method, data, opts) {\n        method = (method || 'GET').toUpperCase();\n        if (!opts || !(0, lodash_1.isObject)(opts)) {\n            opts = {};\n        }\n        const requestArgs = {\n            url,\n            method,\n            data: data || null,\n            opts,\n        };\n        if (type) {\n            requestArgs.type = type;\n        }\n        if (formio) {\n            requestArgs.formio = formio;\n        }\n        return requestArgs;\n    }\n    static makeStaticRequest(url, method, data, opts) {\n        const requestArgs = Formio.getRequestArgs(null, '', url, method, data, opts);\n        const request = Plugins_1.default.pluginWait('preRequest', requestArgs).then(() => Plugins_1.default.pluginGet('staticRequest', requestArgs).then((result) => {\n            if ((0, lodash_1.isNil)(result)) {\n                return Formio.request(requestArgs.url, requestArgs.method, requestArgs.data, requestArgs.opts.header, requestArgs.opts);\n            }\n            return result;\n        }));\n        return Plugins_1.default.pluginAlter('wrapStaticRequestPromise', request, requestArgs);\n    }\n    /**\n     * Make an API request and wrap that request with the Form.io Request plugin system.  This is very similar to the\n     * {Formio.request} method with a difference being that it will pass the request through the Form.io request plugin.\n     *\n     * @param {Formio} formio - An instance of the Formio class.\n     * @param {string} type - The request resource type. \"submission\", \"form\", etc.\n     * @param {string} url - The URL to request.\n     * @param {string} method - The request method. GET, PUT, POST, DELETE, or PATCH\n     * @param {object} data - The data to pass to the request (for PUT, POST, and PATCH methods)\n     * @param {object} options - An object of options to pass to the request method.\n     * @param {boolean} options.ignoreCache - To ignore internal caching of the request.\n     * @param {object} options.headers - An object of headers to pass along to the request.\n     * @param {boolean} options.noToken - If set to true, this will not include the Form.io x-jwt-token along with the request.\n     * @param {string} options.namespace - The Form.io namespace to prepend to all LocalStorage variables such as formioToken.\n     * @param {boolean} options.getHeaders - Set this if you wish to include the response headers with the return of this method.\n     * @return {Promise<Response>}\n     */\n    static makeRequest(formio, type, url, method, data, opts) {\n        if (!formio) {\n            return Formio.makeStaticRequest(url, method, data, opts);\n        }\n        const requestArgs = Formio.getRequestArgs(formio, type, url, method, data, opts);\n        requestArgs.opts = requestArgs.opts || {};\n        requestArgs.opts.formio = formio;\n        //for Formio requests default Accept and Content-type headers\n        if (!requestArgs.opts.headers) {\n            requestArgs.opts.headers = {};\n        }\n        requestArgs.opts.headers = (0, lodash_1.defaults)(requestArgs.opts.headers, {\n            Accept: 'application/json',\n            'Content-type': 'application/json',\n        });\n        const request = Plugins_1.default.pluginWait('preRequest', requestArgs).then(() => Plugins_1.default.pluginGet('request', requestArgs).then((result) => {\n            if ((0, lodash_1.isNil)(result)) {\n                return Formio.request(requestArgs.url, requestArgs.method, requestArgs.data, requestArgs.opts.header, requestArgs.opts);\n            }\n            return result;\n        }));\n        return Plugins_1.default.pluginAlter('wrapRequestPromise', request, requestArgs);\n    }\n    /**\n     * Execute an API request to any external system. This is a wrapper around the Web fetch method.\n     *\n     * ```ts\n     * Formio.request('https://examples.form.io').then((form) => {\n     *   console.log(form);\n     * });\n     * ```\n     *\n     * @param {string} url - The URL to request.\n     * @param {string} method - The request method. GET, PUT, POST, DELETE, or PATCH\n     * @param {object} data - The data to pass to the request (for PUT, POST, and PATCH methods)\n     * @param {Headers} header - An object of headers to pass to the request.\n     * @param {object} options - An object of options to pass to the request method.\n     * @param {boolean} options.ignoreCache - To ignore internal caching of the request.\n     * @param {object} options.headers - An object of headers to pass along to the request.\n     * @param {boolean} options.noToken - If set to true, this will not include the Form.io x-jwt-token along with the request.\n     * @param {string} options.namespace - The Form.io namespace to prepend to all LocalStorage variables such as formioToken.\n     * @param {boolean} options.getHeaders - Set this if you wish to include the response headers with the return of this method.\n     * @return {Promise<Response>|*}\n     */\n    static request(url, method, data, header, opts) {\n        if (!url) {\n            return Promise.reject('No url provided');\n        }\n        method = (method || 'GET').toUpperCase();\n        // For reverse compatibility, if they provided the ignoreCache parameter,\n        // then change it back to the options format where that is a parameter.\n        if ((0, lodash_1.isBoolean)(opts)) {\n            opts = { ignoreCache: opts };\n        }\n        if (!opts || !(0, lodash_1.isObject)(opts)) {\n            opts = {};\n        }\n        // Generate a cachekey.\n        const cacheKey = btoa(encodeURI(url));\n        // Get the cached promise to save multiple loads.\n        if (!opts.ignoreCache && method === 'GET' && Formio.cache.hasOwnProperty(cacheKey)) {\n            return Promise.resolve(Formio.cloneResponse(Formio.cache[cacheKey]));\n        }\n        if (url[0] === '/') {\n            url = Formio.baseUrl + url;\n        }\n        // Set up and fetch request\n        const headers = header ||\n            new Headers(opts.headers || {\n                Accept: 'application/json',\n                'Content-type': 'application/json',\n            });\n        const token = Formio.getToken(opts);\n        if (token && !opts.noToken) {\n            headers.set('x-jwt-token', token);\n        }\n        // The fetch-ponyfill can't handle a proper Headers class anymore. Change it back to an object.\n        const headerObj = {};\n        headers.forEach(function (value, name) {\n            headerObj[name] = value;\n        });\n        let options = {\n            method: method,\n            headers: headerObj,\n            mode: 'cors',\n        };\n        if (data) {\n            options.body = JSON.stringify(data);\n        }\n        // Allow plugins to alter the options.\n        options = Plugins_1.default.pluginAlter('requestOptions', options, url);\n        if (options.namespace || Formio.namespace) {\n            opts.namespace = options.namespace || Formio.namespace;\n        }\n        const requestToken = options.headers['x-jwt-token'];\n        const result = Plugins_1.default.pluginAlter('wrapFetchRequestPromise', Formio.fetch(url, options), {\n            url,\n            method,\n            data,\n            opts,\n        })\n            .then((response) => {\n            // Allow plugins to respond.\n            response = Plugins_1.default.pluginAlter('requestResponse', response, Formio, data);\n            if (!response.ok) {\n                if (response.status === 440) {\n                    Formio.setToken(null, opts);\n                    Formio.events.emit('formio.sessionExpired', response.body || response);\n                }\n                else if (response.status === 401) {\n                    Formio.events.emit('formio.unauthorized', response.body || response);\n                }\n                else if (response.status === 416) {\n                    Formio.events.emit('formio.rangeIsNotSatisfiable', response.body || response);\n                }\n                else if (response.status === 504) {\n                    return Promise.reject(new Error('Network request failed'));\n                }\n                // Parse and return the error as a rejected promise to reject this promise\n                return (response.headers.get('content-type').includes('application/json')\n                    ? response.json()\n                    : response.text()).then((error) => {\n                    return Promise.reject(error);\n                });\n            }\n            // Handle fetch results\n            const respToken = response.headers.get('x-jwt-token');\n            // In some strange cases, the fetch library will return an x-jwt-token without sending\n            // one to the server. This has even been debugged on the server to verify that no token\n            // was introduced with the request, but the response contains a token. This is an Invalid\n            // case where we do not send an x-jwt-token and get one in return for any GET request.\n            let tokenIntroduced = false;\n            if (method === 'GET' &&\n                !requestToken &&\n                respToken &&\n                !opts.external &&\n                !url.includes('token=') &&\n                !url.includes('x-jwt-token=')) {\n                console.warn('Token was introduced in request.');\n                tokenIntroduced = true;\n            }\n            if (response.status >= 200 &&\n                response.status < 300 &&\n                respToken &&\n                respToken !== '' &&\n                !tokenIntroduced) {\n                Formio.setToken(respToken, Object.assign(Object.assign({}, opts), { fromCurrent: opts.fromCurrent || !!requestToken }));\n            }\n            // 204 is no content. Don't try to .json() it.\n            if (response.status === 204) {\n                return {};\n            }\n            const getResult = response.headers.get('content-type').includes('application/json')\n                ? response.json()\n                : response.text();\n            return getResult.then((result) => {\n                // Add some content-range metadata to the result here\n                let range = response.headers.get('content-range');\n                if (range && (0, lodash_1.isObject)(result)) {\n                    range = range.split('/');\n                    if (range[0] !== '*') {\n                        const skipLimit = range[0].split('-');\n                        result.skip = Number(skipLimit[0]);\n                        result.limit = skipLimit[1] - skipLimit[0] + 1;\n                    }\n                    result.serverCount = range[1] === '*' ? range[1] : Number(range[1]);\n                }\n                if (!opts.getHeaders) {\n                    return result;\n                }\n                const headers = {};\n                response.headers.forEach((item, key) => {\n                    headers[key] = item;\n                });\n                // Return the result with the headers.\n                return {\n                    result,\n                    headers,\n                };\n            });\n        })\n            .then((result) => {\n            if (opts.getHeaders) {\n                return result;\n            }\n            // Cache the response.\n            if (method === 'GET') {\n                Formio.cache[cacheKey] = result;\n            }\n            return Formio.cloneResponse(result);\n        })\n            .catch((err) => {\n            if (err === 'Bad Token' && opts.noToken !== false) {\n                Formio.setToken(null, opts);\n                Formio.events.emit('formio.badToken', err);\n            }\n            if (err.message) {\n                err = new Error(`Could not connect to API server (${err.message}): ${url}`);\n                err.networkError = true;\n            }\n            if (method === 'GET') {\n                delete Formio.cache[cacheKey];\n            }\n            return Promise.reject(err);\n        });\n        return result;\n    }\n    // Needed to maintain reverse compatability...\n    static get token() {\n        return Formio.tokens.formioToken || '';\n    }\n    // Needed to maintain reverse compatability...\n    static set token(token) {\n        Formio.tokens.formioToken = token || '';\n    }\n    static useSessionToken(options) {\n        if (typeof localStorage === 'undefined') {\n            return;\n        }\n        const namespace = options;\n        if (typeof options === 'object') {\n            options = options.namespace;\n        }\n        const tokenName = `${namespace || Formio.namespace || 'formio'}Token`;\n        const token = localStorage.getItem(tokenName);\n        if (token) {\n            localStorage.removeItem(tokenName);\n            sessionStorage.setItem(tokenName, token);\n        }\n        const userName = `${namespace || Formio.namespace || 'formio'}User`;\n        const user = localStorage.getItem(userName);\n        if (user) {\n            localStorage.removeItem(userName);\n            sessionStorage.setItem(userName, user);\n        }\n        localStorage.setItem('useSessionToken', 'true');\n    }\n    /**\n     * Sets the JWT in storage to be used within an application.\n     *\n     * @param {string} token - The JWT token to set.\n     * @param {object} options - Options as follows\n     * @param {string} options.namespace - The namespace to save the token within. i.e. \"formio\"\n     * @param {Formio} options.formio - The Formio instance.\n     * @return {Promise<object>|void}\n     */\n    static setToken(token = '', opts = {}) {\n        token = token || '';\n        opts = typeof opts === 'string' ? { namespace: opts } : opts || {};\n        const tokenName = `${opts.namespace || Formio.namespace || 'formio'}Token`;\n        if (!Formio.tokens) {\n            Formio.tokens = {};\n        }\n        const storage = localStorage.getItem('useSessionToken') ? sessionStorage : localStorage;\n        if (!token) {\n            if (!opts.fromUser) {\n                opts.fromToken = true;\n                Formio.setUser(null, opts);\n            }\n            // iOS in private browse mode will throw an error but we can't detect ahead of time that we are in private mode.\n            try {\n                storage.removeItem(tokenName);\n            }\n            catch (ignoreErr) {\n                browser_cookies_1.default.erase(tokenName, { path: '/' });\n            }\n            Formio.tokens[tokenName] = token;\n            return Promise.resolve(null);\n        }\n        if (Formio.tokens[tokenName] !== token) {\n            Formio.tokens[tokenName] = token;\n            // iOS in private browse mode will throw an error but we can't detect ahead of time that we are in private mode.\n            try {\n                storage.setItem(tokenName, token);\n            }\n            catch (ignoreErr) {\n                browser_cookies_1.default.set(tokenName, token, { path: '/' });\n            }\n        }\n        // Return or updates the current user\n        return Formio.currentUser(opts.formio, opts);\n    }\n    /**\n     * Returns the token set within the application for the user.\n     *\n     * @param {object} options - The options as follows.\n     * @param {string} options.namespace - The namespace of the token you wish to fetch.\n     * @param {boolean} options.decode - If you would like the token returned as decoded JSON.\n     * @return {*}\n     */\n    static getToken(options) {\n        options = typeof options === 'string' ? { namespace: options } : options || {};\n        const tokenName = `${options.namespace || Formio.namespace || 'formio'}Token`;\n        const decodedTokenName = options.decode ? `${tokenName}Decoded` : tokenName;\n        if (!Formio.tokens) {\n            Formio.tokens = {};\n        }\n        if (Formio.tokens[decodedTokenName]) {\n            return Formio.tokens[decodedTokenName];\n        }\n        try {\n            const token = localStorage.getItem('useSessionToken')\n                ? sessionStorage.getItem(tokenName)\n                : localStorage.getItem(tokenName);\n            Formio.tokens[tokenName] = token || '';\n            if (options.decode) {\n                Formio.tokens[decodedTokenName] = Formio.tokens[tokenName]\n                    ? (0, jwtDecode_1.jwtDecode)(Formio.tokens[tokenName])\n                    : {};\n                return Formio.tokens[decodedTokenName];\n            }\n            return Formio.tokens[tokenName];\n        }\n        catch (ignoreError) {\n            Formio.tokens[tokenName] = browser_cookies_1.default.get(tokenName);\n            return '';\n        }\n    }\n    /**\n     * Sets the current user within the application cache.\n     *\n     * @param {object} user - JSON object of the user you wish to set.\n     * @param {object} options - Options as follows\n     * @param {string} options.namespace - The namespace of the tokens\n     */\n    static setUser(user, opts = {}) {\n        const userName = `${opts.namespace || Formio.namespace || 'formio'}User`;\n        const storage = localStorage.getItem('useSessionToken') ? sessionStorage : localStorage;\n        if (!user) {\n            if (!opts.fromToken) {\n                opts.fromUser = true;\n                Formio.setToken(null, opts);\n            }\n            // Emit an event on the cleared user.\n            Formio.events.emit('formio.user', null);\n            // iOS in private browse mode will throw an error but we can't detect ahead of time that we are in private mode.\n            try {\n                return storage.removeItem(userName);\n            }\n            catch (ignoreError) {\n                return browser_cookies_1.default.erase(userName, { path: '/' });\n            }\n        }\n        // iOS in private browse mode will throw an error but we can't detect ahead of time that we are in private mode.\n        try {\n            storage.setItem(userName, JSON.stringify(user));\n        }\n        catch (ignoreError) {\n            browser_cookies_1.default.set(userName, JSON.stringify(user), { path: '/' });\n        }\n        // Emit an event on the authenticated user.\n        Formio.events.emit('formio.user', user);\n    }\n    /**\n     * Returns the user JSON.\n     *\n     * @param {object} options - Options as follows\n     * @param {string} namespace - The namespace of the tokens stored within this application.\n     * @return {object} - The user object.\n     */\n    static getUser(options) {\n        options = options || {};\n        const userName = `${options.namespace || Formio.namespace || 'formio'}User`;\n        try {\n            return JSON.parse((localStorage.getItem('useSessionToken') ? sessionStorage : localStorage).getItem(userName) || '');\n        }\n        catch (ignoreError) {\n            return JSON.parse(browser_cookies_1.default.get(userName));\n        }\n    }\n    /**\n     * Sets the BaseURL for the application.\n     *\n     * @description Every application developed using the JavaScript SDK must set both the {@link Formio.setBaseUrl} and\n     * {@link Formio.setProjectUrl} methods. These two functions ensure that every URL passed into the constructor of this\n     * class can determine the \"project\" context for which the application is running.\n     *\n     * Any Open Source server applications will set both the {@link Formio.setBaseUrl} and {@link Formio.setProjectUrl}\n     * values will be the same value.\n     *\n     * ```ts\n     * Formio.setBaseUrl('https://yourwebsite.com/forms');\n     * Formio.setProjectUrl('https://yourwebsite.com/forms/project');\n     *\n     * // Now the Formio constructor will know what is the \"project\" and what is the form alias name. Without setBaseUrl\n     * // and setProjectUrl, this would throw an error.\n     *\n     * const formio = new Formio('https://yourwebsite.com/forms/project/user');\n     * formio.loadForm().then((form) => {\n     *   console.log(form);\n     * });\n     * ```\n     *\n     * @param {string} url - The URL of the Base API url.\n     */\n    static setBaseUrl(url) {\n        Formio.baseUrl = url;\n        if (!Formio.projectUrlSet) {\n            Formio.projectUrl = url;\n        }\n    }\n    /**\n     * Returns the current base url described at {@link Formio.setBaseUrl}\n     *\n     * @return {string} - The base url of the application.\n     */\n    static getBaseUrl() {\n        return Formio.baseUrl;\n    }\n    static setApiUrl(url) {\n        return Formio.setBaseUrl(url);\n    }\n    static getApiUrl() {\n        return Formio.getBaseUrl();\n    }\n    static setAppUrl(url) {\n        console.warn('Formio.setAppUrl() is deprecated. Use Formio.setProjectUrl instead.');\n        Formio.projectUrl = url;\n        Formio.projectUrlSet = true;\n    }\n    /**\n     * Sets the Project Url for the application. This is an important method that needs to be set for all applications. It\n     * is documented @ {@link Formio.setBaseUrl}.\n     *\n     * @param {string} url - The project api url.\n     */\n    static setProjectUrl(url) {\n        Formio.projectUrl = url;\n        Formio.projectUrlSet = true;\n    }\n    /**\n     * The Auth URL can be set to customize the authentication requests made from an application. By default, this is\n     * just the same value as {@link Formio.projectUrl}\n     *\n     * @param {string} url - The authentication url\n     */\n    static setAuthUrl(url) {\n        Formio.authUrl = url;\n    }\n    static getAppUrl() {\n        console.warn('Formio.getAppUrl() is deprecated. Use Formio.getProjectUrl instead.');\n        return Formio.projectUrl;\n    }\n    /**\n     * Returns the Project url described at {@link Formio.setProjectUrl}\n     *\n     * @return {string|string} - The Project Url.\n     */\n    static getProjectUrl() {\n        return Formio.projectUrl;\n    }\n    /**\n     * Clears the runtime internal API cache.\n     *\n     * @description By default, the Formio class will cache all API requests in memory so that any subsequent requests\n     * using GET method will return the cached results as long as the API URl is the same as what was cached previously.\n     * This cache can be cleared using this method as follows.\n     *\n     * ```ts\n     * Formio.clearCache();\n     * ```\n     *\n     * Or, if you just wish to clear a single request, then the {@link Formio.request#options.ignoreCache} option can be\n     * provided when making an API request as follows.\n     *\n     * ```ts\n     * Formio.loadForm({}, {\n     *   ignoreCache: true\n     * }).then((form) => {\n     *   console.log(form);\n     * });\n     * ```\n     *\n     * Both of the following will ensure that a new request is made to the API server and that the results will not be\n     * from the cached result.\n     */\n    static clearCache() {\n        Formio.cache = {};\n    }\n    /**\n     * Return the access information about a Project, such as the Role ID's for that project, and if the server is\n     * configured to do so, the Form and Resource access configurations that the authenticated user has access to.\n     *\n     * @description This is useful for an application to determine the UI for a specific user to identify which forms they have\n     * access to submit or read.\n     *\n     * @param {Formio} formio - The Formio instance.\n     * @return {Promise<Response>}\n     */\n    static accessInfo(formio) {\n        const projectUrl = formio ? formio.projectUrl : Formio.projectUrl;\n        return Formio.makeRequest(formio, 'accessInfo', `${projectUrl}/access`);\n    }\n    /**\n     * Returns an array of roles for the project, which includes the ID's and names of those roles.\n     *\n     * @param {Formio} formio - The Formio instance.\n     * @return {Promise<Response>}\n     */\n    static projectRoles(formio) {\n        const projectUrl = formio ? formio.projectUrl : Formio.projectUrl;\n        return Formio.makeRequest(formio, 'projectRoles', `${projectUrl}/role`);\n    }\n    /**\n     * Return the currentUser object. This will fetch the user from the server and respond with the Submission JSON\n     * of that user object.\n     *\n     * @param {Formio} formio - The Formio instance\n     * @param {object} options - The options passed to {@link Formio.getUser}\n     * @return {Promise<R>|*}\n     */\n    static currentUser(formio, options = {}) {\n        let authUrl = Formio.authUrl;\n        if (!authUrl) {\n            authUrl = formio ? formio.projectUrl : Formio.projectUrl || Formio.baseUrl;\n        }\n        authUrl += '/current';\n        if (!options.ignoreCache || options.fromCurrent) {\n            const user = Formio.getUser(options);\n            if (user) {\n                return Plugins_1.default.pluginAlter('wrapStaticRequestPromise', Promise.resolve(user), {\n                    url: authUrl,\n                    method: 'GET',\n                    options,\n                });\n            }\n        }\n        const token = Formio.getToken(options);\n        if ((!options || !options.external) && !token) {\n            return Plugins_1.default.pluginAlter('wrapStaticRequestPromise', Promise.resolve(null), {\n                url: authUrl,\n                method: 'GET',\n                options,\n            });\n        }\n        options.fromCurrent = true;\n        return Formio.makeRequest(formio, 'currentUser', authUrl, 'GET', null, options).then((response) => {\n            Formio.setUser(response, options);\n            return response;\n        });\n    }\n    /**\n     * Performs a logout of the Form.io application. This will reset all cache, as well as make a request to the logout\n     * endpoint of the Form.io api platform.\n     *\n     * @param {Formio} formio - A Formio instance.\n     * @param {object} options - Options passed to both {@link Formio.setToken} as well as {@link Formio.setUser}\n     * @return {Promise<Response>}\n     */\n    static logout(formio, options = {}) {\n        options.formio = formio;\n        const projectUrl = Formio.authUrl\n            ? Formio.authUrl\n            : formio\n                ? formio.projectUrl\n                : Formio.baseUrl;\n        const logout = () => {\n            Formio.setToken(null, options);\n            Formio.setUser(null, options);\n            Formio.clearCache();\n            localStorage.removeItem('useSessionToken');\n        };\n        return Formio.makeRequest(formio, 'logout', `${projectUrl}/logout`)\n            .then(function (result) {\n            logout();\n            if (result.shouldRedirect && result.url) {\n                window.location.href = result.url;\n            }\n            return result;\n        })\n            .catch(function (err) {\n            logout();\n            throw err;\n        });\n    }\n    /**\n     * Returns the query passed to a page in JSON object format.\n     *\n     * @description For example, lets say you visit your application using\n     * the url as follows.\n     *\n     * ```\n     *   https://yourapplication.com/?token=23423423423&username=Joe\n     * ```\n     *\n     * The following code will provide your application with the following.\n     *\n     * ```ts\n     * const query Formio.pageQuery();\n     * console.log(query.token); // Will print 23423423423\n     * console.log(query.username); // Will print Joe\n     * ```\n     *\n     * @return {{}} - A JSON object representation of the query that was passed to the URL of an application.\n     */\n    static pageQuery() {\n        const pageQuery = {};\n        pageQuery.paths = [];\n        const hashes = location.hash.substr(1).replace(/\\?/g, '&').split('&');\n        let parts = [];\n        location.search\n            .substr(1)\n            .split('&')\n            .forEach(function (item) {\n            parts = item.split('=');\n            if (parts.length > 1) {\n                pageQuery[parts[0]] = parts[1] && decodeURIComponent(parts[1]);\n            }\n        });\n        hashes.forEach(function (item) {\n            parts = item.split('=');\n            if (parts.length > 1) {\n                pageQuery[parts[0]] = parts[1] && decodeURIComponent(parts[1]);\n            }\n            else if (item.indexOf('/') === 0) {\n                pageQuery.paths = item.substr(1).split('/');\n            }\n        });\n        return pageQuery;\n    }\n    /**\n     * Much like {@link Formio.currentUser}, but instead automatically injects the Bearer tokens into the headers to\n     * perform a Token swap of the OAuth token which will then return the JWT token for that user.\n     *\n     * @param {Formio} formio - The Formio instance\n     * @param {string} token - An OAuth Bearer token to use for a token swap between the OAuth provider and Form.io\n     * @return {Promise<R>|*}\n     */\n    static oAuthCurrentUser(formio, token) {\n        return Formio.currentUser(formio, {\n            external: true,\n            headers: {\n                Authorization: `Bearer ${token}`,\n            },\n        });\n    }\n    static oauthLogoutURI(uri, options) {\n        options = typeof options === 'string' ? { namespace: options } : options || {};\n        const logoutURIName = `${options.namespace || Formio.namespace || 'formio'}LogoutAuthUrl`;\n        localStorage.setItem(logoutURIName, uri);\n        return Formio.tokens[logoutURIName];\n    }\n    /**\n     * Perform a SAML initialization.\n     *\n     * @description Typically, you would use the {@link Formio.ssoInit} method to perform this function\n     * since this method is an alias for the following.\n     *\n     * ```ts\n     * Formio.samlInit();\n     * Formio.ssoInit('saml');  // This is the exact same thing as calling Formio.samlInit\n     * ```\n     *\n     * This method will return false if the process is just starting. The code below is a typical block of code that is\n     * used to automatically trigger the SAML authentication process within your application using a Button component.\n     *\n     * ```ts\n     * if (Formio.pageQuery().saml) {\n     *   const sso = Formio.samlInit();\n     *   if (sso) {\n     *     sso.then((user) => {\n     *       // The SSO user is now loaded!\n     *       console.log(user);\n     *     });\n     *   }\n     * }\n     * ```\n     *\n     * You can then place the following code withiin the \"Custom\" action of a Button component on your form.\n     *\n     * ```ts\n     * Formio.samlInit();\n     * ```\n     *\n     * Now when you click on this button, it will start the handshake process with SAML, and once it returns, will pass\n     * a \"saml\" query parameter back to your application which will execute the code to load the current user from SAML.\n     *\n     * @param {object} options - Options to pass to the SAML initialization process.\n     * @param {string} options.relay - The URL that will be used as the authentication \"relay\" that occurs during a SAML handshake process.\n     * @return {boolean|Promise<Object>|void}\n     */\n    static samlInit(options = {}) {\n        const query = Formio.pageQuery();\n        if (query.saml) {\n            Formio.setUser(null);\n            const retVal = Formio.setToken(query.saml);\n            let uri = window.location.toString();\n            uri = uri.substring(0, uri.indexOf('?'));\n            if (window.location.hash) {\n                uri += window.location.hash;\n            }\n            window.history.replaceState({}, document.title, uri);\n            return retVal;\n        }\n        // Set the relay if not provided.\n        if (!options.relay) {\n            options.relay = window.location.href;\n        }\n        // go to the saml sso endpoint for this project.\n        const authUrl = Formio.authUrl || Formio.projectUrl;\n        window.location.href = `${authUrl}/saml/sso?relay=${encodeURI(options.relay)}`;\n        return false;\n    }\n    /**\n     * Perform an Okta Authentication process using the {@link https://developer.okta.com/code/javascript/okta_auth_sdk|Okta SDK}.\n     *\n     * @description This method does require that you first include the Okta JavaScript SDK within your application as follows.\n     *\n     * First you need to include the Okta Authentication script.\n     *\n     * ```html\n     * <script src=\"https://ok1static.oktacdn.com/assets/js/sdk/okta-auth-js/2.0.1/okta-auth-js.min.js\" type=\"text/javascript\"></script>\n     * ```\n     *\n     * Then you can call this method as follows.\n     *\n     * ```ts\n     * Formio.oktaInit();\n     * ```\n     *\n     * @param {object} options - Options that are passed directly to the {@link https://github.com/okta/okta-auth-js#configuration-reference|Okta SDK constructor}\n     * @param {constructor} options.OktaAuth - If the OktaAuth constructor is not provided global to the application, it can be provided to this method using this property.\n     * @param {Formio} options.formio - The Formio instance.\n     * @param {Array<string>} options.scopes - Scopes that are passed to the {@link https://github.com/okta/okta-auth-js#tokengetwithredirectoptions|getWithRedirect} method from the Okta SDK.\n     * @return {Promise<Object>}\n     */\n    static oktaInit(options = {}) {\n        if (typeof OktaAuth !== 'undefined') {\n            options.OktaAuth = OktaAuth;\n        }\n        if (typeof options.OktaAuth === 'undefined') {\n            const errorMessage = 'Cannot find OktaAuth. Please include the Okta JavaScript SDK within your application. See https://developer.okta.com/code/javascript/okta_auth_sdk for an example.';\n            console.warn(errorMessage);\n            return Promise.reject(errorMessage);\n        }\n        return new Promise((resolve, reject) => {\n            const Okta = options.OktaAuth;\n            delete options.OktaAuth;\n            const authClient = new Okta(options);\n            authClient.tokenManager\n                .get('accessToken')\n                .then((accessToken) => {\n                if (accessToken) {\n                    resolve(Formio.oAuthCurrentUser(options.formio, accessToken.accessToken));\n                }\n                else if (location.hash) {\n                    authClient.token\n                        .parseFromUrl()\n                        .then((token) => {\n                        authClient.tokenManager.add('accessToken', token);\n                        resolve(Formio.oAuthCurrentUser(options.formio, token.accessToken));\n                    })\n                        .catch((err) => {\n                        console.warn(err);\n                        reject(err);\n                    });\n                }\n                else {\n                    authClient.token.getWithRedirect({\n                        responseType: 'token',\n                        scopes: options.scopes,\n                    });\n                    resolve(false);\n                }\n            })\n                .catch((error) => {\n                reject(error);\n            });\n        });\n    }\n    /**\n     * A common static method to trigger any SSO processes. This method is really just an alias for other static methods.\n     *\n     * @param {('saml'|'okta')} type - The type of SSO to trigger. 'saml' is an alias for {@link Formio.samlInit}, and 'okta' is an alias for {@link Formio.oktaInit}.\n     * @param {object} options - Options to pass to the specific sso methods\n     * @return {*|Promise<Object>|boolean|void}\n     */\n    static ssoInit(type, options = {}) {\n        switch (type) {\n            case 'saml':\n                return Formio.samlInit(options);\n            case 'okta':\n                return Formio.oktaInit(options);\n            default:\n                console.warn('Unknown SSO type');\n                return Promise.reject('Unknown SSO type');\n        }\n    }\n    /**\n     * Lazy load a remote library dependency.\n     *\n     * @description This is useful for components that wish to lazy load a required library\n     * by adding that library to the <scripts> section of the HTML webpage, and then provide a promise that will resolve\n     * when the library becomes available for use.\n     *\n     * @example Load Google Maps API.\n     * ```ts\n     * Formio.requireLibrary('googleMaps', 'google.maps.Map', 'https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap', true).then(() => {\n     *   // Once the promise resolves, the following can now be used within your application.\n     *   const map = new google.maps.Map(document.getElementById(\"map\"), {...});\n     * });\n     * ```\n     *\n     * @param {string} name - The internal name to give to the library you are loading. This is useful for caching the library for later use.\n     * @param {string} property - The name of the global property that will be added to the global namespace once the library has been loaded. This is used to check to see if the property exists before resolving the promise that the library is ready for use.\n     * @param {string} src - The URL of the library to lazy load.\n     * @param {boolean} polling - Determines if polling should be used to determine if they library is ready to use. If set to false, then it will rely on a global callback called ${name}Callback where \"name\" is the first property passed to this method. When this is called, that will indicate when the library is ready. In most cases, you will want to pass true to this parameter to initiate a polling method to check for the library availability in the global context.\n     * @param {HTMLElement} rootElement - The element after which the resource would be attached (useful when requiring resources from ShadowRoot).\n     * @return {Promise<object>} - A promise that will resolve when the plugin is ready to be used.\n     */\n    static requireLibrary(name, property, src, polling = false, onload, rootElement) {\n        const resourceToDomOptions = {\n            name,\n            src,\n            formio: Formio,\n            onload,\n            rootElement,\n        };\n        let hasResourceBeenAdded = false;\n        if (!Formio.libraries.hasOwnProperty(name)) {\n            Formio.libraries[name] = {};\n            Formio.libraries[name].ready = new Promise((resolve, reject) => {\n                Formio.libraries[name].resolve = resolve;\n                Formio.libraries[name].reject = reject;\n            });\n            resourceToDomOptions.onerror = (e) => {\n                // reject library promise if script fails to load\n                Formio.libraries[name].reject(e);\n            };\n            const callbackName = `${name}Callback`;\n            if (!polling && !window[callbackName]) {\n                window[callbackName] = () => Formio.libraries[name].resolve();\n            }\n            // See if the plugin already exists.\n            const plugin = (0, lodash_1.get)(window, property);\n            if (plugin) {\n                Formio.libraries[name].resolve(plugin);\n            }\n            else {\n                (0, utils_1.attachResourceToDom)(resourceToDomOptions);\n                hasResourceBeenAdded = true;\n                // if no callback is provided, then check periodically for the script.\n                if (polling) {\n                    const interval = setInterval(() => {\n                        const plugin = (0, lodash_1.get)(window, property);\n                        if (plugin) {\n                            clearInterval(interval);\n                            Formio.libraries[name].resolve(plugin);\n                        }\n                    }, 200);\n                }\n            }\n        }\n        const lib = Formio.libraries[name];\n        if (rootElement && !hasResourceBeenAdded) {\n            (0, utils_1.attachResourceToDom)(resourceToDomOptions);\n        }\n        return onload && lib.loaded ? onload(lib.ready) : lib.ready;\n    }\n    /**\n     * Determines if a lazy loaded library is ready to be used.\n     *\n     * @description Example: Let's assume that the example provided at {@link Formio.requireLibrary} was used elsewhere in your application.\n     * You could now use the following within a separate place that will also resolve once the library is ready to be used.\n     *\n     * ```js\n     * Formio.libraryReady('googleMaps').then(() => {\n     *   // Once the promise resolves, the following can now be used within your application.\n     *   const map = new google.maps.Map(document.getElementById(\"map\"), {...});\n     * });\n     * ```\n     *\n     * @param {string} name - The name of the library to check.\n     * @return {Promise<object>} - A promise that will resolve when the library is ready to be used.\n     */\n    static libraryReady(name) {\n        if (Formio.libraries.hasOwnProperty(name) && Formio.libraries[name].ready) {\n            return Formio.libraries[name].ready;\n        }\n        return Promise.reject(`${name} library was not required.`);\n    }\n    /**\n     * Clones the response from the API so that it cannot be mutated.\n     *\n     * @param response\n     */\n    static cloneResponse(response) {\n        const copy = (0, fastCloneDeep_1.fastCloneDeep)(response);\n        if (Array.isArray(response)) {\n            copy.skip = response.skip;\n            copy.limit = response.limit;\n            copy.serverCount = response.serverCount;\n        }\n        return copy;\n    }\n    /**\n     * Sets the project path type.\n     *\n     * @param type\n     */\n    static setPathType(type) {\n        if (typeof type === 'string') {\n            Formio.pathType = type;\n        }\n    }\n    /**\n     * Gets the project path type.\n     */\n    static getPathType() {\n        return Formio.pathType;\n    }\n}\nexports.Formio = Formio;\n/**\n * The base API url of the Form.io Platform. Example: https://api.form.io\n */\nFormio.baseUrl = 'https://api.form.io';\n/**\n * The project API url of the Form.io Project. Example: https://examples.form.io\n */\nFormio.projectUrl = '';\n/**\n * The project url to use for Authentication.\n */\nFormio.authUrl = '';\n/**\n * Set to true if the project url has been established with ```Formio.setProjectUrl()```\n */\nFormio.projectUrlSet = false;\n/**\n * The Form.io API Cache. This ensures that requests to the same API endpoint are cached.\n */\nFormio.cache = {};\n/**\n * The namespace used to save the Form.io Token's and variables within an application.\n */\nFormio.namespace = '';\n/**\n * Handles events fired within this SDK library.\n */\nFormio.events = new eventemitter3_1.default();\n/**\n * Stores all of the libraries lazy loaded with ```Formio.requireLibrary``` method.\n */\nFormio.libraries = {};\n/**\n * A direct interface to the Form.io fetch polyfill.\n */\nFormio.fetch = fetch;\n/**\n * A direct interface to the Form.io fetch Headers polyfill.\n */\nFormio.Headers = Headers;\n/**\n * All of the auth tokens for this session.\n */\nFormio.tokens = {};\n/**\n * The version of this library.\n */\nFormio.version = '---VERSION---';\n/**\n * The global options for the Formio library.\n */\nFormio.options = {};\n// Add Plugin methods.\nFormio.plugins = Plugins_1.default.plugins;\nFormio.deregisterPlugin = Plugins_1.default.deregisterPlugin;\nFormio.registerPlugin = Plugins_1.default.registerPlugin;\nFormio.getPlugin = Plugins_1.default.getPlugin;\nFormio.pluginWait = Plugins_1.default.pluginWait;\nFormio.pluginGet = Plugins_1.default.pluginGet;\nFormio.pluginAlter = Plugins_1.default.pluginAlter;\n// Adds Formio to the Plugins Interface.\nPlugins_1.default.Formio = Formio;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/sdk/Formio.js?");
 
 /***/ }),
 
@@ -4850,7 +4850,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst moment_1 = __importDefault(__webpack_require__(/*! moment */ \"./node_modules/moment/moment.js\"));\nconst compare_versions_1 = __webpack_require__(/*! compare-versions */ \"./node_modules/compare-versions/lib/esm/index.js\");\nconst EventEmitter_1 = __importDefault(__webpack_require__(/*! ./EventEmitter */ \"./lib/cjs/EventEmitter.js\"));\nconst i18n_1 = __importDefault(__webpack_require__(/*! ./i18n */ \"./lib/cjs/i18n.js\"));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst Components_1 = __importDefault(__webpack_require__(/*! ./components/Components */ \"./lib/cjs/components/Components.js\"));\nconst NestedDataComponent_1 = __importDefault(__webpack_require__(/*! ./components/_classes/nesteddata/NestedDataComponent */ \"./lib/cjs/components/_classes/nesteddata/NestedDataComponent.js\"));\nconst utils_1 = __webpack_require__(/*! ./utils */ \"./lib/cjs/utils/index.js\");\n// We need this here because dragula pulls in CustomEvent class that requires global to exist.\nif (typeof window !== 'undefined' && typeof window.global === 'undefined') {\n    window.global = window;\n}\nconst dragula_1 = __importDefault(__webpack_require__(/*! dragula */ \"./node_modules/dragula/dragula.js\"));\n// Initialize the available forms.\nFormio_1.Formio.forms = {};\n// Allow people to register components.\nFormio_1.Formio.registerComponent = Components_1.default.setComponent;\n/**\n *\n * @param {any} icons  - The icons to use.\n * @returns {any} - The icon set.\n */\nfunction getIconSet(icons) {\n    if (icons === \"fontawesome\") {\n        return \"fa\";\n    }\n    return icons || \"\";\n}\n/**\n *\n * @param {any} options - The options to get.\n * @returns {any} - The options.\n */\nfunction getOptions(options) {\n    options = lodash_1.default.defaults(options, {\n        submitOnEnter: false,\n        iconset: getIconSet(options && options.icons ? options.icons : Formio_1.Formio.icons),\n        i18next: null,\n        saveDraft: false,\n        alwaysDirty: false,\n        saveDraftThrottle: 5000,\n        display: \"form\",\n        cdnUrl: Formio_1.Formio.cdn.baseUrl,\n    });\n    if (!options.events) {\n        options.events = new EventEmitter_1.default();\n    }\n    return options;\n}\n/**\n * Represents a JSON value.\n * @typedef {(string | number | boolean | null | JSONArray | JSONObject)} JSON\n */\n/**\n * Represents a JSON array.\n * @typedef {Array<JSON>} JSONArray\n */\n/**\n * Represents a JSON object.\n * @typedef {{[key: string]: JSON}} JSONObject\n */\n/**\n * @typedef {object} FormioHooks\n * @property {Function} [beforeSubmit] - A function that is called before the form is submitted.\n * @property {Function} [beforeCancel] - A function that is called before the form is canceled.\n * @property {Function} [beforeNext] - A function that is called before moving to the next page in a multi-page form.\n * @property {Function} [beforePrev] - A function that is called before moving to the previous page in a multi-page form.\n * @property {Function} [attachComponent] - A function that is called when a component is attached to the form.\n * @property {Function} [setDataValue] - A function that is called when setting the value of a data component.\n * @property {Function} [addComponents] - A function that is called when adding multiple components to the form.\n * @property {Function} [addComponent] - A function that is called when adding a single component to the form.\n * @property {Function} [customValidation] - A function that is called for custom validation of the form.\n * @property {Function} [attachWebform] - A function that is called when attaching a webform to the form.\n */\n/**\n * @typedef {object} SanitizeConfig\n * @property {string[]} [addAttr] - The attributes to add.\n * @property {string[]} [addTags] - The tags to add.\n * @property {string[]} [allowedAttrs] - The allowed attributes.\n * @property {string[]} [allowedTags] - The allowed tags.\n * @property {string[]} [allowedUriRegex] - The allowed URI regex.\n * @property {string[]} [addUriSafeAttr] - The URI safe attributes.\n */\n/**\n * @typedef {object} ButtonSettings\n * @property {boolean} [showPrevious] - Show the \"Previous\" button.\n * @property {boolean} [showNext] - Show the \"Next\" button.\n * @property {boolean} [showCancel] - Show the \"Cancel\" button.\n * @property {boolean} [showSubmit] - Show the \"Submit\" button.\n */\n/**\n * @typedef {object} FormOptions\n * @property {boolean} [saveDraft] - Enable the save draft feature.\n * @property {number} [saveDraftThrottle] - The throttle for the save draft feature.\n * @property {boolean} [readOnly] - Set this form to readOnly.\n * @property {boolean} [noAlerts] - Disable the alerts dialog.\n * @property {{[key: string]: string}} [i18n] - The translation file for this rendering.\n * @property {string} [template] - Custom logic for creation of elements.\n * @property {boolean} [noDefaults] - Exclude default values from the settings.\n * @property {any} [fileService] - The file service for this form.\n * @property {EventEmitter} [events] - The EventEmitter for this form.\n * @property {string} [language] - The language to render this form in.\n * @property {{[key: string]: string}} [i18next] - The i18next configuration for this form.\n * @property {boolean} [viewAsHtml] - View the form as raw HTML.\n * @property {'form' | 'html' | 'flat' | 'builder' | 'pdf'} [renderMode] - The render mode for this form.\n * @property {boolean} [highlightErrors] - Highlight any errors on the form.\n * @property {string} [componentErrorClass] - The error class for components.\n * @property {any} [templates] - The templates for this form.\n * @property {string} [iconset] - The iconset for this form.\n * @property {import('@formio/core').Component[]} [components] - The components for this form.\n * @property {{[key: string]: boolean}} [disabled] - Disabled components for this form.\n * @property {boolean} [showHiddenFields] - Show hidden fields.\n * @property {{[key: string]: boolean}} [hide] - Hidden components for this form.\n * @property {{[key: string]: boolean}} [show] - Components to show for this form.\n * @property {Formio} [formio] - The Formio instance for this form.\n * @property {string} [decimalSeparator] - The decimal separator for this form.\n * @property {string} [thousandsSeparator] - The thousands separator for this form.\n * @property {FormioHooks} [hooks] - The hooks for this form.\n * @property {boolean} [alwaysDirty] - Always be dirty.\n * @property {boolean} [skipDraftRestore] - Skip restoring a draft.\n * @property {'form' | 'wizard' | 'pdf'} [display] - The display for this form.\n * @property {string} [cdnUrl] - The CDN url for this form.\n * @property {boolean} [flatten] - Flatten the form.\n * @property {boolean} [sanitize] - Sanitize the form.\n * @property {SanitizeConfig} [sanitizeConfig] - The sanitize configuration for this form.\n * @property {ButtonSettings} [buttonSettings] - The button settings for this form.\n * @property {object} [breadcrumbSettings] - The breadcrumb settings for this form.\n * @property {boolean} [allowPrevious] - Allow the previous button (for Wizard forms).\n * @property {string[]} [wizardButtonOrder] - The order of the buttons (for Wizard forms).\n * @property {boolean} [showCheckboxBackground] - Show the checkbox background.\n * @property {boolean} [inputsOnly] - Only show inputs in the form and no labels.\n * @property {boolean} [building] - If we are in the process of building the form.\n * @property {number} [zoom] - The zoom for PDF forms.\n */\nclass Webform extends NestedDataComponent_1.default {\n    /**\n     * Creates a new Form instance.\n     * @param {HTMLElement | object | import('Form').FormOptions} [elementOrOptions] - The DOM element to render this form within or the options to create this form instance.\n     * @param {import('Form').FormOptions} [options] - The options to create a new form instance.\n     */\n    constructor(elementOrOptions, options = undefined) {\n        let element, formOptions;\n        if (elementOrOptions instanceof HTMLElement || options) {\n            element = elementOrOptions;\n            formOptions = options || {};\n        }\n        else {\n            formOptions = elementOrOptions || {};\n        }\n        super(null, getOptions(formOptions));\n        this.executeShortcuts = (event) => {\n            const { target } = event;\n            if (!this.keyboardCatchableElement(target)) {\n                return;\n            }\n            const ctrl = event.ctrlKey || event.metaKey;\n            const keyCode = event.keyCode;\n            let char = \"\";\n            if (65 <= keyCode && keyCode <= 90) {\n                char = String.fromCharCode(keyCode);\n            }\n            else if (keyCode === 13) {\n                char = \"Enter\";\n            }\n            else if (keyCode === 27) {\n                char = \"Esc\";\n            }\n            lodash_1.default.each(this.shortcuts, (shortcut) => {\n                if (shortcut.ctrl && !ctrl) {\n                    return;\n                }\n                if (shortcut.shortcut === char) {\n                    shortcut.element.click();\n                    event.preventDefault();\n                }\n            });\n        };\n        this.setElement(element);\n        // Keep track of all available forms globally.\n        Formio_1.Formio.forms[this.id] = this;\n        // Set the base url.\n        if (this.options.baseUrl) {\n            Formio_1.Formio.setBaseUrl(this.options.baseUrl);\n        }\n        /**\n         * The type of this element.\n         * @type {string}\n         */\n        this.type = \"form\";\n        this._src = \"\";\n        this._loading = false;\n        this._form = {};\n        this.draftEnabled = false;\n        this.savingDraft = false;\n        if (this.options.saveDraftThrottle) {\n            this.triggerSaveDraft = lodash_1.default.throttle(this.saveDraft.bind(this), this.options.saveDraftThrottle);\n        }\n        else {\n            this.triggerSaveDraft = this.saveDraft.bind(this);\n        }\n        /**\n         * Determines if this form should submit the API on submit.\n         * @type {boolean}\n         */\n        this.nosubmit = false;\n        /**\n         * Determines if the form has tried to be submitted, error or not.\n         * @type {boolean}\n         */\n        this.submitted = false;\n        /**\n         * Determines if the form is being submitted at the moment.\n         * @type {boolean}\n         */\n        this.submitting = false;\n        /**\n         * The Formio instance for this form.\n         * @type {Formio}\n         */\n        this.formio = null;\n        /**\n         * The loader HTML element.\n         * @type {HTMLElement}\n         */\n        this.loader = null;\n        /**\n         * The alert HTML element\n         * @type {HTMLElement}\n         */\n        this.alert = null;\n        /**\n         * Promise that is triggered when the submission is done loading.\n         * @type {Promise}\n         */\n        this.onSubmission = null;\n        /**\n         * Determines if this submission is explicitly set.\n         * @type {boolean}\n         */\n        this.submissionSet = false;\n        /**\n         * Promise that executes when the form is ready and rendered.\n         * @type {Promise}\n         * @example\n         * import Webform from '@formio/js/Webform';\n         * let form = new Webform(document.getElementById('formio'));\n         * form.formReady.then(() => {\n         *   console.log('The form is ready!');\n         * });\n         * form.src = 'https://examples.form.io/example';\n         */\n        this.formReady = new Promise((resolve, reject) => {\n            /**\n             * Called when the formReady state of this form has been resolved.\n             * @type {Function}\n             */\n            this.formReadyResolve = resolve;\n            /**\n             * Called when this form could not load and is rejected.\n             * @type {Function}\n             */\n            this.formReadyReject = reject;\n        });\n        /**\n         * Promise that executes when the submission is ready and rendered.\n         * @type {Promise}\n         * @example\n         * import Webform from '@formio/js/Webform';\n         * let form = new Webform(document.getElementById('formio'));\n         * form.submissionReady.then(() => {\n         *   console.log('The submission is ready!');\n         * });\n         * form.src = 'https://examples.form.io/example/submission/234234234234234243';\n         */\n        this.submissionReady = new Promise((resolve, reject) => {\n            /**\n             * Called when the formReady state of this form has been resolved.\n             * @type {Function}\n             */\n            this.submissionReadyResolve = resolve;\n            /**\n             * Called when this form could not load and is rejected.\n             * @type {Function}\n             */\n            this.submissionReadyReject = reject;\n        });\n        this.shortcuts = [];\n        // Set language after everything is established.\n        this.language = this.i18next.language;\n        // See if we need to restore the draft from a user.\n        if (this.options.saveDraft) {\n            if (this.options.skipDraftRestore) {\n                this.draftEnabled = true;\n                this.savingDraft = false;\n            }\n            else {\n                this.formReady.then(() => {\n                    const user = Formio_1.Formio.getUser();\n                    // Only restore a draft if the submission isn't explicitly set.\n                    if (user && !this.submissionSet) {\n                        this.restoreDraft(user._id);\n                    }\n                });\n            }\n        }\n        this.component.clearOnHide = false;\n        // Ensure the root is set to this component.\n        this.root = this;\n        this.localRoot = this;\n        this.root.dragulaLib = dragula_1.default;\n    }\n    /* eslint-enable max-statements */\n    get language() {\n        return this.options.language;\n    }\n    get emptyValue() {\n        return null;\n    }\n    componentContext() {\n        return this._data;\n    }\n    /**\n     * Sets the language for this form.\n     * @param {string} lang - The language to use (e.g. 'en', 'sp', etc.)\n     */\n    set language(lang) {\n        if (!this.i18next) {\n            return;\n        }\n        this.options.language = lang;\n        if (this.i18next.language === lang) {\n            return;\n        }\n        this.i18next.changeLanguage(lang, (err) => {\n            if (err) {\n                return;\n            }\n            this.rebuild();\n            this.emit(\"languageChanged\");\n        });\n    }\n    get componentComponents() {\n        return this.form.components;\n    }\n    get shadowRoot() {\n        return this.options.shadowRoot;\n    }\n    /**\n     * Add a language for translations\n     * @param {string} code - The language code for the language being added.\n     * @param {object} lang - The language translations.\n     * @param {boolean} [active] - If this language should be set as the active language.\n     */\n    addLanguage(code, lang, active = false) {\n        if (this.i18next) {\n            var translations = lodash_1.default.assign((0, utils_1.fastCloneDeep)(i18n_1.default.resources.en.translation), lang);\n            this.i18next.addResourceBundle(code, \"translation\", translations, true, true);\n            if (active) {\n                this.language = code;\n            }\n        }\n    }\n    keyboardCatchableElement(element) {\n        if (element.nodeName === \"TEXTAREA\") {\n            return false;\n        }\n        if (element.nodeName === \"INPUT\") {\n            return [\"text\", \"email\", \"password\"].indexOf(element.type) === -1;\n        }\n        return true;\n    }\n    addShortcut(element, shortcut) {\n        if (!shortcut || !/^([A-Z]|Enter|Esc)$/i.test(shortcut)) {\n            return;\n        }\n        shortcut = lodash_1.default.capitalize(shortcut);\n        if (shortcut === \"Enter\" || shortcut === \"Esc\") {\n            // Restrict Enter and Esc only for buttons\n            if (element.tagName !== \"BUTTON\") {\n                return;\n            }\n            this.shortcuts.push({\n                shortcut,\n                element,\n            });\n        }\n        else {\n            this.shortcuts.push({\n                ctrl: true,\n                shortcut,\n                element,\n            });\n        }\n    }\n    removeShortcut(element, shortcut) {\n        if (!shortcut || !/^([A-Z]|Enter|Esc)$/i.test(shortcut)) {\n            return;\n        }\n        lodash_1.default.remove(this.shortcuts, {\n            shortcut,\n            element,\n        });\n    }\n    /**\n     * Get the embed source of the form.\n     * @returns {string} - The source of the form.\n     */\n    get src() {\n        return this._src;\n    }\n    /**\n     * Loads the submission if applicable.\n     * @returns {Promise} - The promise that is triggered when the submission is loaded.\n     */\n    loadSubmission() {\n        this.loadingSubmission = true;\n        if (this.formio.submissionId) {\n            this.onSubmission = this.formio\n                .loadSubmission()\n                .then((submission) => this.setSubmission(submission), (err) => this.submissionReadyReject(err))\n                .catch((err) => this.submissionReadyReject(err));\n        }\n        else {\n            this.submissionReadyResolve();\n        }\n        return this.submissionReady;\n    }\n    /**\n     * Set the src of the form renderer.\n     * @param {string} value - The source value to set.\n     * @param {any} options - The options to set.\n     * @returns {Promise} - The promise that is triggered when the form is set.\n     */\n    setSrc(value, options) {\n        if (this.setUrl(value, options)) {\n            this.nosubmit = false;\n            return this.formio\n                .loadForm({ params: { live: 1 } })\n                .then((form) => {\n                const setForm = this.setForm(form);\n                this.loadSubmission();\n                return setForm;\n            })\n                .catch((err) => {\n                console.warn(err);\n                this.formReadyReject(err);\n            });\n        }\n        return Promise.resolve();\n    }\n    /**\n     * Set the Form source, which is typically the Form.io embed URL.\n     * @param {string} value - The value of the form embed url.\n     * @example\n     * import Webform from '@formio/js/Webform';\n     * let form = new Webform(document.getElementById('formio'));\n     * form.formReady.then(() => {\n     *   console.log('The form is formReady!');\n     * });\n     * form.src = 'https://examples.form.io/example';\n     */\n    set src(value) {\n        this.setSrc(value);\n    }\n    /**\n     * Get the embed source of the form.\n     * @returns {string} - returns the source of the form.\n     */\n    get url() {\n        return this._src;\n    }\n    /**\n     * Sets the url of the form renderer.\n     * @param {string} value - The value to set the url to.\n     * @param {any} options - The options to set.\n     * @returns {boolean} - TRUE means the url was set, FALSE otherwise.\n     */\n    setUrl(value, options) {\n        if (!value || typeof value !== \"string\" || value === this._src) {\n            return false;\n        }\n        this._src = value;\n        this.nosubmit = true;\n        this.formio = this.options.formio = new Formio_1.Formio(value, options);\n        if (this.type === \"form\") {\n            // Set the options source so this can be passed to other components.\n            this.options.src = value;\n        }\n        return true;\n    }\n    /**\n     * Set the form source but don't initialize the form and submission from the url.\n     * @param {string} value - The value of the form embed url.\n     */\n    set url(value) {\n        this.setUrl(value);\n    }\n    /**\n     * Called when both the form and submission have been loaded.\n     * @returns {Promise} - The promise to trigger when both form and submission have loaded.\n     */\n    get ready() {\n        return this.formReady.then(() => {\n            return super.ready.then(() => {\n                return this.loadingSubmission ? this.submissionReady : true;\n            });\n        });\n    }\n    /**\n     * Returns if this form is loading.\n     * @returns {boolean} - TRUE means the form is loading, FALSE otherwise.\n     */\n    get loading() {\n        return this._loading;\n    }\n    /**\n     * Set the loading state for this form, and also show the loader spinner.\n     * @param {boolean} loading - If this form should be \"loading\" or not.\n     */\n    set loading(loading) {\n        if (this._loading !== loading) {\n            this._loading = loading;\n            if (!this.loader && loading) {\n                this.loader = this.ce(\"div\", {\n                    class: \"loader-wrapper\",\n                });\n                const spinner = this.ce(\"div\", {\n                    class: \"loader text-center\",\n                });\n                this.loader.appendChild(spinner);\n            }\n            /* eslint-disable max-depth */\n            if (this.loader) {\n                try {\n                    if (loading) {\n                        this.prependTo(this.loader, this.wrapper);\n                    }\n                    else {\n                        this.removeChildFrom(this.loader, this.wrapper);\n                    }\n                }\n                catch (err) {\n                    // ingore\n                }\n            }\n            /* eslint-enable max-depth */\n        }\n    }\n    /**\n     * Sets the JSON schema for the form to be rendered.\n     * @example\n     * import Webform from '@formio/js/Webform';\n     * let form = new Webform(document.getElementById('formio'));\n     * form.setForm({\n     *   components: [\n     *     {\n     *       type: 'textfield',\n     *       key: 'firstName',\n     *       label: 'First Name',\n     *       placeholder: 'Enter your first name.',\n     *       input: true\n     *     },\n     *     {\n     *       type: 'textfield',\n     *       key: 'lastName',\n     *       label: 'Last Name',\n     *       placeholder: 'Enter your last name',\n     *       input: true\n     *     },\n     *     {\n     *       type: 'button',\n     *       action: 'submit',\n     *       label: 'Submit',\n     *       theme: 'primary'\n     *     }\n     *   ]\n     * });\n     * @param {object} form - The JSON schema of the form @see https://examples.form.io/example for an example JSON schema.\n     * @param {any} flags - Any flags to apply when setting the form.\n     * @returns {Promise} - The promise that is triggered when the form is set.\n     */\n    setForm(form, flags = {}) {\n        var _a;\n        const isFormAlreadySet = this._form && ((_a = this._form.components) === null || _a === void 0 ? void 0 : _a.length);\n        try {\n            // Do not set the form again if it has been already set\n            if (isFormAlreadySet && JSON.stringify(this._form) === JSON.stringify(form)) {\n                this.formReadyResolve();\n                return Promise.resolve();\n            }\n            // Create the form.\n            this._form = (flags === null || flags === void 0 ? void 0 : flags.keepAsReference) ? form : lodash_1.default.cloneDeep(form);\n            if (this.onSetForm) {\n                this.onSetForm(lodash_1.default.cloneDeep(this._form), form);\n            }\n        }\n        catch (err) {\n            console.warn(err);\n            // If provided form is not a valid JSON object, do not set it too\n            this.formReadyReject(err);\n            return Promise.resolve();\n        }\n        // Allow the form to provide component overrides.\n        if (form && form.settings && form.settings.components) {\n            this.options.components = form.settings.components;\n        }\n        if (form && form.properties) {\n            this.options.properties = form.properties;\n        }\n        // Use the sanitize config from the form settings or the global sanitize config if it is not provided in the options\n        if (!this.options.sanitizeConfig && !this.builderMode) {\n            this.options.sanitizeConfig =\n                lodash_1.default.get(form, \"settings.sanitizeConfig\") ||\n                    lodash_1.default.get(form, \"globalSettings.sanitizeConfig\");\n        }\n        if (\"schema\" in form && (0, compare_versions_1.compareVersions)(form.schema, \"1.x\") > 0) {\n            this.ready.then(() => {\n                this.setAlert(\"alert alert-danger\", \"Form schema is for a newer version, please upgrade your renderer. Some functionality may not work.\");\n            });\n        }\n        // See if they pass a module, and evaluate it if so.\n        if (form && form.module) {\n            let formModule = null;\n            if (typeof form.module === \"string\") {\n                try {\n                    formModule = this.evaluate(`return ${form.module}`);\n                }\n                catch (err) {\n                    console.warn(err);\n                }\n            }\n            else {\n                formModule = form.module;\n            }\n            if (formModule) {\n                Formio_1.Formio.use(formModule);\n                // Since we got here after instantiation, we need to manually apply form options.\n                if (formModule.options && formModule.options.form) {\n                    this.options = Object.assign(this.options, formModule.options.form);\n                }\n            }\n        }\n        this.initialized = false;\n        const rebuild = this.rebuild() || Promise.resolve();\n        return rebuild.then(() => {\n            this.emit('formLoad', form);\n            if (!this.options.server) {\n                this.triggerCaptcha();\n            }\n            // Make sure to trigger onChange after a render event occurs to speed up form rendering.\n            setTimeout(() => {\n                this.onChange(flags);\n                this.formReadyResolve();\n            }, 0);\n            return this.formReady;\n        });\n    }\n    /**\n     * Gets the form object.\n     * @returns {object} - The form JSON schema.\n     */\n    get form() {\n        if (!this._form) {\n            this._form = {\n                components: [],\n            };\n        }\n        return this._form;\n    }\n    /**\n     * Sets the form value.\n     * @alias setForm\n     * @param {object} form - The form schema object.\n     */\n    set form(form) {\n        this.setForm(form);\n    }\n    /**\n     * Returns the submission object that was set within this form.\n     * @returns {object} - The submission object.\n     */\n    get submission() {\n        return this.getValue();\n    }\n    /**\n     * Sets the submission of a form.\n     * @example\n     * import Webform from '@formio/js/Webform';\n     * let form = new Webform(document.getElementById('formio'));\n     * form.src = 'https://examples.form.io/example';\n     * form.submission = {data: {\n     *   firstName: 'Joe',\n     *   lastName: 'Smith',\n     *   email: 'joe@example.com'\n     * }};\n     * @param {object} submission - The Form.io submission object.\n     */\n    set submission(submission) {\n        this.setSubmission(submission);\n    }\n    /**\n     * Sets the submission value\n     * @param {object|null|undefined} submission - The submission to set.\n     * @param {object|null|undefined} flags - Any flags to apply when setting the submission.\n     * @returns {void}\n     */\n    onSetSubmission(submission, flags = {}) {\n        this.submissionSet = true;\n        this.triggerChange(flags);\n        this.emit('beforeSetSubmission', submission);\n        this.setValue(submission, flags);\n    }\n    /**\n     * Sets a submission and returns the promise when it is ready.\n     * @param {any} submission - The submission to set.\n     * @param {any} flags - Any flags to apply when setting the submission.\n     * @returns {Promise} - The promise that is triggered when the submission is set.\n     */\n    setSubmission(submission, flags = {}) {\n        flags = Object.assign(Object.assign({}, flags), { fromSubmission: lodash_1.default.has(flags, \"fromSubmission\") ? flags.fromSubmission : true });\n        return (this.onSubmission = this.formReady\n            .then((resolveFlags) => {\n            if (resolveFlags) {\n                flags = Object.assign(Object.assign({}, flags), resolveFlags);\n            }\n            this.onSetSubmission(submission, flags);\n            return this.submissionReadyResolve(submission);\n        }, (err) => this.submissionReadyReject(err))\n            .catch((err) => this.submissionReadyReject(err)));\n    }\n    handleDraftError(errName, errDetails, restoreDraft) {\n        const errorMessage = lodash_1.default.trim(`${this.t(errName)} ${errDetails || \"\"}`);\n        console.warn(errorMessage);\n        this.emit(restoreDraft ? \"restoreDraftError\" : \"saveDraftError\", errDetails || errorMessage);\n    }\n    saveDraft() {\n        var _a;\n        if (!this.draftEnabled || ((_a = this.parent) === null || _a === void 0 ? void 0 : _a.component.reference) === false) {\n            return;\n        }\n        if (!this.formio) {\n            this.handleDraftError(\"saveDraftInstanceError\");\n            return;\n        }\n        if (!Formio_1.Formio.getUser()) {\n            this.handleDraftError(\"saveDraftAuthError\");\n            return;\n        }\n        const draft = (0, utils_1.fastCloneDeep)(this.submission);\n        draft.state = \"draft\";\n        if (!this.savingDraft && !this.submitting) {\n            this.emit(\"saveDraftBegin\");\n            this.savingDraft = true;\n            this.formio\n                .saveSubmission(draft)\n                .then((sub) => {\n                // Set id to submission to avoid creating new draft submission\n                this.submission._id = sub._id;\n                this.savingDraft = false;\n                this.emit(\"saveDraft\", sub);\n            })\n                .catch((err) => {\n                this.savingDraft = false;\n                this.handleDraftError(\"saveDraftError\", err);\n            });\n        }\n    }\n    /**\n     * Restores a draft submission based on the user who is authenticated.\n     * @param {string} userId - The user id where we need to restore the draft from.\n     */\n    restoreDraft(userId) {\n        const formio = this.formio || this.options.formio;\n        if (!formio) {\n            this.handleDraftError(\"restoreDraftInstanceError\", null, true);\n            return;\n        }\n        this.savingDraft = true;\n        formio\n            .loadSubmissions({\n            params: {\n                state: 'draft',\n                owner: userId,\n                sort: '-created'\n            },\n        })\n            .then((submissions) => {\n            if (submissions.length > 0 && !this.options.skipDraftRestore) {\n                const draft = (0, utils_1.fastCloneDeep)(submissions[0]);\n                return this.setSubmission(draft).then(() => {\n                    this.draftEnabled = true;\n                    this.savingDraft = false;\n                    this.emit(\"restoreDraft\", draft);\n                });\n            }\n            // Enable drafts so that we can keep track of changes.\n            this.draftEnabled = true;\n            this.savingDraft = false;\n            this.emit(\"restoreDraft\", null);\n        })\n            .catch((err) => {\n            this.draftEnabled = true;\n            this.savingDraft = false;\n            this.handleDraftError(\"restoreDraftError\", err, true);\n        });\n    }\n    get schema() {\n        const schema = (0, utils_1.fastCloneDeep)(lodash_1.default.omit(this._form, [\"components\"]));\n        schema.components = [];\n        this.eachComponent((component) => schema.components.push(component.schema));\n        return schema;\n    }\n    mergeData(_this, _that) {\n        lodash_1.default.mergeWith(_this, _that, (thisValue, thatValue) => {\n            if (Array.isArray(thisValue) &&\n                Array.isArray(thatValue) &&\n                thisValue.length !== thatValue.length) {\n                return thatValue;\n            }\n        });\n    }\n    setValue(submission, flags = {}) {\n        if (!submission || !submission.data) {\n            submission = {\n                data: {},\n            };\n        }\n        // Metadata needs to be available before setValue\n        this._submission.metadata = submission.metadata ? lodash_1.default.cloneDeep(submission.metadata) : {};\n        this.editing = !!submission._id;\n        // Set the timezone in the options if available.\n        if (!this.options.submissionTimezone &&\n            submission.metadata &&\n            submission.metadata.timezone) {\n            this.options.submissionTimezone = submission.metadata.timezone;\n        }\n        const changed = super.setValue(submission.data, flags);\n        if (!flags.sanitize) {\n            this.mergeData(this.data, submission.data);\n        }\n        submission.data = this.data;\n        this._submission = submission;\n        return changed;\n    }\n    getValue() {\n        if (!this._submission) {\n            this._submission = {};\n        }\n        if (!this._submission.data) {\n            this._submission.data = {};\n        }\n        if (this.viewOnly) {\n            return this._submission;\n        }\n        const submission = this._submission;\n        submission.data = this.data;\n        return this._submission;\n    }\n    /**\n     * Build the form.\n     * @returns {Promise} - The promise that is triggered when the form is built.\n     */\n    init() {\n        if (this.options.submission) {\n            const submission = lodash_1.default.extend({}, this.options.submission);\n            this._submission = submission;\n            this._data = submission.data;\n        }\n        else {\n            this._submission = this._submission || { data: {} };\n        }\n        // Remove any existing components.\n        if (this.components && this.components.length) {\n            this.destroyComponents();\n            this.components = [];\n        }\n        if (this.component) {\n            this.component.components = this.form ? this.form.components : [];\n        }\n        else {\n            this.component = this.form;\n        }\n        this.component.type = \"form\";\n        this.component.input = false;\n        this.addComponents();\n        this.on(\"submitButton\", (options) => {\n            this.submit(false, options).catch((e) => {\n                options.instance.loading = false;\n                return e !== false && e !== undefined && console.log(e);\n            });\n        }, true);\n        this.on(\"checkValidity\", (data) => this.validate(data, { dirty: true, process: \"change\" }), true);\n        this.on(\"requestUrl\", (args) => this.submitUrl(args.url, args.headers), true);\n        this.on(\"resetForm\", () => this.resetValue(), true);\n        this.on(\"deleteSubmission\", () => this.deleteSubmission(), true);\n        this.on(\"refreshData\", () => this.updateValue(), true);\n        this.executeFormController();\n        return this.formReady;\n    }\n    executeFormController() {\n        // If no controller value or\n        // hidden and set to clearOnHide (Don't calculate a value for a hidden field set to clear when hidden)\n        if (!this.form ||\n            !this.form.controller ||\n            ((!this.visible || this.component.hidden) &&\n                this.component.clearOnHide &&\n                !this.rootPristine)) {\n            return false;\n        }\n        this.formReady.then(() => {\n            this.evaluate(this.form.controller, {\n                components: this.components,\n                instance: this,\n            });\n        });\n    }\n    /**\n     *\n     */\n    teardown() {\n        this.emit(\"formDelete\", this.id);\n        delete Formio_1.Formio.forms[this.id];\n        delete this.executeShortcuts;\n        delete this.triggerSaveDraft;\n        super.teardown();\n    }\n    destroy(all = false) {\n        this.off(\"submitButton\");\n        this.off(\"checkValidity\");\n        this.off(\"requestUrl\");\n        this.off(\"resetForm\");\n        this.off(\"deleteSubmission\");\n        this.off(\"refreshData\");\n        return super.destroy(all);\n    }\n    build(element) {\n        if (element || this.element) {\n            return this.ready.then(() => {\n                element = element || this.element;\n                super.build(element);\n            });\n        }\n        return this.ready;\n    }\n    getClassName() {\n        let classes = \"formio-form\";\n        if (this.options.readOnly) {\n            classes += \" formio-read-only\";\n        }\n        return classes;\n    }\n    render() {\n        return super.render(this.renderTemplate(\"webform\", {\n            classes: this.getClassName(),\n            children: this.renderComponents(),\n        }), this.builderMode ? \"builder\" : \"form\", true);\n    }\n    redraw() {\n        // Don't bother if we have not built yet.\n        if (!this.element) {\n            return Promise.resolve();\n        }\n        this.clear();\n        this.setContent(this.element, this.render());\n        return this.attach(this.element);\n    }\n    attach(element) {\n        this.setElement(element);\n        this.loadRefs(element, { webform: \"single\" });\n        const childPromise = this.attachComponents(this.refs.webform);\n        this.addEventListener(document, \"keydown\", this.executeShortcuts);\n        this.currentForm = this;\n        this.hook(\"attachWebform\", element, this);\n        return childPromise.then(() => {\n            this.emit(\"render\", this.element);\n            return this.setValue(this._submission, {\n                noUpdateEvent: true,\n            });\n        });\n    }\n    hasRequiredFields() {\n        let result = false;\n        (0, utils_1.eachComponent)(this.form.components, (component) => {\n            if (component.validate.required) {\n                result = true;\n                return true;\n            }\n        }, true);\n        return result;\n    }\n    resetValue() {\n        lodash_1.default.each(this.getComponents(), (comp) => comp.resetValue());\n        this.setPristine(true);\n        this.onChange({ resetValue: true });\n    }\n    /**\n     * Sets a new alert to display in the error dialog of the form.\n     * @param {string} type - The type of alert to display. \"danger\", \"success\", \"warning\", etc.\n     * @param {string} message - The message to show in the alert.\n     * @param {object} options - The options for the alert.\n     */\n    setAlert(type, message, options) {\n        if (!type && this.submitted) {\n            if (this.alert) {\n                if (this.refs.errorRef && this.refs.errorRef.length) {\n                    this.refs.errorRef.forEach((el) => {\n                        this.removeEventListener(el, \"click\");\n                        this.removeEventListener(el, \"keypress\");\n                    });\n                }\n                this.removeChild(this.alert);\n                this.alert = null;\n            }\n            return;\n        }\n        if (this.options.noAlerts) {\n            if (!message) {\n                this.emit(\"error\", false);\n            }\n            return;\n        }\n        if (this.alert) {\n            try {\n                if (this.refs.errorRef && this.refs.errorRef.length) {\n                    this.refs.errorRef.forEach((el) => {\n                        this.removeEventListener(el, \"click\");\n                        this.removeEventListener(el, \"keypress\");\n                    });\n                }\n                this.removeChild(this.alert);\n                this.alert = null;\n            }\n            catch (err) {\n                // ignore\n            }\n        }\n        if (message) {\n            const attrs = {\n                class: (options && options.classes) || `alert alert-${type}`,\n                id: `error-list-${this.id}`,\n            };\n            const templateOptions = {\n                message: message instanceof HTMLElement ? message.outerHTML : message,\n                attrs: attrs,\n                type,\n            };\n            this.alert = (0, utils_1.convertStringToHTMLElement)(this.renderTemplate(\"alert\", templateOptions), `#${attrs.id}`);\n        }\n        if (!this.alert) {\n            return;\n        }\n        this.loadRefs(this.alert, { errorRef: \"multiple\" });\n        if (this.refs.errorRef && this.refs.errorRef.length) {\n            this.refs.errorRef.forEach((el) => {\n                this.addEventListener(el, \"click\", (e) => {\n                    const key = e.currentTarget.dataset.componentKey;\n                    this.focusOnComponent(key);\n                });\n                this.addEventListener(el, \"keydown\", (e) => {\n                    if (e.keyCode === 13) {\n                        e.preventDefault();\n                        const key = e.currentTarget.dataset.componentKey;\n                        this.focusOnComponent(key);\n                    }\n                });\n            });\n        }\n        this.prepend(this.alert);\n    }\n    /**\n     * Focus on selected component.\n     * @param {string} key - The key of selected component.\n     */\n    focusOnComponent(key) {\n        if (key) {\n            const component = this.getComponent(key);\n            if (component) {\n                component.focus();\n            }\n        }\n    }\n    /**\n     * Show the errors of this form within the alert dialog.\n     * @param {object} error - An optional additional error to display along with the component errors.\n     * @returns {*}\n     */\n    /* eslint-disable no-unused-vars */\n    /**\n     *\n     * @param {Array} errors - An array of errors to display.\n     * @param {boolean} triggerEvent - Whether or not to trigger the error event.\n     * @returns {void|Array} - The errors that were set.\n     */\n    showErrors(errors, triggerEvent) {\n        this.loading = false;\n        if (!Array.isArray(errors)) {\n            errors = [errors];\n        }\n        if (Array.isArray(this.errors)) {\n            errors = lodash_1.default.union(errors, this.errors);\n        }\n        errors = errors.concat(this.customErrors).filter((err) => !!err);\n        if (!errors.length) {\n            this.setAlert(false);\n            return;\n        }\n        // Mark any components as invalid if in a custom message.\n        const componentErrors = {};\n        errors.forEach((err) => {\n            var _a, _b;\n            const path = (0, utils_1.getStringFromComponentPath)(err.path) || ((_a = err.context) === null || _a === void 0 ? void 0 : _a.path) || ((_b = err.component) === null || _b === void 0 ? void 0 : _b.key);\n            if (!componentErrors[path]) {\n                componentErrors[path] = [];\n            }\n            componentErrors[path].push(err);\n        });\n        // Iterate through all of our component errors and apply them to the components.\n        for (let path in componentErrors) {\n            const component = this.getComponent(path);\n            const errors = componentErrors[path];\n            if (component) {\n                component.serverErrors = errors.filter((err) => err.fromServer);\n                component.setCustomValidity(errors, true);\n            }\n        }\n        const displayedErrors = [];\n        if (errors.length) {\n            errors = lodash_1.default.uniqBy(errors, (error) => { var _a, _b; return [error.message, (_a = error.component) === null || _a === void 0 ? void 0 : _a.id, (_b = error.context) === null || _b === void 0 ? void 0 : _b.path].join(); });\n            const createListItem = (message, index) => {\n                var _a, _b, _c;\n                const err = errors[index];\n                const messageFromIndex = !lodash_1.default.isUndefined(index) && errors && errors[index];\n                const keyOrPath = (messageFromIndex === null || messageFromIndex === void 0 ? void 0 : messageFromIndex.formattedKeyOrPath) ||\n                    (messageFromIndex === null || messageFromIndex === void 0 ? void 0 : messageFromIndex.path) ||\n                    ((_a = messageFromIndex === null || messageFromIndex === void 0 ? void 0 : messageFromIndex.context) === null || _a === void 0 ? void 0 : _a.path) ||\n                    (((_b = err.context) === null || _b === void 0 ? void 0 : _b.component) && ((_c = err.context) === null || _c === void 0 ? void 0 : _c.component.key)) ||\n                    (err.component && err.component.key) ||\n                    (err.fromServer && err.path);\n                const formattedKeyOrPath = keyOrPath ? (0, utils_1.getStringFromComponentPath)(keyOrPath) : \"\";\n                if (typeof err !== \"string\" && !err.formattedKeyOrPath) {\n                    err.formattedKeyOrPath = formattedKeyOrPath;\n                }\n                return {\n                    message: (0, utils_1.unescapeHTML)(message),\n                    keyOrPath: formattedKeyOrPath,\n                };\n            };\n            errors.forEach(({ message, context, fromServer, component }, index) => {\n                const text = !(component === null || component === void 0 ? void 0 : component.label) || (context === null || context === void 0 ? void 0 : context.hasLabel) || fromServer\n                    ? this.t(\"alertMessage\", { message: this.t(message) })\n                    : this.t(\"alertMessageWithLabel\", {\n                        label: this.t(component === null || component === void 0 ? void 0 : component.label),\n                        message: this.t(message),\n                    });\n                displayedErrors.push(createListItem(text, index));\n            });\n        }\n        const errorsList = this.renderTemplate(\"errorsList\", { errors: displayedErrors });\n        this.root.setAlert(\"danger\", errorsList);\n        if (triggerEvent) {\n            this.emit(\"error\", errors);\n        }\n        return errors;\n    }\n    /* eslint-enable no-unused-vars */\n    /**\n     * Called when the submission has completed, or if the submission needs to be sent to an external library.\n     * @param {object} submission - The submission object.\n     * @param {boolean} saved - Whether or not this submission was saved to the server.\n     * @returns {object} - The submission object.\n     */\n    onSubmit(submission, saved) {\n        var _a;\n        this.loading = false;\n        this.submitting = false;\n        this.setPristine(true);\n        // We want to return the submitted submission and setValue will mutate the submission so cloneDeep it here.\n        this.setValue((0, utils_1.fastCloneDeep)(submission), {\n            noValidate: true,\n            noCheck: true,\n        });\n        this.setAlert(\"success\", `<p>${this.t(\"complete\")}</p>`);\n        // Cancel triggered saveDraft to prevent overriding the submitted state\n        if (this.draftEnabled && ((_a = this.triggerSaveDraft) === null || _a === void 0 ? void 0 : _a.cancel)) {\n            this.triggerSaveDraft.cancel();\n        }\n        this.emit(\"submit\", submission, saved);\n        if (saved) {\n            this.emit(\"submitDone\", submission);\n        }\n        return submission;\n    }\n    normalizeError(error) {\n        if (error) {\n            if (typeof error === \"object\" && \"details\" in error) {\n                error = error.details;\n            }\n            if (typeof error === \"string\") {\n                error = { message: error };\n            }\n        }\n        return error;\n    }\n    /**\n     * Called when an error occurs during the submission.\n     * @param {object} error - The error that occured.\n     * @returns {Array} errors - All errors.\n     */\n    onSubmissionError(error) {\n        error = this.normalizeError(error);\n        this.submitting = false;\n        this.setPristine(false);\n        this.emit(\"submitError\", error || this.errors);\n        // Allow for silent cancellations (no error message, no submit button error state)\n        if (error && error.silent) {\n            this.emit(\"change\", { isValid: true }, { silent: true });\n            return false;\n        }\n        const errors = this.showErrors(error, true);\n        if (this.root && this.root.alert) {\n            this.scrollIntoView(this.root.alert);\n        }\n        return errors;\n    }\n    /**\n     * Trigger the change event for this form.\n     * @param {any} flags - The flags to set on this change event.\n     * @param {any} changed - The changed object which reflects the changes in the form.\n     * @param {boolean} modified - Whether or not the form has been modified.\n     * @param {any} changes - The changes that have occured in the form.\n     */\n    onChange(flags, changed, modified, changes) {\n        var _a;\n        flags = flags || {};\n        let isChangeEventEmitted = false;\n        if (((_a = this.parent) === null || _a === void 0 ? void 0 : _a.subForm) === this) {\n            super.onChange(Object.assign(Object.assign({}, flags), { modified }), false);\n        }\n        else {\n            super.onChange(flags, true);\n        }\n        const value = lodash_1.default.clone(this.submission);\n        flags.changed = value.changed = changed;\n        flags.changes = changes;\n        if (modified && this.pristine) {\n            this.pristine = false;\n        }\n        this.checkData(value.data, flags);\n        const shouldValidate = !flags.noValidate ||\n            flags.fromIframe ||\n            (flags.fromSubmission && this.rootPristine && this.pristine && flags.changed);\n        const errors = shouldValidate\n            ? this.validate(value.data, Object.assign(Object.assign({}, flags), { noValidate: false, process: 'change' }))\n            : [];\n        value.isValid = (errors || []).filter(err => !err.fromServer).length === 0;\n        this.loading = false;\n        if (this.submitted) {\n            // show server errors while they are not cleaned/fixed\n            const nonComponentServerErrors = lodash_1.default.filter(this.serverErrors || [], (err) => !err.component && !err.path);\n            this.showErrors(nonComponentServerErrors.length ? nonComponentServerErrors : errors);\n        }\n        // See if we need to save the draft of the form.\n        if (modified && this.options.saveDraft) {\n            this.triggerSaveDraft();\n        }\n        if (!flags || !flags.noEmit) {\n            this.emit(\"change\", value, flags, modified);\n            isChangeEventEmitted = true;\n        }\n        // The form is initialized after the first change event occurs.\n        if (isChangeEventEmitted && !this.initialized) {\n            this.emit(\"initialized\");\n            this.initialized = true;\n        }\n    }\n    /**\n     * Send a delete request to the server.\n     * @returns {Promise} - The promise that is triggered when the delete is complete.\n     */\n    deleteSubmission() {\n        return this.formio.deleteSubmission().then(() => {\n            this.emit(\"submissionDeleted\", this.submission);\n            this.resetValue();\n        });\n    }\n    /**\n     * Cancels the submission.\n     * @param {boolean} noconfirm - Whether or not to confirm the cancellation.\n     * @alias reset\n     * @returns {boolean} - TRUE means the submission was cancelled, FALSE otherwise.\n     */\n    cancel(noconfirm) {\n        const shouldReset = this.hook(\"beforeCancel\", true);\n        if (shouldReset && (noconfirm || confirm(this.t(\"confirmCancel\")))) {\n            this.resetValue();\n            return true;\n        }\n        else {\n            this.emit(\"cancelSubmit\");\n            return false;\n        }\n    }\n    setMetadata(submission) {\n        // Add in metadata about client submitting the form\n        submission.metadata = submission.metadata || {};\n        lodash_1.default.defaults(submission.metadata, {\n            timezone: lodash_1.default.get(this, \"_submission.metadata.timezone\", (0, utils_1.currentTimezone)()),\n            offset: parseInt(lodash_1.default.get(this, \"_submission.metadata.offset\", (0, moment_1.default)().utcOffset()), 10),\n            origin: document.location.origin,\n            referrer: document.referrer,\n            browserName: navigator.appName,\n            userAgent: navigator.userAgent,\n            pathName: window.location.pathname,\n            onLine: navigator.onLine,\n        });\n    }\n    submitForm(options = {}, local = false) {\n        this.clearServerErrors();\n        return new Promise((resolve, reject) => {\n            // Read-only forms should never submit.\n            if (this.options.readOnly) {\n                return resolve({\n                    submission: this.submission,\n                    saved: false,\n                });\n            }\n            const submission = (0, utils_1.fastCloneDeep)(this.submission || {});\n            this.setMetadata(submission);\n            submission.state = options.state || submission.state || \"submitted\";\n            const isDraft = submission.state === \"draft\";\n            this.hook(\"beforeSubmit\", Object.assign(Object.assign({}, submission), { component: options.component }), (err, data) => {\n                var _a;\n                if (err) {\n                    return reject(err);\n                }\n                submission._vnote = data && data._vnote ? data._vnote : \"\";\n                try {\n                    if (!isDraft && !options.noValidate) {\n                        if (!submission.data) {\n                            return reject(\"Invalid Submission\");\n                        }\n                        const errors = this.validate(submission.data, {\n                            local,\n                            dirty: true,\n                            silentCheck: false,\n                            process: \"submit\",\n                        });\n                        if (errors.length ||\n                            ((_a = options.beforeSubmitResults) === null || _a === void 0 ? void 0 : _a.some((result) => result.status === \"rejected\"))) {\n                            return reject(errors);\n                        }\n                    }\n                }\n                catch (err) {\n                    console.error(err);\n                }\n                this.everyComponent((comp) => {\n                    var _a, _b;\n                    if (submission._vnote && comp.type === \"form\" && comp.component.reference) {\n                        lodash_1.default.get(submission.data, local ? (_a = comp.paths) === null || _a === void 0 ? void 0 : _a.localDataPath : comp.path, {})._vnote = submission._vnote;\n                    }\n                    const { persistent } = comp.component;\n                    if (persistent === \"client-only\") {\n                        lodash_1.default.unset(submission.data, local ? (_b = comp.paths) === null || _b === void 0 ? void 0 : _b.localDataPath : comp.path);\n                    }\n                });\n                this.hook(\"customValidation\", Object.assign(Object.assign({}, submission), { component: options.component }), (err) => {\n                    if (err) {\n                        // If string is returned, cast to object.\n                        if (typeof err === \"string\") {\n                            err = {\n                                message: err,\n                            };\n                        }\n                        // Ensure err is an array.\n                        err = Array.isArray(err) ? err : [err];\n                        return reject(err);\n                    }\n                    this.loading = true;\n                    // Use the form action to submit the form if available.\n                    if (this._form && this._form.action) {\n                        const method = submission.data._id &&\n                            this._form.action.includes(submission.data._id)\n                            ? \"PUT\"\n                            : \"POST\";\n                        return Formio_1.Formio.makeStaticRequest(this._form.action, method, submission, this.formio ? this.formio.options : {})\n                            .then((result) => resolve({\n                            submission: result,\n                            saved: true,\n                        }))\n                            .catch((error) => {\n                            this.setServerErrors(error);\n                            return reject(error);\n                        });\n                    }\n                    const submitFormio = this.formio;\n                    if (this.nosubmit || !submitFormio) {\n                        return resolve({\n                            submission,\n                            saved: false,\n                        });\n                    }\n                    // If this is an actionUrl, then make sure to save the action and not the submission.\n                    const submitMethod = submitFormio.actionUrl\n                        ? \"saveAction\"\n                        : \"saveSubmission\";\n                    submitFormio[submitMethod](submission)\n                        .then((result) => resolve({\n                        submission: result,\n                        saved: true,\n                    }))\n                        .catch((error) => {\n                        this.setServerErrors(error);\n                        return reject(error);\n                    });\n                });\n            });\n        });\n    }\n    setServerErrors(error) {\n        if (error.details) {\n            this.serverErrors = error.details\n                .filter((err) => (err.level ? err.level === \"error\" : err))\n                .map((err) => {\n                err.fromServer = true;\n                return err;\n            });\n        }\n        else if (typeof error === \"string\") {\n            this.serverErrors = [{ fromServer: true, level: \"error\", message: error }];\n        }\n    }\n    executeSubmit(options) {\n        this.submitted = true;\n        this.submitting = true;\n        return this.submitForm(options)\n            .then(({ submission, saved }) => this.onSubmit(submission, saved))\n            .then((results) => {\n            this.submissionInProcess = false;\n            return results;\n        })\n            .catch((err) => {\n            this.submissionInProcess = false;\n            return Promise.reject(this.onSubmissionError(err));\n        });\n    }\n    clearServerErrors() {\n        var _a;\n        (_a = this.serverErrors) === null || _a === void 0 ? void 0 : _a.forEach((error) => {\n            if (error.path) {\n                const pathArray = (0, utils_1.getArrayFromComponentPath)(error.path);\n                const component = this.getComponent(pathArray, lodash_1.default.identity, error.formattedKeyOrPath);\n                if (component) {\n                    component.serverErrors = [];\n                }\n            }\n        });\n        this.serverErrors = [];\n    }\n    /**\n     * Submits the form.\n     * @example\n     * import Webform from '@formio/js/Webform';\n     * let form = new Webform(document.getElementById('formio'));\n     * form.src = 'https://examples.form.io/example';\n     * form.submission = {data: {\n     *   firstName: 'Joe',\n     *   lastName: 'Smith',\n     *   email: 'joe@example.com'\n     * }};\n     * form.submit().then((submission) => {\n     *   console.log(submission);\n     * });\n     * @param {boolean} before - If this submission occured from the before handlers.\n     * @param {any} options - The options to use when submitting this form.\n     * @returns {Promise} - A promise when the form is done submitting.\n     */\n    submit(before = false, options = {}) {\n        this.submissionInProcess = true;\n        if (!before) {\n            return this.beforeSubmit(options).then(() => this.executeSubmit(options));\n        }\n        else {\n            return this.executeSubmit(options);\n        }\n    }\n    submitUrl(URL, headers) {\n        if (!URL) {\n            return console.warn(\"Missing URL argument\");\n        }\n        const submission = this.submission || {};\n        const API_URL = URL;\n        const settings = {\n            method: \"POST\",\n            headers: {},\n        };\n        if (headers && headers.length > 0) {\n            headers.map((e) => {\n                if (e.header !== \"\" && e.value !== \"\") {\n                    settings.headers[e.header] = this.interpolate(e.value, submission);\n                }\n            });\n        }\n        if (API_URL && settings) {\n            Formio_1.Formio.makeStaticRequest(API_URL, settings.method, submission, {\n                headers: settings.headers,\n            })\n                .then(() => {\n                this.emit(\"requestDone\");\n                this.setAlert(\"success\", \"<p> Success </p>\");\n            })\n                .catch((e) => {\n                const message = `${e.statusText ? e.statusText : \"\"} ${e.status ? e.status : e}`;\n                this.emit(\"error\", message);\n                console.error(message);\n                this.setAlert(\"danger\", `<p> ${message} </p>`);\n                return Promise.reject(this.onSubmissionError(e));\n            });\n        }\n        else {\n            this.emit(\"error\", \"You should add a URL to this button.\");\n            this.setAlert(\"warning\", \"You should add a URL to this button.\");\n            return console.warn(\"You should add a URL to this button.\");\n        }\n    }\n    triggerCaptcha(components = null) {\n        if (!this || !this.components) {\n            return;\n        }\n        const captchaComponent = [];\n        (0, utils_1.eachComponent)(components || this.components, (component) => {\n            if (/^(re)?captcha$/.test(component.type) && component.component.eventType === 'formLoad') {\n                captchaComponent.push(component);\n            }\n        }, true);\n        if (captchaComponent.length > 0) {\n            if (captchaComponent[0].component.provider === 'google' && components) {\n                return;\n            }\n            captchaComponent[0].verify(`${this.form.name ? this.form.name : 'form'}Load`);\n        }\n    }\n    set nosubmit(value) {\n        this._nosubmit = !!value;\n        this.emit(\"nosubmit\", this._nosubmit);\n    }\n    get nosubmit() {\n        return this._nosubmit || false;\n    }\n    get conditions() {\n        var _a, _b;\n        return (_b = (_a = this.schema.settings) === null || _a === void 0 ? void 0 : _a.conditions) !== null && _b !== void 0 ? _b : [];\n    }\n    get variables() {\n        var _a, _b;\n        return (_b = (_a = this.schema.settings) === null || _a === void 0 ? void 0 : _a.variables) !== null && _b !== void 0 ? _b : [];\n    }\n}\nexports[\"default\"] = Webform;\nWebform.setBaseUrl = Formio_1.Formio.setBaseUrl;\nWebform.setApiUrl = Formio_1.Formio.setApiUrl;\nWebform.setAppUrl = Formio_1.Formio.setAppUrl;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Webform.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst moment_1 = __importDefault(__webpack_require__(/*! moment */ \"./node_modules/moment/moment.js\"));\nconst compare_versions_1 = __webpack_require__(/*! compare-versions */ \"./node_modules/compare-versions/lib/esm/index.js\");\nconst EventEmitter_1 = __importDefault(__webpack_require__(/*! ./EventEmitter */ \"./lib/cjs/EventEmitter.js\"));\nconst i18n_1 = __importDefault(__webpack_require__(/*! ./i18n */ \"./lib/cjs/i18n.js\"));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst Components_1 = __importDefault(__webpack_require__(/*! ./components/Components */ \"./lib/cjs/components/Components.js\"));\nconst NestedDataComponent_1 = __importDefault(__webpack_require__(/*! ./components/_classes/nesteddata/NestedDataComponent */ \"./lib/cjs/components/_classes/nesteddata/NestedDataComponent.js\"));\nconst utils_1 = __webpack_require__(/*! ./utils */ \"./lib/cjs/utils/index.js\");\n// We need this here because dragula pulls in CustomEvent class that requires global to exist.\nif (typeof window !== 'undefined' && typeof window.global === 'undefined') {\n    window.global = window;\n}\nconst dragula_1 = __importDefault(__webpack_require__(/*! dragula */ \"./node_modules/dragula/dragula.js\"));\n// Initialize the available forms.\nFormio_1.Formio.forms = {};\n// Allow people to register components.\nFormio_1.Formio.registerComponent = Components_1.default.setComponent;\n/**\n *\n * @param {any} icons  - The icons to use.\n * @returns {any} - The icon set.\n */\nfunction getIconSet(icons) {\n    if (icons === \"fontawesome\") {\n        return \"fa\";\n    }\n    return icons || \"\";\n}\n/**\n *\n * @param {any} options - The options to get.\n * @returns {any} - The options.\n */\nfunction getOptions(options) {\n    options = lodash_1.default.defaults(options, {\n        submitOnEnter: false,\n        iconset: getIconSet(options && options.icons ? options.icons : Formio_1.Formio.icons),\n        i18next: null,\n        saveDraft: false,\n        alwaysDirty: false,\n        saveDraftThrottle: 5000,\n        display: \"form\",\n        cdnUrl: Formio_1.Formio.cdn.baseUrl,\n    });\n    if (!options.events) {\n        options.events = new EventEmitter_1.default();\n    }\n    return options;\n}\n/**\n * Represents a JSON value.\n * @typedef {(string | number | boolean | null | JSONArray | JSONObject)} JSON\n */\n/**\n * Represents a JSON array.\n * @typedef {Array<JSON>} JSONArray\n */\n/**\n * Represents a JSON object.\n * @typedef {{[key: string]: JSON}} JSONObject\n */\n/**\n * @typedef {object} FormioHooks\n * @property {Function} [beforeSubmit] - A function that is called before the form is submitted.\n * @property {Function} [beforeCancel] - A function that is called before the form is canceled.\n * @property {Function} [beforeNext] - A function that is called before moving to the next page in a multi-page form.\n * @property {Function} [beforePrev] - A function that is called before moving to the previous page in a multi-page form.\n * @property {Function} [attachComponent] - A function that is called when a component is attached to the form.\n * @property {Function} [setDataValue] - A function that is called when setting the value of a data component.\n * @property {Function} [addComponents] - A function that is called when adding multiple components to the form.\n * @property {Function} [addComponent] - A function that is called when adding a single component to the form.\n * @property {Function} [customValidation] - A function that is called for custom validation of the form.\n * @property {Function} [attachWebform] - A function that is called when attaching a webform to the form.\n */\n/**\n * @typedef {object} SanitizeConfig\n * @property {string[]} [addAttr] - The attributes to add.\n * @property {string[]} [addTags] - The tags to add.\n * @property {string[]} [allowedAttrs] - The allowed attributes.\n * @property {string[]} [allowedTags] - The allowed tags.\n * @property {string[]} [allowedUriRegex] - The allowed URI regex.\n * @property {string[]} [addUriSafeAttr] - The URI safe attributes.\n */\n/**\n * @typedef {object} ButtonSettings\n * @property {boolean} [showPrevious] - Show the \"Previous\" button.\n * @property {boolean} [showNext] - Show the \"Next\" button.\n * @property {boolean} [showCancel] - Show the \"Cancel\" button.\n * @property {boolean} [showSubmit] - Show the \"Submit\" button.\n */\n/**\n * @typedef {object} FormOptions\n * @property {boolean} [saveDraft] - Enable the save draft feature.\n * @property {number} [saveDraftThrottle] - The throttle for the save draft feature.\n * @property {boolean} [readOnly] - Set this form to readOnly.\n * @property {boolean} [noAlerts] - Disable the alerts dialog.\n * @property {{[key: string]: string}} [i18n] - The translation file for this rendering.\n * @property {string} [template] - Custom logic for creation of elements.\n * @property {boolean} [noDefaults] - Exclude default values from the settings.\n * @property {any} [fileService] - The file service for this form.\n * @property {EventEmitter} [events] - The EventEmitter for this form.\n * @property {string} [language] - The language to render this form in.\n * @property {{[key: string]: string}} [i18next] - The i18next configuration for this form.\n * @property {boolean} [viewAsHtml] - View the form as raw HTML.\n * @property {'form' | 'html' | 'flat' | 'builder' | 'pdf'} [renderMode] - The render mode for this form.\n * @property {boolean} [highlightErrors] - Highlight any errors on the form.\n * @property {string} [componentErrorClass] - The error class for components.\n * @property {any} [templates] - The templates for this form.\n * @property {string} [iconset] - The iconset for this form.\n * @property {import('@formio/core').Component[]} [components] - The components for this form.\n * @property {{[key: string]: boolean}} [disabled] - Disabled components for this form.\n * @property {boolean} [showHiddenFields] - Show hidden fields.\n * @property {{[key: string]: boolean}} [hide] - Hidden components for this form.\n * @property {{[key: string]: boolean}} [show] - Components to show for this form.\n * @property {Formio} [formio] - The Formio instance for this form.\n * @property {string} [decimalSeparator] - The decimal separator for this form.\n * @property {string} [thousandsSeparator] - The thousands separator for this form.\n * @property {FormioHooks} [hooks] - The hooks for this form.\n * @property {boolean} [alwaysDirty] - Always be dirty.\n * @property {boolean} [skipDraftRestore] - Skip restoring a draft.\n * @property {'form' | 'wizard' | 'pdf'} [display] - The display for this form.\n * @property {string} [cdnUrl] - The CDN url for this form.\n * @property {boolean} [flatten] - Flatten the form.\n * @property {boolean} [sanitize] - Sanitize the form.\n * @property {SanitizeConfig} [sanitizeConfig] - The sanitize configuration for this form.\n * @property {ButtonSettings} [buttonSettings] - The button settings for this form.\n * @property {object} [breadcrumbSettings] - The breadcrumb settings for this form.\n * @property {boolean} [allowPrevious] - Allow the previous button (for Wizard forms).\n * @property {string[]} [wizardButtonOrder] - The order of the buttons (for Wizard forms).\n * @property {boolean} [showCheckboxBackground] - Show the checkbox background.\n * @property {boolean} [inputsOnly] - Only show inputs in the form and no labels.\n * @property {boolean} [building] - If we are in the process of building the form.\n * @property {number} [zoom] - The zoom for PDF forms.\n */\nclass Webform extends NestedDataComponent_1.default {\n    /**\n     * Creates a new Form instance.\n     * @param {HTMLElement | object | import('Form').FormOptions} [elementOrOptions] - The DOM element to render this form within or the options to create this form instance.\n     * @param {import('Form').FormOptions} [options] - The options to create a new form instance.\n     */\n    constructor(elementOrOptions, options = undefined) {\n        let element, formOptions;\n        if (elementOrOptions instanceof HTMLElement || options) {\n            element = elementOrOptions;\n            formOptions = options || {};\n        }\n        else {\n            formOptions = elementOrOptions || {};\n        }\n        super(null, getOptions(formOptions));\n        this.executeShortcuts = (event) => {\n            const { target } = event;\n            if (!this.keyboardCatchableElement(target)) {\n                return;\n            }\n            const ctrl = event.ctrlKey || event.metaKey;\n            const keyCode = event.keyCode;\n            let char = \"\";\n            if (65 <= keyCode && keyCode <= 90) {\n                char = String.fromCharCode(keyCode);\n            }\n            else if (keyCode === 13) {\n                char = \"Enter\";\n            }\n            else if (keyCode === 27) {\n                char = \"Esc\";\n            }\n            lodash_1.default.each(this.shortcuts, (shortcut) => {\n                if (shortcut.ctrl && !ctrl) {\n                    return;\n                }\n                if (shortcut.shortcut === char) {\n                    shortcut.element.click();\n                    event.preventDefault();\n                }\n            });\n        };\n        this.setElement(element);\n        // Keep track of all available forms globally.\n        Formio_1.Formio.forms[this.id] = this;\n        // Set the base url.\n        if (this.options.baseUrl) {\n            Formio_1.Formio.setBaseUrl(this.options.baseUrl);\n        }\n        /**\n         * The type of this element.\n         * @type {string}\n         */\n        this.type = \"form\";\n        this._src = \"\";\n        this._loading = false;\n        this._form = {};\n        this.draftEnabled = false;\n        this.savingDraft = false;\n        if (this.options.saveDraftThrottle) {\n            this.triggerSaveDraft = lodash_1.default.throttle(this.saveDraft.bind(this), this.options.saveDraftThrottle);\n        }\n        else {\n            this.triggerSaveDraft = this.saveDraft.bind(this);\n        }\n        /**\n         * Determines if this form should submit the API on submit.\n         * @type {boolean}\n         */\n        this.nosubmit = false;\n        /**\n         * Determines if the form has tried to be submitted, error or not.\n         * @type {boolean}\n         */\n        this.submitted = false;\n        /**\n         * Determines if the form is being submitted at the moment.\n         * @type {boolean}\n         */\n        this.submitting = false;\n        /**\n         * The Formio instance for this form.\n         * @type {Formio}\n         */\n        this.formio = null;\n        /**\n         * The loader HTML element.\n         * @type {HTMLElement}\n         */\n        this.loader = null;\n        /**\n         * The alert HTML element\n         * @type {HTMLElement}\n         */\n        this.alert = null;\n        /**\n         * Promise that is triggered when the submission is done loading.\n         * @type {Promise}\n         */\n        this.onSubmission = null;\n        /**\n         * Determines if this submission is explicitly set.\n         * @type {boolean}\n         */\n        this.submissionSet = false;\n        /**\n         * Promise that executes when the form is ready and rendered.\n         * @type {Promise}\n         * @example\n         * import Webform from '@formio/js/Webform';\n         * let form = new Webform(document.getElementById('formio'));\n         * form.formReady.then(() => {\n         *   console.log('The form is ready!');\n         * });\n         * form.src = 'https://examples.form.io/example';\n         */\n        this.formReady = new Promise((resolve, reject) => {\n            /**\n             * Called when the formReady state of this form has been resolved.\n             * @type {Function}\n             */\n            this.formReadyResolve = resolve;\n            /**\n             * Called when this form could not load and is rejected.\n             * @type {Function}\n             */\n            this.formReadyReject = reject;\n        });\n        /**\n         * Promise that executes when the submission is ready and rendered.\n         * @type {Promise}\n         * @example\n         * import Webform from '@formio/js/Webform';\n         * let form = new Webform(document.getElementById('formio'));\n         * form.submissionReady.then(() => {\n         *   console.log('The submission is ready!');\n         * });\n         * form.src = 'https://examples.form.io/example/submission/234234234234234243';\n         */\n        this.submissionReady = new Promise((resolve, reject) => {\n            /**\n             * Called when the formReady state of this form has been resolved.\n             * @type {Function}\n             */\n            this.submissionReadyResolve = resolve;\n            /**\n             * Called when this form could not load and is rejected.\n             * @type {Function}\n             */\n            this.submissionReadyReject = reject;\n        });\n        this.shortcuts = [];\n        // Set language after everything is established.\n        this.language = this.i18next.language;\n        // See if we need to restore the draft from a user.\n        if (this.options.saveDraft) {\n            if (this.options.skipDraftRestore) {\n                this.draftEnabled = true;\n                this.savingDraft = false;\n            }\n            else {\n                this.formReady.then(() => {\n                    const user = Formio_1.Formio.getUser();\n                    // Only restore a draft if the submission isn't explicitly set.\n                    if (user && !this.submissionSet) {\n                        this.restoreDraft(user._id);\n                    }\n                });\n            }\n        }\n        this.component.clearOnHide = false;\n        // Ensure the root is set to this component.\n        this.root = this;\n        this.localRoot = this;\n        this.root.dragulaLib = dragula_1.default;\n    }\n    /* eslint-enable max-statements */\n    get language() {\n        return this.options.language;\n    }\n    get emptyValue() {\n        return null;\n    }\n    componentContext() {\n        return this._data;\n    }\n    /**\n     * Sets the language for this form.\n     * @param {string} lang - The language to use (e.g. 'en', 'sp', etc.)\n     */\n    set language(lang) {\n        if (!this.i18next) {\n            return;\n        }\n        this.options.language = lang;\n        if (this.i18next.language === lang) {\n            return;\n        }\n        this.i18next.changeLanguage(lang, (err) => {\n            if (err) {\n                return;\n            }\n            this.rebuild();\n            this.emit(\"languageChanged\");\n        });\n    }\n    get componentComponents() {\n        return this.form.components;\n    }\n    get shadowRoot() {\n        return this.options.shadowRoot;\n    }\n    get componentsMap() {\n        return this.childComponentsMap || {};\n    }\n    /**\n     * Add a language for translations\n     * @param {string} code - The language code for the language being added.\n     * @param {object} lang - The language translations.\n     * @param {boolean} [active] - If this language should be set as the active language.\n     */\n    addLanguage(code, lang, active = false) {\n        if (this.i18next) {\n            var translations = lodash_1.default.assign((0, utils_1.fastCloneDeep)(i18n_1.default.resources.en.translation), lang);\n            this.i18next.addResourceBundle(code, \"translation\", translations, true, true);\n            if (active) {\n                this.language = code;\n            }\n        }\n    }\n    keyboardCatchableElement(element) {\n        if (element.nodeName === \"TEXTAREA\") {\n            return false;\n        }\n        if (element.nodeName === \"INPUT\") {\n            return [\"text\", \"email\", \"password\"].indexOf(element.type) === -1;\n        }\n        return true;\n    }\n    addShortcut(element, shortcut) {\n        if (!shortcut || !/^([A-Z]|Enter|Esc)$/i.test(shortcut)) {\n            return;\n        }\n        shortcut = lodash_1.default.capitalize(shortcut);\n        if (shortcut === \"Enter\" || shortcut === \"Esc\") {\n            // Restrict Enter and Esc only for buttons\n            if (element.tagName !== \"BUTTON\") {\n                return;\n            }\n            this.shortcuts.push({\n                shortcut,\n                element,\n            });\n        }\n        else {\n            this.shortcuts.push({\n                ctrl: true,\n                shortcut,\n                element,\n            });\n        }\n    }\n    removeShortcut(element, shortcut) {\n        if (!shortcut || !/^([A-Z]|Enter|Esc)$/i.test(shortcut)) {\n            return;\n        }\n        lodash_1.default.remove(this.shortcuts, {\n            shortcut,\n            element,\n        });\n    }\n    /**\n     * Get the embed source of the form.\n     * @returns {string} - The source of the form.\n     */\n    get src() {\n        return this._src;\n    }\n    /**\n     * Loads the submission if applicable.\n     * @returns {Promise} - The promise that is triggered when the submission is loaded.\n     */\n    loadSubmission() {\n        this.loadingSubmission = true;\n        if (this.formio.submissionId) {\n            this.onSubmission = this.formio\n                .loadSubmission()\n                .then((submission) => this.setSubmission(submission), (err) => this.submissionReadyReject(err))\n                .catch((err) => this.submissionReadyReject(err));\n        }\n        else {\n            this.submissionReadyResolve();\n        }\n        return this.submissionReady;\n    }\n    /**\n     * Set the src of the form renderer.\n     * @param {string} value - The source value to set.\n     * @param {any} options - The options to set.\n     * @returns {Promise} - The promise that is triggered when the form is set.\n     */\n    setSrc(value, options) {\n        if (this.setUrl(value, options)) {\n            this.nosubmit = false;\n            return this.formio\n                .loadForm({ params: { live: 1 } })\n                .then((form) => {\n                const setForm = this.setForm(form);\n                this.loadSubmission();\n                return setForm;\n            })\n                .catch((err) => {\n                console.warn(err);\n                this.formReadyReject(err);\n            });\n        }\n        return Promise.resolve();\n    }\n    /**\n     * Set the Form source, which is typically the Form.io embed URL.\n     * @param {string} value - The value of the form embed url.\n     * @example\n     * import Webform from '@formio/js/Webform';\n     * let form = new Webform(document.getElementById('formio'));\n     * form.formReady.then(() => {\n     *   console.log('The form is formReady!');\n     * });\n     * form.src = 'https://examples.form.io/example';\n     */\n    set src(value) {\n        this.setSrc(value);\n    }\n    /**\n     * Get the embed source of the form.\n     * @returns {string} - returns the source of the form.\n     */\n    get url() {\n        return this._src;\n    }\n    /**\n     * Sets the url of the form renderer.\n     * @param {string} value - The value to set the url to.\n     * @param {any} options - The options to set.\n     * @returns {boolean} - TRUE means the url was set, FALSE otherwise.\n     */\n    setUrl(value, options) {\n        if (!value || typeof value !== \"string\" || value === this._src) {\n            return false;\n        }\n        this._src = value;\n        this.nosubmit = true;\n        this.formio = this.options.formio = new Formio_1.Formio(value, options);\n        if (this.type === \"form\") {\n            // Set the options source so this can be passed to other components.\n            this.options.src = value;\n        }\n        return true;\n    }\n    /**\n     * Set the form source but don't initialize the form and submission from the url.\n     * @param {string} value - The value of the form embed url.\n     */\n    set url(value) {\n        this.setUrl(value);\n    }\n    /**\n     * Called when both the form and submission have been loaded.\n     * @returns {Promise} - The promise to trigger when both form and submission have loaded.\n     */\n    get ready() {\n        return this.formReady.then(() => {\n            return super.ready.then(() => {\n                return this.loadingSubmission ? this.submissionReady : true;\n            });\n        });\n    }\n    /**\n     * Returns if this form is loading.\n     * @returns {boolean} - TRUE means the form is loading, FALSE otherwise.\n     */\n    get loading() {\n        return this._loading;\n    }\n    /**\n     * Set the loading state for this form, and also show the loader spinner.\n     * @param {boolean} loading - If this form should be \"loading\" or not.\n     */\n    set loading(loading) {\n        if (this._loading !== loading) {\n            this._loading = loading;\n            if (!this.loader && loading) {\n                this.loader = this.ce(\"div\", {\n                    class: \"loader-wrapper\",\n                });\n                const spinner = this.ce(\"div\", {\n                    class: \"loader text-center\",\n                });\n                this.loader.appendChild(spinner);\n            }\n            /* eslint-disable max-depth */\n            if (this.loader) {\n                try {\n                    if (loading) {\n                        this.prependTo(this.loader, this.wrapper);\n                    }\n                    else {\n                        this.removeChildFrom(this.loader, this.wrapper);\n                    }\n                }\n                catch (err) {\n                    // ingore\n                }\n            }\n            /* eslint-enable max-depth */\n        }\n    }\n    /**\n     * Sets the JSON schema for the form to be rendered.\n     * @example\n     * import Webform from '@formio/js/Webform';\n     * let form = new Webform(document.getElementById('formio'));\n     * form.setForm({\n     *   components: [\n     *     {\n     *       type: 'textfield',\n     *       key: 'firstName',\n     *       label: 'First Name',\n     *       placeholder: 'Enter your first name.',\n     *       input: true\n     *     },\n     *     {\n     *       type: 'textfield',\n     *       key: 'lastName',\n     *       label: 'Last Name',\n     *       placeholder: 'Enter your last name',\n     *       input: true\n     *     },\n     *     {\n     *       type: 'button',\n     *       action: 'submit',\n     *       label: 'Submit',\n     *       theme: 'primary'\n     *     }\n     *   ]\n     * });\n     * @param {object} form - The JSON schema of the form @see https://examples.form.io/example for an example JSON schema.\n     * @param {any} flags - Any flags to apply when setting the form.\n     * @returns {Promise} - The promise that is triggered when the form is set.\n     */\n    setForm(form, flags = {}) {\n        var _a;\n        const isFormAlreadySet = this._form && ((_a = this._form.components) === null || _a === void 0 ? void 0 : _a.length);\n        try {\n            // Do not set the form again if it has been already set\n            if (isFormAlreadySet && JSON.stringify(this._form) === JSON.stringify(form)) {\n                this.formReadyResolve();\n                return Promise.resolve();\n            }\n            // Create the form.\n            this._form = (flags === null || flags === void 0 ? void 0 : flags.keepAsReference) ? form : lodash_1.default.cloneDeep(form);\n            if (this.onSetForm) {\n                this.onSetForm(lodash_1.default.cloneDeep(this._form), form);\n            }\n        }\n        catch (err) {\n            console.warn(err);\n            // If provided form is not a valid JSON object, do not set it too\n            this.formReadyReject(err);\n            return Promise.resolve();\n        }\n        // Allow the form to provide component overrides.\n        if (form && form.settings && form.settings.components) {\n            this.options.components = form.settings.components;\n        }\n        if (form && form.properties) {\n            this.options.properties = form.properties;\n        }\n        // Use the sanitize config from the form settings or the global sanitize config if it is not provided in the options\n        if (!this.options.sanitizeConfig && !this.builderMode) {\n            this.options.sanitizeConfig =\n                lodash_1.default.get(form, \"settings.sanitizeConfig\") ||\n                    lodash_1.default.get(form, \"globalSettings.sanitizeConfig\");\n        }\n        if (\"schema\" in form && (0, compare_versions_1.compareVersions)(form.schema, \"1.x\") > 0) {\n            this.ready.then(() => {\n                this.setAlert(\"alert alert-danger\", \"Form schema is for a newer version, please upgrade your renderer. Some functionality may not work.\");\n            });\n        }\n        // See if they pass a module, and evaluate it if so.\n        if (form && form.module) {\n            let formModule = null;\n            if (typeof form.module === \"string\") {\n                try {\n                    formModule = this.evaluate(`return ${form.module}`);\n                }\n                catch (err) {\n                    console.warn(err);\n                }\n            }\n            else {\n                formModule = form.module;\n            }\n            if (formModule) {\n                Formio_1.Formio.use(formModule);\n                // Since we got here after instantiation, we need to manually apply form options.\n                if (formModule.options && formModule.options.form) {\n                    this.options = Object.assign(this.options, formModule.options.form);\n                }\n            }\n        }\n        this.initialized = false;\n        const rebuild = this.rebuild() || Promise.resolve();\n        return rebuild.then(() => {\n            this.emit('formLoad', form);\n            if (!this.options.server) {\n                this.triggerCaptcha();\n            }\n            // Make sure to trigger onChange after a render event occurs to speed up form rendering.\n            setTimeout(() => {\n                this.onChange(flags);\n                this.formReadyResolve();\n            }, 0);\n            return this.formReady;\n        });\n    }\n    /**\n     * Gets the form object.\n     * @returns {object} - The form JSON schema.\n     */\n    get form() {\n        if (!this._form) {\n            this._form = {\n                components: [],\n            };\n        }\n        return this._form;\n    }\n    /**\n     * Sets the form value.\n     * @alias setForm\n     * @param {object} form - The form schema object.\n     */\n    set form(form) {\n        this.setForm(form);\n    }\n    /**\n     * Returns the submission object that was set within this form.\n     * @returns {object} - The submission object.\n     */\n    get submission() {\n        return this.getValue();\n    }\n    /**\n     * Sets the submission of a form.\n     * @example\n     * import Webform from '@formio/js/Webform';\n     * let form = new Webform(document.getElementById('formio'));\n     * form.src = 'https://examples.form.io/example';\n     * form.submission = {data: {\n     *   firstName: 'Joe',\n     *   lastName: 'Smith',\n     *   email: 'joe@example.com'\n     * }};\n     * @param {object} submission - The Form.io submission object.\n     */\n    set submission(submission) {\n        this.setSubmission(submission);\n    }\n    /**\n     * Sets the submission value\n     * @param {object|null|undefined} submission - The submission to set.\n     * @param {object|null|undefined} flags - Any flags to apply when setting the submission.\n     * @returns {void}\n     */\n    onSetSubmission(submission, flags = {}) {\n        this.submissionSet = true;\n        this.triggerChange(flags);\n        this.emit('beforeSetSubmission', submission);\n        this.setValue(submission, flags);\n    }\n    /**\n     * Sets a submission and returns the promise when it is ready.\n     * @param {any} submission - The submission to set.\n     * @param {any} flags - Any flags to apply when setting the submission.\n     * @returns {Promise} - The promise that is triggered when the submission is set.\n     */\n    setSubmission(submission, flags = {}) {\n        flags = Object.assign(Object.assign({}, flags), { fromSubmission: lodash_1.default.has(flags, \"fromSubmission\") ? flags.fromSubmission : true });\n        return (this.onSubmission = this.formReady\n            .then((resolveFlags) => {\n            if (resolveFlags) {\n                flags = Object.assign(Object.assign({}, flags), resolveFlags);\n            }\n            this.onSetSubmission(submission, flags);\n            return this.submissionReadyResolve(submission);\n        }, (err) => this.submissionReadyReject(err))\n            .catch((err) => this.submissionReadyReject(err)));\n    }\n    handleDraftError(errName, errDetails, restoreDraft) {\n        const errorMessage = lodash_1.default.trim(`${this.t(errName)} ${errDetails || \"\"}`);\n        console.warn(errorMessage);\n        this.emit(restoreDraft ? \"restoreDraftError\" : \"saveDraftError\", errDetails || errorMessage);\n    }\n    saveDraft() {\n        var _a;\n        if (!this.draftEnabled || ((_a = this.parent) === null || _a === void 0 ? void 0 : _a.component.reference) === false) {\n            return;\n        }\n        if (!this.formio) {\n            this.handleDraftError(\"saveDraftInstanceError\");\n            return;\n        }\n        if (!Formio_1.Formio.getUser()) {\n            this.handleDraftError(\"saveDraftAuthError\");\n            return;\n        }\n        const draft = (0, utils_1.fastCloneDeep)(this.submission);\n        draft.state = \"draft\";\n        if (!this.savingDraft && !this.submitting) {\n            this.emit(\"saveDraftBegin\");\n            this.savingDraft = true;\n            this.formio\n                .saveSubmission(draft)\n                .then((sub) => {\n                // Set id to submission to avoid creating new draft submission\n                this.submission._id = sub._id;\n                this.savingDraft = false;\n                this.emit(\"saveDraft\", sub);\n            })\n                .catch((err) => {\n                this.savingDraft = false;\n                this.handleDraftError(\"saveDraftError\", err);\n            });\n        }\n    }\n    /**\n     * Restores a draft submission based on the user who is authenticated.\n     * @param {string} userId - The user id where we need to restore the draft from.\n     */\n    restoreDraft(userId) {\n        const formio = this.formio || this.options.formio;\n        if (!formio) {\n            this.handleDraftError(\"restoreDraftInstanceError\", null, true);\n            return;\n        }\n        this.savingDraft = true;\n        formio\n            .loadSubmissions({\n            params: {\n                state: 'draft',\n                owner: userId,\n                sort: '-created'\n            },\n        })\n            .then((submissions) => {\n            if (submissions.length > 0 && !this.options.skipDraftRestore) {\n                const draft = (0, utils_1.fastCloneDeep)(submissions[0]);\n                return this.setSubmission(draft).then(() => {\n                    this.draftEnabled = true;\n                    this.savingDraft = false;\n                    this.emit(\"restoreDraft\", draft);\n                });\n            }\n            // Enable drafts so that we can keep track of changes.\n            this.draftEnabled = true;\n            this.savingDraft = false;\n            this.emit(\"restoreDraft\", null);\n        })\n            .catch((err) => {\n            this.draftEnabled = true;\n            this.savingDraft = false;\n            this.handleDraftError(\"restoreDraftError\", err, true);\n        });\n    }\n    get schema() {\n        const schema = (0, utils_1.fastCloneDeep)(lodash_1.default.omit(this._form, [\"components\"]));\n        schema.components = [];\n        this.eachComponent((component) => schema.components.push(component.schema));\n        return schema;\n    }\n    mergeData(_this, _that) {\n        lodash_1.default.mergeWith(_this, _that, (thisValue, thatValue) => {\n            if (Array.isArray(thisValue) &&\n                Array.isArray(thatValue) &&\n                thisValue.length !== thatValue.length) {\n                return thatValue;\n            }\n        });\n    }\n    setValue(submission, flags = {}) {\n        if (!submission || !submission.data) {\n            submission = {\n                data: {},\n            };\n        }\n        // Metadata needs to be available before setValue\n        this._submission.metadata = submission.metadata ? lodash_1.default.cloneDeep(submission.metadata) : {};\n        this.editing = !!submission._id;\n        // Set the timezone in the options if available.\n        if (!this.options.submissionTimezone &&\n            submission.metadata &&\n            submission.metadata.timezone) {\n            this.options.submissionTimezone = submission.metadata.timezone;\n        }\n        const changed = super.setValue(submission.data, flags);\n        if (!flags.sanitize) {\n            this.mergeData(this.data, submission.data);\n        }\n        submission.data = this.data;\n        this._submission = submission;\n        return changed;\n    }\n    getValue() {\n        if (!this._submission) {\n            this._submission = {};\n        }\n        if (!this._submission.data) {\n            this._submission.data = {};\n        }\n        if (this.viewOnly) {\n            return this._submission;\n        }\n        const submission = this._submission;\n        submission.data = this.data;\n        return this._submission;\n    }\n    /**\n     * Build the form.\n     * @returns {Promise} - The promise that is triggered when the form is built.\n     */\n    init() {\n        if (this.options.submission) {\n            const submission = lodash_1.default.extend({}, this.options.submission);\n            this._submission = submission;\n            this._data = submission.data;\n        }\n        else {\n            this._submission = this._submission || { data: {} };\n        }\n        // Remove any existing components.\n        if (this.components && this.components.length) {\n            this.destroyComponents();\n            this.components = [];\n        }\n        if (this.component) {\n            this.component.components = this.form ? this.form.components : [];\n        }\n        else {\n            this.component = this.form;\n        }\n        this.component.type = \"form\";\n        this.component.input = false;\n        this.addComponents();\n        this.on(\"submitButton\", (options) => {\n            this.submit(false, options).catch((e) => {\n                options.instance.loading = false;\n                return e !== false && e !== undefined && console.log(e);\n            });\n        }, true);\n        this.on(\"checkValidity\", (data) => this.validate(data, { dirty: true, process: \"change\" }), true);\n        this.on(\"requestUrl\", (args) => this.submitUrl(args.url, args.headers), true);\n        this.on(\"resetForm\", () => this.resetValue(), true);\n        this.on(\"deleteSubmission\", () => this.deleteSubmission(), true);\n        this.on(\"refreshData\", () => this.updateValue(), true);\n        this.executeFormController();\n        return this.formReady;\n    }\n    executeFormController() {\n        // If no controller value or\n        // hidden and set to clearOnHide (Don't calculate a value for a hidden field set to clear when hidden)\n        if (!this.form ||\n            !this.form.controller ||\n            ((!this.visible || this.component.hidden) &&\n                this.component.clearOnHide &&\n                !this.rootPristine)) {\n            return false;\n        }\n        this.formReady.then(() => {\n            this.evaluate(this.form.controller, {\n                components: this.components,\n                instance: this,\n            });\n        });\n    }\n    /**\n     *\n     */\n    teardown() {\n        this.emit(\"formDelete\", this.id);\n        delete Formio_1.Formio.forms[this.id];\n        delete this.executeShortcuts;\n        delete this.triggerSaveDraft;\n        super.teardown();\n    }\n    destroy(all = false) {\n        this.off(\"submitButton\");\n        this.off(\"checkValidity\");\n        this.off(\"requestUrl\");\n        this.off(\"resetForm\");\n        this.off(\"deleteSubmission\");\n        this.off(\"refreshData\");\n        return super.destroy(all);\n    }\n    build(element) {\n        if (element || this.element) {\n            return this.ready.then(() => {\n                element = element || this.element;\n                super.build(element);\n            });\n        }\n        return this.ready;\n    }\n    getClassName() {\n        let classes = \"formio-form\";\n        if (this.options.readOnly) {\n            classes += \" formio-read-only\";\n        }\n        return classes;\n    }\n    render() {\n        return super.render(this.renderTemplate(\"webform\", {\n            classes: this.getClassName(),\n            children: this.renderComponents(),\n        }), this.builderMode ? \"builder\" : \"form\", true);\n    }\n    redraw() {\n        // Don't bother if we have not built yet.\n        if (!this.element) {\n            return Promise.resolve();\n        }\n        this.clear();\n        this.setContent(this.element, this.render());\n        return this.attach(this.element);\n    }\n    attach(element) {\n        this.setElement(element);\n        this.loadRefs(element, { webform: \"single\" });\n        const childPromise = this.attachComponents(this.refs.webform);\n        this.addEventListener(document, \"keydown\", this.executeShortcuts);\n        this.currentForm = this;\n        this.hook(\"attachWebform\", element, this);\n        return childPromise.then(() => {\n            this.emit(\"render\", this.element);\n            return this.setValue(this._submission, {\n                noUpdateEvent: true,\n            });\n        });\n    }\n    hasRequiredFields() {\n        let result = false;\n        (0, utils_1.eachComponent)(this.form.components, (component) => {\n            if (component.validate.required) {\n                result = true;\n                return true;\n            }\n        }, true);\n        return result;\n    }\n    resetValue() {\n        lodash_1.default.each(this.getComponents(), (comp) => comp.resetValue());\n        this.setPristine(true);\n        this.onChange({ resetValue: true });\n    }\n    /**\n     * Sets a new alert to display in the error dialog of the form.\n     * @param {string} type - The type of alert to display. \"danger\", \"success\", \"warning\", etc.\n     * @param {string} message - The message to show in the alert.\n     * @param {object} options - The options for the alert.\n     */\n    setAlert(type, message, options) {\n        if (!type && this.submitted) {\n            if (this.alert) {\n                if (this.refs.errorRef && this.refs.errorRef.length) {\n                    this.refs.errorRef.forEach((el) => {\n                        this.removeEventListener(el, \"click\");\n                        this.removeEventListener(el, \"keypress\");\n                    });\n                }\n                this.removeChild(this.alert);\n                this.alert = null;\n            }\n            return;\n        }\n        if (this.options.noAlerts) {\n            if (!message) {\n                this.emit(\"error\", false);\n            }\n            return;\n        }\n        if (this.alert) {\n            try {\n                if (this.refs.errorRef && this.refs.errorRef.length) {\n                    this.refs.errorRef.forEach((el) => {\n                        this.removeEventListener(el, \"click\");\n                        this.removeEventListener(el, \"keypress\");\n                    });\n                }\n                this.removeChild(this.alert);\n                this.alert = null;\n            }\n            catch (err) {\n                // ignore\n            }\n        }\n        if (message) {\n            const attrs = {\n                class: (options && options.classes) || `alert alert-${type}`,\n                id: `error-list-${this.id}`,\n            };\n            const templateOptions = {\n                message: message instanceof HTMLElement ? message.outerHTML : message,\n                attrs: attrs,\n                type,\n            };\n            this.alert = (0, utils_1.convertStringToHTMLElement)(this.renderTemplate(\"alert\", templateOptions), `#${attrs.id}`);\n        }\n        if (!this.alert) {\n            return;\n        }\n        this.loadRefs(this.alert, { errorRef: \"multiple\" });\n        if (this.refs.errorRef && this.refs.errorRef.length) {\n            this.refs.errorRef.forEach((el) => {\n                this.addEventListener(el, \"click\", (e) => {\n                    const key = e.currentTarget.dataset.componentKey;\n                    this.focusOnComponent(key);\n                });\n                this.addEventListener(el, \"keydown\", (e) => {\n                    if (e.keyCode === 13) {\n                        e.preventDefault();\n                        const key = e.currentTarget.dataset.componentKey;\n                        this.focusOnComponent(key);\n                    }\n                });\n            });\n        }\n        this.prepend(this.alert);\n    }\n    /**\n     * Focus on selected component.\n     * @param {string} key - The key of selected component.\n     */\n    focusOnComponent(key) {\n        if (key) {\n            const component = this.getComponent(key);\n            if (component) {\n                component.focus();\n            }\n        }\n    }\n    /**\n     * Show the errors of this form within the alert dialog.\n     * @param {object} error - An optional additional error to display along with the component errors.\n     * @returns {*}\n     */\n    /* eslint-disable no-unused-vars */\n    /**\n     *\n     * @param {Array} errors - An array of errors to display.\n     * @param {boolean} triggerEvent - Whether or not to trigger the error event.\n     * @returns {void|Array} - The errors that were set.\n     */\n    showErrors(errors, triggerEvent) {\n        this.loading = false;\n        if (!Array.isArray(errors)) {\n            errors = [errors];\n        }\n        if (Array.isArray(this.errors)) {\n            errors = lodash_1.default.union(errors, this.errors);\n        }\n        errors = errors.concat(this.customErrors).filter((err) => !!err);\n        if (!errors.length) {\n            this.setAlert(false);\n            return;\n        }\n        // Mark any components as invalid if in a custom message.\n        const componentErrors = {};\n        errors.forEach((err) => {\n            var _a, _b;\n            const path = (0, utils_1.getStringFromComponentPath)(err.path) || ((_a = err.context) === null || _a === void 0 ? void 0 : _a.path) || ((_b = err.component) === null || _b === void 0 ? void 0 : _b.key);\n            if (!componentErrors[path]) {\n                componentErrors[path] = [];\n            }\n            componentErrors[path].push(err);\n        });\n        // Iterate through all of our component errors and apply them to the components.\n        for (let path in componentErrors) {\n            const component = this.getComponent(path);\n            const errors = componentErrors[path];\n            if (component) {\n                component.serverErrors = errors.filter((err) => err.fromServer);\n                component.setCustomValidity(errors, true);\n            }\n        }\n        const displayedErrors = [];\n        if (errors.length) {\n            errors = lodash_1.default.uniqBy(errors, (error) => { var _a, _b; return [error.message, (_a = error.component) === null || _a === void 0 ? void 0 : _a.id, (_b = error.context) === null || _b === void 0 ? void 0 : _b.path].join(); });\n            const createListItem = (message, index) => {\n                var _a, _b, _c;\n                const err = errors[index];\n                const messageFromIndex = !lodash_1.default.isUndefined(index) && errors && errors[index];\n                const keyOrPath = (messageFromIndex === null || messageFromIndex === void 0 ? void 0 : messageFromIndex.formattedKeyOrPath) ||\n                    (messageFromIndex === null || messageFromIndex === void 0 ? void 0 : messageFromIndex.path) ||\n                    ((_a = messageFromIndex === null || messageFromIndex === void 0 ? void 0 : messageFromIndex.context) === null || _a === void 0 ? void 0 : _a.path) ||\n                    (((_b = err.context) === null || _b === void 0 ? void 0 : _b.component) && ((_c = err.context) === null || _c === void 0 ? void 0 : _c.component.key)) ||\n                    (err.component && err.component.key) ||\n                    (err.fromServer && err.path);\n                const formattedKeyOrPath = keyOrPath ? (0, utils_1.getStringFromComponentPath)(keyOrPath) : \"\";\n                if (typeof err !== \"string\" && !err.formattedKeyOrPath) {\n                    err.formattedKeyOrPath = formattedKeyOrPath;\n                }\n                return {\n                    message: (0, utils_1.unescapeHTML)(message),\n                    keyOrPath: formattedKeyOrPath,\n                };\n            };\n            errors.forEach(({ message, context, fromServer, component }, index) => {\n                const text = !(component === null || component === void 0 ? void 0 : component.label) || (context === null || context === void 0 ? void 0 : context.hasLabel) || fromServer\n                    ? this.t(\"alertMessage\", { message: this.t(message) })\n                    : this.t(\"alertMessageWithLabel\", {\n                        label: this.t(component === null || component === void 0 ? void 0 : component.label),\n                        message: this.t(message),\n                    });\n                displayedErrors.push(createListItem(text, index));\n            });\n        }\n        const errorsList = this.renderTemplate(\"errorsList\", { errors: displayedErrors });\n        this.root.setAlert(\"danger\", errorsList);\n        if (triggerEvent) {\n            this.emit(\"error\", errors);\n        }\n        return errors;\n    }\n    /* eslint-enable no-unused-vars */\n    /**\n     * Called when the submission has completed, or if the submission needs to be sent to an external library.\n     * @param {object} submission - The submission object.\n     * @param {boolean} saved - Whether or not this submission was saved to the server.\n     * @returns {object} - The submission object.\n     */\n    onSubmit(submission, saved) {\n        var _a;\n        this.loading = false;\n        this.submitting = false;\n        this.setPristine(true);\n        // We want to return the submitted submission and setValue will mutate the submission so cloneDeep it here.\n        this.setValue((0, utils_1.fastCloneDeep)(submission), {\n            noValidate: true,\n            noCheck: true,\n        });\n        this.setAlert(\"success\", `<p>${this.t(\"complete\")}</p>`);\n        // Cancel triggered saveDraft to prevent overriding the submitted state\n        if (this.draftEnabled && ((_a = this.triggerSaveDraft) === null || _a === void 0 ? void 0 : _a.cancel)) {\n            this.triggerSaveDraft.cancel();\n        }\n        this.emit(\"submit\", submission, saved);\n        if (saved) {\n            this.emit(\"submitDone\", submission);\n        }\n        return submission;\n    }\n    normalizeError(error) {\n        if (error) {\n            if (typeof error === \"object\" && \"details\" in error) {\n                error = error.details;\n            }\n            if (typeof error === \"string\") {\n                error = { message: error };\n            }\n        }\n        return error;\n    }\n    /**\n     * Called when an error occurs during the submission.\n     * @param {object} error - The error that occured.\n     * @returns {Array} errors - All errors.\n     */\n    onSubmissionError(error) {\n        error = this.normalizeError(error);\n        this.submitting = false;\n        this.setPristine(false);\n        this.emit(\"submitError\", error || this.errors);\n        // Allow for silent cancellations (no error message, no submit button error state)\n        if (error && error.silent) {\n            this.emit(\"change\", { isValid: true }, { silent: true });\n            return false;\n        }\n        const errors = this.showErrors(error, true);\n        if (this.root && this.root.alert) {\n            this.scrollIntoView(this.root.alert);\n        }\n        return errors;\n    }\n    /**\n     * Trigger the change event for this form.\n     * @param {any} flags - The flags to set on this change event.\n     * @param {any} changed - The changed object which reflects the changes in the form.\n     * @param {boolean} modified - Whether or not the form has been modified.\n     * @param {any} changes - The changes that have occured in the form.\n     */\n    onChange(flags, changed, modified, changes) {\n        var _a;\n        flags = flags || {};\n        let isChangeEventEmitted = false;\n        if (((_a = this.parent) === null || _a === void 0 ? void 0 : _a.subForm) === this) {\n            super.onChange(Object.assign(Object.assign({}, flags), { modified }), false);\n        }\n        else {\n            super.onChange(flags, true);\n        }\n        const value = lodash_1.default.clone(this.submission);\n        flags.changed = value.changed = changed;\n        flags.changes = changes;\n        if (modified && this.pristine) {\n            this.pristine = false;\n        }\n        this.checkData(value.data, flags);\n        const shouldValidate = !flags.noValidate ||\n            flags.fromIframe ||\n            (flags.fromSubmission && this.rootPristine && this.pristine && flags.changed);\n        const errors = shouldValidate\n            ? this.validate(value.data, Object.assign(Object.assign({}, flags), { noValidate: false, process: 'change' }))\n            : [];\n        value.isValid = (errors || []).filter(err => !err.fromServer).length === 0;\n        this.loading = false;\n        if (this.submitted) {\n            // show server errors while they are not cleaned/fixed\n            const nonComponentServerErrors = lodash_1.default.filter(this.serverErrors || [], (err) => !err.component && !err.path);\n            this.showErrors(nonComponentServerErrors.length ? nonComponentServerErrors : errors);\n        }\n        // See if we need to save the draft of the form.\n        if (modified && this.options.saveDraft) {\n            this.triggerSaveDraft();\n        }\n        if (!flags || !flags.noEmit) {\n            this.emit(\"change\", value, flags, modified);\n            isChangeEventEmitted = true;\n        }\n        // The form is initialized after the first change event occurs.\n        if (isChangeEventEmitted && !this.initialized) {\n            this.emit(\"initialized\");\n            this.initialized = true;\n        }\n    }\n    /**\n     * Send a delete request to the server.\n     * @returns {Promise} - The promise that is triggered when the delete is complete.\n     */\n    deleteSubmission() {\n        return this.formio.deleteSubmission().then(() => {\n            this.emit(\"submissionDeleted\", this.submission);\n            this.resetValue();\n        });\n    }\n    /**\n     * Cancels the submission.\n     * @param {boolean} noconfirm - Whether or not to confirm the cancellation.\n     * @alias reset\n     * @returns {boolean} - TRUE means the submission was cancelled, FALSE otherwise.\n     */\n    cancel(noconfirm) {\n        const shouldReset = this.hook(\"beforeCancel\", true);\n        if (shouldReset && (noconfirm || confirm(this.t(\"confirmCancel\")))) {\n            this.resetValue();\n            return true;\n        }\n        else {\n            this.emit(\"cancelSubmit\");\n            return false;\n        }\n    }\n    setMetadata(submission) {\n        // Add in metadata about client submitting the form\n        submission.metadata = submission.metadata || {};\n        lodash_1.default.defaults(submission.metadata, {\n            timezone: lodash_1.default.get(this, \"_submission.metadata.timezone\", (0, utils_1.currentTimezone)()),\n            offset: parseInt(lodash_1.default.get(this, \"_submission.metadata.offset\", (0, moment_1.default)().utcOffset()), 10),\n            origin: document.location.origin,\n            referrer: document.referrer,\n            browserName: navigator.appName,\n            userAgent: navigator.userAgent,\n            pathName: window.location.pathname,\n            onLine: navigator.onLine,\n        });\n    }\n    submitForm(options = {}, local = false) {\n        this.clearServerErrors();\n        return new Promise((resolve, reject) => {\n            // Read-only forms should never submit.\n            if (this.options.readOnly) {\n                return resolve({\n                    submission: this.submission,\n                    saved: false,\n                });\n            }\n            const submission = (0, utils_1.fastCloneDeep)(this.submission || {});\n            this.setMetadata(submission);\n            submission.state = options.state || submission.state || \"submitted\";\n            const isDraft = submission.state === \"draft\";\n            this.hook(\"beforeSubmit\", Object.assign(Object.assign({}, submission), { component: options.component }), (err, data) => {\n                var _a;\n                if (err) {\n                    return reject(err);\n                }\n                submission._vnote = data && data._vnote ? data._vnote : \"\";\n                try {\n                    if (!isDraft && !options.noValidate) {\n                        if (!submission.data) {\n                            return reject(\"Invalid Submission\");\n                        }\n                        const errors = this.validate(submission.data, {\n                            local,\n                            dirty: true,\n                            silentCheck: false,\n                            process: \"submit\",\n                        });\n                        if (errors.length ||\n                            ((_a = options.beforeSubmitResults) === null || _a === void 0 ? void 0 : _a.some((result) => result.status === \"rejected\"))) {\n                            return reject(errors);\n                        }\n                    }\n                }\n                catch (err) {\n                    console.error(err);\n                }\n                this.everyComponent((comp) => {\n                    var _a, _b;\n                    if (submission._vnote && comp.type === \"form\" && comp.component.reference) {\n                        lodash_1.default.get(submission.data, local ? (_a = comp.paths) === null || _a === void 0 ? void 0 : _a.localDataPath : comp.path, {})._vnote = submission._vnote;\n                    }\n                    const { persistent } = comp.component;\n                    if (persistent === \"client-only\") {\n                        lodash_1.default.unset(submission.data, local ? (_b = comp.paths) === null || _b === void 0 ? void 0 : _b.localDataPath : comp.path);\n                    }\n                });\n                this.hook(\"customValidation\", Object.assign(Object.assign({}, submission), { component: options.component }), (err) => {\n                    if (err) {\n                        // If string is returned, cast to object.\n                        if (typeof err === \"string\") {\n                            err = {\n                                message: err,\n                            };\n                        }\n                        // Ensure err is an array.\n                        err = Array.isArray(err) ? err : [err];\n                        return reject(err);\n                    }\n                    this.loading = true;\n                    // Use the form action to submit the form if available.\n                    if (this._form && this._form.action) {\n                        const method = submission.data._id &&\n                            this._form.action.includes(submission.data._id)\n                            ? \"PUT\"\n                            : \"POST\";\n                        return Formio_1.Formio.makeStaticRequest(this._form.action, method, submission, this.formio ? this.formio.options : {})\n                            .then((result) => resolve({\n                            submission: result,\n                            saved: true,\n                        }))\n                            .catch((error) => {\n                            this.setServerErrors(error);\n                            return reject(error);\n                        });\n                    }\n                    const submitFormio = this.formio;\n                    if (this.nosubmit || !submitFormio) {\n                        return resolve({\n                            submission,\n                            saved: false,\n                        });\n                    }\n                    // If this is an actionUrl, then make sure to save the action and not the submission.\n                    const submitMethod = submitFormio.actionUrl\n                        ? \"saveAction\"\n                        : \"saveSubmission\";\n                    submitFormio[submitMethod](submission)\n                        .then((result) => resolve({\n                        submission: result,\n                        saved: true,\n                    }))\n                        .catch((error) => {\n                        this.setServerErrors(error);\n                        return reject(error);\n                    });\n                });\n            });\n        });\n    }\n    setServerErrors(error) {\n        if (error.details) {\n            this.serverErrors = error.details\n                .filter((err) => (err.level ? err.level === \"error\" : err))\n                .map((err) => {\n                err.fromServer = true;\n                return err;\n            });\n        }\n        else if (typeof error === \"string\") {\n            this.serverErrors = [{ fromServer: true, level: \"error\", message: error }];\n        }\n    }\n    executeSubmit(options) {\n        this.submitted = true;\n        this.submitting = true;\n        return this.submitForm(options)\n            .then(({ submission, saved }) => this.onSubmit(submission, saved))\n            .then((results) => {\n            this.submissionInProcess = false;\n            return results;\n        })\n            .catch((err) => {\n            this.submissionInProcess = false;\n            return Promise.reject(this.onSubmissionError(err));\n        });\n    }\n    clearServerErrors() {\n        var _a;\n        (_a = this.serverErrors) === null || _a === void 0 ? void 0 : _a.forEach((error) => {\n            if (error.path) {\n                const pathArray = (0, utils_1.getArrayFromComponentPath)(error.path);\n                const component = this.getComponent(pathArray, lodash_1.default.identity, error.formattedKeyOrPath);\n                if (component) {\n                    component.serverErrors = [];\n                }\n            }\n        });\n        this.serverErrors = [];\n    }\n    /**\n     * Submits the form.\n     * @example\n     * import Webform from '@formio/js/Webform';\n     * let form = new Webform(document.getElementById('formio'));\n     * form.src = 'https://examples.form.io/example';\n     * form.submission = {data: {\n     *   firstName: 'Joe',\n     *   lastName: 'Smith',\n     *   email: 'joe@example.com'\n     * }};\n     * form.submit().then((submission) => {\n     *   console.log(submission);\n     * });\n     * @param {boolean} before - If this submission occured from the before handlers.\n     * @param {any} options - The options to use when submitting this form.\n     * @returns {Promise} - A promise when the form is done submitting.\n     */\n    submit(before = false, options = {}) {\n        this.submissionInProcess = true;\n        if (!before) {\n            return this.beforeSubmit(options).then(() => this.executeSubmit(options));\n        }\n        else {\n            return this.executeSubmit(options);\n        }\n    }\n    submitUrl(URL, headers) {\n        if (!URL) {\n            return console.warn(\"Missing URL argument\");\n        }\n        const submission = this.submission || {};\n        const API_URL = URL;\n        const settings = {\n            method: \"POST\",\n            headers: {},\n        };\n        if (headers && headers.length > 0) {\n            headers.map((e) => {\n                if (e.header !== \"\" && e.value !== \"\") {\n                    settings.headers[e.header] = this.interpolate(e.value, submission);\n                }\n            });\n        }\n        if (API_URL && settings) {\n            Formio_1.Formio.makeStaticRequest(API_URL, settings.method, submission, {\n                headers: settings.headers,\n            })\n                .then(() => {\n                this.emit(\"requestDone\");\n                this.setAlert(\"success\", \"<p> Success </p>\");\n            })\n                .catch((e) => {\n                const message = `${e.statusText ? e.statusText : \"\"} ${e.status ? e.status : e}`;\n                this.emit(\"error\", message);\n                console.error(message);\n                this.setAlert(\"danger\", `<p> ${message} </p>`);\n                return Promise.reject(this.onSubmissionError(e));\n            });\n        }\n        else {\n            this.emit(\"error\", \"You should add a URL to this button.\");\n            this.setAlert(\"warning\", \"You should add a URL to this button.\");\n            return console.warn(\"You should add a URL to this button.\");\n        }\n    }\n    triggerCaptcha(components = null) {\n        if (!this || !this.components) {\n            return;\n        }\n        const captchaComponent = [];\n        (0, utils_1.eachComponent)(components || this.components, (component) => {\n            if (/^(re)?captcha$/.test(component.type) && component.component.eventType === 'formLoad') {\n                captchaComponent.push(component);\n            }\n        }, true);\n        if (captchaComponent.length > 0) {\n            if (captchaComponent[0].component.provider === 'google' && components) {\n                return;\n            }\n            captchaComponent[0].verify(`${this.form.name ? this.form.name : 'form'}Load`);\n        }\n    }\n    set nosubmit(value) {\n        this._nosubmit = !!value;\n        this.emit(\"nosubmit\", this._nosubmit);\n    }\n    get nosubmit() {\n        return this._nosubmit || false;\n    }\n    get conditions() {\n        var _a, _b;\n        return (_b = (_a = this.schema.settings) === null || _a === void 0 ? void 0 : _a.conditions) !== null && _b !== void 0 ? _b : [];\n    }\n    get variables() {\n        var _a, _b;\n        return (_b = (_a = this.schema.settings) === null || _a === void 0 ? void 0 : _a.variables) !== null && _b !== void 0 ? _b : [];\n    }\n}\nexports[\"default\"] = Webform;\nWebform.setBaseUrl = Formio_1.Formio.setBaseUrl;\nWebform.setApiUrl = Formio_1.Formio.setApiUrl;\nWebform.setAppUrl = Formio_1.Formio.setAppUrl;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Webform.js?");
 
 /***/ }),
 
@@ -5092,7 +5092,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst Field_1 = __importDefault(__webpack_require__(/*! ../field/Field */ \"./lib/cjs/components/_classes/field/Field.js\"));\nconst Components_1 = __importDefault(__webpack_require__(/*! ../../Components */ \"./lib/cjs/components/Components.js\"));\n'';\nconst utils_1 = __importDefault(__webpack_require__(/*! ../../../utils */ \"./lib/cjs/utils/index.js\"));\nconst process_1 = __webpack_require__(/*! @formio/core/process */ \"./node_modules/@formio/core/lib/process/index.js\");\n/**\n * NestedComponent class.\n * @augments Field\n */\nclass NestedComponent extends Field_1.default {\n    static schema(...extend) {\n        return Field_1.default.schema({\n            tree: false,\n            lazyLoad: false,\n        }, ...extend);\n    }\n    constructor(component, options, data) {\n        super(component, options, data);\n        this.type = 'components';\n        /**\n         * The collapsed state of this NestedComponent.\n         * @type {boolean}\n         * @default false\n         * @private\n         */\n        this._collapsed = !!this.component.collapsed;\n    }\n    get defaultSchema() {\n        return NestedComponent.schema();\n    }\n    /**\n     * Get the schema for the NestedComponent.\n     * @returns {object} The schema for the NestedComponent.\n     * @override\n     */\n    get schema() {\n        const schema = super.schema;\n        const components = lodash_1.default.uniqBy(this.getComponents(), 'component.key');\n        schema.components = lodash_1.default.map(components, 'schema');\n        return schema;\n    }\n    /**\n     * Get collapsed state.\n     * @returns {boolean} The collapsed state.\n     */\n    get collapsed() {\n        return this._collapsed;\n    }\n    /**\n     * Set collapsed state.\n     * @param {boolean} value - The collapsed state.\n     * @returns {void}\n     */\n    collapse(value) {\n        const promise = this.redraw();\n        if (!value) {\n            this.checkValidity(this.data, !this.pristine);\n        }\n        return promise;\n    }\n    /**\n     * Set collapsed state.\n     * @param {boolean} value - The collapsed state.\n     * @returns {void}\n     */\n    set collapsed(value) {\n        this._collapsed = value;\n        this.collapse(value);\n    }\n    /**\n     * Set visible state of parent and each child component.\n     * @param {boolean} value - The visible state.\n     * @returns {void}\n     */\n    set visible(value) {\n        // DO NOT CALL super here.  There is an issue where clearOnHide was getting triggered with\n        // subcomponents because the \"parentVisible\" flag was set to false when it should really be\n        // set to true.\n        const visibilityChanged = this._visible !== value;\n        this._visible = value;\n        const isVisible = this.visible;\n        const forceShow = this.shouldForceShow();\n        const forceHide = this.shouldForceHide();\n        this.components.forEach((component) => {\n            // Set the parent visibility first since we may have nested components within nested components\n            // and they need to be able to determine their visibility based on the parent visibility.\n            component.parentVisible = isVisible;\n            let visible;\n            if (component.hasCondition()) {\n                visible = !component.conditionallyHidden();\n            }\n            else {\n                visible = !component.component.hidden;\n            }\n            if (forceShow || visible) {\n                component.visible = true;\n            }\n            else if (forceHide || !isVisible || !visible) {\n                component.visible = false;\n            }\n            // If hiding a nested component, clear all errors below.\n            if (!component.visible) {\n                component.error = '';\n            }\n        });\n        if (visibilityChanged) {\n            this.redraw();\n        }\n    }\n    /**\n     * Get visible state.\n     * @returns {boolean} The visible state.\n     */\n    get visible() {\n        return super.visible;\n    }\n    /**\n     * Set parent visibility.\n     * @param {boolean} value - The parent visibility.\n     * @returns {void}\n     */\n    set parentVisible(value) {\n        super.parentVisible = value;\n        this.components.forEach(component => component.parentVisible = this.visible);\n    }\n    /**\n     * Get parent visibility.\n     * @returns {boolean} The parent visibility.\n     */\n    get parentVisible() {\n        return super.parentVisible;\n    }\n    /**\n     * Get the disabled state.\n     * @returns {boolean} - The disabled state.\n     */\n    get disabled() {\n        return super.disabled;\n    }\n    /**\n     * Set the disabled state.\n     * @param {boolean} disabled - The disabled state.\n     */\n    set disabled(disabled) {\n        super.disabled = disabled;\n        this.components.forEach((component) => component.parentDisabled = disabled);\n    }\n    /**\n     * Set parent disabled state.\n     * @param {boolean} value - The parent disabled state.\n     * @returns {void}\n     */\n    set parentDisabled(value) {\n        super.parentDisabled = value;\n        this.components.forEach(component => {\n            component.parentDisabled = this.disabled;\n        });\n    }\n    /**\n     * Get parent disabled state.\n     * @returns {boolean} The parent disabled state.\n     */\n    get parentDisabled() {\n        return super.parentDisabled;\n    }\n    /**\n     * Get ready state from all components.\n     * @returns {Promise<Array>} - The promise that resolves when all components are ready.\n     */\n    get ready() {\n        return Promise.all(this.getComponents().map(component => component.ready));\n    }\n    /**\n     * Get currentForm object.\n     * @returns {object} - The current form object.\n     */\n    get currentForm() {\n        return super.currentForm;\n    }\n    /**\n     * Set currentForm object.\n     * @param {object} instance - The current form object.\n     * @returns {void}\n     */\n    set currentForm(instance) {\n        super.currentForm = instance;\n        this.getComponents().forEach(component => {\n            component.currentForm = instance;\n        });\n    }\n    /**\n     * Get Row Index.\n     * @returns {number} - The row index.\n     */\n    get rowIndex() {\n        return this._rowIndex;\n    }\n    /**\n     * Set Row Index to row and update each component.\n     * @param {number} value - The row index.\n     * @returns {void}\n     */\n    set rowIndex(value) {\n        var _a, _b;\n        this._rowIndex = value;\n        this.paths = utils_1.default.getComponentPaths(this.component, (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component, Object.assign(Object.assign({}, (((_b = this.parent) === null || _b === void 0 ? void 0 : _b.paths) || {})), { dataIndex: value }));\n        this.eachComponent((component) => {\n            component.rowIndex = value;\n        });\n    }\n    /**\n     * Get Contextual data of the component.\n     * @returns {object} - The contextual data of the component.\n     * @override\n     */\n    componentContext() {\n        return this._data;\n    }\n    /**\n     * Get the data of the component.\n     * @returns {object} - The data of the component.\n     * @override\n     */\n    get data() {\n        return this._data;\n    }\n    /**\n     * Set the data of the component.\n     * @param {object} value - The data of the component.\n     * @returns {void}\n     */\n    set data(value) {\n        this._data = value;\n        this.eachComponent((component) => {\n            component.data = this.componentContext(component);\n        });\n    }\n    /**\n     * Get components array.\n     * @returns {Array} - The components array.\n     */\n    getComponents() {\n        return this.components || [];\n    }\n    /**\n     * Perform a deep iteration over every component, including those\n     * within other container based components.\n     * @param {Function} fn - Called for every component.\n     * @param {any} options - The options to include with this everyComponent call.\n     */\n    everyComponent(fn, options = {}) {\n        const components = this.getComponents();\n        lodash_1.default.each(components, (component, index) => {\n            if (fn(component, components, index) === false) {\n                return false;\n            }\n            if (typeof component.everyComponent === 'function') {\n                if (component.everyComponent(fn, options) === false) {\n                    return false;\n                }\n            }\n        });\n    }\n    /**\n     * Check if the component has a component.\n     * @param {import('@formio/core').Component} component - The component to check.\n     * @returns {boolean} - TRUE if the component has a component, FALSE otherwise.\n     */\n    hasComponent(component) {\n        let result = false;\n        this.everyComponent((comp) => {\n            if (comp === component) {\n                result = true;\n                return false;\n            }\n        });\n        return result;\n    }\n    /**\n     * Get the flattened components of this NestedComponent.\n     * @returns {object} - The flattened components of this NestedComponent.\n     */\n    flattenComponents() {\n        const result = {};\n        this.everyComponent((component) => {\n            result[component.component.flattenAs || component.key] = component;\n        });\n        return result;\n    }\n    /**\n     * Perform an iteration over each component within this container component.\n     * @param {Function} fn - Called for each component\n     */\n    eachComponent(fn) {\n        lodash_1.default.each(this.getComponents(), (component, index) => {\n            if (fn(component, index) === false) {\n                return false;\n            }\n        });\n    }\n    /**\n     * Returns a component provided a key. This performs a deep search within the component tree.\n     * @param {string} path - The path to the component.\n     * @returns {any} - The component that is located.\n     */\n    getComponent(path) {\n        var _a;\n        // If the component is found\n        if (!this.componentMatches) {\n            this.componentMatches = {};\n        }\n        if (this.componentMatches && this.componentMatches[path]) {\n            return this.componentMatches[path];\n        }\n        path = utils_1.default.getStringFromComponentPath(path);\n        const matches = {\n            path: undefined,\n            fullPath: undefined,\n            localPath: undefined,\n            fullLocalPath: undefined,\n            dataPath: undefined,\n            localDataPath: undefined,\n            key: undefined,\n        };\n        this.everyComponent((component) => {\n            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;\n            // All searches are relative to this component so replace this path from the child paths.\n            utils_1.default.componentMatches(component.component, {\n                path: (_b = (_a = component.paths) === null || _a === void 0 ? void 0 : _a.path) === null || _b === void 0 ? void 0 : _b.replace(new RegExp(`^${(_c = this.paths) === null || _c === void 0 ? void 0 : _c.path}\\\\.?`), ''),\n                fullPath: (_e = (_d = component.paths) === null || _d === void 0 ? void 0 : _d.fullPath) === null || _e === void 0 ? void 0 : _e.replace(new RegExp(`^${(_f = this.paths) === null || _f === void 0 ? void 0 : _f.fullPath}\\\\.?`), ''),\n                localPath: (_h = (_g = component.paths) === null || _g === void 0 ? void 0 : _g.localPath) === null || _h === void 0 ? void 0 : _h.replace(new RegExp(`^${(_j = this.paths) === null || _j === void 0 ? void 0 : _j.localPath}\\\\.?`), ''),\n                fullLocalPath: (_l = (_k = component.paths) === null || _k === void 0 ? void 0 : _k.fullLocalPath) === null || _l === void 0 ? void 0 : _l.replace(new RegExp(`^${(_m = this.paths) === null || _m === void 0 ? void 0 : _m.fullLocalPath}\\\\.?`), ''),\n                dataPath: (_p = (_o = component.paths) === null || _o === void 0 ? void 0 : _o.dataPath) === null || _p === void 0 ? void 0 : _p.replace(new RegExp(`^${(_q = this.paths) === null || _q === void 0 ? void 0 : _q.dataPath}\\\\.?`), ''),\n                localDataPath: (_s = (_r = component.paths) === null || _r === void 0 ? void 0 : _r.localDataPath) === null || _s === void 0 ? void 0 : _s.replace(new RegExp(`^${(_t = this.paths) === null || _t === void 0 ? void 0 : _t.localDataPath}\\\\.?`), ''),\n            }, path, this.rowIndex, matches, (type, match) => {\n                match.instance = component;\n                return match;\n            });\n        });\n        this.componentMatches[path] = (_a = utils_1.default.getBestMatch(matches)) === null || _a === void 0 ? void 0 : _a.instance;\n        return this.componentMatches[path];\n    }\n    /**\n     * Return a component provided the Id of the component.\n     * @param {string} id - The Id of the component.\n     * @param {Function} fn - Called with the component once it is retrieved.\n     * @returns {object} - The component retrieved.\n     */\n    getComponentById(id, fn = null) {\n        let comp = null;\n        this.everyComponent((component, components) => {\n            if (component.id === id) {\n                comp = component;\n                if (fn) {\n                    fn(component, components);\n                }\n                return false;\n            }\n        });\n        return comp;\n    }\n    /**\n     * Create a new component and add it to the components array.\n     * @param {import('@formio/core').Component} component - The component JSON schema to create.\n     * @param {object} options - The options to create the component with.\n     * @param {import('@formio/core').DataObject} data - The submission data object to house the data for this component.\n     * @param {import('@formio/core').Component} [before] - The component before which to add this component.\n     * @param {import('@formio/core').Component} [replacedComp] - The component to replace with this component.\n     * @returns {any} - The created component instance.\n     */\n    createComponent(component, options, data, before, replacedComp) {\n        if (!component) {\n            return;\n        }\n        options = options || this.options;\n        data = data || this.data;\n        options.parent = this;\n        options.parentVisible = this.visible;\n        options.root = (options === null || options === void 0 ? void 0 : options.root) || this.root || this;\n        options.localRoot = this.localRoot;\n        options.skipInit = true;\n        if (!(options.display === 'pdf' && this.builderMode)) {\n            component.id = utils_1.default.getRandomComponentId();\n        }\n        const comp = Components_1.default.create(component, options, data, true);\n        comp.init();\n        if (component.internal) {\n            return comp;\n        }\n        if (before) {\n            const index = lodash_1.default.findIndex(this.components, { id: before.id });\n            if (index !== -1) {\n                this.components.splice(index, 0, comp);\n            }\n            else {\n                this.components.push(comp);\n            }\n        }\n        else if (replacedComp) {\n            const index = lodash_1.default.findIndex(this.components, { id: replacedComp.id });\n            if (index !== -1) {\n                this.components[index] = comp;\n            }\n            else {\n                this.components.push(comp);\n            }\n        }\n        else {\n            this.components.push(comp);\n        }\n        return comp;\n    }\n    getContainer() {\n        return this.element;\n    }\n    get componentComponents() {\n        return this.component.components || [];\n    }\n    get nestedKey() {\n        return `nested-${this.key}`;\n    }\n    get templateName() {\n        return 'container';\n    }\n    init() {\n        this.components = this.components || [];\n        this.addComponents();\n        return super.init();\n    }\n    /**\n     * Add a new component instance to the components array.\n     * @param {import('@formio/core').DataObject} [data] - The Submission data for this component.\n     * @param {object} [options] - The options for this component.\n     */\n    addComponents(data, options) {\n        data = data || this.data;\n        this.components = this.components || [];\n        options = options || this.options;\n        if (options.components) {\n            this.components = options.components;\n        }\n        else {\n            const components = this.hook('addComponents', this.componentComponents, this) || [];\n            components.forEach((component) => this.addComponent(component, data));\n        }\n    }\n    /**\n     * Add a new component to the components array.\n     * @param {import('@formio/core').Component} component - The component JSON schema to add.\n     * @param {object} data - The submission data object to house the data for this component.\n     * @param {HTMLElement} before - A DOM element to insert this element before.\n     * @param {boolean} [noAdd] - A possibly extraneous boolean flag.\n     * @returns {any} - The created component instance.\n     */\n    addComponent(component, data = null, before = null, noAdd = false) {\n        data = data || this.data;\n        this.components = this.components || [];\n        component = this.hook('addComponent', component, data, before, noAdd);\n        const comp = this.createComponent(component, this.options, data, before ? before : null);\n        if (noAdd) {\n            return comp;\n        }\n        return comp;\n    }\n    beforeFocus() {\n        if (this.parent && 'beforeFocus' in this.parent) {\n            this.parent.beforeFocus(this);\n        }\n    }\n    render(children) {\n        // If already rendering, don't re-render.\n        return super.render(children || this.renderTemplate(this.templateName, {\n            children: !this.visible ? '' : this.renderComponents(),\n            nestedKey: this.nestedKey,\n            collapsed: this.options.pdf ? false : this.collapsed,\n        }));\n    }\n    renderComponents(components) {\n        components = components || this.getComponents();\n        const children = components.map(component => component.render());\n        return this.renderTemplate('components', {\n            children,\n            components,\n        });\n    }\n    attach(element) {\n        const superPromise = super.attach(element);\n        this.loadRefs(element, {\n            header: 'single',\n            collapsed: this.collapsed,\n            [this.nestedKey]: 'single',\n            messageContainer: 'single-scope',\n        });\n        let childPromise = Promise.resolve();\n        if (this.refs[this.nestedKey]) {\n            childPromise = this.attachComponents(this.refs[this.nestedKey]);\n        }\n        if (!this.visible) {\n            this.attachComponentsLogic();\n        }\n        if (this.component.collapsible && this.refs.header) {\n            this.addEventListener(this.refs.header, 'click', () => {\n                this.collapsed = !this.collapsed;\n            });\n            this.addEventListener(this.refs.header, 'keydown', (e) => {\n                if (e.keyCode === 13 || e.keyCode === 32) {\n                    e.preventDefault();\n                    this.collapsed = !this.collapsed;\n                }\n            });\n        }\n        return Promise.all([\n            superPromise,\n            childPromise,\n        ]);\n    }\n    /**\n     * Attach the logic to the components.\n     * @param {import('@formio/core').Component[]} components - The components to attach logic to.\n     */\n    attachComponentsLogic(components) {\n        components = components || this.components;\n        lodash_1.default.each(components, (comp) => {\n            comp.attachLogic();\n            if (lodash_1.default.isFunction(comp.attachComponentsLogic)) {\n                comp.attachComponentsLogic();\n            }\n        });\n    }\n    attachComponents(element, components, container) {\n        components = components || this.components;\n        container = container || this.component.components;\n        element = this.hook('attachComponents', element, components, container, this);\n        if (!element) {\n            // Return a non-resolving promise.\n            return (new Promise(() => { }));\n        }\n        let index = 0;\n        const promises = [];\n        Array.prototype.slice.call(element.children).forEach(child => {\n            if (!child.getAttribute('data-noattach') && components[index]) {\n                promises.push(components[index].attach(child));\n                index++;\n            }\n        });\n        return Promise.all(promises);\n    }\n    /**\n     * Remove a component from the components array and from the children object\n     * @param {import('@formio/core').Component} component - The component to remove from the components.\n     * @param {import('@formio/core').Component[]} components - An array of components to remove this component from.\n     * @param {boolean} [all] - If set to TRUE will cascade remove all components.\n     */\n    removeComponent(component, components, all = false) {\n        components = components || this.components;\n        component.destroy(all);\n        lodash_1.default.remove(components, { id: component.id });\n        if (this.componentsMap[component.path]) {\n            delete this.componentsMap[component.path];\n        }\n    }\n    /**\n     * Removes a component provided the API key of that component.\n     * @param {string} key - The API key of the component to remove.\n     * @param {Function} fn - Called once the component is removed.\n     * @returns {null|void} - Returns nothing if the component is not found.\n     */\n    removeComponentByKey(key, fn = null) {\n        const comp = this.getComponent(key, (component, components) => {\n            this.removeComponent(component, components);\n            if (fn) {\n                fn(component, components);\n            }\n        });\n        if (!comp) {\n            if (fn) {\n                fn(null);\n            }\n            return null;\n        }\n    }\n    /**\n     * Removes a component provided the Id of the component.\n     * @param {string} id - The Id of the component to remove.\n     * @param {Function} fn - Called when the component is removed.\n     * @returns {null|void} - Returns nothing if the component is not found.\n     */\n    removeComponentById(id, fn = null) {\n        const comp = this.getComponentById(id, (component, components) => {\n            this.removeComponent(component, components);\n            if (fn) {\n                fn(component, components);\n            }\n        });\n        if (!comp) {\n            if (fn) {\n                fn(null);\n            }\n            return null;\n        }\n    }\n    updateValue(value, flags = {}) {\n        return this.components.reduce((changed, comp) => {\n            return comp.updateValue(null, flags) || changed;\n        }, super.updateValue(value, flags));\n    }\n    shouldSkipValidation(data, row, flags) {\n        // Nested components with no input should not be validated.\n        if (!this.component.input) {\n            return true;\n        }\n        else {\n            return super.shouldSkipValidation(data, row, flags);\n        }\n    }\n    checkData(data, flags, row, components) {\n        if (this.builderMode) {\n            return true;\n        }\n        data = data || this.rootValue;\n        flags = flags || {};\n        row = row || this.data;\n        components = components && lodash_1.default.isArray(components) ? components : this.getComponents();\n        super.checkData(data, Object.assign({}, flags), row);\n        components.forEach((comp) => comp.checkData(data, Object.assign({}, flags), row));\n    }\n    checkConditions(data, flags, row) {\n        // check conditions of parent component first, because it may influence on visibility of it's children\n        const check = super.checkConditions(data, flags, row);\n        //row data of parent component not always corresponds to row of nested components, use comp.data as row data for children instead\n        this.getComponents().forEach(comp => comp.checkConditions(data, flags, comp.data));\n        return check;\n    }\n    clearOnHide(show) {\n        super.clearOnHide(show);\n        this.getComponents().forEach(component => component.clearOnHide(show));\n    }\n    /**\n     * Allow components to hook into the next page trigger to perform their own logic.\n     * @param {Function} next - The callback to continue to the next page.\n     * @returns {Promise} - A promise when the page has been processed.\n     */\n    beforePage(next) {\n        return Promise.all(this.getComponents().map((comp) => comp.beforePage(next)));\n    }\n    /**\n     * Allow components to hook into the submission to provide their own async data.\n     * @returns {Promise} - Returns a promise when the constituent beforeSubmit functions are complete.\n     */\n    beforeSubmit() {\n        return Promise.allSettled(this.getComponents().map((comp) => comp.beforeSubmit()));\n    }\n    calculateValue(data, flags, row) {\n        // Do not iterate into children and calculateValues if this nested component is conditionally hidden.\n        if (this.conditionallyHidden()) {\n            return false;\n        }\n        return this.getComponents().reduce((changed, comp) => comp.calculateValue(data, flags, row) || changed, super.calculateValue(data, flags, row));\n    }\n    isLastPage() {\n        return this.pages.length - 1 === this.page;\n    }\n    isValid(data, dirty) {\n        return this.getComponents().reduce((valid, comp) => comp.isValid(data, dirty) && valid, super.isValid(data, dirty));\n    }\n    validationProcessor({ scope, data, row, instance, paths }, flags) {\n        var _a;\n        const { dirty } = flags;\n        if (this.root && this.root.hasSubWizards && this.page !== this.root.page) {\n            instance = ((_a = this.componentsMap) === null || _a === void 0 ? void 0 : _a.hasOwnProperty(paths.dataPath))\n                ? this.componentsMap[paths.dataPath]\n                : this.getComponent(paths.dataPath);\n        }\n        if (!instance) {\n            return;\n        }\n        instance.checkComponentValidity(data, dirty, row, flags, scope.errors);\n        if (instance.processOwnValidation) {\n            scope.noRecurse = true;\n        }\n    }\n    /**\n     * Perform a validation on all child components of this nested component.\n     * @param {import('@formio/core').Component[]} components - The components to validate.\n     * @param {import('@formio/core').DataObject} data - The data to validate.\n     * @param {object} flags - The flags to use when validating.\n     * @returns {Promise<Array>|Array} - The errors if any exist.\n     */\n    validateComponents(components = null, data = null, flags = {}) {\n        components = components || this.component.components;\n        data = data || this.rootValue;\n        const { async, dirty, process } = flags;\n        const validationProcessorProcess = (context) => this.validationProcessor(context, flags);\n        const checkModalProcessorProcess = ({ instance, component, components }) => {\n            // If we just validated the last component, and there are errors from our parent, then we need to show a model of those errors.\n            if (instance &&\n                instance.parent &&\n                (component === components[components.length - 1]) &&\n                instance.parent.componentModal) {\n                instance.parent.checkModal(instance.parent.childErrors, dirty);\n            }\n        };\n        const processorContext = {\n            process: process || 'unknown',\n            components,\n            instances: this.componentsMap,\n            data: data,\n            local: !!flags.local,\n            scope: { errors: [] },\n            parent: this.component,\n            parentPaths: this.paths,\n            processors: [\n                {\n                    process: validationProcessorProcess,\n                    processSync: validationProcessorProcess\n                },\n                {\n                    process: checkModalProcessorProcess,\n                    processSync: checkModalProcessorProcess\n                }\n            ]\n        };\n        return async ? (0, process_1.process)(processorContext).then((scope) => scope.errors) : (0, process_1.processSync)(processorContext).errors;\n    }\n    /**\n     * Validate a nested component with data, or its own internal data.\n     * @param {import('@formio/core').DataObject} data - The data to validate.\n     * @param {object} flags - The flags to use when validating.\n     * @returns {Array} - The errors if any exist.\n     */\n    validate(data = null, flags = {}) {\n        data = data || this.rootValue;\n        return this.validateComponents(this.getComponents().map((component) => component.component), data, flags);\n    }\n    checkComponentValidity(data = null, dirty = false, row = null, flags = {}, allErrors = []) {\n        this.childErrors = [];\n        return super.checkComponentValidity(data, dirty, row, flags, allErrors);\n    }\n    /**\n     * Checks the validity of the component.\n     * @param {*} data - The data to check if the component is valid.\n     * @param {boolean} dirty - If the component is dirty.\n     * @param {*} row - The contextual row data for this component.\n     * @param {boolean} silentCheck - If the check should be silent and not set the error messages.\n     * @param {Array<any>} childErrors - An array of all errors that have occured so that it can be appended when another one occurs here.\n     * @returns {boolean} - TRUE if the component is valid.\n     */\n    checkValidity(data = null, dirty = false, row = null, silentCheck = false, childErrors = []) {\n        childErrors.push(...this.validate(data, { dirty, silentCheck }));\n        return this.checkComponentValidity(data, dirty, row, { dirty, silentCheck }, childErrors) && childErrors.length === 0;\n    }\n    checkAsyncValidity(data = null, dirty = false, row = null, silentCheck = false) {\n        return this.ready.then(() => {\n            return this.validate(data, { dirty, silentCheck, async: true }).then((childErrors) => {\n                return this.checkComponentValidity(data, dirty, row, { dirty, silentCheck, async: true }, childErrors).then((valid) => {\n                    return valid && childErrors.length === 0;\n                });\n            });\n        });\n    }\n    setPristine(pristine) {\n        super.setPristine(pristine);\n        this.getComponents().forEach((comp) => comp.setPristine(pristine));\n    }\n    get isPristine() {\n        return this.pristine && this.getComponents().every((c) => c.isPristine);\n    }\n    get isDirty() {\n        return this.dirty && this.getComponents().every((c) => c.isDirty);\n    }\n    detach() {\n        this.components.forEach(component => {\n            component.detach();\n        });\n        super.detach();\n    }\n    clear() {\n        this.components.forEach(component => {\n            component.clear();\n        });\n        super.clear();\n    }\n    destroy(all = false) {\n        this.destroyComponents(all);\n        super.destroy(all);\n    }\n    destroyComponents(all = false) {\n        const components = this.getComponents().slice();\n        components.forEach((comp) => this.removeComponent(comp, this.components, all));\n        this.components = [];\n    }\n    get visibleErrors() {\n        return this.getComponents().reduce((errors, comp) => errors.concat(comp.visibleErrors || []), super.visibleErrors);\n    }\n    get errors() {\n        const thisErrors = super.errors;\n        return this.getComponents()\n            .reduce((errors, comp) => errors.concat(comp.errors || []), thisErrors)\n            .filter(err => err.level !== 'hidden');\n    }\n    getValue() {\n        return this.data;\n    }\n    resetValue() {\n        super.resetValue();\n        this.getComponents().forEach((comp) => comp.resetValue());\n        this.setPristine(true);\n    }\n    get dataReady() {\n        return Promise.all(this.getComponents().map((component) => component.dataReady));\n    }\n    setNestedValue(component, value, flags = {}) {\n        component._data = this.componentContext(component);\n        if (component.type === 'button') {\n            return false;\n        }\n        if (component.type === 'components') {\n            if ((component.tree || component.hasInput) && component.hasValue(value)) {\n                return component.setValue(lodash_1.default.get(value, component.key), flags);\n            }\n            return component.setValue(value, flags);\n        }\n        else if (value && component.hasValue(value)) {\n            return component.setValue(lodash_1.default.get(value, component.key), flags);\n        }\n        else if ((!this.rootPristine || component.visible) && (flags.resetValue || component.shouldAddDefaultValue)) {\n            flags.noValidate = !flags.dirty;\n            flags.resetValue = true;\n            return component.setValue(component.defaultValue, flags);\n        }\n    }\n    setValue(value, flags = {}) {\n        if (!value) {\n            return false;\n        }\n        // If the value is equal to the empty value, then this means we need to reset the values.\n        if (lodash_1.default.isEqual(value, this.emptyValue)) {\n            // TO-DO: For a future major release, we need to investigate removing the need for the\n            // \"resetValue\" flag. This seems like a hack that is no longer necessary and the renderer\n            // may behave more deterministically without it.\n            flags.resetValue = true;\n        }\n        return this.getComponents().reduce((changed, component) => {\n            return this.setNestedValue(component, value, flags, changed) || changed;\n        }, false);\n    }\n    get lazyLoad() {\n        var _a;\n        return (_a = this.component.lazyLoad) !== null && _a !== void 0 ? _a : false;\n    }\n}\nexports[\"default\"] = NestedComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/_classes/nested/NestedComponent.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst Field_1 = __importDefault(__webpack_require__(/*! ../field/Field */ \"./lib/cjs/components/_classes/field/Field.js\"));\nconst Components_1 = __importDefault(__webpack_require__(/*! ../../Components */ \"./lib/cjs/components/Components.js\"));\n'';\nconst utils_1 = __importDefault(__webpack_require__(/*! ../../../utils */ \"./lib/cjs/utils/index.js\"));\nconst process_1 = __webpack_require__(/*! @formio/core/process */ \"./node_modules/@formio/core/lib/process/index.js\");\n/**\n * NestedComponent class.\n * @augments Field\n */\nclass NestedComponent extends Field_1.default {\n    static schema(...extend) {\n        return Field_1.default.schema({\n            tree: false,\n            lazyLoad: false,\n        }, ...extend);\n    }\n    constructor(component, options, data) {\n        super(component, options, data);\n        this.type = 'components';\n        /**\n         * The collapsed state of this NestedComponent.\n         * @type {boolean}\n         * @default false\n         * @private\n         */\n        this._collapsed = !!this.component.collapsed;\n    }\n    get defaultSchema() {\n        return NestedComponent.schema();\n    }\n    /**\n     * Get the schema for the NestedComponent.\n     * @returns {object} The schema for the NestedComponent.\n     * @override\n     */\n    get schema() {\n        const schema = super.schema;\n        const components = lodash_1.default.uniqBy(this.getComponents(), 'component.key');\n        schema.components = lodash_1.default.map(components, 'schema');\n        return schema;\n    }\n    /**\n     * Get collapsed state.\n     * @returns {boolean} The collapsed state.\n     */\n    get collapsed() {\n        return this._collapsed;\n    }\n    /**\n     * Set collapsed state.\n     * @param {boolean} value - The collapsed state.\n     * @returns {void}\n     */\n    collapse(value) {\n        const promise = this.redraw();\n        if (!value) {\n            this.checkValidity(this.data, !this.pristine);\n        }\n        return promise;\n    }\n    /**\n     * Set collapsed state.\n     * @param {boolean} value - The collapsed state.\n     * @returns {void}\n     */\n    set collapsed(value) {\n        this._collapsed = value;\n        this.collapse(value);\n    }\n    /**\n     * Set visible state of parent and each child component.\n     * @param {boolean} value - The visible state.\n     * @returns {void}\n     */\n    set visible(value) {\n        // DO NOT CALL super here.  There is an issue where clearOnHide was getting triggered with\n        // subcomponents because the \"parentVisible\" flag was set to false when it should really be\n        // set to true.\n        const visibilityChanged = this._visible !== value;\n        this._visible = value;\n        const isVisible = this.visible;\n        const forceShow = this.shouldForceShow();\n        const forceHide = this.shouldForceHide();\n        this.components.forEach((component) => {\n            // Set the parent visibility first since we may have nested components within nested components\n            // and they need to be able to determine their visibility based on the parent visibility.\n            component.parentVisible = isVisible;\n            let visible;\n            if (component.hasCondition()) {\n                visible = !component.conditionallyHidden();\n            }\n            else {\n                visible = !component.component.hidden;\n            }\n            if (forceShow || visible) {\n                component.visible = true;\n            }\n            else if (forceHide || !isVisible || !visible) {\n                component.visible = false;\n            }\n            // If hiding a nested component, clear all errors below.\n            if (!component.visible) {\n                component.error = '';\n            }\n        });\n        if (visibilityChanged) {\n            this.redraw();\n        }\n    }\n    /**\n     * Get visible state.\n     * @returns {boolean} The visible state.\n     */\n    get visible() {\n        return super.visible;\n    }\n    /**\n     * Set parent visibility.\n     * @param {boolean} value - The parent visibility.\n     * @returns {void}\n     */\n    set parentVisible(value) {\n        super.parentVisible = value;\n        this.components.forEach(component => component.parentVisible = this.visible);\n    }\n    /**\n     * Get parent visibility.\n     * @returns {boolean} The parent visibility.\n     */\n    get parentVisible() {\n        return super.parentVisible;\n    }\n    /**\n     * Get the disabled state.\n     * @returns {boolean} - The disabled state.\n     */\n    get disabled() {\n        return super.disabled;\n    }\n    /**\n     * Set the disabled state.\n     * @param {boolean} disabled - The disabled state.\n     */\n    set disabled(disabled) {\n        super.disabled = disabled;\n        this.components.forEach((component) => component.parentDisabled = disabled);\n    }\n    /**\n     * Set parent disabled state.\n     * @param {boolean} value - The parent disabled state.\n     * @returns {void}\n     */\n    set parentDisabled(value) {\n        super.parentDisabled = value;\n        this.components.forEach(component => {\n            component.parentDisabled = this.disabled;\n        });\n    }\n    /**\n     * Get parent disabled state.\n     * @returns {boolean} The parent disabled state.\n     */\n    get parentDisabled() {\n        return super.parentDisabled;\n    }\n    /**\n     * Get ready state from all components.\n     * @returns {Promise<Array>} - The promise that resolves when all components are ready.\n     */\n    get ready() {\n        return Promise.all(this.getComponents().map(component => component.ready));\n    }\n    /**\n     * Get currentForm object.\n     * @returns {object} - The current form object.\n     */\n    get currentForm() {\n        return super.currentForm;\n    }\n    /**\n     * Set currentForm object.\n     * @param {object} instance - The current form object.\n     * @returns {void}\n     */\n    set currentForm(instance) {\n        super.currentForm = instance;\n        this.getComponents().forEach(component => {\n            component.currentForm = instance;\n        });\n    }\n    /**\n     * Get Row Index.\n     * @returns {number} - The row index.\n     */\n    get rowIndex() {\n        return this._rowIndex;\n    }\n    /**\n     * Set Row Index to row and update each component.\n     * @param {number} value - The row index.\n     * @returns {void}\n     */\n    set rowIndex(value) {\n        var _a, _b;\n        this._rowIndex = value;\n        this.paths = utils_1.default.getComponentPaths(this.component, (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component, Object.assign(Object.assign({}, (((_b = this.parent) === null || _b === void 0 ? void 0 : _b.paths) || {})), { dataIndex: value }));\n        this.eachComponent((component) => {\n            component.rowIndex = value;\n        });\n    }\n    /**\n     * Get Contextual data of the component.\n     * @returns {object} - The contextual data of the component.\n     * @override\n     */\n    componentContext() {\n        return this._data;\n    }\n    /**\n     * Get the data of the component.\n     * @returns {object} - The data of the component.\n     * @override\n     */\n    get data() {\n        return this._data;\n    }\n    /**\n     * Set the data of the component.\n     * @param {object} value - The data of the component.\n     * @returns {void}\n     */\n    set data(value) {\n        this._data = value;\n        this.eachComponent((component) => {\n            component.data = this.componentContext(component);\n        });\n    }\n    /**\n     * Get components array.\n     * @returns {Array} - The components array.\n     */\n    getComponents() {\n        return this.components || [];\n    }\n    /**\n     * Perform a deep iteration over every component, including those\n     * within other container based components.\n     * @param {Function} fn - Called for every component.\n     * @param {any} options - The options to include with this everyComponent call.\n     */\n    everyComponent(fn, options = {}) {\n        const components = this.getComponents();\n        lodash_1.default.each(components, (component, index) => {\n            if (fn(component, components, index) === false) {\n                return false;\n            }\n            if (typeof component.everyComponent === 'function') {\n                if (component.everyComponent(fn, options) === false) {\n                    return false;\n                }\n            }\n        });\n    }\n    /**\n     * Check if the component has a component.\n     * @param {import('@formio/core').Component} component - The component to check.\n     * @returns {boolean} - TRUE if the component has a component, FALSE otherwise.\n     */\n    hasComponent(component) {\n        let result = false;\n        this.everyComponent((comp) => {\n            if (comp === component) {\n                result = true;\n                return false;\n            }\n        });\n        return result;\n    }\n    /**\n     * Get the flattened components of this NestedComponent.\n     * @returns {object} - The flattened components of this NestedComponent.\n     */\n    flattenComponents() {\n        const result = {};\n        this.everyComponent((component) => {\n            result[component.component.flattenAs || component.key] = component;\n        });\n        return result;\n    }\n    /**\n     * Perform an iteration over each component within this container component.\n     * @param {Function} fn - Called for each component\n     */\n    eachComponent(fn) {\n        lodash_1.default.each(this.getComponents(), (component, index) => {\n            if (fn(component, index) === false) {\n                return false;\n            }\n        });\n    }\n    /**\n     * Returns a component provided a key. This performs a deep search within the component tree.\n     * @param {string} path - The path to the component.\n     * @returns {any} - The component that is located.\n     */\n    getComponent(path) {\n        var _a;\n        // If the component is found\n        if (!this.componentMatches) {\n            this.componentMatches = {};\n        }\n        if (this.componentMatches && this.componentMatches[path]) {\n            return this.componentMatches[path];\n        }\n        path = utils_1.default.getStringFromComponentPath(path);\n        const matches = {\n            path: undefined,\n            fullPath: undefined,\n            localPath: undefined,\n            fullLocalPath: undefined,\n            dataPath: undefined,\n            localDataPath: undefined,\n            key: undefined,\n        };\n        this.everyComponent((component) => {\n            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;\n            // All searches are relative to this component so replace this path from the child paths.\n            utils_1.default.componentMatches(component.component, {\n                path: (_b = (_a = component.paths) === null || _a === void 0 ? void 0 : _a.path) === null || _b === void 0 ? void 0 : _b.replace(new RegExp(`^${(_c = this.paths) === null || _c === void 0 ? void 0 : _c.path}\\\\.?`), ''),\n                fullPath: (_e = (_d = component.paths) === null || _d === void 0 ? void 0 : _d.fullPath) === null || _e === void 0 ? void 0 : _e.replace(new RegExp(`^${(_f = this.paths) === null || _f === void 0 ? void 0 : _f.fullPath}\\\\.?`), ''),\n                localPath: (_h = (_g = component.paths) === null || _g === void 0 ? void 0 : _g.localPath) === null || _h === void 0 ? void 0 : _h.replace(new RegExp(`^${(_j = this.paths) === null || _j === void 0 ? void 0 : _j.localPath}\\\\.?`), ''),\n                fullLocalPath: (_l = (_k = component.paths) === null || _k === void 0 ? void 0 : _k.fullLocalPath) === null || _l === void 0 ? void 0 : _l.replace(new RegExp(`^${(_m = this.paths) === null || _m === void 0 ? void 0 : _m.fullLocalPath}\\\\.?`), ''),\n                dataPath: (_p = (_o = component.paths) === null || _o === void 0 ? void 0 : _o.dataPath) === null || _p === void 0 ? void 0 : _p.replace(new RegExp(`^${(_q = this.paths) === null || _q === void 0 ? void 0 : _q.dataPath}\\\\.?`), ''),\n                localDataPath: (_s = (_r = component.paths) === null || _r === void 0 ? void 0 : _r.localDataPath) === null || _s === void 0 ? void 0 : _s.replace(new RegExp(`^${(_t = this.paths) === null || _t === void 0 ? void 0 : _t.localDataPath}\\\\.?`), ''),\n            }, path, this.rowIndex, matches, (type, match) => {\n                match.instance = component;\n                return match;\n            });\n        });\n        this.componentMatches[path] = (_a = utils_1.default.getBestMatch(matches)) === null || _a === void 0 ? void 0 : _a.instance;\n        return this.componentMatches[path];\n    }\n    /**\n     * Return a component provided the Id of the component.\n     * @param {string} id - The Id of the component.\n     * @param {Function} fn - Called with the component once it is retrieved.\n     * @returns {object} - The component retrieved.\n     */\n    getComponentById(id, fn = null) {\n        let comp = null;\n        this.everyComponent((component, components) => {\n            if (component.id === id) {\n                comp = component;\n                if (fn) {\n                    fn(component, components);\n                }\n                return false;\n            }\n        });\n        return comp;\n    }\n    /**\n     * Create a new component and add it to the components array.\n     * @param {import('@formio/core').Component} component - The component JSON schema to create.\n     * @param {object} options - The options to create the component with.\n     * @param {import('@formio/core').DataObject} data - The submission data object to house the data for this component.\n     * @param {import('@formio/core').Component} [before] - The component before which to add this component.\n     * @param {import('@formio/core').Component} [replacedComp] - The component to replace with this component.\n     * @returns {any} - The created component instance.\n     */\n    createComponent(component, options, data, before, replacedComp) {\n        if (!component) {\n            return;\n        }\n        options = options || this.options;\n        data = data || this.data;\n        options.parent = this;\n        options.parentVisible = this.visible;\n        options.root = (options === null || options === void 0 ? void 0 : options.root) || this.root || this;\n        options.localRoot = this.localRoot;\n        options.skipInit = true;\n        if (!(options.display === 'pdf' && this.builderMode)) {\n            component.id = utils_1.default.getRandomComponentId();\n        }\n        const comp = Components_1.default.create(component, options, data, true);\n        comp.init();\n        if (component.internal) {\n            return comp;\n        }\n        if (before) {\n            const index = lodash_1.default.findIndex(this.components, { id: before.id });\n            if (index !== -1) {\n                this.components.splice(index, 0, comp);\n            }\n            else {\n                this.components.push(comp);\n            }\n        }\n        else if (replacedComp) {\n            const index = lodash_1.default.findIndex(this.components, { id: replacedComp.id });\n            if (index !== -1) {\n                this.components[index] = comp;\n            }\n            else {\n                this.components.push(comp);\n            }\n        }\n        else {\n            this.components.push(comp);\n        }\n        return comp;\n    }\n    getContainer() {\n        return this.element;\n    }\n    get componentComponents() {\n        return this.component.components || [];\n    }\n    get nestedKey() {\n        return `nested-${this.key}`;\n    }\n    get templateName() {\n        return 'container';\n    }\n    init() {\n        this.components = this.components || [];\n        this.addComponents();\n        return super.init();\n    }\n    /**\n     * Add a new component instance to the components array.\n     * @param {import('@formio/core').DataObject} [data] - The Submission data for this component.\n     * @param {object} [options] - The options for this component.\n     */\n    addComponents(data, options) {\n        data = data || this.data;\n        this.components = this.components || [];\n        options = options || this.options;\n        if (options.components) {\n            this.components = options.components;\n        }\n        else {\n            const components = this.hook('addComponents', this.componentComponents, this) || [];\n            components.forEach((component) => this.addComponent(component, data));\n        }\n    }\n    /**\n     * Add a new component to the components array.\n     * @param {import('@formio/core').Component} component - The component JSON schema to add.\n     * @param {object} data - The submission data object to house the data for this component.\n     * @param {HTMLElement} before - A DOM element to insert this element before.\n     * @param {boolean} [noAdd] - A possibly extraneous boolean flag.\n     * @returns {any} - The created component instance.\n     */\n    addComponent(component, data = null, before = null, noAdd = false) {\n        data = data || this.data;\n        this.components = this.components || [];\n        component = this.hook('addComponent', component, data, before, noAdd);\n        const comp = this.createComponent(component, this.options, data, before ? before : null);\n        if (noAdd) {\n            return comp;\n        }\n        return comp;\n    }\n    beforeFocus() {\n        if (this.parent && 'beforeFocus' in this.parent) {\n            this.parent.beforeFocus(this);\n        }\n    }\n    render(children) {\n        // If already rendering, don't re-render.\n        return super.render(children || this.renderTemplate(this.templateName, {\n            children: !this.visible ? '' : this.renderComponents(),\n            nestedKey: this.nestedKey,\n            collapsed: this.options.pdf ? false : this.collapsed,\n        }));\n    }\n    renderComponents(components) {\n        components = components || this.getComponents();\n        const children = components.map(component => component.render());\n        return this.renderTemplate('components', {\n            children,\n            components,\n        });\n    }\n    attach(element) {\n        const superPromise = super.attach(element);\n        this.loadRefs(element, {\n            header: 'single',\n            collapsed: this.collapsed,\n            [this.nestedKey]: 'single',\n            messageContainer: 'single-scope',\n        });\n        let childPromise = Promise.resolve();\n        if (this.refs[this.nestedKey]) {\n            childPromise = this.attachComponents(this.refs[this.nestedKey]);\n        }\n        if (!this.visible) {\n            this.attachComponentsLogic();\n        }\n        if (this.component.collapsible && this.refs.header) {\n            this.addEventListener(this.refs.header, 'click', () => {\n                this.collapsed = !this.collapsed;\n            });\n            this.addEventListener(this.refs.header, 'keydown', (e) => {\n                if (e.keyCode === 13 || e.keyCode === 32) {\n                    e.preventDefault();\n                    this.collapsed = !this.collapsed;\n                }\n            });\n        }\n        return Promise.all([\n            superPromise,\n            childPromise,\n        ]);\n    }\n    /**\n     * Attach the logic to the components.\n     * @param {import('@formio/core').Component[]} components - The components to attach logic to.\n     */\n    attachComponentsLogic(components) {\n        components = components || this.components;\n        lodash_1.default.each(components, (comp) => {\n            comp.attachLogic();\n            if (lodash_1.default.isFunction(comp.attachComponentsLogic)) {\n                comp.attachComponentsLogic();\n            }\n        });\n    }\n    attachComponents(element, components, container) {\n        components = components || this.components;\n        container = container || this.component.components;\n        element = this.hook('attachComponents', element, components, container, this);\n        if (!element) {\n            // Return a non-resolving promise.\n            return (new Promise(() => { }));\n        }\n        let index = 0;\n        const promises = [];\n        Array.prototype.slice.call(element.children).forEach(child => {\n            if (!child.getAttribute('data-noattach') && components[index]) {\n                promises.push(components[index].attach(child));\n                index++;\n            }\n        });\n        return Promise.all(promises);\n    }\n    /**\n     * Remove a component from the components array and from the children object\n     * @param {import('@formio/core').Component} component - The component to remove from the components.\n     * @param {import('@formio/core').Component[]} components - An array of components to remove this component from.\n     * @param {boolean} [all] - If set to TRUE will cascade remove all components.\n     */\n    removeComponent(component, components, all = false) {\n        var _a, _b;\n        components = components || this.components;\n        component.destroy(all);\n        lodash_1.default.remove(components, { id: component.id });\n        if (this.componentsMap[component.path]) {\n            delete this.componentsMap[component.path];\n        }\n        if ((_a = this.root) === null || _a === void 0 ? void 0 : _a.componentsMap[component.path]) {\n            (_b = this.root) === null || _b === void 0 ? true : delete _b.componentsMap[component.path];\n        }\n    }\n    /**\n     * Removes a component provided the API key of that component.\n     * @param {string} key - The API key of the component to remove.\n     * @param {Function} fn - Called once the component is removed.\n     * @returns {null|void} - Returns nothing if the component is not found.\n     */\n    removeComponentByKey(key, fn = null) {\n        const comp = this.getComponent(key, (component, components) => {\n            this.removeComponent(component, components);\n            if (fn) {\n                fn(component, components);\n            }\n        });\n        if (!comp) {\n            if (fn) {\n                fn(null);\n            }\n            return null;\n        }\n    }\n    /**\n     * Removes a component provided the Id of the component.\n     * @param {string} id - The Id of the component to remove.\n     * @param {Function} fn - Called when the component is removed.\n     * @returns {null|void} - Returns nothing if the component is not found.\n     */\n    removeComponentById(id, fn = null) {\n        const comp = this.getComponentById(id, (component, components) => {\n            this.removeComponent(component, components);\n            if (fn) {\n                fn(component, components);\n            }\n        });\n        if (!comp) {\n            if (fn) {\n                fn(null);\n            }\n            return null;\n        }\n    }\n    updateValue(value, flags = {}) {\n        return this.components.reduce((changed, comp) => {\n            return comp.updateValue(null, flags) || changed;\n        }, super.updateValue(value, flags));\n    }\n    shouldSkipValidation(data, row, flags) {\n        // Nested components with no input should not be validated.\n        if (!this.component.input) {\n            return true;\n        }\n        else {\n            return super.shouldSkipValidation(data, row, flags);\n        }\n    }\n    checkData(data, flags, row, components) {\n        if (this.builderMode) {\n            return true;\n        }\n        data = data || this.rootValue;\n        flags = flags || {};\n        row = row || this.data;\n        components = components && lodash_1.default.isArray(components) ? components : this.getComponents();\n        super.checkData(data, Object.assign({}, flags), row);\n        components.forEach((comp) => comp.checkData(data, Object.assign({}, flags), row));\n    }\n    checkConditions(data, flags, row) {\n        // check conditions of parent component first, because it may influence on visibility of it's children\n        const check = super.checkConditions(data, flags, row);\n        //row data of parent component not always corresponds to row of nested components, use comp.data as row data for children instead\n        this.getComponents().forEach(comp => comp.checkConditions(data, flags, comp.data));\n        return check;\n    }\n    clearOnHide(show) {\n        super.clearOnHide(show);\n        this.getComponents().forEach(component => component.clearOnHide(show));\n    }\n    /**\n     * Allow components to hook into the next page trigger to perform their own logic.\n     * @param {Function} next - The callback to continue to the next page.\n     * @returns {Promise} - A promise when the page has been processed.\n     */\n    beforePage(next) {\n        return Promise.all(this.getComponents().map((comp) => comp.beforePage(next)));\n    }\n    /**\n     * Allow components to hook into the submission to provide their own async data.\n     * @returns {Promise} - Returns a promise when the constituent beforeSubmit functions are complete.\n     */\n    beforeSubmit() {\n        return Promise.allSettled(this.getComponents().map((comp) => comp.beforeSubmit()));\n    }\n    calculateValue(data, flags, row) {\n        // Do not iterate into children and calculateValues if this nested component is conditionally hidden.\n        if (this.conditionallyHidden()) {\n            return false;\n        }\n        return this.getComponents().reduce((changed, comp) => comp.calculateValue(data, flags, row) || changed, super.calculateValue(data, flags, row));\n    }\n    isLastPage() {\n        return this.pages.length - 1 === this.page;\n    }\n    isValid(data, dirty) {\n        return this.getComponents().reduce((valid, comp) => comp.isValid(data, dirty) && valid, super.isValid(data, dirty));\n    }\n    validationProcessor({ scope, data, row, instance, paths }, flags) {\n        var _a;\n        const { dirty } = flags;\n        if (this.root && this.root.hasSubWizards && this.page !== this.root.page) {\n            instance = ((_a = this.componentsMap) === null || _a === void 0 ? void 0 : _a.hasOwnProperty(paths.dataPath))\n                ? this.componentsMap[paths.dataPath]\n                : this.getComponent(paths.dataPath);\n        }\n        if (!instance) {\n            return;\n        }\n        instance.checkComponentValidity(data, dirty, row, flags, scope.errors);\n        if (instance.processOwnValidation) {\n            scope.noRecurse = true;\n        }\n    }\n    /**\n     * Perform a validation on all child components of this nested component.\n     * @param {import('@formio/core').Component[]} components - The components to validate.\n     * @param {import('@formio/core').DataObject} data - The data to validate.\n     * @param {object} flags - The flags to use when validating.\n     * @returns {Promise<Array>|Array} - The errors if any exist.\n     */\n    validateComponents(components = null, data = null, flags = {}) {\n        components = components || this.component.components;\n        data = data || this.rootValue;\n        const { async, dirty, process } = flags;\n        const validationProcessorProcess = (context) => this.validationProcessor(context, flags);\n        const checkModalProcessorProcess = ({ instance, component, components }) => {\n            // If we just validated the last component, and there are errors from our parent, then we need to show a model of those errors.\n            if (instance &&\n                instance.parent &&\n                (component === components[components.length - 1]) &&\n                instance.parent.componentModal) {\n                instance.parent.checkModal(instance.parent.childErrors, dirty);\n            }\n        };\n        const processorContext = {\n            process: process || 'unknown',\n            components,\n            instances: this.componentsMap,\n            data: data,\n            local: !!flags.local,\n            scope: { errors: [] },\n            parent: this.component,\n            parentPaths: this.paths,\n            processors: [\n                {\n                    process: validationProcessorProcess,\n                    processSync: validationProcessorProcess\n                },\n                {\n                    process: checkModalProcessorProcess,\n                    processSync: checkModalProcessorProcess\n                }\n            ]\n        };\n        return async ? (0, process_1.process)(processorContext).then((scope) => scope.errors) : (0, process_1.processSync)(processorContext).errors;\n    }\n    /**\n     * Validate a nested component with data, or its own internal data.\n     * @param {import('@formio/core').DataObject} data - The data to validate.\n     * @param {object} flags - The flags to use when validating.\n     * @returns {Array} - The errors if any exist.\n     */\n    validate(data = null, flags = {}) {\n        data = data || this.rootValue;\n        return this.validateComponents(this.getComponents().map((component) => component.component), data, flags);\n    }\n    checkComponentValidity(data = null, dirty = false, row = null, flags = {}, allErrors = []) {\n        this.childErrors = [];\n        return super.checkComponentValidity(data, dirty, row, flags, allErrors);\n    }\n    /**\n     * Checks the validity of the component.\n     * @param {*} data - The data to check if the component is valid.\n     * @param {boolean} dirty - If the component is dirty.\n     * @param {*} row - The contextual row data for this component.\n     * @param {boolean} silentCheck - If the check should be silent and not set the error messages.\n     * @param {Array<any>} childErrors - An array of all errors that have occured so that it can be appended when another one occurs here.\n     * @returns {boolean} - TRUE if the component is valid.\n     */\n    checkValidity(data = null, dirty = false, row = null, silentCheck = false, childErrors = []) {\n        childErrors.push(...this.validate(data, { dirty, silentCheck }));\n        return this.checkComponentValidity(data, dirty, row, { dirty, silentCheck }, childErrors) && childErrors.length === 0;\n    }\n    checkAsyncValidity(data = null, dirty = false, row = null, silentCheck = false) {\n        return this.ready.then(() => {\n            return this.validate(data, { dirty, silentCheck, async: true }).then((childErrors) => {\n                return this.checkComponentValidity(data, dirty, row, { dirty, silentCheck, async: true }, childErrors).then((valid) => {\n                    return valid && childErrors.length === 0;\n                });\n            });\n        });\n    }\n    setPristine(pristine) {\n        super.setPristine(pristine);\n        this.getComponents().forEach((comp) => comp.setPristine(pristine));\n    }\n    get isPristine() {\n        return this.pristine && this.getComponents().every((c) => c.isPristine);\n    }\n    get isDirty() {\n        return this.dirty && this.getComponents().every((c) => c.isDirty);\n    }\n    detach() {\n        this.components.forEach(component => {\n            component.detach();\n        });\n        super.detach();\n    }\n    clear() {\n        this.components.forEach(component => {\n            component.clear();\n        });\n        super.clear();\n    }\n    destroy(all = false) {\n        this.destroyComponents(all);\n        super.destroy(all);\n    }\n    destroyComponents(all = false) {\n        const components = this.getComponents().slice();\n        components.forEach((comp) => this.removeComponent(comp, this.components, all));\n        this.components = [];\n    }\n    get visibleErrors() {\n        return this.getComponents().reduce((errors, comp) => errors.concat(comp.visibleErrors || []), super.visibleErrors);\n    }\n    get errors() {\n        const thisErrors = super.errors;\n        return this.getComponents()\n            .reduce((errors, comp) => errors.concat(comp.errors || []), thisErrors)\n            .filter(err => err.level !== 'hidden');\n    }\n    getValue() {\n        return this.data;\n    }\n    resetValue() {\n        super.resetValue();\n        this.getComponents().forEach((comp) => comp.resetValue());\n        this.setPristine(true);\n    }\n    get dataReady() {\n        return Promise.all(this.getComponents().map((component) => component.dataReady));\n    }\n    setNestedValue(component, value, flags = {}) {\n        component._data = this.componentContext(component);\n        if (component.type === 'button') {\n            return false;\n        }\n        if (component.type === 'components') {\n            if ((component.tree || component.hasInput) && component.hasValue(value)) {\n                return component.setValue(lodash_1.default.get(value, component.key), flags);\n            }\n            return component.setValue(value, flags);\n        }\n        else if (value && component.hasValue(value)) {\n            return component.setValue(lodash_1.default.get(value, component.key), flags);\n        }\n        else if ((!this.rootPristine || component.visible) && (flags.resetValue || component.shouldAddDefaultValue)) {\n            flags.noValidate = !flags.dirty;\n            flags.resetValue = true;\n            return component.setValue(component.defaultValue, flags);\n        }\n    }\n    setValue(value, flags = {}) {\n        if (!value) {\n            return false;\n        }\n        // If the value is equal to the empty value, then this means we need to reset the values.\n        if (lodash_1.default.isEqual(value, this.emptyValue)) {\n            // TO-DO: For a future major release, we need to investigate removing the need for the\n            // \"resetValue\" flag. This seems like a hack that is no longer necessary and the renderer\n            // may behave more deterministically without it.\n            flags.resetValue = true;\n        }\n        return this.getComponents().reduce((changed, component) => {\n            return this.setNestedValue(component, value, flags, changed) || changed;\n        }, false);\n    }\n    get lazyLoad() {\n        var _a;\n        return (_a = this.component.lazyLoad) !== null && _a !== void 0 ? _a : false;\n    }\n}\nexports[\"default\"] = NestedComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/_classes/nested/NestedComponent.js?");
 
 /***/ }),
 
@@ -5411,7 +5411,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst Formio_1 = __webpack_require__(/*! ../../Formio */ \"./lib/cjs/Formio.js\");\nconst ListComponent_1 = __importDefault(__webpack_require__(/*! ../_classes/list/ListComponent */ \"./lib/cjs/components/_classes/list/ListComponent.js\"));\nconst Input_1 = __importDefault(__webpack_require__(/*! ../_classes/input/Input */ \"./lib/cjs/components/_classes/input/Input.js\"));\nconst Form_1 = __importDefault(__webpack_require__(/*! ../../Form */ \"./lib/cjs/Form.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\");\nconst ChoicesWrapper_1 = __importDefault(__webpack_require__(/*! ../../utils/ChoicesWrapper */ \"./lib/cjs/utils/ChoicesWrapper.js\"));\nclass SelectComponent extends ListComponent_1.default {\n    static schema(...extend) {\n        return ListComponent_1.default.schema({\n            type: 'select',\n            label: 'Select',\n            key: 'select',\n            idPath: 'id',\n            data: {\n                values: [{ label: '', value: '' }],\n                json: '',\n                url: '',\n                resource: '',\n                custom: ''\n            },\n            clearOnRefresh: false,\n            limit: 100,\n            valueProperty: '',\n            lazyLoad: true,\n            filter: '',\n            searchEnabled: true,\n            searchDebounce: 0.3,\n            searchField: '',\n            minSearch: 0,\n            readOnlyValue: false,\n            selectFields: '',\n            selectThreshold: 0.3,\n            uniqueOptions: false,\n            tableView: true,\n            fuseOptions: {\n                include: 'score',\n                threshold: 0.3,\n            },\n            indexeddb: {\n                filter: {}\n            },\n            customOptions: {},\n            useExactSearch: false,\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Select',\n            group: 'basic',\n            icon: 'th-list',\n            weight: 70,\n            documentation: '/userguide/form-building/form-components#select',\n            schema: SelectComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return SelectComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        const numberType = () => ({ type: 'number' });\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { valueComponent(classComp) {\n                const valueComp = Object.assign(Object.assign({}, classComp), { type: 'select' });\n                if ((0, utils_1.isSelectResourceWithObjectValue)(classComp)) {\n                    valueComp.reference = false;\n                    valueComp.onSetItems = `\n            var templateKeys = utils.getItemTemplateKeys(component.template) || [];\n            items = _.map(items || [], i => {\n              var item = {};\n              _.each(templateKeys, k =>  _.set(item, k, _.get(i, k)));\n              return item;\n            })\n          `;\n                }\n                return valueComp;\n            }, dataTypeOperators: {\n                number: ['lessThan', 'greaterThan', 'lessThanOrEqual', 'greaterThanOrEqual'],\n            }, dataTypeValueComponents: {\n                number: {\n                    lessThan: numberType,\n                    greaterThan: numberType,\n                    lessThanOrEqual: numberType,\n                    greaterThanOrEqual: numberType,\n                },\n            } });\n    }\n    static savedValueTypes(schema) {\n        const { boolean, string, number, object, array } = utils_1.componentValueTypes;\n        const { dataType, reference } = schema;\n        const types = (0, utils_1.getComponentSavedTypes)(schema);\n        if (types) {\n            return types;\n        }\n        if (reference) {\n            return [object];\n        }\n        if (dataType === 'object') {\n            return [object, array];\n        }\n        if (utils_1.componentValueTypes[dataType]) {\n            return [utils_1.componentValueTypes[dataType]];\n        }\n        return [boolean, string, number, object, array];\n    }\n    init() {\n        super.init();\n        this.templateData = {};\n        // Trigger an update.\n        let updateArgs = [];\n        const triggerUpdate = lodash_1.default.debounce((...args) => {\n            updateArgs = [];\n            return this.updateItems.apply(this, args);\n        }, 100);\n        this.triggerUpdate = (...args) => {\n            // Make sure we always resolve the previous promise before reassign it\n            if (typeof this.itemsLoadedResolve === 'function') {\n                this.itemsLoadedResolve();\n            }\n            this.itemsLoaded = new Promise((resolve) => {\n                this.itemsLoadedResolve = resolve;\n            });\n            if (args.length) {\n                updateArgs = args;\n            }\n            return triggerUpdate(...updateArgs);\n        };\n        // Keep track of the select options.\n        this.selectOptions = [];\n        if (this.itemsFromUrl) {\n            this.isFromSearch = false;\n            this.searchServerCount = null;\n            this.defaultServerCount = null;\n            this.isScrollLoading = false;\n            this.searchDownloadedResources = [];\n            this.defaultDownloadedResources = [];\n        }\n        // If this component has been activated.//\n        this.activated = false;\n        this.itemsLoaded = new Promise((resolve) => {\n            this.itemsLoadedResolve = resolve;\n        });\n        this.shouldPositionDropdown = this.hasDataGridAncestor();\n        if (this.isHtmlRenderMode()) {\n            this.activate();\n        }\n        // Get the template keys for this select component.\n        this.getTemplateKeys();\n    }\n    get defaultSchema() {\n        return SelectComponent.schema();\n    }\n    get emptyValue() {\n        if (this.component.multiple) {\n            return [];\n        }\n        // if select has JSON data source type, we are defining if empty value would be an object or a string by checking JSON's first item\n        if (this.component.dataSrc === 'json' && this.component.data.json) {\n            const firstItem = this.component.data.json[0];\n            let firstValue;\n            if (this.valueProperty) {\n                firstValue = lodash_1.default.get(firstItem, this.valueProperty);\n            }\n            else {\n                firstValue = firstItem;\n            }\n            if (firstValue && typeof firstValue === 'string') {\n                return '';\n            }\n            else {\n                return {};\n            }\n        }\n        if (this.valueProperty) {\n            return '';\n        }\n        return {};\n    }\n    get valueProperty() {\n        if (this.component.valueProperty) {\n            return this.component.valueProperty;\n        }\n        // Force values datasource to use values without actually setting it on the component settings.\n        if (this.component.dataSrc === 'values') {\n            return 'value';\n        }\n        return '';\n    }\n    get inputInfo() {\n        const info = super.elementInfo();\n        info.type = 'select';\n        info.changeEvent = 'change';\n        return info;\n    }\n    get isSelectResource() {\n        return this.component.dataSrc === 'resource';\n    }\n    get itemsFromUrl() {\n        return this.isSelectResource || this.isSelectURL;\n    }\n    get isInfiniteScrollProvided() {\n        return this.itemsFromUrl;\n    }\n    get shouldDisabled() {\n        return super.shouldDisabled || this.parentDisabled;\n    }\n    get shouldInitialLoad() {\n        if (this.component.widget === 'html5' &&\n            this.isEntireObjectDisplay() &&\n            this.component.searchField &&\n            this.dataValue) {\n            return false;\n        }\n        return super.shouldLoad;\n    }\n    get selectMetadata() {\n        return super.selectData;\n    }\n    get selectData() {\n        return this.selectMetadata || this.component.selectData;\n    }\n    isEntireObjectDisplay() {\n        return this.component.dataSrc === 'resource' && this.valueProperty === 'data';\n    }\n    selectValueAndLabel(data) {\n        const value = this.getOptionValue((this.isEntireObjectDisplay() && !this.itemValue(data)) ? data : this.itemValue(data));\n        return {\n            value,\n            label: this.itemTemplate((this.isEntireObjectDisplay() && !lodash_1.default.isObject(data.data)) ? { data: data } : data, value)\n        };\n    }\n    itemTemplate(data, value) {\n        if (!lodash_1.default.isNumber(data) && lodash_1.default.isEmpty(data)) {\n            return '';\n        }\n        // If they wish to show the value in read only mode, then just return the itemValue here.\n        if (this.options.readOnly && this.component.readOnlyValue) {\n            return this.itemValue(data);\n        }\n        // Perform a fast interpretation if we should not use the template.\n        if (data && !this.component.template) {\n            const itemLabel = data.label || data;\n            const value = (typeof itemLabel === 'string') ? this.t(itemLabel, { _userInput: true }) : itemLabel;\n            return this.sanitize(value, this.shouldSanitizeValue);\n        }\n        // Inside DataTable component won't have dataValue set\n        const shouldUseSelectData = (this.component.multiple && lodash_1.default.isArray(this.dataValue)\n            ? this.dataValue.find((val) => this.normalizeSingleValue(value) === val)\n            : (this.dataValue === this.normalizeSingleValue(value))) || this.inDataTable;\n        if (shouldUseSelectData) {\n            const selectData = this.selectData;\n            if (selectData) {\n                const templateValue = this.component.reference && (value === null || value === void 0 ? void 0 : value._id) ? value._id.toString() : value;\n                if (!this.templateData || !this.templateData[templateValue]) {\n                    this.getOptionTemplate(data, value);\n                }\n                if (this.component.multiple) {\n                    if (selectData[templateValue]) {\n                        data = selectData[templateValue];\n                    }\n                }\n                else {\n                    data = selectData;\n                }\n            }\n        }\n        if (typeof data === 'string' || typeof data === 'number') {\n            return this.sanitize(this.t(data, { _userInput: true }), this.shouldSanitizeValue);\n        }\n        if (Array.isArray(data)) {\n            return data.map((val) => {\n                if (typeof val === 'string' || typeof val === 'number') {\n                    return this.sanitize(this.t(val, { _userInput: true }), this.shouldSanitizeValue);\n                }\n                return val;\n            });\n        }\n        if (data.data) {\n            // checking additional fields in the template for the selected Entire Object option\n            const hasNestedFields = /item\\.data\\.\\w*/g.test(this.component.template);\n            data.data = this.isEntireObjectDisplay() && lodash_1.default.isObject(data.data) && !hasNestedFields\n                ? JSON.stringify(data.data)\n                : data.data;\n        }\n        return super.itemTemplate(data, value);\n    }\n    /**\n     * Adds an option to the select dropdown.\n     * @param {*} value - The value of the new option.\n     * @param {string} label - The label of the new option.\n     * @param {object} [attrs] - Additional value attributes. Defaults to {}.\n     * @param {string} [id] - An id. Defaults to a random string.\n     */\n    addOption(value, label, attrs = {}, id = (0, utils_1.getRandomComponentId)()) {\n        if (lodash_1.default.isNil(label))\n            return;\n        const idPath = this.component.idPath\n            ? this.component.idPath.split('.').reduceRight((obj, key) => ({ [key]: obj }), id)\n            : {};\n        const option = Object.assign({ value: this.getOptionValue(value), label }, idPath);\n        const skipOption = this.component.uniqueOptions\n            ? !!this.selectOptions.find((selectOption) => lodash_1.default.isEqual(selectOption.value, option.value))\n            : false;\n        if (skipOption) {\n            return;\n        }\n        if (value) {\n            this.selectOptions.push(option);\n        }\n        if (this.refs.selectContainer && (this.component.widget === 'html5')) {\n            // Replace an empty Object value to an empty String.\n            if (option.value && lodash_1.default.isObject(option.value) && lodash_1.default.isEmpty(option.value)) {\n                option.value = '';\n            }\n            // Add element to option so we can reference it later.\n            const div = document.createElement('div');\n            div.innerHTML = this.sanitize(this.renderTemplate('selectOption', {\n                selected: lodash_1.default.isEqual(this.getOptionValue(this.dataValue), option.value),\n                option,\n                attrs,\n                id,\n                useId: (this.valueProperty === '' || this.isEntireObjectDisplay()) && lodash_1.default.isObject(value) && id,\n            }), this.shouldSanitizeValue).trim();\n            option.element = div.firstChild;\n            this.refs.selectContainer.appendChild(option.element);\n        }\n    }\n    addValueOptions(items) {\n        items = items || [];\n        let added = false;\n        let data = this.dataValue;\n        // preset submission value with value property before request.\n        if (this.options.pdf && !items.length && this.component.dataSrc === 'url' && this.valueProperty) {\n            data = Array.isArray(data)\n                ? data.map(item => lodash_1.default.set({}, this.valueProperty, item))\n                : lodash_1.default.set({}, this.valueProperty, data);\n        }\n        if (!this.selectOptions.length) {\n            // Add the currently selected choices if they don't already exist.\n            const currentChoices = Array.isArray(data) && this.component.multiple ? data : [data];\n            added = this.addCurrentChoices(currentChoices, items);\n            if (!added && !this.component.multiple) {\n                this.addPlaceholder();\n            }\n        }\n        return added;\n    }\n    disableInfiniteScroll() {\n        if (!this.downloadedResources) {\n            return;\n        }\n        this.downloadedResources.serverCount = this.downloadedResources.length;\n        this.serverCount = this.downloadedResources.length;\n    }\n    shouldResetChoicesItems(items) {\n        if (this.choices._store.choices.length !== items.length) {\n            return true;\n        }\n        for (let item of items) {\n            const choicesItem = this.choices._store.choices.find((i) => i.label === item.label);\n            if (!choicesItem) {\n                return true;\n            }\n        }\n        return false;\n    }\n    /* eslint-disable max-statements */\n    setItems(items, fromSearch) {\n        var _a, _b;\n        this.selectItems = items;\n        // If the items is a string, then parse as JSON.\n        if (typeof items == 'string') {\n            try {\n                items = JSON.parse(items);\n            }\n            catch (err) {\n                console.warn(err.message);\n                items = [];\n            }\n        }\n        // Allow js processing (needed for form builder)\n        if (this.component.onSetItems) {\n            const newItems = typeof this.component.onSetItems === 'function'\n                ? this.component.onSetItems(this, items)\n                : this.evaluate(this.component.onSetItems, { items: items }, 'items');\n            if (newItems) {\n                items = newItems;\n            }\n        }\n        if (!this.choices && this.refs.selectContainer) {\n            this.empty(this.refs.selectContainer);\n        }\n        // If they provided select values, then we need to get them instead.\n        if (this.component.selectValues) {\n            items = lodash_1.default.get(items, this.component.selectValues, items) || [];\n        }\n        let areItemsEqual;\n        if (this.itemsFromUrl) {\n            areItemsEqual = this.isSelectURL ? lodash_1.default.isEqual(items, this.downloadedResources) : false;\n            const areItemsEnded = this.component.limit > items.length;\n            const areItemsDownloaded = areItemsEqual\n                && this.downloadedResources\n                && this.downloadedResources.length === items.length;\n            if (areItemsEnded) {\n                this.disableInfiniteScroll();\n            }\n            else if (areItemsDownloaded) {\n                this.selectOptions = [];\n            }\n            else {\n                this.serverCount = items.serverCount;\n            }\n        }\n        if (this.isScrollLoading && items) {\n            if (!areItemsEqual) {\n                this.downloadedResources = this.downloadedResources\n                    ? this.downloadedResources.concat(items)\n                    : items;\n            }\n            this.downloadedResources.serverCount = items.serverCount || this.downloadedResources.serverCount;\n        }\n        else {\n            this.downloadedResources = items || [];\n            this.selectOptions = [];\n            // If there is new select option with same id as already selected, set the new one\n            if (!lodash_1.default.isEmpty(this.dataValue) && this.component.idPath) {\n                const selectedOptionId = lodash_1.default.get(this.dataValue, this.component.idPath, null);\n                const newOptionWithSameId = !lodash_1.default.isNil(selectedOptionId) && items.find(item => {\n                    const itemId = lodash_1.default.get(item, this.component.idPath);\n                    return itemId === selectedOptionId;\n                });\n                if (newOptionWithSameId) {\n                    this.setValue(newOptionWithSameId);\n                }\n            }\n        }\n        // Add the value options.\n        if (!fromSearch) {\n            this.addValueOptions(items);\n        }\n        if (this.component.widget === 'html5' && !this.component.placeholder) {\n            this.addOption(null, '');\n        }\n        // Iterate through each of the items.\n        lodash_1.default.each(items, (item, index) => {\n            // preventing references of the components inside the form to the parent form when building forms\n            if (this.root && this.root.options.editForm && this.root.options.editForm._id && this.root.options.editForm._id === item._id)\n                return;\n            const itemValueAndLabel = this.selectValueAndLabel(item);\n            this.addOption(itemValueAndLabel.value, itemValueAndLabel.label, {}, lodash_1.default.get(item, this.component.idPath, String(index)));\n        });\n        if (this.choices) {\n            this.choices.setChoices(this.selectOptions, 'value', 'label', true, true, !fromSearch && this.shouldResetChoicesItems(this.selectOptions));\n        }\n        else if (this.loading) {\n            // Re-attach select input.\n            // this.appendTo(this.refs.input[0], this.selectContainer);\n        }\n        // We are no longer loading.\n        this.isScrollLoading = false;\n        this.loading = false;\n        const searching = fromSearch && ((_b = (_a = this.choices) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.isFocussed);\n        if (!searching) {\n            // If a value is provided, then select it.\n            if (!this.isEmpty() || this.isRemoveButtonPressed) {\n                this.setValue(this.dataValue, {\n                    noUpdateEvent: true\n                });\n            }\n            else if (this.shouldAddDefaultValue && !this.options.readOnly) {\n                // If a default value is provided then select it.\n                const defaultValue = this.defaultValue;\n                if (!this.isEmpty(defaultValue)) {\n                    this.setValue(defaultValue);\n                }\n            }\n        }\n        // Say we are done loading the items.\n        this.itemsLoadedResolve();\n    }\n    getSingleItemValueForHTMLMode(data) {\n        var _a;\n        const option = (_a = this.selectOptions) === null || _a === void 0 ? void 0 : _a.find(({ value }) => lodash_1.default.isEqual(value, data));\n        if (option) {\n            return option.label || data;\n        }\n        return data;\n    }\n    itemValueForHTMLMode(value) {\n        if (!this.isHtmlRenderMode()) {\n            return super.itemValueForHTMLMode(value);\n        }\n        if (Array.isArray(value)) {\n            const values = value.map(item => Array.isArray(item)\n                ? this.itemValueForHTMLMode(item)\n                : this.getSingleItemValueForHTMLMode(item));\n            return values.join(', ');\n        }\n        return this.getSingleItemValueForHTMLMode(value);\n    }\n    /* eslint-enable max-statements */\n    get defaultValue() {\n        let defaultValue = super.defaultValue;\n        if (!defaultValue && (this.component.defaultValue === false || this.component.defaultValue === 0)) {\n            defaultValue = this.component.defaultValue;\n        }\n        return defaultValue;\n    }\n    get loadingError() {\n        return !this.component.refreshOn && !this.component.refreshOnBlur && this.networkError;\n    }\n    loadItems(url, search, headers, options, method, body) {\n        options = options || {};\n        // See if we should load items or not.\n        if (!this.shouldLoad || (!this.itemsFromUrl && this.options.readOnly)) {\n            this.isScrollLoading = false;\n            this.loading = false;\n            this.itemsLoadedResolve();\n            return;\n        }\n        // See if they have not met the minimum search requirements.\n        const minSearch = parseInt(this.component.minSearch, 10);\n        if (this.component.searchField &&\n            (minSearch > 0) &&\n            (!search || (search.length < minSearch))) {\n            // Set empty items.\n            return this.setItems([]);\n        }\n        // Ensure we have a method and remove any body if method is get\n        method = method || 'GET';\n        if (method.toUpperCase() === 'GET') {\n            body = null;\n        }\n        const limit = this.component.limit || 100;\n        const skip = this.isScrollLoading ? this.selectOptions.length : 0;\n        const query = this.component.disableLimit ? {} : {\n            limit,\n            skip,\n        };\n        // Allow for url interpolation.\n        url = this.sanitize(this.interpolate(url, {\n            formioBase: Formio_1.Formio.getBaseUrl(),\n            search,\n            limit,\n            skip,\n            page: Math.abs(Math.floor(skip / limit))\n        }), this.shouldSanitizeValue);\n        // Add search capability.\n        if (this.component.searchField && search) {\n            const searchValue = Array.isArray(search)\n                ? search.join(',')\n                : typeof search === 'object'\n                    ? JSON.stringify(search)\n                    : search;\n            query[this.component.searchField] = this.component.searchField.endsWith('__regex')\n                ? lodash_1.default.escapeRegExp(searchValue)\n                : searchValue;\n        }\n        // If they wish to return only some fields.\n        if (this.component.selectFields) {\n            query.select = this.component.selectFields;\n        }\n        // Add sort capability\n        if (this.component.sort) {\n            query.sort = this.component.sort;\n        }\n        if (!lodash_1.default.isEmpty(query)) {\n            // Add the query string.\n            url += (!url.includes('?') ? '?' : '&') + Formio_1.Formio.serialize(query, (item) => this.interpolate(item));\n        }\n        // Add filter capability\n        if (this.component.filter) {\n            url += (!url.includes('?') ? '?' : '&') + this.interpolate(this.component.filter);\n        }\n        // Set ignoreCache if it is\n        options.ignoreCache = this.component.ignoreCache;\n        // Make the request.\n        options.header = headers;\n        this.loading = true;\n        Formio_1.Formio.makeRequest(this.options.formio, 'select', url, method, body, options)\n            .then((response) => {\n            this.loading = false;\n            this.setItems(response, !!search);\n        })\n            .catch((err) => {\n            if (this.itemsFromUrl) {\n                this.setItems([]);\n                this.disableInfiniteScroll();\n            }\n            this.isScrollLoading = false;\n            this.handleLoadingError(err);\n        });\n    }\n    handleLoadingError(err) {\n        this.loading = false;\n        if (err.networkError) {\n            this.networkError = true;\n        }\n        this.itemsLoadedResolve();\n        this.emit('componentError', {\n            component: this.component,\n            message: err.toString(),\n        });\n        console.warn(`Unable to load resources for ${this.key}`);\n    }\n    /**\n     * Get the request headers for this select dropdown.\n     * @returns {*} - Returns the request headers for this select dropdown.\n     */\n    get requestHeaders() {\n        // Create the headers object.\n        const headers = new Formio_1.Formio.Headers();\n        // Add custom headers to the url.\n        if (this.component.data && this.component.data.headers) {\n            try {\n                lodash_1.default.each(this.component.data.headers, (header) => {\n                    if (header.key) {\n                        headers.set(header.key, this.interpolate(header.value));\n                    }\n                });\n            }\n            catch (err) {\n                console.warn(err.message);\n            }\n        }\n        return headers;\n    }\n    getCustomItems() {\n        const customItems = this.evaluate(this.component.data.custom, {\n            values: []\n        }, 'values');\n        this.asyncValues = (0, utils_1.isPromise)(customItems);\n        return customItems;\n    }\n    asyncCustomValues() {\n        if (!lodash_1.default.isBoolean(this.asyncValues)) {\n            this.getCustomItems();\n        }\n        return this.asyncValues;\n    }\n    updateCustomItems(forceUpdate) {\n        if (this.asyncCustomValues()) {\n            if (!forceUpdate && !this.active) {\n                this.itemsLoadedResolve();\n                return;\n            }\n            this.loading = true;\n            this.getCustomItems()\n                .then(items => {\n                this.loading = false;\n                this.setItems(items || []);\n            })\n                .catch(err => {\n                this.handleLoadingError(err);\n            });\n        }\n        else {\n            this.setItems(this.getCustomItems() || []);\n        }\n    }\n    isEmpty(value = this.dataValue) {\n        return super.isEmpty(value) || value === undefined;\n    }\n    refresh(value, { instance }) {\n        if (this.component.clearOnRefresh && (instance && !instance.pristine)) {\n            this.setValue(this.emptyValue);\n        }\n        this.updateItems(null, true);\n    }\n    get additionalResourcesAvailable() {\n        return lodash_1.default.isNil(this.serverCount) || (this.serverCount > this.downloadedResources.length);\n    }\n    get serverCount() {\n        if (this.isFromSearch) {\n            return this.searchServerCount;\n        }\n        return this.defaultServerCount;\n    }\n    set serverCount(value) {\n        if (this.isFromSearch) {\n            this.searchServerCount = value;\n        }\n        else {\n            this.defaultServerCount = value;\n        }\n    }\n    get downloadedResources() {\n        if (this.isFromSearch) {\n            return this.searchDownloadedResources;\n        }\n        return this.defaultDownloadedResources;\n    }\n    set downloadedResources(value) {\n        if (this.isFromSearch) {\n            this.searchDownloadedResources = value;\n        }\n        else {\n            this.defaultDownloadedResources = value;\n        }\n    }\n    addPlaceholder() {\n        if (!this.component.placeholder) {\n            return;\n        }\n        this.addOption('', this.component.placeholder, { placeholder: true });\n    }\n    /**\n     * Activate this select control.\n     */\n    activate() {\n        if (this.loading || !this.active) {\n            this.setLoadingItem();\n        }\n        if (this.active) {\n            return;\n        }\n        this.activated = true;\n        this.triggerUpdate();\n    }\n    setLoadingItem(addToCurrentList = false) {\n        if (this.choices) {\n            if (addToCurrentList) {\n                this.choices.setChoices([{\n                        value: `${this.id}-loading`,\n                        label: 'Loading...',\n                        disabled: true,\n                    }], 'value', 'label');\n            }\n            else {\n                this.choices.setChoices([{\n                        value: '',\n                        label: `<i class=\"${this.iconClass('refresh')}\" style=\"font-size:1.3em;\"></i>`,\n                        disabled: true,\n                    }], 'value', 'label', true);\n            }\n        }\n        else if (this.component.dataSrc === 'url' || this.component.dataSrc === 'resource') {\n            this.addOption('', this.t('loading...'));\n        }\n    }\n    get active() {\n        return !this.component.lazyLoad || this.activated;\n    }\n    render() {\n        const info = this.inputInfo;\n        info.attr = info.attr || {};\n        info.multiple = this.component.multiple;\n        return super.render(this.wrapElement(this.renderTemplate('select', {\n            input: info,\n            selectOptions: '',\n            index: null,\n        })));\n    }\n    wrapElement(element) {\n        return this.component.addResource && !this.options.readOnly\n            ? (this.renderTemplate('resourceAdd', {\n                element\n            }))\n            : element;\n    }\n    choicesOptions() {\n        const useSearch = this.component.hasOwnProperty('searchEnabled') ? this.component.searchEnabled : true;\n        const placeholderValue = this.t(this.component.placeholder, { _userInput: true });\n        let customOptions = this.component.customOptions || {};\n        if (typeof customOptions == 'string') {\n            try {\n                customOptions = JSON.parse(customOptions);\n            }\n            catch (err) {\n                console.warn(err.message);\n                customOptions = {};\n            }\n        }\n        const commonFuseOptions = {\n            maxPatternLength: 1000,\n            distance: 1000,\n        };\n        return Object.assign({ removeItemButton: this.component.disabled ? false : lodash_1.default.get(this.component, 'removeItemButton', true), itemSelectText: '', classNames: {\n                containerOuter: ['choices', 'form-group', 'formio-choices'],\n                containerInner: this.transform('class', 'form-control ui fluid selection dropdown').split(' '),\n            }, addItemText: false, allowHTML: true, placeholder: !!this.component.placeholder, placeholderValue: placeholderValue, noResultsText: this.t('No results found'), noChoicesText: this.t('No choices to choose from'), searchPlaceholderValue: this.t('Type to search'), shouldSort: false, position: (this.component.dropdown || 'auto'), searchEnabled: useSearch, searchChoices: !this.component.searchField, searchFields: lodash_1.default.get(this, 'component.searchFields', ['label']), shadowRoot: this.root ? this.root.shadowRoot : null, fuseOptions: this.component.useExactSearch\n                ? Object.assign({ tokenize: true, matchAllTokens: true }, commonFuseOptions) : Object.assign({}, lodash_1.default.get(this, 'component.fuseOptions', {}), Object.assign({ include: 'score', threshold: lodash_1.default.get(this, 'component.selectThreshold', 0.3) }, commonFuseOptions)), valueComparer: lodash_1.default.isEqual, resetScrollPosition: false, duplicateItemsAllowed: false }, customOptions);\n    }\n    /* eslint-disable max-statements */\n    attach(element) {\n        var _a, _b, _c;\n        const superAttach = super.attach(element);\n        this.loadRefs(element, {\n            selectContainer: 'single',\n            addResource: 'single',\n            autocompleteInput: 'single'\n        });\n        //enable autocomplete for select\n        const autocompleteInput = this.refs.autocompleteInput;\n        if (autocompleteInput) {\n            this.addEventListener(autocompleteInput, 'change', (event) => {\n                this.setValue(event.target.value);\n            });\n        }\n        const input = this.refs.selectContainer;\n        if (!input) {\n            return;\n        }\n        this.addEventListener(input, this.inputInfo.changeEvent, () => this.updateValue(null, {\n            modified: true\n        }));\n        this.attachRefreshOnBlur();\n        if (this.component.widget === 'html5') {\n            this.addFocusBlurEvents(input);\n            this.triggerUpdate(null, true);\n            if (this.visible) {\n                this.setItems(this.selectItems || []);\n            }\n            this.focusableElement = input;\n            if (this.component.dataSrc === 'custom') {\n                this.addEventListener(input, 'focus', () => this.updateCustomItems());\n            }\n            this.addEventListener(input, 'keydown', (event) => {\n                const { key } = event;\n                if (['Backspace', 'Delete'].includes(key)) {\n                    this.setValue(this.emptyValue);\n                }\n            });\n            return;\n        }\n        const tabIndex = input.tabIndex;\n        this.addPlaceholder();\n        if (this.i18next) {\n            input.setAttribute('dir', this.i18next.dir());\n        }\n        if ((_c = (_b = (_a = this.choices) === null || _a === void 0 ? void 0 : _a.containerOuter) === null || _b === void 0 ? void 0 : _b.element) === null || _c === void 0 ? void 0 : _c.parentNode) {\n            this.choices.destroy();\n        }\n        const choicesOptions = this.choicesOptions();\n        if (ChoicesWrapper_1.default) {\n            this.choices = new ChoicesWrapper_1.default(input, choicesOptions);\n            if (this.selectOptions && this.selectOptions.length) {\n                this.choices.setChoices(this.selectOptions, 'value', 'label', true);\n            }\n            if (this.component.multiple) {\n                this.focusableElement = this.choices.input.element;\n            }\n            else {\n                this.focusableElement = this.choices.containerInner.element;\n                this.choices.containerOuter.element.setAttribute('tabIndex', '-1');\n                this.addEventListener(this.choices.containerOuter.element, 'focus', () => this.focusableElement.focus());\n            }\n            Input_1.default.prototype.addFocusBlurEvents.call(this, this.focusableElement);\n            if (this.itemsFromUrl && !this.component.noRefreshOnScroll) {\n                this.scrollList = this.choices.choiceList.element;\n                this.addEventListener(this.scrollList, 'scroll', () => this.onScroll());\n            }\n            if (choicesOptions.removeItemButton) {\n                this.addEventListener(input, 'removeItem', () => {\n                    this.isRemoveButtonPressed = true;\n                });\n            }\n        }\n        if (window && this.choices && this.shouldPositionDropdown) {\n            this.addEventListener(window.document, 'scroll', () => {\n                this.positionDropdown(true);\n            }, false, true);\n        }\n        this.focusableElement.setAttribute('tabIndex', tabIndex);\n        // If a search field is provided, then add an event listener to update items on search.\n        if (this.component.searchField) {\n            // Make sure to clear the search when no value is provided.\n            if (this.choices && this.choices.input && this.choices.input.element) {\n                this.addEventListener(this.choices.input.element, 'input', (event) => {\n                    this.isFromSearch = !!event.target.value;\n                    if (!event.target.value) {\n                        this.triggerUpdate();\n                    }\n                    else {\n                        this.serverCount = null;\n                        this.downloadedResources = [];\n                    }\n                });\n            }\n            this.addEventListener(input, 'choice', () => {\n                if (this.component.multiple && this.component.dataSrc === 'resource' && this.isFromSearch) {\n                    this.triggerUpdate();\n                }\n                this.isFromSearch = false;\n            });\n            // avoid spamming the resource/url endpoint when we have server side filtering enabled.\n            const debounceTimeout = this.component.searchField && (this.isSelectResource || this.isSelectURL) ?\n                (this.component.searchDebounce === 0 ? 0 : this.component.searchDebounce || this.defaultSchema.searchDebounce) * 1000\n                : 0;\n            const updateComponent = (evt) => {\n                this.triggerUpdate(evt.detail.value);\n            };\n            this.addEventListener(input, 'search', lodash_1.default.debounce((e) => {\n                updateComponent(e);\n                this.positionDropdown();\n            }, debounceTimeout));\n            this.addEventListener(input, 'stopSearch', () => this.triggerUpdate());\n            this.addEventListener(input, 'hideDropdown', () => {\n                if (this.choices && this.choices.input && this.choices.input.element) {\n                    this.choices.input.element.value = '';\n                }\n                this.updateItems(null, true);\n            });\n        }\n        this.addEventListener(input, 'showDropdown', () => {\n            this.update();\n            this.positionDropdown();\n        });\n        if (this.shouldPositionDropdown) {\n            this.addEventListener(input, 'highlightChoice', () => {\n                this.positionDropdown();\n            });\n        }\n        // Add value options.\n        this.addValueOptions();\n        this.setChoicesValue(this.dataValue);\n        if (this.isSelectResource && this.refs.addResource) {\n            this.addEventListener(this.refs.addResource, 'click', (event) => {\n                event.preventDefault();\n                const formioForm = this.ce('div');\n                const dialog = this.createModal(formioForm);\n                const projectUrl = lodash_1.default.get(this.root, 'formio.projectUrl', Formio_1.Formio.getProjectUrl());\n                const formUrl = `${projectUrl}/form/${this.component.data.resource}`;\n                new Form_1.default(formioForm, formUrl, {}).ready\n                    .then((form) => {\n                    form.on('submit', (submission) => {\n                        // If valueProperty is set, replace the submission with the corresponding value\n                        let value = this.valueProperty ? lodash_1.default.get(submission, this.valueProperty) : submission;\n                        if (this.component.multiple) {\n                            value = [...this.dataValue, value];\n                        }\n                        this.setValue(value);\n                        this.triggerUpdate();\n                        dialog.close();\n                    });\n                });\n            });\n        }\n        // Force the disabled state with getters and setters.\n        this.disabled = this.shouldDisabled;\n        this.triggerUpdate();\n        return superAttach;\n    }\n    setDropdownPosition() {\n        var _a, _b, _c, _d;\n        const dropdown = (_b = (_a = this.choices) === null || _a === void 0 ? void 0 : _a.dropdown) === null || _b === void 0 ? void 0 : _b.element;\n        const container = (_d = (_c = this.choices) === null || _c === void 0 ? void 0 : _c.containerOuter) === null || _d === void 0 ? void 0 : _d.element;\n        if (!dropdown || !container) {\n            return;\n        }\n        const containerPosition = container.getBoundingClientRect();\n        const isFlipped = container.classList.contains('is-flipped');\n        lodash_1.default.assign(dropdown.style, {\n            top: `${isFlipped ? containerPosition.top - dropdown.offsetHeight : containerPosition.top + containerPosition.height}px`,\n            left: `${containerPosition.left}px`,\n            width: `${containerPosition.width}px`,\n            position: 'fixed',\n            bottom: 'unset',\n            right: 'unset',\n        });\n    }\n    hasDataGridAncestor(comp) {\n        comp = comp || this;\n        if (comp.inDataGrid || comp.type === 'datagrid') {\n            return true;\n        }\n        else if (comp.parent) {\n            return this.hasDataGridAncestor(comp.parent);\n        }\n        else {\n            return false;\n        }\n    }\n    positionDropdown(scroll) {\n        var _a;\n        if (!this.shouldPositionDropdown || !this.choices || (!((_a = this.choices.dropdown) === null || _a === void 0 ? void 0 : _a.isActive) && scroll)) {\n            return;\n        }\n        this.setDropdownPosition();\n        this.itemsLoaded.then(() => {\n            this.setDropdownPosition();\n        });\n    }\n    get isLoadingAvailable() {\n        return !this.isScrollLoading && this.additionalResourcesAvailable;\n    }\n    onScroll() {\n        if (this.isLoadingAvailable) {\n            this.isScrollLoading = true;\n            this.setLoadingItem(true);\n            this.triggerUpdate(this.choices.input.element.value);\n        }\n    }\n    attachRefreshOnBlur() {\n        if (this.component.refreshOnBlur) {\n            this.on('blur', (instance) => {\n                this.checkRefreshOn([{ instance, value: instance.dataValue }], { fromBlur: true });\n            });\n        }\n    }\n    /* eslint-enable max-statements */\n    update() {\n        if (this.component.dataSrc === 'custom') {\n            this.updateCustomItems();\n        }\n        // Activate the control.\n        this.activate();\n    }\n    set disabled(disabled) {\n        super.disabled = disabled;\n        if (!this.choices) {\n            return;\n        }\n        if (disabled) {\n            this.setDisabled(this.choices.containerInner.element, true);\n            this.focusableElement.removeAttribute('tabIndex');\n            this.choices.disable();\n        }\n        else {\n            this.setDisabled(this.choices.containerInner.element, false);\n            this.focusableElement.setAttribute('tabIndex', this.component.tabindex || 0);\n            this.choices.enable();\n        }\n    }\n    get disabled() {\n        return super.disabled;\n    }\n    set visible(value) {\n        // If we go from hidden to visible, trigger a refresh.\n        if (value && (!this._visible !== !value)) {\n            this.triggerUpdate();\n        }\n        super.visible = value;\n    }\n    get visible() {\n        return super.visible;\n    }\n    addCurrentChoices(values, items, keyValue) {\n        if (!values) {\n            return false;\n        }\n        const notFoundValuesToAdd = [];\n        const added = values.reduce((defaultAdded, value) => {\n            if (!value || lodash_1.default.isEmpty(value)) {\n                return defaultAdded;\n            }\n            let found = false;\n            // Make sure that `items` and `this.selectOptions` points\n            // to the same reference. Because `this.selectOptions` is\n            // internal property and all items are populated by\n            // `this.addOption` method, we assume that items has\n            // 'label' and 'value' properties. This assumption allows\n            // us to read correct value from the item.\n            const isSelectOptions = items === this.selectOptions;\n            if (items && items.length) {\n                lodash_1.default.each(items, (choice) => {\n                    if (choice._id && value._id && (choice._id === value._id)) {\n                        found = true;\n                        return false;\n                    }\n                    const itemValue = keyValue ? choice.value : this.itemValue(choice, isSelectOptions);\n                    found |= lodash_1.default.isEqual(itemValue, value);\n                    return found ? false : true;\n                });\n            }\n            // Add the default option if no item is found.\n            if (!found) {\n                notFoundValuesToAdd.push(this.selectValueAndLabel(value));\n                return true;\n            }\n            return found || defaultAdded;\n        }, false);\n        if (notFoundValuesToAdd.length) {\n            if (this.choices) {\n                this.choices.setChoices(notFoundValuesToAdd, 'value', 'label');\n            }\n            notFoundValuesToAdd.map(notFoundValue => {\n                this.addOption(notFoundValue.value, notFoundValue.label);\n            });\n        }\n        return added;\n    }\n    getValueAsString(data, options) {\n        return (this.component.multiple && Array.isArray(data))\n            ? data.map((v) => this.asString(v, options)).join(', ')\n            : this.asString(data, options);\n    }\n    getValue() {\n        // If the widget isn't active.\n        if (this.viewOnly || this.loading\n            || (!this.component.lazyLoad && !this.selectOptions.length)\n            || !this.element) {\n            return this.dataValue;\n        }\n        let value = this.emptyValue;\n        if (this.choices) {\n            value = this.choices.getValue(true);\n            // Make sure we don't get the placeholder\n            if (!this.component.multiple &&\n                this.component.placeholder &&\n                (value === this.t(this.component.placeholder, { _userInput: true }))) {\n                value = this.emptyValue;\n            }\n        }\n        else if (this.refs.selectContainer) {\n            value = this.refs.selectContainer.value;\n            if (this.valueProperty === '' || this.isEntireObjectDisplay()) {\n                if (value === '') {\n                    return {};\n                }\n                const option = this.selectOptions[value] ||\n                    this.selectOptions.find(option => option.id === value);\n                if (option && lodash_1.default.isObject(option.value)) {\n                    value = option.value;\n                }\n            }\n        }\n        else {\n            value = this.dataValue;\n        }\n        // Choices will return undefined if nothing is selected. We really want '' to be empty.\n        if (value === undefined || value === null) {\n            value = '';\n        }\n        return value;\n    }\n    redraw() {\n        const done = super.redraw();\n        this.triggerUpdate();\n        return done;\n    }\n    normalizeSingleValue(value) {\n        if (lodash_1.default.isNil(value)) {\n            return;\n        }\n        const valueIsObject = lodash_1.default.isObject(value);\n        //check if value equals to default emptyValue\n        if (valueIsObject && Object.keys(value).length === 0) {\n            return value;\n        }\n        const dataType = this.component.dataType || 'auto';\n        const normalize = {\n            value,\n            number() {\n                const numberValue = Number(this.value);\n                const isEquivalent = value.toString() === numberValue.toString();\n                if (!Number.isNaN(numberValue) && Number.isFinite(numberValue) && value !== '' && isEquivalent) {\n                    this.value = numberValue;\n                }\n                return this;\n            },\n            boolean() {\n                if (lodash_1.default.isString(this.value)\n                    && (this.value.toLowerCase() === 'true'\n                        || this.value.toLowerCase() === 'false')) {\n                    this.value = (this.value.toLowerCase() === 'true');\n                }\n                return this;\n            },\n            string() {\n                this.value = String(this.value);\n                return this;\n            },\n            object() {\n                return this;\n            },\n            auto() {\n                if (lodash_1.default.isObject(this.value)) {\n                    this.value = this.object().value;\n                }\n                else {\n                    this.value = this.string().number().boolean().value;\n                }\n                return this;\n            }\n        };\n        try {\n            return normalize[dataType]().value;\n        }\n        catch (err) {\n            console.warn('Failed to normalize value', err);\n            return value;\n        }\n    }\n    /**\n     * Normalize values coming into updateValue. For example, depending on the configuration, string value `\"true\"` will be normalized to boolean `true`.\n     * @param {*} value - The value to normalize\n     * @returns {*} - Returns the normalized value\n     */\n    normalizeValue(value) {\n        if (this.component.multiple && Array.isArray(value)) {\n            return value.map((singleValue) => this.normalizeSingleValue(singleValue));\n        }\n        return super.normalizeValue(this.normalizeSingleValue(value));\n    }\n    setMetadata(value, flags = {}) {\n        var _a, _b;\n        if (lodash_1.default.isNil(value)) {\n            return;\n        }\n        const valueIsObject = lodash_1.default.isObject(value);\n        //check if value equals to default emptyValue\n        if (valueIsObject && Object.keys(value).length === 0) {\n            return value;\n        }\n        // Check to see if we need to save off the template data into our metadata.\n        const templateValue = this.component.reference && (value === null || value === void 0 ? void 0 : value._id) ? value._id.toString() : value;\n        const shouldSaveData = (!valueIsObject || this.component.reference) && !this.inDataTable;\n        if (!lodash_1.default.isNil(templateValue) && shouldSaveData && this.templateData && this.templateData[templateValue] && ((_a = this.root) === null || _a === void 0 ? void 0 : _a.submission)) {\n            const submission = this.root.submission;\n            if (!submission.metadata) {\n                submission.metadata = {};\n            }\n            if (!submission.metadata.selectData) {\n                submission.metadata.selectData = {};\n            }\n            let templateData = this.templateData[templateValue];\n            if (this.component.multiple) {\n                templateData = {};\n                const dataValue = this.dataValue;\n                if (dataValue && lodash_1.default.isArray(dataValue) && dataValue.length) {\n                    dataValue.forEach((dataValueItem) => {\n                        const dataValueItemValue = this.component.reference ? dataValueItem._id.toString() : dataValueItem;\n                        templateData[dataValueItemValue] = this.templateData[dataValueItemValue];\n                    });\n                }\n                templateData[value] = this.templateData[value];\n            }\n            lodash_1.default.set(submission.metadata.selectData, this.path, templateData);\n        }\n        if (flags.resetValue && ((_b = this.root) === null || _b === void 0 ? void 0 : _b.submission) && !this.options.readOnly) {\n            const submission = this.root.submission;\n            if (!submission.metadata) {\n                submission.metadata = {};\n            }\n            submission.metadata.selectData = {};\n        }\n    }\n    updateValue(value, flags) {\n        const changed = super.updateValue(value, flags);\n        if (changed || !this.selectMetadata || flags.resetValue) {\n            if (this.component.multiple && Array.isArray(this.dataValue)) {\n                this.dataValue.forEach(singleValue => this.setMetadata(singleValue, flags));\n            }\n            else {\n                this.setMetadata(this.dataValue, flags);\n            }\n        }\n        return changed;\n    }\n    undoValueTyping(value) {\n        let untypedValue = value;\n        if (this.component.multiple && Array.isArray(value)) {\n            untypedValue = value.map(v => {\n                if (typeof v === 'boolean' || typeof v === 'number') {\n                    return v.toString();\n                }\n                return v;\n            });\n        }\n        else {\n            if (typeof value === 'boolean' || typeof value === 'number') {\n                untypedValue = value.toString();\n            }\n        }\n        return untypedValue;\n    }\n    setValue(value, flags = {}) {\n        const previousValue = this.dataValue;\n        const changed = this.updateValue(value, flags);\n        if (this.component.widget === 'html5' && (lodash_1.default.isEqual(value, previousValue) || lodash_1.default.isEqual(previousValue, {}) && lodash_1.default.isEqual(flags, {})) && !flags.fromSubmission) {\n            return false;\n        }\n        value = this.dataValue;\n        const hasPreviousValue = !this.isEmpty(previousValue);\n        const hasValue = !this.isEmpty(value);\n        // Undo typing when searching to set the value.\n        value = this.undoValueTyping(value);\n        if (this.isHtmlRenderMode() && flags && flags.fromSubmission && changed) {\n            this.itemsLoaded.then(() => {\n                this.redraw();\n            });\n            return changed;\n        }\n        // Do not set the value if we are loading... that will happen after it is done.\n        if (this.loading) {\n            return changed;\n        }\n        // Determine if we need to perform an initial lazyLoad api call if searchField is provided.\n        if (this.isInitApiCallNeeded(hasValue)) {\n            this.loading = true;\n            this.lazyLoadInit = true;\n            const searchProperty = this.component.searchField || this.component.valueProperty;\n            this.triggerUpdate(lodash_1.default.get(value.data || value, searchProperty, value), true);\n            return changed;\n        }\n        // Add the value options.\n        this.itemsLoaded.then(() => {\n            this.addValueOptions();\n            this.setChoicesValue(value, hasPreviousValue, flags);\n        });\n        return changed;\n    }\n    isInitApiCallNeeded(hasValue) {\n        return this.component.lazyLoad &&\n            !this.lazyLoadInit &&\n            !this.active &&\n            !this.selectOptions.length &&\n            hasValue &&\n            this.shouldInitialLoad &&\n            this.visible && (this.component.searchField || this.component.valueProperty);\n    }\n    setChoicesValue(value, hasPreviousValue, flags = {}) {\n        const hasValue = !this.isEmpty(value) || flags.fromSubmission;\n        hasPreviousValue = (hasPreviousValue === undefined) ? true : hasPreviousValue;\n        if (this.choices) {\n            // Now set the value.\n            if (hasValue) {\n                this.choices.removeActiveItems();\n                // Add the currently selected choices if they don't already exist.\n                const currentChoices = Array.isArray(value) && this.component.multiple ? value : [value];\n                if (!this.addCurrentChoices(currentChoices, this.selectOptions, true)) {\n                    this.choices.setChoices(this.selectOptions, 'value', 'label', true);\n                }\n                this.choices.setChoiceByValue(currentChoices);\n            }\n            else if (hasPreviousValue || flags.resetValue) {\n                this.choices.removeActiveItems();\n            }\n        }\n        else {\n            if (hasValue) {\n                const values = Array.isArray(value) ? value : [value];\n                if (!lodash_1.default.isEqual(this.dataValue, this.defaultValue) && this.selectOptions.length < 2\n                    || (this.selectData && flags.fromSubmission)) {\n                    const { value, label } = this.selectValueAndLabel(this.dataValue);\n                    this.addOption(value, label);\n                }\n                lodash_1.default.each(this.selectOptions, (selectOption) => {\n                    lodash_1.default.each(values, (val) => {\n                        if (selectOption.value === '') {\n                            selectOption.value = {};\n                        }\n                        if (lodash_1.default.isEqual(val, selectOption.value) && selectOption.element) {\n                            selectOption.element.selected = true;\n                            selectOption.element.setAttribute('selected', 'selected');\n                            return false;\n                        }\n                    });\n                });\n            }\n            else {\n                lodash_1.default.each(this.selectOptions, (selectOption) => {\n                    if (selectOption.element) {\n                        selectOption.element.selected = false;\n                        selectOption.element.removeAttribute('selected');\n                    }\n                });\n            }\n        }\n    }\n    validateValueAvailability(setting, value) {\n        if (!(0, utils_1.boolValue)(setting) || !value) {\n            return true;\n        }\n        const values = this.getOptionsValues();\n        if (values) {\n            if (lodash_1.default.isObject(value)) {\n                const compareComplexValues = (optionValue) => {\n                    const normalizedOptionValue = this.normalizeSingleValue(optionValue);\n                    if (!lodash_1.default.isObject(normalizedOptionValue)) {\n                        return false;\n                    }\n                    try {\n                        return (JSON.stringify(normalizedOptionValue) === JSON.stringify(value));\n                    }\n                    catch (err) {\n                        console.warn.error('Error while comparing items', err);\n                        return false;\n                    }\n                };\n                return values.findIndex((optionValue) => compareComplexValues(optionValue)) !== -1;\n            }\n            return values.findIndex((optionValue) => this.normalizeSingleValue(optionValue) === value) !== -1;\n        }\n        return false;\n    }\n    /**\n     * Performs required transformations on the initial value to use in selectOptions\n     * @param {*} value - The value to transform.\n     * @returns {*} - Returns the options value.\n     */\n    getOptionValue(value) {\n        return lodash_1.default.isObject(value) && this.isEntireObjectDisplay()\n            ? this.normalizeSingleValue(value)\n            : lodash_1.default.isObject(value) && (this.valueProperty || this.component.key !== 'resource')\n                ? value\n                : lodash_1.default.isObject(value) && !this.valueProperty\n                    ? this.interpolate(this.component.template, { item: value }).replace(/<\\/?[^>]+(>|$)/g, '')\n                    : lodash_1.default.isNull(value)\n                        ? this.emptyValue\n                        : String(this.normalizeSingleValue(value));\n    }\n    /**\n     * If component has static values (values, json) or custom values, returns an array of them\n     * @returns {Array<*>|undefined} - Returns an array of the static or custom values.\n     */\n    getOptionsValues() {\n        let rawItems = [];\n        switch (this.component.dataSrc) {\n            case 'values':\n                rawItems = this.component.data.values;\n                break;\n            case 'json':\n                rawItems = this.component.data.json;\n                break;\n            case 'custom':\n                rawItems = this.getCustomItems();\n                break;\n            case 'url':\n                rawItems = this.selectItems;\n                break;\n        }\n        if (typeof rawItems === 'string') {\n            try {\n                rawItems = JSON.parse(rawItems);\n            }\n            catch (err) {\n                console.warn(err.message);\n                rawItems = [];\n            }\n        }\n        if (!Array.isArray(rawItems)) {\n            return;\n        }\n        return rawItems.map((item) => this.getOptionValue(this.itemValue(item)));\n    }\n    /**\n     * Deletes the value of the component.\n     */\n    deleteValue() {\n        this.setValue('', {\n            noUpdateEvent: true\n        });\n        this.unset();\n    }\n    /**\n     * Check if a component is eligible for multiple validation\n     * @returns {boolean} - Returns FALSE for select components.\n     */\n    validateMultiple() {\n        // Select component will contain one input when flagged as multiple.\n        return false;\n    }\n    /**\n     * Output this select dropdown as a string value.\n     * @returns {*}\n     */\n    isBooleanOrNumber(value) {\n        return typeof value === 'number' || typeof value === 'boolean';\n    }\n    getNormalizedValues() {\n        if (!this.component || !this.component.data || !this.component.data.values) {\n            return;\n        }\n        return this.component.data.values.map(value => ({ label: value.label, value: String(this.normalizeSingleValue(value.value)) }));\n    }\n    asString(value, options = {}) {\n        var _a;\n        value = value !== null && value !== void 0 ? value : this.getValue();\n        if (options.modalPreview || this.inDataTable) {\n            if (this.inDataTable) {\n                value = this.undoValueTyping(value);\n            }\n            const templateValue = (this.isEntireObjectDisplay() && !lodash_1.default.isObject(value.data)) ? { data: value } : value;\n            const template = this.itemTemplate(templateValue, value, options);\n            return template;\n        }\n        //need to convert values to strings to be able to compare values with available options that are strings\n        const convertToString = (data, valueProperty) => {\n            if (valueProperty) {\n                if (Array.isArray(data)) {\n                    data.forEach((item) => item[valueProperty] = item[valueProperty].toString());\n                }\n                else if (lodash_1.default.isObject(data)) {\n                    data[valueProperty] = data[valueProperty].toString();\n                }\n                return data;\n            }\n            if (this.isBooleanOrNumber(data)) {\n                data = data.toString();\n            }\n            if (Array.isArray(data) && data.some(item => this.isBooleanOrNumber(item))) {\n                data = data.map(item => this.isBooleanOrNumber(item) ? item.toString() : item);\n            }\n            return data;\n        };\n        value = convertToString(value);\n        if (['values', 'custom'].includes(this.component.dataSrc) && !this.asyncCustomValues()) {\n            const { items, valueProperty, } = this.component.dataSrc === 'values'\n                ? {\n                    items: convertToString(this.getNormalizedValues(), 'value'),\n                    valueProperty: 'value',\n                }\n                : {\n                    items: convertToString(this.getCustomItems(), this.valueProperty),\n                    valueProperty: this.valueProperty,\n                };\n            const getFromValues = () => {\n                const initialValue = lodash_1.default.find(items, [valueProperty, value]);\n                const values = this.defaultSchema.data.values || [];\n                return lodash_1.default.isEqual(initialValue, values[0]) ? '-' : initialValue;\n            };\n            value = (this.component.multiple && Array.isArray(value))\n                ? lodash_1.default.filter(items, (item) => value.includes(item.value))\n                : (valueProperty && items)\n                    ? (_a = getFromValues()) !== null && _a !== void 0 ? _a : { value, label: value }\n                    : value;\n        }\n        if (lodash_1.default.isString(value)) {\n            return value;\n        }\n        const getTemplateValue = (v) => {\n            const itemTemplate = this.itemTemplate(v);\n            return options.csv && itemTemplate\n                ? (0, utils_1.removeHTML)(itemTemplate)\n                : itemTemplate;\n        };\n        if (Array.isArray(value)) {\n            const items = [];\n            value.forEach(item => items.push(getTemplateValue(item)));\n            if (this.component.dataSrc === 'resource' && items.length > 0) {\n                return items.join(', ');\n            }\n            else if (items.length > 0) {\n                return items.join('<br />');\n            }\n            else {\n                return '-';\n            }\n        }\n        if (this.isEntireObjectDisplay() && lodash_1.default.isObject(value)) {\n            return JSON.stringify(value);\n        }\n        return !lodash_1.default.isNil(value)\n            ? getTemplateValue(value)\n            : '-';\n    }\n    detach() {\n        var _a, _b;\n        this.off('blur');\n        if (this.choices) {\n            if ((_b = (_a = this.choices.containerOuter) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.parentNode) {\n                this.choices.destroy();\n            }\n            this.choices = null;\n        }\n        super.detach();\n    }\n    focus() {\n        super.focus.call(this);\n        if (this.focusableElement) {\n            this.focusableElement.focus();\n        }\n    }\n    setErrorClasses(elements, dirty, hasError, hasMessages, element = this.element) {\n        super.setErrorClasses(elements, dirty, hasError, hasMessages, element);\n        if (this.choices) {\n            super.setErrorClasses([this.choices.containerInner.element], dirty, hasError, hasMessages, element);\n        }\n        else {\n            super.setErrorClasses([this.refs.selectContainer], dirty, hasError, hasMessages, element);\n        }\n    }\n}\nexports[\"default\"] = SelectComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/select/Select.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst Formio_1 = __webpack_require__(/*! ../../Formio */ \"./lib/cjs/Formio.js\");\nconst ListComponent_1 = __importDefault(__webpack_require__(/*! ../_classes/list/ListComponent */ \"./lib/cjs/components/_classes/list/ListComponent.js\"));\nconst Form_1 = __importDefault(__webpack_require__(/*! ../../Form */ \"./lib/cjs/Form.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\");\nconst ChoicesWrapper_1 = __importDefault(__webpack_require__(/*! ../../utils/ChoicesWrapper */ \"./lib/cjs/utils/ChoicesWrapper.js\"));\nclass SelectComponent extends ListComponent_1.default {\n    static schema(...extend) {\n        return ListComponent_1.default.schema({\n            type: 'select',\n            label: 'Select',\n            key: 'select',\n            idPath: 'id',\n            data: {\n                values: [{ label: '', value: '' }],\n                json: '',\n                url: '',\n                resource: '',\n                custom: ''\n            },\n            clearOnRefresh: false,\n            limit: 100,\n            valueProperty: '',\n            lazyLoad: true,\n            filter: '',\n            searchEnabled: true,\n            searchDebounce: 0.3,\n            searchField: '',\n            minSearch: 0,\n            readOnlyValue: false,\n            selectFields: '',\n            selectThreshold: 0.3,\n            uniqueOptions: false,\n            tableView: true,\n            fuseOptions: {\n                include: 'score',\n                threshold: 0.3,\n            },\n            indexeddb: {\n                filter: {}\n            },\n            customOptions: {},\n            useExactSearch: false,\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Select',\n            group: 'basic',\n            icon: 'th-list',\n            weight: 70,\n            documentation: '/userguide/form-building/form-components#select',\n            schema: SelectComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return SelectComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        const numberType = () => ({ type: 'number' });\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { valueComponent(classComp) {\n                const valueComp = Object.assign(Object.assign({}, classComp), { type: 'select' });\n                if ((0, utils_1.isSelectResourceWithObjectValue)(classComp)) {\n                    valueComp.reference = false;\n                    valueComp.onSetItems = `\n            var templateKeys = utils.getItemTemplateKeys(component.template) || [];\n            items = _.map(items || [], i => {\n              var item = {};\n              _.each(templateKeys, k =>  _.set(item, k, _.get(i, k)));\n              return item;\n            })\n          `;\n                }\n                return valueComp;\n            }, dataTypeOperators: {\n                number: ['lessThan', 'greaterThan', 'lessThanOrEqual', 'greaterThanOrEqual'],\n            }, dataTypeValueComponents: {\n                number: {\n                    lessThan: numberType,\n                    greaterThan: numberType,\n                    lessThanOrEqual: numberType,\n                    greaterThanOrEqual: numberType,\n                },\n            } });\n    }\n    static savedValueTypes(schema) {\n        const { boolean, string, number, object, array } = utils_1.componentValueTypes;\n        const { dataType, reference } = schema;\n        const types = (0, utils_1.getComponentSavedTypes)(schema);\n        if (types) {\n            return types;\n        }\n        if (reference) {\n            return [object];\n        }\n        if (dataType === 'object') {\n            return [object, array];\n        }\n        if (utils_1.componentValueTypes[dataType]) {\n            return [utils_1.componentValueTypes[dataType]];\n        }\n        return [boolean, string, number, object, array];\n    }\n    init() {\n        super.init();\n        this.templateData = {};\n        // Trigger an update.\n        let updateArgs = [];\n        const triggerUpdate = lodash_1.default.debounce((...args) => {\n            updateArgs = [];\n            return this.updateItems.apply(this, args);\n        }, 100);\n        this.triggerUpdate = (...args) => {\n            // Make sure we always resolve the previous promise before reassign it\n            if (typeof this.itemsLoadedResolve === 'function') {\n                this.itemsLoadedResolve();\n            }\n            this.itemsLoaded = new Promise((resolve) => {\n                this.itemsLoadedResolve = resolve;\n            });\n            if (args.length) {\n                updateArgs = args;\n            }\n            return triggerUpdate(...updateArgs);\n        };\n        // Keep track of the select options.\n        this.selectOptions = [];\n        if (this.itemsFromUrl) {\n            this.isFromSearch = false;\n            this.searchServerCount = null;\n            this.defaultServerCount = null;\n            this.isScrollLoading = false;\n            this.searchDownloadedResources = [];\n            this.defaultDownloadedResources = [];\n        }\n        // If this component has been activated.//\n        this.activated = false;\n        this.itemsLoaded = new Promise((resolve) => {\n            this.itemsLoadedResolve = resolve;\n        });\n        this.shouldPositionDropdown = this.hasDataGridAncestor();\n        if (this.isHtmlRenderMode()) {\n            this.activate();\n        }\n        // Get the template keys for this select component.\n        this.getTemplateKeys();\n    }\n    get defaultSchema() {\n        return SelectComponent.schema();\n    }\n    get emptyValue() {\n        if (this.component.multiple) {\n            return [];\n        }\n        // if select has JSON data source type, we are defining if empty value would be an object or a string by checking JSON's first item\n        if (this.component.dataSrc === 'json' && this.component.data.json) {\n            const firstItem = this.component.data.json[0];\n            let firstValue;\n            if (this.valueProperty) {\n                firstValue = lodash_1.default.get(firstItem, this.valueProperty);\n            }\n            else {\n                firstValue = firstItem;\n            }\n            if (firstValue && typeof firstValue === 'string') {\n                return '';\n            }\n            else {\n                return {};\n            }\n        }\n        if (this.valueProperty) {\n            return '';\n        }\n        return {};\n    }\n    get valueProperty() {\n        if (this.component.valueProperty) {\n            return this.component.valueProperty;\n        }\n        // Force values datasource to use values without actually setting it on the component settings.\n        if (this.component.dataSrc === 'values') {\n            return 'value';\n        }\n        return '';\n    }\n    get inputInfo() {\n        const info = super.elementInfo();\n        info.type = 'select';\n        info.changeEvent = 'change';\n        return info;\n    }\n    get isSelectResource() {\n        return this.component.dataSrc === 'resource';\n    }\n    get itemsFromUrl() {\n        return this.isSelectResource || this.isSelectURL;\n    }\n    get isInfiniteScrollProvided() {\n        return this.itemsFromUrl;\n    }\n    get shouldDisabled() {\n        return super.shouldDisabled || this.parentDisabled;\n    }\n    get shouldInitialLoad() {\n        if (this.component.widget === 'html5' &&\n            this.isEntireObjectDisplay() &&\n            this.component.searchField &&\n            this.dataValue) {\n            return false;\n        }\n        return super.shouldLoad;\n    }\n    get selectMetadata() {\n        return super.selectData;\n    }\n    get selectData() {\n        return this.selectMetadata || this.component.selectData;\n    }\n    isEntireObjectDisplay() {\n        return this.component.dataSrc === 'resource' && this.valueProperty === 'data';\n    }\n    selectValueAndLabel(data) {\n        const value = this.getOptionValue((this.isEntireObjectDisplay() && !this.itemValue(data)) ? data : this.itemValue(data));\n        return {\n            value,\n            label: this.itemTemplate((this.isEntireObjectDisplay() && !lodash_1.default.isObject(data.data)) ? { data: data } : data, value)\n        };\n    }\n    itemTemplate(data, value) {\n        if (!lodash_1.default.isNumber(data) && lodash_1.default.isEmpty(data)) {\n            return '';\n        }\n        // If they wish to show the value in read only mode, then just return the itemValue here.\n        if (this.options.readOnly && this.component.readOnlyValue) {\n            return this.itemValue(data);\n        }\n        // Perform a fast interpretation if we should not use the template.\n        if (data && !this.component.template) {\n            const itemLabel = data.label || data;\n            const value = (typeof itemLabel === 'string') ? this.t(itemLabel, { _userInput: true }) : itemLabel;\n            return this.sanitize(value, this.shouldSanitizeValue);\n        }\n        // Inside DataTable component won't have dataValue set\n        const shouldUseSelectData = (this.component.multiple && lodash_1.default.isArray(this.dataValue)\n            ? this.dataValue.find((val) => this.normalizeSingleValue(value) === val)\n            : (this.dataValue === this.normalizeSingleValue(value))) || this.inDataTable;\n        if (shouldUseSelectData) {\n            const selectData = this.selectData;\n            if (selectData) {\n                const templateValue = this.component.reference && (value === null || value === void 0 ? void 0 : value._id) ? value._id.toString() : value;\n                if (!this.templateData || !this.templateData[templateValue]) {\n                    this.getOptionTemplate(data, value);\n                }\n                if (this.component.multiple) {\n                    if (selectData[templateValue]) {\n                        data = selectData[templateValue];\n                    }\n                }\n                else {\n                    data = selectData;\n                }\n            }\n        }\n        if (typeof data === 'string' || typeof data === 'number') {\n            return this.sanitize(this.t(data, { _userInput: true }), this.shouldSanitizeValue);\n        }\n        if (Array.isArray(data)) {\n            return data.map((val) => {\n                if (typeof val === 'string' || typeof val === 'number') {\n                    return this.sanitize(this.t(val, { _userInput: true }), this.shouldSanitizeValue);\n                }\n                return val;\n            });\n        }\n        if (data.data) {\n            // checking additional fields in the template for the selected Entire Object option\n            const hasNestedFields = /item\\.data\\.\\w*/g.test(this.component.template);\n            data.data = this.isEntireObjectDisplay() && lodash_1.default.isObject(data.data) && !hasNestedFields\n                ? JSON.stringify(data.data)\n                : data.data;\n        }\n        return super.itemTemplate(data, value);\n    }\n    /**\n     * Adds an option to the select dropdown.\n     * @param {*} value - The value of the new option.\n     * @param {string} label - The label of the new option.\n     * @param {object} [attrs] - Additional value attributes. Defaults to {}.\n     * @param {string} [id] - An id. Defaults to a random string.\n     */\n    addOption(value, label, attrs = {}, id = (0, utils_1.getRandomComponentId)()) {\n        if (lodash_1.default.isNil(label))\n            return;\n        const idPath = this.component.idPath\n            ? this.component.idPath.split('.').reduceRight((obj, key) => ({ [key]: obj }), id)\n            : {};\n        const option = Object.assign({ value: this.getOptionValue(value), label }, idPath);\n        const skipOption = this.component.uniqueOptions\n            ? !!this.selectOptions.find((selectOption) => lodash_1.default.isEqual(selectOption.value, option.value))\n            : false;\n        if (skipOption) {\n            return;\n        }\n        if (value) {\n            this.selectOptions.push(option);\n        }\n        if (this.refs.selectContainer && (this.component.widget === 'html5')) {\n            // Replace an empty Object value to an empty String.\n            if (option.value && lodash_1.default.isObject(option.value) && lodash_1.default.isEmpty(option.value)) {\n                option.value = '';\n            }\n            // Add element to option so we can reference it later.\n            const div = document.createElement('div');\n            div.innerHTML = this.sanitize(this.renderTemplate('selectOption', {\n                selected: lodash_1.default.isEqual(this.getOptionValue(this.dataValue), option.value),\n                option,\n                attrs,\n                id,\n                useId: (this.valueProperty === '' || this.isEntireObjectDisplay()) && lodash_1.default.isObject(value) && id,\n            }), this.shouldSanitizeValue).trim();\n            option.element = div.firstChild;\n            this.refs.selectContainer.appendChild(option.element);\n        }\n    }\n    addValueOptions(items) {\n        items = items || [];\n        let added = false;\n        let data = this.dataValue;\n        // preset submission value with value property before request.\n        if (this.options.pdf && !items.length && this.component.dataSrc === 'url' && this.valueProperty) {\n            data = Array.isArray(data)\n                ? data.map(item => lodash_1.default.set({}, this.valueProperty, item))\n                : lodash_1.default.set({}, this.valueProperty, data);\n        }\n        if (!this.selectOptions.length) {\n            // Add the currently selected choices if they don't already exist.\n            const currentChoices = Array.isArray(data) && this.component.multiple ? data : [data];\n            added = this.addCurrentChoices(currentChoices, items);\n            if (!added && !this.component.multiple) {\n                this.addPlaceholder();\n            }\n        }\n        return added;\n    }\n    disableInfiniteScroll() {\n        if (!this.downloadedResources) {\n            return;\n        }\n        this.downloadedResources.serverCount = this.downloadedResources.length;\n        this.serverCount = this.downloadedResources.length;\n    }\n    shouldResetChoicesItems(items) {\n        if (this.choices._store.choices.length !== items.length) {\n            return true;\n        }\n        for (let item of items) {\n            const choicesItem = this.choices._store.choices.find((i) => i.label === item.label);\n            if (!choicesItem) {\n                return true;\n            }\n        }\n        return false;\n    }\n    /* eslint-disable max-statements */\n    setItems(items, fromSearch) {\n        var _a, _b;\n        this.selectItems = items;\n        // If the items is a string, then parse as JSON.\n        if (typeof items == 'string') {\n            try {\n                items = JSON.parse(items);\n            }\n            catch (err) {\n                console.warn(err.message);\n                items = [];\n            }\n        }\n        // Allow js processing (needed for form builder)\n        if (this.component.onSetItems) {\n            const newItems = typeof this.component.onSetItems === 'function'\n                ? this.component.onSetItems(this, items)\n                : this.evaluate(this.component.onSetItems, { items: items }, 'items');\n            if (newItems) {\n                items = newItems;\n            }\n        }\n        if (!this.choices && this.refs.selectContainer) {\n            this.empty(this.refs.selectContainer);\n        }\n        // If they provided select values, then we need to get them instead.\n        if (this.component.selectValues) {\n            items = lodash_1.default.get(items, this.component.selectValues, items) || [];\n        }\n        let areItemsEqual;\n        if (this.itemsFromUrl) {\n            areItemsEqual = this.isSelectURL ? lodash_1.default.isEqual(items, this.downloadedResources) : false;\n            const areItemsEnded = this.component.limit > items.length;\n            const areItemsDownloaded = areItemsEqual\n                && this.downloadedResources\n                && this.downloadedResources.length === items.length;\n            if (areItemsEnded) {\n                this.disableInfiniteScroll();\n            }\n            else if (areItemsDownloaded) {\n                this.selectOptions = [];\n            }\n            else {\n                this.serverCount = items.serverCount;\n            }\n        }\n        if (this.isScrollLoading && items) {\n            if (!areItemsEqual) {\n                this.downloadedResources = this.downloadedResources\n                    ? this.downloadedResources.concat(items)\n                    : items;\n            }\n            this.downloadedResources.serverCount = items.serverCount || this.downloadedResources.serverCount;\n        }\n        else {\n            this.downloadedResources = items || [];\n            this.selectOptions = [];\n            // If there is new select option with same id as already selected, set the new one\n            if (!lodash_1.default.isEmpty(this.dataValue) && this.component.idPath) {\n                const selectedOptionId = lodash_1.default.get(this.dataValue, this.component.idPath, null);\n                const newOptionWithSameId = !lodash_1.default.isNil(selectedOptionId) && items.find(item => {\n                    const itemId = lodash_1.default.get(item, this.component.idPath);\n                    return itemId === selectedOptionId;\n                });\n                if (newOptionWithSameId) {\n                    this.setValue(newOptionWithSameId);\n                }\n            }\n        }\n        // Add the value options.\n        if (!fromSearch) {\n            this.addValueOptions(items);\n        }\n        if (this.component.widget === 'html5' && !this.component.placeholder) {\n            this.addOption(null, '');\n        }\n        // Iterate through each of the items.\n        lodash_1.default.each(items, (item, index) => {\n            // preventing references of the components inside the form to the parent form when building forms\n            if (this.root && this.root.options.editForm && this.root.options.editForm._id && this.root.options.editForm._id === item._id)\n                return;\n            const itemValueAndLabel = this.selectValueAndLabel(item);\n            this.addOption(itemValueAndLabel.value, itemValueAndLabel.label, {}, lodash_1.default.get(item, this.component.idPath, String(index)));\n        });\n        if (this.choices) {\n            this.choices.setChoices(this.selectOptions, 'value', 'label', true, true, !fromSearch && this.shouldResetChoicesItems(this.selectOptions));\n        }\n        else if (this.loading) {\n            // Re-attach select input.\n            // this.appendTo(this.refs.input[0], this.selectContainer);\n        }\n        // We are no longer loading.\n        this.isScrollLoading = false;\n        this.loading = false;\n        const searching = fromSearch && ((_b = (_a = this.choices) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.isFocussed);\n        if (!searching) {\n            // If a value is provided, then select it.\n            if (!this.isEmpty() || this.isRemoveButtonPressed) {\n                this.setValue(this.dataValue, {\n                    noUpdateEvent: true\n                });\n            }\n            else if (this.shouldAddDefaultValue && !this.options.readOnly) {\n                // If a default value is provided then select it.\n                const defaultValue = this.defaultValue;\n                if (!this.isEmpty(defaultValue)) {\n                    this.setValue(defaultValue);\n                }\n            }\n        }\n        // Say we are done loading the items.\n        this.itemsLoadedResolve();\n    }\n    getSingleItemValueForHTMLMode(data) {\n        var _a;\n        const option = (_a = this.selectOptions) === null || _a === void 0 ? void 0 : _a.find(({ value }) => lodash_1.default.isEqual(value, data));\n        if (option) {\n            return option.label || data;\n        }\n        return data;\n    }\n    itemValueForHTMLMode(value) {\n        if (!this.isHtmlRenderMode()) {\n            return super.itemValueForHTMLMode(value);\n        }\n        if (Array.isArray(value)) {\n            const values = value.map(item => Array.isArray(item)\n                ? this.itemValueForHTMLMode(item)\n                : this.getSingleItemValueForHTMLMode(item));\n            return values.join(', ');\n        }\n        return this.getSingleItemValueForHTMLMode(value);\n    }\n    /* eslint-enable max-statements */\n    get defaultValue() {\n        let defaultValue = super.defaultValue;\n        if (!defaultValue && (this.component.defaultValue === false || this.component.defaultValue === 0)) {\n            defaultValue = this.component.defaultValue;\n        }\n        return defaultValue;\n    }\n    get loadingError() {\n        return !this.component.refreshOn && !this.component.refreshOnBlur && this.networkError;\n    }\n    loadItems(url, search, headers, options, method, body) {\n        options = options || {};\n        // See if we should load items or not.\n        if (!this.shouldLoad || (!this.itemsFromUrl && this.options.readOnly)) {\n            this.isScrollLoading = false;\n            this.loading = false;\n            this.itemsLoadedResolve();\n            return;\n        }\n        // See if they have not met the minimum search requirements.\n        const minSearch = parseInt(this.component.minSearch, 10);\n        if (this.component.searchField &&\n            (minSearch > 0) &&\n            (!search || (search.length < minSearch))) {\n            // Set empty items.\n            return this.setItems([]);\n        }\n        // Ensure we have a method and remove any body if method is get\n        method = method || 'GET';\n        if (method.toUpperCase() === 'GET') {\n            body = null;\n        }\n        const limit = this.component.limit || 100;\n        const skip = this.isScrollLoading ? this.selectOptions.length : 0;\n        const query = this.component.disableLimit ? {} : {\n            limit,\n            skip,\n        };\n        // Allow for url interpolation.\n        url = this.sanitize(this.interpolate(url, {\n            formioBase: Formio_1.Formio.getBaseUrl(),\n            search,\n            limit,\n            skip,\n            page: Math.abs(Math.floor(skip / limit))\n        }), this.shouldSanitizeValue);\n        // Add search capability.\n        if (this.component.searchField && search) {\n            const searchValue = Array.isArray(search)\n                ? search.join(',')\n                : typeof search === 'object'\n                    ? JSON.stringify(search)\n                    : search;\n            query[this.component.searchField] = this.component.searchField.endsWith('__regex')\n                ? lodash_1.default.escapeRegExp(searchValue)\n                : searchValue;\n        }\n        // If they wish to return only some fields.\n        if (this.component.selectFields) {\n            query.select = this.component.selectFields;\n        }\n        // Add sort capability\n        if (this.component.sort) {\n            query.sort = this.component.sort;\n        }\n        if (!lodash_1.default.isEmpty(query)) {\n            // Add the query string.\n            url += (!url.includes('?') ? '?' : '&') + Formio_1.Formio.serialize(query, (item) => this.interpolate(item));\n        }\n        // Add filter capability\n        if (this.component.filter) {\n            url += (!url.includes('?') ? '?' : '&') + this.interpolate(this.component.filter);\n        }\n        // Set ignoreCache if it is\n        options.ignoreCache = this.component.ignoreCache;\n        // Make the request.\n        options.header = headers;\n        this.loading = true;\n        Formio_1.Formio.makeRequest(this.options.formio, 'select', url, method, body, options)\n            .then((response) => {\n            this.loading = false;\n            this.setItems(response, !!search);\n        })\n            .catch((err) => {\n            if (this.itemsFromUrl) {\n                this.setItems([]);\n                this.disableInfiniteScroll();\n            }\n            this.isScrollLoading = false;\n            this.handleLoadingError(err);\n        });\n    }\n    handleLoadingError(err) {\n        this.loading = false;\n        if (err.networkError) {\n            this.networkError = true;\n        }\n        this.itemsLoadedResolve();\n        this.emit('componentError', {\n            component: this.component,\n            message: err.toString(),\n        });\n        console.warn(`Unable to load resources for ${this.key}`);\n    }\n    /**\n     * Get the request headers for this select dropdown.\n     * @returns {*} - Returns the request headers for this select dropdown.\n     */\n    get requestHeaders() {\n        // Create the headers object.\n        const headers = new Formio_1.Formio.Headers();\n        // Add custom headers to the url.\n        if (this.component.data && this.component.data.headers) {\n            try {\n                lodash_1.default.each(this.component.data.headers, (header) => {\n                    if (header.key) {\n                        headers.set(header.key, this.interpolate(header.value));\n                    }\n                });\n            }\n            catch (err) {\n                console.warn(err.message);\n            }\n        }\n        return headers;\n    }\n    getCustomItems() {\n        const customItems = this.evaluate(this.component.data.custom, {\n            values: []\n        }, 'values');\n        this.asyncValues = (0, utils_1.isPromise)(customItems);\n        return customItems;\n    }\n    asyncCustomValues() {\n        if (!lodash_1.default.isBoolean(this.asyncValues)) {\n            this.getCustomItems();\n        }\n        return this.asyncValues;\n    }\n    updateCustomItems(forceUpdate) {\n        if (this.asyncCustomValues()) {\n            if (!forceUpdate && !this.active) {\n                this.itemsLoadedResolve();\n                return;\n            }\n            this.loading = true;\n            this.getCustomItems()\n                .then(items => {\n                this.loading = false;\n                this.setItems(items || []);\n            })\n                .catch(err => {\n                this.handleLoadingError(err);\n            });\n        }\n        else {\n            this.setItems(this.getCustomItems() || []);\n        }\n    }\n    isEmpty(value = this.dataValue) {\n        return super.isEmpty(value) || value === undefined;\n    }\n    refresh(value, { instance }) {\n        if (this.component.clearOnRefresh && (instance && !instance.pristine)) {\n            this.setValue(this.emptyValue);\n        }\n        this.updateItems(null, true);\n    }\n    get additionalResourcesAvailable() {\n        return lodash_1.default.isNil(this.serverCount) || (this.serverCount > this.downloadedResources.length);\n    }\n    get serverCount() {\n        if (this.isFromSearch) {\n            return this.searchServerCount;\n        }\n        return this.defaultServerCount;\n    }\n    set serverCount(value) {\n        if (this.isFromSearch) {\n            this.searchServerCount = value;\n        }\n        else {\n            this.defaultServerCount = value;\n        }\n    }\n    get downloadedResources() {\n        if (this.isFromSearch) {\n            return this.searchDownloadedResources;\n        }\n        return this.defaultDownloadedResources;\n    }\n    set downloadedResources(value) {\n        if (this.isFromSearch) {\n            this.searchDownloadedResources = value;\n        }\n        else {\n            this.defaultDownloadedResources = value;\n        }\n    }\n    addPlaceholder() {\n        if (!this.component.placeholder) {\n            return;\n        }\n        this.addOption('', this.component.placeholder, { placeholder: true });\n    }\n    /**\n     * Activate this select control.\n     */\n    activate() {\n        if (this.loading || !this.active) {\n            this.setLoadingItem();\n        }\n        if (this.active) {\n            return;\n        }\n        this.activated = true;\n        this.triggerUpdate();\n    }\n    setLoadingItem(addToCurrentList = false) {\n        if (this.choices) {\n            if (addToCurrentList) {\n                this.choices.setChoices([{\n                        value: `${this.id}-loading`,\n                        label: 'Loading...',\n                        disabled: true,\n                    }], 'value', 'label');\n            }\n            else {\n                this.choices.setChoices([{\n                        value: '',\n                        label: `<i class=\"${this.iconClass('refresh')}\" style=\"font-size:1.3em;\"></i>`,\n                        disabled: true,\n                    }], 'value', 'label', true);\n            }\n        }\n        else if (this.component.dataSrc === 'url' || this.component.dataSrc === 'resource') {\n            this.addOption('', this.t('loading...'));\n        }\n    }\n    get active() {\n        return !this.component.lazyLoad || this.activated;\n    }\n    render() {\n        const info = this.inputInfo;\n        info.attr = info.attr || {};\n        info.multiple = this.component.multiple;\n        return super.render(this.wrapElement(this.renderTemplate('select', {\n            input: info,\n            selectOptions: '',\n            index: null,\n        })));\n    }\n    wrapElement(element) {\n        return this.component.addResource && !this.options.readOnly\n            ? (this.renderTemplate('resourceAdd', {\n                element\n            }))\n            : element;\n    }\n    choicesOptions() {\n        const useSearch = this.component.hasOwnProperty('searchEnabled') ? this.component.searchEnabled : true;\n        const placeholderValue = this.t(this.component.placeholder, { _userInput: true });\n        let customOptions = this.component.customOptions || {};\n        if (typeof customOptions == 'string') {\n            try {\n                customOptions = JSON.parse(customOptions);\n            }\n            catch (err) {\n                console.warn(err.message);\n                customOptions = {};\n            }\n        }\n        const commonFuseOptions = {\n            maxPatternLength: 1000,\n            distance: 1000,\n        };\n        return Object.assign({ removeItemButton: this.component.disabled ? false : lodash_1.default.get(this.component, 'removeItemButton', true), itemSelectText: '', classNames: {\n                containerOuter: ['choices', 'form-group', 'formio-choices'],\n                containerInner: this.transform('class', 'form-control ui fluid selection dropdown').split(' '),\n            }, addItemText: false, allowHTML: true, placeholder: !!this.component.placeholder, placeholderValue: placeholderValue, noResultsText: this.t('No results found'), noChoicesText: this.t('No choices to choose from'), searchPlaceholderValue: this.t('Type to search'), shouldSort: false, position: (this.component.dropdown || 'auto'), searchEnabled: useSearch, searchChoices: !this.component.searchField, searchFields: lodash_1.default.get(this, 'component.searchFields', ['label']), shadowRoot: this.root ? this.root.shadowRoot : null, fuseOptions: this.component.useExactSearch\n                ? Object.assign({ tokenize: true, matchAllTokens: true }, commonFuseOptions) : Object.assign({}, lodash_1.default.get(this, 'component.fuseOptions', {}), Object.assign({ include: 'score', threshold: lodash_1.default.get(this, 'component.selectThreshold', 0.3) }, commonFuseOptions)), valueComparer: lodash_1.default.isEqual, resetScrollPosition: false, duplicateItemsAllowed: false }, customOptions);\n    }\n    /* eslint-disable max-statements */\n    attach(element) {\n        var _a, _b, _c;\n        const superAttach = super.attach(element);\n        this.loadRefs(element, {\n            selectContainer: 'single',\n            addResource: 'single',\n            autocompleteInput: 'single'\n        });\n        //enable autocomplete for select\n        const autocompleteInput = this.refs.autocompleteInput;\n        if (autocompleteInput) {\n            this.addEventListener(autocompleteInput, 'change', (event) => {\n                this.setValue(event.target.value);\n            });\n        }\n        const input = this.refs.selectContainer;\n        if (!input) {\n            return;\n        }\n        this.addEventListener(input, this.inputInfo.changeEvent, () => this.updateValue(null, {\n            modified: true\n        }));\n        this.attachRefreshOnBlur();\n        if (this.component.widget === 'html5') {\n            this.addFocusBlurEvents(input);\n            this.triggerUpdate(null, true);\n            if (this.visible) {\n                this.setItems(this.selectItems || []);\n            }\n            this.focusableElement = input;\n            if (this.component.dataSrc === 'custom') {\n                this.addEventListener(input, 'focus', () => this.updateCustomItems());\n            }\n            this.addEventListener(input, 'keydown', (event) => {\n                const { key } = event;\n                if (['Backspace', 'Delete'].includes(key)) {\n                    this.setValue(this.emptyValue);\n                }\n            });\n            return;\n        }\n        const tabIndex = input.tabIndex;\n        this.addPlaceholder();\n        if (this.i18next) {\n            input.setAttribute('dir', this.i18next.dir());\n        }\n        if ((_c = (_b = (_a = this.choices) === null || _a === void 0 ? void 0 : _a.containerOuter) === null || _b === void 0 ? void 0 : _b.element) === null || _c === void 0 ? void 0 : _c.parentNode) {\n            this.choices.destroy();\n        }\n        const choicesOptions = this.choicesOptions();\n        if (ChoicesWrapper_1.default) {\n            this.choices = new ChoicesWrapper_1.default(input, choicesOptions);\n            if (this.selectOptions && this.selectOptions.length) {\n                this.choices.setChoices(this.selectOptions, 'value', 'label', true);\n            }\n            if (this.component.multiple) {\n                this.focusableElement = this.choices.input.element;\n            }\n            else {\n                this.focusableElement = this.choices.containerInner.element;\n                this.choices.containerOuter.element.setAttribute('tabIndex', '-1');\n                this.addEventListener(this.choices.containerOuter.element, 'focus', () => this.focusableElement.focus());\n            }\n            this.addFocusBlurEvents(this.choices.input.element);\n            if (this.itemsFromUrl && !this.component.noRefreshOnScroll) {\n                this.scrollList = this.choices.choiceList.element;\n                this.addEventListener(this.scrollList, 'scroll', () => this.onScroll());\n            }\n            if (choicesOptions.removeItemButton) {\n                this.addEventListener(input, 'removeItem', () => {\n                    this.isRemoveButtonPressed = true;\n                });\n            }\n        }\n        if (window && this.choices && this.shouldPositionDropdown) {\n            this.addEventListener(window.document, 'scroll', () => {\n                this.positionDropdown(true);\n            }, false, true);\n        }\n        this.focusableElement.setAttribute('tabIndex', tabIndex);\n        // If a search field is provided, then add an event listener to update items on search.\n        if (this.component.searchField) {\n            // Make sure to clear the search when no value is provided.\n            if (this.choices && this.choices.input && this.choices.input.element) {\n                this.addEventListener(this.choices.input.element, 'input', (event) => {\n                    this.isFromSearch = !!event.target.value;\n                    if (!event.target.value) {\n                        this.triggerUpdate();\n                    }\n                    else {\n                        this.serverCount = null;\n                        this.downloadedResources = [];\n                    }\n                });\n            }\n            this.addEventListener(input, 'choice', () => {\n                if (this.component.multiple && this.component.dataSrc === 'resource' && this.isFromSearch) {\n                    this.triggerUpdate();\n                }\n                this.isFromSearch = false;\n            });\n            // avoid spamming the resource/url endpoint when we have server side filtering enabled.\n            const debounceTimeout = this.component.searchField && (this.isSelectResource || this.isSelectURL) ?\n                (this.component.searchDebounce === 0 ? 0 : this.component.searchDebounce || this.defaultSchema.searchDebounce) * 1000\n                : 0;\n            const updateComponent = (evt) => {\n                this.triggerUpdate(evt.detail.value);\n            };\n            this.addEventListener(input, 'search', lodash_1.default.debounce((e) => {\n                updateComponent(e);\n                this.positionDropdown();\n            }, debounceTimeout));\n            this.addEventListener(input, 'stopSearch', () => this.triggerUpdate());\n            this.addEventListener(input, 'hideDropdown', () => {\n                if (this.choices && this.choices.input && this.choices.input.element) {\n                    this.choices.input.element.value = '';\n                }\n                this.updateItems(null, true);\n            });\n        }\n        this.addEventListener(input, 'showDropdown', () => {\n            this.update();\n            this.positionDropdown();\n        });\n        if (this.shouldPositionDropdown) {\n            this.addEventListener(input, 'highlightChoice', () => {\n                this.positionDropdown();\n            });\n        }\n        // Add value options.\n        this.addValueOptions();\n        this.setChoicesValue(this.dataValue);\n        if (this.isSelectResource && this.refs.addResource) {\n            this.addEventListener(this.refs.addResource, 'click', (event) => {\n                event.preventDefault();\n                const formioForm = this.ce('div');\n                const dialog = this.createModal(formioForm);\n                const projectUrl = lodash_1.default.get(this.root, 'formio.projectUrl', Formio_1.Formio.getProjectUrl());\n                const formUrl = `${projectUrl}/form/${this.component.data.resource}`;\n                new Form_1.default(formioForm, formUrl, {}).ready\n                    .then((form) => {\n                    form.on('submit', (submission) => {\n                        // If valueProperty is set, replace the submission with the corresponding value\n                        let value = this.valueProperty ? lodash_1.default.get(submission, this.valueProperty) : submission;\n                        if (this.component.multiple) {\n                            value = [...this.dataValue, value];\n                        }\n                        this.setValue(value);\n                        this.triggerUpdate();\n                        dialog.close();\n                    });\n                });\n            });\n        }\n        // Force the disabled state with getters and setters.\n        this.disabled = this.shouldDisabled;\n        this.triggerUpdate();\n        return superAttach;\n    }\n    setDropdownPosition() {\n        var _a, _b, _c, _d;\n        const dropdown = (_b = (_a = this.choices) === null || _a === void 0 ? void 0 : _a.dropdown) === null || _b === void 0 ? void 0 : _b.element;\n        const container = (_d = (_c = this.choices) === null || _c === void 0 ? void 0 : _c.containerOuter) === null || _d === void 0 ? void 0 : _d.element;\n        if (!dropdown || !container) {\n            return;\n        }\n        const containerPosition = container.getBoundingClientRect();\n        const isFlipped = container.classList.contains('is-flipped');\n        lodash_1.default.assign(dropdown.style, {\n            top: `${isFlipped ? containerPosition.top - dropdown.offsetHeight : containerPosition.top + containerPosition.height}px`,\n            left: `${containerPosition.left}px`,\n            width: `${containerPosition.width}px`,\n            position: 'fixed',\n            bottom: 'unset',\n            right: 'unset',\n        });\n    }\n    hasDataGridAncestor(comp) {\n        comp = comp || this;\n        if (comp.inDataGrid || comp.type === 'datagrid') {\n            return true;\n        }\n        else if (comp.parent) {\n            return this.hasDataGridAncestor(comp.parent);\n        }\n        else {\n            return false;\n        }\n    }\n    positionDropdown(scroll) {\n        var _a;\n        if (!this.shouldPositionDropdown || !this.choices || (!((_a = this.choices.dropdown) === null || _a === void 0 ? void 0 : _a.isActive) && scroll)) {\n            return;\n        }\n        this.setDropdownPosition();\n        this.itemsLoaded.then(() => {\n            this.setDropdownPosition();\n        });\n    }\n    get isLoadingAvailable() {\n        return !this.isScrollLoading && this.additionalResourcesAvailable;\n    }\n    onScroll() {\n        if (this.isLoadingAvailable) {\n            this.isScrollLoading = true;\n            this.setLoadingItem(true);\n            this.triggerUpdate(this.choices.input.element.value);\n        }\n    }\n    attachRefreshOnBlur() {\n        if (this.component.refreshOnBlur) {\n            this.on('blur', (instance) => {\n                this.checkRefreshOn([{ instance, value: instance.dataValue }], { fromBlur: true });\n            });\n        }\n    }\n    /* eslint-enable max-statements */\n    update() {\n        if (this.component.dataSrc === 'custom') {\n            this.updateCustomItems();\n        }\n        // Activate the control.\n        this.activate();\n    }\n    set disabled(disabled) {\n        super.disabled = disabled;\n        if (!this.choices) {\n            return;\n        }\n        if (disabled) {\n            this.setDisabled(this.choices.containerInner.element, true);\n            this.focusableElement.removeAttribute('tabIndex');\n            this.choices.disable();\n        }\n        else {\n            this.setDisabled(this.choices.containerInner.element, false);\n            this.focusableElement.setAttribute('tabIndex', this.component.tabindex || 0);\n            this.choices.enable();\n        }\n    }\n    get disabled() {\n        return super.disabled;\n    }\n    set visible(value) {\n        // If we go from hidden to visible, trigger a refresh.\n        if (value && (!this._visible !== !value)) {\n            this.triggerUpdate();\n        }\n        super.visible = value;\n    }\n    get visible() {\n        return super.visible;\n    }\n    addCurrentChoices(values, items, keyValue) {\n        if (!values) {\n            return false;\n        }\n        const notFoundValuesToAdd = [];\n        const added = values.reduce((defaultAdded, value) => {\n            if (!value || lodash_1.default.isEmpty(value)) {\n                return defaultAdded;\n            }\n            let found = false;\n            // Make sure that `items` and `this.selectOptions` points\n            // to the same reference. Because `this.selectOptions` is\n            // internal property and all items are populated by\n            // `this.addOption` method, we assume that items has\n            // 'label' and 'value' properties. This assumption allows\n            // us to read correct value from the item.\n            const isSelectOptions = items === this.selectOptions;\n            if (items && items.length) {\n                lodash_1.default.each(items, (choice) => {\n                    if (choice._id && value._id && (choice._id === value._id)) {\n                        found = true;\n                        return false;\n                    }\n                    const itemValue = keyValue ? choice.value : this.itemValue(choice, isSelectOptions);\n                    found |= lodash_1.default.isEqual(itemValue, value);\n                    return found ? false : true;\n                });\n            }\n            // Add the default option if no item is found.\n            if (!found) {\n                notFoundValuesToAdd.push(this.selectValueAndLabel(value));\n                return true;\n            }\n            return found || defaultAdded;\n        }, false);\n        if (notFoundValuesToAdd.length) {\n            if (this.choices) {\n                this.choices.setChoices(notFoundValuesToAdd, 'value', 'label');\n            }\n            notFoundValuesToAdd.map(notFoundValue => {\n                this.addOption(notFoundValue.value, notFoundValue.label);\n            });\n        }\n        return added;\n    }\n    getValueAsString(data, options) {\n        return (this.component.multiple && Array.isArray(data))\n            ? data.map((v) => this.asString(v, options)).join(', ')\n            : this.asString(data, options);\n    }\n    getValue() {\n        // If the widget isn't active.\n        if (this.viewOnly || this.loading\n            || (!this.component.lazyLoad && !this.selectOptions.length)\n            || !this.element) {\n            return this.dataValue;\n        }\n        let value = this.emptyValue;\n        if (this.choices) {\n            value = this.choices.getValue(true);\n            // Make sure we don't get the placeholder\n            if (!this.component.multiple &&\n                this.component.placeholder &&\n                (value === this.t(this.component.placeholder, { _userInput: true }))) {\n                value = this.emptyValue;\n            }\n        }\n        else if (this.refs.selectContainer) {\n            value = this.refs.selectContainer.value;\n            if (this.valueProperty === '' || this.isEntireObjectDisplay()) {\n                if (value === '') {\n                    return {};\n                }\n                const option = this.selectOptions[value] ||\n                    this.selectOptions.find(option => option.id === value);\n                if (option && lodash_1.default.isObject(option.value)) {\n                    value = option.value;\n                }\n            }\n        }\n        else {\n            value = this.dataValue;\n        }\n        // Choices will return undefined if nothing is selected. We really want '' to be empty.\n        if (value === undefined || value === null) {\n            value = '';\n        }\n        return value;\n    }\n    redraw() {\n        const done = super.redraw();\n        this.triggerUpdate();\n        return done;\n    }\n    normalizeSingleValue(value) {\n        if (lodash_1.default.isNil(value)) {\n            return;\n        }\n        const valueIsObject = lodash_1.default.isObject(value);\n        //check if value equals to default emptyValue\n        if (valueIsObject && Object.keys(value).length === 0) {\n            return value;\n        }\n        const dataType = this.component.dataType || 'auto';\n        const normalize = {\n            value,\n            number() {\n                const numberValue = Number(this.value);\n                const isEquivalent = value.toString() === numberValue.toString();\n                if (!Number.isNaN(numberValue) && Number.isFinite(numberValue) && value !== '' && isEquivalent) {\n                    this.value = numberValue;\n                }\n                return this;\n            },\n            boolean() {\n                if (lodash_1.default.isString(this.value)\n                    && (this.value.toLowerCase() === 'true'\n                        || this.value.toLowerCase() === 'false')) {\n                    this.value = (this.value.toLowerCase() === 'true');\n                }\n                return this;\n            },\n            string() {\n                this.value = String(this.value);\n                return this;\n            },\n            object() {\n                return this;\n            },\n            auto() {\n                if (lodash_1.default.isObject(this.value)) {\n                    this.value = this.object().value;\n                }\n                else {\n                    this.value = this.string().number().boolean().value;\n                }\n                return this;\n            }\n        };\n        try {\n            return normalize[dataType]().value;\n        }\n        catch (err) {\n            console.warn('Failed to normalize value', err);\n            return value;\n        }\n    }\n    /**\n     * Normalize values coming into updateValue. For example, depending on the configuration, string value `\"true\"` will be normalized to boolean `true`.\n     * @param {*} value - The value to normalize\n     * @returns {*} - Returns the normalized value\n     */\n    normalizeValue(value) {\n        if (this.component.multiple && Array.isArray(value)) {\n            return value.map((singleValue) => this.normalizeSingleValue(singleValue));\n        }\n        return super.normalizeValue(this.normalizeSingleValue(value));\n    }\n    setMetadata(value, flags = {}) {\n        var _a, _b;\n        if (lodash_1.default.isNil(value)) {\n            return;\n        }\n        const valueIsObject = lodash_1.default.isObject(value);\n        //check if value equals to default emptyValue\n        if (valueIsObject && Object.keys(value).length === 0) {\n            return value;\n        }\n        // Check to see if we need to save off the template data into our metadata.\n        const templateValue = this.component.reference && (value === null || value === void 0 ? void 0 : value._id) ? value._id.toString() : value;\n        const shouldSaveData = (!valueIsObject || this.component.reference) && !this.inDataTable;\n        if (!lodash_1.default.isNil(templateValue) && shouldSaveData && this.templateData && this.templateData[templateValue] && ((_a = this.root) === null || _a === void 0 ? void 0 : _a.submission)) {\n            const submission = this.root.submission;\n            if (!submission.metadata) {\n                submission.metadata = {};\n            }\n            if (!submission.metadata.selectData) {\n                submission.metadata.selectData = {};\n            }\n            let templateData = this.templateData[templateValue];\n            if (this.component.multiple) {\n                templateData = {};\n                const dataValue = this.dataValue;\n                if (dataValue && lodash_1.default.isArray(dataValue) && dataValue.length) {\n                    dataValue.forEach((dataValueItem) => {\n                        const dataValueItemValue = this.component.reference ? dataValueItem._id.toString() : dataValueItem;\n                        templateData[dataValueItemValue] = this.templateData[dataValueItemValue];\n                    });\n                }\n                templateData[value] = this.templateData[value];\n            }\n            lodash_1.default.set(submission.metadata.selectData, this.path, templateData);\n        }\n        if (flags.resetValue && ((_b = this.root) === null || _b === void 0 ? void 0 : _b.submission) && !this.options.readOnly) {\n            const submission = this.root.submission;\n            if (!submission.metadata) {\n                submission.metadata = {};\n            }\n            submission.metadata.selectData = {};\n        }\n    }\n    updateValue(value, flags) {\n        const changed = super.updateValue(value, flags);\n        if (changed || !this.selectMetadata || flags.resetValue) {\n            if (this.component.multiple && Array.isArray(this.dataValue)) {\n                this.dataValue.forEach(singleValue => this.setMetadata(singleValue, flags));\n            }\n            else {\n                this.setMetadata(this.dataValue, flags);\n            }\n        }\n        return changed;\n    }\n    undoValueTyping(value) {\n        let untypedValue = value;\n        if (this.component.multiple && Array.isArray(value)) {\n            untypedValue = value.map(v => {\n                if (typeof v === 'boolean' || typeof v === 'number') {\n                    return v.toString();\n                }\n                return v;\n            });\n        }\n        else {\n            if (typeof value === 'boolean' || typeof value === 'number') {\n                untypedValue = value.toString();\n            }\n        }\n        return untypedValue;\n    }\n    setValue(value, flags = {}) {\n        const previousValue = this.dataValue;\n        const changed = this.updateValue(value, flags);\n        if (this.component.widget === 'html5' && (lodash_1.default.isEqual(value, previousValue) || lodash_1.default.isEqual(previousValue, {}) && lodash_1.default.isEqual(flags, {})) && !flags.fromSubmission) {\n            return false;\n        }\n        value = this.dataValue;\n        const hasPreviousValue = !this.isEmpty(previousValue);\n        const hasValue = !this.isEmpty(value);\n        // Undo typing when searching to set the value.\n        value = this.undoValueTyping(value);\n        if (this.isHtmlRenderMode() && flags && flags.fromSubmission && changed) {\n            this.itemsLoaded.then(() => {\n                this.redraw();\n            });\n            return changed;\n        }\n        // Do not set the value if we are loading... that will happen after it is done.\n        if (this.loading) {\n            return changed;\n        }\n        // Determine if we need to perform an initial lazyLoad api call if searchField is provided.\n        if (this.isInitApiCallNeeded(hasValue)) {\n            this.loading = true;\n            this.lazyLoadInit = true;\n            const searchProperty = this.component.searchField || this.component.valueProperty;\n            this.triggerUpdate(lodash_1.default.get(value.data || value, searchProperty, value), true);\n            return changed;\n        }\n        // Add the value options.\n        this.itemsLoaded.then(() => {\n            this.addValueOptions();\n            this.setChoicesValue(value, hasPreviousValue, flags);\n        });\n        return changed;\n    }\n    isInitApiCallNeeded(hasValue) {\n        return this.component.lazyLoad &&\n            !this.lazyLoadInit &&\n            !this.active &&\n            !this.selectOptions.length &&\n            hasValue &&\n            this.shouldInitialLoad &&\n            this.visible && (this.component.searchField || this.component.valueProperty);\n    }\n    setChoicesValue(value, hasPreviousValue, flags = {}) {\n        const hasValue = !this.isEmpty(value) || flags.fromSubmission;\n        hasPreviousValue = (hasPreviousValue === undefined) ? true : hasPreviousValue;\n        if (this.choices) {\n            // Now set the value.\n            if (hasValue) {\n                this.choices.removeActiveItems();\n                // Add the currently selected choices if they don't already exist.\n                const currentChoices = Array.isArray(value) && this.component.multiple ? value : [value];\n                if (!this.addCurrentChoices(currentChoices, this.selectOptions, true)) {\n                    this.choices.setChoices(this.selectOptions, 'value', 'label', true);\n                }\n                this.choices.setChoiceByValue(currentChoices);\n            }\n            else if (hasPreviousValue || flags.resetValue) {\n                this.choices.removeActiveItems();\n            }\n        }\n        else {\n            if (hasValue) {\n                const values = Array.isArray(value) ? value : [value];\n                if (!lodash_1.default.isEqual(this.dataValue, this.defaultValue) && this.selectOptions.length < 2\n                    || (this.selectData && flags.fromSubmission)) {\n                    const { value, label } = this.selectValueAndLabel(this.dataValue);\n                    this.addOption(value, label);\n                }\n                lodash_1.default.each(this.selectOptions, (selectOption) => {\n                    lodash_1.default.each(values, (val) => {\n                        if (selectOption.value === '') {\n                            selectOption.value = {};\n                        }\n                        if (lodash_1.default.isEqual(val, selectOption.value) && selectOption.element) {\n                            selectOption.element.selected = true;\n                            selectOption.element.setAttribute('selected', 'selected');\n                            return false;\n                        }\n                    });\n                });\n            }\n            else {\n                lodash_1.default.each(this.selectOptions, (selectOption) => {\n                    if (selectOption.element) {\n                        selectOption.element.selected = false;\n                        selectOption.element.removeAttribute('selected');\n                    }\n                });\n            }\n        }\n    }\n    validateValueAvailability(setting, value) {\n        if (!(0, utils_1.boolValue)(setting) || !value) {\n            return true;\n        }\n        const values = this.getOptionsValues();\n        if (values) {\n            if (lodash_1.default.isObject(value)) {\n                const compareComplexValues = (optionValue) => {\n                    const normalizedOptionValue = this.normalizeSingleValue(optionValue);\n                    if (!lodash_1.default.isObject(normalizedOptionValue)) {\n                        return false;\n                    }\n                    try {\n                        return (JSON.stringify(normalizedOptionValue) === JSON.stringify(value));\n                    }\n                    catch (err) {\n                        console.warn.error('Error while comparing items', err);\n                        return false;\n                    }\n                };\n                return values.findIndex((optionValue) => compareComplexValues(optionValue)) !== -1;\n            }\n            return values.findIndex((optionValue) => this.normalizeSingleValue(optionValue) === value) !== -1;\n        }\n        return false;\n    }\n    /**\n     * Performs required transformations on the initial value to use in selectOptions\n     * @param {*} value - The value to transform.\n     * @returns {*} - Returns the options value.\n     */\n    getOptionValue(value) {\n        return lodash_1.default.isObject(value) && this.isEntireObjectDisplay()\n            ? this.normalizeSingleValue(value)\n            : lodash_1.default.isObject(value) && (this.valueProperty || this.component.key !== 'resource')\n                ? value\n                : lodash_1.default.isObject(value) && !this.valueProperty\n                    ? this.interpolate(this.component.template, { item: value }).replace(/<\\/?[^>]+(>|$)/g, '')\n                    : lodash_1.default.isNull(value)\n                        ? this.emptyValue\n                        : String(this.normalizeSingleValue(value));\n    }\n    /**\n     * If component has static values (values, json) or custom values, returns an array of them\n     * @returns {Array<*>|undefined} - Returns an array of the static or custom values.\n     */\n    getOptionsValues() {\n        let rawItems = [];\n        switch (this.component.dataSrc) {\n            case 'values':\n                rawItems = this.component.data.values;\n                break;\n            case 'json':\n                rawItems = this.component.data.json;\n                break;\n            case 'custom':\n                rawItems = this.getCustomItems();\n                break;\n            case 'url':\n                rawItems = this.selectItems;\n                break;\n        }\n        if (typeof rawItems === 'string') {\n            try {\n                rawItems = JSON.parse(rawItems);\n            }\n            catch (err) {\n                console.warn(err.message);\n                rawItems = [];\n            }\n        }\n        if (!Array.isArray(rawItems)) {\n            return;\n        }\n        return rawItems.map((item) => this.getOptionValue(this.itemValue(item)));\n    }\n    /**\n     * Deletes the value of the component.\n     */\n    deleteValue() {\n        this.setValue('', {\n            noUpdateEvent: true\n        });\n        this.unset();\n    }\n    /**\n     * Check if a component is eligible for multiple validation\n     * @returns {boolean} - Returns FALSE for select components.\n     */\n    validateMultiple() {\n        // Select component will contain one input when flagged as multiple.\n        return false;\n    }\n    /**\n     * Output this select dropdown as a string value.\n     * @returns {*}\n     */\n    isBooleanOrNumber(value) {\n        return typeof value === 'number' || typeof value === 'boolean';\n    }\n    getNormalizedValues() {\n        if (!this.component || !this.component.data || !this.component.data.values) {\n            return;\n        }\n        return this.component.data.values.map(value => ({ label: value.label, value: String(this.normalizeSingleValue(value.value)) }));\n    }\n    asString(value, options = {}) {\n        var _a;\n        value = value !== null && value !== void 0 ? value : this.getValue();\n        if (options.modalPreview || this.inDataTable) {\n            if (this.inDataTable) {\n                value = this.undoValueTyping(value);\n            }\n            const templateValue = (this.isEntireObjectDisplay() && !lodash_1.default.isObject(value.data)) ? { data: value } : value;\n            const template = this.itemTemplate(templateValue, value, options);\n            return template;\n        }\n        //need to convert values to strings to be able to compare values with available options that are strings\n        const convertToString = (data, valueProperty) => {\n            if (valueProperty) {\n                if (Array.isArray(data)) {\n                    data.forEach((item) => item[valueProperty] = item[valueProperty].toString());\n                }\n                else if (lodash_1.default.isObject(data)) {\n                    data[valueProperty] = data[valueProperty].toString();\n                }\n                return data;\n            }\n            if (this.isBooleanOrNumber(data)) {\n                data = data.toString();\n            }\n            if (Array.isArray(data) && data.some(item => this.isBooleanOrNumber(item))) {\n                data = data.map(item => this.isBooleanOrNumber(item) ? item.toString() : item);\n            }\n            return data;\n        };\n        value = convertToString(value);\n        if (['values', 'custom'].includes(this.component.dataSrc) && !this.asyncCustomValues()) {\n            const { items, valueProperty, } = this.component.dataSrc === 'values'\n                ? {\n                    items: convertToString(this.getNormalizedValues(), 'value'),\n                    valueProperty: 'value',\n                }\n                : {\n                    items: convertToString(this.getCustomItems(), this.valueProperty),\n                    valueProperty: this.valueProperty,\n                };\n            const getFromValues = () => {\n                const initialValue = lodash_1.default.find(items, [valueProperty, value]);\n                const values = this.defaultSchema.data.values || [];\n                return lodash_1.default.isEqual(initialValue, values[0]) ? '-' : initialValue;\n            };\n            value = (this.component.multiple && Array.isArray(value))\n                ? lodash_1.default.filter(items, (item) => value.includes(item.value))\n                : (valueProperty && items)\n                    ? (_a = getFromValues()) !== null && _a !== void 0 ? _a : { value, label: value }\n                    : value;\n        }\n        if (lodash_1.default.isString(value)) {\n            return value;\n        }\n        const getTemplateValue = (v) => {\n            const itemTemplate = this.itemTemplate(v);\n            return options.csv && itemTemplate\n                ? (0, utils_1.removeHTML)(itemTemplate)\n                : itemTemplate;\n        };\n        if (Array.isArray(value)) {\n            const items = [];\n            value.forEach(item => items.push(getTemplateValue(item)));\n            if (this.component.dataSrc === 'resource' && items.length > 0) {\n                return items.join(', ');\n            }\n            else if (items.length > 0) {\n                return items.join('<br />');\n            }\n            else {\n                return '-';\n            }\n        }\n        if (this.isEntireObjectDisplay() && lodash_1.default.isObject(value)) {\n            return JSON.stringify(value);\n        }\n        return !lodash_1.default.isNil(value)\n            ? getTemplateValue(value)\n            : '-';\n    }\n    detach() {\n        var _a, _b;\n        this.off('blur');\n        if (this.choices) {\n            if ((_b = (_a = this.choices.containerOuter) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.parentNode) {\n                this.choices.destroy();\n            }\n            this.choices = null;\n        }\n        super.detach();\n    }\n    focus() {\n        super.focus.call(this);\n        if (this.focusableElement) {\n            this.focusableElement.focus();\n        }\n    }\n    setErrorClasses(elements, dirty, hasError, hasMessages, element = this.element) {\n        super.setErrorClasses(elements, dirty, hasError, hasMessages, element);\n        if (this.choices) {\n            super.setErrorClasses([this.choices.containerInner.element], dirty, hasError, hasMessages, element);\n        }\n        else {\n            super.setErrorClasses([this.refs.selectContainer], dirty, hasError, hasMessages, element);\n        }\n    }\n}\nexports[\"default\"] = SelectComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/select/Select.js?");
 
 /***/ }),
 
@@ -6611,7 +6611,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
   \******************************************************************************************/
 /***/ (function(__unused_webpack_module, exports) {
 
-eval("Object.defineProperty(exports, \"__esModule\", ({\n  value: true\n}));\nexports[\"default\"]=function(ctx) {\nvar __t, __p = '', __j = Array.prototype.join;\nfunction print() { __p += __j.call(arguments, '') }\n__p += '<table class=\"table datagrid-table table-bordered\\n    ' +\n((__t = ( ctx.component.striped ? 'table-striped' : '')) == null ? '' : __t) +\n'\\n    ' +\n((__t = ( ctx.component.hover ? 'table-hover' : '')) == null ? '' : __t) +\n'\\n    ' +\n((__t = ( ctx.component.condensed ? 'table-sm' : '')) == null ? '' : __t) +\n'\\n    \" ';\n if (ctx.component.layoutFixed || ctx.readOnly) { ;\n__p += 'style=\"table-layout: fixed;\"';\n } ;\n__p += '>\\n  ';\n if (ctx.hasHeader) { ;\n__p += '\\n  <thead>\\n    <tr>\\n      ';\n if (ctx.component.reorder) { ;\n__p += '<th></th>';\n } ;\n__p += '\\n      ';\n ctx.columns.forEach(function(col) { ;\n__p += '\\n        <th class=\"' +\n((__t = (col.validate && col.validate.required ? 'field-required' : '')) == null ? '' : __t) +\n'\">\\n          ' +\n((__t = ( col.hideLabel ? '' : ctx.t(col.label || col.title, { _userInput: true }) )) == null ? '' : __t) +\n'\\n          ';\n if (col.tooltip) { ;\n__p += ' <i ref=\"tooltip\" tabindex=\"0\" data-title=\"' +\n((__t = (col.tooltip)) == null ? '' : __t) +\n'\" class=\"' +\n((__t = (ctx.iconClass('question-sign'))) == null ? '' : __t) +\n' text-muted\" data-tooltip=\"' +\n((__t = (col.tooltip)) == null ? '' : __t) +\n'\"></i>';\n } ;\n__p += '\\n        </th>\\n      ';\n }) ;\n__p += '\\n      ';\n if (ctx.hasExtraColumn) { ;\n__p += '\\n      <th>\\n        <span class=\"visually-hidden\">' +\n((__t = ( ctx.t('Add/Remove') )) == null ? '' : __t) +\n'</span>\\n        ';\n if (!ctx.builder && ctx.hasAddButton && ctx.hasTopSubmit) { ;\n__p += '\\n        <button class=\"btn btn-primary formio-button-add-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-addRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\">\\n          <i class=\"' +\n((__t = (ctx.iconClass('plus'))) == null ? '' : __t) +\n'\"></i>' +\n((__t = (ctx.t(ctx.component.addAnother || 'Add Another', { _userInput: true }))) == null ? '' : __t) +\n'\\n        </button>\\n        ';\n } ;\n__p += '\\n      </th>\\n      ';\n } ;\n__p += '\\n    </tr>\\n  </thead>\\n  ';\n } ;\n__p += '\\n  <tbody ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-tbody\" data-key=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\">\\n    ';\n ctx.rows.forEach(function(row, index) { ;\n__p += '\\n    ';\n if (ctx.hasGroups && ctx.groups[index]) { ;\n__p += '\\n    <tr ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-group-header\" class=\"datagrid-group-header' +\n((__t = (ctx.hasToggle ? ' clickable' : '')) == null ? '' : __t) +\n'\">\\n      <td\\n        ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-group-label\"\\n        colspan=\"' +\n((__t = (ctx.numColumns)) == null ? '' : __t) +\n'\"\\n        class=\"datagrid-group-label\">' +\n((__t = (ctx.groups[index].label)) == null ? '' : __t) +\n'</td>\\n    </tr>\\n    ';\n } ;\n__p += '\\n    <tr ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-row\">\\n      ';\n if (ctx.component.reorder) { ;\n__p += '\\n        <td>\\n          <button type=\"button\" class=\"formio-drag-button btn btn-default bi bi-list\" data-key=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\" style=\"display: block; margin: 0 auto\"></button>\\n        </td>\\n      ';\n } ;\n__p += '\\n      ';\n ctx.columns.forEach(function(col) { ;\n__p += '\\n        <td ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\" ';\n if (col.key && col.overlay && col.overlay.width) { ;\n__p += ' style=\"width: ' +\n((__t = (col.overlay.width + 'px')) == null ? '' : __t) +\n'\"';\n } ;\n__p += ' >\\n          ' +\n((__t = (row[col.key])) == null ? '' : __t) +\n'\\n        </td>\\n      ';\n }) ;\n__p += '\\n      ';\n if (ctx.hasExtraColumn) { ;\n__p += '\\n        ';\n if (ctx.hasRemoveButtons) { ;\n__p += '\\n        <td>\\n          <button type=\"button\" class=\"btn btn-secondary formio-button-remove-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-removeRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\" aria-label=\"' +\n((__t = (ctx.t('remove'))) == null ? '' : __t) +\n'\" style=\"display: block; margin: 0 auto\">\\n            <i class=\"' +\n((__t = (ctx.iconClass('remove-circle'))) == null ? '' : __t) +\n'\"></i>\\n          </button>\\n        </td>\\n        ';\n } ;\n__p += '\\n        ';\n if (ctx.canAddColumn) { ;\n__p += '\\n        <td ref=\"' +\n((__t = (ctx.key)) == null ? '' : __t) +\n'-container\" class=\"col-md-3\">\\n          ' +\n((__t = (ctx.placeholder)) == null ? '' : __t) +\n'\\n        </td>\\n        ';\n } ;\n__p += '\\n      ';\n } ;\n__p += '\\n    </tr>\\n    ';\n }) ;\n__p += '\\n  </tbody>\\n  ';\n if (!ctx.builder && ctx.hasAddButton && ctx.hasBottomSubmit) { ;\n__p += '\\n  <tfoot>\\n    <tr>\\n      <td colspan=\"' +\n((__t = (ctx.component.layoutFixed ? ctx.numColumns :  ctx.numColumns + 1)) == null ? '' : __t) +\n'\">\\n        <button class=\"btn btn-primary formio-button-add-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-addRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\">\\n          <i class=\"' +\n((__t = (ctx.iconClass('plus'))) == null ? '' : __t) +\n'\"></i> ' +\n((__t = (ctx.t(ctx.component.addAnother || 'Add Another', { _userInput: true }))) == null ? '' : __t) +\n'\\n        </button>\\n      </td>\\n    </tr>\\n  </tfoot>\\n  ';\n } ;\n__p += '\\n</table>\\n';\nreturn __p\n}\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/bootstrap/lib/cjs/templates/bootstrap5/datagrid/form.ejs.js?");
+eval("Object.defineProperty(exports, \"__esModule\", ({\n  value: true\n}));\nexports[\"default\"]=function(ctx) {\nvar __t, __p = '', __j = Array.prototype.join;\nfunction print() { __p += __j.call(arguments, '') }\n__p += '<table class=\"table datagrid-table table-bordered\\n    ' +\n((__t = ( ctx.component.striped ? 'table-striped' : '')) == null ? '' : __t) +\n'\\n    ' +\n((__t = ( ctx.component.hover ? 'table-hover' : '')) == null ? '' : __t) +\n'\\n    ' +\n((__t = ( ctx.component.condensed ? 'table-sm' : '')) == null ? '' : __t) +\n'\\n    \" ';\n if (ctx.component.layoutFixed || ctx.readOnly) { ;\n__p += 'style=\"table-layout: fixed;\"';\n } ;\n__p += '>\\n  ';\n if (ctx.hasHeader) { ;\n__p += '\\n  <thead>\\n    <tr>\\n      ';\n if (ctx.component.reorder) { ;\n__p += '<th></th>';\n } ;\n__p += '\\n      ';\n ctx.columns.forEach(function(col) { ;\n__p += '\\n        <th class=\"' +\n((__t = (col.validate && col.validate.required ? 'field-required' : '')) == null ? '' : __t) +\n'\">\\n          ' +\n((__t = ( col.hideLabel ? '' : ctx.t(col.label || col.title, { _userInput: true }) )) == null ? '' : __t) +\n'\\n          ';\n if (col.tooltip) { ;\n__p += ' <i ref=\"tooltip\" tabindex=\"0\" data-title=\"' +\n((__t = (col.tooltip)) == null ? '' : __t) +\n'\" class=\"' +\n((__t = (ctx.iconClass('question-sign'))) == null ? '' : __t) +\n' text-muted\" data-tooltip=\"' +\n((__t = (col.tooltip)) == null ? '' : __t) +\n'\"></i>';\n } ;\n__p += '\\n        </th>\\n      ';\n }) ;\n__p += '\\n      ';\n if (ctx.hasExtraColumn) { ;\n__p += '\\n      <th>\\n        <span class=\"visually-hidden\">' +\n((__t = ( ctx.t('Add/Remove') )) == null ? '' : __t) +\n'</span>\\n        ';\n if (!ctx.builder && ctx.hasAddButton && ctx.hasTopSubmit) { ;\n__p += '\\n        <button class=\"btn btn-primary formio-button-add-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-addRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\">\\n          <i class=\"' +\n((__t = (ctx.iconClass('plus'))) == null ? '' : __t) +\n'\"></i>' +\n((__t = (ctx.t(ctx.component.addAnother || 'Add Another', { _userInput: true }))) == null ? '' : __t) +\n'\\n        </button>\\n        ';\n } ;\n__p += '\\n      </th>\\n      ';\n } ;\n__p += '\\n    </tr>\\n  </thead>\\n  ';\n } ;\n__p += '\\n  <tbody ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-tbody\" data-key=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\">\\n    ';\n ctx.rows.forEach(function(row, index) { ;\n__p += '\\n    ';\n if (ctx.hasGroups && ctx.groups[index]) { ;\n__p += '\\n    <tr ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-group-header\" class=\"datagrid-group-header' +\n((__t = (ctx.hasToggle ? ' clickable' : '')) == null ? '' : __t) +\n'\">\\n      <td\\n        ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-group-label\"\\n        colspan=\"' +\n((__t = (ctx.numColumns)) == null ? '' : __t) +\n'\"\\n        class=\"datagrid-group-label\">' +\n((__t = (ctx.groups[index].label)) == null ? '' : __t) +\n'</td>\\n    </tr>\\n    ';\n } ;\n__p += '\\n    <tr ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-row\">\\n      ';\n if (ctx.component.reorder) { ;\n__p += '\\n        <td>\\n          <button type=\"button\" class=\"formio-drag-button btn btn-default bi bi-list\" data-key=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\" style=\"display: block; margin: 0 auto\"></button>\\n        </td>\\n      ';\n } ;\n__p += '\\n      ';\n ctx.columns.forEach(function(col) { ;\n__p += '\\n        <td ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\" ';\n if (col.key && col.overlay && col.overlay.width) { ;\n__p += ' style=\"width: ' +\n((__t = (col.overlay.width + 'px')) == null ? '' : __t) +\n'\"';\n } ;\n__p += ' >\\n          ' +\n((__t = (row[col.key])) == null ? '' : __t) +\n'\\n        </td>\\n      ';\n }) ;\n__p += '\\n      ';\n if (ctx.hasExtraColumn) { ;\n__p += '\\n        ';\n if (ctx.hasRemoveButtons) { ;\n__p += '\\n        <td>\\n          <button type=\"button\" class=\"btn btn-secondary formio-button-remove-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-removeRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\" aria-label=\"' +\n((__t = (ctx.t('remove'))) == null ? '' : __t) +\n'\" style=\"display: block; margin: 0 auto\">\\n            <i class=\"' +\n((__t = (ctx.iconClass('remove-circle'))) == null ? '' : __t) +\n'\"></i>\\n          </button>\\n        </td>\\n        ';\n } ;\n__p += '\\n        ';\n if (ctx.canAddColumn) { ;\n__p += '\\n        <td ref=\"' +\n((__t = (ctx.key)) == null ? '' : __t) +\n'-container\">\\n          ' +\n((__t = (ctx.placeholder)) == null ? '' : __t) +\n'\\n        </td>\\n        ';\n } ;\n__p += '\\n      ';\n } ;\n__p += '\\n    </tr>\\n    ';\n }) ;\n__p += '\\n  </tbody>\\n  ';\n if (!ctx.builder && ctx.hasAddButton && ctx.hasBottomSubmit) { ;\n__p += '\\n  <tfoot>\\n    <tr>\\n      <td colspan=\"' +\n((__t = (ctx.component.layoutFixed ? ctx.numColumns :  ctx.numColumns + 1)) == null ? '' : __t) +\n'\">\\n        <button class=\"btn btn-primary formio-button-add-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-addRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\">\\n          <i class=\"' +\n((__t = (ctx.iconClass('plus'))) == null ? '' : __t) +\n'\"></i> ' +\n((__t = (ctx.t(ctx.component.addAnother || 'Add Another', { _userInput: true }))) == null ? '' : __t) +\n'\\n        </button>\\n      </td>\\n    </tr>\\n  </tfoot>\\n  ';\n } ;\n__p += '\\n</table>\\n';\nreturn __p\n}\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/bootstrap/lib/cjs/templates/bootstrap5/datagrid/form.ejs.js?");
 
 /***/ }),
 
@@ -8894,7 +8894,7 @@ eval("\nvar parent = __webpack_require__(/*! ../../es/object/from-entries */ \".
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nvar _a;\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.FormBuilder = exports.Form = exports.Formio = void 0;\nconst CDN_js_1 = __importDefault(__webpack_require__(/*! ./CDN.js */ \"./lib/cjs/CDN.js\"));\nclass Formio {\n    static setLicense(license, norecurse = false) {\n        _a.license = license;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setLicense(license);\n        }\n    }\n    static setBaseUrl(url, norecurse = false) {\n        _a.baseUrl = url;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setBaseUrl(url);\n        }\n    }\n    static setApiUrl(url, norecurse = false) {\n        _a.baseUrl = url;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setApiUrl(url);\n        }\n    }\n    static setProjectUrl(url, norecurse = false) {\n        _a.projectUrl = url;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setProjectUrl(url);\n        }\n    }\n    static setAppUrl(url, norecurse = false) {\n        _a.projectUrl = url;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setAppUrl(url);\n        }\n    }\n    static setPathType(type, norecurse = false) {\n        _a.pathType = type;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setPathType(type);\n        }\n    }\n    static debug(...args) {\n        if (_a.config.debug) {\n            console.log(...args);\n        }\n    }\n    static clearCache() {\n        if (_a.FormioClass) {\n            _a.FormioClass.clearCache();\n        }\n    }\n    static global(prop, flag = '') {\n        const globalValue = window[prop];\n        if (flag && globalValue && !globalValue[flag]) {\n            return null;\n        }\n        _a.debug(`Getting global ${prop}`, globalValue);\n        return globalValue;\n    }\n    static use(module) {\n        if (_a.FormioClass && _a.FormioClass.isRenderer) {\n            _a.FormioClass.use(module);\n        }\n        else {\n            _a.modules.push(module);\n        }\n    }\n    static createElement(type, attrs, children) {\n        const element = document.createElement(type);\n        if (!attrs) {\n            return element;\n        }\n        Object.keys(attrs).forEach(key => {\n            element.setAttribute(key, attrs[key]);\n        });\n        (children || []).forEach(child => {\n            element.appendChild(_a.createElement(child.tag, child.attrs, child.children));\n        });\n        return element;\n    }\n    static addScript(wrapper, src, name, flag = '') {\n        return __awaiter(this, void 0, void 0, function* () {\n            if (!src) {\n                return Promise.resolve();\n            }\n            if (typeof src !== 'string' && src.length) {\n                return Promise.all(src.map(ref => _a.addScript(wrapper, ref)));\n            }\n            if (name && _a.global(name, flag)) {\n                _a.debug(`${name} already loaded.`);\n                return Promise.resolve(_a.global(name));\n            }\n            _a.debug('Adding Script', src);\n            try {\n                wrapper.appendChild(_a.createElement('script', {\n                    src\n                }));\n            }\n            catch (err) {\n                _a.debug(err);\n                return Promise.resolve();\n            }\n            if (!name) {\n                return Promise.resolve();\n            }\n            return new Promise((resolve) => {\n                _a.debug(`Waiting to load ${name}`);\n                const wait = setInterval(() => {\n                    if (_a.global(name, flag)) {\n                        clearInterval(wait);\n                        _a.debug(`${name} loaded.`);\n                        resolve(_a.global(name));\n                    }\n                }, 100);\n            });\n        });\n    }\n    static addStyles(wrapper, href) {\n        return __awaiter(this, void 0, void 0, function* () {\n            if (!href) {\n                return;\n            }\n            if (typeof href !== 'string' && href.length) {\n                href.forEach(ref => _a.addStyles(wrapper, ref));\n                return;\n            }\n            _a.debug('Adding Styles', href);\n            wrapper.appendChild(_a.createElement('link', {\n                rel: 'stylesheet',\n                href\n            }));\n        });\n    }\n    static submitDone(instance, submission) {\n        return __awaiter(this, void 0, void 0, function* () {\n            _a.debug('Submision Complete', submission);\n            if (_a.config.submitDone) {\n                _a.config.submitDone(submission, instance);\n            }\n            const successMessage = (_a.config.success || '').toString();\n            if (successMessage && successMessage.toLowerCase() !== 'false' && instance.element) {\n                instance.element.innerHTML = `<div class=\"alert-success\" role=\"alert\">${successMessage}</div>`;\n            }\n            let returnUrl = _a.config.redirect;\n            // Allow form based configuration for return url.\n            if (!returnUrl &&\n                (instance._form &&\n                    instance._form.settings &&\n                    (instance._form.settings.returnUrl ||\n                        instance._form.settings.redirect))) {\n                _a.debug('Return url found in form configuration');\n                returnUrl = instance._form.settings.returnUrl || instance._form.settings.redirect;\n            }\n            if (returnUrl) {\n                const formSrc = instance.formio ? instance.formio.formUrl : '';\n                const hasQuery = !!returnUrl.match(/\\?/);\n                const isOrigin = returnUrl.indexOf(location.origin) === 0;\n                returnUrl += hasQuery ? '&' : '?';\n                returnUrl += `sub=${submission._id}`;\n                if (!isOrigin && formSrc) {\n                    returnUrl += `&form=${encodeURIComponent(formSrc)}`;\n                }\n                _a.debug('Return URL', returnUrl);\n                window.location.href = returnUrl;\n                if (isOrigin) {\n                    window.location.reload();\n                }\n            }\n        });\n    }\n    // Return the full script if the builder is being used.\n    static formioScript(script, builder) {\n        builder = builder || _a.config.includeBuilder;\n        if (_a.fullAdded || builder) {\n            _a.fullAdded = true;\n            return script.replace('formio.form', 'formio.full');\n        }\n        return script;\n    }\n    static addLibrary(libWrapper, lib, name) {\n        return __awaiter(this, void 0, void 0, function* () {\n            if (!lib) {\n                return;\n            }\n            if (lib.dependencies) {\n                for (let i = 0; i < lib.dependencies.length; i++) {\n                    const libName = lib.dependencies[i];\n                    yield _a.addLibrary(libWrapper, _a.config.libs[libName], libName);\n                }\n            }\n            if (lib.css) {\n                yield _a.addStyles((lib.global ? document.body : libWrapper), lib.css);\n            }\n            if (lib.js) {\n                const module = yield _a.addScript((lib.global ? document.body : libWrapper), lib.js, lib.use ? name : false);\n                if (lib.use) {\n                    _a.debug(`Using ${name}`);\n                    const options = lib.options || {};\n                    if (!options.license && _a.license) {\n                        options.license = _a.license;\n                    }\n                    _a.use((typeof lib.use === 'function' ? lib.use(module) : module), options);\n                }\n            }\n            if (lib.globalStyle) {\n                const style = _a.createElement('style');\n                style.type = 'text/css';\n                style.innerHTML = lib.globalStyle;\n                document.body.appendChild(style);\n            }\n        });\n    }\n    static addLoader(wrapper) {\n        return __awaiter(this, void 0, void 0, function* () {\n            wrapper.appendChild(_a.createElement('div', {\n                'class': 'formio-loader'\n            }, [{\n                    tag: 'div',\n                    attrs: {\n                        class: 'loader-wrapper'\n                    },\n                    children: [{\n                            tag: 'div',\n                            attrs: {\n                                class: 'loader text-center'\n                            }\n                        }]\n                }]));\n        });\n    }\n    // eslint-disable-next-line max-statements\n    static init(element, options = {}, builder = false) {\n        return __awaiter(this, void 0, void 0, function* () {\n            _a.cdn = new CDN_js_1.default(_a.config.cdn, _a.config.cdnUrls || {});\n            _a.config.libs = _a.config.libs || {\n                uswds: {\n                    dependencies: ['fontawesome'],\n                    js: `${_a.cdn.uswds}/uswds.min.js`,\n                    css: `${_a.cdn.uswds}/uswds.min.css`,\n                    use: true\n                },\n                fontawesome: {\n                    // Due to an issue with font-face not loading in the shadowdom (https://issues.chromium.org/issues/41085401), we need\n                    // to do 2 things. 1.) Load the fonts from the global cdn, and 2.) add the font-face to the global styles on the page.\n                    css: `https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css`,\n                    globalStyle: `@font-face {\n                    font-family: 'FontAwesome';\n                    src: url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.eot?v=4.7.0');\n                    src: url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');\n                    font-weight: normal;\n                    font-style: normal;\n                  }`\n                },\n                bootstrap4: {\n                    dependencies: ['fontawesome'],\n                    css: `${_a.cdn.bootstrap4}/css/bootstrap.min.css`\n                },\n                bootstrap: {\n                    dependencies: ['bootstrap-icons'],\n                    css: `${_a.cdn.bootstrap}/css/bootstrap.min.css`\n                },\n                'bootstrap-icons': {\n                    // Due to an issue with font-face not loading in the shadowdom (https://issues.chromium.org/issues/41085401), we need\n                    // to do 2 things. 1.) Load the fonts from the global cdn, and 2.) add the font-face to the global styles on the page.\n                    css: 'https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.min.css',\n                    globalStyle: `@font-face {\n                    font-display: block;\n                    font-family: \"bootstrap-icons\";\n                    src: url(\"https://cdn.jsdelivr.net/npm/bootstrap-icons/font/fonts/bootstrap-icons.woff2?dd67030699838ea613ee6dbda90effa6\") format(\"woff2\"),\n                         url(\"https://cdn.jsdelivr.net/npm/bootstrap-icons/font/fonts/bootstrap-icons.woff?dd67030699838ea613ee6dbda90effa6\") format(\"woff\");\n                }`\n                }\n            };\n            // Add all bootswatch templates.\n            ['cerulean', 'cosmo', 'cyborg', 'darkly', 'flatly', 'journal', 'litera', 'lumen', 'lux', 'materia', 'minty', 'pulse', 'sandstone', 'simplex', 'sketchy', 'slate', 'solar', 'spacelab', 'superhero', 'united', 'yeti'].forEach((template) => {\n                _a.config.libs[template] = {\n                    dependencies: ['bootstrap-icons'],\n                    css: `${_a.cdn.bootswatch}/dist/${template}/bootstrap.min.css`\n                };\n            });\n            const id = _a.config.id || `formio-${Math.random().toString(36).substring(7)}`;\n            // Create a new wrapper and add the element inside of a new wrapper.\n            let wrapper = _a.createElement('div', {\n                'id': `${id}-wrapper`\n            });\n            element.parentNode.insertBefore(wrapper, element);\n            // If we include the libraries, then we will attempt to run this in shadow dom.\n            const useShadowDom = _a.config.includeLibs && !_a.config.noshadow && (typeof wrapper.attachShadow === 'function');\n            if (useShadowDom) {\n                wrapper = wrapper.attachShadow({\n                    mode: 'open'\n                });\n                options.shadowRoot = wrapper;\n            }\n            element.parentNode.removeChild(element);\n            wrapper.appendChild(element);\n            // If this is inside of shadow dom, then we need to add the styles and scripts to the shadow dom.\n            const libWrapper = useShadowDom ? wrapper : document.body;\n            // Load the renderer styles.\n            yield _a.addStyles(libWrapper, _a.config.embedCSS || `${_a.cdn.js}/formio.embed.css`);\n            // Add a loader.\n            _a.addLoader(wrapper);\n            const formioSrc = _a.config.full ? 'formio.full' : 'formio.form';\n            const renderer = _a.config.debug ? formioSrc : `${formioSrc}.min`;\n            _a.FormioClass = yield _a.addScript(libWrapper, _a.formioScript(_a.config.script || `${_a.cdn.js}/${renderer}.js`, builder), 'Formio', builder ? 'isBuilder' : 'isRenderer');\n            _a.FormioClass.cdn = _a.cdn;\n            _a.FormioClass.setBaseUrl(options.baseUrl || _a.baseUrl || _a.config.base);\n            _a.FormioClass.setProjectUrl(options.projectUrl || _a.projectUrl || _a.config.project);\n            _a.FormioClass.language = _a.language;\n            _a.setLicense(_a.license || _a.config.license || false);\n            _a.modules.forEach((module) => {\n                _a.FormioClass.use(module);\n            });\n            if (_a.icons) {\n                _a.FormioClass.icons = _a.icons;\n            }\n            if (_a.pathType) {\n                _a.FormioClass.setPathType(_a.pathType);\n            }\n            // Add libraries if they wish to include the libs.\n            if (_a.config.template && _a.config.includeLibs) {\n                yield _a.addLibrary(libWrapper, _a.config.libs[_a.config.template], _a.config.template);\n            }\n            if (!_a.config.libraries) {\n                _a.config.libraries = _a.config.modules || {};\n            }\n            // Adding premium if it is provided via the config.\n            if (_a.config.premium) {\n                _a.config.libraries.premium = _a.config.premium;\n            }\n            // Allow adding dynamic modules.\n            if (_a.config.libraries) {\n                for (const name in _a.config.libraries) {\n                    const lib = _a.config.libraries[name];\n                    lib.use = lib.use || true;\n                    yield _a.addLibrary(libWrapper, lib, name);\n                }\n            }\n            yield _a.addStyles(libWrapper, _a.formioScript(_a.config.style || `${_a.cdn.js}/${renderer}.css`, builder));\n            if (_a.config.before) {\n                yield _a.config.before(_a.FormioClass, element, _a.config);\n            }\n            _a.FormioClass.license = true;\n            _a._formioReady(_a.FormioClass);\n            return wrapper;\n        });\n    }\n    // Called after an instance has been created.\n    static afterCreate(instance, wrapper, readyEvent) {\n        return __awaiter(this, void 0, void 0, function* () {\n            const loader = wrapper.querySelector('.formio-loader');\n            if (loader) {\n                wrapper.removeChild(loader);\n            }\n            _a.FormioClass.events.emit(readyEvent, instance);\n            if (_a.config.after) {\n                _a.debug('Calling ready callback');\n                _a.config.after(instance, _a.config);\n            }\n            return instance;\n        });\n    }\n    // Create a new form.\n    static createForm(element, form, options = {}) {\n        return __awaiter(this, void 0, void 0, function* () {\n            if (_a.FormioClass) {\n                return _a.FormioClass.createForm(element, form, Object.assign(Object.assign({}, options), { noLoader: true }));\n            }\n            const wrapper = yield _a.init(element, options);\n            return _a.FormioClass.createForm(element, form, Object.assign(Object.assign({}, options), { noLoader: true })).then((instance) => {\n                // Set the default submission data.\n                if (_a.config.submission) {\n                    _a.debug('Setting submission', _a.config.submission);\n                    instance.submission = _a.config.submission;\n                }\n                // Call the after create method.\n                _a.afterCreate(instance, wrapper, 'formEmbedded');\n                return instance;\n            });\n        });\n    }\n    // Create a form builder.\n    static builder(element, form, options = {}) {\n        var _b;\n        return __awaiter(this, void 0, void 0, function* () {\n            if ((_b = _a.FormioClass) === null || _b === void 0 ? void 0 : _b.builder) {\n                return _a.FormioClass.builder(element, form, options);\n            }\n            const wrapper = yield _a.init(element, options, true);\n            return _a.FormioClass.builder(element, form, options).then((instance) => {\n                _a.afterCreate(instance, wrapper, 'builderEmbedded');\n                return instance;\n            });\n        });\n    }\n}\nexports.Formio = Formio;\n_a = Formio;\nFormio.FormioClass = null;\nFormio.config = {};\nFormio.modules = [];\nFormio.icons = '';\nFormio.license = '';\nFormio.formioReady = new Promise((ready, reject) => {\n    _a._formioReady = ready;\n    _a._formioReadyReject = reject;\n});\nFormio.version = '5.2.1-rc.5';\n// Create a report.\nFormio.Report = {\n    create: (element, submission, options = {}) => __awaiter(void 0, void 0, void 0, function* () {\n        var _b;\n        if ((_b = _a.FormioClass) === null || _b === void 0 ? void 0 : _b.Report) {\n            return _a.FormioClass.Report.create(element, submission, options);\n        }\n        const wrapper = yield _a.init(element, options, true);\n        return _a.FormioClass.Report.create(element, submission, options).then((instance) => {\n            _a.afterCreate(instance, wrapper, 'reportEmbedded');\n            return instance;\n        });\n    })\n};\nCDN_js_1.default.defaultCDN = Formio.version.includes('rc') ? 'https://cdn.test-form.io' : 'https://cdn.form.io';\nclass Form {\n    constructor(element, form, options) {\n        this.form = form;\n        this.element = element;\n        this.options = options || {};\n        this.init();\n        this.instance = {\n            proxy: true,\n            ready: this.ready,\n            destroy: () => { }\n        };\n    }\n    init() {\n        if (this.instance && !this.instance.proxy) {\n            this.instance.destroy();\n        }\n        this.element.innerHTML = '';\n        this.ready = this.create().then((instance) => {\n            this.instance = instance;\n            this.form = instance.form;\n            return instance;\n        });\n    }\n    create() {\n        return Formio.createForm(this.element, this.form, this.options);\n    }\n    setForm(form) {\n        this.form = form;\n        if (this.instance) {\n            this.instance.setForm(form);\n        }\n    }\n    setDisplay(display) {\n        if (this.instance.proxy) {\n            return this.ready;\n        }\n        this.form.display = display;\n        this.instance.destroy();\n        this.ready = this.create().then((instance) => {\n            this.instance = instance;\n            this.setForm(this.form);\n        });\n        return this.ready;\n    }\n}\nexports.Form = Form;\nclass FormBuilder extends Form {\n    create() {\n        return Formio.builder(this.element, this.form, this.options);\n    }\n}\nexports.FormBuilder = FormBuilder;\nFormio.Form = Form;\nFormio.FormBuilder = FormBuilder;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Embed.js?");
+eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nvar _a;\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.FormBuilder = exports.Form = exports.Formio = void 0;\nconst CDN_js_1 = __importDefault(__webpack_require__(/*! ./CDN.js */ \"./lib/cjs/CDN.js\"));\nclass Formio {\n    static setLicense(license, norecurse = false) {\n        _a.license = license;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setLicense(license);\n        }\n    }\n    static setBaseUrl(url, norecurse = false) {\n        _a.baseUrl = url;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setBaseUrl(url);\n        }\n    }\n    static setApiUrl(url, norecurse = false) {\n        _a.baseUrl = url;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setApiUrl(url);\n        }\n    }\n    static setProjectUrl(url, norecurse = false) {\n        _a.projectUrl = url;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setProjectUrl(url);\n        }\n    }\n    static setAppUrl(url, norecurse = false) {\n        _a.projectUrl = url;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setAppUrl(url);\n        }\n    }\n    static setPathType(type, norecurse = false) {\n        _a.pathType = type;\n        if (!norecurse && _a.FormioClass) {\n            _a.FormioClass.setPathType(type);\n        }\n    }\n    static debug(...args) {\n        if (_a.config.debug) {\n            console.log(...args);\n        }\n    }\n    static clearCache() {\n        if (_a.FormioClass) {\n            _a.FormioClass.clearCache();\n        }\n    }\n    static global(prop, flag = '') {\n        const globalValue = window[prop];\n        if (flag && globalValue && !globalValue[flag]) {\n            return null;\n        }\n        _a.debug(`Getting global ${prop}`, globalValue);\n        return globalValue;\n    }\n    static use(module) {\n        if (_a.FormioClass && _a.FormioClass.isRenderer) {\n            _a.FormioClass.use(module);\n        }\n        else {\n            _a.modules.push(module);\n        }\n    }\n    static createElement(type, attrs, children) {\n        const element = document.createElement(type);\n        if (!attrs) {\n            return element;\n        }\n        Object.keys(attrs).forEach(key => {\n            element.setAttribute(key, attrs[key]);\n        });\n        (children || []).forEach(child => {\n            element.appendChild(_a.createElement(child.tag, child.attrs, child.children));\n        });\n        return element;\n    }\n    static addScript(wrapper, src, name, flag = '') {\n        return __awaiter(this, void 0, void 0, function* () {\n            if (!src) {\n                return Promise.resolve();\n            }\n            if (typeof src !== 'string' && src.length) {\n                return Promise.all(src.map(ref => _a.addScript(wrapper, ref)));\n            }\n            if (name && _a.global(name, flag)) {\n                _a.debug(`${name} already loaded.`);\n                return Promise.resolve(_a.global(name));\n            }\n            _a.debug('Adding Script', src);\n            try {\n                wrapper.appendChild(_a.createElement('script', {\n                    src\n                }));\n            }\n            catch (err) {\n                _a.debug(err);\n                return Promise.resolve();\n            }\n            if (!name) {\n                return Promise.resolve();\n            }\n            return new Promise((resolve) => {\n                _a.debug(`Waiting to load ${name}`);\n                const wait = setInterval(() => {\n                    if (_a.global(name, flag)) {\n                        clearInterval(wait);\n                        _a.debug(`${name} loaded.`);\n                        resolve(_a.global(name));\n                    }\n                }, 100);\n            });\n        });\n    }\n    static addStyles(wrapper, href) {\n        return __awaiter(this, void 0, void 0, function* () {\n            if (!href) {\n                return;\n            }\n            if (typeof href !== 'string' && href.length) {\n                href.forEach(ref => _a.addStyles(wrapper, ref));\n                return;\n            }\n            _a.debug('Adding Styles', href);\n            wrapper.appendChild(_a.createElement('link', {\n                rel: 'stylesheet',\n                href\n            }));\n        });\n    }\n    static submitDone(instance, submission) {\n        return __awaiter(this, void 0, void 0, function* () {\n            _a.debug('Submision Complete', submission);\n            if (_a.config.submitDone) {\n                _a.config.submitDone(submission, instance);\n            }\n            const successMessage = (_a.config.success || '').toString();\n            if (successMessage && successMessage.toLowerCase() !== 'false' && instance.element) {\n                instance.element.innerHTML = `<div class=\"alert-success\" role=\"alert\">${successMessage}</div>`;\n            }\n            let returnUrl = _a.config.redirect;\n            // Allow form based configuration for return url.\n            if (!returnUrl &&\n                (instance._form &&\n                    instance._form.settings &&\n                    (instance._form.settings.returnUrl ||\n                        instance._form.settings.redirect))) {\n                _a.debug('Return url found in form configuration');\n                returnUrl = instance._form.settings.returnUrl || instance._form.settings.redirect;\n            }\n            if (returnUrl) {\n                const formSrc = instance.formio ? instance.formio.formUrl : '';\n                const hasQuery = !!returnUrl.match(/\\?/);\n                const isOrigin = returnUrl.indexOf(location.origin) === 0;\n                returnUrl += hasQuery ? '&' : '?';\n                returnUrl += `sub=${submission._id}`;\n                if (!isOrigin && formSrc) {\n                    returnUrl += `&form=${encodeURIComponent(formSrc)}`;\n                }\n                _a.debug('Return URL', returnUrl);\n                window.location.href = returnUrl;\n                if (isOrigin) {\n                    window.location.reload();\n                }\n            }\n        });\n    }\n    // Return the full script if the builder is being used.\n    static formioScript(script, builder) {\n        builder = builder || _a.config.includeBuilder;\n        if (_a.fullAdded || builder) {\n            _a.fullAdded = true;\n            return script.replace('formio.form', 'formio.full');\n        }\n        return script;\n    }\n    static addLibrary(libWrapper, lib, name) {\n        return __awaiter(this, void 0, void 0, function* () {\n            if (!lib) {\n                return;\n            }\n            if (lib.dependencies) {\n                for (let i = 0; i < lib.dependencies.length; i++) {\n                    const libName = lib.dependencies[i];\n                    yield _a.addLibrary(libWrapper, _a.config.libs[libName], libName);\n                }\n            }\n            if (lib.css) {\n                yield _a.addStyles((lib.global ? document.body : libWrapper), lib.css);\n            }\n            if (lib.js) {\n                const module = yield _a.addScript((lib.global ? document.body : libWrapper), lib.js, lib.use ? name : false);\n                if (lib.use) {\n                    _a.debug(`Using ${name}`);\n                    const options = lib.options || {};\n                    if (!options.license && _a.license) {\n                        options.license = _a.license;\n                    }\n                    _a.use((typeof lib.use === 'function' ? lib.use(module) : module), options);\n                }\n            }\n            if (lib.globalStyle) {\n                const style = _a.createElement('style');\n                style.type = 'text/css';\n                style.innerHTML = lib.globalStyle;\n                document.body.appendChild(style);\n            }\n        });\n    }\n    static addLoader(wrapper) {\n        return __awaiter(this, void 0, void 0, function* () {\n            wrapper.appendChild(_a.createElement('div', {\n                'class': 'formio-loader'\n            }, [{\n                    tag: 'div',\n                    attrs: {\n                        class: 'loader-wrapper'\n                    },\n                    children: [{\n                            tag: 'div',\n                            attrs: {\n                                class: 'loader text-center'\n                            }\n                        }]\n                }]));\n        });\n    }\n    // eslint-disable-next-line max-statements\n    static init(element, options = {}, builder = false) {\n        return __awaiter(this, void 0, void 0, function* () {\n            _a.cdn = new CDN_js_1.default(_a.config.cdn, _a.config.cdnUrls || {});\n            _a.config.libs = _a.config.libs || {\n                uswds: {\n                    dependencies: ['fontawesome'],\n                    js: `${_a.cdn.uswds}/uswds.min.js`,\n                    css: `${_a.cdn.uswds}/uswds.min.css`,\n                    use: true\n                },\n                fontawesome: {\n                    // Due to an issue with font-face not loading in the shadowdom (https://issues.chromium.org/issues/41085401), we need\n                    // to do 2 things. 1.) Load the fonts from the global cdn, and 2.) add the font-face to the global styles on the page.\n                    css: `https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css`,\n                    globalStyle: `@font-face {\n                    font-family: 'FontAwesome';\n                    src: url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.eot?v=4.7.0');\n                    src: url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');\n                    font-weight: normal;\n                    font-style: normal;\n                  }`\n                },\n                bootstrap4: {\n                    dependencies: ['fontawesome'],\n                    css: `${_a.cdn.bootstrap4}/css/bootstrap.min.css`\n                },\n                bootstrap: {\n                    dependencies: ['bootstrap-icons'],\n                    css: `${_a.cdn.bootstrap}/css/bootstrap.min.css`\n                },\n                'bootstrap-icons': {\n                    // Due to an issue with font-face not loading in the shadowdom (https://issues.chromium.org/issues/41085401), we need\n                    // to do 2 things. 1.) Load the fonts from the global cdn, and 2.) add the font-face to the global styles on the page.\n                    css: 'https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.min.css',\n                    globalStyle: `@font-face {\n                    font-display: block;\n                    font-family: \"bootstrap-icons\";\n                    src: url(\"https://cdn.jsdelivr.net/npm/bootstrap-icons/font/fonts/bootstrap-icons.woff2?dd67030699838ea613ee6dbda90effa6\") format(\"woff2\"),\n                         url(\"https://cdn.jsdelivr.net/npm/bootstrap-icons/font/fonts/bootstrap-icons.woff?dd67030699838ea613ee6dbda90effa6\") format(\"woff\");\n                }`\n                }\n            };\n            // Add all bootswatch templates.\n            ['cerulean', 'cosmo', 'cyborg', 'darkly', 'flatly', 'journal', 'litera', 'lumen', 'lux', 'materia', 'minty', 'pulse', 'sandstone', 'simplex', 'sketchy', 'slate', 'solar', 'spacelab', 'superhero', 'united', 'yeti'].forEach((template) => {\n                _a.config.libs[template] = {\n                    dependencies: ['bootstrap-icons'],\n                    css: `${_a.cdn.bootswatch}/dist/${template}/bootstrap.min.css`\n                };\n            });\n            const id = _a.config.id || `formio-${Math.random().toString(36).substring(7)}`;\n            // Create a new wrapper and add the element inside of a new wrapper.\n            let wrapper = _a.createElement('div', {\n                'id': `${id}-wrapper`\n            });\n            element.parentNode.insertBefore(wrapper, element);\n            // If we include the libraries, then we will attempt to run this in shadow dom.\n            const useShadowDom = _a.config.includeLibs && !_a.config.noshadow && (typeof wrapper.attachShadow === 'function');\n            if (useShadowDom) {\n                wrapper = wrapper.attachShadow({\n                    mode: 'open'\n                });\n                options.shadowRoot = wrapper;\n            }\n            element.parentNode.removeChild(element);\n            wrapper.appendChild(element);\n            // If this is inside of shadow dom, then we need to add the styles and scripts to the shadow dom.\n            const libWrapper = useShadowDom ? wrapper : document.body;\n            // Load the renderer styles.\n            yield _a.addStyles(libWrapper, _a.config.embedCSS || `${_a.cdn.js}/formio.embed.css`);\n            // Add a loader.\n            _a.addLoader(wrapper);\n            const formioSrc = _a.config.full ? 'formio.full' : 'formio.form';\n            const renderer = _a.config.debug ? formioSrc : `${formioSrc}.min`;\n            _a.FormioClass = yield _a.addScript(libWrapper, _a.formioScript(_a.config.script || `${_a.cdn.js}/${renderer}.js`, builder), 'Formio', builder ? 'isBuilder' : 'isRenderer');\n            _a.FormioClass.cdn = _a.cdn;\n            _a.FormioClass.setBaseUrl(options.baseUrl || _a.baseUrl || _a.config.base);\n            _a.FormioClass.setProjectUrl(options.projectUrl || _a.projectUrl || _a.config.project);\n            _a.FormioClass.language = _a.language;\n            _a.setLicense(_a.license || _a.config.license || false);\n            _a.modules.forEach((module) => {\n                _a.FormioClass.use(module);\n            });\n            if (_a.icons) {\n                _a.FormioClass.icons = _a.icons;\n            }\n            if (_a.pathType) {\n                _a.FormioClass.setPathType(_a.pathType);\n            }\n            // Add libraries if they wish to include the libs.\n            if (_a.config.template && _a.config.includeLibs) {\n                yield _a.addLibrary(libWrapper, _a.config.libs[_a.config.template], _a.config.template);\n            }\n            if (!_a.config.libraries) {\n                _a.config.libraries = _a.config.modules || {};\n            }\n            // Adding premium if it is provided via the config.\n            if (_a.config.premium) {\n                _a.config.libraries.premium = _a.config.premium;\n            }\n            // Allow adding dynamic modules.\n            if (_a.config.libraries) {\n                for (const name in _a.config.libraries) {\n                    const lib = _a.config.libraries[name];\n                    lib.use = lib.use || true;\n                    yield _a.addLibrary(libWrapper, lib, name);\n                }\n            }\n            yield _a.addStyles(libWrapper, _a.formioScript(_a.config.style || `${_a.cdn.js}/${renderer}.css`, builder));\n            if (_a.config.before) {\n                yield _a.config.before(_a.FormioClass, element, _a.config);\n            }\n            _a.FormioClass.license = true;\n            _a._formioReady(_a.FormioClass);\n            return wrapper;\n        });\n    }\n    // Called after an instance has been created.\n    static afterCreate(instance, wrapper, readyEvent) {\n        return __awaiter(this, void 0, void 0, function* () {\n            const loader = wrapper.querySelector('.formio-loader');\n            if (loader) {\n                wrapper.removeChild(loader);\n            }\n            _a.FormioClass.events.emit(readyEvent, instance);\n            if (_a.config.after) {\n                _a.debug('Calling ready callback');\n                _a.config.after(instance, _a.config);\n            }\n            return instance;\n        });\n    }\n    // Create a new form.\n    static createForm(element, form, options = {}) {\n        return __awaiter(this, void 0, void 0, function* () {\n            if (_a.FormioClass) {\n                return _a.FormioClass.createForm(element, form, Object.assign(Object.assign({}, options), { noLoader: true }));\n            }\n            const wrapper = yield _a.init(element, options);\n            return _a.FormioClass.createForm(element, form, Object.assign(Object.assign({}, options), { noLoader: true })).then((instance) => {\n                // Set the default submission data.\n                if (_a.config.submission) {\n                    _a.debug('Setting submission', _a.config.submission);\n                    instance.submission = _a.config.submission;\n                }\n                // Call the after create method.\n                _a.afterCreate(instance, wrapper, 'formEmbedded');\n                return instance;\n            });\n        });\n    }\n    // Create a form builder.\n    static builder(element, form, options = {}) {\n        var _b;\n        return __awaiter(this, void 0, void 0, function* () {\n            if ((_b = _a.FormioClass) === null || _b === void 0 ? void 0 : _b.builder) {\n                return _a.FormioClass.builder(element, form, options);\n            }\n            const wrapper = yield _a.init(element, options, true);\n            return _a.FormioClass.builder(element, form, options).then((instance) => {\n                _a.afterCreate(instance, wrapper, 'builderEmbedded');\n                return instance;\n            });\n        });\n    }\n}\nexports.Formio = Formio;\n_a = Formio;\nFormio.FormioClass = null;\nFormio.config = {};\nFormio.modules = [];\nFormio.icons = '';\nFormio.license = '';\nFormio.formioReady = new Promise((ready, reject) => {\n    _a._formioReady = ready;\n    _a._formioReadyReject = reject;\n});\nFormio.version = '5.2.1-rc.6';\n// Create a report.\nFormio.Report = {\n    create: (element, submission, options = {}) => __awaiter(void 0, void 0, void 0, function* () {\n        var _b;\n        if ((_b = _a.FormioClass) === null || _b === void 0 ? void 0 : _b.Report) {\n            return _a.FormioClass.Report.create(element, submission, options);\n        }\n        const wrapper = yield _a.init(element, options, true);\n        return _a.FormioClass.Report.create(element, submission, options).then((instance) => {\n            _a.afterCreate(instance, wrapper, 'reportEmbedded');\n            return instance;\n        });\n    })\n};\nCDN_js_1.default.defaultCDN = Formio.version.includes('rc') ? 'https://cdn.test-form.io' : 'https://cdn.form.io';\nclass Form {\n    constructor(element, form, options) {\n        this.form = form;\n        this.element = element;\n        this.options = options || {};\n        this.init();\n        this.instance = {\n            proxy: true,\n            ready: this.ready,\n            destroy: () => { }\n        };\n    }\n    init() {\n        if (this.instance && !this.instance.proxy) {\n            this.instance.destroy();\n        }\n        this.element.innerHTML = '';\n        this.ready = this.create().then((instance) => {\n            this.instance = instance;\n            this.form = instance.form;\n            return instance;\n        });\n    }\n    create() {\n        return Formio.createForm(this.element, this.form, this.options);\n    }\n    setForm(form) {\n        this.form = form;\n        if (this.instance) {\n            this.instance.setForm(form);\n        }\n    }\n    setDisplay(display) {\n        if (this.instance.proxy) {\n            return this.ready;\n        }\n        this.form.display = display;\n        this.instance.destroy();\n        this.ready = this.create().then((instance) => {\n            this.instance = instance;\n            this.setForm(this.form);\n        });\n        return this.ready;\n    }\n}\nexports.Form = Form;\nclass FormBuilder extends Form {\n    create() {\n        return Formio.builder(this.element, this.form, this.options);\n    }\n}\nexports.FormBuilder = FormBuilder;\nFormio.Form = Form;\nFormio.FormBuilder = FormBuilder;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Embed.js?");
 
 /***/ }),
 
@@ -8905,7 +8905,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Formio = void 0;\nconst sdk_1 = __webpack_require__(/*! @formio/core/sdk */ \"./node_modules/@formio/core/lib/sdk/index.js\");\nObject.defineProperty(exports, \"Formio\", ({ enumerable: true, get: function () { return sdk_1.Formio; } }));\nconst Embed_1 = __webpack_require__(/*! ./Embed */ \"./lib/cjs/Embed.js\");\nconst CDN_1 = __importDefault(__webpack_require__(/*! ./CDN */ \"./lib/cjs/CDN.js\"));\nconst providers_1 = __importDefault(__webpack_require__(/*! ./providers */ \"./lib/cjs/providers/index.js\"));\nsdk_1.Formio.cdn = new CDN_1.default();\nsdk_1.Formio.Providers = providers_1.default;\nsdk_1.Formio.version = '5.2.1-rc.5';\nCDN_1.default.defaultCDN = sdk_1.Formio.version.includes('rc') ? 'https://cdn.test-form.io' : 'https://cdn.form.io';\nconst isNil = (val) => val === null || val === undefined;\nsdk_1.Formio.prototype.uploadFile = function (storage, file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, uploadStartCallback, abortCallback, multipartOptions) {\n    const requestArgs = {\n        provider: storage,\n        method: 'upload',\n        file: file,\n        fileName: fileName,\n        dir: dir\n    };\n    fileKey = fileKey || 'file';\n    const request = sdk_1.Formio.pluginWait('preRequest', requestArgs)\n        .then(() => {\n        return sdk_1.Formio.pluginGet('fileRequest', requestArgs)\n            .then((result) => {\n            if (storage && isNil(result)) {\n                const Provider = providers_1.default.getProvider('storage', storage);\n                if (Provider) {\n                    const provider = new Provider(this);\n                    if (uploadStartCallback) {\n                        uploadStartCallback();\n                    }\n                    return provider.uploadFile(file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, abortCallback, multipartOptions);\n                }\n                else {\n                    throw ('Storage provider not found');\n                }\n            }\n            return result || { url: '' };\n        });\n    });\n    return sdk_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);\n};\nsdk_1.Formio.prototype.downloadFile = function (file, options) {\n    const requestArgs = {\n        method: 'download',\n        file: file\n    };\n    const request = sdk_1.Formio.pluginWait('preRequest', requestArgs)\n        .then(() => {\n        return sdk_1.Formio.pluginGet('fileRequest', requestArgs)\n            .then((result) => {\n            if (file.storage && isNil(result)) {\n                const Provider = providers_1.default.getProvider('storage', file.storage);\n                if (Provider) {\n                    const provider = new Provider(this);\n                    return provider.downloadFile(file, options);\n                }\n                else {\n                    throw ('Storage provider not found');\n                }\n            }\n            return result || { url: '' };\n        });\n    });\n    return sdk_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);\n};\nsdk_1.Formio.prototype.deleteFile = function (file, options) {\n    const requestArgs = {\n        method: 'delete',\n        file: file\n    };\n    const request = sdk_1.Formio.pluginWait('preRequest', requestArgs)\n        .then(() => {\n        return sdk_1.Formio.pluginGet('fileRequest', requestArgs)\n            .then((result) => {\n            if (file.storage && isNil(result)) {\n                const Provider = providers_1.default.getProvider('storage', file.storage);\n                if (Provider) {\n                    const provider = new Provider(this);\n                    return provider.deleteFile(file, options);\n                }\n                else {\n                    throw ('Storage provider not found');\n                }\n            }\n            return result || { url: '' };\n        });\n    });\n    return sdk_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);\n};\n// Esnure we proxy the following methods to the FormioEmbed class.\n['setBaseUrl', 'setApiUrl', 'setAppUrl', 'setProjectUrl', 'setPathType', 'setLicense'].forEach((fn) => {\n    const baseFn = sdk_1.Formio[fn];\n    sdk_1.Formio[fn] = function (arg) {\n        const retVal = Embed_1.Formio[fn](arg, true);\n        return baseFn ? baseFn.call(this, arg) : retVal;\n    };\n});\n// For reverse compatability.\nsdk_1.Formio.Promise = Promise;\nsdk_1.Formio.formioReady = Embed_1.Formio.formioReady;\nsdk_1.Formio.config = Embed_1.Formio.config;\nsdk_1.Formio.builder = Embed_1.Formio.builder;\nsdk_1.Formio.Report = Embed_1.Formio.Report;\nsdk_1.Formio.Form = Embed_1.Formio.Form;\nsdk_1.Formio.FormBuilder = Embed_1.Formio.FormBuilder;\nsdk_1.Formio.use = Embed_1.Formio.use;\nsdk_1.Formio.createForm = Embed_1.Formio.createForm;\nsdk_1.Formio.submitDone = Embed_1.Formio.submitDone;\nsdk_1.Formio.addLibrary = Embed_1.Formio.addLibrary;\nsdk_1.Formio.addLoader = Embed_1.Formio.addLoader;\nsdk_1.Formio.addToGlobal = (global) => {\n    if (typeof global === 'object' && !global.Formio) {\n        global.Formio = sdk_1.Formio;\n    }\n};\nif (typeof __webpack_require__.g !== 'undefined') {\n    sdk_1.Formio.addToGlobal(__webpack_require__.g);\n}\nif (typeof window !== 'undefined') {\n    sdk_1.Formio.addToGlobal(window);\n}\nEmbed_1.Formio._formioReady(sdk_1.Formio);\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Formio.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.Formio = void 0;\nconst sdk_1 = __webpack_require__(/*! @formio/core/sdk */ \"./node_modules/@formio/core/lib/sdk/index.js\");\nObject.defineProperty(exports, \"Formio\", ({ enumerable: true, get: function () { return sdk_1.Formio; } }));\nconst Embed_1 = __webpack_require__(/*! ./Embed */ \"./lib/cjs/Embed.js\");\nconst CDN_1 = __importDefault(__webpack_require__(/*! ./CDN */ \"./lib/cjs/CDN.js\"));\nconst providers_1 = __importDefault(__webpack_require__(/*! ./providers */ \"./lib/cjs/providers/index.js\"));\nsdk_1.Formio.cdn = new CDN_1.default();\nsdk_1.Formio.Providers = providers_1.default;\nsdk_1.Formio.version = '5.2.1-rc.6';\nCDN_1.default.defaultCDN = sdk_1.Formio.version.includes('rc') ? 'https://cdn.test-form.io' : 'https://cdn.form.io';\nconst isNil = (val) => val === null || val === undefined;\nsdk_1.Formio.prototype.uploadFile = function (storage, file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, uploadStartCallback, abortCallback, multipartOptions) {\n    const requestArgs = {\n        provider: storage,\n        method: 'upload',\n        file: file,\n        fileName: fileName,\n        dir: dir\n    };\n    fileKey = fileKey || 'file';\n    const request = sdk_1.Formio.pluginWait('preRequest', requestArgs)\n        .then(() => {\n        return sdk_1.Formio.pluginGet('fileRequest', requestArgs)\n            .then((result) => {\n            if (storage && isNil(result)) {\n                const Provider = providers_1.default.getProvider('storage', storage);\n                if (Provider) {\n                    const provider = new Provider(this);\n                    if (uploadStartCallback) {\n                        uploadStartCallback();\n                    }\n                    return provider.uploadFile(file, fileName, dir, progressCallback, url, options, fileKey, groupPermissions, groupId, abortCallback, multipartOptions);\n                }\n                else {\n                    throw ('Storage provider not found');\n                }\n            }\n            return result || { url: '' };\n        });\n    });\n    return sdk_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);\n};\nsdk_1.Formio.prototype.downloadFile = function (file, options) {\n    const requestArgs = {\n        method: 'download',\n        file: file\n    };\n    const request = sdk_1.Formio.pluginWait('preRequest', requestArgs)\n        .then(() => {\n        return sdk_1.Formio.pluginGet('fileRequest', requestArgs)\n            .then((result) => {\n            if (file.storage && isNil(result)) {\n                const Provider = providers_1.default.getProvider('storage', file.storage);\n                if (Provider) {\n                    const provider = new Provider(this);\n                    return provider.downloadFile(file, options);\n                }\n                else {\n                    throw ('Storage provider not found');\n                }\n            }\n            return result || { url: '' };\n        });\n    });\n    return sdk_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);\n};\nsdk_1.Formio.prototype.deleteFile = function (file, options) {\n    const requestArgs = {\n        method: 'delete',\n        file: file\n    };\n    const request = sdk_1.Formio.pluginWait('preRequest', requestArgs)\n        .then(() => {\n        return sdk_1.Formio.pluginGet('fileRequest', requestArgs)\n            .then((result) => {\n            if (file.storage && isNil(result)) {\n                const Provider = providers_1.default.getProvider('storage', file.storage);\n                if (Provider) {\n                    const provider = new Provider(this);\n                    return provider.deleteFile(file, options);\n                }\n                else {\n                    throw ('Storage provider not found');\n                }\n            }\n            return result || { url: '' };\n        });\n    });\n    return sdk_1.Formio.pluginAlter('wrapFileRequestPromise', request, requestArgs);\n};\n// Esnure we proxy the following methods to the FormioEmbed class.\n['setBaseUrl', 'setApiUrl', 'setAppUrl', 'setProjectUrl', 'setPathType', 'setLicense'].forEach((fn) => {\n    const baseFn = sdk_1.Formio[fn];\n    sdk_1.Formio[fn] = function (arg) {\n        const retVal = Embed_1.Formio[fn](arg, true);\n        return baseFn ? baseFn.call(this, arg) : retVal;\n    };\n});\n// For reverse compatability.\nsdk_1.Formio.Promise = Promise;\nsdk_1.Formio.formioReady = Embed_1.Formio.formioReady;\nsdk_1.Formio.config = Embed_1.Formio.config;\nsdk_1.Formio.builder = Embed_1.Formio.builder;\nsdk_1.Formio.Report = Embed_1.Formio.Report;\nsdk_1.Formio.Form = Embed_1.Formio.Form;\nsdk_1.Formio.FormBuilder = Embed_1.Formio.FormBuilder;\nsdk_1.Formio.use = Embed_1.Formio.use;\nsdk_1.Formio.createForm = Embed_1.Formio.createForm;\nsdk_1.Formio.submitDone = Embed_1.Formio.submitDone;\nsdk_1.Formio.addLibrary = Embed_1.Formio.addLibrary;\nsdk_1.Formio.addLoader = Embed_1.Formio.addLoader;\nsdk_1.Formio.addToGlobal = (global) => {\n    if (typeof global === 'object' && !global.Formio) {\n        global.Formio = sdk_1.Formio;\n    }\n};\nif (typeof __webpack_require__.g !== 'undefined') {\n    sdk_1.Formio.addToGlobal(__webpack_require__.g);\n}\nif (typeof window !== 'undefined') {\n    sdk_1.Formio.addToGlobal(window);\n}\nEmbed_1.Formio._formioReady(sdk_1.Formio);\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Formio.js?");
 
 /***/ }),