@jobber/components 4.22.2 → 4.22.3

package/dist/Card/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Card = require('../Card-ece8c5a8.js');
+var Card = require('../Card-4553732a.js');
 require('react');
 require('classnames');
 require('../style-inject.es-9d2f5f4e.js');
@@ -12,10 +12,11 @@ require('../Button-7698424c.js');
 require('react-router-dom');
 require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../Menu-3e22db94.js');
+require('../Menu-2b5fd0b2.js');
 require('uuid');
 require('framer-motion');
 require('@jobber/hooks/useOnKeyDown');
+require('@jobber/hooks/useRefocusOnActivator');
 
 
 

package/dist/{Card-ece8c5a8.js → Card-4553732a.js}

@@ -5,7 +5,7 @@ var classnames = require('classnames');
 var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
 var Heading = require('./Heading-a1191b15.js');
 var Button = require('./Button-7698424c.js');
-var Menu = require('./Menu-3e22db94.js');
+var Menu = require('./Menu-2b5fd0b2.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/DataDump/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var Card = require('../Card-ece8c5a8.js');
+var Card = require('../Card-4553732a.js');
 var Content = require('../Content-a6590328.js');
 var Emphasis = require('../Emphasis-76a10790.js');
 require('classnames');
@@ -14,10 +14,11 @@ require('../Button-7698424c.js');
 require('react-router-dom');
 require('../Icon-405a216c.js');
 require('@jobber/design');
-require('../Menu-3e22db94.js');
+require('../Menu-2b5fd0b2.js');
 require('uuid');
 require('framer-motion');
 require('@jobber/hooks/useOnKeyDown');
+require('@jobber/hooks/useRefocusOnActivator');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/dist/Menu/index.js

@@ -2,12 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Menu = require('../Menu-3e22db94.js');
+var Menu = require('../Menu-2b5fd0b2.js');
 require('react');
 require('uuid');
 require('classnames');
 require('framer-motion');
 require('@jobber/hooks/useOnKeyDown');
+require('@jobber/hooks/useRefocusOnActivator');
 require('../style-inject.es-9d2f5f4e.js');
 require('../Button-7698424c.js');
 require('react-router-dom');

package/dist/{Menu-3e22db94.js → Menu-2b5fd0b2.js}

@@ -5,6 +5,7 @@ var uuid = require('uuid');
 var classnames = require('classnames');
 var framerMotion = require('framer-motion');
 var useOnKeyDown = require('@jobber/hooks/useOnKeyDown');
+var useRefocusOnActivator = require('@jobber/hooks/useRefocusOnActivator');
 var styleInject_es = require('./style-inject.es-9d2f5f4e.js');
 var Button = require('./Button-7698424c.js');
 var Typography = require('./Typography-fd6f932a.js');
@@ -63,6 +64,7 @@ function Menu({ activator, items }) {
             setPosition(newPosition);
         }
     }, [visible, fullWidth]);
+    useRefocusOnActivator.useRefocusOnActivator(visible);
     if (!activator) {
         activator = (React__default["default"].createElement(Button.Button, { fullWidth: true, label: "More Actions", icon: "more", type: "secondary" }));
     }
@@ -70,7 +72,7 @@ function Menu({ activator, items }) {
     const wrapperClasses = classnames__default["default"](styles.wrapper, {
         [styles.fullWidth]: fullWidth,
     });
-    return (React__default["default"].createElement("div", { className: wrapperClasses, ref: wrapperRef },
+    return (React__default["default"].createElement("div", { className: wrapperClasses, ref: wrapperRef, onClick: handleParentClick },
         React__default["default"].cloneElement(activator, {
             onClick: toggle(activator.props.onClick),
             id: buttonID,
@@ -106,6 +108,13 @@ function Menu({ activator, items }) {
         event.stopPropagation();
         key === "Escape" && hide();
     }
+    function handleParentClick(event) {
+        // Since the menu is being rendered within the same parent as the activator,
+        // we need to stop the click event from bubbling up. If the Menu component
+        // gets added within a parent that has a click handler, any click on the
+        // menu will trigger the parent's click handler.
+        event.stopPropagation();
+    }
 }
 function SectionHeader({ text }) {
     return (React__default["default"].createElement("div", { className: styles.sectionHeader, "aria-hidden": true },
@@ -114,8 +123,9 @@ function SectionHeader({ text }) {
 function Action({ label, sectionLabel, icon, onClick, shouldFocus = false, }) {
     const actionButtonRef = React.useRef();
     React.useEffect(() => {
-        if (actionButtonRef.current && shouldFocus) {
-            actionButtonRef.current.focus();
+        if (shouldFocus) {
+            // Focus on the next tick to allow useRefocusOnActivator to initialize
+            setTimeout(() => { var _a; return (_a = actionButtonRef.current) === null || _a === void 0 ? void 0 : _a.focus(); }, 0);
         }
     }, [shouldFocus]);
     return (React__default["default"].createElement("button", { role: "menuitem", type: "button", className: styles.action, key: label, onClick: onClick, ref: actionButtonRef },

package/dist/Page/index.js

@@ -11,7 +11,7 @@ var Text = require('../Text-e7ed0974.js');
 var Content = require('../Content-a6590328.js');
 var Markdown = require('../Markdown-53a0bfda.js');
 var Button = require('../Button-7698424c.js');
-var Menu = require('../Menu-3e22db94.js');
+var Menu = require('../Menu-2b5fd0b2.js');
 var Emphasis = require('../Emphasis-76a10790.js');
 require('../Typography-fd6f932a.js');
 require('react-markdown');
@@ -21,6 +21,7 @@ require('@jobber/design');
 require('uuid');
 require('framer-motion');
 require('@jobber/hooks/useOnKeyDown');
+require('@jobber/hooks/useRefocusOnActivator');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "4.22.2",
+  "version": "4.22.3",
   "license": "MIT",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -83,5 +83,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "2d2166db41ceeadc0f243f08046cddeb6a9ad3c3"
+  "gitHead": "9fa73829abb4c32fa459301f20a018e4918e781a"
 }