react-stepper-horizontal - npm Package Compare versions

Comparing version 1.0.6 to 1.0.7

lib/Step.js

@@ -13,2 +13,4 @@ 'use strict';
 
+var _propTypes = require('prop-types');
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -51,2 +53,8 @@
       var width = _props.width;
+      var completeOpacity = _props.completeOpacity;
+      var activeOpacity = _props.activeOpacity;
+      var defaultOpcaity = _props.defaultOpcaity;
+      var completeTitleOpacity = _props.completeTitleOpacity;
+      var activeTitleOpacity = _props.activeTitleOpacity;
+      var defaultTitleOpacity = _props.defaultTitleOpacity;
 
@@ -71,9 +79,12 @@
           color: circleFontColor,
-          display: 'block'
+          display: 'block',
+          opacity: defaultOpcaity
         },
         activeCircle: {
-          backgroundColor: activeColor
+          backgroundColor: activeColor,
+          opacity: activeOpacity
         },
         completedCircle: {
-          backgroundColor: completeColor
+          backgroundColor: completeColor,
+          opacity: completeOpacity
         },
@@ -90,9 +101,12 @@ index: {
           display: 'block',
-          color: defaultTitleColor
+          color: defaultTitleColor,
+          opacity: defaultTitleOpacity
         },
         activeTitle: {
-          color: activeTitleColor
+          color: activeTitleColor,
+          opacity: activeTitleOpacity
         },
         completedTitle: {
-          color: completeTitleColor
+          color: completeTitleColor,
+          opacity: completeTitleOpacity
         },
@@ -108,3 +122,4 @@ leftBar: {
           right: '50%',
-          marginRight: size / 2 + 1
+          marginRight: size / 2 + 1,
+          opacity: defaultOpcaity
         },
@@ -120,3 +135,4 @@ rightBar: {
           left: '50%',
-          marginLeft: size / 2 + 1
+          marginLeft: size / 2 + 1,
+          opacity: defaultOpcaity
         },
@@ -126,3 +142,4 @@ completedBar: {
           borderTopWidth: 1,
-          borderTopColor: completeColor
+          borderTopColor: completeColor,
+          opacity: completeOpacity
         }
@@ -204,21 +221,21 @@ };
 Step.propTypes = {
-  width: _react.PropTypes.number.isRequired,
-  activeColor: _react.PropTypes.string,
-  completeColor: _react.PropTypes.string,
-  defaultColor: _react.PropTypes.string,
-  activeTitleColor: _react.PropTypes.string,
-  completeTitleColor: _react.PropTypes.string,
-  defaultTitleColor: _react.PropTypes.string,
-  circleFontColor: _react.PropTypes.string,
-  size: _react.PropTypes.number,
-  circleFontSize: _react.PropTypes.number,
-  titleFontSize: _react.PropTypes.number,
-  circleTop: _react.PropTypes.number,
-  titleTop: _react.PropTypes.number,
-  title: _react.PropTypes.string,
-  index: _react.PropTypes.number,
-  active: _react.PropTypes.bool,
-  completed: _react.PropTypes.bool,
-  first: _react.PropTypes.bool,
-  isLast: _react.PropTypes.bool
+  width: _propTypes.PropTypes.number.isRequired,
+  activeColor: _propTypes.PropTypes.string,
+  completeColor: _propTypes.PropTypes.string,
+  defaultColor: _propTypes.PropTypes.string,
+  activeTitleColor: _propTypes.PropTypes.string,
+  completeTitleColor: _propTypes.PropTypes.string,
+  defaultTitleColor: _propTypes.PropTypes.string,
+  circleFontColor: _propTypes.PropTypes.string,
+  size: _propTypes.PropTypes.number,
+  circleFontSize: _propTypes.PropTypes.number,
+  titleFontSize: _propTypes.PropTypes.number,
+  circleTop: _propTypes.PropTypes.number,
+  titleTop: _propTypes.PropTypes.number,
+  title: _propTypes.PropTypes.string,
+  index: _propTypes.PropTypes.number,
+  active: _propTypes.PropTypes.bool,
+  completed: _propTypes.PropTypes.bool,
+  first: _propTypes.PropTypes.bool,
+  isLast: _propTypes.PropTypes.bool
 };

lib/Stepper.js

