Nefariously Pushing Master

    @leafyjava/react-click-away
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.3 • Public • Published

    react-click-away

    Use this component to wrap other components to detect if it is clicked outside of the wrapped container.

    NPM JavaScript Style Guide

    Demo

    https://zhenyanghua.github.io/react-click-away/

    Install

    npm install --save @leafyjava/react-click-away

    Usage

    import React from 'react'
    
    import ClickOutside from '@leafyjava/react-click-away'
    
    const App = () => {
      const [clicked, setClicked] = React.useState(false);
    
      const handleClickOutside = () => {
        setClicked(clicked => !clicked);
      }
    
      return (
        <div>
          <ClickOutside onClickOutside={handleClickOutside}>
            <h1>Click Outside of this Box to Toggle</h1>
          </ClickOutside>
          {clicked && <h1>Clicked Outside Toggled</h1>}
        </div>
    
      )
    }
    
    export default App

    License

    MIT © zhenyanghua

    Install

    npm i @leafyjava/react-click-away

    DownloadsWeekly Downloads

    5

    Version

    1.0.3

    License

    MIT

    Unpacked Size

    11.3 kB

    Total Files

    9

    Last publish

    Collaborators

    • zhenyanghua