@formio/js 5.0.0-dev.5719.d2d4a61 → 5.0.0-dev.5720.5431de8

package/dist/formio.form.js

@@ -4686,7 +4686,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    var desc = Object.getOwnPropertyDescriptor(m, k);\n    if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n      desc = { enumerable: true, get: function() { return m[k]; } };\n    }\n    Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n    Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n    o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n    if (mod && mod.__esModule) return mod;\n    var result = {};\n    if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n    __setModuleDefault(result, mod);\n    return result;\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst Element_1 = __importDefault(__webpack_require__(/*! ./Element */ \"./lib/cjs/Element.js\"));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst displays_1 = __importDefault(__webpack_require__(/*! ./displays */ \"./lib/cjs/displays/index.js\"));\nconst templates_1 = __importDefault(__webpack_require__(/*! ./templates */ \"./lib/cjs/templates/index.js\"));\nconst FormioUtils = __importStar(__webpack_require__(/*! ./utils/utils */ \"./lib/cjs/utils/utils.js\"));\nclass Form extends Element_1.default {\n    constructor(elementOrForm, formOrOptions, options = {}) {\n        let element, form, formOptions;\n        if (elementOrForm instanceof HTMLElement) {\n            element = elementOrForm;\n            form = formOrOptions;\n            formOptions = options;\n        }\n        else {\n            element = null;\n            form = elementOrForm;\n            formOptions = formOrOptions || {};\n        }\n        if (Formio_1.Formio.options && Formio_1.Formio.options.form) {\n            formOptions = Object.assign(formOptions, Formio_1.Formio.options.form);\n        }\n        super(formOptions);\n        if (this.options.useSessionToken) {\n            Formio_1.Formio.useSessionToken(this.options);\n        }\n        this.ready = new Promise((resolve, reject) => {\n            this.readyResolve = resolve;\n            this.readyReject = reject;\n        });\n        this.instance = null;\n        if (element) {\n            if (this.element) {\n                delete this.element.component;\n            }\n            this.element = element;\n        }\n        else {\n            this.element = null;\n        }\n        if (form) {\n            this.setForm(form)\n                .then(() => this.readyResolve(this.instance))\n                .catch(this.readyReject);\n        }\n        this.options = formOptions;\n        this.options.events = this.events;\n        this.display = '';\n    }\n    createElement(tag, attrs, children) {\n        const element = document.createElement(tag);\n        for (const attr in attrs) {\n            if (attrs.hasOwnProperty(attr)) {\n                element.setAttribute(attr, attrs[attr]);\n            }\n        }\n        (children || []).forEach(child => {\n            element.appendChild(this.createElement(child.tag, child.attrs, child.children));\n        });\n        return element;\n    }\n    set loading(load) {\n        if (!this.element || this.options.noLoader) {\n            return;\n        }\n        if (load) {\n            if (this.loader) {\n                return;\n            }\n            this.loader = this.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            this.element.appendChild(this.loader);\n        }\n        else if (this.loader) {\n            if (this.element.contains(this.loader)) {\n                this.element.removeChild(this.loader);\n            }\n            this.loader = null;\n        }\n    }\n    /**\n     * Create a new form instance provided the display of the form.\n     * @param {string} display - The display of the form, either \"wizard\", \"form\", or \"pdf\"\n     * @returns {Webform|Wizard|PDF} - The new form instance for the display.\n     */\n    create(display) {\n        if (this.options && (this.options.flatten || this.options.renderMode === 'flat')) {\n            display = 'form';\n        }\n        this.display = display;\n        if (displays_1.default.displays[display]) {\n            return new displays_1.default.displays[display](this.element, this.options);\n        }\n        else {\n            // eslint-disable-next-line new-cap\n            return new displays_1.default.displays['webform'](this.element, this.options);\n        }\n    }\n    /**\n     * Sets the form. Either as JSON or a URL to a form JSON schema.\n     * @param {string|object} formParam - Either the form JSON or the URL of the form json.\n     * @returns {void}\n     */\n    set form(formParam) {\n        this.setForm(formParam);\n    }\n    errorForm(err) {\n        return {\n            components: [\n                {\n                    'label': 'HTML',\n                    'tag': 'div',\n                    'className': 'error error-message alert alert-danger ui red message',\n                    'attrs': [\n                        {\n                            'attr': 'role',\n                            'value': 'alert'\n                        }\n                    ],\n                    'key': 'errorMessage',\n                    'type': 'htmlelement',\n                    'input': false,\n                    'content': typeof err === 'string' ? err : err.message,\n                }\n            ]\n        };\n    }\n    /**\n     * Check Subdirectories path and provide correct options\n     * @param {string} url - The the URL of the form json.\n     * @param {import('@formio/core').Form} form - The form json.\n     * @returns {object} The initial options with base and project.\n     */\n    getFormInitOptions(url, form) {\n        const options = {};\n        const index = url.indexOf(form === null || form === void 0 ? void 0 : form.path);\n        // form url doesn't include form path\n        if (index === -1) {\n            return options;\n        }\n        const projectUrl = url.substring(0, index - 1);\n        const urlParts = Formio_1.Formio.getUrlParts(projectUrl);\n        // project url doesn't include subdirectories path\n        if (!urlParts || urlParts.filter(part => !!part).length < 4) {\n            return options;\n        }\n        const baseUrl = `${urlParts[1]}${urlParts[2]}`;\n        // Skip if baseUrl has already been set\n        if (baseUrl !== Formio_1.Formio.baseUrl) {\n            return {\n                base: baseUrl,\n                project: projectUrl,\n            };\n        }\n        return {};\n    }\n    /**\n     * Sets the form to the JSON schema of a form.\n     * @param {import('@formio/core').Form} formParam - The form JSON to set this form to.\n     * @returns {Promise<Webform|Wizard|PDF>} - The webform instance that was created.\n     */\n    setForm(formParam) {\n        let result;\n        formParam = formParam || this.form;\n        if (typeof formParam === 'string') {\n            const formio = new Formio_1.Formio(formParam);\n            let error;\n            this.loading = true;\n            result = this.getSubmission(formio, this.options)\n                .catch((err) => {\n                error = err;\n            })\n                .then((submission) => {\n                return formio.loadForm()\n                    // If the form returned an error, show it instead of the form.\n                    .catch(err => {\n                    error = err;\n                })\n                    .then((form) => {\n                    // If the submission returned an error, show it instead of the form.\n                    if (error) {\n                        form = this.errorForm(error);\n                    }\n                    this.loading = false;\n                    this.instance = this.instance || this.create(form.display);\n                    const options = this.getFormInitOptions(formParam, form);\n                    this.instance.setUrl(formParam, options);\n                    this.instance.nosubmit = false;\n                    this._form = this.instance.form = form;\n                    if (submission) {\n                        this.instance.submission = submission;\n                    }\n                    if (error) {\n                        throw error;\n                    }\n                    return this.instance;\n                });\n            });\n        }\n        else {\n            this.instance = this.instance || this.create(formParam.display);\n            this._form = this.instance.form = formParam;\n            result = this.instance.ready;\n        }\n        // A redraw has occurred so save off the new element in case of a setDisplay causing a rebuild.\n        return result.then(() => {\n            if (this.element) {\n                delete this.element.component;\n            }\n            this.element = this.instance.element;\n            return this.instance;\n        });\n    }\n    getSubmission(formio, opts) {\n        if (formio.submissionId) {\n            return formio.loadSubmission(null, opts);\n        }\n        return Promise.resolve();\n    }\n    /**\n     * Returns the loaded forms JSON.\n     * @returns {object} - The loaded form's JSON\n     */\n    get form() {\n        return this._form;\n    }\n    /**\n     * Changes the display of the form.\n     * @param {string} display - The display to set this form. Either \"wizard\", \"form\", or \"pdf\"\n     * @returns {Promise<Webform|Wizard|PDF>} - The form instance that was created after changing the display.\n     */\n    setDisplay(display) {\n        if ((this.display === display) && this.instance) {\n            return Promise.resolve(this.instance);\n        }\n        this.form.display = display;\n        this.instance.destroy();\n        this.instance = this.create(display);\n        return this.setForm(this.form);\n    }\n    empty() {\n        if (this.element) {\n            while (this.element.firstChild) {\n                this.element.removeChild(this.element.firstChild);\n            }\n        }\n    }\n    static embed(embed) {\n        return new Promise((resolve) => {\n            if (!embed || !embed.src) {\n                resolve();\n            }\n            const id = this.id || `formio-${Math.random().toString(36).substring(7)}`;\n            const className = embed.class || 'formio-form-wrapper';\n            let code = embed.styles ? `<link rel=\"stylesheet\" href=\"${embed.styles}\">` : '';\n            code += `<div id=\"${id}\" class=\"${className}\"></div>`;\n            document.write(code);\n            let attempts = 0;\n            const wait = setInterval(() => {\n                attempts++;\n                const formElement = document.getElementById(id);\n                if (formElement || attempts > 10) {\n                    resolve(new Form(formElement, embed.src).ready);\n                    clearInterval(wait);\n                }\n            }, 10);\n        });\n    }\n    /**\n     * Sanitize an html string.\n     * @param {string} dirty - The dirty html string to sanitize.\n     * @param {boolean} forceSanitize - If the string should be force sanitized.\n     * @returns {string} - The sanitized html string.\n     */\n    sanitize(dirty, forceSanitize) {\n        // If Sanitize is turned off\n        if (this.options.sanitize === false && !forceSanitize) {\n            return dirty;\n        }\n        return FormioUtils.sanitize(dirty, this.options);\n    }\n    setContent(element, content, forceSanitize) {\n        if (element instanceof HTMLElement) {\n            element.innerHTML = this.sanitize(content, forceSanitize);\n            return true;\n        }\n        return false;\n    }\n    /**\n     * Build a new form.\n     * @returns {Promise<Webform|Wizard|PDF>} - The form instance that was created.\n     */\n    build() {\n        if (!this.instance) {\n            return Promise.reject('Form not ready. Use form.ready promise');\n        }\n        if (!this.element) {\n            return Promise.reject('No DOM element for form.');\n        }\n        // Add temporary loader.\n        const template = (this.options && this.options.template) ? this.options.template : 'bootstrap';\n        const loader = templates_1.default[template].loader || templates_1.default.bootstrap.loader;\n        this.setContent(this.element, loader.form);\n        return this.render().then(html => {\n            this.setContent(this.element, html);\n            return this.attach(this.element).then(() => this.instance);\n        })\n            .then((param) => {\n            this.emit('build', param);\n            return param;\n        });\n    }\n    render() {\n        if (!this.instance) {\n            return Promise.reject('Form not ready. Use form.ready promise');\n        }\n        return Promise.resolve(this.instance.render())\n            .then((param) => {\n            this.emit('render', param);\n            return param;\n        });\n    }\n    attach(element) {\n        if (!this.instance) {\n            return Promise.reject('Form not ready. Use form.ready promise');\n        }\n        if (this.element) {\n            delete this.element.component;\n        }\n        this.element = element;\n        return this.instance.attach(this.element)\n            .then((param) => {\n            this.emit('attach', param);\n            return param;\n        });\n    }\n    teardown() {\n        super.teardown();\n        delete this.instance;\n        delete this.ready;\n    }\n}\nexports[\"default\"] = Form;\n// Allow simple embedding.\nFormio_1.Formio.embedForm = (embed) => Form.embed(embed);\n/**\n * Creates an easy to use interface for embedding webforms, pdfs, and wizards into your application.\n * @param {object} elementOrForm - The DOM element you wish to render this form within, or the form definition.\n * @param {object | string | FormOptions} formOrOptions - A Form JSON schema, the URL of a hosted form, or the form options.\n * @param {FormOptions} [options] - The options to create a new form instance.\n * @returns {Promise<Webform|Wizard|PDF>} - The form instance that was created.\n * @example\n * import { Formio } from '@formio/js';\n * Formio.createForm(document.getElementById('formio'), 'https://examples.form.io/example');\n */\nFormio_1.Formio.createForm = (elementOrForm, formOrOptions, options) => {\n    return (new Form(elementOrForm, formOrOptions, options)).ready;\n};\nFormio_1.Formio.Form = Form;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Form.js?");
+eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    var desc = Object.getOwnPropertyDescriptor(m, k);\n    if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n      desc = { enumerable: true, get: function() { return m[k]; } };\n    }\n    Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n    Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n    o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n    if (mod && mod.__esModule) return mod;\n    var result = {};\n    if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n    __setModuleDefault(result, mod);\n    return result;\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst Element_1 = __importDefault(__webpack_require__(/*! ./Element */ \"./lib/cjs/Element.js\"));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst displays_1 = __importDefault(__webpack_require__(/*! ./displays */ \"./lib/cjs/displays/index.js\"));\nconst templates_1 = __importDefault(__webpack_require__(/*! ./templates */ \"./lib/cjs/templates/index.js\"));\nconst FormioUtils = __importStar(__webpack_require__(/*! ./utils/utils */ \"./lib/cjs/utils/utils.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nclass Form extends Element_1.default {\n    constructor(elementOrForm, formOrOptions, options = {}) {\n        let element, form, formOptions;\n        if (elementOrForm instanceof HTMLElement) {\n            element = elementOrForm;\n            form = formOrOptions;\n            formOptions = options;\n        }\n        else {\n            element = null;\n            form = elementOrForm;\n            formOptions = formOrOptions || {};\n        }\n        if (Formio_1.Formio.options && Formio_1.Formio.options.form) {\n            formOptions = Object.assign(formOptions, Formio_1.Formio.options.form);\n        }\n        super(formOptions);\n        if (this.options.useSessionToken) {\n            Formio_1.Formio.useSessionToken(this.options);\n        }\n        this.ready = new Promise((resolve, reject) => {\n            this.readyResolve = resolve;\n            this.readyReject = reject;\n        });\n        this.instance = null;\n        if (element) {\n            if (this.element) {\n                delete this.element.component;\n            }\n            this.element = element;\n        }\n        else {\n            this.element = null;\n        }\n        if (form) {\n            this.setForm(form)\n                .then(() => this.readyResolve(this.instance))\n                .catch(this.readyReject);\n        }\n        this.options = formOptions;\n        this.options.events = this.events;\n        this.display = '';\n    }\n    createElement(tag, attrs, children) {\n        const element = document.createElement(tag);\n        for (const attr in attrs) {\n            if (attrs.hasOwnProperty(attr)) {\n                element.setAttribute(attr, attrs[attr]);\n            }\n        }\n        (children || []).forEach(child => {\n            element.appendChild(this.createElement(child.tag, child.attrs, child.children));\n        });\n        return element;\n    }\n    set loading(load) {\n        if (!this.element || this.options.noLoader) {\n            return;\n        }\n        if (load) {\n            if (this.loader) {\n                return;\n            }\n            this.loader = this.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            this.element.appendChild(this.loader);\n        }\n        else if (this.loader) {\n            if (this.element.contains(this.loader)) {\n                this.element.removeChild(this.loader);\n            }\n            this.loader = null;\n        }\n    }\n    /**\n     * Create a new form instance provided the display of the form.\n     * @param {string} display - The display of the form, either \"wizard\", \"form\", or \"pdf\"\n     * @returns {Webform|Wizard|PDF} - The new form instance for the display.\n     */\n    create(display) {\n        if (this.options && (this.options.flatten || this.options.renderMode === 'flat')) {\n            display = 'form';\n        }\n        this.display = display;\n        if (displays_1.default.displays[display]) {\n            return new displays_1.default.displays[display](this.element, this.options);\n        }\n        else {\n            // eslint-disable-next-line new-cap\n            return new displays_1.default.displays['webform'](this.element, this.options);\n        }\n    }\n    /**\n     * Sets the form. Either as JSON or a URL to a form JSON schema.\n     * @param {string|object} formParam - Either the form JSON or the URL of the form json.\n     * @returns {void}\n     */\n    set form(formParam) {\n        this.setForm(formParam);\n    }\n    errorForm(err) {\n        return {\n            components: [\n                {\n                    'label': 'HTML',\n                    'tag': 'div',\n                    'className': 'error error-message alert alert-danger ui red message',\n                    'attrs': [\n                        {\n                            'attr': 'role',\n                            'value': 'alert'\n                        }\n                    ],\n                    'key': 'errorMessage',\n                    'type': 'htmlelement',\n                    'input': false,\n                    'content': typeof err === 'string' ? err : err.message,\n                }\n            ]\n        };\n    }\n    /**\n     * Check Subdirectories path and provide correct options\n     * @param {string} url - The the URL of the form json.\n     * @param {import('@formio/core').Form} form - The form json.\n     * @returns {object} The initial options with base and project.\n     */\n    getFormInitOptions(url, form) {\n        const options = {};\n        const index = url.indexOf(form === null || form === void 0 ? void 0 : form.path);\n        // form url doesn't include form path\n        if (index === -1) {\n            return options;\n        }\n        const projectUrl = url.substring(0, index - 1);\n        const urlParts = Formio_1.Formio.getUrlParts(projectUrl);\n        // project url doesn't include subdirectories path\n        if (!urlParts || urlParts.filter(part => !!part).length < 4) {\n            return options;\n        }\n        const baseUrl = `${urlParts[1]}${urlParts[2]}`;\n        // Skip if baseUrl has already been set\n        if (baseUrl !== Formio_1.Formio.baseUrl) {\n            return {\n                base: baseUrl,\n                project: projectUrl,\n            };\n        }\n        return {};\n    }\n    /**\n     * Sets the form to the JSON schema of a form.\n     * @param {import('@formio/core').Form} formParam - The form JSON to set this form to.\n     * @returns {Promise<Webform|Wizard|PDF>} - The webform instance that was created.\n     */\n    setForm(formParam) {\n        let result;\n        formParam = formParam || this.form;\n        if (typeof formParam === 'string') {\n            const formio = new Formio_1.Formio(formParam);\n            let error;\n            this.loading = true;\n            result = this.getSubmission(formio, this.options)\n                .catch((err) => {\n                error = err;\n            })\n                .then((submission) => {\n                return formio.loadForm()\n                    // If the form returned an error, show it instead of the form.\n                    .catch(err => {\n                    error = err;\n                })\n                    .then((form) => {\n                    // If the submission returned an error, show it instead of the form.\n                    if (error) {\n                        form = this.errorForm(error);\n                    }\n                    this.loading = false;\n                    this.instance = this.instance || this.create(form.display);\n                    const options = this.getFormInitOptions(formParam, form);\n                    this.instance.setUrl(formParam, options);\n                    lodash_1.default.set(form, 'config.myApiUrl', options.project);\n                    this.instance.nosubmit = false;\n                    this._form = this.instance.form = form;\n                    if (submission) {\n                        this.instance.submission = submission;\n                    }\n                    if (error) {\n                        throw error;\n                    }\n                    return this.instance;\n                });\n            });\n        }\n        else {\n            this.instance = this.instance || this.create(formParam.display);\n            this._form = this.instance.form = formParam;\n            result = this.instance.ready;\n        }\n        // A redraw has occurred so save off the new element in case of a setDisplay causing a rebuild.\n        return result.then(() => {\n            if (this.element) {\n                delete this.element.component;\n            }\n            this.element = this.instance.element;\n            return this.instance;\n        });\n    }\n    getSubmission(formio, opts) {\n        if (formio.submissionId) {\n            return formio.loadSubmission(null, opts);\n        }\n        return Promise.resolve();\n    }\n    /**\n     * Returns the loaded forms JSON.\n     * @returns {object} - The loaded form's JSON\n     */\n    get form() {\n        return this._form;\n    }\n    /**\n     * Changes the display of the form.\n     * @param {string} display - The display to set this form. Either \"wizard\", \"form\", or \"pdf\"\n     * @returns {Promise<Webform|Wizard|PDF>} - The form instance that was created after changing the display.\n     */\n    setDisplay(display) {\n        if ((this.display === display) && this.instance) {\n            return Promise.resolve(this.instance);\n        }\n        this.form.display = display;\n        this.instance.destroy();\n        this.instance = this.create(display);\n        return this.setForm(this.form);\n    }\n    empty() {\n        if (this.element) {\n            while (this.element.firstChild) {\n                this.element.removeChild(this.element.firstChild);\n            }\n        }\n    }\n    static embed(embed) {\n        return new Promise((resolve) => {\n            if (!embed || !embed.src) {\n                resolve();\n            }\n            const id = this.id || `formio-${Math.random().toString(36).substring(7)}`;\n            const className = embed.class || 'formio-form-wrapper';\n            let code = embed.styles ? `<link rel=\"stylesheet\" href=\"${embed.styles}\">` : '';\n            code += `<div id=\"${id}\" class=\"${className}\"></div>`;\n            document.write(code);\n            let attempts = 0;\n            const wait = setInterval(() => {\n                attempts++;\n                const formElement = document.getElementById(id);\n                if (formElement || attempts > 10) {\n                    resolve(new Form(formElement, embed.src).ready);\n                    clearInterval(wait);\n                }\n            }, 10);\n        });\n    }\n    /**\n     * Sanitize an html string.\n     * @param {string} dirty - The dirty html string to sanitize.\n     * @param {boolean} forceSanitize - If the string should be force sanitized.\n     * @returns {string} - The sanitized html string.\n     */\n    sanitize(dirty, forceSanitize) {\n        // If Sanitize is turned off\n        if (this.options.sanitize === false && !forceSanitize) {\n            return dirty;\n        }\n        return FormioUtils.sanitize(dirty, this.options);\n    }\n    setContent(element, content, forceSanitize) {\n        if (element instanceof HTMLElement) {\n            element.innerHTML = this.sanitize(content, forceSanitize);\n            return true;\n        }\n        return false;\n    }\n    /**\n     * Build a new form.\n     * @returns {Promise<Webform|Wizard|PDF>} - The form instance that was created.\n     */\n    build() {\n        if (!this.instance) {\n            return Promise.reject('Form not ready. Use form.ready promise');\n        }\n        if (!this.element) {\n            return Promise.reject('No DOM element for form.');\n        }\n        // Add temporary loader.\n        const template = (this.options && this.options.template) ? this.options.template : 'bootstrap';\n        const loader = templates_1.default[template].loader || templates_1.default.bootstrap.loader;\n        this.setContent(this.element, loader.form);\n        return this.render().then(html => {\n            this.setContent(this.element, html);\n            return this.attach(this.element).then(() => this.instance);\n        })\n            .then((param) => {\n            this.emit('build', param);\n            return param;\n        });\n    }\n    render() {\n        if (!this.instance) {\n            return Promise.reject('Form not ready. Use form.ready promise');\n        }\n        return Promise.resolve(this.instance.render())\n            .then((param) => {\n            this.emit('render', param);\n            return param;\n        });\n    }\n    attach(element) {\n        if (!this.instance) {\n            return Promise.reject('Form not ready. Use form.ready promise');\n        }\n        if (this.element) {\n            delete this.element.component;\n        }\n        this.element = element;\n        return this.instance.attach(this.element)\n            .then((param) => {\n            this.emit('attach', param);\n            return param;\n        });\n    }\n    teardown() {\n        super.teardown();\n        delete this.instance;\n        delete this.ready;\n    }\n}\nexports[\"default\"] = Form;\n// Allow simple embedding.\nFormio_1.Formio.embedForm = (embed) => Form.embed(embed);\n/**\n * Creates an easy to use interface for embedding webforms, pdfs, and wizards into your application.\n * @param {object} elementOrForm - The DOM element you wish to render this form within, or the form definition.\n * @param {object | string | FormOptions} formOrOptions - A Form JSON schema, the URL of a hosted form, or the form options.\n * @param {FormOptions} [options] - The options to create a new form instance.\n * @returns {Promise<Webform|Wizard|PDF>} - The form instance that was created.\n * @example\n * import { Formio } from '@formio/js';\n * Formio.createForm(document.getElementById('formio'), 'https://examples.form.io/example');\n */\nFormio_1.Formio.createForm = (elementOrForm, formOrOptions, options) => {\n    return (new Form(elementOrForm, formOrOptions, options)).ready;\n};\nFormio_1.Formio.Form = Form;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Form.js?");
 
 /***/ }),
 
