@deque/cauldron-react 7.1.0-canary.b7d2a9c6 → 7.1.0-canary.c367e9d4

package/lib/components/MenuBar/index.d.ts

@@ -12,6 +12,7 @@ export default class TopBar extends React.Component<MenuBarProps, MenuBarState>
         thin: boolean;
         hasTrigger: boolean;
     };
+    private menuBarRef;
     constructor(props: MenuBarProps);
     componentDidMount(): void;
     componentWillUnmount(): void;

package/lib/index.js

@@ -672,6 +672,7 @@ var TopBar$1 = /** @class */ (function (_super) {
     tslib.__extends(TopBar, _super);
     function TopBar(props) {
         var _this = _super.call(this, props) || this;
+        _this.menuBarRef = React__default["default"].createRef();
         _this.onResize = function () {
             var wide = isWide();
             if (wide === _this.state.wide) {
@@ -720,10 +721,10 @@ var TopBar$1 = /** @class */ (function (_super) {
     };
     TopBar.prototype.onKeyDown = function (e) {
         var key = keyname__default["default"](e.which);
-        // This is a temporary workaround until have an opportunity to refactor or replace menubar
-        // see: https://github.com/dequelabs/cauldron/issues/1934
-        // eslint-disable-next-line react/no-find-dom-node
-        var menuBarElement = reactDom.findDOMNode(this);
+        var menuBarElement = this.menuBarRef.current;
+        if (!menuBarElement) {
+            return;
+        }
         var menuItems = Array.from(menuBarElement.children);
         // account for hidden side bar trigger (hamburger)
         if (this.state.wide && this.props.hasTrigger) {
@@ -750,7 +751,7 @@ var TopBar$1 = /** @class */ (function (_super) {
         // disabling no-unused-vars to prevent thin/hasTrigger from being passed through to div
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
         var _a = this.props, children = _a.children, className = _a.className; _a.thin; _a.hasTrigger; tslib.__rest(_a, ["children", "className", "thin", "hasTrigger"]);
-        return (React__default["default"].createElement("ul", { role: "menubar", onKeyDown: this.onKeyDown, className: className }, React.Children.map(children, this.renderChild)));
+        return (React__default["default"].createElement("ul", { role: "menubar", onKeyDown: this.onKeyDown, className: className, ref: this.menuBarRef }, React.Children.map(children, this.renderChild)));
     };
     TopBar.defaultProps = {
         thin: false,
@@ -4322,6 +4323,17 @@ var Combobox = React.forwardRef(function (_a, ref) {
             return value === lastSelectedValue;
         }) || [], 2), element = _a[0], option = _a[1];
         if (autocomplete === 'manual') {
+            // In multiselect, the listbox manages its own active option via
+            // keyboard navigation. When the last-selected value no longer
+            // matches any option (e.g. after deselecting the only selected
+            // option), preserve the existing active descendant so the next
+            // Enter keypress can re-toggle the highlighted option.
+            if (multiselect &&
+                !element &&
+                activeDescendant &&
+                matchingOptions.has(activeDescendant.element)) {
+                return;
+            }
             setActiveDescendant(!element ? null : tslib.__assign({ element: element }, option));
         }
         else if (autocomplete === 'automatic' &&

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deque/cauldron-react",
-  "version": "7.1.0-canary.b7d2a9c6",
+  "version": "7.1.0-canary.c367e9d4",
   "license": "MPL-2.0",
   "description": "Fully accessible react components library for Deque Cauldron",
   "homepage": "https://cauldron.dequelabs.com/",
@@ -41,7 +41,7 @@
     "@babel/preset-env": "^7.22.10",
     "@babel/preset-react": "^7.22.5",
     "@babel/preset-typescript": "^7.22.5",
-    "@figma/code-connect": "^1.4.4",
+    "@figma/code-connect": "^1.4.5",
     "@rollup/plugin-commonjs": "^14.0.0",
     "@rollup/plugin-dynamic-import-vars": "^1.4.2",
     "@rollup/plugin-typescript": "^11.1.2",