Package Exports

react-hoc-outside-click

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-hoc-outside-click) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React HOC OutsideClick

A Higher Order Component wrapper to provide click outside functionality to the components

How to use

Import clickOutside component
Wrap your main component with function the clickOutside
Provide an onClickOutside callback.

Example

import React from 'react';
/* Any component, which will be set onClickOutside */
import Modal from 'modal/Modal';
import clickOutside from 'react-hoc-outside-click';

class AnyComponent extends Component {
  state = {
    isOpened: false
  }

  handleClickOutside() {
    this.setState({ isOpened: false });
  },

  render() {
    const wrapClickDiv = clickOutside(Modal);
    return (
      <wrapClickDiv onClickOutside={this.handleClickOutside}>
        Any content
      </wrapClickDiv>
    )
  },
});

export default AnyComponent;

Options:

Name	Description	Required
onClickOutside	function that is called when a click happened outside of the component	yes

License

MIT