@formio/js 5.0.0-dev.5948.072adfa → 5.0.0-dev.5950.723a551

package/dist/formio.form.js

@@ -5150,7 +5150,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst moment_1 = __importDefault(__webpack_require__(/*! moment */ \"./node_modules/moment/moment.js\"));\nconst utils_1 = __importDefault(__webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\"));\nconst utils_2 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst Input_1 = __importDefault(__webpack_require__(/*! ../_classes/input/Input */ \"./lib/cjs/components/_classes/input/Input.js\"));\nclass DateTimeComponent extends Input_1.default {\n    static schema(...extend) {\n        return Input_1.default.schema({\n            type: 'datetime',\n            label: 'Date / Time',\n            key: 'dateTime',\n            format: 'yyyy-MM-dd hh:mm a',\n            useLocaleSettings: false,\n            allowInput: true,\n            enableDate: true,\n            enableTime: true,\n            defaultValue: '',\n            defaultDate: '',\n            displayInTimezone: 'viewer',\n            timezone: '',\n            datepickerMode: 'day',\n            datePicker: {\n                showWeeks: true,\n                startingDay: 0,\n                initDate: '',\n                minMode: 'day',\n                maxMode: 'year',\n                yearRows: 4,\n                yearColumns: 5,\n                minDate: null,\n                maxDate: null\n            },\n            timePicker: {\n                hourStep: 1,\n                minuteStep: 1,\n                showMeridian: true,\n                readonlyInput: false,\n                mousewheel: true,\n                arrowkeys: true\n            },\n            customOptions: {},\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Date / Time',\n            group: 'advanced',\n            icon: 'calendar',\n            documentation: '/userguide/form-building/advanced-components#date-and-time',\n            weight: 40,\n            schema: DateTimeComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return DateTimeComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: ['isDateEqual', 'isNotDateEqual', 'isEmpty', 'isNotEmpty', 'dateLessThan', 'dateGreaterThan', 'dateLessThanOrEqual', 'dateGreaterThanOrEqual'], valueComponent(classComp) {\n                return Object.assign(Object.assign({}, classComp), { type: 'datetime' });\n            } });\n    }\n    static savedValueTypes(schema) {\n        schema = schema || {};\n        return (0, utils_2.getComponentSavedTypes)(schema) || [utils_2.componentValueTypes.date];\n    }\n    constructor(component, options, data) {\n        super(component, options, data);\n        const timezone = (this.component.timezone || this.options.timezone);\n        const time24hr = !lodash_1.default.get(this.component, 'timePicker.showMeridian', true);\n        // Change the format to map to the settings.\n        if (!this.component.enableDate) {\n            this.component.format = this.component.format.replace(/yyyy-MM-dd /g, '');\n        }\n        else if (this.component.enableDate && !/[yMd]/.test(this.component.format) && this.builderMode) {\n            this.component.format = `yyyy-MM-dd ${this.component.format}`;\n        }\n        if (!this.component.enableTime) {\n            this.component.format = this.component.format.replace(/ hh:mm a$/g, '');\n        }\n        else if (this.component.enableTime && !/[mhH]/.test(this.component.format) && this.builderMode) {\n            this.component.format = `${this.component.format} hh:mm a`;\n        }\n        else if (time24hr) {\n            this.component.format = this.component.format.replace(/hh:mm a$/g, 'HH:mm');\n        }\n        else {\n            this.component.format = this.component.format.replace(/HH:mm$/g, 'hh:mm a');\n        }\n        let customOptions = this.component.customOptions || {};\n        if (typeof customOptions === 'string') {\n            try {\n                customOptions = JSON.parse(customOptions);\n            }\n            catch (err) {\n                console.warn(err.message);\n                customOptions = {};\n            }\n        }\n        /* eslint-disable camelcase */\n        this.component.widget = Object.assign({ type: 'calendar', timezone, displayInTimezone: lodash_1.default.get(this.component, 'displayInTimezone', 'viewer'), locale: this.options.language, useLocaleSettings: lodash_1.default.get(this.component, 'useLocaleSettings', false), allowInput: lodash_1.default.get(this.component, 'allowInput', true), mode: 'single', enableTime: lodash_1.default.get(this.component, 'enableTime', true), noCalendar: !lodash_1.default.get(this.component, 'enableDate', true), format: this.component.format, hourIncrement: lodash_1.default.get(this.component, 'timePicker.hourStep', 1), minuteIncrement: lodash_1.default.get(this.component, 'timePicker.minuteStep', 5), time_24hr: time24hr, readOnly: this.options.readOnly, minDate: lodash_1.default.get(this.component, 'datePicker.minDate'), disabledDates: lodash_1.default.get(this.component, 'datePicker.disable'), disableWeekends: lodash_1.default.get(this.component, 'datePicker.disableWeekends'), disableWeekdays: lodash_1.default.get(this.component, 'datePicker.disableWeekdays'), disableFunction: lodash_1.default.get(this.component, 'datePicker.disableFunction'), maxDate: lodash_1.default.get(this.component, 'datePicker.maxDate') }, customOptions);\n        /* eslint-enable camelcase */\n    }\n    get defaultSchema() {\n        return DateTimeComponent.schema();\n    }\n    get defaultValue() {\n        let defaultValue = super.defaultValue;\n        if (!defaultValue && this.component.defaultDate) {\n            defaultValue = utils_1.default.getDateSetting(this.component.defaultDate);\n            defaultValue = defaultValue ? defaultValue.toISOString() : '';\n        }\n        return defaultValue;\n    }\n    get emptyValue() {\n        return '';\n    }\n    get momentFormat() {\n        return utils_1.default.convertFormatToMoment(this.component.format);\n    }\n    isEmpty(value = this.dataValue) {\n        if (value && (value.toString() === 'Invalid Date')) {\n            return true;\n        }\n        return super.isEmpty(value);\n    }\n    formatValue(input) {\n        const result = moment_1.default.utc(input).toISOString();\n        return result === 'Invalid date' ? input : result;\n    }\n    isEqual(valueA, valueB = this.dataValue) {\n        return (this.isEmpty(valueA) && this.isEmpty(valueB))\n            || moment_1.default.utc(valueA).format(this.momentFormat) === moment_1.default.utc(valueB).format(this.momentFormat);\n    }\n    createWrapper() {\n        return false;\n    }\n    checkValidity(data, dirty, rowData) {\n        if (this.refs.input) {\n            this.refs.input.forEach((input) => {\n                if (input.widget && input.widget.enteredDate) {\n                    dirty = true;\n                }\n            });\n        }\n        return super.checkValidity(data, dirty, rowData);\n    }\n    getValueAsString(value) {\n        let format = utils_1.default.convertFormatToMoment(this.component.format);\n        format += format.match(/z$/) ? '' : ' z';\n        const timezone = this.timezone;\n        if (value && !this.attached && timezone) {\n            if (Array.isArray(value) && this.component.multiple) {\n                return value.map(item => lodash_1.default.trim(utils_1.default.momentDate(item, format, timezone).format(format))).join(', ');\n            }\n            return lodash_1.default.trim(utils_1.default.momentDate(value, format, timezone).format(format));\n        }\n        if (Array.isArray(value) && this.component.multiple) {\n            return value.map(item => lodash_1.default.trim((0, moment_1.default)(item).format(format))).join(', ');\n        }\n        return (value ? lodash_1.default.trim((0, moment_1.default)(value).format(format)) : value) || '';\n    }\n}\nexports[\"default\"] = DateTimeComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/datetime/DateTime.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst moment_1 = __importDefault(__webpack_require__(/*! moment */ \"./node_modules/moment/moment.js\"));\nconst utils_1 = __importDefault(__webpack_require__(/*! ../../utils */ \"./lib/cjs/utils/index.js\"));\nconst utils_2 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst Input_1 = __importDefault(__webpack_require__(/*! ../_classes/input/Input */ \"./lib/cjs/components/_classes/input/Input.js\"));\nclass DateTimeComponent extends Input_1.default {\n    static schema(...extend) {\n        return Input_1.default.schema({\n            type: 'datetime',\n            label: 'Date / Time',\n            key: 'dateTime',\n            format: 'yyyy-MM-dd hh:mm a',\n            useLocaleSettings: false,\n            allowInput: true,\n            enableDate: true,\n            enableTime: true,\n            defaultValue: '',\n            defaultDate: '',\n            displayInTimezone: 'viewer',\n            timezone: '',\n            datepickerMode: 'day',\n            datePicker: {\n                showWeeks: true,\n                startingDay: 0,\n                initDate: '',\n                minMode: 'day',\n                maxMode: 'year',\n                yearRows: 4,\n                yearColumns: 5,\n                minDate: null,\n                maxDate: null\n            },\n            timePicker: {\n                hourStep: 1,\n                minuteStep: 1,\n                showMeridian: true,\n                readonlyInput: false,\n                mousewheel: true,\n                arrowkeys: true\n            },\n            customOptions: {},\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Date / Time',\n            group: 'advanced',\n            icon: 'calendar',\n            documentation: '/userguide/form-building/advanced-components#date-and-time',\n            weight: 40,\n            schema: DateTimeComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return DateTimeComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: ['isDateEqual', 'isNotDateEqual', 'isEmpty', 'isNotEmpty', 'dateLessThan', 'dateGreaterThan', 'dateLessThanOrEqual', 'dateGreaterThanOrEqual'], valueComponent(classComp) {\n                return Object.assign(Object.assign({}, classComp), { type: 'datetime' });\n            } });\n    }\n    static savedValueTypes(schema) {\n        schema = schema || {};\n        return (0, utils_2.getComponentSavedTypes)(schema) || [utils_2.componentValueTypes.date];\n    }\n    constructor(component, options, data) {\n        super(component, options, data);\n        const timezone = (this.component.timezone || this.options.timezone);\n        const time24hr = !lodash_1.default.get(this.component, 'timePicker.showMeridian', true);\n        // Change the format to map to the settings.\n        if (!this.component.enableDate) {\n            this.component.format = this.component.format.replace(/yyyy-MM-dd /g, '');\n        }\n        else if (this.component.enableDate && !/[yMd]/.test(this.component.format) && this.builderMode) {\n            this.component.format = `yyyy-MM-dd ${this.component.format}`;\n        }\n        if (!this.component.enableTime) {\n            this.component.format = this.component.format.replace(/ hh:mm a$/g, '');\n        }\n        else if (this.component.enableTime && !/[mhH]/.test(this.component.format) && this.builderMode) {\n            this.component.format = `${this.component.format} hh:mm a`;\n        }\n        else if (time24hr) {\n            this.component.format = this.component.format.replace(/hh:mm a$/g, 'HH:mm');\n        }\n        else {\n            this.component.format = this.component.format.replace(/HH:mm$/g, 'hh:mm a');\n        }\n        let customOptions = this.component.customOptions || {};\n        if (typeof customOptions === 'string') {\n            try {\n                customOptions = JSON.parse(customOptions);\n            }\n            catch (err) {\n                console.warn(err.message);\n                customOptions = {};\n            }\n        }\n        /* eslint-disable camelcase */\n        this.component.widget = Object.assign({ type: 'calendar', timezone, displayInTimezone: lodash_1.default.get(this.component, 'displayInTimezone', 'viewer'), locale: this.options.language, useLocaleSettings: lodash_1.default.get(this.component, 'useLocaleSettings', false), allowInput: lodash_1.default.get(this.component, 'allowInput', true), mode: 'single', enableTime: lodash_1.default.get(this.component, 'enableTime', true), noCalendar: !lodash_1.default.get(this.component, 'enableDate', true), format: this.component.format, hourIncrement: lodash_1.default.get(this.component, 'timePicker.hourStep', 1), minuteIncrement: lodash_1.default.get(this.component, 'timePicker.minuteStep', 5), time_24hr: time24hr, readOnly: this.options.readOnly, minDate: lodash_1.default.get(this.component, 'datePicker.minDate'), disabledDates: lodash_1.default.get(this.component, 'datePicker.disable'), disableWeekends: lodash_1.default.get(this.component, 'datePicker.disableWeekends'), disableWeekdays: lodash_1.default.get(this.component, 'datePicker.disableWeekdays'), disableFunction: lodash_1.default.get(this.component, 'datePicker.disableFunction'), maxDate: lodash_1.default.get(this.component, 'datePicker.maxDate') }, customOptions);\n        // update originalComponent to include widget and other updated settings\n        // it is done here since these settings depend on properties present after the component is initialized \n        // originalComponent is used to restore the component (and widget) after evaluating field logic \n        this.originalComponent = (0, utils_2.fastCloneDeep)(this.component);\n        /* eslint-enable camelcase */\n    }\n    get defaultSchema() {\n        return DateTimeComponent.schema();\n    }\n    get defaultValue() {\n        let defaultValue = super.defaultValue;\n        if (!defaultValue && this.component.defaultDate) {\n            defaultValue = utils_1.default.getDateSetting(this.component.defaultDate);\n            defaultValue = defaultValue ? defaultValue.toISOString() : '';\n        }\n        return defaultValue;\n    }\n    get emptyValue() {\n        return '';\n    }\n    get momentFormat() {\n        return utils_1.default.convertFormatToMoment(this.component.format);\n    }\n    isEmpty(value = this.dataValue) {\n        if (value && (value.toString() === 'Invalid Date')) {\n            return true;\n        }\n        return super.isEmpty(value);\n    }\n    formatValue(input) {\n        const result = moment_1.default.utc(input).toISOString();\n        return result === 'Invalid date' ? input : result;\n    }\n    isEqual(valueA, valueB = this.dataValue) {\n        return (this.isEmpty(valueA) && this.isEmpty(valueB))\n            || moment_1.default.utc(valueA).format(this.momentFormat) === moment_1.default.utc(valueB).format(this.momentFormat);\n    }\n    createWrapper() {\n        return false;\n    }\n    checkValidity(data, dirty, rowData) {\n        if (this.refs.input) {\n            this.refs.input.forEach((input) => {\n                if (input.widget && input.widget.enteredDate) {\n                    dirty = true;\n                }\n            });\n        }\n        return super.checkValidity(data, dirty, rowData);\n    }\n    getValueAsString(value) {\n        let format = utils_1.default.convertFormatToMoment(this.component.format);\n        format += format.match(/z$/) ? '' : ' z';\n        const timezone = this.timezone;\n        if (value && !this.attached && timezone) {\n            if (Array.isArray(value) && this.component.multiple) {\n                return value.map(item => lodash_1.default.trim(utils_1.default.momentDate(item, format, timezone).format(format))).join(', ');\n            }\n            return lodash_1.default.trim(utils_1.default.momentDate(value, format, timezone).format(format));\n        }\n        if (Array.isArray(value) && this.component.multiple) {\n            return value.map(item => lodash_1.default.trim((0, moment_1.default)(item).format(format))).join(', ');\n        }\n        return (value ? lodash_1.default.trim((0, moment_1.default)(value).format(format)) : value) || '';\n    }\n}\nexports[\"default\"] = DateTimeComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/datetime/DateTime.js?");
 
 /***/ }),
 
