@syncfusion/ej2-vue-inputs 24.2.9 → 25.1.37

package/dist/es6/ej2-vue-inputs.es5.js

@@ -1,4 +1,4 @@
-import { ColorPicker, MaskedTextBox, NumericTextBox, Rating, Signature, Slider, TextBox, Uploader } from '@syncfusion/ej2-inputs';
+import { ColorPicker, MaskedTextBox, NumericTextBox, Rating, Signature, Slider, TextArea, TextBox, Uploader } from '@syncfusion/ej2-inputs';
 import { ComponentBase, getProps, gh, isExecute, vueDefineComponent } from '@syncfusion/ej2-vue-base';
 import { getValue, isNullOrUndefined, isUndefined } from '@syncfusion/ej2-base';
 
@@ -172,7 +172,7 @@ var TextBoxPlugin = {
     }
 };
 
-var properties$1 = ['isLazyUpdate', 'plugins', 'cssClass', 'currency', 'currencyCode', 'decimals', 'enablePersistence', 'enableRtl', 'enabled', 'floatLabelType', 'format', 'htmlAttributes', 'locale', 'max', 'min', 'placeholder', 'readonly', 'showClearButton', 'showSpinButton', 'step', 'strictMode', 'validateDecimalOnType', 'value', 'width', 'blur', 'change', 'created', 'destroyed', 'focus'];
+var properties$1 = ['isLazyUpdate', 'plugins', 'columnsCount', 'cssClass', 'enablePersistence', 'enableRtl', 'enabled', 'floatLabelType', 'htmlAttributes', 'locale', 'maxLength', 'placeholder', 'readonly', 'resizeMode', 'rowsCount', 'showClearButton', 'value', 'width', 'blur', 'change', 'created', 'destroyed', 'focus', 'input'];
 var modelProps$1 = ['value'];
 var testProp$1 = getProps({ props: properties$1 });
 var props$1 = testProp$1[0];
@@ -184,13 +184,13 @@ for (var _i$1 = 0, modelProps_1$1 = modelProps$1; _i$1 < modelProps_1$1.length;
     emitProbs$1.push('update:' + props_1$1);
 }
 /**
- * Represents the Essential JS 2 VueJS NumericTextBox Component
+ * Represents the Essential JS 2 VueJS TextArea Component
  * ```html
- * <ejs-numerictextbox v-bind:value='value'></ejs-numerictextbox>
+ * <ejs-textarea v-bind:value='value'></ejs-textarea>
  * ```
  */
