@formio/js 5.1.0-dev.6056.ba6432d → 5.1.0-dev.6059.845a6e3

package/lib/cjs/components/file/File.js

@@ -109,18 +109,12 @@ class FileComponent extends Field_1.default {
         if (this.component.privateDownload) {
             fileInfo.private = true;
         }
-        // pass the component to the downloadFile method
-        return this.fileService.downloadFile(fileInfo, this.component).then((result) => result.url);
+        return this.fileService.downloadFile(fileInfo).then((result) => result.url);
     }
     get emptyValue() {
         return [];
     }
-    getValueAsString(value, options) {
-        if ((options === null || options === void 0 ? void 0 : options.review) && !this.component.uploadOnly) {
-            return lodash_1.default.map(value, (val, index) => {
-                return `<a href="${val.url || '#'}" target="_blank" data-path='${this.path}' data-fileindex='${index}'>${val.originalName}</a>`;
-            }).join(', ');
-        }
+    getValueAsString(value) {
         if (lodash_1.default.isArray(value)) {
             return lodash_1.default.map(value, 'originalName').join(', ');
         }
@@ -208,7 +202,7 @@ class FileComponent extends Field_1.default {
             this.videoStream = stream;
             const { videoPlayer } = this.refs;
             if (!videoPlayer) {
-                console.warn(this.t('videoPlayerNotFound'));
+                console.warn('Video player not found in template.');
                 this.cameraMode = false;
                 this.redraw();
                 return;
@@ -233,7 +227,7 @@ class FileComponent extends Field_1.default {
     takePicture() {
         const { videoPlayer } = this.refs;
         if (!videoPlayer) {
-            console.warn(this.t('videoPlayerNotFound'));
+            console.warn('Video player not found in template.');
             this.cameraMode = false;
             this.redraw();
             return;
@@ -633,7 +627,7 @@ class FileComponent extends Field_1.default {
             file,
             size: file.size,
             status: 'info',
-            message: this.t('waitFileProcessing'),
+            message: this.t('Processing file. Please wait...'),
             hash: '',
         };
     }
@@ -664,7 +658,7 @@ class FileComponent extends Field_1.default {
         return fileWithSameNameUploaded || fileWithSameNameUploading
             ? {
                 status: 'error',
-                message: this.t(fileWithSameNameUploading ? 'fileWithDuplicatedNameInProgress' : 'fileWithDuplicatedNameLoaded'),
+                message: this.t(`File with the same name is already ${fileWithSameNameUploading ? 'being ' : ''}uploaded`),
             }
             : {};
     }
@@ -673,7 +667,7 @@ class FileComponent extends Field_1.default {
         if (this.component.filePattern && !this.validatePattern(file, this.component.filePattern)) {
             return {
                 status: 'error',
-                message: this.t('wrongFileType', {
+                message: this.t('File is the wrong type; it must be {{ pattern }}', {
                     pattern: this.component.filePattern,
                 }),
             };
@@ -682,7 +676,7 @@ class FileComponent extends Field_1.default {
         if (this.component.fileMinSize && !this.validateMinSize(file, this.component.fileMinSize)) {
             return {
                 status: 'error',
-                message: this.t('fileTooSmall', {
+                message: this.t('File is too small; it must be at least {{ size }}', {
                     size: this.component.fileMinSize,
                 }),
             };
@@ -691,7 +685,7 @@ class FileComponent extends Field_1.default {
         if (this.component.fileMaxSize && !this.validateMaxSize(file, this.component.fileMaxSize)) {
             return {
                 status: 'error',
-                message: this.t('fileTooBig', {
+                message: this.t('File is too big; it must be at most {{ size }}', {
                     size: this.component.fileMaxSize,
                 }),
             };
@@ -703,7 +697,7 @@ class FileComponent extends Field_1.default {
         return !fileService
             ? {
                 status: 'error',
-                message: this.t('noFileService'),
+                message: this.t('File Service not provided.'),
             }
             : {};
     }
@@ -753,7 +747,7 @@ class FileComponent extends Field_1.default {
                     this.fileDropHidden = false;
                     return {
                         status: 'error',
-                        message: this.t('fileProcessingFailed'),
+                        message: this.t('File processing has been failed.'),
                     };
                 }
                 finally {
@@ -789,7 +783,7 @@ class FileComponent extends Field_1.default {
                 return this.filesToSync.filesToUpload.push(fileToSync);
             }
             if (this.autoSync) {
-                fileToSync.message = this.t('readyForUpload');
+                fileToSync.message = this.t('Ready to be uploaded into storage');
             }
             this.filesToSync.filesToUpload.push(Object.assign(Object.assign({}, fileToSync), { message: fileToSync.message, file: processedFile.file || file, url: this.interpolate(this.component.url, { file: fileToSync }), groupPermissions, groupResourceId: groupKey ? this.currentForm.submission.data[groupKey]._id : null }));
         });
@@ -822,8 +816,8 @@ class FileComponent extends Field_1.default {
     }
     prepareFileToDelete(fileInfo) {
         this.filesToSync.filesToDelete.push(Object.assign(Object.assign({}, fileInfo), { status: 'info', message: this.autoSync
-                ? this.t('readyForRemovingFromStorage')
-                : this.t('preparingFileToRemove') }));
+                ? this.t('Ready to be removed from storage')
+                : this.t('Preparing file to remove') }));
         const index = this.dataValue.findIndex(file => file.name === fileInfo.name);
         this.splice(index);
         this.redraw();
@@ -863,7 +857,7 @@ class FileComponent extends Field_1.default {
                     }
                     yield this.deleteFile(fileToSync);
                     fileToSync.status = 'success';
-                    fileToSync.message = this.t('succefullyRemoved');
+                    fileToSync.message = this.t('Succefully removed');
                 }
                 catch (response) {
                     fileToSync.status = 'error';
@@ -931,7 +925,7 @@ class FileComponent extends Field_1.default {
                     }
                     fileInfo = yield this.uploadFile(fileToSync);
                     fileToSync.status = 'success';
-                    fileToSync.message = this.t('succefullyUploaded');
+                    fileToSync.message = this.t('Succefully uploaded');
                     fileInfo.originalName = fileToSync.originalName;
                     fileInfo.hash = fileToSync.hash;
                 }
@@ -1034,7 +1028,7 @@ class FileComponent extends Field_1.default {
                 }
                 yield this.syncFiles();
                 return this.shouldSyncFiles
-                    ? Promise.reject(this.t('synchronizationFailed'))
+                    ? Promise.reject('Synchronization is failed')
                     : Promise.resolve();
             }
             catch (error) {

package/lib/cjs/components/form/Form.d.ts

@@ -13,7 +13,7 @@ export default class FormComponent extends Component {
     valueChanged: boolean | undefined;
     subForm: any;
     formSrc: any;
-    get dataReady(): any;
+    get dataReady(): Promise<any>;
     get emptyValue(): {
         data: {};
     };

package/lib/cjs/components/form/Form.js

@@ -102,8 +102,7 @@ class FormComponent extends Component_1.default {
         return this.createSubForm();
     }
     get dataReady() {
-        var _a;
-        return ((_a = this.subForm) === null || _a === void 0 ? void 0 : _a.dataReady) || this.subFormReady || Promise.resolve();
+        return this.subFormReady || Promise.resolve();
     }
     get defaultValue() {
         // Not not provide a default value unless the subform is ready so that it will initialize correctly.
@@ -218,7 +217,7 @@ class FormComponent extends Component_1.default {
     /* eslint-enable max-statements */
     render() {
         if (this.builderMode) {
-            return super.render(this.t(this.component.label || 'nestedForm'));
+            return super.render(this.component.label || 'Nested form');
         }
         const subform = this.subForm ? this.subForm.render() : this.renderTemplate('loading');
         return super.render(subform);
@@ -231,13 +230,13 @@ class FormComponent extends Component_1.default {
      */
     getValueAsString(value, options) {
         if (!value) {
-            return this.t('noDataProvided');
+            return 'No data provided';
         }
         if (!value.data && value._id) {
             return value._id;
         }
         if (!value.data || !Object.keys(value.data).length) {
-            return this.t('noDataProvided');
+            return 'No data provided';
         }
         if (options === null || options === void 0 ? void 0 : options.email) {
             let result = (`
@@ -659,7 +658,7 @@ class FormComponent extends Component_1.default {
                 : {};
             this.subForm.setUrl(submissionUrl, Object.assign(Object.assign({}, this.options), options));
             this.subForm.loadSubmission().catch((err) => {
-                console.error(this.t('subformSubmissionLoadingError', { submissionId: submission._id }), err);
+                console.error(`Unable to load subform submission ${submission._id}:`, err);
             });
         }
         else {
@@ -674,9 +673,6 @@ class FormComponent extends Component_1.default {
      */
     onSetSubFormValue(submission, flags) {
         this.subForm.setValue(submission, flags);
-        if (flags === null || flags === void 0 ? void 0 : flags.fromSubmission) {
-            this.subForm.submissionReadyResolve(submission);
-        }
     }
     isEmpty(value = this.dataValue) {
         return value === null || lodash_1.default.isEqual(value, this.emptyValue) || (this.areAllComponentsEmpty(value === null || value === void 0 ? void 0 : value.data) && !(value === null || value === void 0 ? void 0 : value._id));

package/lib/cjs/components/form/editForm/Form.edit.form.js

@@ -47,7 +47,7 @@ exports.default = [
         },
         searchField: 'title__regex',
         template: '<span>{{ item._vid }}</span>',
-        valueProperty: 'revisionId',
+        valueProperty: '_id',
         authenticate: true,
         label: 'Form Revision',
         key: 'revision',
@@ -69,7 +69,7 @@ exports.default = [
         input: true,
         weight: 20,
         key: 'reference',
-        label: 'Submit as reference',
-        tooltip: 'When "Submit as reference" is enabled, the form submission will be recorded against the Parent Form as well as the Child Form. When a submission recorded with "Submit as reference" is edited, the update is applied to each submission made against the Parent Form and Child Form.'
+        label: 'Save as reference',
+        tooltip: 'Using this option will save this field as a reference and link its value to the value of the origin record.'
     }
 ];

package/lib/cjs/components/hidden/Hidden.d.ts

@@ -10,6 +10,7 @@ export default class HiddenComponent extends Input {
     };
     get inputInfo(): any;
     labelIsHidden(): boolean;
+    get emptyValue(): string;
     setValue(value: any, flags?: {}): boolean;
 }
 import Input from '../_classes/input/Input';

package/lib/cjs/components/hidden/Hidden.js

@@ -48,7 +48,7 @@ class HiddenComponent extends Input_1.default {
         return true;
     }
     get emptyValue() {
-        return null;
+        return '';
     }
     setValue(value, flags = {}) {
         return this.updateValue(value, flags);

package/lib/cjs/components/hidden/editForm/Hidden.edit.display.js

@@ -5,14 +5,6 @@ exports.default = [
         key: 'labelPosition',
         ignore: true
     },
-    {
-        key: 'labelWidth',
-        ignore: true
-    },
-    {
-        key: 'labelMargin',
-        ignore: true
-    },
     {
         key: 'placeholder',
         ignore: true

package/lib/cjs/components/html/editForm/HTML.edit.display.js

@@ -5,14 +5,6 @@ exports.default = [
         key: 'labelPosition',
         ignore: true
     },
-    {
-        key: 'labelWidth',
-        ignore: true
-    },
-    {
-        key: 'labelMargin',
-        ignore: true
-    },
     {
         key: 'placeholder',
         ignore: true

package/lib/cjs/components/number/Number.js

@@ -56,7 +56,7 @@ class NumberComponent extends Input_1.default {
         }
         else {
             if (this.component.thousandsSeparator || ((_c = this.options.properties) === null || _c === void 0 ? void 0 : _c.thousandsSeparator) || this.options.thousandsSeparator) {
-                console.warn(this.t('noDelimiterSet'));
+                console.warn('In order for thousands separator to work properly, you must set the delimiter to true in the component json');
             }
             this.delimiter = '';
         }
@@ -170,21 +170,14 @@ class NumberComponent extends Input_1.default {
         if (typeof input === 'string') {
             input = input.split(this.delimiter).join('').replace(this.decimalSeparator, '.');
         }
-        let value;
-        if (!lodash_1.default.isNaN(input)) {
+        let value = parseFloat(input);
+        if (!lodash_1.default.isNaN(value)) {
             // Format scientific notation
-            if (/[0-9]+[eE]/.test(String(input))) {
-                // Convert to exponential notation will depend on the decimal limit set in the component
-                // Example: 1.23e-5 will be converted to 1.23e-5 if decimal limit is set to 2
-                // Example: 1.23e5 will be converted to 1.23e+5 if decimal limit is set to 2
-                // if decimal limit is 3, 1.23e5 will be converted to 1.230e+5
-                // if decimal limit is not set, 1.23e5 will be converted to 1.23000000000000000000e+5
-                value = parseFloat(input);
+            if (/e/i.test(String(value))) {
                 value = value.toExponential(this.decimalLimit);
             }
             else {
-                value = parseFloat(input);
-                value = !lodash_1.default.isNaN(value) ? String(value).replace('.', this.decimalSeparator) : null;
+                value = String(value).replace('.', this.decimalSeparator);
             }
         }
         else {

package/lib/cjs/components/number/editForm/Number.edit.display.js

@@ -13,18 +13,6 @@ exports.default = [
         key: 'allowMultipleMasks',
         ignore: true
     },
-    {
-        key: 'inputMasks',
-        ignore: true
-    },
-    {
-        key: 'widget.type',
-        ignore: true
-    },
-    {
-        key: 'widget',
-        ignore: true
-    },
     {
         key: 'showWordCount',
         ignore: true,

package/lib/cjs/components/password/editForm/Password.edit.display.js

@@ -12,17 +12,5 @@ exports.default = [
     {
         key: 'allowMultipleMasks',
         ignore: true
-    },
-    {
-        key: 'inputMasks',
-        ignore: true
-    },
-    {
-        key: 'widget.type',
-        ignore: true
-    },
-    {
-        key: 'widget',
-        ignore: true
-    },
+    }
 ];

package/lib/cjs/components/phonenumber/PhoneNumber.form.js

@@ -22,15 +22,7 @@ function default_1(...extend) {
                 {
                     key: 'showCharCount',
                     ignore: true
-                },
-                {
-                    key: 'widget.type',
-                    ignore: true
-                },
-                {
-                    key: 'widget',
-                    ignore: true
-                },
+                }
             ]
         },
         {

package/lib/cjs/components/radio/Radio.js

@@ -293,16 +293,6 @@ class RadioComponent extends ListComponent_1.default {
         if (method.toUpperCase() === 'GET') {
             body = null;
         }
-        const limit = this.component.limit || 100;
-        const skip = this.isScrollLoading ? this.selectOptions.length : 0;
-        // Allow for url interpolation.
-        url = this.sanitize(this.interpolate(url, {
-            formioBase: Formio_1.Formio.getBaseUrl(),
-            search,
-            limit,
-            skip,
-            page: Math.abs(Math.floor(skip / limit))
-        }), this.shouldSanitizeValue);
         // Set ignoreCache if it is
         options.ignoreCache = this.component.ignoreCache;
         // Make the request.

package/lib/cjs/components/recaptcha/ReCaptcha.js

@@ -58,7 +58,7 @@ class ReCaptchaComponent extends Component_1.default {
                 this.recaptchaApiReady = Formio_1.Formio.requireLibrary('googleRecaptcha', 'grecaptcha', recaptchaApiScriptUrl, true);
             }
             else {
-                console.warn(this.t('noSiteKey'));
+                console.warn('There is no Site Key specified in settings in form JSON');
             }
         }
     }
@@ -72,7 +72,7 @@ class ReCaptchaComponent extends Component_1.default {
         return __awaiter(this, void 0, void 0, function* () {
             const siteKey = (0, get_1.default)(this.root.form, 'settings.recaptcha.siteKey');
             if (!siteKey) {
-                console.warn(this.t('noSiteKey'));
+                console.warn('There is no Site Key specified in settings in form JSON');
                 return;
             }
             if (!this.recaptchaApiReady) {

package/lib/cjs/components/select/Select.d.ts

@@ -126,6 +126,7 @@ export default class SelectComponent extends ListComponent {
     get isLoadingAvailable(): any;
     onScroll(): void;
     attachRefreshOnBlur(): void;
+    addPlaceholderItem(placeholderValue: any): void;
     update(): void;
     addCurrentChoices(values: any, items: any, keyValue: any): any;
     getValueAsString(data: any, options: any): any;

package/lib/cjs/components/select/Select.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const lodash_1 = __importDefault(require("lodash"));
 const Formio_1 = require("../../Formio");
 const ListComponent_1 = __importDefault(require("../_classes/list/ListComponent"));
+const Input_1 = __importDefault(require("../_classes/input/Input"));
 const Form_1 = __importDefault(require("../../Form"));
 const utils_1 = require("../../utils/utils");
 const ChoicesWrapper_1 = __importDefault(require("../../utils/ChoicesWrapper"));
@@ -529,13 +530,13 @@ class SelectComponent extends ListComponent_1.default {
             skip,
         };
         // Allow for url interpolation.
-        url = this.sanitize(this.interpolate(url, {
+        url = this.interpolate(url, {
             formioBase: Formio_1.Formio.getBaseUrl(),
             search,
             limit,
             skip,
             page: Math.abs(Math.floor(skip / limit))
-        }), this.shouldSanitizeValue);
+        });
         // Add search capability.
         if (this.component.searchField && search) {
             const searchValue = Array.isArray(search)
@@ -592,7 +593,7 @@ class SelectComponent extends ListComponent_1.default {
             component: this.component,
             message: err.toString(),
         });
-        console.warn(this.t('loadResourcesError', { componentKey: this.key }));
+        console.warn(`Unable to load resources for ${this.key}`);
     }
     /**
      * Get the request headers for this select dropdown.
@@ -726,7 +727,7 @@ class SelectComponent extends ListComponent_1.default {
             }
         }
         else if (this.component.dataSrc === 'url' || this.component.dataSrc === 'resource') {
-            this.addOption('', `${this.t('loading')}...`);
+            this.addOption('', this.t('loading...'));
         }
     }
     get active() {
@@ -767,10 +768,10 @@ class SelectComponent extends ListComponent_1.default {
             distance: 1000,
         };
         return Object.assign({ removeItemButton: this.component.disabled ? false : lodash_1.default.get(this.component, 'removeItemButton', true), itemSelectText: '', classNames: {
-                containerOuter: ['choices', 'form-group', 'formio-choices'],
-                containerInner: this.transform('class', 'form-control ui fluid selection dropdown').split(' '),
-            }, addItemText: false, allowHTML: true, placeholder: !!this.component.placeholder, placeholderValue: placeholderValue, noResultsText: this.t('noResultsFound'), noChoicesText: this.t('noChoices'), searchPlaceholderValue: this.t('typeToSearch'), shouldSort: false, position: (this.component.dropdown || 'auto'), searchEnabled: useSearch, searchChoices: !this.component.searchField, searchFields: lodash_1.default.get(this, 'component.searchFields', ['label']), shadowRoot: this.root ? this.root.shadowRoot : null, fuseOptions: this.component.useExactSearch
-                ? Object.assign({ tokenize: true, matchAllTokens: true }, commonFuseOptions) : Object.assign({}, lodash_1.default.get(this, 'component.fuseOptions', {}), Object.assign({ include: 'score', threshold: lodash_1.default.get(this, 'component.selectThreshold', 0.3) }, commonFuseOptions)), valueComparer: lodash_1.default.isEqual, resetScrollPosition: false, duplicateItemsAllowed: false }, customOptions);
+                containerOuter: 'choices form-group formio-choices',
+                containerInner: this.transform('class', 'form-control ui fluid selection dropdown')
+            }, addItemText: false, allowHTML: true, placeholder: !!this.component.placeholder, placeholderValue: placeholderValue, noResultsText: this.t('No results found'), noChoicesText: this.t('No choices to choose from'), searchPlaceholderValue: this.t('Type to search'), shouldSort: false, position: (this.component.dropdown || 'auto'), searchEnabled: useSearch, searchChoices: !this.component.searchField, searchFields: lodash_1.default.get(this, 'component.searchFields', ['label']), shadowRoot: this.root ? this.root.shadowRoot : null, fuseOptions: this.component.useExactSearch
+                ? Object.assign({ tokenize: true, matchAllTokens: true }, commonFuseOptions) : Object.assign({}, lodash_1.default.get(this, 'component.fuseOptions', {}), Object.assign({ include: 'score', threshold: lodash_1.default.get(this, 'component.selectThreshold', 0.3) }, commonFuseOptions)), valueComparer: lodash_1.default.isEqual, resetScrollPosition: false }, customOptions);
     }
     /* eslint-disable max-statements */
     attach(element) {
@@ -836,7 +837,7 @@ class SelectComponent extends ListComponent_1.default {
                 this.choices.containerOuter.element.setAttribute('tabIndex', '-1');
                 this.addEventListener(this.choices.containerOuter.element, 'focus', () => this.focusableElement.focus());
             }
-            this.addFocusBlurEvents(this.choices.input.element);
+            Input_1.default.prototype.addFocusBlurEvents.call(this, this.focusableElement);
             if (this.itemsFromUrl && !this.component.noRefreshOnScroll) {
                 this.scrollList = this.choices.choiceList.element;
                 this.addEventListener(this.scrollList, 'scroll', () => this.onScroll());
@@ -902,6 +903,12 @@ class SelectComponent extends ListComponent_1.default {
                 this.positionDropdown();
             });
         }
+        if (this.choices && choicesOptions.placeholderValue && this.choices._isSelectOneElement) {
+            this.addPlaceholderItem(choicesOptions.placeholderValue);
+            this.addEventListener(input, 'removeItem', () => {
+                this.addPlaceholderItem(choicesOptions.placeholderValue);
+            });
+        }
         // Add value options.
         this.addValueOptions();
         this.setChoicesValue(this.dataValue);
@@ -989,6 +996,20 @@ class SelectComponent extends ListComponent_1.default {
             });
         }
     }
+    addPlaceholderItem(placeholderValue) {
+        const items = this.choices._store.activeItems;
+        if (!items.length) {
+            this.choices._addItem({
+                value: '',
+                label: placeholderValue,
+                choiceId: 0,
+                groupId: -1,
+                customProperties: null,
+                placeholder: true,
+                keyCode: null
+            });
+        }
+    }
     /* eslint-enable max-statements */
     update() {
         if (this.component.dataSrc === 'custom') {
@@ -1169,7 +1190,7 @@ class SelectComponent extends ListComponent_1.default {
             return normalize[dataType]().value;
         }
         catch (err) {
-            console.warn(this.t('failedToNormalize'), err);
+            console.warn('Failed to normalize value', err);
             return value;
         }
     }
@@ -1366,7 +1387,7 @@ class SelectComponent extends ListComponent_1.default {
                         return (JSON.stringify(normalizedOptionValue) === JSON.stringify(value));
                     }
                     catch (err) {
-                        console.warn.error(this.t('failedToCompareItems'), err);
+                        console.warn.error('Error while comparing items', err);
                         return false;
                     }
                 };
@@ -1459,7 +1480,7 @@ class SelectComponent extends ListComponent_1.default {
     asString(value, options = {}) {
         var _a;
         value = value !== null && value !== void 0 ? value : this.getValue();
-        if (options.modalPreview || this.inDataTable || options.email) {
+        if (options.modalPreview || this.inDataTable) {
             if (this.inDataTable) {
                 value = this.undoValueTyping(value);
             }

package/lib/cjs/components/select/editForm/Select.edit.data.d.ts

@@ -1099,7 +1099,6 @@ declare const _default: ({
     alwaysEnabled?: undefined;
 } | {
     key: string;
-    type: string;
     conditional: {
         json: {
             and: ({
@@ -1150,6 +1149,7 @@ declare const _default: ({
         };
     };
     data?: undefined;
+    type?: undefined;
     weight?: undefined;
     input?: undefined;
     label?: undefined;

package/lib/cjs/components/select/editForm/Select.edit.data.js

@@ -641,8 +641,8 @@ exports.default = [
         input: true,
         weight: 25,
         key: 'reference',
-        label: 'Submit as reference',
-        tooltip: 'Using this option will submit this field as a reference id and link its value to the value of the origin record.',
+        label: 'Save as reference',
+        tooltip: 'Using this option will save this field as a reference and link its value to the value of the origin record.',
         conditional: {
             json: { '===': [{ var: 'data.dataSrc' }, 'resource'] },
         },
@@ -687,7 +687,6 @@ exports.default = [
     },
     {
         key: 'selectData',
-        type: 'hidden',
         conditional: {
             json: {
                 and: [

package/lib/cjs/components/selectboxes/SelectBoxes.js

@@ -252,14 +252,14 @@ class SelectBoxesComponent extends Radio_1.default {
                     this.setInputsDisabled(false);
                 }
                 if (!isValid && maxCount && count > maxCount) {
-                    const message = this.t(this.component.maxSelectedCountMessage || 'maxSelectItems', { maxCount });
+                    const message = this.t(this.component.maxSelectedCountMessage || 'You may only select up to {{maxCount}} items', { maxCount });
                     this.errors.push({ message });
                     this.setCustomValidity(message, dirty);
                     return false;
                 }
                 else if (!isValid && minCount && count < minCount) {
                     this.setInputsDisabled(false);
-                    const message = this.t(this.component.minSelectedCountMessage || 'minSelectItems', { minCount });
+                    const message = this.t(this.component.minSelectedCountMessage || 'You must select at least {{minCount}} items', { minCount });
                     this.errors.push({ message });
                     this.setCustomValidity(message, dirty);
                     return false;

package/lib/cjs/components/signature/Signature.d.ts

@@ -24,7 +24,7 @@ export default class SignatureComponent extends Input {
     checkSize(force: any, scale: any): void;
     signaturePad: SignaturePad | null | undefined;
     observer: any;
-    getValueAsString(value: any): string;
+    getValueAsString(value: any): "" | "Yes" | "No";
     focus(): void;
     setDataToSigaturePad(): void;
 }

package/lib/cjs/components/signature/Signature.js

@@ -159,9 +159,7 @@ class SignatureComponent extends Input_1.default {
             if (this.dataValue) {
                 this.setDataToSigaturePad();
             }
-            if (!this.disabled) {
-                this.showCanvas(true);
-            }
+            this.showCanvas(true);
         }
     }
     renderElement(value, index) {
@@ -177,7 +175,7 @@ class SignatureComponent extends Input_1.default {
         return this.renderModalPreview({
             previewText: this.dataValue ?
                 `<img src=${this.dataValue} ${this._referenceAttributeName}='openModal' style="width: 100%;height: 100%;" />` :
-                this.t('clickToSign')
+                this.t('Click to Sign')
         });
     }
     attach(element) {
@@ -245,7 +243,7 @@ class SignatureComponent extends Input_1.default {
         if (lodash_1.default.isUndefined(value) && this.inDataTable) {
             return '';
         }
-        return this.t(value ? 'yes' : 'no');
+        return value ? 'Yes' : 'No';
     }
     focus() {
         this.refs.padBody.focus();