@biggerpixel/use-on-click-outside
TypeScript icon, indicating that this package has built-in type declarations

1.0.0 • Public • Published

use-on-click-outside

Usage


npm i @biggerpixel/use-on-click-outside
import React, { useRef } from 'react';
import useBoolState from '@biggerpixel/use-bool-state';
import useOnClickOutside from '@biggerpixel/use-on-click-outside';

const Component = () => {
  const elementWrapper = useRef<HTMLDivElement>(null);
  const [isOpen, toggleIsOpen] = useBoolState(false);

  useOnClickOutside(elementWrapper, toggleIsOpen);

  return (
    isOpen && (
      <div ref={elementWrapper}>
        <h2>Content!</h2>
        <p>(Click outside to close)</p>
      </div>
    )
  );
};

export default Component;

Versions

Current Tags

VersionDownloads (Last 7 Days)Tag
1.0.01latest

Version History

VersionDownloads (Last 7 Days)Published
1.0.01

Package Sidebar

Install

npm i @biggerpixel/use-on-click-outside

Weekly Downloads

1

Version

1.0.0

License

ISC

Unpacked Size

3.06 kB

Total Files

4

Last publish

Collaborators

  • simonalmers