Never Pay your Mortgage

    react-external-click

    1.0.2 • Public • Published

    react-external-click

    Capturing clicks outside your component.

    External clicks example

    You can pass it a render-prop or children as a function (more details).

    Install it

    $ npm install react-external-click
    

    Use it

    Functional stateless component:

    import React, { Component } from 'react';
    import ExternalClick from 'react-external-click';
    
    const Item = (isExternalClick) => (
      <div className={`item ${isExternalClick && 'external'}`}>
        {`${isExternalClick ? 'Click Me' : 'Click Outside'}`}
      </div>
    );
    
    class App extends Component {
      render() {
        return (
          <div>
            <ExternalClick render={Item} />
          </div>
        );
      }
    }
    

    Statefull class component:

    import React, { Component } from 'react';
    import ExternalClick from 'react-external-click';
    import Menu from './Menu';
    
    class App extends Component {
      render() {
        return (
          <div>       
            <ExternalClick>
              {
                isExternalClick => <Menu show={!isExternalClick} />
              }
            </ExternalClick>
          </div>
        );
      }
    }
    

    Install

    npm i react-external-click

    DownloadsWeekly Downloads

    1

    Version

    1.0.2

    License

    MIT

    Unpacked Size

    6.44 kB

    Total Files

    4

    Last publish

    Collaborators

    • sag1v