@progress/kendo-vue-inputs 3.4.0 → 3.4.2-dev.202207070519

package/dist/es/messages/index.d.ts

@@ -58,6 +58,14 @@ export declare const colorGradientPass = "colorGradient.colorGradientPass";
  * @hidden
  */
 export declare const colorGradientFail = "colorGradient.colorGradientFail";
+/**
+ * @hidden
+ */
+export declare const flatColorPickerCancelBtn = "flatColorPicker.cancelBtn";
+/**
+ * @hidden
+ */
+export declare const flatColorPickerApplyBtn = "flatColorPicker.applyBtn";
 /**
  * @hidden
  */
@@ -74,6 +82,10 @@ export declare const radioButtonValidation = "radioButton.validation";
  * @hidden
  */
 export declare const switchValidation = "switch.validation";
+/**
+ * @hidden
+ */
+export declare const colorPickerDropdownButtonAriaLabel = "colorPicker.dropdownButtonAriaLabel";
 /**
  * @hidden
  */
@@ -93,8 +105,11 @@ export declare const messages: {
     "colorGradient.colorGradientAAALevel": string;
     "colorGradient.colorGradientPass": string;
     "colorGradient.colorGradientFail": string;
+    "flatColorPicker.cancelBtn": string;
+    "flatColorPicker.applyBtn": string;
     "checkbox.validation": string;
     "checkbox.optionalText": string;
     "radioButton.validation": string;
     "switch.validation": string;
+    "colorPicker.dropdownButtonAriaLabel": string;
 };

package/dist/es/messages/index.js

@@ -59,6 +59,14 @@ export var colorGradientPass = 'colorGradient.colorGradientPass';
  * @hidden
  */
 export var colorGradientFail = 'colorGradient.colorGradientFail';
+/**
+ * @hidden
+ */
+export var flatColorPickerCancelBtn = 'flatColorPicker.cancelBtn';
+/**
+ * @hidden
+ */
+export var flatColorPickerApplyBtn = 'flatColorPicker.applyBtn';
 /**
  * @hidden
  */
@@ -75,6 +83,10 @@ export var radioButtonValidation = 'radioButton.validation';
  * @hidden
  */
 export var switchValidation = 'switch.validation';
+/**
+ * @hidden
+ */
+export var colorPickerDropdownButtonAriaLabel = 'colorPicker.dropdownButtonAriaLabel';
 /**
  * @hidden
  */
@@ -94,8 +106,11 @@ export var messages = (_a = {},
     _a[colorGradientAAALevel] = 'AAA',
     _a[colorGradientPass] = 'Pass',
     _a[colorGradientFail] = 'Fail',
+    _a[flatColorPickerCancelBtn] = 'Cancel',
+    _a[flatColorPickerApplyBtn] = 'Apply',
     _a[checkboxValidation] = 'Please check this box if you want to proceed!',
     _a[checkboxOptionalText] = '(Optional)',
     _a[radioButtonValidation] = 'Please select option if you want to proceed!',
     _a[switchValidation] = 'Please turn on if you want to proceed!',
+    _a[colorPickerDropdownButtonAriaLabel] = 'Select',
     _a);

package/dist/es/numerictextbox/NumericTextBox.d.ts

