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

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

@@ -67,12 +67,15 @@ export declare class ColorPaletteWithoutContext extends React.Component<ColorPal
      * @hidden
      */
     static getDerivedStateFromProps(props: ColorPaletteProps, state: ColorPaletteState): {
+        selectedColor: undefined;
+        isFirstRender?: undefined;
+    } | {
         selectedColor: string;
         isFirstRender?: undefined;
     } | {
         isFirstRender: boolean;
         selectedColor?: undefined;
-    };
+    } | null;
     private onKeyDown;
     private onColorClick;
     private onFocus;

package/dist/npm/colors/ColorPalette.js

@@ -46,7 +46,8 @@ var ColorPaletteWithoutContext = /** @class */ (function (_super) {
          * @hidden
          */
         _this.wrapper = null;
-        _this.guid = kendo_react_common_1.guid();
+        _this.paletteService = null;
+        _this.guid = (0, kendo_react_common_1.guid)();
         /**
          * @hidden
          */
@@ -86,15 +87,18 @@ var ColorPaletteWithoutContext = /** @class */ (function (_super) {
             _this.dispatchChangeEvent(color, event);
         };
         _this.onFocus = function (nativeEvent) {
+            if (!_this.paletteService) {
+                return;
+            }
             _this.setState({ focusedColor: _this.state.selectedColor || _this.paletteService.colorRows[0][0] });
             if (_this.props.onFocus) {
-                _this.props.onFocus.call(undefined, { nativeEvent: nativeEvent, target: _this });
+                _this.props.onFocus.call(undefined, nativeEvent);
             }
         };
         _this.onBlur = function () {
             _this.setState({ focusedColor: undefined });
         };
-        kendo_react_common_2.validatePackage(package_metadata_1.packageMetadata);
+        (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
         // The empty string for the `value` prop means no selection but controlled mode.
         _this.state = {
             selectedColor: _this.props.value !== undefined ? _this.props.value : _this.props.defaultValue,
@@ -112,9 +116,9 @@ var ColorPaletteWithoutContext = /** @class */ (function (_super) {
         svc.setColorMatrix(paletteInfo.colors, paletteInfo.columns);
         var selectedCellCoords = svc.getCellCoordsFor(this.state.selectedColor);
         var focusedCellCoords = svc.getCellCoordsFor(this.state.focusedColor);
-        var className = kendo_react_common_1.classNames('k-colorpalette', { 'k-disabled': this.props.disabled });
+        var className = (0, kendo_react_common_1.classNames)('k-colorpalette', { 'k-disabled': this.props.disabled });
         if (paletteInfo.colors.length) {
-            return (React.createElement("div", { id: this.props.id, className: className, onFocus: this.onFocus, onBlur: this.onBlur, onKeyDown: this.onKeyDown, "aria-disabled": this.props.disabled ? 'true' : undefined, "aria-activedescendant": selectedCellCoords && this.createCellId(selectedCellCoords), "aria-labelledby": this.props.ariaLabelledBy, "aria-describedby": this.props.ariaDescribedBy, tabIndex: kendo_react_common_1.getTabIndex(this.props.tabIndex, this.props.disabled), ref: function (el) { return _this.wrapper = el; } },
+            return (React.createElement("div", { id: this.props.id, className: className, onFocus: this.onFocus, onBlur: this.onBlur, onKeyDown: this.onKeyDown, "aria-disabled": this.props.disabled ? 'true' : undefined, "aria-activedescendant": selectedCellCoords && this.createCellId(selectedCellCoords), "aria-labelledby": this.props.ariaLabelledBy, "aria-describedby": this.props.ariaDescribedBy, tabIndex: (0, kendo_react_common_1.getTabIndex)(this.props.tabIndex, this.props.disabled), ref: function (el) { return _this.wrapper = el; } },
                 React.createElement("div", { className: "k-colorpalette-table-wrap", role: "grid" },
                     React.createElement("table", { className: "k-colorpalette-table k-palette", role: "presentation" },
                         React.createElement("tbody", null, this.renderRows(svc.colorRows, selectedCellCoords, focusedCellCoords))))));
@@ -145,6 +149,9 @@ var ColorPaletteWithoutContext = /** @class */ (function (_super) {
         return null;
     };
     ColorPaletteWithoutContext.prototype.handleCellNavigation = function (horizontalStep, verticalStep) {
+        if (!this.paletteService) {
+            return;
+        }
         if (this.focusedColorCooridanates) {
             var newCoords = this.paletteService.getNextCell(this.focusedColorCooridanates, horizontalStep, verticalStep);
             this.setState({ focusedColor: this.paletteService.getColorAt(newCoords) });
@@ -160,11 +167,11 @@ var ColorPaletteWithoutContext = /** @class */ (function (_super) {
         this.dispatchChangeEvent(this.state.focusedColor, event);
     };
     ColorPaletteWithoutContext.prototype.dispatchChangeEvent = function (value, event) {
-        kendo_react_common_1.dispatchEvent(this.props.onChange, event, this, { value: value, rgbaValue: color_parser_1.parseColor(value, 'rgba') });
+        (0, kendo_react_common_1.dispatchEvent)(this.props.onChange, event, this, { value: value, rgbaValue: (0, color_parser_1.parseColor)(value, 'rgba') });
     };
     Object.defineProperty(ColorPaletteWithoutContext.prototype, "focusedColorCooridanates", {
         get: function () {
-            return this.state.focusedColor ? this.paletteService.getCellCoordsFor(this.state.focusedColor) : undefined;
+            return this.state.focusedColor && this.paletteService ? this.paletteService.getCellCoordsFor(this.state.focusedColor) : undefined;
         },
         enumerable: false,
         configurable: true
@@ -179,7 +186,7 @@ var ColorPaletteWithoutContext = /** @class */ (function (_super) {
     ColorPaletteWithoutContext.prototype.getPaletteInfo = function () {
         if (typeof this.props.palette === 'string') {
             var preset = palette_presets_1.PALETTEPRESETS[this.props.palette];
-            if (misc_1.isPresent(preset)) {
+            if ((0, misc_1.isPresent)(preset)) {
                 return {
                     colors: preset.colors,
                     columns: this.props.columns || preset.columns || exports.DEFAULT_COLUMNS_COUNT
@@ -211,7 +218,7 @@ var ColorPaletteWithoutContext = /** @class */ (function (_super) {
         var height = tileSize.height + 'px';
         return columns.map(function (color, i) {
             var isSelected = rowIsSelected && selectedColumn === i;
-            var className = kendo_react_common_1.classNames('k-colorpalette-tile', {
+            var className = (0, kendo_react_common_1.classNames)('k-colorpalette-tile', {
                 'k-selected': isSelected,
                 'k-focus': rowIsFocused && focusedColumn === i
             });
@@ -219,7 +226,7 @@ var ColorPaletteWithoutContext = /** @class */ (function (_super) {
         });
     };
     ColorPaletteWithoutContext.prototype.createCellId = function (cellCoords) {
-        return this.guid + "_" + cellCoords.row + "_" + cellCoords.col;
+        return "".concat(this.guid, "_").concat(cellCoords.row, "_").concat(cellCoords.col);
     };
     ColorPaletteWithoutContext.displayName = 'ColorPalette';
     /**
@@ -255,7 +262,7 @@ exports.ColorPaletteWithoutContext = ColorPaletteWithoutContext;
  *
  * For more information, refer to the [Inputs Props Context]({% slug props-context_inputs %}) article.
  */
-exports.ColorPalettePropsContext = kendo_react_common_1.createPropsContext();
+exports.ColorPalettePropsContext = (0, kendo_react_common_1.createPropsContext)();
 /* eslint-disable @typescript-eslint/no-redeclare -- intentionally naming the component the same as the type */
 /**
  * Represents the [KendoReact ColorPalette component]({% slug overview_colorpalette %}).
@@ -272,5 +279,5 @@ exports.ColorPalettePropsContext = kendo_react_common_1.createPropsContext();
  * ReactDOM.render(<App />, document.querySelector('my-app'));
  * ```
  */
-exports.ColorPalette = kendo_react_common_1.withPropsContext(exports.ColorPalettePropsContext, ColorPaletteWithoutContext);
+exports.ColorPalette = (0, kendo_react_common_1.withPropsContext)(exports.ColorPalettePropsContext, ColorPaletteWithoutContext);
 exports.ColorPalette.displayName = 'KendoReactColorPalette';

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

@@ -26,4 +26,4 @@ export declare const ColorPickerPropsContext: React.Context<(p: ColorPickerProps
  * ReactDOM.render(<App />, document.querySelector('my-app'));
  * ```
  */
-export declare const ColorPicker: React.ForwardRefExoticComponent<ColorPickerProps & React.RefAttributes<ColorPickerHandle>>;
+export declare const ColorPicker: React.ForwardRefExoticComponent<ColorPickerProps & React.RefAttributes<ColorPickerHandle | null>>;

package/dist/npm/colors/ColorPicker.js

@@ -48,7 +48,7 @@ var isControlled = function (prop) {
  *
  * For more information, refer to the [Inputs Props Context]({% slug props-context_inputs %}) article.
  */
-exports.ColorPickerPropsContext = kendo_react_common_1.createPropsContext();
+exports.ColorPickerPropsContext = (0, kendo_react_common_1.createPropsContext)();
 /**
  * Represents the [KendoReact ColorPicker component]({% slug overview_colorpicker %}).
  *
@@ -64,9 +64,9 @@ exports.ColorPickerPropsContext = kendo_react_common_1.createPropsContext();
  */
 exports.ColorPicker = React.forwardRef(function (directProps, target) {
     var _a, _b;
-    kendo_react_common_2.validatePackage(package_metadata_1.packageMetadata);
-    var props = kendo_react_common_1.usePropsContext(exports.ColorPickerPropsContext, directProps);
-    var localization = kendo_react_intl_1.useLocalization();
+    (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
+    var props = (0, kendo_react_common_1.usePropsContext)(exports.ColorPickerPropsContext, directProps);
+    var localization = (0, kendo_react_intl_1.useLocalization)();
     var _c = props.size, size = _c === void 0 ? defaultProps.size : _c, _d = props.rounded, rounded = _d === void 0 ? defaultProps.rounded : _d, _e = props.fillMode, fillMode = _e === void 0 ? defaultProps.fillMode : _e, popupSettings = props.popupSettings, gradientSettings = props.gradientSettings, paletteSettings = props.paletteSettings, valid = props.valid, disabled = props.disabled, tabIndex = props.tabIndex, view = props.view, icon = props.icon, iconClassName = props.iconClassName, onChange = props.onChange, onFocus = props.onFocus, onBlur = props.onBlur, onActiveColorClick = props.onActiveColorClick;
     var focusableElementRef = React.useRef(null);
     var gradientRef = React.useRef(null);
@@ -197,23 +197,23 @@ exports.ColorPicker = React.forwardRef(function (directProps, target) {
         }
     }, [isValueControlled, onChange]);
     var onPaletteChangeHandler = React.useCallback(function (event) { return onChangeHandler(event, true); }, [isControlled, onChangeHandler]);
-    var dir = kendo_react_common_1.useDir(focusableElementRef, props.dir);
+    var dir = (0, kendo_react_common_1.useDir)(focusableElementRef, props.dir);
     var isValid = valid !== false;
-    return (React.createElement("span", { id: props.id, "aria-labelledby": props.ariaLabelledBy, "aria-describedby": props.ariaDescribedBy, className: kendo_react_common_1.classNames('k-colorpicker', 'k-picker', 'k-icon-picker', (_a = {},
-            _a["k-picker-" + (kendo_react_common_1.kendoThemeMaps.sizeMap[size] || size)] = size,
-            _a["k-picker-" + fillMode] = fillMode,
-            _a["k-rounded-" + (kendo_react_common_1.kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded,
+    return (React.createElement("span", { id: props.id, "aria-labelledby": props.ariaLabelledBy, "aria-describedby": props.ariaDescribedBy, className: (0, kendo_react_common_1.classNames)('k-colorpicker', 'k-picker', 'k-icon-picker', (_a = {},
+            _a["k-picker-".concat(kendo_react_common_1.kendoThemeMaps.sizeMap[size] || size)] = size,
+            _a["k-picker-".concat(fillMode)] = fillMode,
+            _a["k-rounded-".concat(kendo_react_common_1.kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded,
             _a['k-invalid'] = !isValid,
             _a['k-disabled'] = disabled,
             _a['k-focus'] = focused,
-            _a)), ref: focusableElementRef, tabIndex: kendo_react_common_1.getTabIndex(tabIndex, disabled), title: props.title, onKeyDown: onKeyDownHandler, onFocus: onFocusHandler, onBlur: onBlurHandler, dir: dir },
+            _a)), ref: focusableElementRef, tabIndex: (0, kendo_react_common_1.getTabIndex)(tabIndex, disabled), title: props.title, onKeyDown: onKeyDownHandler, onFocus: onFocusHandler, onBlur: onBlurHandler, dir: dir },
         React.createElement(Picker_1.Picker, { dir: dir, open: open, onOpen: onOpenHandler, popupAnchor: focusableElementRef.current || undefined, popupSettings: __assign({}, popupSettings), input: (React.createElement("span", { onClick: onActiveColorClickHandler, className: 'k-input-inner' },
-                React.createElement("span", { className: kendo_react_common_1.classNames('k-value-icon', 'k-color-preview', {
+                React.createElement("span", { className: (0, kendo_react_common_1.classNames)('k-value-icon', 'k-color-preview', {
                         'k-no-color': !value,
                         'k-icon-color-preview': (icon || iconClassName)
                     }) },
-                    (iconClassName || icon) && React.createElement("span", { className: kendo_react_common_1.classNames('k-color-preview-icon', iconClassName, (_b = {},
-                            _b["k-icon k-i-" + icon] = (icon && !iconClassName),
+                    (iconClassName || icon) && React.createElement("span", { className: (0, kendo_react_common_1.classNames)('k-color-preview-icon', iconClassName, (_b = {},
+                            _b["k-icon k-i-".concat(icon)] = (icon && !iconClassName),
                             _b)) }),
                     React.createElement("span", { className: "k-color-preview-mask", style: { backgroundColor: value } })))), button: (React.createElement(kendo_react_buttons_1.Button, { tabIndex: -1, type: "button", onClick: onClickHandler, className: "k-input-button", rounded: null, icon: 'arrow-s', "aria-label": localization.toLanguageString(messages_1.colorPickerDropdownButtonAriaLabel, messages_1.messages[messages_1.colorPickerDropdownButtonAriaLabel]) })), content: (React.createElement(React.Fragment, null,
                 (view === 'combo' || view === 'gradient') && (React.createElement(ColorGradient_1.ColorGradient, __assign({}, gradientSettings, { tabIndex: 0, ref: gradientRef, value: value, onChange: onChangeHandler }))),

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

@@ -68,4 +68,4 @@ export interface FlatColorPickerHandle {
 /**
  * Represents the FlatColorPicker component.
  */
-export declare const FlatColorPicker: React.ForwardRefExoticComponent<FlatColorPickerProps & React.RefAttributes<FlatColorPickerHandle>>;
+export declare const FlatColorPicker: React.ForwardRefExoticComponent<FlatColorPickerProps & React.RefAttributes<FlatColorPickerHandle | null>>;

package/dist/npm/colors/FlatColorPicker.js

@@ -14,7 +14,7 @@ var messages_1 = require("../messages");
  * Represents the FlatColorPicker component.
  */
 exports.FlatColorPicker = React.forwardRef(function (props, ref) {
-    kendo_react_common_1.validatePackage(package_metadata_1.packageMetadata);
+    (0, kendo_react_common_1.validatePackage)(package_metadata_1.packageMetadata);
     var target = React.useRef(null);
     var flatColorPickerRef = React.useRef(null);
     var colorGradientRef = React.useRef(null);
@@ -60,33 +60,34 @@ exports.FlatColorPicker = React.forwardRef(function (props, ref) {
     var handleFlatColorPickerBlur = React.useCallback(function () {
         setPrevColor(colorValue);
     }, [colorValue]);
-    return (React.createElement("div", { id: props.id, style: props.style, ref: flatColorPickerRef, tabIndex: kendo_react_common_1.getTabIndex(props.tabIndex, props.disabled), className: kendo_react_common_1.classNames('k-flatcolorpicker k-coloreditor', {
+    return (React.createElement("div", { id: props.id, style: props.style, ref: flatColorPickerRef, tabIndex: (0, kendo_react_common_1.getTabIndex)(props.tabIndex, props.disabled), className: (0, kendo_react_common_1.classNames)('k-flatcolorpicker k-coloreditor', {
             'k-disabled': props.disabled
         }, props.className), onBlur: handleFlatColorPickerBlur },
-        props.header ||
-            React.createElement("div", { className: "k-coloreditor-header k-hstack" },
-                React.createElement("div", { className: "k-coloreditor-header-actions k-hstack" },
-                    React.createElement(kendo_react_buttons_1.ButtonGroup, null,
-                        React.createElement(kendo_react_buttons_1.Button, { type: "button", togglable: true, fillMode: 'flat', selected: colorGradientView, onClick: function () { return handleViewChange('ColorGradient'); } },
-                            React.createElement("span", { className: "k-icon k-i-color-canvas" })),
-                        React.createElement(kendo_react_buttons_1.Button, { type: "button", togglable: true, fillMode: 'flat', selected: !colorGradientView, onClick: function () { return handleViewChange('ColorPalette'); } },
-                            React.createElement("span", { className: "k-icon k-i-palette" })))),
-                React.createElement("div", { className: "k-spacer" }),
-                React.createElement("div", { className: "k-coloreditor-header-actions k-hstack" },
-                    (props.showClearButton && defaultProps.showClearButton) &&
-                        React.createElement(kendo_react_buttons_1.Button, { type: "button", fillMode: 'flat', onClick: handleResetColor },
-                            React.createElement("span", { className: "k-icon k-i-reset-color" })),
-                    (props.showPreview && defaultProps.showPreview) &&
-                        React.createElement("div", { className: "k-coloreditor-preview k-vstack" },
-                            React.createElement("span", { className: "k-coloreditor-preview-color k-color-preview", style: { background: colorValue } }),
-                            React.createElement("span", { className: "k-coloreditor-current-color k-color-preview", style: { background: prevColor }, onClick: handlePrevColorClick })))),
-        React.createElement("div", { className: "k-coloreditor-views k-vstack" }, colorGradientView
-            ? React.createElement(main_1.ColorGradient, { ref: colorGradientRef, value: colorValue, onChange: handleColorChange, onFocus: handleFocus })
-            : React.createElement(main_1.ColorPalette, { value: colorValue, onChange: handleColorChange, onFocus: handleFocus })),
-        (props.showButtons && defaultProps.showButtons) &&
-            React.createElement("div", { className: "k-coloreditor-footer k-actions k-actions-end" },
-                React.createElement(kendo_react_buttons_1.Button, { type: "button", className: "k-coloreditor-cancel", onClick: handleCancelBtnClick }, messages_1.messages[messages_1.flatColorPickerCancelBtn]),
-                React.createElement(kendo_react_buttons_1.Button, { type: "button", className: "k-coloreditor-apply k-primary", onClick: handleApplyBtnClick }, messages_1.messages[messages_1.flatColorPickerApplyBtn]))));
+        React.createElement(React.Fragment, null,
+            props.header ||
+                React.createElement("div", { className: "k-coloreditor-header k-hstack" },
+                    React.createElement("div", { className: "k-coloreditor-header-actions k-hstack" },
+                        React.createElement(kendo_react_buttons_1.ButtonGroup, null,
+                            React.createElement(kendo_react_buttons_1.Button, { type: "button", togglable: true, fillMode: 'flat', selected: colorGradientView, onClick: function () { return handleViewChange('ColorGradient'); } },
+                                React.createElement("span", { className: "k-icon k-i-color-canvas" })),
+                            React.createElement(kendo_react_buttons_1.Button, { type: "button", togglable: true, fillMode: 'flat', selected: !colorGradientView, onClick: function () { return handleViewChange('ColorPalette'); } },
+                                React.createElement("span", { className: "k-icon k-i-palette" })))),
+                    React.createElement("div", { className: "k-spacer" }),
+                    React.createElement("div", { className: "k-coloreditor-header-actions k-hstack" },
+                        (props.showClearButton && defaultProps.showClearButton) &&
+                            React.createElement(kendo_react_buttons_1.Button, { type: "button", fillMode: 'flat', onClick: handleResetColor },
+                                React.createElement("span", { className: "k-icon k-i-reset-color" })),
+                        (props.showPreview && defaultProps.showPreview) &&
+                            React.createElement("div", { className: "k-coloreditor-preview k-vstack" },
+                                React.createElement("span", { className: "k-coloreditor-preview-color k-color-preview", style: { background: colorValue } }),
+                                React.createElement("span", { className: "k-coloreditor-current-color k-color-preview", style: { background: prevColor }, onClick: handlePrevColorClick })))),
+            React.createElement("div", { className: "k-coloreditor-views k-vstack" }, colorGradientView
+                ? React.createElement(main_1.ColorGradient, { ref: colorGradientRef, value: colorValue, onChange: handleColorChange, onFocus: handleFocus })
+                : React.createElement(main_1.ColorPalette, { value: colorValue, onChange: handleColorChange, onFocus: handleFocus })),
+            (props.showButtons && defaultProps.showButtons) &&
+                React.createElement("div", { className: "k-coloreditor-footer k-actions k-actions-end" },
+                    React.createElement(kendo_react_buttons_1.Button, { type: "button", className: "k-coloreditor-cancel", onClick: handleCancelBtnClick }, messages_1.messages[messages_1.flatColorPickerCancelBtn]),
+                    React.createElement(kendo_react_buttons_1.Button, { type: "button", className: "k-coloreditor-apply k-primary", onClick: handleApplyBtnClick }, messages_1.messages[messages_1.flatColorPickerApplyBtn])))));
 });
 var propTypes = {
     id: PropTypes.string,

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

@@ -23,7 +23,7 @@ export default class HexInput extends React.Component<HexInputProps, HexInputSta
     static getDerivedStateFromProps(props: HexInputProps, state: HexInputState): {
         hex: string;
         originalHex: string;
-    };
+    } | null;
     private onChange;
     private onBlur;
 }

package/dist/npm/colors/HexInput.js

@@ -28,14 +28,14 @@ var HexInput = /** @class */ (function (_super) {
         var _this = _super.call(this, props) || this;
         _this.onChange = function (event) {
             var hex = event.target.value;
-            var value = color_parser_1.parseColor(hex, 'rgba');
+            var value = (0, color_parser_1.parseColor)(hex, 'rgba');
             _this.setState({ hex: hex });
-            if (misc_1.isPresent(value)) {
+            if ((0, misc_1.isPresent)(value)) {
                 _this.props.onHexChange(hex, value, event);
             }
         };
         _this.onBlur = function () {
-            if (!misc_1.isPresent(color_parser_1.parseColor(_this.state.hex, 'rgba'))) {
+            if (!(0, misc_1.isPresent)((0, color_parser_1.parseColor)(_this.state.hex, 'rgba'))) {
                 _this.setState({ hex: _this.state.originalHex });
             }
         };

package/dist/npm/colors/Picker.js

@@ -34,7 +34,7 @@ var Picker = function (props) {
     return (React.createElement(React.Fragment, null,
         props.input,
         props.button,
-        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: 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/utils/color-palette.service.js

@@ -12,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;
@@ -23,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) {
@@ -51,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.js

@@ -13,13 +13,13 @@ var parseColor = function (value, format, safe) {
     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();
@@ -32,8 +32,8 @@ exports.parseColor = parseColor;
  */
 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();
@@ -46,8 +46,8 @@ exports.getHSV = getHSV;
  */
 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();
@@ -59,10 +59,10 @@ exports.getRGBA = getRGBA;
  * Returns the RGBA string representation of the color.
  */
 var 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 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;
@@ -73,7 +73,7 @@ exports.getColorFromHSV = getColorFromHSV;
  * assuming the `value`, `saturation`, and `alpha` have a value of `1`.
  */
 var getColorFromHue = function (hue) {
-    return exports.getColorFromHSV({ h: hue, s: 1, v: 1, a: 1 });
+    return (0, exports.getColorFromHSV)({ h: hue, s: 1, v: 1, a: 1 });
 };
 exports.getColorFromHue = getColorFromHue;
 /**
@@ -82,10 +82,10 @@ exports.getColorFromHue = getColorFromHue;
  * Returns the RGBA string representation of the color.
  */
 var 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 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;
@@ -95,13 +95,13 @@ exports.getColorFromRGBA = getColorFromRGBA;
  * Returns the RGB object representation of the color based on the background color.
  */
 var 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 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)),
@@ -115,7 +115,7 @@ exports.getRGBFromRGBA = getRGBFromRGBA;
  * Returns the relative luminance.
  */
 var getLuminance = function (rgb) {
-    var a = [rgb.r, rgb.g, rgb.b].map(function (v) {
+    var a = [rgb.r || 0, rgb.g || 0, rgb.b || 0].map(function (v) {
         v /= 255;
         return v <= 0.03928
             ? v / 12.92
@@ -142,6 +142,6 @@ exports.getContrast = getContrast;
  * Returns the color contrast from two RGBA colors.
  */
 var 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 })));
+    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.js

@@ -17,7 +17,7 @@ exports.isPresent = isPresent;
  * @param max The inclusive upper bound number.
  */
 var fitIntoBounds = function (contender, min, max) {
-    if (!exports.isPresent(contender) || isNaN(contender)) {
+    if (!(0, exports.isPresent)(contender) || isNaN(contender)) {
         return min;
     }
     return contender <= min ? min : contender >= max ? max : contender;

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

@@ -22,11 +22,11 @@ var 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;
 /**
@@ -105,6 +105,6 @@ var bezierCommand = function (controlPointCalc) { return function (point, i, a)
     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

@@ -18,8 +18,8 @@ var 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 () {
@@ -38,10 +38,10 @@ var 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,

package/dist/npm/common/SwitchController.js

@@ -14,9 +14,13 @@ var noop = function () { };
  */
 var SwitchController = /** @class */ (function () {
     function SwitchController(updateView, onChange) {
-        var _this = this;
         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;
         };

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.js

@@ -49,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
          */
@@ -106,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
         };
@@ -206,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) {
@@ -246,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 */
 /**
@@ -255,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';

package/dist/npm/main.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];