Advertisement
Guest User

Untitled

a guest
Oct 28th, 2016
63
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.20 KB | None | 0 0
  1. export default function OutsideEventListener(Target, listeners = []) {
  2. return class OutsideEventListener extends Component {
  3. target = null
  4.  
  5. componentDidMount() {
  6. for (const eventName of listeners) {
  7. window.addEventListener(eventName, this.handleEvent, false)
  8. }
  9. }
  10.  
  11. componentWillUnmount() {
  12. for (const eventName of listeners) {
  13. window.removeEventListener(eventName, this.handleEvent, false)
  14. }
  15. }
  16.  
  17. handleEvent = (event) => {
  18. if (this.target) {
  19. const targetElement = ReactDOM.findDOMNode(this.target)
  20. const isInside = (targetElement === event.target) || targetElement.contains(event.target)
  21.  
  22. if (! isInside) {
  23. this.target.onOutsideEvent(event)
  24. }
  25. }
  26. }
  27.  
  28. storeTarget = (ref) => {
  29. if (ref && ! ref.onOutsideEvent) {
  30. throw new Error('Component does not define "onOutsideEvent" method.')
  31. }
  32.  
  33. this.target = ref
  34. }
  35.  
  36. render() {
  37. return <Target { ...this.props } ref={ this.storeTarget } />
  38. }
  39. }
  40. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement