@formio/js 5.2.1-rc.1 → 5.2.1-rc.10

package/dist/formio.form.js

@@ -355,7 +355,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.calculateProcessInfo = exports.calculateProcess = exports.calculateProcessSync = exports.shouldCalculate = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./node_modules/@formio/core/lib/utils/index.js\");\nconst shouldCalculate = (context) => {\n    const { component, config } = context;\n    if (!component.calculateValue || ((config === null || config === void 0 ? void 0 : config.server) && !component.calculateServer)) {\n        return false;\n    }\n    return true;\n};\nexports.shouldCalculate = shouldCalculate;\nconst calculateProcessSync = (context) => {\n    const { component, data, scope, path, value } = context;\n    if (!(0, exports.shouldCalculate)(context) || !component.calculateValue) {\n        return;\n    }\n    const calculationContext = scope.fetched\n        ? Object.assign(Object.assign({}, context), { data: Object.assign(Object.assign({}, data), scope.fetched) }) : context;\n    if (!scope.calculated)\n        scope.calculated = [];\n    const newValue = (0, utils_1.evaluate)(component.calculateValue, calculationContext, 'value', false, (context) => {\n        context.value = value || null;\n    });\n    // Only set a new value if it is not \"null\" which would be the case if no calculation occurred.\n    if (newValue !== null) {\n        scope.calculated.push({\n            path,\n            value: newValue,\n        });\n        (0, lodash_1.set)(data, path, newValue);\n    }\n    return;\n};\nexports.calculateProcessSync = calculateProcessSync;\nconst calculateProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.calculateProcessSync)(context);\n});\nexports.calculateProcess = calculateProcess;\nexports.calculateProcessInfo = {\n    name: 'calculate',\n    process: exports.calculateProcess,\n    processSync: exports.calculateProcessSync,\n    shouldProcess: exports.shouldCalculate,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/calculation/index.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.calculateProcessInfo = exports.calculateProcess = exports.calculateProcessSync = exports.shouldCalculate = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./node_modules/@formio/core/lib/utils/index.js\");\nconst shouldCalculate = (context) => {\n    const { component, config, value, parent } = context;\n    if (!component.calculateValue || ((config === null || config === void 0 ? void 0 : config.server) && !component.calculateServer)) {\n        return false;\n    }\n    if ((0, lodash_1.isUndefined)(value) && (parent === null || parent === void 0 ? void 0 : parent.modelType) === 'nestedArray') {\n        return false;\n    }\n    return true;\n};\nexports.shouldCalculate = shouldCalculate;\nconst calculateProcessSync = (context) => {\n    var _a;\n    const { component, data, scope, path, value } = context;\n    if (!(0, exports.shouldCalculate)(context) || !component.calculateValue) {\n        return;\n    }\n    const calculationContext = scope.fetched\n        ? Object.assign(Object.assign({}, context), { data: Object.assign(Object.assign({}, data), scope.fetched) }) : context;\n    if (!scope.calculated)\n        scope.calculated = [];\n    const newValue = (0, utils_1.evaluate)(component.calculateValue, calculationContext, 'value', false, (context) => {\n        context.value = value || null;\n    });\n    // Only set a new value if it is not \"null\" which would be the case if no calculation occurred.\n    if (newValue !== null) {\n        scope.calculated.push({\n            path,\n            value: newValue,\n        });\n        (0, lodash_1.set)(data, path, newValue);\n        if (!scope.filter)\n            scope.filter = {};\n        if (!((_a = scope.clearHidden) === null || _a === void 0 ? void 0 : _a.hasOwnProperty(path))) {\n            scope.filter[path] = true;\n        }\n    }\n    return;\n};\nexports.calculateProcessSync = calculateProcessSync;\nconst calculateProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.calculateProcessSync)(context);\n});\nexports.calculateProcess = calculateProcess;\nexports.calculateProcessInfo = {\n    name: 'calculate',\n    process: exports.calculateProcess,\n    processSync: exports.calculateProcessSync,\n    shouldProcess: exports.shouldCalculate,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/calculation/index.js?");
 
 /***/ }),
 
@@ -366,7 +366,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.clearHiddenProcessInfo = exports.clearHiddenProcess = exports.clearHiddenProcessSync = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\n/**\n * This processor function checks components for the `hidden` property and unsets corresponding data\n */\nconst clearHiddenProcessSync = (context) => {\n    var _a, _b;\n    const { component, data, value, scope, path } = context;\n    // No need to unset the value if it's undefined\n    if (value === undefined) {\n        return;\n    }\n    if (!scope.clearHidden) {\n        scope.clearHidden = {};\n    }\n    // Check if there's a conditional set for the component and if it's marked as conditionally hidden\n    const isConditionallyHidden = (_a = scope.conditionals) === null || _a === void 0 ? void 0 : _a.find((cond) => {\n        return path === cond.path && cond.conditionallyHidden;\n    });\n    const shouldClearValueWhenHidden = !component.hasOwnProperty('clearOnHide') || component.clearOnHide;\n    if (shouldClearValueWhenHidden &&\n        (isConditionallyHidden || ((_b = component.scope) === null || _b === void 0 ? void 0 : _b.conditionallyHidden))) {\n        (0, lodash_1.unset)(data, path);\n        scope.clearHidden[path] = true;\n    }\n};\nexports.clearHiddenProcessSync = clearHiddenProcessSync;\nconst clearHiddenProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.clearHiddenProcessSync)(context);\n});\nexports.clearHiddenProcess = clearHiddenProcess;\nexports.clearHiddenProcessInfo = {\n    name: 'clearHidden',\n    shouldProcess: () => true,\n    process: exports.clearHiddenProcess,\n    processSync: exports.clearHiddenProcessSync,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/clearHidden/index.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.clearHiddenProcessInfo = exports.clearHiddenProcess = exports.clearHiddenProcessSync = void 0;\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\");\n/**\n * This processor function checks components for the `hidden` property and unsets corresponding data\n */\nconst clearHiddenProcessSync = (context) => {\n    var _a, _b, _c, _d;\n    const { component, data, value, scope, path, parent } = context;\n    // Check if there's a conditional set for the component and if it's marked as conditionally hidden\n    const isConditionallyHidden = ((_a = parent === null || parent === void 0 ? void 0 : parent.scope) === null || _a === void 0 ? void 0 : _a.conditionallyHidden) ||\n        ((_b = scope.conditionals) === null || _b === void 0 ? void 0 : _b.find((cond) => {\n            return path === cond.path && cond.conditionallyHidden;\n        }));\n    if (isConditionallyHidden) {\n        (0, formUtil_1.setComponentScope)(component, 'conditionallyHidden', true);\n    }\n    if (((_c = parent === null || parent === void 0 ? void 0 : parent.scope) === null || _c === void 0 ? void 0 : _c.intentionallyHidden) ||\n        (component.hasOwnProperty('hidden') && !!component.hidden)) {\n        (0, formUtil_1.setComponentScope)(component, 'intentionallyHidden', true);\n    }\n    const compModel = (0, formUtil_1.getModelType)(component);\n    // No need to unset the value if it's undefined or is a non-data component.\n    if (value === undefined || !component.type || compModel === 'none' || compModel === 'content') {\n        return;\n    }\n    const shouldClearValueWhenHidden = !component.hasOwnProperty('clearOnHide') || component.clearOnHide;\n    if (shouldClearValueWhenHidden &&\n        (isConditionallyHidden || ((_d = component.scope) === null || _d === void 0 ? void 0 : _d.conditionallyHidden))) {\n        (0, lodash_1.unset)(data, path);\n        if (!scope.clearHidden)\n            scope.clearHidden = {};\n        scope.clearHidden[path] = true;\n        // Make sure the filter does not include the value back.\n        if (!scope.filter)\n            scope.filter = {};\n        scope.filter[path] = false;\n    }\n};\nexports.clearHiddenProcessSync = clearHiddenProcessSync;\nconst clearHiddenProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.clearHiddenProcessSync)(context);\n});\nexports.clearHiddenProcess = clearHiddenProcess;\nexports.clearHiddenProcessInfo = {\n    name: 'clearHidden',\n    shouldProcess: () => true,\n    process: exports.clearHiddenProcess,\n    processSync: exports.clearHiddenProcessSync,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/clearHidden/index.js?");
 
 /***/ }),
 
@@ -377,7 +377,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.conditionProcessInfo = exports.simpleConditionProcessInfo = exports.customConditionProcessInfo = exports.conditionProcessSync = exports.conditionProcess = exports.simpleConditionProcessSync = exports.simpleConditionProcess = exports.customConditionProcessSync = exports.customConditionProcess = exports.conditionalProcess = exports.isConditionallyHidden = exports.isSimpleConditionallyHidden = exports.isCustomConditionallyHidden = exports.hasConditions = void 0;\nconst formUtil_1 = __webpack_require__(/*! ../../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst conditions_1 = __webpack_require__(/*! ../../utils/conditions */ \"./node_modules/@formio/core/lib/utils/conditions.js\");\nconst index_1 = __webpack_require__(/*! ../../utils/formUtil/index */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst hasCustomConditions = (context) => {\n    const { component } = context;\n    return !!component.customConditional;\n};\nconst hasSimpleConditions = (context) => {\n    const { component } = context;\n    const { conditional } = component;\n    if ((0, conditions_1.isLegacyConditional)(conditional) ||\n        (0, conditions_1.isSimpleConditional)(conditional) ||\n        (0, conditions_1.isJSONConditional)(conditional)) {\n        return true;\n    }\n    return false;\n};\nconst hasConditions = (context) => {\n    return hasSimpleConditions(context) || hasCustomConditions(context);\n};\nexports.hasConditions = hasConditions;\nconst isCustomConditionallyHidden = (context) => {\n    if (!hasCustomConditions(context)) {\n        return false;\n    }\n    const { component } = context;\n    const { customConditional } = component;\n    let show = null;\n    if (customConditional) {\n        show = (0, conditions_1.checkCustomConditional)(customConditional, context, 'show');\n    }\n    if (show === null) {\n        return false;\n    }\n    return !show;\n};\nexports.isCustomConditionallyHidden = isCustomConditionallyHidden;\nconst isSimpleConditionallyHidden = (context) => {\n    if (!hasSimpleConditions(context)) {\n        return false;\n    }\n    const { component } = context;\n    const { conditional } = component;\n    let show = null;\n    if ((0, conditions_1.isJSONConditional)(conditional)) {\n        show = (0, conditions_1.checkJsonConditional)(conditional, context);\n    }\n    if ((0, conditions_1.isLegacyConditional)(conditional)) {\n        show = (0, conditions_1.checkLegacyConditional)(conditional, context);\n    }\n    if ((0, conditions_1.isSimpleConditional)(conditional)) {\n        show = (0, conditions_1.checkSimpleConditional)(conditional, context);\n    }\n    if (show === null || show === undefined) {\n        return false;\n    }\n    return !show;\n};\nexports.isSimpleConditionallyHidden = isSimpleConditionallyHidden;\nconst isConditionallyHidden = (context) => {\n    return (0, exports.isCustomConditionallyHidden)(context) || (0, exports.isSimpleConditionallyHidden)(context);\n};\nexports.isConditionallyHidden = isConditionallyHidden;\nconst conditionalProcess = (context, isHidden) => {\n    const { scope, path, component } = context;\n    if (!(0, exports.hasConditions)(context)) {\n        return;\n    }\n    if (!scope.conditionals) {\n        scope.conditionals = [];\n    }\n    let conditionalComp = scope.conditionals.find((cond) => cond.path === path);\n    if (!conditionalComp) {\n        const conditionalPath = path ? path : (0, index_1.getComponentPaths)(component).fullPath || '';\n        conditionalComp = {\n            path: conditionalPath,\n            conditionallyHidden: false,\n        };\n        scope.conditionals.push(conditionalComp);\n    }\n    conditionalComp.conditionallyHidden = isHidden(context) === true;\n    if (conditionalComp.conditionallyHidden) {\n        (0, formUtil_1.setComponentScope)(component, 'conditionallyHidden', true);\n    }\n};\nexports.conditionalProcess = conditionalProcess;\nconst customConditionProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.customConditionProcessSync)(context);\n});\nexports.customConditionProcess = customConditionProcess;\nconst customConditionProcessSync = (context) => {\n    return (0, exports.conditionalProcess)(context, exports.isCustomConditionallyHidden);\n};\nexports.customConditionProcessSync = customConditionProcessSync;\nconst simpleConditionProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.simpleConditionProcessSync)(context);\n});\nexports.simpleConditionProcess = simpleConditionProcess;\nconst simpleConditionProcessSync = (context) => {\n    return (0, exports.conditionalProcess)(context, exports.isSimpleConditionallyHidden);\n};\nexports.simpleConditionProcessSync = simpleConditionProcessSync;\nconst conditionProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.conditionProcessSync)(context);\n});\nexports.conditionProcess = conditionProcess;\nconst conditionProcessSync = (context) => {\n    return (0, exports.conditionalProcess)(context, exports.isConditionallyHidden);\n};\nexports.conditionProcessSync = conditionProcessSync;\nexports.customConditionProcessInfo = {\n    name: 'customConditions',\n    process: exports.customConditionProcess,\n    processSync: exports.customConditionProcessSync,\n    shouldProcess: hasCustomConditions,\n};\nexports.simpleConditionProcessInfo = {\n    name: 'simpleConditions',\n    process: exports.simpleConditionProcess,\n    processSync: exports.simpleConditionProcessSync,\n    shouldProcess: hasSimpleConditions,\n};\nexports.conditionProcessInfo = {\n    name: 'conditions',\n    process: exports.conditionProcess,\n    processSync: exports.conditionProcessSync,\n    shouldProcess: hasSimpleConditions,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/conditions/index.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.conditionProcessInfo = exports.simpleConditionProcessInfo = exports.customConditionProcessInfo = exports.conditionProcessSync = exports.conditionProcess = exports.simpleConditionProcessSync = exports.simpleConditionProcess = exports.customConditionProcessSync = exports.customConditionProcess = exports.conditionalProcess = exports.isConditionallyHidden = exports.isSimpleConditionallyHidden = exports.isCustomConditionallyHidden = exports.hasConditions = void 0;\nconst formUtil_1 = __webpack_require__(/*! ../../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst conditions_1 = __webpack_require__(/*! ../../utils/conditions */ \"./node_modules/@formio/core/lib/utils/conditions.js\");\nconst index_1 = __webpack_require__(/*! ../../utils/formUtil/index */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst hasCustomConditions = (context) => {\n    const { component } = context;\n    return !!component.customConditional;\n};\nconst hasSimpleConditions = (context) => {\n    const { component } = context;\n    const { conditional } = component;\n    if ((0, conditions_1.isLegacyConditional)(conditional) ||\n        (0, conditions_1.isSimpleConditional)(conditional) ||\n        (0, conditions_1.isJSONConditional)(conditional)) {\n        return true;\n    }\n    return false;\n};\nconst hasConditions = (context) => {\n    return hasSimpleConditions(context) || hasCustomConditions(context);\n};\nexports.hasConditions = hasConditions;\nconst isCustomConditionallyHidden = (context) => {\n    if (!hasCustomConditions(context)) {\n        return false;\n    }\n    const { component } = context;\n    const { customConditional } = component;\n    let show = null;\n    if (customConditional) {\n        show = (0, conditions_1.checkCustomConditional)(customConditional, context, 'show');\n    }\n    if (show === null) {\n        return false;\n    }\n    return !show;\n};\nexports.isCustomConditionallyHidden = isCustomConditionallyHidden;\nconst isSimpleConditionallyHidden = (context) => {\n    if (!hasSimpleConditions(context)) {\n        return false;\n    }\n    const { component } = context;\n    const { conditional } = component;\n    let show = null;\n    if ((0, conditions_1.isJSONConditional)(conditional)) {\n        show = (0, conditions_1.checkJsonConditional)(conditional, context);\n    }\n    if ((0, conditions_1.isLegacyConditional)(conditional)) {\n        show = (0, conditions_1.checkLegacyConditional)(conditional, context);\n    }\n    if ((0, conditions_1.isSimpleConditional)(conditional)) {\n        show = (0, conditions_1.checkSimpleConditional)(conditional, context);\n    }\n    if (show === null || show === undefined) {\n        return false;\n    }\n    return !show;\n};\nexports.isSimpleConditionallyHidden = isSimpleConditionallyHidden;\nconst isConditionallyHidden = (context) => {\n    return (0, exports.isCustomConditionallyHidden)(context) || (0, exports.isSimpleConditionallyHidden)(context);\n};\nexports.isConditionallyHidden = isConditionallyHidden;\nconst conditionalProcess = (context, isHidden) => {\n    const { scope, path, component } = context;\n    if (!(0, exports.hasConditions)(context)) {\n        return;\n    }\n    if (!scope.conditionals) {\n        scope.conditionals = [];\n    }\n    let conditionalComp = scope.conditionals.find((cond) => cond.path === path);\n    if (!conditionalComp) {\n        const conditionalPath = path ? path : (0, index_1.getComponentPaths)(component).fullPath || '';\n        conditionalComp = {\n            path: conditionalPath,\n            conditionallyHidden: false,\n        };\n        scope.conditionals.push(conditionalComp);\n    }\n    conditionalComp.conditionallyHidden = isHidden(context) === true;\n    if (conditionalComp.conditionallyHidden) {\n        (0, formUtil_1.setComponentScope)(component, 'conditionallyHidden', true);\n    }\n};\nexports.conditionalProcess = conditionalProcess;\nconst customConditionProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.customConditionProcessSync)(context);\n});\nexports.customConditionProcess = customConditionProcess;\nconst customConditionProcessSync = (context) => {\n    return (0, exports.conditionalProcess)(context, exports.isCustomConditionallyHidden);\n};\nexports.customConditionProcessSync = customConditionProcessSync;\nconst simpleConditionProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.simpleConditionProcessSync)(context);\n});\nexports.simpleConditionProcess = simpleConditionProcess;\nconst simpleConditionProcessSync = (context) => {\n    return (0, exports.conditionalProcess)(context, exports.isSimpleConditionallyHidden);\n};\nexports.simpleConditionProcessSync = simpleConditionProcessSync;\nconst conditionProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.conditionProcessSync)(context);\n});\nexports.conditionProcess = conditionProcess;\nconst conditionProcessSync = (context) => {\n    return (0, exports.conditionalProcess)(context, exports.isConditionallyHidden);\n};\nexports.conditionProcessSync = conditionProcessSync;\nexports.customConditionProcessInfo = {\n    name: 'customConditions',\n    process: exports.customConditionProcess,\n    processSync: exports.customConditionProcessSync,\n    shouldProcess: hasCustomConditions,\n};\nexports.simpleConditionProcessInfo = {\n    name: 'simpleConditions',\n    process: exports.simpleConditionProcess,\n    processSync: exports.simpleConditionProcessSync,\n    shouldProcess: hasSimpleConditions,\n};\nexports.conditionProcessInfo = {\n    name: 'conditions',\n    process: exports.conditionProcess,\n    processSync: exports.conditionProcessSync,\n    shouldProcess: exports.hasConditions,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/conditions/index.js?");
 
 /***/ }),
 
@@ -388,7 +388,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.defaultValueProcessInfo = exports.serverDefaultValueProcessInfo = exports.customDefaultValueProcessInfo = exports.defaultValueProcessSync = exports.defaultValueProcess = exports.serverDefaultValueProcessSync = exports.serverDefaultValueProcess = exports.customDefaultValueProcessSync = exports.customDefaultValueProcess = exports.hasDefaultValue = exports.hasServerDefaultValue = exports.hasCustomDefaultValue = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./node_modules/@formio/core/lib/utils/index.js\");\nconst formUtil_1 = __webpack_require__(/*! ../../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst hasCustomDefaultValue = (context) => {\n    const { component } = context;\n    if (!component.customDefaultValue) {\n        return false;\n    }\n    return true;\n};\nexports.hasCustomDefaultValue = hasCustomDefaultValue;\nconst hasServerDefaultValue = (context) => {\n    const { component } = context;\n    if (!component.hasOwnProperty('defaultValue')) {\n        return false;\n    }\n    return true;\n};\nexports.hasServerDefaultValue = hasServerDefaultValue;\nconst hasDefaultValue = (context) => {\n    return (0, exports.hasCustomDefaultValue)(context) || (0, exports.hasServerDefaultValue)(context);\n};\nexports.hasDefaultValue = hasDefaultValue;\nconst customDefaultValueProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.customDefaultValueProcessSync)(context);\n});\nexports.customDefaultValueProcess = customDefaultValueProcess;\nconst customDefaultValueProcessSync = (context) => {\n    const { component, row, data, scope, path } = context;\n    if (!(0, exports.hasCustomDefaultValue)(context)) {\n        return;\n    }\n    if (!scope.defaultValues)\n        scope.defaultValues = [];\n    if ((0, lodash_1.has)(row, (0, formUtil_1.getComponentKey)(component))) {\n        return;\n    }\n    let defaultValue = null;\n    if (component.customDefaultValue) {\n        defaultValue = (0, utils_1.evaluate)(component.customDefaultValue, context, 'value', false, (context) => (context.value = null));\n        if (component.multiple && !Array.isArray(defaultValue)) {\n            defaultValue = defaultValue ? [defaultValue] : [];\n        }\n        scope.defaultValues.push({\n            path,\n            value: defaultValue,\n        });\n    }\n    if (defaultValue !== null && defaultValue !== undefined) {\n        (0, lodash_1.set)(data, path, defaultValue);\n    }\n};\nexports.customDefaultValueProcessSync = customDefaultValueProcessSync;\nconst serverDefaultValueProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.serverDefaultValueProcessSync)(context);\n});\nexports.serverDefaultValueProcess = serverDefaultValueProcess;\nconst serverDefaultValueProcessSync = (context) => {\n    const { component, row, data, scope, path } = context;\n    if (!(0, exports.hasServerDefaultValue)(context)) {\n        return;\n    }\n    if (!scope.defaultValues)\n        scope.defaultValues = [];\n    if ((0, lodash_1.has)(row, (0, formUtil_1.getComponentKey)(component))) {\n        return;\n    }\n    let defaultValue = null;\n    if (component.defaultValue !== undefined && component.defaultValue !== null) {\n        defaultValue = component.defaultValue;\n        if (component.multiple && !Array.isArray(defaultValue)) {\n            defaultValue = defaultValue ? [defaultValue] : [];\n        }\n        scope.defaultValues.push({\n            path,\n            value: defaultValue,\n        });\n    }\n    if (defaultValue !== null && defaultValue !== undefined) {\n        (0, lodash_1.set)(data, path, defaultValue);\n    }\n};\nexports.serverDefaultValueProcessSync = serverDefaultValueProcessSync;\nconst defaultValueProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.defaultValueProcessSync)(context);\n});\nexports.defaultValueProcess = defaultValueProcess;\nconst defaultValueProcessSync = (context) => {\n    (0, exports.customDefaultValueProcessSync)(context);\n    (0, exports.serverDefaultValueProcessSync)(context);\n};\nexports.defaultValueProcessSync = defaultValueProcessSync;\nexports.customDefaultValueProcessInfo = {\n    name: 'customDefaultValue',\n    process: exports.customDefaultValueProcess,\n    processSync: exports.customDefaultValueProcessSync,\n    shouldProcess: exports.hasCustomDefaultValue,\n};\nexports.serverDefaultValueProcessInfo = {\n    name: 'serverDefaultValue',\n    process: exports.serverDefaultValueProcess,\n    processSync: exports.serverDefaultValueProcessSync,\n    shouldProcess: exports.hasServerDefaultValue,\n};\nexports.defaultValueProcessInfo = {\n    name: 'defaultValue',\n    process: exports.defaultValueProcess,\n    processSync: exports.defaultValueProcessSync,\n    shouldProcess: exports.hasDefaultValue,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/defaultValue/index.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.defaultValueProcessInfo = exports.serverDefaultValueProcessInfo = exports.customDefaultValueProcessInfo = exports.defaultValueProcessSync = exports.defaultValueProcess = exports.serverDefaultValueProcessSync = exports.serverDefaultValueProcess = exports.customDefaultValueProcessSync = exports.customDefaultValueProcess = exports.hasDefaultValue = exports.hasServerDefaultValue = exports.hasCustomDefaultValue = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./node_modules/@formio/core/lib/utils/index.js\");\nconst formUtil_1 = __webpack_require__(/*! ../../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst hasCustomDefaultValue = (context) => {\n    const { component } = context;\n    if (!component.customDefaultValue) {\n        return false;\n    }\n    return true;\n};\nexports.hasCustomDefaultValue = hasCustomDefaultValue;\nconst hasServerDefaultValue = (context) => {\n    const { component } = context;\n    if (!component.hasOwnProperty('defaultValue')) {\n        return false;\n    }\n    return true;\n};\nexports.hasServerDefaultValue = hasServerDefaultValue;\nconst hasDefaultValue = (context) => {\n    return (0, exports.hasCustomDefaultValue)(context) || (0, exports.hasServerDefaultValue)(context);\n};\nexports.hasDefaultValue = hasDefaultValue;\nconst customDefaultValueProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.customDefaultValueProcessSync)(context);\n});\nexports.customDefaultValueProcess = customDefaultValueProcess;\nfunction setDefaultValue(context, defaultValue) {\n    var _a;\n    const { component, data, scope, path } = context;\n    if (defaultValue === null || defaultValue === undefined) {\n        return;\n    }\n    if (!scope.defaultValues)\n        scope.defaultValues = [];\n    scope.defaultValues.push({\n        path,\n        value: defaultValue,\n    });\n    (0, lodash_1.set)(data, path, defaultValue);\n    // If this component is not already included in the filter and is not a number, then include it from the default.\n    if (!scope.filter)\n        scope.filter = {};\n    if (!((_a = scope.clearHidden) === null || _a === void 0 ? void 0 : _a.hasOwnProperty(path)) && (0, formUtil_1.getModelType)(component) !== 'number') {\n        scope.filter[path] = true;\n    }\n}\nconst customDefaultValueProcessSync = (context) => {\n    const { component, row, scope } = context;\n    if (!(0, exports.hasCustomDefaultValue)(context)) {\n        return;\n    }\n    if (!scope.defaultValues)\n        scope.defaultValues = [];\n    if ((0, lodash_1.has)(row, (0, formUtil_1.getComponentKey)(component))) {\n        return;\n    }\n    let defaultValue = null;\n    if (component.customDefaultValue) {\n        defaultValue = (0, utils_1.evaluate)(component.customDefaultValue, context, 'value', false, (context) => (context.value = null));\n        if (component.multiple && !Array.isArray(defaultValue)) {\n            defaultValue = defaultValue ? [defaultValue] : [];\n        }\n    }\n    setDefaultValue(context, defaultValue);\n};\nexports.customDefaultValueProcessSync = customDefaultValueProcessSync;\nconst serverDefaultValueProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.serverDefaultValueProcessSync)(context);\n});\nexports.serverDefaultValueProcess = serverDefaultValueProcess;\nconst serverDefaultValueProcessSync = (context) => {\n    const { component, row, scope } = context;\n    if (!(0, exports.hasServerDefaultValue)(context)) {\n        return;\n    }\n    if (!scope.defaultValues)\n        scope.defaultValues = [];\n    if ((0, lodash_1.has)(row, (0, formUtil_1.getComponentKey)(component))) {\n        return;\n    }\n    let defaultValue = null;\n    if (component.defaultValue) {\n        defaultValue = component.defaultValue;\n        if (component.multiple && !Array.isArray(defaultValue)) {\n            defaultValue = defaultValue ? [defaultValue] : [];\n        }\n    }\n    setDefaultValue(context, defaultValue);\n};\nexports.serverDefaultValueProcessSync = serverDefaultValueProcessSync;\nconst defaultValueProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.defaultValueProcessSync)(context);\n});\nexports.defaultValueProcess = defaultValueProcess;\nconst defaultValueProcessSync = (context) => {\n    (0, exports.customDefaultValueProcessSync)(context);\n    (0, exports.serverDefaultValueProcessSync)(context);\n};\nexports.defaultValueProcessSync = defaultValueProcessSync;\nexports.customDefaultValueProcessInfo = {\n    name: 'customDefaultValue',\n    process: exports.customDefaultValueProcess,\n    processSync: exports.customDefaultValueProcessSync,\n    shouldProcess: exports.hasCustomDefaultValue,\n};\nexports.serverDefaultValueProcessInfo = {\n    name: 'serverDefaultValue',\n    process: exports.serverDefaultValueProcess,\n    processSync: exports.serverDefaultValueProcessSync,\n    shouldProcess: exports.hasServerDefaultValue,\n};\nexports.defaultValueProcessInfo = {\n    name: 'defaultValue',\n    process: exports.defaultValueProcess,\n    processSync: exports.defaultValueProcessSync,\n    shouldProcess: exports.hasDefaultValue,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/defaultValue/index.js?");
 
 /***/ }),
 
@@ -410,7 +410,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.fetchProcessInfo = exports.fetchProcess = exports.shouldFetch = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./node_modules/@formio/core/lib/utils/index.js\");\nconst formUtil_1 = __webpack_require__(/*! ../../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst shouldFetch = (context) => {\n    const { component, config } = context;\n    if (component.type !== 'datasource' ||\n        ((config === null || config === void 0 ? void 0 : config.server) && !(0, lodash_1.get)(component, 'trigger.server', false))) {\n        return false;\n    }\n    return true;\n};\nexports.shouldFetch = shouldFetch;\nconst fetchProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    var _a;\n    const { component, row, path, scope, config } = context;\n    let _fetch = null;\n    try {\n        _fetch = context.fetch ? context.fetch : fetch;\n    }\n    catch (ignoreErr) {\n        _fetch = null;\n    }\n    if (!_fetch) {\n        console.log('You must provide a fetch interface to the fetch processor.');\n        return;\n    }\n    if (!(0, exports.shouldFetch)(context)) {\n        return;\n    }\n    if (!scope.fetched)\n        scope.fetched = {};\n    const url = (0, utils_1.interpolate)((0, lodash_1.get)(component, 'fetch.url', ''), context);\n    if (!url) {\n        return;\n    }\n    const request = {\n        method: (0, lodash_1.get)(component, 'fetch.method', 'get').toUpperCase(),\n        headers: {},\n    };\n    if ((config === null || config === void 0 ? void 0 : config.headers) &&\n        (component === null || component === void 0 ? void 0 : component.fetch) &&\n        ((_a = component === null || component === void 0 ? void 0 : component.fetch) === null || _a === void 0 ? void 0 : _a.forwardHeaders)) {\n        request.headers = JSON.parse(JSON.stringify(config.headers));\n        delete request.headers['host'];\n        delete request.headers['content-length'];\n        delete request.headers['content-type'];\n        delete request.headers['connection'];\n        delete request.headers['cache-control'];\n    }\n    request.headers['Accept'] = '*/*';\n    request.headers['user-agent'] = 'Form.io DataSource Component';\n    (0, lodash_1.get)(component, 'fetch.headers', []).map((header) => {\n        header.value = (0, utils_1.interpolate)(header.value, context);\n        if (header.value && header.key) {\n            request.headers[header.key] = header.value;\n        }\n        return header;\n    });\n    if ((0, lodash_1.get)(component, 'fetch.authenticate', false) && (config === null || config === void 0 ? void 0 : config.tokens)) {\n        Object.assign(request.headers, config.tokens);\n    }\n    const body = (0, lodash_1.get)(component, 'fetch.specifyBody', '');\n    if (request.method === 'POST') {\n        request.body = JSON.stringify((0, utils_1.evaluate)(body, context, 'body'));\n    }\n    try {\n        // Perform the fetch.\n        const result = yield (yield _fetch(url, request)).json();\n        const mapFunction = (0, lodash_1.get)(component, 'fetch.mapFunction');\n        // Set the row data of the fetched value.\n        const key = (0, formUtil_1.getComponentKey)(component);\n        (0, lodash_1.set)(row, key, mapFunction\n            ? (0, utils_1.evaluate)(mapFunction, Object.assign(Object.assign({}, context), { responseData: result }), 'value')\n            : result);\n        // Make sure the value does not get filtered for now...\n        if (!scope.filter)\n            scope.filter = {};\n        scope.filter[path] = true;\n        scope.fetched[path] = (0, lodash_1.get)(row, key);\n    }\n    catch (err) {\n        console.log(err.message);\n    }\n});\nexports.fetchProcess = fetchProcess;\nexports.fetchProcessInfo = {\n    name: 'fetch',\n    process: exports.fetchProcess,\n    shouldProcess: exports.shouldFetch,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/fetch/index.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.fetchProcessInfo = exports.fetchProcess = exports.shouldFetch = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./node_modules/@formio/core/lib/utils/index.js\");\nconst formUtil_1 = __webpack_require__(/*! ../../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst shouldFetch = (context) => {\n    const { component, config } = context;\n    if (component.type !== 'datasource' ||\n        ((config === null || config === void 0 ? void 0 : config.server) && !(0, lodash_1.get)(component, 'trigger.server', false))) {\n        return false;\n    }\n    return true;\n};\nexports.shouldFetch = shouldFetch;\nconst fetchProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    var _a, _b;\n    const { component, row, path, scope, config } = context;\n    let _fetch = null;\n    try {\n        _fetch = context.fetch ? context.fetch : fetch;\n    }\n    catch (ignoreErr) {\n        _fetch = null;\n    }\n    if (!_fetch) {\n        console.log('You must provide a fetch interface to the fetch processor.');\n        return;\n    }\n    if (!(0, exports.shouldFetch)(context)) {\n        return;\n    }\n    if (!scope.fetched)\n        scope.fetched = {};\n    const url = (0, utils_1.interpolate)((0, lodash_1.get)(component, 'fetch.url', ''), context);\n    if (!url) {\n        return;\n    }\n    const request = {\n        method: (0, lodash_1.get)(component, 'fetch.method', 'get').toUpperCase(),\n        headers: {},\n    };\n    if ((config === null || config === void 0 ? void 0 : config.headers) &&\n        (component === null || component === void 0 ? void 0 : component.fetch) &&\n        ((_a = component === null || component === void 0 ? void 0 : component.fetch) === null || _a === void 0 ? void 0 : _a.forwardHeaders)) {\n        request.headers = JSON.parse(JSON.stringify(config.headers));\n        delete request.headers['host'];\n        delete request.headers['content-length'];\n        delete request.headers['content-type'];\n        delete request.headers['connection'];\n        delete request.headers['cache-control'];\n    }\n    request.headers['Accept'] = '*/*';\n    request.headers['user-agent'] = 'Form.io DataSource Component';\n    (0, lodash_1.get)(component, 'fetch.headers', []).map((header) => {\n        header.value = (0, utils_1.interpolate)(header.value, context);\n        if (header.value && header.key) {\n            request.headers[header.key] = header.value;\n        }\n        return header;\n    });\n    if ((0, lodash_1.get)(component, 'fetch.authenticate', false) && (config === null || config === void 0 ? void 0 : config.tokens)) {\n        Object.assign(request.headers, config.tokens);\n    }\n    const body = (0, lodash_1.get)(component, 'fetch.specifyBody', '');\n    if (request.method === 'POST') {\n        request.body = JSON.stringify((0, utils_1.evaluate)(body, context, 'body'));\n    }\n    try {\n        // Perform the fetch.\n        const result = yield (yield _fetch(url, request)).json();\n        const mapFunction = (0, lodash_1.get)(component, 'fetch.mapFunction');\n        // Set the row data of the fetched value.\n        const key = (0, formUtil_1.getComponentKey)(component);\n        (0, lodash_1.set)(row, key, mapFunction\n            ? (0, utils_1.evaluate)(mapFunction, Object.assign(Object.assign({}, context), { responseData: result }), 'value')\n            : result);\n        // Make sure the value does not get filtered for now...\n        if (!scope.filter)\n            scope.filter = {};\n        if (!((_b = scope.clearHidden) === null || _b === void 0 ? void 0 : _b.hasOwnProperty(path))) {\n            scope.filter[path] = true;\n        }\n        scope.fetched[path] = (0, lodash_1.get)(row, key);\n    }\n    catch (err) {\n        console.log(err.message);\n    }\n});\nexports.fetchProcess = fetchProcess;\nexports.fetchProcessInfo = {\n    name: 'fetch',\n    process: exports.fetchProcess,\n    shouldProcess: exports.shouldFetch,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/fetch/index.js?");
 
 /***/ }),
 
@@ -421,18 +421,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.filterProcessInfo = exports.filterPostProcess = exports.filterProcess = exports.filterProcessSync = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst lodash_2 = __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 filterProcessSync = (context) => {\n    const { scope, component, path } = context;\n    const { value } = context;\n    if (!scope.filter)\n        scope.filter = {};\n    if (value !== undefined) {\n        const modelType = (0, formUtil_1.getModelType)(component);\n        switch (modelType) {\n            case 'dataObject':\n                scope.filter[path] = {\n                    compModelType: modelType,\n                    include: true,\n                    value: { data: {} },\n                };\n                break;\n            case 'nestedArray':\n                scope.filter[path] = {\n                    compModelType: modelType,\n                    include: true,\n                    value: [],\n                };\n                break;\n            case 'nestedDataArray':\n                scope.filter[path] = {\n                    compModelType: modelType,\n                    include: true,\n                    value: Array.isArray(value) ? value.map((v) => (Object.assign(Object.assign({}, v), { data: {} }))) : [],\n                };\n                break;\n            case 'object':\n                scope.filter[path] = {\n                    compModelType: modelType,\n                    include: true,\n                    value: component.type === 'address' ? false : {},\n                };\n                break;\n            default:\n                scope.filter[path] = {\n                    compModelType: modelType,\n                    include: true,\n                };\n                break;\n        }\n    }\n};\nexports.filterProcessSync = filterProcessSync;\nconst filterProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.filterProcessSync)(context);\n});\nexports.filterProcess = filterProcess;\nconst filterPostProcess = (context) => {\n    var _a;\n    const { scope, submission } = context;\n    const filtered = {};\n    for (const path in scope.filter) {\n        if (scope.filter[path].include) {\n            let value = (0, lodash_2.get)(submission === null || submission === void 0 ? void 0 : submission.data, path);\n            if (scope.filter[path].value) {\n                if ((0, lodash_2.isObject)(value) && ((_a = scope.filter[path].value) === null || _a === void 0 ? void 0 : _a.data)) {\n                    value = Object.assign(Object.assign({}, value), scope.filter[path].value);\n                }\n                else {\n                    value = scope.filter[path].value;\n                }\n            }\n            (0, lodash_1.set)(filtered, path, value);\n        }\n    }\n    context.data = filtered;\n};\nexports.filterPostProcess = filterPostProcess;\nexports.filterProcessInfo = {\n    name: 'filter',\n    process: exports.filterProcess,\n    processSync: exports.filterProcessSync,\n    postProcess: exports.filterPostProcess,\n    shouldProcess: () => true,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/filter/index.js?");
-
-/***/ }),
-
-/***/ "./node_modules/@formio/core/lib/process/hideChildren.js":
-/*!***************************************************************!*\
-  !*** ./node_modules/@formio/core/lib/process/hideChildren.js ***!
-  \***************************************************************/
-/***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.hideChildrenProcessorInfo = exports.hideChildrenProcessorAsync = exports.hideChildrenProcessor = void 0;\nconst formUtil_1 = __webpack_require__(/*! ../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\n/**\n * This processor function checks components for the `hidden` property and, if children are present, sets them to hidden as well.\n */\nconst hideChildrenProcessor = (context) => {\n    var _a, _b, _c;\n    const { component, path, parent, scope } = context;\n    // Check if there's a conditional set for the component and if it's marked as conditionally hidden\n    const isConditionallyHidden = (_a = scope.conditionals) === null || _a === void 0 ? void 0 : _a.find((cond) => {\n        return path === cond.path && cond.conditionallyHidden;\n    });\n    if (!scope.conditionals) {\n        scope.conditionals = [];\n    }\n    if (isConditionallyHidden || ((_b = parent === null || parent === void 0 ? void 0 : parent.scope) === null || _b === void 0 ? void 0 : _b.conditionallyHidden)) {\n        (0, formUtil_1.setComponentScope)(component, 'conditionallyHidden', true);\n    }\n    if ((component.hasOwnProperty('hidden') && !!component.hidden) ||\n        ((_c = parent === null || parent === void 0 ? void 0 : parent.scope) === null || _c === void 0 ? void 0 : _c.intentionallyHidden)) {\n        (0, formUtil_1.setComponentScope)(component, 'intentionallyHidden', true);\n    }\n};\nexports.hideChildrenProcessor = hideChildrenProcessor;\nconst hideChildrenProcessorAsync = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.hideChildrenProcessor)(context);\n});\nexports.hideChildrenProcessorAsync = hideChildrenProcessorAsync;\nexports.hideChildrenProcessorInfo = {\n    name: 'hideChildren',\n    shouldProcess: () => true,\n    processSync: exports.hideChildrenProcessor,\n    process: exports.hideChildrenProcessorAsync,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/hideChildren.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.filterProcessInfo = exports.filterPostProcess = exports.filterPostProcessSync = exports.filterProcess = exports.filterProcessSync = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst lodash_2 = __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 filterProcessSync = (context) => {\n    const { scope, path, value } = context;\n    if (!scope.filter)\n        scope.filter = {};\n    if (value !== undefined) {\n        scope.filter[path] = true;\n    }\n};\nexports.filterProcessSync = filterProcessSync;\nconst filterProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.filterProcessSync)(context);\n});\nexports.filterProcess = filterProcess;\nconst filterPostProcessSync = (context) => {\n    const { scope, path, data, component, value } = context;\n    if (!scope.filter)\n        scope.filter = {};\n    if (value === undefined || !scope.filter[path]) {\n        return;\n    }\n    scope.filtered = scope.filtered || {};\n    const modelType = (0, formUtil_1.getModelType)(component);\n    if (component.type === 'address' ||\n        (modelType !== 'dataObject' &&\n            modelType !== 'nestedArray' &&\n            modelType !== 'nestedDataArray' &&\n            modelType !== 'object')) {\n        (0, lodash_1.set)(scope.filtered, path, value);\n    }\n    else {\n        if (modelType === 'dataObject') {\n            (0, lodash_1.set)(data, `${path}.data`, (0, lodash_2.get)(scope.filtered, `${path}.data`, (value === null || value === void 0 ? void 0 : value.data) || {}));\n            (0, lodash_1.set)(scope.filtered, path, (0, lodash_2.get)(data, path));\n        }\n        else if (modelType === 'nestedDataArray') {\n            const filtered = (0, lodash_2.get)(scope.filtered, path, []);\n            (0, lodash_1.set)(scope.filtered, path, value.map((item, index) => {\n                var _a;\n                return Object.assign(Object.assign({}, item), { data: ((_a = filtered[index]) === null || _a === void 0 ? void 0 : _a.data) || {} });\n            }));\n        }\n        else if (!(0, lodash_1.has)(scope.filtered, path)) {\n            (0, lodash_1.set)(scope.filtered, path, value);\n        }\n        else {\n            (0, lodash_1.set)(data, path, (0, lodash_2.get)(scope.filtered, path, value));\n        }\n    }\n};\nexports.filterPostProcessSync = filterPostProcessSync;\nconst filterPostProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.filterPostProcessSync)(context);\n});\nexports.filterPostProcess = filterPostProcess;\nexports.filterProcessInfo = {\n    name: 'filter',\n    process: exports.filterProcess,\n    processSync: exports.filterProcessSync,\n    postProcess: exports.filterPostProcess,\n    postProcessSync: exports.filterPostProcessSync,\n    shouldProcess: () => true,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/filter/index.js?");
 
 /***/ }),
 
@@ -443,7 +432,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (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 __exportStar = (this && this.__exportStar) || function(m, exports) {\n    for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n__exportStar(__webpack_require__(/*! ./validation */ \"./node_modules/@formio/core/lib/process/validation/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./calculation */ \"./node_modules/@formio/core/lib/process/calculation/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./conditions */ \"./node_modules/@formio/core/lib/process/conditions/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./defaultValue */ \"./node_modules/@formio/core/lib/process/defaultValue/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./fetch */ \"./node_modules/@formio/core/lib/process/fetch/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./filter */ \"./node_modules/@formio/core/lib/process/filter/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./logic */ \"./node_modules/@formio/core/lib/process/logic/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./populate */ \"./node_modules/@formio/core/lib/process/populate/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./processOne */ \"./node_modules/@formio/core/lib/process/processOne.js\"), exports);\n__exportStar(__webpack_require__(/*! ./process */ \"./node_modules/@formio/core/lib/process/process.js\"), exports);\n__exportStar(__webpack_require__(/*! ./normalize */ \"./node_modules/@formio/core/lib/process/normalize/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./dereference */ \"./node_modules/@formio/core/lib/process/dereference/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./clearHidden */ \"./node_modules/@formio/core/lib/process/clearHidden/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./hideChildren */ \"./node_modules/@formio/core/lib/process/hideChildren.js\"), exports);\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/index.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 __exportStar = (this && this.__exportStar) || function(m, exports) {\n    for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n__exportStar(__webpack_require__(/*! ./validation */ \"./node_modules/@formio/core/lib/process/validation/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./calculation */ \"./node_modules/@formio/core/lib/process/calculation/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./conditions */ \"./node_modules/@formio/core/lib/process/conditions/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./defaultValue */ \"./node_modules/@formio/core/lib/process/defaultValue/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./fetch */ \"./node_modules/@formio/core/lib/process/fetch/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./filter */ \"./node_modules/@formio/core/lib/process/filter/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./logic */ \"./node_modules/@formio/core/lib/process/logic/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./populate */ \"./node_modules/@formio/core/lib/process/populate/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./processOne */ \"./node_modules/@formio/core/lib/process/processOne.js\"), exports);\n__exportStar(__webpack_require__(/*! ./process */ \"./node_modules/@formio/core/lib/process/process.js\"), exports);\n__exportStar(__webpack_require__(/*! ./normalize */ \"./node_modules/@formio/core/lib/process/normalize/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./dereference */ \"./node_modules/@formio/core/lib/process/dereference/index.js\"), exports);\n__exportStar(__webpack_require__(/*! ./clearHidden */ \"./node_modules/@formio/core/lib/process/clearHidden/index.js\"), exports);\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/index.js?");
 
 /***/ }),
 
@@ -465,7 +454,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.normalizeProcessInfo = exports.normalizeProcessSync = exports.normalizeProcess = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst dayjs_1 = __importDefault(__webpack_require__(/*! dayjs */ \"./node_modules/dayjs/dayjs.min.js\"));\nconst customParseFormat_1 = __importDefault(__webpack_require__(/*! dayjs/plugin/customParseFormat */ \"./node_modules/dayjs/plugin/customParseFormat.js\"));\ndayjs_1.default.extend(customParseFormat_1.default);\nconst isAddressComponent = (component) => component.type === 'address';\nconst isDayComponent = (component) => component.type === 'day';\nconst isEmailComponent = (component) => component.type === 'email';\nconst isRadioComponent = (component) => component.type === 'radio';\nconst isSelectComponent = (component) => component.type === 'select';\nconst isSelectBoxesComponent = (component) => component.type === 'selectboxes';\nconst isTagsComponent = (component) => component.type === 'tags';\nconst isTextFieldComponent = (component) => component.type === 'textfield';\nconst isTimeComponent = (component) => component.type === 'time';\nconst isNumberComponent = (component) => component.type === 'number';\nconst normalizeAddressComponentValue = (component, value) => {\n    if (!component.multiple && Boolean(component.enableManualMode) && value && !value.mode) {\n        return {\n            mode: 'autocomplete',\n            address: value,\n        };\n    }\n    return value;\n};\nconst getLocaleDateFormatInfo = (locale = 'en') => {\n    const formatInfo = {};\n    const day = 21;\n    const exampleDate = new Date(2017, 11, day);\n    const localDateString = exampleDate.toLocaleDateString(locale);\n    formatInfo.dayFirst = localDateString.slice(0, 2) === day.toString();\n    return formatInfo;\n};\nconst getLocaleDayFirst = (component, form) => {\n    var _a;\n    if (component.useLocaleSettings) {\n        return getLocaleDateFormatInfo((_a = form.options) === null || _a === void 0 ? void 0 : _a.language).dayFirst;\n    }\n    return component.dayFirst;\n};\nconst normalizeDayComponentValue = (component, form, value) => {\n    // TODO: this is a quick and dirty port of the Day component's normalizeValue method, may need some updates\n    const valueMask = /^\\d{2}\\/\\d{2}\\/\\d{4}$/;\n    const isDayFirst = getLocaleDayFirst(component, form);\n    const showDay = !(0, lodash_1.get)(component, 'fields.day.hide', false);\n    const showMonth = !(0, lodash_1.get)(component, 'fields.month.hide', false);\n    const showYear = !(0, lodash_1.get)(component, 'fields.year.hide', false);\n    if (!value || valueMask.test(value)) {\n        return value;\n    }\n    const dateParts = [];\n    const valueParts = value.split('/');\n    const [DAY, MONTH, YEAR] = component.dayFirst ? [0, 1, 2] : [1, 0, 2];\n    const defaultValue = component.defaultValue ? component.defaultValue.split('/') : '';\n    let defaultDay = '';\n    let defaultMonth = '';\n    let defaultYear = '';\n    const getDayWithHiddenFields = (parts) => {\n        let DAY, MONTH, YEAR;\n        [DAY, MONTH, YEAR] = component.dayFirst ? [0, 1, 2] : [1, 0, 2];\n        if (!showDay) {\n            MONTH = MONTH === 0 ? 0 : MONTH - 1;\n            YEAR = YEAR - 1;\n            DAY = null;\n        }\n        if (!showMonth) {\n            if (!(0, lodash_1.isNull)(DAY)) {\n                DAY = DAY === 0 ? 0 : DAY - 1;\n            }\n            YEAR = YEAR - 1;\n            MONTH = null;\n        }\n        if (!showYear) {\n            YEAR = null;\n        }\n        return {\n            month: (0, lodash_1.isNull)(MONTH) ? '' : parts[MONTH],\n            day: (0, lodash_1.isNull)(DAY) ? '' : parts[DAY],\n            year: (0, lodash_1.isNull)(YEAR) ? '' : parts[YEAR],\n        };\n    };\n    const getNextPart = (shouldTake, defaultValue) => {\n        // Only push the part if it's not an empty string\n        const part = shouldTake ? valueParts.shift() : defaultValue;\n        if (part !== '') {\n            dateParts.push(part);\n        }\n    };\n    if (defaultValue) {\n        const hasHiddenFields = defaultValue.length !== 3;\n        defaultDay = hasHiddenFields ? getDayWithHiddenFields(defaultValue).day : defaultValue[DAY];\n        defaultMonth = hasHiddenFields\n            ? getDayWithHiddenFields(defaultValue).month\n            : defaultValue[MONTH];\n        defaultYear = hasHiddenFields ? getDayWithHiddenFields(defaultValue).year : defaultValue[YEAR];\n    }\n    if (isDayFirst) {\n        getNextPart(showDay, defaultDay);\n    }\n    getNextPart(showMonth, defaultMonth);\n    if (!isDayFirst) {\n        getNextPart(showDay, defaultDay);\n    }\n    getNextPart(showYear, defaultYear);\n    return dateParts.join('/');\n};\nconst normalizeRadioComponentValue = (value, dataType) => {\n    switch (dataType) {\n        case 'number':\n            return +value;\n        case 'string':\n            return typeof value === 'object' ? JSON.stringify(value) : String(value);\n        case 'boolean':\n            return !(!value || value.toString() === 'false');\n    }\n    const isEquivalent = (0, lodash_1.toString)(value) === Number(value).toString();\n    if (!isNaN(parseFloat(value)) && isFinite(value) && isEquivalent) {\n        return +value;\n    }\n    if (value === 'true') {\n        return true;\n    }\n    if (value === 'false') {\n        return false;\n    }\n    return value;\n};\nconst normalizeSingleSelectComponentValue = (component, value) => {\n    if ((0, lodash_1.isNil)(value)) {\n        return;\n    }\n    const valueIsObject = (0, lodash_1.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 = 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) &&\n                Number.isFinite(numberValue) &&\n                value !== '' &&\n                isEquivalent) {\n                this.value = numberValue;\n            }\n            return this;\n        },\n        boolean() {\n            if ((0, lodash_1.isString)(this.value) &&\n                (this.value.toLowerCase() === 'true' || 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 ((0, lodash_1.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};\nconst normalizeSelectComponentValue = (component, value) => {\n    if (component.multiple && Array.isArray(value)) {\n        return value.map((singleValue) => normalizeSingleSelectComponentValue(component, singleValue));\n    }\n    return normalizeSingleSelectComponentValue(component, value);\n};\nconst normalizeSelectBoxesComponentValue = (value) => {\n    if (!value) {\n        value = {};\n    }\n    if (typeof value !== 'object') {\n        if (typeof value === 'string') {\n            return {\n                [value]: true,\n            };\n        }\n        else {\n            return {};\n        }\n    }\n    if (Array.isArray(value)) {\n        return value.reduce((acc, curr) => {\n            return Object.assign(Object.assign({}, acc), { [curr]: true });\n        }, {});\n    }\n    return value;\n};\nconst normalizeTagsComponentValue = (component, value) => {\n    const delimiter = component.delimeter || ',';\n    if ((!component.hasOwnProperty('storeas') || component.storeas === 'string') &&\n        Array.isArray(value)) {\n        return value.join(delimiter);\n    }\n    else if (component.storeas === 'array' && typeof value === 'string') {\n        return value.split(delimiter).filter((result) => result);\n    }\n    return value;\n};\nconst normalizeMaskValue = (component, defaultValues, value, path) => {\n    if (component.inputMasks && component.inputMasks.length > 0) {\n        if (!value || typeof value !== 'object') {\n            return {\n                value: value,\n                maskName: component.inputMasks[0].label,\n            };\n        }\n        if (!value.value) {\n            const defaultValue = defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.find((defaultValue) => defaultValue.path === path);\n            value.value =\n                Array.isArray(defaultValue) && defaultValue.length > 0 ? defaultValue[0] : defaultValue;\n        }\n    }\n    return value;\n};\nconst normalizeTextFieldComponentValue = (component, defaultValues, value, path) => {\n    // If the component has truncate multiple spaces enabled, then normalize the value to remove extra spaces.\n    if (component.truncateMultipleSpaces && typeof value === 'string') {\n        value = value.trim().replace(/\\s{2,}/g, ' ');\n    }\n    if (component.allowMultipleMasks && component.inputMasks && component.inputMasks.length > 0) {\n        if (Array.isArray(value)) {\n            return value.map((val) => normalizeMaskValue(component, defaultValues, val, path));\n        }\n        else {\n            return normalizeMaskValue(component, defaultValues, value, path);\n        }\n    }\n    return value;\n};\n// Allow submissions of time components in their visual \"format\" property by coercing them to the \"dataFormat\" property\n// i.e. \"HH:mm\" -> \"HH:mm:ss\"\nconst normalizeTimeComponentValue = (component, value) => {\n    const defaultDataFormat = 'HH:mm:ss';\n    const defaultFormat = 'HH:mm';\n    if ((0, dayjs_1.default)(value, component.format || defaultFormat, true).isValid()) {\n        return (0, dayjs_1.default)(value, component.format || defaultFormat, true).format(component.dataFormat || defaultDataFormat);\n    }\n    return value;\n};\nconst normalizeSingleNumberComponentValue = (component, value) => {\n    if (!isNaN(parseFloat(value)) && isFinite(value)) {\n        return +value;\n    }\n    return value;\n};\nconst normalizeNumberComponentValue = (component, value) => {\n    if (component.multiple && Array.isArray(value)) {\n        return value.map((singleValue) => normalizeSingleNumberComponentValue(component, singleValue));\n    }\n    return normalizeSingleNumberComponentValue(component, value);\n};\nconst normalizeProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.normalizeProcessSync)(context);\n});\nexports.normalizeProcess = normalizeProcess;\nconst normalizeProcessSync = (context) => {\n    const { component, form, scope, path, data, value } = context;\n    if (!scope.normalize) {\n        scope.normalize = {};\n    }\n    const { defaultValues } = scope;\n    scope.normalize[path] = {\n        type: component.type,\n        normalized: false,\n    };\n    // First check for component-type-specific transformations\n    if (isAddressComponent(component)) {\n        (0, lodash_1.set)(data, path, normalizeAddressComponentValue(component, value));\n        scope.normalize[path].normalized = true;\n    }\n    else if (isDayComponent(component)) {\n        (0, lodash_1.set)(data, path, normalizeDayComponentValue(component, form, value));\n        scope.normalize[path].normalized = true;\n    }\n    else if (isEmailComponent(component)) {\n        if (value && typeof value === 'string') {\n            (0, lodash_1.set)(data, path, value.toLowerCase());\n            scope.normalize[path].normalized = true;\n        }\n    }\n    else if (isRadioComponent(component)) {\n        (0, lodash_1.set)(data, path, normalizeRadioComponentValue(value, component.dataType));\n        scope.normalize[path].normalized = true;\n    }\n    else if (isSelectComponent(component)) {\n        (0, lodash_1.set)(data, path, normalizeSelectComponentValue(component, value));\n        scope.normalize[path].normalized = true;\n    }\n    else if (isSelectBoxesComponent(component)) {\n        (0, lodash_1.set)(data, path, normalizeSelectBoxesComponentValue(value));\n        scope.normalize[path].normalized = true;\n    }\n    else if (isTagsComponent(component)) {\n        (0, lodash_1.set)(data, path, normalizeTagsComponentValue(component, value));\n        scope.normalize[path].normalized = true;\n    }\n    else if (isTextFieldComponent(component)) {\n        (0, lodash_1.set)(data, path, normalizeTextFieldComponentValue(component, defaultValues, value, path));\n        scope.normalize[path].normalized = true;\n    }\n    else if (isTimeComponent(component)) {\n        (0, lodash_1.set)(data, path, normalizeTimeComponentValue(component, value));\n        scope.normalize[path].normalized = true;\n    }\n    else if (isNumberComponent(component)) {\n        (0, lodash_1.set)(data, path, normalizeNumberComponentValue(component, value));\n        scope.normalize[path].normalized = true;\n    }\n    // Next perform component-type-agnostic transformations (i.e. super())\n    if (component.multiple && !Array.isArray(value)) {\n        (0, lodash_1.set)(data, path, value ? [value] : []);\n        scope.normalize[path].normalized = true;\n    }\n};\nexports.normalizeProcessSync = normalizeProcessSync;\nexports.normalizeProcessInfo = {\n    name: 'normalize',\n    shouldProcess: () => true,\n    process: exports.normalizeProcess,\n    processSync: exports.normalizeProcessSync,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/normalize/index.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.normalizeProcessInfo = exports.normalizeProcessSync = exports.normalizeProcess = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst dayjs_1 = __importDefault(__webpack_require__(/*! dayjs */ \"./node_modules/dayjs/dayjs.min.js\"));\nconst customParseFormat_1 = __importDefault(__webpack_require__(/*! dayjs/plugin/customParseFormat */ \"./node_modules/dayjs/plugin/customParseFormat.js\"));\ndayjs_1.default.extend(customParseFormat_1.default);\nconst isAddressComponent = (component) => component.type === 'address';\nconst isDayComponent = (component) => component.type === 'day';\nconst isEmailComponent = (component) => component.type === 'email';\nconst isRadioComponent = (component) => component.type === 'radio';\nconst isSelectComponent = (component) => component.type === 'select';\nconst isSelectBoxesComponent = (component) => component.type === 'selectboxes';\nconst isTagsComponent = (component) => component.type === 'tags';\nconst isTextFieldComponent = (component) => component.type === 'textfield';\nconst isTimeComponent = (component) => component.type === 'time';\nconst isNumberComponent = (component) => component.type === 'number';\nconst normalizeAddressComponentValue = (component, value) => {\n    if (!component.multiple && Boolean(component.enableManualMode) && value && !value.mode) {\n        return {\n            mode: 'autocomplete',\n            address: value,\n        };\n    }\n    return value;\n};\nconst getLocaleDateFormatInfo = (locale = 'en') => {\n    const formatInfo = {};\n    const day = 21;\n    const exampleDate = new Date(2017, 11, day);\n    const localDateString = exampleDate.toLocaleDateString(locale);\n    formatInfo.dayFirst = localDateString.slice(0, 2) === day.toString();\n    return formatInfo;\n};\nconst getLocaleDayFirst = (component, form) => {\n    var _a;\n    if (component.useLocaleSettings) {\n        return getLocaleDateFormatInfo((_a = form.options) === null || _a === void 0 ? void 0 : _a.language).dayFirst;\n    }\n    return component.dayFirst;\n};\nconst normalizeDayComponentValue = (component, form, value) => {\n    // TODO: this is a quick and dirty port of the Day component's normalizeValue method, may need some updates\n    const valueMask = /^\\d{2}\\/\\d{2}\\/\\d{4}$/;\n    const isDayFirst = getLocaleDayFirst(component, form);\n    const showDay = !(0, lodash_1.get)(component, 'fields.day.hide', false);\n    const showMonth = !(0, lodash_1.get)(component, 'fields.month.hide', false);\n    const showYear = !(0, lodash_1.get)(component, 'fields.year.hide', false);\n    if (!value || valueMask.test(value)) {\n        return value;\n    }\n    const dateParts = [];\n    const valueParts = value.split('/');\n    const [DAY, MONTH, YEAR] = component.dayFirst ? [0, 1, 2] : [1, 0, 2];\n    const defaultValue = component.defaultValue ? component.defaultValue.split('/') : '';\n    let defaultDay = '';\n    let defaultMonth = '';\n    let defaultYear = '';\n    const getDayWithHiddenFields = (parts) => {\n        let DAY, MONTH, YEAR;\n        [DAY, MONTH, YEAR] = component.dayFirst ? [0, 1, 2] : [1, 0, 2];\n        if (!showDay) {\n            MONTH = MONTH === 0 ? 0 : MONTH - 1;\n            YEAR = YEAR - 1;\n            DAY = null;\n        }\n        if (!showMonth) {\n            if (!(0, lodash_1.isNull)(DAY)) {\n                DAY = DAY === 0 ? 0 : DAY - 1;\n            }\n            YEAR = YEAR - 1;\n            MONTH = null;\n        }\n        if (!showYear) {\n            YEAR = null;\n        }\n        return {\n            month: (0, lodash_1.isNull)(MONTH) ? '' : parts[MONTH],\n            day: (0, lodash_1.isNull)(DAY) ? '' : parts[DAY],\n            year: (0, lodash_1.isNull)(YEAR) ? '' : parts[YEAR],\n        };\n    };\n    const getNextPart = (shouldTake, defaultValue) => {\n        // Only push the part if it's not an empty string\n        const part = shouldTake ? valueParts.shift() : defaultValue;\n        if (part !== '') {\n            dateParts.push(part);\n        }\n    };\n    if (defaultValue) {\n        const hasHiddenFields = defaultValue.length !== 3;\n        defaultDay = hasHiddenFields ? getDayWithHiddenFields(defaultValue).day : defaultValue[DAY];\n        defaultMonth = hasHiddenFields\n            ? getDayWithHiddenFields(defaultValue).month\n            : defaultValue[MONTH];\n        defaultYear = hasHiddenFields ? getDayWithHiddenFields(defaultValue).year : defaultValue[YEAR];\n    }\n    if (isDayFirst) {\n        getNextPart(showDay, defaultDay);\n    }\n    getNextPart(showMonth, defaultMonth);\n    if (!isDayFirst) {\n        getNextPart(showDay, defaultDay);\n    }\n    getNextPart(showYear, defaultYear);\n    return dateParts.join('/');\n};\nconst normalizeRadioComponentValue = (value, dataType) => {\n    switch (dataType) {\n        case 'number':\n            return +value;\n        case 'string':\n            return typeof value === 'object' ? JSON.stringify(value) : String(value);\n        case 'boolean':\n            return !(!value || value.toString() === 'false');\n    }\n    const isEquivalent = (0, lodash_1.toString)(value) === Number(value).toString();\n    if (!isNaN(parseFloat(value)) && isFinite(value) && isEquivalent) {\n        return +value;\n    }\n    if (value === 'true') {\n        return true;\n    }\n    if (value === 'false') {\n        return false;\n    }\n    return value;\n};\nconst normalizeSingleSelectComponentValue = (component, value) => {\n    if ((0, lodash_1.isNil)(value)) {\n        return;\n    }\n    const valueIsObject = (0, lodash_1.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 = 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) &&\n                Number.isFinite(numberValue) &&\n                value !== '' &&\n                isEquivalent) {\n                this.value = numberValue;\n            }\n            return this;\n        },\n        boolean() {\n            if ((0, lodash_1.isString)(this.value) &&\n                (this.value.toLowerCase() === 'true' || 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 ((0, lodash_1.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};\nconst normalizeSelectComponentValue = (component, value) => {\n    if (component.multiple && Array.isArray(value)) {\n        return value.map((singleValue) => normalizeSingleSelectComponentValue(component, singleValue));\n    }\n    return normalizeSingleSelectComponentValue(component, value);\n};\nconst normalizeSelectBoxesComponentValue = (value) => {\n    if (!value) {\n        value = {};\n    }\n    if (typeof value !== 'object') {\n        if (typeof value === 'string') {\n            return {\n                [value]: true,\n            };\n        }\n        else {\n            return {};\n        }\n    }\n    if (Array.isArray(value)) {\n        return value.reduce((acc, curr) => {\n            return Object.assign(Object.assign({}, acc), { [curr]: true });\n        }, {});\n    }\n    return value;\n};\nconst normalizeTagsComponentValue = (component, value) => {\n    const delimiter = component.delimeter || ',';\n    if ((!component.hasOwnProperty('storeas') || component.storeas === 'string') &&\n        Array.isArray(value)) {\n        return value.join(delimiter);\n    }\n    else if (component.storeas === 'array' && typeof value === 'string') {\n        return value.split(delimiter).filter((result) => result);\n    }\n    return value;\n};\nconst normalizeMaskValue = (component, defaultValues, value, path) => {\n    if (component.inputMasks && component.inputMasks.length > 0) {\n        if (!value || typeof value !== 'object') {\n            return {\n                value: value,\n                maskName: component.inputMasks[0].label,\n            };\n        }\n        if (!value.value) {\n            const defaultValue = defaultValues === null || defaultValues === void 0 ? void 0 : defaultValues.find((defaultValue) => defaultValue.path === path);\n            value.value =\n                Array.isArray(defaultValue) && defaultValue.length > 0 ? defaultValue[0] : defaultValue;\n        }\n    }\n    return value;\n};\nconst normalizeTextFieldComponentValue = (component, defaultValues, value, path) => {\n    // If the component has truncate multiple spaces enabled, then normalize the value to remove extra spaces.\n    if (component.truncateMultipleSpaces && typeof value === 'string') {\n        value = value.trim().replace(/\\s{2,}/g, ' ');\n    }\n    if (component.allowMultipleMasks && component.inputMasks && component.inputMasks.length > 0) {\n        if (Array.isArray(value)) {\n            return value.map((val) => normalizeMaskValue(component, defaultValues, val, path));\n        }\n        else {\n            return normalizeMaskValue(component, defaultValues, value, path);\n        }\n    }\n    return value;\n};\n// Allow submissions of time components in their visual \"format\" property by coercing them to the \"dataFormat\" property\n// i.e. \"HH:mm\" -> \"HH:mm:ss\"\nconst normalizeTimeComponentValue = (component, value) => {\n    const defaultDataFormat = 'HH:mm:ss';\n    const defaultFormat = 'HH:mm';\n    if ((0, dayjs_1.default)(value, component.format || defaultFormat, true).isValid()) {\n        return (0, dayjs_1.default)(value, component.format || defaultFormat, true).format(component.dataFormat || defaultDataFormat);\n    }\n    return value;\n};\nconst normalizeSingleNumberComponentValue = (component, value) => {\n    if (!isNaN(parseFloat(value)) && isFinite(value)) {\n        return +value;\n    }\n    return value;\n};\nconst normalizeNumberComponentValue = (component, value) => {\n    if (component.multiple && Array.isArray(value)) {\n        return value.map((singleValue) => normalizeSingleNumberComponentValue(component, singleValue));\n    }\n    return normalizeSingleNumberComponentValue(component, value);\n};\nconst normalizeProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    return (0, exports.normalizeProcessSync)(context);\n});\nexports.normalizeProcess = normalizeProcess;\nconst normalizeProcessSync = (context) => {\n    var _a, _b;\n    const { component, form, scope, path, data, value } = context;\n    if (!scope.normalize) {\n        scope.normalize = {};\n    }\n    const { defaultValues } = scope;\n    scope.normalize[path] = {\n        type: component.type,\n        normalized: false,\n    };\n    let newValue = value;\n    if (isAddressComponent(component)) {\n        newValue = normalizeAddressComponentValue(component, value);\n    }\n    else if (isDayComponent(component)) {\n        newValue = normalizeDayComponentValue(component, form, value);\n    }\n    else if (isEmailComponent(component)) {\n        newValue = value && (0, lodash_1.isString)(value) ? value.trim().toLowerCase() : value;\n    }\n    else if (isRadioComponent(component)) {\n        newValue = normalizeRadioComponentValue(value, component.dataType);\n    }\n    else if (isSelectComponent(component)) {\n        newValue = normalizeSelectComponentValue(component, value);\n    }\n    else if (isSelectBoxesComponent(component)) {\n        newValue = normalizeSelectBoxesComponentValue(value);\n    }\n    else if (isTagsComponent(component)) {\n        newValue = normalizeTagsComponentValue(component, value);\n    }\n    else if (isTextFieldComponent(component)) {\n        newValue = normalizeTextFieldComponentValue(component, defaultValues, value, path);\n    }\n    else if (isTimeComponent(component)) {\n        newValue = normalizeTimeComponentValue(component, value);\n    }\n    else if (isNumberComponent(component)) {\n        newValue = normalizeNumberComponentValue(component, value);\n    }\n    if (component.multiple && !((_a = component.validate) === null || _a === void 0 ? void 0 : _a.required) && !Array.isArray(value)) {\n        newValue = value ? [value] : [];\n    }\n    if (newValue === undefined || newValue === null) {\n        scope.filter = scope.filter || {};\n        scope.filter[path] = false;\n    }\n    else if (value !== newValue && !((_b = scope.clearHidden) === null || _b === void 0 ? void 0 : _b.hasOwnProperty(path))) {\n        (0, lodash_1.set)(data, path, newValue);\n        scope.normalize[path].normalized = true;\n        scope.filter = scope.filter || {};\n        scope.filter[path] = true;\n    }\n};\nexports.normalizeProcessSync = normalizeProcessSync;\nexports.normalizeProcessInfo = {\n    name: 'normalize',\n    shouldProcess: () => true,\n    process: exports.normalizeProcess,\n    processSync: exports.normalizeProcessSync,\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/normalize/index.js?");
 
 /***/ }),
 
@@ -487,7 +476,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.ProcessTargets = exports.ProcessorMap = exports.processSync = exports.process = void 0;\nconst formUtil_1 = __webpack_require__(/*! ../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst processOne_1 = __webpack_require__(/*! ./processOne */ \"./node_modules/@formio/core/lib/process/processOne.js\");\nconst defaultValue_1 = __webpack_require__(/*! ./defaultValue */ \"./node_modules/@formio/core/lib/process/defaultValue/index.js\");\nconst fetch_1 = __webpack_require__(/*! ./fetch */ \"./node_modules/@formio/core/lib/process/fetch/index.js\");\nconst calculation_1 = __webpack_require__(/*! ./calculation */ \"./node_modules/@formio/core/lib/process/calculation/index.js\");\nconst logic_1 = __webpack_require__(/*! ./logic */ \"./node_modules/@formio/core/lib/process/logic/index.js\");\nconst conditions_1 = __webpack_require__(/*! ./conditions */ \"./node_modules/@formio/core/lib/process/conditions/index.js\");\nconst validation_1 = __webpack_require__(/*! ./validation */ \"./node_modules/@formio/core/lib/process/validation/index.js\");\nconst filter_1 = __webpack_require__(/*! ./filter */ \"./node_modules/@formio/core/lib/process/filter/index.js\");\nconst normalize_1 = __webpack_require__(/*! ./normalize */ \"./node_modules/@formio/core/lib/process/normalize/index.js\");\nconst dereference_1 = __webpack_require__(/*! ./dereference */ \"./node_modules/@formio/core/lib/process/dereference/index.js\");\nconst clearHidden_1 = __webpack_require__(/*! ./clearHidden */ \"./node_modules/@formio/core/lib/process/clearHidden/index.js\");\nconst hideChildren_1 = __webpack_require__(/*! ./hideChildren */ \"./node_modules/@formio/core/lib/process/hideChildren.js\");\nfunction process(context) {\n    return __awaiter(this, void 0, void 0, function* () {\n        const { instances, components, data, scope, flat, processors, local, parent, parentPaths } = context;\n        yield (0, formUtil_1.eachComponentDataAsync)(components, data, (component, compData, row, path, components, index, parent, paths) => __awaiter(this, void 0, void 0, function* () {\n            yield (0, processOne_1.processOne)(Object.assign(Object.assign({}, context), { data: compData, component,\n                components,\n                path,\n                paths,\n                row,\n                index, instance: instances\n                    ? instances[component.modelType === 'none' && (paths === null || paths === void 0 ? void 0 : paths.fullPath) ? paths.fullPath : path]\n                    : undefined, parent }));\n            if (flat) {\n                return true;\n            }\n            if (scope.noRecurse) {\n                scope.noRecurse = false;\n                return true;\n            }\n        }), false, local, parent, parentPaths);\n        for (let i = 0; i < (processors === null || processors === void 0 ? void 0 : processors.length); i++) {\n            const processor = processors[i];\n            if (processor.postProcess) {\n                processor.postProcess(context);\n            }\n        }\n        return scope;\n    });\n}\nexports.process = process;\nfunction processSync(context) {\n    const { instances, components, data, scope, flat, processors, local, parent, parentPaths } = context;\n    (0, formUtil_1.eachComponentData)(components, data, (component, compData, row, path, components, index, parent, paths) => {\n        (0, processOne_1.processOneSync)(Object.assign(Object.assign({}, context), { data: compData, component,\n            components,\n            path,\n            paths,\n            row,\n            index, instance: instances\n                ? instances[component.modelType === 'none' && (paths === null || paths === void 0 ? void 0 : paths.fullPath) ? paths.fullPath : path]\n                : undefined, parent }));\n        if (flat) {\n            return true;\n        }\n        if (scope.noRecurse) {\n            scope.noRecurse = false;\n            return true;\n        }\n    }, false, local, parent, parentPaths);\n    for (let i = 0; i < (processors === null || processors === void 0 ? void 0 : processors.length); i++) {\n        const processor = processors[i];\n        if (processor.postProcess) {\n            processor.postProcess(context);\n        }\n    }\n    return scope;\n}\nexports.processSync = processSync;\nexports.ProcessorMap = {\n    filter: filter_1.filterProcessInfo,\n    defaultValue: defaultValue_1.defaultValueProcessInfo,\n    serverDefaultValue: defaultValue_1.serverDefaultValueProcessInfo,\n    customDefaultValue: defaultValue_1.customDefaultValueProcessInfo,\n    calculate: calculation_1.calculateProcessInfo,\n    conditions: conditions_1.conditionProcessInfo,\n    customConditions: conditions_1.customConditionProcessInfo,\n    simpleConditions: conditions_1.simpleConditionProcessInfo,\n    normalize: normalize_1.normalizeProcessInfo,\n    dereference: dereference_1.dereferenceProcessInfo,\n    clearHidden: clearHidden_1.clearHiddenProcessInfo,\n    fetch: fetch_1.fetchProcessInfo,\n    logic: logic_1.logicProcessInfo,\n    validate: validation_1.validateProcessInfo,\n    validateCustom: validation_1.validateCustomProcessInfo,\n    validateServer: validation_1.validateServerProcessInfo,\n    hideChildren: hideChildren_1.hideChildrenProcessorInfo,\n};\nexports.ProcessTargets = {\n    submission: [\n        filter_1.filterProcessInfo,\n        defaultValue_1.serverDefaultValueProcessInfo,\n        normalize_1.normalizeProcessInfo,\n        dereference_1.dereferenceProcessInfo,\n        fetch_1.fetchProcessInfo,\n        conditions_1.simpleConditionProcessInfo,\n        validation_1.validateServerProcessInfo,\n    ],\n    evaluator: [\n        defaultValue_1.customDefaultValueProcessInfo,\n        calculation_1.calculateProcessInfo,\n        logic_1.logicProcessInfo,\n        conditions_1.conditionProcessInfo,\n        hideChildren_1.hideChildrenProcessorInfo,\n        clearHidden_1.clearHiddenProcessInfo,\n        validation_1.validateProcessInfo,\n    ],\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/process.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.ProcessTargets = exports.Processors = exports.ProcessorMap = exports.processSync = exports.process = void 0;\nconst formUtil_1 = __webpack_require__(/*! ../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst processOne_1 = __webpack_require__(/*! ./processOne */ \"./node_modules/@formio/core/lib/process/processOne.js\");\nconst defaultValue_1 = __webpack_require__(/*! ./defaultValue */ \"./node_modules/@formio/core/lib/process/defaultValue/index.js\");\nconst fetch_1 = __webpack_require__(/*! ./fetch */ \"./node_modules/@formio/core/lib/process/fetch/index.js\");\nconst calculation_1 = __webpack_require__(/*! ./calculation */ \"./node_modules/@formio/core/lib/process/calculation/index.js\");\nconst logic_1 = __webpack_require__(/*! ./logic */ \"./node_modules/@formio/core/lib/process/logic/index.js\");\nconst conditions_1 = __webpack_require__(/*! ./conditions */ \"./node_modules/@formio/core/lib/process/conditions/index.js\");\nconst validation_1 = __webpack_require__(/*! ./validation */ \"./node_modules/@formio/core/lib/process/validation/index.js\");\nconst filter_1 = __webpack_require__(/*! ./filter */ \"./node_modules/@formio/core/lib/process/filter/index.js\");\nconst normalize_1 = __webpack_require__(/*! ./normalize */ \"./node_modules/@formio/core/lib/process/normalize/index.js\");\nconst dereference_1 = __webpack_require__(/*! ./dereference */ \"./node_modules/@formio/core/lib/process/dereference/index.js\");\nconst clearHidden_1 = __webpack_require__(/*! ./clearHidden */ \"./node_modules/@formio/core/lib/process/clearHidden/index.js\");\nfunction process(context) {\n    return __awaiter(this, void 0, void 0, function* () {\n        const { instances, components, data, scope, flat, local, parent, parentPaths } = context;\n        yield (0, formUtil_1.eachComponentDataAsync)(components, data, (component, compData, row, path, components, index, parent, paths) => __awaiter(this, void 0, void 0, function* () {\n            yield (0, processOne_1.processOne)(Object.assign(Object.assign({}, context), { data: compData, component,\n                components,\n                path,\n                paths,\n                row,\n                index, instance: instances\n                    ? instances[component.modelType === 'none' && (paths === null || paths === void 0 ? void 0 : paths.fullPath) ? paths.fullPath : path]\n                    : undefined, parent }));\n            if (flat) {\n                return true;\n            }\n            if (scope.noRecurse) {\n                scope.noRecurse = false;\n                return true;\n            }\n        }), false, local, parent, parentPaths, false, (component, compData, row, path, components, index, parent, paths) => __awaiter(this, void 0, void 0, function* () {\n            yield (0, processOne_1.postProcessOne)(Object.assign(Object.assign({}, context), { data: compData, component,\n                components,\n                path,\n                paths,\n                row,\n                index, instance: instances\n                    ? instances[component.modelType === 'none' && (paths === null || paths === void 0 ? void 0 : paths.fullPath) ? paths.fullPath : path]\n                    : undefined, parent }));\n        }));\n        if (scope.filtered) {\n            context.data = scope.filtered || {};\n        }\n        return scope;\n    });\n}\nexports.process = process;\nfunction processSync(context) {\n    const { instances, components, data, scope, flat, local, parent, parentPaths } = context;\n    (0, formUtil_1.eachComponentData)(components, data, (component, compData, row, path, components, index, parent, paths) => {\n        (0, processOne_1.processOneSync)(Object.assign(Object.assign({}, context), { data: compData, component,\n            components,\n            path,\n            paths,\n            row,\n            index, instance: instances\n                ? instances[component.modelType === 'none' && (paths === null || paths === void 0 ? void 0 : paths.fullPath) ? paths.fullPath : path]\n                : undefined, parent }));\n        if (flat) {\n            return true;\n        }\n        if (scope.noRecurse) {\n            scope.noRecurse = false;\n            return true;\n        }\n    }, false, local, parent, parentPaths, false, (component, compData, row, path, components, index, parent, paths) => {\n        (0, processOne_1.postProcessOneSync)(Object.assign(Object.assign({}, context), { data: compData, component,\n            components,\n            path,\n            paths,\n            row,\n            index, instance: instances\n                ? instances[component.modelType === 'none' && (paths === null || paths === void 0 ? void 0 : paths.fullPath) ? paths.fullPath : path]\n                : undefined, parent }));\n    });\n    if (scope.filtered) {\n        context.data = scope.filtered || {};\n    }\n    return scope;\n}\nexports.processSync = processSync;\nexports.ProcessorMap = {\n    filter: filter_1.filterProcessInfo,\n    defaultValue: defaultValue_1.defaultValueProcessInfo,\n    serverDefaultValue: defaultValue_1.serverDefaultValueProcessInfo,\n    customDefaultValue: defaultValue_1.customDefaultValueProcessInfo,\n    calculate: calculation_1.calculateProcessInfo,\n    conditions: conditions_1.conditionProcessInfo,\n    customConditions: conditions_1.customConditionProcessInfo,\n    simpleConditions: conditions_1.simpleConditionProcessInfo,\n    normalize: normalize_1.normalizeProcessInfo,\n    dereference: dereference_1.dereferenceProcessInfo,\n    clearHidden: clearHidden_1.clearHiddenProcessInfo,\n    fetch: fetch_1.fetchProcessInfo,\n    logic: logic_1.logicProcessInfo,\n    validate: validation_1.validateProcessInfo,\n    validateCustom: validation_1.validateCustomProcessInfo,\n    validateServer: validation_1.validateServerProcessInfo,\n};\nexports.Processors = [\n    filter_1.filterProcessInfo,\n    defaultValue_1.defaultValueProcessInfo,\n    normalize_1.normalizeProcessInfo,\n    dereference_1.dereferenceProcessInfo,\n    fetch_1.fetchProcessInfo,\n    calculation_1.calculateProcessInfo,\n    conditions_1.conditionProcessInfo,\n    logic_1.logicProcessInfo,\n    clearHidden_1.clearHiddenProcessInfo,\n    validation_1.postValidateProcessInfo,\n];\n// Deprecated: Use Processors instead\nexports.ProcessTargets = {\n    submission: [\n        filter_1.filterProcessInfo,\n        defaultValue_1.serverDefaultValueProcessInfo,\n        normalize_1.normalizeProcessInfo,\n        dereference_1.dereferenceProcessInfo,\n        fetch_1.fetchProcessInfo,\n        conditions_1.simpleConditionProcessInfo,\n        validation_1.validateServerProcessInfo,\n    ],\n    evaluator: [\n        defaultValue_1.customDefaultValueProcessInfo,\n        calculation_1.calculateProcessInfo,\n        logic_1.logicProcessInfo,\n        conditions_1.conditionProcessInfo,\n        clearHidden_1.clearHiddenProcessInfo,\n        validation_1.validateProcessInfo,\n    ],\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/process.js?");
 
 /***/ }),
 
@@ -498,7 +487,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.processOneSync = exports.processOne = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst types_1 = __webpack_require__(/*! ../types */ \"./node_modules/@formio/core/lib/types/index.js\");\nconst formUtil_1 = __webpack_require__(/*! ../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nfunction processOne(context) {\n    return __awaiter(this, void 0, void 0, function* () {\n        const { processors, component, paths, local, path } = context;\n        // Create a getter for `value` that is always derived from the current data object\n        if (typeof context.value === 'undefined') {\n            const dataPath = local ? (paths === null || paths === void 0 ? void 0 : paths.localDataPath) || path : (paths === null || paths === void 0 ? void 0 : paths.dataPath) || path;\n            Object.defineProperty(context, 'value', {\n                enumerable: true,\n                get() {\n                    const modelType = (0, formUtil_1.getModelType)(component);\n                    if (!component.type || modelType === 'none' || modelType === 'content') {\n                        return undefined;\n                    }\n                    return (0, lodash_1.get)(context.data, dataPath);\n                },\n                set(newValue) {\n                    const modelType = (0, formUtil_1.getModelType)(component);\n                    if (!component.type || modelType === 'none' || modelType === 'content') {\n                        // Do not set the value if the model type is 'none' or 'content'\n                        return;\n                    }\n                    (0, lodash_1.set)(context.data, dataPath, newValue);\n                },\n            });\n        }\n        context.processor = types_1.ProcessorType.Custom;\n        for (const processor of processors) {\n            if (processor === null || processor === void 0 ? void 0 : processor.process) {\n                yield processor.process(context);\n            }\n        }\n    });\n}\nexports.processOne = processOne;\nfunction processOneSync(context) {\n    const { processors, component, paths, local, path } = context;\n    // Create a getter for `value` that is always derived from the current data object\n    if (typeof context.value === 'undefined') {\n        const dataPath = local ? (paths === null || paths === void 0 ? void 0 : paths.localDataPath) || path : (paths === null || paths === void 0 ? void 0 : paths.dataPath) || path;\n        Object.defineProperty(context, 'value', {\n            enumerable: true,\n            get() {\n                const modelType = (0, formUtil_1.getModelType)(component);\n                if (!component.type || modelType === 'none' || modelType === 'content') {\n                    return undefined;\n                }\n                return (0, lodash_1.get)(context.data, dataPath);\n            },\n            set(newValue) {\n                const modelType = (0, formUtil_1.getModelType)(component);\n                if (!component.type || modelType === 'none' || modelType === 'content') {\n                    // Do not set the value if the model type is 'none' or 'content'\n                    return;\n                }\n                (0, lodash_1.set)(context.data, dataPath, newValue);\n            },\n        });\n    }\n    // Process the components.\n    context.processor = types_1.ProcessorType.Custom;\n    for (const processor of processors) {\n        if (processor === null || processor === void 0 ? void 0 : processor.processSync) {\n            processor.processSync(context);\n        }\n    }\n}\nexports.processOneSync = processOneSync;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/processOne.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.postProcessOneSync = exports.postProcessOne = exports.processOneSync = exports.processOne = exports.contextValue = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst types_1 = __webpack_require__(/*! ../types */ \"./node_modules/@formio/core/lib/types/index.js\");\nconst formUtil_1 = __webpack_require__(/*! ../utils/formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nfunction contextValue(context) {\n    const { component, paths, local, path } = context;\n    if (typeof context.value === 'undefined') {\n        const dataPath = local ? (paths === null || paths === void 0 ? void 0 : paths.localDataPath) || path : (paths === null || paths === void 0 ? void 0 : paths.dataPath) || path;\n        Object.defineProperty(context, 'value', {\n            enumerable: true,\n            get() {\n                const modelType = (0, formUtil_1.getModelType)(component);\n                if (!component.type || modelType === 'none' || modelType === 'content') {\n                    return undefined;\n                }\n                return (0, lodash_1.get)(context.data, dataPath);\n            },\n            set(newValue) {\n                const modelType = (0, formUtil_1.getModelType)(component);\n                if (!component.type || modelType === 'none' || modelType === 'content') {\n                    // Do not set the value if the model type is 'none' or 'content'\n                    return;\n                }\n                (0, lodash_1.set)(context.data, dataPath, newValue);\n            },\n        });\n    }\n}\nexports.contextValue = contextValue;\nfunction processOne(context) {\n    return __awaiter(this, void 0, void 0, function* () {\n        const { processors } = context;\n        contextValue(context);\n        context.processor = types_1.ProcessorType.Custom;\n        for (const processor of processors) {\n            if (processor === null || processor === void 0 ? void 0 : processor.process) {\n                yield processor.process(context);\n            }\n        }\n    });\n}\nexports.processOne = processOne;\nfunction processOneSync(context) {\n    const { processors } = context;\n    contextValue(context);\n    context.processor = types_1.ProcessorType.Custom;\n    for (const processor of processors) {\n        if (processor === null || processor === void 0 ? void 0 : processor.processSync) {\n            processor.processSync(context);\n        }\n    }\n}\nexports.processOneSync = processOneSync;\nfunction postProcessOne(context) {\n    return __awaiter(this, void 0, void 0, function* () {\n        const { processors } = context;\n        contextValue(context);\n        context.processor = types_1.ProcessorType.Custom;\n        for (const processor of processors) {\n            if (processor === null || processor === void 0 ? void 0 : processor.postProcess) {\n                yield processor.postProcess(context);\n            }\n        }\n    });\n}\nexports.postProcessOne = postProcessOne;\nfunction postProcessOneSync(context) {\n    const { processors } = context;\n    contextValue(context);\n    context.processor = types_1.ProcessorType.Custom;\n    for (const processor of processors) {\n        if (processor === null || processor === void 0 ? void 0 : processor.postProcessSync) {\n            processor.postProcessSync(context);\n        }\n    }\n}\nexports.postProcessOneSync = postProcessOneSync;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/processOne.js?");
 
 /***/ }),
 
@@ -531,7 +520,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /***/ (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 __exportStar = (this && this.__exportStar) || function(m, exports) {\n    for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);\n};\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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.validateProcessInfo = exports.validateServerProcessInfo = exports.validateCustomProcessInfo = exports.validateAllProcessSync = exports.validateAllProcess = exports.validateServerProcessSync = exports.validateServerProcess = exports.validateCustomProcessSync = exports.validateCustomProcess = exports.validateProcessSync = exports.validateProcess = exports.shouldValidateServer = exports.shouldValidateCustom = exports.shouldValidateAll = exports.shouldSkipValidation = exports.shouldSkipValidationSimple = exports.shouldSkipValidationCustom = exports._shouldSkipValidation = exports.isForcedHidden = exports.isValueHidden = exports.isInputComponent = exports.validationRules = void 0;\nconst rules_1 = __webpack_require__(/*! ./rules */ \"./node_modules/@formio/core/lib/process/validation/rules/index.js\");\nconst find_1 = __importDefault(__webpack_require__(/*! lodash/find */ \"./node_modules/lodash/find.js\"));\nconst get_1 = __importDefault(__webpack_require__(/*! lodash/get */ \"./node_modules/lodash/get.js\"));\nconst pick_1 = __importDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nconst error_1 = __webpack_require__(/*! ../../utils/error */ \"./node_modules/@formio/core/lib/utils/error.js\");\nconst conditions_1 = __webpack_require__(/*! ../conditions */ \"./node_modules/@formio/core/lib/process/conditions/index.js\");\n// Cleans up validation errors to remove unnessesary parts\n// and make them transferable to ivm.\nconst cleanupValidationError = (error) => (Object.assign(Object.assign({}, error), { context: (0, pick_1.default)(error.context, [\n        'component',\n        'path',\n        'index',\n        'value',\n        'field',\n        'hasLabel',\n        'processor',\n        'setting',\n        'pattern',\n        'length',\n        'min',\n        'max',\n        'maxDate',\n        'minDate',\n        'maxYear',\n        'minYear',\n        'minCount',\n        'maxCount',\n        'regex',\n    ]) }));\nfunction validationRules(context, rules, skipValidation) {\n    if (skipValidation && skipValidation(context)) {\n        return [];\n    }\n    const validationRules = [];\n    return rules.reduce((acc, rule) => {\n        if (rule.shouldProcess && rule.shouldProcess(context)) {\n            acc.push(rule);\n        }\n        return acc;\n    }, validationRules);\n}\nexports.validationRules = validationRules;\nfunction isInputComponent(context) {\n    const { component } = context;\n    return !component.hasOwnProperty('input') || component.input;\n}\nexports.isInputComponent = isInputComponent;\nfunction isValueHidden(context) {\n    const { component } = context;\n    if (component.protected) {\n        return false;\n    }\n    if ((component.hasOwnProperty('persistent') && !component.persistent) ||\n        component.persistent === 'client-only') {\n        return true;\n    }\n    return false;\n}\nexports.isValueHidden = isValueHidden;\nfunction isForcedHidden(context, isConditionallyHidden) {\n    var _a, _b;\n    const { component } = context;\n    if (((_a = component.scope) === null || _a === void 0 ? void 0 : _a.conditionallyHidden) || isConditionallyHidden(context)) {\n        return true;\n    }\n    if ((_b = component.scope) === null || _b === void 0 ? void 0 : _b.intentionallyHidden) {\n        return true;\n    }\n    if (component.hasOwnProperty('hidden')) {\n        return !!component.hidden;\n    }\n    return false;\n}\nexports.isForcedHidden = isForcedHidden;\nconst _shouldSkipValidation = (context, isConditionallyHidden) => {\n    const { component } = context;\n    const rules = [\n        // Skip validation if component is readOnly\n        // () => this.options.readOnly,\n        // Do not check validations if component is not an input component.\n        () => !isInputComponent(context),\n        // Check to see if we are editing and if so, check component persistence.\n        () => isValueHidden(context),\n        // Force valid if component is hidden.\n        () => !component.validateWhenHidden && isForcedHidden(context, isConditionallyHidden),\n    ];\n    return rules.some((pred) => pred());\n};\nexports._shouldSkipValidation = _shouldSkipValidation;\nconst shouldSkipValidationCustom = (context) => {\n    return (0, exports._shouldSkipValidation)(context, conditions_1.isCustomConditionallyHidden);\n};\nexports.shouldSkipValidationCustom = shouldSkipValidationCustom;\nconst shouldSkipValidationSimple = (context) => {\n    return (0, exports._shouldSkipValidation)(context, conditions_1.isSimpleConditionallyHidden);\n};\nexports.shouldSkipValidationSimple = shouldSkipValidationSimple;\nconst shouldSkipValidation = (context) => {\n    return (0, exports._shouldSkipValidation)(context, conditions_1.isConditionallyHidden);\n};\nexports.shouldSkipValidation = shouldSkipValidation;\nfunction shouldValidateAll(context) {\n    return validationRules(context, rules_1.rules, exports.shouldSkipValidation).length > 0;\n}\nexports.shouldValidateAll = shouldValidateAll;\nfunction shouldValidateCustom(context) {\n    const { component } = context;\n    if (component.customConditional) {\n        return true;\n    }\n    return !(0, exports.shouldSkipValidationCustom)(context);\n}\nexports.shouldValidateCustom = shouldValidateCustom;\nfunction shouldValidateServer(context) {\n    const { component } = context;\n    if (component.customConditional) {\n        return false;\n    }\n    if ((0, exports.shouldSkipValidationSimple)(context)) {\n        return false;\n    }\n    return shouldValidateAll(context);\n}\nexports.shouldValidateServer = shouldValidateServer;\nfunction handleError(error, context) {\n    const { scope, path } = context;\n    if (error) {\n        const cleanedError = cleanupValidationError(error);\n        cleanedError.context.path = path;\n        if (!(0, find_1.default)(scope.errors, {\n            errorKeyOrMessage: cleanedError.errorKeyOrMessage,\n            context: {\n                path: path,\n            },\n        })) {\n            if (!scope.validated)\n                scope.validated = [];\n            if (!scope.errors)\n                scope.errors = [];\n            scope.errors.push(cleanedError);\n            scope.validated.push({ path, error: cleanedError });\n        }\n    }\n}\nconst validateProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    const { component, data, row, path, instance, scope, rules, skipValidation } = context;\n    let { value } = context;\n    if (!scope.validated)\n        scope.validated = [];\n    if (!scope.errors)\n        scope.errors = [];\n    if (!rules || !rules.length) {\n        return;\n    }\n    if (component.multiple && Array.isArray(value) && value.length > 0) {\n        const fullValueRules = rules.filter((rule) => rule.fullValue);\n        const otherRules = rules.filter((rule) => !rule.fullValue);\n        for (let i = 0; i < value.length; i++) {\n            const amendedPath = `${path}[${i}]`;\n            let amendedValue = (0, get_1.default)(data, amendedPath);\n            if (instance === null || instance === void 0 ? void 0 : instance.shouldSkipValidation(data)) {\n                return;\n            }\n            const rulesToExecute = validationRules(context, otherRules, skipValidation);\n            if (!rulesToExecute.length) {\n                continue;\n            }\n            if (component.truncateMultipleSpaces && amendedValue && typeof amendedValue === 'string') {\n                amendedValue = amendedValue.trim().replace(/\\s{2,}/g, ' ');\n            }\n            for (const rule of rulesToExecute) {\n                if (rule && rule.process) {\n                    handleError(yield rule.process(Object.assign(Object.assign({}, context), { value: amendedValue, index: i, path: amendedPath })), context);\n                }\n            }\n        }\n        for (const rule of fullValueRules) {\n            if (rule && rule.process) {\n                handleError(yield rule.process(Object.assign(Object.assign({}, context), { value })), context);\n            }\n        }\n        return;\n    }\n    if (instance === null || instance === void 0 ? void 0 : instance.shouldSkipValidation(data, row)) {\n        return;\n    }\n    const rulesToExecute = validationRules(context, rules, skipValidation);\n    if (!rulesToExecute.length) {\n        return;\n    }\n    if (component.truncateMultipleSpaces && value && typeof value === 'string') {\n        value = value.trim().replace(/\\s{2,}/g, ' ');\n    }\n    for (const rule of rulesToExecute) {\n        try {\n            if (rule && rule.process) {\n                handleError(yield rule.process(Object.assign(Object.assign({}, context), { value })), context);\n            }\n        }\n        catch (err) {\n            console.error('Validator error:', (0, error_1.getErrorMessage)(err));\n        }\n    }\n    return;\n});\nexports.validateProcess = validateProcess;\nconst validateProcessSync = (context) => {\n    const { component, data, row, path, instance, scope, rules, skipValidation } = context;\n    let { value } = context;\n    if (!scope.validated)\n        scope.validated = [];\n    if (!scope.errors)\n        scope.errors = [];\n    if (!rules || !rules.length) {\n        return;\n    }\n    if (component.multiple && Array.isArray(value) && value.length > 0) {\n        const fullValueRules = rules.filter((rule) => rule.fullValue);\n        const otherRules = rules.filter((rule) => !rule.fullValue);\n        for (let i = 0; i < value.length; i++) {\n            const amendedPath = `${path}[${i}]`;\n            let amendedValue = (0, get_1.default)(data, amendedPath);\n            if (instance === null || instance === void 0 ? void 0 : instance.shouldSkipValidation(data)) {\n                return;\n            }\n            const rulesToExecute = validationRules(context, otherRules, skipValidation);\n            if (!rulesToExecute.length) {\n                continue;\n            }\n            if (component.truncateMultipleSpaces && amendedValue && typeof amendedValue === 'string') {\n                amendedValue = amendedValue.trim().replace(/\\s{2,}/g, ' ');\n            }\n            for (const rule of rulesToExecute) {\n                if (rule && rule.processSync) {\n                    handleError(rule.processSync(Object.assign(Object.assign({}, context), { value: amendedValue, index: i, path: amendedPath })), context);\n                }\n            }\n        }\n        for (const rule of fullValueRules) {\n            if (rule && rule.processSync) {\n                handleError(rule.processSync(Object.assign(Object.assign({}, context), { value })), context);\n            }\n        }\n        return;\n    }\n    if (instance === null || instance === void 0 ? void 0 : instance.shouldSkipValidation(data, row)) {\n        return;\n    }\n    const rulesToExecute = validationRules(context, rules, skipValidation);\n    if (!rulesToExecute.length) {\n        return;\n    }\n    if (component.truncateMultipleSpaces && value && typeof value === 'string') {\n        value = value.trim().replace(/\\s{2,}/g, ' ');\n    }\n    for (const rule of rulesToExecute) {\n        try {\n            if (rule && rule.processSync) {\n                handleError(rule.processSync(Object.assign(Object.assign({}, context), { value })), context);\n            }\n        }\n        catch (err) {\n            console.error('Validator error:', (0, error_1.getErrorMessage)(err));\n        }\n    }\n    return;\n};\nexports.validateProcessSync = validateProcessSync;\nconst validateCustomProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    context.rules = context.rules || rules_1.evaluationRules;\n    context.skipValidation = exports.shouldSkipValidationCustom;\n    return (0, exports.validateProcess)(context);\n});\nexports.validateCustomProcess = validateCustomProcess;\nconst validateCustomProcessSync = (context) => {\n    context.rules = context.rules || rules_1.evaluationRules;\n    context.skipValidation = exports.shouldSkipValidationCustom;\n    return (0, exports.validateProcessSync)(context);\n};\nexports.validateCustomProcessSync = validateCustomProcessSync;\nconst validateServerProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    context.rules = context.rules || rules_1.serverRules;\n    context.skipValidation = exports.shouldSkipValidationSimple;\n    return (0, exports.validateProcess)(context);\n});\nexports.validateServerProcess = validateServerProcess;\nconst validateServerProcessSync = (context) => {\n    context.rules = context.rules || rules_1.serverRules;\n    context.skipValidation = exports.shouldSkipValidationSimple;\n    return (0, exports.validateProcessSync)(context);\n};\nexports.validateServerProcessSync = validateServerProcessSync;\nconst validateAllProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    context.rules = context.rules || rules_1.rules;\n    context.skipValidation = exports.shouldSkipValidation;\n    return (0, exports.validateProcess)(context);\n});\nexports.validateAllProcess = validateAllProcess;\nconst validateAllProcessSync = (context) => {\n    context.rules = context.rules || rules_1.rules;\n    context.skipValidation = exports.shouldSkipValidation;\n    return (0, exports.validateProcessSync)(context);\n};\nexports.validateAllProcessSync = validateAllProcessSync;\nexports.validateCustomProcessInfo = {\n    name: 'validateCustom',\n    process: exports.validateCustomProcess,\n    processSync: exports.validateCustomProcessSync,\n    shouldProcess: shouldValidateCustom,\n};\nexports.validateServerProcessInfo = {\n    name: 'validateServer',\n    process: exports.validateServerProcess,\n    processSync: exports.validateServerProcessSync,\n    shouldProcess: shouldValidateServer,\n};\nexports.validateProcessInfo = {\n    name: 'validate',\n    process: exports.validateAllProcess,\n    processSync: exports.validateAllProcessSync,\n    shouldProcess: shouldValidateAll,\n};\n__exportStar(__webpack_require__(/*! ./util */ \"./node_modules/@formio/core/lib/process/validation/util.js\"), exports);\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/validation/index.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 __exportStar = (this && this.__exportStar) || function(m, exports) {\n    for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);\n};\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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.postValidateProcessInfo = exports.validateProcessInfo = exports.validateServerProcessInfo = exports.validateCustomProcessInfo = exports.validatePostProcessSync = exports.validatePostProcess = exports.validateAllProcessSync = exports.validateAllProcess = exports.validateServerProcessSync = exports.validateServerProcess = exports.validateCustomProcessSync = exports.validateCustomProcess = exports.validateProcessSync = exports.validateProcess = exports.shouldValidateServer = exports.shouldValidateCustom = exports.shouldValidateAll = exports.shouldSkipValidation = exports.shouldSkipValidationSimple = exports.shouldSkipValidationCustom = exports._shouldSkipValidation = exports.isForcedHidden = exports.isValueHidden = exports.isInputComponent = exports.validationRules = void 0;\nconst rules_1 = __webpack_require__(/*! ./rules */ \"./node_modules/@formio/core/lib/process/validation/rules/index.js\");\nconst find_1 = __importDefault(__webpack_require__(/*! lodash/find */ \"./node_modules/lodash/find.js\"));\nconst get_1 = __importDefault(__webpack_require__(/*! lodash/get */ \"./node_modules/lodash/get.js\"));\nconst pick_1 = __importDefault(__webpack_require__(/*! lodash/pick */ \"./node_modules/lodash/pick.js\"));\nconst error_1 = __webpack_require__(/*! ../../utils/error */ \"./node_modules/@formio/core/lib/utils/error.js\");\nconst conditions_1 = __webpack_require__(/*! ../conditions */ \"./node_modules/@formio/core/lib/process/conditions/index.js\");\n// Cleans up validation errors to remove unnessesary parts\n// and make them transferable to ivm.\nconst cleanupValidationError = (error) => (Object.assign(Object.assign({}, error), { context: (0, pick_1.default)(error.context, [\n        'component',\n        'path',\n        'index',\n        'value',\n        'field',\n        'hasLabel',\n        'processor',\n        'setting',\n        'pattern',\n        'length',\n        'min',\n        'max',\n        'maxDate',\n        'minDate',\n        'maxYear',\n        'minYear',\n        'minCount',\n        'maxCount',\n        'regex',\n    ]) }));\nfunction validationRules(context, rules, skipValidation) {\n    if (skipValidation && skipValidation(context)) {\n        return [];\n    }\n    const validationRules = [];\n    return rules.reduce((acc, rule) => {\n        if (rule.shouldProcess && rule.shouldProcess(context)) {\n            acc.push(rule);\n        }\n        return acc;\n    }, validationRules);\n}\nexports.validationRules = validationRules;\nfunction isInputComponent(context) {\n    const { component } = context;\n    return !component.hasOwnProperty('input') || component.input;\n}\nexports.isInputComponent = isInputComponent;\nfunction isValueHidden(context) {\n    const { component } = context;\n    if (component.protected) {\n        return false;\n    }\n    if ((component.hasOwnProperty('persistent') && !component.persistent) ||\n        component.persistent === 'client-only') {\n        return true;\n    }\n    return false;\n}\nexports.isValueHidden = isValueHidden;\nfunction isForcedHidden(context, isConditionallyHidden) {\n    var _a, _b;\n    const { component } = context;\n    if (((_a = component.scope) === null || _a === void 0 ? void 0 : _a.conditionallyHidden) || isConditionallyHidden(context)) {\n        return true;\n    }\n    if ((_b = component.scope) === null || _b === void 0 ? void 0 : _b.intentionallyHidden) {\n        return true;\n    }\n    if (component.hasOwnProperty('hidden')) {\n        return !!component.hidden;\n    }\n    return false;\n}\nexports.isForcedHidden = isForcedHidden;\nconst _shouldSkipValidation = (context, isConditionallyHidden) => {\n    const { component } = context;\n    const rules = [\n        // Skip validation if component is readOnly\n        // () => this.options.readOnly,\n        // Do not check validations if component is not an input component.\n        () => !isInputComponent(context),\n        // Check to see if we are editing and if so, check component persistence.\n        () => isValueHidden(context),\n        // Force valid if component is hidden.\n        () => !component.validateWhenHidden && isForcedHidden(context, isConditionallyHidden),\n    ];\n    return rules.some((pred) => pred());\n};\nexports._shouldSkipValidation = _shouldSkipValidation;\nconst shouldSkipValidationCustom = (context) => {\n    return (0, exports._shouldSkipValidation)(context, conditions_1.isCustomConditionallyHidden);\n};\nexports.shouldSkipValidationCustom = shouldSkipValidationCustom;\nconst shouldSkipValidationSimple = (context) => {\n    return (0, exports._shouldSkipValidation)(context, conditions_1.isSimpleConditionallyHidden);\n};\nexports.shouldSkipValidationSimple = shouldSkipValidationSimple;\nconst shouldSkipValidation = (context) => {\n    return (0, exports._shouldSkipValidation)(context, conditions_1.isConditionallyHidden);\n};\nexports.shouldSkipValidation = shouldSkipValidation;\nfunction shouldValidateAll(context) {\n    return validationRules(context, rules_1.rules, exports.shouldSkipValidation).length > 0;\n}\nexports.shouldValidateAll = shouldValidateAll;\nfunction shouldValidateCustom(context) {\n    const { component } = context;\n    if (component.customConditional) {\n        return true;\n    }\n    return !(0, exports.shouldSkipValidationCustom)(context);\n}\nexports.shouldValidateCustom = shouldValidateCustom;\nfunction shouldValidateServer(context) {\n    const { component } = context;\n    if (component.customConditional) {\n        return false;\n    }\n    if ((0, exports.shouldSkipValidationSimple)(context)) {\n        return false;\n    }\n    return shouldValidateAll(context);\n}\nexports.shouldValidateServer = shouldValidateServer;\nfunction handleError(error, context) {\n    const { scope, path } = context;\n    if (error) {\n        const cleanedError = cleanupValidationError(error);\n        cleanedError.context.path = path;\n        if (!(0, find_1.default)(scope.errors, {\n            errorKeyOrMessage: cleanedError.errorKeyOrMessage,\n            context: {\n                path: path,\n            },\n        })) {\n            if (!scope.validated)\n                scope.validated = [];\n            if (!scope.errors)\n                scope.errors = [];\n            scope.errors.push(cleanedError);\n            scope.validated.push({ path, error: cleanedError });\n        }\n    }\n}\nconst validateProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    const { component, data, row, path, instance, scope, rules, skipValidation } = context;\n    let { value } = context;\n    if (!scope.validated)\n        scope.validated = [];\n    if (!scope.errors)\n        scope.errors = [];\n    if (!rules || !rules.length) {\n        return;\n    }\n    if (component.multiple && Array.isArray(value) && value.length > 0) {\n        const fullValueRules = rules.filter((rule) => rule.fullValue);\n        const otherRules = rules.filter((rule) => !rule.fullValue);\n        for (let i = 0; i < value.length; i++) {\n            const amendedPath = `${path}[${i}]`;\n            let amendedValue = (0, get_1.default)(data, amendedPath);\n            if (instance === null || instance === void 0 ? void 0 : instance.shouldSkipValidation(data)) {\n                return;\n            }\n            const rulesToExecute = validationRules(context, otherRules, skipValidation);\n            if (!rulesToExecute.length) {\n                continue;\n            }\n            if (component.truncateMultipleSpaces && amendedValue && typeof amendedValue === 'string') {\n                amendedValue = amendedValue.trim().replace(/\\s{2,}/g, ' ');\n            }\n            for (const rule of rulesToExecute) {\n                if (rule && rule.process) {\n                    handleError(yield rule.process(Object.assign(Object.assign({}, context), { value: amendedValue, index: i, path: amendedPath })), context);\n                }\n            }\n        }\n        for (const rule of fullValueRules) {\n            if (rule && rule.process) {\n                handleError(yield rule.process(Object.assign(Object.assign({}, context), { value })), context);\n            }\n        }\n        return;\n    }\n    if (instance === null || instance === void 0 ? void 0 : instance.shouldSkipValidation(data, row)) {\n        return;\n    }\n    const rulesToExecute = validationRules(context, rules, skipValidation);\n    if (!rulesToExecute.length) {\n        return;\n    }\n    if (component.truncateMultipleSpaces && value && typeof value === 'string') {\n        value = value.trim().replace(/\\s{2,}/g, ' ');\n    }\n    for (const rule of rulesToExecute) {\n        try {\n            if (rule && rule.process) {\n                handleError(yield rule.process(Object.assign(Object.assign({}, context), { value })), context);\n            }\n        }\n        catch (err) {\n            console.error('Validator error:', (0, error_1.getErrorMessage)(err));\n        }\n    }\n    return;\n});\nexports.validateProcess = validateProcess;\nconst validateProcessSync = (context) => {\n    const { component, data, row, path, instance, scope, rules, skipValidation } = context;\n    let { value } = context;\n    if (!scope.validated)\n        scope.validated = [];\n    if (!scope.errors)\n        scope.errors = [];\n    if (!rules || !rules.length) {\n        return;\n    }\n    if (component.multiple && Array.isArray(value) && value.length > 0) {\n        const fullValueRules = rules.filter((rule) => rule.fullValue);\n        const otherRules = rules.filter((rule) => !rule.fullValue);\n        for (let i = 0; i < value.length; i++) {\n            const amendedPath = `${path}[${i}]`;\n            let amendedValue = (0, get_1.default)(data, amendedPath);\n            if (instance === null || instance === void 0 ? void 0 : instance.shouldSkipValidation(data)) {\n                return;\n            }\n            const rulesToExecute = validationRules(context, otherRules, skipValidation);\n            if (!rulesToExecute.length) {\n                continue;\n            }\n            if (component.truncateMultipleSpaces && amendedValue && typeof amendedValue === 'string') {\n                amendedValue = amendedValue.trim().replace(/\\s{2,}/g, ' ');\n            }\n            for (const rule of rulesToExecute) {\n                if (rule && rule.processSync) {\n                    handleError(rule.processSync(Object.assign(Object.assign({}, context), { value: amendedValue, index: i, path: amendedPath })), context);\n                }\n            }\n        }\n        for (const rule of fullValueRules) {\n            if (rule && rule.processSync) {\n                handleError(rule.processSync(Object.assign(Object.assign({}, context), { value })), context);\n            }\n        }\n        return;\n    }\n    if (instance === null || instance === void 0 ? void 0 : instance.shouldSkipValidation(data, row)) {\n        return;\n    }\n    const rulesToExecute = validationRules(context, rules, skipValidation);\n    if (!rulesToExecute.length) {\n        return;\n    }\n    if (component.truncateMultipleSpaces && value && typeof value === 'string') {\n        value = value.trim().replace(/\\s{2,}/g, ' ');\n    }\n    for (const rule of rulesToExecute) {\n        try {\n            if (rule && rule.processSync) {\n                handleError(rule.processSync(Object.assign(Object.assign({}, context), { value })), context);\n            }\n        }\n        catch (err) {\n            console.error('Validator error:', (0, error_1.getErrorMessage)(err));\n        }\n    }\n    return;\n};\nexports.validateProcessSync = validateProcessSync;\nconst validateCustomProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    context.rules = context.rules || rules_1.evaluationRules;\n    context.skipValidation = exports.shouldSkipValidationCustom;\n    return (0, exports.validateProcess)(context);\n});\nexports.validateCustomProcess = validateCustomProcess;\nconst validateCustomProcessSync = (context) => {\n    context.rules = context.rules || rules_1.evaluationRules;\n    context.skipValidation = exports.shouldSkipValidationCustom;\n    return (0, exports.validateProcessSync)(context);\n};\nexports.validateCustomProcessSync = validateCustomProcessSync;\nconst validateServerProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    context.rules = context.rules || rules_1.serverRules;\n    context.skipValidation = exports.shouldSkipValidationSimple;\n    return (0, exports.validateProcess)(context);\n});\nexports.validateServerProcess = validateServerProcess;\nconst validateServerProcessSync = (context) => {\n    context.rules = context.rules || rules_1.serverRules;\n    context.skipValidation = exports.shouldSkipValidationSimple;\n    return (0, exports.validateProcessSync)(context);\n};\nexports.validateServerProcessSync = validateServerProcessSync;\nconst validateAllProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    context.rules = context.rules || rules_1.rules;\n    context.skipValidation = exports.shouldSkipValidation;\n    return (0, exports.validateProcess)(context);\n});\nexports.validateAllProcess = validateAllProcess;\nconst validateAllProcessSync = (context) => {\n    context.rules = context.rules || rules_1.rules;\n    context.skipValidation = exports.shouldSkipValidation;\n    return (0, exports.validateProcessSync)(context);\n};\nexports.validateAllProcessSync = validateAllProcessSync;\nconst validatePostProcess = (context) => __awaiter(void 0, void 0, void 0, function* () {\n    yield (0, exports.validateAllProcess)(context);\n});\nexports.validatePostProcess = validatePostProcess;\nconst validatePostProcessSync = (context) => {\n    (0, exports.validateAllProcessSync)(context);\n};\nexports.validatePostProcessSync = validatePostProcessSync;\nexports.validateCustomProcessInfo = {\n    name: 'validateCustom',\n    process: exports.validateCustomProcess,\n    processSync: exports.validateCustomProcessSync,\n    shouldProcess: shouldValidateCustom,\n};\nexports.validateServerProcessInfo = {\n    name: 'validateServer',\n    process: exports.validateServerProcess,\n    processSync: exports.validateServerProcessSync,\n    shouldProcess: shouldValidateServer,\n};\nexports.validateProcessInfo = {\n    name: 'validate',\n    process: exports.validateAllProcess,\n    processSync: exports.validateAllProcessSync,\n    shouldProcess: shouldValidateAll,\n};\nexports.postValidateProcessInfo = {\n    name: 'validate',\n    postProcess: exports.validatePostProcess,\n    postProcessSync: exports.validatePostProcessSync,\n    shouldProcess: shouldValidateAll,\n};\n__exportStar(__webpack_require__(/*! ./util */ \"./node_modules/@formio/core/lib/process/validation/util.js\"), exports);\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/process/validation/index.js?");
 
 /***/ }),
 
@@ -1081,7 +1070,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n
 /***/ (function(__unused_webpack_module, exports) {
 
 "use strict";
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.ComponentPath = void 0;\n/**\n * Defines the Component paths used for every component within a form. This allows for\n * quick reference to either the \"form\" path or the \"data\" path of a component. These paths are\n * defined as follows.\n *\n *  - Form Path: The path to a component within the Form JSON. This path is used to locate a component provided a nested Form JSON object.\n *  - Data Path: The path to the data value of a component within the data model for the form. This path is used to provide the value path provided the Submission JSON object.\n *\n * These paths can also be broken into two different path \"types\".   Local and Full paths.\n *\n *  - Local Path: This is the path relative to the \"current\" form. This is used inside of a nested form to identify components and values relative to the current form in context.\n *  - Full Path: This is the path that is absolute to the root form object. Any nested form paths will include the parent form path as part of the value for the provided path.\n */\nvar ComponentPath;\n(function (ComponentPath) {\n    /**\n     * The \"form\" path to the component including all parent paths (exclusive of layout components). This path is used to uniquely identify component within a form inclusive of any parent form paths.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"path\" to the TextField component from the perspective of a configuration within the Form, would be \"form.dataGrid.textField\"\n     */\n    ComponentPath[\"path\"] = \"path\";\n    /**\n     * The \"form\" path to the component including all parent paths (inclusive of layout componnts). This path is used to uniquely identify component within a form inclusive of any parent form paths.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"fullPath\" to the TextField component from the perspective of a configuration within the Form, would be \"panel1.form.panel2.dataGrid.panel3.textField\"\n     */\n    ComponentPath[\"fullPath\"] = \"fullPath\";\n    /**\n     * The local \"form\" path to the component. This is the local path to any component within a form. This\n     * path is consistent no matter if this form is nested within another form or not. All form configurations\n     * are in relation to this path since forms are configured independently. The difference between a form path\n     * and a dataPath is that this includes any parent layout components to locate the component provided a form JSON.\n     * This path does NOT include any layout components.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"path\" to the TextField component from the perspective of a configuration within the Form, would be \"dataGrid.textField\"\n     */\n    ComponentPath[\"localPath\"] = \"localPath\";\n    /**\n     * The local \"form\" path to the component. This is the local path to any component within a form. This\n     * path is consistent no matter if this form is nested within another form or not. All form configurations\n     * are in relation to this path since forms are configured independently. The difference between a form path\n     * and a dataPath is that this includes any parent layout components to locate the component provided a form JSON.\n     * This path does NOT include any layout components.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"path\" to the TextField component from the perspective of a configuration within the Form, would be \"panel2.dataGrid.panel3.textField\"\n     */\n    ComponentPath[\"fullLocalPath\"] = \"fullLocalPath\";\n    /**\n     *  The \"data\" path to the component including all parent paths. This path is used to fetch the data value of a component within a data model, inclusive of any parent data paths of nested forms.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"dataPath\" to the TextField component would be \"form.data.dataGrid[1].textField\"\n     */\n    ComponentPath[\"dataPath\"] = \"dataPath\";\n    /**\n     * The \"data\" path is the local path to the data value for any component. The difference between this path\n     * and the \"path\" is that this path is used to locate the data value for a component within the data model.\n     * and does not include any keys for layout components.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"localDataPath\" to the TextField component from the perspective of a configuration within the Form, would be \"dataGrid[1].textField\"\n     */\n    ComponentPath[\"localDataPath\"] = \"localDataPath\";\n})(ComponentPath || (exports.ComponentPath = ComponentPath = {}));\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/types/formUtil.js?");
+eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.ComponentPath = void 0;\n/**\n * Defines the Component paths used for every component within a form. This allows for\n * quick reference to either the \"form\" path or the \"data\" path of a component. These paths are\n * defined as follows.\n *\n *  - Form Path: The path to a component within the Form JSON. This path is used to locate a component provided a nested Form JSON object.\n *  - Data Path: The path to the data value of a component within the data model for the form. This path is used to provide the value path provided the Submission JSON object.\n *\n * These paths can also be broken into two different path \"types\".   Local and Full paths.\n *\n *  - Local Path: This is the path relative to the \"current\" form. This is used inside of a nested form to identify components and values relative to the current form in context.\n *  - Full Path: This is the path that is absolute to the root form object. Any nested form paths will include the parent form path as part of the value for the provided path.\n */\nvar ComponentPath;\n(function (ComponentPath) {\n    /**\n     * The \"form\" path to the component including all parent paths (exclusive of layout components). This path is used to uniquely identify component within a form inclusive of any parent form paths.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"path\" to the TextField component from the perspective of a configuration within the Form, would be \"form.dataGrid.textField\"\n     */\n    ComponentPath[\"path\"] = \"path\";\n    /**\n     * The \"form\" path to the component including all parent paths (inclusive of layout componnts). This path is used to uniquely identify component within a form inclusive of any parent form paths.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"fullPath\" to the TextField component from the perspective of a configuration within the Form, would be \"panel1.form.panel2.dataGrid.panel3.textField\"\n     */\n    ComponentPath[\"fullPath\"] = \"fullPath\";\n    /**\n     * The local \"form\" path to the component. This is the local path to any component within a form. This\n     * path is consistent no matter if this form is nested within another form or not. All form configurations\n     * are in relation to this path since forms are configured independently. The difference between a form path\n     * and a dataPath is that this includes any parent layout components to locate the component provided a form JSON.\n     * This path does NOT include any layout components.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"path\" to the TextField component from the perspective of a configuration within the Form, would be \"dataGrid.textField\"\n     */\n    ComponentPath[\"localPath\"] = \"localPath\";\n    /**\n     * The local \"form\" path to the component. This is the local path to any component within a form. This\n     * path is consistent no matter if this form is nested within another form or not. All form configurations\n     * are in relation to this path since forms are configured independently. The difference between a form path\n     * and a dataPath is that this includes any parent layout components to locate the component provided a form JSON.\n     * This path does NOT include any layout components.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"path\" to the TextField component from the perspective of a configuration within the Form, would be \"panel2.dataGrid.panel3.textField\"\n     */\n    ComponentPath[\"fullLocalPath\"] = \"fullLocalPath\";\n    /**\n     *  The \"data\" path to the component including all parent paths. This path is used to fetch the data value of a component within a data model, inclusive of any parent data paths of nested forms.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"dataPath\" to the TextField component would be \"form.data.dataGrid[1].textField\"\n     */\n    ComponentPath[\"dataPath\"] = \"dataPath\";\n    /**\n     * The \"data\" path is the local path to the data value for any component. The difference between this path\n     * and the \"path\" is that this path is used to locate the data value for a component within the data model.\n     * and does not include any keys for layout components.\n     *\n     * For example: Suppose you have the following form structure.\n     *    - Root\n     *      - Panel 1 (panel)\n     *        - Form (form)\n     *          - Panel 2 (panel2)\n     *            - Data Grid (dataGrid)\n     *              - Panel 3 (panel3)\n     *                - TextField (textField)\n     *\n     * The \"localDataPath\" to the TextField component from the perspective of a configuration within the Form, would be \"dataGrid[1].textField\"\n     */\n    ComponentPath[\"localDataPath\"] = \"localDataPath\";\n    /**\n     * The contextual \"row\" path for the component.\n     */\n    ComponentPath[\"localContextualRowPath\"] = \"localContextualRowPath\";\n    ComponentPath[\"contextualRowPath\"] = \"contextualRowPath\";\n})(ComponentPath || (exports.ComponentPath = ComponentPath = {}));\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/types/formUtil.js?");
 
 /***/ }),
 
@@ -1609,7 +1598,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.eachComponentData = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst index_1 = __webpack_require__(/*! ./index */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst eachComponent_1 = __webpack_require__(/*! ./eachComponent */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponent.js\");\n/**\n * Iterates through each component as well as its data, and triggers a callback for every component along\n * with the contextual data for that component in addition to the absolute path for that component.\n * @param components - The array of JSON components to iterate through.\n * @param data - The contextual data object for the components.\n * @param fn - The callback function to trigger for each component following the signature (component, data, row, path, components, index, parent).\n * @param parent - The parent component.\n * @param includeAll\n * @returns\n */\nconst eachComponentData = (components, data, fn, includeAll = false, local = false, parent, parentPaths, noScopeReset) => {\n    if (!components) {\n        return;\n    }\n    return (0, eachComponent_1.eachComponent)(components, (component, compPath, componentComponents, compParent, compPaths) => {\n        const row = (0, index_1.getContextualRowData)(component, data, compPaths, local);\n        if (fn(component, data, row, (component.modelType === 'none' ? compPaths === null || compPaths === void 0 ? void 0 : compPaths.fullPath : compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '', componentComponents, compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataIndex, compParent, compPaths) === true) {\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        if ((0, index_1.isComponentNestedDataType)(component)) {\n            const value = (0, lodash_1.get)(data, local ? (compPaths === null || compPaths === void 0 ? void 0 : compPaths.localDataPath) || '' : (compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '');\n            if ((0, index_1.getModelType)(component) === 'nestedArray' ||\n                (0, index_1.getModelType)(component) === 'nestedDataArray') {\n                if (Array.isArray(value) && value.length) {\n                    for (let i = 0; i < value.length; i++) {\n                        if (compPaths) {\n                            compPaths.dataIndex = i;\n                        }\n                        (0, exports.eachComponentData)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n                    }\n                }\n                else if (includeAll || (0, lodash_1.isUndefined)(value)) {\n                    (0, exports.eachComponentData)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n                }\n                if (!noScopeReset) {\n                    (0, index_1.resetComponentScope)(component);\n                }\n                return true;\n            }\n            else {\n                if (!includeAll && !(0, index_1.shouldProcessComponent)(component, row, value)) {\n                    if (!noScopeReset) {\n                        (0, index_1.resetComponentScope)(component);\n                    }\n                    return true;\n                }\n                (0, exports.eachComponentData)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n            }\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        else if (!component.type || (0, index_1.getModelType)(component) === 'none') {\n            const info = (0, index_1.componentInfo)(component);\n            if (info.hasColumns) {\n                component.columns.forEach((column) => (0, exports.eachComponentData)(column.components, data, fn, includeAll, local, component, compPaths, noScopeReset));\n            }\n            else if (info.hasRows) {\n                component.rows.forEach((row) => {\n                    if (Array.isArray(row)) {\n                        row.forEach((row) => (0, exports.eachComponentData)(row.components, data, fn, includeAll, local, component, compPaths, noScopeReset));\n                    }\n                });\n            }\n            else if (info.hasComps) {\n                (0, exports.eachComponentData)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n            }\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        if (!noScopeReset) {\n            (0, index_1.resetComponentScope)(component);\n        }\n        return false;\n    }, true, parentPaths, parent);\n};\nexports.eachComponentData = eachComponentData;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/formUtil/eachComponentData.js?");
+eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.eachComponentData = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst index_1 = __webpack_require__(/*! ./index */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst eachComponent_1 = __webpack_require__(/*! ./eachComponent */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponent.js\");\n/**\n * Iterates through each component as well as its data, and triggers a callback for every component along\n * with the contextual data for that component in addition to the absolute path for that component.\n * @param components - The array of JSON components to iterate through.\n * @param data - The contextual data object for the components.\n * @param fn - The callback function to trigger for each component following the signature (component, data, row, path, components, index, parent).\n * @param parent - The parent component.\n * @param includeAll\n * @returns\n */\nconst eachComponentData = (components, data, fn, includeAll = false, local = false, parent, parentPaths, noScopeReset, afterFn) => {\n    if (!components) {\n        return;\n    }\n    return (0, eachComponent_1.eachComponent)(components, (component, compPath, componentComponents, compParent, compPaths) => {\n        const row = (0, index_1.getContextualRowData)(component, data, compPaths, local);\n        const callAfterFn = () => {\n            if (afterFn) {\n                return afterFn(component, data, row, (component.modelType === 'none' ? compPaths === null || compPaths === void 0 ? void 0 : compPaths.fullPath : compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '', componentComponents, compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataIndex, compParent, compPaths);\n            }\n        };\n        if (fn(component, data, row, (component.modelType === 'none' ? compPaths === null || compPaths === void 0 ? void 0 : compPaths.fullPath : compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '', componentComponents, compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataIndex, compParent, compPaths) === true) {\n            callAfterFn();\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        if ((0, index_1.isComponentNestedDataType)(component)) {\n            const value = (0, lodash_1.get)(data, local ? (compPaths === null || compPaths === void 0 ? void 0 : compPaths.localDataPath) || '' : (compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '');\n            if ((0, index_1.getModelType)(component) === 'nestedArray' ||\n                (0, index_1.getModelType)(component) === 'nestedDataArray') {\n                if (Array.isArray(value) && value.length) {\n                    for (let i = 0; i < value.length; i++) {\n                        if (!value[i]) {\n                            continue;\n                        }\n                        if (compPaths) {\n                            compPaths.dataIndex = i;\n                        }\n                        (0, exports.eachComponentData)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n                    }\n                    if (compPaths) {\n                        compPaths.dataIndex = undefined;\n                    }\n                }\n                else if (includeAll || (0, lodash_1.isUndefined)(value)) {\n                    (0, exports.eachComponentData)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n                }\n                callAfterFn();\n                if (!noScopeReset) {\n                    (0, index_1.resetComponentScope)(component);\n                }\n                return true;\n            }\n            else {\n                const shouldProcess = (0, index_1.shouldProcessComponent)(component, value, compPaths);\n                if (!includeAll && !shouldProcess) {\n                    callAfterFn();\n                    if (!noScopeReset) {\n                        (0, index_1.resetComponentScope)(component);\n                    }\n                    return true;\n                }\n                (0, exports.eachComponentData)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n            }\n            callAfterFn();\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        else if (!component.type || (0, index_1.getModelType)(component) === 'none') {\n            const info = (0, index_1.componentInfo)(component);\n            if (info.hasColumns) {\n                component.columns.forEach((column) => (0, exports.eachComponentData)(column.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn));\n            }\n            else if (info.hasRows) {\n                component.rows.forEach((row) => {\n                    if (Array.isArray(row)) {\n                        row.forEach((row) => (0, exports.eachComponentData)(row.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn));\n                    }\n                });\n            }\n            else if (info.hasComps) {\n                (0, exports.eachComponentData)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n            }\n            callAfterFn();\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        callAfterFn();\n        if (!noScopeReset) {\n            (0, index_1.resetComponentScope)(component);\n        }\n        return false;\n    }, true, parentPaths, parent);\n};\nexports.eachComponentData = eachComponentData;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/formUtil/eachComponentData.js?");
 
 /***/ }),
 
@@ -1620,7 +1609,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /***/ (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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.eachComponentDataAsync = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst index_1 = __webpack_require__(/*! ./index */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst eachComponentAsync_1 = __webpack_require__(/*! ./eachComponentAsync */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponentAsync.js\");\n// Async each component data.\nconst eachComponentDataAsync = (components_1, data_1, fn_1, ...args_1) => __awaiter(void 0, [components_1, data_1, fn_1, ...args_1], void 0, function* (components, data, fn, includeAll = false, local = false, parent, parentPaths, noScopeReset) {\n    if (!components) {\n        return;\n    }\n    return yield (0, eachComponentAsync_1.eachComponentAsync)(components, (component, compPath, componentComponents, compParent, compPaths) => __awaiter(void 0, void 0, void 0, function* () {\n        const row = (0, index_1.getContextualRowData)(component, data, compPaths, local);\n        if ((yield fn(component, data, row, (component.modelType === 'none' ? compPaths === null || compPaths === void 0 ? void 0 : compPaths.fullPath : compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '', componentComponents, compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataIndex, compParent)) === true) {\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        if ((0, index_1.isComponentNestedDataType)(component)) {\n            const value = (0, lodash_1.get)(data, local ? (compPaths === null || compPaths === void 0 ? void 0 : compPaths.localDataPath) || '' : (compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '');\n            if ((0, index_1.getModelType)(component) === 'nestedArray' ||\n                (0, index_1.getModelType)(component) === 'nestedDataArray') {\n                if (Array.isArray(value) && value.length) {\n                    for (let i = 0; i < value.length; i++) {\n                        if (compPaths) {\n                            compPaths.dataIndex = i;\n                        }\n                        yield (0, exports.eachComponentDataAsync)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n                    }\n                }\n                else if (includeAll) {\n                    yield (0, exports.eachComponentDataAsync)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n                }\n                if (!noScopeReset) {\n                    (0, index_1.resetComponentScope)(component);\n                }\n                return true;\n            }\n            else {\n                if (!includeAll && !(0, index_1.shouldProcessComponent)(component, row, value)) {\n                    if (!noScopeReset) {\n                        (0, index_1.resetComponentScope)(component);\n                    }\n                    return true;\n                }\n                yield (0, exports.eachComponentDataAsync)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n            }\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        else if (!component.type || (0, index_1.getModelType)(component) === 'none') {\n            const info = (0, index_1.componentInfo)(component);\n            if (info.hasColumns) {\n                const columnsComponent = component;\n                for (const column of columnsComponent.columns) {\n                    yield (0, exports.eachComponentDataAsync)(column.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n                }\n            }\n            else if (info.hasRows) {\n                const rowsComponent = component;\n                for (const rowArray of rowsComponent.rows) {\n                    if (Array.isArray(rowArray)) {\n                        for (const row of rowArray) {\n                            yield (0, exports.eachComponentDataAsync)(row.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n                        }\n                    }\n                }\n            }\n            else if (info.hasComps) {\n                yield (0, exports.eachComponentDataAsync)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset);\n            }\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        if (!noScopeReset) {\n            (0, index_1.resetComponentScope)(component);\n        }\n        return false;\n    }), true, parentPaths, parent);\n});\nexports.eachComponentDataAsync = eachComponentDataAsync;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/formUtil/eachComponentDataAsync.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};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.eachComponentDataAsync = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst index_1 = __webpack_require__(/*! ./index */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst eachComponentAsync_1 = __webpack_require__(/*! ./eachComponentAsync */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponentAsync.js\");\n// Async each component data.\nconst eachComponentDataAsync = (components_1, data_1, fn_1, ...args_1) => __awaiter(void 0, [components_1, data_1, fn_1, ...args_1], void 0, function* (components, data, fn, includeAll = false, local = false, parent, parentPaths, noScopeReset, afterFn) {\n    if (!components) {\n        return;\n    }\n    return yield (0, eachComponentAsync_1.eachComponentAsync)(components, (component, compPath, componentComponents, compParent, compPaths) => __awaiter(void 0, void 0, void 0, function* () {\n        const row = (0, index_1.getContextualRowData)(component, data, compPaths, local);\n        const callAfterFn = () => __awaiter(void 0, void 0, void 0, function* () {\n            if (afterFn) {\n                yield afterFn(component, data, row, (component.modelType === 'none' ? compPaths === null || compPaths === void 0 ? void 0 : compPaths.fullPath : compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '', componentComponents, compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataIndex, compParent, compPaths);\n            }\n        });\n        if ((yield fn(component, data, row, (component.modelType === 'none' ? compPaths === null || compPaths === void 0 ? void 0 : compPaths.fullPath : compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '', componentComponents, compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataIndex, compParent, compPaths)) === true) {\n            yield callAfterFn();\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        if ((0, index_1.isComponentNestedDataType)(component)) {\n            const value = (0, lodash_1.get)(data, local ? (compPaths === null || compPaths === void 0 ? void 0 : compPaths.localDataPath) || '' : (compPaths === null || compPaths === void 0 ? void 0 : compPaths.dataPath) || '');\n            if ((0, index_1.getModelType)(component) === 'nestedArray' ||\n                (0, index_1.getModelType)(component) === 'nestedDataArray') {\n                if (Array.isArray(value) && value.length) {\n                    for (let i = 0; i < value.length; i++) {\n                        if (!value[i]) {\n                            continue;\n                        }\n                        if (compPaths) {\n                            compPaths.dataIndex = i;\n                        }\n                        yield (0, exports.eachComponentDataAsync)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n                    }\n                    if (compPaths) {\n                        compPaths.dataIndex = undefined;\n                    }\n                }\n                else if (includeAll) {\n                    yield (0, exports.eachComponentDataAsync)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n                }\n                yield callAfterFn();\n                if (!noScopeReset) {\n                    (0, index_1.resetComponentScope)(component);\n                }\n                return true;\n            }\n            else {\n                const shouldProcess = (0, index_1.shouldProcessComponent)(component, value, compPaths);\n                if (!includeAll && !shouldProcess) {\n                    yield callAfterFn();\n                    if (!noScopeReset) {\n                        (0, index_1.resetComponentScope)(component);\n                    }\n                    return true;\n                }\n                yield (0, exports.eachComponentDataAsync)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n            }\n            yield callAfterFn();\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        else if (!component.type || (0, index_1.getModelType)(component) === 'none') {\n            const info = (0, index_1.componentInfo)(component);\n            if (info.hasColumns) {\n                const columnsComponent = component;\n                for (const column of columnsComponent.columns) {\n                    yield (0, exports.eachComponentDataAsync)(column.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n                }\n            }\n            else if (info.hasRows) {\n                const rowsComponent = component;\n                for (const rowArray of rowsComponent.rows) {\n                    if (Array.isArray(rowArray)) {\n                        for (const row of rowArray) {\n                            yield (0, exports.eachComponentDataAsync)(row.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n                        }\n                    }\n                }\n            }\n            else if (info.hasComps) {\n                yield (0, exports.eachComponentDataAsync)(component.components, data, fn, includeAll, local, component, compPaths, noScopeReset, afterFn);\n            }\n            yield callAfterFn();\n            if (!noScopeReset) {\n                (0, index_1.resetComponentScope)(component);\n            }\n            return true;\n        }\n        yield callAfterFn();\n        if (!noScopeReset) {\n            (0, index_1.resetComponentScope)(component);\n        }\n        return false;\n    }), true, parentPaths, parent);\n});\nexports.eachComponentDataAsync = eachComponentDataAsync;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/formUtil/eachComponentDataAsync.js?");
 
 /***/ }),
 
@@ -1631,7 +1620,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.eachComponentDataAsync = exports.eachComponentAsync = exports.eachComponentData = exports.eachComponent = exports.normalizeContext = exports.getComponentErrorField = exports.compareSelectResourceWithObjectTypeValues = exports.isSelectResourceWithObjectValue = exports.getItemTemplateKeys = exports.isComponentDataEmpty = exports.getEmptyValue = exports.findComponent = exports.applyFormChanges = exports.generateFormChange = exports.getStrings = exports.getValue = exports.escapeRegExCharacters = exports.formatAsCurrency = exports.parseFloatExt = exports.hasCondition = exports.removeComponent = exports.findComponents = exports.searchComponents = exports.getComponent = exports.matchComponent = exports.isLayoutComponent = exports.getComponentValue = exports.getComponentData = exports.componentInfo = exports.shouldProcessComponent = exports.getComponentLocalData = exports.getContextualRowData = exports.getContextualRowPath = exports.getComponentKey = exports.getComponentFromPath = exports.getBestMatch = exports.componentMatches = exports.getStringFromComponentPath = exports.getComponentPaths = exports.componentPath = exports.resetComponentScope = exports.setComponentScope = exports.isComponentNestedDataType = exports.getModelType = exports.MODEL_TYPES_OF_KNOWN_COMPONENTS = exports.uniqueName = exports.guid = exports.flattenComponents = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst fast_json_patch_1 = __webpack_require__(/*! fast-json-patch */ \"./node_modules/fast-json-patch/index.mjs\");\nconst types_1 = __webpack_require__(/*! ../../types */ \"./node_modules/@formio/core/lib/types/index.js\");\nconst Evaluator_1 = __webpack_require__(/*! ../Evaluator */ \"./node_modules/@formio/core/lib/utils/Evaluator.js\");\nconst eachComponent_1 = __webpack_require__(/*! ./eachComponent */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponent.js\");\nObject.defineProperty(exports, \"eachComponent\", ({ enumerable: true, get: function () { return eachComponent_1.eachComponent; } }));\nconst eachComponentData_1 = __webpack_require__(/*! ./eachComponentData */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponentData.js\");\nObject.defineProperty(exports, \"eachComponentData\", ({ enumerable: true, get: function () { return eachComponentData_1.eachComponentData; } }));\nconst eachComponentAsync_1 = __webpack_require__(/*! ./eachComponentAsync */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponentAsync.js\");\nObject.defineProperty(exports, \"eachComponentAsync\", ({ enumerable: true, get: function () { return eachComponentAsync_1.eachComponentAsync; } }));\nconst eachComponentDataAsync_1 = __webpack_require__(/*! ./eachComponentDataAsync */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponentDataAsync.js\");\nObject.defineProperty(exports, \"eachComponentDataAsync\", ({ enumerable: true, get: function () { return eachComponentDataAsync_1.eachComponentDataAsync; } }));\n/**\n * Flatten the form components for data manipulation.\n *\n * @param {Object} components\n *   The components to iterate.\n * @param {Boolean} includeAll\n *   Whether or not to include layout components.\n *\n * @returns {Object}\n *   The flattened components map.\n */\nfunction flattenComponents(components, includeAll = false) {\n    const flattened = {};\n    (0, eachComponent_1.eachComponent)(components, (component, path) => {\n        flattened[path] = component;\n    }, includeAll);\n    return flattened;\n}\nexports.flattenComponents = flattenComponents;\nfunction guid() {\n    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {\n        const r = (Math.random() * 16) | 0;\n        const v = c === 'x' ? r : (r & 0x3) | 0x8;\n        return v.toString(16);\n    });\n}\nexports.guid = guid;\n/**\n * Make a filename guaranteed to be unique.\n * @param name\n * @param template\n * @param evalContext\n * @returns {string}\n */\nfunction uniqueName(name, template, evalContext) {\n    template = template || '{{fileName}}-{{guid}}';\n    //include guid in template anyway, to prevent overwriting issue if filename matches existing file\n    if (!template.includes('{{guid}}')) {\n        template = `${template}-{{guid}}`;\n    }\n    const parts = name.split('.');\n    let fileName = parts.slice(0, parts.length - 1).join('.');\n    const extension = parts.length > 1 ? `.${(0, lodash_1.last)(parts)}` : '';\n    //allow only 100 characters from original name to avoid issues with filename length restrictions\n    fileName = fileName.substr(0, 100);\n    evalContext = Object.assign(evalContext || {}, {\n        fileName,\n        guid: guid(),\n    });\n    //only letters, numbers, dots, dashes, underscores and spaces are allowed. Anything else will be replaced with dash\n    const uniqueName = `${Evaluator_1.Evaluator.interpolate(template, evalContext)}${extension}`.replace(/[^0-9a-zA-Z.\\-_ ]/g, '-');\n    return uniqueName;\n}\nexports.uniqueName = uniqueName;\n/**\n * Defines model types for known components.\n * For now, these will be the only model types supported by the @formio/core library.\n *\n * nestedArray: for components that store their data as an array and have nested components.\n * nestedDataArray: for components that store their data as an array and have nested components, but keeps the value of nested components inside 'data' property.\n * array: for components that store their data as an array.\n * dataObject: for components that store their data in a nested { data: {} } object.\n * object: for components that store their data in an object.\n * map: for components that store their data in a map.\n * content: for components that do not store data.\n * string: for components that store their data as a string.\n * number: for components that store their data as a number.\n * boolean: for components that store their data as a boolean.\n * none: for components that do not store data and should not be included in the submission.\n * any: for components that can store any type of data.\n *\n */\nexports.MODEL_TYPES_OF_KNOWN_COMPONENTS = {\n    nestedArray: ['datagrid', 'editgrid', 'datatable', 'dynamicWizard'],\n    nestedDataArray: ['tagpad'],\n    dataObject: ['form'],\n    object: ['container', 'address'],\n    map: ['datamap'],\n    content: ['htmlelement', 'content'],\n    string: [\n        'textfield',\n        'password',\n        'email',\n        'url',\n        'phoneNumber',\n        'day',\n        'datetime',\n        'time',\n        'signature',\n    ],\n    number: ['number', 'currency'],\n    boolean: ['checkbox', 'radio'],\n    none: ['table', 'well', 'columns', 'fieldset', 'panel', 'tabs'],\n    any: [\n        'survey',\n        'captcha',\n        'textarea',\n        'selectboxes',\n        'tags',\n        'select',\n        'hidden',\n        'button',\n        'datasource',\n        'sketchpad',\n        'reviewpage',\n        'file',\n    ],\n};\nfunction getModelType(component) {\n    // If the component JSON asserts a model type, use that.\n    if (component.modelType) {\n        return component.modelType;\n    }\n    let modelType = 'any';\n    // Otherwise, check for known component types.\n    for (const type of Object.keys(exports.MODEL_TYPES_OF_KNOWN_COMPONENTS)) {\n        if (exports.MODEL_TYPES_OF_KNOWN_COMPONENTS[type].includes(component.type)) {\n            modelType = type;\n            break;\n        }\n    }\n    // Otherwise check for components that assert no value.\n    if (modelType === 'any' && component.input === false) {\n        modelType = 'none';\n    }\n    // To speed up performance of getModelType, we will set the modelType on the component\n    Object.defineProperty(component, 'modelType', {\n        enumerable: false,\n        writable: true,\n        value: modelType,\n    });\n    // Otherwise default to any.\n    return modelType;\n}\nexports.getModelType = getModelType;\nfunction isComponentNestedDataType(component) {\n    return (component.tree ||\n        getModelType(component) === 'nestedArray' ||\n        getModelType(component) === 'nestedDataArray' ||\n        getModelType(component) === 'dataObject' ||\n        getModelType(component) === 'object' ||\n        getModelType(component) === 'map');\n}\nexports.isComponentNestedDataType = isComponentNestedDataType;\nfunction setComponentScope(component, name, value) {\n    if (!component) {\n        return;\n    }\n    if (!component.scope) {\n        Object.defineProperty(component, 'scope', {\n            enumerable: false,\n            configurable: true,\n            writable: true,\n            value: {},\n        });\n    }\n    Object.defineProperty(component.scope, name, {\n        enumerable: false,\n        writable: false,\n        configurable: true,\n        value,\n    });\n}\nexports.setComponentScope = setComponentScope;\nfunction resetComponentScope(component) {\n    if (component.scope) {\n        delete component.scope;\n    }\n}\nexports.resetComponentScope = resetComponentScope;\n/**\n * Return the component path provided the type of the component path.\n * @param component - The component JSON.\n * @param type - The type of path to return.\n * @returns\n */\nfunction componentPath(component, parent, parentPaths, type) {\n    if (!component) {\n        return '';\n    }\n    if (component.component) {\n        component = component.component;\n    }\n    const compModel = getModelType(component);\n    // Relative paths are only referenced from the current form.\n    const relative = type === types_1.ComponentPath.localPath ||\n        type === types_1.ComponentPath.fullLocalPath ||\n        type === types_1.ComponentPath.localDataPath;\n    // Full paths include all layout component ids in the path.\n    const fullPath = type === types_1.ComponentPath.fullPath || type === types_1.ComponentPath.fullLocalPath;\n    // See if this is a data path.\n    const dataPath = type === types_1.ComponentPath.dataPath || type === types_1.ComponentPath.localDataPath;\n    // Determine if this component should include its key.\n    const includeKey = fullPath || (!!component.type && compModel !== 'none');\n    // The key is provided if the component can have data or if we are fetching the full path.\n    const key = includeKey ? getComponentKey(component) : '';\n    if (!parent) {\n        // Return the key if there is no parent.\n        return key;\n    }\n    // Get the parent model type.\n    const parentModel = getModelType(parent);\n    // If there is a parent, then we only return the key if the parent is a nested form and it is a relative path.\n    if (relative && parentModel === 'dataObject') {\n        return key;\n    }\n    // Return the parent path.\n    let parentPath = (parentPaths === null || parentPaths === void 0 ? void 0 : parentPaths.hasOwnProperty(type)) ? parentPaths[type] || '' : '';\n    // For data paths (where we wish to get the path to the data), we need to ensure we append the parent\n    // paths to the end of the path so that any component within this component properly references their data.\n    if (dataPath && parentPath) {\n        if (parentModel === 'nestedArray' || parentModel === 'nestedDataArray') {\n            parentPath += `[${(parentPaths === null || parentPaths === void 0 ? void 0 : parentPaths.dataIndex) || 0}]`;\n        }\n        if (parentModel === 'dataObject' || parentModel === 'nestedDataArray') {\n            parentPath += '.data';\n        }\n    }\n    // Return the parent path with its relative component path (if applicable).\n    return parentPath ? (key ? `${parentPath}.${key}` : parentPath) : key;\n}\nexports.componentPath = componentPath;\n/**\n * This method determines a components paths provided the component JSON, the parent and the parent paths.\n * @param component\n * @param parent\n * @param parentPaths\n * @returns\n */\nfunction getComponentPaths(component, parent, parentPaths) {\n    return {\n        path: componentPath(component, parent, parentPaths, types_1.ComponentPath.path),\n        fullPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.fullPath),\n        localPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.localPath),\n        fullLocalPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.fullLocalPath),\n        dataPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.dataPath),\n        localDataPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.localDataPath),\n        dataIndex: parentPaths === null || parentPaths === void 0 ? void 0 : parentPaths.dataIndex,\n    };\n}\nexports.getComponentPaths = getComponentPaths;\nfunction getStringFromComponentPath(path) {\n    if (!(0, lodash_1.isArray)(path)) {\n        return path;\n    }\n    let strPath = '';\n    path.forEach((part, i) => {\n        if ((0, lodash_1.isNumber)(part)) {\n            strPath += `[${part}]`;\n        }\n        else {\n            strPath += i === 0 ? part : `.${part}`;\n        }\n    });\n    return strPath;\n}\nexports.getStringFromComponentPath = getStringFromComponentPath;\n/**\n * Determines if a component has a match at any of the path types.\n * @param component {Component} - The component JSON to check for matches.\n * @param paths {ComponentPaths} - The current component paths object.\n * @param path {string} - Either the \"form\" or \"data\" path to see if a match occurs.\n * @param dataIndex {number | undefined} - The data index for the current component to match.\n * @param matches {Record<string, ComponentMatch | undefined>} - The current matches object.\n * @param addMatch {(type: ComponentPath | 'key', match: ComponentMatch) => ComponentMatch} - A callback function to allow modules to decorate the match object.\n */\nfunction componentMatches(component, paths, path, dataIndex, matches = {\n    path: undefined,\n    fullPath: undefined,\n    localPath: undefined,\n    dataPath: undefined,\n    localDataPath: undefined,\n    fullLocalPath: undefined,\n    key: undefined,\n}, addMatch = (type, match) => {\n    return match;\n}) {\n    let dataProperty = '';\n    if (component.type === 'selectboxes') {\n        const valuePath = new RegExp(`(\\\\.${(0, lodash_1.escapeRegExp)(component.key)})(\\\\.[^\\\\.]+)$`);\n        const pathMatches = path.match(valuePath);\n        if ((pathMatches === null || pathMatches === void 0 ? void 0 : pathMatches.length) === 3) {\n            dataProperty = pathMatches[2];\n            path = path.replace(valuePath, '$1');\n        }\n    }\n    // Get the current model type.\n    const modelType = getModelType(component);\n    const dataModel = modelType !== 'none' && modelType !== 'content';\n    [\n        types_1.ComponentPath.path,\n        types_1.ComponentPath.fullPath,\n        types_1.ComponentPath.localPath,\n        types_1.ComponentPath.fullLocalPath,\n        types_1.ComponentPath.dataPath,\n        types_1.ComponentPath.localDataPath,\n    ].forEach((type) => {\n        const dataPath = type === types_1.ComponentPath.dataPath || type === types_1.ComponentPath.localDataPath;\n        if (paths[type] === path) {\n            const currentMatch = matches[type];\n            const currentModelType = (currentMatch === null || currentMatch === void 0 ? void 0 : currentMatch.component)\n                ? getModelType(currentMatch.component)\n                : 'none';\n            const currentDataModel = currentModelType !== 'none' && currentModelType !== 'content';\n            if (!currentMatch ||\n                (dataPath && dataModel && currentDataModel) || // Replace the current match if this is a dataPath and both are dataModels.\n                (!dataPath && dataIndex === paths.dataIndex) // Replace the current match if this is not a dataPath and the indexes are the same.\n            ) {\n                if (dataPath) {\n                    const dataPaths = {\n                        dataPath: paths.dataPath || '',\n                        localDataPath: paths.localDataPath || '',\n                    };\n                    if (dataProperty) {\n                        dataPaths.dataPath += dataProperty;\n                        dataPaths.localDataPath += dataProperty;\n                    }\n                    matches[type] = addMatch(type, {\n                        component,\n                        paths: Object.assign(Object.assign({}, paths), dataPaths),\n                    });\n                }\n                else {\n                    matches[type] = addMatch(type, { component, paths });\n                }\n            }\n        }\n    });\n    if (!matches.key && component.key === path) {\n        matches.key = addMatch('key', { component, paths });\n    }\n}\nexports.componentMatches = componentMatches;\nfunction getBestMatch(matches) {\n    if (matches.dataPath) {\n        return matches.dataPath;\n    }\n    if (matches.localDataPath) {\n        return matches.localDataPath;\n    }\n    if (matches.fullPath) {\n        return matches.fullPath;\n    }\n    if (matches.path) {\n        return matches.path;\n    }\n    if (matches.fullLocalPath) {\n        return matches.fullLocalPath;\n    }\n    if (matches.localPath) {\n        return matches.localPath;\n    }\n    if (matches.key) {\n        return matches.key;\n    }\n    return undefined;\n}\nexports.getBestMatch = getBestMatch;\n/**\n * This method performs a fuzzy search for a component within a form provided a number of different\n * paths to search.\n */\nfunction getComponentFromPath(components, path, data, dataIndex, includeAll = false) {\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    if (data) {\n        (0, eachComponentData_1.eachComponentData)(components, data, (component, data, row, compPath, comps, index, parent, paths) => {\n            componentMatches(component, paths || {}, path, dataIndex, matches);\n        }, includeAll, false, undefined, undefined, true);\n    }\n    else {\n        (0, eachComponent_1.eachComponent)(components, (component, compPath, componentComponents, compParent, paths) => {\n            componentMatches(component, paths || {}, path, dataIndex, matches);\n        }, includeAll);\n    }\n    return getBestMatch(matches);\n}\nexports.getComponentFromPath = getComponentFromPath;\n/**\n * Provided a component, this will return the \"data\" key for that component in the contextual data\n * object.\n *\n * @param component\n * @returns\n */\nfunction getComponentKey(component) {\n    if (!component) {\n        return '';\n    }\n    if (component.type === 'checkbox' &&\n        component.inputType === 'radio' &&\n        component.name) {\n        return component.name;\n    }\n    return component.key;\n}\nexports.getComponentKey = getComponentKey;\nfunction getContextualRowPath(component, paths, local) {\n    if (!paths) {\n        return '';\n    }\n    const dataPath = local ? paths.localDataPath : paths.dataPath;\n    return (dataPath === null || dataPath === void 0 ? void 0 : dataPath.replace(new RegExp(`.?${(0, lodash_1.escapeRegExp)(getComponentKey(component))}$`), '')) || '';\n}\nexports.getContextualRowPath = getContextualRowPath;\nfunction getContextualRowData(component, data, paths, local) {\n    const rowPath = getContextualRowPath(component, paths, local);\n    return rowPath ? (0, lodash_1.get)(data, rowPath, null) : data;\n}\nexports.getContextualRowData = getContextualRowData;\nfunction getComponentLocalData(paths, data, local) {\n    var _a;\n    if (local) {\n        return data;\n    }\n    const parentPath = ((_a = paths.dataPath) === null || _a === void 0 ? void 0 : _a.replace(new RegExp(`.?${(0, lodash_1.escapeRegExp)(paths.localDataPath)}$`), '')) || '';\n    return parentPath ? (0, lodash_1.get)(data, parentPath, null) : data;\n}\nexports.getComponentLocalData = getComponentLocalData;\nfunction shouldProcessComponent(comp, row, value) {\n    var _a;\n    if (getModelType(comp) === 'dataObject') {\n        const noReferenceAttached = (value === null || value === void 0 ? void 0 : value._id) ? (0, lodash_1.isEmpty)(value.data) && !(0, lodash_1.has)(value, 'form') : false;\n        const shouldBeCleared = (!comp.hasOwnProperty('clearOnHide') || comp.clearOnHide) &&\n            (comp.hidden || ((_a = comp.scope) === null || _a === void 0 ? void 0 : _a.conditionallyHidden));\n        const shouldSkipProcessingNestedFormData = noReferenceAttached || shouldBeCleared;\n        if (shouldSkipProcessingNestedFormData) {\n            return false;\n        }\n    }\n    return true;\n}\nexports.shouldProcessComponent = shouldProcessComponent;\nfunction componentInfo(component) {\n    const hasColumns = component.columns && Array.isArray(component.columns);\n    const hasRows = component.rows && Array.isArray(component.rows);\n    const hasComps = component.components && Array.isArray(component.components);\n    const isContent = getModelType(component) === 'content';\n    const isLayout = getModelType(component) === 'none';\n    const isInput = !component.hasOwnProperty('input') || !!component.input;\n    return {\n        hasColumns,\n        hasRows,\n        hasComps,\n        layout: hasColumns || hasRows || (hasComps && !isInput) || isLayout || isContent,\n        iterable: hasColumns || hasRows || hasComps || isContent,\n    };\n}\nexports.componentInfo = componentInfo;\n// Provided components, data, and a key, this will return the components data.\nfunction getComponentData(components, data, path) {\n    const compData = { component: null, data: null };\n    (0, eachComponentData_1.eachComponentData)(components, data, (component, data, row, compPath) => {\n        if (compPath === path) {\n            compData.component = component;\n            compData.data = row;\n            return true;\n        }\n    });\n    return compData;\n}\nexports.getComponentData = getComponentData;\nfunction getComponentValue(form, data, path, dataIndex, local) {\n    var _a, _b;\n    const match = getComponentFromPath((form === null || form === void 0 ? void 0 : form.components) || [], path, data, dataIndex);\n    if (!match) {\n        // Fall back to get the value from the data object.\n        return (0, lodash_1.get)(data, path, undefined);\n    }\n    if (local) {\n        return ((_a = match === null || match === void 0 ? void 0 : match.paths) === null || _a === void 0 ? void 0 : _a.localDataPath) ? (0, lodash_1.get)(data, match.paths.localDataPath, undefined) : null;\n    }\n    return ((_b = match === null || match === void 0 ? void 0 : match.paths) === null || _b === void 0 ? void 0 : _b.dataPath) ? (0, lodash_1.get)(data, match.paths.dataPath, undefined) : null;\n}\nexports.getComponentValue = getComponentValue;\n/**\n * Determine if a component is a layout component or not.\n *\n * @param {Object} component\n *   The component to check.\n *\n * @returns {Boolean}\n *   Whether or not the component is a layout component.\n */\nfunction isLayoutComponent(component) {\n    return Boolean((component.columns &&\n        Array.isArray(component.columns)) ||\n        (component.rows && Array.isArray(component.rows)) ||\n        (component.components &&\n            Array.isArray(component.components)));\n}\nexports.isLayoutComponent = isLayoutComponent;\n/**\n * Matches if a component matches the query.\n *\n * @param component\n * @param query\n * @return {boolean}\n */\nfunction matchComponent(component, query, paths) {\n    if ((0, lodash_1.isString)(query)) {\n        return component.key === query || (paths === null || paths === void 0 ? void 0 : paths.localPath) === query || (paths === null || paths === void 0 ? void 0 : paths.path) === query;\n    }\n    else {\n        let matches = false;\n        (0, lodash_1.forOwn)(query, (value, key) => {\n            matches = (0, lodash_1.get)(component, key) === value;\n            if (!matches) {\n                return false;\n            }\n        });\n        return matches;\n    }\n}\nexports.matchComponent = matchComponent;\n/**\n * Get a component by its path.\n *\n * @param {Object} components - The components to iterate.\n * @param {String|Object} path - The key of the component to get, or a query of the component to search.\n * @param {boolean} includeAll - Whether or not to include layout components.\n * @returns {Component} - The component that matches the given key, or undefined if not found.\n */\nfunction getComponent(components, path, includeAll = true, dataIndex) {\n    var _a;\n    return (_a = getComponentFromPath(components, path, undefined, dataIndex, includeAll)) === null || _a === void 0 ? void 0 : _a.component;\n}\nexports.getComponent = getComponent;\n/**\n * Finds a component provided a query of properties of that component.\n *\n * @param components\n * @param query\n * @return {*}\n */\nfunction searchComponents(components, query) {\n    const results = [];\n    (0, eachComponent_1.eachComponent)(components, (component, compPath, components, parent, compPaths) => {\n        if (matchComponent(component, query, compPaths)) {\n            results.push(component);\n        }\n    }, true);\n    return results;\n}\nexports.searchComponents = searchComponents;\n/**\n * Deprecated version of findComponents. Renamed to searchComponents.\n * @param {import('@formio/core').Component[]} components - The components to find components within.\n * @param {object} query - The query to use when searching for the components.\n * @returns {import('@formio/core').Component[]} - The result of the component that is found.\n */\nfunction findComponents(components, query) {\n    console.warn('formio.js/utils findComponents is deprecated. Use searchComponents instead.');\n    return searchComponents(components, query);\n}\nexports.findComponents = findComponents;\n/**\n * Remove a component by path.\n *\n * @param components\n * @param path\n */\nfunction removeComponent(components, path) {\n    // @ts-expect-error - I'm not sure why we're using `pop` here if it's a string\n    const index = path.pop();\n    if (path.length !== 0) {\n        components = (0, lodash_1.get)(components, path);\n    }\n    components.splice(index, 1);\n}\nexports.removeComponent = removeComponent;\n/**\n * Returns if this component has a conditional statement.\n *\n * @param component - The component JSON schema.\n *\n * @returns {boolean} - TRUE - This component has a conditional, FALSE - No conditional provided.\n */\nfunction hasCondition(component) {\n    return Boolean(component.customConditional ||\n        (component.conditional &&\n            (component.conditional.when ||\n                component.conditional.json ||\n                (component.conditional.conjunction &&\n                    ((0, lodash_1.isBoolean)(component.conditional.show) ||\n                        component.conditional.show) &&\n                    !(0, lodash_1.isEmpty)(component.conditional.conditions)))));\n}\nexports.hasCondition = hasCondition;\n/**\n * Extension of standard #parseFloat(value) function, that also clears input string.\n *\n * @param {any} value\n *   The value to parse.\n *\n * @returns {Number}\n *   Parsed value.\n */\nfunction parseFloatExt(value) {\n    return parseFloat((0, lodash_1.isString)(value) ? value.replace(/[^\\de.+-]/gi, '') : value);\n}\nexports.parseFloatExt = parseFloatExt;\n/**\n * Formats provided value in way how Currency component uses it.\n *\n * @param {any} value\n *   The value to format.\n *\n * @returns {String}\n *   Value formatted for Currency component.\n */\nfunction formatAsCurrency(value) {\n    const parsedValue = parseFloatExt(value);\n    if (isNaN(parsedValue)) {\n        return '';\n    }\n    const parts = (0, lodash_1.round)(parsedValue, 2).toString().split('.');\n    parts[0] = (0, lodash_1.chunk)(Array.from(parts[0]).reverse(), 3)\n        .reverse()\n        .map((part) => part.reverse().join(''))\n        .join(',');\n    parts[1] = (0, lodash_1.pad)(parts[1], 2, '0');\n    return parts.join('.');\n}\nexports.formatAsCurrency = formatAsCurrency;\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 * Get the value for a component key, in the given submission.\n *\n * @param {Object} submission\n *   A submission object to search.\n * @param {String} key\n *   A for components API key to search for.\n */\nfunction getValue(submission, key) {\n    const search = (data) => {\n        if ((0, lodash_1.isPlainObject)(data)) {\n            if ((0, lodash_1.has)(data, key)) {\n                return (0, lodash_1.get)(data, key);\n            }\n            let value = null;\n            (0, lodash_1.forOwn)(data, (prop) => {\n                const result = search(prop);\n                if (!(0, lodash_1.isNil)(result)) {\n                    value = result;\n                    return false;\n                }\n            });\n            return value;\n        }\n        else {\n            return null;\n        }\n    };\n    return search(submission.data);\n}\nexports.getValue = getValue;\n/**\n * Iterate over all components in a form and get string values for translation.\n * @param form\n */\nfunction getStrings(form) {\n    const properties = [\n        'label',\n        'title',\n        'legend',\n        'tooltip',\n        'description',\n        'placeholder',\n        'prefix',\n        'suffix',\n        'errorLabel',\n        'content',\n        'html',\n    ];\n    const strings = [];\n    (0, eachComponent_1.eachComponent)(form.components, (component) => {\n        properties.forEach((property) => {\n            if (component.hasOwnProperty(property) && component[property]) {\n                strings.push({\n                    key: component.key,\n                    type: component.type,\n                    property,\n                    string: component[property],\n                });\n            }\n        });\n        if ((!component.dataSrc || component.dataSrc === 'values') &&\n            component.hasOwnProperty('values') &&\n            Array.isArray(component.values) &&\n            component.values.length) {\n            component.values.forEach((value, index) => {\n                strings.push({\n                    key: component.key,\n                    property: `value[${index}].label`,\n                    string: component.values[index].label,\n                });\n            });\n        }\n        // Hard coded values from Day component\n        if (component.type === 'day') {\n            [\n                'day',\n                'month',\n                'year',\n                'Day',\n                'Month',\n                'Year',\n                'january',\n                'february',\n                'march',\n                'april',\n                'may',\n                'june',\n                'july',\n                'august',\n                'september',\n                'october',\n                'november',\n                'december',\n            ].forEach((string) => {\n                strings.push({\n                    key: component.key,\n                    property: 'day',\n                    string,\n                });\n            });\n            if (component.fields.day.placeholder) {\n                strings.push({\n                    key: component.key,\n                    property: 'fields.day.placeholder',\n                    string: component.fields.day.placeholder,\n                });\n            }\n            if (component.fields.month.placeholder) {\n                strings.push({\n                    key: component.key,\n                    property: 'fields.month.placeholder',\n                    string: component.fields.month.placeholder,\n                });\n            }\n            if (component.fields.year.placeholder) {\n                strings.push({\n                    key: component.key,\n                    property: 'fields.year.placeholder',\n                    string: component.fields.year.placeholder,\n                });\n            }\n        }\n        if (component.type === 'editgrid') {\n            const string = component.addAnother || 'Add Another';\n            if (component.addAnother) {\n                strings.push({\n                    key: component.key,\n                    property: 'addAnother',\n                    string,\n                });\n            }\n        }\n        if (component.type === 'select') {\n            ['loading...', 'Type to search'].forEach((string) => {\n                strings.push({\n                    key: component.key,\n                    property: 'select',\n                    string,\n                });\n            });\n        }\n    }, true);\n    return strings;\n}\nexports.getStrings = getStrings;\n// ?????????????????????????\n// questionable section\nfunction generateFormChange(type, data) {\n    let change;\n    switch (type) {\n        case 'add':\n            change = {\n                op: 'add',\n                key: data.component.key,\n                container: data.parent.key, // Parent component\n                path: data.path, // Path to container within parent component.\n                index: data.index, // Index of component in parent container.\n                component: data.component,\n            };\n            break;\n        case 'edit':\n            change = {\n                op: 'edit',\n                key: data.originalComponent.key,\n                patches: (0, fast_json_patch_1.compare)(data.originalComponent, data.component),\n            };\n            // Don't save if nothing changed.\n            if (!change.patches.length) {\n                change = null;\n            }\n            break;\n        case 'remove':\n            change = {\n                op: 'remove',\n                key: data.component.key,\n            };\n            break;\n    }\n    return change;\n}\nexports.generateFormChange = generateFormChange;\nfunction applyFormChanges(form, changes) {\n    const failed = [];\n    changes.forEach(function (change) {\n        let found = false;\n        switch (change.op) {\n            case 'add': {\n                let newComponent = change.component;\n                // Find the container to set the component in.\n                findComponent(form.components, change.container, null, function (parent) {\n                    if (!change.container) {\n                        parent = form;\n                    }\n                    // A move will first run an add so remove any existing components with matching key before inserting.\n                    findComponent(form.components, change.key, null, function (component, path) {\n                        // If found, use the existing component. (If someone else edited it, the changes would be here)\n                        newComponent = component;\n                        removeComponent(form.components, path);\n                    });\n                    found = true;\n                    const container = (0, lodash_1.get)(parent, change.path);\n                    container.splice(change.index, 0, newComponent);\n                });\n                break;\n            }\n            case 'remove':\n                findComponent(form.components, change.key, null, function (component, path) {\n                    found = true;\n                    const oldComponent = (0, lodash_1.get)(form.components, path);\n                    if (oldComponent.key !== component.key) {\n                        path.pop();\n                    }\n                    removeComponent(form.components, path);\n                });\n                break;\n            case 'edit':\n                findComponent(form.components, change.key, null, function (component, path) {\n                    found = true;\n                    try {\n                        const oldComponent = (0, lodash_1.get)(form.components, path);\n                        const newComponent = (0, fast_json_patch_1.applyPatch)(component, change.patches).newDocument;\n                        if (oldComponent.key !== newComponent.key) {\n                            path.pop();\n                        }\n                        (0, lodash_1.set)(form.components, path, newComponent);\n                    }\n                    catch (ignoreErr) {\n                        failed.push(change);\n                    }\n                });\n                break;\n            case 'move':\n                break;\n        }\n        if (!found) {\n            failed.push(change);\n        }\n    });\n    return {\n        form,\n        failed,\n    };\n}\nexports.applyFormChanges = applyFormChanges;\n/**\n * This function will find a component in a form and return the component AND THE PATH to the component in the form.\n * Path to the component is stored as an array of nested components and their indexes.The Path is being filled recursively\n * when you iterating through the nested structure.\n * If the component is not found the callback won't be called and function won't return anything.\n *\n * @param components\n * @param key\n * @param fn\n * @param path\n * @returns {*}\n */\nfunction findComponent(components, key, path, fn) {\n    if (!components)\n        return;\n    path = path || [];\n    if (!key) {\n        return fn(components);\n    }\n    components.forEach(function (component, index) {\n        const newPath = path.slice();\n        // Add an index of the component it iterates through in nested structure\n        newPath.push(index);\n        if (!component)\n            return;\n        if (component.hasOwnProperty('columns') && Array.isArray(component.columns)) {\n            newPath.push('columns');\n            component.columns.forEach(function (column, index) {\n                const colPath = newPath.slice();\n                colPath.push(index);\n                colPath.push('components');\n                findComponent(column.components, key, colPath, fn);\n            });\n        }\n        if (component.hasOwnProperty('rows') && Array.isArray(component.rows)) {\n            newPath.push('rows');\n            component.rows.forEach(function (row, index) {\n                const rowPath = newPath.slice();\n                rowPath.push(index);\n                row.forEach(function (column, index) {\n                    const colPath = rowPath.slice();\n                    colPath.push(index);\n                    colPath.push('components');\n                    findComponent(column.components, key, colPath, fn);\n                });\n            });\n        }\n        if (component.hasOwnProperty('components') && Array.isArray(component.components)) {\n            newPath.push('components');\n            findComponent(component.components, key, newPath, fn);\n        }\n        if (component.key === key) {\n            //Final callback if the component is found\n            fn(component, newPath, components);\n        }\n    });\n}\nexports.findComponent = findComponent;\nconst isCheckboxComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'checkbox';\nconst isDataGridComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'datagrid';\nconst isEditGridComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'editgrid';\nconst isAddressComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'address';\nconst isDataTableComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'datatable';\nconst hasChildComponents = (component) => (component === null || component === void 0 ? void 0 : component.components) != null;\nconst isDateTimeComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'datetime';\nconst isSelectBoxesComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'selectboxes';\nconst isTextAreaComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'textarea';\nconst isTextFieldComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'textfield';\nfunction getEmptyValue(component) {\n    switch (component.type) {\n        case 'textarea':\n        case 'textfield':\n        case 'time':\n        case 'datetime':\n        case 'day':\n            return '';\n        case 'datagrid':\n        case 'editgrid':\n            return [];\n        default:\n            return null;\n    }\n}\nexports.getEmptyValue = getEmptyValue;\nconst replaceBlanks = (value) => {\n    const nbsp = '<p>&nbsp;</p>';\n    const br = '<p><br></p>';\n    const brNbsp = '<p><br>&nbsp;</p>';\n    const regExp = new RegExp(`^${nbsp}|${nbsp}$|^${br}|${br}$|^${brNbsp}|${brNbsp}$`, 'g');\n    return typeof value === 'string' ? value.replace(regExp, '').trim() : value;\n};\nfunction trimBlanks(value) {\n    if (!value) {\n        return value;\n    }\n    if (Array.isArray(value)) {\n        value = value.map((val) => replaceBlanks(val));\n    }\n    else {\n        value = replaceBlanks(value);\n    }\n    return value;\n}\nfunction isValueEmpty(component, value) {\n    const compValueIsEmptyArray = (0, lodash_1.isArray)(value) && value.length === 1 ? (0, lodash_1.isEqual)(value[0], getEmptyValue(component)) : false;\n    return (value == null || value === '' || ((0, lodash_1.isArray)(value) && value.length === 0) || compValueIsEmptyArray);\n}\nfunction isComponentDataEmpty(component, data, path, valueCond) {\n    var _a;\n    const value = (0, lodash_1.isNil)(valueCond) ? (0, lodash_1.get)(data, path) : valueCond;\n    const addressIgnoreProperties = ['mode', 'address'];\n    if (isCheckboxComponent(component)) {\n        return isValueEmpty(component, value) || value === false;\n    }\n    else if (isAddressComponent(component)) {\n        if (Object.keys(value).length === 0) {\n            return true;\n        }\n        return !Object.values((0, lodash_1.omit)(value, addressIgnoreProperties)).some(Boolean);\n    }\n    else if (isDataGridComponent(component) ||\n        isEditGridComponent(component) ||\n        isDataTableComponent(component) ||\n        hasChildComponents(component)) {\n        if ((_a = component.components) === null || _a === void 0 ? void 0 : _a.length) {\n            let childrenEmpty = true;\n            // wrap component in an array to let eachComponentData handle introspection to child components (e.g. this will be different\n            // for data grids versus nested forms, etc.)\n            (0, eachComponentData_1.eachComponentData)([component], data, (thisComponent, data, row, path) => {\n                if (component.key === thisComponent.key)\n                    return;\n                if (!isComponentDataEmpty(thisComponent, data, path)) {\n                    childrenEmpty = false;\n                }\n            });\n            return isValueEmpty(component, value) || childrenEmpty;\n        }\n        return isValueEmpty(component, value);\n    }\n    else if (isDateTimeComponent(component)) {\n        return isValueEmpty(component, value) || value.toString() === 'Invalid date';\n    }\n    else if (isSelectBoxesComponent(component)) {\n        let selectBoxEmpty = true;\n        for (const key in value) {\n            if (value[key]) {\n                selectBoxEmpty = false;\n                break;\n            }\n        }\n        return isValueEmpty(component, value) || selectBoxEmpty;\n    }\n    else if (isTextAreaComponent(component)) {\n        const isPlain = !component.wysiwyg && !component.editor;\n        return isPlain\n            ? typeof value === 'string'\n                ? isValueEmpty(component, value.trim())\n                : isValueEmpty(component, value)\n            : isValueEmpty(component, trimBlanks(value));\n    }\n    else if (isTextFieldComponent(component)) {\n        if (component.allowMultipleMasks && !!component.inputMasks && !!component.inputMasks.length) {\n            return (isValueEmpty(component, value) ||\n                (component.multiple ? value.length === 0 : !value.maskName || !value.value));\n        }\n        return isValueEmpty(component, value === null || value === void 0 ? void 0 : value.toString().trim());\n    }\n    return isValueEmpty(component, value);\n}\nexports.isComponentDataEmpty = isComponentDataEmpty;\n/**\n * Returns the template keys inside the template code.\n * @param {string} template - The template to get the keys from.\n * @returns {Array<string>} - The keys inside the template.\n */\nfunction getItemTemplateKeys(template) {\n    const templateKeys = [];\n    if (!template) {\n        return templateKeys;\n    }\n    const keys = template.match(/({{\\s*(.*?)\\s*}})/g);\n    if (keys) {\n        keys.forEach((key) => {\n            const propKey = key.match(/{{\\s*item\\.(.*?)\\s*}}/);\n            if (propKey && propKey.length > 1) {\n                templateKeys.push(propKey[1]);\n            }\n        });\n    }\n    return templateKeys;\n}\nexports.getItemTemplateKeys = getItemTemplateKeys;\n/**\n * Returns if the component is a select resource with an object for its value.\n * @param {Component} comp - The component to check.\n * @returns {boolean} - TRUE if the component is a select resource with an object for its value; FALSE otherwise.\n */\nfunction isSelectResourceWithObjectValue(comp = {}) {\n    const { reference, dataSrc, valueProperty } = comp;\n    return reference || (dataSrc === 'resource' && (!valueProperty || valueProperty === 'data'));\n}\nexports.isSelectResourceWithObjectValue = isSelectResourceWithObjectValue;\n/**\n * Compares real select resource value with expected value in condition.\n * @param {any} value - current value of selectcomponent.\n * @param {any} comparedValue - expocted value of select component.\n * @param {SelectComponent} conditionComponent - select component on which the condtion is based.\n * @returns {boolean} - TRUE if the select component current value is equal to the expected value; FALSE otherwise.\n */\nfunction compareSelectResourceWithObjectTypeValues(value, comparedValue, conditionComponent) {\n    if (!value || !(0, lodash_1.isPlainObject)(value)) {\n        return false;\n    }\n    const { template, valueProperty } = conditionComponent;\n    if (valueProperty === 'data') {\n        value = { data: value };\n        comparedValue = { data: comparedValue };\n    }\n    return (0, lodash_1.every)(getItemTemplateKeys(template) || [], (k) => (0, lodash_1.isEqual)((0, lodash_1.get)(value, k), (0, lodash_1.get)(comparedValue, k)));\n}\nexports.compareSelectResourceWithObjectTypeValues = compareSelectResourceWithObjectTypeValues;\nfunction getComponentErrorField(component, context) {\n    const toInterpolate = component.errorLabel || component.label || component.placeholder || component.key;\n    return Evaluator_1.Evaluator.interpolate(toInterpolate, context);\n}\nexports.getComponentErrorField = getComponentErrorField;\n/**\n * Normalize a context object so that it contains the correct paths and data, and so it can pass into and out of a sandbox for evaluation\n * @param context\n * @returns\n */\nfunction normalizeContext(context) {\n    const { data, paths, local, path, form, submission, row, component, instance, value, options, scope, config, } = context;\n    return {\n        path: paths ? paths.localDataPath : path,\n        data: paths ? getComponentLocalData(paths, data, local) : data,\n        paths,\n        form,\n        scope,\n        submission,\n        row,\n        component,\n        instance,\n        value,\n        input: value,\n        config,\n        options,\n    };\n}\nexports.normalizeContext = normalizeContext;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/formUtil/index.js?");
+eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.eachComponentDataAsync = exports.eachComponentAsync = exports.eachComponentData = exports.eachComponent = exports.normalizeContext = exports.getComponentErrorField = exports.compareSelectResourceWithObjectTypeValues = exports.isSelectResourceWithObjectValue = exports.getItemTemplateKeys = exports.isComponentDataEmpty = exports.getEmptyValue = exports.findComponent = exports.applyFormChanges = exports.generateFormChange = exports.getStrings = exports.getValue = exports.escapeRegExCharacters = exports.formatAsCurrency = exports.parseFloatExt = exports.hasCondition = exports.removeComponent = exports.findComponents = exports.searchComponents = exports.getComponent = exports.matchComponent = exports.isLayoutComponent = exports.getComponentValue = exports.getComponentData = exports.componentInfo = exports.shouldProcessComponent = exports.getComponentLocalData = exports.getContextualRowData = exports.getComponentKey = exports.getComponentFromPath = exports.getBestMatch = exports.componentMatches = exports.getStringFromComponentPath = exports.getComponentPaths = exports.componentPath = exports.resetComponentScope = exports.setComponentScope = exports.isComponentNestedDataType = exports.getModelType = exports.MODEL_TYPES_OF_KNOWN_COMPONENTS = exports.uniqueName = exports.guid = exports.flattenComponents = void 0;\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst fast_json_patch_1 = __webpack_require__(/*! fast-json-patch */ \"./node_modules/fast-json-patch/index.mjs\");\nconst types_1 = __webpack_require__(/*! ../../types */ \"./node_modules/@formio/core/lib/types/index.js\");\nconst Evaluator_1 = __webpack_require__(/*! ../Evaluator */ \"./node_modules/@formio/core/lib/utils/Evaluator.js\");\nconst eachComponent_1 = __webpack_require__(/*! ./eachComponent */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponent.js\");\nObject.defineProperty(exports, \"eachComponent\", ({ enumerable: true, get: function () { return eachComponent_1.eachComponent; } }));\nconst eachComponentData_1 = __webpack_require__(/*! ./eachComponentData */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponentData.js\");\nObject.defineProperty(exports, \"eachComponentData\", ({ enumerable: true, get: function () { return eachComponentData_1.eachComponentData; } }));\nconst eachComponentAsync_1 = __webpack_require__(/*! ./eachComponentAsync */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponentAsync.js\");\nObject.defineProperty(exports, \"eachComponentAsync\", ({ enumerable: true, get: function () { return eachComponentAsync_1.eachComponentAsync; } }));\nconst eachComponentDataAsync_1 = __webpack_require__(/*! ./eachComponentDataAsync */ \"./node_modules/@formio/core/lib/utils/formUtil/eachComponentDataAsync.js\");\nObject.defineProperty(exports, \"eachComponentDataAsync\", ({ enumerable: true, get: function () { return eachComponentDataAsync_1.eachComponentDataAsync; } }));\n/**\n * Flatten the form components for data manipulation.\n *\n * @param {Object} components\n *   The components to iterate.\n * @param {Boolean} includeAll\n *   Whether or not to include layout components.\n *\n * @returns {Object}\n *   The flattened components map.\n */\nfunction flattenComponents(components, includeAll = false) {\n    const flattened = {};\n    (0, eachComponent_1.eachComponent)(components, (component, path) => {\n        flattened[path] = component;\n    }, includeAll);\n    return flattened;\n}\nexports.flattenComponents = flattenComponents;\nfunction guid() {\n    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {\n        const r = (Math.random() * 16) | 0;\n        const v = c === 'x' ? r : (r & 0x3) | 0x8;\n        return v.toString(16);\n    });\n}\nexports.guid = guid;\n/**\n * Make a filename guaranteed to be unique.\n * @param name\n * @param template\n * @param evalContext\n * @returns {string}\n */\nfunction uniqueName(name, template, evalContext) {\n    template = template || '{{fileName}}-{{guid}}';\n    //include guid in template anyway, to prevent overwriting issue if filename matches existing file\n    if (!template.includes('{{guid}}')) {\n        template = `${template}-{{guid}}`;\n    }\n    const parts = name.split('.');\n    let fileName = parts.slice(0, parts.length - 1).join('.');\n    const extension = parts.length > 1 ? `.${(0, lodash_1.last)(parts)}` : '';\n    //allow only 100 characters from original name to avoid issues with filename length restrictions\n    fileName = fileName.substr(0, 100);\n    evalContext = Object.assign(evalContext || {}, {\n        fileName,\n        guid: guid(),\n    });\n    //only letters, numbers, dots, dashes, underscores and spaces are allowed. Anything else will be replaced with dash\n    const uniqueName = `${Evaluator_1.Evaluator.interpolate(template, evalContext)}${extension}`.replace(/[^0-9a-zA-Z.\\-_ ]/g, '-');\n    return uniqueName;\n}\nexports.uniqueName = uniqueName;\n/**\n * Defines model types for known components.\n * For now, these will be the only model types supported by the @formio/core library.\n *\n * nestedArray: for components that store their data as an array and have nested components.\n * nestedDataArray: for components that store their data as an array and have nested components, but keeps the value of nested components inside 'data' property.\n * array: for components that store their data as an array.\n * dataObject: for components that store their data in a nested { data: {} } object.\n * object: for components that store their data in an object.\n * map: for components that store their data in a map.\n * content: for components that do not store data.\n * string: for components that store their data as a string.\n * number: for components that store their data as a number.\n * boolean: for components that store their data as a boolean.\n * none: for components that do not store data and should not be included in the submission.\n * any: for components that can store any type of data.\n *\n */\nexports.MODEL_TYPES_OF_KNOWN_COMPONENTS = {\n    nestedArray: ['datagrid', 'editgrid', 'datatable', 'dynamicWizard'],\n    nestedDataArray: ['tagpad'],\n    dataObject: ['form'],\n    object: ['container', 'address'],\n    map: ['datamap'],\n    content: ['htmlelement', 'content'],\n    string: [\n        'textfield',\n        'password',\n        'email',\n        'url',\n        'phoneNumber',\n        'day',\n        'datetime',\n        'time',\n        'signature',\n    ],\n    number: ['number', 'currency'],\n    boolean: ['checkbox', 'radio'],\n    none: ['table', 'well', 'columns', 'fieldset', 'panel', 'tabs'],\n    any: [\n        'survey',\n        'captcha',\n        'textarea',\n        'selectboxes',\n        'tags',\n        'select',\n        'hidden',\n        'button',\n        'datasource',\n        'sketchpad',\n        'reviewpage',\n        'file',\n    ],\n};\nfunction getModelType(component) {\n    // If the component JSON asserts a model type, use that.\n    if (component.modelType) {\n        return component.modelType;\n    }\n    let modelType = 'any';\n    // Otherwise, check for known component types.\n    for (const type of Object.keys(exports.MODEL_TYPES_OF_KNOWN_COMPONENTS)) {\n        if (exports.MODEL_TYPES_OF_KNOWN_COMPONENTS[type].includes(component.type)) {\n            modelType = type;\n            break;\n        }\n    }\n    // Otherwise check for components that assert no value.\n    if (modelType === 'any' &&\n        (component.input === false ||\n            (component.components && !component.input))) {\n        modelType = 'none';\n    }\n    // To speed up performance of getModelType, we will set the modelType on the component\n    Object.defineProperty(component, 'modelType', {\n        enumerable: false,\n        writable: true,\n        value: modelType,\n    });\n    // Otherwise default to any.\n    return modelType;\n}\nexports.getModelType = getModelType;\nfunction isComponentNestedDataType(component) {\n    return (component.tree ||\n        getModelType(component) === 'nestedArray' ||\n        getModelType(component) === 'nestedDataArray' ||\n        getModelType(component) === 'dataObject' ||\n        getModelType(component) === 'object' ||\n        getModelType(component) === 'map');\n}\nexports.isComponentNestedDataType = isComponentNestedDataType;\nfunction setComponentScope(component, name, value) {\n    if (!component) {\n        return;\n    }\n    if (!component.scope) {\n        Object.defineProperty(component, 'scope', {\n            enumerable: false,\n            configurable: true,\n            writable: true,\n            value: {},\n        });\n    }\n    Object.defineProperty(component.scope, name, {\n        enumerable: false,\n        writable: false,\n        configurable: true,\n        value,\n    });\n}\nexports.setComponentScope = setComponentScope;\nfunction resetComponentScope(component) {\n    if (component.scope) {\n        delete component.scope;\n    }\n}\nexports.resetComponentScope = resetComponentScope;\n/**\n * Return the component path provided the type of the component path.\n * @param component - The component JSON.\n * @param type - The type of path to return.\n * @returns\n */\nfunction componentPath(component, parent, parentPaths, type) {\n    if (!component) {\n        return '';\n    }\n    if (component.component) {\n        component = component.component;\n    }\n    const compModel = getModelType(component);\n    // Relative paths are only referenced from the current form.\n    const relative = type === types_1.ComponentPath.localPath ||\n        type === types_1.ComponentPath.fullLocalPath ||\n        type === types_1.ComponentPath.localDataPath ||\n        type === types_1.ComponentPath.localContextualRowPath;\n    // Full paths include all layout component ids in the path.\n    const fullPath = type === types_1.ComponentPath.fullPath || type === types_1.ComponentPath.fullLocalPath;\n    // See if this is a data path.\n    const dataPath = type === types_1.ComponentPath.dataPath ||\n        type === types_1.ComponentPath.localDataPath ||\n        type === types_1.ComponentPath.contextualRowPath ||\n        type === types_1.ComponentPath.localContextualRowPath;\n    // Determine if this component should include its key.\n    const includeKey = fullPath || (!!component.type && compModel !== 'none' && compModel !== 'content');\n    // The key is provided if the component can have data or if we are fetching the full path.\n    const key = includeKey ? getComponentKey(component) : '';\n    // If this is a contextual row path.\n    const contextual = type === types_1.ComponentPath.contextualRowPath || type === types_1.ComponentPath.localContextualRowPath;\n    if (!parent) {\n        // Return the key if there is no parent.\n        return contextual ? '' : key;\n    }\n    // Get the parent model type.\n    const parentModel = getModelType(parent);\n    // If there is a parent, then we only return the key if the parent is a nested form and it is a relative path.\n    if (relative && parentModel === 'dataObject') {\n        return contextual ? '' : key;\n    }\n    // Return the parent path.\n    const parentType = contextual\n        ? relative\n            ? types_1.ComponentPath.localDataPath\n            : types_1.ComponentPath.dataPath\n        : type;\n    let parentPath = (parentPaths === null || parentPaths === void 0 ? void 0 : parentPaths.hasOwnProperty(parentType)) ? parentPaths[parentType] || '' : '';\n    // For data paths (where we wish to get the path to the data), we need to ensure we append the parent\n    // paths to the end of the path so that any component within this component properly references their data.\n    if (dataPath && parentPath) {\n        if (parentModel === 'nestedArray' || parentModel === 'nestedDataArray') {\n            parentPath += `[${(parentPaths === null || parentPaths === void 0 ? void 0 : parentPaths.dataIndex) || 0}]`;\n        }\n        if (parentModel === 'dataObject' || parentModel === 'nestedDataArray') {\n            parentPath += '.data';\n        }\n    }\n    // If this is a contextual row path, then return here.\n    if (contextual) {\n        return parentPath;\n    }\n    // Return the parent path with its relative component path (if applicable).\n    return parentPath ? (key ? `${parentPath}.${key}` : parentPath) : key;\n}\nexports.componentPath = componentPath;\n/**\n * This method determines a components paths provided the component JSON, the parent and the parent paths.\n * @param component\n * @param parent\n * @param parentPaths\n * @returns\n */\nfunction getComponentPaths(component, parent, parentPaths) {\n    return {\n        path: componentPath(component, parent, parentPaths, types_1.ComponentPath.path),\n        fullPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.fullPath),\n        localPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.localPath),\n        fullLocalPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.fullLocalPath),\n        dataPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.dataPath),\n        localDataPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.localDataPath),\n        dataIndex: parentPaths === null || parentPaths === void 0 ? void 0 : parentPaths.dataIndex,\n        contextualRowPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.contextualRowPath),\n        localContextualRowPath: componentPath(component, parent, parentPaths, types_1.ComponentPath.localContextualRowPath),\n    };\n}\nexports.getComponentPaths = getComponentPaths;\nfunction getStringFromComponentPath(path) {\n    if (!(0, lodash_1.isArray)(path)) {\n        return path;\n    }\n    let strPath = '';\n    path.forEach((part, i) => {\n        if ((0, lodash_1.isNumber)(part)) {\n            strPath += `[${part}]`;\n        }\n        else {\n            strPath += i === 0 ? part : `.${part}`;\n        }\n    });\n    return strPath;\n}\nexports.getStringFromComponentPath = getStringFromComponentPath;\n/**\n * Determines if a component has a match at any of the path types.\n * @param component {Component} - The component JSON to check for matches.\n * @param paths {ComponentPaths} - The current component paths object.\n * @param path {string} - Either the \"form\" or \"data\" path to see if a match occurs.\n * @param dataIndex {number | undefined} - The data index for the current component to match.\n * @param matches {Record<string, ComponentMatch | undefined>} - The current matches object.\n * @param addMatch {(type: ComponentPath | 'key', match: ComponentMatch) => ComponentMatch} - A callback function to allow modules to decorate the match object.\n */\nfunction componentMatches(component, paths, path, dataIndex, matches = {\n    path: undefined,\n    fullPath: undefined,\n    localPath: undefined,\n    dataPath: undefined,\n    localDataPath: undefined,\n    fullLocalPath: undefined,\n    key: undefined,\n}, addMatch = (type, match) => {\n    return match;\n}) {\n    let dataProperty = '';\n    if (component.type === 'selectboxes') {\n        const valuePath = new RegExp(`(\\\\.${(0, lodash_1.escapeRegExp)(component.key)})(\\\\.[^\\\\.]+)$`);\n        const pathMatches = path.match(valuePath);\n        if ((pathMatches === null || pathMatches === void 0 ? void 0 : pathMatches.length) === 3) {\n            dataProperty = pathMatches[2];\n            path = path.replace(valuePath, '$1');\n        }\n    }\n    // Get the current model type.\n    const modelType = getModelType(component);\n    const dataModel = modelType !== 'none' && modelType !== 'content';\n    [\n        types_1.ComponentPath.path,\n        types_1.ComponentPath.fullPath,\n        types_1.ComponentPath.localPath,\n        types_1.ComponentPath.fullLocalPath,\n        types_1.ComponentPath.dataPath,\n        types_1.ComponentPath.localDataPath,\n    ].forEach((type) => {\n        const dataPath = type === types_1.ComponentPath.dataPath || type === types_1.ComponentPath.localDataPath;\n        if (paths[type] === path) {\n            const currentMatch = matches[type];\n            const currentModelType = (currentMatch === null || currentMatch === void 0 ? void 0 : currentMatch.component)\n                ? getModelType(currentMatch.component)\n                : 'none';\n            const currentDataModel = currentModelType !== 'none' && currentModelType !== 'content';\n            if (!currentMatch ||\n                (dataPath && dataModel && currentDataModel) || // Replace the current match if this is a dataPath and both are dataModels.\n                (!dataPath && !(0, lodash_1.isNil)(paths.dataIndex) && dataIndex === paths.dataIndex) // Replace the current match if this is not a dataPath and the indexes are the same.\n            ) {\n                if (dataPath) {\n                    const dataPaths = {\n                        dataPath: paths.dataPath || '',\n                        localDataPath: paths.localDataPath || '',\n                    };\n                    if (dataProperty) {\n                        dataPaths.dataPath += dataProperty;\n                        dataPaths.localDataPath += dataProperty;\n                    }\n                    matches[type] = addMatch(type, {\n                        component,\n                        paths: Object.assign(Object.assign({}, paths), dataPaths),\n                    });\n                }\n                else {\n                    matches[type] = addMatch(type, { component, paths });\n                }\n            }\n        }\n    });\n    if (!matches.key && component.key === path) {\n        matches.key = addMatch('key', { component, paths });\n    }\n}\nexports.componentMatches = componentMatches;\nfunction getBestMatch(matches) {\n    if (matches.dataPath) {\n        return matches.dataPath;\n    }\n    if (matches.localDataPath) {\n        return matches.localDataPath;\n    }\n    if (matches.fullPath) {\n        return matches.fullPath;\n    }\n    if (matches.path) {\n        return matches.path;\n    }\n    if (matches.fullLocalPath) {\n        return matches.fullLocalPath;\n    }\n    if (matches.localPath) {\n        return matches.localPath;\n    }\n    if (matches.key) {\n        return matches.key;\n    }\n    return undefined;\n}\nexports.getBestMatch = getBestMatch;\n/**\n * This method performs a fuzzy search for a component within a form provided a number of different\n * paths to search.\n */\nfunction getComponentFromPath(components, path, data, dataIndex, includeAll = false) {\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    if (data) {\n        (0, eachComponentData_1.eachComponentData)(components, data, (component, data, row, compPath, comps, index, parent, paths) => {\n            componentMatches(component, paths || {}, path, dataIndex, matches);\n        }, includeAll, false, undefined, undefined, true);\n    }\n    else {\n        (0, eachComponent_1.eachComponent)(components, (component, compPath, componentComponents, compParent, paths) => {\n            componentMatches(component, paths || {}, path, dataIndex, matches);\n        }, includeAll);\n    }\n    return getBestMatch(matches);\n}\nexports.getComponentFromPath = getComponentFromPath;\n/**\n * Provided a component, this will return the \"data\" key for that component in the contextual data\n * object.\n *\n * @param component\n * @returns\n */\nfunction getComponentKey(component) {\n    if (!component) {\n        return '';\n    }\n    if (component.type === 'checkbox' &&\n        component.inputType === 'radio' &&\n        component.name) {\n        return component.name;\n    }\n    return component.key;\n}\nexports.getComponentKey = getComponentKey;\nfunction getContextualRowData(component, data, paths, local) {\n    if ((paths === null || paths === void 0 ? void 0 : paths.hasOwnProperty('localContextualRowPath')) &&\n        (paths === null || paths === void 0 ? void 0 : paths.hasOwnProperty('contextualRowPath'))) {\n        const rowPath = local ? paths === null || paths === void 0 ? void 0 : paths.localContextualRowPath : paths === null || paths === void 0 ? void 0 : paths.contextualRowPath;\n        return rowPath ? (0, lodash_1.get)(data, rowPath, null) : data;\n    }\n    // Fallback to the less performant regex method.\n    const dataPath = local ? paths === null || paths === void 0 ? void 0 : paths.localDataPath : paths === null || paths === void 0 ? void 0 : paths.dataPath;\n    const rowPath = (dataPath === null || dataPath === void 0 ? void 0 : dataPath.replace(new RegExp(`.?${(0, lodash_1.escapeRegExp)(getComponentKey(component))}$`), '')) || '';\n    return rowPath ? (0, lodash_1.get)(data, rowPath, null) : data;\n}\nexports.getContextualRowData = getContextualRowData;\nfunction getComponentLocalData(paths, data, local) {\n    var _a;\n    if (local) {\n        return data;\n    }\n    const parentPath = ((_a = paths.dataPath) === null || _a === void 0 ? void 0 : _a.replace(new RegExp(`.?${(0, lodash_1.escapeRegExp)(paths.localDataPath)}$`), '')) || '';\n    return parentPath ? (0, lodash_1.get)(data, parentPath, null) : data;\n}\nexports.getComponentLocalData = getComponentLocalData;\nfunction shouldProcessComponent(comp, value, paths) {\n    var _a;\n    if (getModelType(comp) === 'dataObject') {\n        const noReferenceAttached = (value === null || value === void 0 ? void 0 : value._id) ? (0, lodash_1.isEmpty)(value.data) && !(0, lodash_1.has)(value, 'form') : false;\n        const shouldBeCleared = (!comp.hasOwnProperty('clearOnHide') || comp.clearOnHide) &&\n            (comp.hidden || ((_a = comp.scope) === null || _a === void 0 ? void 0 : _a.conditionallyHidden));\n        // Also skip processing if the value is empty and the form is in an array component.\n        const emptyInDataGrid = !value && (paths === null || paths === void 0 ? void 0 : paths.dataIndex) !== undefined;\n        const shouldSkipProcessingNestedFormData = noReferenceAttached || (shouldBeCleared && !comp.validateWhenHidden) || emptyInDataGrid;\n        if (shouldSkipProcessingNestedFormData) {\n            return false;\n        }\n    }\n    return true;\n}\nexports.shouldProcessComponent = shouldProcessComponent;\nfunction componentInfo(component) {\n    const hasColumns = component.columns && Array.isArray(component.columns);\n    const hasRows = component.rows && Array.isArray(component.rows);\n    const hasComps = component.components && Array.isArray(component.components);\n    const isContent = getModelType(component) === 'content';\n    const isLayout = getModelType(component) === 'none';\n    const isInput = (!component.hasOwnProperty('input') && !component.components) || !!component.input;\n    return {\n        hasColumns,\n        hasRows,\n        hasComps,\n        layout: hasColumns || hasRows || (hasComps && !isInput) || isLayout || isContent,\n        iterable: hasColumns || hasRows || hasComps || isContent,\n    };\n}\nexports.componentInfo = componentInfo;\n// Provided components, data, and a key, this will return the components data.\nfunction getComponentData(components, data, path) {\n    const compData = { component: null, data: null };\n    (0, eachComponentData_1.eachComponentData)(components, data, (component, data, row, compPath) => {\n        if (compPath === path) {\n            compData.component = component;\n            compData.data = row;\n            return true;\n        }\n    });\n    return compData;\n}\nexports.getComponentData = getComponentData;\nfunction getComponentValue(form, data, path, dataIndex, local) {\n    var _a, _b;\n    const match = getComponentFromPath((form === null || form === void 0 ? void 0 : form.components) || [], path, data, dataIndex);\n    if (!match) {\n        // Fall back to get the value from the data object.\n        return (0, lodash_1.get)(data, path, undefined);\n    }\n    if (local) {\n        return ((_a = match === null || match === void 0 ? void 0 : match.paths) === null || _a === void 0 ? void 0 : _a.localDataPath) ? (0, lodash_1.get)(data, match.paths.localDataPath, undefined) : null;\n    }\n    return ((_b = match === null || match === void 0 ? void 0 : match.paths) === null || _b === void 0 ? void 0 : _b.dataPath) ? (0, lodash_1.get)(data, match.paths.dataPath, undefined) : null;\n}\nexports.getComponentValue = getComponentValue;\n/**\n * Determine if a component is a layout component or not.\n *\n * @param {Object} component\n *   The component to check.\n *\n * @returns {Boolean}\n *   Whether or not the component is a layout component.\n */\nfunction isLayoutComponent(component) {\n    return Boolean((component.columns &&\n        Array.isArray(component.columns)) ||\n        (component.rows && Array.isArray(component.rows)) ||\n        (component.components &&\n            Array.isArray(component.components)));\n}\nexports.isLayoutComponent = isLayoutComponent;\n/**\n * Matches if a component matches the query.\n *\n * @param component\n * @param query\n * @return {boolean}\n */\nfunction matchComponent(component, query, paths) {\n    if ((0, lodash_1.isString)(query)) {\n        return component.key === query || (paths === null || paths === void 0 ? void 0 : paths.localPath) === query || (paths === null || paths === void 0 ? void 0 : paths.path) === query;\n    }\n    else {\n        let matches = false;\n        (0, lodash_1.forOwn)(query, (value, key) => {\n            matches = (0, lodash_1.get)(component, key) === value;\n            if (!matches) {\n                return false;\n            }\n        });\n        return matches;\n    }\n}\nexports.matchComponent = matchComponent;\n/**\n * Get a component by its path.\n *\n * @param {Object} components - The components to iterate.\n * @param {String|Object} path - The key of the component to get, or a query of the component to search.\n * @param {boolean} includeAll - Whether or not to include layout components.\n * @returns {Component} - The component that matches the given key, or undefined if not found.\n */\nfunction getComponent(components, path, includeAll = true, dataIndex) {\n    var _a;\n    return (_a = getComponentFromPath(components, path, undefined, dataIndex, includeAll)) === null || _a === void 0 ? void 0 : _a.component;\n}\nexports.getComponent = getComponent;\n/**\n * Finds a component provided a query of properties of that component.\n *\n * @param components\n * @param query\n * @return {*}\n */\nfunction searchComponents(components, query) {\n    const results = [];\n    (0, eachComponent_1.eachComponent)(components, (component, compPath, components, parent, compPaths) => {\n        if (matchComponent(component, query, compPaths)) {\n            results.push(component);\n        }\n    }, true);\n    return results;\n}\nexports.searchComponents = searchComponents;\n/**\n * Deprecated version of findComponents. Renamed to searchComponents.\n * @param {import('@formio/core').Component[]} components - The components to find components within.\n * @param {object} query - The query to use when searching for the components.\n * @returns {import('@formio/core').Component[]} - The result of the component that is found.\n */\nfunction findComponents(components, query) {\n    console.warn('formio.js/utils findComponents is deprecated. Use searchComponents instead.');\n    return searchComponents(components, query);\n}\nexports.findComponents = findComponents;\n/**\n * Remove a component by path.\n *\n * @param components\n * @param path\n */\nfunction removeComponent(components, path) {\n    // @ts-expect-error - I'm not sure why we're using `pop` here if it's a string\n    const index = path.pop();\n    if (path.length !== 0) {\n        components = (0, lodash_1.get)(components, path);\n    }\n    components.splice(index, 1);\n}\nexports.removeComponent = removeComponent;\n/**\n * Returns if this component has a conditional statement.\n *\n * @param component - The component JSON schema.\n *\n * @returns {boolean} - TRUE - This component has a conditional, FALSE - No conditional provided.\n */\nfunction hasCondition(component) {\n    return Boolean(component.customConditional ||\n        (component.conditional &&\n            (component.conditional.when ||\n                component.conditional.json ||\n                (component.conditional.conjunction &&\n                    ((0, lodash_1.isBoolean)(component.conditional.show) ||\n                        component.conditional.show) &&\n                    !(0, lodash_1.isEmpty)(component.conditional.conditions)))));\n}\nexports.hasCondition = hasCondition;\n/**\n * Extension of standard #parseFloat(value) function, that also clears input string.\n *\n * @param {any} value\n *   The value to parse.\n *\n * @returns {Number}\n *   Parsed value.\n */\nfunction parseFloatExt(value) {\n    return parseFloat((0, lodash_1.isString)(value) ? value.replace(/[^\\de.+-]/gi, '') : value);\n}\nexports.parseFloatExt = parseFloatExt;\n/**\n * Formats provided value in way how Currency component uses it.\n *\n * @param {any} value\n *   The value to format.\n *\n * @returns {String}\n *   Value formatted for Currency component.\n */\nfunction formatAsCurrency(value) {\n    const parsedValue = parseFloatExt(value);\n    if (isNaN(parsedValue)) {\n        return '';\n    }\n    const parts = (0, lodash_1.round)(parsedValue, 2).toString().split('.');\n    parts[0] = (0, lodash_1.chunk)(Array.from(parts[0]).reverse(), 3)\n        .reverse()\n        .map((part) => part.reverse().join(''))\n        .join(',');\n    parts[1] = (0, lodash_1.pad)(parts[1], 2, '0');\n    return parts.join('.');\n}\nexports.formatAsCurrency = formatAsCurrency;\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 * Get the value for a component key, in the given submission.\n *\n * @param {Object} submission\n *   A submission object to search.\n * @param {String} key\n *   A for components API key to search for.\n */\nfunction getValue(submission, key) {\n    const search = (data) => {\n        if ((0, lodash_1.isPlainObject)(data)) {\n            if ((0, lodash_1.has)(data, key)) {\n                return (0, lodash_1.get)(data, key);\n            }\n            let value = null;\n            (0, lodash_1.forOwn)(data, (prop) => {\n                const result = search(prop);\n                if (!(0, lodash_1.isNil)(result)) {\n                    value = result;\n                    return false;\n                }\n            });\n            return value;\n        }\n        else {\n            return null;\n        }\n    };\n    return search(submission.data);\n}\nexports.getValue = getValue;\n/**\n * Iterate over all components in a form and get string values for translation.\n * @param form\n */\nfunction getStrings(form) {\n    const properties = [\n        'label',\n        'title',\n        'legend',\n        'tooltip',\n        'description',\n        'placeholder',\n        'prefix',\n        'suffix',\n        'errorLabel',\n        'content',\n        'html',\n    ];\n    const strings = [];\n    (0, eachComponent_1.eachComponent)(form.components, (component) => {\n        properties.forEach((property) => {\n            if (component.hasOwnProperty(property) && component[property]) {\n                strings.push({\n                    key: component.key,\n                    type: component.type,\n                    property,\n                    string: component[property],\n                });\n            }\n        });\n        if ((!component.dataSrc || component.dataSrc === 'values') &&\n            component.hasOwnProperty('values') &&\n            Array.isArray(component.values) &&\n            component.values.length) {\n            component.values.forEach((value, index) => {\n                strings.push({\n                    key: component.key,\n                    property: `value[${index}].label`,\n                    string: component.values[index].label,\n                });\n            });\n        }\n        // Hard coded values from Day component\n        if (component.type === 'day') {\n            [\n                'day',\n                'month',\n                'year',\n                'Day',\n                'Month',\n                'Year',\n                'january',\n                'february',\n                'march',\n                'april',\n                'may',\n                'june',\n                'july',\n                'august',\n                'september',\n                'october',\n                'november',\n                'december',\n            ].forEach((string) => {\n                strings.push({\n                    key: component.key,\n                    property: 'day',\n                    string,\n                });\n            });\n            if (component.fields.day.placeholder) {\n                strings.push({\n                    key: component.key,\n                    property: 'fields.day.placeholder',\n                    string: component.fields.day.placeholder,\n                });\n            }\n            if (component.fields.month.placeholder) {\n                strings.push({\n                    key: component.key,\n                    property: 'fields.month.placeholder',\n                    string: component.fields.month.placeholder,\n                });\n            }\n            if (component.fields.year.placeholder) {\n                strings.push({\n                    key: component.key,\n                    property: 'fields.year.placeholder',\n                    string: component.fields.year.placeholder,\n                });\n            }\n        }\n        if (component.type === 'editgrid') {\n            const string = component.addAnother || 'Add Another';\n            if (component.addAnother) {\n                strings.push({\n                    key: component.key,\n                    property: 'addAnother',\n                    string,\n                });\n            }\n        }\n        if (component.type === 'select') {\n            ['loading...', 'Type to search'].forEach((string) => {\n                strings.push({\n                    key: component.key,\n                    property: 'select',\n                    string,\n                });\n            });\n        }\n    }, true);\n    return strings;\n}\nexports.getStrings = getStrings;\n// ?????????????????????????\n// questionable section\nfunction generateFormChange(type, data) {\n    let change;\n    switch (type) {\n        case 'add':\n            change = {\n                op: 'add',\n                key: data.component.key,\n                container: data.parent.key, // Parent component\n                path: data.path, // Path to container within parent component.\n                index: data.index, // Index of component in parent container.\n                component: data.component,\n            };\n            break;\n        case 'edit':\n            change = {\n                op: 'edit',\n                key: data.originalComponent.key,\n                patches: (0, fast_json_patch_1.compare)(data.originalComponent, data.component),\n            };\n            // Don't save if nothing changed.\n            if (!change.patches.length) {\n                change = null;\n            }\n            break;\n        case 'remove':\n            change = {\n                op: 'remove',\n                key: data.component.key,\n            };\n            break;\n    }\n    return change;\n}\nexports.generateFormChange = generateFormChange;\nfunction applyFormChanges(form, changes) {\n    const failed = [];\n    changes.forEach(function (change) {\n        let found = false;\n        switch (change.op) {\n            case 'add': {\n                let newComponent = change.component;\n                // Find the container to set the component in.\n                findComponent(form.components, change.container, null, function (parent) {\n                    if (!change.container) {\n                        parent = form;\n                    }\n                    // A move will first run an add so remove any existing components with matching key before inserting.\n                    findComponent(form.components, change.key, null, function (component, path) {\n                        // If found, use the existing component. (If someone else edited it, the changes would be here)\n                        newComponent = component;\n                        removeComponent(form.components, path);\n                    });\n                    found = true;\n                    const container = (0, lodash_1.get)(parent, change.path);\n                    container.splice(change.index, 0, newComponent);\n                });\n                break;\n            }\n            case 'remove':\n                findComponent(form.components, change.key, null, function (component, path) {\n                    found = true;\n                    const oldComponent = (0, lodash_1.get)(form.components, path);\n                    if (oldComponent.key !== component.key) {\n                        path.pop();\n                    }\n                    removeComponent(form.components, path);\n                });\n                break;\n            case 'edit':\n                findComponent(form.components, change.key, null, function (component, path) {\n                    found = true;\n                    try {\n                        const oldComponent = (0, lodash_1.get)(form.components, path);\n                        const newComponent = (0, fast_json_patch_1.applyPatch)(component, change.patches).newDocument;\n                        if (oldComponent.key !== newComponent.key) {\n                            path.pop();\n                        }\n                        (0, lodash_1.set)(form.components, path, newComponent);\n                    }\n                    catch (ignoreErr) {\n                        failed.push(change);\n                    }\n                });\n                break;\n            case 'move':\n                break;\n        }\n        if (!found) {\n            failed.push(change);\n        }\n    });\n    return {\n        form,\n        failed,\n    };\n}\nexports.applyFormChanges = applyFormChanges;\n/**\n * This function will find a component in a form and return the component AND THE PATH to the component in the form.\n * Path to the component is stored as an array of nested components and their indexes.The Path is being filled recursively\n * when you iterating through the nested structure.\n * If the component is not found the callback won't be called and function won't return anything.\n *\n * @param components\n * @param key\n * @param fn\n * @param path\n * @returns {*}\n */\nfunction findComponent(components, key, path, fn) {\n    if (!components)\n        return;\n    path = path || [];\n    if (!key) {\n        return fn(components);\n    }\n    components.forEach(function (component, index) {\n        const newPath = path.slice();\n        // Add an index of the component it iterates through in nested structure\n        newPath.push(index);\n        if (!component)\n            return;\n        if (component.hasOwnProperty('columns') && Array.isArray(component.columns)) {\n            newPath.push('columns');\n            component.columns.forEach(function (column, index) {\n                const colPath = newPath.slice();\n                colPath.push(index);\n                colPath.push('components');\n                findComponent(column.components, key, colPath, fn);\n            });\n        }\n        if (component.hasOwnProperty('rows') && Array.isArray(component.rows)) {\n            newPath.push('rows');\n            component.rows.forEach(function (row, index) {\n                const rowPath = newPath.slice();\n                rowPath.push(index);\n                row.forEach(function (column, index) {\n                    const colPath = rowPath.slice();\n                    colPath.push(index);\n                    colPath.push('components');\n                    findComponent(column.components, key, colPath, fn);\n                });\n            });\n        }\n        if (component.hasOwnProperty('components') && Array.isArray(component.components)) {\n            newPath.push('components');\n            findComponent(component.components, key, newPath, fn);\n        }\n        if (component.key === key) {\n            //Final callback if the component is found\n            fn(component, newPath, components);\n        }\n    });\n}\nexports.findComponent = findComponent;\nconst isCheckboxComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'checkbox';\nconst isDataGridComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'datagrid';\nconst isEditGridComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'editgrid';\nconst isAddressComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'address';\nconst isDataTableComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'datatable';\nconst hasChildComponents = (component) => (component === null || component === void 0 ? void 0 : component.components) != null;\nconst isDateTimeComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'datetime';\nconst isSelectBoxesComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'selectboxes';\nconst isTextAreaComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'textarea';\nconst isTextFieldComponent = (component) => (component === null || component === void 0 ? void 0 : component.type) === 'textfield';\nfunction getEmptyValue(component) {\n    switch (component.type) {\n        case 'textarea':\n        case 'textfield':\n        case 'time':\n        case 'datetime':\n        case 'day':\n            return '';\n        case 'datagrid':\n        case 'editgrid':\n            return [];\n        default:\n            return null;\n    }\n}\nexports.getEmptyValue = getEmptyValue;\nconst replaceBlanks = (value) => {\n    const nbsp = '<p>&nbsp;</p>';\n    const br = '<p><br></p>';\n    const brNbsp = '<p><br>&nbsp;</p>';\n    const regExp = new RegExp(`^${nbsp}|${nbsp}$|^${br}|${br}$|^${brNbsp}|${brNbsp}$`, 'g');\n    return typeof value === 'string' ? value.replace(regExp, '').trim() : value;\n};\nfunction trimBlanks(value) {\n    if (!value) {\n        return value;\n    }\n    if (Array.isArray(value)) {\n        value = value.map((val) => replaceBlanks(val));\n    }\n    else {\n        value = replaceBlanks(value);\n    }\n    return value;\n}\nfunction isValueEmpty(component, value) {\n    const compValueIsEmptyArray = (0, lodash_1.isArray)(value) && value.length === 1 ? (0, lodash_1.isEqual)(value[0], getEmptyValue(component)) : false;\n    return (value == null || value === '' || ((0, lodash_1.isArray)(value) && value.length === 0) || compValueIsEmptyArray);\n}\nfunction isComponentDataEmpty(component, data, path, valueCond) {\n    var _a;\n    const value = (0, lodash_1.isNil)(valueCond) ? (0, lodash_1.get)(data, path) : valueCond;\n    const addressIgnoreProperties = ['mode', 'address'];\n    if (isCheckboxComponent(component)) {\n        return isValueEmpty(component, value) || value === false;\n    }\n    else if (isAddressComponent(component)) {\n        if (Object.keys(value).length === 0) {\n            return true;\n        }\n        return !Object.values((0, lodash_1.omit)(value, addressIgnoreProperties)).some(Boolean);\n    }\n    else if (isDataGridComponent(component) ||\n        isEditGridComponent(component) ||\n        isDataTableComponent(component) ||\n        hasChildComponents(component)) {\n        if ((_a = component.components) === null || _a === void 0 ? void 0 : _a.length) {\n            let childrenEmpty = true;\n            // wrap component in an array to let eachComponentData handle introspection to child components (e.g. this will be different\n            // for data grids versus nested forms, etc.)\n            (0, eachComponentData_1.eachComponentData)([component], data, (thisComponent, data, row, path) => {\n                if (component.key === thisComponent.key)\n                    return;\n                if (!isComponentDataEmpty(thisComponent, data, path)) {\n                    childrenEmpty = false;\n                }\n            });\n            return isValueEmpty(component, value) || childrenEmpty;\n        }\n        return isValueEmpty(component, value);\n    }\n    else if (isDateTimeComponent(component)) {\n        return isValueEmpty(component, value) || value.toString() === 'Invalid date';\n    }\n    else if (isSelectBoxesComponent(component)) {\n        let selectBoxEmpty = true;\n        for (const key in value) {\n            if (value[key]) {\n                selectBoxEmpty = false;\n                break;\n            }\n        }\n        return isValueEmpty(component, value) || selectBoxEmpty;\n    }\n    else if (isTextAreaComponent(component)) {\n        const isPlain = !component.wysiwyg && !component.editor;\n        return isPlain\n            ? typeof value === 'string'\n                ? isValueEmpty(component, value.trim())\n                : isValueEmpty(component, value)\n            : isValueEmpty(component, trimBlanks(value));\n    }\n    else if (isTextFieldComponent(component)) {\n        if (component.allowMultipleMasks && !!component.inputMasks && !!component.inputMasks.length) {\n            return (isValueEmpty(component, value) ||\n                (component.multiple ? value.length === 0 : !value.maskName || !value.value));\n        }\n        return isValueEmpty(component, value === null || value === void 0 ? void 0 : value.toString().trim());\n    }\n    return isValueEmpty(component, value);\n}\nexports.isComponentDataEmpty = isComponentDataEmpty;\n/**\n * Returns the template keys inside the template code.\n * @param {string} template - The template to get the keys from.\n * @returns {Array<string>} - The keys inside the template.\n */\nfunction getItemTemplateKeys(template) {\n    const templateKeys = [];\n    if (!template) {\n        return templateKeys;\n    }\n    const keys = template.match(/({{\\s*(.*?)\\s*}})/g);\n    if (keys) {\n        keys.forEach((key) => {\n            const propKey = key.match(/{{\\s*item\\.(.*?)\\s*}}/);\n            if (propKey && propKey.length > 1) {\n                templateKeys.push(propKey[1]);\n            }\n        });\n    }\n    return templateKeys;\n}\nexports.getItemTemplateKeys = getItemTemplateKeys;\n/**\n * Returns if the component is a select resource with an object for its value.\n * @param {Component} comp - The component to check.\n * @returns {boolean} - TRUE if the component is a select resource with an object for its value; FALSE otherwise.\n */\nfunction isSelectResourceWithObjectValue(comp = {}) {\n    const { reference, dataSrc, valueProperty } = comp;\n    return reference || (dataSrc === 'resource' && (!valueProperty || valueProperty === 'data'));\n}\nexports.isSelectResourceWithObjectValue = isSelectResourceWithObjectValue;\n/**\n * Compares real select resource value with expected value in condition.\n * @param {any} value - current value of selectcomponent.\n * @param {any} comparedValue - expocted value of select component.\n * @param {SelectComponent} conditionComponent - select component on which the condtion is based.\n * @returns {boolean} - TRUE if the select component current value is equal to the expected value; FALSE otherwise.\n */\nfunction compareSelectResourceWithObjectTypeValues(value, comparedValue, conditionComponent) {\n    if (!value || !(0, lodash_1.isPlainObject)(value)) {\n        return false;\n    }\n    const { template, valueProperty } = conditionComponent;\n    if (valueProperty === 'data') {\n        value = { data: value };\n        comparedValue = { data: comparedValue };\n    }\n    return (0, lodash_1.every)(getItemTemplateKeys(template) || [], (k) => (0, lodash_1.isEqual)((0, lodash_1.get)(value, k), (0, lodash_1.get)(comparedValue, k)));\n}\nexports.compareSelectResourceWithObjectTypeValues = compareSelectResourceWithObjectTypeValues;\nfunction getComponentErrorField(component, context) {\n    const toInterpolate = component.errorLabel || component.label || component.placeholder || component.key;\n    return Evaluator_1.Evaluator.interpolate(toInterpolate, context);\n}\nexports.getComponentErrorField = getComponentErrorField;\n/**\n * Normalize a context object so that it contains the correct paths and data, and so it can pass into and out of a sandbox for evaluation\n * @param context\n * @returns\n */\nfunction normalizeContext(context) {\n    const { data, paths, local, path, form, submission, row, component, instance, value, options, scope, config, } = context;\n    return {\n        path: paths ? paths.localDataPath : path,\n        data: paths ? getComponentLocalData(paths, data, local) : data,\n        paths,\n        form,\n        scope,\n        submission,\n        row,\n        component,\n        instance,\n        value,\n        input: value,\n        config,\n        options,\n    };\n}\nexports.normalizeContext = normalizeContext;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/formUtil/index.js?");
 
 /***/ }),
 
@@ -1697,7 +1686,7 @@ eval("\n// copied from https://github.com/auth0/jwt-decode\nObject.definePropert
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.applyActions = exports.setCustomAction = exports.setMergeComponentSchema = exports.setValueProperty = exports.setActionProperty = exports.setActionStringProperty = exports.setActionBooleanProperty = exports.checkTrigger = exports.hasLogic = void 0;\nconst conditions_1 = __webpack_require__(/*! ./conditions */ \"./node_modules/@formio/core/lib/utils/conditions.js\");\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst utils_1 = __webpack_require__(/*! ./utils */ \"./node_modules/@formio/core/lib/utils/utils.js\");\nconst formUtil_1 = __webpack_require__(/*! ./formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst hasLogic = (context) => {\n    const { component } = context;\n    const { logic } = component;\n    if (!logic || !logic.length) {\n        return false;\n    }\n    return true;\n};\nexports.hasLogic = hasLogic;\nconst checkTrigger = (context, trigger) => {\n    let shouldTrigger = false;\n    switch (trigger.type) {\n        case 'simple':\n            if ((0, conditions_1.isLegacyConditional)(trigger.simple)) {\n                shouldTrigger = (0, conditions_1.checkLegacyConditional)(trigger.simple, context);\n            }\n            else {\n                shouldTrigger = (0, conditions_1.checkSimpleConditional)(trigger.simple, context);\n            }\n            break;\n        case 'javascript':\n            shouldTrigger = (0, conditions_1.checkCustomConditional)(trigger.javascript, context, 'result');\n            break;\n        case 'json':\n            shouldTrigger = (0, conditions_1.checkJsonConditional)(trigger, context);\n            break;\n        default:\n            shouldTrigger = false;\n            break;\n    }\n    if (shouldTrigger === null) {\n        return false;\n    }\n    return shouldTrigger;\n};\nexports.checkTrigger = checkTrigger;\nfunction setActionBooleanProperty(context, action) {\n    var _a, _b;\n    const { component, scope, path } = context;\n    const property = action.property.value;\n    const currentValue = (0, lodash_1.get)(component, property, false).toString();\n    const newValue = action.state.toString();\n    if (currentValue !== newValue) {\n        (0, lodash_1.set)(component, property, newValue === 'true');\n        // If this is \"logic\" forcing a component to set hidden property, then we will set the \"conditionallyHidden\"\n        // flag which will trigger the clearOnHide functionality.\n        if (property === 'hidden' && path) {\n            if (!scope.conditionals) {\n                scope.conditionals = [];\n            }\n            const conditionallyHidden = (_a = scope.conditionals) === null || _a === void 0 ? void 0 : _a.find((cond) => {\n                return cond.path === path;\n            });\n            if (conditionallyHidden) {\n                conditionallyHidden.conditionallyHidden = !!component.hidden;\n                (0, formUtil_1.setComponentScope)(component, 'conditionallyHidden', !!component.hidden);\n            }\n            else {\n                (_b = scope.conditionals) === null || _b === void 0 ? void 0 : _b.push({\n                    path,\n                    conditionallyHidden: !!component.hidden,\n                });\n            }\n        }\n        return true;\n    }\n    return false;\n}\nexports.setActionBooleanProperty = setActionBooleanProperty;\nfunction setActionStringProperty(context, action) {\n    const { component } = context;\n    const property = action.property.value;\n    const textValue = action.property.component\n        ? action[action.property.component]\n        : action.text;\n    const currentValue = (0, lodash_1.get)(component, property, '');\n    const newValue = (0, utils_1.interpolate)(textValue, Object.assign(Object.assign({}, context), { value: '' }), (evalContext) => {\n        evalContext.value = currentValue;\n    });\n    if (newValue !== currentValue) {\n        (0, lodash_1.set)(component, property, newValue);\n        return true;\n    }\n    return false;\n}\nexports.setActionStringProperty = setActionStringProperty;\nfunction setActionProperty(context, action) {\n    switch (action.property.type) {\n        case 'boolean':\n            return setActionBooleanProperty(context, action);\n        case 'string':\n            return setActionStringProperty(context, action);\n    }\n    return false;\n}\nexports.setActionProperty = setActionProperty;\nfunction setValueProperty(context, action) {\n    const { component, data, path } = context;\n    const oldValue = (0, lodash_1.get)(data, path);\n    const newValue = (0, utils_1.evaluate)(action.value, context, 'value', false, (evalContext) => {\n        evalContext.value = (0, lodash_1.clone)(oldValue);\n    });\n    if (!(0, lodash_1.isEqual)(oldValue, newValue) &&\n        !(component.clearOnHide && (0, conditions_1.conditionallyHidden)(context))) {\n        (0, lodash_1.set)(data, path, newValue);\n        return true;\n    }\n    return false;\n}\nexports.setValueProperty = setValueProperty;\nfunction setMergeComponentSchema(context, action) {\n    const { component, data, path } = context;\n    const oldValue = (0, lodash_1.get)(data, path);\n    const schema = (0, utils_1.evaluate)(action.schemaDefinition, Object.assign(Object.assign({}, context), { value: {} }), 'schema', false, (evalContext) => {\n        evalContext.value = (0, lodash_1.clone)(oldValue);\n    });\n    const merged = (0, lodash_1.assign)({}, component, schema);\n    if (!(0, lodash_1.isEqual)(component, merged)) {\n        (0, lodash_1.assign)(component, schema);\n        return true;\n    }\n    return false;\n}\nexports.setMergeComponentSchema = setMergeComponentSchema;\nfunction setCustomAction(context, action) {\n    return setValueProperty(context, { type: 'value', value: action.customAction });\n}\nexports.setCustomAction = setCustomAction;\nconst applyActions = (context) => {\n    const { component } = context;\n    const { logic } = component;\n    if (!logic || !logic.length) {\n        return false;\n    }\n    return logic.reduce((changed, logicItem) => {\n        const { actions, trigger } = logicItem;\n        if (!trigger || !actions || !actions.length || !(0, exports.checkTrigger)(context, trigger)) {\n            return changed;\n        }\n        return actions.reduce((changed, action) => {\n            switch (action.type) {\n                case 'property':\n                    if (setActionProperty(context, action)) {\n                        return true;\n                    }\n                    return changed;\n                case 'value':\n                    return setValueProperty(context, action) || changed;\n                case 'mergeComponentSchema':\n                    if (setMergeComponentSchema(context, action)) {\n                        return true;\n                    }\n                    return changed;\n                case 'customAction':\n                    return setCustomAction(context, action) || changed;\n                default:\n                    return changed;\n            }\n        }, changed);\n    }, false);\n};\nexports.applyActions = applyActions;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/logic.js?");
+eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.applyActions = exports.setCustomAction = exports.setMergeComponentSchema = exports.setValueProperty = exports.setActionProperty = exports.setActionStringProperty = exports.setActionBooleanProperty = exports.checkTrigger = exports.hasLogic = void 0;\nconst conditions_1 = __webpack_require__(/*! ./conditions */ \"./node_modules/@formio/core/lib/utils/conditions.js\");\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst utils_1 = __webpack_require__(/*! ./utils */ \"./node_modules/@formio/core/lib/utils/utils.js\");\nconst formUtil_1 = __webpack_require__(/*! ./formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst hasLogic = (context) => {\n    const { component } = context;\n    const { logic } = component;\n    if (!logic || !logic.length) {\n        return false;\n    }\n    return true;\n};\nexports.hasLogic = hasLogic;\nconst checkTrigger = (context, trigger) => {\n    let shouldTrigger = false;\n    switch (trigger.type) {\n        case 'simple':\n            if ((0, conditions_1.isLegacyConditional)(trigger.simple)) {\n                shouldTrigger = (0, conditions_1.checkLegacyConditional)(trigger.simple, context);\n            }\n            else {\n                shouldTrigger = (0, conditions_1.checkSimpleConditional)(trigger.simple, context);\n            }\n            break;\n        case 'javascript':\n            shouldTrigger = (0, conditions_1.checkCustomConditional)(trigger.javascript, context, 'result');\n            break;\n        case 'json':\n            shouldTrigger = (0, conditions_1.checkJsonConditional)(trigger, context);\n            break;\n        default:\n            shouldTrigger = false;\n            break;\n    }\n    if (shouldTrigger === null) {\n        return false;\n    }\n    return shouldTrigger;\n};\nexports.checkTrigger = checkTrigger;\nfunction setActionBooleanProperty(context, action) {\n    var _a, _b;\n    const { component, scope, path } = context;\n    const property = action.property.value;\n    const currentValue = (0, lodash_1.get)(component, property, false).toString();\n    const newValue = action.state.toString();\n    if (currentValue !== newValue) {\n        (0, lodash_1.set)(component, property, newValue === 'true');\n        // If this is \"logic\" forcing a component to set hidden property, then we will set the \"conditionallyHidden\"\n        // flag which will trigger the clearOnHide functionality.\n        if (property === 'hidden' && path) {\n            if (!scope.conditionals) {\n                scope.conditionals = [];\n            }\n            const conditionallyHidden = (_a = scope.conditionals) === null || _a === void 0 ? void 0 : _a.find((cond) => {\n                return cond.path === path;\n            });\n            if (conditionallyHidden) {\n                conditionallyHidden.conditionallyHidden = !!component.hidden;\n                (0, formUtil_1.setComponentScope)(component, 'conditionallyHidden', !!component.hidden);\n            }\n            else {\n                (_b = scope.conditionals) === null || _b === void 0 ? void 0 : _b.push({\n                    path,\n                    conditionallyHidden: !!component.hidden,\n                });\n            }\n        }\n        return true;\n    }\n    return false;\n}\nexports.setActionBooleanProperty = setActionBooleanProperty;\nfunction setActionStringProperty(context, action) {\n    const { component } = context;\n    const property = action.property.value;\n    const textValue = action.property.component\n        ? action[action.property.component]\n        : action.text;\n    const currentValue = (0, lodash_1.get)(component, property, '');\n    const newValue = (0, utils_1.interpolate)(textValue, Object.assign(Object.assign({}, context), { value: '' }), (evalContext) => {\n        evalContext.value = currentValue;\n    });\n    if (newValue !== currentValue) {\n        (0, lodash_1.set)(component, property, newValue);\n        return true;\n    }\n    return false;\n}\nexports.setActionStringProperty = setActionStringProperty;\nfunction setActionProperty(context, action) {\n    switch (action.property.type) {\n        case 'boolean':\n            return setActionBooleanProperty(context, action);\n        case 'string':\n            return setActionStringProperty(context, action);\n    }\n    return false;\n}\nexports.setActionProperty = setActionProperty;\nfunction setValueProperty(context, action) {\n    var _a;\n    const { component, data, path, scope } = context;\n    const oldValue = (0, lodash_1.get)(data, path);\n    const newValue = (0, utils_1.evaluate)(action.value, context, 'value', false, (evalContext) => {\n        evalContext.value = (0, lodash_1.clone)(oldValue);\n    });\n    if (!(0, lodash_1.isEqual)(oldValue, newValue) &&\n        !(component.clearOnHide && (0, conditions_1.conditionallyHidden)(context))) {\n        (0, lodash_1.set)(data, path, newValue);\n        if (!scope.filter)\n            scope.filter = {};\n        if (!((_a = scope.clearHidden) === null || _a === void 0 ? void 0 : _a.hasOwnProperty(path))) {\n            scope.filter[path] = true;\n        }\n        return true;\n    }\n    return false;\n}\nexports.setValueProperty = setValueProperty;\nfunction setMergeComponentSchema(context, action) {\n    const { component, data, path } = context;\n    const oldValue = (0, lodash_1.get)(data, path);\n    const schema = (0, utils_1.evaluate)(action.schemaDefinition, Object.assign(Object.assign({}, context), { value: {} }), 'schema', false, (evalContext) => {\n        evalContext.value = (0, lodash_1.clone)(oldValue);\n    });\n    const merged = (0, lodash_1.assign)({}, component, schema);\n    if (!(0, lodash_1.isEqual)(component, merged)) {\n        (0, lodash_1.assign)(component, schema);\n        return true;\n    }\n    return false;\n}\nexports.setMergeComponentSchema = setMergeComponentSchema;\nfunction setCustomAction(context, action) {\n    return setValueProperty(context, { type: 'value', value: action.customAction });\n}\nexports.setCustomAction = setCustomAction;\nconst applyActions = (context) => {\n    const { component } = context;\n    const { logic } = component;\n    if (!logic || !logic.length) {\n        return false;\n    }\n    return logic.reduce((changed, logicItem) => {\n        const { actions, trigger } = logicItem;\n        if (!trigger || !actions || !actions.length || !(0, exports.checkTrigger)(context, trigger)) {\n            return changed;\n        }\n        return actions.reduce((changed, action) => {\n            switch (action.type) {\n                case 'property':\n                    if (setActionProperty(context, action)) {\n                        return true;\n                    }\n                    return changed;\n                case 'value':\n                    return setValueProperty(context, action) || changed;\n                case 'mergeComponentSchema':\n                    if (setMergeComponentSchema(context, action)) {\n                        return true;\n                    }\n                    return changed;\n                case 'customAction':\n                    return setCustomAction(context, action) || changed;\n                default:\n                    return changed;\n            }\n        }, changed);\n    }, false);\n};\nexports.applyActions = applyActions;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/logic.js?");
 
 /***/ }),
 
@@ -1840,7 +1829,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 formUtil_1 = __webpack_require__(/*! ../formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst ConditionOperator_1 = __importDefault(__webpack_require__(/*! ./ConditionOperator */ \"./node_modules/@formio/core/lib/utils/operators/ConditionOperator.js\"));\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nclass IsEqualTo extends ConditionOperator_1.default {\n    static get operatorKey() {\n        return 'isEqual';\n    }\n    static get displayedName() {\n        return 'Is Equal To';\n    }\n    execute({ value, comparedValue, conditionComponent }) {\n        // special check for select boxes\n        if ((conditionComponent === null || conditionComponent === void 0 ? void 0 : conditionComponent.type) === 'selectboxes' && (0, lodash_1.isObject)(value)) {\n            return (0, lodash_1.get)(value, comparedValue, false);\n        }\n        if (value &&\n            comparedValue &&\n            typeof value !== typeof comparedValue &&\n            (0, lodash_1.isString)(comparedValue)) {\n            try {\n                comparedValue = JSON.parse(comparedValue);\n            }\n            catch (ignoreErr) {\n                // do nothing\n            }\n        }\n        if (conditionComponent &&\n            (0, formUtil_1.isSelectResourceWithObjectValue)(conditionComponent) &&\n            conditionComponent.template) {\n            return (0, formUtil_1.compareSelectResourceWithObjectTypeValues)(value, comparedValue, conditionComponent);\n        }\n        return (0, lodash_1.isEqual)(value, comparedValue);\n    }\n}\nexports[\"default\"] = IsEqualTo;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/operators/IsEqualTo.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 formUtil_1 = __webpack_require__(/*! ../formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil/index.js\");\nconst ConditionOperator_1 = __importDefault(__webpack_require__(/*! ./ConditionOperator */ \"./node_modules/@formio/core/lib/utils/operators/ConditionOperator.js\"));\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nclass IsEqualTo extends ConditionOperator_1.default {\n    static get operatorKey() {\n        return 'isEqual';\n    }\n    static get displayedName() {\n        return 'Is Equal To';\n    }\n    execute({ value, comparedValue, conditionComponent }) {\n        // special check for select boxes\n        if ((conditionComponent === null || conditionComponent === void 0 ? void 0 : conditionComponent.type) === 'selectboxes' && (0, lodash_1.isObject)(value)) {\n            return (0, lodash_1.get)(value, comparedValue, false);\n        }\n        if ((value || value === false) &&\n            comparedValue &&\n            typeof value !== typeof comparedValue &&\n            (0, lodash_1.isString)(comparedValue)) {\n            try {\n                comparedValue = JSON.parse(comparedValue);\n            }\n            catch (ignoreErr) {\n                // do nothing\n            }\n        }\n        if (conditionComponent &&\n            (0, formUtil_1.isSelectResourceWithObjectValue)(conditionComponent) &&\n            conditionComponent.template) {\n            return (0, formUtil_1.compareSelectResourceWithObjectTypeValues)(value, comparedValue, conditionComponent);\n        }\n        return (0, lodash_1.isEqual)(value, comparedValue);\n    }\n}\nexports[\"default\"] = IsEqualTo;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/operators/IsEqualTo.js?");
 
 /***/ }),
 
@@ -4861,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 = 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    // Webforms have no default value setting, so this should be always false\n    // I does not affect setting default value to nested forms\n    get shouldAddDefaultValue() {\n        return false;\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?");
 
 /***/ }),
 
@@ -4872,7 +4861,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 Webform_1 = __importDefault(__webpack_require__(/*! ./Webform */ \"./lib/cjs/Webform.js\"));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst utils_1 = __webpack_require__(/*! ./utils */ \"./lib/cjs/utils/index.js\");\nclass Wizard extends Webform_1.default {\n    /**\n     * Constructor for wizard-based forms.\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     *    - breadcrumbSettings.clickable: true (default) - determines if the breadcrumb bar is clickable.\n     *    - buttonSettings.show*(Previous, Next, Cancel): true (default) - determines if the button is shown.\n     *    - allowPrevious: false (default) - determines if the breadcrumb bar is clickable for visited tabs.\n     */\n    constructor(elementOrOptions = undefined, _options = undefined) {\n        let element, options;\n        if (elementOrOptions instanceof HTMLElement || _options) {\n            element = elementOrOptions;\n            options = _options || {};\n        }\n        else {\n            options = elementOrOptions || {};\n        }\n        options.display = 'wizard';\n        super(element, options);\n        this.pages = [];\n        this.prefixComps = [];\n        this.suffixComps = [];\n        this.components = [];\n        this.originalComponents = [];\n        this.page = 0;\n        this.currentPanel = null;\n        this.currentNextPage = 0;\n        this._seenPages = [0];\n        this.subWizards = [];\n        this.allPages = [];\n        this.lastPromise = Promise.resolve();\n        this.enabledIndex = 0;\n        this.editMode = false;\n        this.originalOptions = lodash_1.default.cloneDeep(this.options);\n    }\n    isLastPage() {\n        const next = this.getNextPage();\n        if (lodash_1.default.isNumber(next)) {\n            return next === -1;\n        }\n        return lodash_1.default.isNull(next);\n    }\n    getPages(args = {}) {\n        const { all = false } = args;\n        const pages = this.hasSubWizards ? this.components : this.pages;\n        const filteredPages = pages\n            .filter(all ? lodash_1.default.identity : (p, index) => this._seenPages.includes(index));\n        return filteredPages;\n    }\n    get hasSubWizards() {\n        return !lodash_1.default.isEmpty(this.subWizards);\n    }\n    get data() {\n        return super.data;\n    }\n    get localData() {\n        var _a, _b;\n        return ((_b = (_a = this.pages[this.page]) === null || _a === void 0 ? void 0 : _a.root) === null || _b === void 0 ? void 0 : _b.submission.data) || this.submission.data;\n    }\n    checkConditions(data, flags, row) {\n        const visible = super.checkConditions(data, flags, row);\n        this.establishPages(data);\n        return visible;\n    }\n    set data(value) {\n        this._data = value;\n        lodash_1.default.each(this.getPages({ all: true }), (component) => {\n            component.data = this.componentContext(component);\n        });\n    }\n    getComponents() {\n        return this.submitting\n            ? this.getPages({ all: this.isLastPage() })\n            : super.getComponents();\n    }\n    resetValue() {\n        this.getPages({ all: true }).forEach((page) => page.resetValue());\n        this.setPristine(true);\n    }\n    init() {\n        var _a;\n        // Check for and initlize button settings object\n        this.options.buttonSettings = lodash_1.default.defaults(this.options.buttonSettings, {\n            showPrevious: true,\n            showNext: true,\n            showSubmit: true,\n            showCancel: !this.options.readOnly\n        });\n        this.options.breadcrumbSettings = lodash_1.default.defaults(this.options.breadcrumbSettings, {\n            clickable: true\n        });\n        this.options.allowPrevious = this.options.allowPrevious || false;\n        this.page = 0;\n        const onReady = super.init();\n        this.setComponentSchema();\n        if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[this.page]) {\n            this.component = this.pages[this.page].component;\n        }\n        this.on('subWizardsUpdated', (subForm) => {\n            const subWizard = this.subWizards.find(subWizard => { var _a; return (subForm === null || subForm === void 0 ? void 0 : subForm.id) && ((_a = subWizard.subForm) === null || _a === void 0 ? void 0 : _a.id) === (subForm === null || subForm === void 0 ? void 0 : subForm.id); });\n            if (this.subWizards.length && subWizard) {\n                subWizard.subForm.setValue(subForm._submission, {}, true);\n                this.establishPages();\n                this.redraw();\n            }\n        });\n        return onReady;\n    }\n    get wizardKey() {\n        return `wizard-${this.id}`;\n    }\n    get wizard() {\n        return this.form;\n    }\n    set wizard(form) {\n        this.setForm(form);\n    }\n    get buttons() {\n        const buttons = {};\n        [\n            { name: 'cancel', method: 'cancel' },\n            { name: 'previous', method: 'prevPage' },\n            { name: 'next', method: 'nextPage' },\n            { name: 'submit', method: 'submit' }\n        ].forEach((button) => {\n            if (this.hasButton(button.name)) {\n                buttons[button.name] = button;\n            }\n        });\n        return buttons;\n    }\n    get buttonOrder() {\n        var _a, _b, _c;\n        const defaultButtonOrder = [\n            'cancel',\n            'previous',\n            'next',\n            'submit'\n        ];\n        return (_c = (_b = (_a = this.options.properties) === null || _a === void 0 ? void 0 : _a.wizardButtonOrder) === null || _b === void 0 ? void 0 : _b.toLowerCase().split(', ')) !== null && _c !== void 0 ? _c : defaultButtonOrder;\n    }\n    get renderContext() {\n        var _a, _b;\n        return {\n            disableWizardSubmit: this.form.disableWizardSubmit,\n            wizardKey: this.wizardKey,\n            isBreadcrumbClickable: this.isBreadcrumbClickable(),\n            isSubForm: !!this.parent && !((_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.type) === 'wizard',\n            panels: this.allPages.length ? this.allPages.map(page => page.component) : this.pages.map(page => page.component),\n            buttons: this.buttons,\n            currentPage: this.page,\n            buttonOrder: this.buttonOrder,\n        };\n    }\n    prepareNavigationSettings(ctx) {\n        const currentPanel = this.currentPanel;\n        if (currentPanel && currentPanel.buttonSettings) {\n            Object.keys(currentPanel.buttonSettings).forEach(() => {\n                Object.keys(ctx.buttons).forEach(key => {\n                    if (typeof currentPanel.buttonSettings[key] !== 'undefined' && !currentPanel.buttonSettings[key] || ctx.isSubForm) {\n                        ctx.buttons[key] = null;\n                    }\n                });\n            });\n        }\n        return this.renderTemplate('wizardNav', ctx);\n    }\n    prepareHeaderSettings(ctx, headerType) {\n        var _a;\n        const shouldHideBreadcrumbs = ((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.breadcrumb) === 'none' ||\n            lodash_1.default.get(this.form, 'settings.wizardBreadcrumbsType', '') === 'none';\n        if (shouldHideBreadcrumbs || ctx.isSubForm) {\n            return null;\n        }\n        return this.renderTemplate(headerType, ctx);\n    }\n    render() {\n        const ctx = this.renderContext;\n        if (this.component.id) {\n            ctx.panels.forEach(panel => {\n                if (panel.id === this.component.id) {\n                    this.currentPanel = panel;\n                    ctx.wizardPageTooltip = this.getFormattedTooltip(panel.tooltip);\n                }\n            });\n        }\n        const wizardNav = this.prepareNavigationSettings(ctx);\n        const wizardHeaderType = `wizardHeader${lodash_1.default.get(this.form, 'settings.wizardHeaderType', '')}`;\n        const wizardHeaderLocation = lodash_1.default.get(this.form, 'settings.wizardHeaderLocation', 'left');\n        const wizardHeader = this.prepareHeaderSettings(ctx, wizardHeaderType);\n        return this.renderTemplate('wizard', Object.assign(Object.assign({}, ctx), { className: super.getClassName(), wizardHeader,\n            wizardHeaderType,\n            wizardHeaderLocation,\n            wizardNav, components: this.renderComponents([\n                ...this.prefixComps,\n                ...this.currentPage.components,\n                ...this.suffixComps\n            ]) }), this.builderMode ? 'builder' : 'form');\n    }\n    redrawNavigation() {\n        if (this.element) {\n            let navElement = this.element.querySelector(`#${this.wizardKey}-nav`);\n            if (navElement) {\n                this.detachNav();\n                navElement.outerHTML = this.renderTemplate('wizardNav', this.renderContext);\n                navElement = this.element.querySelector(`#${this.wizardKey}-nav`);\n                this.loadRefs(navElement, {\n                    [`${this.wizardKey}-cancel`]: 'single',\n                    [`${this.wizardKey}-previous`]: 'single',\n                    [`${this.wizardKey}-next`]: 'single',\n                    [`${this.wizardKey}-submit`]: 'single',\n                });\n                this.attachNav();\n            }\n        }\n    }\n    redrawHeader() {\n        if (this.element) {\n            let headerElement = this.element.querySelector(`#${this.wizardKey}-header`);\n            if (headerElement) {\n                this.detachHeader();\n                headerElement.outerHTML = this.renderTemplate(`wizardHeader${lodash_1.default.get(this.form, 'settings.wizardHeaderType', '')}`, this.renderContext);\n                headerElement = this.element.querySelector(`#${this.wizardKey}-header`);\n                this.loadRefs(headerElement, {\n                    [`${this.wizardKey}-link`]: 'multiple',\n                    [`${this.wizardKey}-tooltip`]: 'multiple'\n                });\n                this.attachHeader();\n            }\n        }\n    }\n    /**\n     * Attaches the wizard to the provided DOM element, initializes component references, sets up navigation,\n     * and emits a render event. It will initialize the wizard's index if necessary,\n     * attach event hooks, and make sure that the current page is rendered and displayed correctly.\n     * @param {HTMLElement} element - The DOM element to which the wizard will be attached.\n     * @returns {Promise} A promise that resolves when all components have been successfully attached.\n     */\n    attach(element) {\n        var _a;\n        this.setElement(element);\n        this.loadRefs(element, {\n            [this.wizardKey]: 'single',\n            [`${this.wizardKey}-header`]: 'single',\n            [`${this.wizardKey}-cancel`]: 'single',\n            [`${this.wizardKey}-previous`]: 'single',\n            [`${this.wizardKey}-next`]: 'single',\n            [`${this.wizardKey}-submit`]: 'single',\n            [`${this.wizardKey}-link`]: 'multiple',\n            [`${this.wizardKey}-tooltip`]: 'multiple'\n        });\n        if ((this.options.readOnly || this.editMode) && !this.enabledIndex) {\n            this.enabledIndex = ((_a = this.pages) === null || _a === void 0 ? void 0 : _a.length) - 1;\n        }\n        this.hook('attachWebform', element, this);\n        const promises = this.attachComponents(this.refs[this.wizardKey], [\n            ...this.prefixComps,\n            ...this.currentPage.components,\n            ...this.suffixComps,\n        ]);\n        this.attachNav();\n        this.attachHeader();\n        return promises.then(() => {\n            this.emit('render', { component: this.currentPage, page: this.page });\n            if (this.component.scrollToTop) {\n                this.scrollPageToTop();\n            }\n        });\n    }\n    scrollPageToTop() {\n        var _a;\n        const pageTop = (_a = this.refs[`${this.wizardKey}-header`]) !== null && _a !== void 0 ? _a : this.refs[this.wizardKey];\n        if (!pageTop) {\n            return;\n        }\n        if ('scrollIntoView' in pageTop) {\n            pageTop.scrollIntoView(true);\n        }\n        else {\n            this.scrollIntoView(pageTop);\n        }\n    }\n    isBreadcrumbClickable() {\n        let currentPage = null;\n        this.pages.map(page => {\n            if (lodash_1.default.isEqual(this.currentPage.component, page.component)) {\n                currentPage = page;\n            }\n        });\n        if (lodash_1.default.has(currentPage, 'component.breadcrumbClickable')) {\n            return lodash_1.default.get(currentPage, 'component.breadcrumbClickable');\n        }\n        if (lodash_1.default.has(this.options, 'breadcrumbSettings.clickable')) {\n            return this.options.breadcrumbSettings.clickable;\n        }\n        return true;\n    }\n    isAllowPrevious() {\n        let currentPage = null;\n        this.pages.map(page => {\n            if (lodash_1.default.isEqual(this.currentPage.component, page.component)) {\n                currentPage = page;\n            }\n        });\n        return lodash_1.default.get(currentPage.component, 'allowPrevious', this.options.allowPrevious);\n    }\n    /**\n     * Handles navigate on 'Enter' key event in a wizard form.\n     * @param {KeyboardEvent} event - The keyboard event object that triggered the handler.\n     */\n    handleNaviageteOnEnter(event) {\n        if (event.keyCode === 13) {\n            const clickEvent = new CustomEvent('click');\n            const buttonElement = this.refs[`${this.wizardKey}-${this.buttons.next.name}`];\n            if (buttonElement) {\n                buttonElement.dispatchEvent(clickEvent);\n            }\n        }\n    }\n    /**\n     * Handles save on 'Enter' key event in a wizard form.\n     * @param {KeyboardEvent} event - The keyboard event object that triggered the handler.\n     */\n    handleSaveOnEnter(event) {\n        if (event.keyCode === 13) {\n            const clickEvent = new CustomEvent('click');\n            const buttonElement = this.refs[`${this.wizardKey}-${this.buttons.submit.name}`];\n            if (buttonElement) {\n                buttonElement.dispatchEvent(clickEvent);\n            }\n        }\n    }\n    attachNav() {\n        if (this.component.navigateOnEnter) {\n            this.addEventListener(document, 'keyup', this.handleNaviageteOnEnter.bind(this));\n        }\n        if (this.component.saveOnEnter) {\n            this.addEventListener(document, 'keyup', this.handleSaveOnEnter.bind(this));\n        }\n        lodash_1.default.each(this.buttons, (button) => {\n            const buttonElement = this.refs[`${this.wizardKey}-${button.name}`];\n            this.addEventListener(buttonElement, 'click', (event) => {\n                event.preventDefault();\n                // Disable the button until done.\n                buttonElement.setAttribute('disabled', 'disabled');\n                this.setLoading(buttonElement, true);\n                // Call the button method, then re-enable the button.\n                this[button.method]().then(() => {\n                    buttonElement.removeAttribute('disabled');\n                    this.setLoading(buttonElement, false);\n                }).catch(() => {\n                    buttonElement.removeAttribute('disabled');\n                    this.setLoading(buttonElement, false);\n                });\n            });\n        });\n    }\n    /**\n     * Emits an event indicating that a wizard page has been selected.\n     * @param {number} index - Index of the selected wizard page in the `pages` array.\n     * @fires emit - Emits the 'wizardPageSelected' event with the page object and index.\n     */\n    emitWizardPageSelected(index) {\n        this.emit('wizardPageSelected', this.pages[index], index);\n    }\n    attachHeader() {\n        var _a, _b;\n        const isAllowPrevious = this.isAllowPrevious();\n        this.attachTooltips(this.refs[`${this.wizardKey}-tooltip`], (_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.tooltip);\n        if (this.isBreadcrumbClickable() || isAllowPrevious) {\n            (_b = this.refs[`${this.wizardKey}-link`]) === null || _b === void 0 ? void 0 : _b.forEach((link, index) => {\n                if (!isAllowPrevious || index <= this.enabledIndex) {\n                    this.addEventListener(link, 'click', (event) => {\n                        this.emit('wizardNavigationClicked', this.pages[index]);\n                        event.preventDefault();\n                        return this.setPage(index).then(() => {\n                            this.emitWizardPageSelected(index);\n                        });\n                    });\n                }\n            });\n        }\n    }\n    detachNav() {\n        if (this.component.navigateOnEnter) {\n            this.removeEventListener(document, 'keyup', this.handleNaviageteOnEnter.bind(this));\n        }\n        if (this.component.saveOnEnter) {\n            this.removeEventListener(document, 'keyup', this.handleSaveOnEnter.bind(this));\n        }\n        lodash_1.default.each(this.buttons, (button) => {\n            this.removeEventListener(this.refs[`${this.wizardKey}-${button.name}`], 'click');\n        });\n    }\n    detachHeader() {\n        if (this.refs[`${this.wizardKey}-link`]) {\n            this.refs[`${this.wizardKey}-link`].forEach((link) => {\n                this.removeEventListener(link, 'click');\n            });\n        }\n    }\n    transformPages() {\n        const allComponents = [];\n        const components = this.getSortedComponents(this);\n        let defferedComponents = [];\n        this.allPages = [];\n        // Get all components including all nested components and line up in the correct order\n        const getAllComponents = (nestedComp, compsArr, pushAllowed = true) => {\n            const nestedPages = [];\n            const dataArrayComponents = ['datagrid', 'editgrid', 'dynamicWizard'];\n            const currentComponents = (nestedComp === null || nestedComp === void 0 ? void 0 : nestedComp.subForm) ? this.getSortedComponents(nestedComp.subForm) : (nestedComp === null || nestedComp === void 0 ? void 0 : nestedComp.components) || [];\n            const visibleComponents = currentComponents.filter(comp => comp._visible);\n            const filteredComponents = visibleComponents.filter(comp => !dataArrayComponents.includes(comp.component.type) && (comp.type !== 'form' || comp.isNestedWizard));\n            const additionalComponents = currentComponents.filter(comp => { var _a; return ((_a = comp.subForm) === null || _a === void 0 ? void 0 : _a._form.display) !== 'wizard'; });\n            let hasNested = false;\n            (0, utils_1.eachComponent)(filteredComponents, (comp) => {\n                if (comp && comp.component) {\n                    if (comp.component.type === 'panel' && (comp === null || comp === void 0 ? void 0 : comp.parent.wizard) && !getAllComponents(comp, compsArr, false)) {\n                        if (pushAllowed) {\n                            this.setRootPanelId(comp);\n                            nestedPages.push(comp);\n                        }\n                        hasNested = true;\n                    }\n                    if (comp.isNestedWizard && comp.subForm) {\n                        const hasNestedForm = getAllComponents(comp, nestedPages, pushAllowed);\n                        if (!hasNested) {\n                            hasNested = hasNestedForm;\n                        }\n                    }\n                }\n            }, true);\n            if (nestedComp.component.type === 'panel') {\n                if (!hasNested && pushAllowed) {\n                    this.setRootPanelId(nestedComp);\n                    compsArr.push(nestedComp);\n                }\n                if (hasNested && additionalComponents.length) {\n                    const newComp = lodash_1.default.clone(nestedComp);\n                    newComp.components = additionalComponents;\n                    this.setRootPanelId(newComp);\n                    defferedComponents.push(newComp);\n                }\n            }\n            if (pushAllowed) {\n                compsArr.push(...defferedComponents, ...nestedPages);\n                defferedComponents = [];\n            }\n            return hasNested;\n        };\n        components.forEach((component) => {\n            if (component.visible) {\n                getAllComponents(component, allComponents);\n            }\n        }, []);\n        // recalculate pages only for root wizards, including the situation when the wizard is in a wrapper\n        if (this.localRoot && this.id === this.localRoot.id) {\n            allComponents.forEach((comp, index) => {\n                comp.eachComponent((component) => {\n                    component.page = index;\n                });\n            });\n        }\n        this.allPages = allComponents;\n    }\n    getSortedComponents({ components, originalComponents }) {\n        const currentComponents = [];\n        const currentPages = [];\n        if (components && components.length) {\n            components.map(page => {\n                if (page.component.type === 'panel') {\n                    currentPages[page.component.key || page.component.title] = page;\n                }\n            });\n        }\n        originalComponents === null || originalComponents === void 0 ? void 0 : originalComponents.forEach((item) => {\n            if (!item.key) {\n                item.key = item.title;\n            }\n            if (currentPages[item.key]) {\n                currentComponents.push(currentPages[item.key]);\n            }\n        });\n        return currentComponents;\n    }\n    findRootPanel(component) {\n        var _a;\n        return ((_a = component.parent) === null || _a === void 0 ? void 0 : _a.parent) ? this.findRootPanel(component.parent) : component;\n    }\n    setRootPanelId(component) {\n        var _a;\n        if (component.rootPanelId && component.rootPanelId !== component.id) {\n            return;\n        }\n        const parent = ((_a = component.parent) === null || _a === void 0 ? void 0 : _a.parent) ? this.findRootPanel(component.parent) : component;\n        component.rootPanelId = parent.id;\n    }\n    establishPages(data = this.data) {\n        this.pages = [];\n        this.prefixComps = [];\n        this.suffixComps = [];\n        const visible = [];\n        const currentPages = {};\n        const pageOptions = Object.assign(Object.assign({}, (lodash_1.default.clone(this.options))), (this.parent ? { root: this } : {}));\n        if (this.components && this.components.length) {\n            this.components.forEach(page => {\n                if (page.component.type === 'panel') {\n                    currentPages[page.component.key || page.component.title] = page;\n                }\n            });\n        }\n        if (this.originalComponents) {\n            this.originalComponents.forEach((item) => {\n                if (item.type === 'panel') {\n                    if (!item.key) {\n                        item.key = item.title;\n                    }\n                    let page = currentPages[item.key];\n                    const forceShow = this.shouldForceShow(item);\n                    const forceHide = this.shouldForceHide(item);\n                    let isVisible = !page\n                        ? (0, utils_1.checkCondition)(item, data, data, this.component, this) && !item.hidden\n                        : page.visible;\n                    if (forceShow) {\n                        isVisible = true;\n                    }\n                    else if (forceHide) {\n                        isVisible = false;\n                    }\n                    if (isVisible) {\n                        visible.push(item);\n                        if (page) {\n                            this.pages.push(page);\n                        }\n                    }\n                    if (!page && isVisible) {\n                        page = this.createComponent(item, pageOptions);\n                        page.visible = isVisible;\n                        this.pages.push(page);\n                        page.eachComponent((component) => {\n                            component.page = (this.pages.length - 1);\n                        });\n                    }\n                }\n                else if (item.type !== 'button') {\n                    if (!this.pages.length) {\n                        this.prefixComps.push(this.createComponent(item, pageOptions));\n                    }\n                    else {\n                        this.suffixComps.push(this.createComponent(item, pageOptions));\n                    }\n                }\n            });\n        }\n        if (this.pages.length) {\n            this.emit('pagesChanged');\n        }\n        this.transformPages();\n        if (this.allPages && this.allPages.length) {\n            this.updatePages();\n        }\n        return visible;\n    }\n    updatePages() {\n        this.pages = this.allPages;\n    }\n    addComponents() {\n        this.establishPages();\n    }\n    setPage(num) {\n        if (num === this.page) {\n            return Promise.resolve();\n        }\n        if (num >= 0 && num < this.pages.length) {\n            this.page = num;\n            this.pageFieldLogic(num);\n            this.getNextPage();\n            let parentNum = num;\n            if (this.hasSubWizards) {\n                const pageFromPages = this.pages[num];\n                const pageFromComponents = this.components[num];\n                if (!pageFromComponents || (pageFromPages === null || pageFromPages === void 0 ? void 0 : pageFromPages.id) !== pageFromComponents.id) {\n                    parentNum = this.components.findIndex(comp => {\n                        var _a, _b;\n                        return comp.id === ((_b = (_a = this.pages) === null || _a === void 0 ? void 0 : _a[parentNum]) === null || _b === void 0 ? void 0 : _b.rootPanelId);\n                    });\n                }\n            }\n            if (!this._seenPages.includes(parentNum)) {\n                this._seenPages = this._seenPages.concat(parentNum);\n            }\n            this.redraw().then(() => {\n                this.checkData(this.submission.data);\n                this.triggerCaptcha(this.currentPage.components);\n                const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : this.validateCurrentPage();\n                if (this.alert) {\n                    this.showErrors(errors, true, true);\n                }\n            });\n            return Promise.resolve();\n        }\n        else if (!this.pages.length) {\n            this.redraw();\n            return Promise.resolve();\n        }\n        return Promise.reject('Page not found');\n    }\n    pageFieldLogic(page) {\n        var _a;\n        if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[page]) {\n            // Handle field logic on pages.\n            this.component = this.pages[page].component;\n            this.originalComponent = (0, utils_1.fastCloneDeep)(this.component);\n            this.fieldLogic(this.data);\n            // If disabled changed, be sure to distribute the setting.\n            this.disabled = this.shouldDisabled;\n        }\n    }\n    get currentPage() {\n        return (this.pages && (this.pages.length >= this.page)) ? this.pages[this.page] : { components: [] };\n    }\n    getNextPage() {\n        var _a;\n        if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[this.page]) {\n            const data = this.submission.data;\n            const form = this.pages[this.page].component;\n            // Check conditional nextPage\n            if (form) {\n                const page = this.pages.length > (this.page + 1) && !this.showAllErrors ? this.page + 1 : -1;\n                if (form.nextPage) {\n                    const next = this.evaluate(form.nextPage, {\n                        next: page,\n                        data,\n                        page,\n                        form\n                    }, 'next');\n                    if (next === null) {\n                        this.currentNextPage = null;\n                        return null;\n                    }\n                    const pageNum = parseInt(next, 10);\n                    if (!isNaN(parseInt(pageNum, 10)) && isFinite(pageNum)) {\n                        this.currentNextPage = pageNum;\n                        return pageNum;\n                    }\n                    this.currentNextPage = this.getPageIndexByKey(next);\n                    return this.currentNextPage;\n                }\n                this.currentNextPage = page;\n                return page;\n            }\n            this.currentNextPage = null;\n        }\n        return null;\n    }\n    getPreviousPage() {\n        return this.page - 1;\n    }\n    beforeSubmit() {\n        const pages = this.getPages({ all: true });\n        return Promise.all(pages.map((page) => {\n            this.triggerButtonCaptcha(page);\n            page.options.beforeSubmit = true;\n            return page.beforeSubmit();\n        }));\n    }\n    beforePage(next) {\n        return new Promise((resolve, reject) => {\n            this.hook(next ? 'beforeNext' : 'beforePrev', this.currentPage, this.submission, (err) => {\n                if (err) {\n                    this.showErrors(err, true);\n                    reject(err);\n                }\n                const form = this.currentPage;\n                if (form) {\n                    form.beforePage(next).then(resolve).catch(reject);\n                }\n                else {\n                    resolve();\n                }\n            });\n        });\n    }\n    emitNextPage() {\n        this.emit('nextPage', { page: this.page, submission: this.submission });\n    }\n    nextPage() {\n        // Read-only forms should not worry about validation before going to next page, nor should they submit.\n        if (this.options.readOnly) {\n            return this.beforePage(true).then(() => {\n                return this.setPage(this.getNextPage()).then(() => {\n                    this.emitNextPage();\n                });\n            });\n        }\n        // Validate the form before going to the next page\n        const currentPageErrors = this.validateCurrentPage({ dirty: true });\n        const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : currentPageErrors;\n        // allow going to the next page if the current page is valid, even if there are form level errors\n        if (currentPageErrors.length === 0) {\n            this.checkData(this.submission.data);\n            return this.beforePage(true).then(() => {\n                return this.setPage(this.getNextPage()).then(() => {\n                    if (!(this.options.readOnly || this.editMode) && this.enabledIndex < this.page) {\n                        this.enabledIndex = this.page;\n                        this.redraw();\n                    }\n                    this.emitNextPage();\n                });\n            });\n        }\n        else {\n            this.currentPage.components.forEach((comp) => comp.setPristine(false));\n            this.scrollIntoView(this.element, true);\n            return Promise.reject(this.showErrors(errors, true));\n        }\n    }\n    validateCurrentPage(flags = {}) {\n        var _a, _b, _c, _d;\n        const components = (_a = this.currentPage) === null || _a === void 0 ? void 0 : _a.components.map((component) => component.component);\n        // Accessing the parent ensures the right instance (whether it's the parent Wizard or a nested Wizard) performs its validation\n        if ((_b = this.currentPage) === null || _b === void 0 ? void 0 : _b.parent) {\n            return (_c = this.currentPage) === null || _c === void 0 ? void 0 : _c.parent.validateComponents(components, this.root.data, flags);\n        }\n        return (_d = this.currentPage) === null || _d === void 0 ? void 0 : _d.validateComponents(components, this.root ? this.root.data : this.data, flags);\n    }\n    emitPrevPage() {\n        this.emit('prevPage', { page: this.page, submission: this.submission });\n    }\n    prevPage() {\n        return this.beforePage().then(() => {\n            return this.setPage(this.getPreviousPage()).then(() => {\n                this.emitPrevPage();\n            });\n        });\n    }\n    cancel(noconfirm) {\n        if (this.options.readOnly) {\n            return Promise.resolve();\n        }\n        if (super.cancel(noconfirm)) {\n            this.setPristine(true);\n            return this.setPage(0).then(() => {\n                if (this.enabledIndex) {\n                    this.enabledIndex = 0;\n                }\n                this.onChange({ resetValue: true });\n                this.redraw();\n                return this.page;\n            });\n        }\n        return Promise.resolve();\n    }\n    getPageIndexByKey(key) {\n        let pageIndex = this.page;\n        this.pages.forEach((page, index) => {\n            if (page.component.key === key) {\n                pageIndex = index;\n                return false;\n            }\n        });\n        return pageIndex;\n    }\n    get schema() {\n        return this.wizard;\n    }\n    setComponentSchema() {\n        const pageKeys = {};\n        this.originalComponents = [];\n        this.component.components.map((item) => {\n            if (item.type === 'panel') {\n                item.key = (0, utils_1.uniqueKey)(pageKeys, (item.key || 'panel'));\n                pageKeys[item.key] = true;\n                if (this.wizard.full) {\n                    this.options.show = this.options.show || {};\n                    this.options.show[item.key] = true;\n                }\n                else if (Object.prototype.hasOwnProperty.call(this.wizard, 'full')\n                    && !lodash_1.default.isEqual(this.originalOptions.show, this.options.show)) {\n                    this.options.show = Object.assign({}, (this.originalOptions.show || {}));\n                }\n            }\n            this.originalComponents.push(lodash_1.default.clone(item));\n        });\n        if (!Object.keys(pageKeys).length) {\n            const newPage = {\n                type: 'panel',\n                title: 'Page 1',\n                label: 'Page 1',\n                key: 'page1',\n                components: this.component.components\n            };\n            this.component.components = [newPage];\n            this.originalComponents.push(lodash_1.default.clone(newPage));\n        }\n    }\n    setForm(form, flags = {}) {\n        if (!form) {\n            return;\n        }\n        return super.setForm(form, flags);\n    }\n    onSetForm(clonedForm, initialForm) {\n        this.component.components = (this.parent ? initialForm.components : clonedForm.components) || [];\n        this.setComponentSchema();\n    }\n    setEditMode(submission) {\n        if (!this.editMode && submission._id && !this.options.readOnly) {\n            this.editMode = true;\n            this.redraw();\n        }\n    }\n    setValue(submission, flags = {}, ignoreEstablishment) {\n        const changed = this.getPages({ all: true }).reduce((changed, page) => {\n            return this.setNestedValue(page, submission.data, flags, changed) || changed;\n        }, false);\n        this.mergeData(this.data, submission.data);\n        if (changed) {\n            this.pageFieldLogic(this.page);\n        }\n        submission.data = this.data;\n        this._submission = submission;\n        if (!ignoreEstablishment) {\n            this.establishPages(submission.data);\n        }\n        this.setEditMode(submission);\n        return changed;\n    }\n    isClickable(page, index) {\n        return this.page !== index && (0, utils_1.firstNonNil)([\n            lodash_1.default.get(page, 'breadcrumbClickable'),\n            this.options.breadcrumbSettings.clickable\n        ]);\n    }\n    hasButton(name, nextPage = this.getNextPage()) {\n        // get page options with global options as default values\n        const { previous = this.options.buttonSettings.showPrevious, cancel = this.options.buttonSettings.showCancel, submit = this.options.buttonSettings.showSubmit, next = this.options.buttonSettings.showNext } = lodash_1.default.get(this.currentPage, 'component.buttonSettings', {});\n        switch (name) {\n            case 'previous':\n                return previous && (this.getPreviousPage() > -1);\n            case 'next':\n                return next && (nextPage !== null) && (nextPage !== -1);\n            case 'cancel':\n                return cancel && !this.options.readOnly;\n            case 'submit':\n                return submit && !this.options.readOnly && ((nextPage === null) || (this.page === (this.pages.length - 1)));\n            default:\n                return true;\n        }\n    }\n    pageId(page) {\n        if (page.key) {\n            // Some panels have the same key....\n            return `${page.key}-${page.title}`;\n        }\n        else if (page.components &&\n            page.components.length > 0) {\n            return this.pageId(page.components[0]);\n        }\n        else {\n            return page.title;\n        }\n    }\n    onChange(flags, changed, modified, changes) {\n        var _a;\n        super.onChange(flags, changed, modified, changes);\n        // The onChange loop doesn't need all components for wizards\n        const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : this.validateCurrentPage();\n        if (this.alert) {\n            this.showErrors(errors, true, true);\n        }\n        // If the pages change, need to redraw the header.\n        const currentPanels = this.pages;\n        // calling this.establishPages() updates/mutates this.pages to be the current pages\n        this.establishPages();\n        const newPanels = this.pages;\n        const currentNextPage = this.currentNextPage;\n        const panelsUpdated = !lodash_1.default.isEqual(newPanels, currentPanels);\n        if (((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.id) && this.pages.length && (!this.hasSubWizards || (this.hasSubWizards && panelsUpdated))) {\n            const newIndex = this.pages.findIndex(page => page.id === this.currentPanel.id);\n            if (newIndex !== -1)\n                this.setPage(newIndex);\n        }\n        if (panelsUpdated || (flags && flags.fromSubmission)) {\n            this.redrawHeader();\n        }\n        // If the next page changes, then make sure to redraw navigation.\n        if (currentNextPage !== this.getNextPage()) {\n            this.redrawNavigation();\n        }\n        if (this.options.readOnly && (this.prefixComps.length || this.suffixComps.length)) {\n            this.redraw();\n        }\n    }\n    rebuild() {\n        const currentPage = this.page;\n        const setCurrentPage = () => this.setPage(currentPage);\n        return super.rebuild().then(setCurrentPage);\n    }\n    checkValidity(data, dirty, row, currentPageOnly, childErrors = []) {\n        if (!this.checkCondition(row, data)) {\n            this.setCustomValidity('');\n            return true;\n        }\n        const components = !currentPageOnly || this.isLastPage()\n            ? this.getComponents()\n            : this.currentPage.components;\n        return components.reduce((check, comp) => comp.checkValidity(data, dirty, row, currentPageOnly, childErrors) && check, true);\n    }\n    get errors() {\n        return !this.isLastPage() && !this.submitted ? this.currentPage.errors : super.errors;\n    }\n    focusOnComponent(key) {\n        const component = this.getComponent(key);\n        if (component) {\n            let topPanel = component.parent;\n            while (!(topPanel.parent instanceof Wizard)) {\n                topPanel = topPanel.parent;\n            }\n            const pageIndex = this.pages.findIndex(page => page.id === topPanel.id);\n            if (pageIndex >= 0) {\n                const page = this.pages[pageIndex];\n                if (page && page !== this.currentPage) {\n                    return this.setPage(pageIndex).then(() => {\n                        this.showErrors(this.validate(this.localData, { dirty: true }));\n                        super.focusOnComponent(key);\n                    });\n                }\n            }\n        }\n        return super.focusOnComponent(key);\n    }\n    triggerButtonCaptcha(page) {\n        if (!page.components) {\n            return;\n        }\n        let captchaComponent;\n        page.eachComponent((component) => {\n            if (/^(re)?captcha$/.test(component.component.type) &&\n                component.component.eventType === 'buttonClick' &&\n                component.component.buttonKey === 'submit') {\n                captchaComponent = component;\n            }\n        });\n        if (captchaComponent) {\n            captchaComponent.verify(`submitClick`);\n        }\n    }\n}\nexports[\"default\"] = Wizard;\nWizard.setBaseUrl = Formio_1.Formio.setBaseUrl;\nWizard.setApiUrl = Formio_1.Formio.setApiUrl;\nWizard.setAppUrl = Formio_1.Formio.setAppUrl;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Wizard.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 Webform_1 = __importDefault(__webpack_require__(/*! ./Webform */ \"./lib/cjs/Webform.js\"));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst utils_1 = __webpack_require__(/*! ./utils */ \"./lib/cjs/utils/index.js\");\nclass Wizard extends Webform_1.default {\n    /**\n     * Constructor for wizard-based forms.\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     *    - breadcrumbSettings.clickable: true (default) - determines if the breadcrumb bar is clickable.\n     *    - buttonSettings.show*(Previous, Next, Cancel): true (default) - determines if the button is shown.\n     *    - allowPrevious: false (default) - determines if the breadcrumb bar is clickable for visited tabs.\n     */\n    constructor(elementOrOptions = undefined, _options = undefined) {\n        let element, options;\n        if (elementOrOptions instanceof HTMLElement || _options) {\n            element = elementOrOptions;\n            options = _options || {};\n        }\n        else {\n            options = elementOrOptions || {};\n        }\n        options.display = 'wizard';\n        super(element, options);\n        this.pages = [];\n        this.prefixComps = [];\n        this.suffixComps = [];\n        this.components = [];\n        this.originalComponents = [];\n        this.page = 0;\n        this.currentPanel = null;\n        this.currentNextPage = 0;\n        this._seenPages = [0];\n        this.subWizards = [];\n        this.allPages = [];\n        this.lastPromise = Promise.resolve();\n        this.enabledIndex = 0;\n        this.editMode = false;\n        this.originalOptions = lodash_1.default.cloneDeep(this.options);\n    }\n    isLastPage() {\n        const next = this.getNextPage();\n        if (lodash_1.default.isNumber(next)) {\n            return next === -1;\n        }\n        return lodash_1.default.isNull(next);\n    }\n    getPages(args = {}) {\n        const { all = false } = args;\n        const pages = this.hasSubWizards ? this.components : this.pages;\n        const filteredPages = pages\n            .filter(all ? lodash_1.default.identity : (p, index) => this._seenPages.includes(index));\n        return filteredPages;\n    }\n    get hasSubWizards() {\n        return !lodash_1.default.isEmpty(this.subWizards);\n    }\n    get data() {\n        return super.data;\n    }\n    get localData() {\n        var _a, _b;\n        return ((_b = (_a = this.pages[this.page]) === null || _a === void 0 ? void 0 : _a.root) === null || _b === void 0 ? void 0 : _b.submission.data) || this.submission.data;\n    }\n    checkConditions(data, flags, row) {\n        const visible = super.checkConditions(data, flags, row);\n        this.establishPages(data);\n        return visible;\n    }\n    set data(value) {\n        this._data = value;\n        lodash_1.default.each(this.getPages({ all: true }), (component) => {\n            component.data = this.componentContext(component);\n        });\n    }\n    getComponents() {\n        return this.submitting\n            ? this.getPages({ all: this.isLastPage() })\n            : super.getComponents();\n    }\n    resetValue() {\n        this.getPages({ all: true }).forEach((page) => page.resetValue());\n        this.setPristine(true);\n    }\n    init() {\n        var _a;\n        // Check for and initlize button settings object\n        this.options.buttonSettings = lodash_1.default.defaults(this.options.buttonSettings, {\n            showPrevious: true,\n            showNext: true,\n            showSubmit: true,\n            showCancel: !this.options.readOnly\n        });\n        this.options.breadcrumbSettings = lodash_1.default.defaults(this.options.breadcrumbSettings, {\n            clickable: true\n        });\n        this.options.allowPrevious = this.options.allowPrevious || false;\n        this.page = 0;\n        const onReady = super.init();\n        this.setComponentSchema();\n        if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[this.page]) {\n            this.component = this.pages[this.page].component;\n        }\n        this.on('subWizardsUpdated', (subForm) => {\n            const subWizard = this.subWizards.find(subWizard => { var _a; return (subForm === null || subForm === void 0 ? void 0 : subForm.id) && ((_a = subWizard.subForm) === null || _a === void 0 ? void 0 : _a.id) === (subForm === null || subForm === void 0 ? void 0 : subForm.id); });\n            if (this.subWizards.length && subWizard) {\n                subWizard.subForm.setValue(subForm._submission, {}, true);\n                this.establishPages();\n                this.redraw();\n            }\n        });\n        return onReady;\n    }\n    get wizardKey() {\n        return `wizard-${this.id}`;\n    }\n    get wizard() {\n        return this.form;\n    }\n    set wizard(form) {\n        this.setForm(form);\n    }\n    get buttons() {\n        const buttons = {};\n        [\n            { name: 'cancel', method: 'cancel' },\n            { name: 'previous', method: 'prevPage' },\n            { name: 'next', method: 'nextPage' },\n            { name: 'submit', method: 'submit' }\n        ].forEach((button) => {\n            if (this.hasButton(button.name)) {\n                buttons[button.name] = button;\n            }\n        });\n        return buttons;\n    }\n    get buttonOrder() {\n        var _a, _b, _c;\n        const defaultButtonOrder = [\n            'cancel',\n            'previous',\n            'next',\n            'submit'\n        ];\n        return (_c = (_b = (_a = this.options.properties) === null || _a === void 0 ? void 0 : _a.wizardButtonOrder) === null || _b === void 0 ? void 0 : _b.toLowerCase().split(', ')) !== null && _c !== void 0 ? _c : defaultButtonOrder;\n    }\n    get renderContext() {\n        var _a, _b;\n        return {\n            disableWizardSubmit: this.form.disableWizardSubmit,\n            wizardKey: this.wizardKey,\n            isBreadcrumbClickable: this.isBreadcrumbClickable(),\n            isSubForm: !!this.parent && !((_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.type) === 'wizard',\n            panels: this.allPages.length ? this.allPages.map(page => page.component) : this.pages.map(page => page.component),\n            buttons: this.buttons,\n            currentPage: this.page,\n            buttonOrder: this.buttonOrder,\n        };\n    }\n    prepareNavigationSettings(ctx) {\n        const currentPanel = this.currentPanel;\n        if (currentPanel && currentPanel.buttonSettings) {\n            Object.keys(currentPanel.buttonSettings).forEach(() => {\n                Object.keys(ctx.buttons).forEach(key => {\n                    if (typeof currentPanel.buttonSettings[key] !== 'undefined' && !currentPanel.buttonSettings[key] || ctx.isSubForm) {\n                        ctx.buttons[key] = null;\n                    }\n                });\n            });\n        }\n        return this.renderTemplate('wizardNav', ctx);\n    }\n    prepareHeaderSettings(ctx, headerType) {\n        var _a;\n        const shouldHideBreadcrumbs = ((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.breadcrumb) === 'none' ||\n            lodash_1.default.get(this.form, 'settings.wizardBreadcrumbsType', '') === 'none';\n        if (shouldHideBreadcrumbs || ctx.isSubForm) {\n            return null;\n        }\n        return this.renderTemplate(headerType, ctx);\n    }\n    render() {\n        const ctx = this.renderContext;\n        if (this.component.id) {\n            ctx.panels.forEach(panel => {\n                if (panel.id === this.component.id) {\n                    this.currentPanel = panel;\n                    ctx.wizardPageTooltip = this.getFormattedTooltip(panel.tooltip);\n                }\n            });\n        }\n        const wizardNav = this.prepareNavigationSettings(ctx);\n        const wizardHeaderType = `wizardHeader${lodash_1.default.get(this.form, 'settings.wizardHeaderType', '')}`;\n        const wizardHeaderLocation = lodash_1.default.get(this.form, 'settings.wizardHeaderLocation', 'left');\n        const wizardHeader = this.prepareHeaderSettings(ctx, wizardHeaderType);\n        return this.renderTemplate('wizard', Object.assign(Object.assign({}, ctx), { className: super.getClassName(), wizardHeader,\n            wizardHeaderType,\n            wizardHeaderLocation,\n            wizardNav, components: this.renderComponents([\n                ...this.prefixComps,\n                ...this.currentPage.components,\n                ...this.suffixComps\n            ]) }), this.builderMode ? 'builder' : 'form');\n    }\n    redrawNavigation() {\n        if (this.element) {\n            let navElement = this.element.querySelector(`#${this.wizardKey}-nav`);\n            if (navElement) {\n                this.detachNav();\n                navElement.outerHTML = this.renderTemplate('wizardNav', this.renderContext);\n                navElement = this.element.querySelector(`#${this.wizardKey}-nav`);\n                this.loadRefs(navElement, {\n                    [`${this.wizardKey}-cancel`]: 'single',\n                    [`${this.wizardKey}-previous`]: 'single',\n                    [`${this.wizardKey}-next`]: 'single',\n                    [`${this.wizardKey}-submit`]: 'single',\n                });\n                this.attachNav();\n            }\n        }\n    }\n    redrawHeader() {\n        if (this.element) {\n            let headerElement = this.element.querySelector(`#${this.wizardKey}-header`);\n            if (headerElement) {\n                this.detachHeader();\n                headerElement.outerHTML = this.renderTemplate(`wizardHeader${lodash_1.default.get(this.form, 'settings.wizardHeaderType', '')}`, this.renderContext);\n                headerElement = this.element.querySelector(`#${this.wizardKey}-header`);\n                this.loadRefs(headerElement, {\n                    [`${this.wizardKey}-link`]: 'multiple',\n                    [`${this.wizardKey}-tooltip`]: 'multiple'\n                });\n                this.attachHeader();\n            }\n        }\n    }\n    /**\n     * Attaches the wizard to the provided DOM element, initializes component references, sets up navigation,\n     * and emits a render event. It will initialize the wizard's index if necessary,\n     * attach event hooks, and make sure that the current page is rendered and displayed correctly.\n     * @param {HTMLElement} element - The DOM element to which the wizard will be attached.\n     * @returns {Promise} A promise that resolves when all components have been successfully attached.\n     */\n    attach(element) {\n        var _a;\n        this.setElement(element);\n        this.loadRefs(element, {\n            [this.wizardKey]: 'single',\n            [`${this.wizardKey}-header`]: 'single',\n            [`${this.wizardKey}-cancel`]: 'single',\n            [`${this.wizardKey}-previous`]: 'single',\n            [`${this.wizardKey}-next`]: 'single',\n            [`${this.wizardKey}-submit`]: 'single',\n            [`${this.wizardKey}-link`]: 'multiple',\n            [`${this.wizardKey}-tooltip`]: 'multiple'\n        });\n        if ((this.options.readOnly || this.editMode) && !this.enabledIndex) {\n            this.enabledIndex = ((_a = this.pages) === null || _a === void 0 ? void 0 : _a.length) - 1;\n        }\n        this.hook('attachWebform', element, this);\n        const promises = this.attachComponents(this.refs[this.wizardKey], [\n            ...this.prefixComps,\n            ...this.currentPage.components,\n            ...this.suffixComps,\n        ]);\n        this.attachNav();\n        this.attachHeader();\n        return promises.then(() => {\n            this.emit('render', { component: this.currentPage, page: this.page });\n            if (this.component.scrollToTop) {\n                this.scrollPageToTop();\n            }\n        });\n    }\n    scrollPageToTop() {\n        var _a;\n        const pageTop = (_a = this.refs[`${this.wizardKey}-header`]) !== null && _a !== void 0 ? _a : this.refs[this.wizardKey];\n        if (!pageTop) {\n            return;\n        }\n        if ('scrollIntoView' in pageTop) {\n            pageTop.scrollIntoView(true);\n        }\n        else {\n            this.scrollIntoView(pageTop);\n        }\n    }\n    isBreadcrumbClickable() {\n        let currentPage = null;\n        this.pages.map(page => {\n            if (lodash_1.default.isEqual(this.currentPage.component, page.component)) {\n                currentPage = page;\n            }\n        });\n        if (lodash_1.default.has(currentPage, 'component.breadcrumbClickable')) {\n            return lodash_1.default.get(currentPage, 'component.breadcrumbClickable');\n        }\n        if (lodash_1.default.has(this.options, 'breadcrumbSettings.clickable')) {\n            return this.options.breadcrumbSettings.clickable;\n        }\n        return true;\n    }\n    isAllowPrevious() {\n        let currentPage = null;\n        this.pages.map(page => {\n            if (lodash_1.default.isEqual(this.currentPage.component, page.component)) {\n                currentPage = page;\n            }\n        });\n        return lodash_1.default.get(currentPage.component, 'allowPrevious', this.options.allowPrevious);\n    }\n    /**\n     * Handles navigate on 'Enter' key event in a wizard form.\n     * @param {KeyboardEvent} event - The keyboard event object that triggered the handler.\n     */\n    handleNaviageteOnEnter(event) {\n        if (event.keyCode === 13) {\n            const clickEvent = new CustomEvent('click');\n            const buttonElement = this.refs[`${this.wizardKey}-${this.buttons.next.name}`];\n            if (buttonElement) {\n                buttonElement.dispatchEvent(clickEvent);\n            }\n        }\n    }\n    /**\n     * Handles save on 'Enter' key event in a wizard form.\n     * @param {KeyboardEvent} event - The keyboard event object that triggered the handler.\n     */\n    handleSaveOnEnter(event) {\n        if (event.keyCode === 13) {\n            const clickEvent = new CustomEvent('click');\n            const buttonElement = this.refs[`${this.wizardKey}-${this.buttons.submit.name}`];\n            if (buttonElement) {\n                buttonElement.dispatchEvent(clickEvent);\n            }\n        }\n    }\n    attachNav() {\n        if (this.component.navigateOnEnter) {\n            this.addEventListener(document, 'keyup', this.handleNaviageteOnEnter.bind(this));\n        }\n        if (this.component.saveOnEnter) {\n            this.addEventListener(document, 'keyup', this.handleSaveOnEnter.bind(this));\n        }\n        lodash_1.default.each(this.buttons, (button) => {\n            const buttonElement = this.refs[`${this.wizardKey}-${button.name}`];\n            this.addEventListener(buttonElement, 'click', (event) => {\n                event.preventDefault();\n                // Disable the button until done.\n                buttonElement.setAttribute('disabled', 'disabled');\n                this.setLoading(buttonElement, true);\n                // Call the button method, then re-enable the button.\n                this[button.method]().then(() => {\n                    buttonElement.removeAttribute('disabled');\n                    this.setLoading(buttonElement, false);\n                }).catch(() => {\n                    buttonElement.removeAttribute('disabled');\n                    this.setLoading(buttonElement, false);\n                });\n            });\n        });\n    }\n    /**\n     * Emits an event indicating that a wizard page has been selected.\n     * @param {number} index - Index of the selected wizard page in the `pages` array.\n     * @fires emit - Emits the 'wizardPageSelected' event with the page object and index.\n     */\n    emitWizardPageSelected(index) {\n        this.emit('wizardPageSelected', this.pages[index], index);\n    }\n    attachHeader() {\n        var _a, _b;\n        const isAllowPrevious = this.isAllowPrevious();\n        this.attachTooltips(this.refs[`${this.wizardKey}-tooltip`], (_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.tooltip);\n        if (this.isBreadcrumbClickable() || isAllowPrevious) {\n            (_b = this.refs[`${this.wizardKey}-link`]) === null || _b === void 0 ? void 0 : _b.forEach((link, index) => {\n                if (!isAllowPrevious || index <= this.enabledIndex) {\n                    this.addEventListener(link, 'click', (event) => {\n                        this.emit('wizardNavigationClicked', this.pages[index]);\n                        event.preventDefault();\n                        return this.setPage(index).then(() => {\n                            this.emitWizardPageSelected(index);\n                        });\n                    });\n                }\n            });\n        }\n    }\n    detachNav() {\n        if (this.component.navigateOnEnter) {\n            this.removeEventListener(document, 'keyup', this.handleNaviageteOnEnter.bind(this));\n        }\n        if (this.component.saveOnEnter) {\n            this.removeEventListener(document, 'keyup', this.handleSaveOnEnter.bind(this));\n        }\n        lodash_1.default.each(this.buttons, (button) => {\n            this.removeEventListener(this.refs[`${this.wizardKey}-${button.name}`], 'click');\n        });\n    }\n    detachHeader() {\n        if (this.refs[`${this.wizardKey}-link`]) {\n            this.refs[`${this.wizardKey}-link`].forEach((link) => {\n                this.removeEventListener(link, 'click');\n            });\n        }\n    }\n    transformPages() {\n        const allComponents = [];\n        const components = this.getSortedComponents(this);\n        let defferedComponents = [];\n        this.allPages = [];\n        // Get all components including all nested components and line up in the correct order\n        const getAllComponents = (nestedComp, compsArr, pushAllowed = true) => {\n            const nestedPages = [];\n            const dataArrayComponents = ['datagrid', 'editgrid', 'dynamicWizard'];\n            const currentComponents = (nestedComp === null || nestedComp === void 0 ? void 0 : nestedComp.subForm) ? this.getSortedComponents(nestedComp.subForm) : (nestedComp === null || nestedComp === void 0 ? void 0 : nestedComp.components) || [];\n            const visibleComponents = currentComponents.filter(comp => comp._visible);\n            const filteredComponents = visibleComponents.filter(comp => !dataArrayComponents.includes(comp.component.type) && (comp.type !== 'form' || comp.isNestedWizard));\n            const additionalComponents = currentComponents.filter(comp => { var _a; return ((_a = comp.subForm) === null || _a === void 0 ? void 0 : _a._form.display) !== 'wizard'; });\n            let hasNested = false;\n            (0, utils_1.eachComponent)(filteredComponents, (comp) => {\n                if (comp && comp.component) {\n                    if (comp.component.type === 'panel' && (comp === null || comp === void 0 ? void 0 : comp.parent.wizard) && !getAllComponents(comp, compsArr, false)) {\n                        if (pushAllowed) {\n                            this.setRootPanelId(comp);\n                            nestedPages.push(comp);\n                        }\n                        hasNested = true;\n                    }\n                    if (comp.isNestedWizard && comp.subForm) {\n                        const hasNestedForm = getAllComponents(comp, nestedPages, pushAllowed);\n                        if (!hasNested) {\n                            hasNested = hasNestedForm;\n                        }\n                    }\n                }\n            }, true);\n            if (nestedComp.component.type === 'panel') {\n                if (!hasNested && pushAllowed) {\n                    this.setRootPanelId(nestedComp);\n                    compsArr.push(nestedComp);\n                }\n                if (hasNested && additionalComponents.length) {\n                    const newComp = lodash_1.default.clone(nestedComp);\n                    newComp.components = additionalComponents;\n                    this.setRootPanelId(newComp);\n                    defferedComponents.push(newComp);\n                }\n            }\n            if (pushAllowed) {\n                compsArr.push(...defferedComponents, ...nestedPages);\n                defferedComponents = [];\n            }\n            return hasNested;\n        };\n        components.forEach((component) => {\n            if (component.visible) {\n                getAllComponents(component, allComponents);\n            }\n        }, []);\n        // recalculate pages only for root wizards, including the situation when the wizard is in a wrapper\n        if (this.localRoot && this.id === this.localRoot.id) {\n            allComponents.forEach((comp, index) => {\n                comp.eachComponent((component) => {\n                    component.page = index;\n                });\n            });\n        }\n        this.allPages = allComponents;\n    }\n    getSortedComponents({ components, originalComponents }) {\n        const currentComponents = [];\n        const currentPages = [];\n        if (components && components.length) {\n            components.map(page => {\n                if (page.component.type === 'panel') {\n                    currentPages[page.component.key || page.component.title] = page;\n                }\n            });\n        }\n        originalComponents === null || originalComponents === void 0 ? void 0 : originalComponents.forEach((item) => {\n            if (!item.key) {\n                item.key = item.title;\n            }\n            if (currentPages[item.key]) {\n                currentComponents.push(currentPages[item.key]);\n            }\n        });\n        return currentComponents;\n    }\n    findRootPanel(component) {\n        var _a;\n        return ((_a = component.parent) === null || _a === void 0 ? void 0 : _a.parent) ? this.findRootPanel(component.parent) : component;\n    }\n    setRootPanelId(component) {\n        var _a;\n        if (component.rootPanelId && component.rootPanelId !== component.id) {\n            return;\n        }\n        const parent = ((_a = component.parent) === null || _a === void 0 ? void 0 : _a.parent) ? this.findRootPanel(component.parent) : component;\n        component.rootPanelId = parent.id;\n    }\n    establishPages(data = this.data) {\n        this.pages = [];\n        this.prefixComps = [];\n        this.suffixComps = [];\n        const visible = [];\n        const currentPages = {};\n        const pageOptions = Object.assign(Object.assign({}, (lodash_1.default.clone(this.options))), (this.parent ? { root: this } : {}));\n        if (this.components && this.components.length) {\n            this.components.forEach(page => {\n                if (page.component.type === 'panel') {\n                    currentPages[page.component.key || page.component.title] = page;\n                }\n            });\n        }\n        if (this.originalComponents) {\n            this.originalComponents.forEach((item) => {\n                if (item.type === 'panel') {\n                    if (!item.key) {\n                        item.key = item.title;\n                    }\n                    let page = currentPages[item.key];\n                    const forceShow = this.shouldForceShow(item);\n                    const forceHide = this.shouldForceHide(item);\n                    let isVisible = !page\n                        ? (0, utils_1.checkCondition)(item, data, data, this.component, this) && !item.hidden\n                        : page.visible;\n                    if (forceShow) {\n                        isVisible = true;\n                    }\n                    else if (forceHide) {\n                        isVisible = false;\n                    }\n                    if (isVisible) {\n                        visible.push(item);\n                        if (page) {\n                            this.pages.push(page);\n                        }\n                    }\n                    if (!page && isVisible) {\n                        page = this.createComponent(item, pageOptions);\n                        page.visible = isVisible;\n                        this.pages.push(page);\n                        page.eachComponent((component) => {\n                            component.page = (this.pages.length - 1);\n                        });\n                    }\n                }\n                else if (item.type !== 'button') {\n                    if (!this.pages.length) {\n                        this.prefixComps.push(this.createComponent(item, pageOptions));\n                    }\n                    else {\n                        this.suffixComps.push(this.createComponent(item, pageOptions));\n                    }\n                }\n            });\n        }\n        if (this.pages.length) {\n            this.emit('pagesChanged');\n        }\n        this.transformPages();\n        if (this.allPages && this.allPages.length) {\n            this.updatePages();\n        }\n        return visible;\n    }\n    updatePages() {\n        this.pages = this.allPages;\n    }\n    addComponents() {\n        this.establishPages();\n    }\n    setPage(num) {\n        if (num === this.page) {\n            return Promise.resolve();\n        }\n        if (num >= 0 && num < this.pages.length) {\n            this.page = num;\n            this.pageFieldLogic(num);\n            this.getNextPage();\n            let parentNum = num;\n            if (this.hasSubWizards) {\n                const pageFromPages = this.pages[num];\n                const pageFromComponents = this.components[num];\n                if (!pageFromComponents || (pageFromPages === null || pageFromPages === void 0 ? void 0 : pageFromPages.id) !== pageFromComponents.id) {\n                    parentNum = this.components.findIndex(comp => {\n                        var _a, _b;\n                        return comp.id === ((_b = (_a = this.pages) === null || _a === void 0 ? void 0 : _a[parentNum]) === null || _b === void 0 ? void 0 : _b.rootPanelId);\n                    });\n                }\n            }\n            if (!this._seenPages.includes(parentNum)) {\n                this._seenPages = this._seenPages.concat(parentNum);\n            }\n            this.redraw().then(() => {\n                this.checkData(this.submission.data);\n                this.triggerCaptcha(this.currentPage.components);\n                const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : this.validateCurrentPage();\n                if (this.alert) {\n                    this.showErrors(errors, true, true);\n                }\n            });\n            return Promise.resolve();\n        }\n        else if (!this.pages.length) {\n            this.redraw();\n            return Promise.resolve();\n        }\n        return Promise.reject('Page not found');\n    }\n    pageFieldLogic(page) {\n        var _a;\n        if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[page]) {\n            // Handle field logic on pages.\n            this.component = this.pages[page].component;\n            this.originalComponent = (0, utils_1.fastCloneDeep)(this.component);\n            this.fieldLogic(this.data);\n            // If disabled changed, be sure to distribute the setting.\n            this.disabled = this.shouldDisabled;\n        }\n    }\n    get currentPage() {\n        return (this.pages && (this.pages.length >= this.page)) ? this.pages[this.page] : { components: [] };\n    }\n    getNextPage() {\n        var _a;\n        if ((_a = this.pages) === null || _a === void 0 ? void 0 : _a[this.page]) {\n            const data = this.submission.data;\n            const form = this.pages[this.page].component;\n            // Check conditional nextPage\n            if (form) {\n                const page = this.pages.length > (this.page + 1) && !this.showAllErrors ? this.page + 1 : -1;\n                if (form.nextPage) {\n                    const next = this.evaluate(form.nextPage, {\n                        next: page,\n                        data,\n                        page,\n                        form\n                    }, 'next');\n                    if (next === null) {\n                        this.currentNextPage = null;\n                        return null;\n                    }\n                    const pageNum = parseInt(next, 10);\n                    if (!isNaN(parseInt(pageNum, 10)) && isFinite(pageNum)) {\n                        this.currentNextPage = pageNum;\n                        return pageNum;\n                    }\n                    this.currentNextPage = this.getPageIndexByKey(next);\n                    return this.currentNextPage;\n                }\n                this.currentNextPage = page;\n                return page;\n            }\n            this.currentNextPage = null;\n        }\n        return null;\n    }\n    getPreviousPage() {\n        return this.page - 1;\n    }\n    beforeSubmit() {\n        const pages = this.getPages({ all: true });\n        return Promise.all(pages.map((page) => {\n            this.triggerButtonCaptcha(page);\n            page.options.beforeSubmit = true;\n            return page.beforeSubmit();\n        }));\n    }\n    beforePage(next) {\n        return new Promise((resolve, reject) => {\n            this.hook(next ? 'beforeNext' : 'beforePrev', this.currentPage, this.submission, (err) => {\n                if (err) {\n                    this.showErrors(err, true);\n                    reject(err);\n                }\n                const form = this.currentPage;\n                if (form) {\n                    form.beforePage(next).then(resolve).catch(reject);\n                }\n                else {\n                    resolve();\n                }\n            });\n        });\n    }\n    emitNextPage() {\n        this.emit('nextPage', { page: this.page, submission: this.submission });\n    }\n    nextPage() {\n        // Read-only forms should not worry about validation before going to next page, nor should they submit.\n        if (this.options.readOnly) {\n            return this.beforePage(true).then(() => {\n                return this.setPage(this.getNextPage()).then(() => {\n                    this.emitNextPage();\n                });\n            });\n        }\n        // Validate the form before going to the next page\n        const currentPageErrors = this.validateCurrentPage({ dirty: true });\n        const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : currentPageErrors;\n        // allow going to the next page if the current page is valid, even if there are form level errors\n        if (currentPageErrors.length === 0) {\n            this.checkData(this.submission.data);\n            return this.beforePage(true).then(() => {\n                return this.setPage(this.getNextPage()).then(() => {\n                    if (!(this.options.readOnly || this.editMode) && this.enabledIndex < this.page) {\n                        this.enabledIndex = this.page;\n                        this.redraw();\n                    }\n                    this.emitNextPage();\n                });\n            });\n        }\n        else {\n            this.currentPage.components.forEach((comp) => comp.setPristine(false));\n            this.scrollIntoView(this.element, true);\n            return Promise.reject(this.showErrors(errors, true));\n        }\n    }\n    validateCurrentPage(flags = {}) {\n        var _a, _b, _c, _d;\n        const components = (_a = this.currentPage) === null || _a === void 0 ? void 0 : _a.components.map((component) => component.component);\n        // Accessing the parent ensures the right instance (whether it's the parent Wizard or a nested Wizard) performs its validation\n        if ((_b = this.currentPage) === null || _b === void 0 ? void 0 : _b.parent) {\n            return (_c = this.currentPage) === null || _c === void 0 ? void 0 : _c.parent.validateComponents(components, this.root.data, flags);\n        }\n        return (_d = this.currentPage) === null || _d === void 0 ? void 0 : _d.validateComponents(components, this.root ? this.root.data : this.data, flags);\n    }\n    emitPrevPage() {\n        this.emit('prevPage', { page: this.page, submission: this.submission });\n    }\n    prevPage() {\n        return this.beforePage().then(() => {\n            return this.setPage(this.getPreviousPage()).then(() => {\n                this.emitPrevPage();\n            });\n        });\n    }\n    cancel(noconfirm) {\n        if (this.options.readOnly) {\n            return Promise.resolve();\n        }\n        if (super.cancel(noconfirm)) {\n            this.setPristine(true);\n            return this.setPage(0).then(() => {\n                if (this.enabledIndex) {\n                    this.enabledIndex = 0;\n                }\n                this.onChange({ resetValue: true });\n                this.redraw();\n                return this.page;\n            });\n        }\n        return Promise.resolve();\n    }\n    getPageIndexByKey(key) {\n        let pageIndex = this.page;\n        this.pages.forEach((page, index) => {\n            if (page.component.key === key) {\n                pageIndex = index;\n                return false;\n            }\n        });\n        return pageIndex;\n    }\n    get schema() {\n        return this.wizard;\n    }\n    setComponentSchema() {\n        const pageKeys = {};\n        this.originalComponents = [];\n        this.component.components.map((item) => {\n            if (item.type === 'panel') {\n                item.key = (0, utils_1.uniqueKey)(pageKeys, (item.key || 'panel'));\n                pageKeys[item.key] = true;\n                if (this.wizard.full) {\n                    this.options.show = this.options.show || {};\n                    this.options.show[item.key] = true;\n                }\n                else if (Object.prototype.hasOwnProperty.call(this.wizard, 'full')\n                    && !lodash_1.default.isEqual(this.originalOptions.show, this.options.show)) {\n                    this.options.show = Object.assign({}, (this.originalOptions.show || {}));\n                }\n            }\n            this.originalComponents.push(lodash_1.default.clone(item));\n        });\n        if (!Object.keys(pageKeys).length) {\n            const newPage = {\n                type: 'panel',\n                title: 'Page 1',\n                label: 'Page 1',\n                key: 'page1',\n                components: this.component.components\n            };\n            this.component.components = [newPage];\n            this.originalComponents.push(lodash_1.default.clone(newPage));\n        }\n    }\n    setForm(form, flags = {}) {\n        if (!form) {\n            return;\n        }\n        return super.setForm(form, flags);\n    }\n    onSetForm(clonedForm, initialForm) {\n        this.component.components = (this.parent ? initialForm.components : clonedForm.components) || [];\n        this.setComponentSchema();\n    }\n    setEditMode(submission) {\n        if (!this.editMode && submission._id && !this.options.readOnly) {\n            this.editMode = true;\n            this.redraw();\n        }\n    }\n    setValue(submission, flags = {}, ignoreEstablishment) {\n        if (!submission || !submission.data) {\n            submission = {\n                data: {},\n            };\n        }\n        const changed = this.getPages({ all: true }).reduce((changed, page) => {\n            return this.setNestedValue(page, submission.data, flags, changed) || changed;\n        }, false);\n        this.mergeData(this.data, submission.data);\n        if (changed) {\n            this.pageFieldLogic(this.page);\n        }\n        submission.data = this.data;\n        this._submission = submission;\n        if (!ignoreEstablishment) {\n            this.establishPages(submission.data);\n        }\n        this.setEditMode(submission);\n        return changed;\n    }\n    isClickable(page, index) {\n        return this.page !== index && (0, utils_1.firstNonNil)([\n            lodash_1.default.get(page, 'breadcrumbClickable'),\n            this.options.breadcrumbSettings.clickable\n        ]);\n    }\n    hasButton(name, nextPage = this.getNextPage()) {\n        // get page options with global options as default values\n        const { previous = this.options.buttonSettings.showPrevious, cancel = this.options.buttonSettings.showCancel, submit = this.options.buttonSettings.showSubmit, next = this.options.buttonSettings.showNext } = lodash_1.default.get(this.currentPage, 'component.buttonSettings', {});\n        switch (name) {\n            case 'previous':\n                return previous && (this.getPreviousPage() > -1);\n            case 'next':\n                return next && (nextPage !== null) && (nextPage !== -1);\n            case 'cancel':\n                return cancel && !this.options.readOnly;\n            case 'submit':\n                return submit && !this.options.readOnly && ((nextPage === null) || (this.page === (this.pages.length - 1)));\n            default:\n                return true;\n        }\n    }\n    pageId(page) {\n        if (page.key) {\n            // Some panels have the same key....\n            return `${page.key}-${page.title}`;\n        }\n        else if (page.components &&\n            page.components.length > 0) {\n            return this.pageId(page.components[0]);\n        }\n        else {\n            return page.title;\n        }\n    }\n    onChange(flags, changed, modified, changes) {\n        var _a;\n        super.onChange(flags, changed, modified, changes);\n        // The onChange loop doesn't need all components for wizards\n        const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : this.validateCurrentPage();\n        if (this.alert) {\n            this.showErrors(errors, true, true);\n        }\n        // If the pages change, need to redraw the header.\n        const currentPanels = this.pages;\n        // calling this.establishPages() updates/mutates this.pages to be the current pages\n        this.establishPages();\n        const newPanels = this.pages;\n        const currentNextPage = this.currentNextPage;\n        const panelsUpdated = !lodash_1.default.isEqual(newPanels, currentPanels);\n        if (((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.id) && this.pages.length && (!this.hasSubWizards || (this.hasSubWizards && panelsUpdated))) {\n            const newIndex = this.pages.findIndex(page => page.id === this.currentPanel.id);\n            if (newIndex !== -1)\n                this.setPage(newIndex);\n        }\n        if (panelsUpdated || (flags && flags.fromSubmission)) {\n            this.redrawHeader();\n        }\n        // If the next page changes, then make sure to redraw navigation.\n        if (currentNextPage !== this.getNextPage()) {\n            this.redrawNavigation();\n        }\n        if (this.options.readOnly && (this.prefixComps.length || this.suffixComps.length)) {\n            this.redraw();\n        }\n    }\n    rebuild() {\n        const currentPage = this.page;\n        const setCurrentPage = () => this.setPage(currentPage);\n        return super.rebuild().then(setCurrentPage);\n    }\n    checkValidity(data, dirty, row, currentPageOnly, childErrors = []) {\n        if (!this.checkCondition(row, data)) {\n            this.setCustomValidity('');\n            return true;\n        }\n        const components = !currentPageOnly || this.isLastPage()\n            ? this.getComponents()\n            : this.currentPage.components;\n        return components.reduce((check, comp) => comp.checkValidity(data, dirty, row, currentPageOnly, childErrors) && check, true);\n    }\n    get errors() {\n        return !this.isLastPage() && !this.submitted ? this.currentPage.errors : super.errors;\n    }\n    focusOnComponent(key) {\n        const component = this.getComponent(key);\n        if (component) {\n            let topPanel = component.parent;\n            while (!(topPanel.parent instanceof Wizard)) {\n                topPanel = topPanel.parent;\n            }\n            const pageIndex = this.pages.findIndex(page => page.id === topPanel.id);\n            if (pageIndex >= 0) {\n                const page = this.pages[pageIndex];\n                if (page && page !== this.currentPage) {\n                    return this.setPage(pageIndex).then(() => {\n                        this.showErrors(this.validate(this.localData, { dirty: true }));\n                        super.focusOnComponent(key);\n                    });\n                }\n            }\n        }\n        return super.focusOnComponent(key);\n    }\n    triggerButtonCaptcha(page) {\n        if (!page.components) {\n            return;\n        }\n        let captchaComponent;\n        page.eachComponent((component) => {\n            if (/^(re)?captcha$/.test(component.component.type) &&\n                component.component.eventType === 'buttonClick' &&\n                component.component.buttonKey === 'submit') {\n                captchaComponent = component;\n            }\n        });\n        if (captchaComponent) {\n            captchaComponent.verify(`submitClick`);\n        }\n    }\n}\nexports[\"default\"] = Wizard;\nWizard.setBaseUrl = Formio_1.Formio.setBaseUrl;\nWizard.setApiUrl = Formio_1.Formio.setApiUrl;\nWizard.setAppUrl = Formio_1.Formio.setAppUrl;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/Wizard.js?");
 
 /***/ }),
 
@@ -5103,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 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?");
 
 /***/ }),
 
@@ -5224,7 +5213,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 NestedArrayComponent_1 = __importDefault(__webpack_require__(/*! ../_classes/nestedarray/NestedArrayComponent */ \"./lib/cjs/components/_classes/nestedarray/NestedArrayComponent.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\");\nconst dragula_1 = __importDefault(__webpack_require__(/*! dragula */ \"./node_modules/dragula/dragula.js\"));\nclass DataGridComponent extends NestedArrayComponent_1.default {\n    static schema(...extend) {\n        return NestedArrayComponent_1.default.schema({\n            label: 'Data Grid',\n            key: 'dataGrid',\n            type: 'datagrid',\n            clearOnHide: true,\n            input: true,\n            tree: true,\n            components: []\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Data Grid',\n            icon: 'th',\n            group: 'data',\n            documentation: '/userguide/form-building/data-components#data-grid',\n            showPreview: false,\n            weight: 30,\n            schema: DataGridComponent.schema()\n        };\n    }\n    constructor(...args) {\n        super(...args);\n        this.type = 'datagrid';\n        this.tabIndex = 0;\n    }\n    init() {\n        this.components = this.components || [];\n        // Add new values based on minLength.\n        this.rows = [];\n        this.columns = [...this.component.components];\n        if (this.initRows || !lodash_1.default.isEqual(this.dataValue, this.emptyValue)) {\n            this.createRows(true);\n        }\n        this.visibleColumns = {};\n        this.prevHasAddButton = this.hasAddButton();\n        this.checkColumns();\n    }\n    get dataValue() {\n        const dataValue = super.dataValue;\n        if (!dataValue || !Array.isArray(dataValue)) {\n            return this.emptyValue;\n        }\n        return dataValue;\n    }\n    set dataValue(value) {\n        super.dataValue = value;\n    }\n    get defaultSchema() {\n        return DataGridComponent.schema();\n    }\n    get initEmpty() {\n        return this.component.initEmpty || this.component.noFirstRow;\n    }\n    get initRows() {\n        return this.builderMode || this.path === 'defaultValue' || !this.initEmpty;\n    }\n    get emptyValue() {\n        return this.initEmpty ? [] : [{}];\n    }\n    get addAnotherPosition() {\n        return lodash_1.default.get(this.component, 'addAnotherPosition', 'bottom');\n    }\n    get minLength() {\n        if (this.hasRowGroups()) {\n            return lodash_1.default.sum(this.getGroupSizes());\n        }\n        else {\n            return lodash_1.default.get(this.component, 'validate.minLength', 0);\n        }\n    }\n    get defaultValue() {\n        const isBuilderMode = this.builderMode;\n        const isEmptyInit = this.initEmpty;\n        // Ensure we have one and only one row in builder mode.\n        if (isBuilderMode || (isEmptyInit && !this.dataValue.length)) {\n            return isEmptyInit && !isBuilderMode ? [] : [{}];\n        }\n        const value = super.defaultValue;\n        let defaultValue;\n        if (Array.isArray(value)) {\n            defaultValue = value;\n        }\n        else if (value && (typeof value === 'object')) {\n            defaultValue = [value];\n        }\n        else {\n            defaultValue = this.emptyValue;\n        }\n        for (let dIndex = defaultValue.length; dIndex < this.minLength; dIndex++) {\n            defaultValue.push({});\n        }\n        return defaultValue;\n    }\n    set disabled(disabled) {\n        super.disabled = disabled;\n        lodash_1.default.each(this.refs[`${this.datagridKey}-addRow`], (button) => {\n            button.disabled = disabled;\n        });\n        lodash_1.default.each(this.refs[`${this.datagridKey}-removeRow`], (button) => {\n            button.disabled = disabled;\n        });\n    }\n    get disabled() {\n        return super.disabled;\n    }\n    get datagridKey() {\n        return `datagrid-${this.key}`;\n    }\n    get allowReorder() {\n        return !this.options.readOnly && lodash_1.default.get(this.component, 'reorder', false);\n    }\n    get iteratableRows() {\n        return this.rows.map((row, index) => ({\n            components: row,\n            data: this.dataValue[index],\n        }));\n    }\n    isEmpty(value = this.dataValue) {\n        var _a;\n        const isEmpty = super.isEmpty(value);\n        if ((_a = this.components) === null || _a === void 0 ? void 0 : _a.length) {\n            return this.components.reduce((isEmpty, component) => {\n                return isEmpty && component.isEmpty();\n            }, true);\n        }\n        return isEmpty;\n    }\n    /**\n     * Split rows into chunks.\n     * @param {number[]} groups - array of numbers where each item is size of group\n     * @param {Array<T>} rows - rows collection\n     * @returns {Array<T[]>} - The chunked rows\n     */\n    getRowChunks(groups, rows) {\n        const [, chunks] = groups.reduce(([startIndex, acc], size) => {\n            const endIndex = startIndex + size;\n            return [endIndex, [...acc, [startIndex, endIndex]]];\n        }, [0, []]);\n        return chunks.map(range => lodash_1.default.slice(rows, ...range));\n    }\n    /**\n     * Create groups object.\n     * Each key in object represents index of first row in group.\n     * @returns {object} - The groups object.\n     */\n    getGroups() {\n        const groups = lodash_1.default.get(this.component, 'rowGroups', []);\n        const sizes = lodash_1.default.map(groups, 'numberOfRows').slice(0, -1);\n        const indexes = sizes.reduce((groupIndexes, size) => {\n            const last = groupIndexes[groupIndexes.length - 1];\n            return groupIndexes.concat(last + size);\n        }, [0]);\n        return groups.reduce((gidxs, group, idx) => {\n            return Object.assign(Object.assign({}, gidxs), { [indexes[idx]]: group });\n        }, {});\n    }\n    /**\n     * Get group sizes.\n     * @returns {number[]} - The array of group sizes.\n     */\n    getGroupSizes() {\n        return lodash_1.default.map(lodash_1.default.get(this.component, 'rowGroups', []), 'numberOfRows');\n    }\n    hasRowGroups() {\n        return lodash_1.default.get(this, 'component.enableRowGroups', false) && !this.builderMode;\n    }\n    totalRowsNumber(groups) {\n        return lodash_1.default.sum(lodash_1.default.map(groups, 'numberOfRows'));\n    }\n    setStaticValue(n) {\n        this.dataValue = lodash_1.default.range(n).map(() => ({}));\n    }\n    hasExtraColumn() {\n        return (this.hasRemoveButtons() || this.canAddColumn);\n    }\n    hasRemoveButtons() {\n        return !this.builderMode && !this.component.disableAddingRemovingRows &&\n            !this.options.readOnly &&\n            !this.disabled &&\n            this.fullMode &&\n            (this.dataValue.length > lodash_1.default.get(this.component, 'validate.minLength', 0));\n    }\n    hasTopSubmit() {\n        return this.hasAddButton() && ['top', 'both'].includes(this.addAnotherPosition);\n    }\n    hasBottomSubmit() {\n        return this.hasAddButton() && ['bottom', 'both'].includes(this.addAnotherPosition);\n    }\n    get canAddColumn() {\n        return this.builderMode && !this.options.design;\n    }\n    render() {\n        const columns = this.getColumns();\n        let columnExtra = 0;\n        const hasRemoveButtons = this.hasRemoveButtons();\n        if (this.component.reorder) {\n            columnExtra++;\n        }\n        if (hasRemoveButtons) {\n            columnExtra++;\n        }\n        if (this.canAddColumn) {\n            columnExtra++;\n        }\n        const colWidth = Math.floor(12 / (columns.length + columnExtra));\n        return super.render(this.renderTemplate('datagrid', {\n            rows: this.getRows(),\n            columns: columns,\n            groups: this.hasRowGroups() ? this.getGroups() : [],\n            visibleColumns: this.visibleColumns,\n            hasToggle: lodash_1.default.get(this, 'component.groupToggle', false),\n            hasHeader: this.hasHeader(),\n            hasExtraColumn: this.hasExtraColumn(),\n            hasAddButton: this.hasAddButton(),\n            hasRemoveButtons,\n            hasTopSubmit: this.hasTopSubmit(),\n            hasBottomSubmit: this.hasBottomSubmit(),\n            hasGroups: this.hasRowGroups(),\n            numColumns: columns.length + (this.hasExtraColumn() ? 1 : 0),\n            datagridKey: this.datagridKey,\n            allowReorder: this.allowReorder,\n            builder: this.builderMode,\n            canAddColumn: this.canAddColumn,\n            tabIndex: this.tabIndex,\n            placeholder: this.renderTemplate('builderPlaceholder', {\n                position: this.componentComponents.length,\n            }),\n            colWidth: colWidth.toString()\n        }));\n    }\n    getRows() {\n        return this.rows.map(row => {\n            const components = {};\n            lodash_1.default.each(row, (col, key) => {\n                components[key] = col.render();\n            });\n            return components;\n        });\n    }\n    getColumns() {\n        return this.columns.filter((comp) => {\n            return (!this.visibleColumns.hasOwnProperty(comp.key) || this.visibleColumns[comp.key]);\n        });\n    }\n    hasHeader() {\n        return this.component.components.reduce((hasHeader, col) => {\n            // If any of the components has a title and it isn't hidden, display the header.\n            return hasHeader || ((col.label || col.title) && !col.hideLabel);\n        }, false);\n    }\n    attach(element) {\n        this.loadRefs(element, {\n            [`${this.datagridKey}-row`]: 'multiple',\n            [`${this.datagridKey}-tbody`]: 'single',\n            [`${this.datagridKey}-addRow`]: 'multiple',\n            [`${this.datagridKey}-removeRow`]: 'multiple',\n            [`${this.datagridKey}-group-header`]: 'multiple',\n            [this.datagridKey]: 'multiple',\n        });\n        if (this.allowReorder) {\n            this.refs[`${this.datagridKey}-row`].forEach((row, index) => {\n                row.dragInfo = { index };\n            });\n            this.dragula = (0, dragula_1.default)([this.refs[`${this.datagridKey}-tbody`]], {\n                moves: (_draggedElement, _oldParent, clickedElement) => {\n                    const clickedElementKey = clickedElement.getAttribute('data-key');\n                    const oldParentKey = _oldParent.getAttribute('data-key');\n                    //Check if the clicked button belongs to that container, if false, it belongs to the nested container\n                    if (oldParentKey === clickedElementKey) {\n                        return clickedElement.classList.contains('formio-drag-button');\n                    }\n                }\n            }).on('drop', this.onReorder.bind(this));\n            this.dragula.on('cloned', (el, original) => {\n                if (el && el.children && original && original.children) {\n                    lodash_1.default.each(original.children, (child, index) => {\n                        const styles = getComputedStyle(child, null);\n                        if (styles.cssText !== '') {\n                            el.children[index].style.cssText = styles.cssText;\n                        }\n                        else {\n                            const cssText = Object.values(styles).reduce((css, propertyName) => {\n                                return `${css}${propertyName}:${styles.getPropertyValue(propertyName)};`;\n                            }, '');\n                            el.children[index].style.cssText = cssText;\n                        }\n                    });\n                }\n            });\n        }\n        this.refs[`${this.datagridKey}-addRow`].forEach((addButton) => {\n            this.addEventListener(addButton, 'click', this.addRow.bind(this));\n        });\n        this.refs[`${this.datagridKey}-removeRow`].forEach((removeButton, index) => {\n            this.addEventListener(removeButton, 'click', this.removeRow.bind(this, index));\n        });\n        if (this.hasRowGroups()) {\n            this.refs.chunks = this.getRowChunks(this.getGroupSizes(), this.refs[`${this.datagridKey}-row`]);\n            this.refs[`${this.datagridKey}-group-header`].forEach((header, index) => {\n                this.addEventListener(header, 'click', () => this.toggleGroup(header, index));\n            });\n        }\n        const columns = this.getColumns();\n        const rowLength = columns.length;\n        this.rows.forEach((row, rowIndex) => {\n            let columnIndex = 0;\n            columns.forEach((col) => {\n                this.attachComponents(this.refs[this.datagridKey][(rowIndex * rowLength) + columnIndex], [this.rows[rowIndex][col.key]], this.getComponentsContainer());\n                columnIndex++;\n            });\n        });\n        return super.attach(element);\n    }\n    getComponentsContainer() {\n        return this.component.components;\n    }\n    /**\n     * Reorder values in array based on the old and new position\n     * @param {any} valuesArr - An array of values.\n     * @param {number} oldPosition - The index of the value in array before reordering.\n     * @param {number} newPosition - The index of the value in array after reordering.\n     * @param {boolean|any} movedBelow - Whether or not the value is moved below.\n     * @returns {void}\n     */\n    reorderValues(valuesArr, oldPosition, newPosition, movedBelow) {\n        if (!lodash_1.default.isArray(valuesArr) || lodash_1.default.isEmpty(valuesArr)) {\n            return;\n        }\n        const draggedRowData = valuesArr[oldPosition];\n        //insert element at new position\n        valuesArr.splice(newPosition, 0, draggedRowData);\n        //remove element from old position (if was moved above, after insertion it's at +1 index)\n        valuesArr.splice(movedBelow ? oldPosition : oldPosition + 1, 1);\n    }\n    onReorder(element, _target, _source, sibling) {\n        if (!element.dragInfo || (sibling && !sibling.dragInfo)) {\n            console.warn('There is no Drag Info available for either dragged or sibling element');\n            return;\n        }\n        const oldPosition = element.dragInfo.index;\n        //should drop at next sibling position; no next sibling means drop to last position\n        const newPosition = sibling ? sibling.dragInfo.index : this.dataValue.length;\n        const movedBelow = newPosition > oldPosition;\n        const dataValue = (0, utils_1.fastCloneDeep)(this.dataValue);\n        this.reorderValues(dataValue, oldPosition, newPosition, movedBelow);\n        //reorder select data\n        this.reorderValues(lodash_1.default.get(this.root, `submission.metadata.selectData.${this.path}`, []), oldPosition, newPosition, movedBelow);\n        //need to re-build rows to re-calculate indexes and other indexed fields for component instance (like rows for ex.)\n        this.setValue(dataValue, { isReordered: true });\n        this.rebuild();\n    }\n    focusOnNewRowElement(row) {\n        Object.keys(row).find((key) => {\n            const element = row[key].element;\n            if (element) {\n                const focusableElements = (0, utils_1.getFocusableElements)(element);\n                if (focusableElements && focusableElements[0]) {\n                    focusableElements[0].focus();\n                    return true;\n                }\n            }\n            return false;\n        });\n    }\n    addRow() {\n        const index = this.rows.length;\n        // Handle length mismatch between rows and dataValue\n        if (this.dataValue.length === index) {\n            this.dataValue.push({});\n        }\n        let row;\n        const dataValue = this.dataValue;\n        const defaultValue = this.defaultValue;\n        if (this.initEmpty && defaultValue[index]) {\n            row = defaultValue[index];\n            dataValue[index] = row;\n        }\n        else {\n            row = dataValue[index];\n        }\n        this.rows[index] = this.createRowComponents(row, index);\n        this.emit('dataGridAddRow', {\n            component: this.component,\n            row\n        });\n        this.checkConditions();\n        this.triggerChange({ modified: true });\n        this.redraw().then(() => {\n            this.focusOnNewRowElement(this.rows[index]);\n        });\n    }\n    updateComponentsRowIndex(components, rowIndex) {\n        components.forEach((component, colIndex) => {\n            var _a;\n            if ((_a = component.options) === null || _a === void 0 ? void 0 : _a.name) {\n                const newName = `[${this.key}][${rowIndex}]`;\n                component.options.name = component.options.name.replace(`[${this.key}][${component.rowIndex}]`, newName);\n            }\n            component.rowIndex = rowIndex;\n            component.row = `${rowIndex}-${colIndex}`;\n        });\n    }\n    updateRowsComponents(rowIndex) {\n        this.rows.slice(rowIndex).forEach((row, index) => {\n            this.updateComponentsRowIndex(Object.values(row), rowIndex + index);\n        });\n    }\n    removeRow(index) {\n        const makeEmpty = index === 0 && this.rows.length === 1;\n        const flags = { isReordered: !makeEmpty, resetValue: makeEmpty };\n        this.splice(index, flags);\n        this.emit('dataGridDeleteRow', { index });\n        const [row] = this.rows.splice(index, 1);\n        this.removeSubmissionMetadataRow(index);\n        this.removeRowComponents(row);\n        this.updateRowsComponents(index);\n        this.setValue(this.dataValue, flags);\n        this.redraw();\n    }\n    removeRowComponents(row) {\n        lodash_1.default.each(row, (component) => this.removeComponent(component));\n    }\n    getRowValues() {\n        return this.dataValue;\n    }\n    setRowComponentsData(rowIndex, rowData) {\n        lodash_1.default.each(this.rows[rowIndex], (component) => {\n            component.data = rowData;\n        });\n    }\n    createRows(init, rebuild) {\n        let added = false;\n        const rowValues = this.getRowValues();\n        // Create any missing rows.\n        rowValues.forEach((row, index) => {\n            if (!rebuild && this.rows[index]) {\n                this.setRowComponentsData(index, row);\n            }\n            else {\n                if (this.rows[index]) {\n                    this.removeRowComponents(this.rows[index]);\n                }\n                this.rows[index] = this.createRowComponents(row, index);\n                added = true;\n            }\n        });\n        // Delete any extra rows.\n        const removedRows = this.rows.splice(rowValues.length);\n        const removed = !!removedRows.length;\n        // Delete components of extra rows (to make sure that this.components contain only components of exisiting rows)\n        if (removed) {\n            removedRows.forEach(row => this.removeRowComponents(row));\n        }\n        if (!init && (added || removed)) {\n            this.redraw();\n        }\n        return added;\n    }\n    createRowComponents(row, rowIndex) {\n        const components = {};\n        this.tabIndex = 0;\n        this.component.components.map((col, colIndex) => {\n            const options = lodash_1.default.clone(this.options);\n            options.name += `[${rowIndex}]`;\n            options.row = `${rowIndex}-${colIndex}`;\n            options.rowIndex = rowIndex;\n            options.onChange = (flags, changed, modified) => {\n                if (changed.component.type === 'form') {\n                    const formComp = (0, utils_1.getComponent)(this.component.components, changed.component.key);\n                    lodash_1.default.set(formComp, 'components', changed.component.components);\n                }\n                this.triggerChange({ modified });\n            };\n            let columnComponent;\n            if (this.builderMode) {\n                col.id = col.id + rowIndex;\n                columnComponent = col;\n            }\n            else {\n                columnComponent = Object.assign(Object.assign({}, col), { id: (col.id + rowIndex) });\n            }\n            const component = this.createComponent(columnComponent, options, row);\n            component.parentDisabled = !!this.disabled;\n            component.rowIndex = rowIndex;\n            component.inDataGrid = true;\n            if (columnComponent.tabindex &&\n                parseInt(columnComponent.tabindex) > this.tabIndex) {\n                this.tabIndex = parseInt(columnComponent.tabindex);\n            }\n            components[col.key] = component;\n        });\n        return components;\n    }\n    checkColumns(data, flags = {}) {\n        data = data || this.rootValue;\n        let show = false;\n        if (!this.rows || !this.rows.length) {\n            return { rebuild: false, show: false };\n        }\n        if (this.builderMode) {\n            return { rebuild: false, show: true };\n        }\n        const visibility = {};\n        let logicRebuild = false;\n        const dataValue = this.dataValue;\n        this.rows.forEach((row, rowIndex) => {\n            lodash_1.default.each(row, (col, key) => {\n                if (col && (typeof col.checkConditions === 'function')) {\n                    const firstRowCheck = visibility[key] === undefined;\n                    visibility[key] = !!visibility[key] ||\n                        (col.checkConditions(data, flags, dataValue[rowIndex]) && col.type !== 'hidden');\n                    if (col.component.logic && firstRowCheck) {\n                        const compIndex = lodash_1.default.findIndex(this.columns, ['key', key]);\n                        const equalColumns = lodash_1.default.isEqualWith(this.columns[compIndex], col.component, (col1, col2, key) => {\n                            // Don't compare columns by their auto-generated ids.\n                            if (key === 'id') {\n                                return true;\n                            }\n                        });\n                        if (!equalColumns) {\n                            logicRebuild = true;\n                            this.columns[compIndex] = col.component;\n                        }\n                    }\n                }\n            });\n        });\n        const rebuild = !lodash_1.default.isEqual(visibility, this.visibleColumns) || logicRebuild;\n        lodash_1.default.each(visibility, (col) => {\n            show |= col;\n        });\n        this.visibleColumns = visibility;\n        return { rebuild, show };\n    }\n    checkComponentConditions(data, flags, row) {\n        const isVisible = this.visible;\n        // If table isn't visible, don't bother calculating columns.\n        if (!super.checkComponentConditions(data, flags, row)) {\n            return false;\n        }\n        const { rebuild, show } = this.checkColumns(data, flags);\n        // Check if a rebuild is needed or the visibility changes.\n        if (rebuild || !isVisible) {\n            this.createRows(false, rebuild);\n        }\n        // Return if this table should show.\n        return show;\n    }\n    setValue(value, flags = {}) {\n        if (!value) {\n            this.dataValue = this.defaultValue;\n            this.createRows();\n            return false;\n        }\n        if (!Array.isArray(value)) {\n            if (typeof value === 'object') {\n                value = [value];\n            }\n            else {\n                this.createRows();\n                value = [{}];\n            }\n        }\n        // Make sure we always have at least one row.\n        // NOTE: Removing this will break \"Public Configurations\" in portal. ;)\n        if (value && !value.length && !this.initEmpty) {\n            value.push({});\n        }\n        const isSettingSubmission = flags.fromSubmission && !lodash_1.default.isEqual(value, this.emptyValue);\n        const changed = this.hasChanged(value, this.dataValue);\n        this.dataValue = value;\n        if (this.initRows || isSettingSubmission ||\n            (Array.isArray(this.dataValue) && this.dataValue.length !== this.rows.length)) {\n            if (!this.createRows() && changed) {\n                this.redraw();\n            }\n        }\n        if (this.componentModal && isSettingSubmission) {\n            this.componentModal.setValue(value);\n        }\n        this.rows.forEach((row, rowIndex) => {\n            if (value.length <= rowIndex) {\n                return;\n            }\n            lodash_1.default.each(row, (col) => {\n                col.rowIndex = rowIndex;\n                this.setNestedValue(col, value[rowIndex], flags);\n            });\n        });\n        this.updateOnChange(flags, changed);\n        return changed;\n    }\n    toggleGroup(element, index) {\n        element.classList.toggle('collapsed');\n        lodash_1.default.each(this.refs.chunks[index], row => {\n            row.classList.toggle('hidden');\n        });\n    }\n}\nexports[\"default\"] = DataGridComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/datagrid/DataGrid.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 NestedArrayComponent_1 = __importDefault(__webpack_require__(/*! ../_classes/nestedarray/NestedArrayComponent */ \"./lib/cjs/components/_classes/nestedarray/NestedArrayComponent.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\");\nconst dragula_1 = __importDefault(__webpack_require__(/*! dragula */ \"./node_modules/dragula/dragula.js\"));\nclass DataGridComponent extends NestedArrayComponent_1.default {\n    static schema(...extend) {\n        return NestedArrayComponent_1.default.schema({\n            label: 'Data Grid',\n            key: 'dataGrid',\n            type: 'datagrid',\n            clearOnHide: true,\n            input: true,\n            tree: true,\n            components: []\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Data Grid',\n            icon: 'th',\n            group: 'data',\n            documentation: '/userguide/form-building/data-components#data-grid',\n            showPreview: false,\n            weight: 30,\n            schema: DataGridComponent.schema()\n        };\n    }\n    constructor(...args) {\n        super(...args);\n        this.type = 'datagrid';\n        this.tabIndex = 0;\n    }\n    init() {\n        this.components = this.components || [];\n        // Add new values based on minLength.\n        this.rows = [];\n        this.columns = [...this.component.components];\n        if (this.initRows || !lodash_1.default.isEqual(this.dataValue, this.emptyValue)) {\n            this.createRows(true);\n        }\n        this.visibleColumns = {};\n        this.prevHasAddButton = this.hasAddButton();\n        this.checkColumns();\n    }\n    get dataValue() {\n        const dataValue = super.dataValue;\n        if (!dataValue || !Array.isArray(dataValue)) {\n            return this.emptyValue;\n        }\n        return dataValue;\n    }\n    set dataValue(value) {\n        super.dataValue = value;\n    }\n    get defaultSchema() {\n        return DataGridComponent.schema();\n    }\n    get initEmpty() {\n        return this.component.initEmpty || this.component.noFirstRow;\n    }\n    get initRows() {\n        return this.builderMode || this.path === 'defaultValue' || !this.initEmpty;\n    }\n    get emptyValue() {\n        return this.initEmpty ? [] : [{}];\n    }\n    get addAnotherPosition() {\n        return lodash_1.default.get(this.component, 'addAnotherPosition', 'bottom');\n    }\n    get minLength() {\n        if (this.hasRowGroups()) {\n            return lodash_1.default.sum(this.getGroupSizes());\n        }\n        else {\n            return lodash_1.default.get(this.component, 'validate.minLength', 0);\n        }\n    }\n    get defaultValue() {\n        const isBuilderMode = this.builderMode;\n        const isEmptyInit = this.initEmpty;\n        // Ensure we have one and only one row in builder mode.\n        if (isBuilderMode || (isEmptyInit && !this.dataValue.length)) {\n            return isEmptyInit && !isBuilderMode ? [] : [{}];\n        }\n        const value = super.defaultValue;\n        let defaultValue;\n        if (Array.isArray(value)) {\n            defaultValue = value;\n        }\n        else if (value && (typeof value === 'object')) {\n            defaultValue = [value];\n        }\n        else {\n            defaultValue = this.emptyValue;\n        }\n        for (let dIndex = defaultValue.length; dIndex < this.minLength; dIndex++) {\n            defaultValue.push({});\n        }\n        return defaultValue;\n    }\n    set disabled(disabled) {\n        super.disabled = disabled;\n        lodash_1.default.each(this.refs[`${this.datagridKey}-addRow`], (button) => {\n            button.disabled = disabled;\n        });\n        lodash_1.default.each(this.refs[`${this.datagridKey}-removeRow`], (button) => {\n            button.disabled = disabled;\n        });\n    }\n    get disabled() {\n        return super.disabled;\n    }\n    get datagridKey() {\n        return `datagrid-${this.key}`;\n    }\n    get allowReorder() {\n        return !this.options.readOnly && lodash_1.default.get(this.component, 'reorder', false);\n    }\n    get iteratableRows() {\n        return this.rows.map((row, index) => ({\n            components: row,\n            data: this.dataValue[index],\n        }));\n    }\n    isEmpty(value = this.dataValue) {\n        var _a;\n        const isEmpty = super.isEmpty(value);\n        if ((_a = this.components) === null || _a === void 0 ? void 0 : _a.length) {\n            return this.components.reduce((isEmpty, component) => {\n                return isEmpty && component.isEmpty();\n            }, true);\n        }\n        return isEmpty;\n    }\n    /**\n     * Split rows into chunks.\n     * @param {number[]} groups - array of numbers where each item is size of group\n     * @param {Array<T>} rows - rows collection\n     * @returns {Array<T[]>} - The chunked rows\n     */\n    getRowChunks(groups, rows) {\n        const [, chunks] = groups.reduce(([startIndex, acc], size) => {\n            const endIndex = startIndex + size;\n            return [endIndex, [...acc, [startIndex, endIndex]]];\n        }, [0, []]);\n        return chunks.map(range => lodash_1.default.slice(rows, ...range));\n    }\n    /**\n     * Create groups object.\n     * Each key in object represents index of first row in group.\n     * @returns {object} - The groups object.\n     */\n    getGroups() {\n        const groups = lodash_1.default.get(this.component, 'rowGroups', []);\n        const sizes = lodash_1.default.map(groups, 'numberOfRows').slice(0, -1);\n        const indexes = sizes.reduce((groupIndexes, size) => {\n            const last = groupIndexes[groupIndexes.length - 1];\n            return groupIndexes.concat(last + size);\n        }, [0]);\n        return groups.reduce((gidxs, group, idx) => {\n            return Object.assign(Object.assign({}, gidxs), { [indexes[idx]]: group });\n        }, {});\n    }\n    /**\n     * Get group sizes.\n     * @returns {number[]} - The array of group sizes.\n     */\n    getGroupSizes() {\n        return lodash_1.default.map(lodash_1.default.get(this.component, 'rowGroups', []), 'numberOfRows');\n    }\n    hasRowGroups() {\n        return lodash_1.default.get(this, 'component.enableRowGroups', false) && !this.builderMode;\n    }\n    totalRowsNumber(groups) {\n        return lodash_1.default.sum(lodash_1.default.map(groups, 'numberOfRows'));\n    }\n    setStaticValue(n) {\n        this.dataValue = lodash_1.default.range(n).map(() => ({}));\n    }\n    hasExtraColumn() {\n        return (this.hasRemoveButtons() || this.canAddColumn);\n    }\n    hasRemoveButtons() {\n        return !this.builderMode && !this.component.disableAddingRemovingRows &&\n            !this.options.readOnly &&\n            !this.disabled &&\n            this.fullMode &&\n            (this.dataValue.length > lodash_1.default.get(this.component, 'validate.minLength', 0));\n    }\n    hasTopSubmit() {\n        return this.hasAddButton() && ['top', 'both'].includes(this.addAnotherPosition);\n    }\n    hasBottomSubmit() {\n        return this.hasAddButton() && ['bottom', 'both'].includes(this.addAnotherPosition);\n    }\n    get canAddColumn() {\n        return this.builderMode && !this.options.design;\n    }\n    render() {\n        const columns = this.getColumns();\n        let columnExtra = 0;\n        const hasRemoveButtons = this.hasRemoveButtons();\n        if (this.component.reorder) {\n            columnExtra++;\n        }\n        if (hasRemoveButtons) {\n            columnExtra++;\n        }\n        if (this.canAddColumn) {\n            columnExtra++;\n        }\n        const colWidth = Math.floor(12 / (columns.length + columnExtra));\n        return super.render(this.renderTemplate('datagrid', {\n            rows: this.getRows(),\n            columns: columns,\n            groups: this.hasRowGroups() ? this.getGroups() : [],\n            visibleColumns: this.visibleColumns,\n            hasToggle: lodash_1.default.get(this, 'component.groupToggle', false),\n            hasHeader: this.hasHeader(),\n            hasExtraColumn: this.hasExtraColumn(),\n            hasAddButton: this.hasAddButton(),\n            hasRemoveButtons,\n            hasTopSubmit: this.hasTopSubmit(),\n            hasBottomSubmit: this.hasBottomSubmit(),\n            hasGroups: this.hasRowGroups(),\n            numColumns: columns.length + (this.hasExtraColumn() ? 1 : 0),\n            datagridKey: this.datagridKey,\n            allowReorder: this.allowReorder,\n            builder: this.builderMode,\n            canAddColumn: this.canAddColumn,\n            tabIndex: this.tabIndex,\n            placeholder: this.renderTemplate('builderPlaceholder', {\n                position: this.componentComponents.length,\n            }),\n            colWidth: colWidth.toString()\n        }));\n    }\n    getRows() {\n        return this.rows.map(row => {\n            const components = {};\n            lodash_1.default.each(row, (col, key) => {\n                components[key] = col.render();\n            });\n            return components;\n        });\n    }\n    getColumns() {\n        return this.columns.filter((comp) => {\n            return (!this.visibleColumns.hasOwnProperty(comp.key) || this.visibleColumns[comp.key]);\n        });\n    }\n    hasHeader() {\n        return this.component.components.reduce((hasHeader, col) => {\n            // If any of the components has a title and it isn't hidden, display the header.\n            return hasHeader || ((col.label || col.title) && !col.hideLabel);\n        }, false);\n    }\n    attach(element) {\n        this.loadRefs(element, {\n            [`${this.datagridKey}-row`]: 'multiple',\n            [`${this.datagridKey}-tbody`]: 'single',\n            [`${this.datagridKey}-addRow`]: 'multiple',\n            [`${this.datagridKey}-removeRow`]: 'multiple',\n            [`${this.datagridKey}-group-header`]: 'multiple',\n            [this.datagridKey]: 'multiple',\n        });\n        if (this.allowReorder) {\n            this.refs[`${this.datagridKey}-row`].forEach((row, index) => {\n                row.dragInfo = { index };\n            });\n            this.dragula = (0, dragula_1.default)([this.refs[`${this.datagridKey}-tbody`]], {\n                moves: (_draggedElement, _oldParent, clickedElement) => {\n                    const clickedElementKey = clickedElement.getAttribute('data-key');\n                    const oldParentKey = _oldParent.getAttribute('data-key');\n                    //Check if the clicked button belongs to that container, if false, it belongs to the nested container\n                    if (oldParentKey === clickedElementKey) {\n                        return clickedElement.classList.contains('formio-drag-button');\n                    }\n                }\n            }).on('drop', this.onReorder.bind(this));\n            this.dragula.on('cloned', (el, original) => {\n                if (el && el.children && original && original.children) {\n                    lodash_1.default.each(original.children, (child, index) => {\n                        const styles = getComputedStyle(child, null);\n                        if (styles.cssText !== '') {\n                            el.children[index].style.cssText = styles.cssText;\n                        }\n                        else {\n                            const cssText = Object.values(styles).reduce((css, propertyName) => {\n                                return `${css}${propertyName}:${styles.getPropertyValue(propertyName)};`;\n                            }, '');\n                            el.children[index].style.cssText = cssText;\n                        }\n                    });\n                }\n            });\n        }\n        this.refs[`${this.datagridKey}-addRow`].forEach((addButton) => {\n            this.addEventListener(addButton, 'click', this.addRow.bind(this));\n        });\n        this.refs[`${this.datagridKey}-removeRow`].forEach((removeButton, index) => {\n            this.addEventListener(removeButton, 'click', this.removeRow.bind(this, index));\n        });\n        if (this.hasRowGroups()) {\n            this.refs.chunks = this.getRowChunks(this.getGroupSizes(), this.refs[`${this.datagridKey}-row`]);\n            this.refs[`${this.datagridKey}-group-header`].forEach((header, index) => {\n                this.addEventListener(header, 'click', () => this.toggleGroup(header, index));\n            });\n        }\n        const columns = this.getColumns();\n        const rowLength = columns.length;\n        this.rows.forEach((row, rowIndex) => {\n            let columnIndex = 0;\n            columns.forEach((col) => {\n                this.attachComponents(this.refs[this.datagridKey][(rowIndex * rowLength) + columnIndex], [this.rows[rowIndex][col.key]], this.getComponentsContainer());\n                columnIndex++;\n            });\n        });\n        return super.attach(element);\n    }\n    getComponentsContainer() {\n        return this.component.components;\n    }\n    /**\n     * Reorder values in array based on the old and new position\n     * @param {any} valuesArr - An array of values.\n     * @param {number} oldPosition - The index of the value in array before reordering.\n     * @param {number} newPosition - The index of the value in array after reordering.\n     * @param {boolean|any} movedBelow - Whether or not the value is moved below.\n     * @returns {void}\n     */\n    reorderValues(valuesArr, oldPosition, newPosition, movedBelow) {\n        if (!lodash_1.default.isArray(valuesArr) || lodash_1.default.isEmpty(valuesArr)) {\n            return;\n        }\n        const draggedRowData = valuesArr[oldPosition];\n        //insert element at new position\n        valuesArr.splice(newPosition, 0, draggedRowData);\n        //remove element from old position (if was moved above, after insertion it's at +1 index)\n        valuesArr.splice(movedBelow ? oldPosition : oldPosition + 1, 1);\n    }\n    onReorder(element, _target, _source, sibling) {\n        if (!element.dragInfo || (sibling && !sibling.dragInfo)) {\n            console.warn('There is no Drag Info available for either dragged or sibling element');\n            return;\n        }\n        const oldPosition = element.dragInfo.index;\n        //should drop at next sibling position; no next sibling means drop to last position\n        const newPosition = sibling ? sibling.dragInfo.index : this.dataValue.length;\n        const movedBelow = newPosition > oldPosition;\n        const dataValue = (0, utils_1.fastCloneDeep)(this.dataValue);\n        this.reorderValues(dataValue, oldPosition, newPosition, movedBelow);\n        //reorder select data\n        this.reorderValues(lodash_1.default.get(this.root, `submission.metadata.selectData.${this.path}`, []), oldPosition, newPosition, movedBelow);\n        //need to re-build rows to re-calculate indexes and other indexed fields for component instance (like rows for ex.)\n        this.setValue(dataValue, { isReordered: true });\n        this.rebuild();\n    }\n    focusOnNewRowElement(row) {\n        Object.keys(row).find((key) => {\n            const element = row[key].element;\n            if (element) {\n                const focusableElements = (0, utils_1.getFocusableElements)(element);\n                if (focusableElements && focusableElements[0]) {\n                    focusableElements[0].focus();\n                    return true;\n                }\n            }\n            return false;\n        });\n    }\n    addRow() {\n        const index = this.rows.length;\n        // Handle length mismatch between rows and dataValue\n        if (this.dataValue.length === index) {\n            this.dataValue.push({});\n        }\n        let row;\n        const dataValue = this.dataValue;\n        const defaultValue = this.defaultValue;\n        if (this.initEmpty && defaultValue[index]) {\n            row = defaultValue[index];\n            dataValue[index] = row;\n        }\n        else {\n            row = dataValue[index];\n        }\n        this.rows[index] = this.createRowComponents(row, index);\n        this.emit('dataGridAddRow', {\n            component: this.component,\n            row\n        });\n        this.checkConditions();\n        this.triggerChange({ modified: true });\n        this.redraw().then(() => {\n            this.focusOnNewRowElement(this.rows[index]);\n        });\n    }\n    updateComponentsRowIndex(components, rowIndex) {\n        components.forEach((component, colIndex) => {\n            var _a;\n            if ((_a = component.options) === null || _a === void 0 ? void 0 : _a.name) {\n                const newName = `[${this.key}][${rowIndex}]`;\n                component.options.name = component.options.name.replace(`[${this.key}][${component.rowIndex}]`, newName);\n            }\n            component.rowIndex = rowIndex;\n            component.row = `${rowIndex}-${colIndex}`;\n        });\n    }\n    updateRowsComponents(rowIndex) {\n        this.rows.slice(rowIndex).forEach((row, index) => {\n            this.updateComponentsRowIndex(Object.values(row), rowIndex + index);\n        });\n    }\n    removeRow(index) {\n        const makeEmpty = index === 0 && this.rows.length === 1;\n        const flags = { isReordered: !makeEmpty, resetValue: makeEmpty };\n        this.splice(index, flags);\n        this.emit('dataGridDeleteRow', { index });\n        const [row] = this.rows.splice(index, 1);\n        this.removeSubmissionMetadataRow(index);\n        this.removeRowComponents(row);\n        this.updateRowsComponents(index);\n        this.setValue(this.dataValue, flags);\n        this.redraw();\n    }\n    removeRowComponents(row) {\n        lodash_1.default.each(row, (component) => this.removeComponent(component));\n    }\n    getRowValues() {\n        return this.dataValue;\n    }\n    setRowComponentsData(rowIndex, rowData) {\n        lodash_1.default.each(this.rows[rowIndex], (component) => {\n            component.data = rowData;\n        });\n    }\n    createRows(init, rebuild) {\n        let added = false;\n        const rowValues = this.getRowValues();\n        // Create any missing rows.\n        rowValues.forEach((row, index) => {\n            if (!rebuild && this.rows[index]) {\n                this.setRowComponentsData(index, row);\n            }\n            else {\n                if (this.rows[index]) {\n                    this.removeRowComponents(this.rows[index]);\n                }\n                this.rows[index] = this.createRowComponents(row, index);\n                added = true;\n            }\n        });\n        // Delete any extra rows.\n        const removedRows = this.rows.splice(rowValues.length);\n        const removed = !!removedRows.length;\n        // Delete components of extra rows (to make sure that this.components contain only components of exisiting rows)\n        if (removed) {\n            removedRows.forEach(row => this.removeRowComponents(row));\n        }\n        if (!init && (added || removed)) {\n            this.redraw();\n        }\n        return added;\n    }\n    createRowComponents(row, rowIndex) {\n        const components = {};\n        this.tabIndex = 0;\n        this.component.components.map((col, colIndex) => {\n            const options = lodash_1.default.clone(this.options);\n            options.name += `[${rowIndex}]`;\n            options.row = `${rowIndex}-${colIndex}`;\n            options.rowIndex = rowIndex;\n            options.onChange = (flags, changed, modified) => {\n                var _a, _b;\n                if (changed.component.type === 'form') {\n                    const formComp = (0, utils_1.getComponent)(this.component.components, changed.component.key);\n                    lodash_1.default.set(formComp, 'components', changed.component.components);\n                }\n                // If we're in a nested form we need to ensure our changes are triggered upstream\n                if (((_a = changed.instance.root) === null || _a === void 0 ? void 0 : _a.id) && (((_b = this.root) === null || _b === void 0 ? void 0 : _b.id) !== changed.instance.root.id)) {\n                    changed.instance.root.triggerChange(flags, changed, modified);\n                }\n                else {\n                    this.triggerChange({ modified });\n                }\n            };\n            let columnComponent;\n            if (this.builderMode) {\n                col.id = col.id + rowIndex;\n                columnComponent = col;\n            }\n            else {\n                columnComponent = Object.assign(Object.assign({}, col), { id: (col.id + rowIndex) });\n            }\n            const component = this.createComponent(columnComponent, options, row);\n            component.parentDisabled = !!this.disabled;\n            component.rowIndex = rowIndex;\n            component.inDataGrid = true;\n            if (columnComponent.tabindex &&\n                parseInt(columnComponent.tabindex) > this.tabIndex) {\n                this.tabIndex = parseInt(columnComponent.tabindex);\n            }\n            components[col.key] = component;\n        });\n        return components;\n    }\n    checkColumns(data, flags = {}) {\n        data = data || this.rootValue;\n        let show = false;\n        if (!this.rows || !this.rows.length) {\n            return { rebuild: false, show: false };\n        }\n        if (this.builderMode) {\n            return { rebuild: false, show: true };\n        }\n        const visibility = {};\n        let logicRebuild = false;\n        const dataValue = this.dataValue;\n        this.rows.forEach((row, rowIndex) => {\n            lodash_1.default.each(row, (col, key) => {\n                if (col && (typeof col.checkConditions === 'function')) {\n                    const firstRowCheck = visibility[key] === undefined;\n                    visibility[key] = !!visibility[key] ||\n                        (col.checkConditions(data, flags, dataValue[rowIndex]) && col.type !== 'hidden');\n                    if (col.component.logic && firstRowCheck) {\n                        const compIndex = lodash_1.default.findIndex(this.columns, ['key', key]);\n                        const equalColumns = lodash_1.default.isEqualWith(this.columns[compIndex], col.component, (col1, col2, key) => {\n                            // Don't compare columns by their auto-generated ids.\n                            if (key === 'id') {\n                                return true;\n                            }\n                        });\n                        if (!equalColumns) {\n                            logicRebuild = true;\n                            this.columns[compIndex] = col.component;\n                        }\n                    }\n                }\n            });\n        });\n        const rebuild = !lodash_1.default.isEqual(visibility, this.visibleColumns) || logicRebuild;\n        lodash_1.default.each(visibility, (col) => {\n            show |= col;\n        });\n        this.visibleColumns = visibility;\n        return { rebuild, show };\n    }\n    checkComponentConditions(data, flags, row) {\n        const isVisible = this.visible;\n        // If table isn't visible, don't bother calculating columns.\n        if (!super.checkComponentConditions(data, flags, row)) {\n            return false;\n        }\n        const { rebuild, show } = this.checkColumns(data, flags);\n        // Check if a rebuild is needed or the visibility changes.\n        if (rebuild || !isVisible) {\n            this.createRows(false, rebuild);\n        }\n        // Return if this table should show.\n        return show;\n    }\n    setValue(value, flags = {}) {\n        if (!value) {\n            this.dataValue = this.defaultValue;\n            this.createRows();\n            return false;\n        }\n        if (!Array.isArray(value)) {\n            if (typeof value === 'object') {\n                value = [value];\n            }\n            else {\n                this.createRows();\n                value = [{}];\n            }\n        }\n        // Make sure we always have at least one row.\n        // NOTE: Removing this will break \"Public Configurations\" in portal. ;)\n        if (value && !value.length && !this.initEmpty) {\n            value.push({});\n        }\n        const isSettingSubmission = flags.fromSubmission && !lodash_1.default.isEqual(value, this.emptyValue);\n        const changed = this.hasChanged(value, this.dataValue);\n        this.dataValue = value;\n        if (this.initRows || isSettingSubmission ||\n            (Array.isArray(this.dataValue) && this.dataValue.length !== this.rows.length)) {\n            if (!this.createRows() && changed) {\n                this.redraw();\n            }\n        }\n        if (this.componentModal && isSettingSubmission) {\n            this.componentModal.setValue(value);\n        }\n        this.rows.forEach((row, rowIndex) => {\n            if (value.length <= rowIndex) {\n                return;\n            }\n            lodash_1.default.each(row, (col) => {\n                col.rowIndex = rowIndex;\n                this.setNestedValue(col, value[rowIndex], flags);\n            });\n        });\n        this.updateOnChange(flags, changed);\n        return changed;\n    }\n    toggleGroup(element, index) {\n        element.classList.toggle('collapsed');\n        lodash_1.default.each(this.refs.chunks[index], row => {\n            row.classList.toggle('hidden');\n        });\n    }\n}\nexports[\"default\"] = DataGridComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/datagrid/DataGrid.js?");
 
 /***/ }),
 
@@ -5400,7 +5389,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 ListComponent_1 = __importDefault(__webpack_require__(/*! ../_classes/list/ListComponent */ \"./lib/cjs/components/_classes/list/ListComponent.js\"));\nconst Formio_1 = __webpack_require__(/*! ../../Formio */ \"./lib/cjs/Formio.js\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\");\nclass RadioComponent extends ListComponent_1.default {\n    static schema(...extend) {\n        return ListComponent_1.default.schema({\n            type: 'radio',\n            inputType: 'radio',\n            label: 'Radio',\n            key: 'radio',\n            values: [{ label: '', value: '' }],\n            data: {\n                url: '',\n            },\n            fieldSet: false\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Radio',\n            group: 'basic',\n            icon: 'dot-circle-o',\n            weight: 80,\n            documentation: '/userguide/form-building/form-components#radio',\n            schema: RadioComponent.schema()\n        };\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { valueComponent(classComp) {\n                const isValuesSrc = !classComp.dataSrc || classComp.dataSrc === 'values';\n                return isValuesSrc\n                    ? {\n                        type: 'select',\n                        dataSrc: 'custom',\n                        valueProperty: 'value',\n                        dataType: classComp.dataType || '',\n                        data: {\n                            custom: `values = ${classComp && classComp.values ? JSON.stringify(classComp.values) : []}`,\n                        }\n                    }\n                    : Object.assign(Object.assign({}, classComp), { type: 'select' });\n            } });\n    }\n    static get serverConditionSettings() {\n        return RadioComponent.conditionOperatorsSettings;\n    }\n    static savedValueTypes(schema) {\n        const { boolean, string, number, object, array } = utils_1.componentValueTypes;\n        const { dataType } = schema;\n        const types = (0, utils_1.getComponentSavedTypes)(schema);\n        if (types) {\n            return types;\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    constructor(component, options, data) {\n        super(component, options, data);\n        this.previousValue = this.dataValue || null;\n    }\n    get defaultSchema() {\n        return RadioComponent.schema();\n    }\n    get defaultValue() {\n        let defaultValue = super.defaultValue;\n        if (!defaultValue && this.component.defaultValue === false) {\n            defaultValue = this.component.defaultValue;\n        }\n        return defaultValue;\n    }\n    resetValue() {\n        this.unset();\n        this.setValue(this.emptyValue, {\n            noUpdateEvent: true,\n            noValidate: true,\n            resetValue: true\n        });\n    }\n    get inputInfo() {\n        var _a;\n        const info = super.elementInfo();\n        info.type = 'input';\n        info.changeEvent = 'click';\n        info.attr.class = 'form-check-input';\n        info.attr.name = info.attr.name += `[${(_a = this.root) === null || _a === void 0 ? void 0 : _a.id}-${this.id}]`;\n        return info;\n    }\n    get emptyValue() {\n        return '';\n    }\n    get isRadio() {\n        return this.component.inputType === 'radio';\n    }\n    get optionSelectedClass() {\n        return 'radio-selected';\n    }\n    get listData() {\n        const listData = lodash_1.default.get(this.root, 'submission.metadata.listData', {});\n        return lodash_1.default.get(listData, this.path);\n    }\n    get selectMetadata() {\n        return super.selectData;\n    }\n    get selectData() {\n        return this.selectMetadata || this.component.selectData;\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        this.itemsLoaded = new Promise((resolve) => {\n            this.itemsLoadedResolve = resolve;\n        });\n        this.optionsLoaded = !this.component.dataSrc || this.component.dataSrc === 'values';\n        this.loadedOptions = [];\n        if (!this.visible) {\n            this.itemsLoadedResolve();\n        }\n        // Get the template keys for this radio component.\n        this.getTemplateKeys();\n    }\n    beforeSubmit() {\n        return new Promise(res => {\n            this.dataReady.then(() => res(true));\n        });\n    }\n    render() {\n        if (!this.optionsLoaded) {\n            return super.render(this.renderTemplate('loader'));\n        }\n        return super.render(this.renderTemplate('radio', {\n            input: this.inputInfo,\n            inline: this.component.inline,\n            values: this.component.dataSrc === 'values' ? this.component.values : this.loadedOptions,\n            value: this.dataValue,\n            row: this.row,\n        }));\n    }\n    attach(element) {\n        this.loadRefs(element, { input: 'multiple', wrapper: 'multiple' });\n        this.refs.input.forEach((input, index) => {\n            this.addEventListener(input, this.inputInfo.changeEvent, () => {\n                this.updateValue(null, {\n                    modified: true,\n                });\n            });\n            if (this.component.values[index]) {\n                this.addShortcut(input, this.component.values[index].shortcut);\n            }\n            if (this.isRadio) {\n                let dataValue = this.dataValue;\n                if (!lodash_1.default.isString(this.dataValue)) {\n                    dataValue = lodash_1.default.toString(this.dataValue);\n                }\n                if (this.isSelectURL && lodash_1.default.isObject(this.loadedOptions[index].value)) {\n                    const optionValue = this.component.dataType === 'string' ? JSON.stringify(this.loadedOptions[index].value) : this.loadedOptions[index].value;\n                    input.checked = lodash_1.default.isEqual(optionValue, this.dataValue);\n                }\n                else {\n                    input.checked = (dataValue === input.value && (input.value || this.component.dataSrc !== 'url'));\n                }\n                this.addEventListener(input, 'keyup', (event) => {\n                    if (event.key === ' ' && dataValue === input.value) {\n                        event.preventDefault();\n                        this.updateValue(null, {\n                            modified: true,\n                        });\n                    }\n                });\n            }\n        });\n        this.triggerUpdate();\n        this.setSelectedClasses();\n        return super.attach(element);\n    }\n    detach(element) {\n        if (element && this.refs.input) {\n            this.refs.input.forEach((input, index) => {\n                if (this.component.values[index]) {\n                    this.removeShortcut(input, this.component.values[index].shortcut);\n                }\n            });\n        }\n        super.detach();\n    }\n    getValue() {\n        if (this.viewOnly || !this.refs.input || !this.refs.input.length) {\n            return this.dataValue;\n        }\n        // If the input type of the component is checkbox the value should be determined by the checkboxes checked property\n        let value = this.component.inputType === 'checkbox' ? '' : this.dataValue;\n        this.refs.input.forEach((input, index) => {\n            if (input.checked) {\n                value = (this.isSelectURL && lodash_1.default.isObject(this.loadedOptions[index].value)) ?\n                    this.loadedOptions[index].value :\n                    input.value;\n            }\n        });\n        return value;\n    }\n    validateValueProperty() {\n        if (this.component.dataSrc === 'values') {\n            return true;\n        }\n        return !lodash_1.default.some(this.refs.wrapper, (wrapper, index) => this.refs.input[index].checked && this.loadedOptions[index].invalid);\n    }\n    validateValueAvailability(setting, value) {\n        if (!(0, utils_1.boolValue)(setting) || !value) {\n            return true;\n        }\n        const values = this.component.dataSrc === 'values' ? this.component.values : this.loadedOptions;\n        if (values) {\n            return values.findIndex(({ value: optionValue }) => this.normalizeValue(optionValue) === value) !== -1;\n        }\n        return false;\n    }\n    getValueAsString(value, options = {}) {\n        if (lodash_1.default.isObject(value)) {\n            value = JSON.stringify(value);\n        }\n        else if (!lodash_1.default.isString(value)) {\n            value = lodash_1.default.toString(value);\n        }\n        const shouldUseSelectData = (options.modalPreview || this.inDataTable)\n            && this.component.dataSrc === 'url' && (this.loadedOptions.length || this.selectData);\n        if (this.component.dataSrc !== 'values' && !shouldUseSelectData) {\n            return value;\n        }\n        const values = shouldUseSelectData ? this.loadedOptions : this.component.values;\n        const option = !(values === null || values === void 0 ? void 0 : values.length) && shouldUseSelectData ? {\n            label: this.itemTemplate(this.selectData),\n        } : lodash_1.default.find(values, (v) => v.value === value);\n        if (!value) {\n            return lodash_1.default.get(option, 'label', '');\n        }\n        return lodash_1.default.get(option, 'label', '');\n    }\n    setValueAt(index, value) {\n        if (this.refs.input && this.refs.input[index] && value !== null && value !== undefined) {\n            const inputValue = this.refs.input[index].value;\n            this.refs.input[index].checked = (inputValue === value.toString());\n        }\n    }\n    get shouldLoad() {\n        // do not load options if the value is empty in readOnly and we have options available in metadata\n        if (this.options.readOnly && this.isEmpty() && this.listData) {\n            return false;\n        }\n        return super.shouldLoad;\n    }\n    loadItems(url, search, headers, options, method, body) {\n        if (this.optionsLoaded) {\n            this.itemsLoadedResolve();\n            return;\n        }\n        if (!this.shouldLoad && this.listData) {\n            this.loadItemsFromMetadata();\n            this.itemsLoadedResolve();\n            this.optionsLoaded = true;\n            return;\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        // 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        // 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);\n        })\n            .catch((err) => {\n            this.handleLoadingError(err);\n        })\n            .finally(() => {\n            this.optionsLoaded = true;\n            this.redraw();\n        });\n    }\n    loadItemsFromMetadata() {\n        this.listData.forEach((item, i) => {\n            this.loadedOptions[i] = {\n                label: this.itemTemplate(item)\n            };\n            if (lodash_1.default.isEqual(item, this.selectData || lodash_1.default.pick(this.dataValue, lodash_1.default.keys(item)))) {\n                this.loadedOptions[i].value = this.dataValue;\n            }\n        });\n        this.optionsLoaded = true;\n        this.redraw();\n    }\n    setItems(items) {\n        const listData = [];\n        items === null || items === void 0 ? void 0 : items.forEach((item, i) => {\n            const valueAtProperty = lodash_1.default.get(item, this.component.valueProperty);\n            this.loadedOptions[i] = {\n                value: this.component.valueProperty ? valueAtProperty : item,\n                label: this.component.valueProperty ? this.itemTemplate(item, valueAtProperty) : this.itemTemplate(item, item, i)\n            };\n            listData.push(this.templateData[this.component.valueProperty ? valueAtProperty : i]);\n            const value = this.loadedOptions[i].value;\n            if (!this.isRadio && (lodash_1.default.isObject(value) || lodash_1.default.isBoolean(value) || lodash_1.default.isUndefined(value))) {\n                this.loadedOptions[i].invalid = true;\n            }\n        });\n        if (this.isSelectURL) {\n            const submission = this.root.submission;\n            if (!submission.metadata) {\n                submission.metadata = {};\n            }\n            if (!submission.metadata.listData) {\n                submission.metadata.listData = {};\n            }\n            lodash_1.default.set(submission.metadata.listData, this.path, listData);\n        }\n        this.itemsLoadedResolve();\n    }\n    setSelectedClasses() {\n        if (this.refs.wrapper) {\n            //add/remove selected option class\n            const value = this.dataValue;\n            this.refs.wrapper.forEach((wrapper, index) => {\n                const input = this.refs.input[index];\n                const checked = (value === undefined || value === null) ? false : (input.type === 'checkbox') ? value[input.value] || input.checked : (input.value.toString() === value.toString());\n                if (checked) {\n                    //add class to container when selected\n                    this.addClass(wrapper, this.optionSelectedClass);\n                    //change \"checked\" attribute\n                    input.setAttribute('checked', 'true');\n                }\n                else {\n                    this.removeClass(wrapper, this.optionSelectedClass);\n                    input.removeAttribute('checked');\n                }\n            });\n        }\n    }\n    updateValue(value, flags) {\n        const changed = super.updateValue(value, flags);\n        if (changed) {\n            this.setSelectedClasses();\n        }\n        if (!flags || !flags.modified || !this.isRadio) {\n            if (changed) {\n                this.previousValue = this.dataValue;\n            }\n            return changed;\n        }\n        // If they clicked on the radio that is currently selected, it needs to reset the value.\n        this.currentValue = this.dataValue;\n        const shouldResetValue = flags && flags.modified && !flags.noUpdateEvent && this.previousValue === this.currentValue;\n        if (shouldResetValue) {\n            this.resetValue();\n            this.triggerChange(flags);\n            this.setSelectedClasses();\n        }\n        this.previousValue = this.dataValue;\n        return changed;\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        const dataType = this.component.dataType || 'auto';\n        if (value === this.emptyValue) {\n            return value;\n        }\n        switch (dataType) {\n            case 'auto':\n                if (!isNaN(parseFloat(value)) && isFinite(value) && lodash_1.default.toString(value) === Number(value).toString()) {\n                    value = +value;\n                }\n                if (value === 'true') {\n                    value = true;\n                }\n                if (value === 'false') {\n                    value = false;\n                }\n                break;\n            case 'number':\n                value = +value;\n                break;\n            case 'string':\n                if (typeof value === 'object') {\n                    value = JSON.stringify(value);\n                }\n                else {\n                    value = String(value);\n                }\n                break;\n            case 'boolean':\n                value = !(!value || value.toString() === 'false');\n                break;\n        }\n        if (this.isSelectURL && this.templateData && this.templateData[value]) {\n            const submission = this.root.submission;\n            if (!submission.metadata.selectData) {\n                submission.metadata.selectData = {};\n            }\n            lodash_1.default.set(submission.metadata.selectData, this.path, this.templateData[value]);\n        }\n        return super.normalizeValue(value);\n    }\n}\nexports[\"default\"] = RadioComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/radio/Radio.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 ListComponent_1 = __importDefault(__webpack_require__(/*! ../_classes/list/ListComponent */ \"./lib/cjs/components/_classes/list/ListComponent.js\"));\nconst Formio_1 = __webpack_require__(/*! ../../Formio */ \"./lib/cjs/Formio.js\");\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\");\nclass RadioComponent extends ListComponent_1.default {\n    static schema(...extend) {\n        return ListComponent_1.default.schema({\n            type: 'radio',\n            inputType: 'radio',\n            label: 'Radio',\n            key: 'radio',\n            values: [{ label: '', value: '' }],\n            data: {\n                url: '',\n            },\n            fieldSet: false\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Radio',\n            group: 'basic',\n            icon: 'dot-circle-o',\n            weight: 80,\n            documentation: '/userguide/form-building/form-components#radio',\n            schema: RadioComponent.schema()\n        };\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { valueComponent(classComp) {\n                const isValuesSrc = !classComp.dataSrc || classComp.dataSrc === 'values';\n                return isValuesSrc\n                    ? {\n                        type: 'select',\n                        dataSrc: 'custom',\n                        valueProperty: 'value',\n                        dataType: classComp.dataType || '',\n                        data: {\n                            custom: `values = ${classComp && classComp.values ? JSON.stringify(classComp.values) : []}`,\n                        }\n                    }\n                    : Object.assign(Object.assign({}, classComp), { type: 'select' });\n            } });\n    }\n    static get serverConditionSettings() {\n        return RadioComponent.conditionOperatorsSettings;\n    }\n    static savedValueTypes(schema) {\n        const { boolean, string, number, object, array } = utils_1.componentValueTypes;\n        const { dataType } = schema;\n        const types = (0, utils_1.getComponentSavedTypes)(schema);\n        if (types) {\n            return types;\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    constructor(component, options, data) {\n        super(component, options, data);\n        this.previousValue = this.dataValue || null;\n    }\n    get defaultSchema() {\n        return RadioComponent.schema();\n    }\n    get defaultValue() {\n        let defaultValue = super.defaultValue;\n        if (!defaultValue && this.component.defaultValue === false) {\n            defaultValue = this.component.defaultValue;\n        }\n        return defaultValue;\n    }\n    resetValue() {\n        this.unset();\n        this.setValue(this.emptyValue, {\n            noUpdateEvent: true,\n            noValidate: true,\n            resetValue: true\n        });\n    }\n    get inputInfo() {\n        var _a;\n        const info = super.elementInfo();\n        info.type = 'input';\n        info.changeEvent = 'click';\n        info.attr.class = 'form-check-input';\n        info.attr.name = info.attr.name += `[${(_a = this.root) === null || _a === void 0 ? void 0 : _a.id}-${this.id}]`;\n        return info;\n    }\n    get emptyValue() {\n        return '';\n    }\n    get isRadio() {\n        return this.component.inputType === 'radio';\n    }\n    get optionSelectedClass() {\n        return 'radio-selected';\n    }\n    get listData() {\n        const listData = lodash_1.default.get(this.root, 'submission.metadata.listData', {});\n        return lodash_1.default.get(listData, this.path);\n    }\n    get selectMetadata() {\n        return super.selectData;\n    }\n    get selectData() {\n        return this.selectMetadata || this.component.selectData;\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        this.itemsLoaded = new Promise((resolve) => {\n            this.itemsLoadedResolve = resolve;\n        });\n        this.optionsLoaded = !this.component.dataSrc || this.component.dataSrc === 'values';\n        this.loadedOptions = [];\n        if (!this.visible || this.optionsLoaded) {\n            this.itemsLoadedResolve();\n        }\n        // Get the template keys for this radio component.\n        this.getTemplateKeys();\n    }\n    beforeSubmit() {\n        return new Promise(res => {\n            this.dataReady.then(() => res(true));\n        });\n    }\n    render() {\n        if (!this.optionsLoaded) {\n            return super.render(this.renderTemplate('loader'));\n        }\n        return super.render(this.renderTemplate('radio', {\n            input: this.inputInfo,\n            inline: this.component.inline,\n            values: this.component.dataSrc === 'values' ? this.component.values : this.loadedOptions,\n            value: this.dataValue,\n            row: this.row,\n        }));\n    }\n    attach(element) {\n        this.loadRefs(element, { input: 'multiple', wrapper: 'multiple' });\n        this.refs.input.forEach((input, index) => {\n            this.addEventListener(input, this.inputInfo.changeEvent, () => {\n                this.updateValue(null, {\n                    modified: true,\n                });\n            });\n            if (this.component.values[index]) {\n                this.addShortcut(input, this.component.values[index].shortcut);\n            }\n            if (this.isRadio) {\n                let dataValue = this.dataValue;\n                if (!lodash_1.default.isString(this.dataValue)) {\n                    dataValue = lodash_1.default.toString(this.dataValue);\n                }\n                if (this.isSelectURL && lodash_1.default.isObject(this.loadedOptions[index].value)) {\n                    const optionValue = this.component.dataType === 'string' ? JSON.stringify(this.loadedOptions[index].value) : this.loadedOptions[index].value;\n                    input.checked = lodash_1.default.isEqual(optionValue, this.dataValue);\n                }\n                else {\n                    input.checked = (dataValue === input.value && (input.value || this.component.dataSrc !== 'url'));\n                }\n                this.addEventListener(input, 'keyup', (event) => {\n                    if (event.key === ' ' && dataValue === input.value) {\n                        event.preventDefault();\n                        this.updateValue(null, {\n                            modified: true,\n                        });\n                    }\n                });\n            }\n        });\n        this.triggerUpdate();\n        this.setSelectedClasses();\n        return super.attach(element);\n    }\n    detach(element) {\n        if (element && this.refs.input) {\n            this.refs.input.forEach((input, index) => {\n                if (this.component.values[index]) {\n                    this.removeShortcut(input, this.component.values[index].shortcut);\n                }\n            });\n        }\n        super.detach();\n    }\n    getValue() {\n        if (this.viewOnly || !this.refs.input || !this.refs.input.length) {\n            return this.dataValue;\n        }\n        // If the input type of the component is checkbox the value should be determined by the checkboxes checked property\n        let value = this.component.inputType === 'checkbox' ? '' : this.dataValue;\n        this.refs.input.forEach((input, index) => {\n            if (input.checked) {\n                value = (this.isSelectURL && lodash_1.default.isObject(this.loadedOptions[index].value)) ?\n                    this.loadedOptions[index].value :\n                    input.value;\n            }\n        });\n        return value;\n    }\n    validateValueProperty() {\n        if (this.component.dataSrc === 'values') {\n            return true;\n        }\n        return !lodash_1.default.some(this.refs.wrapper, (wrapper, index) => this.refs.input[index].checked && this.loadedOptions[index].invalid);\n    }\n    validateValueAvailability(setting, value) {\n        if (!(0, utils_1.boolValue)(setting) || !value) {\n            return true;\n        }\n        const values = this.component.dataSrc === 'values' ? this.component.values : this.loadedOptions;\n        if (values) {\n            return values.findIndex(({ value: optionValue }) => this.normalizeValue(optionValue) === value) !== -1;\n        }\n        return false;\n    }\n    getValueAsString(value, options = {}) {\n        if (lodash_1.default.isObject(value)) {\n            value = JSON.stringify(value);\n        }\n        else if (!lodash_1.default.isString(value)) {\n            value = lodash_1.default.toString(value);\n        }\n        const shouldUseSelectData = (options.modalPreview || this.inDataTable)\n            && this.component.dataSrc === 'url' && (this.loadedOptions.length || this.selectData);\n        if (this.component.dataSrc !== 'values' && !shouldUseSelectData) {\n            return value;\n        }\n        const values = shouldUseSelectData ? this.loadedOptions : this.component.values;\n        const option = !(values === null || values === void 0 ? void 0 : values.length) && shouldUseSelectData ? {\n            label: this.itemTemplate(this.selectData),\n        } : lodash_1.default.find(values, (v) => v.value === value);\n        if (!value) {\n            return lodash_1.default.get(option, 'label', '');\n        }\n        return lodash_1.default.get(option, 'label', '');\n    }\n    setValueAt(index, value) {\n        if (this.refs.input && this.refs.input[index] && value !== null && value !== undefined) {\n            const inputValue = this.refs.input[index].value;\n            this.refs.input[index].checked = (inputValue === value.toString());\n        }\n    }\n    get shouldLoad() {\n        // do not load options if the value is empty in readOnly and we have options available in metadata\n        if (this.options.readOnly && this.isEmpty() && this.listData) {\n            return false;\n        }\n        return super.shouldLoad;\n    }\n    loadItems(url, search, headers, options, method, body) {\n        if (this.optionsLoaded) {\n            this.itemsLoadedResolve();\n            return;\n        }\n        if (!this.shouldLoad && this.listData) {\n            this.loadItemsFromMetadata();\n            this.itemsLoadedResolve();\n            this.optionsLoaded = true;\n            return;\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        // 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        // 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);\n        })\n            .catch((err) => {\n            this.handleLoadingError(err);\n        })\n            .finally(() => {\n            this.optionsLoaded = true;\n            this.redraw();\n        });\n    }\n    loadItemsFromMetadata() {\n        this.listData.forEach((item, i) => {\n            this.loadedOptions[i] = {\n                label: this.itemTemplate(item)\n            };\n            if (lodash_1.default.isEqual(item, this.selectData || lodash_1.default.pick(this.dataValue, lodash_1.default.keys(item)))) {\n                this.loadedOptions[i].value = this.dataValue;\n            }\n        });\n        this.optionsLoaded = true;\n        this.redraw();\n    }\n    setItems(items) {\n        const listData = [];\n        items === null || items === void 0 ? void 0 : items.forEach((item, i) => {\n            const valueAtProperty = lodash_1.default.get(item, this.component.valueProperty);\n            this.loadedOptions[i] = {\n                value: this.component.valueProperty ? valueAtProperty : item,\n                label: this.component.valueProperty ? this.itemTemplate(item, valueAtProperty) : this.itemTemplate(item, item, i)\n            };\n            listData.push(this.templateData[this.component.valueProperty ? valueAtProperty : i]);\n            const value = this.loadedOptions[i].value;\n            if (!this.isRadio && (lodash_1.default.isObject(value) || lodash_1.default.isBoolean(value) || lodash_1.default.isUndefined(value))) {\n                this.loadedOptions[i].invalid = true;\n            }\n        });\n        if (this.isSelectURL) {\n            const submission = this.root.submission;\n            if (!submission.metadata) {\n                submission.metadata = {};\n            }\n            if (!submission.metadata.listData) {\n                submission.metadata.listData = {};\n            }\n            lodash_1.default.set(submission.metadata.listData, this.path, listData);\n        }\n        this.itemsLoadedResolve();\n    }\n    setSelectedClasses() {\n        if (this.refs.wrapper) {\n            //add/remove selected option class\n            const value = this.dataValue;\n            this.refs.wrapper.forEach((wrapper, index) => {\n                const input = this.refs.input[index];\n                const checked = (value === undefined || value === null) ? false : (input.type === 'checkbox') ? value[input.value] || input.checked : (input.value.toString() === value.toString());\n                if (checked) {\n                    //add class to container when selected\n                    this.addClass(wrapper, this.optionSelectedClass);\n                    //change \"checked\" attribute\n                    input.setAttribute('checked', 'true');\n                }\n                else {\n                    this.removeClass(wrapper, this.optionSelectedClass);\n                    input.removeAttribute('checked');\n                }\n            });\n        }\n    }\n    updateValue(value, flags) {\n        const changed = super.updateValue(value, flags);\n        if (changed) {\n            this.setSelectedClasses();\n        }\n        if (!flags || !flags.modified || !this.isRadio) {\n            if (changed) {\n                this.previousValue = this.dataValue;\n            }\n            return changed;\n        }\n        // If they clicked on the radio that is currently selected, it needs to reset the value.\n        this.currentValue = this.dataValue;\n        const shouldResetValue = flags && flags.modified && !flags.noUpdateEvent && this.previousValue === this.currentValue;\n        if (shouldResetValue) {\n            this.resetValue();\n            this.triggerChange(flags);\n            this.setSelectedClasses();\n        }\n        this.previousValue = this.dataValue;\n        return changed;\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        const dataType = this.component.dataType || 'auto';\n        if (value === this.emptyValue) {\n            return value;\n        }\n        switch (dataType) {\n            case 'auto':\n                if (!isNaN(parseFloat(value)) && isFinite(value) && lodash_1.default.toString(value) === Number(value).toString()) {\n                    value = +value;\n                }\n                if (value === 'true') {\n                    value = true;\n                }\n                if (value === 'false') {\n                    value = false;\n                }\n                break;\n            case 'number':\n                value = +value;\n                break;\n            case 'string':\n                if (typeof value === 'object') {\n                    value = JSON.stringify(value);\n                }\n                else {\n                    value = String(value);\n                }\n                break;\n            case 'boolean':\n                value = !(!value || value.toString() === 'false');\n                break;\n        }\n        if (this.isSelectURL && this.templateData && this.templateData[value]) {\n            const submission = this.root.submission;\n            if (!submission.metadata.selectData) {\n                submission.metadata.selectData = {};\n            }\n            lodash_1.default.set(submission.metadata.selectData, this.path, this.templateData[value]);\n        }\n        return super.normalizeValue(value);\n    }\n}\nexports[\"default\"] = RadioComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/radio/Radio.js?");
 
 /***/ }),
 
@@ -5422,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    /* 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);\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?");
 
 /***/ }),
 
@@ -5488,7 +5477,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 utils_1 = __webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\");\nconst Input_1 = __importDefault(__webpack_require__(/*! ../_classes/input/Input */ \"./lib/cjs/components/_classes/input/Input.js\"));\nconst choices_js_1 = __importDefault(__webpack_require__(/*! choices.js */ \"./node_modules/choices.js/public/assets/scripts/choices.js\"));\nclass TagsComponent extends Input_1.default {\n    static schema(...extend) {\n        return Input_1.default.schema({\n            type: 'tags',\n            label: 'Tags',\n            key: 'tags',\n            delimeter: ',',\n            storeas: 'string',\n            maxTags: 0\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Tags',\n            icon: 'tags',\n            group: 'advanced',\n            documentation: '/userguide/form-building/advanced-components#tags',\n            weight: 30,\n            schema: TagsComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return TagsComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: [...super.conditionOperatorsSettings.operators, 'includes', 'notIncludes'] });\n    }\n    static savedValueTypes(schema) {\n        schema = schema || {};\n        return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes[schema.storeas] || utils_1.componentValueTypes.string];\n    }\n    init() {\n        super.init();\n    }\n    get emptyValue() {\n        return (this.component.storeas === 'string') ? '' : [];\n    }\n    get defaultSchema() {\n        return TagsComponent.schema();\n    }\n    get inputInfo() {\n        const info = super.inputInfo;\n        info.type = 'input';\n        info.attr.type = 'text';\n        info.changeEvent = 'change';\n        return info;\n    }\n    get delimiter() {\n        return this.component.delimeter || ',';\n    }\n    attachElement(element, index) {\n        super.attachElement(element, index);\n        if (!element) {\n            return;\n        }\n        if (this.i18next) {\n            element.setAttribute('dir', this.i18next.dir());\n        }\n        if (this.choices) {\n            this.choices.destroy();\n        }\n        if (!choices_js_1.default) {\n            return;\n        }\n        const hasPlaceholder = !!this.component.placeholder;\n        this.choices = new choices_js_1.default(element, {\n            delimiter: this.delimiter,\n            editItems: true,\n            allowHTML: true,\n            maxItemCount: this.component.maxTags,\n            removeItemButton: true,\n            duplicateItemsAllowed: false,\n            shadowRoot: this.root ? this.root.shadowRoot : null,\n            placeholder: hasPlaceholder,\n            placeholderValue: hasPlaceholder ? this.t(this.component.placeholder, { _userInput: true }) : null,\n        });\n        this.choices.itemList.element.tabIndex = element.tabIndex;\n        this.addEventListener(this.choices.input.element, 'blur', () => {\n            // Emit event to the native Formio input, so the listener attached in the Input.js will be invoked\n            element.dispatchEvent(new Event('blur'));\n            const value = this.choices.input.value;\n            const maxTagsNumber = this.component.maxTags;\n            const valuesCount = this.choices.getValue(true).length;\n            const isRepeatedValue = this.choices.getValue(true).some(existingValue => existingValue.trim() === value.trim());\n            if (value) {\n                if (maxTagsNumber && valuesCount === maxTagsNumber) {\n                    this.choices.addItems = false;\n                    this.choices.clearInput();\n                }\n                else if (isRepeatedValue) {\n                    this.choices.clearInput();\n                }\n                else {\n                    this.choices.setValue([value]);\n                    this.choices.clearInput();\n                    this.choices.hideDropdown(true);\n                    this.updateValue(null, {\n                        modified: true\n                    });\n                }\n            }\n        });\n    }\n    detach() {\n        if (this.choices) {\n            this.choices.destroy();\n            this.choices = null;\n        }\n        super.detach();\n    }\n    normalizeValue(value) {\n        if (this.component.storeas === 'string' && Array.isArray(value)) {\n            return super.normalizeValue(value.join(this.delimiter));\n        }\n        else if (this.component.storeas === 'array' && typeof value === 'string') {\n            return super.normalizeValue(value.split(this.delimiter).filter(result => result));\n        }\n        return super.normalizeValue(value);\n    }\n    setValue(value, flags = {}) {\n        const changed = super.setValue(value, flags);\n        if (this.choices) {\n            let dataValue = this.dataValue;\n            this.choices.clearStore();\n            if (dataValue) {\n                if (typeof dataValue === 'string') {\n                    dataValue = dataValue.split(this.delimiter).filter(result => result);\n                }\n                const value = Array.isArray(dataValue) ? dataValue : [dataValue];\n                this.choices.setValue(value.map((val) => this.sanitize(val, this.shouldSanitizeValue)));\n            }\n        }\n        return changed;\n    }\n    set disabled(disabled) {\n        super.disabled = disabled;\n        if (!this.choices) {\n            return;\n        }\n        if (disabled) {\n            this.choices.disable();\n        }\n        else {\n            this.choices.enable();\n        }\n    }\n    get disabled() {\n        return super.disabled;\n    }\n    focus() {\n        if (this.refs.input && this.refs.input.length) {\n            this.refs.input[0].parentNode.lastChild.focus();\n        }\n    }\n    getValueAsString(value) {\n        if (!value) {\n            return '';\n        }\n        if (Array.isArray(value)) {\n            return value.join(`${this.delimiter || ','} `);\n        }\n        const stringValue = value.toString();\n        return this.sanitize(stringValue, this.shouldSanitizeValue);\n    }\n}\nexports[\"default\"] = TagsComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/tags/Tags.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 utils_1 = __webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\");\nconst Input_1 = __importDefault(__webpack_require__(/*! ../_classes/input/Input */ \"./lib/cjs/components/_classes/input/Input.js\"));\nconst choices_js_1 = __importDefault(__webpack_require__(/*! choices.js */ \"./node_modules/choices.js/public/assets/scripts/choices.js\"));\nclass TagsComponent extends Input_1.default {\n    static schema(...extend) {\n        return Input_1.default.schema({\n            type: 'tags',\n            label: 'Tags',\n            key: 'tags',\n            delimeter: ',',\n            storeas: 'string',\n            maxTags: 0\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Tags',\n            icon: 'tags',\n            group: 'advanced',\n            documentation: '/userguide/form-building/advanced-components#tags',\n            weight: 30,\n            schema: TagsComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return TagsComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: [...super.conditionOperatorsSettings.operators, 'includes', 'notIncludes'] });\n    }\n    static savedValueTypes(schema) {\n        schema = schema || {};\n        return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes[schema.storeas] || utils_1.componentValueTypes.string];\n    }\n    init() {\n        super.init();\n    }\n    get emptyValue() {\n        return (this.component.storeas === 'string') ? '' : [];\n    }\n    get defaultSchema() {\n        return TagsComponent.schema();\n    }\n    get inputInfo() {\n        const info = super.inputInfo;\n        info.type = 'input';\n        info.attr.type = 'text';\n        info.changeEvent = 'change';\n        return info;\n    }\n    get delimiter() {\n        return this.component.delimeter || ',';\n    }\n    attachElement(element, index) {\n        super.attachElement(element, index);\n        if (!element) {\n            return;\n        }\n        if (this.i18next) {\n            element.setAttribute('dir', this.i18next.dir());\n        }\n        if (this.choices) {\n            this.choices.destroy();\n        }\n        if (!choices_js_1.default) {\n            return;\n        }\n        const hasPlaceholder = !!this.component.placeholder;\n        this.choices = new choices_js_1.default(element, {\n            delimiter: this.delimiter,\n            editItems: true,\n            allowHTML: true,\n            maxItemCount: this.component.maxTags,\n            removeItemButton: true,\n            duplicateItemsAllowed: false,\n            shadowRoot: this.root ? this.root.shadowRoot : null,\n            placeholder: hasPlaceholder,\n            placeholderValue: hasPlaceholder ? this.t(this.component.placeholder, { _userInput: true }) : null,\n        });\n        this.choices.itemList.element.tabIndex = element.tabIndex;\n        this.addEventListener(this.choices.input.element, 'blur', () => {\n            // Emit event to the native Formio input, so the listener attached in the Input.js will be invoked\n            element.dispatchEvent(new Event('blur'));\n            const value = this.choices.input.value;\n            const maxTagsNumber = this.component.maxTags;\n            const valuesCount = this.choices.getValue(true).length;\n            const isRepeatedValue = this.choices.getValue(true).some(existingValue => existingValue.trim() === value.trim());\n            if (value) {\n                if (maxTagsNumber && valuesCount === maxTagsNumber) {\n                    this.choices.addItems = false;\n                    this.choices.clearInput();\n                }\n                else if (isRepeatedValue) {\n                    this.choices.clearInput();\n                }\n                else {\n                    this.choices.setValue([value]);\n                    this.choices.clearInput();\n                    this.choices.hideDropdown(true);\n                    this.updateValue(null, {\n                        modified: true\n                    });\n                }\n            }\n        });\n    }\n    detach() {\n        if (this.choices) {\n            this.choices.destroy();\n            this.choices = null;\n        }\n        super.detach();\n    }\n    normalizeValue(value) {\n        if (this.component.storeas === 'string' && Array.isArray(value)) {\n            return super.normalizeValue(value.join(this.delimiter));\n        }\n        else if (this.component.storeas === 'array' && typeof value === 'string') {\n            return super.normalizeValue(value.split(this.delimiter).filter(result => result));\n        }\n        return super.normalizeValue(value);\n    }\n    setValue(value, flags = {}) {\n        const changed = super.setValue(value, flags);\n        if (this.choices) {\n            let dataValue = this.dataValue;\n            this.choices.clearStore();\n            if (dataValue) {\n                if (typeof dataValue === 'string') {\n                    dataValue = dataValue.split(this.delimiter).filter(result => result);\n                }\n                const value = Array.isArray(dataValue) ? dataValue : [dataValue];\n                this.choices.setValue(value.map((val) => this.sanitize(val, this.shouldSanitizeValue)));\n            }\n        }\n        return changed;\n    }\n    set disabled(disabled) {\n        super.disabled = disabled;\n        if (!this.choices) {\n            return;\n        }\n        if (disabled) {\n            this.choices.disable();\n        }\n        else {\n            this.choices.enable();\n        }\n    }\n    get disabled() {\n        return super.disabled;\n    }\n    focus() {\n        if (this.refs.input && this.refs.input.length) {\n            this.refs.input[0].parentNode.lastChild.focus();\n        }\n    }\n    getValue() {\n        if (this.choices) {\n            const value = this.choices.getValue(true);\n            return value.join(`${this.delimiter}`);\n        }\n        return super.getValue();\n    }\n    getValueAsString(value) {\n        if (!value) {\n            return '';\n        }\n        if (Array.isArray(value)) {\n            return value.join(`${this.delimiter || ','} `);\n        }\n        const stringValue = value.toString();\n        return this.sanitize(stringValue, this.shouldSanitizeValue);\n    }\n}\nexports[\"default\"] = TagsComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/tags/Tags.js?");
 
 /***/ }),
 
@@ -6622,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('circle-xmark'))) == 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?");
 
 /***/ }),
 
@@ -6894,7 +6883,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\ncons
 /***/ (function(__unused_webpack_module, exports) {
 
 "use strict";
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports[\"default\"] = (iconset, name, spinning) => {\n    let biName = name;\n    switch (name) {\n        case 'cog':\n            biName = 'gear';\n            break;\n        case 'copy':\n            biName = 'back';\n            break;\n        case 'bars':\n            biName = 'list';\n            break;\n        case 'remove':\n            biName = 'trash';\n            break;\n        case 'font':\n            biName = 'type';\n            break;\n        case 'hashtag':\n            biName = 'hash';\n            break;\n        case 'th-list':\n            biName = 'menu-button-wide';\n            break;\n        case 'dot-circle-o':\n            biName = 'ui-radios';\n            break;\n        case 'plus-square-o':\n            biName = 'plus-square';\n            break;\n        case 'minus-square-o':\n            biName = 'dash-square';\n            break;\n        case 'plus-square':\n            biName = 'ui-checks';\n            break;\n        case 'phone-square':\n            biName = 'phone';\n            break;\n        case 'home':\n            biName = 'house';\n            break;\n        case 'clock-o':\n            biName = 'clock';\n            break;\n        case 'usd':\n            biName = 'currency-dollar';\n            break;\n        case 'html5':\n            biName = 'file-richtext';\n            break;\n        case 'pencil-square-o':\n            biName = 'pencil-square';\n            break;\n        case 'columns':\n            biName = 'layout-three-columns';\n            break;\n        case 'list-alt':\n            biName = 'window';\n            break;\n        case 'th-large':\n            biName = 'grid-fill';\n            break;\n        case 'folder-o':\n            biName = 'folder';\n            break;\n        case 'square-o':\n            biName = 'square';\n            break;\n        case 'user-secret':\n            biName = 'person-fill-slash';\n            break;\n        case 'folder-open':\n            biName = 'folder2-open';\n            break;\n        case 'th':\n            biName = 'grid-3x3-gap-fill';\n            break;\n        case 'tasks':\n            biName = 'view-stacked';\n            break;\n        case 'indent':\n            biName = 'text-indent-left';\n            break;\n        case 'refresh':\n            biName = 'arrow-repeat';\n            break;\n        case 'files-o':\n            biName = 'files';\n            break;\n        case 'wpforms':\n            biName = 'window-stack';\n            break;\n        case 'cube':\n            biName = 'box';\n            break;\n        case 'cubes':\n            biName = 'boxes';\n            break;\n        case 'check-square-o':\n            biName = 'check-square';\n            break;\n        case 'plus':\n            biName = 'plus-lg';\n            break;\n        case 'question-sign':\n            name = 'question-circle';\n            biName = 'question-circle';\n            break;\n        case 'remove-circle':\n            biName = 'x-circle';\n            break;\n        case 'new-window':\n            name = 'window-restore';\n            biName = 'window-plus';\n            break;\n        case 'move':\n            name = 'arrows';\n            biName = 'arrows-move';\n            break;\n        case 'edit':\n            biName = 'pencil';\n            break;\n        case 'time':\n            biName = 'clock';\n            break;\n        case 'video':\n            biName = 'camera-video';\n            break;\n        case 'microphone':\n            biName = 'mic';\n            break;\n        case 'folder-open':\n            biName = 'folder2-open';\n            break;\n        case 'check-circle':\n            biName = 'check-circle-fill';\n            break;\n        case 'times-circle':\n            biName = 'x-circle-fill';\n            break;\n        case 'pencil':\n            biName = 'pencil-fill';\n            break;\n        case 'minus':\n            biName = 'dash';\n            break;\n        case 'circle':\n            biName = 'circle-fill';\n            break;\n        case 'search-plus':\n            biName = 'zoom-in';\n            break;\n        case 'search-minus':\n            biName = 'zoom-out';\n            break;\n        case 'hand-paper-o':\n            biName = 'hand-index';\n            break;\n        case 'undo':\n            biName = 'arrow-counterclockwise';\n            break;\n        case 'repeat':\n            biName = 'arrow-clockwise';\n            break;\n    }\n    return spinning ? 'spinner-border spinner-border-sm' : `${iconset} ${iconset}-${iconset === 'bi' ? biName : name}`;\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/bootstrap/lib/cjs/templates/bootstrap5/iconClass.js?");
+eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports[\"default\"] = (iconset, name, spinning) => {\n    let iconName = name;\n    if (iconset === 'bi') {\n        switch (name) {\n            case 'cog':\n                iconName = 'gear';\n                break;\n            case 'copy':\n                iconName = 'back';\n                break;\n            case 'bars':\n                iconName = 'list';\n                break;\n            case 'remove':\n                iconName = 'trash';\n                break;\n            case 'font':\n                iconName = 'type';\n                break;\n            case 'hashtag':\n                iconName = 'hash';\n                break;\n            case 'th-list':\n                iconName = 'menu-button-wide';\n                break;\n            case 'dot-circle-o':\n                iconName = 'ui-radios';\n                break;\n            case 'plus-square-o':\n                iconName = 'plus-square';\n                break;\n            case 'minus-square-o':\n                iconName = 'dash-square';\n                break;\n            case 'plus-square':\n                iconName = 'ui-checks';\n                break;\n            case 'phone-square':\n                iconName = 'phone';\n                break;\n            case 'home':\n                iconName = 'house';\n                break;\n            case 'clock-o':\n                iconName = 'clock';\n                break;\n            case 'usd':\n                iconName = 'currency-dollar';\n                break;\n            case 'html5':\n                iconName = 'file-richtext';\n                break;\n            case 'pencil-square-o':\n                iconName = 'pencil-square';\n                break;\n            case 'columns':\n                iconName = 'layout-three-columns';\n                break;\n            case 'list-alt':\n                iconName = 'window';\n                break;\n            case 'th-large':\n                iconName = 'grid-fill';\n                break;\n            case 'folder-o':\n                iconName = 'folder';\n                break;\n            case 'square-o':\n                iconName = 'square';\n                break;\n            case 'user-secret':\n                iconName = 'person-fill-slash';\n                break;\n            case 'folder-open':\n                iconName = 'folder2-open';\n                break;\n            case 'th':\n                iconName = 'grid-3x3-gap-fill';\n                break;\n            case 'tasks':\n                iconName = 'view-stacked';\n                break;\n            case 'indent':\n                iconName = 'text-indent-left';\n                break;\n            case 'refresh':\n                iconName = 'arrow-repeat';\n                break;\n            case 'files-o':\n                iconName = 'files';\n                break;\n            case 'wpforms':\n                iconName = 'window-stack';\n                break;\n            case 'cube':\n                iconName = 'box';\n                break;\n            case 'cubes':\n                iconName = 'boxes';\n                break;\n            case 'check-square-o':\n                iconName = 'check-square';\n                break;\n            case 'plus':\n                iconName = 'plus-lg';\n                break;\n            case 'question-sign':\n                name = 'question-circle';\n                iconName = 'question-circle';\n                break;\n            case 'remove-circle':\n            case 'circle-xmark':\n                iconName = 'x-circle';\n                break;\n            case 'new-window':\n                name = 'window-restore';\n                iconName = 'window-plus';\n                break;\n            case 'move':\n                name = 'arrows';\n                iconName = 'arrows-move';\n                break;\n            case 'edit':\n                iconName = 'pencil';\n                break;\n            case 'time':\n                iconName = 'clock';\n                break;\n            case 'video':\n                iconName = 'camera-video';\n                break;\n            case 'microphone':\n                iconName = 'mic';\n                break;\n            case 'folder-open':\n                iconName = 'folder2-open';\n                break;\n            case 'check-circle':\n                iconName = 'check-circle-fill';\n                break;\n            case 'times-circle':\n                iconName = 'x-circle-fill';\n                break;\n            case 'pencil':\n                iconName = 'pencil-fill';\n                break;\n            case 'minus':\n                iconName = 'dash';\n                break;\n            case 'circle':\n                iconName = 'circle-fill';\n                break;\n            case 'search-plus':\n                iconName = 'zoom-in';\n                break;\n            case 'search-minus':\n                iconName = 'zoom-out';\n                break;\n            case 'hand-paper-o':\n                iconName = 'hand-index';\n                break;\n            case 'undo':\n                iconName = 'arrow-counterclockwise';\n                break;\n            case 'repeat':\n                iconName = 'arrow-clockwise';\n                break;\n        }\n    }\n    function generateIconClass() {\n        if (spinning) {\n            return 'spinner-border spinner-border-sm';\n        }\n        // Handles legacy icons names. For example, fa-remove-circle was changed to fa-circle-xmark in a major version\n        // update of font-awesome. To handle cases where customers are still on a very old version of font-awesome add\n        // a fallback if statement to handle such cases\n        function handleLegacyIconNames() {\n            if (iconName === 'circle-xmark') {\n                return `${iconset}-${iconName} ${iconset}-remove-circle`;\n            }\n            return `${iconset}-${iconName}`;\n        }\n        return `${iconset} ${handleLegacyIconNames()}`;\n    }\n    return generateIconClass();\n};\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/bootstrap/lib/cjs/templates/bootstrap5/iconClass.js?");
 
 /***/ }),
 
@@ -7114,7 +7103,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\ncons
   \***********************************************************************************************/
 /***/ (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 += '<tr ref=\"row\">\\n  <td>\\n    ' +\n((__t = (ctx.element)) == null ? '' : __t) +\n'\\n  </td>\\n  ';\n if (!ctx.disabled) { ;\n__p += '\\n  <td>\\n    <button type=\"button\" class=\"btn btn-secondary\" ref=\"removeRow\">\\n      <i class=\"' +\n((__t = (ctx.iconClass('remove-circle'))) == null ? '' : __t) +\n'\"></i>\\n    </button>\\n  </td>\\n  ';\n } ;\n__p += '\\n</tr>\\n';\nreturn __p\n}\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/bootstrap/lib/cjs/templates/bootstrap5/multiValueRow/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 += '<tr ref=\"row\">\\n  <td>\\n    ' +\n((__t = (ctx.element)) == null ? '' : __t) +\n'\\n  </td>\\n  ';\n if (!ctx.disabled) { ;\n__p += '\\n  <td>\\n    <button type=\"button\" class=\"btn btn-secondary\" ref=\"removeRow\">\\n      <i class=\"' +\n((__t = (ctx.iconClass('circle-xmark'))) == null ? '' : __t) +\n'\"></i>\\n    </button>\\n  </td>\\n  ';\n } ;\n__p += '\\n</tr>\\n';\nreturn __p\n}\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/bootstrap/lib/cjs/templates/bootstrap5/multiValueRow/form.ejs.js?");
 
 /***/ }),
 
@@ -8905,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.1';\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.10';\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?");
 
 /***/ }),
 
@@ -8916,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.1';\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.10';\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?");
 
 /***/ }),