@progress/kendo-react-inputs 6.1.1-dev.202311151536 → 7.0.0-develop.1

package/dist/npm/colors/ColorGradient.js

@@ -1,319 +0,0 @@
-"use strict";
-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 (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 __());
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ColorGradient = exports.ColorGradientPropsContext = exports.ColorGradientWithoutContext = void 0;
-var React = require("react");
-var PropTypes = require("prop-types");
-var kendo_react_common_1 = require("@progress/kendo-react-common");
-var kendo_react_common_2 = require("@progress/kendo-react-common");
-var package_metadata_1 = require("../package-metadata");
-var main_1 = require("./../main");
-var misc_1 = require("./utils/misc");
-var color_parser_1 = require("./utils/color-parser");
-var color_cache_1 = require("./utils/color-cache");
-var ColorInput_1 = require("./ColorInput");
-var ColorContrastLabels_1 = require("./ColorContrastLabels");
-var ColorContrastSvg_1 = require("./ColorContrastSvg");
-var kendo_react_intl_1 = require("@progress/kendo-react-intl");
-var messages_1 = require("./../messages");
-var FORMAT = 'rgba';
-var DEFAULT_SELECTED_COLOR = 'rgba(255, 255, 255, 1)';
-/** @hidden */
-var ColorGradientWithoutContext = /** @class */ (function (_super) {
-    __extends(ColorGradientWithoutContext, _super);
-    function ColorGradientWithoutContext(props) {
-        var _this = _super.call(this, props) || this;
-        /**
-         * @hidden
-         */
-        _this.wrapper = null;
-        /**
-         * @hidden
-         */
-        _this.onHexChange = function (hex, value, event) {
-            if (_this.isUncontrolled) {
-                var hsva = (0, color_parser_1.getHSV)(value);
-                _this.setState({ hsva: hsva, backgroundColor: (0, color_parser_1.getColorFromHue)(hsva.h), rgba: (0, color_parser_1.getRGBA)(value), hex: hex });
-            }
-            else {
-                (0, color_cache_1.cacheHex)(_this.state.guid, value, hex);
-            }
-            _this.dispatchChangeEvent(value, event, event.nativeEvent);
-        };
-        /**
-         * @hidden
-         */
-        _this.onRgbaChange = function (rgba, event) {
-            var value = (0, color_parser_1.getColorFromRGBA)(rgba);
-            if (_this.isUncontrolled) {
-                var hsva = (0, color_parser_1.getHSV)(value);
-                var hex = (0, color_parser_1.parseColor)(value, 'hex');
-                _this.setState({ hsva: hsva, backgroundColor: (0, color_parser_1.getColorFromHue)(hsva.h), rgba: rgba, hex: hex });
-            }
-            else {
-                (0, color_cache_1.cacheRgba)(_this.state.guid, value, rgba);
-            }
-            _this.dispatchChangeEvent(value, event.syntheticEvent, event.nativeEvent);
-        };
-        /**
-         * @hidden
-         */
-        _this.onAlphaSliderChange = function (event) {
-            _this.handleHsvaChange(Object.assign({}, _this.state.hsva, { a: event.value / 100 }), event.syntheticEvent, event.nativeEvent);
-        };
-        /**
-         * @hidden
-         */
-        _this.onHueSliderChange = function (event) {
-            _this.handleHsvaChange(Object.assign({}, _this.state.hsva, { h: event.value }), event.syntheticEvent, event.nativeEvent);
-        };
-        /**
-         * @hidden
-         */
-        _this.onDrag = function (e) {
-            _this.gradientWrapper.classList.add('k-dragging');
-            _this.changePosition(e.event);
-        };
-        /**
-         * @hidden
-         */
-        _this.onRelease = function () {
-            _this.gradientWrapper.classList.remove('k-dragging');
-        };
-        /**
-         * @hidden
-         */
-        _this.onGradientWrapperClick = function (event) {
-            _this.changePosition(event);
-        };
-        /**
-         * @hidden
-         */
-        _this.changePosition = function (event) {
-            var gradientRectMetrics = _this.getGradientRectMetrics();
-            var deltaX = event.clientX - gradientRectMetrics.left;
-            var deltaY = event.clientY - gradientRectMetrics.top;
-            var left = (0, misc_1.fitIntoBounds)(deltaX, 0, gradientRectMetrics.width);
-            var top = (0, misc_1.fitIntoBounds)(deltaY, 0, gradientRectMetrics.height);
-            var hsva = Object.assign({}, _this.state.hsva, { s: left / gradientRectMetrics.width, v: 1 - top / gradientRectMetrics.height });
-            _this.handleHsvaChange(hsva, event, event.nativeEvent);
-        };
-        /**
-         * @hidden
-         */
-        _this.onFocus = function (nativeEvent) {
-            if (_this.props.onFocus) {
-                _this.props.onFocus.call(undefined, { nativeEvent: nativeEvent, target: _this });
-            }
-        };
-        /**
-         * @hidden
-         */
-        _this.focus = function () {
-            (0, kendo_react_common_1.focusFirstFocusableChild)(_this.wrapper);
-        };
-        (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
-        var value = props.value || props.defaultValue || (0, color_parser_1.parseColor)(DEFAULT_SELECTED_COLOR, FORMAT);
-        _this.state = Object.assign({}, ColorGradientWithoutContext.getStateFromValue(value), { isFirstRender: true, guid: (0, kendo_react_common_1.guid)() });
-        return _this;
-    }
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.getDerivedStateFromProps = function (props, state) {
-        if (props.value && !state.isFirstRender) {
-            // The component is in controlled mode.
-            return ColorGradientWithoutContext.getStateFromValue(props.value, state.guid);
-        }
-        return null;
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.prototype.componentDidMount = function () {
-        this.setAlphaSliderBackground(this.state.backgroundColor);
-        if (this.state.isFirstRender) {
-            this.setState({ isFirstRender: false });
-        }
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.prototype.componentWillUnmount = function () {
-        (0, color_cache_1.removeCachedColor)(this.state.guid);
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.prototype.componentDidUpdate = function (_, prevState) {
-        if (prevState.backgroundColor !== this.state.backgroundColor) {
-            this.setAlphaSliderBackground(this.state.backgroundColor);
-        }
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.prototype.renderRectangleDragHandle = function () {
-        var style = {};
-        if (!this.state.isFirstRender) {
-            var gradientRectMetrics = this.getGradientRectMetrics();
-            var top_1 = (1 - this.state.hsva.v) * gradientRectMetrics.height;
-            var left = this.state.hsva.s * gradientRectMetrics.width;
-            style.top = "".concat(top_1, "px");
-            style.left = "".concat(left, "px");
-        }
-        return (React.createElement("div", { role: 'slider', tabIndex: (0, kendo_react_common_1.getTabIndex)(this.props.tabIndex, this.props.disabled), "aria-valuetext": this.props.ariaValueText, "aria-valuenow": parseInt(this.state.hex.substring(1), 16), "aria-label": this.props.ariaLabelHSV, "aria-orientation": undefined, "aria-disabled": this.props.disabled ? 'true' : undefined, className: "k-hsv-draghandle k-draghandle", style: style }));
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.prototype.handleHsvaChange = function (hsva, syntheticEvent, nativeEvent) {
-        var value = (0, color_parser_1.getColorFromHSV)(hsva);
-        if (this.isUncontrolled) {
-            var hex = (0, color_parser_1.parseColor)(value, 'hex');
-            this.setState({ hsva: hsva, backgroundColor: (0, color_parser_1.getColorFromHue)(hsva.h), rgba: (0, color_parser_1.getRGBA)(value), hex: hex });
-        }
-        else {
-            (0, color_cache_1.cacheHsva)(this.state.guid, value, hsva);
-        }
-        this.dispatchChangeEvent(value, syntheticEvent, nativeEvent);
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.prototype.dispatchChangeEvent = function (value, syntheticEvent, nativeEvent) {
-        if (this.props.onChange) {
-            this.props.onChange.call(undefined, { syntheticEvent: syntheticEvent, nativeEvent: nativeEvent, target: this, value: value });
-        }
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.getStateFromValue = function (value, componentGuid) {
-        if (!(0, misc_1.isPresent)((0, color_parser_1.parseColor)(value, 'hex'))) {
-            // Validate/sanitize the input.
-            value = DEFAULT_SELECTED_COLOR;
-        }
-        var hsva = (0, color_cache_1.getCachedHsva)(componentGuid, value) || (0, color_parser_1.getHSV)(value);
-        var rgba = (0, color_cache_1.getCachedRgba)(componentGuid, value) || (0, color_parser_1.getRGBA)(value);
-        var hex = (0, color_cache_1.getCachedHex)(componentGuid, value) || (0, color_parser_1.parseColor)(value, 'hex');
-        var backgroundColor = (0, color_parser_1.getColorFromHue)(hsva.h);
-        return { hsva: hsva, backgroundColor: backgroundColor, rgba: rgba, hex: hex };
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.prototype.setAlphaSliderBackground = function (backgroundColor) {
-        if (this.props.opacity && this.alphaSlider && this.alphaSlider.sliderTrack) {
-            this.alphaSlider.sliderTrack.style.background = "linear-gradient(to top, transparent, ".concat(backgroundColor, ")");
-        }
-    };
-    Object.defineProperty(ColorGradientWithoutContext.prototype, "isUncontrolled", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            return this.props.value === undefined;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.prototype.getGradientRectMetrics = function () {
-        return this.gradientWrapper.getBoundingClientRect();
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.prototype.render = function () {
-        var _this = this;
-        var lS = (0, kendo_react_intl_1.provideLocalizationService)(this);
-        var className = (0, kendo_react_common_1.classNames)('k-colorgradient', { 'k-disabled': this.props.disabled }, this.props.className);
-        return (React.createElement("div", { id: this.props.id, role: this.props.role, className: className, "aria-disabled": this.props.disabled ? 'true' : undefined, style: this.props.style, ref: function (el) { return _this.wrapper = el; }, tabIndex: (0, kendo_react_common_1.getTabIndex)(this.props.tabIndex, this.props.disabled), "aria-label": this.props.ariaLabel, "aria-labelledby": this.props.ariaLabelledBy, "aria-describedby": this.props.ariaDescribedBy, onFocus: this.onFocus },
-            React.createElement("div", { className: "k-colorgradient-canvas k-hstack" },
-                React.createElement("div", { className: "k-hsv-rectangle", style: { background: this.state.backgroundColor } },
-                    React.createElement(kendo_react_common_1.Draggable, { onDrag: this.onDrag, onRelease: this.onRelease, ref: function (el) { return _this.gradientWrapper = el ? el.element : undefined; } },
-                        React.createElement("div", { className: "k-hsv-gradient", style: { touchAction: 'none' }, onClick: this.onGradientWrapperClick }, this.renderRectangleDragHandle())),
-                    this.props.backgroundColor && !this.state.isFirstRender &&
-                        React.createElement(ColorContrastSvg_1.ColorContrastSvg, { metrics: this.gradientWrapper ? this.getGradientRectMetrics() : undefined, hsva: this.state.hsva, backgroundColor: this.props.backgroundColor })),
-                React.createElement("div", { className: "k-hsv-controls k-hstack" },
-                    React.createElement(main_1.Slider, { value: this.state.hsva.h, buttons: false, vertical: true, min: 0, max: 360, step: 5, onChange: this.onHueSliderChange, className: "k-hue-slider k-colorgradient-slider", disabled: this.props.disabled, ariaLabel: lS.toLanguageString(messages_1.colorGradientHueSliderLabel, messages_1.messages[messages_1.colorGradientHueSliderLabel]) }),
-                    this.props.opacity &&
-                        React.createElement(main_1.Slider, { value: (0, misc_1.isPresent)(this.state.hsva.a) ? this.state.hsva.a * 100 : 100, buttons: false, vertical: true, min: 0, max: 100, step: 1, ariaLabel: lS.toLanguageString(messages_1.colorGradientAlphaSliderLabel, messages_1.messages[messages_1.colorGradientAlphaSliderLabel]), onChange: this.onAlphaSliderChange, className: "k-alpha-slider k-colorgradient-slider", disabled: this.props.disabled, ref: function (el) { return _this.alphaSlider = el; } }))),
-            React.createElement(ColorInput_1.default, { rgba: this.state.rgba, onRgbaChange: this.onRgbaChange, hex: this.state.hex, onHexChange: this.onHexChange, opacity: this.props.opacity, disabled: this.props.disabled, defaultInputMode: this.props.format }),
-            this.props.backgroundColor && (React.createElement(ColorContrastLabels_1.ColorContrastLabels, { bgColor: (0, color_parser_1.getRGBA)(this.props.backgroundColor), rgba: this.state.rgba }))));
-    };
-    ColorGradientWithoutContext.displayName = 'ColorGradient';
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.propTypes = {
-        defaultValue: PropTypes.string,
-        value: PropTypes.string,
-        onChange: PropTypes.func,
-        onFocus: PropTypes.func,
-        opacity: PropTypes.bool,
-        backgroundColor: PropTypes.string,
-        format: PropTypes.any,
-        disabled: PropTypes.bool,
-        style: PropTypes.any,
-        id: PropTypes.string,
-        role: PropTypes.string,
-        ariaLabel: PropTypes.string,
-        ariaLabelledBy: PropTypes.string,
-        ariaDescribedBy: PropTypes.string,
-        className: PropTypes.string
-    };
-    /**
-     * @hidden
-     */
-    ColorGradientWithoutContext.defaultProps = {
-        opacity: true,
-        role: 'textbox',
-        format: 'rgb'
-    };
-    return ColorGradientWithoutContext;
-}(React.Component));
-exports.ColorGradientWithoutContext = ColorGradientWithoutContext;
-/**
- * Represents the PropsContext of the `ColorGradient` component.
- * Used for global configuration of all `ColorGradient` instances.
- *
- * For more information, refer to the [Inputs Props Context]({% slug props-context_inputs %}) article.
- */
-exports.ColorGradientPropsContext = (0, kendo_react_common_1.createPropsContext)();
-/* eslint-disable @typescript-eslint/no-redeclare -- intentionally naming the component the same as the type */
-/**
- * Represents the [KendoReact ColorGradient component]({% slug overview_colorgradient %}).
- *
- * Accepts properties of type [ColorGradientProps]({% slug api_inputs_colorgradientprops %}).
- * Obtaining the `ref` returns an object of type [ColorGradientHandle]({% slug api_inputs_colorgradienthandle %}).
- *
- * @example
- * ```jsx
- * class App extends React.Component {
- *     render() {
- *         return <ColorGradient />;
- *     }
- * }
- * ReactDOM.render(<App />, document.querySelector('my-app'));
- * ```
- */
-exports.ColorGradient = (0, kendo_react_common_1.withPropsContext)(exports.ColorGradientPropsContext, ColorGradientWithoutContext);
-exports.ColorGradient.displayName = 'KendoReactColorGradient';

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

@@ -1,30 +0,0 @@
-import * as React from 'react';
-import { NumericTextBoxChangeEvent } from '../main';
-import { RGBA } from './models/rgba';
-/**
- * @hidden
- */
-export interface ColorInputProps {
-    rgba: RGBA;
-    onRgbaChange: (rgba: RGBA, event: NumericTextBoxChangeEvent) => void;
-    hex: string;
-    onHexChange: any;
-    opacity: boolean;
-    disabled?: boolean;
-    defaultInputMode?: 'rgba' | 'rgb' | 'hex';
-}
-/**
- * @hidden
- */
-export default class ColorInput extends React.Component<ColorInputProps, {
-    inputMode: string;
-}> {
-    constructor(props: ColorInputProps);
-    render(): JSX.Element;
-    private onRgbaRChange;
-    private onRgbaGChange;
-    private onRgbaBChange;
-    private onRgbaAChange;
-    private dispatchRgbaChange;
-    private onToggleModeChange;
-}

package/dist/npm/colors/ColorInput.js

@@ -1,127 +0,0 @@
-"use strict";
-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 (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 __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var main_1 = require("../main");
-var HexInput_1 = require("./HexInput");
-var kendo_react_buttons_1 = require("@progress/kendo-react-buttons");
-var kendo_react_labels_1 = require("@progress/kendo-react-labels");
-var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
-var kendo_react_intl_1 = require("@progress/kendo-react-intl");
-var messages_1 = require("../messages");
-/**
- * @hidden
- */
-var modes = ['rgba', 'rgb', 'hex'];
-/**
- * @hidden
- */
-var ColorInput = /** @class */ (function (_super) {
-    __extends(ColorInput, _super);
-    function ColorInput(props) {
-        var _this = _super.call(this, props) || this;
-        _this.onRgbaRChange = function (event) {
-            _this.dispatchRgbaChange({ r: event.value }, event);
-        };
-        _this.onRgbaGChange = function (event) {
-            _this.dispatchRgbaChange({ g: event.value }, event);
-        };
-        _this.onRgbaBChange = function (event) {
-            _this.dispatchRgbaChange({ b: event.value }, event);
-        };
-        _this.onRgbaAChange = function (event) {
-            _this.dispatchRgbaChange({ a: event.value }, event);
-        };
-        _this.state = { inputMode: props.defaultInputMode || modes[1] };
-        return _this;
-    }
-    ColorInput.prototype.render = function () {
-        var localizationService = (0, kendo_react_intl_1.provideLocalizationService)(this);
-        var hexMessage = localizationService.toLanguageString(messages_1.colorGradientR, messages_1.messages[messages_1.colorGradientHex]);
-        var rMessage = localizationService.toLanguageString(messages_1.colorGradientR, messages_1.messages[messages_1.colorGradientR]);
-        var gMessage = localizationService.toLanguageString(messages_1.colorGradientR, messages_1.messages[messages_1.colorGradientG]);
-        var bMessage = localizationService.toLanguageString(messages_1.colorGradientR, messages_1.messages[messages_1.colorGradientB]);
-        var aMessage = localizationService.toLanguageString(messages_1.colorGradientR, messages_1.messages[messages_1.colorGradientA]);
-        var toggleButtonMessage = localizationService.toLanguageString(messages_1.colorGradientToggleInputsButton, messages_1.messages[messages_1.colorGradientToggleInputsButton]);
-        return (React.createElement("div", { className: "k-colorgradient-inputs k-hstack" },
-            React.createElement("div", { className: "k-vstack" },
-                React.createElement(kendo_react_buttons_1.Button, { "aria-label": toggleButtonMessage, fillMode: 'flat', icon: 'caret-alt-expand', svgIcon: kendo_svg_icons_1.caretAltExpandIcon, className: "k-colorgradient-toggle-mode k-icon-button", onClick: this.onToggleModeChange.bind(this) })),
-            this.state.inputMode === 'hex' &&
-                React.createElement("div", { className: "k-vstack k-flex-1" },
-                    React.createElement("span", { className: "k-hex-value k-textbox k-input" },
-                        React.createElement(HexInput_1.default, { hex: this.props.hex, onHexChange: this.props.onHexChange, disabled: this.props.disabled })),
-                    React.createElement(kendo_react_labels_1.Label, { className: "k-colorgradient-input-label" }, hexMessage)),
-            (this.state.inputMode === 'rgb' || this.state.inputMode === 'rgba') &&
-                React.createElement(React.Fragment, null,
-                    React.createElement("div", { className: "k-vstack" },
-                        React.createElement(main_1.NumericTextBox, { inputType: 'number', value: this.props.rgba.r, ariaLabel: String(this.props.rgba.r), min: 0, max: 255, spinners: false, format: "n", onChange: this.onRgbaRChange, disabled: this.props.disabled }),
-                        React.createElement(kendo_react_labels_1.Label, { className: "k-colorgradient-input-label" }, rMessage)),
-                    React.createElement("div", { className: "k-vstack" },
-                        React.createElement(main_1.NumericTextBox, { inputType: 'number', value: this.props.rgba.g, ariaLabel: String(this.props.rgba.g), min: 0, max: 255, spinners: false, format: "n", onChange: this.onRgbaGChange, disabled: this.props.disabled }),
-                        React.createElement(kendo_react_labels_1.Label, { className: "k-colorgradient-input-label" }, gMessage)),
-                    React.createElement("div", { className: "k-vstack" },
-                        React.createElement(main_1.NumericTextBox, { inputType: 'number', value: this.props.rgba.b, ariaLabel: String(this.props.rgba.b), min: 0, max: 255, spinners: false, format: "n", onChange: this.onRgbaBChange, disabled: this.props.disabled }),
-                        React.createElement(kendo_react_labels_1.Label, { className: "k-colorgradient-input-label" }, bMessage))),
-            this.state.inputMode === 'rgba' &&
-                React.createElement("div", { className: "k-vstack" },
-                    this.props.opacity &&
-                        React.createElement(main_1.NumericTextBox, { inputType: 'number', value: this.props.rgba.a, ariaLabel: String(this.props.rgba.a), min: 0, max: 1, step: 0.01, spinners: false, format: "n2", onChange: this.onRgbaAChange, disabled: this.props.disabled }),
-                    this.props.opacity && (React.createElement(kendo_react_labels_1.Label, { className: "k-colorgradient-input-label" }, aMessage)))));
-    };
-    ColorInput.prototype.dispatchRgbaChange = function (newValue, event) {
-        var rgba = __assign({}, this.props.rgba);
-        if (newValue.r !== undefined) {
-            rgba.r = newValue.r;
-        }
-        if (newValue.g !== undefined) {
-            rgba.g = newValue.g;
-        }
-        if (newValue.b !== undefined) {
-            rgba.b = newValue.b;
-        }
-        if (newValue.a !== undefined) {
-            rgba.a = newValue.a;
-        }
-        this.props.onRgbaChange(rgba, event);
-    };
-    ;
-    ColorInput.prototype.onToggleModeChange = function () {
-        var index = modes.length - 1 === modes.indexOf(this.state.inputMode) ? 0 : modes.indexOf(this.state.inputMode) + 1;
-        if (!this.props.opacity) {
-            var nextIndex = modes[index] === 'rgba' ? index + 1 : index;
-            this.setState({ inputMode: modes[nextIndex] });
-        }
-        else {
-            this.setState({ inputMode: modes[index] });
-        }
-    };
-    return ColorInput;
-}(React.Component));
-exports.default = ColorInput;
-(0, kendo_react_intl_1.registerForIntl)(ColorInput);
-(0, kendo_react_intl_1.registerForLocalization)(ColorInput);