@@ -4961,7 +4961,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 utils_1 = __webpack_require__(/*! ../../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst Component_1 = __importDefault(__webpack_require__(/*! ../component/Component */ \"./lib/cjs/components/_classes/component/Component.js\"));\nconst NestedDataComponent_1 = __importDefault(__webpack_require__(/*! ../nesteddata/NestedDataComponent */ \"./lib/cjs/components/_classes/nesteddata/NestedDataComponent.js\"));\nclass NestedArrayComponent extends NestedDataComponent_1.default {\n    static schema(...extend) {\n        return NestedDataComponent_1.default.schema({\n            disableAddingRemovingRows: false\n        }, ...extend);\n    }\n    static savedValueTypes() {\n        return [utils_1.componentValueTypes.array];\n    }\n    componentContext(component) {\n        return this.iteratableRows[component.rowIndex].data;\n    }\n    get iteratableRows() {\n        throw new Error('Getter #iteratableRows() is not implemented');\n    }\n    get rowIndex() {\n        return super.rowIndex;\n    }\n    set rowIndex(value) {\n        this._rowIndex = value;\n    }\n    init() {\n        super.init();\n        this.prevHasAddButton = this.hasAddButton();\n    }\n    checkAddButtonChanged() {\n        const isAddButton = this.hasAddButton();\n        if (isAddButton !== this.prevHasAddButton) {\n            this.prevHasAddButton = isAddButton;\n            this.redraw();\n        }\n    }\n    checkData(data, flags, row) {\n        data = data || this.rootValue;\n        flags = flags || {};\n        row = row || this.data;\n        this.checkAddButtonChanged();\n        return this.processRows('checkData', data, flags, Component_1.default.prototype.checkData.call(this, data, flags, row));\n    }\n    processRows(method, data, opts, defaultValue, silentCheck) {\n        return this.iteratableRows.reduce((valid, row, rowIndex) => {\n            if (!(opts === null || opts === void 0 ? void 0 : opts.rowIndex) || (opts === null || opts === void 0 ? void 0 : opts.rowIndex) === rowIndex) {\n                return this.processRow(method, data, opts, row.data, row.components, silentCheck) && valid;\n            }\n            else {\n                return valid;\n            }\n        }, defaultValue);\n    }\n    validate(data, flags = {}) {\n        data = data || this.data;\n        return this.validateComponents([this.component], data, flags);\n    }\n    checkRow(...args) {\n        console.log('Deprecation Warning: checkRow method has been replaced with processRow');\n        return this.processRow.call(this, ...args);\n    }\n    processRow(method, data, opts, row, components, silentCheck) {\n        if (opts === null || opts === void 0 ? void 0 : opts.isolateRow) {\n            silentCheck = true;\n            opts.noRefresh = true;\n        }\n        const valid = lodash_1.default.reduce(components, (valid, component) => component[method](data, opts, row, silentCheck) && valid, true);\n        if (opts === null || opts === void 0 ? void 0 : opts.noRefresh) {\n            delete opts.noRefresh;\n        }\n        return valid;\n    }\n    hasAddButton() {\n        const maxLength = lodash_1.default.get(this.component, 'validate.maxLength');\n        const conditionalAddButton = lodash_1.default.get(this.component, 'conditionalAddButton');\n        return !this.component.disableAddingRemovingRows &&\n            !this.options.readOnly &&\n            !this.disabled &&\n            this.fullMode &&\n            !this.options.preview &&\n            (!maxLength || (this.iteratableRows.length < maxLength)) &&\n            (!conditionalAddButton || this.evaluate(conditionalAddButton, {\n                value: this.dataValue,\n            }, 'show'));\n    }\n    getComponent(path, fn, originalPath) {\n        originalPath = originalPath || (0, utils_1.getStringFromComponentPath)(path);\n        if (this.componentsMap.hasOwnProperty(originalPath)) {\n            if (fn) {\n                return fn(this.componentsMap[originalPath]);\n            }\n            else {\n                return this.componentsMap[originalPath];\n            }\n        }\n        path = Array.isArray(path) ? path : [path];\n        let key = path.shift();\n        const remainingPath = path;\n        let result = [];\n        let possibleComp = null;\n        let comp = null;\n        let rowIndex = null;\n        if (lodash_1.default.isNumber(key)) {\n            rowIndex = key;\n            key = remainingPath.shift();\n        }\n        if (!lodash_1.default.isString(key)) {\n            return result;\n        }\n        this.everyComponent((component, components) => {\n            if (component.component.key === key) {\n                possibleComp = component;\n                if (remainingPath.length > 0 && 'getComponent' in component) {\n                    comp = component.getComponent(remainingPath, fn, originalPath);\n                }\n                else if (fn) {\n                    fn(component, components);\n                }\n                result = rowIndex !== null ? comp : result.concat(comp || possibleComp);\n            }\n        }, rowIndex);\n        if ((!result || result.length === 0) && possibleComp) {\n            result = rowIndex !== null ? possibleComp : [possibleComp];\n        }\n        return result;\n    }\n    everyComponent(fn, rowIndex, options = {}) {\n        if (lodash_1.default.isObject(rowIndex)) {\n            options = rowIndex;\n            rowIndex = null;\n        }\n        if (options === null || options === void 0 ? void 0 : options.email) {\n            return;\n        }\n        const components = this.getComponents(rowIndex);\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    _getEmailTableHeader(options) {\n        let row = '';\n        const getHeaderCell = (component) => {\n            if (!component.isInputComponent || !component.visible || component.skipInEmail) {\n                return '';\n            }\n            const label = component.label || component.key;\n            return `<th style=\"padding: 5px 10px;\">${label}</th>`;\n        };\n        const components = this.getComponents(0);\n        for (const component of components) {\n            if (component.isInputComponent) {\n                row += getHeaderCell(component);\n            }\n            else if ((0, utils_1.isLayoutComponent)(component) && typeof component.everyComponent === 'function') {\n                component.everyComponent((comp) => {\n                    row += getHeaderCell(comp);\n                }, options);\n            }\n        }\n        return `<thead><tr>${row}</tr></thead>`;\n    }\n    _getEmailTableBody(options) {\n        const getBodyCell = (component) => {\n            if (!component.isInputComponent || !component.visible || component.skipInEmail) {\n                return '';\n            }\n            return `<td style=\"padding: 5px 10px;\">${component.getView(component.dataValue, options)}</td>`;\n        };\n        const rows = [];\n        for (const { components } of this.iteratableRows) {\n            let row = '';\n            for (const component of components) {\n                if (component.isInputComponent) {\n                    row += getBodyCell(component);\n                }\n                else if ((0, utils_1.isLayoutComponent)(component) && typeof component.everyComponent === 'function') {\n                    component.everyComponent((comp) => {\n                        row += getBodyCell(comp);\n                    }, options);\n                }\n            }\n            rows.push(`<tr>${row}</tr>`);\n        }\n        return `<tbody>${rows.join('')}</tbody>`;\n    }\n    getValueAsString(value, options) {\n        if (options === null || options === void 0 ? void 0 : options.email) {\n            return `\n        <table border=\"1\" style=\"width:100%\">\n          ${this._getEmailTableHeader(options)}\n          ${this._getEmailTableBody(options)}\n        </table>\n      `;\n        }\n        if (!value || !value.length) {\n            return '';\n        }\n        return super.getValueAsString(value, options);\n    }\n    getComponents(rowIndex) {\n        if (rowIndex !== undefined && rowIndex !== null) {\n            if (!this.iteratableRows[rowIndex]) {\n                return [];\n            }\n            return this.iteratableRows[rowIndex].components;\n        }\n        return super.getComponents();\n    }\n}\nexports[\"default\"] = NestedArrayComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/_classes/nestedarray/NestedArrayComponent.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 utils_1 = __webpack_require__(/*! ../../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst Component_1 = __importDefault(__webpack_require__(/*! ../component/Component */ \"./lib/cjs/components/_classes/component/Component.js\"));\nconst NestedDataComponent_1 = __importDefault(__webpack_require__(/*! ../nesteddata/NestedDataComponent */ \"./lib/cjs/components/_classes/nesteddata/NestedDataComponent.js\"));\nclass NestedArrayComponent extends NestedDataComponent_1.default {\n    static schema(...extend) {\n        return NestedDataComponent_1.default.schema({\n            disableAddingRemovingRows: false\n        }, ...extend);\n    }\n    static savedValueTypes() {\n        return [utils_1.componentValueTypes.array];\n    }\n    componentContext(component) {\n        return this.iteratableRows[component.rowIndex].data;\n    }\n    get iteratableRows() {\n        throw new Error('Getter #iteratableRows() is not implemented');\n    }\n    get rowIndex() {\n        return super.rowIndex;\n    }\n    set rowIndex(value) {\n        this._rowIndex = value;\n    }\n    init() {\n        super.init();\n        this.prevHasAddButton = this.hasAddButton();\n    }\n    checkAddButtonChanged() {\n        const isAddButton = this.hasAddButton();\n        if (isAddButton !== this.prevHasAddButton) {\n            this.prevHasAddButton = isAddButton;\n            this.redraw();\n        }\n    }\n    checkData(data, flags, row) {\n        data = data || this.rootValue;\n        flags = flags || {};\n        row = row || this.data;\n        this.checkAddButtonChanged();\n        return this.processRows('checkData', data, flags, Component_1.default.prototype.checkData.call(this, data, flags, row));\n    }\n    processRows(method, data, opts, defaultValue, silentCheck) {\n        return this.iteratableRows.reduce((valid, row, rowIndex) => {\n            if (!(opts === null || opts === void 0 ? void 0 : opts.rowIndex) || (opts === null || opts === void 0 ? void 0 : opts.rowIndex) === rowIndex) {\n                return this.processRow(method, data, opts, row.data, row.components, silentCheck) && valid;\n            }\n            else {\n                return valid;\n            }\n        }, defaultValue);\n    }\n    validate(data, flags = {}) {\n        data = data || this.data;\n        return this.validateComponents([this.component], data, flags);\n    }\n    checkRow(...args) {\n        console.log('Deprecation Warning: checkRow method has been replaced with processRow');\n        return this.processRow.call(this, ...args);\n    }\n    processRow(method, data, opts, row, components, silentCheck) {\n        if (opts === null || opts === void 0 ? void 0 : opts.isolateRow) {\n            silentCheck = true;\n            opts.noRefresh = true;\n        }\n        const valid = lodash_1.default.reduce(components, (valid, component) => component[method](data, opts, row, silentCheck) && valid, true);\n        if (opts === null || opts === void 0 ? void 0 : opts.noRefresh) {\n            delete opts.noRefresh;\n        }\n        return valid;\n    }\n    hasAddButton() {\n        const maxLength = lodash_1.default.get(this.component, 'validate.maxLength');\n        const conditionalAddButton = lodash_1.default.get(this.component, 'conditionalAddButton');\n        return !this.component.disableAddingRemovingRows &&\n            !this.options.readOnly &&\n            !this.disabled &&\n            this.fullMode &&\n            !this.options.preview &&\n            (!maxLength || (this.iteratableRows.length < maxLength)) &&\n            (!conditionalAddButton || this.evaluate(conditionalAddButton, {\n                value: this.dataValue,\n            }, 'show'));\n    }\n    getComponent(path, fn, originalPath) {\n        originalPath = originalPath || (0, utils_1.getStringFromComponentPath)(path);\n        if (this.componentsMap.hasOwnProperty(originalPath)) {\n            if (fn) {\n                return fn(this.componentsMap[originalPath]);\n            }\n            else {\n                return this.componentsMap[originalPath];\n            }\n        }\n        path = Array.isArray(path) ? path : [path];\n        let key = path.shift();\n        const remainingPath = path;\n        let result = [];\n        let possibleComp = null;\n        let comp = null;\n        let rowIndex = null;\n        if (lodash_1.default.isNumber(key)) {\n            rowIndex = key;\n            key = remainingPath.shift();\n        }\n        if (!lodash_1.default.isString(key)) {\n            return result;\n        }\n        this.everyComponent((component, components) => {\n            if (component.component.key === key) {\n                possibleComp = component;\n                if (remainingPath.length > 0 && 'getComponent' in component) {\n                    comp = component.getComponent(remainingPath, fn, originalPath);\n                }\n                else if (fn) {\n                    fn(component, components);\n                }\n                result = rowIndex !== null ? comp : result.concat(comp || possibleComp);\n            }\n        }, rowIndex);\n        if ((!result || result.length === 0) && possibleComp) {\n            result = rowIndex !== null ? possibleComp : [possibleComp];\n        }\n        return result;\n    }\n    everyComponent(fn, rowIndex, options = {}) {\n        if (lodash_1.default.isObject(rowIndex)) {\n            options = rowIndex;\n            rowIndex = null;\n        }\n        if (options === null || options === void 0 ? void 0 : options.email) {\n            return;\n        }\n        const components = this.getComponents(rowIndex);\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    getValueAsString(value, options) {\n        var _a;\n        if (options === null || options === void 0 ? void 0 : options.email) {\n            let result = (`\n        <table border=\"1\" style=\"width:100%\">\n          <thead>\n            <tr>\n      `);\n            (_a = this.component.components) === null || _a === void 0 ? void 0 : _a.forEach((component) => {\n                const label = component.label || component.key;\n                result += `<th style=\"padding: 5px 10px;\">${label}</th>`;\n            });\n            result += (`\n          </tr>\n        </thead>\n        <tbody>\n      `);\n            this.iteratableRows.forEach(({ components }) => {\n                result += '<tr>';\n                lodash_1.default.each(components, (component) => {\n                    result += '<td style=\"padding:5px 10px;\">';\n                    if (component.isInputComponent && component.visible && !component.skipInEmail) {\n                        result += component.getView(component.dataValue, options);\n                    }\n                    result += '</td>';\n                });\n                result += '</tr>';\n            });\n            result += (`\n          </tbody>\n        </table>\n      `);\n            return result;\n        }\n        if (!value || !value.length) {\n            return '';\n        }\n        return super.getValueAsString(value, options);\n    }\n    getComponents(rowIndex) {\n        if (rowIndex !== undefined && rowIndex !== null) {\n            if (!this.iteratableRows[rowIndex]) {\n                return [];\n            }\n            return this.iteratableRows[rowIndex].components;\n        }\n        return super.getComponents();\n    }\n}\nexports[\"default\"] = NestedArrayComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/_classes/nestedarray/NestedArrayComponent.js?");
 
 /***/ }),