├── .babelrc ├── .editorconfig ├── .eslintignore ├── .eslintrc ├── .github ├── ISSUE_TEMPLATE.md └── PULL_REQUEST_TEMPLATE.md ├── .gitignore ├── .travis.yml ├── CHANGELOG.md ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── LICENSE.md ├── README.md ├── docs ├── Introduction.md ├── README.md ├── components │ ├── bindProps.md │ ├── clone.md │ ├── component.md │ ├── computedProps.md │ ├── defaultProps.md │ ├── displayName.md │ ├── handleRenderError.md │ ├── hoc.md │ ├── initialState.md │ ├── mapProps.md │ ├── propTypes.md │ ├── pureComponent.md │ ├── renameProps.md │ ├── renderChildren.md │ ├── renderComponent.md │ ├── renderNothing.md │ ├── transferProps.md │ └── withStyles.md ├── context │ ├── childContext.md │ ├── childContextTypes.md │ ├── context.md │ └── contextTypes.md ├── events │ ├── extractCurrentTarget.md │ ├── extractDataset.md │ ├── extractFromEvent.md │ ├── extractNativeEvent.md │ ├── extractTarget.md │ ├── extractValue.md │ ├── killEvent.md │ ├── preventDefault.md │ └── stopPropagation.md ├── functions │ ├── autobind.md │ ├── debounce.md │ ├── inject.md │ ├── injectProps.md │ ├── injectState.md │ ├── lock.md │ ├── log.md │ ├── measure.md │ ├── throttle.md │ ├── time.md │ └── trace.md ├── lifecycle │ ├── componentDidMount.md │ ├── componentDidUpdate.md │ ├── componentWillMount.md │ ├── componentWillReceiveProps.md │ ├── componentWillUnmount.md │ ├── componentWillUpdate.md │ ├── lifecycle.md │ └── shouldComponentUpdate.md └── others │ └── property.md ├── package.json ├── src ├── decorators │ ├── components │ │ ├── bindProps.js │ │ ├── clone.js │ │ ├── component.js │ │ ├── computedProps.js │ │ ├── defaultProps.js │ │ ├── displayName.js │ │ ├── handleRenderError.js │ │ ├── hoc.js │ │ ├── initialState.js │ │ ├── mapProps.js │ │ ├── propTypes.js │ │ ├── pureComponent.js │ │ ├── renameProps.js │ │ ├── renderChildren.js │ │ ├── renderComponent.js │ │ ├── renderNothing.js │ │ ├── transferProps.js │ │ └── withStyles.js │ ├── context │ │ ├── childContext.js │ │ ├── childContextTypes.js │ │ ├── context.js │ │ └── contextTypes.js │ ├── events │ │ ├── extractCurrentTarget.js │ │ ├── extractDataset.js │ │ ├── extractFromEvent.js │ │ ├── extractNativeEvent.js │ │ ├── extractTarget.js │ │ ├── extractValue.js │ │ ├── killEvent.js │ │ ├── preventDefault.js │ │ └── stopPropagation.js │ ├── functions │ │ ├── autobind.js │ │ ├── debounce.js │ │ ├── inject.js │ │ ├── injectProps.js │ │ ├── injectState.js │ │ ├── lock.js │ │ ├── log.js │ │ ├── measure.js │ │ ├── throttle.js │ │ ├── time.js │ │ └── trace.js │ ├── lifecycle │ │ ├── componentDidMount.js │ │ ├── componentDidUpdate.js │ │ ├── componentWillMount.js │ │ ├── componentWillReceiveProps.js │ │ ├── componentWillUnmount.js │ │ ├── componentWillUpdate.js │ │ ├── lifecycle.js │ │ └── shouldComponentUpdate.js │ └── others │ │ └── property.js ├── index.js └── utils │ ├── getEventPreprocessor.js │ ├── validators.js │ └── wrapLifecycleMethod.js ├── test ├── components.spec.js ├── context.spec.js ├── events.spec.js ├── functions.spec.js ├── lifecycle.spec.js ├── others.spec.js ├── setup.js └── utils.spec.js └── webpack.config.js /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["es2015", "stage-0", "react"], 3 | "plugins": [ 4 | "transform-decorators-legacy", 5 | "transform-object-rest-spread", 6 | "transform-es3-member-expression-literals", 7 | "transform-es3-property-literals" 8 | ], 9 | "env": { 10 | "commonjs": { 11 | "plugins": [ 12 | ["transform-es2015-modules-commonjs", { "loose": true }]] 13 | }, 14 | "es": { 15 | "plugins": [] 16 | } 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig helps developers define and maintain 2 | # consistent coding styles between different editors and IDEs. 3 | 4 | root = true 5 | 6 | [*] 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | indent_style = tab 12 | indent_size = 2 13 | 14 | [*.md] 15 | trim_trailing_whitespace = false 16 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | **/dist/** 2 | **/node_modules/** -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "ecmaFeatures": { 3 | "jsx": true, 4 | "modules": true 5 | }, 6 | "env": { 7 | "browser": true, 8 | "node": true 9 | }, 10 | "parser": "babel-eslint", 11 | "rules": { 12 | "valid-jsdoc": 2, 13 | "quotes": [2, "single"], 14 | "strict": [2, "never"], 15 | "react/jsx-uses-react": 2, 16 | "react/jsx-uses-vars": 2, 17 | "react/react-in-jsx-scope": 2 18 | }, 19 | "plugins": [ 20 | "react" 21 | ], 22 | "extends": "airbnb", 23 | "globals": { 24 | "describe" : false, 25 | "it" : false, 26 | "before" : false, 27 | "beforeEach" : false, 28 | "after" : false, 29 | "afterEach" : false 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | **General Information** 2 | 3 | - [ ] Bug 4 | - [ ] Improvement 5 | - [ ] Feature 6 | - [ ] Other 7 | 8 | **Description** 9 | 10 | (Add images if possible) 11 | 12 | **Steps to reproduce** 13 | 14 | (Add link to a demo on https://jsfiddle.net or similar if possible) 15 | 16 | **Versions** 17 | 18 | - react-decoration: 19 | - Browser: 20 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | - [ ] Pull request has tests / docs demo, and is linted. 2 | - [ ] Description explains the issue / use-case resolved, and auto-closes the related issue(s) (https://help.github.com/articles/closing-issues-via-commit-messages/). 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | *.log 4 | dist 5 | lib 6 | es 7 | coverage 8 | _book 9 | .nyc_output 10 | TODO.md 11 | package-lock.json -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - "4" 4 | - "5" 5 | - "6" 6 | - "7" 7 | - "8" 8 | script: 9 | - npm run check:src 10 | - npm run build 11 | branches: 12 | only: 13 | - master 14 | cache: 15 | directories: 16 | - $HOME/.npm 17 | after_success: npm run test:cov 18 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | This project adheres to [Semantic Versioning](http://semver.org/). 4 | Every release, along with the migration instructions, is documented on the Github [Releases](https://github.com/mbasso/react-decoration/releases) page. 5 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | In the interest of fostering an open and welcoming environment, we as 6 | contributors and maintainers pledge to making participation in our project and 7 | our community a harassment-free experience for everyone, regardless of age, body 8 | size, disability, ethnicity, gender identity and expression, level of experience, 9 | nationality, personal appearance, race, religion, or sexual identity and 10 | orientation. 11 | 12 | ## Our Standards 13 | 14 | Examples of behavior that contributes to creating a positive environment 15 | include: 16 | 17 | * Using welcoming and inclusive language 18 | * Being respectful of differing viewpoints and experiences 19 | * Gracefully accepting constructive criticism 20 | * Focusing on what is best for the community 21 | * Showing empathy towards other community members 22 | 23 | Examples of unacceptable behavior by participants include: 24 | 25 | * The use of sexualized language or imagery and unwelcome sexual attention or 26 | advances 27 | * Trolling, insulting/derogatory comments, and personal or political attacks 28 | * Public or private harassment 29 | * Publishing others' private information, such as a physical or electronic 30 | address, without explicit permission 31 | * Other conduct which could reasonably be considered inappropriate in a 32 | professional setting 33 | 34 | ## Our Responsibilities 35 | 36 | Project maintainers are responsible for clarifying the standards of acceptable 37 | behavior and are expected to take appropriate and fair corrective action in 38 | response to any instances of unacceptable behavior. 39 | 40 | Project maintainers have the right and responsibility to remove, edit, or 41 | reject comments, commits, code, wiki edits, issues, and other contributions 42 | that are not aligned to this Code of Conduct, or to ban temporarily or 43 | permanently any contributor for other behaviors that they deem inappropriate, 44 | threatening, offensive, or harmful. 45 | 46 | ## Scope 47 | 48 | This Code of Conduct applies both within project spaces and in public spaces 49 | when an individual is representing the project or its community. Examples of 50 | representing a project or community include using an official project e-mail 51 | address, posting via an official social media account, or acting as an appointed 52 | representative at an online or offline event. Representation of a project may be 53 | further defined and clarified by project maintainers. 54 | 55 | ## Enforcement 56 | 57 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 58 | reported by contacting the project team at [INSERT EMAIL ADDRESS]. All 59 | complaints will be reviewed and investigated and will result in a response that 60 | is deemed necessary and appropriate to the circumstances. The project team is 61 | obligated to maintain confidentiality with regard to the reporter of an incident. 62 | Further details of specific enforcement policies may be posted separately. 63 | 64 | Project maintainers who do not follow or enforce the Code of Conduct in good 65 | faith may face temporary or permanent repercussions as determined by other 66 | members of the project's leadership. 67 | 68 | ## Attribution 69 | 70 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, 71 | available at [http://contributor-covenant.org/version/1/4][version] 72 | 73 | [homepage]: http://contributor-covenant.org 74 | [version]: http://contributor-covenant.org/version/1/4/ 75 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Contributing 2 | 3 | We are pleased to receive any contribution by the community. By contributing to react-decoration, you agree to abide by the [code of conduct](https://github.com/mbasso/react-decoration/blob/master/CODE_OF_CONDUCT.md). 4 | 5 | ## Issues 6 | 7 | Before opening an issue, please search the [issue tracker](https://github.com/mbasso/react-decoration/issues) to make sure your issue hasn’t already been reported. 8 | Please follow our guidelines when opening an issue, in that way we can understand your problem easily and we can help you faster. 9 | 10 | ### Bugs and Improvements 11 | 12 | Bugs and Improvements in general can be discussed on the [issue tracker](https://github.com/mbasso/react-decoration/issues), make sure that there aren't other issues with the same purpose. 13 | 14 | ## Development 15 | 16 | Visit the [issue tracker](https://github.com/mbasso/react-decoration/issues) to find a list of open issues that need attention. 17 | 18 | Fork, then clone the repo: 19 | 20 | ``` 21 | git clone https://github.com/mbasso/react-decoration.git 22 | ``` 23 | 24 | ### Building 25 | 26 | #### Building react-decoration 27 | 28 | Running the `build` task will create both a CommonJS module-per-module build and a UMD build. 29 | ``` 30 | npm run build 31 | ``` 32 | 33 | To create just a CommonJS module-per-module build: 34 | 35 | ``` 36 | npm run build:commonjs 37 | 38 | ``` 39 | 40 | The result will be in the `lib` folder. 41 | 42 | To create just a UMD build: 43 | ``` 44 | npm run build:umd 45 | npm run build:umd:min 46 | ``` 47 | 48 | The result will be in the `dist` folder. 49 | 50 | ### Testing and Linting 51 | 52 | To run both linting and testing at once, run the following: 53 | 54 | ``` 55 | npm run check:src 56 | ``` 57 | 58 | To only run linting: 59 | 60 | ``` 61 | npm run lint 62 | ``` 63 | 64 | To only run tests: 65 | 66 | ``` 67 | npm run test 68 | ``` 69 | 70 | To continuously watch and run tests, run the following: 71 | 72 | ``` 73 | npm run test:watch 74 | ``` 75 | 76 | ### Docs 77 | 78 | Improvements to the documentation are always welcome. Before submitting your changes, check that they respect all docs style. 79 | For example, use "-" for lists etc. 80 | 81 | ### Pull Request 82 | 83 | Pull requests are welcome, but make sure that your changes respect the 2 points in PR template: 84 | 85 | - Pull request has tests / docs demo, and is linted. 86 | - Description explains the issue / use-case resolved, and auto-closes the related issue(s) 87 | 88 | Thank you! 89 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2016 Matteo Basso 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # react-decoration 2 | 3 | [![Build 4 | Status](https://travis-ci.org/mbasso/react-decoration.svg?branch=master)](https://travis-ci.org/mbasso/react-decoration) 5 | [![npm 6 | version](https://img.shields.io/npm/v/react-decoration.svg)](https://www.npmjs.com/package/react-decoration) 7 | [![npm 8 | downloads](https://img.shields.io/npm/dm/react-decoration.svg?maxAge=2592000)](https://www.npmjs.com/package/react-decoration) 9 | [![Coverage 10 | Status](https://coveralls.io/repos/github/mbasso/react-decoration/badge.svg?branch=master)](https://coveralls.io/github/mbasso/react-decoration?branch=master) 11 | [![Join the chat at 12 | https://gitter.im/mbasso/react-decoration](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/mbasso/react-decoration?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) 13 | 14 | > A collection of @decorators for React Components 15 | 16 | - - - 17 | 18 | **Attention - In order to use react-decoration you have to use babel 5 19 | or use 20 | [this](https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy) 21 | plugin for babel 6. Check 22 | [this](https://github.com/mbasso/react-decoration/blob/master/docs/Introduction.md) 23 | page for information.** 24 | 25 | - - - 26 | 27 | ## Installation 28 | 29 | You can install react-decoration using [npm](https://www.npmjs.com/package/react-decoration): 30 | 31 | ```bash 32 | npm install --save react-decoration 33 | ``` 34 | 35 | If you aren't using npm in your project, you can include 36 | reactDecoration using UMD build in the dist folder with `