@@ -15,6 +15,10 @@ export interface NumericTextBoxChangeEvent {
      * The current value of the NumericTextBox.
      */
     value: number | null;
+    /**
+     * The native event.
+     */
+    event: any;
 }
 /**
  * @hidden

package/dist/es/numerictextbox/NumericTextBox.js

@@ -2,9 +2,10 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
+var isV3 = allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
-import { canUseDOM, getDefaultSlots, getListeners, getTemplate, kendoThemeMaps, templateDefinition, templateRendering } from '@progress/kendo-vue-common';
+import { canUseDOM, getDefaultSlots, getListeners, getRef, getTemplate, 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';
@@ -141,7 +142,7 @@ var NumericTextBoxVue2 = {
     }
   },
   mounted: function mounted() {
-    this._input = this.v3 ? this.inputRef : this.$refs.input;
+    this._input = getRef(this, 'input');
     this._elementWrapper = this.v3 ? this.elementWrapperRef : this.$refs.elementWrapper;
     this.$data.hasMounted = true;
 
@@ -472,8 +473,8 @@ var NumericTextBoxVue2 = {
     }
   },
   // @ts-ignore
-  setup: !gh ? undefined : function () {
-    var v3 = !!gh;
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
     var inputRef = ref(null);
     var elementWrapperRef = ref(null);
     var kendoLocalizationService = inject('kendoLocalizationService', {});
@@ -488,8 +489,6 @@ var NumericTextBoxVue2 = {
   },
   // @ts-ignore
   render: function render(createElement) {
-    var _this = this;
-
     var h = gh || createElement;
     var _a = this.$props,
         iconName = _a.iconName,
@@ -540,33 +539,33 @@ var NumericTextBoxVue2 = {
     }), this.$props.inputPrefix && h("span", {
       "class": "k-input-prefix"
     }, [inputPrefix]), h("input", {
-      tabIndex: this.$props.tabIndex,
+      tabindex: this.$props.tabIndex,
       attrs: this.v3 ? undefined : {
-        tabIndex: this.$props.tabIndex,
-        accessKey: this.$props.accessKey,
+        tabindex: this.$props.tabIndex,
+        accesskey: this.$props.accessKey,
         disabled: this.$props.disabled,
         title: this.$props.title,
         "aria-valuemin": this.$props.min,
         "aria-valuemax": this.$props.max,
         placeholder: this.$props.placeholder,
         type: this.$props.inputType || 'tel',
-        spellCheck: false,
-        autoComplete: "off",
-        autoCorrect: "off",
+        spellcheck: false,
+        autocomplete: "off",
+        autocorrect: "off",
         id: inputId,
         "aria-valuenow": this.$data.currentValue !== null ? this.$data.currentValue : undefined,
         name: this.$props.name
       },
-      accessKey: this.$props.accessKey,
+      accesskey: this.$props.accessKey,
       disabled: this.$props.disabled,
       title: this.$props.title,
       "aria-valuemin": this.$props.min,
       "aria-valuemax": this.$props.max,
       placeholder: this.$props.placeholder,
       type: this.$props.inputType || 'tel',
-      spellCheck: false,
-      autoComplete: "off",
-      autoCorrect: "off",
+      spellcheck: false,
+      autocomplete: "off",
+      autocorrect: "off",
       "class": this.inputInnerClass,
       id: inputId,
       value: this.v3 ? this.looseValue : null,
@@ -589,9 +588,7 @@ var NumericTextBoxVue2 = {
       onFocus: this.emitFocus,
       onBlur: this.emitBlur,
       onPaste: this.onPasteHandler,
-      ref: this.v3 ? function (el) {
-        _this.inputRef = el;
-      } : 'input'
+      ref: setRef(this, 'input')
     }), this.$props.inputSuffix && h("span", {
       "class": "k-input-suffix"
     }, [inputSuffix]), showValidationIcon && isValid && h("span", {

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-inputs',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1655871679,
+    publishDate: 1657170635,
     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/es/radiobutton/RadioButton.js

@@ -2,9 +2,10 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
+var isV3 = allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
-import { guid, getTabIndex, getDefaultSlots, templateRendering, getTemplate, getListeners, kendoThemeMaps } from '@progress/kendo-vue-common';
+import { guid, getTabIndex, getDefaultSlots, templateRendering, getTemplate, getListeners, kendoThemeMaps, setRef, getRef } from '@progress/kendo-vue-common';
 import { validatePackage } from '@progress/kendo-vue-common';
 import { packageMetadata } from '../package-metadata';
 /**
@@ -54,7 +55,7 @@ var RadioButtonVue2 = {
     validatePackage(packageMetadata);
   },
   mounted: function mounted() {
-    this.input = this.v3 ? this.inputRef : this.$refs.input;
+    this.input = getRef(this, 'input');
   },
   computed: {
     inputClassName: function inputClassName() {
@@ -89,8 +90,8 @@ var RadioButtonVue2 = {
     }
   },
   // @ts-ignore
-  setup: !gh ? undefined : function () {
-    var v3 = !!gh;
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
     var inputRef = ref(null);
     return {
       v3: v3,
@@ -98,8 +99,6 @@ var RadioButtonVue2 = {
     };
   },
   render: function render(createElement) {
-    var _this = this;
-
     var h = gh || createElement;
     var defaultSlot = getDefaultSlots(this);
     var _a = this.$props,
@@ -147,17 +146,15 @@ var RadioButtonVue2 = {
         id: id || this.calculatedId,
         name: name,
         disabled: disabled,
-        tabIndex: getTabIndex(tabIndex, disabled),
+        tabindex: getTabIndex(tabIndex, disabled),
         "aria-describedby": ariaDescribedBy
       },
       id: id || this.calculatedId,
       name: name,
       "class": this.inputClassName,
-      ref: this.v3 ? function (el) {
-        _this.inputRef = el;
-      } : 'input',
+      ref: setRef(this, 'input'),
       disabled: disabled,
-      tabIndex: getTabIndex(tabIndex, disabled),
+      tabindex: getTabIndex(tabIndex, disabled),
       checked: this.v3 ? checked : null,
       domProps: this.v3 ? undefined : {
         "checked": checked,

package/dist/es/radiobutton/RadioGroup.js

@@ -2,6 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
+var isV3 = allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 import { RadioButton } from './RadioButton';
@@ -124,8 +125,8 @@ var RadioGroupVue2 = {
     }
   },
   // @ts-ignore
-  setup: !gh ? undefined : function () {
-    var v3 = !!gh;
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
     var inputRef = ref(null);
     return {
       v3: v3,

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

@@ -18,6 +18,7 @@ var __assign = this && this.__assign || function () {
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
+var isV3 = allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 import { Draggable, Keys, // useDir,
@@ -145,8 +146,8 @@ var RangeSliderVue2 = {
     }
   },
   // @ts-ignore
-  setup: !gh ? undefined : function () {
-    var v3 = !!gh;
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
     var inputRef = ref(null);
     var kendoLocalizationService = inject('kendoLocalizationService', {});
     return {
@@ -188,9 +189,9 @@ var RangeSliderVue2 = {
       "aria-describedby": this.$props.ariaDescribedBy
     }, [// @ts-ignore  function children
     h(Draggable, {
-      onDrag: this.handleTrackPress,
+      onDrag: this.handleTrackDrag,
       on: this.v3 ? undefined : {
-        "drag": this.handleTrackPress,
+        "drag": this.handleTrackDrag,
         "press": this.handleTrackPress,
         "release": this.handleTrackRelease
       },
@@ -234,14 +235,14 @@ var RangeSliderVue2 = {
         role: "slider",
         attrs: _this.v3 ? undefined : {
           role: "slider",
-          tabIndex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
+          tabindex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
           "aria-valuemin": _this.min,
           "aria-valuemax": Math.max(_this.max, _this.computedValue.end),
           "aria-valuenow": _this.computedValue.start,
           "aria-disabled": _this.disabled ? 'true' : undefined,
           title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle])
         },
-        tabIndex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
+        tabindex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
         "aria-valuemin": _this.min,
         "aria-valuemax": Math.max(_this.max, _this.computedValue.end),
         "aria-valuenow": _this.computedValue.start,
@@ -267,14 +268,14 @@ var RangeSliderVue2 = {
         role: "slider",
         attrs: _this.v3 ? undefined : {
           role: "slider",
-          tabIndex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
+          tabindex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
           "aria-valuemin": Math.min(_this.min, _this.computedValue.start),
           "aria-valuemax": _this.max,
           "aria-valuenow": _this.computedValue.end,
           "aria-disabled": _this.disabled ? 'true' : undefined,
           title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle])
         },
-        tabIndex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
+        tabindex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
         "aria-valuemin": Math.min(_this.min, _this.computedValue.start),
         "aria-valuemax": _this.max,
         "aria-valuenow": _this.computedValue.end,
@@ -332,14 +333,14 @@ var RangeSliderVue2 = {
       role: "slider",
       attrs: _this.v3 ? undefined : {
         role: "slider",
-        tabIndex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
+        tabindex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
         "aria-valuemin": _this.min,
         "aria-valuemax": Math.max(_this.max, _this.computedValue.end),
         "aria-valuenow": _this.computedValue.start,
         "aria-disabled": _this.disabled ? 'true' : undefined,
         title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle])
       },
-      tabIndex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
+      tabindex: getTabIndex(_this.startTabIndex, _this.$props.disabled, undefined),
       "aria-valuemin": _this.min,
       "aria-valuemax": Math.max(_this.max, _this.computedValue.end),
       "aria-valuenow": _this.computedValue.start,
@@ -365,14 +366,14 @@ var RangeSliderVue2 = {
       role: "slider",
       attrs: _this.v3 ? undefined : {
         role: "slider",
-        tabIndex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
+        tabindex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
         "aria-valuemin": Math.min(_this.min, _this.computedValue.start),
         "aria-valuemax": _this.max,
         "aria-valuenow": _this.computedValue.end,
         "aria-disabled": _this.disabled ? 'true' : undefined,
         title: localization.toLanguageString(sliderDragTitle, messages[sliderDragTitle])
       },
-      tabIndex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
+      tabindex: getTabIndex(_this.endTabIndex, _this.$props.disabled, undefined),
       "aria-valuemin": Math.min(_this.min, _this.computedValue.start),
       "aria-valuemax": _this.max,
       "aria-valuenow": _this.computedValue.end,

package/dist/es/slider/Slider.d.ts

@@ -13,6 +13,10 @@ export interface SliderChangeEvent {
      * The current value of the Slider.
      */
     value: number;
