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

package/dist/npm/breadcrumb/BreadcrumbDelimiter.js

@@ -10,7 +10,7 @@ var package_metadata_1 = require("../package-metadata");
  * Represents the BreadcrumbDelimiter component.
  */
 exports.BreadcrumbDelimiter = React.forwardRef(function (props, ref) {
-    kendo_licensing_1.validatePackage(package_metadata_1.packageMetadata);
+    (0, kendo_licensing_1.validatePackage)(package_metadata_1.packageMetadata);
     var target = React.useRef(null);
     var breadcrumbDelimiterRef = React.useRef(null);
     React.useImperativeHandle(target, function () { return ({
@@ -18,7 +18,7 @@ exports.BreadcrumbDelimiter = React.forwardRef(function (props, ref) {
         props: props
     }); });
     React.useImperativeHandle(ref, function () { return target.current; });
-    return (React.createElement("span", { ref: breadcrumbDelimiterRef, id: props.id, tabIndex: props.tabIndex, style: props.style, className: kendo_react_common_1.classNames('k-icon k-i-arrow-chevron-right k-breadcrumb-delimiter-icon', props.className) }));
+    return (React.createElement("span", { ref: breadcrumbDelimiterRef, id: props.id, tabIndex: props.tabIndex, style: props.style, className: (0, kendo_react_common_1.classNames)('k-icon k-i-arrow-chevron-right k-breadcrumb-delimiter-icon', props.className) }));
 });
 var propTypes = {
     id: PropTypes.string,
@@ -27,5 +27,4 @@ var propTypes = {
     tabIndex: PropTypes.number
 };
 exports.BreadcrumbDelimiter.displayName = 'KendoReactBreadcrumbDelimiter';
-// TODO: delete casting when @types/react is updated!
 exports.BreadcrumbDelimiter.propTypes = propTypes;

package/dist/npm/breadcrumb/BreadcrumbLink.d.ts

@@ -74,4 +74,4 @@ export interface BreadcrumbLinkHandle {
      */
     focus: () => void;
 }
-export declare const BreadcrumbLink: React.ForwardRefExoticComponent<BreadcrumbLinkProps & React.RefAttributes<BreadcrumbLinkHandle>>;
+export declare const BreadcrumbLink: React.ForwardRefExoticComponent<BreadcrumbLinkProps & React.RefAttributes<BreadcrumbLinkHandle | null>>;

package/dist/npm/breadcrumb/BreadcrumbLink.js

@@ -7,7 +7,7 @@ var kendo_licensing_1 = require("@progress/kendo-licensing");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var package_metadata_1 = require("../package-metadata");
 exports.BreadcrumbLink = React.forwardRef(function (props, ref) {
-    kendo_licensing_1.validatePackage(package_metadata_1.packageMetadata);
+    (0, kendo_licensing_1.validatePackage)(package_metadata_1.packageMetadata);
     var target = React.useRef(null);
     var linkRef = React.useRef(null);
     var focus = React.useCallback(function () {
@@ -23,20 +23,20 @@ exports.BreadcrumbLink = React.forwardRef(function (props, ref) {
     React.useImperativeHandle(ref, function () { return target.current; });
     var handleItemSelect = React.useCallback(function (event) {
         if (props.id) {
-            kendo_react_common_1.dispatchEvent(props.onItemSelect, event, event.target, { id: props.id });
+            (0, kendo_react_common_1.dispatchEvent)(props.onItemSelect, event, event.target, { id: props.id });
         }
     }, [props.onItemSelect]);
     var handleKeyDown = React.useCallback(function (event) {
         if (props.id) {
-            kendo_react_common_1.dispatchEvent(props.onKeyDown, event, event.target, { id: props.id });
+            (0, kendo_react_common_1.dispatchEvent)(props.onKeyDown, event, event.target, { id: props.id });
         }
     }, [props.onKeyDown]);
-    return (React.createElement("span", { "aria-current": props.ariaCurrent ? props.ariaCurrent : props.isLast, id: props.id, ref: linkRef, style: props.style, dir: kendo_react_common_1.useDir(linkRef, props.dir), tabIndex: kendo_react_common_1.getTabIndex(props.tabIndex, props.disabled), className: kendo_react_common_1.classNames('k-cursor-pointer k-flex-none k-breadcrumb-link k-breadcrumb-icontext-link', {
+    return (React.createElement("span", { "aria-current": props.ariaCurrent ? props.ariaCurrent : props.isLast, id: props.id, ref: linkRef, style: props.style, dir: (0, kendo_react_common_1.useDir)(linkRef, props.dir), tabIndex: (0, kendo_react_common_1.getTabIndex)(props.tabIndex, props.disabled), className: (0, kendo_react_common_1.classNames)('k-cursor-pointer k-flex-none k-breadcrumb-link k-breadcrumb-icontext-link', {
             'k-disabled': props.disabled
         }), onClick: handleItemSelect, onKeyDown: handleKeyDown },
         props.iconClass
             ?
-                React.createElement("span", { className: kendo_react_common_1.classNames('k-icon', props.iconClass) })
+                React.createElement("span", { className: (0, kendo_react_common_1.classNames)('k-icon', props.iconClass) })
             : props.icon ? props.icon : '',
         props.text));
 });

package/dist/npm/breadcrumb/BreadcrumbListItem.d.ts

@@ -40,4 +40,4 @@ export interface BreadcrumbListItemHandle {
 /**
  * Represents the BreadcrumbListItem component.
  */
-export declare const BreadcrumbListItem: React.ForwardRefExoticComponent<BreadcrumbListItemProps & React.RefAttributes<BreadcrumbListItemHandle>>;
+export declare const BreadcrumbListItem: React.ForwardRefExoticComponent<BreadcrumbListItemProps & React.RefAttributes<BreadcrumbListItemHandle | null>>;

package/dist/npm/breadcrumb/BreadcrumbListItem.js

@@ -10,7 +10,7 @@ var package_metadata_1 = require("../package-metadata");
  * Represents the BreadcrumbListItem component.
  */
 exports.BreadcrumbListItem = React.forwardRef(function (props, ref) {
-    kendo_licensing_1.validatePackage(package_metadata_1.packageMetadata);
+    (0, kendo_licensing_1.validatePackage)(package_metadata_1.packageMetadata);
     var target = React.useRef(null);
     var breadcrumbLIRef = React.useRef(null);
     var focus = React.useCallback(function () {
@@ -24,7 +24,7 @@ exports.BreadcrumbListItem = React.forwardRef(function (props, ref) {
         props: props
     }); });
     React.useImperativeHandle(ref, function () { return target.current; });
-    return (React.createElement("li", { ref: breadcrumbLIRef, id: props.id, style: props.style, className: kendo_react_common_1.classNames('k-flex-none k-breadcrumb-item', props.className) }, props.children));
+    return (React.createElement("li", { ref: breadcrumbLIRef, id: props.id, style: props.style, className: (0, kendo_react_common_1.classNames)('k-flex-none k-breadcrumb-item', props.className) }, props.children));
 });
 var propTypes = {
     id: PropTypes.string,
@@ -33,5 +33,4 @@ var propTypes = {
     style: PropTypes.object
 };
 exports.BreadcrumbListItem.displayName = 'KendoReactBreadcrumbListItem';
-// TODO: delete casting when @types/react is updated!
 exports.BreadcrumbListItem.propTypes = propTypes;

package/dist/npm/breadcrumb/BreadcrumbOrderedList.d.ts

@@ -48,4 +48,4 @@ export interface BreadcrumbOrderedListHandle {
 /**
  * Represents the BreadcrumbOrderedList component.
  */
-export declare const BreadcrumbOrderedList: React.ForwardRefExoticComponent<BreadcrumbOrderedListProps & React.RefAttributes<BreadcrumbOrderedListHandle>>;
+export declare const BreadcrumbOrderedList: React.ForwardRefExoticComponent<BreadcrumbOrderedListProps & React.RefAttributes<BreadcrumbOrderedListHandle | null>>;

package/dist/npm/breadcrumb/BreadcrumbOrderedList.js

@@ -10,7 +10,7 @@ var package_metadata_1 = require("../package-metadata");
  * Represents the BreadcrumbOrderedList component.
  */
 exports.BreadcrumbOrderedList = React.forwardRef(function (props, ref) {
-    kendo_licensing_1.validatePackage(package_metadata_1.packageMetadata);
+    (0, kendo_licensing_1.validatePackage)(package_metadata_1.packageMetadata);
     var target = React.useRef(null);
     var orderedListRef = React.useRef(null);
     React.useImperativeHandle(target, function () { return ({
@@ -18,7 +18,7 @@ exports.BreadcrumbOrderedList = React.forwardRef(function (props, ref) {
         props: props
     }); });
     React.useImperativeHandle(ref, function () { return target.current; });
-    return (React.createElement("ol", { id: props.id, ref: orderedListRef, style: props.style, dir: kendo_react_common_1.useDir(orderedListRef, props.dir), tabIndex: kendo_react_common_1.getTabIndex(props.tabIndex, props.disabled), className: kendo_react_common_1.classNames('k-breadcrumb-container k-flex-wrap', {
+    return (React.createElement("ol", { id: props.id, ref: orderedListRef, style: props.style, dir: (0, kendo_react_common_1.useDir)(orderedListRef, props.dir), tabIndex: (0, kendo_react_common_1.getTabIndex)(props.tabIndex, props.disabled), className: (0, kendo_react_common_1.classNames)('k-breadcrumb-container k-flex-wrap', {
             'k-disabled': props.disabled
         }, props.className) }, props.children));
 });
@@ -32,5 +32,4 @@ var propTypes = {
     disabled: PropTypes.bool
 };
 exports.BreadcrumbOrderedList.displayName = 'KendoReactBreadcrumbOrderedList';
-// TODO: delete casting when @types/react is updated!
 exports.BreadcrumbOrderedList.propTypes = propTypes;

package/dist/npm/card/Avatar.js

@@ -9,15 +9,15 @@ var kendo_react_common_2 = require("@progress/kendo-react-common");
 var package_metadata_1 = require("../package-metadata");
 var Avatar = function (props) {
     var _a;
-    kendo_react_common_2.validatePackage(package_metadata_1.packageMetadata);
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-avatar', (_a = {},
+    (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
+    return (React.createElement("div", { style: props.style, className: (0, kendo_react_common_1.classNames)('k-avatar', (_a = {},
             _a['k-avatar-bordered'] = props.border,
-            _a["k-rounded-" + (kendo_react_common_1.kendoThemeMaps.roundedMap[props.rounded] || props.rounded)] = props.rounded,
-            _a["k-avatar-" + (kendo_react_common_1.kendoThemeMaps.sizeMap[props.size] || props.size)] = props.size,
-            _a["k-avatar-" + props.fillMode] = props.fillMode,
-            _a["k-avatar-" + props.fillMode + "-" + props.themeColor] = Boolean(props.fillMode && props.themeColor),
+            _a["k-rounded-".concat(kendo_react_common_1.kendoThemeMaps.roundedMap[props.rounded] || props.rounded)] = props.rounded,
+            _a["k-avatar-".concat(kendo_react_common_1.kendoThemeMaps.sizeMap[props.size] || props.size)] = props.size,
+            _a["k-avatar-".concat(props.fillMode)] = props.fillMode,
+            _a["k-avatar-".concat(props.fillMode, "-").concat(props.themeColor)] = Boolean(props.fillMode && props.themeColor),
             _a), props.className) },
-        React.createElement("span", { className: "k-avatar-" + props.type }, props.children)));
+        React.createElement("span", { className: "k-avatar-".concat(props.type) }, props.children)));
 };
 exports.Avatar = Avatar;
 exports.Avatar.propTypes = {

package/dist/npm/card/Card.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
 import { CardProps } from './interfaces/CardProps';
 import { CardHandle } from './interfaces/CardHandle';
-export declare const Card: React.ForwardRefExoticComponent<Pick<CardProps, string | number> & React.RefAttributes<CardHandle>>;
+export declare const Card: React.ForwardRefExoticComponent<Pick<CardProps, keyof CardProps> & React.RefAttributes<CardHandle | null>>;

package/dist/npm/card/Card.js

@@ -32,7 +32,7 @@ var kendo_react_common_2 = require("@progress/kendo-react-common");
 var package_metadata_1 = require("../package-metadata");
 exports.Card = React.forwardRef(function (props, ref) {
     var _a;
-    kendo_react_common_2.validatePackage(package_metadata_1.packageMetadata);
+    (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
     var children = props.children, dir = props.dir, style = props.style, className = props.className, type = props.type, orientation = props.orientation, customProps = __rest(props, ["children", "dir", "style", "className", "type", "orientation"]);
     var target = React.useRef(null);
     var chipRef = React.useRef(null);
@@ -41,7 +41,7 @@ exports.Card = React.forwardRef(function (props, ref) {
         props: props
     }); });
     React.useImperativeHandle(ref, function () { return target.current; });
-    return (React.createElement("div", __assign({ dir: dir, style: style, ref: chipRef, className: kendo_react_common_1.classNames('k-card', className, (_a = {}, _a["k-card-" + type] = type !== Enums_1.cardType.DEFAULT, _a), orientation !== Enums_2.cardOrientation.HORIZONTAL ? 'k-card-vertical' : 'k-card-horizontal') }, customProps), children));
+    return (React.createElement("div", __assign({ dir: dir, style: style, ref: chipRef, className: (0, kendo_react_common_1.classNames)('k-card', className, (_a = {}, _a["k-card-".concat(type)] = type !== Enums_1.cardType.DEFAULT, _a), orientation !== Enums_2.cardOrientation.HORIZONTAL ? 'k-card-vertical' : 'k-card-horizontal') }, customProps), children));
 });
 exports.Card.displayName = 'KendoReactCard';
 exports.Card.propTypes = {

package/dist/npm/card/CardActions.js

@@ -6,7 +6,7 @@ var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var Enums_1 = require("./interfaces/Enums");
 var CardActions = function (props) {
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-card-actions', props.className, "k-card-actions-" + props.layout, props.orientation !== Enums_1.cardOrientation.VERTICAL ? 'k-card-actions-horizontal' : 'k-card-actions-vertical') }, props.children));
+    return (React.createElement("div", { style: props.style, className: (0, kendo_react_common_1.classNames)('k-card-actions', props.className, "k-card-actions-".concat(props.layout), props.orientation !== Enums_1.cardOrientation.VERTICAL ? 'k-card-actions-horizontal' : 'k-card-actions-vertical') }, props.children));
 };
 exports.CardActions = CardActions;
 exports.CardActions.propTypes = {

package/dist/npm/card/CardBody.js

@@ -5,7 +5,7 @@ var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var CardBody = function (props) {
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-card-body', props.className) }, props.children));
+    return (React.createElement("div", { style: props.style, className: (0, kendo_react_common_1.classNames)('k-card-body', props.className) }, props.children));
 };
 exports.CardBody = CardBody;
 exports.CardBody.propTypes = {

package/dist/npm/card/CardFooter.js

@@ -5,7 +5,7 @@ var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var CardFooter = function (props) {
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-card-footer', props.className) }, props.children));
+    return (React.createElement("div", { style: props.style, className: (0, kendo_react_common_1.classNames)('k-card-footer', props.className) }, props.children));
 };
 exports.CardFooter = CardFooter;
 exports.CardFooter.propTypes = {

package/dist/npm/card/CardHeader.js

@@ -5,7 +5,7 @@ var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var CardHeader = function (props) {
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-card-header', props.className) }, props.children));
+    return (React.createElement("div", { style: props.style, className: (0, kendo_react_common_1.classNames)('k-card-header', props.className) }, props.children));
 };
 exports.CardHeader = CardHeader;
 exports.CardHeader.propTypes = {

package/dist/npm/card/CardImage.js

@@ -5,7 +5,7 @@ var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var CardImage = function (props) {
-    return (React.createElement("img", { style: props.style, className: kendo_react_common_1.classNames('k-card-image', props.className), src: props.src }));
+    return (React.createElement("img", { style: props.style, className: (0, kendo_react_common_1.classNames)('k-card-image', props.className), src: props.src }));
 };
 exports.CardImage = CardImage;
 exports.CardImage.propTypes = {

package/dist/npm/card/CardSubtitle.js

@@ -5,7 +5,7 @@ var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var CardSubtitle = function (props) {
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-card-subtitle', props.className) }, props.children));
+    return (React.createElement("div", { style: props.style, className: (0, kendo_react_common_1.classNames)('k-card-subtitle', props.className) }, props.children));
 };
 exports.CardSubtitle = CardSubtitle;
 exports.CardSubtitle.propTypes = {

package/dist/npm/card/CardTitle.js

@@ -5,7 +5,7 @@ var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var CardTitle = function (props) {
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-card-title', props.className) }, props.children));
+    return (React.createElement("div", { style: props.style, className: (0, kendo_react_common_1.classNames)('k-card-title', props.className) }, props.children));
 };
 exports.CardTitle = CardTitle;
 exports.CardTitle.propTypes = {

package/dist/npm/drawer/Drawer.d.ts

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

package/dist/npm/drawer/Drawer.js

@@ -1,4 +1,5 @@
 "use strict";
+var _this = this;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Drawer = void 0;
 var React = require("react");
@@ -39,7 +40,7 @@ var package_metadata_1 = require("../package-metadata");
  * ```
  */
 exports.Drawer = React.forwardRef(function (props, target) {
-    kendo_react_common_2.validatePackage(package_metadata_1.packageMetadata);
+    (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
     var expanded = props.expanded, mode = props.mode, position = props.position, className = props.className, children = props.children, style = props.style, animation = props.animation, mini = props.mini, width = props.width, miniWidth = props.miniWidth, items = props.items, item = props.item, tabIndex = props.tabIndex, onOverlayClick = props.onOverlayClick, onSelect = props.onSelect;
     var elementRef = React.useRef(null);
     var focusElement = React.useCallback(function () {
@@ -51,16 +52,20 @@ exports.Drawer = React.forwardRef(function (props, target) {
         element: elementRef.current,
         focus: focusElement
     }); });
-    var handleSelect = React.useCallback(function (itemTarget, itemIndex) {
+    var handleSelect = React.useCallback(function (itemTarget, itemIndex, event) {
         if (items && onSelect) {
-            onSelect.call(undefined, {
+            var ev = {
                 itemTarget: itemTarget,
-                itemIndex: itemIndex
-            });
+                itemIndex: itemIndex,
+                syntheticEvent: event,
+                nativeEvent: event && event.nativeEvent,
+                target: _this
+            };
+            onSelect.call(undefined, ev);
         }
     }, [items, onSelect]);
-    var dir = kendo_react_common_1.useDir(elementRef, props.dir);
-    var drawerClassNames = kendo_react_common_1.classNames({
+    var dir = (0, kendo_react_common_1.useDir)(elementRef, props.dir);
+    var drawerClassNames = (0, kendo_react_common_1.classNames)({
         'k-drawer-container': true,
         'k-drawer-expanded': expanded,
         'k-drawer-overlay': mode === 'overlay',

package/dist/npm/drawer/DrawerContent.d.ts

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

package/dist/npm/drawer/DrawerContent.js

@@ -40,7 +40,7 @@ exports.DrawerContent = React.forwardRef(function (props, target) {
     React.useImperativeHandle(target, function () { return ({
         element: elementRef.current
     }); });
-    var contentClassNames = kendo_react_common_1.classNames({
+    var contentClassNames = (0, kendo_react_common_1.classNames)({
         'k-drawer-content': true
     }, className);
     return (React.createElement("div", { className: contentClassNames, style: style, ref: elementRef }, children));

package/dist/npm/drawer/DrawerItem.d.ts

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

package/dist/npm/drawer/DrawerItem.js

@@ -69,18 +69,18 @@ exports.DrawerItem = React.forwardRef(function (props, target) {
         focus: focusElement,
         props: props
     }); });
-    var itemClassNames = kendo_react_common_1.classNames('k-drawer-item', {
+    var itemClassNames = (0, kendo_react_common_1.classNames)('k-drawer-item', {
         'k-selected': selected,
         'k-disabled': disabled
     }, className);
-    var handleClick = React.useCallback(function () {
+    var handleClick = React.useCallback(function (event) {
         if (onSelect && !disabled) {
             var handle = {
                 element: elementRef.current,
                 focus: focusElement,
                 props: props
             };
-            onSelect(handle, index);
+            onSelect(handle, index, event);
         }
     }, [onSelect, index, disabled]);
     var drawerItemContent = (React.createElement(React.Fragment, null,
@@ -88,7 +88,7 @@ exports.DrawerItem = React.forwardRef(function (props, target) {
         !expanded && mini ? null : React.createElement("span", { className: 'k-item-text' }, text)));
     return (separator
         ? React.createElement("li", { className: 'k-drawer-item k-drawer-separator', role: "presentation" })
-        : (React.createElement("li", __assign({ ref: elementRef, className: itemClassNames, style: style, role: "option", "aria-selected": selected, "aria-disabled": disabled, onClick: handleClick, tabIndex: kendo_react_common_1.getTabIndex(tabIndex, disabled) }, others), !item ? drawerItemContent : children)));
+        : (React.createElement("li", __assign({ ref: elementRef, className: itemClassNames, style: style, role: "option", "aria-selected": selected, "aria-disabled": disabled, onClick: handleClick, tabIndex: (0, kendo_react_common_1.getTabIndex)(tabIndex, disabled) }, others), !item ? drawerItemContent : children)));
 });
 exports.DrawerItem.propTypes = {
     className: PropTypes.string,

package/dist/npm/drawer/DrawerNavigation.d.ts

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

package/dist/npm/drawer/DrawerNavigation.js

@@ -82,7 +82,7 @@ exports.DrawerNavigation = React.forwardRef(function (props, target) {
         element: elementRef.current,
         focus: focusElement
     }); });
-    var navigationClassNames = React.useMemo(function () { return 'k-widget k-drawer ' + kendo_react_common_1.classNames({
+    var navigationClassNames = React.useMemo(function () { return 'k-widget k-drawer ' + (0, kendo_react_common_1.classNames)({
         'k-drawer-start': position === 'start',
         'k-drawer-end': position === 'end'
     }, className); }, [position]);

package/dist/npm/drawer/context/DrawerContext.d.ts

@@ -14,7 +14,7 @@ export declare type DrawerContextType = {
     width?: number;
     miniWidth?: number;
     onOverlayClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
-    onSelect?: (target: any, idx: number) => void;
+    onSelect?: (target: any, idx: number, event: React.SyntheticEvent<HTMLElement>) => void;
 };
 /** @hidden */
 export declare const DrawerContext: React.Context<DrawerContextType>;

package/dist/npm/drawer/interfaces/DrawerItemProps.d.ts

@@ -52,5 +52,5 @@ export interface DrawerItemProps {
     /**
      * @hidden
      */
-    onSelect?(target?: any, idx?: number): void;
+    onSelect?(target?: any, idx?: number, event?: React.SyntheticEvent<Element>): void;
 }

package/dist/npm/expansionpanel/ExpansionPanel.d.ts

@@ -3,4 +3,4 @@ import { ExpansionPanelHandle, ExpansionPanelProps } from './interfaces';
 /**
  * Represents the [KendoReact ExpansionPanel component]({% slug overview_expansionpanel %}).
  */
-export declare const ExpansionPanel: React.ForwardRefExoticComponent<ExpansionPanelProps & React.RefAttributes<ExpansionPanelHandle>>;
+export declare const ExpansionPanel: React.ForwardRefExoticComponent<ExpansionPanelProps & React.RefAttributes<ExpansionPanelHandle | null>>;

package/dist/npm/expansionpanel/ExpansionPanel.js

@@ -10,18 +10,18 @@ var package_metadata_1 = require("../package-metadata");
  */
 exports.ExpansionPanel = React.forwardRef(function (props, target) {
     var _a;
-    kendo_react_common_1.validatePackage(package_metadata_1.packageMetadata);
+    (0, kendo_react_common_1.validatePackage)(package_metadata_1.packageMetadata);
     var elementRef = React.useRef(null);
     var _b = React.useState(false), focused = _b[0], setFocused = _b[1];
     var getImperativeHandle = React.useCallback(function () { return ({ element: elementRef.current }); }, []);
     React.useImperativeHandle(target, getImperativeHandle);
     var _c = props.expanded, expanded = _c === void 0 ? false : _c, disabled = props.disabled, title = props.title, subtitle = props.subtitle, onAction = props.onAction, expandIcon = props.expandIcon, collapseIcon = props.collapseIcon;
     var onClick = React.useCallback(function (event) {
-        kendo_react_common_1.dispatchEvent(onAction, event, getImperativeHandle(), { expanded: expanded });
+        (0, kendo_react_common_1.dispatchEvent)(onAction, event, getImperativeHandle(), { expanded: expanded });
     }, [onAction, expanded]);
     var onKeyDown = React.useCallback(function (event) {
         if (event.keyCode === kendo_react_common_1.Keys.enter || event.keyCode === kendo_react_common_1.Keys.space) {
-            kendo_react_common_1.dispatchEvent(onAction, event, getImperativeHandle(), { expanded: expanded });
+            (0, kendo_react_common_1.dispatchEvent)(onAction, event, getImperativeHandle(), { expanded: expanded });
         }
     }, [onAction, expanded]);
     var handleFocus = React.useCallback(function () {
@@ -36,18 +36,18 @@ exports.ExpansionPanel = React.forwardRef(function (props, target) {
         }
         setFocused(false);
     }, [props.disabled]);
-    var _d = kendo_react_common_1.useAsyncFocusBlur({ onFocus: handleFocus, onBlur: handleBlur }), onFocus = _d.onFocus, onBlur = _d.onBlur;
-    return (React.createElement("div", { ref: elementRef, className: kendo_react_common_1.classNames('k-expander', props.className, {
+    var _d = (0, kendo_react_common_1.useAsyncFocusBlur)({ onFocus: handleFocus, onBlur: handleBlur }), onFocus = _d.onFocus, onBlur = _d.onBlur;
+    return (React.createElement("div", { ref: elementRef, className: (0, kendo_react_common_1.classNames)('k-expander', props.className, {
             'k-expanded': expanded,
             'k-focus': focused && !disabled,
             'k-disabled': disabled
-        }), onFocus: onFocus, onBlur: onBlur, style: props.style, id: props.id, "aria-expanded": expanded, "aria-disabled": disabled, dir: kendo_react_common_1.useRtl(elementRef, props.dir), tabIndex: kendo_react_common_1.getTabIndex(props.tabIndex, disabled), onKeyDown: disabled ? undefined : onKeyDown },
+        }), onFocus: onFocus, onBlur: onBlur, style: props.style, id: props.id, "aria-expanded": expanded, "aria-disabled": disabled, dir: (0, kendo_react_common_1.useRtl)(elementRef, props.dir), tabIndex: (0, kendo_react_common_1.getTabIndex)(props.tabIndex, disabled), onKeyDown: disabled ? undefined : onKeyDown },
         React.createElement("div", { className: "k-expander-header", onClick: disabled ? undefined : onClick },
             title !== undefined ? React.createElement("div", { className: "k-expander-title" }, title) : undefined,
             React.createElement("span", { className: "k-spacer" }),
             subtitle !== undefined ? React.createElement("div", { className: "k-expander-sub-title" }, subtitle) : undefined,
             React.createElement("span", { className: "k-expander-indicator" },
-                React.createElement("span", { className: kendo_react_common_1.classNames((_a = {},
+                React.createElement("span", { className: (0, kendo_react_common_1.classNames)((_a = {},
                         // expand icon
                         _a[String(expandIcon)] = Boolean(!expanded && expandIcon),
                         _a['k-icon k-i-arrow-chevron-down'] = !expanded && !expandIcon,

package/dist/npm/expansionpanel/ExpansionPanelContent.js

@@ -18,7 +18,7 @@ var React = require("react");
  * Represents the KendoReact ExpansionPanelContent component.
  */
 exports.ExpansionPanelContent = React.forwardRef(function (props, ref) {
-    return (React.createElement("div", __assign({ ref: ref }, props, { className: kendo_react_common_1.classNames('k-expander-content-wrapper', props.className) }),
+    return (React.createElement("div", __assign({ ref: ref }, props, { className: (0, kendo_react_common_1.classNames)('k-expander-content-wrapper', props.className) }),
         React.createElement("div", { className: 'k-expander-content' }, props.children)));
 });
 exports.ExpansionPanelContent.displayName = 'KendoReactExpansionPanelContent';

package/dist/npm/expansionpanel/index.js

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

package/dist/npm/gridlayout/GridLayout.d.ts

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

package/dist/npm/gridlayout/GridLayout.js

@@ -44,17 +44,17 @@ var kendo_react_common_1 = require("@progress/kendo-react-common");
  * ```
  */
 exports.GridLayout = 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, gap = props.gap;
-    var layoutId = React.useMemo(function () { return kendo_react_common_1.guid(); }, []);
+    var layoutId = React.useMemo(function () { return (0, kendo_react_common_1.guid)(); }, []);
     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 gridLayoutClasses = React.useMemo(function () { return kendo_react_common_1.classNames('k-grid-layout', {
+    var gridLayoutClasses = React.useMemo(function () { return (0, kendo_react_common_1.classNames)('k-grid-layout', {
         'k-justify-items-start': hAlign === 'start',
         'k-justify-items-center': hAlign === 'center',
         'k-justify-items-end': hAlign === 'end',
@@ -65,10 +65,10 @@ exports.GridLayout = React.forwardRef(function (props, ref) {
         'k-align-items-stretch': vAlign === 'stretch'
     }, className); }, [hAlign, vAlign, className]);
     var gapStyle = gap
-        ? "" + (typeof gap.rows === 'number' ? gap.rows + 'px' : gap.rows) + ' ' + ("" + (typeof gap.cols === 'number' ? gap.cols + 'px' : gap.cols))
+        ? "".concat(typeof gap.rows === 'number' ? gap.rows + 'px' : gap.rows) + ' ' + "".concat(typeof gap.cols === 'number' ? gap.cols + 'px' : gap.cols)
         : undefined;
-    var gridTemplateRowsStyle = props.rows && props.rows.map(function (row) { return "" + (typeof row.height === 'number' ? row.height + 'px' : row.height); }).join(' ');
-    var gridTemplateColumnsStyle = props.cols && props.cols.map(function (col) { return "" + (typeof col.width === 'number' ? col.width + 'px' : col.width); }).join(' ');
+    var gridTemplateRowsStyle = props.rows && props.rows.map(function (row) { return "".concat(typeof row.height === 'number' ? row.height + 'px' : row.height); }).join(' ');
+    var gridTemplateColumnsStyle = props.cols && props.cols.map(function (col) { return "".concat(typeof col.width === 'number' ? col.width + 'px' : col.width); }).join(' ');
     var gridLayoutStyles = __assign({ gap: gapStyle, gridTemplateColumns: gridTemplateColumnsStyle, gridTemplateRows: gridTemplateRowsStyle }, style);
     return (React.createElement("div", { ref: elementRef, className: gridLayoutClasses, style: gridLayoutStyles, id: id || layoutId }, children));
 });

package/dist/npm/gridlayout/GridLayoutItem.d.ts

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

package/dist/npm/gridlayout/GridLayoutItem.js

@@ -43,15 +43,15 @@ var kendo_react_common_1 = require("@progress/kendo-react-common");
  * ```
  */
 exports.GridLayoutItem = 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, row = props.row, col = props.col, rowSpan = props.rowSpan, colSpan = props.colSpan;
-    var itemId = React.useMemo(function () { return kendo_react_common_1.guid(); }, []);
-    var gridLayoutItemStyles = __assign({ gridArea: (row || 'auto') + " / " + (col || 'auto') + " / " + (rowSpan ? 'span ' + rowSpan : 'auto') + " / " + (colSpan ? 'span ' + colSpan : 'auto') }, style);
+    var itemId = React.useMemo(function () { return (0, kendo_react_common_1.guid)(); }, []);
+    var gridLayoutItemStyles = __assign({ gridArea: "".concat(row || 'auto', " / ").concat(col || 'auto', " / ").concat(rowSpan ? 'span ' + rowSpan : 'auto', " / ").concat(colSpan ? 'span ' + colSpan : 'auto') }, style);
     return (React.createElement("div", { ref: elementRef, className: className, style: gridLayoutItemStyles, id: id || itemId }, children));
 });
 exports.GridLayoutItem.propTypes = {

package/dist/npm/main.js

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

package/dist/npm/menu/components/Menu.d.ts

@@ -38,7 +38,7 @@ export declare class Menu extends React.Component<MenuProps, MenuState> {
      */
     static propTypes: {
         vertical: PropTypes.Requireable<boolean>;
-        items: PropTypes.Requireable<object[]>;
+        items: PropTypes.Requireable<(object | null | undefined)[]>;
         style: PropTypes.Requireable<object>;
         dir: PropTypes.Requireable<string>;
         hoverOpenDelay: PropTypes.Requireable<number>;
@@ -46,7 +46,7 @@ export declare class Menu extends React.Component<MenuProps, MenuState> {
         openOnClick: PropTypes.Requireable<boolean>;
         itemRender: PropTypes.Requireable<any>;
         linkRender: PropTypes.Requireable<any>;
-        customCloseItemIds: PropTypes.Requireable<string[]>;
+        customCloseItemIds: PropTypes.Requireable<(string | null | undefined)[]>;
         onSelect: PropTypes.Requireable<(...args: any[]) => any>;
     };
     /**