@@ -11,2 +11,4 @@ 'use strict';
 
+var _propTypes = require('prop-types');
+
 var _Step = require('./Step');
@@ -46,2 +48,8 @@
   var titleTop = _ref.titleTop;
+  var completeOpacity = _ref.completeOpacity;
+  var activeOpacity = _ref.activeOpacity;
+  var defaultOpcaity = _ref.defaultOpcaity;
+  var completeTitleOpacity = _ref.completeTitleOpacity;
+  var activeTitleOpacity = _ref.activeTitleOpacity;
+  var defaultTitleOpacity = _ref.defaultTitleOpacity;
 
@@ -77,3 +85,10 @@ return _react2.default.createElement(
           circleTop: circleTop,
-          titleTop: titleTop
+          titleTop: titleTop,
+          defaultOpcaity: defaultOpcaity,
+          completeOpacity: completeOpacity,
+          activeOpacity: activeOpacity,
+          defaultTitleOpacity: defaultTitleOpacity,
+          completeTitleOpacity: completeTitleOpacity,
+          activeTitleOpacity: activeTitleOpacity
+
         });
@@ -90,18 +105,18 @@ })
 Stepper.propTypes = {
-  activeStep: _react.PropTypes.number,
-  steps: _react.PropTypes.array,
-  activeColor: _react.PropTypes.string,
-  completeColor: _react.PropTypes.string,
-  defaultColor: _react.PropTypes.string,
-  activeTitleColor: _react.PropTypes.string,
-  completeTitleColor: _react.PropTypes.string,
-  defaultTitleColor: _react.PropTypes.string,
-  circleFontColor: _react.PropTypes.string,
-  size: _react.PropTypes.number,
-  circleFontSize: _react.PropTypes.number,
-  titleFontSize: _react.PropTypes.number,
-  circleTop: _react.PropTypes.number,
-  titleTop: _react.PropTypes.number
+  activeStep: _propTypes.PropTypes.number,
+  steps: _propTypes.PropTypes.array,
+  activeColor: _propTypes.PropTypes.string,
+  completeColor: _propTypes.PropTypes.string,
+  defaultColor: _propTypes.PropTypes.string,
+  activeTitleColor: _propTypes.PropTypes.string,
+  completeTitleColor: _propTypes.PropTypes.string,
+  defaultTitleColor: _propTypes.PropTypes.string,
+  circleFontColor: _propTypes.PropTypes.string,
+  size: _propTypes.PropTypes.number,
+  circleFontSize: _propTypes.PropTypes.number,
+  titleFontSize: _propTypes.PropTypes.number,
+  circleTop: _propTypes.PropTypes.number,
+  titleTop: _propTypes.PropTypes.number
 };
 
 exports.default = Stepper;

package.json

 {
   "name": "react-stepper-horizontal",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "Well-designed stepper component for react",
@@ -41,2 +41,3 @@ "main": "lib/index.js",
   "dependencies": {
+    "prop-types": "^15.5.10",
     "react": "^15.3.2",
@@ -43,0 +44,0 @@ "react-dom": "^15.3.2"

README.md

@@ -18,3 +18,3 @@ # react-stepper
     <div>
-      <Stepper steps={ ['Step One', 'Step Two', 'Step Three', 'Step Four'] } activeStep={ 1 } />
+      <Stepper steps={ [{title: 'Step One'}, {title: 'Step Two'}, {title: 'Step Three'}, {title: 'Step Four'}] } activeStep={ 1 } />
     </div>
@@ -43,2 +43,8 @@ );
 |titleTop|Space between circle and title|8|number|
+|defaultOpacity|Default cirlce opacity|1|string|
+|completeOpacity|Completed cirlce opacity|1|string|
+|activeOpacity|Active cirlce opacity|1|string|
+|defaultTitleOpacity|Default title opacity|1|string|
+|completeTitleOpacity|Completed title opacity|1|string|
+|activeTitleOpacity|Active title opacity|1|string|
 
@@ -45,0 +51,0 @@

No alert changes

Improved metrics

Total package byte prevSize

93220

increased by2%

Lines of code

320

increased by9.97%

Number of lines in readme file

57

increased by11.76%

Worsened metrics

Dependency count

3

increased by50%

Dependency changes

• + Addedprop-types@^15.5.10