{"_id":"@_use/clickout","_rev":"3-fabb39d86a83b5b16c3aa098b76d5de6","name":"@_use/clickout","dist-tags":{"latest":"0.1.3"},"versions":{"0.1.2":{"name":"@_use/clickout","version":"0.1.2","description":"A Custom React Hook to detect a click outside of an component.","repository":{"type":"git","url":"git+https://github.com/usejs/useClickOut.git"},"author":{"name":"André Malveira","email":"andremalveira.dev@gmail.com"},"private":false,"publishConfig":{"access":"public"},"license":"MIT","main":"dist/index.js","typings":"dist/index.d.ts","engines":{"node":">=10"},"keywords":["useClickOut","useclickout","use-click-out","custom-hooks","react-custom-hooks","react-hooks"],"scripts":{"start":"tsdx watch","build":"tsdx build","test":"tsdx test","lint":"tsdx lint","prepare":"tsdx build","size":"size-limit","analyze":"size-limit --why"},"husky":{"hooks":{"pre-commit":"tsdx lint"}},"prettier":{"printWidth":80,"semi":true,"singleQuote":true,"trailingComma":"es5"},"module":"dist/useclickout.esm.js","size-limit":[{"path":"dist/useclickout.cjs.production.min.js","limit":"10 KB"},{"path":"dist/useclickout.esm.js","limit":"10 KB"}],"devDependencies":{"@size-limit/preset-small-lib":"^7.0.8","@types/react":"^17.0.43","husky":"^7.0.4","size-limit":"^7.0.8","tsdx":"^0.14.1","tslib":"^2.3.1","typescript":"^4.6.3"},"peerDependencies":{"react":"^17.0.2"},"dependencies":{},"gitHead":"7677638a2ad4469197cbc7a2c4abb8036af9362d","bugs":{"url":"https://github.com/usejs/useClickOut/issues"},"homepage":"https://github.com/usejs/useClickOut#readme","_id":"@_use/clickout@0.1.2","_nodeVersion":"16.13.1","_npmVersion":"8.1.2","dist":{"integrity":"sha512-Mx5wcEwLvObPWJc54NK/LIR+6ToDouASoT33PZL+rQf27T53F60Hw0EzIB+XrwmjbFjl5HUcnCmBnUykw5Zi2w==","shasum":"9b333f0df68ffa1d0c74f55622bda4d9ffaa5d92","tarball":"https://registry.npmjs.org/@_use/clickout/-/clickout-0.1.2.tgz","fileCount":14,"unpackedSize":15279,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiQ2IaACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqGAw//Slg9Q0ne+l41JEbZoC7A6Py4uzO8TxgxTMLtX4S4UIo9qb4k\r\n+d7rW1CLOAXxtXJjhu7lkAPt1qgMWWMauaZmlRxbrbsodyzFCMXtidJLJUBf\r\nmqkDUiCzGvTWop5CWerQXPjdC6G7YDRlpo6slvA3N1y5DL7KV7mRAahPErcu\r\nxdS4CBPdmAXBQSKFm7u69PlZC6gFxdPVwyMN1IGWOBCOX2vSdqVzULH+3pMP\r\nAJPAb0ATYsfe4goaL2ysv4/F0hBDx7DgUmSbpdStJVbKT3LbChPLHqp0I3CI\r\nb6/UUl1tJcbGSaICfZQzx/TBVkpvmS8y2C5bx7hmx9/bWO4Jg187xpaPaa21\r\nfcwgnXyhUR2WansKoyL69EjG3zxR751157kovRNjIN+eLFk2MdqTIE9SorHa\r\nK8+Ybb3YDEZPHKjMSOYT8dKCPltC1chXdpZvt0uJbUWyrXvXUSX4yBl0i7MG\r\naUxBzqcUvp+QMCI3Oh9WuWD+mNiaPFcjcHDVS5l3tobl8EWMeFjPCHoZ3eB9\r\nmPMmwgKsECYOEGe/b7ME57A97CLYQUrITrhFQnZt2DWTfdWKF5YxFYCW0+4r\r\nZVs5HXXnCjq5DYkzA/asl3esdVSdD+KD+O6lCIoZvv7VqvB6j0HPkOMUAmuF\r\nCoNgJZRbcTU5KWAZqgoOXvlyRRDSSqDu6g0=\r\n=vyQl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH72focRQj/tdB5jwyExseutTQVX/Jlx+kHbj7j1hgGmAiEApf/WeWE8l7N0rMEuSN9Cm9c18XBalUou43jdxawGFiI="}]},"_npmUser":{"name":"andremalveira","email":"andremalveira.dev@gmail.com"},"directories":{},"maintainers":[{"name":"andremalveira","email":"andremalveira.dev@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/clickout_0.1.2_1648583194158_0.702406401120836"},"_hasShrinkwrap":false,"deprecated":"Package no longer supported. Contact Support at https://www.npmjs.com/support for more info."},"0.1.3":{"name":"@_use/clickout","version":"0.1.3","description":"A Custom React Hook to detect a click outside of an component.","repository":{"type":"git","url":"git+https://github.com/usejs/useClickOut.git"},"author":{"name":"André Malveira","email":"andremalveira.dev@gmail.com"},"private":false,"publishConfig":{"access":"public"},"license":"MIT","main":"dist/index.js","typings":"dist/index.d.ts","engines":{"node":">=10"},"keywords":["useClickOut","useclickout","use-click-out","custom-hooks","react-custom-hooks","react-hooks"],"scripts":{"start":"tsdx watch","build":"tsdx build","test":"tsdx test","lint":"tsdx lint","prepare":"tsdx build","size":"size-limit","analyze":"size-limit --why"},"husky":{"hooks":{"pre-commit":"tsdx lint"}},"prettier":{"printWidth":80,"semi":true,"singleQuote":true,"trailingComma":"es5"},"module":"dist/useclickout.esm.js","size-limit":[{"path":"dist/useclickout.cjs.production.min.js","limit":"10 KB"},{"path":"dist/useclickout.esm.js","limit":"10 KB"}],"devDependencies":{"@size-limit/preset-small-lib":"^7.0.8","@types/react":"^17.0.43","husky":"^7.0.4","size-limit":"^7.0.8","tsdx":"^0.14.1","tslib":"^2.3.1","typescript":"^4.6.3"},"peerDependencies":{"react":"^17.0.2"},"dependencies":{},"gitHead":"42aadee9c28f0e4d551462b2f7608c5b2b72d7fc","bugs":{"url":"https://github.com/usejs/useClickOut/issues"},"homepage":"https://github.com/usejs/useClickOut#readme","_id":"@_use/clickout@0.1.3","_nodeVersion":"16.13.1","_npmVersion":"8.1.2","dist":{"integrity":"sha512-3mPACa5RDSK8rc4mgO6JSFerXMw/K44T7+AL9av2aXJ8d+VqzkEOkITYMID6/eitFvGgv6yIaymkMXMTyjHOug==","shasum":"a35579fb08e86abc69f388965f0c714eed531e45","tarball":"https://registry.npmjs.org/@_use/clickout/-/clickout-0.1.3.tgz","fileCount":14,"unpackedSize":15273,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiQ2MjACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrAXg//Q6SZ7LqTKb9xZM7ze8Ue1s3klo0ZS4PXsxWfYecRXXBbUGC9\r\n74bGM6VFX4adelg7Vt9pPxRLQ3LhWwBN8EBQuJ55PRlPanaUXhCNNRTKzue8\r\n/QCn5afsS330KRhimP7FiflyvwMAvWjIbhKbLMy9odZrK4fYE4yMOYeJWoZZ\r\nPJNMChUmZo5mSssdeJ0O7iAHgwvGU6uSqtvPzjIbls2VwrjeXU23VY1+kDFA\r\nJDIGK2oGcgg77CZpZz9+7CrMsfkh6tGjcjhaYEWf/TdcWjqW00e0e+5WeH7Q\r\n58E3S70QHHNmeGu4gMGoah9Z9+h3grNUGLXGsUU4mL9DoV263IVvDDClsz+w\r\nCjrsDRP6A0xyiincMgY6FJu3BAfQZLXlfPCsFXngMHOzGIHvlTe/WO5GMDuP\r\nAhatcAXPLjLvFJcYjwzjFMlWKZucrmNFUR+ie/lU8yOWWz6fN1mB9Gzz2UAo\r\nclkXN9sDX99Rx/KVyi5UuWCgH1rWtCtfFJjlf6h46lHvbNH9ht8l2lQ2wF2k\r\n9QSejbjdr9PKKvcOgFNaXuBqkRf06einNa8hmhh8wPB4whHZAYml6kyMTKBw\r\nWC22Q5qPfqajeGCzN2K2Vf8Vshojhz7yUQeg++D6Wqz2L74L5JoRCC8Nxj/t\r\n+jY4/rcz0NBeKkMhbi+4mbJTTbjBov77+SQ=\r\n=ZR+k\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHZSRhETzhVKKVqObuP2VQVuYnWHnNgtgpir1g4giMw9AiEAwKFzZ+OrQKfxeQBXIx3TVQKYlwBIRnkO975VmrpO9UY="}]},"_npmUser":{"name":"andremalveira","email":"andremalveira.dev@gmail.com"},"directories":{},"maintainers":[{"name":"andremalveira","email":"andremalveira.dev@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/clickout_0.1.3_1648583459548_0.08972017956498068"},"_hasShrinkwrap":false,"deprecated":"Package no longer supported. Contact Support at https://www.npmjs.com/support for more info."}},"time":{"created":"2022-03-29T19:46:34.090Z","0.1.2":"2022-03-29T19:46:34.346Z","modified":"2023-06-28T15:14:47.401Z","0.1.3":"2022-03-29T19:50:59.816Z"},"maintainers":[{"name":"andremalveira","email":"andremalveira.dev@gmail.com"}],"description":"A Custom React Hook to detect a click outside of an component.","homepage":"https://github.com/usejs/useClickOut#readme","keywords":["useClickOut","useclickout","use-click-out","custom-hooks","react-custom-hooks","react-hooks"],"repository":{"type":"git","url":"git+https://github.com/usejs/useClickOut.git"},"author":{"name":"André Malveira","email":"andremalveira.dev@gmail.com"},"bugs":{"url":"https://github.com/usejs/useClickOut/issues"},"license":"MIT","readme":" <!-- UseOnlyHook.transparent.png -->\n\n <p align=\"center\"><img width=\"250\" src=\"https://usejs.github.io/.github/public/Use.transparent.png\"/></p>\n\n\n# <p align=\"center\">useClickOut</p>\n<p align=\"center\">\n<a href=\"#details\">\n<img src=\"https://img.shields.io/badge/License-MIT-319046?\" alt=\"License-MIT\"/>&nbsp;&nbsp;\n<img src=\"https://img.shields.io/badge/npm-0.1.3-319046?\" alt=\"License-MIT\"/></a>\n\n\n</p>\n\n<br/>\n\n[useClickOut](#useClickOut) is a custom hook that captures the click in and out of an HTML element. It returns an array with three values and has a single argument.\n\n- Returns:<br/>\n[ref](#ref) : First value, `Type`: `React.RefObject<HTMLDivElement>`<br/>\n[state](#state) : Second  value, `Type`: `boolean`<br/>\n [setState](#setstate) : Third  value, `Type`: `React.Dispatch<React.SetStateAction<boolean>>`<br/>\n\n- Argument<br/>\n  [initialState](#initialState): `boolean`<br/>\n\n### Install\n```bash \nnpm i @_use/clickout\n```\n\n### Usage\n\n```tsx \nimport useClickOut from '@_use/clickout'\n\nconst Square = () => {\n\n  const [ ref, state, setState ] = useClickOut(false)\n\n  return (<>\n    <div \n      ref={ref}\n      onClick={() => setState(true)}  \n    >\n      Click\n        {state ? ' Inside ' : ' Outside '}\n      the square.\n    </div>\n  </>)\n}\n\nexport default Square\n```\n\n### Type\n> if you need `useClickOut` type, import inside `UseClickOut` braces with first letter capitalized.\n```ts\nimport useClickOut, { UseClickOut } from '@_use/clickout'\n```\n\n```ts\ntype UseClickOut = (initialState:boolean) => [\n  React.RefObject<HTMLDivElement>,\n  boolean,\n  React.Dispatch<React.SetStateAction<boolean>>\n]\n```\n\n<br/>\n<br/>\n<br/>\n\n<p align=\"center\">Use.js &copy; 2022 | License MIT</p>","readmeFilename":"README.md"}