{"_id":"react-listener-provider","_rev":"5-7a8fdaffc9a1a8729aea192b7fba2530","name":"react-listener-provider","dist-tags":{"latest":"0.2.0"},"versions":{"0.1.0":{"name":"react-listener-provider","version":"0.1.0","main":"lib/index.js","license":"MIT","scripts":{"build":"rimraf lib && babel src --out-dir lib","prepublish":"npm run build"},"repository":{"type":"git","url":"git+https://github.com/jnsdls/react-perimeter.git"},"author":{"name":"Jonas Daniels","email":"jonas@bebo.com","url":"https://www.twitter.com/jnsdls"},"devDependencies":{"babel-cli":"^6.24.0","babel-plugin-transform-class-properties":"^6.23.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-preset-env":"^1.2.2","babel-preset-react":"^6.23.0","flow-bin":"^0.41.0","invariant":"^2.2.2","rimraf":"^2.6.1"},"peerDependencies":{"react":"^15.4.2","react-dom":"^15.4.2"},"gitHead":"96f72af266c95f6ae6a184558d1d96ba1e972b02","description":"","bugs":{"url":"https://github.com/jnsdls/react-perimeter/issues"},"homepage":"https://github.com/jnsdls/react-perimeter#readme","_id":"react-listener-provider@0.1.0","_shasum":"306273ab8db2e90335aecd7a70d7a8c66b3788e6","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.9.4","_npmUser":{"name":"jnsdls","email":"jonas@bebo.com"},"dist":{"shasum":"306273ab8db2e90335aecd7a70d7a8c66b3788e6","tarball":"https://registry.npmjs.org/react-listener-provider/-/react-listener-provider-0.1.0.tgz","integrity":"sha512-83twzvpxVmXoYMpNJQWikEeAC5J5Pdb/r/LKOzef3nGk+uPeUl2yC2linJqwsb8VlMohsz9jlTBeBy6KUfkQAA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDfaP/Rca97xhc2N7iUKnE+gYFiR+fi0C3XRwduuYKwjAiBOPhyURvX2jiZKs2msycawdJz4s0ARhbvDInDwcPDSxw=="}]},"maintainers":[{"name":"jnsdls","email":"jonas@bebo.com"}],"_npmOperationalInternal":{"host":"packages-18-east.internal.npmjs.com","tmp":"tmp/react-listener-provider-0.1.0.tgz_1490079040798_0.7088632602244616"}},"0.1.1":{"name":"react-listener-provider","version":"0.1.1","main":"lib/index.js","license":"MIT","scripts":{"build":"rimraf lib && babel src --out-dir lib","prepublish":"npm run build"},"repository":{"type":"git","url":"git+https://github.com/jnsdls/react-listener-provider.git"},"author":{"name":"Jonas Daniels","email":"jonas@bebo.com","url":"https://www.twitter.com/jnsdls"},"devDependencies":{"babel-cli":"^6.24.0","babel-plugin-transform-class-properties":"^6.23.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-preset-env":"^1.2.2","babel-preset-react":"^6.23.0","flow-bin":"^0.41.0","invariant":"^2.2.2","rimraf":"^2.6.1"},"peerDependencies":{"react":"^15.4.2","react-dom":"^15.4.2"},"gitHead":"14a3e5339f387f9e7cdeeddc75e0a844f7898afc","description":"","bugs":{"url":"https://github.com/jnsdls/react-listener-provider/issues"},"homepage":"https://github.com/jnsdls/react-listener-provider#readme","_id":"react-listener-provider@0.1.1","_shasum":"8e6be2d356aff432f3110079c6f53d94248dc8d4","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.9.4","_npmUser":{"name":"jnsdls","email":"jonas@bebo.com"},"dist":{"shasum":"8e6be2d356aff432f3110079c6f53d94248dc8d4","tarball":"https://registry.npmjs.org/react-listener-provider/-/react-listener-provider-0.1.1.tgz","integrity":"sha512-q/ZQb8pkqSnEU3+arM47L+Gy389xpSXjrDoTWVFwv+6zWAnlI1EJmDVNok2M8+A6vFZ2qQvJSp5m6kTA4wLmnQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCnKOTk5Wv9SE5K2GmgmJdBumOGC9OZggeHcOVYqIsdKAIhANNmF7DhR1vELQcOGLtlPOojxKlckMJJ5y1i4e7y5HO8"}]},"maintainers":[{"name":"jnsdls","email":"jonas@bebo.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/react-listener-provider-0.1.1.tgz_1490079120302_0.7718396191485226"}},"0.1.2":{"name":"react-listener-provider","version":"0.1.2","main":"lib/index.js","license":"MIT","scripts":{"build":"rimraf lib && babel src --out-dir lib","prepublish":"npm run build"},"repository":{"type":"git","url":"git+https://github.com/jnsdls/react-listener-provider.git"},"author":{"name":"Jonas Daniels","email":"jonas@bebo.com","url":"https://www.twitter.com/jnsdls"},"devDependencies":{"babel-cli":"^6.24.0","babel-plugin-transform-class-properties":"^6.23.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-preset-env":"^1.2.2","babel-preset-react":"^6.23.0","flow-bin":"^0.41.0","invariant":"^2.2.2","rimraf":"^2.6.1"},"peerDependencies":{"react":"^15.4.2","react-dom":"^15.4.2"},"gitHead":"6308d99456c5afd8d371443ace3081f1277c6e9e","description":"Create a provider and use HOC (Higher Order Components) to listen for [Events](https://developer.mozilla.org/en-US/docs/Web/Events) in one place.","bugs":{"url":"https://github.com/jnsdls/react-listener-provider/issues"},"homepage":"https://github.com/jnsdls/react-listener-provider#readme","_id":"react-listener-provider@0.1.2","_shasum":"40338f198800f8991a8d9284f5617dffe51aebc1","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.9.4","_npmUser":{"name":"jnsdls","email":"jonas@bebo.com"},"dist":{"shasum":"40338f198800f8991a8d9284f5617dffe51aebc1","tarball":"https://registry.npmjs.org/react-listener-provider/-/react-listener-provider-0.1.2.tgz","integrity":"sha512-8W6nqc7OYS9j8BU6hlrtRlahal4OdVEpA/XsSe4ZNQvH5exd9XNlDwhqmINXlJKvD0JzZROri49cDkmleBW9gA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHkuH5x2cd+10C6m36UScq5oHyy8yl/D+x87lq/43CTUAiEAs2VOWBHFmAm1DaEwbF2Tqc136XO/j9PPBaywWGYZtFg="}]},"maintainers":[{"name":"jnsdls","email":"jonas@bebo.com"}],"_npmOperationalInternal":{"host":"packages-18-east.internal.npmjs.com","tmp":"tmp/react-listener-provider-0.1.2.tgz_1490115987208_0.9955454345326871"}},"0.2.0":{"name":"react-listener-provider","version":"0.2.0","main":"lib/index.js","license":"MIT","scripts":{"build":"rimraf lib && babel src --out-dir lib","prepublish":"npm run build"},"repository":{"type":"git","url":"git+https://github.com/jnsdls/react-listener-provider.git"},"author":{"name":"Jonas Daniels","email":"jonas@bebo.com","url":"https://www.twitter.com/jnsdls"},"devDependencies":{"babel-cli":"^6.24.0","babel-plugin-transform-class-properties":"^6.23.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-preset-env":"^1.2.2","babel-preset-react":"^6.23.0","flow-bin":"^0.41.0","invariant":"^2.2.2","rimraf":"^2.6.1"},"peerDependencies":{"react":"^15.0.0 || ^16.0.0","react-dom":"^15.0.0 || ^16.0.0","prop-types":"^15.5.8"},"gitHead":"7177497ed22391907c208c2acfd2b24d959459d0","description":"Create a provider and use HOC (Higher Order Components) to listen for [Events](https://developer.mozilla.org/en-US/docs/Web/Events) in one place.","bugs":{"url":"https://github.com/jnsdls/react-listener-provider/issues"},"homepage":"https://github.com/jnsdls/react-listener-provider#readme","_id":"react-listener-provider@0.2.0","_shasum":"fb6ce123f9e20ad948f75906ddf647db1df31f18","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.9.4","_npmUser":{"name":"jnsdls","email":"jonas@bebo.com"},"dist":{"shasum":"fb6ce123f9e20ad948f75906ddf647db1df31f18","tarball":"https://registry.npmjs.org/react-listener-provider/-/react-listener-provider-0.2.0.tgz","integrity":"sha512-pnCu+cgxEh9KsHynm1yffwqkxQeRpFXWlMtuI3qOEpmW77xgkg+048ep8KMqUkB4JkpBG2T6Z9BdYTBile9new==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGhiAQwcDYi2ezTY2S8Q57xbqaWnsmNqa8OaApkrn+bZAiBEVvJ1b5MPUDVfPr2Yry7yyOZ5LLDG1KfGfCE3V3FTEw=="}]},"maintainers":[{"name":"jnsdls","email":"jonas@bebo.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/react-listener-provider-0.2.0.tgz_1494156173353_0.2167108750436455"}}},"readme":"# react-listener-provider\n\nCreate a provider and use HOC (Higher Order Components) to listen for [Events](https://developer.mozilla.org/en-US/docs/Web/Events) in one place.\n\n\n## Usage Example\n\n`react-listener-provider` exports a `ReactListenerProvider` component as well as a `withListener()` wrapper function.\n\nComponents wrapped with `withListener()` will have an added prop `listener` which exposes `add()` and `remove()` methods.\n\n`add()` and `remove()` work just like `window.addEventListener()` and `window.removeEventListener()`, they take a `type ` argument and a `callback ` argument.\n\n```jsx\nimport React, { Component } from 'react';\nimport ReactListenerProvider, { withListener } from '../../src';\n\nclass MouseMove extends Component {\n state = { x: 0, y: 0 };\n\n componentDidMount() {\n const { add } = this.props.listener;\n add('mousemove', ({ clientX: x, clientY: y }) => this.setState({ x, y }));\n }\n\n componentWillUnmount() {\n const { remove } = this.props.listener;\n remove('mousemove', ({ clientX: x, clientY: y }) => this.setState({ x, y }));\n }\n\n render() {\n const { x, y } = this.state;\n return (\n
\n x: {x}\n - \n y: {y}\n
\n );\n }\n}\n\n\nconst WrappedComponent = withListener(MouseMove);\n\n\nclass App extends Component {\n render() {\n return (\n \n \n \n );\n }\n}\n```\n\n\n## Installation\n\n```\nyarn add react-listener-provider\n```\nSince version 0.2.0 you'll also need \"prop-types\" as a peer dependency.\n```\nyarn add prop-types\n```\n\n\n## API\n\n### Props\n\n#### ReactListenerProvider\n\n`none`\n\n#### Component wrapped with `withListener()`\n```jsx\nlistener: React.PropTypes.shape({\n add: React.PropTypes.func.isRequired,\n remove: React.PropTypes.func.isRequired\n }).isRequired\n```\n\n\n## Development\n\n1) clone this repo\n2) `yarn`\n3) `cd demo`\n4) `yarn && yarn start`\n\n\n## Attribution\n\nThe repo structure as well as the inspiration to create this project come from [react-perimiter](https://github.com/aweary/react-perimeter).\n\nThanks to [@aweary](https://github.com/aweary) for the encouragement.\n","maintainers":[{"name":"jnsdls","email":"jonas@bebo.com"}],"time":{"modified":"2022-06-26T01:14:31.990Z","created":"2017-03-21T06:50:42.622Z","0.1.0":"2017-03-21T06:50:42.622Z","0.1.1":"2017-03-21T06:52:00.592Z","0.1.2":"2017-03-21T17:06:29.120Z","0.2.0":"2017-05-07T11:22:55.255Z"},"homepage":"https://github.com/jnsdls/react-listener-provider#readme","repository":{"type":"git","url":"git+https://github.com/jnsdls/react-listener-provider.git"},"author":{"name":"Jonas Daniels","email":"jonas@bebo.com","url":"https://www.twitter.com/jnsdls"},"bugs":{"url":"https://github.com/jnsdls/react-listener-provider/issues"},"license":"MIT","readmeFilename":"README.md","description":"Create a provider and use HOC (Higher Order Components) to listen for [Events](https://developer.mozilla.org/en-US/docs/Web/Events) in one place."}