@formio/js 5.0.0-rc.71 → 5.0.0-rc.72
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/formio.embed.js +1 -1
- package/dist/formio.embed.min.js +1 -1
- package/dist/formio.embed.min.js.LICENSE.txt +1 -1
- package/dist/formio.form.js +12 -12
- package/dist/formio.form.min.js +1 -1
- package/dist/formio.form.min.js.LICENSE.txt +1 -1
- package/dist/formio.full.js +12 -12
- package/dist/formio.full.min.js +1 -1
- package/dist/formio.full.min.js.LICENSE.txt +1 -1
- package/dist/formio.js +3 -3
- package/dist/formio.min.js +1 -1
- package/dist/formio.min.js.LICENSE.txt +1 -1
- package/dist/formio.utils.js +3 -3
- package/dist/formio.utils.min.js +1 -1
- package/dist/formio.utils.min.js.LICENSE.txt +1 -1
- package/lib/cjs/PDF.js +1 -1
- package/lib/cjs/Webform.js +0 -1
- package/lib/cjs/components/_classes/nested/NestedComponent.js +2 -1
- package/lib/cjs/components/datagrid/DataGrid.d.ts +0 -1
- package/lib/cjs/components/datagrid/DataGrid.js +0 -8
- package/lib/cjs/components/datamap/DataMap.js +1 -1
- package/lib/cjs/components/editgrid/EditGrid.js +1 -5
- package/lib/cjs/components/file/File.js +4 -0
- package/lib/mjs/PDF.js +1 -1
- package/lib/mjs/Webform.js +0 -1
- package/lib/mjs/components/_classes/nested/NestedComponent.js +2 -1
- package/lib/mjs/components/datagrid/DataGrid.d.ts +0 -1
- package/lib/mjs/components/datagrid/DataGrid.js +0 -8
- package/lib/mjs/components/datamap/DataMap.js +1 -1
- package/lib/mjs/components/editgrid/EditGrid.js +1 -5
- package/lib/mjs/components/file/File.js +4 -0
- package/package.json +2 -2
package/dist/formio.form.js
CHANGED
@@ -1575,7 +1575,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
|
|
1575
1575
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
1576
1576
|
|
1577
1577
|
"use strict";
|
1578
|
-
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.checkSimpleConditional = exports.checkJsonConditional = exports.checkLegacyConditional = exports.checkCustomConditional = exports.conditionallyHidden = exports.isSimpleConditional = exports.isLegacyConditional = exports.isJSONConditional = void 0;\nconst jsonlogic_1 = __webpack_require__(/*! ../modules/jsonlogic */ \"./node_modules/@formio/core/lib/modules/jsonlogic/index.js\");\nconst formUtil_1 = __webpack_require__(/*! ./formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil.js\");\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst operators_1 = __importDefault(__webpack_require__(/*! ./operators */ \"./node_modules/@formio/core/lib/utils/operators/index.js\"));\nconst isJSONConditional = (conditional) => {\n return conditional && conditional.json && (0, lodash_1.isObject)(conditional.json);\n};\nexports.isJSONConditional = isJSONConditional;\nconst isLegacyConditional = (conditional) => {\n return conditional && conditional.when;\n};\nexports.isLegacyConditional = isLegacyConditional;\nconst isSimpleConditional = (conditional) => {\n return conditional && conditional.conjunction && conditional.conditions;\n};\nexports.isSimpleConditional = isSimpleConditional;\nfunction conditionallyHidden(context) {\n const { scope, component, path } = context;\n if (scope.conditionals && path) {\n const hidden = (0, lodash_1.find)(scope.conditionals, (conditional) => {\n return conditional.path === path;\n });\n return hidden === null || hidden === void 0 ? void 0 : hidden.conditionallyHidden;\n }\n return false;\n}\nexports.conditionallyHidden = conditionallyHidden;\n/**\n * Check custom javascript conditional.\n *\n * @param component\n * @param custom\n * @param row\n * @param data\n * @returns {*}\n */\nfunction checkCustomConditional(condition, context, variable = 'show') {\n const { evalContext } = context;\n if (!condition) {\n return null;\n }\n const value = (0, jsonlogic_1.evaluate)(context, condition, variable, evalContext);\n if (value === null) {\n return null;\n }\n return value;\n}\nexports.checkCustomConditional = checkCustomConditional;\n/**\n * Checks the legacy conditionals.\n *\n * @param conditional\n * @param context\n * @param checkDefault\n * @returns\n */\nfunction checkLegacyConditional(conditional, context) {\n const { row, data, component } = context;\n if (!conditional || !(0, exports.isLegacyConditional)(conditional) || !conditional.when) {\n return null;\n }\n const value = (0, formUtil_1.getComponentActualValue)(component, conditional.when, data, row);\n const eq = String(conditional.eq);\n const show = String(conditional.show);\n if ((0, lodash_1.isObject)(value) && (0, lodash_1.has)(value, eq)) {\n return String(value[eq]) === show;\n }\n if (Array.isArray(value) && value.map(String).includes(eq)) {\n return show === 'true';\n }\n return (String(value) === eq) === (show === 'true');\n}\nexports.checkLegacyConditional = checkLegacyConditional;\n/**\n * Checks the JSON Conditionals.\n * @param conditional\n * @param context\n * @returns\n */\nfunction checkJsonConditional(conditional, context) {\n const { evalContext } = context;\n if (!conditional || !(0, exports.isJSONConditional)(conditional)) {\n return null;\n }\n const evalContextValue = evalContext ? evalContext(context) : context;\n return jsonlogic_1.JSONLogicEvaluator.evaluate(conditional.json, evalContextValue);\n}\nexports.checkJsonConditional = checkJsonConditional;\n/**\n * Checks the simple conditionals.\n * @param conditional\n * @param context\n * @returns\n */\nfunction checkSimpleConditional(conditional, context) {\n const { component, data, row, instance, form } = context;\n if (!conditional || !(0, exports.isSimpleConditional)(conditional)) {\n return null;\n }\n const { conditions = [], conjunction = 'all', show = true } = conditional;\n if (!conditions.length) {\n return null;\n }\n const conditionsResult = (0, lodash_1.filter)((0, lodash_1.map)(conditions, (cond) => {\n const { value: comparedValue, operator, component: conditionComponentPath } = cond;\n if (!conditionComponentPath) {\n // Ignore conditions if there is no component path.\n return null;\n }\n const
|
1578
|
+
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.checkSimpleConditional = exports.checkJsonConditional = exports.checkLegacyConditional = exports.checkCustomConditional = exports.conditionallyHidden = exports.isSimpleConditional = exports.isLegacyConditional = exports.isJSONConditional = void 0;\nconst jsonlogic_1 = __webpack_require__(/*! ../modules/jsonlogic */ \"./node_modules/@formio/core/lib/modules/jsonlogic/index.js\");\nconst formUtil_1 = __webpack_require__(/*! ./formUtil */ \"./node_modules/@formio/core/lib/utils/formUtil.js\");\nconst lodash_1 = __webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\");\nconst operators_1 = __importDefault(__webpack_require__(/*! ./operators */ \"./node_modules/@formio/core/lib/utils/operators/index.js\"));\nconst isJSONConditional = (conditional) => {\n return conditional && conditional.json && (0, lodash_1.isObject)(conditional.json);\n};\nexports.isJSONConditional = isJSONConditional;\nconst isLegacyConditional = (conditional) => {\n return conditional && conditional.when;\n};\nexports.isLegacyConditional = isLegacyConditional;\nconst isSimpleConditional = (conditional) => {\n return conditional && conditional.conjunction && conditional.conditions;\n};\nexports.isSimpleConditional = isSimpleConditional;\nfunction conditionallyHidden(context) {\n const { scope, component, path } = context;\n if (scope.conditionals && path) {\n const hidden = (0, lodash_1.find)(scope.conditionals, (conditional) => {\n return conditional.path === path;\n });\n return hidden === null || hidden === void 0 ? void 0 : hidden.conditionallyHidden;\n }\n return false;\n}\nexports.conditionallyHidden = conditionallyHidden;\n/**\n * Check custom javascript conditional.\n *\n * @param component\n * @param custom\n * @param row\n * @param data\n * @returns {*}\n */\nfunction checkCustomConditional(condition, context, variable = 'show') {\n const { evalContext } = context;\n if (!condition) {\n return null;\n }\n const value = (0, jsonlogic_1.evaluate)(context, condition, variable, evalContext);\n if (value === null) {\n return null;\n }\n return value;\n}\nexports.checkCustomConditional = checkCustomConditional;\n/**\n * Checks the legacy conditionals.\n *\n * @param conditional\n * @param context\n * @param checkDefault\n * @returns\n */\nfunction checkLegacyConditional(conditional, context) {\n const { row, data, component } = context;\n if (!conditional || !(0, exports.isLegacyConditional)(conditional) || !conditional.when) {\n return null;\n }\n const value = (0, formUtil_1.getComponentActualValue)(component, conditional.when, data, row);\n const eq = String(conditional.eq);\n const show = String(conditional.show);\n if ((0, lodash_1.isObject)(value) && (0, lodash_1.has)(value, eq)) {\n return String(value[eq]) === show;\n }\n if (Array.isArray(value) && value.map(String).includes(eq)) {\n return show === 'true';\n }\n return (String(value) === eq) === (show === 'true');\n}\nexports.checkLegacyConditional = checkLegacyConditional;\n/**\n * Checks the JSON Conditionals.\n * @param conditional\n * @param context\n * @returns\n */\nfunction checkJsonConditional(conditional, context) {\n const { evalContext } = context;\n if (!conditional || !(0, exports.isJSONConditional)(conditional)) {\n return null;\n }\n const evalContextValue = evalContext ? evalContext(context) : context;\n return jsonlogic_1.JSONLogicEvaluator.evaluate(conditional.json, evalContextValue);\n}\nexports.checkJsonConditional = checkJsonConditional;\n/**\n * Checks the simple conditionals.\n * @param conditional\n * @param context\n * @returns\n */\nfunction checkSimpleConditional(conditional, context) {\n const { component, data, row, instance, form, components = [] } = context;\n if (!conditional || !(0, exports.isSimpleConditional)(conditional)) {\n return null;\n }\n const { conditions = [], conjunction = 'all', show = true } = conditional;\n if (!conditions.length) {\n return null;\n }\n const conditionsResult = (0, lodash_1.filter)((0, lodash_1.map)(conditions, (cond) => {\n const { value: comparedValue, operator, component: conditionComponentPath } = cond;\n if (!conditionComponentPath) {\n // Ignore conditions if there is no component path.\n return null;\n }\n const conditionComponent = (0, formUtil_1.getComponent)((form === null || form === void 0 ? void 0 : form.components) || components, conditionComponentPath, true);\n const value = conditionComponent ? (0, formUtil_1.getComponentActualValue)(conditionComponent, conditionComponentPath, data, row) : null;\n const ConditionOperator = operators_1.default[operator];\n return ConditionOperator\n ? new ConditionOperator().getResult({ value, comparedValue, instance, component, conditionComponent, conditionComponentPath })\n : true;\n }), (res) => (res !== null));\n let result = false;\n switch (conjunction) {\n case 'any':\n result = (0, lodash_1.some)(conditionsResult, res => !!res);\n break;\n default:\n result = (0, lodash_1.every)(conditionsResult, res => !!res);\n }\n return show ? result : !result;\n}\nexports.checkSimpleConditional = checkSimpleConditional;\n\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/conditions.js?");
|
1579
1579
|
|
1580
1580
|
/***/ }),
|
1581
1581
|
|
@@ -1630,7 +1630,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
|
|
1630
1630
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
1631
1631
|
|
1632
1632
|
"use strict";
|
1633
|
-
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.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.getComponentActualValue = exports.getComponentData = exports.eachComponentAsync = exports.eachComponent = exports.componentInfo = exports.getContextualRowData = exports.getContextualRowPath = exports.getComponentKey = exports.eachComponentData = exports.eachComponentDataAsync = exports.componentFormPath = exports.componentDataPath = exports.componentPath = exports.isComponentNestedDataType = exports.isComponentModelType = exports.getComponentPath = exports.getComponentAbsolutePath = exports.getModelType = exports.MODEL_TYPES = 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 Evaluator_1 = __webpack_require__(/*! ./Evaluator */ \"./node_modules/@formio/core/lib/utils/Evaluator.js\");\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 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;\nexports.MODEL_TYPES = {\n array: [\n 'datagrid',\n 'editgrid',\n 'datatable',\n 'dynamicWizard',\n 'tagpad'\n ],\n dataObject: [\n 'form'\n ],\n object: [\n 'container',\n 'address'\n ],\n map: [\n 'datamap'\n ],\n content: [\n 'htmlelement',\n 'content'\n ],\n layout: [\n 'table',\n 'tabs',\n 'well',\n 'columns',\n 'fieldset',\n 'panel',\n 'tabs'\n ],\n};\nfunction getModelType(component) {\n if (isComponentNestedDataType(component)) {\n if (isComponentModelType(component, 'dataObject')) {\n return 'dataObject';\n }\n if (isComponentModelType(component, 'array')) {\n return 'array';\n }\n return 'object';\n }\n if ((component.input === false) || isComponentModelType(component, 'layout')) {\n return 'inherit';\n }\n if (getComponentKey(component)) {\n return 'value';\n }\n return 'inherit';\n}\nexports.getModelType = getModelType;\nfunction getComponentAbsolutePath(component) {\n let paths = [component.path];\n while (component.parent) {\n component = component.parent;\n // We only need to do this for nested forms because they reset the data contexts for the children.\n if (isComponentModelType(component, 'dataObject')) {\n paths[paths.length - 1] = `data.${paths[paths.length - 1]}`;\n paths.push(component.path);\n }\n }\n return paths.reverse().join('.');\n}\nexports.getComponentAbsolutePath = getComponentAbsolutePath;\nfunction getComponentPath(component, path) {\n const key = getComponentKey(component);\n if (!key) {\n return path;\n }\n if (!path) {\n return key;\n }\n if (path.match(new RegExp(`${key}$`))) {\n return path;\n }\n return (getModelType(component) === 'inherit') ? `${path}.${key}` : path;\n}\nexports.getComponentPath = getComponentPath;\nfunction isComponentModelType(component, modelType) {\n return component.modelType === modelType || exports.MODEL_TYPES[modelType].includes(component.type);\n}\nexports.isComponentModelType = isComponentModelType;\nfunction isComponentNestedDataType(component) {\n return component.tree || isComponentModelType(component, 'array') ||\n isComponentModelType(component, 'dataObject') ||\n isComponentModelType(component, 'object') ||\n isComponentModelType(component, 'map');\n}\nexports.isComponentNestedDataType = isComponentNestedDataType;\nfunction componentPath(component, parentPath) {\n parentPath = component.parentPath || parentPath;\n const key = getComponentKey(component);\n if (!key) {\n // If the component does not have a key, then just always return the parent path.\n return parentPath || '';\n }\n return parentPath ? `${parentPath}.${key}` : key;\n}\nexports.componentPath = componentPath;\nconst componentDataPath = (component, parentPath, path) => {\n parentPath = component.parentPath || parentPath;\n path = path || componentPath(component, parentPath);\n // See if we are a nested component.\n if (component.components && Array.isArray(component.components)) {\n if (isComponentModelType(component, 'dataObject')) {\n return `${path}.data`;\n }\n if (isComponentModelType(component, 'array')) {\n return `${path}[0]`;\n }\n if (isComponentNestedDataType(component)) {\n return path;\n }\n return parentPath;\n }\n return path;\n};\nexports.componentDataPath = componentDataPath;\nconst componentFormPath = (component, parentPath, path) => {\n parentPath = component.parentPath || parentPath;\n path = path || componentPath(component, parentPath);\n if (isComponentModelType(component, 'dataObject')) {\n return `${path}.data`;\n }\n if (isComponentNestedDataType(component)) {\n return path;\n }\n return parentPath;\n};\nexports.componentFormPath = componentFormPath;\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, path = \"\", index, parent, includeAll = false) {\n if (!components || !data) {\n return;\n }\n return yield eachComponentAsync(components, (component, compPath, componentComponents, compParent) => __awaiter(void 0, void 0, void 0, function* () {\n const row = getContextualRowData(component, compPath, data);\n if ((yield fn(component, data, row, compPath, componentComponents, index, compParent)) === true) {\n return true;\n }\n if (isComponentNestedDataType(component)) {\n const value = (0, lodash_1.get)(data, compPath, data);\n if (Array.isArray(value)) {\n for (let i = 0; i < value.length; i++) {\n yield (0, exports.eachComponentDataAsync)(component.components, data, fn, `${compPath}[${i}]`, i, component, includeAll);\n }\n return true;\n }\n else if ((0, lodash_1.isEmpty)(row) && !includeAll) {\n // Tree components may submit empty objects; since we've already evaluated the parent tree/layout component, we won't worry about constituent elements\n return true;\n }\n if (isComponentModelType(component, 'dataObject')) {\n // No need to bother processing all the children data if there is no data for this form.\n if ((0, lodash_1.has)(data, component.path)) {\n // For nested forms, we need to reset the \"data\" and \"path\" objects for all of the children components, and then re-establish the data when it is done.\n const childPath = (0, exports.componentDataPath)(component, path, compPath);\n const childData = (0, lodash_1.get)(data, childPath, null);\n yield (0, exports.eachComponentDataAsync)(component.components, childData, fn, '', index, component, includeAll);\n (0, lodash_1.set)(data, childPath, childData);\n }\n }\n else {\n yield (0, exports.eachComponentDataAsync)(component.components, data, fn, (0, exports.componentDataPath)(component, path, compPath), index, component, includeAll);\n }\n return true;\n }\n return false;\n }), true, path, parent);\n});\nexports.eachComponentDataAsync = eachComponentDataAsync;\nconst eachComponentData = (components, data, fn, path = \"\", index, parent, includeAll = false) => {\n if (!components || !data) {\n return;\n }\n return eachComponent(components, (component, compPath, componentComponents, compParent) => {\n const row = getContextualRowData(component, compPath, data);\n if (fn(component, data, row, compPath, componentComponents, index, compParent) === true) {\n return true;\n }\n if (isComponentNestedDataType(component)) {\n const value = (0, lodash_1.get)(data, compPath, data);\n if (Array.isArray(value)) {\n for (let i = 0; i < value.length; i++) {\n (0, exports.eachComponentData)(component.components, data, fn, `${compPath}[${i}]`, i, component, includeAll);\n }\n return true;\n }\n else if ((0, lodash_1.isEmpty)(row) && !includeAll) {\n // Tree components may submit empty objects; since we've already evaluated the parent tree/layout component, we won't worry about constituent elements\n return true;\n }\n if (isComponentModelType(component, 'dataObject')) {\n // No need to bother processing all the children data if there is no data for this form.\n if ((0, lodash_1.has)(data, component.path)) {\n // For nested forms, we need to reset the \"data\" and \"path\" objects for all of the children components, and then re-establish the data when it is done.\n const childPath = (0, exports.componentDataPath)(component, path, compPath);\n const childData = (0, lodash_1.get)(data, childPath, {});\n (0, exports.eachComponentData)(component.components, childData, fn, '', index, component, includeAll);\n (0, lodash_1.set)(data, childPath, childData);\n }\n }\n else {\n (0, exports.eachComponentData)(component.components, data, fn, (0, exports.componentDataPath)(component, path, compPath), index, component, includeAll);\n }\n return true;\n }\n return false;\n }, true, path, parent);\n};\nexports.eachComponentData = eachComponentData;\nfunction getComponentKey(component) {\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, path) {\n return path.replace(new RegExp(`\\.?${getComponentKey(component)}$`), '');\n}\nexports.getContextualRowPath = getContextualRowPath;\nfunction getContextualRowData(component, path, data) {\n const rowPath = getContextualRowPath(component, path);\n return rowPath ? (0, lodash_1.get)(data, rowPath, null) : data;\n}\nexports.getContextualRowData = getContextualRowData;\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 = isComponentModelType(component, 'content');\n const isLayout = isComponentModelType(component, 'layout');\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/**\n * Iterate through each component within a form.\n *\n * @param {Object} components\n * The components to iterate.\n * @param {Function} fn\n * The iteration function to invoke for each component.\n * @param {Boolean} includeAll\n * Whether or not to include layout components.\n * @param {String} path\n * The current data path of the element. Example: data.user.firstName\n * @param {Object} parent\n * The parent object.\n */\nfunction eachComponent(components, fn, includeAll, path, parent) {\n if (!components)\n return;\n path = path || \"\";\n components.forEach((component) => {\n if (!component) {\n return;\n }\n const info = componentInfo(component);\n let noRecurse = false;\n // Keep track of parent references.\n if (parent) {\n // Ensure we don't create infinite JSON structures.\n Object.defineProperty(component, 'parent', {\n enumerable: false,\n writable: true,\n value: JSON.parse(JSON.stringify(parent))\n });\n Object.defineProperty(component.parent, 'parent', {\n enumerable: false,\n writable: true,\n value: parent.parent\n });\n Object.defineProperty(component.parent, 'path', {\n enumerable: false,\n writable: true,\n value: parent.path\n });\n delete component.parent.components;\n delete component.parent.componentMap;\n delete component.parent.columns;\n delete component.parent.rows;\n }\n Object.defineProperty(component, 'path', {\n enumerable: false,\n writable: true,\n value: componentPath(component, path)\n });\n if (includeAll || component.tree || !info.layout) {\n noRecurse = fn(component, component.path, components, parent);\n }\n if (!noRecurse) {\n if (info.hasColumns) {\n component.columns.forEach((column) => eachComponent(column.components, fn, includeAll, path, parent ? component : null));\n }\n else if (info.hasRows) {\n component.rows.forEach((row) => {\n if (Array.isArray(row)) {\n row.forEach((column) => eachComponent(column.components, fn, includeAll, path, parent ? component : null));\n }\n });\n }\n else if (info.hasComps) {\n eachComponent(component.components, fn, includeAll, (0, exports.componentFormPath)(component, path, component.path), parent ? component : null);\n }\n }\n });\n}\nexports.eachComponent = eachComponent;\n// Async each component.\nfunction eachComponentAsync(components_2, fn_1) {\n return __awaiter(this, arguments, void 0, function* (components, fn, includeAll = false, path = \"\", parent) {\n var _a, _b;\n if (!components)\n return;\n for (let i = 0; i < components.length; i++) {\n if (!components[i]) {\n continue;\n }\n let component = components[i];\n const info = componentInfo(component);\n // Keep track of parent references.\n if (parent) {\n // Ensure we don't create infinite JSON structures.\n Object.defineProperty(component, 'parent', {\n enumerable: false,\n writable: true,\n value: JSON.parse(JSON.stringify(parent))\n });\n Object.defineProperty(component.parent, 'parent', {\n enumerable: false,\n writable: true,\n value: parent.parent\n });\n Object.defineProperty(component.parent, 'path', {\n enumerable: false,\n writable: true,\n value: parent.path\n });\n delete component.parent.components;\n delete component.parent.componentMap;\n delete component.parent.columns;\n delete component.parent.rows;\n }\n Object.defineProperty(component, 'path', {\n enumerable: false,\n writable: true,\n value: componentPath(component, path)\n });\n if (includeAll || component.tree || !info.layout) {\n if (yield fn(component, component.path, components, parent)) {\n continue;\n }\n }\n if (info.hasColumns) {\n for (let j = 0; j < component.columns.length; j++) {\n yield eachComponentAsync((_a = component.columns[j]) === null || _a === void 0 ? void 0 : _a.components, fn, includeAll, path, parent ? component : null);\n }\n }\n else if (info.hasRows) {\n for (let j = 0; j < component.rows.length; j++) {\n let row = component.rows[j];\n if (Array.isArray(row)) {\n for (let k = 0; k < row.length; k++) {\n yield eachComponentAsync((_b = row[k]) === null || _b === void 0 ? void 0 : _b.components, fn, includeAll, path, parent ? component : null);\n }\n }\n }\n }\n else if (info.hasComps) {\n yield eachComponentAsync(component.components, fn, includeAll, (0, exports.componentFormPath)(component, path, component.path), parent ? component : null);\n }\n }\n });\n}\nexports.eachComponentAsync = eachComponentAsync;\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, exports.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 getComponentActualValue(component, compPath, data, row) {\n var _a;\n // The compPath here will NOT contain the indexes for DataGrids and EditGrids.\n //\n // a[0].b[2].c[3].d\n //\n // Because of this, we will need to determine our parent component path (not data path),\n // and find the \"row\" based comp path.\n //\n // a[0].b[2].c[3].d => a.b.c.d\n //\n let parentInputComponent = null;\n let parent = component;\n while (((_a = parent === null || parent === void 0 ? void 0 : parent.parent) === null || _a === void 0 ? void 0 : _a.path) && !parentInputComponent) {\n parent = parent.parent;\n if (parent.input) {\n parentInputComponent = parent;\n }\n }\n if (parentInputComponent) {\n const parentCompPath = parentInputComponent.path.replace(/\\[[0-9]+\\]/g, '');\n compPath = compPath.replace(parentCompPath, '');\n compPath = (0, lodash_1.trim)(compPath, '. ');\n }\n let value = null;\n if (row) {\n value = (0, lodash_1.get)(row, compPath);\n }\n if (data && (0, lodash_1.isNil)(value)) {\n value = (0, lodash_1.get)(data, compPath);\n }\n if ((0, lodash_1.isNil)(value) || ((0, lodash_1.isObject)(value) && (0, lodash_1.isEmpty)(value))) {\n value = '';\n }\n return value;\n}\nexports.getComponentActualValue = getComponentActualValue;\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 && Array.isArray(component.columns)) ||\n (component.rows && Array.isArray(component.rows)) ||\n (component.components && 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) {\n if ((0, lodash_1.isString)(query)) {\n return (component.key === query) || (component.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 key\n *\n * @param {Object} components - The components to iterate.\n * @param {String|Object} key - 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, key, includeAll = false) {\n let result;\n eachComponent(components, (component, path) => {\n if ((path === key) || (component.path === key) || (component.input && (component.key === key))) {\n result = component;\n return true;\n }\n }, includeAll);\n return result;\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 eachComponent(components, (component) => {\n if (matchComponent(component, query)) {\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 // Using _.unset() leave a null value. Use Array splice instead.\n // @ts-ignore\n var 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 && (component.conditional.when ||\n component.conditional.json ||\n component.conditional.conjunction)));\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)\n ? value.replace(/[^\\de.+-]/gi, '')\n : 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)\n .toString()\n .split('.');\n parts[0] = (0, lodash_1.chunk)(Array.from(parts[0]).reverse(), 3)\n .reverse()\n .map((part) => part\n .reverse()\n .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 = ['label', 'title', 'legend', 'tooltip', 'description', 'placeholder', 'prefix', 'suffix', 'errorLabel', 'content', 'html'];\n const strings = [];\n 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') && component.hasOwnProperty('values') && Array.isArray(component.values) && 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 [\n 'loading...',\n 'Type to search'\n ].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 var found = false;\n switch (change.op) {\n case 'add':\n var 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 var container = (0, lodash_1.get)(parent, change.path);\n container.splice(change.index, 0, newComponent);\n });\n break;\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 (err) {\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 var 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 var 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 var rowPath = newPath.slice();\n rowPath.push(index);\n row.forEach(function (column, index) {\n var 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.type === 'checkbox';\nconst isDataGridComponent = (component) => component.type === 'datagrid';\nconst isEditGridComponent = (component) => component.type === 'editgrid';\nconst isDataTableComponent = (component) => component.type === 'datatable';\nconst hasChildComponents = (component) => component.components != null;\nconst isDateTimeComponent = (component) => component.type === 'datetime';\nconst isSelectBoxesComponent = (component) => component.type === 'selectboxes';\nconst isTextAreaComponent = (component) => component.type === 'textarea';\nconst isTextFieldComponent = (component) => 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> </p>';\n const br = '<p><br></p>';\n const brNbsp = '<p><br> </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) {\n var _a;\n const value = (0, lodash_1.get)(data, path);\n if (isCheckboxComponent(component)) {\n return isValueEmpty(component, value) || value === false;\n }\n else if (isDataGridComponent(component) || isEditGridComponent(component) || isDataTableComponent(component) || 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, exports.eachComponentData)([component], data, (thisComponent, data, row, path, components, index) => {\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 ? typeof value === 'string' ? isValueEmpty(component, value.trim()) : isValueEmpty(component, value) : isValueEmpty(component, trimBlanks(value));\n }\n else if (isTextFieldComponent(component)) {\n if (component.allowMultipleMasks && !!component.inputMasks && !!component.inputMasks.length) {\n return isValueEmpty(component, value) || (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\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/formUtil.js?");
|
1633
|
+
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.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.getComponentActualValue = exports.getComponentData = exports.eachComponentAsync = exports.eachComponent = exports.componentInfo = exports.getContextualRowData = exports.getContextualRowPath = exports.getComponentKey = exports.eachComponentData = exports.eachComponentDataAsync = exports.componentFormPath = exports.componentDataPath = exports.componentPath = exports.isComponentNestedDataType = exports.isComponentModelType = exports.getComponentPath = exports.getComponentAbsolutePath = exports.getModelType = exports.MODEL_TYPES = 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 Evaluator_1 = __webpack_require__(/*! ./Evaluator */ \"./node_modules/@formio/core/lib/utils/Evaluator.js\");\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 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;\nexports.MODEL_TYPES = {\n array: [\n 'datagrid',\n 'editgrid',\n 'datatable',\n 'dynamicWizard',\n 'tagpad'\n ],\n dataObject: [\n 'form'\n ],\n object: [\n 'container',\n 'address'\n ],\n map: [\n 'datamap'\n ],\n content: [\n 'htmlelement',\n 'content'\n ],\n layout: [\n 'table',\n 'tabs',\n 'well',\n 'columns',\n 'fieldset',\n 'panel',\n 'tabs'\n ],\n};\nfunction getModelType(component) {\n if (isComponentNestedDataType(component)) {\n if (isComponentModelType(component, 'dataObject')) {\n return 'dataObject';\n }\n if (isComponentModelType(component, 'array')) {\n return 'array';\n }\n if (isComponentModelType(component, 'map')) {\n return 'map';\n }\n return 'object';\n }\n if ((component.input === false) || isComponentModelType(component, 'layout')) {\n return 'inherit';\n }\n if (getComponentKey(component)) {\n return 'value';\n }\n return 'inherit';\n}\nexports.getModelType = getModelType;\nfunction getComponentAbsolutePath(component) {\n let paths = [component.path];\n while (component.parent) {\n component = component.parent;\n // We only need to do this for nested forms because they reset the data contexts for the children.\n if (isComponentModelType(component, 'dataObject')) {\n paths[paths.length - 1] = `data.${paths[paths.length - 1]}`;\n paths.push(component.path);\n }\n }\n return paths.reverse().join('.');\n}\nexports.getComponentAbsolutePath = getComponentAbsolutePath;\nfunction getComponentPath(component, path) {\n const key = getComponentKey(component);\n if (!key) {\n return path;\n }\n if (!path) {\n return key;\n }\n if (path.match(new RegExp(`${key}$`))) {\n return path;\n }\n return (getModelType(component) === 'inherit') ? `${path}.${key}` : path;\n}\nexports.getComponentPath = getComponentPath;\nfunction isComponentModelType(component, modelType) {\n return component.modelType === modelType || exports.MODEL_TYPES[modelType].includes(component.type);\n}\nexports.isComponentModelType = isComponentModelType;\nfunction isComponentNestedDataType(component) {\n return component.tree || isComponentModelType(component, 'array') ||\n isComponentModelType(component, 'dataObject') ||\n isComponentModelType(component, 'object') ||\n isComponentModelType(component, 'map');\n}\nexports.isComponentNestedDataType = isComponentNestedDataType;\nfunction componentPath(component, parentPath) {\n parentPath = component.parentPath || parentPath;\n const key = getComponentKey(component);\n if (!key) {\n // If the component does not have a key, then just always return the parent path.\n return parentPath || '';\n }\n return parentPath ? `${parentPath}.${key}` : key;\n}\nexports.componentPath = componentPath;\nconst componentDataPath = (component, parentPath, path) => {\n parentPath = component.parentPath || parentPath;\n path = path || componentPath(component, parentPath);\n // See if we are a nested component.\n if (component.components && Array.isArray(component.components)) {\n if (isComponentModelType(component, 'dataObject')) {\n return `${path}.data`;\n }\n if (isComponentModelType(component, 'array')) {\n return `${path}[0]`;\n }\n if (isComponentNestedDataType(component)) {\n return path;\n }\n return parentPath;\n }\n return path;\n};\nexports.componentDataPath = componentDataPath;\nconst componentFormPath = (component, parentPath, path) => {\n parentPath = component.parentPath || parentPath;\n path = path || componentPath(component, parentPath);\n if (isComponentModelType(component, 'dataObject')) {\n return `${path}.data`;\n }\n if (isComponentNestedDataType(component)) {\n return path;\n }\n return parentPath;\n};\nexports.componentFormPath = componentFormPath;\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, path = \"\", index, parent, includeAll = false) {\n if (!components || !data) {\n return;\n }\n return yield eachComponentAsync(components, (component, compPath, componentComponents, compParent) => __awaiter(void 0, void 0, void 0, function* () {\n const row = getContextualRowData(component, compPath, data);\n if ((yield fn(component, data, row, compPath, componentComponents, index, compParent)) === true) {\n return true;\n }\n if (isComponentNestedDataType(component)) {\n const value = (0, lodash_1.get)(data, compPath, data);\n if (Array.isArray(value)) {\n for (let i = 0; i < value.length; i++) {\n yield (0, exports.eachComponentDataAsync)(component.components, data, fn, `${compPath}[${i}]`, i, component, includeAll);\n }\n return true;\n }\n else if ((0, lodash_1.isEmpty)(row) && !includeAll) {\n // Tree components may submit empty objects; since we've already evaluated the parent tree/layout component, we won't worry about constituent elements\n return true;\n }\n if (isComponentModelType(component, 'dataObject')) {\n // No need to bother processing all the children data if there is no data for this form.\n if ((0, lodash_1.has)(data, component.path)) {\n // For nested forms, we need to reset the \"data\" and \"path\" objects for all of the children components, and then re-establish the data when it is done.\n const childPath = (0, exports.componentDataPath)(component, path, compPath);\n const childData = (0, lodash_1.get)(data, childPath, null);\n yield (0, exports.eachComponentDataAsync)(component.components, childData, fn, '', index, component, includeAll);\n (0, lodash_1.set)(data, childPath, childData);\n }\n }\n else {\n yield (0, exports.eachComponentDataAsync)(component.components, data, fn, (0, exports.componentDataPath)(component, path, compPath), index, component, includeAll);\n }\n return true;\n }\n return false;\n }), true, path, parent);\n});\nexports.eachComponentDataAsync = eachComponentDataAsync;\nconst eachComponentData = (components, data, fn, path = \"\", index, parent, includeAll = false) => {\n if (!components || !data) {\n return;\n }\n return eachComponent(components, (component, compPath, componentComponents, compParent) => {\n const row = getContextualRowData(component, compPath, data);\n if (fn(component, data, row, compPath, componentComponents, index, compParent) === true) {\n return true;\n }\n if (isComponentNestedDataType(component)) {\n const value = (0, lodash_1.get)(data, compPath, data);\n if (Array.isArray(value)) {\n for (let i = 0; i < value.length; i++) {\n (0, exports.eachComponentData)(component.components, data, fn, `${compPath}[${i}]`, i, component, includeAll);\n }\n return true;\n }\n else if ((0, lodash_1.isEmpty)(row) && !includeAll) {\n // Tree components may submit empty objects; since we've already evaluated the parent tree/layout component, we won't worry about constituent elements\n return true;\n }\n if (isComponentModelType(component, 'dataObject')) {\n // No need to bother processing all the children data if there is no data for this form.\n if ((0, lodash_1.has)(data, component.path)) {\n // For nested forms, we need to reset the \"data\" and \"path\" objects for all of the children components, and then re-establish the data when it is done.\n const childPath = (0, exports.componentDataPath)(component, path, compPath);\n const childData = (0, lodash_1.get)(data, childPath, {});\n (0, exports.eachComponentData)(component.components, childData, fn, '', index, component, includeAll);\n (0, lodash_1.set)(data, childPath, childData);\n }\n }\n else {\n (0, exports.eachComponentData)(component.components, data, fn, (0, exports.componentDataPath)(component, path, compPath), index, component, includeAll);\n }\n return true;\n }\n return false;\n }, true, path, parent);\n};\nexports.eachComponentData = eachComponentData;\nfunction getComponentKey(component) {\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, path) {\n return path.replace(new RegExp(`\\.?${getComponentKey(component)}$`), '');\n}\nexports.getContextualRowPath = getContextualRowPath;\nfunction getContextualRowData(component, path, data) {\n const rowPath = getContextualRowPath(component, path);\n return rowPath ? (0, lodash_1.get)(data, rowPath, null) : data;\n}\nexports.getContextualRowData = getContextualRowData;\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 = isComponentModelType(component, 'content');\n const isLayout = isComponentModelType(component, 'layout');\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/**\n * Iterate through each component within a form.\n *\n * @param {Object} components\n * The components to iterate.\n * @param {Function} fn\n * The iteration function to invoke for each component.\n * @param {Boolean} includeAll\n * Whether or not to include layout components.\n * @param {String} path\n * The current data path of the element. Example: data.user.firstName\n * @param {Object} parent\n * The parent object.\n */\nfunction eachComponent(components, fn, includeAll, path, parent) {\n if (!components)\n return;\n path = path || \"\";\n components.forEach((component) => {\n if (!component) {\n return;\n }\n const info = componentInfo(component);\n let noRecurse = false;\n // Keep track of parent references.\n if (parent) {\n // Ensure we don't create infinite JSON structures.\n Object.defineProperty(component, 'parent', {\n enumerable: false,\n writable: true,\n value: JSON.parse(JSON.stringify(parent))\n });\n Object.defineProperty(component.parent, 'parent', {\n enumerable: false,\n writable: true,\n value: parent.parent\n });\n Object.defineProperty(component.parent, 'path', {\n enumerable: false,\n writable: true,\n value: parent.path\n });\n delete component.parent.components;\n delete component.parent.componentMap;\n delete component.parent.columns;\n delete component.parent.rows;\n }\n Object.defineProperty(component, 'path', {\n enumerable: false,\n writable: true,\n value: componentPath(component, path)\n });\n if (includeAll || component.tree || !info.layout) {\n noRecurse = fn(component, component.path, components, parent);\n }\n if (!noRecurse) {\n if (info.hasColumns) {\n component.columns.forEach((column) => eachComponent(column.components, fn, includeAll, path, parent ? component : null));\n }\n else if (info.hasRows) {\n component.rows.forEach((row) => {\n if (Array.isArray(row)) {\n row.forEach((column) => eachComponent(column.components, fn, includeAll, path, parent ? component : null));\n }\n });\n }\n else if (info.hasComps) {\n eachComponent(component.components, fn, includeAll, (0, exports.componentFormPath)(component, path, component.path), parent ? component : null);\n }\n }\n });\n}\nexports.eachComponent = eachComponent;\n// Async each component.\nfunction eachComponentAsync(components_2, fn_1) {\n return __awaiter(this, arguments, void 0, function* (components, fn, includeAll = false, path = \"\", parent) {\n var _a, _b;\n if (!components)\n return;\n for (let i = 0; i < components.length; i++) {\n if (!components[i]) {\n continue;\n }\n let component = components[i];\n const info = componentInfo(component);\n // Keep track of parent references.\n if (parent) {\n // Ensure we don't create infinite JSON structures.\n Object.defineProperty(component, 'parent', {\n enumerable: false,\n writable: true,\n value: JSON.parse(JSON.stringify(parent))\n });\n Object.defineProperty(component.parent, 'parent', {\n enumerable: false,\n writable: true,\n value: parent.parent\n });\n Object.defineProperty(component.parent, 'path', {\n enumerable: false,\n writable: true,\n value: parent.path\n });\n delete component.parent.components;\n delete component.parent.componentMap;\n delete component.parent.columns;\n delete component.parent.rows;\n }\n Object.defineProperty(component, 'path', {\n enumerable: false,\n writable: true,\n value: componentPath(component, path)\n });\n if (includeAll || component.tree || !info.layout) {\n if (yield fn(component, component.path, components, parent)) {\n continue;\n }\n }\n if (info.hasColumns) {\n for (let j = 0; j < component.columns.length; j++) {\n yield eachComponentAsync((_a = component.columns[j]) === null || _a === void 0 ? void 0 : _a.components, fn, includeAll, path, parent ? component : null);\n }\n }\n else if (info.hasRows) {\n for (let j = 0; j < component.rows.length; j++) {\n let row = component.rows[j];\n if (Array.isArray(row)) {\n for (let k = 0; k < row.length; k++) {\n yield eachComponentAsync((_b = row[k]) === null || _b === void 0 ? void 0 : _b.components, fn, includeAll, path, parent ? component : null);\n }\n }\n }\n }\n else if (info.hasComps) {\n yield eachComponentAsync(component.components, fn, includeAll, (0, exports.componentFormPath)(component, path, component.path), parent ? component : null);\n }\n }\n });\n}\nexports.eachComponentAsync = eachComponentAsync;\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, exports.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 getComponentActualValue(component, compPath, data, row) {\n var _a;\n // The compPath here will NOT contain the indexes for DataGrids and EditGrids.\n //\n // a[0].b[2].c[3].d\n //\n // Because of this, we will need to determine our parent component path (not data path),\n // and find the \"row\" based comp path.\n //\n // a[0].b[2].c[3].d => a.b.c.d\n //\n let parentInputComponent = null;\n let parent = component;\n while (((_a = parent === null || parent === void 0 ? void 0 : parent.parent) === null || _a === void 0 ? void 0 : _a.path) && !parentInputComponent) {\n parent = parent.parent;\n if (parent.input) {\n parentInputComponent = parent;\n }\n }\n if (parentInputComponent) {\n const parentCompPath = parentInputComponent.path.replace(/\\[[0-9]+\\]/g, '');\n compPath = compPath.replace(parentCompPath, '');\n compPath = (0, lodash_1.trim)(compPath, '. ');\n }\n let value = null;\n if (row) {\n value = (0, lodash_1.get)(row, compPath);\n }\n if (data && (0, lodash_1.isNil)(value)) {\n value = (0, lodash_1.get)(data, compPath);\n }\n if ((0, lodash_1.isNil)(value) || ((0, lodash_1.isObject)(value) && (0, lodash_1.isEmpty)(value))) {\n value = '';\n }\n return value;\n}\nexports.getComponentActualValue = getComponentActualValue;\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 && Array.isArray(component.columns)) ||\n (component.rows && Array.isArray(component.rows)) ||\n (component.components && 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) {\n if ((0, lodash_1.isString)(query)) {\n return (component.key === query) || (component.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 key\n *\n * @param {Object} components - The components to iterate.\n * @param {String|Object} key - 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, key, includeAll = false) {\n let result;\n eachComponent(components, (component, path) => {\n if ((path === key) || (component.path === key) || (component.input && (component.key === key))) {\n result = component;\n return true;\n }\n }, includeAll);\n return result;\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 eachComponent(components, (component) => {\n if (matchComponent(component, query)) {\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 // Using _.unset() leave a null value. Use Array splice instead.\n // @ts-ignore\n var 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 && (component.conditional.when ||\n component.conditional.json ||\n component.conditional.conjunction)));\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)\n ? value.replace(/[^\\de.+-]/gi, '')\n : 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)\n .toString()\n .split('.');\n parts[0] = (0, lodash_1.chunk)(Array.from(parts[0]).reverse(), 3)\n .reverse()\n .map((part) => part\n .reverse()\n .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 = ['label', 'title', 'legend', 'tooltip', 'description', 'placeholder', 'prefix', 'suffix', 'errorLabel', 'content', 'html'];\n const strings = [];\n 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') && component.hasOwnProperty('values') && Array.isArray(component.values) && 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 [\n 'loading...',\n 'Type to search'\n ].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 var found = false;\n switch (change.op) {\n case 'add':\n var 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 var container = (0, lodash_1.get)(parent, change.path);\n container.splice(change.index, 0, newComponent);\n });\n break;\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 (err) {\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 var 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 var 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 var rowPath = newPath.slice();\n rowPath.push(index);\n row.forEach(function (column, index) {\n var 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.type === 'checkbox';\nconst isDataGridComponent = (component) => component.type === 'datagrid';\nconst isEditGridComponent = (component) => component.type === 'editgrid';\nconst isDataTableComponent = (component) => component.type === 'datatable';\nconst hasChildComponents = (component) => component.components != null;\nconst isDateTimeComponent = (component) => component.type === 'datetime';\nconst isSelectBoxesComponent = (component) => component.type === 'selectboxes';\nconst isTextAreaComponent = (component) => component.type === 'textarea';\nconst isTextFieldComponent = (component) => 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> </p>';\n const br = '<p><br></p>';\n const brNbsp = '<p><br> </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) {\n var _a;\n const value = (0, lodash_1.get)(data, path);\n if (isCheckboxComponent(component)) {\n return isValueEmpty(component, value) || value === false;\n }\n else if (isDataGridComponent(component) || isEditGridComponent(component) || isDataTableComponent(component) || 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, exports.eachComponentData)([component], data, (thisComponent, data, row, path, components, index) => {\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 ? typeof value === 'string' ? isValueEmpty(component, value.trim()) : isValueEmpty(component, value) : isValueEmpty(component, trimBlanks(value));\n }\n else if (isTextFieldComponent(component)) {\n if (component.allowMultipleMasks && !!component.inputMasks && !!component.inputMasks.length) {\n return isValueEmpty(component, value) || (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\n//# sourceURL=webpack://Formio/./node_modules/@formio/core/lib/utils/formUtil.js?");
|
1634
1634
|
|
1635
1635
|
/***/ }),
|
1636
1636
|
|
@@ -1817,7 +1817,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
|
|
1817
1817
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
1818
1818
|
|
1819
1819
|
"use strict";
|
1820
|
-
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\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 }) {\n if (value && comparedValue && typeof value !== typeof comparedValue && (0, lodash_1.isString)(comparedValue)) {\n try {\n comparedValue = JSON.parse(comparedValue);\n }\n // eslint-disable-next-line no-empty\n catch (e) { }\n }\n
|
1820
|
+
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\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') {\n return (0, lodash_1.get)(value, comparedValue, false);\n }\n if (value && comparedValue && typeof value !== typeof comparedValue && (0, lodash_1.isString)(comparedValue)) {\n try {\n comparedValue = JSON.parse(comparedValue);\n }\n // eslint-disable-next-line no-empty\n catch (e) { }\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?");
|
1821
1821
|
|
1822
1822
|
/***/ }),
|
1823
1823
|
|
@@ -4775,7 +4775,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
|
|
4775
4775
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
4776
4776
|
|
4777
4777
|
"use strict";
|
4778
|
-
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst Webform_1 = __importDefault(__webpack_require__(/*! ./Webform */ \"./lib/cjs/Webform.js\"));\nconst utils_1 = __webpack_require__(/*! ./utils/utils */ \"./lib/cjs/utils/utils.js\");\nclass PDF extends Webform_1.default {\n constructor(element, options) {\n options.display = 'pdf';\n super(element, options);\n this.components = [];\n }\n init() {\n super.init();\n // Handle an iframe submission.\n this.on('iframe-submission', (submission) => this.setValue(submission, {\n fromIframe: true\n }), true);\n this.on('iframe-change', (submission) => this.setValue(submission, {\n fromIframe: true\n }), true);\n this.on('iframe-getIframePositions', (query) => {\n const iframe = document.getElementById(`iframe-${query.formId}`);\n if (iframe) {\n const iframeBoundingClientRect = iframe.getBoundingClientRect();\n this.postMessage({\n name: 'iframePositions',\n data: {\n formId: query.formId,\n iframe: {\n top: iframeBoundingClientRect.top\n },\n scrollY: window.scrollY || window.pageYOffset\n }\n });\n }\n });\n // Trigger when this form is ready.\n this.on('iframe-ready', () => this.iframeReadyResolve(), true);\n }\n render() {\n this.submitButton = this.addComponent({\n disabled: this.form.disableWizardSubmit,\n input: true,\n type: 'button',\n action: 'submit',\n internal: true,\n label: 'Submit',\n key: 'submit',\n ref: 'button',\n hidden: this.isSubmitButtonHidden()\n });\n return this.renderTemplate('pdf', {\n submitButton: this.submitButton.render(),\n classes: 'formio-form-pdf',\n children: this.renderComponents()\n });\n }\n redraw() {\n this.postMessage({ name: 'redraw' });\n return this.builderMode ? Promise.resolve() : super.redraw();\n }\n destroy(all = false) {\n if (this.iframeElement) {\n delete this.iframeElement.formioComponent;\n this.iframeElement.formioComponent = null;\n }\n super.destroy(all);\n }\n rebuild() {\n if (this.attached && this.builderMode && this.component.components) {\n this.destroyComponents();\n this.addComponents();\n return Promise.resolve();\n }\n this.postMessage({ name: 'redraw' });\n return super.rebuild();\n }\n // Do not attach nested components for pdf.\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 return Promise.resolve();\n }\n attach(element) {\n return super.attach(element).then(() => {\n this.loadRefs(element, {\n button: 'single',\n buttonMessageContainer: 'single',\n buttonMessage: 'single',\n zoomIn: 'single',\n zoomOut: 'single',\n iframeContainer: 'single'\n });\n this.submitButton.refs = Object.assign({}, this.refs);\n this.submitButton.attachButton();\n // Reset the iframeReady promise.\n this.iframeReady = new Promise((resolve, reject) => {\n this.iframeReadyResolve = resolve;\n this.iframeReadyReject = reject;\n });\n // iframes cannot be in the template so manually create it\n this.iframeElement = this.ce('iframe', {\n src: this.getSrc(),\n id: `iframe-${this.id}`,\n seamless: true,\n class: 'formio-iframe'\n });\n this.iframeElement.formioContainer = this.component.components;\n this.iframeElement.formioComponent = this;\n // Append the iframe to the iframeContainer in the template\n this.empty(this.refs.iframeContainer);\n this.appendChild(this.refs.iframeContainer, this.iframeElement);\n // Post the form to the iframe\n this.form.base = Formio_1.Formio.getBaseUrl();\n this.form.projectUrl = Formio_1.Formio.getProjectUrl();\n this.postMessage({ name: 'form', data: this.form });\n // Hide the submit button if the associated component is hidden\n const submitButton = this.components.find(c => c.element === this.refs.button);\n if (submitButton) {\n this.refs.button.classList.toggle('hidden', !submitButton.visible);\n }\n this.addEventListener(this.refs.zoomIn, 'click', (event) => {\n event.preventDefault();\n this.postMessage({ name: 'zoomIn' });\n });\n this.addEventListener(this.refs.zoomOut, 'click', (event) => {\n event.preventDefault();\n this.postMessage({ name: 'zoomOut' });\n });\n const form = (0, utils_1.fastCloneDeep)(this.form);\n if (this.formio) {\n form.projectUrl = this.formio.projectUrl;\n form.url = this.formio.formUrl;\n form.base = this.formio.base;\n this.postMessage({ name: 'token', data: this.formio.getToken() });\n }\n this.emit('attach');\n });\n }\n /**\n * Get the submission from the iframe.\n * @returns {Promise<any>} - The submission from the iframe.\n */\n getSubmission() {\n return new Promise((resolve) => {\n this.once('iframe-submission', resolve);\n this.postMessage({ name: 'getSubmission' });\n });\n }\n /**\n * Ensure we have the submission from the iframe before we submit the form.\n * @param {any} options - The options for submission.\n * @returns {Promise<any>} - Resolves when the form is submitted.\n */\n submitForm(options = {}) {\n this.postMessage({ name: 'getErrors' });\n return this.getSubmission().then(() => super.submitForm(options));\n }\n getSrc() {\n if (!this._form || !this._form.settings || !this._form.settings.pdf) {\n return '';\n }\n let iframeSrc = `${this._form.settings.pdf.src}.html`;\n const params = [`id=${this.id}`];\n if (this.options.showCheckboxBackground || this._form.settings.showCheckboxBackground) {\n params.push('checkboxbackground=1');\n }\n if (this.options.readOnly) {\n params.push('readonly=1');\n }\n if (this.options.zoom) {\n params.push(`zoom=${this.options.zoom}`);\n }\n if (this.builderMode) {\n params.push('builder=1');\n }\n if (params.length) {\n iframeSrc += `?${params.join('&')}`;\n }\n return iframeSrc;\n }\n setForm(form, flags = {}) {\n return super.setForm(form, flags).then(() => {\n if (this.formio) {\n form.projectUrl = this.formio.projectUrl;\n form.url = this.formio.formUrl;\n form.base = this.formio.base;\n this.postMessage({ name: 'token', data: this.formio.getToken() });\n }\n this.postMessage({ name: 'form', data: this.form });\n });\n }\n /**\n * Set's the value of this form component.\n * @param {import('@formio/core').Submission} submission - The submission JSON to set the value of this form.\n * @param {any} flags - The flags to use when setting the submission.\n * @returns {boolean} - If the value changed or not.\n */\n setValue(submission, flags = {}) {\n const changed = super.setValue(submission, flags);\n if (!flags || !flags.fromIframe) {\n this.once('iframe-ready', () => {\n if (changed) {\n this.postMessage({ name: 'submission', data: submission });\n }\n });\n }\n return changed;\n }\n postMessage(message) {\n // If we get here before the iframeReady promise is set up, it's via the superclass constructor\n if (!this.iframeReady) {\n return;\n }\n if (!message.type) {\n message.type = 'iframe-data';\n }\n this.iframeReady.then(() => {\n if (this.iframeElement && this.iframeElement.contentWindow && !(message.name === 'form' && this.iframeFormSetUp)) {\n this.iframeElement.contentWindow.postMessage(JSON.stringify(message), '*');\n this.iframeFormSetUp = message.name === 'form';\n }\n });\n }\n focusOnComponent(key) {\n this.postMessage({\n name: 'focusErroredField',\n data: key,\n });\n }\n // Do not clear the iframe.\n clear() { }\n showErrors(error, triggerEvent) {\n var _a;\n const helpBlock = document.getElementById('submit-error');\n const submitError = this.t('submitError');\n const isSubmitErrorShown = ((_a = this.refs.buttonMessage) === null || _a === void 0 ? void 0 : _a.textContent.trim()) === submitError;\n if (!helpBlock && error.length && !isSubmitErrorShown) {\n const p = this.ce('p', { class: 'help-block' });\n this.setContent(p, submitError);\n p.addEventListener('click', () => {\n window.scrollTo(0, 0);\n });\n const div = this.ce('div', { id: 'submit-error', class: 'has-error' });\n this.appendTo(p, div);\n this.appendTo(div, this.element);\n }\n if (!error.length && helpBlock) {\n helpBlock.remove();\n }\n super.showErrors(error, triggerEvent);\n }\n isSubmitButtonHidden() {\n let hidden = false;\n (0, utils_1.eachComponent)(this.component.components, (component) => {\n if ((component.type === 'button') &&\n ((component.action === 'submit') || !component.action)) {\n hidden = component.hidden || false;\n }\n });\n return hidden;\n }\n}\nexports[\"default\"] = PDF;\n/**\n * Listen for window messages.\n */\nif (typeof window !== 'undefined') {\n window.addEventListener('message', (event) => {\n let eventData = null;\n try {\n eventData = JSON.parse(event.data);\n }\n catch (err) {\n eventData = null;\n }\n // If this form exists, then emit the event within this form.\n if (eventData &&\n eventData.name &&\n eventData.formId &&\n Formio_1.Formio.forms.hasOwnProperty(eventData.formId)) {\n Formio_1.Formio.forms[eventData.formId].emit(`iframe-${eventData.name}`, eventData.data);\n }\n });\n}\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/PDF.js?");
|
4778
|
+
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst Formio_1 = __webpack_require__(/*! ./Formio */ \"./lib/cjs/Formio.js\");\nconst Webform_1 = __importDefault(__webpack_require__(/*! ./Webform */ \"./lib/cjs/Webform.js\"));\nconst utils_1 = __webpack_require__(/*! ./utils/utils */ \"./lib/cjs/utils/utils.js\");\nclass PDF extends Webform_1.default {\n constructor(element, options) {\n options.display = 'pdf';\n super(element, options);\n this.components = [];\n }\n init() {\n super.init();\n // Handle an iframe submission.\n this.on('iframe-submission', (submission) => this.setValue(submission, {\n fromIframe: true\n }), true);\n this.on('iframe-change', (submission) => this.setValue(submission, {\n fromIframe: true\n }), true);\n this.on('iframe-getIframePositions', (query) => {\n const iframe = document.getElementById(`iframe-${query.formId}`);\n if (iframe) {\n const iframeBoundingClientRect = iframe.getBoundingClientRect();\n this.postMessage({\n name: 'iframePositions',\n data: {\n formId: query.formId,\n iframe: {\n top: iframeBoundingClientRect.top\n },\n scrollY: window.scrollY || window.pageYOffset\n }\n });\n }\n });\n // Trigger when this form is ready.\n this.on('iframe-ready', () => this.iframeReadyResolve(), true);\n }\n render() {\n this.submitButton = this.addComponent({\n disabled: this.form.disableWizardSubmit,\n input: true,\n type: 'button',\n action: 'submit',\n internal: true,\n label: 'Submit',\n key: 'submit',\n ref: 'button',\n hidden: this.isSubmitButtonHidden()\n });\n return this.renderTemplate('pdf', {\n submitButton: this.submitButton.render(),\n classes: 'formio-form-pdf',\n children: this.renderComponents()\n });\n }\n redraw() {\n this.postMessage({ name: 'redraw' });\n return this.builderMode ? Promise.resolve() : super.redraw();\n }\n destroy(all = false) {\n if (this.iframeElement) {\n delete this.iframeElement.formioComponent;\n this.iframeElement.formioComponent = null;\n }\n super.destroy(all);\n }\n rebuild() {\n if (this.builderMode && this.component.components) {\n this.destroyComponents();\n this.addComponents();\n return Promise.resolve();\n }\n this.postMessage({ name: 'redraw' });\n return super.rebuild();\n }\n // Do not attach nested components for pdf.\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 return Promise.resolve();\n }\n attach(element) {\n return super.attach(element).then(() => {\n this.loadRefs(element, {\n button: 'single',\n buttonMessageContainer: 'single',\n buttonMessage: 'single',\n zoomIn: 'single',\n zoomOut: 'single',\n iframeContainer: 'single'\n });\n this.submitButton.refs = Object.assign({}, this.refs);\n this.submitButton.attachButton();\n // Reset the iframeReady promise.\n this.iframeReady = new Promise((resolve, reject) => {\n this.iframeReadyResolve = resolve;\n this.iframeReadyReject = reject;\n });\n // iframes cannot be in the template so manually create it\n this.iframeElement = this.ce('iframe', {\n src: this.getSrc(),\n id: `iframe-${this.id}`,\n seamless: true,\n class: 'formio-iframe'\n });\n this.iframeElement.formioContainer = this.component.components;\n this.iframeElement.formioComponent = this;\n // Append the iframe to the iframeContainer in the template\n this.empty(this.refs.iframeContainer);\n this.appendChild(this.refs.iframeContainer, this.iframeElement);\n // Post the form to the iframe\n this.form.base = Formio_1.Formio.getBaseUrl();\n this.form.projectUrl = Formio_1.Formio.getProjectUrl();\n this.postMessage({ name: 'form', data: this.form });\n // Hide the submit button if the associated component is hidden\n const submitButton = this.components.find(c => c.element === this.refs.button);\n if (submitButton) {\n this.refs.button.classList.toggle('hidden', !submitButton.visible);\n }\n this.addEventListener(this.refs.zoomIn, 'click', (event) => {\n event.preventDefault();\n this.postMessage({ name: 'zoomIn' });\n });\n this.addEventListener(this.refs.zoomOut, 'click', (event) => {\n event.preventDefault();\n this.postMessage({ name: 'zoomOut' });\n });\n const form = (0, utils_1.fastCloneDeep)(this.form);\n if (this.formio) {\n form.projectUrl = this.formio.projectUrl;\n form.url = this.formio.formUrl;\n form.base = this.formio.base;\n this.postMessage({ name: 'token', data: this.formio.getToken() });\n }\n this.emit('attach');\n });\n }\n /**\n * Get the submission from the iframe.\n * @returns {Promise<any>} - The submission from the iframe.\n */\n getSubmission() {\n return new Promise((resolve) => {\n this.once('iframe-submission', resolve);\n this.postMessage({ name: 'getSubmission' });\n });\n }\n /**\n * Ensure we have the submission from the iframe before we submit the form.\n * @param {any} options - The options for submission.\n * @returns {Promise<any>} - Resolves when the form is submitted.\n */\n submitForm(options = {}) {\n this.postMessage({ name: 'getErrors' });\n return this.getSubmission().then(() => super.submitForm(options));\n }\n getSrc() {\n if (!this._form || !this._form.settings || !this._form.settings.pdf) {\n return '';\n }\n let iframeSrc = `${this._form.settings.pdf.src}.html`;\n const params = [`id=${this.id}`];\n if (this.options.showCheckboxBackground || this._form.settings.showCheckboxBackground) {\n params.push('checkboxbackground=1');\n }\n if (this.options.readOnly) {\n params.push('readonly=1');\n }\n if (this.options.zoom) {\n params.push(`zoom=${this.options.zoom}`);\n }\n if (this.builderMode) {\n params.push('builder=1');\n }\n if (params.length) {\n iframeSrc += `?${params.join('&')}`;\n }\n return iframeSrc;\n }\n setForm(form, flags = {}) {\n return super.setForm(form, flags).then(() => {\n if (this.formio) {\n form.projectUrl = this.formio.projectUrl;\n form.url = this.formio.formUrl;\n form.base = this.formio.base;\n this.postMessage({ name: 'token', data: this.formio.getToken() });\n }\n this.postMessage({ name: 'form', data: this.form });\n });\n }\n /**\n * Set's the value of this form component.\n * @param {import('@formio/core').Submission} submission - The submission JSON to set the value of this form.\n * @param {any} flags - The flags to use when setting the submission.\n * @returns {boolean} - If the value changed or not.\n */\n setValue(submission, flags = {}) {\n const changed = super.setValue(submission, flags);\n if (!flags || !flags.fromIframe) {\n this.once('iframe-ready', () => {\n if (changed) {\n this.postMessage({ name: 'submission', data: submission });\n }\n });\n }\n return changed;\n }\n postMessage(message) {\n // If we get here before the iframeReady promise is set up, it's via the superclass constructor\n if (!this.iframeReady) {\n return;\n }\n if (!message.type) {\n message.type = 'iframe-data';\n }\n this.iframeReady.then(() => {\n if (this.iframeElement && this.iframeElement.contentWindow && !(message.name === 'form' && this.iframeFormSetUp)) {\n this.iframeElement.contentWindow.postMessage(JSON.stringify(message), '*');\n this.iframeFormSetUp = message.name === 'form';\n }\n });\n }\n focusOnComponent(key) {\n this.postMessage({\n name: 'focusErroredField',\n data: key,\n });\n }\n // Do not clear the iframe.\n clear() { }\n showErrors(error, triggerEvent) {\n var _a;\n const helpBlock = document.getElementById('submit-error');\n const submitError = this.t('submitError');\n const isSubmitErrorShown = ((_a = this.refs.buttonMessage) === null || _a === void 0 ? void 0 : _a.textContent.trim()) === submitError;\n if (!helpBlock && error.length && !isSubmitErrorShown) {\n const p = this.ce('p', { class: 'help-block' });\n this.setContent(p, submitError);\n p.addEventListener('click', () => {\n window.scrollTo(0, 0);\n });\n const div = this.ce('div', { id: 'submit-error', class: 'has-error' });\n this.appendTo(p, div);\n this.appendTo(div, this.element);\n }\n if (!error.length && helpBlock) {\n helpBlock.remove();\n }\n super.showErrors(error, triggerEvent);\n }\n isSubmitButtonHidden() {\n let hidden = false;\n (0, utils_1.eachComponent)(this.component.components, (component) => {\n if ((component.type === 'button') &&\n ((component.action === 'submit') || !component.action)) {\n hidden = component.hidden || false;\n }\n });\n return hidden;\n }\n}\nexports[\"default\"] = PDF;\n/**\n * Listen for window messages.\n */\nif (typeof window !== 'undefined') {\n window.addEventListener('message', (event) => {\n let eventData = null;\n try {\n eventData = JSON.parse(event.data);\n }\n catch (err) {\n eventData = null;\n }\n // If this form exists, then emit the event within this form.\n if (eventData &&\n eventData.name &&\n eventData.formId &&\n Formio_1.Formio.forms.hasOwnProperty(eventData.formId)) {\n Formio_1.Formio.forms[eventData.formId].emit(`iframe-${eventData.name}`, eventData.data);\n }\n });\n}\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/PDF.js?");
|
4779
4779
|
|
4780
4780
|
/***/ }),
|
4781
4781
|
|
@@ -4786,7 +4786,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
|
|
4786
4786
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
4787
4787
|
|
4788
4788
|
"use strict";
|
4789
|
-
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/utils */ \"./lib/cjs/utils/utils.js\");\nconst formUtils_1 = __webpack_require__(/*! ./utils/formUtils */ \"./lib/cjs/utils/formUtils.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, _b, _c;\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 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 if ((_c = (_b = this.parent) === null || _b === void 0 ? void 0 : _b.component) === null || _c === void 0 ? void 0 : _c.modalEdit) {\n return Promise.resolve();\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 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 this.triggerCaptcha();\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 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.submissionSet = true;\n this.triggerChange(flags);\n this.emit(\"beforeSetSubmission\", submission);\n this.setValue(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 if (!this.draftEnabled) {\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 metadata: submission.metadata,\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.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, formUtils_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 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 errors.forEach((err) => {\n const { components = [] } = err;\n if (err.component) {\n components.push(err.component);\n }\n if (err.path) {\n components.push(err.path);\n }\n components.forEach((path) => {\n const originalPath = (0, utils_1.getStringFromComponentPath)(path);\n const component = this.getComponent(path, lodash_1.default.identity, originalPath);\n if (err.fromServer) {\n if (component.serverErrors) {\n component.serverErrors.push(err);\n }\n else {\n component.serverErrors = [err];\n }\n }\n const components = lodash_1.default.compact(Array.isArray(component) ? component : [component]);\n components.forEach((component) => component.setCustomValidity(err.message, 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 flags = flags || {};\n let isChangeEventEmitted = false;\n super.onChange(flags, true);\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), { process: \"change\" }))\n : [];\n value.isValid = errors.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 = {}) {\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 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 if (submission._vnote && comp.type === \"form\" && comp.component.reference) {\n lodash_1.default.get(submission.data, comp.path, {})._vnote = submission._vnote;\n }\n const { persistent } = comp.component;\n if (persistent === \"client-only\") {\n lodash_1.default.unset(submission.data, 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() {\n if (!this || !this.components) {\n return;\n }\n const captchaComponent = [];\n (0, formUtils_1.eachComponent)(this.components, (component) => {\n if (/^(re)?captcha$/.test(component.type) && component.component.eventType === 'formLoad') {\n captchaComponent.push(component);\n }\n });\n if (captchaComponent.length > 0) {\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?");
|
4789
|
+
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/utils */ \"./lib/cjs/utils/utils.js\");\nconst formUtils_1 = __webpack_require__(/*! ./utils/formUtils */ \"./lib/cjs/utils/formUtils.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, _b, _c;\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 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 if ((_c = (_b = this.parent) === null || _b === void 0 ? void 0 : _b.component) === null || _c === void 0 ? void 0 : _c.modalEdit) {\n return Promise.resolve();\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 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 this.triggerCaptcha();\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 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.submissionSet = true;\n this.triggerChange(flags);\n this.emit(\"beforeSetSubmission\", submission);\n this.setValue(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 if (!this.draftEnabled) {\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.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, formUtils_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 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 errors.forEach((err) => {\n const { components = [] } = err;\n if (err.component) {\n components.push(err.component);\n }\n if (err.path) {\n components.push(err.path);\n }\n components.forEach((path) => {\n const originalPath = (0, utils_1.getStringFromComponentPath)(path);\n const component = this.getComponent(path, lodash_1.default.identity, originalPath);\n if (err.fromServer) {\n if (component.serverErrors) {\n component.serverErrors.push(err);\n }\n else {\n component.serverErrors = [err];\n }\n }\n const components = lodash_1.default.compact(Array.isArray(component) ? component : [component]);\n components.forEach((component) => component.setCustomValidity(err.message, 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 flags = flags || {};\n let isChangeEventEmitted = false;\n super.onChange(flags, true);\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), { process: \"change\" }))\n : [];\n value.isValid = errors.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 = {}) {\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 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 if (submission._vnote && comp.type === \"form\" && comp.component.reference) {\n lodash_1.default.get(submission.data, comp.path, {})._vnote = submission._vnote;\n }\n const { persistent } = comp.component;\n if (persistent === \"client-only\") {\n lodash_1.default.unset(submission.data, 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() {\n if (!this || !this.components) {\n return;\n }\n const captchaComponent = [];\n (0, formUtils_1.eachComponent)(this.components, (component) => {\n if (/^(re)?captcha$/.test(component.type) && component.component.eventType === 'formLoad') {\n captchaComponent.push(component);\n }\n });\n if (captchaComponent.length > 0) {\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?");
|
4790
4790
|
|
4791
4791
|
/***/ }),
|
4792
4792
|
|
@@ -5028,7 +5028,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
|
|
5028
5028
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
5029
5029
|
|
5030
5030
|
"use strict";
|
5031
|
-
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\"));\nconst utils_1 = __webpack_require__(/*! ../../../utils/utils */ \"./lib/cjs/utils/utils.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 const conditionallyVisible = component.conditionallyVisible();\n if (forceShow || conditionallyVisible) {\n component.visible = true;\n }\n else if (forceHide || !isVisible || !conditionallyVisible) {\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.clearOnHide();\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 this._rowIndex = 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\n * component tree.\n * @param {string} path - The path to the component.\n * @param {Function} [fn] - Called with the component once found.\n * @param {string} [originalPath] - The original path to the component.\n * @returns {any} - The component that is located.\n */\n getComponent(path, fn, originalPath) {\n originalPath = originalPath || (0, utils_1.getStringFromComponentPath)(path);\n if (this.componentsMap.hasOwnProperty(originalPath)) {\n if (fn) {\n return fn(this.componentsMap[originalPath]);\n }\n else {\n return this.componentsMap[originalPath];\n }\n }\n path = (0, utils_1.getArrayFromComponentPath)(path);\n const pathStr = originalPath;\n const newPath = lodash_1.default.clone(path);\n let key = newPath.shift();\n const remainingPath = newPath;\n let comp = null;\n let possibleComp = null;\n if (lodash_1.default.isNumber(key)) {\n key = remainingPath.shift();\n }\n if (!lodash_1.default.isString(key)) {\n return comp;\n }\n this.everyComponent((component, components) => {\n const matchPath = component.hasInput && component.path ? pathStr.includes(component.path) : true;\n if (component.component.key === key) {\n possibleComp = component;\n if (matchPath) {\n comp = component;\n if (remainingPath.length > 0 && 'getComponent' in component) {\n comp = component.getComponent(remainingPath, fn, originalPath);\n }\n else if (fn) {\n fn(component, components);\n }\n return false;\n }\n }\n });\n if (!comp) {\n comp = possibleComp;\n }\n return comp;\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 = (0, utils_1.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 });\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 if (this.component.clearOnHide) {\n if (this.allowData && !this.hasValue() && !(this.options.server && !this.visible)) {\n this.dataValue = this.defaultValue;\n }\n if (this.hasValue()) {\n this.restoreComponentsContext();\n }\n }\n this.getComponents().forEach(component => component.clearOnHide(show));\n }\n restoreComponentsContext() {\n this.getComponents().forEach((component) => component.data = this.dataValue);\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.conditionallyVisible()) {\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, component }, flags) {\n const { dirty } = flags;\n if (this.root.hasExtraPages && this.page !== this.root.page) {\n instance = this.getComponentById(component.id);\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 scope: { errors: [] },\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.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) && 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 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?");
|
5031
|
+
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\"));\nconst utils_1 = __webpack_require__(/*! ../../../utils/utils */ \"./lib/cjs/utils/utils.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 const conditionallyVisible = component.conditionallyVisible();\n if (forceShow || conditionallyVisible) {\n component.visible = true;\n }\n else if (forceHide || !isVisible || !conditionallyVisible) {\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.clearOnHide();\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 this._rowIndex = 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\n * component tree.\n * @param {string} path - The path to the component.\n * @param {Function} [fn] - Called with the component once found.\n * @param {string} [originalPath] - The original path to the component.\n * @returns {any} - The component that is located.\n */\n getComponent(path, fn, originalPath) {\n originalPath = originalPath || (0, utils_1.getStringFromComponentPath)(path);\n if (this.componentsMap.hasOwnProperty(originalPath)) {\n if (fn) {\n return fn(this.componentsMap[originalPath]);\n }\n else {\n return this.componentsMap[originalPath];\n }\n }\n path = (0, utils_1.getArrayFromComponentPath)(path);\n const pathStr = originalPath;\n const newPath = lodash_1.default.clone(path);\n let key = newPath.shift();\n const remainingPath = newPath;\n let comp = null;\n let possibleComp = null;\n if (lodash_1.default.isNumber(key)) {\n key = remainingPath.shift();\n }\n if (!lodash_1.default.isString(key)) {\n return comp;\n }\n this.everyComponent((component, components) => {\n const matchPath = component.hasInput && component.path ? pathStr.includes(component.path) : true;\n if (component.component.key === key) {\n possibleComp = component;\n if (matchPath) {\n comp = component;\n if (remainingPath.length > 0 && 'getComponent' in component) {\n comp = component.getComponent(remainingPath, fn, originalPath);\n }\n else if (fn) {\n fn(component, components);\n }\n return false;\n }\n }\n });\n if (!comp) {\n comp = possibleComp;\n }\n return comp;\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 = (0, utils_1.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 if (this.component.clearOnHide) {\n if (this.allowData && !this.hasValue() && !(this.options.server && !this.visible)) {\n this.dataValue = this.defaultValue;\n }\n if (this.hasValue()) {\n this.restoreComponentsContext();\n }\n }\n this.getComponents().forEach(component => component.clearOnHide(show));\n }\n restoreComponentsContext() {\n this.getComponents().forEach((component) => component.data = this.dataValue);\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.conditionallyVisible()) {\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, component }, flags) {\n const { dirty } = flags;\n if (this.root.hasExtraPages && this.page !== this.root.page) {\n instance = this.getComponent(component.path);\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 scope: { errors: [] },\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.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) && 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 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?");
|
5032
5032
|
|
5033
5033
|
/***/ }),
|
5034
5034
|
|
@@ -5149,7 +5149,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
|
|
5149
5149
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
5150
5150
|
|
5151
5151
|
"use strict";
|
5152
|
-
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/utils */ \"./lib/cjs/utils/utils.js\");\nconst Components_1 = __importDefault(__webpack_require__(/*! ../Components */ \"./lib/cjs/components/Components.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 loadRefs(element, refs) {\n super.loadRefs(element, refs);\n if (refs['messageContainer'] === 'single') {\n const container = lodash_1.default.last(element.querySelectorAll(`[${this._referenceAttributeName}=messageContainer]`));\n this.refs['messageContainer'] = container || this.refs['messageContainer'];\n }\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 'messageContainer': 'single'\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();\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 component.path = Components_1.default.getComponentPath(component);\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.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 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 restoreComponentsContext() {\n this.rows.forEach((row, index) => lodash_1.default.forIn(row, (component) => component.data = this.dataValue[index]));\n }\n getComponent(path, fn) {\n path = Array.isArray(path) ? path : [path];\n const [key, ...remainingPath] = path;\n let result = [];\n if (lodash_1.default.isNumber(key) && remainingPath.length) {\n const compKey = remainingPath.pop();\n result = this.rows[key][compKey];\n // If the component is inside a Layout Component, try to find it among all the row's components\n if (!result) {\n Object.entries(this.rows[key]).forEach(([, comp]) => {\n if ('getComponent' in comp) {\n const possibleResult = comp.getComponent([compKey], fn);\n if (possibleResult) {\n result = possibleResult;\n }\n }\n });\n }\n if (result && lodash_1.default.isFunction(fn)) {\n fn(result, this.getComponents());\n }\n if (remainingPath.length && 'getComponent' in result) {\n return result.getComponent(remainingPath, fn);\n }\n return result;\n }\n if (!lodash_1.default.isString(key)) {\n return result;\n }\n this.everyComponent((component, components) => {\n if (component.component.key === key) {\n let comp = component;\n if (remainingPath.length > 0 && 'getComponent' in component) {\n comp = component.getComponent(remainingPath, fn);\n }\n else if (fn) {\n fn(component, components);\n }\n result = result.concat(comp);\n }\n });\n return result.length > 0 ? result : null;\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?");
|
5152
|
+
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/utils */ \"./lib/cjs/utils/utils.js\");\nconst Components_1 = __importDefault(__webpack_require__(/*! ../Components */ \"./lib/cjs/components/Components.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();\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 component.path = Components_1.default.getComponentPath(component);\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.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 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 restoreComponentsContext() {\n this.rows.forEach((row, index) => lodash_1.default.forIn(row, (component) => component.data = this.dataValue[index]));\n }\n getComponent(path, fn) {\n path = Array.isArray(path) ? path : [path];\n const [key, ...remainingPath] = path;\n let result = [];\n if (lodash_1.default.isNumber(key) && remainingPath.length) {\n const compKey = remainingPath.pop();\n result = this.rows[key][compKey];\n // If the component is inside a Layout Component, try to find it among all the row's components\n if (!result) {\n Object.entries(this.rows[key]).forEach(([, comp]) => {\n if ('getComponent' in comp) {\n const possibleResult = comp.getComponent([compKey], fn);\n if (possibleResult) {\n result = possibleResult;\n }\n }\n });\n }\n if (result && lodash_1.default.isFunction(fn)) {\n fn(result, this.getComponents());\n }\n if (remainingPath.length && 'getComponent' in result) {\n return result.getComponent(remainingPath, fn);\n }\n return result;\n }\n if (!lodash_1.default.isString(key)) {\n return result;\n }\n this.everyComponent((component, components) => {\n if (component.component.key === key) {\n let comp = component;\n if (remainingPath.length > 0 && 'getComponent' in component) {\n comp = component.getComponent(remainingPath, fn);\n }\n else if (fn) {\n fn(component, components);\n }\n result = result.concat(comp);\n }\n });\n return result.length > 0 ? result : null;\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?");
|
5153
5153
|
|
5154
5154
|
/***/ }),
|
5155
5155
|
|
@@ -5160,7 +5160,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
|
|
5160
5160
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
5161
5161
|
|
5162
5162
|
"use strict";
|
5163
|
-
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst Component_1 = __importDefault(__webpack_require__(/*! ../_classes/component/Component */ \"./lib/cjs/components/_classes/component/Component.js\"));\nconst DataGrid_1 = __importDefault(__webpack_require__(/*! ../datagrid/DataGrid */ \"./lib/cjs/components/datagrid/DataGrid.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst eventemitter3_1 = __importDefault(__webpack_require__(/*! eventemitter3 */ \"./node_modules/eventemitter3/index.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst Components_1 = __importDefault(__webpack_require__(/*! ../Components */ \"./lib/cjs/components/Components.js\"));\nclass DataMapComponent extends DataGrid_1.default {\n static schema(...extend) {\n return Component_1.default.schema({\n label: 'Data Map',\n key: 'dataMap',\n type: 'datamap',\n clearOnHide: true,\n addAnother: 'Add Another',\n disableAddingRemovingRows: false,\n keyBeforeValue: true,\n valueComponent: {\n type: 'textfield',\n key: 'value',\n label: 'Value',\n input: true\n },\n input: true,\n validate: {\n maxLength: 0,\n minLength: 0\n }\n }, ...extend);\n }\n static get builderInfo() {\n return {\n title: 'Data Map',\n icon: 'th-list',\n group: 'data',\n documentation: '/userguide/form-building/data-components#data-map',\n showPreview: false,\n weight: 20,\n schema: DataMapComponent.schema()\n };\n }\n get schema() {\n const schema = super.schema;\n if (this.components && (this.components.length > 0)) {\n schema.valueComponent = this.components[this.components.length - 1].schema;\n }\n return lodash_1.default.omit(schema, 'components');\n }\n static savedValueTypes(schema) {\n return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes.object];\n }\n constructor(component, options, data) {\n super(component, options, data);\n this.type = 'datamap';\n }\n init() {\n this.components = [];\n this.rows = [];\n this.createRows();\n this.visibleColumns = {\n key: true,\n [this.valueKey]: true\n };\n this.component.valueComponent.hideLabel = true;\n }\n get defaultSchema() {\n return DataMapComponent.schema();\n }\n get emptyValue() {\n return {};\n }\n get dataValue() {\n if (!this.key ||\n (!this.visible && this.component.clearOnHide)) {\n return this.emptyValue;\n }\n if (!this.hasValue() && this.shouldAddDefaultValue) {\n this.dataValue = this.emptyValue;\n }\n return lodash_1.default.get(this.data, this.key);\n }\n set dataValue(value) {\n super.dataValue = value;\n }\n get defaultValue() {\n const value = super.defaultValue;\n if (Array.isArray(value)) {\n return value[0];\n }\n return this.emptyValue;\n }\n get keySchema() {\n return {\n type: 'textfield',\n input: true,\n hideLabel: true,\n label: this.component.keyLabel || 'Key',\n key: '__key',\n disableBuilderActions: true,\n };\n }\n get valueKey() {\n return this.component.valueComponent.key;\n }\n getRowValues() {\n const dataValue = this.dataValue;\n if (this.builderMode) {\n return [dataValue];\n }\n if (lodash_1.default.isEmpty(dataValue)) {\n return [];\n }\n return Object.keys(dataValue).map(() => dataValue);\n }\n getComponentsContainer() {\n if (this.builderMode) {\n return this.getComponents().map(comp => comp.component);\n }\n return super.getComponentsContainer();\n }\n get iteratableRows() {\n return this.rows.map((row) => {\n return Object.keys(row).map(key => ({\n components: row[key],\n data: row[key].dataValue,\n }));\n });\n }\n componentContext(component) {\n return this.iteratableRows[component.row].find(comp => comp.components.key === component.key).data;\n }\n hasHeader() {\n return true;\n }\n hasRemoveButtons() {\n return !this.component.disableAddingRemovingRows &&\n !this.options.readOnly &&\n !this.disabled &&\n this.fullMode;\n }\n getColumns() {\n const keySchema = Object.assign({}, this.keySchema);\n const valueSchema = Object.assign({}, this.component.valueComponent);\n keySchema.hideLabel = false;\n valueSchema.hideLabel = false;\n return this.component.keyBeforeValue ?\n [keySchema, valueSchema] :\n [valueSchema, keySchema];\n }\n getRowKey(rowIndex) {\n const keys = Object.keys(this.dataValue);\n if (!keys[rowIndex]) {\n keys[rowIndex] = (0, utils_1.uniqueKey)(this.dataValue, this.defaultRowKey);\n }\n return keys[rowIndex];\n }\n get defaultRowKey() {\n return 'key';\n }\n setRowComponentsData(rowIndex, rowData) {\n lodash_1.default.each(this.rows[rowIndex], (component) => {\n if (component.key === '__key') {\n component.data = {\n '__key': Object.keys(rowData)[rowIndex],\n };\n }\n else {\n component.data = rowData;\n }\n });\n }\n getValueAsString(value, options) {\n if ((options === null || options === void 0 ? void 0 : options.email) && this.visible && !this.skipInEmail && lodash_1.default.isObject(value)) {\n let result = (`\n <table border=\"1\" style=\"width:100%\">\n <tbody>\n `);\n result = Object.keys(value).reduce((result, key) => {\n result += (`\n <tr>\n <th style=\"padding: 5px 10px;\">${key}</th>\n <td style=\"width:100%;padding:5px 10px;\">${this.getView(value[key], options)}</td>\n </tr>\n `);\n return result;\n }, result);\n result += (`\n </tbody>\n </table>\n `);\n return result;\n }\n if (lodash_1.default.isEmpty(value)) {\n return '';\n }\n if (options === null || options === void 0 ? void 0 : options.modalPreview) {\n delete options.modalPreview;\n return this.getDataValueAsTable(value, options);\n }\n return typeof value === 'object' ? '[Complex Data]' : value;\n }\n getDataValueAsTable(value, options) {\n let result = (`\n <table border=\"1\" style=\"width:100%\">\n <tbody>\n `);\n if (this.visible && lodash_1.default.isObject(value)) {\n Object.keys(value).forEach((key) => {\n result += (`\n <tr>\n <th style=\"padding: 5px 10px;\">${key}</th>\n <td style=\"width:100%;padding:5px 10px;\">${this.getView(value[key], options)}</td>\n </tr>\n `);\n });\n }\n result += (`\n </tbody>\n </table>\n `);\n return result;\n }\n createRowComponents(row, rowIndex) {\n // Use original value component API key in builder mode to be able to edit value component\n let key = this.builderMode ? this.valueKey : this.getRowKey(rowIndex);\n // Create a new event emitter since fields are isolated.\n const options = lodash_1.default.clone(this.options);\n options.events = new eventemitter3_1.default();\n options.name += `[${rowIndex}]`;\n options.row = `${rowIndex}`;\n const components = {};\n components['__key'] = this.createComponent(this.keySchema, options, { __key: this.builderMode ? this.defaultRowKey : key });\n components['__key'].on('componentChange', (event) => {\n const dataValue = this.dataValue;\n const newKey = (0, utils_1.uniqueKey)(dataValue, event.value);\n dataValue[newKey] = dataValue[key];\n delete dataValue[key];\n const comp = components[this.valueKey];\n comp.component.key = newKey;\n comp.path = Components_1.default.calculateComponentPath(comp);\n key = newKey;\n });\n const valueComponent = lodash_1.default.clone(this.component.valueComponent);\n valueComponent.key = key;\n const componentOptions = this.options;\n componentOptions.row = options.row;\n components[this.valueKey] = this.createComponent(valueComponent, componentOptions, this.dataValue);\n return components;\n }\n get canAddColumn() {\n return false;\n }\n addChildComponent(component) {\n this.component.valueComponent = component;\n }\n saveChildComponent(component) {\n // Update the Value Component, the Key Component is not allowed to edit\n if (component.key !== this.keySchema.key) {\n this.component.valueComponent = component;\n }\n }\n removeChildComponent() {\n const defaultSchema = DataMapComponent.schema();\n this.component.valueComponent = defaultSchema.valueComponent;\n }\n addRow() {\n const index = this.rows.length;\n this.rows[index] = this.createRowComponents(this.dataValue, index);\n this.redraw();\n this.triggerChange();\n }\n removeRow(index) {\n const keys = Object.keys(this.dataValue);\n if (keys[index]) {\n delete this.dataValue[keys[index]];\n }\n this.rows.splice(index, 1);\n this.redraw();\n this.triggerChange();\n }\n setValue(value, flags = {}) {\n const changed = this.hasChanged(value, this.dataValue);\n this.dataValue = value;\n this.createRows();\n this.updateOnChange(flags, changed);\n return changed;\n }\n checkColumns() {\n if (this.builderMode || (!this.dataValue || !Object.keys(this.dataValue).length)) {\n return { rebuild: false, show: true };\n }\n if (Object.keys(this.dataValue).length > (this.rows || []).length) {\n return { rebuild: true, show: true };\n }\n return { rebuild: false, show: true };\n }\n}\nexports[\"default\"] = DataMapComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/datamap/DataMap.js?");
|
5163
|
+
eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst Component_1 = __importDefault(__webpack_require__(/*! ../_classes/component/Component */ \"./lib/cjs/components/_classes/component/Component.js\"));\nconst DataGrid_1 = __importDefault(__webpack_require__(/*! ../datagrid/DataGrid */ \"./lib/cjs/components/datagrid/DataGrid.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst eventemitter3_1 = __importDefault(__webpack_require__(/*! eventemitter3 */ \"./node_modules/eventemitter3/index.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst Components_1 = __importDefault(__webpack_require__(/*! ../Components */ \"./lib/cjs/components/Components.js\"));\nclass DataMapComponent extends DataGrid_1.default {\n static schema(...extend) {\n return Component_1.default.schema({\n label: 'Data Map',\n key: 'dataMap',\n type: 'datamap',\n clearOnHide: true,\n addAnother: 'Add Another',\n disableAddingRemovingRows: false,\n keyBeforeValue: true,\n valueComponent: {\n type: 'textfield',\n key: 'value',\n label: 'Value',\n input: true\n },\n input: true,\n validate: {\n maxLength: 0,\n minLength: 0\n }\n }, ...extend);\n }\n static get builderInfo() {\n return {\n title: 'Data Map',\n icon: 'th-list',\n group: 'data',\n documentation: '/userguide/form-building/data-components#data-map',\n showPreview: false,\n weight: 20,\n schema: DataMapComponent.schema()\n };\n }\n get schema() {\n const schema = super.schema;\n if (this.components && (this.components.length > 0)) {\n schema.valueComponent = this.components[this.components.length - 1].schema;\n }\n return lodash_1.default.omit(schema, 'components');\n }\n static savedValueTypes(schema) {\n return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes.object];\n }\n constructor(component, options, data) {\n super(component, options, data);\n this.type = 'datamap';\n }\n init() {\n this.components = [];\n this.rows = [];\n this.createRows();\n this.visibleColumns = {\n key: true,\n [this.valueKey]: true\n };\n this.component.valueComponent.hideLabel = true;\n }\n get defaultSchema() {\n return DataMapComponent.schema();\n }\n get emptyValue() {\n return {};\n }\n get dataValue() {\n if (!this.key ||\n (!this.visible && this.component.clearOnHide)) {\n return this.emptyValue;\n }\n if (!this.hasValue() && this.shouldAddDefaultValue) {\n this.dataValue = this.emptyValue;\n }\n return lodash_1.default.get(this.data, this.key);\n }\n set dataValue(value) {\n super.dataValue = value;\n }\n get defaultValue() {\n const value = super.defaultValue;\n if (Array.isArray(value)) {\n return value[0];\n }\n return this.emptyValue;\n }\n get keySchema() {\n return {\n type: 'textfield',\n input: true,\n hideLabel: true,\n label: this.component.keyLabel || 'Key',\n key: '__key',\n disableBuilderActions: true,\n };\n }\n get valueKey() {\n return this.component.valueComponent.key;\n }\n getRowValues() {\n const dataValue = this.dataValue;\n if (this.builderMode) {\n return [dataValue];\n }\n if (lodash_1.default.isEmpty(dataValue)) {\n return [];\n }\n return Object.keys(dataValue).map(() => dataValue);\n }\n getComponentsContainer() {\n if (this.builderMode) {\n return this.getComponents().map(comp => comp.component);\n }\n return super.getComponentsContainer();\n }\n get iteratableRows() {\n return this.rows.map((row) => {\n return Object.keys(row).map(key => ({\n components: row[key],\n data: row[key].dataValue,\n }));\n });\n }\n componentContext(component) {\n return this.iteratableRows[component.row].find(comp => comp.components.key === component.key).data;\n }\n hasHeader() {\n return true;\n }\n hasRemoveButtons() {\n return !this.component.disableAddingRemovingRows &&\n !this.options.readOnly &&\n !this.disabled &&\n this.fullMode;\n }\n getColumns() {\n const keySchema = Object.assign({}, this.keySchema);\n const valueSchema = Object.assign({}, this.component.valueComponent);\n keySchema.hideLabel = false;\n valueSchema.hideLabel = false;\n return this.component.keyBeforeValue ?\n [keySchema, valueSchema] :\n [valueSchema, keySchema];\n }\n getRowKey(rowIndex) {\n const keys = Object.keys(this.dataValue);\n if (!keys[rowIndex]) {\n keys[rowIndex] = (0, utils_1.uniqueKey)(this.dataValue, this.defaultRowKey);\n }\n return keys[rowIndex];\n }\n get defaultRowKey() {\n return 'key';\n }\n setRowComponentsData(rowIndex, rowData) {\n lodash_1.default.each(this.rows[rowIndex], (component) => {\n if (component.key === '__key') {\n component.data = {\n '__key': Object.keys(rowData)[rowIndex],\n };\n }\n else {\n component.data = rowData;\n }\n });\n }\n getValueAsString(value, options) {\n if ((options === null || options === void 0 ? void 0 : options.email) && this.visible && !this.skipInEmail && lodash_1.default.isObject(value)) {\n let result = (`\n <table border=\"1\" style=\"width:100%\">\n <tbody>\n `);\n result = Object.keys(value).reduce((result, key) => {\n result += (`\n <tr>\n <th style=\"padding: 5px 10px;\">${key}</th>\n <td style=\"width:100%;padding:5px 10px;\">${this.getView(value[key], options)}</td>\n </tr>\n `);\n return result;\n }, result);\n result += (`\n </tbody>\n </table>\n `);\n return result;\n }\n if (lodash_1.default.isEmpty(value)) {\n return '';\n }\n if (options === null || options === void 0 ? void 0 : options.modalPreview) {\n delete options.modalPreview;\n return this.getDataValueAsTable(value, options);\n }\n return typeof value === 'object' ? '[Complex Data]' : value;\n }\n getDataValueAsTable(value, options) {\n let result = (`\n <table border=\"1\" style=\"width:100%\">\n <tbody>\n `);\n if (this.visible && lodash_1.default.isObject(value)) {\n Object.keys(value).forEach((key) => {\n result += (`\n <tr>\n <th style=\"padding: 5px 10px;\">${key}</th>\n <td style=\"width:100%;padding:5px 10px;\">${this.getView(value[key], options)}</td>\n </tr>\n `);\n });\n }\n result += (`\n </tbody>\n </table>\n `);\n return result;\n }\n createRowComponents(row, rowIndex) {\n // Use original value component API key in builder mode to be able to edit value component\n let key = this.builderMode ? this.valueKey : this.getRowKey(rowIndex);\n // Create a new event emitter since fields are isolated.\n const options = lodash_1.default.clone(this.options);\n options.events = new eventemitter3_1.default();\n options.name += `[${rowIndex}]`;\n options.row = `${rowIndex}`;\n const components = {};\n components['__key'] = this.createComponent(this.keySchema, options, { __key: this.builderMode ? this.defaultRowKey : key });\n components['__key'].on('componentChange', (event) => {\n const dataValue = this.dataValue;\n const newKey = (0, utils_1.uniqueKey)(dataValue, event.value);\n dataValue[newKey] = dataValue[key];\n delete dataValue[key];\n const comp = components[this.valueKey];\n comp.component.key = newKey;\n comp.path = Components_1.default.getComponentPath(comp);\n key = newKey;\n });\n const valueComponent = lodash_1.default.clone(this.component.valueComponent);\n valueComponent.key = key;\n const componentOptions = this.options;\n componentOptions.row = options.row;\n components[this.valueKey] = this.createComponent(valueComponent, componentOptions, this.dataValue);\n return components;\n }\n get canAddColumn() {\n return false;\n }\n addChildComponent(component) {\n this.component.valueComponent = component;\n }\n saveChildComponent(component) {\n // Update the Value Component, the Key Component is not allowed to edit\n if (component.key !== this.keySchema.key) {\n this.component.valueComponent = component;\n }\n }\n removeChildComponent() {\n const defaultSchema = DataMapComponent.schema();\n this.component.valueComponent = defaultSchema.valueComponent;\n }\n addRow() {\n const index = this.rows.length;\n this.rows[index] = this.createRowComponents(this.dataValue, index);\n this.redraw();\n this.triggerChange();\n }\n removeRow(index) {\n const keys = Object.keys(this.dataValue);\n if (keys[index]) {\n delete this.dataValue[keys[index]];\n }\n this.rows.splice(index, 1);\n this.redraw();\n this.triggerChange();\n }\n setValue(value, flags = {}) {\n const changed = this.hasChanged(value, this.dataValue);\n this.dataValue = value;\n this.createRows();\n this.updateOnChange(flags, changed);\n return changed;\n }\n checkColumns() {\n if (this.builderMode || (!this.dataValue || !Object.keys(this.dataValue).length)) {\n return { rebuild: false, show: true };\n }\n if (Object.keys(this.dataValue).length > (this.rows || []).length) {\n return { rebuild: true, show: true };\n }\n return { rebuild: false, show: true };\n }\n}\nexports[\"default\"] = DataMapComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/datamap/DataMap.js?");
|
5164
5164
|
|
5165
5165
|
/***/ }),
|
5166
5166
|
|
@@ -5193,7 +5193,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
|
|
5193
5193
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
5194
5194
|
|
5195
5195
|
"use strict";
|
5196
|
-
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 process_1 = __webpack_require__(/*! @formio/core/process */ \"./node_modules/@formio/core/lib/process/index.js\");\nconst components_1 = __webpack_require__(/*! @formio/bootstrap/components */ \"./node_modules/@formio/bootstrap/lib/cjs/templates/components/index.js\");\nconst NestedArrayComponent_1 = __importDefault(__webpack_require__(/*! ../_classes/nestedarray/NestedArrayComponent */ \"./lib/cjs/components/_classes/nestedarray/NestedArrayComponent.js\"));\nconst Component_1 = __importDefault(__webpack_require__(/*! ../_classes/component/Component */ \"./lib/cjs/components/_classes/component/Component.js\"));\nconst Alert_1 = __importDefault(__webpack_require__(/*! ../alert/Alert */ \"./lib/cjs/components/alert/Alert.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst EditRowState = {\n New: 'new',\n Editing: 'editing',\n Saved: 'saved',\n Viewing: 'viewing',\n Removed: 'removed',\n Draft: 'draft',\n};\nclass EditGridComponent extends NestedArrayComponent_1.default {\n static schema(...extend) {\n return NestedArrayComponent_1.default.schema({\n type: 'editgrid',\n label: 'Edit Grid',\n key: 'editGrid',\n clearOnHide: true,\n input: true,\n tree: true,\n removeRow: 'Cancel',\n defaultOpen: false,\n openWhenEmpty: false,\n modal: false,\n components: [],\n inlineEdit: false,\n templates: {\n header: EditGridComponent.defaultHeaderTemplate,\n row: EditGridComponent.defaultRowTemplate,\n tableHeader: EditGridComponent.defaultTableHeaderTemplate,\n tableRow: EditGridComponent.defaultTableRowTemplate,\n footer: '',\n },\n }, ...extend);\n }\n static get builderInfo() {\n return {\n title: 'Edit Grid',\n icon: 'tasks',\n group: 'data',\n documentation: '/userguide/form-building/data-components#edit-grid',\n showPreview: false,\n weight: 30,\n schema: EditGridComponent.schema(),\n };\n }\n static get defaultHeaderTemplate() {\n return `<div class=\"row\">\n {% util.eachComponent(components, function(component) { %}\n {% if (displayValue(component)) { %}\n <div class=\"col-sm-2\">{{ t(component.label) }}</div>\n {% } %}\n {% }) %}\n </div>`;\n }\n static get defaultTableHeaderTemplate() {\n return `\n <tr>\n {% util.eachComponent(components, function(component) { %}\n {% if (!component.hasOwnProperty('tableView') || component.tableView) { %}\n <td class=\"editgrid-table-column\">{{ component.label }}</td>\n {% } %}\n {% }) %}\n {% if (!instance.options.readOnly && !instance.disabled) { %}\n <td class=\"editgrid-table-column\">Actions</td>\n {% } %}\n </tr>\n `;\n }\n static get defaultRowTemplate() {\n return `<div class=\"row\">\n {% util.eachComponent(components, function(component) { %}\n {% if (displayValue(component)) { %}\n <div class=\"col-sm-2\">\n {{ isVisibleInRow(component) ? getView(component, row[component.key]) : ''}}\n </div>\n {% } %}\n {% }) %}\n {% if (!instance.options.readOnly && !instance.disabled) { %}\n <div class=\"col-sm-2\">\n <div class=\"btn-group pull-right\">\n <button class=\"btn btn-default btn-light btn-sm editRow\"><i class=\"{{ iconClass('edit') }}\"></i></button>\n {% if (!instance.hasRemoveButtons || instance.hasRemoveButtons()) { %}\n <button class=\"btn btn-danger btn-sm removeRow\"><i class=\"{{ iconClass('trash') }}\"></i></button>\n {% } %}\n </div>\n </div>\n {% } %}\n </div>`;\n }\n static get defaultTableRowTemplate() {\n return `\n {% util.eachComponent(components, function(component) { %}\n {% if (!component.hasOwnProperty('tableView') || component.tableView) { %}\n <td class=\"editgrid-table-column\">\n {{ getView(component, row[component.key]) }}\n </td>\n {% } %}\n {% }) %}\n {% if (!instance.options.readOnly && !instance.disabled) { %}\n <td class=\"editgrid-table-column\">\n <div class=\"btn-group\">\n <button class=\"btn btn-default btn-light btn-sm editRow\" aria-label=\"{{ t('Edit row') }}\"><i class=\"{{ iconClass('edit') }}\"></i></button>\n {% if (!instance.hasRemoveButtons || instance.hasRemoveButtons()) { %}\n <button class=\"btn btn-danger btn-sm removeRow\" aria-label=\"{{ t('Remove row') }}\"><i class=\"{{ iconClass('trash') }}\"></i></button>\n {% } %}\n </div>\n </td>\n {% } %}\n `;\n }\n get defaultDialogTemplate() {\n return `\n <h3 ${this._referenceAttributeName}=\"dialogHeader\">${this.t('Do you want to clear data?')}</h3>\n <div style=\"display:flex; justify-content: flex-end;\">\n <button ${this._referenceAttributeName}=\"dialogCancelButton\" class=\"btn btn-secondary\" aria-label=\"${this.t('Cancel')}\">${this.t('Cancel')}</button>\n <button ${this._referenceAttributeName}=\"dialogYesButton\" class=\"btn btn-danger\" aria-label=\"${this.t('Yes, delete it')}\">${this.t('Yes, delete it')}</button>\n </div>\n `;\n }\n get defaultRowTemplate() {\n return this.displayAsTable\n ? EditGridComponent.defaultTableRowTemplate\n : EditGridComponent.defaultRowTemplate;\n }\n get defaultHeaderTemplate() {\n return this.displayAsTable\n ? EditGridComponent.defaultTableHeaderTemplate\n : EditGridComponent.defaultHeaderTemplate;\n }\n get rowTemplate() {\n let rowTemplate;\n if (utils_1.Evaluator.noeval) {\n rowTemplate = this.displayAsTable ?\n components_1.editgrid.tableRow\n : components_1.editgrid.row;\n }\n else {\n rowTemplate = this.displayAsTable ?\n lodash_1.default.get(this.component, 'templates.tableRow', this.defaultRowTemplate)\n : lodash_1.default.get(this.component, 'templates.row', this.defaultRowTemplate);\n }\n return rowTemplate;\n }\n get headerTemplate() {\n let headerTemplate;\n if (utils_1.Evaluator.noeval) {\n headerTemplate = this.displayAsTable ?\n components_1.editgrid.tableHeader\n : components_1.editgrid.header;\n }\n else {\n headerTemplate = this.displayAsTable ?\n lodash_1.default.get(this.component, 'templates.tableHeader', this.defaultHeaderTemplate)\n : lodash_1.default.get(this.component, 'templates.header', this.defaultHeaderTemplate);\n }\n return headerTemplate;\n }\n /**\n * @returns {boolean} - Returns true if the component has nested components which don't trigger changes on the root level\n */\n get hasScopedChildren() {\n return !this.inlineEditMode;\n }\n get defaultSchema() {\n return EditGridComponent.schema();\n }\n get emptyValue() {\n return [];\n }\n get editgridKey() {\n return `editgrid-${this.key}`;\n }\n get rowRef() {\n return `${this.editgridKey}-row`;\n }\n get rowElements() {\n return this.refs[this.rowRef];\n }\n get rowRefs() {\n return this.refs[`editgrid-${this.component.key}-row`];\n }\n get addRowRef() {\n return `${this.editgridKey}-addRow`;\n }\n get addRowElements() {\n return this.refs[this.addRowRef];\n }\n get saveRowRef() {\n return `${this.editgridKey}-saveRow`;\n }\n get saveRowElements() {\n return this.refs[this.saveRowRef];\n }\n get cancelRowRef() {\n return `${this.editgridKey}-cancelRow`;\n }\n get cancelRowElements() {\n return this.refs[this.cancelRowRef];\n }\n get inlineEditMode() {\n return this.component.inlineEdit;\n }\n get saveEditMode() {\n return !this.inlineEditMode;\n }\n get minLength() {\n return this.builderMode ? 0 : lodash_1.default.get(this.component, 'validate.minLength', 0);\n }\n get data() {\n return this._data;\n }\n get dataValue() {\n return super.dataValue || [];\n }\n set dataValue(value) {\n super.dataValue = value;\n }\n get displayAsTable() {\n return this.component.displayAsTable;\n }\n set data(value) {\n this._data = value;\n const data = this.dataValue;\n (this.editRows || []).forEach((row, index) => {\n if (!data[index] && row.state !== EditRowState.New) {\n data[index] = {};\n }\n const rowData = data[index] || {};\n row.data = rowData;\n row.components.forEach((component) => {\n component.data = rowData;\n });\n });\n }\n get iteratableRows() {\n return this.editRows;\n }\n get defaultValue() {\n const value = super.defaultValue;\n const defaultValue = Array.isArray(value) ? value : [];\n lodash_1.default.times(this.minLength - defaultValue.length, () => defaultValue.push({}));\n return defaultValue;\n }\n constructor(...args) {\n super(...args);\n this.type = 'editgrid';\n }\n hasRemoveButtons() {\n return !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 init() {\n if (this.builderMode) {\n this.editRows = [];\n return super.init();\n }\n this.components = this.components || [];\n const dataValue = this.dataValue;\n const openWhenEmpty = !dataValue.length && this.component.openWhenEmpty;\n if (openWhenEmpty) {\n const dataObj = {};\n this.editRows = [];\n this.createRow(dataObj, 0);\n }\n else {\n this.editRows = dataValue.map((row, rowIndex) => ({\n components: this.lazyLoad ? [] : this.createRowComponents(row, rowIndex),\n data: row,\n state: EditRowState.Saved,\n backup: null,\n error: null,\n rowIndex,\n }));\n }\n this.prevHasAddButton = this.hasAddButton();\n this.checkData();\n this.setVariableTypeComponents();\n if (this.variableTypeComponentsIndexes.length) {\n lodash_1.default.each(this.editRows || [], (editRow, rowIndex) => this.checkRowVariableTypeComponents(editRow, rowIndex));\n }\n }\n checkRowVariableTypeComponents(editRow, rowIndex) {\n const rowComponents = editRow.components;\n if (lodash_1.default.some(this.variableTypeComponentsIndexes, (compIndex) => {\n const variableTypeComp = rowComponents[compIndex];\n return variableTypeComp.type !== variableTypeComp.component.type;\n })) {\n editRow.components = this.createRowComponents(editRow.data, rowIndex, true);\n }\n }\n setVariableTypeComponents() {\n //set components which type is changing within a row (e.g.,by mergeComponentSchema action)\n this.variableTypeComponentsIndexes = [];\n lodash_1.default.each(this.component.components, (comp, index) => {\n if (comp.typeChangeEnabled) {\n this.variableTypeComponentsIndexes.push(index);\n }\n });\n }\n isOpen(editRow) {\n return [EditRowState.New, EditRowState.Editing, EditRowState.Viewing].includes(editRow.state);\n }\n isComponentVisibleInSomeRow(component) {\n const rows = this.editRows;\n const savedStates = [EditRowState.Saved, EditRowState.Editing, EditRowState.Draft];\n const savedRows = rows.filter(row => lodash_1.default.includes(savedStates, row.state));\n this.visibleInHeader = this.visibleInHeader || [];\n const changeVisibleInHeader = (component, isVisible) => {\n if (!isVisible) {\n lodash_1.default.remove(this.visibleInHeader, (key) => key === component.key);\n }\n if (isVisible && !lodash_1.default.includes(this.visibleInHeader, component.key)) {\n this.visibleInHeader.push(component.key);\n }\n };\n if (lodash_1.default.isEmpty(rows)) {\n const rowComponents = this.createRowComponents({}, 0);\n let checkComponent;\n (0, utils_1.eachComponent)(rowComponents, (comp) => {\n if (comp.component.key === component.key) {\n checkComponent = comp;\n }\n comp.checkConditions();\n });\n const isVisible = checkComponent ? checkComponent.visible : true;\n [...this.components].forEach((comp) => this.removeComponent(comp, this.components));\n changeVisibleInHeader(component, isVisible);\n return isVisible;\n }\n const isOpenRowWhenEmpty = lodash_1.default.get(this.component, 'openWhenEmpty') && rows.length === 1 && rows[0].state === EditRowState.New;\n if (!lodash_1.default.isEmpty(rows) && lodash_1.default.isEmpty(savedRows) && !isOpenRowWhenEmpty) {\n return lodash_1.default.includes(this.visibleInHeader, component.key);\n }\n return lodash_1.default.some(isOpenRowWhenEmpty ? rows : savedRows, (row, index) => {\n const editingRow = row.state === EditRowState.Editing;\n let isVisible;\n if (!editingRow) {\n const flattenedComponents = this.flattenComponents(index);\n const instance = flattenedComponents[component.key];\n isVisible = instance ? instance.visible : true;\n changeVisibleInHeader(component, isVisible);\n }\n else {\n isVisible = lodash_1.default.includes(this.visibleInHeader, component.key);\n }\n return isVisible;\n });\n }\n render(children) {\n if (this.builderMode) {\n return super.render();\n }\n const dataValue = this.dataValue;\n const headerTemplate = this.headerTemplate;\n const t = this.t.bind(this);\n const templateName = this.displayAsTable ? 'editgridTable' : 'editgrid';\n return super.render(children || this.renderTemplate(templateName, {\n ref: {\n row: this.rowRef,\n addRow: this.addRowRef,\n saveRow: this.saveRowRef,\n cancelRow: this.cancelRowRef,\n },\n header: this.renderString(headerTemplate, {\n displayValue: (component) => this.displayComponentValue(component, true),\n components: this.component.components,\n value: dataValue,\n t\n }),\n footer: this.renderString(lodash_1.default.get(this.component, 'templates.footer'), {\n components: this.component.components,\n value: dataValue,\n t\n }),\n rows: this.editRows.map(this.renderRow.bind(this)),\n openRows: this.editRows.map((row) => this.isOpen(row)),\n errors: this.editRows.map((row) => row.error),\n hasAddButton: this.hasAddButton(),\n hasRemoveButtons: this.hasRemoveButtons(),\n }));\n }\n renderComponents(components) {\n components = components || this.getComponents();\n const children = components.map(component => component.render());\n const templateName = this.displayAsTable && this.prevHasAddButton ? 'tableComponents' : 'components';\n return this.renderTemplate(templateName, {\n children,\n components,\n });\n }\n attach(element) {\n if (this.builderMode) {\n return super.attach(element);\n }\n this.loadRefs(element, {\n [this.addRowRef]: 'multiple',\n [this.saveRowRef]: 'multiple',\n [this.cancelRowRef]: 'multiple',\n [this.rowRef]: 'multiple',\n });\n this.addRowElements.forEach((addButton) => {\n this.addEventListener(addButton, 'click', () => this.addRow());\n });\n let openRowCount = 0;\n this.rowElements.forEach((row, rowIndex) => {\n const editRow = this.editRows[rowIndex];\n if (editRow === null || editRow === void 0 ? void 0 : editRow.isRowSelected) {\n row.classList.add('selected');\n }\n if (this.isOpen(editRow)) {\n this.attachComponents(row, editRow.components);\n this.addEventListener(this.saveRowElements[openRowCount], 'click', () => this.saveRow(rowIndex, true));\n this.addEventListener(this.cancelRowElements[openRowCount], 'click', () => this.cancelRow(rowIndex));\n openRowCount++;\n }\n else {\n // Attach edit and remove button events.\n [\n {\n className: 'removeRow',\n event: 'click',\n action: () => this.removeRow(rowIndex, true),\n },\n {\n className: 'editRow',\n event: 'click',\n action: () => {\n this.editRow(rowIndex).then(() => {\n var _a;\n if (this.component.rowDrafts) {\n const errors = this.validateRow(editRow, false);\n const shouldShowRowErrorsAlert = this.component.modal && errors.length && ((_a = this.root) === null || _a === void 0 ? void 0 : _a.submitted);\n if (shouldShowRowErrorsAlert) {\n this.alert.showErrors(errors, false);\n editRow.alerts = true;\n }\n }\n });\n },\n },\n {\n className: 'row',\n event: 'click',\n action: () => {\n row.classList.toggle('selected');\n let eventName = 'editGridSelectRow';\n if (Array.from(row.classList).includes('selected')) {\n editRow.isRowSelected = true;\n }\n else {\n delete editRow.isRowSelected;\n eventName = 'editGridUnSelectRow';\n }\n this.emit(eventName, {\n component: this.component,\n data: this.dataValue[rowIndex]\n });\n },\n }\n ].forEach(({ className, event, action, }) => {\n const elements = row.getElementsByClassName(className);\n Array.prototype.forEach.call(elements, (element) => {\n if (this.options.pdf && lodash_1.default.intersection(element.classList, ['editRow', 'removeRow']).length) {\n element.style.display = 'none';\n }\n else {\n this.addEventListener(element, event, action);\n }\n });\n });\n }\n });\n // Add open class to the element if any edit grid row is open\n if (openRowCount) {\n this.addClass(this.refs.component, `formio-component-${this.component.type}-row-open`);\n }\n else {\n this.removeClass(this.refs.component, `formio-component-${this.component.type}-row-open`);\n }\n const superAttach = super.attach(element);\n this.loadRefs(element, {\n messageContainer: 'single-scope',\n });\n return superAttach;\n }\n flattenRowDataValue(dataValue) {\n const flattened = {};\n Object.keys(dataValue).forEach((key) => {\n if (lodash_1.default.isObject(dataValue[key]) && !lodash_1.default.isNil(dataValue[key])) {\n Object.assign(flattened, this.flattenRowDataValue(dataValue[key]));\n }\n else {\n flattened[key] = dataValue[key];\n }\n });\n return flattened;\n }\n isComponentVisibleInRow(component, flattenedComponents) {\n const instance = flattenedComponents[component.key];\n return instance ? instance.visible : true;\n }\n displayComponentValue(component, header) {\n return !!((!component.hasOwnProperty('tableView') || component.tableView)\n && header ? this.isComponentVisibleInSomeRow(component) : lodash_1.default.includes(this.visibleInHeader, component.key));\n }\n renderRow(row, rowIndex) {\n const dataValue = this.dataValue;\n if (this.isOpen(row)) {\n return this.renderComponents(row.components);\n }\n else {\n const flattenedComponents = this.flattenComponents(rowIndex);\n const rowTemplate = this.rowTemplate;\n return this.renderString(rowTemplate, {\n row: dataValue[rowIndex] || {},\n data: this.data,\n rowIndex,\n components: this.component.components,\n flattenedComponents,\n displayValue: (component) => this.displayComponentValue(component),\n isVisibleInRow: (component) => this.isComponentVisibleInRow(component, flattenedComponents),\n getView: (component, data) => {\n var _a, _b;\n const instance = flattenedComponents[component.key];\n const view = instance ? instance.getView(data || instance.dataValue) : '';\n // If there is an html tag in view, don't allow it to be injected in template\n const htmlTagRegExp = new RegExp('<(.*?)>');\n return typeof view === 'string' && view.length && !((_a = instance.component) === null || _a === void 0 ? void 0 : _a.template) && htmlTagRegExp.test(view) && ((_b = instance.component) === null || _b === void 0 ? void 0 : _b.inputFormat) !== 'html'\n ? `<input type=\"text\" value=\"${view.replace(/\"/g, '"')}\" readonly/>`\n : view;\n },\n state: this.editRows[rowIndex].state,\n t: this.t.bind(this)\n });\n }\n }\n eachComponent(fn, rowIndex) {\n lodash_1.default.each(this.getComponents(rowIndex), (component, index) => {\n if (fn(component, index) === false) {\n return false;\n }\n });\n }\n restoreComponentsContext() {\n this.getComponents().forEach((component) => {\n var _a;\n const rowData = this.dataValue[component.rowIndex];\n const editRowData = (_a = this.editRows[component.rowIndex]) === null || _a === void 0 ? void 0 : _a.data;\n component.data = rowData || editRowData;\n });\n }\n flattenComponents(rowIndex) {\n const result = {};\n this.everyComponent((component) => {\n result[component.component.flattenAs || component.key] = component;\n }, rowIndex);\n return result;\n }\n getComponents(rowIndex) {\n var _a;\n // Ensure editrows is set.\n this.editRows = this.editRows || [];\n return this.builderMode\n ? super.getComponents()\n : lodash_1.default.isNumber(rowIndex)\n ? (((_a = this.editRows[rowIndex]) === null || _a === void 0 ? void 0 : _a.components) || [])\n : this.editRows.reduce((result, row) => result.concat(row.components || []), []);\n }\n destroy(all = false) {\n this.calculatedValue = undefined;\n super.destroy(all);\n }\n destroyComponents(all = false, rowIndex = 0) {\n if (this.builderMode) {\n return super.destroyComponents(all);\n }\n const components = this.getComponents(rowIndex).slice();\n components.forEach((comp) => this.removeComponent(comp, this.components, all));\n }\n createRow(dataObj, rowIndex) {\n const editRow = {\n components: this.createRowComponents(dataObj, rowIndex),\n data: dataObj,\n state: EditRowState.New,\n backup: null,\n error: null,\n rowIndex,\n };\n this.editRows.push(editRow);\n if (this.inlineEditMode) {\n this.dataValue.push(dataObj);\n }\n return editRow;\n }\n addRow() {\n if (this.options.readOnly) {\n return;\n }\n const dataObj = {};\n const rowIndex = this.editRows.length;\n const editRow = this.createRow(dataObj, rowIndex);\n if (editRow.state === EditRowState.New) {\n this.emptyRow = (0, utils_1.fastCloneDeep)(editRow.data);\n }\n if (this.inlineEditMode) {\n this.triggerChange();\n }\n this.emit('editGridAddRow', {\n component: this.component,\n row: editRow,\n });\n this.processRow('checkData', null, {}, editRow.data, editRow.components);\n if (this.component.modal) {\n this.addRowModal(rowIndex);\n }\n else {\n this.redraw();\n }\n return editRow;\n }\n addRowModal(rowIndex) {\n const modalContent = this.ce('div');\n const editRow = this.editRows[rowIndex];\n editRow.willBeSaved = false;\n const { components } = editRow;\n modalContent.innerHTML = this.renderComponents(components);\n const dialog = this.component.modal ? this.createModal(modalContent, {}, () => this.showDialog(rowIndex)) : undefined;\n dialog.classList.add(`editgrid-row-modal-${this.id}`);\n editRow.dialog = dialog;\n if (this.alert) {\n this.alert.clear();\n this.alert = null;\n }\n this.alert = new Alert_1.default(dialog.refs.dialogContents, this);\n this.addEventListener(dialog, 'close', () => {\n if (!editRow.willBeSaved) {\n if (this.editRows[rowIndex] && this.editRows[rowIndex].state !== EditRowState.New) {\n this.editRows[rowIndex].components.forEach((comp) => {\n comp.setPristine(true);\n });\n }\n this.cancelRow(rowIndex);\n }\n if (this.alert) {\n this.alert.clear();\n this.alert = null;\n }\n // Remove references to dialog elements to prevent possible in some cases memory leaks\n delete editRow.confirmationDialog;\n delete editRow.dialog;\n });\n dialog.refs.dialogContents.appendChild(this.ce('button', {\n class: 'btn btn-primary',\n onClick: () => {\n // After an attempt to save, all the components inside the row should become not pristine\n if (!this.component.rowDrafts) {\n editRow.components.forEach((comp) => comp.setPristine(false));\n }\n const errors = this.validateRow(editRow, true);\n if (!errors.length || this.component.rowDrafts) {\n editRow.willBeSaved = true;\n dialog.close();\n this.saveRow(rowIndex, true);\n }\n else {\n this.alert.showErrors(errors, false);\n editRow.alerts = true;\n }\n },\n }, this.component.saveRow || 'Save'));\n return this.attachComponents(modalContent, components);\n }\n showDialog(rowIndex) {\n const editRow = this.editRows[rowIndex];\n if (editRow.state === EditRowState.New ? lodash_1.default.isEqual(this.emptyRow, editRow.data) : lodash_1.default.isEqual(editRow.backup, editRow.data)) {\n return Promise.resolve();\n }\n const wrapper = this.ce('div', { ref: 'confirmationDialog' });\n const dialogContent = this.component.dialogTemplate || this.defaultDialogTemplate;\n wrapper.innerHTML = dialogContent;\n wrapper.refs = {};\n this.loadRefs.call(wrapper, wrapper, {\n dialogHeader: 'single',\n dialogCancelButton: 'single',\n dialogYesButton: 'single',\n });\n const dialog = this.createModal(wrapper);\n dialog.classList.add(`editgrid-row-modal-confirmation-${this.id}`);\n const close = (event) => {\n event.preventDefault();\n dialog.close();\n };\n let dialogResult;\n const promise = new Promise((resolve, reject) => {\n dialogResult = { resolve, reject };\n });\n this.addEventListener(wrapper.refs.dialogYesButton, 'click', (event) => {\n close(event);\n dialogResult.resolve();\n });\n this.addEventListener(wrapper.refs.dialogCancelButton, 'click', (event) => {\n close(event);\n dialogResult.reject();\n });\n editRow.confirmationDialog = dialog;\n return promise;\n }\n editRow(rowIndex) {\n const editRow = this.editRows[rowIndex];\n const isAlreadyEditing = editRow.state === EditRowState.Editing || editRow.state === EditRowState.New;\n if (!editRow || isAlreadyEditing) {\n return Promise.resolve();\n }\n editRow.prevState = editRow.state;\n editRow.state = this.options.readOnly ? EditRowState.Viewing : EditRowState.Editing;\n if (this.lazyLoad && (editRow.components.length === 0)) {\n editRow.components = this.createRowComponents(editRow.data, rowIndex);\n }\n const dataSnapshot = (0, utils_1.fastCloneDeep)(editRow.data);\n if (this.inlineEditMode) {\n editRow.backup = dataSnapshot;\n }\n else {\n editRow.backup = (0, utils_1.fastCloneDeep)(editRow.data);\n editRow.data = dataSnapshot;\n this.restoreRowContext(editRow);\n }\n if (this.component.modal) {\n return this.addRowModal(rowIndex);\n }\n return this.redraw();\n }\n clearErrors(rowIndex) {\n const editRow = this.editRows[rowIndex];\n if (editRow && Array.isArray(editRow.components)) {\n editRow.components.forEach((comp) => {\n comp.setPristine(true);\n comp.setCustomValidity('');\n });\n }\n }\n cancelRow(rowIndex) {\n if (this.options.readOnly) {\n return;\n }\n const editRow = this.editRows[rowIndex];\n switch (editRow.state) {\n case EditRowState.New: {\n editRow.state = EditRowState.Removed;\n this.clearErrors(rowIndex);\n this.destroyComponents(false, rowIndex);\n if (this.inlineEditMode) {\n this.splice(rowIndex);\n }\n this.editRows.splice(rowIndex, 1);\n this.openWhenEmpty();\n break;\n }\n case EditRowState.Editing: {\n editRow.state = editRow.prevState;\n if (this.inlineEditMode) {\n this.dataValue[rowIndex] = editRow.backup;\n }\n editRow.data = editRow.backup;\n editRow.backup = null;\n this.restoreRowContext(editRow);\n this.clearErrors(rowIndex);\n break;\n }\n }\n this.emit('editGridCancelRow', {\n instance: this,\n component: this.component,\n editRow,\n });\n this.checkValidity(null, true);\n this.redraw();\n if (this.component.rowDrafts) {\n this.checkValidity(this.data, false);\n }\n }\n saveRow(rowIndex, modified) {\n var _a, _b;\n const editRow = this.editRows[rowIndex];\n if (this.options.readOnly) {\n return;\n }\n // After an attempt to save, all the components inside the row should become not pristine\n if (!this.component.rowDrafts) {\n editRow.components.forEach((comp) => comp.setPristine(false));\n }\n const errors = this.validateRow(editRow, true);\n if (!this.component.rowDrafts) {\n if (errors.length) {\n return false;\n }\n }\n if (this.saveEditMode) {\n const dataValue = this.dataValue;\n if ((_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.focusedComponent) === null || _b === void 0 ? void 0 : _b.component.typeChangeEnabled) {\n this.root.focusedComponent = null;\n }\n switch (editRow.state) {\n case EditRowState.New: {\n const newIndex = dataValue.length;\n dataValue.push(editRow.data);\n editRow.components.forEach(component => component.rowIndex = newIndex);\n if (rowIndex !== newIndex) {\n this.editRows.splice(rowIndex, 1);\n this.editRows.splice(newIndex, 0, editRow);\n }\n break;\n }\n case EditRowState.Editing: {\n dataValue[rowIndex] = editRow.data;\n break;\n }\n }\n }\n editRow.state = this.component.rowDrafts && errors.length ? EditRowState.Draft : EditRowState.Saved;\n editRow.backup = null;\n this.updateValue();\n this.emit('editGridSaveRow', {\n component: this.component,\n row: editRow.data,\n instance: this\n });\n this.triggerChange({ modified, noPristineChangeOnModified: modified && this.component.rowDrafts, isolateRow: true });\n if (this.component.rowDrafts) {\n editRow.components.forEach(comp => comp.setPristine(this.pristine));\n }\n this.checkValidity(null, true);\n this.redraw();\n if (editRow.alerts) {\n editRow.alerts = false;\n }\n return true;\n }\n beforeFocus(component) {\n if ('beforeFocus' in this.parent) {\n this.parent.beforeFocus(this);\n }\n const relativePath = this.getRelativePath(component.path);\n const arrayPath = (0, utils_1.getArrayFromComponentPath)(relativePath);\n const rowIndex = arrayPath[0];\n let rowToEditIndex = arrayPath[0];\n this.editRows.forEach((row, indexInArray) => {\n if (row.rowIndex === rowIndex) {\n rowToEditIndex = indexInArray;\n }\n });\n if (lodash_1.default.isNumber(rowToEditIndex)) {\n this.editRow(rowToEditIndex);\n }\n }\n updateComponentsRowIndex(components, rowIndex) {\n components.forEach((component, colIndex) => {\n component.rowIndex = rowIndex;\n component.row = `${rowIndex}-${colIndex}`;\n });\n }\n updateRowsComponents(rowIndex) {\n this.editRows.slice(rowIndex).forEach((row, index) => {\n this.updateComponentsRowIndex(row.components, rowIndex + index);\n });\n }\n baseRemoveRow(rowIndex) {\n const editRow = this.editRows[rowIndex];\n editRow.state = EditRowState.Removed;\n this.destroyComponents(false, rowIndex);\n return editRow;\n }\n removeRow(rowIndex, modified) {\n if (this.options.readOnly) {\n return;\n }\n this.clearErrors(rowIndex);\n this.baseRemoveRow(rowIndex);\n this.splice(rowIndex);\n this.emit('editGridDeleteRow', {\n index: rowIndex\n });\n this.editRows.splice(rowIndex, 1);\n this.openWhenEmpty();\n this.updateRowsComponents(rowIndex);\n this.updateValue();\n this.triggerChange({ modified, noPristineChangeOnModified: modified && this.component.rowDrafts, isolateRow: true });\n this.checkValidity(null, true);\n this.checkData();\n this.redraw();\n }\n createRowComponents(row, rowIndex, recreatePartially) {\n // Iterate through existing components and destroy the ones with the same rowIndex.\n if (this.components) {\n for (let i = 0; i < this.components.length; i++) {\n if (this.components[i].rowIndex === rowIndex) {\n this.components[i].destroy();\n this.components.splice(i, 1);\n }\n }\n }\n const currentRowComponents = lodash_1.default.get(this.editRows, `[${rowIndex}].components`, null);\n return this.component.components.map((col, colIndex) => {\n var _a;\n if (recreatePartially && currentRowComponents && this.variableTypeComponentsIndexes.length) {\n const currentComp = currentRowComponents[colIndex];\n const shouldRecreate = lodash_1.default.includes(this.variableTypeComponentsIndexes, colIndex) && (currentComp === null || currentComp === void 0 ? void 0 : currentComp.type) !== ((_a = currentComp === null || currentComp === void 0 ? void 0 : currentComp.component) === null || _a === void 0 ? void 0 : _a.type);\n if (!shouldRecreate) {\n return currentComp;\n }\n col = currentComp.component;\n }\n const column = lodash_1.default.clone(col);\n const options = lodash_1.default.clone(this.options);\n options.name += `[${rowIndex}]`;\n options.row = `${rowIndex}-${colIndex}`;\n options.onChange = (flags = {}, changed, modified) => {\n var _a, _b;\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 if (!this.component.modal) {\n this.triggerRootChange(flags, changed, modified);\n }\n if (this.inlineEditMode) {\n return;\n }\n const editRow = this.editRows[rowIndex];\n if (editRow) {\n this.processRow('checkData', null, Object.assign(Object.assign({}, flags), { changed }), editRow.data, editRow.components);\n this.validateRow(editRow, false);\n }\n if (this.variableTypeComponentsIndexes.length) {\n this.checkRowVariableTypeComponents(editRow, rowIndex);\n this.redraw();\n }\n };\n const comp = this.createComponent(lodash_1.default.assign({}, column, { row: options.row }), options, row, null, recreatePartially && currentRowComponents ? currentRowComponents[colIndex] : null);\n comp.rowIndex = rowIndex;\n comp.inEditGrid = true;\n return comp;\n });\n }\n hasOpenRows() {\n return this.editRows.some(row => this.isOpen(row));\n }\n getAttachedData(data = null) {\n const ourData = (0, utils_1.fastCloneDeep)(data || this._data || this.rootValue);\n lodash_1.default.set(ourData, this.key, this.editRows.map((row) => row.data));\n return ourData;\n }\n shouldValidateDraft(editRow) {\n var _a, _b;\n // Draft rows should be validated only when there was an attempt to submit a form\n return (editRow.state === EditRowState.Draft &&\n !this.pristine &&\n !((_a = this.root) === null || _a === void 0 ? void 0 : _a.pristine) &&\n !this.hasOpenRows()) ||\n ((_b = this.root) === null || _b === void 0 ? void 0 : _b.submitted);\n }\n shouldValidateRow(editRow, dirty) {\n return this.shouldValidateDraft(editRow) ||\n editRow.state === EditRowState.New ||\n editRow.state === EditRowState.Editing ||\n editRow.alerts ||\n dirty;\n }\n validateRow(editRow, dirty, forceSilentCheck) {\n var _a;\n editRow.errors = [];\n if (this.shouldValidateRow(editRow, dirty)) {\n const silentCheck = (this.component.rowDrafts && !this.shouldValidateDraft(editRow)) || forceSilentCheck;\n const rootValue = (0, utils_1.fastCloneDeep)(this.rootValue);\n const editGridValue = lodash_1.default.get(rootValue, this.path, []);\n editGridValue[editRow.rowIndex] = editRow.data;\n lodash_1.default.set(rootValue, this.path, editGridValue);\n const validationProcessorProcess = (context) => this.validationProcessor(context, { dirty, silentCheck });\n editRow.errors = (0, process_1.processSync)({\n components: (0, utils_1.fastCloneDeep)(this.component.components).map((component) => {\n component.parentPath = `${this.path}[${editRow.rowIndex}]`;\n return component;\n }),\n data: rootValue,\n row: editRow.data,\n process: 'validateRow',\n instances: this.componentsMap,\n scope: { errors: [] },\n processors: [\n {\n process: validationProcessorProcess,\n processSync: validationProcessorProcess\n }\n ]\n }).errors;\n }\n // TODO: this is essentially running its own custom validation and should be moved into a validation rule\n if (this.component.validate && this.component.validate.row) {\n const valid = this.evaluate(this.component.validate.row, {\n valid: (editRow.length === 0),\n row: editRow.data\n }, 'valid', true);\n if (valid.toString() !== 'true') {\n editRow.errors.push({\n type: 'error',\n rowError: true,\n message: valid.toString()\n });\n }\n if (valid === null) {\n editRow.errors.push({\n type: 'error',\n message: `Invalid row validation for ${this.key}`\n });\n }\n }\n if (!this.component.rowDrafts || ((_a = this.root) === null || _a === void 0 ? void 0 : _a.submitted)) {\n this.showRowErrorAlerts(editRow, editRow.errors);\n }\n return editRow.errors;\n }\n showRowErrorAlerts(editRow, errors) {\n if (editRow.alerts) {\n if (this.alert) {\n if (errors.length) {\n this.alert.showErrors(errors, false);\n editRow.alerts = true;\n }\n else {\n this.alert.clear();\n this.alert = null;\n }\n }\n }\n }\n /**\n * @returns {boolean} - Return that this component processes its own validation.\n */\n get processOwnValidation() {\n return true;\n }\n checkComponentValidity(data, dirty, row, options = {}, errors = []) {\n var _a, _b;\n const { silentCheck } = options;\n const superValid = super.checkComponentValidity(data, dirty, row, options, errors);\n // If super tells us that component invalid and there is no need to update alerts, just return false\n if (!superValid && (!this.alert && !this.hasOpenRows())) {\n return false;\n }\n let rowsEditing = false;\n const allRowErrors = [];\n this.editRows.forEach((editRow, index) => {\n // Trigger all errors on the row.\n const rowErrors = this.validateRow(editRow, dirty, silentCheck);\n errors.push(...rowErrors);\n allRowErrors.push(...rowErrors);\n if (this.rowRefs) {\n const rowContainer = this.rowRefs[index];\n if (rowContainer) {\n const errorContainer = rowContainer.querySelector('.editgrid-row-error');\n if (rowErrors.length && errorContainer && (!this.component.rowDrafts || this.shouldValidateDraft(editRow))) {\n const rowError = rowErrors.find(error => error.rowError);\n this.addClass(errorContainer, 'help-block');\n errorContainer.textContent = this.t(rowError ? rowError.message : this.errorMessage('invalidRowError'));\n }\n else if (errorContainer) {\n errorContainer.textContent = '';\n }\n }\n }\n // If this is a dirty check, and any rows are still editing, we need to throw validation error.\n rowsEditing |= (dirty && this.isOpen(editRow));\n });\n if (allRowErrors.length) {\n if (!silentCheck && (dirty || this.dirty) && (!this.component.rowDrafts || ((_a = this.root) === null || _a === void 0 ? void 0 : _a.submitted))) {\n this.setCustomValidity(this.t(this.errorMessage('invalidRowsError')), dirty);\n this.removeClass(this.element, 'has-error');\n }\n return false;\n }\n else if (rowsEditing && this.saveEditMode && !this.component.openWhenEmpty) {\n this._errors = this.setCustomValidity(this.t(this.errorMessage('unsavedRowsError')), dirty);\n errors.push(...this._errors);\n return false;\n }\n const message = this.invalid || this.invalidMessage(data, dirty, false, row);\n if (allRowErrors.length && ((_b = this.root) === null || _b === void 0 ? void 0 : _b.submitted) && !message) {\n this._errors = this.setCustomValidity(message, dirty);\n errors.push(...this._errors);\n this.root.showErrors([message]);\n }\n else {\n this._errors = this.setCustomValidity(message, dirty);\n errors.push(...this._errors);\n }\n return superValid;\n }\n setRowInvalid(ref, index) {\n const editRow = this.editRows[index];\n const errorContainer = ref.querySelector('.editgrid-row-error');\n if (errorContainer && (!this.component.rowDrafts || this.shouldValidateDraft(editRow))) {\n this.addClass(errorContainer, 'help-block');\n errorContainer.textContent = this.t(this.errorMessage('invalidRowError'));\n }\n else if (errorContainer) {\n errorContainer.textContent = '';\n }\n }\n changeState(changed, flags) {\n if (this.visible && (changed || (flags.resetValue && this.component.modalEdit))) {\n this.rebuild();\n }\n else {\n this.redraw();\n }\n }\n setValue(value, flags = {}) {\n if (!value) {\n value = this.defaultValue;\n }\n if (!Array.isArray(value)) {\n if (typeof value === 'object') {\n value = [value];\n }\n else {\n return false;\n }\n }\n const changed = this.hasChanged(value, this.dataValue);\n if (this.parent && !this.options.server) {\n this.parent.checkComponentConditions();\n }\n this.dataValue = value;\n // Refresh editRow data when data changes.\n this.dataValue.forEach((row, rowIndex) => {\n const editRow = this.editRows[rowIndex];\n if (editRow) {\n editRow.data = row;\n this.restoreRowContext(editRow, flags);\n editRow.state = EditRowState.Saved;\n editRow.backup = null;\n editRow.errors = [];\n }\n else {\n this.editRows[rowIndex] = {\n components: this.lazyLoad ? [] : this.createRowComponents(row, rowIndex),\n data: row,\n state: EditRowState.Saved,\n backup: null,\n errors: [],\n };\n }\n });\n let { length: dataLength } = this.dataValue;\n // If the last row is a new row, then do not remove it.\n if (this.editRows[dataLength] && (this.editRows[dataLength].state === EditRowState.New)) {\n dataLength = (dataLength + 1);\n }\n this.editRows.slice(dataLength).forEach((editRow, index) => this.baseRemoveRow(dataLength + index));\n this.editRows = this.editRows.slice(0, dataLength);\n this.openWhenEmpty();\n this.updateOnChange(flags, changed);\n // do not call checkData with server option, it is called when change is triggered in updateOnChange\n if (!this.options.server) {\n this.checkData();\n }\n this.changeState(changed, flags);\n return changed;\n }\n openWhenEmpty() {\n const shouldBeOpened = !this.dataValue.length && this.component.openWhenEmpty;\n const hasNoRows = !this.editRows.length;\n if (hasNoRows && shouldBeOpened && !this.builderMode) {\n const dataObj = {};\n this.createRow(dataObj, 0);\n }\n }\n restoreRowContext(editRow, flags = {}) {\n editRow.components.forEach((component) => {\n component.data = editRow.data;\n this.setNestedValue(component, editRow.data, flags);\n });\n }\n emptyRows() {\n this.editRows.forEach((editRow, index) => this.destroyComponents(false, index));\n this.editRows = [];\n }\n resetValue() {\n super.resetValue();\n this.emptyRows();\n }\n}\nexports[\"default\"] = EditGridComponent;\nEditGridComponent.prototype.hasChanged = Component_1.default.prototype.hasChanged;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/editgrid/EditGrid.js?");
|
5196
|
+
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 process_1 = __webpack_require__(/*! @formio/core/process */ \"./node_modules/@formio/core/lib/process/index.js\");\nconst components_1 = __webpack_require__(/*! @formio/bootstrap/components */ \"./node_modules/@formio/bootstrap/lib/cjs/templates/components/index.js\");\nconst NestedArrayComponent_1 = __importDefault(__webpack_require__(/*! ../_classes/nestedarray/NestedArrayComponent */ \"./lib/cjs/components/_classes/nestedarray/NestedArrayComponent.js\"));\nconst Component_1 = __importDefault(__webpack_require__(/*! ../_classes/component/Component */ \"./lib/cjs/components/_classes/component/Component.js\"));\nconst Alert_1 = __importDefault(__webpack_require__(/*! ../alert/Alert */ \"./lib/cjs/components/alert/Alert.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst EditRowState = {\n New: 'new',\n Editing: 'editing',\n Saved: 'saved',\n Viewing: 'viewing',\n Removed: 'removed',\n Draft: 'draft',\n};\nclass EditGridComponent extends NestedArrayComponent_1.default {\n static schema(...extend) {\n return NestedArrayComponent_1.default.schema({\n type: 'editgrid',\n label: 'Edit Grid',\n key: 'editGrid',\n clearOnHide: true,\n input: true,\n tree: true,\n removeRow: 'Cancel',\n defaultOpen: false,\n openWhenEmpty: false,\n modal: false,\n components: [],\n inlineEdit: false,\n templates: {\n header: EditGridComponent.defaultHeaderTemplate,\n row: EditGridComponent.defaultRowTemplate,\n tableHeader: EditGridComponent.defaultTableHeaderTemplate,\n tableRow: EditGridComponent.defaultTableRowTemplate,\n footer: '',\n },\n }, ...extend);\n }\n static get builderInfo() {\n return {\n title: 'Edit Grid',\n icon: 'tasks',\n group: 'data',\n documentation: '/userguide/form-building/data-components#edit-grid',\n showPreview: false,\n weight: 30,\n schema: EditGridComponent.schema(),\n };\n }\n static get defaultHeaderTemplate() {\n return `<div class=\"row\">\n {% util.eachComponent(components, function(component) { %}\n {% if (displayValue(component)) { %}\n <div class=\"col-sm-2\">{{ t(component.label) }}</div>\n {% } %}\n {% }) %}\n </div>`;\n }\n static get defaultTableHeaderTemplate() {\n return `\n <tr>\n {% util.eachComponent(components, function(component) { %}\n {% if (!component.hasOwnProperty('tableView') || component.tableView) { %}\n <td class=\"editgrid-table-column\">{{ component.label }}</td>\n {% } %}\n {% }) %}\n {% if (!instance.options.readOnly && !instance.disabled) { %}\n <td class=\"editgrid-table-column\">Actions</td>\n {% } %}\n </tr>\n `;\n }\n static get defaultRowTemplate() {\n return `<div class=\"row\">\n {% util.eachComponent(components, function(component) { %}\n {% if (displayValue(component)) { %}\n <div class=\"col-sm-2\">\n {{ isVisibleInRow(component) ? getView(component, row[component.key]) : ''}}\n </div>\n {% } %}\n {% }) %}\n {% if (!instance.options.readOnly && !instance.disabled) { %}\n <div class=\"col-sm-2\">\n <div class=\"btn-group pull-right\">\n <button class=\"btn btn-default btn-light btn-sm editRow\"><i class=\"{{ iconClass('edit') }}\"></i></button>\n {% if (!instance.hasRemoveButtons || instance.hasRemoveButtons()) { %}\n <button class=\"btn btn-danger btn-sm removeRow\"><i class=\"{{ iconClass('trash') }}\"></i></button>\n {% } %}\n </div>\n </div>\n {% } %}\n </div>`;\n }\n static get defaultTableRowTemplate() {\n return `\n {% util.eachComponent(components, function(component) { %}\n {% if (!component.hasOwnProperty('tableView') || component.tableView) { %}\n <td class=\"editgrid-table-column\">\n {{ getView(component, row[component.key]) }}\n </td>\n {% } %}\n {% }) %}\n {% if (!instance.options.readOnly && !instance.disabled) { %}\n <td class=\"editgrid-table-column\">\n <div class=\"btn-group\">\n <button class=\"btn btn-default btn-light btn-sm editRow\" aria-label=\"{{ t('Edit row') }}\"><i class=\"{{ iconClass('edit') }}\"></i></button>\n {% if (!instance.hasRemoveButtons || instance.hasRemoveButtons()) { %}\n <button class=\"btn btn-danger btn-sm removeRow\" aria-label=\"{{ t('Remove row') }}\"><i class=\"{{ iconClass('trash') }}\"></i></button>\n {% } %}\n </div>\n </td>\n {% } %}\n `;\n }\n get defaultDialogTemplate() {\n return `\n <h3 ${this._referenceAttributeName}=\"dialogHeader\">${this.t('Do you want to clear data?')}</h3>\n <div style=\"display:flex; justify-content: flex-end;\">\n <button ${this._referenceAttributeName}=\"dialogCancelButton\" class=\"btn btn-secondary\" aria-label=\"${this.t('Cancel')}\">${this.t('Cancel')}</button>\n <button ${this._referenceAttributeName}=\"dialogYesButton\" class=\"btn btn-danger\" aria-label=\"${this.t('Yes, delete it')}\">${this.t('Yes, delete it')}</button>\n </div>\n `;\n }\n get defaultRowTemplate() {\n return this.displayAsTable\n ? EditGridComponent.defaultTableRowTemplate\n : EditGridComponent.defaultRowTemplate;\n }\n get defaultHeaderTemplate() {\n return this.displayAsTable\n ? EditGridComponent.defaultTableHeaderTemplate\n : EditGridComponent.defaultHeaderTemplate;\n }\n get rowTemplate() {\n let rowTemplate;\n if (utils_1.Evaluator.noeval) {\n rowTemplate = this.displayAsTable ?\n components_1.editgrid.tableRow\n : components_1.editgrid.row;\n }\n else {\n rowTemplate = this.displayAsTable ?\n lodash_1.default.get(this.component, 'templates.tableRow', this.defaultRowTemplate)\n : lodash_1.default.get(this.component, 'templates.row', this.defaultRowTemplate);\n }\n return rowTemplate;\n }\n get headerTemplate() {\n let headerTemplate;\n if (utils_1.Evaluator.noeval) {\n headerTemplate = this.displayAsTable ?\n components_1.editgrid.tableHeader\n : components_1.editgrid.header;\n }\n else {\n headerTemplate = this.displayAsTable ?\n lodash_1.default.get(this.component, 'templates.tableHeader', this.defaultHeaderTemplate)\n : lodash_1.default.get(this.component, 'templates.header', this.defaultHeaderTemplate);\n }\n return headerTemplate;\n }\n /**\n * @returns {boolean} - Returns true if the component has nested components which don't trigger changes on the root level\n */\n get hasScopedChildren() {\n return !this.inlineEditMode;\n }\n get defaultSchema() {\n return EditGridComponent.schema();\n }\n get emptyValue() {\n return [];\n }\n get editgridKey() {\n return `editgrid-${this.key}`;\n }\n get rowRef() {\n return `${this.editgridKey}-row`;\n }\n get rowElements() {\n return this.refs[this.rowRef];\n }\n get rowRefs() {\n return this.refs[`editgrid-${this.component.key}-row`];\n }\n get addRowRef() {\n return `${this.editgridKey}-addRow`;\n }\n get addRowElements() {\n return this.refs[this.addRowRef];\n }\n get saveRowRef() {\n return `${this.editgridKey}-saveRow`;\n }\n get saveRowElements() {\n return this.refs[this.saveRowRef];\n }\n get cancelRowRef() {\n return `${this.editgridKey}-cancelRow`;\n }\n get cancelRowElements() {\n return this.refs[this.cancelRowRef];\n }\n get inlineEditMode() {\n return this.component.inlineEdit;\n }\n get saveEditMode() {\n return !this.inlineEditMode;\n }\n get minLength() {\n return this.builderMode ? 0 : lodash_1.default.get(this.component, 'validate.minLength', 0);\n }\n get data() {\n return this._data;\n }\n get dataValue() {\n return super.dataValue || [];\n }\n set dataValue(value) {\n super.dataValue = value;\n }\n get displayAsTable() {\n return this.component.displayAsTable;\n }\n set data(value) {\n this._data = value;\n const data = this.dataValue;\n (this.editRows || []).forEach((row, index) => {\n if (!data[index] && row.state !== EditRowState.New) {\n data[index] = {};\n }\n const rowData = data[index] || {};\n row.data = rowData;\n row.components.forEach((component) => {\n component.data = rowData;\n });\n });\n }\n get iteratableRows() {\n return this.editRows;\n }\n get defaultValue() {\n const value = super.defaultValue;\n const defaultValue = Array.isArray(value) ? value : [];\n lodash_1.default.times(this.minLength - defaultValue.length, () => defaultValue.push({}));\n return defaultValue;\n }\n constructor(...args) {\n super(...args);\n this.type = 'editgrid';\n }\n hasRemoveButtons() {\n return !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 init() {\n if (this.builderMode) {\n this.editRows = [];\n return super.init();\n }\n this.components = this.components || [];\n const dataValue = this.dataValue;\n const openWhenEmpty = !dataValue.length && this.component.openWhenEmpty;\n if (openWhenEmpty) {\n const dataObj = {};\n this.editRows = [];\n this.createRow(dataObj, 0);\n }\n else {\n this.editRows = dataValue.map((row, rowIndex) => ({\n components: this.lazyLoad ? [] : this.createRowComponents(row, rowIndex),\n data: row,\n state: EditRowState.Saved,\n backup: null,\n error: null,\n rowIndex,\n }));\n }\n this.prevHasAddButton = this.hasAddButton();\n this.checkData();\n this.setVariableTypeComponents();\n if (this.variableTypeComponentsIndexes.length) {\n lodash_1.default.each(this.editRows || [], (editRow, rowIndex) => this.checkRowVariableTypeComponents(editRow, rowIndex));\n }\n }\n checkRowVariableTypeComponents(editRow, rowIndex) {\n const rowComponents = editRow.components;\n if (lodash_1.default.some(this.variableTypeComponentsIndexes, (compIndex) => {\n const variableTypeComp = rowComponents[compIndex];\n return variableTypeComp.type !== variableTypeComp.component.type;\n })) {\n editRow.components = this.createRowComponents(editRow.data, rowIndex, true);\n }\n }\n setVariableTypeComponents() {\n //set components which type is changing within a row (e.g.,by mergeComponentSchema action)\n this.variableTypeComponentsIndexes = [];\n lodash_1.default.each(this.component.components, (comp, index) => {\n if (comp.typeChangeEnabled) {\n this.variableTypeComponentsIndexes.push(index);\n }\n });\n }\n isOpen(editRow) {\n return [EditRowState.New, EditRowState.Editing, EditRowState.Viewing].includes(editRow.state);\n }\n isComponentVisibleInSomeRow(component) {\n const rows = this.editRows;\n const savedStates = [EditRowState.Saved, EditRowState.Editing, EditRowState.Draft];\n const savedRows = rows.filter(row => lodash_1.default.includes(savedStates, row.state));\n this.visibleInHeader = this.visibleInHeader || [];\n const changeVisibleInHeader = (component, isVisible) => {\n if (!isVisible) {\n lodash_1.default.remove(this.visibleInHeader, (key) => key === component.key);\n }\n if (isVisible && !lodash_1.default.includes(this.visibleInHeader, component.key)) {\n this.visibleInHeader.push(component.key);\n }\n };\n if (lodash_1.default.isEmpty(rows)) {\n const rowComponents = this.createRowComponents({}, 0);\n let checkComponent;\n (0, utils_1.eachComponent)(rowComponents, (comp) => {\n if (comp.component.key === component.key) {\n checkComponent = comp;\n }\n comp.checkConditions();\n });\n const isVisible = checkComponent ? checkComponent.visible : true;\n [...this.components].forEach((comp) => this.removeComponent(comp, this.components));\n changeVisibleInHeader(component, isVisible);\n return isVisible;\n }\n const isOpenRowWhenEmpty = lodash_1.default.get(this.component, 'openWhenEmpty') && rows.length === 1 && rows[0].state === EditRowState.New;\n if (!lodash_1.default.isEmpty(rows) && lodash_1.default.isEmpty(savedRows) && !isOpenRowWhenEmpty) {\n return lodash_1.default.includes(this.visibleInHeader, component.key);\n }\n return lodash_1.default.some(isOpenRowWhenEmpty ? rows : savedRows, (row, index) => {\n const editingRow = row.state === EditRowState.Editing;\n let isVisible;\n if (!editingRow) {\n const flattenedComponents = this.flattenComponents(index);\n const instance = flattenedComponents[component.key];\n isVisible = instance ? instance.visible : true;\n changeVisibleInHeader(component, isVisible);\n }\n else {\n isVisible = lodash_1.default.includes(this.visibleInHeader, component.key);\n }\n return isVisible;\n });\n }\n render(children) {\n if (this.builderMode) {\n return super.render();\n }\n const dataValue = this.dataValue;\n const headerTemplate = this.headerTemplate;\n const t = this.t.bind(this);\n const templateName = this.displayAsTable ? 'editgridTable' : 'editgrid';\n return super.render(children || this.renderTemplate(templateName, {\n ref: {\n row: this.rowRef,\n addRow: this.addRowRef,\n saveRow: this.saveRowRef,\n cancelRow: this.cancelRowRef,\n },\n header: this.renderString(headerTemplate, {\n displayValue: (component) => this.displayComponentValue(component, true),\n components: this.component.components,\n value: dataValue,\n t\n }),\n footer: this.renderString(lodash_1.default.get(this.component, 'templates.footer'), {\n components: this.component.components,\n value: dataValue,\n t\n }),\n rows: this.editRows.map(this.renderRow.bind(this)),\n openRows: this.editRows.map((row) => this.isOpen(row)),\n errors: this.editRows.map((row) => row.error),\n hasAddButton: this.hasAddButton(),\n hasRemoveButtons: this.hasRemoveButtons(),\n }));\n }\n renderComponents(components) {\n components = components || this.getComponents();\n const children = components.map(component => component.render());\n const templateName = this.displayAsTable && this.prevHasAddButton ? 'tableComponents' : 'components';\n return this.renderTemplate(templateName, {\n children,\n components,\n });\n }\n attach(element) {\n if (this.builderMode) {\n return super.attach(element);\n }\n this.loadRefs(element, {\n [this.addRowRef]: 'multiple',\n [this.saveRowRef]: 'multiple',\n [this.cancelRowRef]: 'multiple',\n [this.rowRef]: 'multiple',\n });\n this.addRowElements.forEach((addButton) => {\n this.addEventListener(addButton, 'click', () => this.addRow());\n });\n let openRowCount = 0;\n this.rowElements.forEach((row, rowIndex) => {\n const editRow = this.editRows[rowIndex];\n if (editRow === null || editRow === void 0 ? void 0 : editRow.isRowSelected) {\n row.classList.add('selected');\n }\n if (this.isOpen(editRow)) {\n this.attachComponents(row, editRow.components);\n this.addEventListener(this.saveRowElements[openRowCount], 'click', () => this.saveRow(rowIndex, true));\n this.addEventListener(this.cancelRowElements[openRowCount], 'click', () => this.cancelRow(rowIndex));\n openRowCount++;\n }\n else {\n // Attach edit and remove button events.\n [\n {\n className: 'removeRow',\n event: 'click',\n action: () => this.removeRow(rowIndex, true),\n },\n {\n className: 'editRow',\n event: 'click',\n action: () => {\n this.editRow(rowIndex).then(() => {\n var _a;\n if (this.component.rowDrafts) {\n const errors = this.validateRow(editRow, false);\n const shouldShowRowErrorsAlert = this.component.modal && errors.length && ((_a = this.root) === null || _a === void 0 ? void 0 : _a.submitted);\n if (shouldShowRowErrorsAlert) {\n this.alert.showErrors(errors, false);\n editRow.alerts = true;\n }\n }\n });\n },\n },\n {\n className: 'row',\n event: 'click',\n action: () => {\n row.classList.toggle('selected');\n let eventName = 'editGridSelectRow';\n if (Array.from(row.classList).includes('selected')) {\n editRow.isRowSelected = true;\n }\n else {\n delete editRow.isRowSelected;\n eventName = 'editGridUnSelectRow';\n }\n this.emit(eventName, {\n component: this.component,\n data: this.dataValue[rowIndex]\n });\n },\n }\n ].forEach(({ className, event, action, }) => {\n const elements = row.getElementsByClassName(className);\n Array.prototype.forEach.call(elements, (element) => {\n if (this.options.pdf && lodash_1.default.intersection(element.classList, ['editRow', 'removeRow']).length) {\n element.style.display = 'none';\n }\n else {\n this.addEventListener(element, event, action);\n }\n });\n });\n }\n });\n // Add open class to the element if any edit grid row is open\n if (openRowCount) {\n this.addClass(this.refs.component, `formio-component-${this.component.type}-row-open`);\n }\n else {\n this.removeClass(this.refs.component, `formio-component-${this.component.type}-row-open`);\n }\n return super.attach(element);\n }\n flattenRowDataValue(dataValue) {\n const flattened = {};\n Object.keys(dataValue).forEach((key) => {\n if (lodash_1.default.isObject(dataValue[key]) && !lodash_1.default.isNil(dataValue[key])) {\n Object.assign(flattened, this.flattenRowDataValue(dataValue[key]));\n }\n else {\n flattened[key] = dataValue[key];\n }\n });\n return flattened;\n }\n isComponentVisibleInRow(component, flattenedComponents) {\n const instance = flattenedComponents[component.key];\n return instance ? instance.visible : true;\n }\n displayComponentValue(component, header) {\n return !!((!component.hasOwnProperty('tableView') || component.tableView)\n && header ? this.isComponentVisibleInSomeRow(component) : lodash_1.default.includes(this.visibleInHeader, component.key));\n }\n renderRow(row, rowIndex) {\n const dataValue = this.dataValue;\n if (this.isOpen(row)) {\n return this.renderComponents(row.components);\n }\n else {\n const flattenedComponents = this.flattenComponents(rowIndex);\n const rowTemplate = this.rowTemplate;\n return this.renderString(rowTemplate, {\n row: dataValue[rowIndex] || {},\n data: this.data,\n rowIndex,\n components: this.component.components,\n flattenedComponents,\n displayValue: (component) => this.displayComponentValue(component),\n isVisibleInRow: (component) => this.isComponentVisibleInRow(component, flattenedComponents),\n getView: (component, data) => {\n var _a, _b;\n const instance = flattenedComponents[component.key];\n const view = instance ? instance.getView(data || instance.dataValue) : '';\n // If there is an html tag in view, don't allow it to be injected in template\n const htmlTagRegExp = new RegExp('<(.*?)>');\n return typeof view === 'string' && view.length && !((_a = instance.component) === null || _a === void 0 ? void 0 : _a.template) && htmlTagRegExp.test(view) && ((_b = instance.component) === null || _b === void 0 ? void 0 : _b.inputFormat) !== 'html'\n ? `<input type=\"text\" value=\"${view.replace(/\"/g, '"')}\" readonly/>`\n : view;\n },\n state: this.editRows[rowIndex].state,\n t: this.t.bind(this)\n });\n }\n }\n eachComponent(fn, rowIndex) {\n lodash_1.default.each(this.getComponents(rowIndex), (component, index) => {\n if (fn(component, index) === false) {\n return false;\n }\n });\n }\n restoreComponentsContext() {\n this.getComponents().forEach((component) => {\n var _a;\n const rowData = this.dataValue[component.rowIndex];\n const editRowData = (_a = this.editRows[component.rowIndex]) === null || _a === void 0 ? void 0 : _a.data;\n component.data = rowData || editRowData;\n });\n }\n flattenComponents(rowIndex) {\n const result = {};\n this.everyComponent((component) => {\n result[component.component.flattenAs || component.key] = component;\n }, rowIndex);\n return result;\n }\n getComponents(rowIndex) {\n var _a;\n // Ensure editrows is set.\n this.editRows = this.editRows || [];\n return this.builderMode\n ? super.getComponents()\n : lodash_1.default.isNumber(rowIndex)\n ? (((_a = this.editRows[rowIndex]) === null || _a === void 0 ? void 0 : _a.components) || [])\n : this.editRows.reduce((result, row) => result.concat(row.components || []), []);\n }\n destroy(all = false) {\n this.calculatedValue = undefined;\n super.destroy(all);\n }\n destroyComponents(all = false, rowIndex = 0) {\n if (this.builderMode) {\n return super.destroyComponents(all);\n }\n const components = this.getComponents(rowIndex).slice();\n components.forEach((comp) => this.removeComponent(comp, this.components, all));\n }\n createRow(dataObj, rowIndex) {\n const editRow = {\n components: this.createRowComponents(dataObj, rowIndex),\n data: dataObj,\n state: EditRowState.New,\n backup: null,\n error: null,\n rowIndex,\n };\n this.editRows.push(editRow);\n if (this.inlineEditMode) {\n this.dataValue.push(dataObj);\n }\n return editRow;\n }\n addRow() {\n if (this.options.readOnly) {\n return;\n }\n const dataObj = {};\n const rowIndex = this.editRows.length;\n const editRow = this.createRow(dataObj, rowIndex);\n if (editRow.state === EditRowState.New) {\n this.emptyRow = (0, utils_1.fastCloneDeep)(editRow.data);\n }\n if (this.inlineEditMode) {\n this.triggerChange();\n }\n this.emit('editGridAddRow', {\n component: this.component,\n row: editRow,\n });\n this.processRow('checkData', null, {}, editRow.data, editRow.components);\n if (this.component.modal) {\n this.addRowModal(rowIndex);\n }\n else {\n this.redraw();\n }\n return editRow;\n }\n addRowModal(rowIndex) {\n const modalContent = this.ce('div');\n const editRow = this.editRows[rowIndex];\n editRow.willBeSaved = false;\n const { components } = editRow;\n modalContent.innerHTML = this.renderComponents(components);\n const dialog = this.component.modal ? this.createModal(modalContent, {}, () => this.showDialog(rowIndex)) : undefined;\n dialog.classList.add(`editgrid-row-modal-${this.id}`);\n editRow.dialog = dialog;\n if (this.alert) {\n this.alert.clear();\n this.alert = null;\n }\n this.alert = new Alert_1.default(dialog.refs.dialogContents, this);\n this.addEventListener(dialog, 'close', () => {\n if (!editRow.willBeSaved) {\n if (this.editRows[rowIndex] && this.editRows[rowIndex].state !== EditRowState.New) {\n this.editRows[rowIndex].components.forEach((comp) => {\n comp.setPristine(true);\n });\n }\n this.cancelRow(rowIndex);\n }\n if (this.alert) {\n this.alert.clear();\n this.alert = null;\n }\n // Remove references to dialog elements to prevent possible in some cases memory leaks\n delete editRow.confirmationDialog;\n delete editRow.dialog;\n });\n dialog.refs.dialogContents.appendChild(this.ce('button', {\n class: 'btn btn-primary',\n onClick: () => {\n // After an attempt to save, all the components inside the row should become not pristine\n if (!this.component.rowDrafts) {\n editRow.components.forEach((comp) => comp.setPristine(false));\n }\n const errors = this.validateRow(editRow, true);\n if (!errors.length || this.component.rowDrafts) {\n editRow.willBeSaved = true;\n dialog.close();\n this.saveRow(rowIndex, true);\n }\n else {\n this.alert.showErrors(errors, false);\n editRow.alerts = true;\n }\n },\n }, this.component.saveRow || 'Save'));\n return this.attachComponents(modalContent, components);\n }\n showDialog(rowIndex) {\n const editRow = this.editRows[rowIndex];\n if (editRow.state === EditRowState.New ? lodash_1.default.isEqual(this.emptyRow, editRow.data) : lodash_1.default.isEqual(editRow.backup, editRow.data)) {\n return Promise.resolve();\n }\n const wrapper = this.ce('div', { ref: 'confirmationDialog' });\n const dialogContent = this.component.dialogTemplate || this.defaultDialogTemplate;\n wrapper.innerHTML = dialogContent;\n wrapper.refs = {};\n this.loadRefs.call(wrapper, wrapper, {\n dialogHeader: 'single',\n dialogCancelButton: 'single',\n dialogYesButton: 'single',\n });\n const dialog = this.createModal(wrapper);\n dialog.classList.add(`editgrid-row-modal-confirmation-${this.id}`);\n const close = (event) => {\n event.preventDefault();\n dialog.close();\n };\n let dialogResult;\n const promise = new Promise((resolve, reject) => {\n dialogResult = { resolve, reject };\n });\n this.addEventListener(wrapper.refs.dialogYesButton, 'click', (event) => {\n close(event);\n dialogResult.resolve();\n });\n this.addEventListener(wrapper.refs.dialogCancelButton, 'click', (event) => {\n close(event);\n dialogResult.reject();\n });\n editRow.confirmationDialog = dialog;\n return promise;\n }\n editRow(rowIndex) {\n const editRow = this.editRows[rowIndex];\n const isAlreadyEditing = editRow.state === EditRowState.Editing || editRow.state === EditRowState.New;\n if (!editRow || isAlreadyEditing) {\n return Promise.resolve();\n }\n editRow.prevState = editRow.state;\n editRow.state = this.options.readOnly ? EditRowState.Viewing : EditRowState.Editing;\n if (this.lazyLoad && (editRow.components.length === 0)) {\n editRow.components = this.createRowComponents(editRow.data, rowIndex);\n }\n const dataSnapshot = (0, utils_1.fastCloneDeep)(editRow.data);\n if (this.inlineEditMode) {\n editRow.backup = dataSnapshot;\n }\n else {\n editRow.backup = (0, utils_1.fastCloneDeep)(editRow.data);\n editRow.data = dataSnapshot;\n this.restoreRowContext(editRow);\n }\n if (this.component.modal) {\n return this.addRowModal(rowIndex);\n }\n return this.redraw();\n }\n clearErrors(rowIndex) {\n const editRow = this.editRows[rowIndex];\n if (editRow && Array.isArray(editRow.components)) {\n editRow.components.forEach((comp) => {\n comp.setPristine(true);\n comp.setCustomValidity('');\n });\n }\n }\n cancelRow(rowIndex) {\n if (this.options.readOnly) {\n return;\n }\n const editRow = this.editRows[rowIndex];\n switch (editRow.state) {\n case EditRowState.New: {\n editRow.state = EditRowState.Removed;\n this.clearErrors(rowIndex);\n this.destroyComponents(false, rowIndex);\n if (this.inlineEditMode) {\n this.splice(rowIndex);\n }\n this.editRows.splice(rowIndex, 1);\n this.openWhenEmpty();\n break;\n }\n case EditRowState.Editing: {\n editRow.state = editRow.prevState;\n if (this.inlineEditMode) {\n this.dataValue[rowIndex] = editRow.backup;\n }\n editRow.data = editRow.backup;\n editRow.backup = null;\n this.restoreRowContext(editRow);\n this.clearErrors(rowIndex);\n break;\n }\n }\n this.emit('editGridCancelRow', {\n instance: this,\n component: this.component,\n editRow,\n });\n this.checkValidity(null, true);\n this.redraw();\n if (this.component.rowDrafts) {\n this.checkValidity(this.data, false);\n }\n }\n saveRow(rowIndex, modified) {\n var _a, _b;\n const editRow = this.editRows[rowIndex];\n if (this.options.readOnly) {\n return;\n }\n // After an attempt to save, all the components inside the row should become not pristine\n if (!this.component.rowDrafts) {\n editRow.components.forEach((comp) => comp.setPristine(false));\n }\n const errors = this.validateRow(editRow, true);\n if (!this.component.rowDrafts) {\n if (errors.length) {\n return false;\n }\n }\n if (this.saveEditMode) {\n const dataValue = this.dataValue;\n if ((_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.focusedComponent) === null || _b === void 0 ? void 0 : _b.component.typeChangeEnabled) {\n this.root.focusedComponent = null;\n }\n switch (editRow.state) {\n case EditRowState.New: {\n const newIndex = dataValue.length;\n dataValue.push(editRow.data);\n editRow.components.forEach(component => component.rowIndex = newIndex);\n if (rowIndex !== newIndex) {\n this.editRows.splice(rowIndex, 1);\n this.editRows.splice(newIndex, 0, editRow);\n }\n break;\n }\n case EditRowState.Editing: {\n dataValue[rowIndex] = editRow.data;\n break;\n }\n }\n }\n editRow.state = this.component.rowDrafts && errors.length ? EditRowState.Draft : EditRowState.Saved;\n editRow.backup = null;\n this.updateValue();\n this.emit('editGridSaveRow', {\n component: this.component,\n row: editRow.data,\n instance: this\n });\n this.triggerChange({ modified, noPristineChangeOnModified: modified && this.component.rowDrafts, isolateRow: true });\n if (this.component.rowDrafts) {\n editRow.components.forEach(comp => comp.setPristine(this.pristine));\n }\n this.checkValidity(null, true);\n this.redraw();\n if (editRow.alerts) {\n editRow.alerts = false;\n }\n return true;\n }\n beforeFocus(component) {\n if ('beforeFocus' in this.parent) {\n this.parent.beforeFocus(this);\n }\n const relativePath = this.getRelativePath(component.path);\n const arrayPath = (0, utils_1.getArrayFromComponentPath)(relativePath);\n const rowIndex = arrayPath[0];\n let rowToEditIndex = arrayPath[0];\n this.editRows.forEach((row, indexInArray) => {\n if (row.rowIndex === rowIndex) {\n rowToEditIndex = indexInArray;\n }\n });\n if (lodash_1.default.isNumber(rowToEditIndex)) {\n this.editRow(rowToEditIndex);\n }\n }\n updateComponentsRowIndex(components, rowIndex) {\n components.forEach((component, colIndex) => {\n component.rowIndex = rowIndex;\n component.row = `${rowIndex}-${colIndex}`;\n });\n }\n updateRowsComponents(rowIndex) {\n this.editRows.slice(rowIndex).forEach((row, index) => {\n this.updateComponentsRowIndex(row.components, rowIndex + index);\n });\n }\n baseRemoveRow(rowIndex) {\n const editRow = this.editRows[rowIndex];\n editRow.state = EditRowState.Removed;\n this.destroyComponents(false, rowIndex);\n return editRow;\n }\n removeRow(rowIndex, modified) {\n if (this.options.readOnly) {\n return;\n }\n this.clearErrors(rowIndex);\n this.baseRemoveRow(rowIndex);\n this.splice(rowIndex);\n this.emit('editGridDeleteRow', {\n index: rowIndex\n });\n this.editRows.splice(rowIndex, 1);\n this.openWhenEmpty();\n this.updateRowsComponents(rowIndex);\n this.updateValue();\n this.triggerChange({ modified, noPristineChangeOnModified: modified && this.component.rowDrafts, isolateRow: true });\n this.checkValidity(null, true);\n this.checkData();\n this.redraw();\n }\n createRowComponents(row, rowIndex, recreatePartially) {\n // Iterate through existing components and destroy the ones with the same rowIndex.\n if (this.components) {\n for (let i = 0; i < this.components.length; i++) {\n if (this.components[i].rowIndex === rowIndex) {\n this.components[i].destroy();\n this.components.splice(i, 1);\n }\n }\n }\n const currentRowComponents = lodash_1.default.get(this.editRows, `[${rowIndex}].components`, null);\n return this.component.components.map((col, colIndex) => {\n var _a;\n if (recreatePartially && currentRowComponents && this.variableTypeComponentsIndexes.length) {\n const currentComp = currentRowComponents[colIndex];\n const shouldRecreate = lodash_1.default.includes(this.variableTypeComponentsIndexes, colIndex) && (currentComp === null || currentComp === void 0 ? void 0 : currentComp.type) !== ((_a = currentComp === null || currentComp === void 0 ? void 0 : currentComp.component) === null || _a === void 0 ? void 0 : _a.type);\n if (!shouldRecreate) {\n return currentComp;\n }\n col = currentComp.component;\n }\n const column = lodash_1.default.clone(col);\n const options = lodash_1.default.clone(this.options);\n options.name += `[${rowIndex}]`;\n options.row = `${rowIndex}-${colIndex}`;\n options.onChange = (flags = {}, changed, modified) => {\n var _a, _b;\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 if (!this.component.modal) {\n this.triggerRootChange(flags, changed, modified);\n }\n if (this.inlineEditMode) {\n return;\n }\n const editRow = this.editRows[rowIndex];\n if (editRow) {\n this.processRow('checkData', null, Object.assign(Object.assign({}, flags), { changed }), editRow.data, editRow.components);\n this.validateRow(editRow, false);\n }\n if (this.variableTypeComponentsIndexes.length) {\n this.checkRowVariableTypeComponents(editRow, rowIndex);\n this.redraw();\n }\n };\n const comp = this.createComponent(lodash_1.default.assign({}, column, { row: options.row }), options, row, null, recreatePartially && currentRowComponents ? currentRowComponents[colIndex] : null);\n comp.rowIndex = rowIndex;\n comp.inEditGrid = true;\n return comp;\n });\n }\n hasOpenRows() {\n return this.editRows.some(row => this.isOpen(row));\n }\n getAttachedData(data = null) {\n const ourData = (0, utils_1.fastCloneDeep)(data || this._data || this.rootValue);\n lodash_1.default.set(ourData, this.key, this.editRows.map((row) => row.data));\n return ourData;\n }\n shouldValidateDraft(editRow) {\n var _a, _b;\n // Draft rows should be validated only when there was an attempt to submit a form\n return (editRow.state === EditRowState.Draft &&\n !this.pristine &&\n !((_a = this.root) === null || _a === void 0 ? void 0 : _a.pristine) &&\n !this.hasOpenRows()) ||\n ((_b = this.root) === null || _b === void 0 ? void 0 : _b.submitted);\n }\n shouldValidateRow(editRow, dirty) {\n return this.shouldValidateDraft(editRow) ||\n editRow.state === EditRowState.New ||\n editRow.state === EditRowState.Editing ||\n editRow.alerts ||\n dirty;\n }\n validateRow(editRow, dirty, forceSilentCheck) {\n var _a;\n editRow.errors = [];\n if (this.shouldValidateRow(editRow, dirty)) {\n const silentCheck = (this.component.rowDrafts && !this.shouldValidateDraft(editRow)) || forceSilentCheck;\n const rootValue = (0, utils_1.fastCloneDeep)(this.rootValue);\n const editGridValue = lodash_1.default.get(rootValue, this.path, []);\n editGridValue[editRow.rowIndex] = editRow.data;\n lodash_1.default.set(rootValue, this.path, editGridValue);\n const validationProcessorProcess = (context) => this.validationProcessor(context, { dirty, silentCheck });\n editRow.errors = (0, process_1.processSync)({\n components: (0, utils_1.fastCloneDeep)(this.component.components).map((component) => {\n component.parentPath = `${this.path}[${editRow.rowIndex}]`;\n return component;\n }),\n data: rootValue,\n row: editRow.data,\n process: 'validateRow',\n instances: this.componentsMap,\n scope: { errors: [] },\n processors: [\n {\n process: validationProcessorProcess,\n processSync: validationProcessorProcess\n }\n ]\n }).errors;\n }\n // TODO: this is essentially running its own custom validation and should be moved into a validation rule\n if (this.component.validate && this.component.validate.row) {\n const valid = this.evaluate(this.component.validate.row, {\n valid: (editRow.length === 0),\n row: editRow.data\n }, 'valid', true);\n if (valid.toString() !== 'true') {\n editRow.errors.push({\n type: 'error',\n rowError: true,\n message: valid.toString()\n });\n }\n if (valid === null) {\n editRow.errors.push({\n type: 'error',\n message: `Invalid row validation for ${this.key}`\n });\n }\n }\n if (!this.component.rowDrafts || ((_a = this.root) === null || _a === void 0 ? void 0 : _a.submitted)) {\n this.showRowErrorAlerts(editRow, editRow.errors);\n }\n return editRow.errors;\n }\n showRowErrorAlerts(editRow, errors) {\n if (editRow.alerts) {\n if (this.alert) {\n if (errors.length) {\n this.alert.showErrors(errors, false);\n editRow.alerts = true;\n }\n else {\n this.alert.clear();\n this.alert = null;\n }\n }\n }\n }\n /**\n * @returns {boolean} - Return that this component processes its own validation.\n */\n get processOwnValidation() {\n return true;\n }\n checkComponentValidity(data, dirty, row, options = {}, errors = []) {\n var _a, _b;\n const { silentCheck } = options;\n const superValid = super.checkComponentValidity(data, dirty, row, options, errors);\n // If super tells us that component invalid and there is no need to update alerts, just return false\n if (!superValid && (!this.alert && !this.hasOpenRows())) {\n return false;\n }\n let rowsEditing = false;\n const allRowErrors = [];\n this.editRows.forEach((editRow, index) => {\n // Trigger all errors on the row.\n const rowErrors = this.validateRow(editRow, dirty, silentCheck);\n errors.push(...rowErrors);\n allRowErrors.push(...rowErrors);\n if (this.rowRefs) {\n const rowContainer = this.rowRefs[index];\n if (rowContainer) {\n const errorContainer = rowContainer.querySelector('.editgrid-row-error');\n if (rowErrors.length && errorContainer && (!this.component.rowDrafts || this.shouldValidateDraft(editRow))) {\n const rowError = rowErrors.find(error => error.rowError);\n this.addClass(errorContainer, 'help-block');\n errorContainer.textContent = this.t(rowError ? rowError.message : this.errorMessage('invalidRowError'));\n }\n else if (errorContainer) {\n errorContainer.textContent = '';\n }\n }\n }\n // If this is a dirty check, and any rows are still editing, we need to throw validation error.\n rowsEditing |= (dirty && this.isOpen(editRow));\n });\n if (allRowErrors.length) {\n if (!silentCheck && (dirty || this.dirty) && (!this.component.rowDrafts || ((_a = this.root) === null || _a === void 0 ? void 0 : _a.submitted))) {\n this.setCustomValidity(this.t(this.errorMessage('invalidRowsError')), dirty);\n this.removeClass(this.element, 'has-error');\n }\n return false;\n }\n else if (rowsEditing && this.saveEditMode && !this.component.openWhenEmpty) {\n this._errors = this.setCustomValidity(this.t(this.errorMessage('unsavedRowsError')), dirty);\n errors.push(...this._errors);\n return false;\n }\n const message = this.invalid || this.invalidMessage(data, dirty, false, row);\n if (allRowErrors.length && ((_b = this.root) === null || _b === void 0 ? void 0 : _b.submitted) && !message) {\n this._errors = this.setCustomValidity(message, dirty);\n errors.push(...this._errors);\n this.root.showErrors([message]);\n }\n else {\n this._errors = this.setCustomValidity(message, dirty);\n errors.push(...this._errors);\n }\n return superValid;\n }\n setRowInvalid(ref, index) {\n const editRow = this.editRows[index];\n const errorContainer = ref.querySelector('.editgrid-row-error');\n if (errorContainer && (!this.component.rowDrafts || this.shouldValidateDraft(editRow))) {\n this.addClass(errorContainer, 'help-block');\n errorContainer.textContent = this.t(this.errorMessage('invalidRowError'));\n }\n else if (errorContainer) {\n errorContainer.textContent = '';\n }\n }\n changeState(changed, flags) {\n if (this.visible && (changed || (flags.resetValue && this.component.modalEdit))) {\n this.rebuild();\n }\n else {\n this.redraw();\n }\n }\n setValue(value, flags = {}) {\n if (!value) {\n value = this.defaultValue;\n }\n if (!Array.isArray(value)) {\n if (typeof value === 'object') {\n value = [value];\n }\n else {\n return false;\n }\n }\n const changed = this.hasChanged(value, this.dataValue);\n if (this.parent && !this.options.server) {\n this.parent.checkComponentConditions();\n }\n this.dataValue = value;\n // Refresh editRow data when data changes.\n this.dataValue.forEach((row, rowIndex) => {\n const editRow = this.editRows[rowIndex];\n if (editRow) {\n editRow.data = row;\n this.restoreRowContext(editRow, flags);\n editRow.state = EditRowState.Saved;\n editRow.backup = null;\n editRow.errors = [];\n }\n else {\n this.editRows[rowIndex] = {\n components: this.lazyLoad ? [] : this.createRowComponents(row, rowIndex),\n data: row,\n state: EditRowState.Saved,\n backup: null,\n errors: [],\n };\n }\n });\n let { length: dataLength } = this.dataValue;\n // If the last row is a new row, then do not remove it.\n if (this.editRows[dataLength] && (this.editRows[dataLength].state === EditRowState.New)) {\n dataLength = (dataLength + 1);\n }\n this.editRows.slice(dataLength).forEach((editRow, index) => this.baseRemoveRow(dataLength + index));\n this.editRows = this.editRows.slice(0, dataLength);\n this.openWhenEmpty();\n this.updateOnChange(flags, changed);\n // do not call checkData with server option, it is called when change is triggered in updateOnChange\n if (!this.options.server) {\n this.checkData();\n }\n this.changeState(changed, flags);\n return changed;\n }\n openWhenEmpty() {\n const shouldBeOpened = !this.dataValue.length && this.component.openWhenEmpty;\n const hasNoRows = !this.editRows.length;\n if (hasNoRows && shouldBeOpened && !this.builderMode) {\n const dataObj = {};\n this.createRow(dataObj, 0);\n }\n }\n restoreRowContext(editRow, flags = {}) {\n editRow.components.forEach((component) => {\n component.data = editRow.data;\n this.setNestedValue(component, editRow.data, flags);\n });\n }\n emptyRows() {\n this.editRows.forEach((editRow, index) => this.destroyComponents(false, index));\n this.editRows = [];\n }\n resetValue() {\n super.resetValue();\n this.emptyRows();\n }\n}\nexports[\"default\"] = EditGridComponent;\nEditGridComponent.prototype.hasChanged = Component_1.default.prototype.hasChanged;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/editgrid/EditGrid.js?");
|
5197
5197
|
|
5198
5198
|
/***/ }),
|
5199
5199
|
|
@@ -5226,7 +5226,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
|
|
5226
5226
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
5227
5227
|
|
5228
5228
|
"use strict";
|
5229
|
-
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 }));\nconst Field_1 = __importDefault(__webpack_require__(/*! ../_classes/field/Field */ \"./lib/cjs/components/_classes/field/Field.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst downloadjs_1 = __importDefault(__webpack_require__(/*! downloadjs */ \"./node_modules/downloadjs/download.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst fileProcessor_1 = __importDefault(__webpack_require__(/*! ../../providers/processor/fileProcessor */ \"./lib/cjs/providers/processor/fileProcessor.js\"));\nconst browser_md5_file_1 = __importDefault(__webpack_require__(/*! browser-md5-file */ \"./node_modules/browser-md5-file/dist/index.umd.js\"));\nlet Camera;\nlet webViewCamera = 'undefined' !== typeof window ? navigator.camera : Camera;\n// canvas.toBlob polyfill.\nlet htmlCanvasElement;\nif (typeof window !== 'undefined') {\n htmlCanvasElement = window.HTMLCanvasElement;\n}\nelse if (typeof __webpack_require__.g !== 'undefined') {\n htmlCanvasElement = __webpack_require__.g.HTMLCanvasElement;\n}\nif (htmlCanvasElement && !htmlCanvasElement.prototype.toBlob) {\n Object.defineProperty(HTMLCanvasElement.prototype, 'toBlob', {\n value: function (callback, type, quality) {\n var canvas = this;\n setTimeout(function () {\n var binStr = atob(canvas.toDataURL(type, quality).split(',')[1]), len = binStr.length, arr = new Uint8Array(len);\n for (var i = 0; i < len; i++) {\n arr[i] = binStr.charCodeAt(i);\n }\n callback(new Blob([arr], { type: type || 'image/png' }));\n });\n }\n });\n}\nconst createRandomString = () => Math.random().toString(36).substring(2, 15);\nclass FileComponent extends Field_1.default {\n static schema(...extend) {\n return Field_1.default.schema({\n type: 'file',\n label: 'Upload',\n key: 'file',\n image: false,\n privateDownload: false,\n imageSize: '200',\n filePattern: '*',\n fileMinSize: '0KB',\n fileMaxSize: '1GB',\n uploadOnly: false,\n }, ...extend);\n }\n static get builderInfo() {\n return {\n title: 'File',\n group: 'premium',\n icon: 'file',\n documentation: '/userguide/form-building/premium-components#file',\n weight: 100,\n schema: FileComponent.schema(),\n };\n }\n static get serverConditionSettings() {\n return FileComponent.conditionOperatorsSettings;\n }\n static get conditionOperatorsSettings() {\n return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: ['isEmpty', 'isNotEmpty'] });\n }\n static savedValueTypes(schema) {\n schema = schema || {};\n return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes.object];\n }\n init() {\n super.init();\n webViewCamera = navigator.camera || Camera;\n const fileReaderSupported = (typeof FileReader !== 'undefined');\n const formDataSupported = typeof window !== 'undefined' ? Boolean(window.FormData) : false;\n const progressSupported = (typeof window !== 'undefined' && window.XMLHttpRequest) ? ('upload' in new XMLHttpRequest) : false;\n this.support = {\n filereader: fileReaderSupported,\n formdata: formDataSupported,\n hasWarning: !fileReaderSupported || !formDataSupported || !progressSupported,\n progress: progressSupported,\n };\n this.cameraMode = false;\n this.fileDropHidden = false;\n this.filesToSync = {\n filesToUpload: [],\n filesToDelete: [],\n };\n this.isSyncing = false;\n this.abortUploads = [];\n }\n get dataReady() {\n return this.filesReady || Promise.resolve();\n }\n get defaultSchema() {\n return FileComponent.schema();\n }\n loadImage(fileInfo) {\n if (this.component.privateDownload) {\n fileInfo.private = true;\n }\n return this.fileService.downloadFile(fileInfo).then((result) => result.url);\n }\n get emptyValue() {\n return [];\n }\n getValueAsString(value) {\n if (lodash_1.default.isArray(value)) {\n return lodash_1.default.map(value, 'originalName').join(', ');\n }\n return lodash_1.default.get(value, 'originalName', '');\n }\n getValue() {\n return this.dataValue;\n }\n get defaultValue() {\n const value = super.defaultValue;\n return Array.isArray(value) ? value : [];\n }\n get hasTypes() {\n return this.component.fileTypes &&\n Array.isArray(this.component.fileTypes) &&\n this.component.fileTypes.length !== 0 &&\n (this.component.fileTypes[0].label !== '' || this.component.fileTypes[0].value !== '');\n }\n get fileDropHidden() {\n return this._fileBrowseHidden;\n }\n set fileDropHidden(value) {\n if (typeof value !== 'boolean' || this.component.multiple) {\n return;\n }\n this._fileBrowseHidden = value;\n }\n get shouldSyncFiles() {\n return Boolean(this.filesToSync.filesToDelete.length || this.filesToSync.filesToUpload.length);\n }\n get autoSync() {\n return lodash_1.default.get(this, 'component.autoSync', false);\n }\n get columnsSize() {\n const actionsColumn = this.disabled ? 0 : this.autoSync ? 2 : 1;\n const typeColumn = this.hasTypes ? 2 : 0;\n const sizeColumn = 2;\n const nameColumn = 12 - actionsColumn - typeColumn - sizeColumn;\n return {\n name: nameColumn,\n size: sizeColumn,\n type: typeColumn,\n actions: actionsColumn,\n };\n }\n render() {\n const { filesToDelete, filesToUpload } = this.filesToSync;\n return super.render(this.renderTemplate('file', {\n fileSize: this.fileSize,\n files: this.dataValue || [],\n filesToDelete,\n filesToUpload,\n disabled: this.disabled,\n support: this.support,\n fileDropHidden: this.fileDropHidden,\n showSyncButton: this.autoSync && (filesToDelete.length || filesToUpload.length),\n isSyncing: this.isSyncing,\n columns: this.columnsSize,\n }));\n }\n getVideoStream(constraints) {\n return navigator.mediaDevices.getUserMedia({\n video: Object.assign({ width: { min: 640, ideal: 1920 }, height: { min: 360, ideal: 1080 }, aspectRatio: { ideal: 16 / 9 } }, constraints),\n audio: false,\n });\n }\n stopVideoStream(videoStream) {\n videoStream.getVideoTracks().forEach((track) => track.stop());\n }\n getFrame(videoPlayer) {\n return new Promise((resolve) => {\n const canvas = document.createElement('canvas');\n canvas.height = videoPlayer.videoHeight;\n canvas.width = videoPlayer.videoWidth;\n const context = canvas.getContext('2d');\n context.drawImage(videoPlayer, 0, 0);\n canvas.toBlob(resolve);\n });\n }\n startVideo() {\n this.getVideoStream()\n .then((stream) => {\n this.videoStream = stream;\n const { videoPlayer } = this.refs;\n if (!videoPlayer) {\n console.warn('Video player not found in template.');\n this.cameraMode = false;\n this.redraw();\n return;\n }\n videoPlayer.srcObject = stream;\n const width = parseInt(this.component.webcamSize) || 320;\n videoPlayer.setAttribute('width', width);\n videoPlayer.play();\n })\n .catch((err) => {\n console.error(err);\n this.cameraMode = false;\n this.redraw();\n });\n }\n stopVideo() {\n if (this.videoStream) {\n this.stopVideoStream(this.videoStream);\n this.videoStream = null;\n }\n }\n takePicture() {\n const { videoPlayer } = this.refs;\n if (!videoPlayer) {\n console.warn('Video player not found in template.');\n this.cameraMode = false;\n this.redraw();\n return;\n }\n this.getFrame(videoPlayer)\n .then((frame) => {\n frame.name = `photo-${Date.now()}.png`;\n this.handleFilesToUpload([frame]);\n this.cameraMode = false;\n this.redraw();\n });\n }\n browseFiles(attrs = {}) {\n return new Promise((resolve) => {\n const fileInput = this.ce('input', Object.assign({ type: 'file', style: 'height: 0; width: 0; visibility: hidden;', tabindex: '-1' }, attrs));\n document.body.appendChild(fileInput);\n fileInput.addEventListener('change', () => {\n resolve(fileInput.files);\n document.body.removeChild(fileInput);\n }, true);\n // There is no direct way to trigger a file dialog. To work around this, create an input of type file and trigger\n // a click event on it.\n if (typeof fileInput.trigger === 'function') {\n fileInput.trigger('click');\n }\n else {\n fileInput.click();\n }\n });\n }\n set cameraMode(value) {\n this._cameraMode = value;\n if (value) {\n this.startVideo();\n }\n else {\n this.stopVideo();\n }\n }\n get cameraMode() {\n return this._cameraMode;\n }\n get useWebViewCamera() {\n return this.imageUpload && webViewCamera;\n }\n get imageUpload() {\n return Boolean(this.component.image);\n }\n get browseOptions() {\n const options = {};\n if (this.component.multiple) {\n options.multiple = true;\n }\n if (this.component.capture) {\n options.capture = this.component.capture;\n }\n //use \"accept\" attribute only for desktop devices because of its limited support by mobile browsers\n const filePattern = this.component.filePattern.trim() || '';\n if (!this.isMobile.any) {\n const imagesPattern = 'image/*';\n if (this.imageUpload && (!filePattern || filePattern === '*')) {\n options.accept = imagesPattern;\n }\n else if (this.imageUpload && !filePattern.includes(imagesPattern)) {\n options.accept = `${imagesPattern},${filePattern}`;\n }\n else {\n options.accept = filePattern;\n }\n }\n // if input capture is set, we need the \"accept\" attribute to determine which device to launch\n else if (this.component.capture) {\n if (filePattern.includes('video')) {\n options.accept = 'video/*';\n }\n else if (filePattern.includes('audio')) {\n options.accept = 'audio/*';\n }\n else {\n options.accept = 'image/*';\n }\n }\n return options;\n }\n get actions() {\n return {\n abort: this.abortRequest.bind(this),\n };\n }\n attach(element) {\n this.loadRefs(element, {\n fileDrop: 'single',\n fileBrowse: 'single',\n galleryButton: 'single',\n cameraButton: 'single',\n takePictureButton: 'single',\n toggleCameraMode: 'single',\n videoPlayer: 'single',\n fileLink: 'multiple',\n removeLink: 'multiple',\n fileToSyncRemove: 'multiple',\n fileImage: 'multiple',\n fileType: 'multiple',\n fileProcessingLoader: 'single',\n syncNow: 'single',\n restoreFile: 'multiple',\n progress: 'multiple',\n });\n // Ensure we have an empty input refs. We need this for the setValue method to redraw the control when it is set.\n this.refs.input = [];\n const superAttach = super.attach(element);\n if (this.refs.fileDrop) {\n // if (!this.statuses.length) {\n // this.refs.fileDrop.removeAttribute('hidden');\n // }\n const _this = this;\n this.addEventListener(this.refs.fileDrop, 'dragover', function (event) {\n this.className = 'fileSelector fileDragOver';\n event.preventDefault();\n });\n this.addEventListener(this.refs.fileDrop, 'dragleave', function (event) {\n this.className = 'fileSelector';\n event.preventDefault();\n });\n this.addEventListener(this.refs.fileDrop, 'drop', function (event) {\n this.className = 'fileSelector';\n event.preventDefault();\n _this.handleFilesToUpload(event.dataTransfer.files);\n });\n }\n this.addEventListener(element, 'click', (event) => {\n this.handleAction(event);\n });\n if (this.refs.fileBrowse) {\n this.addEventListener(this.refs.fileBrowse, 'click', (event) => {\n event.preventDefault();\n this.browseFiles(this.browseOptions)\n .then((files) => {\n this.handleFilesToUpload(files);\n });\n });\n }\n this.refs.fileLink.forEach((fileLink, index) => {\n this.addEventListener(fileLink, 'click', (event) => {\n event.preventDefault();\n this.getFile(this.dataValue[index]);\n });\n });\n this.refs.removeLink.forEach((removeLink, index) => {\n this.addEventListener(removeLink, 'click', (event) => {\n event.preventDefault();\n const fileInfo = this.dataValue[index];\n this.handleFileToRemove(fileInfo);\n });\n });\n this.refs.fileToSyncRemove.forEach((fileToSyncRemove, index) => {\n this.addEventListener(fileToSyncRemove, 'click', (event) => {\n event.preventDefault();\n this.filesToSync.filesToUpload.splice(index, 1);\n this.redraw();\n });\n });\n this.refs.restoreFile.forEach((fileToRestore, index) => {\n this.addEventListener(fileToRestore, 'click', (event) => {\n event.preventDefault();\n const fileInfo = this.filesToSync.filesToDelete[index];\n delete fileInfo.status;\n delete fileInfo.message;\n this.filesToSync.filesToDelete.splice(index, 1);\n this.dataValue.push(fileInfo);\n this.triggerChange();\n this.redraw();\n });\n });\n if (this.refs.galleryButton && webViewCamera) {\n this.addEventListener(this.refs.galleryButton, 'click', (event) => {\n event.preventDefault();\n webViewCamera.getPicture((success) => {\n window.resolveLocalFileSystemURL(success, (fileEntry) => {\n fileEntry.file((file) => {\n const reader = new FileReader();\n reader.onloadend = (evt) => {\n const blob = new Blob([new Uint8Array(evt.target.result)], { type: file.type });\n blob.name = file.name;\n this.handleFilesToUpload([blob]);\n };\n reader.readAsArrayBuffer(file);\n });\n });\n }, (err) => {\n console.error(err);\n }, {\n sourceType: webViewCamera.PictureSourceType.PHOTOLIBRARY,\n });\n });\n }\n if (this.refs.cameraButton && webViewCamera) {\n this.addEventListener(this.refs.cameraButton, 'click', (event) => {\n event.preventDefault();\n webViewCamera.getPicture((success) => {\n window.resolveLocalFileSystemURL(success, (fileEntry) => {\n fileEntry.file((file) => {\n const reader = new FileReader();\n reader.onloadend = (evt) => {\n const blob = new Blob([new Uint8Array(evt.target.result)], { type: file.type });\n blob.name = file.name;\n this.handleFilesToUpload([blob]);\n };\n reader.readAsArrayBuffer(file);\n });\n });\n }, (err) => {\n console.error(err);\n }, {\n sourceType: webViewCamera.PictureSourceType.CAMERA,\n encodingType: webViewCamera.EncodingType.PNG,\n mediaType: webViewCamera.MediaType.PICTURE,\n saveToPhotoAlbum: true,\n correctOrientation: false,\n });\n });\n }\n if (this.refs.takePictureButton) {\n this.addEventListener(this.refs.takePictureButton, 'click', (event) => {\n event.preventDefault();\n this.takePicture();\n });\n }\n if (this.refs.toggleCameraMode) {\n this.addEventListener(this.refs.toggleCameraMode, 'click', (event) => {\n event.preventDefault();\n this.cameraMode = !this.cameraMode;\n this.redraw();\n });\n }\n this.refs.fileType.forEach((fileType, index) => {\n if (!this.dataValue[index]) {\n return;\n }\n this.dataValue[index].fileType = this.dataValue[index].fileType || this.component.fileTypes[0].label;\n this.addEventListener(fileType, 'change', (event) => {\n event.preventDefault();\n const fileType = this.component.fileTypes.find((typeObj) => typeObj.value === event.target.value);\n this.dataValue[index].fileType = fileType.label;\n });\n });\n this.addEventListener(this.refs.syncNow, 'click', (event) => {\n event.preventDefault();\n this.syncFiles();\n });\n const fileService = this.fileService;\n if (fileService) {\n const loadingImages = [];\n this.filesReady = new Promise((resolve, reject) => {\n this.filesReadyResolve = resolve;\n this.filesReadyReject = reject;\n });\n this.refs.fileImage.forEach((image, index) => {\n loadingImages.push(this.loadImage(this.dataValue[index]).then((url) => (image.src = url)));\n });\n if (loadingImages.length) {\n Promise.all(loadingImages).then(() => {\n this.filesReadyResolve();\n }).catch(() => this.filesReadyReject());\n }\n else {\n this.filesReadyResolve();\n }\n }\n return superAttach;\n }\n /* eslint-disable max-len */\n fileSize(a, b, c, d, e) {\n return `${(b = Math, c = b.log, d = 1024, e = c(a) / c(d) | 0, a / b.pow(d, e)).toFixed(2)} ${e ? `${'kMGTPEZY'[--e]}B` : 'Bytes'}`;\n }\n /* eslint-enable max-len */\n /* eslint-disable max-depth */\n globStringToRegex(str) {\n str = str.replace(/\\s/g, '');\n let regexp = '', excludes = [];\n if (str.length > 2 && str[0] === '/' && str[str.length - 1] === '/') {\n regexp = str.substring(1, str.length - 1);\n }\n else {\n const split = str.split(',');\n if (split.length > 1) {\n for (let i = 0; i < split.length; i++) {\n const r = this.globStringToRegex(split[i]);\n if (r.regexp) {\n regexp += `(${r.regexp})`;\n if (i < split.length - 1) {\n regexp += '|';\n }\n }\n else {\n excludes = excludes.concat(r.excludes);\n }\n }\n }\n else {\n if (str.startsWith('!')) {\n excludes.push(`^((?!${this.globStringToRegex(str.substring(1)).regexp}).)*$`);\n }\n else {\n if (str.startsWith('.')) {\n str = `*${str}`;\n }\n regexp = `^${str.replace(new RegExp('[.\\\\\\\\+*?\\\\[\\\\^\\\\]$(){}=!<>|:\\\\-]', 'g'), '\\\\$&')}$`;\n regexp = regexp.replace(/\\\\\\*/g, '.*').replace(/\\\\\\?/g, '.');\n }\n }\n }\n return { regexp, excludes };\n }\n /* eslint-enable max-depth */\n translateScalars(str) {\n if (typeof str === 'string') {\n if (str.search(/kb/i) === str.length - 2) {\n return parseFloat(str.substring(0, str.length - 2) * 1024);\n }\n if (str.search(/mb/i) === str.length - 2) {\n return parseFloat(str.substring(0, str.length - 2) * 1024 * 1024);\n }\n if (str.search(/gb/i) === str.length - 2) {\n return parseFloat(str.substring(0, str.length - 2) * 1024 * 1024 * 1024);\n }\n if (str.search(/b/i) === str.length - 1) {\n return parseFloat(str.substring(0, str.length - 1));\n }\n if (str.search(/s/i) === str.length - 1) {\n return parseFloat(str.substring(0, str.length - 1));\n }\n if (str.search(/m/i) === str.length - 1) {\n return parseFloat(str.substring(0, str.length - 1) * 60);\n }\n if (str.search(/h/i) === str.length - 1) {\n return parseFloat(str.substring(0, str.length - 1) * 3600);\n }\n }\n return str;\n }\n validatePattern(file, val) {\n if (!val) {\n return true;\n }\n const pattern = this.globStringToRegex(val);\n let valid = true;\n if (pattern.regexp && pattern.regexp.length) {\n const regexp = new RegExp(pattern.regexp, 'i');\n valid = (!lodash_1.default.isNil(file.type) && regexp.test(file.type)) ||\n (!lodash_1.default.isNil(file.name) && regexp.test(file.name));\n }\n valid = pattern.excludes.reduce((result, excludePattern) => {\n const exclude = new RegExp(excludePattern, 'i');\n return result && (lodash_1.default.isNil(file.type) || exclude.test(file.type)) &&\n (lodash_1.default.isNil(file.name) || exclude.test(file.name));\n }, valid);\n return valid;\n }\n validateMinSize(file, val) {\n return file.size + 0.1 >= this.translateScalars(val);\n }\n validateMaxSize(file, val) {\n return file.size - 0.1 <= this.translateScalars(val);\n }\n abortRequest(id) {\n const abortUpload = this.abortUploads.find(abortUpload => abortUpload.id === id);\n if (abortUpload) {\n abortUpload.abort();\n }\n }\n handleAction(event) {\n const target = event.target;\n if (!target.id) {\n return;\n }\n const [action, id] = target.id.split('-');\n if (!action || !id || !this.actions[action]) {\n return;\n }\n this.actions[action](id);\n }\n getFileName(file) {\n return (0, utils_1.uniqueName)(file.name, this.component.fileNameTemplate, this.evalContext());\n }\n getInitFileToSync(file) {\n const escapedFileName = file.name ? file.name.replaceAll('<', '<').replaceAll('>', '>') : file.name;\n return {\n id: createRandomString(),\n // Get a unique name for this file to keep file collisions from occurring.\n dir: this.interpolate(this.component.dir || ''),\n name: this.getFileName(file),\n originalName: escapedFileName,\n fileKey: this.component.fileKey || 'file',\n storage: this.component.storage,\n options: this.component.options,\n file,\n size: file.size,\n status: 'info',\n message: this.t('Processing file. Please wait...'),\n hash: '',\n };\n }\n handleSubmissionRevisions(file) {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.root.form.submissionRevisions !== 'true') {\n return '';\n }\n const bmf = new browser_md5_file_1.default();\n const hash = yield new Promise((resolve, reject) => {\n this.emit('fileUploadingStart');\n bmf.md5(file, (err, md5) => {\n if (err) {\n return reject(err);\n }\n return resolve(md5);\n });\n });\n this.emit('fileUploadingEnd');\n return hash;\n });\n }\n validateFileName(file) {\n // Check if file with the same name is being uploaded\n const fileWithSameNameUploading = this.filesToSync.filesToUpload\n .some(fileToSync => { var _a; return ((_a = fileToSync.file) === null || _a === void 0 ? void 0 : _a.name) === file.name; });\n const fileWithSameNameUploaded = lodash_1.default.some(this.dataValue, fileStatus => fileStatus.originalName === file.name);\n return fileWithSameNameUploaded || fileWithSameNameUploading\n ? {\n status: 'error',\n message: this.t(`File with the same name is already ${fileWithSameNameUploading ? 'being ' : ''}uploaded`),\n }\n : {};\n }\n validateFileSettings(file) {\n // Check file pattern\n if (this.component.filePattern && !this.validatePattern(file, this.component.filePattern)) {\n return {\n status: 'error',\n message: this.t('File is the wrong type; it must be {{ pattern }}', {\n pattern: this.component.filePattern,\n }),\n };\n }\n // Check file minimum size\n if (this.component.fileMinSize && !this.validateMinSize(file, this.component.fileMinSize)) {\n return {\n status: 'error',\n message: this.t('File is too small; it must be at least {{ size }}', {\n size: this.component.fileMinSize,\n }),\n };\n }\n // Check file maximum size\n if (this.component.fileMaxSize && !this.validateMaxSize(file, this.component.fileMaxSize)) {\n return {\n status: 'error',\n message: this.t('File is too big; it must be at most {{ size }}', {\n size: this.component.fileMaxSize,\n }),\n };\n }\n return {};\n }\n validateFileService() {\n const { fileService } = this;\n return !fileService\n ? {\n status: 'error',\n message: this.t('File Service not provided.'),\n }\n : {};\n }\n validateFile(file) {\n const fileServiceValidation = this.validateFileService();\n if (fileServiceValidation.status === 'error') {\n return fileServiceValidation;\n }\n const fileNameValidation = this.validateFileName(file);\n if (fileNameValidation.status === 'error') {\n return fileNameValidation;\n }\n return this.validateFileSettings(file);\n }\n getGroupPermissions() {\n let groupKey = null;\n let groupPermissions = null;\n //Iterate through form components to find group resource if one exists\n this.root.everyComponent((element) => {\n var _a, _b;\n if (((_a = element.component) === null || _a === void 0 ? void 0 : _a.submissionAccess) || ((_b = element.component) === null || _b === void 0 ? void 0 : _b.defaultPermission)) {\n groupPermissions = !element.component.submissionAccess ? [\n {\n type: element.component.defaultPermission,\n roles: [],\n },\n ] : element.component.submissionAccess;\n groupPermissions.forEach((permission) => {\n groupKey = ['admin', 'write', 'create'].includes(permission.type) ? element.component.key : null;\n });\n }\n });\n return { groupKey, groupPermissions };\n }\n triggerFileProcessor(file) {\n return __awaiter(this, void 0, void 0, function* () {\n let processedFile = null;\n if (this.root.options.fileProcessor) {\n try {\n if (this.refs.fileProcessingLoader) {\n this.refs.fileProcessingLoader.style.display = 'block';\n }\n const fileProcessorHandler = (0, fileProcessor_1.default)(this.fileService, this.root.options.fileProcessor);\n processedFile = yield fileProcessorHandler(file, this.component.properties);\n }\n catch (err) {\n this.fileDropHidden = false;\n return {\n status: 'error',\n message: this.t('File processing has been failed.'),\n };\n }\n finally {\n if (this.refs.fileProcessingLoader) {\n this.refs.fileProcessingLoader.style.display = 'none';\n }\n }\n }\n return {\n file: processedFile,\n };\n });\n }\n prepareFileToUpload(file) {\n return __awaiter(this, void 0, void 0, function* () {\n const fileToSync = this.getInitFileToSync(file);\n fileToSync.hash = yield this.handleSubmissionRevisions(file);\n const { status, message } = this.validateFile(file);\n if (status === 'error') {\n fileToSync.isValidationError = true;\n fileToSync.status = status;\n fileToSync.message = message;\n return this.filesToSync.filesToUpload.push(fileToSync);\n }\n if (this.component.privateDownload) {\n file.private = true;\n }\n const { groupKey, groupPermissions } = this.getGroupPermissions();\n const processedFile = yield this.triggerFileProcessor(file);\n if (processedFile.status === 'error') {\n fileToSync.status === 'error';\n fileToSync.message = processedFile.message;\n return this.filesToSync.filesToUpload.push(fileToSync);\n }\n if (this.autoSync) {\n fileToSync.message = this.t('Ready to be uploaded into storage');\n }\n this.filesToSync.filesToUpload.push(Object.assign(Object.assign({}, fileToSync), { message: fileToSync.message, file: processedFile.file || file, url: this.interpolate(this.component.url, { file: fileToSync }), groupPermissions, groupResourceId: groupKey ? this.currentForm.submission.data[groupKey]._id : null }));\n });\n }\n prepareFilesToUpload(files) {\n return __awaiter(this, void 0, void 0, function* () {\n // Only allow one upload if not multiple.\n if (!this.component.multiple) {\n files = Array.prototype.slice.call(files, 0, 1);\n }\n if (this.component.storage && files && files.length) {\n this.fileDropHidden = true;\n return Promise.all([...files].map((file) => __awaiter(this, void 0, void 0, function* () {\n yield this.prepareFileToUpload(file);\n this.redraw();\n })));\n }\n else {\n return Promise.resolve();\n }\n });\n }\n handleFilesToUpload(files) {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.prepareFilesToUpload(files);\n if (!this.autoSync) {\n yield this.syncFiles();\n }\n });\n }\n prepareFileToDelete(fileInfo) {\n this.filesToSync.filesToDelete.push(Object.assign(Object.assign({}, fileInfo), { status: 'info', message: this.autoSync\n ? this.t('Ready to be removed from storage')\n : this.t('Preparing file to remove') }));\n const index = this.dataValue.findIndex(file => file.name === fileInfo.name);\n this.splice(index);\n this.redraw();\n }\n handleFileToRemove(fileInfo) {\n this.prepareFileToDelete(fileInfo);\n if (!this.autoSync) {\n this.syncFiles();\n }\n }\n deleteFile(fileInfo) {\n return __awaiter(this, void 0, void 0, function* () {\n const { options = {} } = this.component;\n if (fileInfo && (['url', 'indexeddb', 's3', 'azure', 'googledrive'].includes(this.component.storage))) {\n const { fileService } = this;\n if (fileService && typeof fileService.deleteFile === 'function') {\n return yield fileService.deleteFile(fileInfo, options);\n }\n else {\n const formio = this.options.formio || (this.root && this.root.formio);\n if (formio) {\n return yield formio.makeRequest('', fileInfo.url, 'delete');\n }\n }\n }\n });\n }\n delete() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.filesToSync.filesToDelete.length) {\n return Promise.resolve();\n }\n return yield Promise.all(this.filesToSync.filesToDelete.map((fileToSync) => __awaiter(this, void 0, void 0, function* () {\n try {\n if (fileToSync.isValidationError) {\n return { fileToSync };\n }\n yield this.deleteFile(fileToSync);\n fileToSync.status = 'success';\n fileToSync.message = this.t('Succefully removed');\n }\n catch (response) {\n fileToSync.status = 'error';\n fileToSync.message = typeof response === 'string' ? response : response.toString();\n }\n finally {\n this.redraw();\n }\n return { fileToSync };\n })));\n });\n }\n updateProgress(fileInfo, progressEvent) {\n fileInfo.progress = parseInt(100.0 * progressEvent.loaded / progressEvent.total);\n if (fileInfo.status !== 'progress') {\n fileInfo.status = 'progress';\n delete fileInfo.message;\n this.redraw();\n }\n else {\n const progress = Array.prototype.find.call(this.refs.progress, progressElement => progressElement.id === fileInfo.id);\n progress.innerHTML = `<span class=\"visually-hidden\">${fileInfo.progress}% ${this.t('Complete')}</span>`;\n progress.style.width = `${fileInfo.progress}%`;\n progress.ariaValueNow = fileInfo.progress.toString();\n }\n }\n getMultipartOptions(fileToSync) {\n let count = 0;\n return this.component.useMultipartUpload && this.component.multipart ? Object.assign(Object.assign({}, this.component.multipart), { progressCallback: (total) => {\n count++;\n fileToSync.status = 'progress';\n fileToSync.progress = parseInt(100 * count / total);\n delete fileToSync.message;\n this.redraw();\n }, changeMessage: (message) => {\n fileToSync.message = message;\n this.redraw();\n } }) : false;\n }\n uploadFile(fileToSync) {\n return __awaiter(this, void 0, void 0, function* () {\n return yield this.fileService.uploadFile(fileToSync.storage, fileToSync.file, fileToSync.name, fileToSync.dir, \n // Progress callback\n this.updateProgress.bind(this, fileToSync), fileToSync.url, fileToSync.options, fileToSync.fileKey, fileToSync.groupPermissions, fileToSync.groupResourceId, () => { }, \n // Abort upload callback\n (abort) => this.abortUploads.push({\n id: fileToSync.id,\n abort,\n }), this.getMultipartOptions(fileToSync));\n });\n }\n upload() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.filesToSync.filesToUpload.length) {\n return Promise.resolve();\n }\n return yield Promise.all(this.filesToSync.filesToUpload.map((fileToSync) => __awaiter(this, void 0, void 0, function* () {\n let fileInfo = null;\n try {\n if (fileToSync.isValidationError) {\n return {\n fileToSync,\n fileInfo,\n };\n }\n fileInfo = yield this.uploadFile(fileToSync);\n fileToSync.status = 'success';\n fileToSync.message = this.t('Succefully uploaded');\n fileInfo.originalName = fileToSync.originalName;\n fileInfo.hash = fileToSync.hash;\n }\n catch (response) {\n fileToSync.status = 'error';\n delete fileToSync.progress;\n fileToSync.message = typeof response === 'string'\n ? response\n : response.type === 'abort'\n ? this.t('Request was aborted')\n : response.toString();\n }\n finally {\n delete fileToSync.progress;\n this.redraw();\n }\n return {\n fileToSync,\n fileInfo,\n };\n })));\n });\n }\n syncFiles() {\n return __awaiter(this, void 0, void 0, function* () {\n this.isSyncing = true;\n this.fileDropHidden = true;\n this.redraw();\n try {\n const [filesToDelete = [], filesToUpload = []] = yield Promise.all([this.delete(), this.upload()]);\n this.filesToSync.filesToDelete = filesToDelete\n .filter(file => { var _a; return ((_a = file.fileToSync) === null || _a === void 0 ? void 0 : _a.status) === 'error'; })\n .map(file => file.fileToSync);\n this.filesToSync.filesToUpload = filesToUpload\n .filter(file => { var _a; return ((_a = file.fileToSync) === null || _a === void 0 ? void 0 : _a.status) === 'error'; })\n .map(file => file.fileToSync);\n if (!this.hasValue()) {\n this.dataValue = [];\n }\n const data = filesToUpload\n .filter(file => { var _a; return ((_a = file.fileToSync) === null || _a === void 0 ? void 0 : _a.status) === 'success'; })\n .map(file => file.fileInfo);\n this.dataValue.push(...data);\n this.triggerChange();\n return Promise.resolve();\n }\n catch (err) {\n return Promise.reject();\n }\n finally {\n this.isSyncing = false;\n this.fileDropHidden = false;\n this.abortUploads = [];\n this.redraw();\n }\n });\n }\n getFile(fileInfo) {\n const { options = {} } = this.component;\n const { fileService } = this;\n if (!fileService) {\n return alert('File Service not provided');\n }\n if (this.component.privateDownload) {\n fileInfo.private = true;\n }\n fileService.downloadFile(fileInfo, options).then((file) => {\n if (file) {\n if (['base64', 'indexeddb'].includes(file.storage)) {\n (0, downloadjs_1.default)(file.url, file.originalName || file.name, file.type);\n }\n else {\n window.open(file.url, '_blank');\n }\n }\n })\n .catch((response) => {\n // Is alert the best way to do this?\n // User is expecting an immediate notification due to attempting to download a file.\n alert(response);\n });\n }\n focus() {\n if ('beforeFocus' in this.parent) {\n this.parent.beforeFocus(this);\n }\n if (this.refs.fileBrowse) {\n this.refs.fileBrowse.focus();\n }\n }\n beforeSubmit() {\n return __awaiter(this, void 0, void 0, function* () {\n try {\n if (!this.autoSync) {\n return Promise.resolve();\n }\n yield this.syncFiles();\n return this.shouldSyncFiles\n ? Promise.reject('Synchronization is failed')\n : Promise.resolve();\n }\n catch (error) {\n return Promise.reject(error.message);\n }\n });\n }\n destroy(all) {\n this.stopVideo();\n super.destroy(all);\n }\n}\nexports[\"default\"] = FileComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/file/File.js?");
|
5229
|
+
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 }));\nconst Field_1 = __importDefault(__webpack_require__(/*! ../_classes/field/Field */ \"./lib/cjs/components/_classes/field/Field.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst downloadjs_1 = __importDefault(__webpack_require__(/*! downloadjs */ \"./node_modules/downloadjs/download.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst fileProcessor_1 = __importDefault(__webpack_require__(/*! ../../providers/processor/fileProcessor */ \"./lib/cjs/providers/processor/fileProcessor.js\"));\nconst browser_md5_file_1 = __importDefault(__webpack_require__(/*! browser-md5-file */ \"./node_modules/browser-md5-file/dist/index.umd.js\"));\nlet Camera;\nlet webViewCamera = 'undefined' !== typeof window ? navigator.camera : Camera;\n// canvas.toBlob polyfill.\nlet htmlCanvasElement;\nif (typeof window !== 'undefined') {\n htmlCanvasElement = window.HTMLCanvasElement;\n}\nelse if (typeof __webpack_require__.g !== 'undefined') {\n htmlCanvasElement = __webpack_require__.g.HTMLCanvasElement;\n}\nif (htmlCanvasElement && !htmlCanvasElement.prototype.toBlob) {\n Object.defineProperty(HTMLCanvasElement.prototype, 'toBlob', {\n value: function (callback, type, quality) {\n var canvas = this;\n setTimeout(function () {\n var binStr = atob(canvas.toDataURL(type, quality).split(',')[1]), len = binStr.length, arr = new Uint8Array(len);\n for (var i = 0; i < len; i++) {\n arr[i] = binStr.charCodeAt(i);\n }\n callback(new Blob([arr], { type: type || 'image/png' }));\n });\n }\n });\n}\nconst createRandomString = () => Math.random().toString(36).substring(2, 15);\nclass FileComponent extends Field_1.default {\n static schema(...extend) {\n return Field_1.default.schema({\n type: 'file',\n label: 'Upload',\n key: 'file',\n image: false,\n privateDownload: false,\n imageSize: '200',\n filePattern: '*',\n fileMinSize: '0KB',\n fileMaxSize: '1GB',\n uploadOnly: false,\n }, ...extend);\n }\n static get builderInfo() {\n return {\n title: 'File',\n group: 'premium',\n icon: 'file',\n documentation: '/userguide/form-building/premium-components#file',\n weight: 100,\n schema: FileComponent.schema(),\n };\n }\n static get serverConditionSettings() {\n return FileComponent.conditionOperatorsSettings;\n }\n static get conditionOperatorsSettings() {\n return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: ['isEmpty', 'isNotEmpty'] });\n }\n static savedValueTypes(schema) {\n schema = schema || {};\n return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes.object];\n }\n init() {\n super.init();\n webViewCamera = navigator.camera || Camera;\n const fileReaderSupported = (typeof FileReader !== 'undefined');\n const formDataSupported = typeof window !== 'undefined' ? Boolean(window.FormData) : false;\n const progressSupported = (typeof window !== 'undefined' && window.XMLHttpRequest) ? ('upload' in new XMLHttpRequest) : false;\n this.support = {\n filereader: fileReaderSupported,\n formdata: formDataSupported,\n hasWarning: !fileReaderSupported || !formDataSupported || !progressSupported,\n progress: progressSupported,\n };\n this.cameraMode = false;\n this.fileDropHidden = false;\n this.filesToSync = {\n filesToUpload: [],\n filesToDelete: [],\n };\n this.isSyncing = false;\n this.abortUploads = [];\n }\n get dataReady() {\n return this.filesReady || Promise.resolve();\n }\n get defaultSchema() {\n return FileComponent.schema();\n }\n loadImage(fileInfo) {\n if (this.component.privateDownload) {\n fileInfo.private = true;\n }\n return this.fileService.downloadFile(fileInfo).then((result) => result.url);\n }\n get emptyValue() {\n return [];\n }\n getValueAsString(value) {\n if (lodash_1.default.isArray(value)) {\n return lodash_1.default.map(value, 'originalName').join(', ');\n }\n return lodash_1.default.get(value, 'originalName', '');\n }\n getValue() {\n return this.dataValue;\n }\n get defaultValue() {\n const value = super.defaultValue;\n return Array.isArray(value) ? value : [];\n }\n get hasTypes() {\n return this.component.fileTypes &&\n Array.isArray(this.component.fileTypes) &&\n this.component.fileTypes.length !== 0 &&\n (this.component.fileTypes[0].label !== '' || this.component.fileTypes[0].value !== '');\n }\n get fileDropHidden() {\n return this._fileBrowseHidden;\n }\n set fileDropHidden(value) {\n if (typeof value !== 'boolean' || this.component.multiple) {\n return;\n }\n this._fileBrowseHidden = value;\n }\n get shouldSyncFiles() {\n return Boolean(this.filesToSync.filesToDelete.length || this.filesToSync.filesToUpload.length);\n }\n get autoSync() {\n return lodash_1.default.get(this, 'component.autoSync', false);\n }\n get columnsSize() {\n const actionsColumn = this.disabled ? 0 : this.autoSync ? 2 : 1;\n const typeColumn = this.hasTypes ? 2 : 0;\n const sizeColumn = 2;\n const nameColumn = 12 - actionsColumn - typeColumn - sizeColumn;\n return {\n name: nameColumn,\n size: sizeColumn,\n type: typeColumn,\n actions: actionsColumn,\n };\n }\n render() {\n const { filesToDelete, filesToUpload } = this.filesToSync;\n return super.render(this.renderTemplate('file', {\n fileSize: this.fileSize,\n files: this.dataValue || [],\n filesToDelete,\n filesToUpload,\n disabled: this.disabled,\n support: this.support,\n fileDropHidden: this.fileDropHidden,\n showSyncButton: this.autoSync && (filesToDelete.length || filesToUpload.length),\n isSyncing: this.isSyncing,\n columns: this.columnsSize,\n }));\n }\n getVideoStream(constraints) {\n return navigator.mediaDevices.getUserMedia({\n video: Object.assign({ width: { min: 640, ideal: 1920 }, height: { min: 360, ideal: 1080 }, aspectRatio: { ideal: 16 / 9 } }, constraints),\n audio: false,\n });\n }\n stopVideoStream(videoStream) {\n videoStream.getVideoTracks().forEach((track) => track.stop());\n }\n getFrame(videoPlayer) {\n return new Promise((resolve) => {\n const canvas = document.createElement('canvas');\n canvas.height = videoPlayer.videoHeight;\n canvas.width = videoPlayer.videoWidth;\n const context = canvas.getContext('2d');\n context.drawImage(videoPlayer, 0, 0);\n canvas.toBlob(resolve);\n });\n }\n startVideo() {\n this.getVideoStream()\n .then((stream) => {\n this.videoStream = stream;\n const { videoPlayer } = this.refs;\n if (!videoPlayer) {\n console.warn('Video player not found in template.');\n this.cameraMode = false;\n this.redraw();\n return;\n }\n videoPlayer.srcObject = stream;\n const width = parseInt(this.component.webcamSize) || 320;\n videoPlayer.setAttribute('width', width);\n videoPlayer.play();\n })\n .catch((err) => {\n console.error(err);\n this.cameraMode = false;\n this.redraw();\n });\n }\n stopVideo() {\n if (this.videoStream) {\n this.stopVideoStream(this.videoStream);\n this.videoStream = null;\n }\n }\n takePicture() {\n const { videoPlayer } = this.refs;\n if (!videoPlayer) {\n console.warn('Video player not found in template.');\n this.cameraMode = false;\n this.redraw();\n return;\n }\n this.getFrame(videoPlayer)\n .then((frame) => {\n frame.name = `photo-${Date.now()}.png`;\n this.handleFilesToUpload([frame]);\n this.cameraMode = false;\n this.redraw();\n });\n }\n browseFiles(attrs = {}) {\n return new Promise((resolve) => {\n const fileInput = this.ce('input', Object.assign({ type: 'file', style: 'height: 0; width: 0; visibility: hidden;', tabindex: '-1' }, attrs));\n document.body.appendChild(fileInput);\n fileInput.addEventListener('change', () => {\n resolve(fileInput.files);\n document.body.removeChild(fileInput);\n }, true);\n // There is no direct way to trigger a file dialog. To work around this, create an input of type file and trigger\n // a click event on it.\n if (typeof fileInput.trigger === 'function') {\n fileInput.trigger('click');\n }\n else {\n fileInput.click();\n }\n });\n }\n set cameraMode(value) {\n this._cameraMode = value;\n if (value) {\n this.startVideo();\n }\n else {\n this.stopVideo();\n }\n }\n get cameraMode() {\n return this._cameraMode;\n }\n get useWebViewCamera() {\n return this.imageUpload && webViewCamera;\n }\n get imageUpload() {\n return Boolean(this.component.image);\n }\n get browseOptions() {\n const options = {};\n if (this.component.multiple) {\n options.multiple = true;\n }\n if (this.component.capture) {\n options.capture = this.component.capture;\n }\n //use \"accept\" attribute only for desktop devices because of its limited support by mobile browsers\n const filePattern = this.component.filePattern.trim() || '';\n if (!this.isMobile.any) {\n const imagesPattern = 'image/*';\n if (this.imageUpload && (!filePattern || filePattern === '*')) {\n options.accept = imagesPattern;\n }\n else if (this.imageUpload && !filePattern.includes(imagesPattern)) {\n options.accept = `${imagesPattern},${filePattern}`;\n }\n else {\n options.accept = filePattern;\n }\n }\n // if input capture is set, we need the \"accept\" attribute to determine which device to launch\n else if (this.component.capture) {\n if (filePattern.includes('video')) {\n options.accept = 'video/*';\n }\n else if (filePattern.includes('audio')) {\n options.accept = 'audio/*';\n }\n else {\n options.accept = 'image/*';\n }\n }\n return options;\n }\n get actions() {\n return {\n abort: this.abortRequest.bind(this),\n };\n }\n attach(element) {\n this.loadRefs(element, {\n fileDrop: 'single',\n fileBrowse: 'single',\n galleryButton: 'single',\n cameraButton: 'single',\n takePictureButton: 'single',\n toggleCameraMode: 'single',\n videoPlayer: 'single',\n fileLink: 'multiple',\n removeLink: 'multiple',\n fileToSyncRemove: 'multiple',\n fileImage: 'multiple',\n fileType: 'multiple',\n fileProcessingLoader: 'single',\n syncNow: 'single',\n restoreFile: 'multiple',\n progress: 'multiple',\n });\n // Ensure we have an empty input refs. We need this for the setValue method to redraw the control when it is set.\n this.refs.input = [];\n const superAttach = super.attach(element);\n if (this.refs.fileDrop) {\n // if (!this.statuses.length) {\n // this.refs.fileDrop.removeAttribute('hidden');\n // }\n const _this = this;\n this.addEventListener(this.refs.fileDrop, 'dragover', function (event) {\n this.className = 'fileSelector fileDragOver';\n event.preventDefault();\n });\n this.addEventListener(this.refs.fileDrop, 'dragleave', function (event) {\n this.className = 'fileSelector';\n event.preventDefault();\n });\n this.addEventListener(this.refs.fileDrop, 'drop', function (event) {\n this.className = 'fileSelector';\n event.preventDefault();\n _this.handleFilesToUpload(event.dataTransfer.files);\n });\n }\n this.addEventListener(element, 'click', (event) => {\n this.handleAction(event);\n });\n if (this.refs.fileBrowse) {\n this.addEventListener(this.refs.fileBrowse, 'click', (event) => {\n event.preventDefault();\n this.browseFiles(this.browseOptions)\n .then((files) => {\n this.handleFilesToUpload(files);\n });\n });\n }\n this.refs.fileLink.forEach((fileLink, index) => {\n this.addEventListener(fileLink, 'click', (event) => {\n event.preventDefault();\n this.getFile(this.dataValue[index]);\n });\n });\n this.refs.removeLink.forEach((removeLink, index) => {\n this.addEventListener(removeLink, 'click', (event) => {\n event.preventDefault();\n const fileInfo = this.dataValue[index];\n this.handleFileToRemove(fileInfo);\n });\n });\n this.refs.fileToSyncRemove.forEach((fileToSyncRemove, index) => {\n this.addEventListener(fileToSyncRemove, 'click', (event) => {\n event.preventDefault();\n this.filesToSync.filesToUpload.splice(index, 1);\n this.redraw();\n });\n });\n this.refs.restoreFile.forEach((fileToRestore, index) => {\n this.addEventListener(fileToRestore, 'click', (event) => {\n event.preventDefault();\n const fileInfo = this.filesToSync.filesToDelete[index];\n delete fileInfo.status;\n delete fileInfo.message;\n this.filesToSync.filesToDelete.splice(index, 1);\n this.dataValue.push(fileInfo);\n this.triggerChange();\n this.redraw();\n });\n });\n if (this.refs.galleryButton && webViewCamera) {\n this.addEventListener(this.refs.galleryButton, 'click', (event) => {\n event.preventDefault();\n webViewCamera.getPicture((success) => {\n window.resolveLocalFileSystemURL(success, (fileEntry) => {\n fileEntry.file((file) => {\n const reader = new FileReader();\n reader.onloadend = (evt) => {\n const blob = new Blob([new Uint8Array(evt.target.result)], { type: file.type });\n blob.name = file.name;\n this.handleFilesToUpload([blob]);\n };\n reader.readAsArrayBuffer(file);\n });\n });\n }, (err) => {\n console.error(err);\n }, {\n sourceType: webViewCamera.PictureSourceType.PHOTOLIBRARY,\n });\n });\n }\n if (this.refs.cameraButton && webViewCamera) {\n this.addEventListener(this.refs.cameraButton, 'click', (event) => {\n event.preventDefault();\n webViewCamera.getPicture((success) => {\n window.resolveLocalFileSystemURL(success, (fileEntry) => {\n fileEntry.file((file) => {\n const reader = new FileReader();\n reader.onloadend = (evt) => {\n const blob = new Blob([new Uint8Array(evt.target.result)], { type: file.type });\n blob.name = file.name;\n this.handleFilesToUpload([blob]);\n };\n reader.readAsArrayBuffer(file);\n });\n });\n }, (err) => {\n console.error(err);\n }, {\n sourceType: webViewCamera.PictureSourceType.CAMERA,\n encodingType: webViewCamera.EncodingType.PNG,\n mediaType: webViewCamera.MediaType.PICTURE,\n saveToPhotoAlbum: true,\n correctOrientation: false,\n });\n });\n }\n if (this.refs.takePictureButton) {\n this.addEventListener(this.refs.takePictureButton, 'click', (event) => {\n event.preventDefault();\n this.takePicture();\n });\n }\n if (this.refs.toggleCameraMode) {\n this.addEventListener(this.refs.toggleCameraMode, 'click', (event) => {\n event.preventDefault();\n this.cameraMode = !this.cameraMode;\n this.redraw();\n });\n }\n this.refs.fileType.forEach((fileType, index) => {\n if (!this.dataValue[index]) {\n return;\n }\n this.dataValue[index].fileType = this.dataValue[index].fileType || this.component.fileTypes[0].label;\n this.addEventListener(fileType, 'change', (event) => {\n event.preventDefault();\n const fileType = this.component.fileTypes.find((typeObj) => typeObj.value === event.target.value);\n this.dataValue[index].fileType = fileType.label;\n });\n });\n this.addEventListener(this.refs.syncNow, 'click', (event) => {\n event.preventDefault();\n this.syncFiles();\n });\n const fileService = this.fileService;\n if (fileService) {\n const loadingImages = [];\n this.filesReady = new Promise((resolve, reject) => {\n this.filesReadyResolve = resolve;\n this.filesReadyReject = reject;\n });\n this.refs.fileImage.forEach((image, index) => {\n loadingImages.push(this.loadImage(this.dataValue[index]).then((url) => (image.src = url)));\n });\n if (loadingImages.length) {\n Promise.all(loadingImages).then(() => {\n this.filesReadyResolve();\n }).catch(() => this.filesReadyReject());\n }\n else {\n this.filesReadyResolve();\n }\n }\n return superAttach;\n }\n /* eslint-disable max-len */\n fileSize(a, b, c, d, e) {\n return `${(b = Math, c = b.log, d = 1024, e = c(a) / c(d) | 0, a / b.pow(d, e)).toFixed(2)} ${e ? `${'kMGTPEZY'[--e]}B` : 'Bytes'}`;\n }\n /* eslint-enable max-len */\n /* eslint-disable max-depth */\n globStringToRegex(str) {\n str = str.replace(/\\s/g, '');\n let regexp = '', excludes = [];\n if (str.length > 2 && str[0] === '/' && str[str.length - 1] === '/') {\n regexp = str.substring(1, str.length - 1);\n }\n else {\n const split = str.split(',');\n if (split.length > 1) {\n for (let i = 0; i < split.length; i++) {\n const r = this.globStringToRegex(split[i]);\n if (r.regexp) {\n regexp += `(${r.regexp})`;\n if (i < split.length - 1) {\n regexp += '|';\n }\n }\n else {\n excludes = excludes.concat(r.excludes);\n }\n }\n }\n else {\n if (str.startsWith('!')) {\n excludes.push(`^((?!${this.globStringToRegex(str.substring(1)).regexp}).)*$`);\n }\n else {\n if (str.startsWith('.')) {\n str = `*${str}`;\n }\n regexp = `^${str.replace(new RegExp('[.\\\\\\\\+*?\\\\[\\\\^\\\\]$(){}=!<>|:\\\\-]', 'g'), '\\\\$&')}$`;\n regexp = regexp.replace(/\\\\\\*/g, '.*').replace(/\\\\\\?/g, '.');\n }\n }\n }\n return { regexp, excludes };\n }\n /* eslint-enable max-depth */\n translateScalars(str) {\n if (typeof str === 'string') {\n if (str.search(/kb/i) === str.length - 2) {\n return parseFloat(str.substring(0, str.length - 2) * 1024);\n }\n if (str.search(/mb/i) === str.length - 2) {\n return parseFloat(str.substring(0, str.length - 2) * 1024 * 1024);\n }\n if (str.search(/gb/i) === str.length - 2) {\n return parseFloat(str.substring(0, str.length - 2) * 1024 * 1024 * 1024);\n }\n if (str.search(/b/i) === str.length - 1) {\n return parseFloat(str.substring(0, str.length - 1));\n }\n if (str.search(/s/i) === str.length - 1) {\n return parseFloat(str.substring(0, str.length - 1));\n }\n if (str.search(/m/i) === str.length - 1) {\n return parseFloat(str.substring(0, str.length - 1) * 60);\n }\n if (str.search(/h/i) === str.length - 1) {\n return parseFloat(str.substring(0, str.length - 1) * 3600);\n }\n }\n return str;\n }\n validatePattern(file, val) {\n if (!val) {\n return true;\n }\n const pattern = this.globStringToRegex(val);\n let valid = true;\n if (pattern.regexp && pattern.regexp.length) {\n const regexp = new RegExp(pattern.regexp, 'i');\n valid = (!lodash_1.default.isNil(file.type) && regexp.test(file.type)) ||\n (!lodash_1.default.isNil(file.name) && regexp.test(file.name));\n }\n valid = pattern.excludes.reduce((result, excludePattern) => {\n const exclude = new RegExp(excludePattern, 'i');\n return result && (lodash_1.default.isNil(file.type) || exclude.test(file.type)) &&\n (lodash_1.default.isNil(file.name) || exclude.test(file.name));\n }, valid);\n return valid;\n }\n validateMinSize(file, val) {\n return file.size + 0.1 >= this.translateScalars(val);\n }\n validateMaxSize(file, val) {\n return file.size - 0.1 <= this.translateScalars(val);\n }\n abortRequest(id) {\n const abortUpload = this.abortUploads.find(abortUpload => abortUpload.id === id);\n if (abortUpload) {\n abortUpload.abort();\n }\n }\n handleAction(event) {\n const target = event.target;\n if (!target.id) {\n return;\n }\n const [action, id] = target.id.split('-');\n if (!action || !id || !this.actions[action]) {\n return;\n }\n this.actions[action](id);\n }\n getFileName(file) {\n return (0, utils_1.uniqueName)(file.name, this.component.fileNameTemplate, this.evalContext());\n }\n getInitFileToSync(file) {\n const escapedFileName = file.name ? file.name.replaceAll('<', '<').replaceAll('>', '>') : file.name;\n return {\n id: createRandomString(),\n // Get a unique name for this file to keep file collisions from occurring.\n dir: this.interpolate(this.component.dir || ''),\n name: this.getFileName(file),\n originalName: escapedFileName,\n fileKey: this.component.fileKey || 'file',\n storage: this.component.storage,\n options: this.component.options,\n file,\n size: file.size,\n status: 'info',\n message: this.t('Processing file. Please wait...'),\n hash: '',\n };\n }\n handleSubmissionRevisions(file) {\n return __awaiter(this, void 0, void 0, function* () {\n if (this.root.form.submissionRevisions !== 'true') {\n return '';\n }\n const bmf = new browser_md5_file_1.default();\n const hash = yield new Promise((resolve, reject) => {\n this.emit('fileUploadingStart');\n bmf.md5(file, (err, md5) => {\n if (err) {\n return reject(err);\n }\n return resolve(md5);\n });\n });\n this.emit('fileUploadingEnd');\n return hash;\n });\n }\n validateFileName(file) {\n // Check if file with the same name is being uploaded\n const fileWithSameNameUploading = this.filesToSync.filesToUpload\n .some(fileToSync => { var _a; return ((_a = fileToSync.file) === null || _a === void 0 ? void 0 : _a.name) === file.name; });\n const fileWithSameNameUploaded = lodash_1.default.some(this.dataValue, fileStatus => fileStatus.originalName === file.name);\n return fileWithSameNameUploaded || fileWithSameNameUploading\n ? {\n status: 'error',\n message: this.t(`File with the same name is already ${fileWithSameNameUploading ? 'being ' : ''}uploaded`),\n }\n : {};\n }\n validateFileSettings(file) {\n // Check file pattern\n if (this.component.filePattern && !this.validatePattern(file, this.component.filePattern)) {\n return {\n status: 'error',\n message: this.t('File is the wrong type; it must be {{ pattern }}', {\n pattern: this.component.filePattern,\n }),\n };\n }\n // Check file minimum size\n if (this.component.fileMinSize && !this.validateMinSize(file, this.component.fileMinSize)) {\n return {\n status: 'error',\n message: this.t('File is too small; it must be at least {{ size }}', {\n size: this.component.fileMinSize,\n }),\n };\n }\n // Check file maximum size\n if (this.component.fileMaxSize && !this.validateMaxSize(file, this.component.fileMaxSize)) {\n return {\n status: 'error',\n message: this.t('File is too big; it must be at most {{ size }}', {\n size: this.component.fileMaxSize,\n }),\n };\n }\n return {};\n }\n validateFileService() {\n const { fileService } = this;\n return !fileService\n ? {\n status: 'error',\n message: this.t('File Service not provided.'),\n }\n : {};\n }\n validateFile(file) {\n const fileServiceValidation = this.validateFileService();\n if (fileServiceValidation.status === 'error') {\n return fileServiceValidation;\n }\n const fileNameValidation = this.validateFileName(file);\n if (fileNameValidation.status === 'error') {\n return fileNameValidation;\n }\n return this.validateFileSettings(file);\n }\n getGroupPermissions() {\n let groupKey = null;\n let groupPermissions = null;\n //Iterate through form components to find group resource if one exists\n this.root.everyComponent((element) => {\n var _a, _b;\n if (((_a = element.component) === null || _a === void 0 ? void 0 : _a.submissionAccess) || ((_b = element.component) === null || _b === void 0 ? void 0 : _b.defaultPermission)) {\n groupPermissions = !element.component.submissionAccess ? [\n {\n type: element.component.defaultPermission,\n roles: [],\n },\n ] : element.component.submissionAccess;\n groupPermissions.forEach((permission) => {\n groupKey = ['admin', 'write', 'create'].includes(permission.type) ? element.component.key : null;\n });\n }\n });\n return { groupKey, groupPermissions };\n }\n triggerFileProcessor(file) {\n return __awaiter(this, void 0, void 0, function* () {\n let processedFile = null;\n if (this.root.options.fileProcessor) {\n try {\n if (this.refs.fileProcessingLoader) {\n this.refs.fileProcessingLoader.style.display = 'block';\n }\n const fileProcessorHandler = (0, fileProcessor_1.default)(this.fileService, this.root.options.fileProcessor);\n processedFile = yield fileProcessorHandler(file, this.component.properties);\n }\n catch (err) {\n this.fileDropHidden = false;\n return {\n status: 'error',\n message: this.t('File processing has been failed.'),\n };\n }\n finally {\n if (this.refs.fileProcessingLoader) {\n this.refs.fileProcessingLoader.style.display = 'none';\n }\n }\n }\n return {\n file: processedFile,\n };\n });\n }\n prepareFileToUpload(file) {\n return __awaiter(this, void 0, void 0, function* () {\n const fileToSync = this.getInitFileToSync(file);\n fileToSync.hash = yield this.handleSubmissionRevisions(file);\n const { status, message } = this.validateFile(file);\n if (status === 'error') {\n fileToSync.isValidationError = true;\n fileToSync.status = status;\n fileToSync.message = message;\n return this.filesToSync.filesToUpload.push(fileToSync);\n }\n if (this.component.privateDownload) {\n file.private = true;\n }\n const { groupKey, groupPermissions } = this.getGroupPermissions();\n const processedFile = yield this.triggerFileProcessor(file);\n if (processedFile.status === 'error') {\n fileToSync.status === 'error';\n fileToSync.message = processedFile.message;\n return this.filesToSync.filesToUpload.push(fileToSync);\n }\n if (this.autoSync) {\n fileToSync.message = this.t('Ready to be uploaded into storage');\n }\n this.filesToSync.filesToUpload.push(Object.assign(Object.assign({}, fileToSync), { message: fileToSync.message, file: processedFile.file || file, url: this.interpolate(this.component.url, { file: fileToSync }), groupPermissions, groupResourceId: groupKey ? this.currentForm.submission.data[groupKey]._id : null }));\n });\n }\n prepareFilesToUpload(files) {\n return __awaiter(this, void 0, void 0, function* () {\n // Only allow one upload if not multiple.\n if (!this.component.multiple) {\n files = Array.prototype.slice.call(files, 0, 1);\n }\n if (this.component.storage && files && files.length) {\n this.fileDropHidden = true;\n return Promise.all([...files].map((file) => __awaiter(this, void 0, void 0, function* () {\n yield this.prepareFileToUpload(file);\n this.redraw();\n })));\n }\n else {\n return Promise.resolve();\n }\n });\n }\n handleFilesToUpload(files) {\n return __awaiter(this, void 0, void 0, function* () {\n yield this.prepareFilesToUpload(files);\n if (!this.autoSync) {\n yield this.syncFiles();\n }\n });\n }\n prepareFileToDelete(fileInfo) {\n this.filesToSync.filesToDelete.push(Object.assign(Object.assign({}, fileInfo), { status: 'info', message: this.autoSync\n ? this.t('Ready to be removed from storage')\n : this.t('Preparing file to remove') }));\n const index = this.dataValue.findIndex(file => file.name === fileInfo.name);\n this.splice(index);\n this.redraw();\n }\n handleFileToRemove(fileInfo) {\n this.prepareFileToDelete(fileInfo);\n if (!this.autoSync) {\n this.syncFiles();\n }\n }\n deleteFile(fileInfo) {\n return __awaiter(this, void 0, void 0, function* () {\n const { options = {} } = this.component;\n if (fileInfo && (['url', 'indexeddb', 's3', 'azure', 'googledrive'].includes(this.component.storage))) {\n const { fileService } = this;\n if (fileService && typeof fileService.deleteFile === 'function') {\n return yield fileService.deleteFile(fileInfo, options);\n }\n else {\n const formio = this.options.formio || (this.root && this.root.formio);\n if (formio) {\n return yield formio.makeRequest('', fileInfo.url, 'delete');\n }\n }\n }\n });\n }\n delete() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.filesToSync.filesToDelete.length) {\n return Promise.resolve();\n }\n return yield Promise.all(this.filesToSync.filesToDelete.map((fileToSync) => __awaiter(this, void 0, void 0, function* () {\n try {\n if (fileToSync.isValidationError) {\n return { fileToSync };\n }\n yield this.deleteFile(fileToSync);\n fileToSync.status = 'success';\n fileToSync.message = this.t('Succefully removed');\n }\n catch (response) {\n fileToSync.status = 'error';\n fileToSync.message = typeof response === 'string' ? response : response.toString();\n }\n finally {\n this.redraw();\n }\n return { fileToSync };\n })));\n });\n }\n updateProgress(fileInfo, progressEvent) {\n fileInfo.progress = parseInt(100.0 * progressEvent.loaded / progressEvent.total);\n if (fileInfo.status !== 'progress') {\n fileInfo.status = 'progress';\n delete fileInfo.message;\n this.redraw();\n }\n else {\n const progress = Array.prototype.find.call(this.refs.progress, progressElement => progressElement.id === fileInfo.id);\n progress.innerHTML = `<span class=\"visually-hidden\">${fileInfo.progress}% ${this.t('Complete')}</span>`;\n progress.style.width = `${fileInfo.progress}%`;\n progress.ariaValueNow = fileInfo.progress.toString();\n }\n }\n getMultipartOptions(fileToSync) {\n let count = 0;\n return this.component.useMultipartUpload && this.component.multipart ? Object.assign(Object.assign({}, this.component.multipart), { progressCallback: (total) => {\n count++;\n fileToSync.status = 'progress';\n fileToSync.progress = parseInt(100 * count / total);\n delete fileToSync.message;\n this.redraw();\n }, changeMessage: (message) => {\n fileToSync.message = message;\n this.redraw();\n } }) : false;\n }\n uploadFile(fileToSync) {\n return __awaiter(this, void 0, void 0, function* () {\n return yield this.fileService.uploadFile(fileToSync.storage, fileToSync.file, fileToSync.name, fileToSync.dir, \n // Progress callback\n this.updateProgress.bind(this, fileToSync), fileToSync.url, fileToSync.options, fileToSync.fileKey, fileToSync.groupPermissions, fileToSync.groupResourceId, () => { }, \n // Abort upload callback\n (abort) => this.abortUploads.push({\n id: fileToSync.id,\n abort,\n }), this.getMultipartOptions(fileToSync));\n });\n }\n upload() {\n return __awaiter(this, void 0, void 0, function* () {\n if (!this.filesToSync.filesToUpload.length) {\n return Promise.resolve();\n }\n return yield Promise.all(this.filesToSync.filesToUpload.map((fileToSync) => __awaiter(this, void 0, void 0, function* () {\n let fileInfo = null;\n try {\n if (fileToSync.isValidationError) {\n return {\n fileToSync,\n fileInfo,\n };\n }\n fileInfo = yield this.uploadFile(fileToSync);\n fileToSync.status = 'success';\n fileToSync.message = this.t('Succefully uploaded');\n fileInfo.originalName = fileToSync.originalName;\n fileInfo.hash = fileToSync.hash;\n }\n catch (response) {\n fileToSync.status = 'error';\n delete fileToSync.progress;\n fileToSync.message = typeof response === 'string'\n ? response\n : response.type === 'abort'\n ? this.t('Request was aborted')\n : response.toString();\n this.emit('fileUploadError', {\n fileToSync,\n response,\n });\n }\n finally {\n delete fileToSync.progress;\n this.redraw();\n }\n return {\n fileToSync,\n fileInfo,\n };\n })));\n });\n }\n syncFiles() {\n return __awaiter(this, void 0, void 0, function* () {\n this.isSyncing = true;\n this.fileDropHidden = true;\n this.redraw();\n try {\n const [filesToDelete = [], filesToUpload = []] = yield Promise.all([this.delete(), this.upload()]);\n this.filesToSync.filesToDelete = filesToDelete\n .filter(file => { var _a; return ((_a = file.fileToSync) === null || _a === void 0 ? void 0 : _a.status) === 'error'; })\n .map(file => file.fileToSync);\n this.filesToSync.filesToUpload = filesToUpload\n .filter(file => { var _a; return ((_a = file.fileToSync) === null || _a === void 0 ? void 0 : _a.status) === 'error'; })\n .map(file => file.fileToSync);\n if (!this.hasValue()) {\n this.dataValue = [];\n }\n const data = filesToUpload\n .filter(file => { var _a; return ((_a = file.fileToSync) === null || _a === void 0 ? void 0 : _a.status) === 'success'; })\n .map(file => file.fileInfo);\n this.dataValue.push(...data);\n this.triggerChange();\n return Promise.resolve();\n }\n catch (err) {\n return Promise.reject();\n }\n finally {\n this.isSyncing = false;\n this.fileDropHidden = false;\n this.abortUploads = [];\n this.redraw();\n }\n });\n }\n getFile(fileInfo) {\n const { options = {} } = this.component;\n const { fileService } = this;\n if (!fileService) {\n return alert('File Service not provided');\n }\n if (this.component.privateDownload) {\n fileInfo.private = true;\n }\n fileService.downloadFile(fileInfo, options).then((file) => {\n if (file) {\n if (['base64', 'indexeddb'].includes(file.storage)) {\n (0, downloadjs_1.default)(file.url, file.originalName || file.name, file.type);\n }\n else {\n window.open(file.url, '_blank');\n }\n }\n })\n .catch((response) => {\n // Is alert the best way to do this?\n // User is expecting an immediate notification due to attempting to download a file.\n alert(response);\n });\n }\n focus() {\n if ('beforeFocus' in this.parent) {\n this.parent.beforeFocus(this);\n }\n if (this.refs.fileBrowse) {\n this.refs.fileBrowse.focus();\n }\n }\n beforeSubmit() {\n return __awaiter(this, void 0, void 0, function* () {\n try {\n if (!this.autoSync) {\n return Promise.resolve();\n }\n yield this.syncFiles();\n return this.shouldSyncFiles\n ? Promise.reject('Synchronization is failed')\n : Promise.resolve();\n }\n catch (error) {\n return Promise.reject(error.message);\n }\n });\n }\n destroy(all) {\n this.stopVideo();\n super.destroy(all);\n }\n}\nexports[\"default\"] = FileComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/file/File.js?");
|
5230
5230
|
|
5231
5231
|
/***/ }),
|
5232
5232
|
|
@@ -8841,7 +8841,7 @@ eval("\nvar parent = __webpack_require__(/*! ../../es/object/from-entries */ \".
|
|
8841
8841
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
8842
8842
|
|
8843
8843
|
"use strict";
|
8844
|
-
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.0.0-rc.71';\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?");
|
8844
|
+
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.0.0-rc.72';\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?");
|
8845
8845
|
|
8846
8846
|
/***/ }),
|
8847
8847
|
|
@@ -8852,7 +8852,7 @@ eval("\nvar __awaiter = (this && this.__awaiter) || function (thisArg, _argument
|
|
8852
8852
|
/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
|
8853
8853
|
|
8854
8854
|
"use strict";
|
8855
|
-
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.0.0-rc.
|
8855
|
+
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.0.0-rc.72';\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?");
|
8856
8856
|
|
8857
8857
|
/***/ }),
|
8858
8858
|
|