@progress/kendo-react-inputs 5.4.0-dev.202205200719 → 5.4.0-dev.202206061009

package/dist/npm/colors/Picker.js

@@ -11,6 +11,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Picker = void 0;
 var React = require("react");
 var kendo_react_popup_1 = require("@progress/kendo-react-popup");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
@@ -25,7 +26,7 @@ var POPUP_VERTICAL_ALIGN = 'top';
 /**
  * @hidden
  */
-exports.Picker = function (props) {
+var Picker = function (props) {
     var popupSettings = props.popupSettings || {};
     var horizontalAlign = props.dir === 'rtl' ? 'right' : 'left';
     var anchorAlign = React.useMemo(function () { return ({ horizontal: horizontalAlign, vertical: ANCHOR_VERTICAL_ALIGN }); }, [horizontalAlign]);
@@ -33,6 +34,7 @@ exports.Picker = function (props) {
     return (React.createElement(React.Fragment, null,
         props.input,
         props.button,
-        React.createElement(kendo_react_popup_1.Popup, __assign({ style: __assign({}, (popupSettings || {}).style, { direction: props.dir }) }, popupSettings, { anchor: props.popupAnchor, anchorAlign: anchorAlign, popupAlign: popupAlign, show: props.open, onOpen: props.onOpen, onClose: props.onClose, className: kendo_react_common_1.classNames('k-reset', popupSettings.className) }), props.content)));
+        React.createElement(kendo_react_popup_1.Popup, __assign({ style: __assign(__assign({}, (popupSettings || {}).style), { direction: props.dir }) }, popupSettings, { anchor: props.popupAnchor, anchorAlign: anchorAlign, popupAlign: popupAlign, show: props.open, onOpen: props.onOpen, onClose: props.onClose, className: (0, kendo_react_common_1.classNames)('k-reset', popupSettings.className) }), props.content)));
 };
+exports.Picker = Picker;
 exports.Picker.displayName = 'KendoPickerComponent';

