react-fontawesome - npm Package Compare versions

Comparing version 1.5.0 to 1.6.0

changelog.md

 # Changelog
 
+## v.1.6.0
+
+- Use prettier-eslint to auto-format code
+- Changed syntax to use ES6 class and package prop-types since the are both deprecated #41
+- Use prop-types package instead of deprecated React.PropTypes #40
+- Upgrade to node v7.8.0
+- Some cleanup
+
 ## v.1.5.0
@@ -4,0 +12,0 @@

lib/index.js

@@ -9,2 +9,4 @@ 'use strict';
 
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
 var _react = require('react');
@@ -14,2 +16,6 @@
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 var _screenReaderStyles = require('./screen-reader-styles');
@@ -23,6 +29,11 @@
 
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
 /**
  * A React component for the font-awesome icon library.
  *
- *
  * @param {String} [ariaLabel] An extra accessibility label to put on the icon
@@ -36,3 +47,3 @@ * @param {Boolean} [border=false] Whether or not to show a border radius
  * @param {String} name Name of the icon to use
- * @param {Boolean} [pulse=false] Rotate icon with 8 steps (rather than smoothly)
+ * @param {Boolean} [pulse=false] Rotate icon with 8 steps, rather than smoothly
  * @param {Number} [rotate] The degress to rotate the icon by
@@ -42,80 +53,94 @@ * @param {String} [size] The icon scaling size
  * @param {String} [stack] Stack an icon on top of another
- * @param {String} [tag=span] The HTML tag to use as a string (eg 'i' or 'em')
+ * @param {String} [tag=span] The HTML tag to use as a string, eg 'i' or 'em'
  * @module FontAwesome
  * @type {ReactClass}
  */
