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

package/dist/npm/appbar/AppBarSection.d.ts

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

package/dist/npm/appbar/AppBarSection.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppBarSection = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
@@ -41,7 +42,7 @@ exports.AppBarSection = React.forwardRef(function (props, target) {
     var elementRef = React.useRef(null);
     var focusElement = React.useCallback(function () {
         if (elementRef.current) {
-            kendo_react_common_1.focusFirstFocusableChild(elementRef.current);
+            (0, kendo_react_common_1.focusFirstFocusableChild)(elementRef.current);
         }
     }, []);
     var getImperativeHandle = React.useCallback(function () { return ({
@@ -49,7 +50,7 @@ exports.AppBarSection = React.forwardRef(function (props, target) {
         focus: focusElement
     }); }, [focusElement]);
     React.useImperativeHandle(target, getImperativeHandle);
-    var sectionClasses = React.useMemo(function () { return kendo_react_common_1.classNames('k-appbar-section', className); }, [className]);
+    var sectionClasses = React.useMemo(function () { return (0, kendo_react_common_1.classNames)('k-appbar-section', className); }, [className]);
     return (React.createElement("div", { className: sectionClasses, style: style }, children));
 });
 exports.AppBarSection.propTypes = {

package/dist/npm/appbar/AppBarSpacer.d.ts

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

package/dist/npm/appbar/AppBarSpacer.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppBarSpacer = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
@@ -42,7 +43,7 @@ exports.AppBarSpacer = React.forwardRef(function (props, target) {
     var elementRef = React.useRef(null);
     var focusElement = React.useCallback(function () {
         if (elementRef.current) {
-            kendo_react_common_1.focusFirstFocusableChild(elementRef.current);
+            (0, kendo_react_common_1.focusFirstFocusableChild)(elementRef.current);
         }
     }, []);
     var getImperativeHandle = React.useCallback(function () { return ({
@@ -50,7 +51,7 @@ exports.AppBarSpacer = React.forwardRef(function (props, target) {
         focus: focusElement
     }); }, [focusElement]);
     React.useImperativeHandle(target, getImperativeHandle);
-    var spacerClasses = React.useMemo(function () { return kendo_react_common_1.classNames('k-appbar-spacer', {
+    var spacerClasses = React.useMemo(function () { return (0, kendo_react_common_1.classNames)('k-appbar-spacer', {
         'k-appbar-spacer-sized': style && style.width && style.width !== null
     }, className); }, [className, style]);
     var spacerStyles = React.useMemo(function () {

package/dist/npm/appbar/interfaces/AppBarSpacerProps.d.ts

@@ -12,4 +12,8 @@ export interface AppBarSpacerProps {
      * Sets additional CSS styles to the AppBarSpacer.
      */
     style?: React.CSSProperties;
+    /**
+     * Determines the children nodes.
+     */
+    children?: React.ReactNode;
 }

package/dist/npm/bottomnavigation/BottomNavigation.d.ts

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

package/dist/npm/bottomnavigation/BottomNavigation.js

@@ -11,6 +11,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.BottomNavigation = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
@@ -40,11 +41,11 @@ var BottomNavigationItem_1 = require("./BottomNavigationItem");
  * ```
  */
 exports.BottomNavigation = React.forwardRef(function (props, ref) {
-    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 focusElement = React.useCallback(function () {
         if (elementRef.current) {
-            kendo_react_common_2.focusFirstFocusableChild(elementRef.current);
+            (0, kendo_react_common_2.focusFirstFocusableChild)(elementRef.current);
         }
     }, []);
     var getImperativeHandle = React.useCallback(function () { return ({
@@ -53,9 +54,9 @@ exports.BottomNavigation = React.forwardRef(function (props, ref) {
     }); }, [focusElement]);
     React.useImperativeHandle(ref, getImperativeHandle);
     var _a = props.themeColor, themeColor = _a === void 0 ? defaultProps.themeColor : _a, _b = props.fill, fill = _b === void 0 ? defaultProps.fill : _b, _c = props.positionMode, positionMode = _c === void 0 ? defaultProps.positionMode : _c, _d = props.itemFlow, itemFlow = _d === void 0 ? defaultProps.itemFlow : _d, _e = props.border, border = _e === void 0 ? defaultProps.border : _e, className = props.className, items = props.items, item = props.item, itemRender = props.itemRender, disabled = props.disabled, style = props.style, id = props.id, onSelect = props.onSelect, onKeyDown = props.onKeyDown;
-    var navId = React.useMemo(function () { return kendo_react_common_2.guid(); }, []);
-    var dir = kendo_react_common_2.useDir(elementRef, props.dir);
-    var navClasses = React.useMemo(function () { return kendo_react_common_2.classNames('k-bottom-nav', utils_1.POSITION_MODE_CLASSES[positionMode], utils_1.THEME_COLOR_CLASSES[themeColor], utils_1.FILL_CLASSES[fill], utils_1.ITEM_FLOW_CLASSES[itemFlow], {
+    var navId = React.useMemo(function () { return (0, kendo_react_common_2.guid)(); }, []);
+    var dir = (0, kendo_react_common_2.useDir)(elementRef, props.dir);
+    var navClasses = React.useMemo(function () { return (0, kendo_react_common_2.classNames)('k-bottom-nav', utils_1.POSITION_MODE_CLASSES[positionMode], utils_1.THEME_COLOR_CLASSES[themeColor], utils_1.FILL_CLASSES[fill], utils_1.ITEM_FLOW_CLASSES[itemFlow], {
         'k-bottom-nav-border': border,
         'k-disabled': disabled
     }, className); }, [positionMode, themeColor, fill, itemFlow, border, disabled, className]);
@@ -64,7 +65,7 @@ exports.BottomNavigation = React.forwardRef(function (props, ref) {
             return;
         }
         if (!items[index].disabled && onSelect) {
-            kendo_react_common_2.dispatchEvent(onSelect, dispatchedEvent, getImperativeHandle(), {
+            (0, kendo_react_common_2.dispatchEvent)(onSelect, dispatchedEvent, getImperativeHandle(), {
                 itemTarget: items[index],
                 itemIndex: index
             });
@@ -83,10 +84,10 @@ exports.BottomNavigation = React.forwardRef(function (props, ref) {
             default:
                 break;
         }
-        kendo_react_common_2.dispatchEvent(onKeyDown, event, getImperativeHandle(), undefined);
+        (0, kendo_react_common_2.dispatchEvent)(onKeyDown, event, getImperativeHandle(), undefined);
     }, [dispatchSelectEvent, onKeyDown]);
     return (React.createElement("nav", { ref: elementRef, className: navClasses, style: style, id: id || navId, dir: dir }, items && (items.map(function (element, index) {
-        return (React.createElement(BottomNavigationItem_1.BottomNavigationItem, __assign({}, element, { key: index, index: index, id: (id || navId) + "-" + index, disabled: disabled || element.disabled, selected: element.selected, dataItem: element, item: item, render: itemRender, onSelect: handleSelect, onKeyDown: handleKeyDown })));
+        return (React.createElement(BottomNavigationItem_1.BottomNavigationItem, __assign({}, element, { key: index, index: index, id: "".concat(id || navId, "-").concat(index), disabled: disabled || element.disabled, selected: element.selected, dataItem: element, item: item, render: itemRender, onSelect: handleSelect, onKeyDown: handleKeyDown })));
     }))));
 });
 var defaultProps = {

package/dist/npm/bottomnavigation/BottomNavigationItem.d.ts

@@ -9,4 +9,4 @@ export interface BottomNavigationItemHandle {
 /**
  * Represents the [KendoReact BottomNavigationItem component]({% slug overview_bottomnavigation %}).
  */
-export declare const BottomNavigationItem: React.ForwardRefExoticComponent<Pick<BottomNavigationItemProps, string | number> & React.RefAttributes<BottomNavigationItemHandle>>;
+export declare const BottomNavigationItem: React.ForwardRefExoticComponent<Pick<BottomNavigationItemProps, keyof BottomNavigationItemProps> & React.RefAttributes<BottomNavigationItemHandle | null>>;

package/dist/npm/bottomnavigation/BottomNavigationItem.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.BottomNavigationItem = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
@@ -9,13 +10,13 @@ var kendo_react_common_2 = require("@progress/kendo-react-common");
  * Represents the [KendoReact BottomNavigationItem component]({% slug overview_bottomnavigation %}).
  */
 exports.BottomNavigationItem = React.forwardRef(function (props, ref) {
-    kendo_react_common_1.validatePackage(package_metadata_1.packageMetadata);
+    (0, kendo_react_common_1.validatePackage)(package_metadata_1.packageMetadata);
     var elementRef = React.useRef(null);
     React.useImperativeHandle(ref, function () { return ({
         element: elementRef.current
     }); });
     var className = props.className, style = props.style, selected = props.selected, disabled = props.disabled, item = props.item, render = props.render, dataItem = props.dataItem, icon = props.icon, text = props.text, id = props.id, onSelect = props.onSelect, onKeyDown = props.onKeyDown, index = props.index, tabIndex = props.tabIndex;
-    var itemClasses = React.useMemo(function () { return kendo_react_common_2.classNames('k-bottom-nav-item', {
+    var itemClasses = React.useMemo(function () { return (0, kendo_react_common_2.classNames)('k-bottom-nav-item', {
         'k-selected': selected,
         'k-disabled': disabled
     }, className); }, [selected, disabled, className]);
@@ -33,7 +34,7 @@ exports.BottomNavigationItem = React.forwardRef(function (props, ref) {
     var ItemComp = item;
     var bottomNavItem = (React.createElement("span", { ref: elementRef, className: itemClasses, style: style, role: 'link', id: id, tabIndex: tabIndex, onClick: handleClick, onKeyDown: handleKeyDown, "aria-selected": selected, "aria-disabled": disabled }, ItemComp ? React.createElement(ItemComp, { itemIndex: index, item: dataItem }) :
         (React.createElement(React.Fragment, null,
-            icon && React.createElement("span", { className: "k-bottom-nav-item-icon k-icon k-i-" + icon }),
+            icon && React.createElement("span", { className: "k-bottom-nav-item-icon k-icon k-i-".concat(icon) }),
             text && React.createElement("span", { className: 'k-bottom-nav-item-text', style: { userSelect: 'none' } }, text)))));
     return renderer !== undefined ? renderer.call(undefined, bottomNavItem, props) : bottomNavItem;
 });

package/dist/npm/bottomnavigation/models/utils.d.ts

@@ -2,35 +2,35 @@
  * @hidden
  */
 export declare const THEME_COLOR_CLASSES: {
-    'primary': string;
-    'secondary': string;
-    'tertiary': string;
-    'info': string;
-    'success': string;
-    'warning': string;
-    'error': string;
-    'dark': string;
-    'light': string;
-    'inverse': string;
+    primary: string;
+    secondary: string;
+    tertiary: string;
+    info: string;
+    success: string;
+    warning: string;
+    error: string;
+    dark: string;
+    light: string;
+    inverse: string;
 };
 /**
  * @hidden
  */
 export declare const FILL_CLASSES: {
-    'flat': string;
-    'solid': string;
+    flat: string;
+    solid: string;
 };
 /**
  * @hidden
  */
 export declare const ITEM_FLOW_CLASSES: {
-    'vertical': string;
-    'horizontal': string;
+    vertical: string;
+    horizontal: string;
 };
 /**
  * @hidden
  */
 export declare const POSITION_MODE_CLASSES: {
-    'fixed': string;
-    'sticky': string;
+    fixed: string;
+    sticky: string;
 };

package/dist/npm/bottomnavigation/models/utils.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.POSITION_MODE_CLASSES = exports.ITEM_FLOW_CLASSES = exports.FILL_CLASSES = exports.THEME_COLOR_CLASSES = void 0;
 /**
  * @hidden
  */

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

@@ -140,4 +140,4 @@ export interface BreadcrumbLinkKeyDownEvent extends BaseEvent<BreadcrumbLinkHand
 /**
  * Represents the Breadcrumb component.
  */
-export declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<BreadcrumbHandle>>;
+export declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<BreadcrumbHandle | null>>;

package/dist/npm/breadcrumb/Breadcrumb.js

@@ -11,6 +11,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Breadcrumb = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_licensing_1 = require("@progress/kendo-licensing");
@@ -24,7 +25,7 @@ var BreadcrumbOrderedList_1 = require("./BreadcrumbOrderedList");
  * Represents the Breadcrumb component.
  */
 exports.Breadcrumb = 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 breadcrumbRef = React.useRef(null);
     var OrderedListComponent = React.useMemo(function () { return props.breadcrumbOrderedList || BreadcrumbOrderedList_1.BreadcrumbOrderedList; }, [props.breadcrumbOrderedList]);
@@ -43,18 +44,18 @@ exports.Breadcrumb = React.forwardRef(function (props, ref) {
         props: props
     }); });
     React.useImperativeHandle(ref, function () { return target.current; });
-    var dir = kendo_react_common_1.useDir(breadcrumbRef, props.dir);
+    var dir = (0, kendo_react_common_1.useDir)(breadcrumbRef, props.dir);
     var handleItemSelect = function (event) {
         if (target.current) {
-            kendo_react_common_1.dispatchEvent(props.onItemSelect, event, event.target, { id: event.target.id });
+            (0, kendo_react_common_1.dispatchEvent)(props.onItemSelect, event, event.target, { id: event.target.id });
         }
     };
     var handleKeyDown = function (event) {
         if (target.current) {
-            kendo_react_common_1.dispatchEvent(props.onKeyDown, event, event.target, { id: event.target.id });
+            (0, kendo_react_common_1.dispatchEvent)(props.onKeyDown, event, event.target, { id: event.target.id });
         }
     };
-    return (React.createElement("nav", { "aria-label": props.ariaLabel, id: props.id, style: props.style, ref: breadcrumbRef, dir: dir, className: kendo_react_common_1.classNames('k-breadcrumb', {
+    return (React.createElement("nav", { "aria-label": props.ariaLabel, id: props.id, style: props.style, ref: breadcrumbRef, dir: dir, className: (0, kendo_react_common_1.classNames)('k-breadcrumb', {
             'k-rtl': dir === 'rtl',
             'k-disabled': disabled
         }, props.className) },

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

@@ -36,4 +36,4 @@ export interface BreadcrumbDelimiterHandle {
 /**
  * Represents the BreadcrumbDelimiter component.
  */
-export declare const BreadcrumbDelimiter: React.ForwardRefExoticComponent<BreadcrumbDelimiterProps & React.RefAttributes<BreadcrumbDelimiterHandle>>;
+export declare const BreadcrumbDelimiter: React.ForwardRefExoticComponent<BreadcrumbDelimiterProps & React.RefAttributes<BreadcrumbDelimiterHandle | null>>;

package/dist/npm/breadcrumb/BreadcrumbDelimiter.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.BreadcrumbDelimiter = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_licensing_1 = require("@progress/kendo-licensing");
@@ -9,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 ({
@@ -17,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,
@@ -26,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

@@ -1,12 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.BreadcrumbLink = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 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 () {
@@ -22,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

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.BreadcrumbListItem = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_licensing_1 = require("@progress/kendo-licensing");
@@ -9,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 () {
@@ -23,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,
@@ -32,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

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.BreadcrumbOrderedList = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_licensing_1 = require("@progress/kendo-licensing");
@@ -9,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 ({
@@ -17,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));
 });
@@ -31,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

@@ -1,23 +1,25 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Avatar = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var Enums_1 = require("./interfaces/Enums");
 var kendo_react_common_2 = require("@progress/kendo-react-common");
 var package_metadata_1 = require("../package-metadata");
-exports.Avatar = function (props) {
+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 = {
     className: PropTypes.string,
     type: PropTypes.oneOf(['text', 'image', 'icon']),

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

@@ -15,11 +15,14 @@ var __rest = (this && this.__rest) || function (s, e) {
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
         t[p] = s[p];
     if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
-            t[p[i]] = s[p[i]];
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Card = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
@@ -29,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);
@@ -38,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 = {
@@ -51,6 +54,5 @@ exports.Card.propTypes = {
 };
 exports.Card.defaultProps = {
     type: Enums_1.cardType.DEFAULT,
-    orientation: Enums_2.cardOrientation.VERTICAL,
-    dir: 'ltr'
+    orientation: Enums_2.cardOrientation.VERTICAL
 };

package/dist/npm/card/CardActions.js

@@ -1,12 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardActions = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
 var Enums_1 = require("./interfaces/Enums");
-exports.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));
+var CardActions = function (props) {
+    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 = {
     layout: PropTypes.oneOf(['stretched', 'start', 'center', 'end']),
     orientation: PropTypes.oneOf(['horizontal', 'vertical'])

package/dist/npm/card/CardBody.js

@@ -1,11 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardBody = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
-exports.CardBody = function (props) {
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-card-body', props.className) }, props.children));
+var CardBody = function (props) {
+    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 = {
     className: PropTypes.string
 };

package/dist/npm/card/CardFooter.js

@@ -1,11 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardFooter = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
-exports.CardFooter = function (props) {
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-card-footer', props.className) }, props.children));
+var CardFooter = function (props) {
+    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 = {
     className: PropTypes.string
 };

package/dist/npm/card/CardHeader.js

@@ -1,11 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardHeader = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
-exports.CardHeader = function (props) {
-    return (React.createElement("div", { style: props.style, className: kendo_react_common_1.classNames('k-card-header', props.className) }, props.children));
+var CardHeader = function (props) {
+    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 = {
     className: PropTypes.string
 };

package/dist/npm/card/CardImage.js

@@ -1,11 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardImage = void 0;
 var React = require("react");
 var PropTypes = require("prop-types");
 var kendo_react_common_1 = require("@progress/kendo-react-common");
-exports.CardImage = function (props) {
-    return (React.createElement("img", { style: props.style, className: kendo_react_common_1.classNames('k-card-image', props.className), src: props.src }));
+var CardImage = function (props) {
+    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 = {
     className: PropTypes.string,
     src: PropTypes.string