package/dist/npm/colors/models/palette-presets.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.PALETTEPRESETS = void 0;
 /* eslint-disable max-len */
 /**
  * @hidden

package/dist/npm/colors/utils/color-cache.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.getCachedRgba = exports.getCachedHsva = exports.getCachedHex = exports.removeCachedColor = exports.cacheHex = exports.cacheRgba = exports.cacheHsva = void 0;
 var cache = {};
 /**
  * @hidden

package/dist/npm/colors/utils/color-palette.service.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ColorPaletteService = void 0;
 var misc_1 = require("./misc");
 var kendo_drawing_1 = require("@progress/kendo-drawing");
 /**
@@ -11,7 +12,7 @@ var ColorPaletteService = /** @class */ (function () {
     }
     ColorPaletteService.prototype.setColorMatrix = function (palette, columns) {
         this.colorRows = [];
-        if (!(misc_1.isPresent(palette) && palette.length)) {
+        if (!((0, misc_1.isPresent)(palette) && palette.length)) {
             return;
         }
         columns = columns || palette.length;
@@ -22,12 +23,12 @@ var ColorPaletteService = /** @class */ (function () {
     };
     ColorPaletteService.prototype.getCellCoordsFor = function (color) {
         var _this = this;
-        if (!misc_1.isPresent(color)) {
+        if (!(0, misc_1.isPresent)(color)) {
             return;
         }
-        var parsedColor = color ? kendo_drawing_1.parseColor(color, true) : color;
+        var parsedColor = color ? (0, kendo_drawing_1.parseColor)(color, true) : color;
         var colors = [color];
-        if (misc_1.isPresent(parsedColor)) {
+        if ((0, misc_1.isPresent)(parsedColor)) {
             colors.push(parsedColor.toCss(), parsedColor.toCssRgba());
         }
         var _loop_1 = function (row) {
@@ -50,13 +51,13 @@ var ColorPaletteService = /** @class */ (function () {
         }
     };
     ColorPaletteService.prototype.getColorAt = function (cellCoords) {
-        if (!(misc_1.isPresent(cellCoords) && misc_1.isPresent(this.colorRows[cellCoords.row]))) {
+        if (!((0, misc_1.isPresent)(cellCoords) && (0, misc_1.isPresent)(this.colorRows[cellCoords.row]))) {
             return;
         }
         return this.colorRows[cellCoords.row][cellCoords.col];
     };
     ColorPaletteService.prototype.getNextCell = function (current, horizontalStep, verticalStep) {
-        if (!(misc_1.isPresent(current) && misc_1.isPresent(current.row) && misc_1.isPresent(current.col))) {
+        if (!((0, misc_1.isPresent)(current) && (0, misc_1.isPresent)(current.row) && (0, misc_1.isPresent)(current.col))) {
             return { row: 0, col: 0 };
         }
         var row = this.clampIndex(current.row + verticalStep, this.colorRows.length - 1);

package/dist/npm/colors/utils/color-parser.d.ts

@@ -7,7 +7,7 @@ import { RGBA } from '../models/rgba';
  *
  * Returns the hex or RGBA string representation of the color.
  */
-export declare const parseColor: (value: string, format: OutputFormat, safe?: boolean) => string;
+export declare const parseColor: (value: string, format: OutputFormat, safe?: boolean) => string | undefined;
 /**
  * @hidden
  *

package/dist/npm/colors/utils/color-parser.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.getContrastFromTwoRGBAs = exports.getContrast = exports.getLuminance = exports.getRGBFromRGBA = exports.getColorFromRGBA = exports.getColorFromHue = exports.getColorFromHSV = exports.getRGBA = exports.getHSV = exports.parseColor = void 0;
 var kendo_drawing_1 = require("@progress/kendo-drawing");
 var misc_1 = require("./misc");
 /**
@@ -7,107 +8,114 @@ var misc_1 = require("./misc");
  *
  * Returns the hex or RGBA string representation of the color.
  */
-exports.parseColor = function (value, format, safe) {
+var parseColor = function (value, format, safe) {
     if (safe === void 0) { safe = true; }
     var allowedFormats = ['hex', 'rgba']; // TODO: constant?
     // Angular supports third type: name : const allowedFormats: Array<string> = ['hex', 'rgba', 'name'];
     if (allowedFormats.indexOf(format) === -1) {
-        throw new Error("Unsupported color output format '" + format + "'. The available options are 'hex' or 'rgba'.");
+        throw new Error("Unsupported color output format '".concat(format, "'. The available options are 'hex' or 'rgba'."));
     }
-    if (!misc_1.isPresent(value)) {
+    if (!(0, misc_1.isPresent)(value)) {
         return;
     }
-    var parsedColor = kendo_drawing_1.parseColor(value.trim(), safe);
-    if (!misc_1.isPresent(parsedColor)) {
+    var parsedColor = (0, kendo_drawing_1.parseColor)(value.trim(), safe);
+    if (!(0, misc_1.isPresent)(parsedColor)) {
         return;
     }
     return format === 'hex' ? parsedColor.toCss() : parsedColor.toCssRgba();
 };
+exports.parseColor = parseColor;
 /**
  * @hidden
  *
  * Returns an HSV object representation of the color string.
  */
-exports.getHSV = function (value, safe) {
+var getHSV = function (value, safe) {
     if (safe === void 0) { safe = true; }
-    var parsed = kendo_drawing_1.parseColor(value, safe);
-    if (!misc_1.isPresent(parsed)) {
+    var parsed = (0, kendo_drawing_1.parseColor)(value, safe);
+    if (!(0, misc_1.isPresent)(parsed)) {
         return {};
     }
     return parsed.toHSV();
 };
+exports.getHSV = getHSV;
 /**
  * @hidden
  *
  * Returns an RGBA object representation of the color string.
  */
-exports.getRGBA = function (value, safe) {
+var getRGBA = function (value, safe) {
     if (safe === void 0) { safe = true; }
-    var parsed = kendo_drawing_1.parseColor(value, safe);
-    if (!misc_1.isPresent(parsed)) {
+    var parsed = (0, kendo_drawing_1.parseColor)(value, safe);
+    if (!(0, misc_1.isPresent)(parsed)) {
         return {};
     }
     return parsed.toBytes();
 };
+exports.getRGBA = getRGBA;
 /**
  * @hidden
  *
  * Returns the RGBA string representation of the color.
  */
-exports.getColorFromHSV = function (hsva) {
-    var hue = misc_1.fitIntoBounds(hsva.h, 0, 359.9);
-    var saturation = misc_1.fitIntoBounds(hsva.s, 0, 1);
-    var value = misc_1.fitIntoBounds(hsva.v, 0, 1);
-    var alpha = misc_1.fitIntoBounds(hsva.a, 0, 1);
+var getColorFromHSV = function (hsva) {
+    var hue = (0, misc_1.fitIntoBounds)(hsva.h, 0, 359.9);
+    var saturation = (0, misc_1.fitIntoBounds)(hsva.s, 0, 1);
+    var value = (0, misc_1.fitIntoBounds)(hsva.v, 0, 1);
+    var alpha = (0, misc_1.fitIntoBounds)(hsva.a, 0, 1);
     return kendo_drawing_1.Color.fromHSV(hue, saturation, value, alpha).toCssRgba();
 };
+exports.getColorFromHSV = getColorFromHSV;
 /**
  * @hidden
  *
  * Returns the RGBA string representation of the color based on the `hue` and
  * assuming the `value`, `saturation`, and `alpha` have a value of `1`.
  */
-exports.getColorFromHue = function (hue) {
-    return exports.getColorFromHSV({ h: hue, s: 1, v: 1, a: 1 });
+var getColorFromHue = function (hue) {
+    return (0, exports.getColorFromHSV)({ h: hue, s: 1, v: 1, a: 1 });
 };
+exports.getColorFromHue = getColorFromHue;
 /**
  * @hidden
  *
  * Returns the RGBA string representation of the color.
  */
-exports.getColorFromRGBA = function (rgba) {
-    var red = misc_1.fitIntoBounds(rgba.r, 0, 255);
-    var green = misc_1.fitIntoBounds(rgba.g, 0, 255);
-    var blue = misc_1.fitIntoBounds(rgba.b, 0, 255);
-    var alpha = misc_1.fitIntoBounds(rgba.a, 0, 1);
+var getColorFromRGBA = function (rgba) {
+    var red = (0, misc_1.fitIntoBounds)(rgba.r, 0, 255);
+    var green = (0, misc_1.fitIntoBounds)(rgba.g, 0, 255);
+    var blue = (0, misc_1.fitIntoBounds)(rgba.b, 0, 255);
+    var alpha = (0, misc_1.fitIntoBounds)(rgba.a, 0, 1);
     return kendo_drawing_1.Color.fromBytes(red, green, blue, alpha).toCssRgba();
 };
+exports.getColorFromRGBA = getColorFromRGBA;
 /**
  * @hidden
  *
  * Returns the RGB object representation of the color based on the background color.
  */
-exports.getRGBFromRGBA = function (foregroundColor, backgroundColor) {
-    var r1 = misc_1.fitIntoBounds(foregroundColor.r, 0, 255);
-    var g1 = misc_1.fitIntoBounds(foregroundColor.g, 0, 255);
-    var b1 = misc_1.fitIntoBounds(foregroundColor.b, 0, 255);
-    var a1 = misc_1.fitIntoBounds(foregroundColor.a, 0, 1);
-    var r2 = misc_1.fitIntoBounds(backgroundColor.r, 0, 255);
-    var g2 = misc_1.fitIntoBounds(backgroundColor.g, 0, 255);
-    var b2 = misc_1.fitIntoBounds(backgroundColor.b, 0, 255);
+var getRGBFromRGBA = function (foregroundColor, backgroundColor) {
+    var r1 = (0, misc_1.fitIntoBounds)(foregroundColor.r, 0, 255);
+    var g1 = (0, misc_1.fitIntoBounds)(foregroundColor.g, 0, 255);
+    var b1 = (0, misc_1.fitIntoBounds)(foregroundColor.b, 0, 255);
+    var a1 = (0, misc_1.fitIntoBounds)(foregroundColor.a, 0, 1);
+    var r2 = (0, misc_1.fitIntoBounds)(backgroundColor.r, 0, 255);
+    var g2 = (0, misc_1.fitIntoBounds)(backgroundColor.g, 0, 255);
+    var b2 = (0, misc_1.fitIntoBounds)(backgroundColor.b, 0, 255);
     return {
         r: Math.round(((1 - a1) * r2) + (a1 * r1)),
         g: Math.round(((1 - a1) * g2) + (a1 * g1)),
         b: Math.round(((1 - a1) * b2) + (a1 * b1))
     };
 };
+exports.getRGBFromRGBA = getRGBFromRGBA;
 /**
  * @hidden
  *
  * Returns the relative luminance.
  */
-exports.getLuminance = function (rgb) {
-    var a = [rgb.r, rgb.g, rgb.b].map(function (v) {
+var getLuminance = function (rgb) {
+    var a = [rgb.r || 0, rgb.g || 0, rgb.b || 0].map(function (v) {
         v /= 255;
         return v <= 0.03928
             ? v / 12.92
@@ -115,22 +123,25 @@ exports.getLuminance = function (rgb) {
     });
     return a[0] * 0.2126 + a[1] * 0.7152 + a[2] * 0.0722;
 };
+exports.getLuminance = getLuminance;
 /**
  * @hidden
  *
  * Returns the color contrast.
  */
-exports.getContrast = function (luminance1, luminance2) {
+var getContrast = function (luminance1, luminance2) {
     var brightest = Math.max(luminance1, luminance2);
     var darkest = Math.min(luminance1, luminance2);
     return (brightest + 0.05)
         / (darkest + 0.05);
 };
+exports.getContrast = getContrast;
 /**
  * @hidden
  *
  * Returns the color contrast from two RGBA colors.
  */
-exports.getContrastFromTwoRGBAs = function (a, b) {
-    return exports.getContrast(exports.getLuminance(exports.getRGBFromRGBA(a, b)), exports.getLuminance(exports.getRGBFromRGBA(b, { r: 0, g: 0, b: 0, a: 1 })));
+var getContrastFromTwoRGBAs = function (a, b) {
+    return (0, exports.getContrast)((0, exports.getLuminance)((0, exports.getRGBFromRGBA)(a, b)), (0, exports.getLuminance)((0, exports.getRGBFromRGBA)(b, { r: 0, g: 0, b: 0, a: 1 })));
 };
+exports.getContrastFromTwoRGBAs = getContrastFromTwoRGBAs;

package/dist/npm/colors/utils/misc.d.ts

@@ -12,4 +12,4 @@ export declare const isPresent: (value: any) => boolean;
  * @param min The inclusive lower bound number.
  * @param max The inclusive upper bound number.
  */
-export declare const fitIntoBounds: (contender: number, min: number, max: number) => number;
+export declare const fitIntoBounds: (contender: number | undefined, min: number, max: number) => number;

package/dist/npm/colors/utils/misc.js

@@ -1,9 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.fitIntoBounds = exports.isPresent = void 0;
 /**
  * @hidden
  */
-exports.isPresent = function (value) { return value !== null && value !== undefined; };
+var isPresent = function (value) { return value !== null && value !== undefined; };
+exports.isPresent = isPresent;
 /**
  * @hidden
  *
@@ -14,9 +16,10 @@ exports.isPresent = function (value) { return value !== null && value !== undefi
  * @param min The inclusive lower bound number.
  * @param max The inclusive upper bound number.
  */
-exports.fitIntoBounds = function (contender, min, max) {
-    if (!exports.isPresent(contender) || isNaN(contender)) {
+var fitIntoBounds = function (contender, min, max) {
+    if (!(0, exports.isPresent)(contender) || isNaN(contender)) {
         return min;
     }
     return contender <= min ? min : contender >= max ? max : contender;
 };
+exports.fitIntoBounds = fitIntoBounds;

package/dist/npm/colors/utils/svg-calc.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.bezierCommand = exports.controlPoint = exports.line = exports.svgPath = void 0;
 /**
  * @hidden
  *
@@ -13,7 +14,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
  *      @output (string) a svg path command.
  * @output (string) a Svg <path> element
  */
-exports.svgPath = function (points, command) {
+var svgPath = function (points, command) {
     if (points.length === 0) {
         return '';
     }
@@ -21,12 +22,13 @@ exports.svgPath = function (points, command) {
     var d = points.reduce(function (acc, point, i, a) {
         return i === 0 ?
             // if first point
-            "M " + point[0] + "," + point[1] :
+            "M ".concat(point[0], ",").concat(point[1]) :
             // else
-            acc + " " + command(point, i, a);
+            "".concat(acc, " ").concat(command(point, i, a));
     }, '');
-    return "<path d=\"" + d + "\" fill=\"none\" stroke=\"white\" stroke-width=\"1\"/>";
+    return "<path d=\"".concat(d, "\" fill=\"none\" stroke=\"white\" stroke-width=\"1\"/>");
 };
+exports.svgPath = svgPath;
 /**
  * @hidden
  *
@@ -36,7 +38,7 @@ exports.svgPath = function (points, command) {
  * @param pointB (array) [x,y] Represents the end point coordinates.
  * @output (object) { length: (integer), angle: (integer) }
  */
-exports.line = function (pointA, pointB) {
+var line = function (pointA, pointB) {
     var lengthX = pointB[0] - pointA[0];
     var lengthY = pointB[1] - pointA[1];
     return {
@@ -44,6 +46,7 @@ exports.line = function (pointA, pointB) {
         angle: Math.atan2(lengthY, lengthX)
     };
 };
+exports.line = line;
 /**
  * @hidden
  *
@@ -60,7 +63,7 @@ exports.line = function (pointA, pointB) {
  *      @param reverse (boolean, optional) Sets the direction.
  *      @output (array) [x, y] coordinates of a control point.
  */
-exports.controlPoint = function (lineCalc) {
+var controlPoint = function (lineCalc) {
     return function (current, previous, next, reverse) {
         // when 'current' is the first or last point of the array
         // 'previous' and 'next' are undefined 
@@ -79,6 +82,7 @@ exports.controlPoint = function (lineCalc) {
         return [x, y];
     };
 };
+exports.controlPoint = controlPoint;
 /**
  * @hidden
  *
@@ -96,10 +100,11 @@ exports.controlPoint = function (lineCalc) {
  *      @param a (array) Represents the complete array of points coordinates.
  *      @output (string) 'C x2,y2 x1,y1 x,y' Cubic bezier command.
  */
-exports.bezierCommand = function (controlPointCalc) { return function (point, i, a) {
+var bezierCommand = function (controlPointCalc) { return function (point, i, a) {
     // start control point
     var _a = controlPointCalc(a[i - 1], a[i - 2], point), cpsX = _a[0], cpsY = _a[1];
     // end control point
     var _b = controlPointCalc(point, a[i - 1], a[i + 1], true), cpeX = _b[0], cpeY = _b[1];
-    return "C " + cpsX + "," + cpsY + " " + cpeX + "," + cpeY + " " + point[0] + "," + point[1];
+    return "C ".concat(cpsX, ",").concat(cpsY, " ").concat(cpeX, ",").concat(cpeY, " ").concat(point[0], ",").concat(point[1]);
 }; };
+exports.bezierCommand = bezierCommand;

package/dist/npm/common/SliderTooltip.js

@@ -1,11 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.SliderTooltip = void 0;
 var React = require("react");
 var kendo_react_animation_1 = require("@progress/kendo-react-animation");
 /**
  * @hidden
  */
-exports.SliderTooltip = function (props) {
+var SliderTooltip = function (props) {
     var tooltipRef = React.useRef(null);
     var position = function () {
         if (props.anchor && props.anchor.current && tooltipRef.current) {
@@ -17,8 +18,8 @@ exports.SliderTooltip = function (props) {
             var top_1 = props.position === 'right'
                 ? (anchorRect.height / 2) - (rect.height / 2)
                 : -(rect.height * 1.5);
-            tooltipRef.current.style.left = left + "px";
-            tooltipRef.current.style.top = top_1 + "px";
+            tooltipRef.current.style.left = "".concat(left, "px");
+            tooltipRef.current.style.top = "".concat(top_1, "px");
         }
     };
     var handleAnimationStart = function () {
@@ -37,10 +38,10 @@ exports.SliderTooltip = function (props) {
         if (!tooltipRef.current) {
             return;
         }
-        tooltipRef.current.style.opacity = "" + (props.show ? progress : 1 - progress);
+        tooltipRef.current.style.opacity = "".concat(props.show ? progress : 1 - progress);
     };
     React.useEffect(position);
-    kendo_react_animation_1.useAnimation({
+    (0, kendo_react_animation_1.useAnimation)({
         appear: true,
         duration: 300,
         onStart: handleAnimationStart,
@@ -50,3 +51,4 @@ exports.SliderTooltip = function (props) {
     return (React.createElement("div", { ref: tooltipRef, className: "k-tooltip", style: { position: 'absolute' } },
         React.createElement("div", { className: "k-tooltip-content" }, props.children)));
 };
+exports.SliderTooltip = SliderTooltip;

package/dist/npm/common/SwitchController.d.ts

@@ -18,14 +18,14 @@ declare class SwitchController {
     overrideChecked: (checked: boolean) => void;
     updateState({ wrapperOffset, handleOffset, checked, animate, coords, handleMargin, reverse }: any): void;
     change: (checked: boolean, event?: any) => void;
-    readonly isChecked: boolean;
+    get isChecked(): boolean;
     addAnimation: (model: any) => any;
     onPress: (event: any) => void;
     onRelease: (event: any) => void;
     onDrag: (event: any) => void;
     updateModel(position: any, animate?: boolean): SwitchModel;
     private limit;
-    readonly constrain: number;
-    readonly checked: boolean;
+    get constrain(): number;
+    get checked(): boolean;
 }
 export default SwitchController;

package/dist/npm/common/SwitchController.js

@@ -17,6 +17,10 @@ var SwitchController = /** @class */ (function () {
         if (updateView === void 0) { updateView = noop; }
         if (onChange === void 0) { onChange = noop; }
         var _this = this;
+        this._checked = false;
+        this.reverse = false;
+        this.lastPressX = 0;
+        this.originalPressX = 0;
         this.overrideChecked = function (checked) {
             _this._checked = checked;
         };
@@ -93,7 +97,7 @@ var SwitchController = /** @class */ (function () {
         get: function () {
             return this._checked;
         },
-        enumerable: true,
+        enumerable: false,
         configurable: true
     });
     SwitchController.prototype.updateModel = function (position, animate) {
@@ -105,14 +109,14 @@ var SwitchController = /** @class */ (function () {
         get: function () {
             return this.wrapperOffset - this.handleOffset - this.handleMargin;
         },
-        enumerable: true,
+        enumerable: false,
         configurable: true
     });
     Object.defineProperty(SwitchController.prototype, "checked", {
         get: function () {
             return this._checked;
         },
-        enumerable: true,
+        enumerable: false,
         configurable: true
     });
     return SwitchController;

package/dist/npm/common/SwitchModel.d.ts

@@ -3,5 +3,5 @@
  */
 export default class Model {
     handle: any;
-    constructor(value: number, animate: boolean);
+    constructor(value: number | undefined, animate: boolean);
 }

package/dist/npm/input/Input.d.ts

@@ -77,23 +77,23 @@ export declare class InputWithoutContext extends React.Component<InputProps, Inp
     /**
      * Gets the native input element of the Input component.
      */
-    readonly element: HTMLInputElement | null;
+    get element(): HTMLInputElement | null;
     /**
      * Gets the value of the Input.
      */
-    readonly value: string | string[] | number | undefined;
+    get value(): string | string[] | number | undefined;
     /**
      * Gets the `name` property of the Input.
      */
-    readonly name: string | undefined;
+    get name(): string | undefined;
     /**
      * Represents the validity state into which the Input is set.
      */
-    readonly validity: FormComponentValidity;
+    get validity(): FormComponentValidity;
     /**
      * @hidden
      */
-    protected readonly validityStyles: boolean;
+    protected get validityStyles(): boolean;
     /**
      * @hidden
      */

package/dist/npm/input/Input.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
             ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -28,11 +30,14 @@ var __rest = (this && this.__rest) || function (s, e) {
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
         t[p] = s[p];
     if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
-            t[p[i]] = s[p[i]];
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Input = exports.InputPropsContext = exports.InputWithoutContext = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
@@ -44,7 +49,8 @@ var InputWithoutContext = /** @class */ (function (_super) {
     __extends(InputWithoutContext, _super);
     function InputWithoutContext(props) {
         var _this = _super.call(this, props) || this;
-        _this._inputId = kendo_react_common_1.guid();
+        _this._input = null;
+        _this._inputId = (0, kendo_react_common_1.guid)();
         /**
          * @hidden
          */
@@ -101,7 +107,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
                 }
             }
         };
-        kendo_react_common_2.validatePackage(package_metadata_1.packageMetadata);
+        (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
         _this.state = {
             value: _this.props.defaultValue || InputWithoutContext.defaultProps.defaultValue
         };
@@ -114,7 +120,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
         get: function () {
             return this._input;
         },
-        enumerable: true,
+        enumerable: false,
         configurable: true
     });
     Object.defineProperty(InputWithoutContext.prototype, "value", {
@@ -128,7 +134,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
                     ? this.props.value
                     : this.state.value;
         },
-        enumerable: true,
+        enumerable: false,
         configurable: true
     });
     Object.defineProperty(InputWithoutContext.prototype, "name", {
@@ -138,7 +144,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
         get: function () {
             return this.props.name;
         },
-        enumerable: true,
+        enumerable: false,
         configurable: true
     });
     Object.defineProperty(InputWithoutContext.prototype, "validity", {
@@ -158,13 +164,13 @@ var InputWithoutContext = /** @class */ (function (_super) {
                 typeMismatch: this._input ? this._input.validity.typeMismatch : false,
                 valueMissing: this._input ? this._input.validity.valueMissing : false
             };
-            return __assign({}, result, { customError: this.props.validationMessage !== undefined, valid: this.props.valid !== undefined
+            return __assign(__assign({}, result), { customError: this.props.validationMessage !== undefined, valid: this.props.valid !== undefined
                     ? this.props.valid
                     : this._input
                         ? !this.isInvalid(result)
                         : true });
         },
-        enumerable: true,
+        enumerable: false,
         configurable: true
     });
     Object.defineProperty(InputWithoutContext.prototype, "validityStyles", {
@@ -176,7 +182,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
                 ? this.props.validityStyles
                 : InputWithoutContext.defaultProps.validityStyles;
         },
-        enumerable: true,
+        enumerable: false,
         configurable: true
     });
     /**
@@ -201,7 +207,7 @@ var InputWithoutContext = /** @class */ (function (_super) {
         visited = _a.visited, touched = _a.touched, modified = _a.modified, ariaLabelledBy = _a.ariaLabelledBy, ariaDescribedBy = _a.ariaDescribedBy, validityStyles = _a.validityStyles, style = _a.style, props = __rest(_a, ["className", "label", "id", "validationMessage", "defaultValue", "valid", "visited", "touched", "modified", "ariaLabelledBy", "ariaDescribedBy", "validityStyles", "style"]);
         var inputId = id || this._inputId;
         var isValid = !this.validityStyles || this.validity.valid;
-        var inputClassName = kendo_react_common_1.classNames(className, 'k-input k-input-md k-rounded-md k-input-solid');
+        var inputClassName = (0, kendo_react_common_1.classNames)(className, 'k-input k-input-md k-rounded-md k-input-solid');
         var textbox = (React.createElement("input", __assign({ "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy }, props, { style: !label
                 ? style
                 : undefined, value: this.value, id: inputId, className: inputClassName, onChange: this.handleChange, onAnimationStart: this.handleAutoFill, ref: function (el) {
@@ -241,7 +247,7 @@ exports.InputWithoutContext = InputWithoutContext;
  *
  * For more information, refer to the [Inputs Props Context]({% slug props-context_inputs %}) article.
  */
-exports.InputPropsContext = kendo_react_common_1.createPropsContext();
+exports.InputPropsContext = (0, kendo_react_common_1.createPropsContext)();
 ;
 /* eslint-disable @typescript-eslint/no-redeclare -- intentionally naming the component the same as the type */
 /**
@@ -250,5 +256,5 @@ exports.InputPropsContext = kendo_react_common_1.createPropsContext();
  * Accepts properties of type [InputProps]({% slug api_inputs_inputprops %}).
  * Obtaining the `ref` returns an object of type [InputHandle]({% slug api_inputs_inputhandle %}).
  */
-exports.Input = kendo_react_common_1.withPropsContext(exports.InputPropsContext, InputWithoutContext);
+exports.Input = (0, kendo_react_common_1.withPropsContext)(exports.InputPropsContext, InputWithoutContext);
 exports.Input.displayName = 'KendoReactInput';