@formio/js 5.0.0-dev.5654.e25521b → 5.0.0-dev.5655.a31d680

package/dist/formio.form.js

@@ -4877,7 +4877,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 Multivalue_1 = __importDefault(__webpack_require__(/*! ../multivalue/Multivalue */ \"./lib/cjs/components/_classes/multivalue/Multivalue.js\"));\nconst utils_1 = __webpack_require__(/*! ../../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst widgets_1 = __importDefault(__webpack_require__(/*! ../../../widgets */ \"./lib/cjs/widgets/index.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nclass Input extends Multivalue_1.default {\n    constructor(component, options, data) {\n        super(component, options, data);\n        this.triggerUpdateValueAt = lodash_1.default.debounce(this.updateValueAt.bind(this), 100);\n    }\n    static schema(...extend) {\n        return Multivalue_1.default.schema({\n            widget: {\n                type: 'input'\n            }\n        }, ...extend);\n    }\n    get inputInfo() {\n        const attr = {\n            name: this.options.name,\n            type: this.component.inputType || 'text',\n            class: 'form-control',\n            lang: this.options.language\n        };\n        if (this.options.attachMode === 'builder' || this.options.building || lodash_1.default.get(this.root, 'form.settings.disableAutocomplete')) {\n            attr.autocomplete = this.autocompleteDisableAttrName;\n        }\n        if (this.component.inputMode) {\n            attr.inputmode = this.component.inputMode;\n        }\n        if (this.component.placeholder) {\n            attr.placeholder = this.getFormattedAttribute(this.component.placeholder);\n        }\n        if (this.component.tabindex) {\n            attr.tabindex = this.component.tabindex;\n        }\n        if (this.disabled) {\n            attr.disabled = 'disabled';\n        }\n        if (this.component.autocomplete) {\n            attr.autocomplete = this.component.autocomplete;\n        }\n        lodash_1.default.defaults(attr, this.component.attributes);\n        return {\n            id: this.key,\n            type: 'input',\n            changeEvent: 'input',\n            content: '',\n            attr\n        };\n    }\n    get autocompleteDisableAttrName() {\n        return 'off';\n    }\n    get maskOptions() {\n        return lodash_1.default.map(this.component.inputMasks, mask => {\n            return {\n                label: mask.label,\n                value: mask.label\n            };\n        });\n    }\n    get isMultipleMasksField() {\n        return this.component.allowMultipleMasks && !!this.component.inputMasks && !!this.component.inputMasks.length;\n    }\n    getMaskByName(maskName) {\n        const inputMask = lodash_1.default.find(this.component.inputMasks, (inputMask) => {\n            return inputMask.label === maskName;\n        });\n        return inputMask ? inputMask.mask : undefined;\n    }\n    setInputMask(input, inputMask) {\n        const mask = inputMask || this.component.displayMask || this.component.inputMask;\n        return super.setInputMask(input, mask, !this.component.placeholder);\n    }\n    getMaskOptions() {\n        return this.component.inputMasks\n            .map(mask => ({\n            label: mask.label,\n            value: mask.label,\n        }));\n    }\n    getWordCount(value) {\n        return !value ? 0 : value.trim().split(/\\s+/).length;\n    }\n    get remainingWords() {\n        const maxWords = lodash_1.default.parseInt(lodash_1.default.get(this.component, 'validate.maxWords'), 10);\n        const wordCount = this.getWordCount(this.dataValue);\n        return maxWords - wordCount;\n    }\n    get prefix() {\n        return this.component.prefix;\n    }\n    get suffix() {\n        if (this.component.widget && this.component.widget.type === 'calendar') {\n            const calendarIcon = this.renderTemplate('icon', {\n                ref: 'icon',\n                // After font-awesome would be updated to v5.x, \"clock-o\" should be replaced with \"clock\"\n                className: this.iconClass(this.component.enableDate || this.component.widget.enableDate ? 'calendar' : 'clock-o'),\n                styles: '',\n                content: ''\n            }).trim();\n            if (this.component.prefix !== calendarIcon) {\n                // converting string to HTML markup to render correctly DateTime component in portal.form.io\n                return (0, utils_1.convertStringToHTMLElement)(calendarIcon, `[${this._referenceAttributeName}=\"icon\"]`);\n            }\n        }\n        return this.component.suffix;\n    }\n    renderElement(value, index) {\n        // Double quotes cause the input value to close so replace them with html quote char.\n        if (value && typeof value === 'string') {\n            value = value.replace(/\"/g, '&quot;');\n        }\n        const info = this.inputInfo;\n        info.attr = info.attr || {};\n        info.attr.value = this.getValueAsString(this.formatValue(this.parseValue(value)))\n            .replace(/\"/g, '&quot;');\n        const valueMask = this.component.inputMask;\n        const displayMask = this.component.displayMask;\n        const hasDifferentDisplayAndSaveFormats = valueMask && displayMask && valueMask !== displayMask;\n        if (this.isMultipleMasksField) {\n            info.attr.class += ' formio-multiple-mask-input';\n        }\n        return this.isMultipleMasksField\n            ? this.renderTemplate('multipleMasksInput', {\n                input: info,\n                value,\n                index,\n                selectOptions: this.getMaskOptions() || [],\n            }, this.isHtmlRenderMode() ? 'html' : null)\n            : this.renderTemplate('input', {\n                prefix: this.prefix,\n                suffix: this.suffix,\n                input: info,\n                value: this.formatValue(this.parseValue(value)),\n                hasValueMaskInput: hasDifferentDisplayAndSaveFormats,\n                index\n            }, this.isHtmlRenderMode() ? 'html' : null);\n    }\n    setCounter(type, element, count, max) {\n        if (max) {\n            const remaining = max - count;\n            if (remaining > 0) {\n                this.removeClass(element, 'text-danger');\n            }\n            else {\n                this.addClass(element, 'text-danger');\n            }\n            this.setContent(element, this.t(`{{ remaining }} ${type} remaining.`, {\n                remaining: remaining\n            }));\n        }\n        else {\n            this.setContent(element, this.t(`{{ count }} ${type}`, {\n                count: count\n            }));\n        }\n    }\n    updateValueAt(value, flags, index) {\n        flags = flags || {};\n        if (lodash_1.default.get(this.component, 'showWordCount', false)) {\n            if (this.refs.wordcount && this.refs.wordcount[index]) {\n                const maxWords = lodash_1.default.parseInt(lodash_1.default.get(this.component, 'validate.maxWords', 0), 10);\n                this.setCounter(this.t('words'), this.refs.wordcount[index], this.getWordCount(value), maxWords);\n            }\n        }\n        if (lodash_1.default.get(this.component, 'showCharCount', false)) {\n            if (this.refs.charcount && this.refs.charcount[index]) {\n                const maxChars = lodash_1.default.parseInt(lodash_1.default.get(this.component, 'validate.maxLength', 0), 10);\n                this.setCounter(this.t('characters'), this.refs.charcount[index], value.length, maxChars);\n            }\n        }\n    }\n    getValueAt(index) {\n        const input = this.performInputMapping(this.refs.input[index]);\n        if (input && input.widget) {\n            return input.widget.getValue();\n        }\n        return input ? input.value : undefined;\n    }\n    updateValue(value, flags, index) {\n        flags = flags || {};\n        const changed = super.updateValue(value, flags);\n        this.triggerUpdateValueAt(this.dataValue, flags, index);\n        return changed;\n    }\n    parseValue(value) {\n        return value;\n    }\n    formatValue(value) {\n        return value;\n    }\n    attach(element) {\n        this.loadRefs(element, {\n            charcount: 'multiple',\n            wordcount: 'multiple',\n            prefix: 'multiple',\n            suffix: 'multiple'\n        });\n        return super.attach(element);\n    }\n    getWidget(index) {\n        index = index || 0;\n        if (this.refs.input && this.refs.input[index]) {\n            return this.refs.input[index].widget;\n        }\n        return null;\n    }\n    attachElement(element, index) {\n        super.attachElement(element, index);\n        if (element.widget) {\n            element.widget.destroy();\n        }\n        // Attach the widget.\n        let promise = Promise.resolve();\n        element.widget = this.createWidget(index);\n        if (element.widget) {\n            promise = element.widget.attach(element);\n            if (this.refs.prefix && this.refs.prefix[index]) {\n                element.widget.addPrefix(this.refs.prefix[index]);\n            }\n            if (this.refs.suffix && this.refs.suffix[index]) {\n                element.widget.addSuffix(this.refs.suffix[index]);\n            }\n        }\n        // Add focus and blur events.\n        this.addFocusBlurEvents(element);\n        if (this.options.submitOnEnter) {\n            this.addEventListener(element, 'keypress', (event) => {\n                const key = event.keyCode || event.which;\n                if (key === 13) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    this.emit('submitButton');\n                }\n            });\n        }\n        return promise;\n    }\n    /**\n     * Creates an instance of a widget for this component.\n     * @param {number} index - The index of the widget.\n     * @returns {*} - The widget instance.\n     */\n    createWidget(index) {\n        var _a, _b;\n        // Return null if no widget is found.\n        if (!this.component.widget) {\n            return null;\n        }\n        // Get the widget settings.\n        const settings = (typeof this.component.widget === 'string') ? {\n            type: this.component.widget\n        } : this.component.widget;\n        if ((_a = this.root) === null || _a === void 0 ? void 0 : _a.shadowRoot) {\n            settings.shadowRoot = (_b = this.root) === null || _b === void 0 ? void 0 : _b.shadowRoot;\n        }\n        // Make sure we have a widget.\n        if (!widgets_1.default.hasOwnProperty(settings.type)) {\n            return null;\n        }\n        // Create the widget.\n        const widget = new widgets_1.default[settings.type](settings, this.component, this, index);\n        widget.on('update', () => this.updateValue(this.getValue(), {\n            modified: true\n        }, index), true);\n        widget.on('redraw', () => this.redraw(), true);\n        return widget;\n    }\n    teardown() {\n        if (this.element && this.element.widget) {\n            this.element.widget.destroy();\n            delete this.element.widget;\n        }\n        if (this.refs && this.refs.input) {\n            for (let i = 0; i <= this.refs.input.length; i++) {\n                const widget = this.getWidget(i);\n                if (widget) {\n                    widget.destroy();\n                }\n            }\n        }\n        super.teardown();\n    }\n    detach() {\n        if (this.refs && this.refs.input) {\n            for (let i = 0; i <= this.refs.input.length; i++) {\n                const widget = this.getWidget(i);\n                if (widget) {\n                    widget.destroy();\n                }\n            }\n        }\n        this.refs.input = [];\n        super.detach();\n    }\n}\nexports[\"default\"] = Input;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/_classes/input/Input.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 Multivalue_1 = __importDefault(__webpack_require__(/*! ../multivalue/Multivalue */ \"./lib/cjs/components/_classes/multivalue/Multivalue.js\"));\nconst utils_1 = __webpack_require__(/*! ../../../utils/utils */ \"./lib/cjs/utils/utils.js\");\nconst widgets_1 = __importDefault(__webpack_require__(/*! ../../../widgets */ \"./lib/cjs/widgets/index.js\"));\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nclass Input extends Multivalue_1.default {\n    constructor(component, options, data) {\n        super(component, options, data);\n        this.triggerUpdateValueAt = lodash_1.default.debounce(this.updateValueAt.bind(this), 100);\n    }\n    static schema(...extend) {\n        return Multivalue_1.default.schema({\n            widget: {\n                type: 'input'\n            }\n        }, ...extend);\n    }\n    get inputInfo() {\n        const attr = {\n            name: this.options.name,\n            type: this.component.inputType || 'text',\n            class: 'form-control',\n            lang: this.options.language\n        };\n        if (this.options.attachMode === 'builder' || this.options.building || lodash_1.default.get(this.root, 'form.settings.disableAutocomplete')) {\n            attr.autocomplete = this.autocompleteDisableAttrName;\n        }\n        if (this.component.inputMode) {\n            attr.inputmode = this.component.inputMode;\n        }\n        if (this.component.placeholder) {\n            attr.placeholder = this.getFormattedAttribute(this.component.placeholder);\n        }\n        if (this.component.tabindex) {\n            attr.tabindex = this.component.tabindex;\n        }\n        if (this.disabled) {\n            attr.disabled = 'disabled';\n        }\n        if (this.component.autocomplete) {\n            attr.autocomplete = this.component.autocomplete;\n        }\n        lodash_1.default.defaults(attr, this.component.attributes);\n        return {\n            id: this.key,\n            type: 'input',\n            changeEvent: 'input',\n            content: '',\n            attr\n        };\n    }\n    get autocompleteDisableAttrName() {\n        return 'off';\n    }\n    get maskOptions() {\n        return lodash_1.default.map(this.component.inputMasks, mask => {\n            return {\n                label: mask.label,\n                value: mask.label\n            };\n        });\n    }\n    get isMultipleMasksField() {\n        return this.component.allowMultipleMasks && !!this.component.inputMasks && !!this.component.inputMasks.length;\n    }\n    getMaskByName(maskName) {\n        const inputMask = lodash_1.default.find(this.component.inputMasks, (inputMask) => {\n            return inputMask.label === maskName;\n        });\n        return inputMask ? inputMask.mask : undefined;\n    }\n    setInputMask(input, inputMask) {\n        const mask = inputMask || this.component.displayMask || this.component.inputMask;\n        return super.setInputMask(input, mask, !this.component.placeholder);\n    }\n    getMaskOptions() {\n        return this.component.inputMasks\n            .map(mask => ({\n            label: mask.label,\n            value: mask.label,\n        }));\n    }\n    getWordCount(value) {\n        return !value ? 0 : value.trim().split(/\\s+/).length;\n    }\n    get remainingWords() {\n        const maxWords = lodash_1.default.parseInt(lodash_1.default.get(this.component, 'validate.maxWords'), 10);\n        const wordCount = this.getWordCount(this.dataValue);\n        return maxWords - wordCount;\n    }\n    get prefix() {\n        return this.component.prefix;\n    }\n    get suffix() {\n        if (this.component.widget && this.component.widget.type === 'calendar') {\n            const calendarIcon = this.renderTemplate('icon', {\n                ref: 'icon',\n                // After font-awesome would be updated to v5.x, \"clock-o\" should be replaced with \"clock\"\n                className: this.iconClass(this.component.enableDate || this.component.widget.enableDate ? 'calendar' : 'clock-o'),\n                styles: '',\n                content: ''\n            }).trim();\n            if (this.component.prefix !== calendarIcon) {\n                // converting string to HTML markup to render correctly DateTime component in portal.form.io\n                return (0, utils_1.convertStringToHTMLElement)(calendarIcon, `[${this._referenceAttributeName}=\"icon\"]`);\n            }\n        }\n        return this.component.suffix;\n    }\n    renderElement(value, index) {\n        // Double quotes cause the input value to close so replace them with html quote char.\n        if (value && typeof value === 'string') {\n            value = value.replace(/\"/g, '&quot;');\n        }\n        const info = this.inputInfo;\n        info.attr = info.attr || {};\n        info.attr.value = this.getValueAsString(this.formatValue(this.parseValue(value)))\n            .replace(/\"/g, '&quot;');\n        const valueMask = this.component.inputMask;\n        const displayMask = this.component.displayMask;\n        const hasDifferentDisplayAndSaveFormats = valueMask && displayMask && valueMask !== displayMask;\n        if (this.isMultipleMasksField) {\n            info.attr.class += ' formio-multiple-mask-input';\n        }\n        return this.isMultipleMasksField\n            ? this.renderTemplate('multipleMasksInput', {\n                input: info,\n                value,\n                index,\n                selectOptions: this.getMaskOptions() || [],\n            }, this.isHtmlRenderMode() ? 'html' : null)\n            : this.renderTemplate('input', {\n                prefix: this.prefix,\n                suffix: this.suffix,\n                input: info,\n                value: this.formatValue(this.parseValue(value)),\n                hasValueMaskInput: hasDifferentDisplayAndSaveFormats,\n                index\n            }, this.isHtmlRenderMode() ? 'html' : null);\n    }\n    setCounter(type, element, count, max) {\n        if (max) {\n            const remaining = max - count;\n            if (remaining > 0) {\n                this.removeClass(element, 'text-danger');\n            }\n            else {\n                this.addClass(element, 'text-danger');\n            }\n            this.setContent(element, this.t(`typeRemaining`, {\n                remaining: remaining,\n                type: type\n            }));\n        }\n        else {\n            this.setContent(element, this.t(`typeCount`, {\n                count: count,\n                type: type\n            }));\n        }\n    }\n    updateValueAt(value, flags, index) {\n        flags = flags || {};\n        if (lodash_1.default.get(this.component, 'showWordCount', false)) {\n            if (this.refs.wordcount && this.refs.wordcount[index]) {\n                const maxWords = lodash_1.default.parseInt(lodash_1.default.get(this.component, 'validate.maxWords', 0), 10);\n                this.setCounter(this.t('words'), this.refs.wordcount[index], this.getWordCount(value), maxWords);\n            }\n        }\n        if (lodash_1.default.get(this.component, 'showCharCount', false)) {\n            if (this.refs.charcount && this.refs.charcount[index]) {\n                const maxChars = lodash_1.default.parseInt(lodash_1.default.get(this.component, 'validate.maxLength', 0), 10);\n                this.setCounter(this.t('characters'), this.refs.charcount[index], value.length, maxChars);\n            }\n        }\n    }\n    getValueAt(index) {\n        const input = this.performInputMapping(this.refs.input[index]);\n        if (input && input.widget) {\n            return input.widget.getValue();\n        }\n        return input ? input.value : undefined;\n    }\n    updateValue(value, flags, index) {\n        flags = flags || {};\n        const changed = super.updateValue(value, flags);\n        this.triggerUpdateValueAt(this.dataValue, flags, index);\n        return changed;\n    }\n    parseValue(value) {\n        return value;\n    }\n    formatValue(value) {\n        return value;\n    }\n    attach(element) {\n        this.loadRefs(element, {\n            charcount: 'multiple',\n            wordcount: 'multiple',\n            prefix: 'multiple',\n            suffix: 'multiple'\n        });\n        return super.attach(element);\n    }\n    getWidget(index) {\n        index = index || 0;\n        if (this.refs.input && this.refs.input[index]) {\n            return this.refs.input[index].widget;\n        }\n        return null;\n    }\n    attachElement(element, index) {\n        super.attachElement(element, index);\n        if (element.widget) {\n            element.widget.destroy();\n        }\n        // Attach the widget.\n        let promise = Promise.resolve();\n        element.widget = this.createWidget(index);\n        if (element.widget) {\n            promise = element.widget.attach(element);\n            if (this.refs.prefix && this.refs.prefix[index]) {\n                element.widget.addPrefix(this.refs.prefix[index]);\n            }\n            if (this.refs.suffix && this.refs.suffix[index]) {\n                element.widget.addSuffix(this.refs.suffix[index]);\n            }\n        }\n        // Add focus and blur events.\n        this.addFocusBlurEvents(element);\n        if (this.options.submitOnEnter) {\n            this.addEventListener(element, 'keypress', (event) => {\n                const key = event.keyCode || event.which;\n                if (key === 13) {\n                    event.preventDefault();\n                    event.stopPropagation();\n                    this.emit('submitButton');\n                }\n            });\n        }\n        return promise;\n    }\n    /**\n     * Creates an instance of a widget for this component.\n     * @param {number} index - The index of the widget.\n     * @returns {*} - The widget instance.\n     */\n    createWidget(index) {\n        var _a, _b;\n        // Return null if no widget is found.\n        if (!this.component.widget) {\n            return null;\n        }\n        // Get the widget settings.\n        const settings = (typeof this.component.widget === 'string') ? {\n            type: this.component.widget\n        } : this.component.widget;\n        if ((_a = this.root) === null || _a === void 0 ? void 0 : _a.shadowRoot) {\n            settings.shadowRoot = (_b = this.root) === null || _b === void 0 ? void 0 : _b.shadowRoot;\n        }\n        // Make sure we have a widget.\n        if (!widgets_1.default.hasOwnProperty(settings.type)) {\n            return null;\n        }\n        // Create the widget.\n        const widget = new widgets_1.default[settings.type](settings, this.component, this, index);\n        widget.on('update', () => this.updateValue(this.getValue(), {\n            modified: true\n        }, index), true);\n        widget.on('redraw', () => this.redraw(), true);\n        return widget;\n    }\n    teardown() {\n        if (this.element && this.element.widget) {\n            this.element.widget.destroy();\n            delete this.element.widget;\n        }\n        if (this.refs && this.refs.input) {\n            for (let i = 0; i <= this.refs.input.length; i++) {\n                const widget = this.getWidget(i);\n                if (widget) {\n                    widget.destroy();\n                }\n            }\n        }\n        super.teardown();\n    }\n    detach() {\n        if (this.refs && this.refs.input) {\n            for (let i = 0; i <= this.refs.input.length; i++) {\n                const widget = this.getWidget(i);\n                if (widget) {\n                    widget.destroy();\n                }\n            }\n        }\n        this.refs.input = [];\n        super.detach();\n    }\n}\nexports[\"default\"] = Input;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/components/_classes/input/Input.js?");
 
 /***/ }),
 
