@progress/kendo-vue-inputs 3.4.3 → 3.4.4-dev.202207220925

package/dist/es/checkbox/Checkbox.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 import { Keys, classNames, guid, getTabIndex, getDefaultSlots, validatePackage, templateRendering, getTemplate, getListeners, kendoThemeMaps, setRef, getRef } from '@progress/kendo-vue-common';

package/dist/es/colors/ColorContrastLabels.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 import { provideLocalizationService } from '@progress/kendo-vue-intl';
 import { messages, colorGradientContrastRatio, colorGradientAALevel, colorGradientAAALevel, colorGradientPass, colorGradientFail } from '../messages';
 import { getContrastFromTwoRGBAs } from './utils/color-parser';
@@ -43,12 +43,16 @@ var ColorContrastLabelsVue2 = {
     var contrastText = contrastRatioMessage + ": " + contrast.toFixed(2);
     var aaText = AALevelMessage + ": " + requiredAAContrast;
     var aaaText = AAALevelMessage + ": " + requiredAAAContrast;
+    var aaPass = contrast >= 4.5;
+    var aaaPass = contrast >= 7;
     var success = h("span", {
+      key: 1,
       "class": "k-contrast-validation k-text-success"
     }, [passMessage, " ", h("span", {
       "class": "k-icon k-i-check"
     })]);
     var error = h("span", {
+      key: 2,
       "class": "k-contrast-validation k-text-error"
     }, [failMessage, " ", h("span", {
       "class": "k-icon k-i-close"
@@ -59,17 +63,17 @@ var ColorContrastLabelsVue2 = {
       "class": "k-contrast-ratio"
     }, [h("span", {
       "class": "k-contrast-ratio-text"
-    }, [contrastText]), contrast >= 4.5 ? h("span", {
+    }, [contrastText]), aaPass ? h("span", {
       "class": "k-contrast-validation k-text-success"
     }, [h("span", {
       "class": "k-icon k-i-check"
-    }), contrast >= 7 && h("span", {
+    }), aaaPass && h("span", {
       "class": "k-icon k-i-check"
     })]) : h("span", {
       "class": "k-contrast-validation k-text-error"
     }, [h("span", {
       "class": "k-icon k-i-close"
-    })])]), h("div", [h("span", [aaText]), contrast >= 4.5 ? success : error]), h("div", [h("span", [aaaText]), contrast >= 7 ? success : error])]);
+    })])]), h("div", [h("span", [aaText]), aaPass ? success : error]), h("div", [h("span", [aaaText]), aaaPass ? success : error])]);
   }
 };
 /**

package/dist/es/colors/ColorContrastSvg.js

@@ -2,8 +2,8 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
-import { bezierCommand, controlPoint, line, svgPath } from './utils/svg-calc';
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { bezierCommand, controlPoint, line } from './utils/svg-calc';
 import { getColorFromHSV, getRGBA, getContrastFromTwoRGBAs } from './utils/color-parser';
 var AA_CONTRAST = 4.5;
 var AAA_CONTRAST = 7;
@@ -28,62 +28,83 @@ var ColorContrastSvgVue2 = {
   },
   // @ts-ignore
   render: function render(createElement) {
+    var _this = this;
+
     var h = gh || createElement;
 
-    var renderSvgCurveLine = function renderSvgCurveLine() {
-      var _this = this;
+    var svgPath = function svgPath(points, command) {
+      if (points.length === 0) {
+        return '';
+      } // build the d attributes by looping over the points
 
-      var gradientRectMetrics = this.$props.metrics;
 
-      var findValue = function findValue(contrast, saturation, low, high, comparer) {
-        var mid = (low + high) / 2;
-        var hsva = Object.assign({}, _this.$props.hsva, {
-          s: saturation / gradientRectMetrics.width,
-          v: 1 - mid / gradientRectMetrics.height
-        });
-        var currentContrast = getContrastFromTwoRGBAs(getRGBA(getColorFromHSV(hsva)), getRGBA(_this.$props.backgroundColor || ''));
-
-        if (low + 0.5 > high) {
-          if (currentContrast < contrast + 1 && currentContrast > contrast - 1) {
-            return mid;
-          } else {
-            return null;
-          }
-        }
+      var d = points.reduce(function (acc, point, i, a) {
+        return i === 0 ? // if first point
+        "M " + point[0] + "," + point[1] : // else
+        acc + " " + command(point, i, a);
+      }, '');
+      return h("path", {
+        d: d,
+        attrs: this.v3 ? undefined : {
+          d: d,
+          fill: "none",
+          stroke: "white",
+          "stroke-width": "1"
+        },
+        fill: "none",
+        stroke: "white",
+        "stroke-width": "1"
+      });
+    };
 
-        if (comparer(currentContrast, contrast)) {
-          return findValue(contrast, saturation, low, high - (high - low) / 2, comparer);
-        }
+    var gradientRectMetrics = this.$props.metrics;
 
-        return findValue(contrast, saturation, low + (high - low) / 2, high, comparer);
-      };
+    var findValue = function findValue(contrast, saturation, low, high, comparer) {
+      var mid = (low + high) / 2;
+      var hsva = Object.assign({}, _this.$props.hsva, {
+        s: saturation / gradientRectMetrics.width,
+        v: 1 - mid / gradientRectMetrics.height
+      });
+      var currentContrast = getContrastFromTwoRGBAs(getRGBA(getColorFromHSV(hsva)), getRGBA(_this.$props.backgroundColor || ''));
 
-      var getPaths = function getPaths(contrast, stepCount, reversed) {
-        if (reversed === void 0) {
-          reversed = false;
+      if (low + 0.5 > high) {
+        if (currentContrast < contrast + 1 && currentContrast > contrast - 1) {
+          return mid;
+        } else {
+          return null;
         }
+      }
 
-        var points = [];
+      if (comparer(currentContrast, contrast)) {
+        return findValue(contrast, saturation, low, high - (high - low) / 2, comparer);
+      }
 
-        for (var i = 0; i <= gradientRectMetrics.width; i += gradientRectMetrics.width / stepCount) {
-          var value = findValue(contrast, i, 0, gradientRectMetrics.height, reversed ? function (a, b) {
-            return a < b;
-          } : function (a, b) {
-            return a > b;
-          });
+      return findValue(contrast, saturation, low + (high - low) / 2, high, comparer);
+    };
 
-          if (value !== null) {
-            points.push([i, value]);
-          }
-        }
+    var getPaths = function getPaths(contrast, stepCount, reversed) {
+      if (reversed === void 0) {
+        reversed = false;
+      }
 
-        return points;
-      };
+      var points = [];
+
+      for (var i = 0; i <= gradientRectMetrics.width; i += gradientRectMetrics.width / stepCount) {
+        var value = findValue(contrast, i, 0, gradientRectMetrics.height, reversed ? function (a, b) {
+          return a < b;
+        } : function (a, b) {
+          return a > b;
+        });
+
+        if (value !== null) {
+          points.push([i, value]);
+        }
+      }
 
-      var bezierCommandCalc = bezierCommand(controlPoint(line));
-      return svgPath(getPaths(AA_CONTRAST, STEP_COUNT), bezierCommandCalc) + svgPath(getPaths(AA_CONTRAST, STEP_COUNT, true), bezierCommandCalc) + svgPath(getPaths(AAA_CONTRAST, STEP_COUNT), bezierCommandCalc) + svgPath(getPaths(AAA_CONTRAST, STEP_COUNT, true), bezierCommandCalc);
+      return points;
     };
 
+    var bezierCommandCalc = bezierCommand(controlPoint(line));
     return h("svg", {
       xmlns: "http://www.w3.org/2000/svg",
       attrs: this.v3 ? undefined : {
@@ -98,7 +119,7 @@ var ColorContrastSvgVue2 = {
         top: 0,
         zIndex: 3
       }
-    }, [renderSvgCurveLine.call(this)]);
+    }, [svgPath.call(this, getPaths(AA_CONTRAST, STEP_COUNT), bezierCommandCalc), svgPath.call(this, getPaths(AA_CONTRAST, STEP_COUNT, true), bezierCommandCalc), svgPath.call(this, getPaths(AAA_CONTRAST, STEP_COUNT), bezierCommandCalc), svgPath.call(this, getPaths(AAA_CONTRAST, STEP_COUNT, true), bezierCommandCalc)]);
   }
 };
 /**

package/dist/es/colors/ColorGradient.d.ts

@@ -31,7 +31,7 @@ export interface ColorGradientMethods {
  */
 export interface ColorGradientData {
     hsva: HSVA;
-    backgroundColor: string;
+    currentBgColor: string;
     rgba: RGBA;
     hex: string;
     isFirstRender: boolean;

package/dist/es/colors/ColorGradient.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 import { Draggable, guid, classNames, focusFirstFocusableChild, getTabIndex } from '@progress/kendo-vue-common';
 import { validatePackage } from '@progress/kendo-vue-common';
 import { packageMetadata } from '../package-metadata';
@@ -69,7 +69,7 @@ var ColorGradientVue2 = {
       return this.currentHex || getCachedHex(this.guid, this.computedValue) || parseColor(this.computedValue, 'hex');
     },
     computedBgColor: function computedBgColor() {
-      return this.backgroundColor !== undefined ? this.backgroundColor : this.currentBgColor || getColorFromHue(this.hsva.h);
+      return this.currentBgColor || getColorFromHue(this.hsva.h);
     }
   },
   data: function data() {
@@ -196,15 +196,15 @@ var ColorGradientVue2 = {
       on: _this2.v3 ? undefined : {
         "click": _this2.onGradientWrapperClick
       }
-    }, [renderRectangleDragHandle.call(_this2)])]), this.computedBgColor && !this.isFirstRender && h(ColorContrastSvg, {
+    }, [renderRectangleDragHandle.call(_this2)])]), this.backgroundColor && !this.isFirstRender && h(ColorContrastSvg, {
       metrics: this.gradientWrapper ? this.getGradientRectMetrics() : undefined,
       attrs: this.v3 ? undefined : {
         metrics: this.gradientWrapper ? this.getGradientRectMetrics() : undefined,
         hsva: this.hsva,
-        backgroundColor: this.computedBgColor
+        backgroundColor: this.backgroundColor
       },
       hsva: this.hsva,
-      backgroundColor: this.computedBgColor
+      backgroundColor: this.backgroundColor
     })]), h("div", {
       "class": "k-hsv-controls k-hstack"
     }, [h(Slider, {
@@ -273,20 +273,18 @@ var ColorGradientVue2 = {
       onRgbachange: this.onRgbaChange,
       on: this.v3 ? undefined : {
         "rgbachange": this.onRgbaChange,
-        "focus": this.onFocus,
         "blur": this.onBlur,
         "hexchange": this.onHexChange
       },
       hex: this.hex,
-      onFocus: this.onFocus,
       onBlur: this.onBlur,
       onHexchange: this.onHexChange,
       opacity: this.$props.opacity,
       disabled: this.$props.disabled
-    }), this.computedBgColor && h(ColorContrastLabels, {
-      bgColor: getRGBA(this.computedBgColor),
+    }), this.backgroundColor && h(ColorContrastLabels, {
+      bgColor: getRGBA(this.backgroundColor),
       attrs: this.v3 ? undefined : {
-        bgColor: getRGBA(this.computedBgColor),
+        bgColor: getRGBA(this.backgroundColor),
         rgba: this.rgba
       },
       rgba: this.rgba
@@ -314,7 +312,7 @@ var ColorGradientVue2 = {
         cacheHex(this.guid, value, hex);
       }
 
-      this.dispatchChangeEvent(value, event, event.nativeEvent);
+      this.dispatchChangeEvent(value, event, event.event);
     },
     onRgbaChange: function onRgbaChange(rgba, event) {
       var value = getColorFromRGBA(rgba);

package/dist/es/colors/ColorInput.js

@@ -18,7 +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 isV3 = allVue.version && allVue.version[0] === '3';
 import { NumericTextBox } from '../main';
 import { HexInput } from './HexInput';
 import { Button } from '@progress/kendo-vue-buttons';
@@ -251,7 +251,7 @@ var ColorInputVue2 = {
       this.$emit('blur', event);
     },
     onHexChange: function onHexChange(event) {
-      this.$emit('hexchange', event);
+      this.$emit('hexchange', event.hex, event.value, event);
     },
     onRgbaRChange: function onRgbaRChange(event) {
       this.dispatchRgbaChange({

package/dist/es/colors/ColorPalette.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 import { ColorPaletteService } from './utils/color-palette.service';
 import { classNames, Keys, guid, getTabIndex, validatePackage, setRef, getRef } from '@progress/kendo-vue-common';
 import { packageMetadata } from '../package-metadata';

package/dist/es/colors/ColorPicker.js

@@ -18,7 +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 isV3 = allVue.version && allVue.version[0] === '3';
 import { Button } from '@progress/kendo-vue-buttons';
 import { classNames, Keys, // useDir, 
 getTabIndex, guid, kendoThemeMaps, validatePackage, setRef, getRef } from '@progress/kendo-vue-common';

package/dist/es/colors/FlatColorPicker.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 import { classNames, validatePackage, getTabIndex } from '@progress/kendo-vue-common';
 import { ButtonGroup, Button } from '@progress/kendo-vue-buttons';
 import { ColorPalette } from './ColorPalette';

package/dist/es/colors/HexInput.js

@@ -2,10 +2,10 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 import { parseColor } from './utils/color-parser';
 import { isPresent } from './utils/misc';
-import { Input } from '../input/Input';
+import { Input as KInput } from '../input/Input';
 /**
  * @hidden
  */
@@ -28,11 +28,6 @@ var HexInputVue2 = {
       originalHex: this.$props.hex
     };
   },
-  computed: {
-    computedHex: function computedHex() {
-      return this.hex !== undefined ? this.hex : this.currentHex;
-    }
-  },
   // @ts-ignore
   setup: !isV3 ? undefined : function () {
     var v3 = !!isV3;
@@ -40,21 +35,28 @@ var HexInputVue2 = {
       v3: v3
     };
   },
+  watch: {
+    hex: function hex(newValue) {
+      this.currentHex = newValue;
+    }
+  },
   // @ts-ignore
   render: function render(createElement) {
     var h = gh || createElement;
-    return h(Input, {
-      value: this.computedHex,
+    return h(KInput, {
+      value: this.currentHex,
       attrs: this.v3 ? undefined : {
-        value: this.computedHex,
+        value: this.currentHex,
         disabled: this.$props.disabled
       },
-      onChange: this.onChange,
+      onInput: this.onChange,
       on: this.v3 ? undefined : {
+        "input": this.onChange,
         "change": this.onChange,
         "focus": this.onFocus,
         "blur": this.onBlur
       },
+      onChange: this.onChange,
       onFocus: this.onFocus,
       onBlur: this.onBlur,
       disabled: this.$props.disabled
@@ -67,7 +69,11 @@ var HexInputVue2 = {
       this.currentHex = hex;
 
       if (isPresent(value)) {
-        this.$emit('hexchange', hex, value, event);
+        this.$emit('hexchange', {
+          hex: hex,
+          value: value,
+          event: event
+        });
       }
     },
     onBlur: function onBlur(event) {

package/dist/es/colors/Picker.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 import { Popup } from '@progress/kendo-vue-popup';
 import { classNames, getDefaultSlots } from '@progress/kendo-vue-common';
 /**

package/dist/es/input/Input.js

@@ -18,7 +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 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 { packageMetadata } from '../package-metadata';

package/dist/es/input-separator/InputSeparator.js

@@ -3,7 +3,7 @@ import { validatePackage } from '@progress/kendo-licensing';
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 import { packageMetadata } from '../package-metadata';
 /**

package/dist/es/maskedtextbox/MaskedTextBox.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 import { MaskingService } from './masking.service';
 import { defaultRules, maskingChanged, returnFalse } from './utils';

package/dist/es/numerictextbox/NumericTextBox.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+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';

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: 1657627749,
+    publishDate: 1658481454,
     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,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 import { guid, getTabIndex, getDefaultSlots, templateRendering, getTemplate, getListeners, kendoThemeMaps, setRef, getRef } from '@progress/kendo-vue-common';

package/dist/es/radiobutton/RadioGroup.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 import { RadioButton } from './RadioButton';

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

@@ -18,7 +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 isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 import { Draggable, Keys, // useDir,

package/dist/es/slider/Slider.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 import { Button } from '@progress/kendo-vue-buttons';

package/dist/es/slider/SliderLabel.js

@@ -18,7 +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 isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 import { getDefaultSlots } from '@progress/kendo-vue-common';
 /**

package/dist/es/switch/Switch.js

@@ -2,7 +2,7 @@
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && 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';

package/dist/es/textarea/TextArea.js

@@ -18,7 +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 isV3 = allVue.version && 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';

package/dist/npm/checkbox/Checkbox.js

@@ -9,7 +9,7 @@ var Vue = require("vue");
 
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 

package/dist/npm/colors/ColorContrastLabels.js

@@ -9,7 +9,7 @@ var Vue = require("vue");
 
 var allVue = Vue;
 var gh = allVue.h;
-var isV3 = allVue.version[0] === '3';
+var isV3 = allVue.version && allVue.version[0] === '3';
 
 var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
 
@@ -54,12 +54,16 @@ var ColorContrastLabelsVue2 = {
     var contrastText = contrastRatioMessage + ": " + contrast.toFixed(2);
     var aaText = AALevelMessage + ": " + requiredAAContrast;
     var aaaText = AAALevelMessage + ": " + requiredAAAContrast;
+    var aaPass = contrast >= 4.5;
+    var aaaPass = contrast >= 7;
     var success = h("span", {
+      key: 1,
       "class": "k-contrast-validation k-text-success"
     }, [passMessage, " ", h("span", {
       "class": "k-icon k-i-check"
     })]);
     var error = h("span", {
+      key: 2,
       "class": "k-contrast-validation k-text-error"
     }, [failMessage, " ", h("span", {
       "class": "k-icon k-i-close"
@@ -70,17 +74,17 @@ var ColorContrastLabelsVue2 = {
       "class": "k-contrast-ratio"
     }, [h("span", {
       "class": "k-contrast-ratio-text"
-    }, [contrastText]), contrast >= 4.5 ? h("span", {
+    }, [contrastText]), aaPass ? h("span", {
       "class": "k-contrast-validation k-text-success"
     }, [h("span", {
       "class": "k-icon k-i-check"
-    }), contrast >= 7 && h("span", {
+    }), aaaPass && h("span", {
       "class": "k-icon k-i-check"
     })]) : h("span", {
       "class": "k-contrast-validation k-text-error"
     }, [h("span", {
       "class": "k-icon k-i-close"
-    })])]), h("div", [h("span", [aaText]), contrast >= 4.5 ? success : error]), h("div", [h("span", [aaaText]), contrast >= 7 ? success : error])]);
+    })])]), h("div", [h("span", [aaText]), aaPass ? success : error]), h("div", [h("span", [aaaText]), aaaPass ? success : error])]);
   }
 };
 exports.ColorContrastLabelsVue2 = ColorContrastLabelsVue2;