@progress/kendo-react-layout 5.3.0-dev.202205040828 → 5.3.0-dev.202205051350

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

@@ -73,10 +73,9 @@ var MenuItemInternal = /** @class */ (function (_super) {
         var _this = this;
         var item = this.props.item;
         var itemId = item.id;
-        return [
-            (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())),
-            this.renderPopupIfOpened()
-        ];
+        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()),
+            this.renderPopupIfOpened()));
     };
     MenuItemInternal.prototype.renderContent = function () {
         var itemId = this.props.item.contentParentItemId;
@@ -92,11 +91,10 @@ var MenuItemInternal = /** @class */ (function (_super) {
             var textOrItemRender = this.itemRender ?
                 React.createElement(this.itemRender, { item: this.props.onOriginalItemNeeded(item.id), itemId: item.id, key: "1" }) :
                 React.createElement("span", { className: "k-menu-link-text" }, item.text);
-            return (React.createElement(MenuItemLink_1.MenuItemLink, { url: item.url, opened: this.Opened }, [
+            return (React.createElement(MenuItemLink_1.MenuItemLink, { url: item.url, opened: this.Opened },
                 this.renderMenuIconIfApplicable(),
                 textOrItemRender,
-                this.renderArrowIfApplicable()
-            ]));
+                this.renderArrowIfApplicable()));
         }
     };
     MenuItemInternal.prototype.renderPopupIfOpened = function () {

package/dist/npm/package-metadata.js

@@ -7,7 +7,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-react-layout',
     productName: 'KendoReact',
     productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
-    publishDate: 1651652180,
+    publishDate: 1651757786,
     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/PanelBarItem.js

@@ -90,9 +90,9 @@ var PanelBarItem = /** @class */ (function (_super) {
             'k-state-expanded': expanded && !!children
         }, "k-level-" + level, className);
         var panelBarLinkClassName = kendo_react_common_1.classNames('k-link', {
-            'k-state-selected': !disabled && selected,
+            'k-selected': !disabled && selected,
             'k-state-focus': !disabled && focused,
-            'k-state-disabled': disabled
+            'k-disabled': disabled
         }, headerClassName);
         var panelBarItemArrowClassName = kendo_react_common_1.classNames('k-panelbar-toggle', 'k-icon', (_a = {},
             _a['k-i-arrow-chevron-up'] = expanded && !!children,

package/dist/npm/splitter/SplitterBar.js

@@ -159,7 +159,7 @@ var SplitterBar = /** @class */ (function (_super) {
         var isStatic = this.isStatic;
         var isHorizontal = this.isHorizontal;
         var barClasses = kendo_react_common_1.classNames('k-splitbar', (_a = {},
-            _a['k-state-focused'] = this.state.focused,
+            _a['k-focus'] = this.state.focused,
             _a['k-splitbar-horizontal'] = isHorizontal,
             _a['k-splitbar-vertical'] = !isHorizontal,
             _a['k-splitbar-draggable-horizontal'] = isHorizontal && isDraggable,

package/dist/npm/tabstrip/TabStripContent.js

@@ -45,7 +45,7 @@ var TabStripContent = /** @class */ (function (_super) {
         var _a = this.props, children = _a.children, selected = _a.selected;
         var selectedTab = children && typeof selected === 'number' &&
             React.Children.toArray(children)[selected];
-        var contentClasses = kendo_react_common_1.classNames('k-content', 'k-state-active', selectedTab && selectedTab.props.contentClassName);
+        var contentClasses = kendo_react_common_1.classNames('k-content', 'k-active', selectedTab && selectedTab.props.contentClassName);
         return (React.createElement("div", { className: contentClasses, style: this.props.style }, this.renderContent(children)));
     };
     TabStripContent.prototype.renderContent = function (children) {
@@ -61,6 +61,7 @@ var TabStripContent = /** @class */ (function (_super) {
         var contentProps = {
             'role': 'tabpanel',
             'aria-expanded': true,
+            'aria-labelledby': idx.toString(),
             'style': {
                 'display': visible ? undefined : 'none'
             }

package/dist/npm/tabstrip/TabStripNavigationItem.d.ts

@@ -4,6 +4,10 @@ import * as PropTypes from 'prop-types';
  * The props that are passed by the TabStripNavigation to the TabStripNavigationItem.
  */
 export interface TabStripNavigationItemProps {
+    /**
+     * Sets the `id` property of the top element of the TabStripNavigationItem.
+     */
+    id?: string;
     /**
      * Defines whether the current TabStripNavigationItem is selected.
      */

package/dist/npm/tabstrip/TabStripNavigationItem.js

@@ -43,17 +43,21 @@ var TabStripNavigationItem = /** @class */ (function (_super) {
      */
     TabStripNavigationItem.prototype.render = function () {
         var _a;
-        var _b = this.props, active = _b.active, disabled = _b.disabled, _c = _b.title, title = _c === void 0 ? 'Untitled' : _c, first = _b.first, last = _b.last;
+        var _b = this.props, id = _b.id, active = _b.active, disabled = _b.disabled, _c = _b.title, title = _c === void 0 ? 'Untitled' : _c, first = _b.first, last = _b.last;
         var props = {
+            'id': id,
             'aria-selected': active,
+            'aria-controls': id,
+            'aria-disabled': disabled,
+            'aria-hidden': disabled,
             'role': 'tab',
             onClick: !disabled ? this.onClick : undefined
         };
         var itemClasses = kendo_react_common_1.classNames('k-item', (_a = {},
             _a['k-first'] = first,
             _a['k-last'] = last,
-            _a['k-state-disabled'] = disabled,
-            _a['k-state-active'] = active,
+            _a['k-disabled'] = disabled,
+            _a['k-active'] = active,
             _a));
         return (React.createElement("li", __assign({}, props, { className: itemClasses }),
             React.createElement("span", { className: "k-link" }, title)));