@@ -5482,7 +5482,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.GoogleAddressProvider = void 0;\n/* globals google */\nconst Formio_1 = __webpack_require__(/*! ../../Formio */ \"./lib/cjs/Formio.js\");\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst AddressProvider_1 = __webpack_require__(/*! ./AddressProvider */ \"./lib/cjs/providers/address/AddressProvider.js\");\n/**\n * @typedef {object} AutocompleteOptions\n * @property {string[]} fields - The fields to include in the autocomplete response.\n * @property {object} componentRestrictions - The component restrictions for the autocomplete response.\n * @property {string[]} componentRestrictions.country - The country codes to restrict the autocomplete response to.\n */\n/**\n * @typedef {object} ProviderOptions\n * @property {string} region - The region to restrict the autocomplete response to.\n * @property {string} key - The API key for Google Maps.\n * @property {AutocompleteOptions} autocompleteOptions - The options for the autocomplete functionality.\n */\n/**\n * @typedef {object} Place\n * @property {object} address_components - The address components of the place.\n * @property {string} formatted_address - The formatted address of the place.\n * @property {object} geometry - The geometry information of the place.\n * @property {string} place_id - The place ID of the place.\n * @property {object} plus_code - The plus code of the place.\n * @property {string[]} types - The types of the place.\n * @property {string} formattedPlace - The formatted place value.\n */\n/**\n * @class GoogleAddressProvider\n * @augments AddressProvider\n */\nclass GoogleAddressProvider extends AddressProvider_1.AddressProvider {\n    /**\n     * @returns {string} The name of the provider.\n     */\n    static get name() {\n        return 'google';\n    }\n    /**\n     * @returns {string} The display name of the provider.\n     */\n    static get displayName() {\n        return 'Google Maps';\n    }\n    /**\n     \n     * @param {ProviderOptions} options - The options for the provider.\n     */\n    constructor(options = {}) {\n        var _a;\n        super(options);\n        this.setAutocompleteOptions();\n        let src = 'https://maps.googleapis.com/maps/api/js?v=quarterly&libraries=places&callback=googleMapsCallback';\n        if ((_a = options.params) === null || _a === void 0 ? void 0 : _a.key) {\n            src += `&key=${options.params.key}`;\n        }\n        Formio_1.Formio.requireLibrary(this.getLibraryName(), 'google.maps.places', src);\n    }\n    /**\n     * get display value property\n     * @returns {string} The property to use for display value.\n     */\n    get displayValueProperty() {\n        return 'formattedPlace';\n    }\n    /**\n     * @returns {string} The alternative property to use for display value.\n     */\n    get alternativeDisplayValueProperty() {\n        return 'formatted_address';\n    }\n    /**\n     * @param {AutocompleteOptions} options - The autocomplete options.\n     */\n    set autocompleteOptions(options) {\n        this._autocompleteOptions = options;\n    }\n    /**\n     * @returns {AutocompleteOptions} The autocomplete options.\n     */\n    get autocompleteOptions() {\n        return this._autocompleteOptions;\n    }\n    /**\n     * Sets the autocomplete options based on the provider options.\n     \n     */\n    setAutocompleteOptions() {\n        let options = lodash_1.default.get(this.options, 'params.autocompleteOptions', {});\n        if (!lodash_1.default.isObject(options)) {\n            options = {};\n        }\n        this.addRequiredProviderOptions(options);\n        this.autocompleteOptions = options;\n    }\n    /**\n     \n     * Converts the region to autocomplete option if it exists.\n     * @param {ProviderOptions} options - The provider options.\n     */\n    beforeMergeOptions(options) {\n        // providing support of old Google Provider option\n        this.convertRegionToAutocompleteOption(options);\n    }\n    /**\n     * @returns {string} The name of the library.\n     */\n    getLibraryName() {\n        return 'googleMaps';\n    }\n    /**\n     * Converts the region to autocomplete option.\n     * @param {ProviderOptions} options - The provider options.\n     */\n    convertRegionToAutocompleteOption(options) {\n        const providerOptions = options;\n        let region = lodash_1.default.get(providerOptions, 'params.region', '');\n        if (region && !lodash_1.default.has(options, 'params.autocompleteOptions')) {\n            region = region.toUpperCase().trim();\n            // providing compatibility with ISO 3166-1 Alpha-2 county codes (for checking compatibility https://en.wikipedia.org/wiki/List_of_ISO_3166_country_codes)\n            const countryCodes = { 'UK': 'GB' };\n            if (countryCodes[region]) {\n                region = countryCodes[region];\n            }\n            lodash_1.default.set(providerOptions, 'params.autocompleteOptions.componentRestrictions.country', [region]);\n        }\n    }\n    /**\n     * @returns {string[]} The required address properties.\n     */\n    getRequiredAddressProperties() {\n        return ['address_components', 'formatted_address', 'geometry', 'place_id', 'plus_code', 'types'];\n    }\n    /**\n     * Adds the required provider options to the options.\n     * @param {AutocompleteOptions} options - The autocomplete options.\n     */\n    addRequiredProviderOptions(options) {\n        const addressProperties = this.getRequiredAddressProperties();\n        if (lodash_1.default.isArray(options.fields) && options.fields.length > 0) {\n            options.fields.forEach(optionalField => {\n                if (!addressProperties.some(addressProp => optionalField === addressProp)) {\n                    addressProperties.push(optionalField);\n                }\n            });\n        }\n        options.fields = addressProperties;\n    }\n    filterPlace(place) {\n        place = place || {};\n        const filteredPlace = {};\n        if (this.autocompleteOptions) {\n            this.autocompleteOptions.fields.forEach(field => {\n                if (place[field]) {\n                    filteredPlace[field] = place[field];\n                }\n            });\n        }\n        return filteredPlace;\n    }\n    attachAutocomplete(elem, index, onSelectAddress) {\n        Formio_1.Formio.libraryReady(this.getLibraryName()).then(() => {\n            const autocomplete = new google.maps.places.Autocomplete(elem, this.autocompleteOptions);\n            autocomplete.addListener('place_changed', () => {\n                const place = this.filterPlace(autocomplete.getPlace());\n                place.formattedPlace = lodash_1.default.get(autocomplete, 'gm_accessors_.place.se.formattedPrediction', place[this.alternativeDisplayValueProperty]);\n                onSelectAddress(place, elem, index);\n            });\n        });\n    }\n    search() {\n        return Promise.resolve();\n    }\n    makeRequest() {\n        return Promise.resolve();\n    }\n    getDisplayValue(address) {\n        const displayedProperty = lodash_1.default.has(address, this.displayValueProperty)\n            ? this.displayValueProperty\n            : this.alternativeDisplayValueProperty;\n        return lodash_1.default.get(address, displayedProperty, '');\n    }\n}\nexports.GoogleAddressProvider = GoogleAddressProvider;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/providers/address/GoogleAddressProvider.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.GoogleAddressProvider = void 0;\n/* globals google */\nconst Formio_1 = __webpack_require__(/*! ../../Formio */ \"./lib/cjs/Formio.js\");\nconst lodash_1 = __importDefault(__webpack_require__(/*! lodash */ \"./node_modules/lodash/lodash.js\"));\nconst AddressProvider_1 = __webpack_require__(/*! ./AddressProvider */ \"./lib/cjs/providers/address/AddressProvider.js\");\n/**\n * @typedef {object} AutocompleteOptions\n * @property {string[]} fields - The fields to include in the autocomplete response.\n * @property {object} componentRestrictions - The component restrictions for the autocomplete response.\n * @property {string[]} componentRestrictions.country - The country codes to restrict the autocomplete response to.\n */\n/**\n * @typedef {object} ProviderOptions\n * @property {string} region - The region to restrict the autocomplete response to.\n * @property {string} key - The API key for Google Maps.\n * @property {AutocompleteOptions} autocompleteOptions - The options for the autocomplete functionality.\n */\n/**\n * @typedef {object} Place\n * @property {object} address_components - The address components of the place.\n * @property {string} formatted_address - The formatted address of the place.\n * @property {object} geometry - The geometry information of the place.\n * @property {string} place_id - The place ID of the place.\n * @property {object} plus_code - The plus code of the place.\n * @property {string[]} types - The types of the place.\n * @property {string} formattedPlace - The formatted place value.\n */\n/**\n * @class GoogleAddressProvider\n * @augments AddressProvider\n */\nclass GoogleAddressProvider extends AddressProvider_1.AddressProvider {\n    /**\n     * @returns {string} The name of the provider.\n     */\n    static get name() {\n        return 'google';\n    }\n    /**\n     * @returns {string} The display name of the provider.\n     */\n    static get displayName() {\n        return 'Google Maps';\n    }\n    /**\n     \n     * @param {ProviderOptions} options - The options for the provider.\n     */\n    constructor(options = {}) {\n        var _a;\n        super(options);\n        this.setAutocompleteOptions();\n        let src = 'https://maps.googleapis.com/maps/api/js?v=quarterly&libraries=places&loading=async&callback=googleMapsCallback';\n        if ((_a = options.params) === null || _a === void 0 ? void 0 : _a.key) {\n            src += `&key=${options.params.key}`;\n        }\n        Formio_1.Formio.requireLibrary(this.getLibraryName(), 'google.maps.places', src);\n    }\n    /**\n     * get display value property\n     * @returns {string} The property to use for display value.\n     */\n    get displayValueProperty() {\n        return 'formattedPlace';\n    }\n    /**\n     * @returns {string} The alternative property to use for display value.\n     */\n    get alternativeDisplayValueProperty() {\n        return 'formatted_address';\n    }\n    /**\n     * @param {AutocompleteOptions} options - The autocomplete options.\n     */\n    set autocompleteOptions(options) {\n        this._autocompleteOptions = options;\n    }\n    /**\n     * @returns {AutocompleteOptions} The autocomplete options.\n     */\n    get autocompleteOptions() {\n        return this._autocompleteOptions;\n    }\n    /**\n     * Sets the autocomplete options based on the provider options.\n     \n     */\n    setAutocompleteOptions() {\n        let options = lodash_1.default.get(this.options, 'params.autocompleteOptions', {});\n        if (!lodash_1.default.isObject(options)) {\n            options = {};\n        }\n        this.addRequiredProviderOptions(options);\n        this.autocompleteOptions = options;\n    }\n    /**\n     \n     * Converts the region to autocomplete option if it exists.\n     * @param {ProviderOptions} options - The provider options.\n     */\n    beforeMergeOptions(options) {\n        // providing support of old Google Provider option\n        this.convertRegionToAutocompleteOption(options);\n    }\n    /**\n     * @returns {string} The name of the library.\n     */\n    getLibraryName() {\n        return 'googleMaps';\n    }\n    /**\n     * Converts the region to autocomplete option.\n     * @param {ProviderOptions} options - The provider options.\n     */\n    convertRegionToAutocompleteOption(options) {\n        const providerOptions = options;\n        let region = lodash_1.default.get(providerOptions, 'params.region', '');\n        if (region && !lodash_1.default.has(options, 'params.autocompleteOptions')) {\n            region = region.toUpperCase().trim();\n            // providing compatibility with ISO 3166-1 Alpha-2 county codes (for checking compatibility https://en.wikipedia.org/wiki/List_of_ISO_3166_country_codes)\n            const countryCodes = { 'UK': 'GB' };\n            if (countryCodes[region]) {\n                region = countryCodes[region];\n            }\n            lodash_1.default.set(providerOptions, 'params.autocompleteOptions.componentRestrictions.country', [region]);\n        }\n    }\n    /**\n     * @returns {string[]} The required address properties.\n     */\n    getRequiredAddressProperties() {\n        return ['address_components', 'formatted_address', 'geometry', 'place_id', 'plus_code', 'types'];\n    }\n    /**\n     * Adds the required provider options to the options.\n     * @param {AutocompleteOptions} options - The autocomplete options.\n     */\n    addRequiredProviderOptions(options) {\n        const addressProperties = this.getRequiredAddressProperties();\n        if (lodash_1.default.isArray(options.fields) && options.fields.length > 0) {\n            options.fields.forEach(optionalField => {\n                if (!addressProperties.some(addressProp => optionalField === addressProp)) {\n                    addressProperties.push(optionalField);\n                }\n            });\n        }\n        options.fields = addressProperties;\n    }\n    filterPlace(place) {\n        place = place || {};\n        const filteredPlace = {};\n        if (this.autocompleteOptions) {\n            this.autocompleteOptions.fields.forEach(field => {\n                if (place[field]) {\n                    filteredPlace[field] = place[field];\n                }\n            });\n        }\n        return filteredPlace;\n    }\n    attachAutocomplete(elem, index, onSelectAddress) {\n        Formio_1.Formio.libraryReady(this.getLibraryName()).then(() => {\n            const autocomplete = new google.maps.places.Autocomplete(elem, this.autocompleteOptions);\n            autocomplete.addListener('place_changed', () => {\n                const place = this.filterPlace(autocomplete.getPlace());\n                place.formattedPlace = lodash_1.default.get(autocomplete, 'gm_accessors_.place.se.formattedPrediction', place[this.alternativeDisplayValueProperty]);\n                onSelectAddress(place, elem, index);\n            });\n        });\n    }\n    search() {\n        return Promise.resolve();\n    }\n    makeRequest() {\n        return Promise.resolve();\n    }\n    getDisplayValue(address) {\n        const displayedProperty = lodash_1.default.has(address, this.displayValueProperty)\n            ? this.displayValueProperty\n            : this.alternativeDisplayValueProperty;\n        return lodash_1.default.get(address, displayedProperty, '');\n    }\n}\nexports.GoogleAddressProvider = GoogleAddressProvider;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/providers/address/GoogleAddressProvider.js?");
 
 /***/ }),
 
@@ -5680,7 +5680,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
 /***/ (function(__unused_webpack_module, exports) {
 
 "use strict";
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports[\"default\"] = {\n    unsavedRowsError: 'Please save all rows before proceeding.',\n    invalidRowsError: 'Please correct invalid rows before proceeding.',\n    invalidRowError: 'Invalid row. Please correct it or delete.',\n    invalidOption: '{{field}} is an invalid value.',\n    invalidDay: '{{field}} is not a valid day.',\n    alertMessageWithLabel: '{{label}}: {{message}}',\n    alertMessage: '{{message}}',\n    complete: 'Submission Complete',\n    error: 'Please fix the following errors before submitting.',\n    errorListHotkey: 'Press Ctrl + Alt + X to go back to the error list.',\n    errorsListNavigationMessage: 'Click to navigate to the field with following error.',\n    submitError: 'Please check the form and correct all errors before submitting.',\n    required: '{{field}} is required',\n    unique: '{{field}} must be unique',\n    array: '{{field}} must be an array',\n    array_nonempty: '{{field}} must be a non-empty array', // eslint-disable-line camelcase\n    nonarray: '{{field}} must not be an array',\n    select: '{{field}} contains an invalid selection',\n    pattern: '{{field}} does not match the pattern {{pattern}}',\n    minLength: '{{field}} must have at least {{length}} characters.',\n    maxLength: '{{field}} must have no more than {{length}} characters.',\n    minWords: '{{field}} must have at least {{length}} words.',\n    maxWords: '{{field}} must have no more than {{length}} words.',\n    min: '{{field}} cannot be less than {{min}}.',\n    max: '{{field}} cannot be greater than {{max}}.',\n    maxDate: '{{field}} should not contain date after {{- maxDate}}',\n    minDate: '{{field}} should not contain date before {{- minDate}}',\n    maxYear: '{{field}} should not contain year greater than {{maxYear}}',\n    minYear: '{{field}} should not contain year less than {{minYear}}',\n    minSelectedCount: 'You must select at least {{minCount}} items',\n    maxSelectedCount: 'You may only select up to {{maxCount}} items',\n    invalid_email: '{{field}} must be a valid email.', // eslint-disable-line camelcase\n    invalid_url: '{{field}} must be a valid url.', // eslint-disable-line camelcase\n    invalid_regex: '{{field}} does not match the pattern {{regex}}.', // eslint-disable-line camelcase\n    invalid_date: '{{field}} is not a valid date.', // eslint-disable-line camelcase\n    invalid_day: '{{field}} is not a valid day.', // eslint-disable-line camelcase\n    invalidValueProperty: 'Invalid Value Property',\n    mask: '{{field}} does not match the mask.',\n    valueIsNotAvailable: '{{ field }} is an invalid value.',\n    stripe: '{{stripe}}',\n    month: 'Month',\n    day: 'Day',\n    year: 'Year',\n    january: 'January',\n    february: 'February',\n    march: 'March',\n    april: 'April',\n    may: 'May',\n    june: 'June',\n    july: 'July',\n    august: 'August',\n    september: 'September',\n    october: 'October',\n    november: 'November',\n    december: 'December',\n    next: 'Next',\n    previous: 'Previous',\n    cancel: 'Cancel',\n    submit: 'Submit Form',\n    confirmCancel: 'Are you sure you want to cancel?',\n    saveDraftInstanceError: 'Cannot save draft because there is no formio instance.',\n    saveDraftAuthError: 'Cannot save draft unless a user is authenticated.',\n    restoreDraftInstanceError: 'Cannot restore draft because there is no formio instance.',\n    saveDraftError: 'Unable to save draft.',\n    restoreDraftError: 'Unable to restore draft.',\n    time: 'Invalid time',\n    cancelButtonAriaLabel: 'Cancel button. Click to reset the form',\n    previousButtonAriaLabel: 'Previous button. Click to go back to the previous tab',\n    nextButtonAriaLabel: 'Next button. Click to go to the next tab',\n    submitButtonAriaLabel: 'Submit Form button. Click to submit the form',\n    reCaptchaTokenValidationError: 'ReCAPTCHA: Token validation error',\n    reCaptchaTokenNotSpecifiedError: 'ReCAPTCHA: Token is not specified in submission',\n    apiKey: 'API Key is not unique: {{key}}'\n};\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/translations/en.js?");
+eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports[\"default\"] = {\n    unsavedRowsError: 'Please save all rows before proceeding.',\n    invalidRowsError: 'Please correct invalid rows before proceeding.',\n    invalidRowError: 'Invalid row. Please correct it or delete.',\n    invalidOption: '{{field}} is an invalid value.',\n    invalidDay: '{{field}} is not a valid day.',\n    alertMessageWithLabel: '{{label}}: {{message}}',\n    alertMessage: '{{message}}',\n    complete: 'Submission Complete',\n    error: 'Please fix the following errors before submitting.',\n    errorListHotkey: 'Press Ctrl + Alt + X to go back to the error list.',\n    errorsListNavigationMessage: 'Click to navigate to the field with following error.',\n    submitError: 'Please check the form and correct all errors before submitting.',\n    required: '{{field}} is required',\n    unique: '{{field}} must be unique',\n    array: '{{field}} must be an array',\n    array_nonempty: '{{field}} must be a non-empty array', // eslint-disable-line camelcase\n    nonarray: '{{field}} must not be an array',\n    select: '{{field}} contains an invalid selection',\n    pattern: '{{field}} does not match the pattern {{pattern}}',\n    minLength: '{{field}} must have at least {{length}} characters.',\n    maxLength: '{{field}} must have no more than {{length}} characters.',\n    minWords: '{{field}} must have at least {{length}} words.',\n    maxWords: '{{field}} must have no more than {{length}} words.',\n    min: '{{field}} cannot be less than {{min}}.',\n    max: '{{field}} cannot be greater than {{max}}.',\n    maxDate: '{{field}} should not contain date after {{- maxDate}}',\n    minDate: '{{field}} should not contain date before {{- minDate}}',\n    maxYear: '{{field}} should not contain year greater than {{maxYear}}',\n    minYear: '{{field}} should not contain year less than {{minYear}}',\n    minSelectedCount: 'You must select at least {{minCount}} items',\n    maxSelectedCount: 'You may only select up to {{maxCount}} items',\n    invalid_email: '{{field}} must be a valid email.', // eslint-disable-line camelcase\n    invalid_url: '{{field}} must be a valid url.', // eslint-disable-line camelcase\n    invalid_regex: '{{field}} does not match the pattern {{regex}}.', // eslint-disable-line camelcase\n    invalid_date: '{{field}} is not a valid date.', // eslint-disable-line camelcase\n    invalid_day: '{{field}} is not a valid day.', // eslint-disable-line camelcase\n    invalidValueProperty: 'Invalid Value Property',\n    mask: '{{field}} does not match the mask.',\n    valueIsNotAvailable: '{{ field }} is an invalid value.',\n    stripe: '{{stripe}}',\n    month: 'Month',\n    day: 'Day',\n    year: 'Year',\n    january: 'January',\n    february: 'February',\n    march: 'March',\n    april: 'April',\n    may: 'May',\n    june: 'June',\n    july: 'July',\n    august: 'August',\n    september: 'September',\n    october: 'October',\n    november: 'November',\n    december: 'December',\n    next: 'Next',\n    previous: 'Previous',\n    cancel: 'Cancel',\n    submit: 'Submit Form',\n    confirmCancel: 'Are you sure you want to cancel?',\n    saveDraftInstanceError: 'Cannot save draft because there is no formio instance.',\n    saveDraftAuthError: 'Cannot save draft unless a user is authenticated.',\n    restoreDraftInstanceError: 'Cannot restore draft because there is no formio instance.',\n    saveDraftError: 'Unable to save draft.',\n    restoreDraftError: 'Unable to restore draft.',\n    time: 'Invalid time',\n    cancelButtonAriaLabel: 'Cancel button. Click to reset the form',\n    previousButtonAriaLabel: 'Previous button. Click to go back to the previous tab',\n    nextButtonAriaLabel: 'Next button. Click to go to the next tab',\n    submitButtonAriaLabel: 'Submit Form button. Click to submit the form',\n    reCaptchaTokenValidationError: 'ReCAPTCHA: Token validation error',\n    reCaptchaTokenNotSpecifiedError: 'ReCAPTCHA: Token is not specified in submission',\n    apiKey: 'API Key is not unique: {{key}}',\n    typeRemaining: '{{ remaining }} {{ type }} remaining.',\n    typeCount: '{{ count }} {{ type }}'\n};\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/translations/en.js?");
 
 /***/ }),
 