-exports.default = _react2.default.createClass({
+var FontAwesome = function (_React$Component) {
+  _inherits(FontAwesome, _React$Component);
 
-  displayName: 'FontAwesome',
+  function FontAwesome() {
+    _classCallCheck(this, FontAwesome);
 
-  propTypes: {
-    ariaLabel: _react2.default.PropTypes.string,
-    border: _react2.default.PropTypes.bool,
-    className: _react2.default.PropTypes.string,
-    cssModule: _react2.default.PropTypes.object,
-    fixedWidth: _react2.default.PropTypes.bool,
-    flip: _react2.default.PropTypes.oneOf(['horizontal', 'vertical']),
-    inverse: _react2.default.PropTypes.bool,
-    name: _react2.default.PropTypes.string.isRequired,
-    pulse: _react2.default.PropTypes.bool,
-    rotate: _react2.default.PropTypes.oneOf([90, 180, 270]),
-    size: _react2.default.PropTypes.oneOf(['lg', '2x', '3x', '4x', '5x']),
-    spin: _react2.default.PropTypes.bool,
-    stack: _react2.default.PropTypes.oneOf(['1x', '2x']),
-    tag: _react2.default.PropTypes.string
-  },
+    var _this = _possibleConstructorReturn(this, (FontAwesome.__proto__ || Object.getPrototypeOf(FontAwesome)).call(this));
 
-  render: function render() {
-    var _props = this.props;
-    var border = _props.border;
-    var cssModule = _props.cssModule;
-    var className = _props.className;
-    var fixedWidth = _props.fixedWidth;
-    var flip = _props.flip;
-    var inverse = _props.inverse;
-    var name = _props.name;
-    var pulse = _props.pulse;
-    var rotate = _props.rotate;
-    var size = _props.size;
-    var spin = _props.spin;
-    var stack = _props.stack;
-    var _props$tag = _props.tag;
-    var tag = _props$tag === undefined ? 'span' : _props$tag;
-    var ariaLabel = _props.ariaLabel;
+    _this.displayName = 'FontAwesome';
+    return _this;
+  }
 
-    var props = _objectWithoutProperties(_props, ['border', 'cssModule', 'className', 'fixedWidth', 'flip', 'inverse', 'name', 'pulse', 'rotate', 'size', 'spin', 'stack', 'tag', 'ariaLabel']);
+  _createClass(FontAwesome, [{
+    key: 'render',
+    value: function render() {
+      var _props = this.props,
+          border = _props.border,
+          cssModule = _props.cssModule,
+          className = _props.className,
+          fixedWidth = _props.fixedWidth,
+          flip = _props.flip,
+          inverse = _props.inverse,
+          name = _props.name,
+          pulse = _props.pulse,
+          rotate = _props.rotate,
+          size = _props.size,
+          spin = _props.spin,
+          stack = _props.stack,
+          _props$tag = _props.tag,
+          tag = _props$tag === undefined ? 'span' : _props$tag,
+          ariaLabel = _props.ariaLabel,
+          props = _objectWithoutProperties(_props, ['border', 'cssModule', 'className', 'fixedWidth', 'flip', 'inverse', 'name', 'pulse', 'rotate', 'size', 'spin', 'stack', 'tag', 'ariaLabel']);
 
-    var classNames = [];
+      var classNames = [];
 
-    if (cssModule) {
-      classNames.push(cssModule['fa']);
-      classNames.push(cssModule['fa-' + name]);
-      size && classNames.push(cssModule['fa-' + size]);
-      spin && classNames.push(cssModule['fa-spin']);
-      pulse && classNames.push(cssModule['fa-pulse']);
-      border && classNames.push(cssModule['fa-border']);
-      fixedWidth && classNames.push(cssModule['fa-fw']);
-      inverse && classNames.push(cssModule['fa-inverse']);
-      flip && classNames.push(cssModule['fa-flip-' + flip]);
-      rotate && classNames.push(cssModule['fa-rotate-' + rotate]);
-      stack && classNames.push(cssModule['fa-stack-' + stack]);
-    } else {
-      classNames.push('fa');
-      classNames.push('fa-' + name);
-      size && classNames.push('fa-' + size);
-      spin && classNames.push('fa-spin');
-      pulse && classNames.push('fa-pulse');
-      border && classNames.push('fa-border');
-      fixedWidth && classNames.push('fa-fw');
-      inverse && classNames.push('fa-inverse');
-      flip && classNames.push('fa-flip-' + flip);
-      rotate && classNames.push('fa-rotate-' + rotate);
-      stack && classNames.push('fa-stack-' + stack);
+      if (cssModule) {
+        classNames.push(cssModule['fa']);
+        classNames.push(cssModule['fa-' + name]);
+        size && classNames.push(cssModule['fa-' + size]);
+        spin && classNames.push(cssModule['fa-spin']);
+        pulse && classNames.push(cssModule['fa-pulse']);
+        border && classNames.push(cssModule['fa-border']);
+        fixedWidth && classNames.push(cssModule['fa-fw']);
+        inverse && classNames.push(cssModule['fa-inverse']);
+        flip && classNames.push(cssModule['fa-flip-' + flip]);
+        rotate && classNames.push(cssModule['fa-rotate-' + rotate]);
+        stack && classNames.push(cssModule['fa-stack-' + stack]);
+      } else {
+        classNames.push('fa');
+        classNames.push('fa-' + name);
+        size && classNames.push('fa-' + size);
+        spin && classNames.push('fa-spin');
+        pulse && classNames.push('fa-pulse');
+        border && classNames.push('fa-border');
+        fixedWidth && classNames.push('fa-fw');
+        inverse && classNames.push('fa-inverse');
+        flip && classNames.push('fa-flip-' + flip);
+        rotate && classNames.push('fa-rotate-' + rotate);
+        stack && classNames.push('fa-stack-' + stack);
+      }
+
+      // Add any custom class names at the end.
+      className && classNames.push(className);
+      return _react2.default.createElement(tag, _extends({}, props, { 'aria-hidden': true, className: classNames.join(' ') }), ariaLabel ? _react2.default.createElement('span', { style: _screenReaderStyles2.default }, ariaLabel) : null);
     }
+  }]);
 
-    // Add any custom class names at the end.
-    className && classNames.push(className);
-    return _react2.default.createElement(tag, _extends({}, props, { 'aria-hidden': true, className: classNames.join(' ') }), ariaLabel ? _react2.default.createElement('span', { style: _screenReaderStyles2.default }, ariaLabel) : null);
-  }
-});
+  return FontAwesome;
+}(_react2.default.Component);
+
+FontAwesome.propTypes = {
+  ariaLabel: _propTypes2.default.string,
+  border: _propTypes2.default.bool,
+  className: _propTypes2.default.string,
+  cssModule: _propTypes2.default.object,
+  fixedWidth: _propTypes2.default.bool,
+  flip: _propTypes2.default.oneOf(['horizontal', 'vertical']),
+  inverse: _propTypes2.default.bool,
+  name: _propTypes2.default.string.isRequired,
+  pulse: _propTypes2.default.bool,
+  rotate: _propTypes2.default.oneOf([90, 180, 270]),
+  size: _propTypes2.default.oneOf(['lg', '2x', '3x', '4x', '5x']),
+  spin: _propTypes2.default.bool,
+  stack: _propTypes2.default.oneOf(['1x', '2x']),
+  tag: _propTypes2.default.string
+};
+
+exports.default = FontAwesome;
 module.exports = exports['default'];

package.json

 {
   "name": "react-fontawesome",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "description": "A React component for the font-awesome icon library.",
@@ -9,8 +9,3 @@ "repository": {
   },
-  "config": {
-    "entry": "src",
-    "output": "lib",
-    "mainFile": "src/index.js"
-  },
-  "bugs": {
+  "bujs": {
     "url": "https://github.com/danawoodman/react-fontawesome/issues"
@@ -20,6 +15,6 @@ },
   "scripts": {
-    "build": "babel $npm_package_config_entry --out-dir $npm_package_config_output",
-    "dist": "npm run lint && npm run build && npm test && npm run docs",
-    "docs": "jsdoc2md $npm_package_config_mainFile > api.md",
-    "lint": "eslint .",
+    "build": "babel src --out-dir lib",
+    "dist": "npm run format && npm run build && npm test && npm run docs",
+    "docs": "jsdoc2md lib/index.js > api.md",
+    "format": "prettier-eslint '{src,test}/**/*.js' --prettier.single-quote --prettier.no-semi es5 --write",
     "test": "mocha",
@@ -54,3 +49,3 @@ "watch": "npm run watch-build & npm run watch-test",
     "babel-core": "^6.7.4",
-    "babel-plugin-add-module-exports": "^0.1.2",
+    "babel-plugin-add-module-exports": "^0.2.1",
     "babel-preset-es2015": "^6.6.0",
@@ -60,13 +55,15 @@ "babel-preset-react": "^6.5.0",
     "chai": "^3.2.0",
-    "eslint": "^2.5.3",
+    "eslint": "^3.19.0",
     "eslint-plugin-nodeca": "^1.0.3",
-    "eslint-plugin-react": "^4.2.3",
-    "jsdoc-to-markdown": "^1.1.1",
-    "jsdom": "^6.2.0",
-    "mocha": "^2.2.5",
+    "eslint-plugin-react": "^6.10.3",
+    "jsdoc-to-markdown": "^3.0.0",
+    "jsdom": "^9.12.0",
+    "mocha": "^3.2.0",
     "mocha-jsdom": "^1.0.0",
-    "mocha-sinon": "^1.1.4",
+    "mocha-sinon": "^2.0.0",
+    "prettier-eslint": "^5.1.0",
+    "prettier-eslint-cli": "^3.4.1",
     "react": "^15.0.1",
     "react-dom": "^15.0.1",
-    "sinon": "^1.16.1",
+    "sinon": "^2.1.0",
     "sinon-chai": "^2.8.0"
@@ -80,3 +77,6 @@ },
     "react": ">=0.12.0"
+  },
+  "dependencies": {
+    "prop-types": "^15.5.6"
   }
 }

readme.md

 # react-fontawesome
 
+[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)
 [![Travis CI build status](https://img.shields.io/travis/danawoodman/react-fontawesome.svg)](https://travis-ci.org/danawoodman/react-fontawesome)
@@ -35,3 +36,3 @@ [![Dependency Status](https://img.shields.io/david/danawoodman/react-fontawesome.svg)](https://david-dm.org/danawoodman/react-fontawesome)
 
-*Note: This component does not include any of the Font Awesome CSS or fonts, so you'll need to make sure to include those on your end somehow, either by adding them to your build process or linking to CDN versions.*
+*Note: This component does not include any of the Font Awesome CSS or fonts, so you'll need to make sure to include those on your end somehow, either by adding them to your build process or linking to [CDN versions](https://www.bootstrapcdn.com/fontawesome/).*
 
@@ -70,5 +71,5 @@
 
-Please use the `.editorconfig`, `.eslintrc` configurations in your editor to ensure proper formatting.
+Run the test suite with `npm test` and format your code with `npm run format`. Make sure tests are passing and that you write tests for new features and document changes to the API with updates to the JSDocs.
 
-Run the test suite with `npm test` and linting with `npm run lint`. Make sure tests are passing and that you write tests for new features and document changes to the API with updates to the JSDocs.
+Before you submit your pull request, run `npm run dist` to build the project and commit the changes.
 
@@ -75,0 +76,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

148396

increased by1088.78%

Number of package files

15

increased by87.5%

Lines of code

172

increased by52.21%

Number of lines in readme file

81

increased by1.25%

Worsened metrics

Dependency count

2

increased by100%

Dev dependency count

21

increased by10.53%

Number of low license alerts

1

increased byInfinity%

Number of low maintenance alerts

1

increased byInfinity%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedprop-types@^15.5.6

• + Addedobject-assign@4.1.1(transitive)

• + Addedprop-types@15.8.1(transitive)

• + Addedreact-is@16.13.1(transitive)