@progress/kendo-react-layout 6.1.1 → 7.0.0-develop.1

package/dist/npm/splitter/SplitterBar.js

@@ -1,186 +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.SplitterBar = void 0;
-var React = require("react");
-var kendo_react_common_1 = require("@progress/kendo-react-common");
-var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
-/**
- * @hidden
- */
-var SplitterBar = /** @class */ (function (_super) {
-    __extends(SplitterBar, _super);
-    function SplitterBar(props) {
-        var _this = _super.call(this, props) || this;
-        _this.draggable = null;
-        _this.onDrag = function (data, isFirst, isLast) {
-            var event = data.event;
-            var _a = _this.props, onDrag = _a.onDrag, index = _a.index;
-            var element = _this.draggable && _this.draggable.element;
-            if (element && !_this.isStatic && _this.isDraggable) {
-                onDrag(event, element, index, isFirst, isLast);
-            }
-        };
-        _this.onFocus = function () {
-            _this.setState({
-                focused: true
-            });
-        };
-        _this.onBlur = function () {
-            _this.setState({
-                focused: false
-            });
-        };
-        _this.onToggle = function (event) {
-            var _a = _this.props, onToggle = _a.onToggle, index = _a.index, prev = _a.prev, next = _a.next;
-            if (prev.collapsible || next.collapsible) {
-                onToggle(prev.collapsible ? index : index + 1, event);
-            }
-        };
-        _this.onPrevToggle = function (event) {
-            var _a = _this.props, onToggle = _a.onToggle, index = _a.index, prev = _a.prev;
-            if (prev.collapsible) {
-                onToggle(index, event);
-            }
-        };
-        _this.onNextToggle = function (event) {
-            var _a = _this.props, onToggle = _a.onToggle, index = _a.index, next = _a.next;
-            if (next.collapsible) {
-                onToggle(index + 1, event);
-            }
-        };
-        _this.onKeyDown = function (event) {
-            var keyCode = event && event.keyCode;
-            var isHorizontal = _this.isHorizontal;
-            var index = _this.props.index;
-            var element = _this.draggable && _this.draggable.element;
-            var onKeyboardResize = function (el, idx, offset) {
-                event.preventDefault();
-                _this.props.onKeyboardResize(el, idx, offset, event);
-            };
-            if (!element) {
-                return;
-            }
-            if (keyCode === kendo_react_common_1.Keys.enter) {
-                event.preventDefault();
-                _this.onToggle(event);
-            }
-            else if (_this.isDraggable) {
-                if (isHorizontal && keyCode === kendo_react_common_1.Keys.left) {
-                    onKeyboardResize(element, index, -10);
-                }
-                else if (isHorizontal && keyCode === kendo_react_common_1.Keys.right) {
-                    onKeyboardResize(element, index, 10);
-                }
-                else if (!isHorizontal && keyCode === kendo_react_common_1.Keys.up) {
-                    onKeyboardResize(element, index, -10);
-                }
-                else if (!isHorizontal && keyCode === kendo_react_common_1.Keys.down) {
-                    onKeyboardResize(element, index, 10);
-                }
-            }
-        };
-        _this.state = {
-            focused: false
-        };
-        return _this;
-    }
-    Object.defineProperty(SplitterBar.prototype, "isStatic", {
-        get: function () {
-            var _a = this.props, prev = _a.prev, next = _a.next;
-            var betweenResizablePanes = prev.resizable && next.resizable;
-            var nearCollapsiblePane = prev.collapsible || next.collapsible;
-            return !betweenResizablePanes && !nearCollapsiblePane;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SplitterBar.prototype, "isDraggable", {
-        get: function () {
-            var _a = this.props, prev = _a.prev, next = _a.next;
-            var betweenResizablePanes = prev.resizable && next.resizable;
-            var nearCollapsedPane = prev.collapsed || next.collapsed;
-            return !!betweenResizablePanes && !nearCollapsedPane;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(SplitterBar.prototype, "isHorizontal", {
-        get: function () {
-            return this.props.orientation === 'horizontal';
-        },
-        enumerable: false,
-        configurable: true
-    });
-    SplitterBar.prototype.render = function () {
-        var _a;
-        var _this = this;
-        var isDraggable = this.isDraggable;
-        var isStatic = this.isStatic;
-        var isHorizontal = this.isHorizontal;
-        var barClasses = (0, kendo_react_common_1.classNames)('k-splitbar', (_a = {},
-            _a['k-focus'] = this.state.focused,
-            _a['k-splitbar-horizontal'] = isHorizontal,
-            _a['k-splitbar-vertical'] = !isHorizontal,
-            _a['k-splitbar-draggable-horizontal'] = isHorizontal && isDraggable,
-            _a['k-splitbar-draggable-vertical'] = !isHorizontal && isDraggable,
-            _a['k-splitbar-static-horizontal'] = isHorizontal && isStatic,
-            _a['k-splitbar-static-vertical'] = !isHorizontal && isStatic,
-            _a));
-        return (React.createElement(kendo_react_common_1.Draggable, { onPress: function (event) { return _this.onDrag(event, true, false); }, onDrag: function (event) { return _this.onDrag(event, false, false); }, onRelease: function (event) { return _this.onDrag(event, false, true); }, ref: function (component) { _this.draggable = component; } },
-            React.createElement("div", { tabIndex: isStatic ? -1 : 0, role: 'separator', "aria-valuenow": 0, "aria-label": this.props.ariaLabel, "aria-orientation": isHorizontal ? 'vertical' : undefined, className: barClasses, style: { touchAction: 'none' }, onFocus: this.onFocus, onBlur: this.onBlur, onDoubleClick: this.onToggle, onKeyDown: this.onKeyDown },
-                this.props.prev.collapsible && React.createElement("div", { className: 'k-collapse-prev', onClick: this.onPrevToggle },
-                    React.createElement(kendo_react_common_1.IconWrap, { name: this.props.prev.collapsible
-                            ? isHorizontal
-                                ? this.props.prev.collapsed
-                                    ? (this.props.isRtl ? 'caret-alt-left' : 'caret-alt-right')
-                                    : (this.props.isRtl ? 'caret-alt-right' : 'caret-alt-left')
-                                : this.props.prev.collapsed
-                                    ? 'caret-alt-down'
-                                    : 'caret-alt-up'
-                            : undefined, icon: this.props.prev.collapsible
-                            ? isHorizontal
-                                ? this.props.prev.collapsed
-                                    ? (this.props.isRtl ? kendo_svg_icons_1.caretAltLeftIcon : kendo_svg_icons_1.caretAltRightIcon)
-                                    : (this.props.isRtl ? kendo_svg_icons_1.caretAltRightIcon : kendo_svg_icons_1.caretAltLeftIcon)
-                                : this.props.prev.collapsed
-                                    ? kendo_svg_icons_1.caretAltDownIcon
-                                    : kendo_svg_icons_1.caretAltUpIcon
-                            : undefined, size: 'xsmall' })),
-                React.createElement("div", { className: 'k-resize-handle' }),
-                this.props.next.collapsible && React.createElement("div", { className: 'k-collapse-next', onClick: this.onNextToggle },
-                    React.createElement(kendo_react_common_1.IconWrap, { name: this.props.next.collapsible
-                            ? isHorizontal
-                                ? this.props.next.collapsed
-                                    ? (this.props.isRtl ? 'caret-alt-right' : 'caret-alt-left')
-                                    : (this.props.isRtl ? 'caret-alt-left' : 'caret-alt-right')
-                                : this.props.next.collapsed
-                                    ? 'caret-alt-up'
-                                    : 'caret-alt-down'
-                            : undefined, icon: this.props.next.collapsible
-                            ? isHorizontal
-                                ? this.props.next.collapsed
-                                    ? (this.props.isRtl ? kendo_svg_icons_1.caretAltRightIcon : kendo_svg_icons_1.caretAltLeftIcon)
-                                    : (this.props.isRtl ? kendo_svg_icons_1.caretAltLeftIcon : kendo_svg_icons_1.caretAltRightIcon)
-                                : this.props.next.collapsed
-                                    ? kendo_svg_icons_1.caretAltUpIcon
-                                    : kendo_svg_icons_1.caretAltDownIcon
-                            : undefined, size: 'xsmall' })))));
-    };
-    return SplitterBar;
-}(React.Component));
-exports.SplitterBar = SplitterBar;

package/dist/npm/splitter/SplitterPane.js

@@ -1,49 +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.SplitterPane = void 0;
-var React = require("react");
-var kendo_react_common_1 = require("@progress/kendo-react-common");
-/**
- * @hidden
- */
-var SplitterPane = /** @class */ (function (_super) {
-    __extends(SplitterPane, _super);
-    function SplitterPane() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    SplitterPane.prototype.render = function () {
-        var _a;
-        var _b = this.props, id = _b.id, size = _b.size, collapsed = _b.collapsed, overlay = _b.overlay, containsSplitter = _b.containsSplitter, collapsible = _b.collapsible, resizable = _b.resizable, scrollable = _b.scrollable, keepMounted = _b.keepMounted;
-        var fixedSize = size && size.length > 0;
-        var style = {
-            flexBasis: size
-        };
-        var paneClasses = (0, kendo_react_common_1.classNames)('k-pane', (_a = {},
-            _a['k-hidden'] = collapsed,
-            _a['hidden'] = collapsed,
-            _a['k-pane-flex'] = containsSplitter,
-            _a['k-pane-static'] = !resizable && !collapsible || fixedSize,
-            _a['k-scrollable'] = scrollable,
-            _a));
-        return (React.createElement("div", { id: id, role: 'group', style: style, className: paneClasses },
-            !collapsed || keepMounted ? this.props.children : undefined,
-            overlay ? React.createElement("div", { className: 'k-splitter-overlay k-overlay' }) : undefined));
-    };
-    return SplitterPane;
-}(React.Component));
-exports.SplitterPane = SplitterPane;

package/dist/npm/splitter/messages/index.d.ts

@@ -1,10 +0,0 @@
-/**
- * @hidden
- */
-export declare const splitBarLabel = "splitBarLabel";
-/**
- * @hidden
- */
-export declare const messages: {
-    splitBarLabel: string;
-};

package/dist/npm/splitter/messages/index.js

@@ -1,14 +0,0 @@
-"use strict";
-var _a;
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.messages = exports.splitBarLabel = void 0;
-/**
- * @hidden
- */
-exports.splitBarLabel = 'splitBarLabel';
-/**
- * @hidden
- */
-exports.messages = (_a = {},
-    _a[exports.splitBarLabel] = 'split bar',
-    _a);

package/dist/npm/stacklayout/StackLayout.js

@@ -1,90 +0,0 @@
-"use strict";
-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 });
-exports.StackLayout = void 0;
-var React = require("react");
-var PropTypes = require("prop-types");
-var kendo_licensing_1 = require("@progress/kendo-licensing");
-var package_metadata_1 = require("../package-metadata");
-var kendo_react_common_1 = require("@progress/kendo-react-common");
-/**
- * Represents the [KendoReact StackLayout component]({% slug overview_stacklayout %}).
- * Arranges its inner elements horizontally, or vertically in a stack. Nesting stack layouts is supported to build more complex layouts.
- *
- * @example
- * ```jsx
- *
- * const App = () => {
- *   return (
- *     <StackLayout
- *       orientation="vertical"
- *       align={{horizontal: 'stretch', vertical: 'stretch'}}
- *       gap={10}
- *     >
- *       <div>Box</div>
- *       <div>Box</div>
- *       <div>Box</div>
- *       <div>Box</div>
- *     </StackLayout>
- *   );
- * };
- *    ReactDOM.render(<App />, document.querySelector('my-app'));
- * ```
- */
-exports.StackLayout = React.forwardRef(function (props, ref) {
-    (0, kendo_licensing_1.validatePackage)(package_metadata_1.packageMetadata);
-    var elementRef = React.useRef(null);
-    var getImperativeHandle = React.useCallback(function () { return ({
-        element: elementRef.current
-    }); }, []);
-    React.useImperativeHandle(ref, getImperativeHandle);
-    var className = props.className, style = props.style, id = props.id, children = props.children;
-    var layoutId = React.useMemo(function () { return (0, kendo_react_common_1.guid)(); }, []);
-    var orientation = React.useMemo(function () { return props.orientation || defaultProps.orientation; }, [props.orientation]);
-    var isHorizontal = orientation === 'horizontal';
-    var hAlign = React.useMemo(function () { return props.align && props.align.horizontal ? props.align.horizontal : defaultProps.hAlign; }, [props.align]);
-    var vAlign = React.useMemo(function () { return props.align && props.align.vertical ? props.align.vertical : defaultProps.vAlign; }, [props.align]);
-    var stackLayoutClasses = React.useMemo(function () { return (0, kendo_react_common_1.classNames)('k-stack-layout', {
-        'k-hstack': orientation === 'horizontal',
-        'k-vstack': orientation === 'vertical',
-        'k-justify-content-start': isHorizontal && hAlign === 'start' || !isHorizontal && vAlign === 'top',
-        'k-justify-content-center': isHorizontal && hAlign === 'center' || !isHorizontal && vAlign === 'middle',
-        'k-justify-content-end': isHorizontal && hAlign === 'end' || !isHorizontal && vAlign === 'bottom',
-        'k-justify-content-stretch': isHorizontal && hAlign === 'stretch' || !isHorizontal && vAlign === 'stretch',
-        'k-align-items-start': !isHorizontal && hAlign === 'start' || isHorizontal && vAlign === 'top',
-        'k-align-items-center': !isHorizontal && hAlign === 'center' || isHorizontal && vAlign === 'middle',
-        'k-align-items-end': !isHorizontal && hAlign === 'end' || isHorizontal && vAlign === 'bottom',
-        'k-align-items-stretch': !isHorizontal && hAlign === 'stretch' || isHorizontal && vAlign === 'stretch'
-    }, className); }, [orientation, isHorizontal, hAlign, vAlign, className]);
-    var stackLayoutStyles = __assign({ gap: "".concat(typeof props.gap === 'number' ? props.gap + 'px' : props.gap) }, style);
-    return (React.createElement("div", { ref: elementRef, className: stackLayoutClasses, style: stackLayoutStyles, id: id || layoutId }, children));
-});
-var defaultProps = {
-    orientation: 'horizontal',
-    hAlign: 'stretch',
-    vAlign: 'stretch'
-};
-exports.StackLayout.propTypes = {
-    className: PropTypes.string,
-    style: PropTypes.object,
-    children: PropTypes.any,
-    id: PropTypes.string,
-    orientation: PropTypes.oneOf(['horizontal', 'vertical']),
-    gap: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    align: PropTypes.shape({
-        vertical: PropTypes.oneOf(['top', 'middle', 'bottom', 'stretch']),
-        horizontal: PropTypes.oneOf(['start', 'center', 'end', 'stretch'])
-    })
-};
-exports.StackLayout.defaultProps = defaultProps;
-exports.StackLayout.displayName = 'KendoReactStackLayout';

package/dist/npm/stacklayout/StackLayoutProps.d.ts

@@ -1,88 +0,0 @@
-import * as React from 'react';
-/**
- * Represents the props of the [KendoReact StackLayout component]({% slug overview_stacklayout %}).
- */
-export interface StackLayoutProps {
-    /**
-     * The React elements that will be rendered inside the StackLayout.
-     */
-    children?: React.ReactNode;
-    /**
-     * Sets additional CSS classes to the StackLayout.
-     */
-    className?: string;
-    /**
-     * Sets additional CSS styles to the StackLayout.
-     */
-    style?: React.CSSProperties;
-    /**
-     * Sets the `id` property of the root StackLayout element.
-     */
-    id?: string;
-    /**
-     * Specifies the gap between the inner elements ([see example]({% slug layout_stacklayout %}#toc-gaps)).
-     */
-    gap?: number | string;
-    /**
-     * Specifies the orientation of the StackLayout.
-     * ([see example]({% slug layout_stacklayout %}#toc-orientation)).
-     *
-     * The possible values are:
-     * * (Default)`horizontal`
-     * * `vertical`
-     */
-    orientation?: StackLayoutOrientation;
-    /**
-     * Specifies the horizontal and vertical alignment of the inner StackLayout elements.
-     * Demo ([here]({% slug layout_stacklayout %}#toc-horizontal-align)) and ([here]({% slug layout_stacklayout %}#toc-vertical-align)).
-     *
-     * The possible keys are:
-     * * `horizontal`—Defines the possible horizontal alignment of the inner StackLayout elements.
-     *   * `start`—Uses the start point of the container.
-     *   * `center`—Uses the central point of the container.
-     *   * `end`—Uses the end point of the container.
-     *   * (Default)`stretch`—Stretches the items to fill the width of the container.
-     * * `vertical`—Defines the possible vertical alignment of the inner StackLayout elements.
-     *   * `top`—Uses the top point of the container.
-     *   * `middle`—Uses the middle point of the container.
-     *   * `bottom`—Uses the bottom point of the container.
-     *   * (Default)`stretch`—Stretches the items to fill the height of the container.
-     */
-    align?: StackLayoutAlign;
-}
-/**
- * Specifies the orientation of the StackLayout ([see example]({% slug layout_stacklayout %}#toc-orientation)).
- *
- * The possible values are:
- * * (Default)`horizontal`
- * * `vertical`
- *
- */
-export declare type StackLayoutOrientation = 'horizontal' | 'vertical';
-/**
- * Specifies the horizontal and vertical alignment of the inner StackLayout elements.
- */
-export interface StackLayoutAlign {
-    /**
-     * Defines the possible horizontal alignment of the inner StackLayout elements
-     * ([see example]({% slug layout_stacklayout %}#toc-horizontal-align)).
-     *
-     * The available values are:
-     * - `start`—Uses the start point of the container.
-     * - `center`—Uses the center point of the container.
-     * - `end`—Uses the end point of the container.
-     * - (Default)`stretch`—Stretches the items to fill the width of the container.
-     */
-    horizontal?: 'start' | 'center' | 'end' | 'stretch';
-    /**
-     * Defines the possible vertical alignment of the inner StackLayout elements
-     * ([see example]({% slug layout_stacklayout %}#toc-vertical-align)).
-     *
-     * The available values are:
-     * - `top`—Uses the top point of the container.
-     * - `middle`—Uses the middle point of the container.
-     * - `bottom`—Uses the bottom point of the container.
-     * - (Default)`stretch`—Stretches the items to fill the height of the container.
-     */
-    vertical?: 'top' | 'middle' | 'bottom' | 'stretch';
-}

package/dist/npm/stacklayout/StackLayoutProps.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/npm/stepper/Step.d.ts

@@ -1,23 +0,0 @@
-import * as React from 'react';
-import { StepHandle } from './interfaces/StepHandle';
-import { StepProps } from './interfaces/StepProps';
-/**
- * Represents the [KendoReact Step component]({% slug overview_stepper %}).
- *
- * @example
- * ```jsx
- * const steps = [
- *    { label: 'Step 1' },
- *    { label: 'Step 2' },
- *    { label: 'Step 3', optional: true }
- * ];
- *
- * const App = () => {
- *   return (
- *       <Stepper items={steps} value={1}/>
- *   );
- * };
- *    ReactDOM.render(<App />, document.querySelector('my-app'));
- * ```
- */
-export declare const Step: React.ForwardRefExoticComponent<Omit<StepProps, "ref"> & React.RefAttributes<StepHandle | null>>;

package/dist/npm/stepper/Step.js

@@ -1,144 +0,0 @@
-"use strict";
-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);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    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 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Step = void 0;
-var React = require("react");
-var PropTypes = require("prop-types");
-var StepperContext_1 = require("./context/StepperContext");
-var kendo_react_common_1 = require("@progress/kendo-react-common");
-var kendo_react_intl_1 = require("@progress/kendo-react-intl");
-var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
-var contants_1 = require("./contants");
-var messages_1 = require("./messages");
-/**
- * Represents the [KendoReact Step component]({% slug overview_stepper %}).
- *
- * @example
- * ```jsx
- * const steps = [
- *    { label: 'Step 1' },
- *    { label: 'Step 2' },
- *    { label: 'Step 3', optional: true }
- * ];
- *
- * const App = () => {
- *   return (
- *       <Stepper items={steps} value={1}/>
- *   );
- * };
- *    ReactDOM.render(<App />, document.querySelector('my-app'));
- * ```
- */
-exports.Step = React.forwardRef(function (props, target) {
-    var 
-    // content
-    children = props.children, className = props.className, current = props.current, disabled = props.disabled, focused = props.focused, icon = props.icon, svgIcon = props.svgIcon, index = props.index, isValid = props.isValid, label = props.label, optional = props.optional, style = props.style, tabIndex = props.tabIndex, text = props.text, others = __rest(props, ["children", "className", "current", "disabled", "focused", "icon", "svgIcon", "index", "isValid", "label", "optional", "style", "tabIndex", "text"]);
-    var _a = React.useContext(StepperContext_1.StepperContext), animationDuration = _a.animationDuration, isVertical = _a.isVertical, item = _a.item, linear = _a.linear, mode = _a.mode, numOfSteps = _a.numOfSteps, value = _a.value, onChange = _a.onChange, onFocus = _a.onFocus, successIcon = _a.successIcon, errorIcon = _a.errorIcon, successSVGIcon = _a.successSVGIcon, errorSVGIcon = _a.errorSVGIcon;
-    var elementRef = React.useRef(null);
-    var focusElement = React.useCallback(function () {
-        if (elementRef.current) {
-            (0, kendo_react_common_1.focusFirstFocusableChild)(elementRef.current);
-        }
-    }, []);
-    var getImperativeHandle = React.useCallback(function () { return ({
-        element: elementRef.current,
-        focus: focusElement
-    }); }, [focusElement]);
-    React.useImperativeHandle(target, getImperativeHandle);
-    var allowClick = !linear || (index === value - 1 || index === value || index === value + 1);
-    var isInLabel = mode === 'labels' || (Boolean(icon) && Boolean(label));
-    var localizationService = (0, kendo_react_intl_1.useLocalization)();
-    var localizeMessage = function (message) {
-        return localizationService.toLanguageString(message, messages_1.messages[message]);
-    };
-    var optionalMessage = localizeMessage(messages_1.optionalText);
-    var progressAnimation = typeof animationDuration === 'number'
-        ? animationDuration
-        : animationDuration !== false
-            ? contants_1.DEFAULT_ANIMATION_DURATION
-            : contants_1.NO_ANIMATION;
-    var handleClick = React.useCallback(function (event) {
-        if (onChange && !disabled) {
-            (0, kendo_react_common_1.dispatchEvent)(onChange, event, getImperativeHandle(), { value: index });
-        }
-    }, [onChange, value, disabled]);
-    var handleFocus = React.useCallback(function (event) {
-        if (onFocus && !disabled) {
-            (0, kendo_react_common_1.dispatchEvent)(onFocus, event, getImperativeHandle(), undefined);
-        }
-    }, [onFocus, disabled]);
-    var itemClassNames = React.useMemo(function () { return (0, kendo_react_common_1.classNames)('k-step', {
-        'k-step-first': index === 0,
-        'k-step-last': numOfSteps && index === numOfSteps - 1,
-        'k-step-done': index < value,
-        'k-step-current': current,
-        'k-step-optional': optional,
-        'k-step-error': isValid !== undefined && !isValid,
-        'k-step-success': isValid
-    }, {
-        'k-disabled': disabled,
-        'k-focus': focused
-    }, className); }, [index, numOfSteps, value, current, optional, disabled, focused, isValid, className]);
-    var itemStyles = React.useMemo(function () { return (__assign({ maxWidth: !isVertical ? "calc(100% / ".concat(numOfSteps, ")") : undefined, maxHeight: isVertical ? "calc(100% / ".concat(numOfSteps, ")") : undefined, pointerEvents: !allowClick ? 'none' : undefined }, style)); }, [isVertical, numOfSteps, style, allowClick]);
-    var validationIconCustom = isValid ? successIcon : errorIcon;
-    var validationIcons = validationIconCustom ? (React.createElement("span", { className: 'k-step-indicator-icon ' + validationIconCustom, "aria-hidden": "true" })) : (React.createElement(kendo_react_common_1.IconWrap, { className: 'k-step-indicator-icon', name: isValid ? 'check-circle' : 'exclamation-circle', icon: isValid ? (successSVGIcon || kendo_svg_icons_1.checkOutlineIcon) : (errorSVGIcon || kendo_svg_icons_1.exclamationCircleIcon) }));
-    var stepIndicator = (React.createElement(React.Fragment, null, mode !== 'labels' ?
-        React.createElement("span", { className: "k-step-indicator", "aria-hidden": true, style: { transitionDuration: progressAnimation + 'ms' } }, (icon || svgIcon)
-            ? !isInLabel && isValid !== undefined
-                ? validationIcons
-                : React.createElement(kendo_react_common_1.IconWrap, { className: 'k-step-indicator-icon', name: icon ? (0, kendo_react_common_1.toIconName)(icon) : icon, icon: svgIcon })
-            : isValid !== undefined
-                ? validationIcons
-                : React.createElement("span", { className: "k-step-indicator-text" }, text ? text : index + 1)) :
-        null));
-    var stepLabel = (React.createElement("span", { className: "k-step-label" },
-        label && React.createElement("span", { className: "k-step-text" }, label),
-        isInLabel && isValid !== undefined && validationIcons,
-        optional && React.createElement("span", { className: "k-step-label-optional" }, optionalMessage)));
-    var stepLink = (React.createElement(React.Fragment, null,
-        stepIndicator,
-        stepLabel));
-    return (React.createElement("li", __assign({ ref: elementRef, className: itemClassNames, style: itemStyles }, others),
-        React.createElement("a", { className: "k-step-link", title: label ? label : undefined, onClick: handleClick, onFocus: handleFocus, tabIndex: tabIndex ? tabIndex : focused ? 0 : -1, "aria-current": current, "aria-disabled": disabled || !allowClick || undefined, "aria-invalid": isValid !== undefined && !isValid || undefined }, !item ? stepLink : children)));
-});
-exports.Step.propTypes = {
-    children: PropTypes.any,
-    className: PropTypes.string,
-    // content: PropTypes.any,
-    current: PropTypes.bool,
-    disabled: PropTypes.bool,
-    icon: PropTypes.string,
-    index: PropTypes.number,
-    isValid: PropTypes.bool,
-    label: PropTypes.string,
-    optional: PropTypes.bool,
-    style: PropTypes.object,
-    tabIndex: PropTypes.number,
-    text: PropTypes.string
-};
-var defaultProps = {
-    tabIndex: 0
-};
-exports.Step.defaultProps = defaultProps;
-exports.Step.displayName = 'KendoStep';

package/dist/npm/stepper/Stepper.d.ts

@@ -1,23 +0,0 @@
-import * as React from 'react';
-import { StepperProps } from './interfaces/StepperProps';
-import { StepperHandle } from './interfaces/StepperHandle';
-/**
- * Represents the [KendoReact Stepper component]({% slug overview_stepper %}).
- *
- * @example
- * ```jsx
- * const steps = [
- *    { label: 'Step 1' },
- *    { label: 'Step 2' },
- *    { label: 'Step 3', optional: true }
- * ];
- *
- * const App = () => {
- *   return (
- *       <Stepper items={steps} value={1} />
- *   );
- * };
- *    ReactDOM.render(<App />, document.querySelector('my-app'));
- * ```
- */
-export declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<StepperHandle | null>>;