React Outside

A higher order component for React for listening to clicks outside of the component. Supports classes and decorators.

Installation

  npm i react-outside

How to use

Config

/**
 * @param {Object} config Configuration for the events.
 * @return {Component}
 */

Usage

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import clickOutside from 'react-outside';

@clickOutside(['mousedown']) // `click` is the default handler but you can set different event names
export default class DropdownMenu extends Component {
	handleClickOutside(e) {
		// Handle the event
	}

	render() {
		return (
			<ul className="dropdown-menu">
				<li>List items...</li>
			</ul>
		);
	}
}