# click-outside-render-prop

> a typescript render-prop click outside component for react

Latest version **0.0.3** (published 2018-12-29) · MIT license · 0 weekly downloads

## Install

```sh
npm install click-outside-render-prop
pnpm add click-outside-render-prop
yarn add click-outside-render-prop
bun add click-outside-render-prop
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2018-12-29 |
| First published | 2018-12-29 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=6.0.0 |
| Dependencies | 4 |
| Unpacked size | 173.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Timothee Clain |
| Maintainers | tclain |
| Keywords | react, dom, click-outside, typescript |

## Links

- npm: https://www.npmjs.com/package/click-outside-render-prop
- Repository: https://github.com/tclain/click-outside-render-prop
- Homepage: https://github.com/tclain/click-outside-render-prop#readme
- Issues: https://github.com/tclain/click-outside-render-prop/issues
- npm.io page: https://npm.io/package/click-outside-render-prop

## Dependencies (4)

- [prop-types](https://npm.io/package/prop-types.md) ^15.6.2
- [@types/react](https://npm.io/package/@types/react.md) ^16.4.17
- [@types/react-dom](https://npm.io/package/@types/react-dom.md) ^16.0.9
- [@types/prop-types](https://npm.io/package/@types/prop-types.md) ^15.5.6

## Alternatives

- [babylon](https://npm.io/package/babylon.md) — 5.1M weekly downloads
- [csscolorparser](https://npm.io/package/csscolorparser.md) — 3.7M weekly downloads
- [expr-eval-fork](https://npm.io/package/expr-eval-fork.md) — 1.5M weekly downloads
- [@leeoniya/ufuzzy](https://npm.io/package/@leeoniya/ufuzzy.md) — 247.7K weekly downloads
- [xml-parser](https://npm.io/package/xml-parser.md) — 78.4K weekly downloads

## Recent versions

- 0.0.3 (latest) — 2018-12-29
- 0.0.2 — 2018-12-29
- 0.0.1 — 2018-12-29

## README

# React Click Outside (again with ts and renderprop pattern)

### Usage

```bash
git clone https://github.com/tclain/click-outside-render-prop 
cd click-outside-render-prop

# Run npm install and write your library name when asked. That's all!
npm install
```


### Features

Basically the same as tj/click-outside, but with a render prop flavour and written in typescript !

### Importing the library

```javascript
import ClickOutside from 'click-outside-render-prop'


export const App = () => {
    return <ClickOutside onClickOutside={console.log}>
        {({ref}) => (
            <MyComponentWrapper ref={ref} />
        )}
    </ClickOutside>
}
```


### NPM scripts

 - `npm t`: Run test suite
 - `npm start`: Run `npm run build` in watch mode
 - `npm run test:watch`: Run test suite in [interactive watch mode](http://facebook.github.io/jest/docs/cli.html#watch)
 - `npm run test:prod`: Run linting and generate coverage
 - `npm run build`: Generate bundles and typings, create docs
 - `npm run lint`: Lints code
 - `npm run commit`: Commit using conventional commit style ([husky](https://github.com/typicode/husky) will tell you to use it if you haven't :wink:)

---
_Source: https://npm.io/package/click-outside-render-prop · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._