@@ -5260,7 +5260,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst text_mask_addons_1 = __webpack_require__(/*! @formio/text-mask-addons */ \"./node_modules/@formio/text-mask-addons/dist/textMaskAddons.js\");\nconst vanilla_text_mask_1 = __webpack_require__(/*! @formio/vanilla-text-mask */ \"./node_modules/@formio/vanilla-text-mask/dist/vanillaTextMask.js\");\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst Input_1 = __importDefault(__webpack_require__(/*! ../_classes/input/Input */ \"./lib/cjs/components/_classes/input/Input.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nclass NumberComponent extends Input_1.default {\n    static schema(...extend) {\n        return Input_1.default.schema({\n            type: 'number',\n            label: 'Number',\n            key: 'number',\n            validate: {\n                min: '',\n                max: '',\n                step: 'any',\n                integer: ''\n            }\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Number',\n            icon: 'hashtag',\n            group: 'basic',\n            documentation: '/userguide/form-building/form-components#number',\n            weight: 30,\n            schema: NumberComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return NumberComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: [...super.conditionOperatorsSettings.operators, 'lessThan', 'greaterThan', 'lessThanOrEqual', 'greaterThanOrEqual'], valueComponent(classComp) {\n                return Object.assign(Object.assign({}, classComp), { type: 'number' });\n            } });\n    }\n    static savedValueTypes(schema) {\n        schema = schema || {};\n        return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes.number];\n    }\n    constructor(...args) {\n        var _a, _b, _c;\n        super(...args);\n        const separators = (0, utils_1.getNumberSeparators)(this.options.language || navigator.language);\n        this.decimalSeparator = this.options.decimalSeparator = this.component.decimalSymbol || this.options.decimalSeparator\n            || ((_a = this.options.properties) === null || _a === void 0 ? void 0 : _a.decimalSeparator)\n            || separators.decimalSeparator;\n        if (this.component.delimiter) {\n            this.delimiter = this.component.thousandsSeparator || ((_b = this.options.properties) === null || _b === void 0 ? void 0 : _b.thousandsSeparator) || this.options.thousandsSeparator || separators.delimiter;\n        }\n        else {\n            if (this.component.thousandsSeparator || ((_c = this.options.properties) === null || _c === void 0 ? void 0 : _c.thousandsSeparator) || this.options.thousandsSeparator) {\n                console.warn('In order for thousands separator to work properly, you must set the delimiter to true in the component json');\n            }\n            this.delimiter = '';\n        }\n        const requireDecimal = lodash_1.default.get(this.component, 'requireDecimal', false);\n        this.decimalLimit = (0, utils_1.getNumberDecimalLimit)(this.component, requireDecimal ? 2 : 20);\n        // Currencies to override BrowserLanguage Config. Object key {}\n        if (lodash_1.default.has(this.options, `languageOverride.${this.options.language}`)) {\n            const override = lodash_1.default.get(this.options, `languageOverride.${this.options.language}`);\n            this.decimalSeparator = override.decimalSeparator;\n            this.delimiter = override.delimiter;\n        }\n        this.numberMask = this.createNumberMask();\n    }\n    /**\n     * Creates the number mask for normal numbers.\n     * @returns {*} - The number mask.\n     */\n    createNumberMask() {\n        return (0, text_mask_addons_1.createNumberMask)({\n            prefix: '',\n            suffix: '',\n            requireDecimal: lodash_1.default.get(this.component, 'requireDecimal', false),\n            thousandsSeparatorSymbol: this.delimiter || '',\n            decimalSymbol: lodash_1.default.get(this.component, 'decimalSymbol', this.decimalSeparator),\n            decimalLimit: lodash_1.default.get(this.component, 'decimalLimit', this.decimalLimit),\n            allowNegative: lodash_1.default.get(this.component, 'allowNegative', true),\n            allowDecimal: this.isDecimalAllowed(),\n        });\n    }\n    get defaultSchema() {\n        return NumberComponent.schema();\n    }\n    get defaultValue() {\n        let defaultValue = super.defaultValue;\n        if (typeof defaultValue === 'string') {\n            // Default value may be a string or have custom thousands separators or decimal symbols, so we need to call\n            // parseNumber on it\n            defaultValue = this.parseNumber(defaultValue);\n        }\n        if (!defaultValue && this.component.defaultValue === 0) {\n            defaultValue = this.component.defaultValue;\n        }\n        if (!this.component.multiple && lodash_1.default.isArray(defaultValue)) {\n            defaultValue = !defaultValue[0] && defaultValue[0] !== 0 ? null : defaultValue[0];\n        }\n        return defaultValue;\n    }\n    isDecimalAllowed() {\n        return lodash_1.default.get(this.component, 'allowDecimal', !(this.component.validate && this.component.validate.integer));\n    }\n    /**\n     * parses a numeric string by removing the delimiters and replacing the decimal separator back to '.' so that it can\n     * be processed by either parseInt or parseFloat\n     * @param {string} value the value to be parsed\n     * @returns {number} a parsed number\n     */\n    parseNumber(value) {\n        // Remove delimiters and convert decimal separator to dot.\n        value = value.split(this.delimiter).join('').replace(this.decimalSeparator, '.');\n        if (this.component.validate && this.component.validate.integer) {\n            return parseInt(value, 10);\n        }\n        else {\n            return parseFloat(value);\n        }\n    }\n    setInputMask(input) {\n        let numberPattern = '[0-9';\n        numberPattern += this.decimalSeparator || '';\n        numberPattern += this.delimiter || '';\n        numberPattern += ']*';\n        input.setAttribute('pattern', numberPattern);\n        input.mask = (0, vanilla_text_mask_1.maskInput)({\n            inputElement: input,\n            mask: this.numberMask,\n            shadowRoot: this.root ? this.root.shadowRoot : null,\n        });\n    }\n    get inputInfo() {\n        const info = super.inputInfo;\n        if (this.component.mask) {\n            info.attr.type = 'password';\n        }\n        else {\n            info.attr.type = 'text';\n        }\n        info.attr.inputmode = this.isDecimalAllowed() ? 'decimal' : 'numeric';\n        info.changeEvent = 'input';\n        return info;\n    }\n    getValueAt(index) {\n        if (!this.refs.input.length || !this.refs.input[index]) {\n            return null;\n        }\n        const val = this.refs.input[index].value;\n        return val && val !== '-_' ? this.parseNumber(val) : null;\n    }\n    setValueAt(index, value, flags = {}) {\n        return super.setValueAt(index, this.formatValue(this.parseValue(value)), flags);\n    }\n    /**\n     * Converts a string to a floating point number, formats the number based on the parsed float function\n     * (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat) and then returns the\n     * formatted number back as a string\n     * Example Input: \"123.456,22\"\n     * Example Output: \"123456,22\"\n     * @param {string | number} input the numeric string to parse\n     * @returns {string | null} a parsed string\n     */\n    parseValue(input) {\n        if (typeof input === 'string') {\n            input = input.split(this.delimiter).join('').replace(this.decimalSeparator, '.');\n        }\n        let value = parseFloat(input);\n        if (!lodash_1.default.isNaN(value)) {\n            // Format scientific notation\n            if (/e/i.test(String(value))) {\n                value = value.toExponential(this.decimalLimit);\n            }\n            else {\n                value = String(value).replace('.', this.decimalSeparator);\n            }\n        }\n        else {\n            value = null;\n        }\n        return value;\n    }\n    formatValue(value) {\n        if (this.component.requireDecimal && value && !value.includes(this.decimalSeparator)) {\n            return `${value}${this.decimalSeparator}${lodash_1.default.repeat('0', this.decimalLimit)}`;\n        }\n        else if (this.component.requireDecimal && value && value.includes(this.decimalSeparator)) {\n            return `${value}${lodash_1.default.repeat('0', this.decimalLimit - value.split(this.decimalSeparator)[1].length)}`;\n        }\n        return value;\n    }\n    focus() {\n        const input = this.refs.input[0];\n        if (input) {\n            super.focus.call(this);\n            input.setSelectionRange(0, input.value.length);\n        }\n    }\n    getMaskedValue(value) {\n        value = value === null ? '0' : value.toString();\n        if (value.includes('.') && '.' !== this.decimalSeparator) {\n            value = value.replace('.', this.decimalSeparator);\n        }\n        return (0, vanilla_text_mask_1.conformToMask)(this.formatValue(value), this.numberMask).conformedValue;\n    }\n    getValueAsString(value, options) {\n        if (!value && value !== 0) {\n            return '';\n        }\n        value = this.getWidgetValueAsString(value, options);\n        if (Array.isArray(value)) {\n            return value.map((val) => this.getMaskedValue(val)).join(', ');\n        }\n        return this.getMaskedValue(value);\n    }\n    addFocusBlurEvents(element) {\n        super.addFocusBlurEvents(element);\n        this.addEventListener(element, 'blur', () => {\n            element.value = this.getValueAsString(this.formatValue(this.parseValue(element.value)));\n        });\n    }\n}\nexports[\"default\"] = NumberComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/number/Number.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst text_mask_addons_1 = __webpack_require__(/*! @formio/text-mask-addons */ \"./node_modules/@formio/text-mask-addons/dist/textMaskAddons.js\");\nconst vanilla_text_mask_1 = __webpack_require__(/*! @formio/vanilla-text-mask */ \"./node_modules/@formio/vanilla-text-mask/dist/vanillaTextMask.js\");\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst Input_1 = __importDefault(__webpack_require__(/*! ../_classes/input/Input */ \"./lib/cjs/components/_classes/input/Input.js\"));\nconst utils_1 = __webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nclass NumberComponent extends Input_1.default {\n    static schema(...extend) {\n        return Input_1.default.schema({\n            type: 'number',\n            label: 'Number',\n            key: 'number',\n            validate: {\n                min: '',\n                max: '',\n                step: 'any',\n                integer: ''\n            }\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Number',\n            icon: 'hashtag',\n            group: 'basic',\n            documentation: '/userguide/form-building/form-components#number',\n            weight: 30,\n            schema: NumberComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return NumberComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: [...super.conditionOperatorsSettings.operators, 'lessThan', 'greaterThan', 'lessThanOrEqual', 'greaterThanOrEqual'], valueComponent(classComp) {\n                return Object.assign(Object.assign({}, classComp), { type: 'number' });\n            } });\n    }\n    static savedValueTypes(schema) {\n        schema = schema || {};\n        return (0, utils_1.getComponentSavedTypes)(schema) || [utils_1.componentValueTypes.number];\n    }\n    constructor(...args) {\n        var _a, _b, _c;\n        super(...args);\n        const separators = (0, utils_1.getNumberSeparators)(this.options.language || navigator.language);\n        this.decimalSeparator = this.options.decimalSeparator = this.component.decimalSymbol || this.options.decimalSeparator\n            || ((_a = this.options.properties) === null || _a === void 0 ? void 0 : _a.decimalSeparator)\n            || separators.decimalSeparator;\n        if (this.component.delimiter) {\n            this.delimiter = this.component.thousandsSeparator || ((_b = this.options.properties) === null || _b === void 0 ? void 0 : _b.thousandsSeparator) || this.options.thousandsSeparator || separators.delimiter;\n        }\n        else {\n            if (this.component.thousandsSeparator || ((_c = this.options.properties) === null || _c === void 0 ? void 0 : _c.thousandsSeparator) || this.options.thousandsSeparator) {\n                console.warn('In order for thousands separator to work properly, you must set the delimiter to true in the component json');\n            }\n            this.delimiter = '';\n        }\n        const requireDecimal = lodash_1.default.get(this.component, 'requireDecimal', false);\n        this.decimalLimit = (0, utils_1.getNumberDecimalLimit)(this.component, requireDecimal ? 2 : 20);\n        // Currencies to override BrowserLanguage Config. Object key {}\n        if (lodash_1.default.has(this.options, `languageOverride.${this.options.language}`)) {\n            const override = lodash_1.default.get(this.options, `languageOverride.${this.options.language}`);\n            this.decimalSeparator = override.decimalSeparator;\n            this.delimiter = override.delimiter;\n        }\n        this.numberMask = this.createNumberMask();\n    }\n    /**\n     * Creates the number mask for normal numbers.\n     * @returns {*} - The number mask.\n     */\n    createNumberMask() {\n        return (0, text_mask_addons_1.createNumberMask)({\n            prefix: '',\n            suffix: '',\n            requireDecimal: lodash_1.default.get(this.component, 'requireDecimal', false),\n            thousandsSeparatorSymbol: this.delimiter || '',\n            decimalSymbol: lodash_1.default.get(this.component, 'decimalSymbol', this.decimalSeparator),\n            decimalLimit: lodash_1.default.get(this.component, 'decimalLimit', this.decimalLimit),\n            allowNegative: lodash_1.default.get(this.component, 'allowNegative', true),\n            allowDecimal: this.isDecimalAllowed(),\n        });\n    }\n    get defaultSchema() {\n        return NumberComponent.schema();\n    }\n    get defaultValue() {\n        let defaultValue = super.defaultValue;\n        if (typeof defaultValue === 'string') {\n            // Default value may be a string or have custom thousands separators or decimal symbols, so we need to call\n            // parseNumber on it\n            defaultValue = this.parseNumber(defaultValue);\n        }\n        if (!defaultValue && this.component.defaultValue === 0) {\n            defaultValue = this.component.defaultValue;\n        }\n        if (!this.component.multiple && lodash_1.default.isArray(defaultValue)) {\n            defaultValue = !defaultValue[0] && defaultValue[0] !== 0 ? null : defaultValue[0];\n        }\n        return defaultValue;\n    }\n    isDecimalAllowed() {\n        return lodash_1.default.get(this.component, 'allowDecimal', !(this.component.validate && this.component.validate.integer));\n    }\n    /**\n     * parses a numeric string by removing the delimiters and replacing the decimal separator back to '.' so that it can\n     * be processed by either parseInt or parseFloat\n     * @param {string} value the value to be parsed\n     * @returns {number} a parsed number\n     */\n    parseNumber(value) {\n        // Remove delimiters and convert decimal separator to dot.\n        value = value.split(this.delimiter).join('').replace(this.decimalSeparator, '.');\n        if (this.component.validate && this.component.validate.integer) {\n            return parseInt(value, 10);\n        }\n        else {\n            return parseFloat(value);\n        }\n    }\n    setInputMask(input) {\n        let numberPattern = '[0-9';\n        numberPattern += this.decimalSeparator || '';\n        numberPattern += this.delimiter || '';\n        numberPattern += ']*';\n        input.setAttribute('pattern', numberPattern);\n        input.mask = (0, vanilla_text_mask_1.maskInput)({\n            inputElement: input,\n            mask: this.numberMask,\n            shadowRoot: this.root ? this.root.shadowRoot : null,\n        });\n    }\n    get inputInfo() {\n        const info = super.inputInfo;\n        if (this.component.mask) {\n            info.attr.type = 'password';\n        }\n        else {\n            info.attr.type = 'text';\n        }\n        info.attr.inputmode = this.isDecimalAllowed() ? 'decimal' : 'numeric';\n        info.changeEvent = 'input';\n        return info;\n    }\n    getValueAt(index) {\n        if (!this.refs.input.length || !this.refs.input[index]) {\n            return null;\n        }\n        const val = this.refs.input[index].value;\n        return val && val !== '-_' ? this.parseNumber(val) : null;\n    }\n    setValueAt(index, value, flags = {}) {\n        return super.setValueAt(index, this.formatValue(this.parseValue(value)), flags);\n    }\n    /**\n     * Converts a string to a floating point number, formats the number based on the parsed float function\n     * (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat) and then returns the\n     * formatted number back as a string\n     * Example Input: \"123.456,22\"\n     * Example Output: \"123456,22\"\n     * @param {string | number} input the numeric string to parse\n     * @returns {string | null} a parsed string\n     */\n    parseValue(input) {\n        if (typeof input === 'string') {\n            input = input.split(this.delimiter).join('').replace(this.decimalSeparator, '.');\n        }\n        let value;\n        if (!lodash_1.default.isNaN(input)) {\n            // Format scientific notation\n            if (/[0-9]+[eE]/.test(String(input))) {\n                // Convert to exponential notation will depend on the decimal limit set in the component\n                // Example: 1.23e-5 will be converted to 1.23e-5 if decimal limit is set to 2\n                // Example: 1.23e5 will be converted to 1.23e+5 if decimal limit is set to 2\n                // if decimal limit is 3, 1.23e5 will be converted to 1.230e+5\n                // if decimal limit is not set, 1.23e5 will be converted to 1.23000000000000000000e+5\n                value = parseFloat(input);\n                value = value.toExponential(this.decimalLimit);\n            }\n            else {\n                value = parseFloat(input);\n                value = !lodash_1.default.isNaN(value) ? String(value).replace('.', this.decimalSeparator) : null;\n            }\n        }\n        else {\n            value = null;\n        }\n        return value;\n    }\n    formatValue(value) {\n        if (this.component.requireDecimal && value && !value.includes(this.decimalSeparator)) {\n            return `${value}${this.decimalSeparator}${lodash_1.default.repeat('0', this.decimalLimit)}`;\n        }\n        else if (this.component.requireDecimal && value && value.includes(this.decimalSeparator)) {\n            return `${value}${lodash_1.default.repeat('0', this.decimalLimit - value.split(this.decimalSeparator)[1].length)}`;\n        }\n        return value;\n    }\n    focus() {\n        const input = this.refs.input[0];\n        if (input) {\n            super.focus.call(this);\n            input.setSelectionRange(0, input.value.length);\n        }\n    }\n    getMaskedValue(value) {\n        value = value === null ? '0' : value.toString();\n        if (value.includes('.') && '.' !== this.decimalSeparator) {\n            value = value.replace('.', this.decimalSeparator);\n        }\n        return (0, vanilla_text_mask_1.conformToMask)(this.formatValue(value), this.numberMask).conformedValue;\n    }\n    getValueAsString(value, options) {\n        if (!value && value !== 0) {\n            return '';\n        }\n        value = this.getWidgetValueAsString(value, options);\n        if (Array.isArray(value)) {\n            return value.map((val) => this.getMaskedValue(val)).join(', ');\n        }\n        return this.getMaskedValue(value);\n    }\n    addFocusBlurEvents(element) {\n        super.addFocusBlurEvents(element);\n        this.addEventListener(element, 'blur', () => {\n            element.value = this.getValueAsString(this.formatValue(this.parseValue(element.value)));\n        });\n    }\n}\nexports[\"default\"] = NumberComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/number/Number.js?");
 
 /***/ }),
 
