@instructure/ui-top-nav-bar 10.26.3 → 10.26.4

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [10.26.4](https://github.com/instructure/instructure-ui/compare/v10.26.3...v10.26.4) (2025-11-20)
+
+
+### Bug Fixes
+
+* **ui-top-nav-bar:** fix aria-expanded added twice when displaying menus/popups ([a212bb4](https://github.com/instructure/instructure-ui/commit/a212bb44499d4ffc387c66079334b77ea6d7e66e))
+
+
+
+
+
 ## [10.26.3](https://github.com/instructure/instructure-ui/compare/v10.26.2...v10.26.3) (2025-11-19)
 
 **Note:** Version bump only for package @instructure/ui-top-nav-bar

package/es/TopNavBar/TopNavBarItem/index.js

@@ -474,6 +474,9 @@ let TopNavBarItem = (_dec = withDeterministicId(), _dec2 = withStyle(generateSty
       withArrow: false,
       minWidth: ((_renderSubmenu$props2 = renderSubmenu.props) === null || _renderSubmenu$props2 === void 0 ? void 0 : _renderSubmenu$props2.minWidth) || '18.5rem',
       maxHeight: ((_renderSubmenu$props3 = renderSubmenu.props) === null || _renderSubmenu$props3 === void 0 ? void 0 : _renderSubmenu$props3.maxHeight) || `calc(100vh - 10rem)`,
+      // this is needed because the trigger is not a button. `aria-expanded`
+      // is set on `get itemProps()`
+      shouldSetAriaExpanded: false,
       ...(status === 'disabled' && {
         disabled: true,
         show: false,
@@ -523,10 +526,9 @@ let TopNavBarItem = (_dec = withDeterministicId(), _dec2 = withStyle(generateSty
         }
       }),
       isShowingContent: this.state.isPopoverOpen,
-      // @ts-expect-error This is a force override for Popover, because it puts
-      // aria-expanded on the trigger when shouldContainFocus="true",
-      // even when it should be on the item's <button>
-      'aria-expanded': void 0
+      // this is needed because the trigger is not a button. `aria-expanded`
+      // is set on `get itemProps()`
+      shouldSetAriaExpanded: false
     };
     return _jsx(Popover, {
       ...popoverProps,

package/lib/TopNavBar/TopNavBarItem/index.js

@@ -486,6 +486,9 @@ let TopNavBarItem = exports.TopNavBarItem = (_dec = (0, _withDeterministicId.wit
       withArrow: false,
       minWidth: ((_renderSubmenu$props2 = renderSubmenu.props) === null || _renderSubmenu$props2 === void 0 ? void 0 : _renderSubmenu$props2.minWidth) || '18.5rem',
       maxHeight: ((_renderSubmenu$props3 = renderSubmenu.props) === null || _renderSubmenu$props3 === void 0 ? void 0 : _renderSubmenu$props3.maxHeight) || `calc(100vh - 10rem)`,
+      // this is needed because the trigger is not a button. `aria-expanded`
+      // is set on `get itemProps()`
+      shouldSetAriaExpanded: false,
       ...(status === 'disabled' && {
         disabled: true,
         show: false,
@@ -535,10 +538,9 @@ let TopNavBarItem = exports.TopNavBarItem = (_dec = (0, _withDeterministicId.wit
         }
       }),
       isShowingContent: this.state.isPopoverOpen,
-      // @ts-expect-error This is a force override for Popover, because it puts
-      // aria-expanded on the trigger when shouldContainFocus="true",
-      // even when it should be on the item's <button>
-      'aria-expanded': void 0
+      // this is needed because the trigger is not a button. `aria-expanded`
+      // is set on `get itemProps()`
+      shouldSetAriaExpanded: false
     };
     return (0, _jsxRuntime.jsx)(_Popover.Popover, {
       ...popoverProps,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-top-nav-bar",
-  "version": "10.26.3",
+  "version": "10.26.4",
   "description": "A UI component library made by Instructure Inc.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -24,36 +24,36 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.27.6",
-    "@instructure/console": "10.26.3",
-    "@instructure/emotion": "10.26.3",
-    "@instructure/shared-types": "10.26.3",
-    "@instructure/ui-a11y-content": "10.26.3",
-    "@instructure/ui-avatar": "10.26.3",
-    "@instructure/ui-breadcrumb": "10.26.3",
-    "@instructure/ui-buttons": "10.26.3",
-    "@instructure/ui-dialog": "10.26.3",
-    "@instructure/ui-dom-utils": "10.26.3",
-    "@instructure/ui-drilldown": "10.26.3",
-    "@instructure/ui-icons": "10.26.3",
-    "@instructure/ui-link": "10.26.3",
-    "@instructure/ui-popover": "10.26.3",
-    "@instructure/ui-prop-types": "10.26.3",
-    "@instructure/ui-react-utils": "10.26.3",
-    "@instructure/ui-responsive": "10.26.3",
-    "@instructure/ui-testable": "10.26.3",
-    "@instructure/ui-tooltip": "10.26.3",
-    "@instructure/ui-tray": "10.26.3",
-    "@instructure/ui-truncate-list": "10.26.3",
-    "@instructure/ui-utils": "10.26.3",
-    "@instructure/ui-view": "10.26.3",
+    "@instructure/console": "10.26.4",
+    "@instructure/emotion": "10.26.4",
+    "@instructure/shared-types": "10.26.4",
+    "@instructure/ui-a11y-content": "10.26.4",
+    "@instructure/ui-avatar": "10.26.4",
+    "@instructure/ui-breadcrumb": "10.26.4",
+    "@instructure/ui-buttons": "10.26.4",
+    "@instructure/ui-dialog": "10.26.4",
+    "@instructure/ui-dom-utils": "10.26.4",
+    "@instructure/ui-drilldown": "10.26.4",
+    "@instructure/ui-icons": "10.26.4",
+    "@instructure/ui-link": "10.26.4",
+    "@instructure/ui-popover": "10.26.4",
+    "@instructure/ui-prop-types": "10.26.4",
+    "@instructure/ui-react-utils": "10.26.4",
+    "@instructure/ui-responsive": "10.26.4",
+    "@instructure/ui-testable": "10.26.4",
+    "@instructure/ui-tooltip": "10.26.4",
+    "@instructure/ui-tray": "10.26.4",
+    "@instructure/ui-truncate-list": "10.26.4",
+    "@instructure/ui-utils": "10.26.4",
+    "@instructure/ui-view": "10.26.4",
     "prop-types": "^15.8.1"
   },
   "devDependencies": {
-    "@instructure/ui-axe-check": "10.26.3",
-    "@instructure/ui-babel-preset": "10.26.3",
-    "@instructure/ui-color-utils": "10.26.3",
-    "@instructure/ui-scripts": "10.26.3",
-    "@instructure/ui-themes": "10.26.3",
+    "@instructure/ui-axe-check": "10.26.4",
+    "@instructure/ui-babel-preset": "10.26.4",
+    "@instructure/ui-color-utils": "10.26.4",
+    "@instructure/ui-scripts": "10.26.4",
+    "@instructure/ui-themes": "10.26.4",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.0.1",
     "@testing-library/user-event": "^14.6.1",

package/src/TopNavBar/TopNavBarItem/index.tsx

@@ -639,7 +639,9 @@ class TopNavBarItem extends Component<TopNavBarItemProps, TopNavBarItemState> {
       withArrow: false,
       minWidth: renderSubmenu.props?.minWidth || '18.5rem',
       maxHeight: renderSubmenu.props?.maxHeight || `calc(100vh - 10rem)`,
-
+      // this is needed because the trigger is not a button. `aria-expanded`
+      // is set on `get itemProps()`
+      shouldSetAriaExpanded: false,
       ...(status === 'disabled' && {
         disabled: true,
         show: false,
@@ -695,10 +697,9 @@ class TopNavBarItem extends Component<TopNavBarItemProps, TopNavBarItemState> {
         }
       ),
       isShowingContent: this.state.isPopoverOpen,
-      // @ts-expect-error This is a force override for Popover, because it puts
-      // aria-expanded on the trigger when shouldContainFocus="true",
-      // even when it should be on the item's <button>
-      'aria-expanded': undefined
+      // this is needed because the trigger is not a button. `aria-expanded`
+      // is set on `get itemProps()`
+      shouldSetAriaExpanded: false
     }
 
     return <Popover {...popoverProps}>{customPopoverConfig.children}</Popover>