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

package/dist/es/main.js

@@ -1,94 +0,0 @@
-import { MenuItemInternalsList } from './menu/components/MenuItemInternalsList';
-import { downArrowName, leftArrowName, rightArrowName } from './menu/components/MenuItemArrow';
-import { SplitterBar } from './splitter/SplitterBar';
-export { MenuItemInternalsList, downArrowName, leftArrowName, rightArrowName, SplitterBar };
-export * from './tabstrip/TabStrip';
-export * from './tabstrip/TabStripContent';
-export * from './tabstrip/TabStripNavigation';
-export * from './tabstrip/TabStripNavigationItem';
-export * from './tabstrip/TabStripTab';
-export * from './panelbar/PanelBar';
-export * from './panelbar/PanelBarItem';
-export * from './panelbar/util';
-export * from './panelbar/interfaces/PanelBarProps';
-export * from './panelbar/interfaces/PanelBarItemProps';
-export * from './panelbar/interfaces/RenderPanelBarItem';
-export * from './panelbar/interfaces/PanelBarSelectEventArguments';
-export * from './menu/components/Menu';
-export * from './menu/components/MenuItemLink';
-export * from './menu/components/MenuItem';
-export * from './menu/components/MenuItemArrow';
-export * from './menu/models/MenuItemModel';
-export * from './menu/events';
-export * from './splitter/Splitter';
-export * from './splitter/SplitterPane';
-export * from './card/Card';
-export * from './card/CardHeader';
-export * from './card/CardTitle';
-export * from './card/CardBody';
-export * from './card/CardActions';
-export * from './card/CardImage';
-export * from './card/CardSubtitle';
-export * from './card/CardFooter';
-export * from './card/interfaces/CardProps';
-export * from './card/interfaces/CardHandle';
-export * from './card/interfaces/AvatarProps';
-export * from './card/interfaces/CardActionsProps';
-export * from './card/Avatar';
-export * from './drawer/Drawer';
-export * from './drawer/interfaces/DrawerProps';
-export * from './drawer/DrawerNavigation';
-export * from './drawer/interfaces/DrawerNavigationProps';
-export * from './drawer/DrawerContent';
-export * from './drawer/interfaces/DrawerContentProps';
-export * from './drawer/DrawerItem';
-export * from './drawer/interfaces/DrawerItemHandle';
-export * from './drawer/interfaces/DrawerItemProps';
-export * from './drawer/interfaces/DrawerSelectEvent';
-export * from './drawer/interfaces/DrawerAnimation';
-export * from './stepper/Stepper';
-export * from './stepper/interfaces/StepperProps';
-export * from './stepper/interfaces/StepperHandle';
-export * from './stepper/interfaces/StepperChangeEvent';
-export * from './stepper/interfaces/StepperFocusEvent';
-export * from './stepper/Step';
-export * from './stepper/interfaces/StepProps';
-export * from './stepper/interfaces/StepHandle';
-export * from './stepper/interfaces/StepChangeEvent';
-export * from './stepper/interfaces/StepFocusEvent';
-export * from './appbar/AppBar';
-export * from './appbar/interfaces/AppBarProps';
-export * from './appbar/AppBarSection';
-export * from './appbar/interfaces/AppBarSectionProps';
-export * from './appbar/AppBarSpacer';
-export * from './appbar/interfaces/AppBarSpacerProps';
-export * from './tilelayout/TileLayout';
-export * from './tilelayout/interfaces/main';
-export * from './bottomnavigation/BottomNavigation';
-export * from './bottomnavigation/BottomNavigationProps';
-export * from './bottomnavigation/BottomNavigationItem';
-export * from './bottomnavigation/BottomNavigationItemProps';
-export * from './bottomnavigation/models/events';
-export * from './stacklayout/StackLayout';
-export * from './stacklayout/StackLayoutProps';
-export * from './gridlayout/GridLayout';
-export * from './gridlayout/GridLayoutItem';
-export * from './gridlayout/interfaces/GridLayoutProps';
-export * from './gridlayout/interfaces/GridLayoutItemProps';
-export * from './gridlayout/interfaces/GridLayoutRowProps';
-export * from './gridlayout/interfaces/GridLayoutColumnProps';
-export * from './breadcrumb/Breadcrumb';
-export * from './breadcrumb/BreadcrumbOrderedList';
-export * from './breadcrumb/BreadcrumbListItem';
-export * from './breadcrumb/BreadcrumbDelimiter';
-export * from './breadcrumb/BreadcrumbLink';
-export * from './actionsheet/ActionSheet';
-export * from './actionsheet/ActionSheetItem';
-export * from './actionsheet/interfaces/ActionSheetItemProps';
-export * from './actionsheet/ActionSheetHeader';
-export * from './actionsheet/ActionSheetContent';
-export * from './actionsheet/ActionSheetFooter';
-export * from './timeline/Timeline';
-export * from './timeline/utils';
-export * from './contextmenu/ContextMenu';
-export * from './expansionpanel';