@@ -5414,7 +5414,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    var desc = Object.getOwnPropertyDescriptor(m, k);\n    if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n      desc = { enumerable: true, get: function() { return m[k]; } };\n    }\n    Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n    Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n    o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n    if (mod && mod.__esModule) return mod;\n    var result = {};\n    if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n    __setModuleDefault(result, mod);\n    return result;\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst Input_1 = __importDefault(__webpack_require__(/*! ../_classes/input/Input */ \"./lib/cjs/components/_classes/input/Input.js\"));\nconst vanilla_text_mask_1 = __webpack_require__(/*! @formio/vanilla-text-mask */ \"./node_modules/@formio/vanilla-text-mask/dist/vanillaTextMask.js\");\nconst inputmask_1 = __importDefault(__webpack_require__(/*! inputmask */ \"./node_modules/inputmask/dist/inputmask.js\"));\nconst FormioUtils = __importStar(__webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nclass TextFieldComponent extends Input_1.default {\n    static schema(...extend) {\n        return Input_1.default.schema({\n            label: 'Text Field',\n            key: 'textField',\n            type: 'textfield',\n            mask: false,\n            inputType: 'text',\n            inputFormat: 'plain',\n            inputMask: '',\n            displayMask: '',\n            tableView: true,\n            spellcheck: true,\n            truncateMultipleSpaces: false,\n            validate: {\n                minLength: '',\n                maxLength: '',\n                pattern: ''\n            }\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Text Field',\n            icon: 'terminal',\n            group: 'basic',\n            documentation: '/userguide/form-building/form-components#text-field',\n            weight: 0,\n            schema: TextFieldComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return TextFieldComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: [...super.conditionOperatorsSettings.operators, 'includes', 'notIncludes', 'endsWith', 'startsWith'], valueComponent(classComp) {\n                return Object.assign(Object.assign({}, classComp), { type: 'textfield' });\n            } });\n    }\n    static savedValueTypes(schema) {\n        return FormioUtils.getComponentSavedTypes(schema) || [FormioUtils.componentValueTypes.string];\n    }\n    get defaultSchema() {\n        return TextFieldComponent.schema();\n    }\n    get inputInfo() {\n        const info = super.inputInfo;\n        info.type = 'input';\n        if (this.component.hasOwnProperty('spellcheck')) {\n            info.attr.spellcheck = this.component.spellcheck;\n        }\n        if (this.component.mask) {\n            info.attr.type = 'password';\n        }\n        else {\n            info.attr.type = (this.component.inputType === 'password') ? 'password' : 'text';\n        }\n        info.changeEvent = (this.component.applyMaskOn === 'blur') ? 'blur' : 'input';\n        return info;\n    }\n    get emptyValue() {\n        return '';\n    }\n    constructor(component, options, data) {\n        var _a, _b, _c;\n        super(component, options, data);\n        const timezone = (((_a = this.component.widget) === null || _a === void 0 ? void 0 : _a.timezone) || this.options.timezone);\n        const displayInTimezone = (((_b = this.component.widget) === null || _b === void 0 ? void 0 : _b.displayInTimezone) || 'viewer');\n        if (((_c = this.component.widget) === null || _c === void 0 ? void 0 : _c.type) === 'calendar') {\n            this.component.widget = Object.assign(Object.assign({}, this.component.widget), { readOnly: this.options.readOnly, timezone,\n                displayInTimezone, locale: this.component.widget.locale || this.options.language, saveAs: 'text' });\n        }\n    }\n    attach(element) {\n        this.loadRefs(element, {\n            valueMaskInput: 'single',\n        });\n        return super.attach(element);\n    }\n    /**\n     * Returns the mask value object (mutates value!).\n     * @param {any} [value] - The value to convert to a mask value.\n     * @param {any} [flags] - The flags to use when converting to a mask value.\n     * @returns {*} - The value as a mask value.\n     */\n    maskValue(value, flags = {}) {\n        // Convert it into the correct format.\n        if (!value || (typeof value !== 'object')) {\n            value = {\n                value,\n                maskName: this.component.inputMasks[0].label\n            };\n        }\n        // If no value is provided, then set the defaultValue.\n        if (!value.value) {\n            const defaultValue = flags.noDefault ? this.emptyValue : this.defaultValue;\n            value.value = Array.isArray(defaultValue) ? defaultValue[0] : defaultValue;\n        }\n        return value;\n    }\n    /**\n     * Normalize the value set in the data object.\n     * @param {any} value - The value to normalize.\n     * @param {any} flags - The flags to use when normalizing the value.\n     * @returns {*} - Returns the normalized value.\n     */\n    normalizeValue(value, flags = {}) {\n        if (!this.isMultipleMasksField) {\n            return super.normalizeValue(value);\n        }\n        if (Array.isArray(value)) {\n            return super.normalizeValue(value.map((val) => this.maskValue(val, flags)));\n        }\n        return super.normalizeValue(this.maskValue(value, flags));\n    }\n    /**\n     * Sets the value at this index.\n     * @param {number} index - The index to set the value at.\n     * @param {any} value - The value to set.\n     * @param {any} [flags] - The flags to use when setting the value.\n     * @returns {void}\n     */\n    setValueAt(index, value, flags = {}) {\n        if (!this.isMultipleMasksField) {\n            return super.setValueAt(index, value, flags);\n        }\n        value = this.maskValue(value, flags);\n        const textValue = value.value || '';\n        const textInput = this.refs.mask ? this.refs.mask[index] : null;\n        const maskInput = this.refs.select ? this.refs.select[index] : null;\n        const mask = this.getMaskPattern(value.maskName);\n        if (textInput && maskInput && mask) {\n            // We need to set the maskInput (select dropdown) value before calling inputmask.setValue because, this\n            // function will trigger a \"change\" event, which was calling updateValue setting the mask type to an incorrect value.\n            maskInput.value = value.maskName;\n            if (textInput.inputmask) {\n                this.setInputMask(textInput, mask);\n                textInput.inputmask.setValue(textValue);\n            }\n            else {\n                const placeholderChar = this.placeholderChar;\n                textInput.value = (0, vanilla_text_mask_1.conformToMask)(textValue, FormioUtils.getInputMask(mask), { placeholderChar }).conformedValue;\n            }\n        }\n        else {\n            return super.setValueAt(index, textValue, flags);\n        }\n    }\n    unmaskValue(value, format = this.component.displayMask) {\n        const mask = FormioUtils.getInputMask(format, this.placeholderChar);\n        return FormioUtils.unmaskValue(value, mask, this.placeholderChar);\n    }\n    /**\n     * Returns the value at this index.\n     * @param {number} index - The index to get the value from.\n     * @returns {*} - The value at the index.\n     */\n    getValueAt(index) {\n        var _a, _b;\n        if (!this.isMultipleMasksField) {\n            const value = super.getValueAt(index);\n            const valueMask = this.component.inputMask;\n            const displayMask = this.component.displayMask;\n            // If the input has only the valueMask or the displayMask is the same as the valueMask,\n            // just return the value which is already formatted\n            if (valueMask && !displayMask || displayMask === valueMask) {\n                return value;\n            }\n            // If there is only the displayMask, return the raw (unmasked) value\n            if (displayMask && !valueMask) {\n                return this.unmaskValue(value, displayMask);\n            }\n            if (displayMask && displayMask !== valueMask) {\n                return inputmask_1.default.format(inputmask_1.default.unmask(value, displayMask), valueMask);\n            }\n            if (((_a = this.refs.valueMaskInput) === null || _a === void 0 ? void 0 : _a.mask) && this.refs.valueMaskInput.mask.textMaskInputElement) {\n                this.refs.valueMaskInput.mask.textMaskInputElement.update(value);\n                return (_b = this.refs.valueMaskInput) === null || _b === void 0 ? void 0 : _b.value;\n            }\n            return value;\n        }\n        const textInput = this.refs.mask ? this.refs.mask[index] : null;\n        const maskInput = this.refs.select ? this.refs.select[index] : null;\n        return {\n            value: textInput ? textInput.value : undefined,\n            maskName: maskInput ? maskInput.value : undefined\n        };\n    }\n    checkInputMaskValue(inputMask) {\n        let valid = true;\n        const maskValues = lodash_1.default.values(inputMask.split('').reduce((acc, el, i, mask) => {\n            var _a;\n            if (el === '{' || el === '}') {\n                if (mask[i + 1] === '{' || mask[i + 1] === '}') {\n                    valid = false;\n                }\n                acc[el] = ((_a = acc[el]) !== null && _a !== void 0 ? _a : 0) + 1;\n            }\n            return acc;\n        }, {}));\n        if (maskValues[0] !== maskValues[1]) {\n            valid = false;\n        }\n        return valid;\n    }\n    setInputMask(input, inputMask, usePlaceholder) {\n        if (this.type !== 'textfield') {\n            super.setInputMask(input, inputMask, usePlaceholder);\n            return;\n        }\n        inputMask = inputMask || this.component.displayMask || this.component.inputMask;\n        const mask = FormioUtils.getInputMask(inputMask, this.placeholderChar);\n        this.defaultMask = mask;\n        if (input && inputMask) {\n            try {\n                //remove previous mask\n                if (input.mask) {\n                    input.mask.remove();\n                }\n                if (this.checkInputMaskValue(inputMask)) {\n                    input.mask = new inputmask_1.default(inputMask, {\n                        clearMaskOnLostFocus: !!this.component.placeholder,\n                        showMaskOnHover: !this.component.placeholder,\n                        placeholder: this.placeholderChar || '',\n                    }).mask(input);\n                }\n            }\n            catch (e) {\n                console.warn(e);\n            }\n            if (mask.numeric) {\n                input.setAttribute('pattern', '\\\\d*');\n            }\n            if (this.component.placeholder) {\n                input.setAttribute('placeholder', this.component.placeholder);\n            }\n        }\n    }\n    isHtmlRenderMode() {\n        return super.isHtmlRenderMode() ||\n            ((this.options.readOnly || this.disabled) &&\n                this.component.inputFormat === 'html' &&\n                this.type === 'textfield');\n    }\n    isEmpty(value = this.dataValue) {\n        if (!this.isMultipleMasksField) {\n            return super.isEmpty((value || '').toString().trim());\n        }\n        return super.isEmpty(value) || (this.component.multiple ? value.length === 0 : (!value.maskName || !value.value));\n    }\n    truncateMultipleSpaces(value) {\n        if (value) {\n            return value.trim().replace(/\\s{2,}/g, ' ');\n        }\n        return value;\n    }\n    get validationValue() {\n        const value = super.validationValue;\n        if (value && this.component.truncateMultipleSpaces) {\n            return this.truncateMultipleSpaces(value);\n        }\n        return value;\n    }\n    beforeSubmit() {\n        let value = this.dataValue;\n        if (!this.component.truncateMultipleSpaces || !value) {\n            return Promise.resolve(value);\n        }\n        value = this.truncateMultipleSpaces(value);\n        this.dataValue = value;\n        return Promise.resolve(value).then(() => super.beforeSubmit());\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            const result = (`\n        <table border=\"1\" style=\"width:100%\">\n          <tbody>\n          <tr>\n            <th style=\"padding: 5px 10px;\">${value.maskName}</th>\n            <td style=\"width:100%;padding:5px 10px;\">${value.value}</td>\n          </tr>\n          </tbody>\n        </table>\n      `);\n            return result;\n        }\n        if (value && this.component.inputFormat === 'plain' && /<[^<>]+>/g.test(value)) {\n            value = value.replaceAll('<', '&lt;').replaceAll('>', '&gt;');\n        }\n        return super.getValueAsString(value, options);\n    }\n}\nexports[\"default\"] = TextFieldComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/textfield/TextField.js?");
+eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    var desc = Object.getOwnPropertyDescriptor(m, k);\n    if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n      desc = { enumerable: true, get: function() { return m[k]; } };\n    }\n    Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n    if (k2 === undefined) k2 = k;\n    o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n    Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n    o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n    if (mod && mod.__esModule) return mod;\n    var result = {};\n    if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n    __setModuleDefault(result, mod);\n    return result;\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst Input_1 = __importDefault(__webpack_require__(/*! ../_classes/input/Input */ \"./lib/cjs/components/_classes/input/Input.js\"));\nconst vanilla_text_mask_1 = __webpack_require__(/*! @formio/vanilla-text-mask */ \"./node_modules/@formio/vanilla-text-mask/dist/vanillaTextMask.js\");\nconst inputmask_1 = __importDefault(__webpack_require__(/*! inputmask */ \"./node_modules/inputmask/dist/inputmask.js\"));\nconst FormioUtils = __importStar(__webpack_require__(/*! ../../utils/utils */ \"./lib/cjs/utils/utils.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nclass TextFieldComponent extends Input_1.default {\n    static schema(...extend) {\n        return Input_1.default.schema({\n            label: 'Text Field',\n            key: 'textField',\n            type: 'textfield',\n            mask: false,\n            inputType: 'text',\n            inputFormat: 'plain',\n            inputMask: '',\n            displayMask: '',\n            tableView: true,\n            spellcheck: true,\n            truncateMultipleSpaces: false,\n            validate: {\n                minLength: '',\n                maxLength: '',\n                pattern: ''\n            }\n        }, ...extend);\n    }\n    static get builderInfo() {\n        return {\n            title: 'Text Field',\n            icon: 'terminal',\n            group: 'basic',\n            documentation: '/userguide/form-building/form-components#text-field',\n            weight: 0,\n            schema: TextFieldComponent.schema()\n        };\n    }\n    static get serverConditionSettings() {\n        return TextFieldComponent.conditionOperatorsSettings;\n    }\n    static get conditionOperatorsSettings() {\n        return Object.assign(Object.assign({}, super.conditionOperatorsSettings), { operators: [...super.conditionOperatorsSettings.operators, 'includes', 'notIncludes', 'endsWith', 'startsWith'], valueComponent(classComp) {\n                return Object.assign(Object.assign({}, classComp), { type: 'textfield' });\n            } });\n    }\n    static savedValueTypes(schema) {\n        return FormioUtils.getComponentSavedTypes(schema) || [FormioUtils.componentValueTypes.string];\n    }\n    get defaultSchema() {\n        return TextFieldComponent.schema();\n    }\n    get inputInfo() {\n        const info = super.inputInfo;\n        info.type = 'input';\n        if (this.component.hasOwnProperty('spellcheck')) {\n            info.attr.spellcheck = this.component.spellcheck;\n        }\n        if (this.component.mask) {\n            info.attr.type = 'password';\n        }\n        else {\n            info.attr.type = (this.component.inputType === 'password') ? 'password' : 'text';\n        }\n        info.changeEvent = (this.component.applyMaskOn === 'blur') ? 'blur' : 'input';\n        return info;\n    }\n    get emptyValue() {\n        return '';\n    }\n    constructor(component, options, data) {\n        var _a, _b, _c;\n        super(component, options, data);\n        const timezone = (((_a = this.component.widget) === null || _a === void 0 ? void 0 : _a.timezone) || this.options.timezone);\n        const displayInTimezone = (((_b = this.component.widget) === null || _b === void 0 ? void 0 : _b.displayInTimezone) || 'viewer');\n        if (((_c = this.component.widget) === null || _c === void 0 ? void 0 : _c.type) === 'calendar') {\n            this.component.widget = Object.assign(Object.assign({}, this.component.widget), { readOnly: this.options.readOnly, timezone,\n                displayInTimezone, locale: this.component.widget.locale || this.options.language, saveAs: 'text' });\n            // update originalComponent to include widget settings after component initialization \n            // originalComponent is used to restore the component (and widget) after evaluating field logic \n            this.originalComponent = FormioUtils.fastCloneDeep(this.component);\n        }\n    }\n    attach(element) {\n        this.loadRefs(element, {\n            valueMaskInput: 'single',\n        });\n        return super.attach(element);\n    }\n    /**\n     * Returns the mask value object (mutates value!).\n     * @param {any} [value] - The value to convert to a mask value.\n     * @param {any} [flags] - The flags to use when converting to a mask value.\n     * @returns {*} - The value as a mask value.\n     */\n    maskValue(value, flags = {}) {\n        // Convert it into the correct format.\n        if (!value || (typeof value !== 'object')) {\n            value = {\n                value,\n                maskName: this.component.inputMasks[0].label\n            };\n        }\n        // If no value is provided, then set the defaultValue.\n        if (!value.value) {\n            const defaultValue = flags.noDefault ? this.emptyValue : this.defaultValue;\n            value.value = Array.isArray(defaultValue) ? defaultValue[0] : defaultValue;\n        }\n        return value;\n    }\n    /**\n     * Normalize the value set in the data object.\n     * @param {any} value - The value to normalize.\n     * @param {any} flags - The flags to use when normalizing the value.\n     * @returns {*} - Returns the normalized value.\n     */\n    normalizeValue(value, flags = {}) {\n        if (!this.isMultipleMasksField) {\n            return super.normalizeValue(value);\n        }\n        if (Array.isArray(value)) {\n            return super.normalizeValue(value.map((val) => this.maskValue(val, flags)));\n        }\n        return super.normalizeValue(this.maskValue(value, flags));\n    }\n    /**\n     * Sets the value at this index.\n     * @param {number} index - The index to set the value at.\n     * @param {any} value - The value to set.\n     * @param {any} [flags] - The flags to use when setting the value.\n     * @returns {void}\n     */\n    setValueAt(index, value, flags = {}) {\n        if (!this.isMultipleMasksField) {\n            return super.setValueAt(index, value, flags);\n        }\n        value = this.maskValue(value, flags);\n        const textValue = value.value || '';\n        const textInput = this.refs.mask ? this.refs.mask[index] : null;\n        const maskInput = this.refs.select ? this.refs.select[index] : null;\n        const mask = this.getMaskPattern(value.maskName);\n        if (textInput && maskInput && mask) {\n            // We need to set the maskInput (select dropdown) value before calling inputmask.setValue because, this\n            // function will trigger a \"change\" event, which was calling updateValue setting the mask type to an incorrect value.\n            maskInput.value = value.maskName;\n            if (textInput.inputmask) {\n                this.setInputMask(textInput, mask);\n                textInput.inputmask.setValue(textValue);\n            }\n            else {\n                const placeholderChar = this.placeholderChar;\n                textInput.value = (0, vanilla_text_mask_1.conformToMask)(textValue, FormioUtils.getInputMask(mask), { placeholderChar }).conformedValue;\n            }\n        }\n        else {\n            return super.setValueAt(index, textValue, flags);\n        }\n    }\n    unmaskValue(value, format = this.component.displayMask) {\n        const mask = FormioUtils.getInputMask(format, this.placeholderChar);\n        return FormioUtils.unmaskValue(value, mask, this.placeholderChar);\n    }\n    /**\n     * Returns the value at this index.\n     * @param {number} index - The index to get the value from.\n     * @returns {*} - The value at the index.\n     */\n    getValueAt(index) {\n        var _a, _b;\n        if (!this.isMultipleMasksField) {\n            const value = super.getValueAt(index);\n            const valueMask = this.component.inputMask;\n            const displayMask = this.component.displayMask;\n            // If the input has only the valueMask or the displayMask is the same as the valueMask,\n            // just return the value which is already formatted\n            if (valueMask && !displayMask || displayMask === valueMask) {\n                return value;\n            }\n            // If there is only the displayMask, return the raw (unmasked) value\n            if (displayMask && !valueMask) {\n                return this.unmaskValue(value, displayMask);\n            }\n            if (displayMask && displayMask !== valueMask) {\n                return inputmask_1.default.format(inputmask_1.default.unmask(value, displayMask), valueMask);\n            }\n            if (((_a = this.refs.valueMaskInput) === null || _a === void 0 ? void 0 : _a.mask) && this.refs.valueMaskInput.mask.textMaskInputElement) {\n                this.refs.valueMaskInput.mask.textMaskInputElement.update(value);\n                return (_b = this.refs.valueMaskInput) === null || _b === void 0 ? void 0 : _b.value;\n            }\n            return value;\n        }\n        const textInput = this.refs.mask ? this.refs.mask[index] : null;\n        const maskInput = this.refs.select ? this.refs.select[index] : null;\n        return {\n            value: textInput ? textInput.value : undefined,\n            maskName: maskInput ? maskInput.value : undefined\n        };\n    }\n    checkInputMaskValue(inputMask) {\n        let valid = true;\n        const maskValues = lodash_1.default.values(inputMask.split('').reduce((acc, el, i, mask) => {\n            var _a;\n            if (el === '{' || el === '}') {\n                if (mask[i + 1] === '{' || mask[i + 1] === '}') {\n                    valid = false;\n                }\n                acc[el] = ((_a = acc[el]) !== null && _a !== void 0 ? _a : 0) + 1;\n            }\n            return acc;\n        }, {}));\n        if (maskValues[0] !== maskValues[1]) {\n            valid = false;\n        }\n        return valid;\n    }\n    setInputMask(input, inputMask, usePlaceholder) {\n        if (this.type !== 'textfield') {\n            super.setInputMask(input, inputMask, usePlaceholder);\n            return;\n        }\n        inputMask = inputMask || this.component.displayMask || this.component.inputMask;\n        const mask = FormioUtils.getInputMask(inputMask, this.placeholderChar);\n        this.defaultMask = mask;\n        if (input && inputMask) {\n            try {\n                //remove previous mask\n                if (input.mask) {\n                    input.mask.remove();\n                }\n                if (this.checkInputMaskValue(inputMask)) {\n                    input.mask = new inputmask_1.default(inputMask, {\n                        clearMaskOnLostFocus: !!this.component.placeholder,\n                        showMaskOnHover: !this.component.placeholder,\n                        placeholder: this.placeholderChar || '',\n                    }).mask(input);\n                }\n            }\n            catch (e) {\n                console.warn(e);\n            }\n            if (mask.numeric) {\n                input.setAttribute('pattern', '\\\\d*');\n            }\n            if (this.component.placeholder) {\n                input.setAttribute('placeholder', this.component.placeholder);\n            }\n        }\n    }\n    isHtmlRenderMode() {\n        return super.isHtmlRenderMode() ||\n            ((this.options.readOnly || this.disabled) &&\n                this.component.inputFormat === 'html' &&\n                this.type === 'textfield');\n    }\n    isEmpty(value = this.dataValue) {\n        if (!this.isMultipleMasksField) {\n            return super.isEmpty((value || '').toString().trim());\n        }\n        return super.isEmpty(value) || (this.component.multiple ? value.length === 0 : (!value.maskName || !value.value));\n    }\n    truncateMultipleSpaces(value) {\n        if (value) {\n            return value.trim().replace(/\\s{2,}/g, ' ');\n        }\n        return value;\n    }\n    get validationValue() {\n        const value = super.validationValue;\n        if (value && this.component.truncateMultipleSpaces) {\n            return this.truncateMultipleSpaces(value);\n        }\n        return value;\n    }\n    beforeSubmit() {\n        let value = this.dataValue;\n        if (!this.component.truncateMultipleSpaces || !value) {\n            return Promise.resolve(value);\n        }\n        value = this.truncateMultipleSpaces(value);\n        this.dataValue = value;\n        return Promise.resolve(value).then(() => super.beforeSubmit());\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            const result = (`\n        <table border=\"1\" style=\"width:100%\">\n          <tbody>\n          <tr>\n            <th style=\"padding: 5px 10px;\">${value.maskName}</th>\n            <td style=\"width:100%;padding:5px 10px;\">${value.value}</td>\n          </tr>\n          </tbody>\n        </table>\n      `);\n            return result;\n        }\n        if (value && this.component.inputFormat === 'plain' && /<[^<>]+>/g.test(value)) {\n            value = value.replaceAll('<', '&lt;').replaceAll('>', '&gt;');\n        }\n        return super.getValueAsString(value, options);\n    }\n}\nexports[\"default\"] = TextFieldComponent;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/textfield/TextField.js?");
 
 /***/ }),
 
