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

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

@@ -77,7 +77,7 @@ var MenuItemInternal = /** @class */ (function (_super) {
         var item = this.props.item;
         var itemId = item.id;
         return (React.createElement(React.Fragment, null,
-            React.createElement("li", { 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 () { return _this.props.onBlur(itemId); }, 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 ? misc_1.getDOMElementId(this.props.menuGuid, itemId) : undefined, ref: function (el) { return _this.itemElement = el; }, key: "0" }, this.contentRender ? this.renderContent() : this.renderMenuItemLink()),
+            React.createElement("li", { 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 () { return _this.props.onBlur(itemId); }, 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 ? (0, misc_1.getDOMElementId)(this.props.menuGuid, itemId) : undefined, ref: function (el) { return _this.itemElement = el; }, key: "0" }, this.contentRender ? this.renderContent() : this.renderMenuItemLink()),
             this.renderPopupIfOpened()));
     };
     MenuItemInternal.prototype.renderContent = function () {
@@ -88,7 +88,7 @@ var MenuItemInternal = /** @class */ (function (_super) {
     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: misc_1.convertBoolDirectionToString(this.props.isDirectionRightToLeft) }));
+            return (React.createElement(this.linkRender, { item: this.props.onOriginalItemNeeded(item.id), itemId: item.id, opened: this.Opened, dir: (0, misc_1.convertBoolDirectionToString)(this.props.isDirectionRightToLeft) }));
         }
         else {
             var textOrItemRender = this.itemRender ?
@@ -103,7 +103,7 @@ var MenuItemInternal = /** @class */ (function (_super) {
     MenuItemInternal.prototype.renderPopupIfOpened = function () {
         if (this.Opened) {
             var itemId = this.props.item.id;
-            var _a = misc_1.getPopupSettings(itemId, this.props.isMenuVertical, this.props.isDirectionRightToLeft), anchorAlign = _a.anchorAlign, popupAlign = _a.popupAlign, collision = _a.collision;
+            var _a = (0, misc_1.getPopupSettings)(itemId, this.props.isMenuVertical, this.props.isDirectionRightToLeft), anchorAlign = _a.anchorAlign, popupAlign = _a.popupAlign, collision = _a.collision;
             return (React.createElement(kendo_react_popup_1.Popup, { anchor: this.itemElement, show: true, popupClass: this.getPopupClassName(), anchorAlign: anchorAlign, popupAlign: popupAlign, collision: collision, animate: false, key: "1" },
                 React.createElement(MenuItemInternalsList_1.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", 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 })));
         }
@@ -113,11 +113,11 @@ var MenuItemInternal = /** @class */ (function (_super) {
     };
     MenuItemInternal.prototype.renderMenuIconIfApplicable = function () {
         return this.props.item.icon ?
-            React.createElement("span", { className: "k-icon k-i-" + this.props.item.icon, role: "presentation", key: "0" }) : null;
+            React.createElement("span", { className: "k-icon k-i-".concat(this.props.item.icon), role: "presentation", key: "0" }) : null;
     };
     MenuItemInternal.prototype.renderArrowIfApplicable = function () {
         return this.props.item.items.length > 0 ?
-            (React.createElement(MenuItemArrow_1.MenuItemArrow, { itemId: this.props.item.id, verticalMenu: this.props.isMenuVertical, dir: misc_1.convertBoolDirectionToString(this.props.isDirectionRightToLeft), key: "2" })) : null;
+            (React.createElement(MenuItemArrow_1.MenuItemArrow, { itemId: this.props.item.id, verticalMenu: this.props.isMenuVertical, dir: (0, misc_1.convertBoolDirectionToString)(this.props.isDirectionRightToLeft), key: "2" })) : null;
     };
     Object.defineProperty(MenuItemInternal.prototype, "itemRender", {
         get: function () {
@@ -144,7 +144,7 @@ var MenuItemInternal = /** @class */ (function (_super) {
         get: function () {
             var props = this.props;
             return props.item.items.length > 0 &&
-                itemsIdsUtils_1.shouldOpenItem(props.item.id, props.lastItemIdToBeOpened) &&
+                (0, itemsIdsUtils_1.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;
@@ -153,11 +153,11 @@ var MenuItemInternal = /** @class */ (function (_super) {
         configurable: true
     });
     MenuItemInternal.prototype.getPopupClassName = function () {
-        return kendo_react_common_1.classNames('k-menu-popup', { 'k-rtl': this.props.isDirectionRightToLeft });
+        return (0, kendo_react_common_1.classNames)('k-menu-popup', { 'k-rtl': this.props.isDirectionRightToLeft });
     };
     MenuItemInternal.prototype.getMenuItemClassName = function (item) {
-        return kendo_react_common_1.classNames('k-item', 'k-menu-item', {
-            'k-first': itemsIdsUtils_1.isFirstItemFromSiblings(item.id),
+        return (0, kendo_react_common_1.classNames)('k-item', 'k-menu-item', {
+            'k-first': (0, itemsIdsUtils_1.isFirstItemFromSiblings)(item.id),
             'k-last': item.isLastFromSiblings,
             'k-disabled': item.disabled
         }, item.cssClass);

package/dist/npm/menu/components/MenuItemInternalsList.js

@@ -38,7 +38,7 @@ var MenuItemInternalsList = /** @class */ (function (_super) {
     }
     MenuItemInternalsList.prototype.render = function () {
         var parentItemId = this.props.parentItemId;
-        return (React.createElement("ul", { className: this.props.className, role: parentItemId !== undefined ? 'menu' : 'menubar', id: parentItemId !== undefined ? misc_1.getDOMElementId(this.props.menuGuid, parentItemId) : undefined, onMouseOver: parentItemId !== undefined ? this.onMouseOver : undefined, onMouseLeave: parentItemId !== undefined ? this.onMouseLeave : undefined, "aria-orientation": this.props['aria-orientation'] }, this.renderChildItems()));
+        return (React.createElement("ul", { className: this.props.className, role: parentItemId !== undefined ? 'menu' : 'menubar', id: parentItemId !== undefined ? (0, misc_1.getDOMElementId)(this.props.menuGuid, parentItemId) : undefined, onMouseOver: parentItemId !== undefined ? this.onMouseOver : undefined, onMouseLeave: parentItemId !== undefined ? this.onMouseLeave : undefined, "aria-orientation": this.props['aria-orientation'] }, this.renderChildItems()));
     };
     MenuItemInternalsList.prototype.renderChildItems = function () {
         var _this = this;

package/dist/npm/menu/components/MenuItemLink.js

@@ -32,11 +32,11 @@ var MenuItemLink = /** @class */ (function (_super) {
             return (React.createElement("a", { className: this.getMenuItemClassName(), role: "presentation", href: this.props.url, tabIndex: -1 }, this.props.children));
         }
         else {
-            return (React.createElement("span", { id: this.props.id, className: kendo_react_common_1.classNames(this.getMenuItemClassName(), this.props.className), style: this.props.style, role: "presentation" }, this.props.children));
+            return (React.createElement("span", { id: this.props.id, className: (0, kendo_react_common_1.classNames)(this.getMenuItemClassName(), this.props.className), style: this.props.style, role: "presentation" }, this.props.children));
         }
     };
     MenuItemLink.prototype.getMenuItemClassName = function () {
-        return kendo_react_common_1.classNames('k-link', 'k-menu-link', {
+        return (0, kendo_react_common_1.classNames)('k-link', 'k-menu-link', {
             'k-active': this.props.opened
         });
     };

package/dist/npm/menu/models/BaseMenuItem.d.ts

@@ -43,4 +43,8 @@ export interface BaseMenuItem {
      * Represents any additional data that is associated with the Menu item.
      */
     data?: any;
+    /**
+     * @hidden
+     */
+    children?: React.ReactNode;
 }

package/dist/npm/menu/utils/DirectionHolder.d.ts

@@ -5,7 +5,7 @@ export declare class DirectionHolder {
     private phase;
     private previousIsDirectionRightToLeft?;
     private isDirectionRightToLeft?;
-    getIsDirectionRightToLeft(): boolean;
+    getIsDirectionRightToLeft(): boolean | undefined;
     setIsDirectionRightToLeft(value: boolean): void;
     hasDirectionChanged(): boolean;
 }

package/dist/npm/menu/utils/MouseOverHandler.js

@@ -9,6 +9,7 @@ var MouseOverHandler = /** @class */ (function () {
         this.openOnClick = openOnClick;
         this.resetMenu = resetMenu;
         this.openItem = openItem;
+        this.mouseDown = false;
         this.openOnClick = openOnClick;
         this.isMouseOverEnabled = openOnClick ? false : true;
     }

package/dist/npm/menu/utils/getNewItemIdUponKeyboardNavigation.js

@@ -55,7 +55,7 @@ function getNewItemIdUponKeyboardNavigation(sourceItems, sourceItemId, keyCode,
             return getNextSiblingId();
         }
         else {
-            if (itemsIdsUtils_1.isIdZeroLevel(sourceItemId)) {
+            if ((0, itemsIdsUtils_1.isIdZeroLevel)(sourceItemId)) {
                 return getFirstChildIdForEnabledItemOrGetSameId();
             }
             else {
@@ -68,7 +68,7 @@ function getNewItemIdUponKeyboardNavigation(sourceItems, sourceItemId, keyCode,
             return getPrevSiblingId();
         }
         else {
-            if (itemsIdsUtils_1.isIdZeroLevel(sourceItemId)) {
+            if ((0, itemsIdsUtils_1.isIdZeroLevel)(sourceItemId)) {
                 return getLastChildIdForEnabledItemOrGetSameId();
             }
             else {
@@ -81,7 +81,7 @@ function getNewItemIdUponKeyboardNavigation(sourceItems, sourceItemId, keyCode,
             return sourceItemId;
         }
         else {
-            return hasChildren() ? itemsIdsUtils_1.getFirstChildId(sourceItemId) : itemsIdsUtils_1.getRootParentId(sourceItemId);
+            return hasChildren() ? (0, itemsIdsUtils_1.getFirstChildId)(sourceItemId) : (0, itemsIdsUtils_1.getRootParentId)(sourceItemId);
         }
     }
     function getIdUponHomeKey() {
@@ -92,12 +92,12 @@ function getNewItemIdUponKeyboardNavigation(sourceItems, sourceItemId, keyCode,
         return siblings[siblings.length - 1].id;
     }
     function getIdUponEscKey() {
-        return itemsIdsUtils_1.isIdZeroLevel(sourceItemId) ? sourceItemId : itemsIdsUtils_1.getDirectParentId(sourceItemId);
+        return (0, itemsIdsUtils_1.isIdZeroLevel)(sourceItemId) ? sourceItemId : (0, itemsIdsUtils_1.getDirectParentId)(sourceItemId);
     }
     function getIdUponSearchByChar() {
         var searchChar = key.toLowerCase();
         var siblings = getSiblings();
-        var currentItemIndex = Number(itemsIdsUtils_1.getShortId(sourceItemId));
+        var currentItemIndex = Number((0, itemsIdsUtils_1.getShortId)(sourceItemId));
         var itemsToSearch = siblings.slice(currentItemIndex + 1).concat(siblings.slice(0, currentItemIndex + 1));
         var matchedSibling = itemsToSearch.find(function (item) {
             return (item.text || '').toLowerCase().startsWith(searchChar);
@@ -106,37 +106,37 @@ function getNewItemIdUponKeyboardNavigation(sourceItems, sourceItemId, keyCode,
     }
     // #region Left Key Internals
     function getIdUponLeftKeyForHorizontalMenu() {
-        if (itemsIdsUtils_1.isIdZeroLevel(sourceItemId)) {
+        if ((0, itemsIdsUtils_1.isIdZeroLevel)(sourceItemId)) {
             return getPrevSiblingId();
         }
-        else if (itemsIdsUtils_1.isIdFirstLevel(sourceItemId)) {
-            return getFirstChildIdForEnabledItemOrGetSameId(getPrevSiblingId(itemsIdsUtils_1.getRootParentId(sourceItemId)));
+        else if ((0, itemsIdsUtils_1.isIdFirstLevel)(sourceItemId)) {
+            return getFirstChildIdForEnabledItemOrGetSameId(getPrevSiblingId((0, itemsIdsUtils_1.getRootParentId)(sourceItemId)));
         }
         else {
-            return itemsIdsUtils_1.getDirectParentId(sourceItemId);
+            return (0, itemsIdsUtils_1.getDirectParentId)(sourceItemId);
         }
     }
     function getIdUponLeftKeyForVerticalMenu() {
-        if (itemsIdsUtils_1.isIdZeroLevel(sourceItemId)) {
+        if ((0, itemsIdsUtils_1.isIdZeroLevel)(sourceItemId)) {
             return getLastChildIdForEnabledItemOrGetSameId();
         }
         else {
-            return itemsIdsUtils_1.getDirectParentId(sourceItemId);
+            return (0, itemsIdsUtils_1.getDirectParentId)(sourceItemId);
         }
     }
     // #endregion
     // #region Right Key Internals
     function getIdUponRightKeyForHorizontalMenu() {
-        if (itemsIdsUtils_1.isIdZeroLevel(sourceItemId)) {
+        if ((0, itemsIdsUtils_1.isIdZeroLevel)(sourceItemId)) {
             return getNextSiblingId();
         }
         else {
-            return getFirstChildIdForEnabledItemOrGetSameId(hasChildren() ? sourceItemId : getNextSiblingId(itemsIdsUtils_1.getRootParentId(sourceItemId)));
+            return getFirstChildIdForEnabledItemOrGetSameId(hasChildren() ? sourceItemId : getNextSiblingId((0, itemsIdsUtils_1.getRootParentId)(sourceItemId)));
         }
     }
     function getIdUponRightKeyForVerticalMenu() {
-        return getFirstChildIdForEnabledItemOrGetSameId(itemsIdsUtils_1.isIdZeroLevel(sourceItemId) || hasChildren() ?
-            sourceItemId : getNextSiblingId(itemsIdsUtils_1.getRootParentId(sourceItemId)));
+        return getFirstChildIdForEnabledItemOrGetSameId((0, itemsIdsUtils_1.isIdZeroLevel)(sourceItemId) || hasChildren() ?
+            sourceItemId : getNextSiblingId((0, itemsIdsUtils_1.getRootParentId)(sourceItemId)));
     }
     // #endregion
     // #region Utils
@@ -156,7 +156,7 @@ function getNewItemIdUponKeyboardNavigation(sourceItems, sourceItemId, keyCode,
         if (items === undefined) {
             items = sourceItems;
         }
-        return itemsIdsUtils_1.getItemById(itemId, items);
+        return (0, itemsIdsUtils_1.getItemById)(itemId, items);
     }
     function hasChildren(itemId) {
         return getItemById(itemId).items.length > 0;
@@ -172,8 +172,8 @@ function getNewItemIdUponKeyboardNavigation(sourceItems, sourceItemId, keyCode,
         return itemChildren[itemChildren.length - 1].id;
     }
     function getSiblings() {
-        return itemsIdsUtils_1.isIdZeroLevel(sourceItemId) ?
-            sourceItems : getItemById(itemsIdsUtils_1.getDirectParentId(sourceItemId), sourceItems).items;
+        return (0, itemsIdsUtils_1.isIdZeroLevel)(sourceItemId) ?
+            sourceItems : getItemById((0, itemsIdsUtils_1.getDirectParentId)(sourceItemId), sourceItems).items;
     }
     function getFirstOrLastChildIdForEnabledItemOrGetSameId(getFirstChild, itemId) {
         if (itemId === undefined) {
@@ -181,7 +181,7 @@ function getNewItemIdUponKeyboardNavigation(sourceItems, sourceItemId, keyCode,
         }
         var item = getItemById(itemId);
         if (hasChildren(itemId) && !item.disabled) {
-            return getFirstChild ? itemsIdsUtils_1.getFirstChildId(itemId) : getLastChildId(itemId);
+            return getFirstChild ? (0, itemsIdsUtils_1.getFirstChildId)(itemId) : getLastChildId(itemId);
         }
         else {
             return itemId;
@@ -191,14 +191,14 @@ function getNewItemIdUponKeyboardNavigation(sourceItems, sourceItemId, keyCode,
         if (itemId === undefined) {
             itemId = sourceItemId;
         }
-        if (itemsIdsUtils_1.isIdZeroLevel(itemId)) {
-            return itemsIdsUtils_1.getDirectSiblingIdForLevelZero(next, itemId, sourceItems.length);
+        if ((0, itemsIdsUtils_1.isIdZeroLevel)(itemId)) {
+            return (0, itemsIdsUtils_1.getDirectSiblingIdForLevelZero)(next, itemId, sourceItems.length);
         }
         else {
-            var directParentId = itemsIdsUtils_1.getDirectParentId(itemId);
-            var shortId = itemsIdsUtils_1.getShortId(itemId);
+            var directParentId = (0, itemsIdsUtils_1.getDirectParentId)(itemId);
+            var shortId = (0, itemsIdsUtils_1.getShortId)(itemId);
             var siblingsCount = getItemById(directParentId).items.length;
-            return itemsIdsUtils_1.createId(itemsIdsUtils_1.getDirectSiblingIdForLevelZero(next, shortId, siblingsCount), directParentId);
+            return (0, itemsIdsUtils_1.createId)((0, itemsIdsUtils_1.getDirectSiblingIdForLevelZero)(next, shortId, siblingsCount), directParentId);
         }
     }
     // #endregion

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

@@ -20,7 +20,7 @@ exports.getPopupSettings = getPopupSettings;
  * @hidden
  */
 function getChildrenPosition(itemId, isMenuVertical, isDirectionRightToLeft) {
-    if (itemsIdsUtils_1.isIdZeroLevel(itemId)) {
+    if ((0, itemsIdsUtils_1.isIdZeroLevel)(itemId)) {
         if (isMenuVertical) {
             return isDirectionRightToLeft ? 'leftward' : 'rightward';
         }
@@ -44,6 +44,6 @@ exports.convertBoolDirectionToString = convertBoolDirectionToString;
  * @hidden
  */
 function getDOMElementId(menuGuid, itemId) {
-    return menuGuid + "_" + itemId;
+    return "".concat(menuGuid, "_").concat(itemId);
 }
 exports.getDOMElementId = getDOMElementId;

package/dist/npm/menu/utils/prepareInputItemsForInternalWork.js

@@ -80,7 +80,7 @@ function convertInputModelsToInternalOnesHelper(inputModels, parentId) {
     for (var index = 0; index < inputModels.length; index++) {
         var inputModel = inputModels[index];
         var internalModel = copyInputItemWithoutChildren(inputModel);
-        internalModel.id = itemsIdsUtils_1.createId(index.toString(), parentId);
+        internalModel.id = (0, itemsIdsUtils_1.createId)(index.toString(), parentId);
         internalModel.isLastFromSiblings = index === inputModels.length - 1;
         internalModel.items = copyOrCreateModelChildren(inputModel, internalModel);
         result.push(internalModel);
@@ -91,7 +91,7 @@ function copyOrCreateModelChildren(inputModel, internalModel) {
     if (inputModel.contentRender) {
         return [{
                 contentParentItemId: internalModel.id,
-                id: itemsIdsUtils_1.createId(itemsIdsUtils_1.ZERO_LEVEL_ZERO_ITEM_ID, internalModel.id),
+                id: (0, itemsIdsUtils_1.createId)(itemsIdsUtils_1.ZERO_LEVEL_ZERO_ITEM_ID, internalModel.id),
                 isLastFromSiblings: true,
                 contentRender: inputModel.contentRender,
                 items: []

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-react-layout',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1653648336,
+    publishDate: 1654509261,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
 };

package/dist/npm/panelbar/PanelBar.d.ts

@@ -18,10 +18,10 @@ export declare class PanelBar extends React.Component<PanelBarProps, PanelBarSta
      */
     static propTypes: {
         animation: PropTypes.Requireable<boolean>;
-        children: (props: PanelBarProps, propName: any) => Error;
+        children: (props: PanelBarProps, propName: any) => Error | null | undefined;
         dir: PropTypes.Requireable<string>;
         selected: PropTypes.Requireable<string>;
-        expanded: PropTypes.Requireable<string[]>;
+        expanded: PropTypes.Requireable<(string | null)[]>;
         focused: PropTypes.Requireable<string>;
         expandMode: PropTypes.Requireable<string>;
         className: PropTypes.Requireable<string>;

package/dist/npm/panelbar/PanelBar.js

@@ -25,10 +25,14 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PanelBar = void 0;
@@ -56,7 +60,7 @@ var PanelBar = /** @class */ (function (_super) {
          * @hidden
          */
         _this.onSelect = function (event) {
-            var flattenChildren = util_1.flatChildren(React.Children.toArray(_this.children));
+            var flattenChildren = (0, util_1.flatChildren)(React.Children.toArray(_this.children));
             var selectedChild;
             var newExpanded;
             flattenChildren.forEach(function (child) {
@@ -66,10 +70,10 @@ var PanelBar = /** @class */ (function (_super) {
             });
             switch (_this.expandMode) {
                 case 'single':
-                    newExpanded = __spreadArray(__spreadArray([], selectedChild.props.parentUniquePrivateKey), [selectedChild.props.uniquePrivateKey]);
-                    if (util_1.isArrayEqual(_this.expandedItems, newExpanded)) {
+                    newExpanded = __spreadArray(__spreadArray([], selectedChild.props.parentUniquePrivateKey, true), [selectedChild.props.uniquePrivateKey], false);
+                    if ((0, util_1.isArrayEqual)(_this.expandedItems, newExpanded)) {
                         if (selectedChild.props.parentUniquePrivateKey) {
-                            newExpanded = __spreadArray([], selectedChild.props.parentUniquePrivateKey);
+                            newExpanded = __spreadArray([], selectedChild.props.parentUniquePrivateKey, true);
                         }
                         else {
                             newExpanded = [];
@@ -98,7 +102,7 @@ var PanelBar = /** @class */ (function (_super) {
          */
         _this.onFocus = function (event, step) {
             if (step === void 0) { step = 0; }
-            var flattenChildren = util_1.flatVisibleChildren(React.Children.toArray(_this.children));
+            var flattenChildren = (0, util_1.flatVisibleChildren)(React.Children.toArray(_this.children));
             var focusedChild;
             flattenChildren.forEach(function (child, ixd) {
                 if (child.props.uniquePrivateKey === (event.uniquePrivateKey || _this.state.focused)) {
@@ -178,10 +182,10 @@ var PanelBar = /** @class */ (function (_super) {
                 }
             }
         };
-        kendo_react_common_2.validatePackage(package_metadata_1.packageMetadata);
-        var initialState = util_1.getInitialState(props, _this.expandMode);
+        (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
+        var initialState = (0, util_1.getInitialState)(props, _this.expandMode);
         if (!initialState.focused) {
-            initialState.focused = util_1.getFirstId(props);
+            initialState.focused = (0, util_1.getFirstId)(props);
         }
         _this.state = initialState;
         return _this;
@@ -220,7 +224,7 @@ var PanelBar = /** @class */ (function (_super) {
                 handleSelect: this.handleSelect,
                 children: this.props.children
             };
-            return util_1.renderChildren(renderState);
+            return (0, util_1.renderChildren)(renderState);
         },
         enumerable: false,
         configurable: true
@@ -233,7 +237,7 @@ var PanelBar = /** @class */ (function (_super) {
         var ariaProps = {
             'aria-activedescendant': this.activeDescendant
         };
-        var className = kendo_react_common_1.classNames('k-panelbar', this.props.className);
+        var className = (0, kendo_react_common_1.classNames)('k-panelbar', this.props.className);
         return (React.createElement("ul", __assign({ ref: function (div) { _this._element = div; }, dir: this.props.dir, role: 'tree', tabIndex: 0, onKeyDown: this.handleKeyDown, onFocus: this.handleWrapperFocus, onBlur: this.handleWrapperBlur, className: className, style: this.props.style }, ariaProps), this.children));
     };
     PanelBar.prototype.nextTick = function (f) {

package/dist/npm/panelbar/PanelBarItem.js

@@ -40,7 +40,7 @@ function iconElement(_a) {
         return (React.createElement("img", { role: "presentation", className: 'k-panelbar-item-icon k-image', src: imageUrl }));
     }
     else if (icon) {
-        var iconClasses = kendo_react_common_1.classNames('k-panelbar-item-icon', 'k-icon', 'k-i-' + icon);
+        var iconClasses = (0, kendo_react_common_1.classNames)('k-panelbar-item-icon', 'k-icon', 'k-i-' + icon);
         return (React.createElement("span", { role: "presentation", className: iconClasses }));
     }
     else if (iconClass) {
@@ -87,17 +87,17 @@ var PanelBarItem = /** @class */ (function (_super) {
             'aria-selected': !disabled && selected,
             'aria-expanded': !disabled && expanded && !!children
         };
-        var panelBarItemClassName = kendo_react_common_1.classNames('k-item', {
+        var panelBarItemClassName = (0, kendo_react_common_1.classNames)('k-item', {
             'k-panelbar-header': level === 0,
             'k-panelbar-item': level !== 0,
             'k-state-expanded': expanded && !!children
-        }, "k-level-" + level, className);
-        var panelBarLinkClassName = kendo_react_common_1.classNames('k-link', {
+        }, "k-level-".concat(level), className);
+        var panelBarLinkClassName = (0, kendo_react_common_1.classNames)('k-link', {
             'k-selected': !disabled && selected,
             'k-focus': !disabled && focused,
             'k-disabled': disabled
         }, headerClassName);
-        var panelBarItemArrowClassName = kendo_react_common_1.classNames('k-panelbar-toggle', 'k-icon', (_a = {},
+        var panelBarItemArrowClassName = (0, kendo_react_common_1.classNames)('k-panelbar-toggle', 'k-icon', (_a = {},
             _a['k-i-arrow-chevron-up'] = expanded && !!children,
             _a['k-panelbar-collapse'] = expanded && !!children,
             _a['k-i-arrow-chevron-down'] = !expanded && !!children,

package/dist/npm/panelbar/util.js

@@ -10,10 +10,14 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.isArrayEqual = exports.PanelBarUtils = exports.isPresent = exports.flatVisibleChildren = exports.flatChildren = exports.flatVisibleItems = exports.getInitialState = exports.getFirstId = exports.renderChildren = void 0;
@@ -38,11 +42,11 @@ var renderChildren = function (_a) {
                     children: child.props.children,
                     parentExpanded: (expanded || []).indexOf(privateKey) > -1,
                     level: level + 1,
-                    parentPrivateKey: __spreadArray(__spreadArray([], parentPrivateKey), [privateKey])
+                    parentPrivateKey: __spreadArray(__spreadArray([], parentPrivateKey, true), [privateKey], false)
                 };
-                nestedChildren = exports.renderChildren(renderState);
+                nestedChildren = (0, exports.renderChildren)(renderState);
             }
-            return React.cloneElement(child, __assign(__assign({}, child.props), { animation: child.props.animation !== undefined ? child.props.animation : animation, keepItemsMounted: keepItemsMounted, id: child.props.id || "k-panelbar-item-default-" + privateKey, uniquePrivateKey: privateKey, parentUniquePrivateKey: parentPrivateKey, parentExpanded: parentExpanded, level: level, expanded: (expanded || []).indexOf(privateKey) > -1, focused: state.focused === privateKey && state.wrapperFocused, selected: state.selected === privateKey, children: nestedChildren, onSelect: handleSelect }));
+            return React.cloneElement(child, __assign(__assign({}, child.props), { animation: child.props.animation !== undefined ? child.props.animation : animation, keepItemsMounted: keepItemsMounted, id: child.props.id || "k-panelbar-item-default-".concat(privateKey), uniquePrivateKey: privateKey, parentUniquePrivateKey: parentPrivateKey, parentExpanded: parentExpanded, level: level, expanded: (expanded || []).indexOf(privateKey) > -1, focused: state.focused === privateKey && state.wrapperFocused, selected: state.selected === privateKey, children: nestedChildren, onSelect: handleSelect }));
         }
         else {
             return React.createElement("div", { className: "k-panelbar-content k-content" }, child);
@@ -92,7 +96,7 @@ var getInitialState = function (props, expandMode, result, parentExpanded, paren
                     }
                 }
                 if (child.props.children) {
-                    result = exports.getInitialState(child.props, expandMode, result, !!child.props.expanded, __spreadArray(__spreadArray([], parentPrivateKey), [privateKey]));
+                    result = (0, exports.getInitialState)(child.props, expandMode, result, !!child.props.expanded, __spreadArray(__spreadArray([], parentPrivateKey, true), [privateKey], false));
                 }
             }
         }
@@ -107,8 +111,8 @@ var getId = function (child, parentPrivateKey, idx) {
     return child && child.props && child.props.id
         ? child.props.id
         : parentPrivateKey.length
-            ? parentPrivateKey[parentPrivateKey.length - 1] + ("." + idx)
-            : "." + idx;
+            ? parentPrivateKey[parentPrivateKey.length - 1] + ".".concat(idx)
+            : ".".concat(idx);
 };
 /**
  * @hidden

package/dist/npm/splitter/Splitter.js

@@ -89,6 +89,7 @@ var Splitter = /** @class */ (function (_super) {
      */
     function Splitter(props) {
         var _this = _super.call(this, props) || this;
+        _this._container = null;
         _this.validatePanes = function (panesOptions) {
             var withoutSize = panesOptions.filter(function (pane) { return pane.size === undefined; });
             if (!withoutSize.length) {
@@ -204,15 +205,15 @@ var Splitter = /** @class */ (function (_super) {
         _this.elementSize = function (el, isContainer) {
             var sizeType = isContainer ? 'client' : 'offset';
             if (_this.orientation === 'vertical') {
-                return el[sizeType + "Height"];
+                return el["".concat(sizeType, "Height")];
             }
             else {
-                return el[sizeType + "Width"];
+                return el["".concat(sizeType, "Width")];
             }
         };
         _this.clamp = function (min, max, v) { return Math.min(max, Math.max(min, v)); };
         _this.fixedSize = function (size) { return size && size.length > 0; };
-        kendo_react_common_2.validatePackage(package_metadata_1.packageMetadata);
+        (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
         _this.state = {
             isDragging: false,
             dragIndex: undefined,
@@ -269,7 +270,7 @@ var Splitter = /** @class */ (function (_super) {
         var _this = this;
         var panesContent = this.panesContent;
         var panesOptions = this.panesOptions(panesContent);
-        var className = kendo_react_common_1.classNames('k-widget', 'k-splitter', 'k-splitter-flex', "k-splitter-" + this.orientation, this.props.className);
+        var className = (0, kendo_react_common_1.classNames)('k-widget', 'k-splitter', 'k-splitter-flex', "k-splitter-".concat(this.orientation), this.props.className);
         this.validatePanes(panesOptions);
         return (React.createElement("div", { style: this.props.style, ref: function (ref) { return _this._container = ref; }, className: className }, this.mapSplitterPanes(panesOptions, panesContent)));
     };

package/dist/npm/splitter/SplitterBar.js

@@ -25,6 +25,7 @@ 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;
@@ -100,7 +101,7 @@ var SplitterBar = /** @class */ (function (_super) {
             var prev = _this.props.prev;
             var isCollapsible = prev.collapsible;
             var isCollapsed = prev.collapsed;
-            return kendo_react_common_1.classNames('k-icon', (_a = {},
+            return (0, kendo_react_common_1.classNames)('k-icon', (_a = {},
                 _a['k-hidden'] = !isCollapsible,
                 _a['k-collapse-prev'] = isCollapsible,
                 _a['k-i-arrow-60-left'] = isCollapsible && isHorizontal && !isCollapsed,
@@ -114,7 +115,7 @@ var SplitterBar = /** @class */ (function (_super) {
             var next = _this.props.next;
             var isCollapsible = next.collapsible;
             var isCollapsed = next.collapsed;
-            return kendo_react_common_1.classNames('k-icon', (_a = {},
+            return (0, kendo_react_common_1.classNames)('k-icon', (_a = {},
                 _a['k-hidden'] = !isCollapsible,
                 _a['k-collapse-next'] = isCollapsible,
                 _a['k-i-arrow-60-right'] = isCollapsible && isHorizontal && !isCollapsed,
@@ -161,7 +162,7 @@ var SplitterBar = /** @class */ (function (_super) {
         var isDraggable = this.isDraggable;
         var isStatic = this.isStatic;
         var isHorizontal = this.isHorizontal;
-        var barClasses = kendo_react_common_1.classNames('k-splitbar', (_a = {},
+        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,

package/dist/npm/splitter/SplitterPane.js

@@ -33,7 +33,7 @@ var SplitterPane = /** @class */ (function (_super) {
         var style = {
             flexBasis: size
         };
-        var paneClasses = kendo_react_common_1.classNames('k-pane', (_a = {},
+        var paneClasses = (0, kendo_react_common_1.classNames)('k-pane', (_a = {},
             _a['k-state-hidden'] = collapsed,
             _a['hidden'] = collapsed,
             _a['k-pane-flex'] = containsSplitter,

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

@@ -34,4 +34,4 @@ export interface StackLayoutHandle {
  *    ReactDOM.render(<App />, document.querySelector('my-app'));
  * ```
  */
-export declare const StackLayout: React.ForwardRefExoticComponent<StackLayoutProps & React.RefAttributes<StackLayoutHandle>>;
+export declare const StackLayout: React.ForwardRefExoticComponent<StackLayoutProps & React.RefAttributes<StackLayoutHandle | null>>;

package/dist/npm/stacklayout/StackLayout.js

@@ -42,19 +42,19 @@ var kendo_react_common_1 = require("@progress/kendo-react-common");
  * ```
  */
 exports.StackLayout = React.forwardRef(function (props, ref) {
-    kendo_licensing_1.validatePackage(package_metadata_1.packageMetadata);
+    (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 kendo_react_common_1.guid(); }, []);
+    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 kendo_react_common_1.classNames('k-stack-layout', {
+    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',
@@ -66,7 +66,7 @@ exports.StackLayout = React.forwardRef(function (props, ref) {
         '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: "" + (typeof props.gap === 'number' ? props.gap + 'px' : props.gap) }, style);
+    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 = {

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

@@ -20,4 +20,4 @@ import { StepProps } from './interfaces/StepProps';
  *    ReactDOM.render(<App />, document.querySelector('my-app'));
  * ```
  */
-export declare const Step: React.ForwardRefExoticComponent<Pick<StepProps, string | number> & React.RefAttributes<StepHandle>>;
+export declare const Step: React.ForwardRefExoticComponent<Pick<StepProps, keyof StepProps> & React.RefAttributes<StepHandle | null>>;