@@ -5691,7 +5691,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.KEY_CODES = void 0;\nconst choices_js_1 = __importDefault(__webpack_require__(/*! @formio/choices.js */ \"./node_modules/@formio/choices.js/public/assets/scripts/choices.js\"));\n/**\n * TODO: REMOVE THIS ONCE THE PULL REQUEST HAS BEEN RESOLVED.\n *\n * https://github.com/jshjohnson/Choices/pull/788\n *\n * This is intentionally not part of the extended class, since other components use Choices and need this fix as well.\n * @type {Choices._generatePlaceholderValue}\n * @private\n */\nchoices_js_1.default.prototype._generatePlaceholderValue = function () {\n    if (this._isSelectElement && this.passedElement.placeholderOption) {\n        const { placeholderOption } = this.passedElement;\n        return placeholderOption ? placeholderOption.text : false;\n    }\n    const { placeholder, placeholderValue } = this.config;\n    const { element: { dataset }, } = this.passedElement;\n    if (placeholder) {\n        if (placeholderValue) {\n            return placeholderValue;\n        }\n        if (dataset.placeholder) {\n            return dataset.placeholder;\n        }\n    }\n    return false;\n};\nexports.KEY_CODES = {\n    BACK_KEY: 46,\n    DELETE_KEY: 8,\n    TAB_KEY: 9,\n    ENTER_KEY: 13,\n    A_KEY: 65,\n    ESC_KEY: 27,\n    UP_KEY: 38,\n    DOWN_KEY: 40,\n    PAGE_UP_KEY: 33,\n    PAGE_DOWN_KEY: 34,\n};\nclass ChoicesWrapper extends choices_js_1.default {\n    constructor(...args) {\n        super(...args);\n        this._onTabKey = this._onTabKey.bind(this);\n        this.isDirectionUsing = false;\n        this.shouldOpenDropDown = true;\n    }\n    _onTouchEnd(event) {\n        var target = (event || event.touches[0]).target;\n        var touchWasWithinContainer = this._wasTap && this.containerOuter.element.contains(target);\n        if (touchWasWithinContainer) {\n            var containerWasExactTarget = target === this.containerOuter.element || target === this.containerInner.element;\n            if (containerWasExactTarget) {\n                if (this._isTextElement) {\n                    this.input.focus();\n                }\n                else if (this._isSelectMultipleElement) {\n                    this.input.focus();\n                    this.showDropdown();\n                }\n            }\n            // Prevents focus event firing\n            event.stopPropagation();\n        }\n        this._wasTap = true;\n    }\n    _handleButtonAction(activeItems, element) {\n        if (!this._isSelectOneElement) {\n            return super._handleButtonAction(activeItems, element);\n        }\n        if (!activeItems ||\n            !element ||\n            !this.config.removeItems ||\n            !this.config.removeItemButton) {\n            return;\n        }\n        super._handleButtonAction(activeItems, element);\n    }\n    _onEnterKey(args) {\n        // Prevent dropdown form opening when removeItemButton was pressed using 'Enter' on keyboard\n        if (args.event.target.className === 'choices__button') {\n            this.shouldOpenDropDown = false;\n        }\n        super._onEnterKey(args);\n    }\n    _onDirectionKey(...args) {\n        if (!this._isSelectOneElement) {\n            return super._onDirectionKey(...args);\n        }\n        this.isDirectionUsing = true;\n        super._onDirectionKey(...args);\n        this.onSelectValue(...args);\n        clearTimeout(this.timeout);\n        this.timeout = setTimeout(() => {\n            this.isDirectionUsing = false;\n        }, 250);\n    }\n    _onTabKey({ activeItems, hasActiveDropdown }) {\n        if (hasActiveDropdown) {\n            this._selectHighlightedChoice(activeItems);\n        }\n    }\n    _selectHighlightedChoice() {\n        const highlightedChoice = this.dropdown.getChild(`.${this.config.classNames.highlightedState}`);\n        if (highlightedChoice) {\n            const id = highlightedChoice.dataset.id;\n            const choice = id && this._store.getChoiceById(id);\n            this._addItem({\n                value: choice.value,\n                label: choice.label,\n                choiceId: choice.id,\n                groupId: choice.groupId,\n                customProperties: choice.customProperties,\n                placeholder: choice.placeholder,\n                keyCode: choice.keyCode\n            });\n            this._triggerChange(choice.value);\n        }\n        event.preventDefault();\n    }\n    _onKeyDown(event) {\n        if (!this._isSelectOneElement) {\n            return super._onKeyDown(event);\n        }\n        const { target, keyCode, ctrlKey, metaKey } = event;\n        if (target !== this.input.element &&\n            !this.containerOuter.element.contains(target)) {\n            return;\n        }\n        const activeItems = this._store.activeItems;\n        const hasFocusedInput = this.input.isFocussed;\n        const hasActiveDropdown = this.dropdown.isActive;\n        const hasItems = this.itemList.hasChildren;\n        const keyString = String.fromCharCode(keyCode);\n        const { BACK_KEY, DELETE_KEY, TAB_KEY, ENTER_KEY, A_KEY, ESC_KEY, UP_KEY, DOWN_KEY, PAGE_UP_KEY, PAGE_DOWN_KEY, } = exports.KEY_CODES;\n        const hasCtrlDownKeyPressed = ctrlKey || metaKey;\n        // If a user is typing and the dropdown is not active\n        if (!hasActiveDropdown && !this._isTextElement && /[a-zA-Z0-9-_ ]/.test(keyString)) {\n            const currentValue = this.input.element.value;\n            this.input.element.value = currentValue ? `${currentValue}${keyString}` : keyString;\n            this.showDropdown();\n        }\n        // Map keys to key actions\n        const keyDownActions = {\n            [A_KEY]: this._onAKey,\n            [TAB_KEY]: this._onTabKey,\n            [ENTER_KEY]: this._onEnterKey,\n            [ESC_KEY]: this._onEscapeKey,\n            [UP_KEY]: this._onDirectionKey,\n            [PAGE_UP_KEY]: this._onDirectionKey,\n            [DOWN_KEY]: this._onDirectionKey,\n            [PAGE_DOWN_KEY]: this._onDirectionKey,\n            [DELETE_KEY]: this._onDeleteKey,\n            [BACK_KEY]: this._onDeleteKey,\n        };\n        // If keycode has a function, run it\n        if (keyDownActions[keyCode]) {\n            keyDownActions[keyCode]({\n                event,\n                target,\n                keyCode,\n                metaKey,\n                activeItems,\n                hasFocusedInput,\n                hasActiveDropdown,\n                hasItems,\n                hasCtrlDownKeyPressed,\n            });\n        }\n    }\n    onSelectValue({ event, activeItems, hasActiveDropdown }) {\n        if (hasActiveDropdown) {\n            this._selectHighlightedChoice(activeItems);\n        }\n        else if (this._isSelectOneElement) {\n            this.showDropdown();\n            event.preventDefault();\n        }\n    }\n    showDropdown(...args) {\n        if (!this.shouldOpenDropDown) {\n            this.shouldOpenDropDown = true;\n            return;\n        }\n        super.showDropdown(...args);\n    }\n    hideDropdown(...args) {\n        if (this.isDirectionUsing) {\n            return;\n        }\n        super.hideDropdown(...args);\n    }\n    _onBlur(...args) {\n        if (this._isScrollingOnIe) {\n            return;\n        }\n        super._onBlur(...args);\n    }\n}\nexports[\"default\"] = ChoicesWrapper;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/utils/ChoicesWrapper.js?");
+eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n    return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.KEY_CODES = void 0;\nconst choices_js_1 = __importDefault(__webpack_require__(/*! @formio/choices.js */ \"./node_modules/@formio/choices.js/public/assets/scripts/choices.js\"));\n/**\n * TODO: REMOVE THIS ONCE THE PULL REQUEST HAS BEEN RESOLVED.\n *\n * https://github.com/jshjohnson/Choices/pull/788\n *\n * This is intentionally not part of the extended class, since other components use Choices and need this fix as well.\n * @type {Choices._generatePlaceholderValue}\n * @private\n */\nchoices_js_1.default.prototype._generatePlaceholderValue = function () {\n    if (this._isSelectElement && this.passedElement.placeholderOption) {\n        const { placeholderOption } = this.passedElement;\n        return placeholderOption ? placeholderOption.text : false;\n    }\n    const { placeholder, placeholderValue } = this.config;\n    const { element: { dataset }, } = this.passedElement;\n    if (placeholder) {\n        if (placeholderValue) {\n            return placeholderValue;\n        }\n        if (dataset.placeholder) {\n            return dataset.placeholder;\n        }\n    }\n    return false;\n};\nexports.KEY_CODES = {\n    BACK_KEY: 46,\n    DELETE_KEY: 8,\n    TAB_KEY: 9,\n    ENTER_KEY: 13,\n    A_KEY: 65,\n    ESC_KEY: 27,\n    UP_KEY: 38,\n    DOWN_KEY: 40,\n    PAGE_UP_KEY: 33,\n    PAGE_DOWN_KEY: 34,\n};\nclass ChoicesWrapper extends choices_js_1.default {\n    constructor(...args) {\n        super(...args);\n        this._onTabKey = this._onTabKey.bind(this);\n        this.isDirectionUsing = false;\n        this.shouldOpenDropDown = true;\n    }\n    _onTouchEnd(event) {\n        var target = (event || event.touches[0]).target;\n        var touchWasWithinContainer = this._wasTap && this.containerOuter.element.contains(target);\n        if (touchWasWithinContainer) {\n            var containerWasExactTarget = target === this.containerOuter.element || target === this.containerInner.element;\n            if (containerWasExactTarget) {\n                if (this._isTextElement) {\n                    this.input.focus();\n                }\n                else if (this._isSelectMultipleElement) {\n                    this.input.focus();\n                    this.showDropdown();\n                }\n            }\n            // Prevents focus event firing\n            event.stopPropagation();\n        }\n        this._wasTap = true;\n    }\n    _handleButtonAction(activeItems, element) {\n        if (!this._isSelectOneElement) {\n            return super._handleButtonAction(activeItems, element);\n        }\n        if (!activeItems ||\n            !element ||\n            !this.config.removeItems ||\n            !this.config.removeItemButton) {\n            return;\n        }\n        super._handleButtonAction(activeItems, element);\n    }\n    _onEnterKey(args) {\n        // Prevent dropdown form opening when removeItemButton was pressed using 'Enter' on keyboard\n        if (args.event.target.className === 'choices__button') {\n            this.shouldOpenDropDown = false;\n        }\n        super._onEnterKey(args);\n    }\n    _onDirectionKey(...args) {\n        if (!this._isSelectOneElement) {\n            return super._onDirectionKey(...args);\n        }\n        this.isDirectionUsing = true;\n        super._onDirectionKey(...args);\n        this.onSelectValue(...args);\n        clearTimeout(this.timeout);\n        this.timeout = setTimeout(() => {\n            this.isDirectionUsing = false;\n        }, 250);\n    }\n    _onTabKey({ activeItems, hasActiveDropdown }) {\n        if (hasActiveDropdown) {\n            this._selectHighlightedChoice(activeItems);\n        }\n    }\n    _selectHighlightedChoice(activeItems) {\n        const highlightedChoice = this.dropdown.getChild(`.${this.config.classNames.highlightedState}`);\n        if (highlightedChoice) {\n            this._handleChoiceAction(activeItems, highlightedChoice);\n        }\n        event.preventDefault();\n    }\n    _onKeyDown(event) {\n        if (!this._isSelectOneElement) {\n            return super._onKeyDown(event);\n        }\n        const { target, keyCode, ctrlKey, metaKey } = event;\n        if (target !== this.input.element &&\n            !this.containerOuter.element.contains(target)) {\n            return;\n        }\n        const activeItems = this._store.activeItems;\n        const hasFocusedInput = this.input.isFocussed;\n        const hasActiveDropdown = this.dropdown.isActive;\n        const hasItems = this.itemList.hasChildren;\n        const keyString = String.fromCharCode(keyCode);\n        const { BACK_KEY, DELETE_KEY, TAB_KEY, ENTER_KEY, A_KEY, ESC_KEY, UP_KEY, DOWN_KEY, PAGE_UP_KEY, PAGE_DOWN_KEY, } = exports.KEY_CODES;\n        const hasCtrlDownKeyPressed = ctrlKey || metaKey;\n        // If a user is typing and the dropdown is not active\n        if (!hasActiveDropdown && !this._isTextElement && /[a-zA-Z0-9-_ ]/.test(keyString)) {\n            const currentValue = this.input.element.value;\n            this.input.element.value = currentValue ? `${currentValue}${keyString}` : keyString;\n            this.showDropdown();\n        }\n        // Map keys to key actions\n        const keyDownActions = {\n            [A_KEY]: this._onAKey,\n            [TAB_KEY]: this._onTabKey,\n            [ENTER_KEY]: this._onEnterKey,\n            [ESC_KEY]: this._onEscapeKey,\n            [UP_KEY]: this._onDirectionKey,\n            [PAGE_UP_KEY]: this._onDirectionKey,\n            [DOWN_KEY]: this._onDirectionKey,\n            [PAGE_DOWN_KEY]: this._onDirectionKey,\n            [DELETE_KEY]: this._onDeleteKey,\n            [BACK_KEY]: this._onDeleteKey,\n        };\n        // If keycode has a function, run it\n        if (keyDownActions[keyCode]) {\n            keyDownActions[keyCode]({\n                event,\n                target,\n                keyCode,\n                metaKey,\n                activeItems,\n                hasFocusedInput,\n                hasActiveDropdown,\n                hasItems,\n                hasCtrlDownKeyPressed,\n            });\n        }\n    }\n    onSelectValue({ event, activeItems, hasActiveDropdown }) {\n        if (hasActiveDropdown) {\n            this._selectHighlightedChoice(activeItems);\n        }\n        else if (this._isSelectOneElement) {\n            this.showDropdown();\n            event.preventDefault();\n        }\n    }\n    showDropdown(...args) {\n        if (!this.shouldOpenDropDown) {\n            this.shouldOpenDropDown = true;\n            return;\n        }\n        super.showDropdown(...args);\n    }\n    hideDropdown(...args) {\n        if (this.isDirectionUsing) {\n            return;\n        }\n        super.hideDropdown(...args);\n    }\n    _onBlur(...args) {\n        if (this._isScrollingOnIe) {\n            return;\n        }\n        super._onBlur(...args);\n    }\n}\nexports[\"default\"] = ChoicesWrapper;\n\n\n//# sourceURL=webpack://Formio/./lib/cjs/utils/ChoicesWrapper.js?");
 
 /***/ }),