@@ -6537,7 +6537,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
   \******************************************************************************************/
 /***/ (function(__unused_webpack_module, exports) {
 
-eval("Object.defineProperty(exports, \"__esModule\", ({\n  value: true\n}));\nexports[\"default\"]=function(ctx) {\nvar __t, __p = '', __j = Array.prototype.join;\nfunction print() { __p += __j.call(arguments, '') }\n__p += '<table class=\"table datagrid-table table-bordered\\n    ' +\n((__t = ( ctx.component.striped ? 'table-striped' : '')) == null ? '' : __t) +\n'\\n    ' +\n((__t = ( ctx.component.hover ? 'table-hover' : '')) == null ? '' : __t) +\n'\\n    ' +\n((__t = ( ctx.component.condensed ? 'table-sm' : '')) == null ? '' : __t) +\n'\\n    \" ';\n if (ctx.component.layoutFixed || ctx.readOnly) { ;\n__p += 'style=\"table-layout: fixed;\"';\n } ;\n__p += '>\\n  ';\n if (ctx.hasHeader) { ;\n__p += '\\n  <thead>\\n    <tr>\\n      ';\n if (ctx.component.reorder) { ;\n__p += '<th></th>';\n } ;\n__p += '\\n      ';\n ctx.columns.forEach(function(col) { ;\n__p += '\\n        <th class=\"' +\n((__t = (col.validate && col.validate.required ? 'field-required' : '')) == null ? '' : __t) +\n'\">\\n          ' +\n((__t = ( col.hideLabel ? '' : ctx.t(col.label || col.title, { _userInput: true }) )) == null ? '' : __t) +\n'\\n          ';\n if (col.tooltip) { ;\n__p += ' <i ref=\"tooltip\" tabindex=\"0\" data-title=\"' +\n((__t = (col.tooltip)) == null ? '' : __t) +\n'\" class=\"' +\n((__t = (ctx.iconClass('question-sign'))) == null ? '' : __t) +\n' text-muted\" data-tooltip=\"' +\n((__t = (col.tooltip)) == null ? '' : __t) +\n'\"></i>';\n } ;\n__p += '\\n        </th>\\n      ';\n }) ;\n__p += '\\n      ';\n if (ctx.hasExtraColumn) { ;\n__p += '\\n      <th>\\n        <span class=\"visually-hidden\">' +\n((__t = ( ctx.t('Add/Remove') )) == null ? '' : __t) +\n'</span>\\n        ';\n if (!ctx.builder && ctx.hasAddButton && ctx.hasTopSubmit) { ;\n__p += '\\n        <button class=\"btn btn-primary formio-button-add-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-addRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\">\\n          <i class=\"' +\n((__t = (ctx.iconClass('plus'))) == null ? '' : __t) +\n'\"></i>' +\n((__t = (ctx.t(ctx.component.addAnother || 'Add Another', { _userInput: true }))) == null ? '' : __t) +\n'\\n        </button>\\n        ';\n } ;\n__p += '\\n      </th>\\n      ';\n } ;\n__p += '\\n    </tr>\\n  </thead>\\n  ';\n } ;\n__p += '\\n  <tbody ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-tbody\" data-key=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\">\\n    ';\n ctx.rows.forEach(function(row, index) { ;\n__p += '\\n    ';\n if (ctx.hasGroups && ctx.groups[index]) { ;\n__p += '\\n    <tr ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-group-header\" class=\"datagrid-group-header' +\n((__t = (ctx.hasToggle ? ' clickable' : '')) == null ? '' : __t) +\n'\">\\n      <td\\n        ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-group-label\"\\n        colspan=\"' +\n((__t = (ctx.numColumns)) == null ? '' : __t) +\n'\"\\n        class=\"datagrid-group-label\">' +\n((__t = (ctx.groups[index].label)) == null ? '' : __t) +\n'</td>\\n    </tr>\\n    ';\n } ;\n__p += '\\n    <tr ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-row\">\\n      ';\n if (ctx.component.reorder) { ;\n__p += '\\n        <td>\\n          <button type=\"button\" class=\"formio-drag-button btn btn-default bi bi-list\" data-key=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\" style=\"display: block; margin: 0 auto\"></button>\\n        </td>\\n      ';\n } ;\n__p += '\\n      ';\n ctx.columns.forEach(function(col) { ;\n__p += '\\n        <td ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\" ';\n if (col.key && col.overlay && col.overlay.width) { ;\n__p += ' style=\"width: ' +\n((__t = (col.overlay.width + 'px')) == null ? '' : __t) +\n'\"';\n } ;\n__p += ' >\\n          ' +\n((__t = (row[col.key])) == null ? '' : __t) +\n'\\n        </td>\\n      ';\n }) ;\n__p += '\\n      ';\n if (ctx.hasExtraColumn) { ;\n__p += '\\n        ';\n if (ctx.hasRemoveButtons) { ;\n__p += '\\n        <td>\\n          <button type=\"button\" class=\"btn btn-secondary formio-button-remove-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-removeRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\" aria-label=\"' +\n((__t = (ctx.t('remove'))) == null ? '' : __t) +\n'\" style=\"display: block; margin: 0 auto\">\\n            <i class=\"' +\n((__t = (ctx.iconClass('remove-circle'))) == null ? '' : __t) +\n'\"></i>\\n          </button>\\n        </td>\\n        ';\n } ;\n__p += '\\n        ';\n if (ctx.canAddColumn) { ;\n__p += '\\n        <td ref=\"' +\n((__t = (ctx.key)) == null ? '' : __t) +\n'-container\" class=\"col-md-3\">\\n          ' +\n((__t = (ctx.placeholder)) == null ? '' : __t) +\n'\\n        </td>\\n        ';\n } ;\n__p += '\\n      ';\n } ;\n__p += '\\n    </tr>\\n    ';\n }) ;\n__p += '\\n  </tbody>\\n  ';\n if (!ctx.builder && ctx.hasAddButton && ctx.hasBottomSubmit) { ;\n__p += '\\n  <tfoot>\\n    <tr>\\n      <td colspan=\"' +\n((__t = (ctx.component.layoutFixed ? ctx.numColumns :  ctx.numColumns + 1)) == null ? '' : __t) +\n'\">\\n        <button class=\"btn btn-primary formio-button-add-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-addRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\">\\n          <i class=\"' +\n((__t = (ctx.iconClass('plus'))) == null ? '' : __t) +\n'\"></i> ' +\n((__t = (ctx.t(ctx.component.addAnother || 'Add Another', { _userInput: true }))) == null ? '' : __t) +\n'\\n        </button>\\n      </td>\\n    </tr>\\n  </tfoot>\\n  ';\n } ;\n__p += '\\n</table>\\n';\nreturn __p\n}\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/bootstrap/lib/cjs/templates/bootstrap5/datagrid/form.ejs.js?");
+eval("Object.defineProperty(exports, \"__esModule\", ({\n  value: true\n}));\nexports[\"default\"]=function(ctx) {\nvar __t, __p = '', __j = Array.prototype.join;\nfunction print() { __p += __j.call(arguments, '') }\n__p += '<table class=\"table datagrid-table table-bordered\\n    ' +\n((__t = ( ctx.component.striped ? 'table-striped' : '')) == null ? '' : __t) +\n'\\n    ' +\n((__t = ( ctx.component.hover ? 'table-hover' : '')) == null ? '' : __t) +\n'\\n    ' +\n((__t = ( ctx.component.condensed ? 'table-sm' : '')) == null ? '' : __t) +\n'\\n    \" ';\n if (ctx.component.layoutFixed || ctx.readOnly) { ;\n__p += 'style=\"table-layout: fixed;\"';\n } ;\n__p += '>\\n  ';\n if (ctx.hasHeader) { ;\n__p += '\\n  <thead>\\n    <tr>\\n      ';\n if (ctx.component.reorder) { ;\n__p += '<th></th>';\n } ;\n__p += '\\n      ';\n ctx.columns.forEach(function(col) { ;\n__p += '\\n        <th class=\"' +\n((__t = (col.validate && col.validate.required ? 'field-required' : '')) == null ? '' : __t) +\n'\">\\n          ' +\n((__t = ( col.hideLabel ? '' : ctx.t(col.label || col.title, { _userInput: true }) )) == null ? '' : __t) +\n'\\n          ';\n if (col.tooltip) { ;\n__p += ' <i ref=\"tooltip\" tabindex=\"0\" data-title=\"' +\n((__t = (col.tooltip)) == null ? '' : __t) +\n'\" class=\"' +\n((__t = (ctx.iconClass('question-sign'))) == null ? '' : __t) +\n' text-muted\" data-tooltip=\"' +\n((__t = (col.tooltip)) == null ? '' : __t) +\n'\"></i>';\n } ;\n__p += '\\n        </th>\\n      ';\n }) ;\n__p += '\\n      ';\n if (ctx.hasExtraColumn) { ;\n__p += '\\n      <th>\\n        <span class=\"visually-hidden\">' +\n((__t = ( ctx.t('Add/Remove') )) == null ? '' : __t) +\n'</span>\\n        ';\n if (!ctx.builder && ctx.hasAddButton && ctx.hasTopSubmit) { ;\n__p += '\\n        <button class=\"btn btn-primary formio-button-add-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-addRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\">\\n          <i class=\"' +\n((__t = (ctx.iconClass('plus'))) == null ? '' : __t) +\n'\"></i>' +\n((__t = (ctx.t(ctx.component.addAnother || 'Add Another', { _userInput: true }))) == null ? '' : __t) +\n'\\n        </button>\\n        ';\n } ;\n__p += '\\n      </th>\\n      ';\n } ;\n__p += '\\n    </tr>\\n  </thead>\\n  ';\n } ;\n__p += '\\n  <tbody ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-tbody\" data-key=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\">\\n    ';\n ctx.rows.forEach(function(row, index) { ;\n__p += '\\n    ';\n if (ctx.hasGroups && ctx.groups[index]) { ;\n__p += '\\n    <tr ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-group-header\" class=\"datagrid-group-header' +\n((__t = (ctx.hasToggle ? ' clickable' : '')) == null ? '' : __t) +\n'\">\\n      <td\\n        ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-group-label\"\\n        colspan=\"' +\n((__t = (ctx.numColumns)) == null ? '' : __t) +\n'\"\\n        class=\"datagrid-group-label\">' +\n((__t = (ctx.groups[index].label)) == null ? '' : __t) +\n'</td>\\n    </tr>\\n    ';\n } ;\n__p += '\\n    <tr ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-row\">\\n      ';\n if (ctx.component.reorder) { ;\n__p += '\\n        <td class=\"col-1\">\\n          <button type=\"button\" class=\"formio-drag-button btn btn-default bi bi-list\" data-key=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\"></button>\\n        </td>\\n      ';\n } ;\n__p += '\\n      ';\n ctx.columns.forEach(function(col) { ;\n__p += '\\n        <td ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'\" ';\n if (col.key && col.overlay && col.overlay.width) { ;\n__p += ' style=\"width: ' +\n((__t = (col.overlay.width + 'px')) == null ? '' : __t) +\n'\"';\n } ;\n__p += ' >\\n          ' +\n((__t = (row[col.key])) == null ? '' : __t) +\n'\\n        </td>\\n      ';\n }) ;\n__p += '\\n      ';\n if (ctx.hasExtraColumn) { ;\n__p += '\\n        ';\n if (ctx.hasRemoveButtons) { ;\n__p += '\\n        <td class=\"col-1\">\\n          <button type=\"button\" class=\"btn btn-secondary formio-button-remove-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-removeRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\" aria-label=\"' +\n((__t = (ctx.t('remove'))) == null ? '' : __t) +\n'\">\\n            <i class=\"' +\n((__t = (ctx.iconClass('remove-circle'))) == null ? '' : __t) +\n'\"></i>\\n          </button>\\n        </td>\\n        ';\n } ;\n__p += '\\n        ';\n if (ctx.canAddColumn) { ;\n__p += '\\n        <td ref=\"' +\n((__t = (ctx.key)) == null ? '' : __t) +\n'-container\" class=\"col-md-3\">\\n          ' +\n((__t = (ctx.placeholder)) == null ? '' : __t) +\n'\\n        </td>\\n        ';\n } ;\n__p += '\\n      ';\n } ;\n__p += '\\n    </tr>\\n    ';\n }) ;\n__p += '\\n  </tbody>\\n  ';\n if (!ctx.builder && ctx.hasAddButton && ctx.hasBottomSubmit) { ;\n__p += '\\n  <tfoot>\\n    <tr>\\n      <td colspan=\"' +\n((__t = (ctx.component.layoutFixed ? ctx.numColumns :  ctx.numColumns + 1)) == null ? '' : __t) +\n'\">\\n        <button class=\"btn btn-primary formio-button-add-row\" ref=\"' +\n((__t = (ctx.datagridKey)) == null ? '' : __t) +\n'-addRow\" tabindex=\"' +\n((__t = (ctx.tabIndex)) == null ? '' : __t) +\n'\">\\n          <i class=\"' +\n((__t = (ctx.iconClass('plus'))) == null ? '' : __t) +\n'\"></i> ' +\n((__t = (ctx.t(ctx.component.addAnother || 'Add Another', { _userInput: true }))) == null ? '' : __t) +\n'\\n        </button>\\n      </td>\\n    </tr>\\n  </tfoot>\\n  ';\n } ;\n__p += '\\n</table>\\n';\nreturn __p\n}\n\n//# sourceURL=webpack://Formio/./node_modules/@formio/bootstrap/lib/cjs/templates/bootstrap5/datagrid/form.ejs.js?");
 
 /***/ }),