Skip to content

๐ŸŒ€ ES7 class decorator or higher-order component for React for listening to clicks outside of the component.

License

Notifications You must be signed in to change notification settings

danbovey/react-outside

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

11 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

React Outside

npm React Version npm npm

Wraps a react component and listens for clicks outside of the element.

Can be used as a higher-order component or as an ES7 class decorator

Installation

  npm i react-outside

API

clickOutside([config])(MyComponent)

Parameters

  • config object
    • config.events array

Examples

// ES7
import React from 'react';
import clickOutside from 'react-outside';

@clickOutside() // Enhanced component
class MyComponent extends React.Component {
    handleClickOutside() {
        // Handle the event
    }
    render() {
        <ul className="dropdown-menu">
            <li>List items...</li>
        </ul>
    }
}

export default MyComponent; // Component is exported with `clickOutside` decorator
// ES5
var React = require('react');
var clickOutside = require('react-outside');

class MyComponent extends React.Component {
    handleClickOutside() {
        // Handle the event
    }
    render() {
        <ul className="dropdown-menu">
            <li>List items...</li>
        </ul>
    }
}

export default clickOutside()(MyComponent); // Enhanced component

About

๐ŸŒ€ ES7 class decorator or higher-order component for React for listening to clicks outside of the component.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published