package/dist/es/menu/BaseMenuItemInternalProps.js

@@ -1 +0,0 @@
-export {};

package/dist/es/menu/MenuProps.js

@@ -1,2 +0,0 @@
-export {};
-// tslint:enable:max-line-length

package/dist/es/menu/components/Menu.js

@@ -1,277 +0,0 @@
-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 __());
-    };
-})();
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { classNames, Keys, guid, dispatchEvent } from '@progress/kendo-react-common';
-import { getDirectParentId, isIdEmptyOrZeroLevel, EMPTY_ID, ZERO_LEVEL_ZERO_ITEM_ID, getRootParentId, getItemById } from '../utils/itemsIdsUtils';
-import { prepareInputItemsForInternalWork } from '../utils/prepareInputItemsForInternalWork';
-import { getNewItemIdUponKeyboardNavigation } from '../utils/getNewItemIdUponKeyboardNavigation';
-import { getHoverOpenDelay, getHoverCloseDelay } from '../utils/hoverDelay';
-import { MenuItemInternalsList } from './MenuItemInternalsList';
-import { DirectionHolder } from '../utils/DirectionHolder';
-import { MouseOverHandler } from '../utils/MouseOverHandler';
-import { validatePackage } from '@progress/kendo-react-common';
-import { packageMetadata } from '../../package-metadata';
-var initialItemsIds = {
-    focusedItemId: EMPTY_ID,
-    hoveredItemId: EMPTY_ID,
-    tabbableItemId: ZERO_LEVEL_ZERO_ITEM_ID
-};
-/**
- * Represents the [KendoReact Menu component]({% slug overview_menu %}).
- *
- * @example
- * ```jsx
- * class App extends React.Component {
- *    render() {
- *        return (
- *            <Menu>
- *                <MenuItem text="Item1" />
- *                <MenuItem text="Item2">
- *                    <MenuItem text="Item2.1" />
- *                    <MenuItem text="Item2.2" />
- *                </MenuItem>
- *                <MenuItem text="Item3" />
- *            </Menu>
- *        );
- *    }
- * }
- * ReactDOM.render(<App />, document.querySelector('my-app'));
- * ```
- */
-var Menu = /** @class */ (function (_super) {
-    __extends(Menu, _super);
-    function Menu(props) {
-        var _this = _super.call(this, props) || this;
-        _this.menuWrapperEl = null;
-        _this.guid = guid();
-        _this.directionHolder = new DirectionHolder();
-        _this.inputItems = [];
-        _this.items = [];
-        /**
-         * Resets the selection and opening of Menu items.
-         */
-        _this.reset = function () {
-            _this.clearItemHoverAndLeaveRequestsIfApplicable();
-            _this.setState(initialItemsIds);
-        };
-        _this.onKeyDown = function (event) {
-            // The focusedItemId may be empty when contentRender is used.
-            // For example, content with input.
-            if (_this.state.focusedItemId !== EMPTY_ID) {
-                var currentItem = getItemById(_this.state.focusedItemId, _this.items);
-                var newItemId = getNewItemIdUponKeyboardNavigation(_this.items, currentItem.id, event.keyCode, event.key, _this.props.vertical, _this.directionHolder.getIsDirectionRightToLeft());
-                if (currentItem.id !== newItemId) {
-                    event.preventDefault();
-                    _this.setFocusedItemId(newItemId);
-                }
-                if ((event.keyCode === Keys.enter || event.keyCode === Keys.space) && !currentItem.disabled) {
-                    _this.mouseOverHandler.handleItemSelectedViaKeyboard();
-                    _this.dispatchSelectEventIfWired(event, currentItem.id);
-                    if (!event.isDefaultPrevented() && currentItem.items.length === 0 && currentItem.url) {
-                        window.location.assign(currentItem.url);
-                    }
-                }
-            }
-            if (event.keyCode === Keys.esc && _this.props.onClose) {
-                _this.props.onClose.call(undefined, event);
-            }
-        };
-        _this.onItemMouseOver = function (itemId) {
-            if (_this.mouseOverHandler.IsMouseOverEnabled) {
-                // The `over` event can get fired even without actually leaving the item.
-                // For example, move the mouse little by little over the item content.
-                _this.clearItemHoverAndLeaveRequestsIfApplicable();
-                _this.itemHoverRequest = window.setTimeout(function () {
-                    _this.setHoveredItemId(itemId);
-                    _this.itemHoverRequest = null;
-                }, getHoverOpenDelay(_this.props));
-            }
-        };
-        _this.onItemMouseLeave = function (itemId) {
-            if (_this.mouseOverHandler.IsMouseOverEnabled && _this.isItemWithDefaultClose(itemId)) {
-                // Both the `leave` and `hover` requests are cleared
-                // to be defensive and consistent with the `over` handler.
-                _this.clearItemHoverAndLeaveRequestsIfApplicable();
-                _this.itemLeaveRequest = window.setTimeout(function () {
-                    _this.setHoveredItemId(EMPTY_ID);
-                    _this.itemLeaveRequest = null;
-                }, getHoverCloseDelay(_this.props));
-            }
-        };
-        _this.onItemMouseDown = function () {
-            _this.mouseOverHandler.handleItemMouseDown();
-        };
-        _this.onItemFocus = function (itemId) {
-            _this.setFocusedItemId(itemId);
-            _this.mouseOverHandler.handleItemFocus();
-        };
-        _this.onItemClick = function (event, itemId) {
-            var item = getItemById(itemId, _this.items);
-            if (!item.disabled) {
-                _this.setFocusedItemId(itemId);
-                _this.mouseOverHandler.handleItemClick(itemId, _this.isItemWithDefaultClose(itemId));
-                _this.dispatchSelectEventIfWired(event, itemId);
-                if (!event.isDefaultPrevented() && item.url) {
-                    window.location.assign(item.url);
-                }
-            }
-        };
-        _this.onItemBlur = function (itemId, event) {
-            if (_this.isItemWithDefaultClose(itemId)) {
-                _this.setFocusedItemId(EMPTY_ID);
-            }
-            if (event.relatedTarget && event.relatedTarget.nodeName === 'LI') {
-                var activeElementId = event.relatedTarget.getAttribute('id');
-                if (activeElementId && activeElementId.includes(_this.guid)) {
-                    return;
-                }
-            }
-            if (_this.props.onClose) {
-                _this.props.onClose.call(undefined, event);
-            }
-        };
-        _this.getInputItem = function (itemId) {
-            return getItemById(itemId, _this.inputItems);
-        };
-        validatePackage(packageMetadata);
-        _this.mouseOverHandler = new MouseOverHandler(_this.props.openOnClick, _this.reset, _this.onItemMouseOver);
-        _this.state = Object.assign({}, initialItemsIds, { isFirstRender: true });
-        return _this;
-    }
-    Object.defineProperty(Menu.prototype, "element", {
-        get: function () {
-            return this.menuWrapperEl;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    Menu.prototype.render = function () {
-        var _this = this;
-        this.prepareItems();
-        if (!this.state.isFirstRender) {
-            this.directionHolder.setIsDirectionRightToLeft(this.checkIsDirectionRightToLeft());
-        }
-        var lastItemIdToBeOpened = this.state.hoveredItemId ?
-            this.state.hoveredItemId :
-            this.state.focusedItemId ? getDirectParentId(this.state.focusedItemId) : EMPTY_ID;
-        return (React.createElement("div", { onKeyDown: this.onKeyDown, style: this.props.style, className: this.directionHolder.getIsDirectionRightToLeft() ? 'k-rtl' : undefined, ref: function (el) { return _this.menuWrapperEl = el; } },
-            React.createElement(MenuItemInternalsList, { className: this.getMenuClassName(), "aria-orientation": this.props.vertical ? 'vertical' : undefined, items: this.items, isMenuVertical: this.props.vertical, isDirectionRightToLeft: this.directionHolder.getIsDirectionRightToLeft(), focusedItemId: this.state.focusedItemId, lastItemIdToBeOpened: lastItemIdToBeOpened, tabbableItemId: this.state.tabbableItemId, itemRender: this.props.itemRender, linkRender: this.props.linkRender, menuGuid: this.guid, onMouseLeave: this.onItemMouseLeave, onMouseOver: this.onItemMouseOver, onMouseDown: this.onItemMouseDown, onFocus: this.onItemFocus, onClick: this.onItemClick, onBlur: this.onItemBlur, onOriginalItemNeeded: this.getInputItem, role: this.props.role })));
-    };
-    /**
-     * @hidden
-     */
-    Menu.prototype.componentDidMount = function () {
-        this.setState({ isFirstRender: false });
-    };
-    /**
-     * @hidden
-     */
-    Menu.prototype.componentDidUpdate = function (prevProps) {
-        // Reset the Menu upon big UI changes
-        // to avoid misleading the user and to
-        // keep the component consistent.
-        if (Boolean(prevProps.vertical) !== Boolean(this.props.vertical) ||
-            this.directionHolder.hasDirectionChanged()) {
-            this.reset();
-        }
-        this.mouseOverHandler.OpenOnClick = this.props.openOnClick;
-    };
-    /**
-     * @hidden
-     */
-    Menu.prototype.componentWillUnmount = function () {
-        this.clearItemHoverAndLeaveRequestsIfApplicable();
-    };
-    Menu.prototype.setFocusedItemId = function (focusedItemId) {
-        this.setState(function (prevState) {
-            var tabbableItemId = focusedItemId === EMPTY_ID ?
-                prevState.tabbableItemId : getRootParentId(focusedItemId);
-            var hoveredItemId = focusedItemId === EMPTY_ID ||
-                (isIdEmptyOrZeroLevel(prevState.hoveredItemId) && isIdEmptyOrZeroLevel(focusedItemId)) ?
-                prevState.hoveredItemId : EMPTY_ID;
-            return { hoveredItemId: hoveredItemId, focusedItemId: focusedItemId, tabbableItemId: tabbableItemId };
-        });
-    };
-    Menu.prototype.setHoveredItemId = function (hoveredItemId) {
-        this.setState(function (prevState) {
-            if (isIdEmptyOrZeroLevel(hoveredItemId) && isIdEmptyOrZeroLevel(prevState.focusedItemId)) {
-                return {
-                    hoveredItemId: hoveredItemId,
-                    focusedItemId: prevState.focusedItemId,
-                    tabbableItemId: prevState.tabbableItemId
-                };
-            }
-            else {
-                return { hoveredItemId: hoveredItemId, focusedItemId: EMPTY_ID, tabbableItemId: ZERO_LEVEL_ZERO_ITEM_ID };
-            }
-        });
-    };
-    Menu.prototype.getMenuClassName = function () {
-        return classNames('k-reset', 'k-header', 'k-menu', { 'k-menu-horizontal': !this.props.vertical }, { 'k-menu-vertical': this.props.vertical }, this.props.className);
-    };
-    Menu.prototype.clearItemHoverAndLeaveRequestsIfApplicable = function () {
-        if (this.itemHoverRequest) {
-            clearTimeout(this.itemHoverRequest);
-            this.itemHoverRequest = null;
-        }
-        if (this.itemLeaveRequest) {
-            clearTimeout(this.itemLeaveRequest);
-            this.itemLeaveRequest = null;
-        }
-    };
-    Menu.prototype.isItemWithDefaultClose = function (itemId) {
-        return !this.props.customCloseItemIds || this.props.customCloseItemIds.indexOf(itemId) === -1;
-    };
-    Menu.prototype.checkIsDirectionRightToLeft = function () {
-        return Boolean(this.props.dir !== undefined ? this.props.dir === 'rtl' :
-            this.menuWrapperEl && getComputedStyle(this.menuWrapperEl).direction === 'rtl');
-    };
-    Menu.prototype.prepareItems = function () {
-        var _a = prepareInputItemsForInternalWork(this.props.items, this.props.children), items = _a.items, inputItems = _a.inputItems;
-        this.items = items;
-        this.inputItems = inputItems;
-    };
-    Menu.prototype.dispatchSelectEventIfWired = function (event, itemId) {
-        dispatchEvent(this.props.onSelect, event, this, { item: this.getInputItem(itemId), itemId: itemId });
-    };
-    /**
-     * @hidden
-     */
-    Menu.propTypes = {
-        vertical: PropTypes.bool,
-        items: PropTypes.arrayOf(PropTypes.object),
-        style: PropTypes.object,
-        dir: PropTypes.string,
-        hoverOpenDelay: PropTypes.number,
-        hoverCloseDelay: PropTypes.number,
-        openOnClick: PropTypes.bool,
-        itemRender: PropTypes.any,
-        linkRender: PropTypes.any,
-        customCloseItemIds: PropTypes.arrayOf(PropTypes.string),
-        onSelect: PropTypes.func,
-        role: PropTypes.string
-    };
-    /**
-     * @hidden
-     */
-    Menu.defaultProps = { vertical: false };
-    return Menu;
-}(React.Component));
-export { Menu };

package/dist/es/menu/components/MenuItem.js

@@ -1,46 +0,0 @@
-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 __());
-    };
-})();
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-var MenuItem = /** @class */ (function (_super) {
-    __extends(MenuItem, _super);
-    function MenuItem() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    /**
-     * @hidden
-     */
-    MenuItem.prototype.render = function () {
-        return null;
-    };
-    /**
-     * @hidden
-     */
-    MenuItem.propTypes = {
-        text: PropTypes.string,
-        url: PropTypes.string,
-        icon: PropTypes.string,
-        disabled: PropTypes.bool,
-        cssClass: PropTypes.string,
-        cssStyle: PropTypes.object,
-        render: PropTypes.any,
-        linkRender: PropTypes.any,
-        contentRender: PropTypes.any,
-        data: PropTypes.any
-    };
-    return MenuItem;
-}(React.Component));
-export { MenuItem };

package/dist/es/menu/components/MenuItemArrow.js

@@ -1,78 +0,0 @@
-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);
-};
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { IconWrap } from '@progress/kendo-react-common';
-import { caretAltDownIcon, caretAltRightIcon, caretAltLeftIcon } from '@progress/kendo-svg-icons';
-import { getChildrenPosition } from '../utils/misc';
-/**
- * @hidden
- */
-export var downArrowName = 'caret-alt-down';
-/**
- * @hidden
- */
-export var rightArrowName = 'caret-alt-right';
-/**
- * @hidden
- */
-export var leftArrowName = 'caret-alt-left';
-var MenuItemArrow = /** @class */ (function (_super) {
-    __extends(MenuItemArrow, _super);
-    function MenuItemArrow() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    /**
-     * @hidden
-     */
-    MenuItemArrow.prototype.render = function () {
-        return React.createElement(IconWrap, __assign({ "aria-hidden": true }, this.getIcon()));
-    };
-    MenuItemArrow.prototype.getIcon = function () {
-        var childrenPosition = getChildrenPosition(this.props.itemId, this.props.verticalMenu === true, this.props.dir === 'rtl');
-        switch (childrenPosition) {
-            case 'downward':
-                return { name: downArrowName, icon: caretAltDownIcon };
-            case 'rightward':
-                return { name: rightArrowName, icon: caretAltRightIcon };
-            case 'leftward':
-                return { name: leftArrowName, icon: caretAltLeftIcon };
-            default:
-                return {};
-        }
-    };
-    /**
-     * @hidden
-     */
-    MenuItemArrow.propTypes = {
-        itemId: PropTypes.string,
-        dir: PropTypes.string,
-        verticalMenu: PropTypes.bool
-    };
-    return MenuItemArrow;
-}(React.Component));
-export { MenuItemArrow };

package/dist/es/menu/components/MenuItemInternal.js

@@ -1,165 +0,0 @@
-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 __());
-    };
-})();
-import * as React from 'react';
-import { classNames, getActiveElement, IconWrap } from '@progress/kendo-react-common';
-import { Popup } from '@progress/kendo-react-popup';
-import { shouldOpenItem, isFirstItemFromSiblings } from '../utils/itemsIdsUtils';
-import { getPopupSettings, convertBoolDirectionToString, getDOMElementId } from '../utils/misc';
-import { MenuItemLink } from './MenuItemLink';
-import { MenuItemInternalsList } from './MenuItemInternalsList';
-import { MenuItemArrow } from './MenuItemArrow';
-/**
- * @hidden
- */
-var MenuItemInternal = /** @class */ (function (_super) {
-    __extends(MenuItemInternal, _super);
-    function MenuItemInternal(props) {
-        var _this = _super.call(this, props) || this;
-        _this.isFirstRender = true;
-        _this.onMouseOver = function (event) {
-            _this.props.onMouseOver(_this.props.item.id);
-            event.stopPropagation();
-        };
-        _this.onMouseLeave = function (event) {
-            _this.props.onMouseLeave(_this.props.item.id);
-            event.stopPropagation();
-        };
-        _this.state = { opened: false };
-        return _this;
-    }
-    MenuItemInternal.prototype.componentDidMount = function () {
-        var focusedItemId = this.props.focusedItemId;
-        var currentItemId = this.props.item.id;
-        // If the menu item component has been just mounted due to
-        // keyboard navigation and it is the selected one.
-        if (focusedItemId && focusedItemId === currentItemId) {
-            this.itemElement.focus();
-        }
-        this.isFirstRender = false;
-    };
-    MenuItemInternal.prototype.componentDidUpdate = function (prevProps) {
-        var focusedItemId = this.props.focusedItemId;
-        var currentItemId = this.props.item.id;
-        if (focusedItemId) {
-            var activeElement = getActiveElement(document);
-            // If the item has been navigated to via the keyboard navigation
-            // (Clicking and focusing an item also come here).
-            if (prevProps.focusedItemId !== focusedItemId
-                && focusedItemId === currentItemId
-                // https://github.com/telerik/kendo-react/issues/216 :
-                // No need to focus the wrapping menu item DOM element
-                // when a child DOM element was clicked.
-                && !this.itemElement.contains(activeElement)) {
-                this.itemElement.focus();
-            }
-        }
-    };
-    MenuItemInternal.prototype.render = function () {
-        var _this = this;
-        var item = this.props.item;
-        var itemId = item.id;
-        var menuItemId = getDOMElementId(this.props.menuGuid, itemId);
-        return (React.createElement(React.Fragment, null,
-            React.createElement("li", { id: getDOMElementId(this.props.menuGuid, itemId), className: this.getMenuItemClassName(item), style: item.cssStyle, tabIndex: itemId === this.props.tabbableItemId ? 0 : -1, onMouseOver: this.onMouseOver, onMouseLeave: this.onMouseLeave, onMouseDown: function (event) { return _this.props.onMouseDown(event); }, onBlur: function (e) { return _this.props.onBlur(itemId, e); }, onFocus: function () { return _this.props.onFocus(itemId); }, onClick: function (event) { return _this.props.onClick(event, itemId); }, role: "menuitem", "aria-disabled": item.disabled ? true : undefined, "aria-haspopup": item.items.length > 0 ? true : undefined, "aria-expanded": item.items.length > 0 ? this.Opened : undefined, "aria-label": item.text, "aria-owns": this.Opened ? menuItemId : undefined, ref: function (el) { return _this.itemElement = el; }, key: "0" }, this.contentRender ? this.renderContent() : this.renderMenuItemLink()),
-            this.renderPopupIfOpened()));
-    };
-    MenuItemInternal.prototype.renderContent = function () {
-        var itemId = this.props.item.contentParentItemId;
-        return (React.createElement("div", { className: "k-content", role: "presentation" },
-            React.createElement(this.contentRender, { item: this.props.onOriginalItemNeeded(itemId), itemId: itemId })));
-    };
-    MenuItemInternal.prototype.renderMenuItemLink = function () {
-        var item = this.props.item;
-        if (this.linkRender) {
-            return (React.createElement(this.linkRender, { item: this.props.onOriginalItemNeeded(item.id), itemId: item.id, opened: this.Opened, dir: convertBoolDirectionToString(this.props.isDirectionRightToLeft) }));
-        }
-        else {
-            var textOrItemRender = this.itemRender ?
-                React.createElement(this.itemRender, { item: this.props.onOriginalItemNeeded(item.id), itemId: item.id, key: "1" }) :
-                React.createElement("span", { className: "k-menu-link-text" }, item.text);
-            return (React.createElement(MenuItemLink, { url: item.url, opened: this.Opened },
-                this.renderMenuIconIfApplicable(),
-                textOrItemRender,
-                this.renderArrowIfApplicable()));
-        }
-    };
-    MenuItemInternal.prototype.renderPopupIfOpened = function () {
-        if (this.Opened) {
-            var itemId = this.props.item.id;
-            var _a = getPopupSettings(itemId, this.props.isMenuVertical, this.props.isDirectionRightToLeft), anchorAlign = _a.anchorAlign, popupAlign = _a.popupAlign, collision = _a.collision;
-            return (React.createElement(Popup, { anchor: this.itemElement, show: true, popupClass: this.getPopupClassName(), anchorAlign: anchorAlign, popupAlign: popupAlign, collision: collision, animate: false, key: "1" },
-                React.createElement(MenuItemInternalsList, { parentItemId: itemId, items: this.props.item.items, menuGuid: this.props.menuGuid, focusedItemId: this.props.focusedItemId, lastItemIdToBeOpened: this.props.lastItemIdToBeOpened, tabbableItemId: this.props.tabbableItemId, itemRender: this.props.itemRender, linkRender: this.props.linkRender, isMenuVertical: this.props.isMenuVertical, isDirectionRightToLeft: this.props.isDirectionRightToLeft, className: "k-group k-menu-group k-reset k-menu-group-md", onMouseOver: this.props.onMouseOver, onMouseLeave: this.props.onMouseLeave, onMouseDown: this.props.onMouseDown, onBlur: this.props.onBlur, onFocus: this.props.onFocus, onClick: this.props.onClick, onOriginalItemNeeded: this.props.onOriginalItemNeeded })));
-        }
-        else {
-            return null;
-        }
-    };
-    MenuItemInternal.prototype.renderMenuIconIfApplicable = function () {
-        var _a = this.props.item, icon = _a.icon, svgIcon = _a.svgIcon;
-        return icon || svgIcon ?
-            React.createElement(IconWrap, { name: icon, icon: svgIcon, key: "0" }) : null;
-    };
-    MenuItemInternal.prototype.renderArrowIfApplicable = function () {
-        return this.props.item.items.length > 0 ?
-            (React.createElement("span", { className: "k-menu-expand-arrow", "aria-hidden": true },
-                React.createElement(MenuItemArrow, { itemId: this.props.item.id, verticalMenu: this.props.isMenuVertical, dir: convertBoolDirectionToString(this.props.isDirectionRightToLeft), key: "2" }))) : null;
-    };
-    Object.defineProperty(MenuItemInternal.prototype, "itemRender", {
-        get: function () {
-            return this.props.item.render || this.props.itemRender;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(MenuItemInternal.prototype, "linkRender", {
-        get: function () {
-            return this.props.item.linkRender || this.props.linkRender;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(MenuItemInternal.prototype, "contentRender", {
-        get: function () {
-            return this.props.item.contentParentItemId ? this.props.item.contentRender : null;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(MenuItemInternal.prototype, "Opened", {
-        get: function () {
-            var props = this.props;
-            return props.item.items.length > 0 &&
-                shouldOpenItem(props.item.id, props.lastItemIdToBeOpened) &&
-                // HACK: Wait for the second render because otherwise the scenario of
-                // popup inside popup throws an error (for example, hover of item with id '0_0').
-                !this.isFirstRender;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    MenuItemInternal.prototype.getPopupClassName = function () {
-        return classNames('k-menu-popup', { 'k-rtl': this.props.isDirectionRightToLeft });
-    };
-    MenuItemInternal.prototype.getMenuItemClassName = function (item) {
-        return classNames('k-item', 'k-menu-item', {
-            'k-first': isFirstItemFromSiblings(item.id),
-            'k-last': item.isLastFromSiblings,
-            'k-disabled': item.disabled
-        }, item.cssClass);
-    };
-    return MenuItemInternal;
-}(React.Component));
-export { MenuItemInternal };