+    /**
+     * The native event.
+     */
+    event: any;
 }
 /**
  * Represents the props of the [Kendo UI for Vue Slider component]({% slug overview_slider %}).

package/dist/es/slider/Slider.js

@@ -2,6 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
+var isV3 = allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 import { Button } from '@progress/kendo-vue-buttons';
@@ -117,8 +118,8 @@ var SliderVue2 = {
     }
   },
   // @ts-ignore
-  setup: !gh ? undefined : function () {
-    var v3 = !!gh;
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
     var inputRef = ref(null);
     var kendoLocalizationService = inject('kendoLocalizationService', {});
     return {
@@ -148,7 +149,7 @@ var SliderVue2 = {
         dir: this.currentDir,
         role: "slider",
         id: this.$props.id,
-        tabIndex: getTabIndex(this.$props.tabIndex, this.$props.disabled, undefined)
+        tabindex: getTabIndex(this.$props.tabIndex, this.$props.disabled, undefined)
       },
       "aria-valuemax": this.$props.max,
       "aria-valuenow": this.computedValue,
@@ -159,7 +160,7 @@ var SliderVue2 = {
       role: "slider",
       id: this.$props.id,
       style: this.$props.style,
-      tabIndex: getTabIndex(this.$props.tabIndex, this.$props.disabled, undefined),
+      tabindex: getTabIndex(this.$props.tabIndex, this.$props.disabled, undefined),
       onFocus: this.onFocus,
       on: this.v3 ? undefined : {
         "focus": this.onFocus,

package/dist/es/slider/SliderLabel.js

@@ -18,6 +18,7 @@ var __assign = this && this.__assign || function () {
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
+var isV3 = allVue.version[0] === '3';
 var ref = allVue.ref;
 import { getDefaultSlots } from '@progress/kendo-vue-common';
 /**
@@ -59,8 +60,8 @@ var SliderLabelVue2 = {
     }
   },
   // @ts-ignore
-  setup: !gh ? undefined : function () {
-    var v3 = !!gh;
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
     return {
       v3: v3
     };

package/dist/es/switch/Switch.js

@@ -2,7 +2,8 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-import { guid, noop, Keys, getTabIndex, validatePackage, isRtl, kendoThemeMaps } from '@progress/kendo-vue-common';
+var isV3 = allVue.version[0] === '3';
+import { guid, noop, Keys, getTabIndex, validatePackage, isRtl, kendoThemeMaps, setRef, getRef } from '@progress/kendo-vue-common';
 import { provideLocalizationService } from '@progress/kendo-vue-intl';
 import { messages, switchValidation } from './../messages';
 import { packageMetadata } from '../package-metadata';
@@ -136,8 +137,8 @@ var SwitchVue2 = {
     }
   },
   mounted: function mounted() {
-    this._element = this.v3 ? this.elementRef : this.$refs.element;
-    this.input = this.v3 ? this.inputRef : this.$refs.input;
+    this._element = getRef(this, 'element');
+    this.input = getRef(this, 'input');
     this.currentDir = this.$props.dir !== undefined ? this.$props.dir : isRtl(this.$el) ? 'rtl' : 'ltr';
     this.setValidity();
   },
@@ -145,16 +146,14 @@ var SwitchVue2 = {
     this.setValidity();
   },
   // @ts-ignore
-  setup: !gh ? undefined : function () {
-    var v3 = !!gh;
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
     return {
       v3: v3
     };
   },
   // @ts-ignore
   render: function render(createElement) {
-    var _this = this;
-
     var h = gh || createElement;
     var _a = this.$props,
         disabled = _a.disabled,
@@ -189,24 +188,22 @@ var SwitchVue2 = {
         "aria-disabled": disabled || undefined,
         "aria-labelledby": this.$props.ariaLabelledBy,
         "aria-describedby": this.$props.ariaDescribedBy,
-        tabIndex: getTabIndex(tabIndex, disabled, undefined),
-        accessKey: this.$props.accessKey
+        tabindex: getTabIndex(tabIndex, disabled, undefined),
+        accesskey: this.$props.accessKey
       },
       role: 'switch',
       "aria-checked": this.computedValue,
       "aria-disabled": disabled || undefined,
       "aria-labelledby": this.$props.ariaLabelledBy,
       "aria-describedby": this.$props.ariaDescribedBy,
-      ref: this.v3 ? function (el) {
-        _this.elementRef = el;
-      } : 'element',
-      tabIndex: getTabIndex(tabIndex, disabled, undefined),
-      accessKey: this.$props.accessKey
+      ref: setRef(this, 'element'),
+      tabindex: getTabIndex(tabIndex, disabled, undefined),
+      accesskey: this.$props.accessKey
     }, [h("input", {
       type: "checkbox",
       attrs: this.v3 ? undefined : {
         type: "checkbox",
-        tabIndex: -1,
+        tabindex: -1,
         name: this.$props.name,
         required: required !== undefined ? required : false,
         "aria-hidden": true
@@ -216,10 +213,8 @@ var SwitchVue2 = {
         "checked": this.$props.checked,
         "value": this.computedValue
       },
-      ref: this.v3 ? function (el) {
-        _this.inputRef = el;
-      } : 'input',
-      tabIndex: -1,
+      ref: setRef(this, 'input'),
+      tabindex: -1,
       name: this.$props.name,
       required: required !== undefined ? required : false,
       "aria-hidden": true,

package/dist/es/textarea/TextArea.js

@@ -18,6 +18,7 @@ var __assign = this && this.__assign || function () {
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
+var isV3 = allVue.version[0] === '3';
 import { guid, isRtl, getTabIndex, validatePackage, kendoThemeMaps, templateDefinition, templateRendering, getListeners, getTemplate // useDir,
 } from '@progress/kendo-vue-common';
 import { packageMetadata } from '../package-metadata';
@@ -193,8 +194,8 @@ var TextAreaVue2 = {
     this.setValidity();
   },
   // @ts-ignore
-  setup: !gh ? undefined : function () {
-    var v3 = !!gh;
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
     return {
       v3: v3
     };

package/dist/npm/checkbox/Checkbox.js

@@ -9,6 +9,7 @@ var Vue = require("vue");
 
 var allVue = Vue;
 var gh = allVue.h;
+var isV3 = allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 
@@ -157,7 +158,7 @@ var CheckboxVue2 = {
     }
   },
   mounted: function mounted() {
-    this.input = this.v3 ? this.inputRef : this.$refs.input;
+    this.input = kendo_vue_common_1.getRef(this, 'input');
 
     if (!this.currentDir && window && this.$el) {
       // Note: getComputedStyle forces reflow
@@ -172,14 +173,14 @@ var CheckboxVue2 = {
   },
   updated: function updated() {
     if (!this.input) {
-      this.input = this.v3 ? this.inputRef : this.$refs.input;
+      this.input = kendo_vue_common_1.getRef(this, 'input');
     }
 
     this.setValidity();
   },
   // @ts-ignore
-  setup: !gh ? undefined : function () {
-    var v3 = !!gh;
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
     var inputRef = ref(null);
     var kendoLocalizationService = inject('kendoLocalizationService', {});
     return {
@@ -220,8 +221,6 @@ var CheckboxVue2 = {
     }, _a["k-checkbox-" + kendo_vue_common_1.kendoThemeMaps.sizeMap[size]] = size, _a["k-rounded-" + kendo_vue_common_1.kendoThemeMaps.roundedMap[rounded]] = rounded, _a['k-state-indeterminate'] = this.indeterminateProp, _a['k-state-invalid k-invalid'] = !(this.isValid || validityStyles !== undefined || validityStyles === true), _a));
 
     var checkboxInput = function checkboxInput() {
-      var _this = this;
-
       return h("input", {
         type: 'checkbox',
         attrs: this.v3 ? undefined : {
@@ -231,7 +230,7 @@ var CheckboxVue2 = {
           "aria-labelledby": ariaLabelledBy,
           "aria-describedby": ariaDescribedBy,
           disabled: disabled,
-          tabIndex: kendo_vue_common_1.getTabIndex(tabIndex, disabled),
+          tabindex: kendo_vue_common_1.getTabIndex(tabIndex, disabled),
           role: 'checkbox',
           required: required !== undefined ? required : false,
           "aria-checked": this.computedChecked || this.checkedProp ? true : this.indeterminateProp ? 'mixed' : false,
@@ -240,9 +239,7 @@ var CheckboxVue2 = {
         "class": inputClasses,
         name: name,
         id: id || this.calculatedId,
-        ref: this.v3 ? function (el) {
-          _this.inputRef = el;
-        } : 'input',
+        ref: kendo_vue_common_1.setRef(this, 'input'),
         "aria-labelledby": ariaLabelledBy,
         "aria-describedby": ariaDescribedBy,
         checked: this.v3 ? Boolean(this.checkedProp) : null,
@@ -250,7 +247,7 @@ var CheckboxVue2 = {
           "checked": Boolean(this.checkedProp)
         },
         disabled: disabled,
-        tabIndex: kendo_vue_common_1.getTabIndex(tabIndex, disabled),
+        tabindex: kendo_vue_common_1.getTabIndex(tabIndex, disabled),
         role: 'checkbox',
         required: required !== undefined ? required : false,
         "aria-checked": this.computedChecked || this.checkedProp ? true : this.indeterminateProp ? 'mixed' : false,

package/dist/npm/colors/ColorContrastLabels.d.ts

@@ -0,0 +1,49 @@
+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 { RGBA } from './models/rgba';
+/**
+ * @hidden
+ */
+export interface ColorContrastLabelsProps {
+    bgColor: RGBA;
+    rgba: RGBA;
+}
+/**
+ * @hidden
+ */
+export interface ColorContrastLabelsState {
+}
+/**
+ * @hidden
+ */
+export interface ColorContrastLabelsComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface ColorContrastLabelsMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface ColorContrastLabelsData {
+}
+/**
+ * @hidden
+ */
+export interface ColorContrastLabelsAll extends Vue2type, ColorContrastLabelsMethods, ColorContrastLabelsData, ColorContrastLabelsComputed, ColorContrastLabelsState {
+}
+/**
+ * @hidden
+ */
+declare let ColorContrastLabelsVue2: ComponentOptions<ColorContrastLabelsAll, DefaultData<ColorContrastLabelsData>, DefaultMethods<ColorContrastLabelsAll>, ColorContrastLabelsComputed, RecordPropsDefinition<ColorContrastLabelsProps>>;
+/**
+ * @hidden
+ */
+declare const ColorContrastLabels: DefineComponent<ColorContrastLabelsProps, any, ColorContrastLabelsData, ColorContrastLabelsComputed, ColorContrastLabelsMethods, {}, {}, {}, string, ColorContrastLabelsProps, ColorContrastLabelsProps, {}>;
+export { ColorContrastLabels, ColorContrastLabelsVue2 };