@doist/reactist 12.0.1 → 12.0.4

package/dist/reactist.cjs.development.js

@@ -491,6 +491,8 @@ function Tooltip(_ref) {
 
 
   function handleFocus(event) {
+    var _child$props;
+
     // If focus is not followed by a key up event, does it mean that it's not
     // an intentional keyboard focus? Not sure but it seems to work.
     // This may be resolved soon in an upcoming version of reakit:
@@ -508,21 +510,16 @@ function Tooltip(_ref) {
     }); // Prevent tooltip.show from being called by TooltipReference
 
     event.preventDefault();
-    child.props.onFocus == null ? void 0 : child.props.onFocus(event);
+    child == null ? void 0 : (_child$props = child.props) == null ? void 0 : _child$props.onFocus == null ? void 0 : _child$props.onFocus(event);
   }
 
-  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(tooltip.TooltipAnchor, {
-    state: state,
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(tooltip.TooltipAnchor, _objectSpread2(_objectSpread2({
+    state: state
+  }, child.props), {}, {
+    ref: child.ref,
     onFocus: handleFocus
-  }, anchorProps => {
-    const {
-      onFocus,
-      onBlur
-    } = anchorProps;
-    return /*#__PURE__*/React__default.cloneElement(child, _objectSpread2(_objectSpread2(_objectSpread2({}, anchorProps), child.props), {}, {
-      onFocus,
-      onBlur
-    }));
+  }), anchorProps => {
+    return /*#__PURE__*/React__default.cloneElement(child, anchorProps);
   }), state.visible ? /*#__PURE__*/React__default.createElement(tooltip.Tooltip, _objectSpread2(_objectSpread2({}, props), {}, {
     state: state,
     className: classNames('reactist_tooltip', className)
@@ -3163,7 +3160,8 @@ const MenuContext = /*#__PURE__*/React.createContext( // Ariakit gives us no mea
 {});
 /**
  * Wrapper component to control a menu. It does not render anything, only providing the state
- * management for the menu components inside it.
+ * management for the menu components inside it. Note that if you are relying on the `[role='menu']`
+ * attribute to style the menu list, it is applied a `menubar` role instead in Safari.
  */
 
 function Menu(_ref) {
@@ -3176,7 +3174,7 @@ function Menu(_ref) {
   const state = Ariakit.useMenuState(_objectSpread2({
     focusLoop: true,
     gutter: 8,
-    shift: 8
+    shift: 4
   }, props));
   const handleItemSelect = React.useCallback(function handleItemSelect(value) {
     if (onItemSelect) onItemSelect(value);