@progress/kendo-vue-inputs 3.7.4-dev.202212020747 → 3.7.4-dev.202301091431

package/dist/esm/input/Input.js

@@ -16,9 +16,10 @@ var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
-import { guid, templateDefinition, validatePackage, kendoThemeMaps, templateRendering, getListeners, getTemplate } from '@progress/kendo-vue-common';
+import { guid, templateDefinition, validatePackage, kendoThemeMaps, templateRendering, getListeners, getTemplate, Icon } from '@progress/kendo-vue-common';
 import { packageMetadata } from '../package-metadata.js';
 import { FloatingLabel } from '@progress/kendo-vue-labels';
+import { checkIcon, exclamationCircleIcon, xIcon } from '@progress/kendo-svg-icons';
 /**
  * @hidden
  */
@@ -108,7 +109,9 @@ var InputVue2 = {
     showClearButton: Boolean,
     inputClass: String,
     wrapperClass: String,
-    tabIndex: Number
+    tabIndex: Number,
+    ariaLabelledBy: String,
+    ariaDescribedBy: String
   },
   data: function data() {
     return {
@@ -157,7 +160,9 @@ var InputVue2 = {
       showValidationIcon = _a.showValidationIcon,
       showLoadingIcon = _a.showLoadingIcon,
       showClearButton = _a.showClearButton,
-      tabIndex = _a.tabIndex;
+      tabIndex = _a.tabIndex,
+      ariaLabelledBy = _a.ariaLabelledBy,
+      ariaDescribedBy = _a.ariaDescribedBy;
     var inputId = id || this._inputId;
     var textbox = h('input', __assign(__assign({
       domProps: this.v3 ? null : __assign(__assign({}, this.$attrs), {
@@ -174,6 +179,9 @@ var InputVue2 = {
       id: inputId,
       tabindex: tabIndex,
       required: required,
+      ariaLabelledby: ariaLabelledBy,
+      ariaDescribedby: ariaDescribedBy,
+      ariaDisabled: this.$props.disabled,
       value: this.computedValue,
       class: this.inputInnerClass,
       ref: this.v3 ? function (el) {
@@ -223,16 +231,32 @@ var InputVue2 = {
       ref: this.v3 ? function (el) {
         _this.wrapperRef = el;
       } : 'wrapper'
-    }, [iconName && h("span", {
-      "class": "k-input-icon k-icon k-i-".concat(iconName)
+    }, [iconName && h(Icon, {
+      name: iconName,
+      attrs: this.v3 ? undefined : {
+        name: iconName
+      },
+      "class": "k-input-icon"
     }), this.$props.inputPrefix && h("span", {
       "class": "k-input-prefix"
     }, [inputPrefix]), textbox, this.$props.inputSuffix && h("span", {
       "class": "k-input-suffix"
-    }, [inputSuffix]), showValidationIcon && isValid && h("span", {
-      "class": "k-input-validation-icon k-icon k-i-check"
-    }), showValidationIcon && !isValid && h("span", {
-      "class": "k-input-validation-icon k-icon k-i-warning"
+    }, [inputSuffix]), showValidationIcon && isValid && h(Icon, {
+      name: 'check',
+      attrs: this.v3 ? undefined : {
+        name: 'check',
+        icon: checkIcon
+      },
+      icon: checkIcon,
+      "class": "k-input-validation-icon"
+    }), showValidationIcon && !isValid && h(Icon, {
+      name: 'exclamation-circle',
+      attrs: this.v3 ? undefined : {
+        name: 'exclamation-circle',
+        icon: exclamationCircleIcon
+      },
+      icon: exclamationCircleIcon,
+      "class": "k-input-validation-icon"
     }), showLoadingIcon && h("span", {
       "class": "k-input-loading-icon k-icon k-i-loading"
     }), showClearButton && this.computedValue && h("span", {
@@ -241,8 +265,13 @@ var InputVue2 = {
         "click": this.clearClick
       },
       "class": "k-clear-value"
-    }, [h("span", {
-      "class": "k-icon k-i-x"
+    }, [h(Icon, {
+      name: 'x',
+      attrs: this.v3 ? undefined : {
+        name: 'x',
+        icon: xIcon
+      },
+      icon: xIcon
     })])]);
     return label ?
     // @ts-ignore function children

package/dist/esm/main.d.ts

@@ -37,3 +37,5 @@ export * from './textarea/TextArea';
 export * from './textarea/interfaces/TextAreaProps';
 export * from './textarea/interfaces/TextAreaChangeEvent';
 export * from './textarea/interfaces/TextAreaFocusEvent';
+export * from './signature/Signature';
+export * from './signature/interfaces';

package/dist/esm/main.js

@@ -35,3 +35,5 @@ export * from './textarea/TextArea.js';
 export * from './textarea/interfaces/TextAreaProps.js';
 export * from './textarea/interfaces/TextAreaChangeEvent.js';
 export * from './textarea/interfaces/TextAreaFocusEvent.js';
+export * from './signature/Signature.js';
+export * from './signature/interfaces.js';

package/dist/esm/maskedtextbox/MaskedTextBox.js

@@ -6,8 +6,9 @@ var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 import { MaskingService } from './masking.service.js';
 import { defaultRules, maskingChanged, returnFalse } from './utils.js';
-import { guid, getTabIndex, validatePackage, kendoThemeMaps, templateDefinition, templateRendering, getListeners, getTemplate, setRef } from '@progress/kendo-vue-common';
+import { guid, getTabIndex, validatePackage, kendoThemeMaps, templateDefinition, templateRendering, getListeners, getTemplate, setRef, Icon } from '@progress/kendo-vue-common';
 import { packageMetadata } from '../package-metadata.js';
+import { checkIcon, exclamationCircleIcon, xIcon } from '@progress/kendo-svg-icons';
 /**
  * @hidden
  */
@@ -15,6 +16,8 @@ var MaskedTextBoxVue2 = {
   model: {
     event: 'changemodel'
   },
+  // @ts-ignore
+  emits: ['change', 'focus', 'blur', 'update:modelValue', 'update:modelRawValue', 'changemodel'],
   props: {
     type: {
       type: String,
@@ -392,8 +395,12 @@ var MaskedTextBoxVue2 = {
       style: !this.$props.label ? {
         width: this.$props.width
       } : undefined
-    }, [iconName && h("span", {
-      "class": "k-input-icon k-icon k-i-".concat(iconName)
+    }, [iconName && h(Icon, {
+      name: iconName,
+      attrs: this.v3 ? undefined : {
+        name: iconName
+      },
+      "class": 'k-input-icon'
     }), this.$props.inputPrefix && h("span", {
       "class": "k-input-prefix"
     }, [inputPrefix]), h("input", {
@@ -407,6 +414,7 @@ var MaskedTextBoxVue2 = {
         id: inputId,
         "aria-labelledby": this.$props.ariaLabelledBy,
         "aria-describedby": this.$props.ariaDescribedBy,
+        "aria-disabled": this.$props.disabled,
         name: this.$props.name,
         tabindex: getTabIndex(this.$props.tabIndex, this.$props.disabled, true),
         accesskey: this.$props.accessKey,
@@ -414,6 +422,7 @@ var MaskedTextBoxVue2 = {
         disabled: this.$props.disabled || undefined,
         readonly: this.$props.readonly || undefined,
         placeholder: this.$props.placeholder,
+        "aria-placeholder": this.$props.placeholder,
         required: this.$props.required
       },
       autocomplete: "off",
@@ -428,6 +437,7 @@ var MaskedTextBoxVue2 = {
       id: inputId,
       "aria-labelledby": this.$props.ariaLabelledBy,
       "aria-describedby": this.$props.ariaDescribedBy,
+      "aria-disabled": this.$props.disabled,
       name: this.$props.name,
       tabindex: getTabIndex(this.$props.tabIndex, this.$props.disabled, true),
       accesskey: this.$props.accessKey,
@@ -435,6 +445,7 @@ var MaskedTextBoxVue2 = {
       disabled: this.$props.disabled || undefined,
       readonly: this.$props.readonly || undefined,
       placeholder: this.$props.placeholder,
+      "aria-placeholder": this.$props.placeholder,
       required: this.$props.required,
       ref: setRef(this, 'input'),
       onInput: this.onChangeHandler,
@@ -453,10 +464,22 @@ var MaskedTextBoxVue2 = {
       onDrop: returnFalse
     }), this.$props.inputSuffix && h("span", {
       "class": "k-input-suffix"
-    }, [inputSuffix]), showValidationIcon && isValid && h("span", {
-      "class": "k-input-validation-icon k-icon k-i-check"
-    }), showValidationIcon && !isValid && h("span", {
-      "class": "k-input-validation-icon k-icon k-i-warning"
+    }, [inputSuffix]), showValidationIcon && isValid && h(Icon, {
+      name: 'check',
+      attrs: this.v3 ? undefined : {
+        name: 'check',
+        icon: checkIcon
+      },
+      icon: checkIcon,
+      "class": "k-input-validation-icon"
+    }), showValidationIcon && !isValid && h(Icon, {
+      name: 'exclamation-circle',
+      attrs: this.v3 ? undefined : {
+        name: 'exclamation-circle',
+        icon: exclamationCircleIcon
+      },
+      icon: exclamationCircleIcon,
+      "class": "k-input-validation-icon"
     }), showLoadingIcon && h("span", {
       "class": "k-input-loading-icon k-icon k-i-loading"
     }), showClearButton && newValue && h("span", {
@@ -465,8 +488,13 @@ var MaskedTextBoxVue2 = {
         "click": this.clearClick
       },
       "class": "k-clear-value"
-    }, [h("span", {
-      "class": "k-icon k-i-x"
+    }, [h(Icon, {
+      name: 'x',
+      attrs: this.v3 ? undefined : {
+        name: 'x',
+        icon: xIcon
+      },
+      icon: xIcon
     })])]);
     return this.$props.label ? h("span", {
       "class": this.spanClassNames,

package/dist/esm/messages/main.d.ts

@@ -42,6 +42,10 @@ export declare const colorGradientA = "colorGradient.a";
  * @hidden
  */
 export declare const colorGradientHex = "colorGradient.hex";
+/**
+ * @hidden
+ */
+export declare const colorGradientHexLabel = "colorGradient.hexLabel";
 /**
  * @hidden
  */
@@ -82,6 +86,14 @@ export declare const colorGradientPass = "colorGradient.colorGradientPass";
  * @hidden
  */
 export declare const colorGradientFail = "colorGradient.colorGradientFail";
+/**
+ * @hidden
+ */
+export declare const colorGradientHueSliderLabel = "colorGradient.hueSliderLabel";
+/**
+ * @hidden
+ */
+export declare const colorGradientAlphaSliderLabel = "colorGradient.alphaSliderLabel";
 /**
  * @hidden
  */
@@ -122,6 +134,26 @@ export declare const switchValidation = "switch.validation";
  * @hidden
  */
 export declare const colorPickerDropdownButtonAriaLabel = "colorPicker.dropdownButtonAriaLabel";
+/**
+ * @hidden
+ */
+export declare const colorGradientToggleInputsButton = "colorGradient.toggleInputsButton";
+/**
+ * @hidden
+ */
+export declare const ratingAriaLabel = "rating.ariaLabel";
+/**
+ * @hidden
+ */
+export declare const signatureClear = "signature.clear";
+/**
+ * @hidden
+ */
+export declare const signatureMaximize = "signature.maximize";
+/**
+ * @hidden
+ */
+export declare const signatureMinimize = "signature.minimize";
 /**
  * @hidden
  */
@@ -142,11 +174,15 @@ export declare const messages: {
     "colorGradient.bLabel": string;
     "colorGradient.aLabel": string;
     "colorGradient.hex": string;
+    "colorGradient.hexLabel": string;
     "colorGradient.contrastRatio": string;
     "colorGradient.colorGradientAALevel": string;
     "colorGradient.colorGradientAAALevel": string;
     "colorGradient.colorGradientPass": string;
     "colorGradient.colorGradientFail": string;
+    "colorGradient.hueSliderLabel": string;
+    "colorGradient.alphaSliderLabel": string;
+    "colorGradient.toggleInputsButton": string;
     "flatColorPicker.cancelBtn": string;
     "flatColorPicker.applyBtn": string;
     "flatColorPicker.gradientBtn": string;
@@ -157,4 +193,8 @@ export declare const messages: {
     "radioButton.validation": string;
     "switch.validation": string;
     "colorPicker.dropdownButtonAriaLabel": string;
+    "rating.ariaLabel": string;
+    "signature.clear": string;
+    "signature.maximize": string;
+    "signature.minimize": string;
 };

package/dist/esm/messages/main.js

@@ -43,6 +43,10 @@ export var colorGradientA = 'colorGradient.a';
  * @hidden
  */
 export var colorGradientHex = 'colorGradient.hex';
+/**
+ * @hidden
+ */
+export var colorGradientHexLabel = 'colorGradient.hexLabel';
 /**
  * @hidden
  */
@@ -83,6 +87,14 @@ export var colorGradientPass = 'colorGradient.colorGradientPass';
  * @hidden
  */
 export var colorGradientFail = 'colorGradient.colorGradientFail';
+/**
+ * @hidden
+ */
+export var colorGradientHueSliderLabel = 'colorGradient.hueSliderLabel';
+/**
+ * @hidden
+ */
+export var colorGradientAlphaSliderLabel = 'colorGradient.alphaSliderLabel';
 /**
  * @hidden
  */
@@ -123,6 +135,26 @@ export var switchValidation = 'switch.validation';
  * @hidden
  */
 export var colorPickerDropdownButtonAriaLabel = 'colorPicker.dropdownButtonAriaLabel';
+/**
+ * @hidden
+ */
+export var colorGradientToggleInputsButton = 'colorGradient.toggleInputsButton';
+/**
+ * @hidden
+ */
+export var ratingAriaLabel = 'rating.ariaLabel';
+/**
+ * @hidden
+ */
+export var signatureClear = 'signature.clear';
+/**
+ * @hidden
+ */
+export var signatureMaximize = 'signature.maximize';
+/**
+ * @hidden
+ */
+export var signatureMinimize = 'signature.minimize';
 /**
  * @hidden
  */
@@ -132,10 +164,9 @@ export var messages = (_a = {},
     _a[sliderIncreaseValue] = 'Increase',
     _a[sliderDecreaseValue] = 'Decrease',
     _a[sliderDragTitle] = 'Drag',
-    _a[colorGradientDragHandle] = "Color well with two-dimensional slider for selecting\n      saturation and lightness. Selected color is",
+    _a[colorGradientDragHandle] = "Color well with two-dimensional slider for selecting\n     saturation and lightness. Selected color is",
     _a[colorGradientInputColorButton] = 'Change the color input',
     _a[colorGradientR] = 'r',
-    _a[colorGradientR] = 'r',
     _a[colorGradientG] = 'g',
     _a[colorGradientB] = 'b',
     _a[colorGradientA] = 'a',
@@ -144,11 +175,15 @@ export var messages = (_a = {},
     _a[colorGradientBLabel] = 'blue chanel',
     _a[colorGradientALabel] = 'alpha chanel',
     _a[colorGradientHex] = 'hex',
+    _a[colorGradientHexLabel] = 'HEX',
     _a[colorGradientContrastRatio] = 'Contrast ratio',
     _a[colorGradientAALevel] = 'AA',
     _a[colorGradientAAALevel] = 'AAA',
     _a[colorGradientPass] = 'Pass',
     _a[colorGradientFail] = 'Fail',
+    _a[colorGradientHueSliderLabel] = 'Hue slider',
+    _a[colorGradientAlphaSliderLabel] = 'Alpha slider',
+    _a[colorGradientToggleInputsButton] = 'Toggle colorgradient inputs',
     _a[flatColorPickerCancelBtn] = 'Cancel',
     _a[flatColorPickerApplyBtn] = 'Apply',
     _a[flatColorPickerGradientBtn] = 'Gradient',
@@ -159,4 +194,8 @@ export var messages = (_a = {},
     _a[radioButtonValidation] = 'Please select option if you want to proceed!',
     _a[switchValidation] = 'Please turn on if you want to proceed!',
     _a[colorPickerDropdownButtonAriaLabel] = 'Select',
+    _a[ratingAriaLabel] = 'Rating',
+    _a[signatureClear] = 'Clear',
+    _a[signatureMaximize] = 'Maximize',
+    _a[signatureMinimize] = 'Minimize',
     _a);

package/dist/esm/numerictextbox/NumericTextBox.js

@@ -5,13 +5,14 @@ var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
-import { canUseDOM, getDefaultSlots, getListeners, getRef, getTemplate, kendoThemeMaps, setRef, templateDefinition, templateRendering } from '@progress/kendo-vue-common';
+import { canUseDOM, getDefaultSlots, getListeners, getRef, getTemplate, Icon, kendoThemeMaps, setRef, templateDefinition, templateRendering } from '@progress/kendo-vue-common';
 import { provideIntlService, provideLocalizationService } from '@progress/kendo-vue-intl';
 import { guid, validatePackage } from '@progress/kendo-vue-common';
 import { Button as KButton } from '@progress/kendo-vue-buttons';
 import { messages, numericIncreaseValue, numericDecreaseValue } from '../messages/main.js';
 import { formatValue, sanitizeNumber, rangeValue, increaseValue, decreaseValue, getStateOrPropsValue } from './utils/main.js';
 import { packageMetadata } from '../package-metadata.js';
+import { caretAltDownIcon, caretAltUpIcon, checkIcon, exclamationCircleIcon, xIcon } from '@progress/kendo-svg-icons';
 var VALIDATION_MESSAGE = 'Please enter a valid value!';
 /**
  * @hidden
@@ -499,14 +500,16 @@ var NumericTextBoxVue2 = {
     var numerictextbox = h("span", {
       dir: this.$props.dir,
       attrs: this.v3 ? undefined : {
-        dir: this.$props.dir,
-        "aria-disabled": this.$props.disabled ? 'true' : undefined
+        dir: this.$props.dir
       },
       "class": this.wrapperClassNames,
-      "aria-disabled": this.$props.disabled ? 'true' : undefined,
       style: this.$attrs.style
-    }, [iconName && h("span", {
-      "class": "k-input-icon k-icon k-i-".concat(iconName)
+    }, [iconName && h(Icon, {
+      name: iconName,
+      attrs: this.v3 ? undefined : {
+        name: iconName
+      },
+      "class": "k-input-icon"
     }), this.$props.inputPrefix && h("span", {
       "class": "k-input-prefix"
     }, [inputPrefix]), h("input", {
@@ -519,12 +522,14 @@ var NumericTextBoxVue2 = {
         "aria-label": this.$props.ariaLabel,
         "aria-valuemin": this.$props.min,
         "aria-valuemax": this.$props.max,
+        "aria-disabled": this.$props.disabled ? 'true' : undefined,
         placeholder: this.$props.placeholder,
         type: this.$props.inputType,
         spellcheck: false,
         autocomplete: "off",
         autocorrect: "off",
         id: inputId,
+        role: 'spinbutton',
         name: this.$props.name
       },
       accesskey: this.$props.accessKey,
@@ -533,6 +538,7 @@ var NumericTextBoxVue2 = {
       "aria-label": this.$props.ariaLabel,
       "aria-valuemin": this.$props.min,
       "aria-valuemax": this.$props.max,
+      "aria-disabled": this.$props.disabled ? 'true' : undefined,
       placeholder: this.$props.placeholder,
       type: this.$props.inputType,
       spellcheck: false,
@@ -540,6 +546,7 @@ var NumericTextBoxVue2 = {
       autocorrect: "off",
       "class": this.inputInnerClass,
       id: inputId,
+      role: 'spinbutton',
       value: this.v3 ? this.looseValue : null,
       domProps: this.v3 ? undefined : {
         "value": this.looseValue
@@ -562,10 +569,22 @@ var NumericTextBoxVue2 = {
       ref: setRef(this, 'input')
     }), this.$props.inputSuffix && h("span", {
       "class": "k-input-suffix"
-    }, [inputSuffix]), showValidationIcon && isValid && h("span", {
-      "class": "k-input-validation-icon k-icon k-i-check"
-    }), showValidationIcon && !isValid && h("span", {
-      "class": "k-input-validation-icon k-icon k-i-warning"
+    }, [inputSuffix]), showValidationIcon && isValid && h(Icon, {
+      name: 'check',
+      attrs: this.v3 ? undefined : {
+        name: 'check',
+        icon: checkIcon
+      },
+      icon: checkIcon,
+      "class": "k-input-validation-icon"
+    }), showValidationIcon && !isValid && h(Icon, {
+      name: 'exclamation-circle',
+      attrs: this.v3 ? undefined : {
+        name: 'exclamation-circle',
+        icon: exclamationCircleIcon
+      },
+      icon: exclamationCircleIcon,
+      "class": "k-input-validation-icon"
     }), showLoadingIcon && h("span", {
       "class": "k-input-loading-icon k-icon k-i-loading"
     }), showClearButton && this.computedValue !== undefined && this.computedValue !== null && h("span", {
@@ -574,8 +593,13 @@ var NumericTextBoxVue2 = {
         "click": this.clearClick
       },
       "class": "k-clear-value"
-    }, [h("span", {
-      "class": "k-icon k-i-x"
+    }, [h(Icon, {
+      name: 'x',
+      attrs: this.v3 ? undefined : {
+        name: 'x',
+        icon: xIcon
+      },
+      icon: xIcon
     })]), defaultSlot, this.$props.spinners && h("span", {
       "class": "k-input-spinner k-spin-button",
       onMousedown: this.spinnersWrapperMouseDown,
@@ -590,12 +614,14 @@ var NumericTextBoxVue2 = {
         type: "button",
         tabIndex: -1,
         icon: 'caret-alt-up',
+        svgIcon: caretAltUpIcon,
         rounded: null,
         "aria-label": localizationService.toLanguageString(numericIncreaseValue, messages[numericIncreaseValue]),
         title: localizationService.toLanguageString(numericIncreaseValue, messages[numericIncreaseValue])
       },
       tabIndex: -1,
       icon: 'caret-alt-up',
+      svgIcon: caretAltUpIcon,
       "class": "k-spinner-increase",
       rounded: null,
       "aria-label": localizationService.toLanguageString(numericIncreaseValue, messages[numericIncreaseValue]),
@@ -612,6 +638,7 @@ var NumericTextBoxVue2 = {
         type: "button",
         tabIndex: -1,
         icon: 'caret-alt-down',
+        svgIcon: caretAltDownIcon,
         rounded: null,
         "aria-label": localizationService.toLanguageString(numericDecreaseValue, messages[numericDecreaseValue]),
         title: localizationService.toLanguageString(numericDecreaseValue, messages[numericDecreaseValue])
@@ -619,6 +646,7 @@ var NumericTextBoxVue2 = {
       tabIndex: -1,
       "class": "k-spinner-decrease",
       icon: 'caret-alt-down',
+      svgIcon: caretAltDownIcon,
       rounded: null,
       "aria-label": localizationService.toLanguageString(numericDecreaseValue, messages[numericDecreaseValue]),
       title: localizationService.toLanguageString(numericDecreaseValue, messages[numericDecreaseValue]),

package/dist/esm/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-inputs',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1669966460,
+    publishDate: 1673273516,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/dist/esm/range-slider/RangeSlider.js

@@ -161,15 +161,13 @@ var RangeSliderVue2 = {
       dir = _c.dir;
     //  const dir = useDir(sliderRef, this.$props.dir);
     return h("div", {
-      role: "slider",
+      id: id,
       attrs: this.v3 ? undefined : {
-        role: "slider",
         id: id,
         dir: this.currentDir,
         "aria-labelledby": this.$props.ariaLabelledBy,
         "aria-describedby": this.$props.ariaDescribedBy
       },
-      id: id,
       dir: this.currentDir,
       "class": classNames('k-widget k-slider', {
         'k-rtl': this.currentDir === 'rtl',
@@ -233,6 +231,7 @@ var RangeSliderVue2 = {
           "aria-valuemax": Math.max(_this.max, _this.computedValue.end),
           "aria-valuenow": _this.computedValue.start,
           "aria-disabled": _this.disabled ? 'true' : undefined,
+          "aria-valuetext": _this.computedValue.start,
           title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle])
         },
         tabindex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
@@ -240,6 +239,7 @@ var RangeSliderVue2 = {
         "aria-valuemax": Math.max(_this.max, _this.computedValue.end),
         "aria-valuenow": _this.computedValue.start,
         "aria-disabled": _this.disabled ? 'true' : undefined,
+        "aria-valuetext": _this.computedValue.start,
         "class": "k-draghandle",
         title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle]),
         style: _this.vertical ? {
@@ -266,6 +266,7 @@ var RangeSliderVue2 = {
           "aria-valuemax": _this.max,
           "aria-valuenow": _this.computedValue.end,
           "aria-disabled": _this.disabled ? 'true' : undefined,
+          "aria-valuetext": _this.computedValue.end,
           title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle])
         },
         tabindex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
@@ -273,6 +274,7 @@ var RangeSliderVue2 = {
         "aria-valuemax": _this.max,
         "aria-valuenow": _this.computedValue.end,
         "aria-disabled": _this.disabled ? 'true' : undefined,
+        "aria-valuetext": _this.computedValue.end,
         "class": "k-draghandle",
         title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle]),
         style: _this.vertical ? {
@@ -331,6 +333,7 @@ var RangeSliderVue2 = {
         "aria-valuemax": Math.max(_this.max, _this.computedValue.end),
         "aria-valuenow": _this.computedValue.start,
         "aria-disabled": _this.disabled ? 'true' : undefined,
+        "aria-valuetext": _this.computedValue.start,
         title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle])
       },
       tabindex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
@@ -338,6 +341,7 @@ var RangeSliderVue2 = {
       "aria-valuemax": Math.max(_this.max, _this.computedValue.end),
       "aria-valuenow": _this.computedValue.start,
       "aria-disabled": _this.disabled ? 'true' : undefined,
+      "aria-valuetext": _this.computedValue.start,
       "class": "k-draghandle",
       title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle]),
       style: _this.vertical ? {
@@ -364,6 +368,7 @@ var RangeSliderVue2 = {
         "aria-valuemax": _this.max,
         "aria-valuenow": _this.computedValue.end,
         "aria-disabled": _this.disabled ? 'true' : undefined,
+        "aria-valuetext": _this.computedValue.end,
         title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle])
       },
       tabindex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
@@ -371,6 +376,7 @@ var RangeSliderVue2 = {
       "aria-valuemax": _this.max,
       "aria-valuenow": _this.computedValue.end,
       "aria-disabled": _this.disabled ? 'true' : undefined,
+      "aria-valuetext": _this.computedValue.end,
       "class": "k-draghandle",
       title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle]),
       style: _this.vertical ? {

package/dist/esm/signature/Signature.d.ts

@@ -0,0 +1,39 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { SignaturePad } from '@progress/kendo-inputs-common';
+import { SignatureProps } from './interfaces/SignatureProps';
+/**
+ * @hidden
+ */
+export interface SignatureData {
+}
+export interface SignatureState {
+    v3: boolean;
+    instance: SignaturePad;
+}
+/**
+ * @hidden
+ */
+export interface SignatureMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SignatureComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SignatureAll extends Vue2type, SignatureMethods, SignatureComputed, SignatureState, SignatureData {
+}
+/**
+ * @hidden
+ */
+declare let SignatureVue2: ComponentOptions<SignatureAll, DefaultData<SignatureData>, DefaultMethods<SignatureAll>, SignatureComputed, RecordPropsDefinition<SignatureProps>>;
+declare const Signature: DefineComponent<SignatureProps, any, SignatureData, SignatureComputed, SignatureMethods, {}, {}, {}, string, SignatureProps, SignatureProps, {}>;
+export { Signature, SignatureVue2 };