-var NumericTextBoxComponent = vueDefineComponent({
-    name: 'NumericTextBoxComponent',
+var TextAreaComponent = vueDefineComponent({
+    name: 'TextAreaComponent',
     mixins: [ComponentBase],
     props: props$1,
     watch: watch$1,
@@ -199,7 +199,7 @@ var NumericTextBoxComponent = vueDefineComponent({
     provide: function () { return { custom: this.custom }; },
     data: function () {
         return {
-            ej2Instances: new NumericTextBox({}),
+            ej2Instances: new TextArea({}),
             propKeys: properties$1,
             models: modelProps$1,
             hasChildDirective: false,
@@ -225,7 +225,7 @@ var NumericTextBoxComponent = vueDefineComponent({
         if (!isNullOrUndefined(this.$slots.default)) {
             slots = !isExecute ? this.$slots.default() : this.$slots.default;
         }
-        return h('input', slots);
+        return h('textarea', slots);
     },
     methods: {
         clearTemplate: function (templateNames) {
@@ -318,8 +318,8 @@ var NumericTextBoxComponent = vueDefineComponent({
         custom: function () {
             this.updated();
         },
-        decrement: function (step) {
-            return this.ej2Instances.decrement(step);
+        addAttributes: function (attributes) {
+            return this.ej2Instances.addAttributes(attributes);
         },
         focusIn: function () {
             return this.ej2Instances.focusIn();
@@ -327,22 +327,19 @@ var NumericTextBoxComponent = vueDefineComponent({
         focusOut: function () {
             return this.ej2Instances.focusOut();
         },
-        getText: function () {
-            return this.ej2Instances.getText();
-        },
-        increment: function (step) {
-            return this.ej2Instances.increment(step);
+        removeAttributes: function (attributes) {
+            return this.ej2Instances.removeAttributes(attributes);
         },
     }
 });
-var NumericTextBoxPlugin = {
-    name: 'ejs-numerictextbox',
+var TextAreaPlugin = {
+    name: 'ejs-textarea',
     install: function (Vue) {
-        Vue.component(NumericTextBoxPlugin.name, NumericTextBoxComponent);
+        Vue.component(TextAreaPlugin.name, TextAreaComponent);
     }
 };
 
-var properties$2 = ['isLazyUpdate', 'plugins', 'cssClass', 'customCharacters', 'enablePersistence', 'enableRtl', 'enabled', 'floatLabelType', 'htmlAttributes', 'locale', 'mask', 'placeholder', 'promptChar', 'readonly', 'showClearButton', 'value', 'width', 'blur', 'change', 'created', 'destroyed', 'focus'];
+var properties$2 = ['isLazyUpdate', 'plugins', 'cssClass', 'currency', 'currencyCode', 'decimals', 'enablePersistence', 'enableRtl', 'enabled', 'floatLabelType', 'format', 'htmlAttributes', 'locale', 'max', 'min', 'placeholder', 'readonly', 'showClearButton', 'showSpinButton', 'step', 'strictMode', 'validateDecimalOnType', 'value', 'width', 'blur', 'change', 'created', 'destroyed', 'focus'];
 var modelProps$2 = ['value'];
 var testProp$2 = getProps({ props: properties$2 });
 var props$2 = testProp$2[0];
@@ -354,13 +351,13 @@ for (var _i$2 = 0, modelProps_1$2 = modelProps$2; _i$2 < modelProps_1$2.length;
     emitProbs$2.push('update:' + props_1$2);
 }
 /**
- * Represents the Essential JS 2 VueJS MaskedTextBox Component
+ * Represents the Essential JS 2 VueJS NumericTextBox Component
  * ```html
- * <ejs-maskedtextbox v-bind:value='value'></ejs-maskedtextbox>
+ * <ejs-numerictextbox v-bind:value='value'></ejs-numerictextbox>
  * ```
  */
-var MaskedTextBoxComponent = vueDefineComponent({
-    name: 'MaskedTextBoxComponent',
+var NumericTextBoxComponent = vueDefineComponent({
+    name: 'NumericTextBoxComponent',
     mixins: [ComponentBase],
     props: props$2,
     watch: watch$2,
@@ -369,7 +366,7 @@ var MaskedTextBoxComponent = vueDefineComponent({
     provide: function () { return { custom: this.custom }; },
     data: function () {
         return {
-            ej2Instances: new MaskedTextBox({}),
+            ej2Instances: new NumericTextBox({}),
             propKeys: properties$2,
             models: modelProps$2,
             hasChildDirective: false,
@@ -488,25 +485,31 @@ var MaskedTextBoxComponent = vueDefineComponent({
         custom: function () {
             this.updated();
         },
+        decrement: function (step) {
+            return this.ej2Instances.decrement(step);
+        },
         focusIn: function () {
             return this.ej2Instances.focusIn();
         },
         focusOut: function () {
             return this.ej2Instances.focusOut();
         },
-        getMaskedValue: function () {
-            return this.ej2Instances.getMaskedValue();
+        getText: function () {
+            return this.ej2Instances.getText();
+        },
+        increment: function (step) {
+            return this.ej2Instances.increment(step);
         },
     }
 });
-var MaskedTextBoxPlugin = {
-    name: 'ejs-maskedtextbox',
+var NumericTextBoxPlugin = {
+    name: 'ejs-numerictextbox',
     install: function (Vue) {
-        Vue.component(MaskedTextBoxPlugin.name, MaskedTextBoxComponent);
+        Vue.component(NumericTextBoxPlugin.name, NumericTextBoxComponent);
     }
 };
 
-var properties$3 = ['isLazyUpdate', 'plugins', 'colorRange', 'cssClass', 'customValues', 'enableAnimation', 'enableHtmlSanitizer', 'enablePersistence', 'enableRtl', 'enabled', 'limits', 'locale', 'max', 'min', 'orientation', 'readonly', 'showButtons', 'step', 'ticks', 'tooltip', 'type', 'value', 'width', 'change', 'changed', 'created', 'renderedTicks', 'renderingTicks', 'tooltipChange'];
+var properties$3 = ['isLazyUpdate', 'plugins', 'cssClass', 'customCharacters', 'enablePersistence', 'enableRtl', 'enabled', 'floatLabelType', 'htmlAttributes', 'locale', 'mask', 'placeholder', 'promptChar', 'readonly', 'showClearButton', 'value', 'width', 'blur', 'change', 'created', 'destroyed', 'focus'];
 var modelProps$3 = ['value'];
 var testProp$3 = getProps({ props: properties$3 });
 var props$3 = testProp$3[0];
@@ -518,13 +521,13 @@ for (var _i$3 = 0, modelProps_1$3 = modelProps$3; _i$3 < modelProps_1$3.length;
     emitProbs$3.push('update:' + props_1$3);
 }
 /**
- * Represents the VueJS Slider Component.
+ * Represents the Essential JS 2 VueJS MaskedTextBox Component
  * ```html
- * <ejs-slider :value='value'></ejs-slider>
+ * <ejs-maskedtextbox v-bind:value='value'></ejs-maskedtextbox>
  * ```
  */
-var SliderComponent = vueDefineComponent({
-    name: 'SliderComponent',
+var MaskedTextBoxComponent = vueDefineComponent({
+    name: 'MaskedTextBoxComponent',
     mixins: [ComponentBase],
     props: props$3,
     watch: watch$3,
@@ -533,7 +536,7 @@ var SliderComponent = vueDefineComponent({
     provide: function () { return { custom: this.custom }; },
     data: function () {
         return {
-            ej2Instances: new Slider({}),
+            ej2Instances: new MaskedTextBox({}),
             propKeys: properties$3,
             models: modelProps$3,
             hasChildDirective: false,
@@ -553,6 +556,170 @@ var SliderComponent = vueDefineComponent({
         this.ej2Instances.clearTemplate = this.clearTemplate;
         this.updated = this.updated;
     },
+    render: function (createElement) {
+        var h = !isExecute ? gh : createElement;
+        var slots = null;
+        if (!isNullOrUndefined(this.$slots.default)) {
+            slots = !isExecute ? this.$slots.default() : this.$slots.default;
+        }
+        return h('input', slots);
+    },
+    methods: {
+        clearTemplate: function (templateNames) {
+            if (!templateNames) {
+                templateNames = Object.keys(this.templateCollection || {});
+            }
+            if (templateNames.length && this.templateCollection) {
+                for (var _i = 0, templateNames_1 = templateNames; _i < templateNames_1.length; _i++) {
+                    var tempName = templateNames_1[_i];
+                    var elementCollection = this.templateCollection[tempName];
+                    if (elementCollection && elementCollection.length) {
+                        for (var _a = 0, elementCollection_1 = elementCollection; _a < elementCollection_1.length; _a++) {
+                            var ele = elementCollection_1[_a];
+                            var destroy = getValue('__vue__.$destroy', ele);
+                            if (destroy) {
+                                ele.__vue__.$destroy();
+                            }
+                            if (ele.innerHTML) {
+                                ele.innerHTML = '';
+                            }
+                        }
+                        delete this.templateCollection[tempName];
+                    }
+                }
+            }
+        },
+        setProperties: function (prop, muteOnChange) {
+            var _this = this;
+            if (this.isVue3) {
+                this.models = !this.models ? this.ej2Instances.referModels : this.models;
+            }
+            if (this.ej2Instances && this.ej2Instances._setProperties) {
+                this.ej2Instances._setProperties(prop, muteOnChange);
+            }
+            if (prop && this.models && this.models.length) {
+                Object.keys(prop).map(function (key) {
+                    _this.models.map(function (model) {
+                        if ((key === model) && !(/datasource/i.test(key))) {
+                            if (_this.isVue3) {
+                                _this.ej2Instances.vueInstance.$emit('update:' + key, prop[key]);
+                            }
+                            else {
+                                _this.$emit('update:' + key, prop[key]);
+                                _this.$emit('modelchanged', prop[key]);
+                            }
+                        }
+                    });
+                });
+            }
+        },
+        trigger: function (eventName, eventProp, successHandler) {
+            if (!isExecute) {
+                this.models = !this.models ? this.ej2Instances.referModels : this.models;
+            }
+            if ((eventName === 'change' || eventName === 'input') && this.models && (this.models.length !== 0)) {
+                var key = this.models.toString().match(/checked|value/) || [];
+                var propKey = key[0];
+                if (eventProp && key && !isUndefined(eventProp[propKey])) {
+                    if (!isExecute) {
+                        this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
+                        this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
+                        this.ej2Instances.vueInstance.$emit('update:modelValue', eventProp[propKey]);
+                    }
+                    else {
+                        if (eventName === 'change' || (this.$props && !this.$props.isLazyUpdate)) {
+                            this.$emit('update:' + propKey, eventProp[propKey]);
+                            this.$emit('modelchanged', eventProp[propKey]);
+                        }
+                    }
+                }
+            }
+            else if ((eventName === 'actionBegin' && eventProp.requestType === 'dateNavigate') && this.models && (this.models.length !== 0)) {
+                var key = this.models.toString().match(/currentView|selectedDate/) || [];
+                var propKey = key[0];
+                if (eventProp && key && !isUndefined(eventProp[propKey])) {
+                    if (!isExecute) {
+                        this.ej2Instances.vueInstance.$emit('update:' + propKey, eventProp[propKey]);
+                        this.ej2Instances.vueInstance.$emit('modelchanged', eventProp[propKey]);
+                    }
+                    else {
+                        this.$emit('update:' + propKey, eventProp[propKey]);
+                        this.$emit('modelchanged', eventProp[propKey]);
+                    }
+                }
+            }
+            if ((this.ej2Instances && this.ej2Instances._trigger)) {
+                this.ej2Instances._trigger(eventName, eventProp, successHandler);
+            }
+        },
+        custom: function () {
+            this.updated();
+        },
+        focusIn: function () {
+            return this.ej2Instances.focusIn();
+        },
+        focusOut: function () {
+            return this.ej2Instances.focusOut();
+        },
+        getMaskedValue: function () {
+            return this.ej2Instances.getMaskedValue();
+        },
+    }
+});
+var MaskedTextBoxPlugin = {
+    name: 'ejs-maskedtextbox',
+    install: function (Vue) {
+        Vue.component(MaskedTextBoxPlugin.name, MaskedTextBoxComponent);
+    }
+};
+
+var properties$4 = ['isLazyUpdate', 'plugins', 'colorRange', 'cssClass', 'customValues', 'enableAnimation', 'enableHtmlSanitizer', 'enablePersistence', 'enableRtl', 'enabled', 'limits', 'locale', 'max', 'min', 'orientation', 'readonly', 'showButtons', 'step', 'ticks', 'tooltip', 'type', 'value', 'width', 'change', 'changed', 'created', 'renderedTicks', 'renderingTicks', 'tooltipChange'];
+var modelProps$4 = ['value'];
+var testProp$4 = getProps({ props: properties$4 });
+var props$4 = testProp$4[0];
+var watch$4 = testProp$4[1];
+var emitProbs$4 = Object.keys(watch$4);
+emitProbs$4.push('modelchanged', 'update:modelValue');
+for (var _i$4 = 0, modelProps_1$4 = modelProps$4; _i$4 < modelProps_1$4.length; _i$4++) {
+    var props_1$4 = modelProps_1$4[_i$4];
+    emitProbs$4.push('update:' + props_1$4);
+}
+/**
+ * Represents the VueJS Slider Component.
+ * ```html
+ * <ejs-slider :value='value'></ejs-slider>
+ * ```
+ */
+var SliderComponent = vueDefineComponent({
+    name: 'SliderComponent',
+    mixins: [ComponentBase],
+    props: props$4,
+    watch: watch$4,
+    emits: emitProbs$4,
+    model: { event: 'modelchanged' },
+    provide: function () { return { custom: this.custom }; },
+    data: function () {
+        return {
+            ej2Instances: new Slider({}),
+            propKeys: properties$4,
+            models: modelProps$4,
+            hasChildDirective: false,
+            hasInjectedModules: false,
+            tagMapper: {},
+            tagNameMapper: {},
+            isVue3: !isExecute,
+            templateCollection: {},
+        };
+    },
+    created: function () {
+        this.ej2Instances._trigger = this.ej2Instances.trigger;
+        this.ej2Instances.trigger = this.trigger;
+        this.bindProperties();
+        this.ej2Instances._setProperties = this.ej2Instances.setProperties;
+        this.ej2Instances.setProperties = this.setProperties;
+        this.ej2Instances.clearTemplate = this.clearTemplate;
+        this.updated = this.updated;
+    },
     render: function (createElement) {
         var h = !isExecute ? gh : createElement;
         var slots = null;
@@ -726,16 +893,16 @@ var UploadedFilesPlugin = {
     }
 };
 
-var properties$4 = ['isLazyUpdate', 'plugins', 'allowedExtensions', 'asyncSettings', 'autoUpload', 'buttons', 'cssClass', 'directoryUpload', 'dropArea', 'dropEffect', 'enableHtmlSanitizer', 'enablePersistence', 'enableRtl', 'enabled', 'files', 'htmlAttributes', 'locale', 'maxFileSize', 'minFileSize', 'multiple', 'sequentialUpload', 'showFileList', 'template', 'actionComplete', 'beforeRemove', 'beforeUpload', 'canceling', 'change', 'chunkFailure', 'chunkSuccess', 'chunkUploading', 'clearing', 'created', 'failure', 'fileListRendering', 'pausing', 'progress', 'removing', 'rendering', 'resuming', 'selected', 'success', 'uploading'];
-var modelProps$4 = [];
-var testProp$4 = getProps({ props: properties$4 });
-var props$4 = testProp$4[0];
-var watch$4 = testProp$4[1];
-var emitProbs$4 = Object.keys(watch$4);
-emitProbs$4.push('modelchanged', 'update:modelValue');
-for (var _i$4 = 0, modelProps_1$4 = modelProps$4; _i$4 < modelProps_1$4.length; _i$4++) {
-    var props_1$4 = modelProps_1$4[_i$4];
-    emitProbs$4.push('update:' + props_1$4);
+var properties$5 = ['isLazyUpdate', 'plugins', 'allowedExtensions', 'asyncSettings', 'autoUpload', 'buttons', 'cssClass', 'directoryUpload', 'dropArea', 'dropEffect', 'enableHtmlSanitizer', 'enablePersistence', 'enableRtl', 'enabled', 'files', 'htmlAttributes', 'locale', 'maxFileSize', 'minFileSize', 'multiple', 'sequentialUpload', 'showFileList', 'template', 'actionComplete', 'beforeRemove', 'beforeUpload', 'canceling', 'change', 'chunkFailure', 'chunkSuccess', 'chunkUploading', 'clearing', 'created', 'failure', 'fileListRendering', 'pausing', 'progress', 'removing', 'rendering', 'resuming', 'selected', 'success', 'uploading'];
+var modelProps$5 = [];
+var testProp$5 = getProps({ props: properties$5 });
+var props$5 = testProp$5[0];
+var watch$5 = testProp$5[1];
+var emitProbs$5 = Object.keys(watch$5);
+emitProbs$5.push('modelchanged', 'update:modelValue');
+for (var _i$5 = 0, modelProps_1$5 = modelProps$5; _i$5 < modelProps_1$5.length; _i$5++) {
+    var props_1$5 = modelProps_1$5[_i$5];
+    emitProbs$5.push('update:' + props_1$5);
 }
 /**
  * Represents the Essential JS 2 VueJS Uploader Component
@@ -746,15 +913,15 @@ for (var _i$4 = 0, modelProps_1$4 = modelProps$4; _i$4 < modelProps_1$4.length;
 var UploaderComponent = vueDefineComponent({
     name: 'UploaderComponent',
     mixins: [ComponentBase],
-    props: props$4,
-    watch: watch$4,
-    emits: emitProbs$4,
+    props: props$5,
+    watch: watch$5,
+    emits: emitProbs$5,
     provide: function () { return { custom: this.custom }; },
     data: function () {
         return {
             ej2Instances: new Uploader({}),
-            propKeys: properties$4,
-            models: modelProps$4,
+            propKeys: properties$5,
+            models: modelProps$5,
             hasChildDirective: true,
             hasInjectedModules: false,
             tagMapper: { "e-files": "e-uploadedfiles" },
@@ -877,16 +1044,16 @@ var UploaderPlugin = {
     }
 };
 
-var properties$5 = ['isLazyUpdate', 'plugins', 'columns', 'createPopupOnClick', 'cssClass', 'disabled', 'enableOpacity', 'enablePersistence', 'enableRtl', 'inline', 'locale', 'mode', 'modeSwitcher', 'noColor', 'presetColors', 'showButtons', 'value', 'beforeClose', 'beforeModeSwitch', 'beforeOpen', 'beforeTileRender', 'change', 'created', 'onModeSwitch', 'open', 'select'];
-var modelProps$5 = ['value'];
-var testProp$5 = getProps({ props: properties$5 });
-var props$5 = testProp$5[0];
-var watch$5 = testProp$5[1];
-var emitProbs$5 = Object.keys(watch$5);
-emitProbs$5.push('modelchanged', 'update:modelValue');
-for (var _i$5 = 0, modelProps_1$5 = modelProps$5; _i$5 < modelProps_1$5.length; _i$5++) {
-    var props_1$5 = modelProps_1$5[_i$5];
-    emitProbs$5.push('update:' + props_1$5);
+var properties$6 = ['isLazyUpdate', 'plugins', 'columns', 'createPopupOnClick', 'cssClass', 'disabled', 'enableOpacity', 'enablePersistence', 'enableRtl', 'inline', 'locale', 'mode', 'modeSwitcher', 'noColor', 'presetColors', 'showButtons', 'value', 'beforeClose', 'beforeModeSwitch', 'beforeOpen', 'beforeTileRender', 'change', 'created', 'onModeSwitch', 'open', 'select'];
+var modelProps$6 = ['value'];
+var testProp$6 = getProps({ props: properties$6 });
+var props$6 = testProp$6[0];
+var watch$6 = testProp$6[1];
+var emitProbs$6 = Object.keys(watch$6);
+emitProbs$6.push('modelchanged', 'update:modelValue');
+for (var _i$6 = 0, modelProps_1$6 = modelProps$6; _i$6 < modelProps_1$6.length; _i$6++) {
+    var props_1$6 = modelProps_1$6[_i$6];
+    emitProbs$6.push('update:' + props_1$6);
 }
 /**
  * Represents the Essential JS 2 VueJS ColorPicker Component
@@ -897,16 +1064,16 @@ for (var _i$5 = 0, modelProps_1$5 = modelProps$5; _i$5 < modelProps_1$5.length;
 var ColorPickerComponent = vueDefineComponent({
     name: 'ColorPickerComponent',
     mixins: [ComponentBase],
-    props: props$5,
-    watch: watch$5,
-    emits: emitProbs$5,
+    props: props$6,
+    watch: watch$6,
+    emits: emitProbs$6,
     model: { event: 'modelchanged' },
     provide: function () { return { custom: this.custom }; },
     data: function () {
         return {
             ej2Instances: new ColorPicker({}),
-            propKeys: properties$5,
-            models: modelProps$5,
+            propKeys: properties$6,
+            models: modelProps$6,
             hasChildDirective: false,
             hasInjectedModules: false,
             tagMapper: {},
@@ -1041,16 +1208,16 @@ var ColorPickerPlugin = {
     }
 };
 
-var properties$6 = ['isLazyUpdate', 'plugins', 'backgroundColor', 'backgroundImage', 'disabled', 'enablePersistence', 'enableRtl', 'isReadOnly', 'locale', 'maxStrokeWidth', 'minStrokeWidth', 'saveWithBackground', 'strokeColor', 'velocity', 'beforeSave', 'change', 'created'];
-var modelProps$6 = [];
-var testProp$6 = getProps({ props: properties$6 });
-var props$6 = testProp$6[0];
-var watch$6 = testProp$6[1];
-var emitProbs$6 = Object.keys(watch$6);
-emitProbs$6.push('modelchanged', 'update:modelValue');
-for (var _i$6 = 0, modelProps_1$6 = modelProps$6; _i$6 < modelProps_1$6.length; _i$6++) {
-    var props_1$6 = modelProps_1$6[_i$6];
-    emitProbs$6.push('update:' + props_1$6);
+var properties$7 = ['isLazyUpdate', 'plugins', 'backgroundColor', 'backgroundImage', 'disabled', 'enablePersistence', 'enableRtl', 'isReadOnly', 'locale', 'maxStrokeWidth', 'minStrokeWidth', 'saveWithBackground', 'strokeColor', 'velocity', 'beforeSave', 'change', 'created'];
+var modelProps$7 = [];
+var testProp$7 = getProps({ props: properties$7 });
+var props$7 = testProp$7[0];
+var watch$7 = testProp$7[1];
+var emitProbs$7 = Object.keys(watch$7);
+emitProbs$7.push('modelchanged', 'update:modelValue');
+for (var _i$7 = 0, modelProps_1$7 = modelProps$7; _i$7 < modelProps_1$7.length; _i$7++) {
+    var props_1$7 = modelProps_1$7[_i$7];
+    emitProbs$7.push('update:' + props_1$7);
 }
 /**
  * Represents the Essential JS 2 VueJS Signature Component
@@ -1061,15 +1228,15 @@ for (var _i$6 = 0, modelProps_1$6 = modelProps$6; _i$6 < modelProps_1$6.length;
 var SignatureComponent = vueDefineComponent({
     name: 'SignatureComponent',
     mixins: [ComponentBase],
-    props: props$6,
-    watch: watch$6,
-    emits: emitProbs$6,
+    props: props$7,
+    watch: watch$7,
+    emits: emitProbs$7,
     provide: function () { return { custom: this.custom }; },
     data: function () {
         return {
             ej2Instances: new Signature({}),
-            propKeys: properties$6,
-            models: modelProps$6,
+            propKeys: properties$7,
+            models: modelProps$7,
             hasChildDirective: false,
             hasInjectedModules: false,
             tagMapper: {},
@@ -1193,16 +1360,16 @@ var SignaturePlugin = {
     }
 };
 
-var properties$7 = ['isLazyUpdate', 'plugins', 'allowReset', 'cssClass', 'disabled', 'emptyTemplate', 'enableAnimation', 'enablePersistence', 'enableRtl', 'enableSingleSelection', 'fullTemplate', 'itemsCount', 'labelPosition', 'labelTemplate', 'locale', 'min', 'precision', 'readOnly', 'showLabel', 'showTooltip', 'tooltipTemplate', 'value', 'visible', 'beforeItemRender', 'created', 'onItemHover', 'valueChanged'];
-var modelProps$7 = ['value'];
-var testProp$7 = getProps({ props: properties$7 });
-var props$7 = testProp$7[0];
-var watch$7 = testProp$7[1];
-var emitProbs$7 = Object.keys(watch$7);
-emitProbs$7.push('modelchanged', 'update:modelValue');
-for (var _i$7 = 0, modelProps_1$7 = modelProps$7; _i$7 < modelProps_1$7.length; _i$7++) {
-    var props_1$7 = modelProps_1$7[_i$7];
-    emitProbs$7.push('update:' + props_1$7);
+var properties$8 = ['isLazyUpdate', 'plugins', 'allowReset', 'cssClass', 'disabled', 'emptyTemplate', 'enableAnimation', 'enablePersistence', 'enableRtl', 'enableSingleSelection', 'fullTemplate', 'itemsCount', 'labelPosition', 'labelTemplate', 'locale', 'min', 'precision', 'readOnly', 'showLabel', 'showTooltip', 'tooltipTemplate', 'value', 'visible', 'beforeItemRender', 'created', 'onItemHover', 'valueChanged'];
+var modelProps$8 = ['value'];
+var testProp$8 = getProps({ props: properties$8 });
+var props$8 = testProp$8[0];
+var watch$8 = testProp$8[1];
+var emitProbs$8 = Object.keys(watch$8);
+emitProbs$8.push('modelchanged', 'update:modelValue');
+for (var _i$8 = 0, modelProps_1$8 = modelProps$8; _i$8 < modelProps_1$8.length; _i$8++) {
+    var props_1$8 = modelProps_1$8[_i$8];
+    emitProbs$8.push('update:' + props_1$8);
 }
 /**
  * Represents the Essential JS 2 VueJS Rating Component
@@ -1213,16 +1380,16 @@ for (var _i$7 = 0, modelProps_1$7 = modelProps$7; _i$7 < modelProps_1$7.length;
 var RatingComponent = vueDefineComponent({
     name: 'RatingComponent',
     mixins: [ComponentBase],
-    props: props$7,
-    watch: watch$7,
-    emits: emitProbs$7,
+    props: props$8,
+    watch: watch$8,
+    emits: emitProbs$8,
     model: { event: 'modelchanged' },
     provide: function () { return { custom: this.custom }; },
     data: function () {
         return {
             ej2Instances: new Rating({}),
-            propKeys: properties$7,
-            models: modelProps$7,
+            propKeys: properties$8,
+            models: modelProps$8,
             hasChildDirective: false,
             hasInjectedModules: false,
             tagMapper: {},
@@ -1351,6 +1518,6 @@ var RatingPlugin = {
     }
 };
 
-export { TextBoxComponent, TextBoxPlugin, NumericTextBoxComponent, NumericTextBoxPlugin, MaskedTextBoxComponent, MaskedTextBoxPlugin, SliderComponent, SliderPlugin, FilesDirective, UploadedFilesDirective, FilesPlugin, UploadedFilesPlugin, UploaderComponent, UploaderPlugin, ColorPickerComponent, ColorPickerPlugin, SignatureComponent, SignaturePlugin, RatingComponent, RatingPlugin };
+export { TextBoxComponent, TextBoxPlugin, TextAreaComponent, TextAreaPlugin, NumericTextBoxComponent, NumericTextBoxPlugin, MaskedTextBoxComponent, MaskedTextBoxPlugin, SliderComponent, SliderPlugin, FilesDirective, UploadedFilesDirective, FilesPlugin, UploadedFilesPlugin, UploaderComponent, UploaderPlugin, ColorPickerComponent, ColorPickerPlugin, SignatureComponent, SignaturePlugin, RatingComponent, RatingPlugin };
 export * from '@syncfusion/ej2-inputs';
 //# sourceMappingURL=ej2-vue-inputs.es5.js.map