[ClickAwayListener] Hide react-event-listener

Author: oliviertassinari

docs/scripts/buildApi.js

@@ -59,10 +59,6 @@ function getInheritance(src) {
       pathname = 'https://reactcommunity.org/react-transition-group/#Transition';
       break;
 
-    case 'EventListener':
-      pathname = 'https://github.com/oliviertassinari/react-event-listener';
-      break;
-
     default:
       pathname = `/api/${kebabCase(component)}`;
       break;

packages/material-ui/src/ClickAwayListener/ClickAwayListener.js

@@ -1,11 +1,10 @@
-// @inheritedComponent EventListener
-
 import React from 'react';
 import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import EventListener from 'react-event-listener';
 import ownerDocument from '../utils/ownerDocument';
 import { useForkRef } from '../utils/reactHelpers';
+import { exactProp } from '@material-ui/utils';
 
 function useMountedRef() {
   const mountedRef = React.useRef(false);
@@ -24,13 +23,14 @@ function useMountedRef() {
  * For instance, if you need to hide a menu when people click anywhere else on your page.
  */
 function ClickAwayListener(props) {
-  const { children, mouseEvent, touchEvent, onClickAway, ...other } = props;
+  const { children, mouseEvent, touchEvent, onClickAway } = props;
   const mountedRef = useMountedRef();
   const movedRef = React.useRef(false);
 
   const nodeRef = React.useRef();
   // can be removed once we drop support for non ref forwarding class components
   const handleOwnRef = React.useCallback(ref => {
+    // #StrictMode ready
     nodeRef.current = ReactDOM.findDOMNode(ref);
   }, []);
   const handleRef = useForkRef(children.ref, handleOwnRef);
@@ -88,7 +88,7 @@ function ClickAwayListener(props) {
   return (
     <React.Fragment>
       {React.cloneElement(children, { ref: handleRef })}
-      <EventListener target="document" {...listenerProps} {...other} />
+      <EventListener target="document" {...listenerProps} />
     </React.Fragment>
   );
 }
@@ -114,6 +114,11 @@ ClickAwayListener.propTypes = {
   touchEvent: PropTypes.oneOf(['onTouchStart', 'onTouchEnd', false]),
 };
 
+if (process.env.NODE_ENV !== 'production') {
+  // eslint-disable-next-line
+  ClickAwayListener['propTypes' + ''] = exactProp(ClickAwayListener.propTypes);
+}
+
 ClickAwayListener.defaultProps = {
   mouseEvent: 'onMouseUp',
   touchEvent: 'onTouchEnd',

packages/material-ui/src/MenuList/MenuList.js

@@ -150,7 +150,7 @@ const MenuList = React.forwardRef(function MenuList(props, ref) {
   };
 
   const handleOwnRef = React.useCallback(refArg => {
-    // StrictMode ready
+    // #StrictMode ready
     listRef.current = ReactDOM.findDOMNode(refArg);
   }, []);
   const handleRef = useForkRef(handleOwnRef, ref);

pages/api/click-away-listener.md

@@ -26,12 +26,6 @@ For instance, if you need to hide a menu when people click anywhere else on your
 
 The component cannot hold a ref.
 
-Any other properties supplied will be provided to the root element ([EventListener](https://github.com/oliviertassinari/react-event-listener/)).
-
-## Inheritance
-
-The properties of the [EventListener](https://github.com/oliviertassinari/react-event-listener/) component, from react-event-listener, are also available.
-You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos