├── .github └── FUNDING.yml ├── .gitignore ├── .npmignore ├── LICENSE ├── README.md ├── bin └── .gitkeep ├── contributors.md ├── lib ├── EventManager.d.ts ├── EventManager.js ├── EventManager.js.map ├── esm.d.ts ├── esm.js ├── esm.js.map ├── index.d.ts ├── index.js └── index.js.map ├── makefile.js ├── package-lock.json ├── package.json ├── samples └── .gitkeep ├── src ├── bin │ └── .gitkeep ├── lib │ ├── EventManager.ts │ ├── esm.ts │ └── index.ts ├── samples │ └── .gitkeep └── test │ └── .gitkeep ├── test └── .gitkeep └── tsconfig.json /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | github: [eserozvataf] 4 | patreon: eserozvataf 5 | open_collective: eser 6 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # npm 2 | node_modules/ 3 | 4 | # OS X 5 | .DS_Store 6 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | # npm 2 | node_modules/ 3 | 4 | # OS X 5 | .DS_Store 6 | 7 | # Git 8 | .git* 9 | 10 | # TypeScript 11 | tsconfig.json 12 | 13 | # jsmake 14 | makefile.js 15 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | 2 | Copyright 2017 Eser Ozvataf 3 | 4 | Licensed under the Apache License, Version 2.0 (the "License"); 5 | you may not use this file except in compliance with the License. 6 | You may obtain a copy of the License at 7 | 8 | http://www.apache.org/licenses/LICENSE-2.0 9 | 10 | Unless required by applicable law or agreed to in writing, software 11 | distributed under the License is distributed on an "AS IS" BASIS, 12 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 13 | See the License for the specific language governing permissions and 14 | limitations under the License. 15 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # [React-EventManager](https://github.com/eserozvataf/react-eventmanager) 2 | 3 | [![npm version][npm-image]][npm-url] 4 | [![npm download][download-image]][npm-url] 5 | [![dependencies][dep-image]][dep-url] 6 | [![license][license-image]][license-url] 7 | 8 | 9 | ## Update 10 | 11 | This project became redundant when React Hooks is introduced. So it's deprecated in favor of React's newer versions. 12 | 13 | 14 | ## What is the React-EventManager? 15 | 16 | React-EventManager is an alternative method of handling states on React views. 17 | 18 | 19 | ## Quick start 20 | 21 | Execute `npm install react-eventmanager` to install react-eventmanager and its dependencies into your project directory. 22 | 23 | 24 | ## Usage 25 | 26 | To handle events in React view: 27 | 28 | ```js 29 | import * as React from 'react'; 30 | import eventManager from 'react-eventmanager'; 31 | 32 | @eventManager.subscription({ 33 | userChanged: 'onUserChanged' 34 | }) 35 | class SampleContainer extends React.Component { 36 | constructor() { 37 | super(); 38 | 39 | this.state = { 40 | userName: 'User-1' 41 | }; 42 | } 43 | 44 | onUserChanged(userName) { 45 | this.setState({ 46 | userName: userName 47 | }); 48 | } 49 | 50 | render() { 51 | return ( 52 |
53 | {this.state.userName} 54 |
55 | ); 56 | } 57 | } 58 | ``` 59 | 60 | To invoke a change: 61 | 62 | ```js 63 | import eventManager from 'react-eventmanager'; 64 | 65 | eventManager.emit('userChanged', 'Eser Ozvataf'); 66 | ``` 67 | 68 | 69 | ## Todo List 70 | 71 | See [GitHub Projects](https://github.com/eserozvataf/react-eventmanager/projects) for more. 72 | 73 | 74 | ## Requirements 75 | 76 | * node.js (https://nodejs.org/) 77 | 78 | 79 | ## License 80 | 81 | Apache 2.0, for further details, please see [LICENSE](LICENSE) file 82 | 83 | 84 | ## Contributing 85 | 86 | See [contributors.md](contributors.md) 87 | 88 | It is publicly open for any contribution. Bugfixes, new features and extra modules are welcome. 89 | 90 | * To contribute to code: Fork the repo, push your changes to your fork, and submit a pull request. 91 | * To report a bug: If something does not work, please report it using [GitHub Issues](https://github.com/eserozvataf/react-eventmanager/issues). 92 | 93 | 94 | ## To Support 95 | 96 | [Visit my patreon profile at patreon.com/eserozvataf](https://www.patreon.com/eserozvataf) 97 | 98 | 99 | [npm-image]: https://img.shields.io/npm/v/react-eventmanager.svg?style=flat-square 100 | [npm-url]: https://www.npmjs.com/package/react-eventmanager 101 | [download-image]: https://img.shields.io/npm/dt/react-eventmanager.svg?style=flat-square 102 | [dep-image]: https://img.shields.io/david/eserozvataf/react-eventmanager.svg?style=flat-square 103 | [dep-url]: https://github.com/eserozvataf/react-eventmanager 104 | [license-image]: https://img.shields.io/npm/l/react-eventmanager.svg?style=flat-square 105 | [license-url]: https://github.com/eserozvataf/react-eventmanager/blob/master/LICENSE 106 | -------------------------------------------------------------------------------- /bin/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/eser/react-eventmanager/cc7de64db84284f7ac2b83b1159a87f5a45f07dd/bin/.gitkeep -------------------------------------------------------------------------------- /contributors.md: -------------------------------------------------------------------------------- 1 | # Contributors 2 | 3 | ## Committers 4 | 5 | * Eser Ozvataf - @eserozvataf (http://eser.ozvataf.com/) 6 | -------------------------------------------------------------------------------- /lib/EventManager.d.ts: -------------------------------------------------------------------------------- 1 | import { EventEmitter } from 'es6-eventemitter/lib/esm'; 2 | declare class EventManager extends EventEmitter { 3 | subscription(mapping: { 4 | [key: string]: string; 5 | }): {}>(target: T) => { 6 | new (...args: any[]): { 7 | componentDidMount(): void; 8 | componentWillUnmount(): void; 9 | }; 10 | } & T; 11 | } 12 | declare const eventManager: EventManager; 13 | export { EventManager, eventManager }; 14 | export default eventManager; 15 | -------------------------------------------------------------------------------- /lib/EventManager.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | const esm_1 = require("es6-eventemitter/lib/esm"); 4 | class EventManager extends esm_1.EventEmitter { 5 | subscription(mapping) { 6 | const self = this; 7 | return function (target) { 8 | return class extends target { 9 | componentDidMount() { 10 | for (const eventName in mapping) { 11 | self.on(eventName, this[mapping[eventName]].bind(this)); 12 | } 13 | if (super['componentDidMount'] !== undefined) { 14 | super['componentDidMount'].apply(this, arguments); 15 | } 16 | } 17 | componentWillUnmount() { 18 | for (const eventName in mapping) { 19 | self.off(eventName, this[mapping[eventName]].bind(this)); 20 | } 21 | if (super['componentWillUnmount'] !== undefined) { 22 | super['componentWillUnmount'].apply(this, arguments); 23 | } 24 | } 25 | }; 26 | }; 27 | } 28 | } 29 | exports.EventManager = EventManager; 30 | const eventManager = new EventManager(); 31 | exports.eventManager = eventManager; 32 | exports.default = eventManager; 33 | //# sourceMappingURL=EventManager.js.map -------------------------------------------------------------------------------- /lib/EventManager.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"EventManager.js","sourceRoot":"","sources":["../src/lib/EventManager.ts"],"names":[],"mappings":";;AAAA,kDAAwD;AAWxD,kBAAmB,SAAQ,kBAAY;IACnC,YAAY,CAAC,OAAkC;QAC3C,MAAM,IAAI,GAAG,IAAI,CAAC;QAElB,MAAM,CAAC,UAAgD,MAAS;YAC5D,MAAM,CAAC,KAAM,SAAQ,MAAM;gBACvB,iBAAiB;oBACb,GAAG,CAAC,CAAC,MAAM,SAAS,IAAI,OAAO,CAAC,CAAC,CAAC;wBAC9B,IAAI,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;oBAC5D,CAAC;oBAED,EAAE,CAAC,CAAC,KAAK,CAAC,mBAAmB,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC;wBAC3C,KAAK,CAAC,mBAAmB,CAAC,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;oBACtD,CAAC;gBACL,CAAC;gBAED,oBAAoB;oBAChB,GAAG,CAAC,CAAC,MAAM,SAAS,IAAI,OAAO,CAAC,CAAC,CAAC;wBAC9B,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;oBAC7D,CAAC;oBAED,EAAE,CAAC,CAAC,KAAK,CAAC,sBAAsB,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC;wBAC9C,KAAK,CAAC,sBAAsB,CAAC,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;oBACzD,CAAC;gBACL,CAAC;aACJ,CAAA;QACL,CAAC,CAAC;IACN,CAAC;CACJ;AAKG,oCAAY;AAHhB,MAAM,YAAY,GAAG,IAAI,YAAY,EAAE,CAAC;AAIpC,oCAAY;AAGhB,kBAAe,YAAY,CAAC"} -------------------------------------------------------------------------------- /lib/esm.d.ts: -------------------------------------------------------------------------------- 1 | import { EventManager, eventManager } from './EventManager'; 2 | export { EventManager, eventManager }; 3 | export default eventManager; 4 | -------------------------------------------------------------------------------- /lib/esm.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | const EventManager_1 = require("./EventManager"); 4 | exports.EventManager = EventManager_1.EventManager; 5 | exports.eventManager = EventManager_1.eventManager; 6 | exports.default = EventManager_1.eventManager; 7 | //# sourceMappingURL=esm.js.map -------------------------------------------------------------------------------- /lib/esm.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"esm.js","sourceRoot":"","sources":["../src/lib/esm.ts"],"names":[],"mappings":";;AAAA,iDAA4D;AAGxD,uBAHK,2BAAY,CAGL;AACZ,uBAJmB,2BAAY,CAInB;AAGhB,kBAAe,2BAAY,CAAC"} -------------------------------------------------------------------------------- /lib/index.d.ts: -------------------------------------------------------------------------------- 1 | import { eventManager } from './EventManager'; 2 | export = eventManager; 3 | -------------------------------------------------------------------------------- /lib/index.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | const EventManager_1 = require("./EventManager"); 3 | module.exports = EventManager_1.eventManager; 4 | //# sourceMappingURL=index.js.map -------------------------------------------------------------------------------- /lib/index.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/lib/index.ts"],"names":[],"mappings":";AAAA,iDAA8C;AAE9C,iBAAS,2BAAY,CAAC"} -------------------------------------------------------------------------------- /makefile.js: -------------------------------------------------------------------------------- 1 | jsmake.desc('Bumps the package version for next release.'); 2 | jsmake.task('bump', function (argv) { 3 | jsmake.utils.packageJsonVersionBump('./package.json', argv.type || 'patch') 4 | .then((version) => { 5 | console.log('Bumped to version ' + version + '.'); 6 | }); 7 | }); 8 | 9 | jsmake.tasks.bump.parameters.setRule( 10 | 'type', 11 | { 12 | type: String, 13 | description: 'Increment type [major, minor, patch, premajor, preminor, prepatch or prerelease]' 14 | } 15 | ); 16 | 17 | jsmake.desc('Publishes package to npm.'); 18 | jsmake.task('publish', function (argv) { 19 | jsmake.utils.npmPublish(); 20 | }); 21 | 22 | jsmake.desc('Reinstalls dependencies from npm.'); 23 | jsmake.task('deps', function (argv) { 24 | jsmake.utils.fs.rmdirP('node_modules') 25 | .then(() => { 26 | jsmake.utils.os.shell('npm install'); 27 | }); 28 | }); 29 | 30 | jsmake.desc('Builds the source code.'); 31 | jsmake.task('build', function (argv) { 32 | jsmake.utils.os.shell('tsc'); 33 | }); 34 | -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-eventmanager", 3 | "version": "0.0.1", 4 | "lockfileVersion": 1, 5 | "requires": true, 6 | "dependencies": { 7 | "es6-eventemitter": { 8 | "version": "0.8.4", 9 | "resolved": "https://registry.npmjs.org/es6-eventemitter/-/es6-eventemitter-0.8.4.tgz", 10 | "integrity": "sha512-STnlcfVbOmAZ7giITOB13Zm0Wi+0fomG/9jryXAaQAfH1te4JYjz6pHFf/8ehb6wLgpiz4L6FmVStvHoXa+jOA==", 11 | "requires": { 12 | "immunity": "0.8.4" 13 | } 14 | }, 15 | "immunity": { 16 | "version": "0.8.4", 17 | "resolved": "https://registry.npmjs.org/immunity/-/immunity-0.8.4.tgz", 18 | "integrity": "sha512-w0sCmCxEuUP46wv8XzG56Mk6zPlRg+mk0DBkBTtOGo8dCd0zoIOYc4JiM0hajuYJQB6lM8FvRp5x2hkPVc80uw==", 19 | "requires": { 20 | "ponyfills": "0.8.4" 21 | } 22 | }, 23 | "ponyfills": { 24 | "version": "0.8.4", 25 | "resolved": "https://registry.npmjs.org/ponyfills/-/ponyfills-0.8.4.tgz", 26 | "integrity": "sha512-azytx0c0lF1hnJ7fsGDMd+buBtZ/JEg/2Grb1MIl5X7iYqfVO2it97lOOllpyynlqsHrmEd14/FUTnc1ObBSKg==" 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-eventmanager", 3 | "description": "An Event Manager implementation for React", 4 | "keywords": [ 5 | "events", 6 | "event", 7 | "emitter", 8 | "es6", 9 | "react", 10 | "state", 11 | "manager", 12 | "decorators" 13 | ], 14 | "version": "0.0.3", 15 | "homepage": "", 16 | "author": "Eser Ozvataf ", 17 | "contributors": [ 18 | { 19 | "name": "Eser Ozvataf", 20 | "email": "eser@ozvataf.com", 21 | "url": "http://eser.ozvataf.com/" 22 | } 23 | ], 24 | "repository": { 25 | "type": "git", 26 | "url": "git+https://github.com/eserozvataf/react-eventmanager.git" 27 | }, 28 | "bugs": { 29 | "url": "https://github.com/eserozvataf/react-eventmanager/issues", 30 | "email": "eser@ozvataf.com" 31 | }, 32 | "license": "Apache-2.0", 33 | "main": "./lib/index.js", 34 | "module": "./lib/esm.js", 35 | "types": "./lib/index.d.ts", 36 | "engines": { 37 | "node": ">=8.0.0" 38 | }, 39 | "scripts": {}, 40 | "directories": { 41 | "lib": "./lib" 42 | }, 43 | "files": [ 44 | "lib", 45 | "bin" 46 | ], 47 | "bin": {}, 48 | "dependencies": { 49 | "es6-eventemitter": "^0.8.4" 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /samples/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/eser/react-eventmanager/cc7de64db84284f7ac2b83b1159a87f5a45f07dd/samples/.gitkeep -------------------------------------------------------------------------------- /src/bin/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/eser/react-eventmanager/cc7de64db84284f7ac2b83b1159a87f5a45f07dd/src/bin/.gitkeep -------------------------------------------------------------------------------- /src/lib/EventManager.ts: -------------------------------------------------------------------------------- 1 | import { EventEmitter } from 'es6-eventemitter/lib/esm'; 2 | 3 | type EventManagedType = { 4 | // componentDidMount?(): void; 5 | // componentWillUnmount?(): void; 6 | }; 7 | 8 | type EventManagedTypeConstructor = { 9 | new(...args: any[]): EventManagedType; 10 | }; 11 | 12 | class EventManager extends EventEmitter { 13 | subscription(mapping: { [key: string]: string }) { 14 | const self = this; 15 | 16 | return function(target: T) { 17 | return class extends target { 18 | componentDidMount(): void { 19 | for (const eventName in mapping) { 20 | self.on(eventName, this[mapping[eventName]].bind(this)); 21 | } 22 | 23 | if (super['componentDidMount'] !== undefined) { 24 | super['componentDidMount'].apply(this, arguments); 25 | } 26 | } 27 | 28 | componentWillUnmount(): void { 29 | for (const eventName in mapping) { 30 | self.off(eventName, this[mapping[eventName]].bind(this)); 31 | } 32 | 33 | if (super['componentWillUnmount'] !== undefined) { 34 | super['componentWillUnmount'].apply(this, arguments); 35 | } 36 | } 37 | } 38 | }; 39 | } 40 | } 41 | 42 | const eventManager = new EventManager(); 43 | 44 | export { 45 | EventManager, 46 | eventManager 47 | }; 48 | 49 | export default eventManager; 50 | -------------------------------------------------------------------------------- /src/lib/esm.ts: -------------------------------------------------------------------------------- 1 | import { EventManager, eventManager } from './EventManager'; 2 | 3 | export { 4 | EventManager, 5 | eventManager 6 | }; 7 | 8 | export default eventManager; 9 | -------------------------------------------------------------------------------- /src/lib/index.ts: -------------------------------------------------------------------------------- 1 | import { eventManager } from './EventManager'; 2 | 3 | export = eventManager; 4 | -------------------------------------------------------------------------------- /src/samples/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/eser/react-eventmanager/cc7de64db84284f7ac2b83b1159a87f5a45f07dd/src/samples/.gitkeep -------------------------------------------------------------------------------- /src/test/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/eser/react-eventmanager/cc7de64db84284f7ac2b83b1159a87f5a45f07dd/src/test/.gitkeep -------------------------------------------------------------------------------- /test/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/eser/react-eventmanager/cc7de64db84284f7ac2b83b1159a87f5a45f07dd/test/.gitkeep -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "target": "es2017", 5 | "module": "commonjs", 6 | "moduleResolution": "node", 7 | "sourceMap": true, 8 | "declaration": true, 9 | "experimentalDecorators": true, 10 | "noImplicitAny": false, 11 | "removeComments": true, 12 | "strictNullChecks": true, 13 | "strict": true, 14 | "newLine": "LF", 15 | "rootDir": "./src/", 16 | "outDir": "./" 17 | }, 18 | "include": [ 19 | "./src/**/*" 20 | ], 21 | "exclude": [ 22 | "./node_modules" 23 | ] 24 | } 25 | --------------------------------------------------------------------------------