diff --git a/.eslintrc b/.eslintrc index 0f3482c..8a4533c 100644 --- a/.eslintrc +++ b/.eslintrc @@ -69,6 +69,7 @@ "indent": [2, 2, {"SwitchCase": 1}], "init-declarations": 0, "key-spacing": [2, {"beforeColon": false, "afterColon": true}], + "keyword-spacing": 2, "linebreak-style": 2, "lines-around-comment": 0, "max-depth": 0, @@ -100,7 +101,6 @@ "no-else-return": 2, "no-empty": 2, "no-empty-character-class": 2, - "no-empty-label": 2, "no-eq-null": 0, "no-eval": 2, "no-ex-assign": 2, @@ -171,7 +171,6 @@ "no-unneeded-ternary": 2, "no-unreachable": 2, "no-unused-expressions": 2, - "no-unused-vars": [2, {"vars": "all", "args": "after-used"}], "no-use-before-define": 0, "no-useless-call": 2, "no-var": 0, @@ -194,12 +193,10 @@ "semi": [2, "always"], "semi-spacing": [2, {"before": false, "after": true}], "sort-vars": 0, - "space-after-keywords": [2, "always"], "space-before-blocks": [2, "always"], "space-before-function-paren": [2, {"anonymous": "always", "named": "never"}], "space-in-parens": 0, "space-infix-ops": [2, {"int32Hint": false}], - "space-return-throw-case": 2, "space-unary-ops": [2, {"words": true, "nonwords": false}], "spaced-comment": [2, "always"], "strict": 0, diff --git a/CHANGELOG.md b/CHANGELOG.md deleted file mode 100644 index 79f460f..0000000 --- a/CHANGELOG.md +++ /dev/null @@ -1,17 +0,0 @@ -# ChangeLog - -### v1.2.0 - -* Update React to v15.0.0 - -### v1.1.0 - -* Add support for React Native. See [PR4](https://github.com/kadirahq/react-simple-di/pull/4) - -### v1.0.1 -* Fix issue of re-binding context to action multiple times as we apply context multiple time. -See: [#2](https://github.com/kadirahq/react-simple-di/issues/2) - -### v1.0.0 - -Initial Version. diff --git a/README.md b/README.md index fb29ad8..f1f5b4b 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,30 @@ -# react-simple-di +# hymn-di -Simple dependancy injection solution for React. +Simple dependency injection solution for React. + +The base of this project stems from react-simple-di. It is not intended to be backwards-compatible, as it will introduce breaking updates & new features. + +### Differences from react-simple-di + +* Ability to module-namespace actions + - See https://github.com/kadirahq/mantra/issues/199 for details ### Installation ``` -npm i react-simple-di +npm i hymn-di ``` ### Intro -In `react-simple-di`, we've two types of dependencies, they are: +In `hymn-di`, we've two types of dependencies, they are: 1. context - These are usually, configurations, models and client for different remote data solutions. 2. actions - Actions are simple functions which used to perform business logic with the help of the above context. -> Every action will receive the `context` as it's first argument. +> Every action will receive the `context` as it's first argument and `actions` as it's second argument. -### Injecting Dependancies +### Injecting Dependencies First, we need to inject dependencies to a root level React component. Mostly, this will be the main layout component of our app. @@ -45,7 +52,7 @@ First we've defined our context. Then, we have our actions. Here actions must fo Let's inject our dependencies: ```js -import {injectDeps} from 'react-simple-di'; +import { injectDeps } from 'hymn-di'; import Layout from './layout.jsx'; // Above mentioned actions and context are defined here. @@ -55,13 +62,13 @@ const LayoutWithDeps = injectDeps(context, actions)(Layout); Now you can use `LayoutWithDeps` anywhere in your app. -## Using Depedencies +## Using Dependencies Any component rendered inside `LayoutWithDeps` can access both context and actions. -When using dependecies it will compose a new React component and pass dependencies via props to the original component. +When using dependencies it will compose a new React component and pass dependencies via props to the original component. -First let's create our UI component. Here it will expect dependecies to come via props `appName` and `createPost`. +First let's create our UI component. Here it will expect dependencies to come via props `appName` and `createPost`. ```js class CreatePost extends React.Component { @@ -85,7 +92,7 @@ class CreatePost extends React.Component { So, let's use dependencies: ```js -const {useDeps} from 'react-simple-di'; +const { useDeps } from 'hymn-di'; // Assume above mentioned CreatePost react component is // defined here. @@ -100,11 +107,11 @@ const CreatePostWithDeps = useDeps(depsToPropsMapper)(CreatePost); That's it. -> Note: Here when calling the `actions.posts.create` action, you don't need to provide the context as the first argument. It'll handle by `react-simple-di`. +> Note: Here when calling the `actions.posts.create` action, you don't need to provide the context as the first argument. It'll handle by `hymn-di`. **Default Mapper** -If you didn't provide a mapper function, useDeps will use a default mapper function will allows you to get context and props directy. Here's that default mapper: +If you didn't provide a mapper function, useDeps will use a default mapper function will allows you to get context and props directly. Here's that default mapper: ```js const mapper = (context, actions) => ({ diff --git a/index.js b/index.js index b91eb38..f4f0e99 100644 --- a/index.js +++ b/index.js @@ -1 +1 @@ -module.exports = require('./dist/index'); \ No newline at end of file +module.exports = require('./dist/index'); diff --git a/package.json b/package.json index 1099e6f..208c925 100644 --- a/package.json +++ b/package.json @@ -1,47 +1,55 @@ { - "name": "react-simple-di", - "version": "1.2.0", - "description": "Simple Dependancy Injection Solution for React", + "name": "hymn-di", + "version": "1.0.0", + "description": "Simple dependancy injection solution for React", "repository": { "type": "git", - "url": "https://github.com/kadirahq/react-simple-di" + "url": "https://github.com/markoshust/hymn-di" }, "license": "MIT", "options": { "mocha": "--require scripts/mocha_runner lib/**/__tests__/**/*.js" }, "scripts": { - "prepublish": ". ./scripts/prepublish.sh", "lint": "eslint ./lib", "lintfix": "eslint ./lib --fix", - "testonly": "mocha $npm_package_options_mocha", - "test": "npm run lint && npm run testonly" + "prepublish": ". ./scripts/prepublish.sh", + "start": "babel src -d dist --watch", + "test": "npm run lint && npm run testonly", + "test-watch": "npm run testonly -- --watch --watch-extensions js", + "testonly": "mocha $npm_package_options_mocha" }, "devDependencies": { - "nodemon": "1.7.x", - "mocha": "2.x.x", - "chai": "3.x.x", - "eslint": "1.7.x", - "eslint-plugin-react": "3.x.x", - "babel-eslint": "4.x.x", - "eslint-plugin-babel": "2.x.x", "babel-cli": "6.x.x", "babel-core": "6.x.x", + "babel-eslint": "4.x.x", + "babel-plugin-transform-runtime": "6.x.x", "babel-polyfill": "6.x.x", "babel-preset-es2015": "6.x.x", - "babel-preset-stage-2": "6.x.x", "babel-preset-react": "6.x.x", - "babel-plugin-transform-runtime": "6.x.x", - "react": "^15.0.0", - "react-dom": "^15.0.0", - "react-addons-test-utils": "^15.0.0", - "enzyme": "^2.2.0" - }, - "peerDependencies": { - "react": "^0.14.0 || ^15.0.0" + "babel-preset-stage-2": "6.x.x", + "chai": "3.x.x", + "enzyme": "2.x.x", + "eslint": "3.x.x", + "eslint-config-airbnb": "10.x.x", + "eslint-plugin-babel": "3.x.x", + "eslint-plugin-import": "1.x.x", + "eslint-plugin-jsx-a11y": "2.x.x", + "eslint-plugin-react": "6.x.x", + "estraverse": "4.x.x", + "estraverse-fb": "1.x.x", + "lodash.sortby": "4.x.x", + "mocha": "3.x.x", + "nodemon": "1.x.x", + "react": "15.x.x", + "react-addons-test-utils": "15.x.x", + "react-dom": "15.x.x" }, "dependencies": { "babel-runtime": "6.x.x", "hoist-non-react-statics": "1.x.x" + }, + "peerDependencies": { + "react": "^0.14.0 || ^15.0.0" } }