react-reading-progress - npm Package Compare versions

Comparing version 0.2.7 to 0.3.0

lib/index.js

@@ -27,2 +27,8 @@ 'use strict';
 
+var _taggedTemplateLiteral2 = require('babel-runtime/helpers/taggedTemplateLiteral');
+
+var _taggedTemplateLiteral3 = _interopRequireDefault(_taggedTemplateLiteral2);
+
+var _templateObject = (0, _taggedTemplateLiteral3.default)(['\n  position: fixed;\n  display: block;\n  top: 0;\n  width: 100vw;\n  height: 0.4rem;\n  border: 0;\n  background-color: transparent;\n  color: rgb(97, 13, 255);\n  z-index: 1;\n\n  &::-webkit-progress-bar {\n    background: #FFF;\n  }\n\n  &::-webkit-progress-value {\n    background: rgb(97, 13, 255);\n  }\n\n  &::-moz-progress-bar {\n    background-color: rgb(97, 13, 255);\n  }\n\n  ', '\n'], ['\n  position: fixed;\n  display: block;\n  top: 0;\n  width: 100vw;\n  height: 0.4rem;\n  border: 0;\n  background-color: transparent;\n  color: rgb(97, 13, 255);\n  z-index: 1;\n\n  &::-webkit-progress-bar {\n    background: #FFF;\n  }\n\n  &::-webkit-progress-value {\n    background: rgb(97, 13, 255);\n  }\n\n  &::-moz-progress-bar {\n    background-color: rgb(97, 13, 255);\n  }\n\n  ', '\n']);
+
 var _react = require('react');
@@ -40,4 +46,24 @@
 
+var _styledComponents = require('styled-components');
+
+var _styledComponents2 = _interopRequireDefault(_styledComponents);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+var Progress = function Progress(_ref) {
+  var value = _ref.value,
+      max = _ref.max,
+      className = _ref.className;
+
+  return _react2.default.createElement('progress', {
+    value: value,
+    max: max,
+    className: className
+  });
+};
+
+var StyledProgress = (0, _styledComponents2.default)(Progress)(_templateObject, function (props) {
+  return props.style;
+});
+
 var ReadingProgress = function (_React$Component) {
@@ -50,3 +76,4 @@ (0, _inherits3.default)(ReadingProgress, _React$Component);
         targetEl: _propTypes2.default.string,
-        className: _propTypes2.default.string
+        className: _propTypes2.default.string,
+        style: _propTypes2.default.object
       };
@@ -128,3 +155,8 @@ }
     value: function render() {
-      return _react2.default.createElement('progress', { value: this.state.value, max: this.max, className: this.props.className });
+      return _react2.default.createElement(StyledProgress, {
+        value: this.state.value,
+        max: this.max,
+        className: this.props.className,
+        style: this.props.style
+      });
     }
@@ -131,0 +163,0 @@ }]);

package.json

 {
   "name": "react-reading-progress",
-  "version": "0.2.7",
+  "version": "0.3.0",
   "main": "./lib/index.js",
@@ -49,2 +49,3 @@ "author": "makotot",
     "babel-preset-react-hmre": "^1.1.1",
+    "babel-preset-stage-0": "^6.24.1",
     "browser-env": "^3.2.0",
@@ -67,3 +68,2 @@ "css-loader": "^0.28.7",
     "style-loader": "^0.18.2",
-    "styled-components": "^2.1.2",
     "system-font-css": "^2.0.1",
@@ -79,3 +79,4 @@ "webpack": "^3.6.0",
     "babel-runtime": "^6.26.0",
-    "prop-types": "^15.5.10"
+    "prop-types": "^15.5.10",
+    "styled-components": "^2.2.2"
   },
@@ -82,0 +83,0 @@ "keywords": [

No alert changes

Improved metrics

Total package byte prevSize

13568

increased by14.06%

Lines of code

245

increased by11.87%

Worsened metrics

Dependency count

5

increased by25%

Dependency changes

• + Addedstyled-components@^2.2.2

• + Addedasap@2.0.6(transitive)

• + Addedbase64-js@1.5.1(transitive)

• + Addedbuffer@5.7.1(transitive)

• + Addedcamelize@1.0.1(transitive)

• + Addedcore-js@1.2.7(transitive)

• + Addedcss-color-keywords@1.0.0(transitive)

• + Addedcss-to-react-native@2.3.2(transitive)

• + Addedencoding@0.1.13(transitive)

• + Addedfbjs@0.8.18(transitive)

• + Addedhas-flag@1.0.0(transitive)

• + Addedhoist-non-react-statics@1.2.0(transitive)

• + Addediconv-lite@0.6.3(transitive)

• + Addedieee754@1.2.1(transitive)

• + Addedis-plain-object@2.0.4(transitive)

• + Addedis-stream@1.1.0(transitive)

• + Addedisobject@3.0.1(transitive)

• + Addedisomorphic-fetch@2.2.1(transitive)

• + Addednode-fetch@1.7.3(transitive)

• + Addedpostcss-value-parser@3.3.1(transitive)

• + Addedpromise@7.3.1(transitive)

• + Addedreact@16.14.0(transitive)

• + Addedsafer-buffer@2.1.2(transitive)

• + Addedsetimmediate@1.0.5(transitive)

• + Addedstyled-components@2.4.1(transitive)

• + Addedstylis@3.5.4(transitive)

• + Addedsupports-color@3.2.3(transitive)

• + Addedua-parser-js@0.7.37(transitive)

• + Addedwhatwg-fetch@3.6.20(transitive)