@carbon-labs/react-ui-shell 0.11.0 → 0.12.0

package/es/components/SideNav.js

@@ -296,7 +296,11 @@ function SideNavRenderFunction(_ref, ref) {
   const lgMediaQuery = `(min-width: ${breakpoints.lg.width})`;
   const isLg = useMatchMedia(lgMediaQuery);
   function resetNodeTabIndices() {
-    Array.prototype.forEach.call(sideNavRef?.current?.querySelectorAll('[tabIndex="0"]') ?? [], item => {
+    const items = sideNavRef?.current?.querySelectorAll('[tabIndex="0"]') ?? [];
+    items.forEach(item => {
+      if (item.classList.contains(`${prefix}--side-nav__toggle`)) {
+        return;
+      }
       item.tabIndex = -1;
     });
   }
@@ -315,7 +319,7 @@ function SideNavRenderFunction(_ref, ref) {
     tabIndex: -1,
     ref: navRef,
     className: `${prefix}--side-nav__navigation ${className}`,
-    inert: !isRail ? expanded || isLg ? undefined : -1 : undefined
+    inert: !isRail && navType !== SIDE_NAV_TYPE.PANEL && !(expanded || isLg) ? -1 : undefined
   }, accessibilityLabel, eventHandlers, other), childrenToRender, navType === SIDE_NAV_TYPE.PANEL && /*#__PURE__*/React.createElement(SideNavToggle, {
     renderIcon: expandedState ? SidePanelClose : SidePanelOpen,
     onClick: () => setExpandedState(!expandedState)

package/es/components/SideNavToggle.js

@@ -33,7 +33,7 @@ SideNavToggle.propTypes = {
   /**
    * Specify the text content for the toggle
    */
-  children: PropTypes.element,
+  children: PropTypes.node,
   /**
    * Provide an optional function to be called when clicked
    */

package/lib/components/SideNav.js

@@ -317,7 +317,11 @@ function SideNavRenderFunction(_ref, ref) {
   const lgMediaQuery = `(min-width: ${index$1.breakpoints.lg.width})`;
   const isLg = useMatchMedia.useMatchMedia(lgMediaQuery);
   function resetNodeTabIndices() {
-    Array.prototype.forEach.call(sideNavRef?.current?.querySelectorAll('[tabIndex="0"]') ?? [], item => {
+    const items = sideNavRef?.current?.querySelectorAll('[tabIndex="0"]') ?? [];
+    items.forEach(item => {
+      if (item.classList.contains(`${prefix}--side-nav__toggle`)) {
+        return;
+      }
       item.tabIndex = -1;
     });
   }
@@ -336,7 +340,7 @@ function SideNavRenderFunction(_ref, ref) {
     tabIndex: -1,
     ref: navRef,
     className: `${prefix}--side-nav__navigation ${className}`,
-    inert: !isRail ? expanded || isLg ? undefined : -1 : undefined
+    inert: !isRail && navType !== SIDE_NAV_TYPE.PANEL && !(expanded || isLg) ? -1 : undefined
   }, accessibilityLabel, eventHandlers, other), childrenToRender, navType === SIDE_NAV_TYPE.PANEL && /*#__PURE__*/React.createElement(SideNavToggle.SideNavToggle, {
     renderIcon: expandedState ? bucket15.SidePanelClose : bucket15.SidePanelOpen,
     onClick: () => setExpandedState(!expandedState)

package/lib/components/SideNavToggle.js

@@ -37,7 +37,7 @@ SideNavToggle.propTypes = {
   /**
    * Specify the text content for the toggle
    */
-  children: PropTypes.element,
+  children: PropTypes.node,
   /**
    * Provide an optional function to be called when clicked
    */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@carbon-labs/react-ui-shell",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "publishConfig": {
     "access": "public",
     "provenance": true
@@ -33,5 +33,5 @@
   "dependencies": {
     "@ibm/telemetry-js": "^1.9.1"
   },
-  "gitHead": "1679bbbd9bd15fdb92c94ef456f09c2f629b653b"
+  "gitHead": "e79eaa2160768d192cac006f6c533a35ab6f298e"
 }