rc-steps - npm Package Compare versions

Comparing version 3.1.1 to 3.2.0

assets/iconfont.css

@@ -490,4 +490,3 @@ @font-face {
 :root .rcicon-backward {
-  -webkit-filter: none;
-          filter: none;
+  filter: none;
 }

assets/index.css

@@ -5,3 +5,2 @@ .rc-steps {
   line-height: 1.5;
-  display: -webkit-box;
   display: -ms-flexbox;
@@ -18,11 +17,9 @@ display: flex;
   vertical-align: top;
-  -webkit-box-flex: 1;
-      -ms-flex: 1;
-          flex: 1;
+  -ms-flex: 1;
+      flex: 1;
   overflow: hidden;
 }
 .rc-steps-item:last-child {
-  -webkit-box-flex: 0;
-      -ms-flex: none;
-          flex: none;
+  -ms-flex: none;
+      flex: none;
 }
@@ -238,4 +235,3 @@ .rc-steps-item:last-child .rc-steps-item-tail,
   font-size: 9px \9;
-  -webkit-transform: scale(0.75);
-          transform: scale(0.75);
+  transform: scale(0.75);
   top: -1px;
@@ -276,4 +272,3 @@ }
   top: -2.5px;
-  -webkit-transform: none;
-          transform: none;
+  transform: none;
 }
@@ -280,0 +275,0 @@ .rc-steps-vertical {

es/Step.js

 import _extends from 'babel-runtime/helpers/extends';
 import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
-import _defineProperty from 'babel-runtime/helpers/defineProperty';
 import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
-import _createClass from 'babel-runtime/helpers/createClass';
 import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
@@ -22,46 +20,29 @@ import _inherits from 'babel-runtime/helpers/inherits';
 
-    return _possibleConstructorReturn(this, (Step.__proto__ || Object.getPrototypeOf(Step)).apply(this, arguments));
+    return _possibleConstructorReturn(this, _React$Component.apply(this, arguments));
   }
 
-  _createClass(Step, [{
-    key: 'renderIconNode',
-    value: function renderIconNode() {
-      var _classNames;
+  Step.prototype.renderIconNode = function renderIconNode() {
+    var _classNames;
 
-      var _props = this.props,
-          prefixCls = _props.prefixCls,
-          progressDot = _props.progressDot,
-          stepNumber = _props.stepNumber,
-          status = _props.status,
-          title = _props.title,
-          description = _props.description,
-          icon = _props.icon,
-          iconPrefix = _props.iconPrefix;
+    var _props = this.props,
+        prefixCls = _props.prefixCls,
+        progressDot = _props.progressDot,
+        stepNumber = _props.stepNumber,
+        status = _props.status,
+        title = _props.title,
+        description = _props.description,
+        icon = _props.icon,
+        iconPrefix = _props.iconPrefix;
 
-      var iconNode = void 0;
-      var iconClassName = classNames(prefixCls + '-icon', iconPrefix + 'icon', (_classNames = {}, _defineProperty(_classNames, iconPrefix + 'icon-' + icon, icon && isString(icon)), _defineProperty(_classNames, iconPrefix + 'icon-check', !icon && status === 'finish'), _defineProperty(_classNames, iconPrefix + 'icon-cross', !icon && status === 'error'), _classNames));
-      var iconDot = React.createElement('span', { className: prefixCls + '-icon-dot' });
-      // `progressDot` enjoy the highest priority
-      if (progressDot) {
-        if (typeof progressDot === 'function') {
-          iconNode = React.createElement(
-            'span',
-            { className: prefixCls + '-icon' },
-            progressDot(iconDot, { index: stepNumber - 1, status: status, title: title, description: description })
-          );
-        } else {
-          iconNode = React.createElement(
-            'span',
-            { className: prefixCls + '-icon' },
-            iconDot
-          );
-        }
-      } else if (icon && !isString(icon)) {
+    var iconNode = void 0;
+    var iconClassName = classNames(prefixCls + '-icon', iconPrefix + 'icon', (_classNames = {}, _classNames[iconPrefix + 'icon-' + icon] = icon && isString(icon), _classNames[iconPrefix + 'icon-check'] = !icon && status === 'finish', _classNames[iconPrefix + 'icon-cross'] = !icon && status === 'error', _classNames));
+    var iconDot = React.createElement('span', { className: prefixCls + '-icon-dot' });
+    // `progressDot` enjoy the highest priority
+    if (progressDot) {
+      if (typeof progressDot === 'function') {
         iconNode = React.createElement(
           'span',
           { className: prefixCls + '-icon' },
-          icon
+          progressDot(iconDot, { index: stepNumber - 1, status: status, title: title, description: description })
         );
-      } else if (icon || status === 'finish' || status === 'error') {
-        iconNode = React.createElement('span', { className: iconClassName });
       } else {
@@ -71,69 +52,84 @@ iconNode = React.createElement(
           { className: prefixCls + '-icon' },
-          stepNumber
+          iconDot
         );
       }
-      return iconNode;
+    } else if (icon && !isString(icon)) {
+      iconNode = React.createElement(
+        'span',
+        { className: prefixCls + '-icon' },
+        icon
+      );
+    } else if (icon || status === 'finish' || status === 'error') {
+      iconNode = React.createElement('span', { className: iconClassName });
+    } else {
+      iconNode = React.createElement(
+        'span',
+        { className: prefixCls + '-icon' },
+        stepNumber
+      );
     }
-  }, {
-    key: 'render',
-    value: function render() {
-      var _props2 = this.props,
-          className = _props2.className,
-          prefixCls = _props2.prefixCls,
-          style = _props2.style,
-          itemWidth = _props2.itemWidth,
-          _props2$status = _props2.status,
-          status = _props2$status === undefined ? 'wait' : _props2$status,
-          iconPrefix = _props2.iconPrefix,
-          icon = _props2.icon,
-          wrapperStyle = _props2.wrapperStyle,
-          adjustMarginRight = _props2.adjustMarginRight,
-          stepNumber = _props2.stepNumber,
-          description = _props2.description,
-          title = _props2.title,
-          progressDot = _props2.progressDot,
-          tailContent = _props2.tailContent,
-          restProps = _objectWithoutProperties(_props2, ['className', 'prefixCls', 'style', 'itemWidth', 'status', 'iconPrefix', 'icon', 'wrapperStyle', 'adjustMarginRight', 'stepNumber', 'description', 'title', 'progressDot', 'tailContent']);
+    return iconNode;
+  };
 
-      var classString = classNames(prefixCls + '-item', prefixCls + '-item-' + status, className, _defineProperty({}, prefixCls + '-item-custom', icon));
-      var stepItemStyle = _extends({}, style);
-      if (itemWidth) {
-        stepItemStyle.width = itemWidth;
-      }
-      if (adjustMarginRight) {
-        stepItemStyle.marginRight = adjustMarginRight;
-      }
-      return React.createElement(
+  Step.prototype.render = function render() {
+    var _classNames2;
+
+    var _props2 = this.props,
+        className = _props2.className,
+        prefixCls = _props2.prefixCls,
+        style = _props2.style,
+        itemWidth = _props2.itemWidth,
+        _props2$status = _props2.status,
+        status = _props2$status === undefined ? 'wait' : _props2$status,
+        iconPrefix = _props2.iconPrefix,
+        icon = _props2.icon,
+        wrapperStyle = _props2.wrapperStyle,
+        adjustMarginRight = _props2.adjustMarginRight,
+        stepNumber = _props2.stepNumber,
+        description = _props2.description,
+        title = _props2.title,
+        progressDot = _props2.progressDot,
+        tailContent = _props2.tailContent,
+        restProps = _objectWithoutProperties(_props2, ['className', 'prefixCls', 'style', 'itemWidth', 'status', 'iconPrefix', 'icon', 'wrapperStyle', 'adjustMarginRight', 'stepNumber', 'description', 'title', 'progressDot', 'tailContent']);
+
+    var classString = classNames(prefixCls + '-item', prefixCls + '-item-' + status, className, (_classNames2 = {}, _classNames2[prefixCls + '-item-custom'] = icon, _classNames2));
+    var stepItemStyle = _extends({}, style);
+    if (itemWidth) {
+      stepItemStyle.width = itemWidth;
+    }
+    if (adjustMarginRight) {
+      stepItemStyle.marginRight = adjustMarginRight;
+    }
+    return React.createElement(
+      'div',
+      _extends({}, restProps, {
+        className: classString,
+        style: stepItemStyle
+      }),
+      React.createElement(
         'div',
-        _extends({}, restProps, {
-          className: classString,
-          style: stepItemStyle
-        }),
+        { className: prefixCls + '-item-tail' },
+        tailContent
+      ),
+      React.createElement(
+        'div',
+        { className: prefixCls + '-item-icon' },
+        this.renderIconNode()
+      ),
+      React.createElement(
+        'div',
+        { className: prefixCls + '-item-content' },
         React.createElement(
           'div',
-          { className: prefixCls + '-item-tail' },
-          tailContent
+          { className: prefixCls + '-item-title' },
+          title
         ),
-        React.createElement(
+        description && React.createElement(
           'div',
-          { className: prefixCls + '-item-icon' },
-          this.renderIconNode()
-        ),
-        React.createElement(
-          'div',
-          { className: prefixCls + '-item-content' },
-          React.createElement(
-            'div',
-            { className: prefixCls + '-item-title' },
-            title
-          ),
-          description && React.createElement(
-            'div',
-            { className: prefixCls + '-item-description' },
-            description
-          )
+          { className: prefixCls + '-item-description' },
+          description
         )
-      );
-    }
-  }]);
+      )
+    );
+  };
 
@@ -140,0 +136,0 @@ return Step;

es/Steps.js

 import _extends from 'babel-runtime/helpers/extends';
-import _defineProperty from 'babel-runtime/helpers/defineProperty';
 import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
 import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
-import _createClass from 'babel-runtime/helpers/createClass';
 import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
@@ -22,3 +20,3 @@ import _inherits from 'babel-runtime/helpers/inherits';
 
-    var _this = _possibleConstructorReturn(this, (Steps.__proto__ || Object.getPrototypeOf(Steps)).call(this, props));
+    var _this = _possibleConstructorReturn(this, _Component.call(this, props));
 
@@ -55,94 +53,90 @@ _this.calcStepOffsetWidth = function () {
 
-  _createClass(Steps, [{
-    key: 'componentDidMount',
-    value: function componentDidMount() {
-      this.calcStepOffsetWidth();
-      if (!isFlexSupported()) {
-        this.setState({
-          flexSupported: false
-        });
-      }
+  Steps.prototype.componentDidMount = function componentDidMount() {
+    this.calcStepOffsetWidth();
+    if (!isFlexSupported()) {
+      this.setState({
+        flexSupported: false
+      });
     }
-  }, {
-    key: 'componentDidUpdate',
-    value: function componentDidUpdate() {
-      this.calcStepOffsetWidth();
+  };
+
+  Steps.prototype.componentDidUpdate = function componentDidUpdate() {
+    this.calcStepOffsetWidth();
+  };
+
+  Steps.prototype.componentWillUnmount = function componentWillUnmount() {
+    if (this.calcTimeout) {
+      clearTimeout(this.calcTimeout);
     }
-  }, {
-    key: 'componentWillUnmount',
-    value: function componentWillUnmount() {
-      if (this.calcTimeout) {
-        clearTimeout(this.calcTimeout);
-      }
-      if (this.calcStepOffsetWidth && this.calcStepOffsetWidth.cancel) {
-        this.calcStepOffsetWidth.cancel();
-      }
+    if (this.calcStepOffsetWidth && this.calcStepOffsetWidth.cancel) {
+      this.calcStepOffsetWidth.cancel();
     }
-  }, {
-    key: 'render',
-    value: function render() {
-      var _classNames;
+  };
 
-      var _props = this.props,
-          prefixCls = _props.prefixCls,
-          _props$style = _props.style,
-          style = _props$style === undefined ? {} : _props$style,
-          className = _props.className,
-          children = _props.children,
-          direction = _props.direction,
-          labelPlacement = _props.labelPlacement,
-          iconPrefix = _props.iconPrefix,
-          status = _props.status,
-          size = _props.size,
-          current = _props.current,
-          progressDot = _props.progressDot,
-          restProps = _objectWithoutProperties(_props, ['prefixCls', 'style', 'className', 'children', 'direction', 'labelPlacement', 'iconPrefix', 'status', 'size', 'current', 'progressDot']);
+  Steps.prototype.render = function render() {
+    var _classNames;
 
-      var _state = this.state,
-          lastStepOffsetWidth = _state.lastStepOffsetWidth,
-          flexSupported = _state.flexSupported;
+    var _props = this.props,
+        prefixCls = _props.prefixCls,
+        _props$style = _props.style,
+        style = _props$style === undefined ? {} : _props$style,
+        className = _props.className,
+        children = _props.children,
+        direction = _props.direction,
+        labelPlacement = _props.labelPlacement,
+        iconPrefix = _props.iconPrefix,
+        status = _props.status,
+        size = _props.size,
+        current = _props.current,
+        progressDot = _props.progressDot,
+        initial = _props.initial,
+        restProps = _objectWithoutProperties(_props, ['prefixCls', 'style', 'className', 'children', 'direction', 'labelPlacement', 'iconPrefix', 'status', 'size', 'current', 'progressDot', 'initial']);
 
-      var filteredChildren = React.Children.toArray(children).filter(function (c) {
-        return !!c;
-      });
-      var lastIndex = filteredChildren.length - 1;
-      var adjustedlabelPlacement = !!progressDot ? 'vertical' : labelPlacement;
-      var classString = classNames(prefixCls, prefixCls + '-' + direction, className, (_classNames = {}, _defineProperty(_classNames, prefixCls + '-' + size, size), _defineProperty(_classNames, prefixCls + '-label-' + adjustedlabelPlacement, direction === 'horizontal'), _defineProperty(_classNames, prefixCls + '-dot', !!progressDot), _classNames));
+    var _state = this.state,
+        lastStepOffsetWidth = _state.lastStepOffsetWidth,
+        flexSupported = _state.flexSupported;
 
-      return React.createElement(
-        'div',
-        _extends({ className: classString, style: style }, restProps),
-        Children.map(filteredChildren, function (child, index) {
-          if (!child) {
-            return null;
+    var filteredChildren = React.Children.toArray(children).filter(function (c) {
+      return !!c;
+    });
+    var lastIndex = filteredChildren.length - 1;
+    var adjustedlabelPlacement = !!progressDot ? 'vertical' : labelPlacement;
+    var classString = classNames(prefixCls, prefixCls + '-' + direction, className, (_classNames = {}, _classNames[prefixCls + '-' + size] = size, _classNames[prefixCls + '-label-' + adjustedlabelPlacement] = direction === 'horizontal', _classNames[prefixCls + '-dot'] = !!progressDot, _classNames));
+
+    return React.createElement(
+      'div',
+      _extends({ className: classString, style: style }, restProps),
+      Children.map(filteredChildren, function (child, index) {
+        if (!child) {
+          return null;
+        }
+        var stepNumber = initial ? initial + index : index + 1;
+        var childProps = _extends({
+          stepNumber: '' + stepNumber,
+          prefixCls: prefixCls,
+          iconPrefix: iconPrefix,
+          wrapperStyle: style,
+          progressDot: progressDot
+        }, child.props);
+        if (!flexSupported && direction !== 'vertical' && index !== lastIndex) {
+          childProps.itemWidth = 100 / lastIndex + '%';
+          childProps.adjustMarginRight = -Math.round(lastStepOffsetWidth / lastIndex + 1);
+        }
+        // fix tail color
+        if (status === 'error' && index === current - 1) {
+          childProps.className = prefixCls + '-next-error';
+        }
+        if (!child.props.status) {
+          if (stepNumber === current) {
+            childProps.status = status;
+          } else if (stepNumber < current) {
+            childProps.status = 'finish';
+          } else {
+            childProps.status = 'wait';
           }
-          var childProps = _extends({
-            stepNumber: '' + (index + 1),
-            prefixCls: prefixCls,
-            iconPrefix: iconPrefix,
-            wrapperStyle: style,
-            progressDot: progressDot
-          }, child.props);
-          if (!flexSupported && direction !== 'vertical' && index !== lastIndex) {
-            childProps.itemWidth = 100 / lastIndex + '%';
-            childProps.adjustMarginRight = -Math.round(lastStepOffsetWidth / lastIndex + 1);
-          }
-          // fix tail color
-          if (status === 'error' && index === current - 1) {
-            childProps.className = prefixCls + '-next-error';
-          }
-          if (!child.props.status) {
-            if (index === current) {
-              childProps.status = status;
-            } else if (index < current) {
-              childProps.status = 'finish';
-            } else {
-              childProps.status = 'wait';
-            }
-          }
-          return cloneElement(child, childProps);
-        })
-      );
-    }
-  }]);
+        }
+        return cloneElement(child, childProps);
+      })
+    );
+  };
 
@@ -163,2 +157,3 @@ return Steps;
   style: PropTypes.object,
+  initial: PropTypes.number,
   current: PropTypes.number
@@ -171,2 +166,3 @@ };
   labelPlacement: 'horizontal',
+  initial: 0,
   current: 0,
@@ -173,0 +169,0 @@ status: 'process',

HISTORY.md

 # History
 ----
 
+## 3.2.0
+
+- Add `initial` prop.
+
 ## 3.1.0
@@ -5,0 +9,0 @@

lib/index.js

 'use strict';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
+exports.__esModule = true;
 exports.Step = undefined;
@@ -7,0 +5,0 @@

lib/Step.js

 'use strict';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
+exports.__esModule = true;
 
@@ -15,6 +13,2 @@ var _extends2 = require('babel-runtime/helpers/extends');
 
-var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
-
-var _defineProperty3 = _interopRequireDefault(_defineProperty2);
-
 var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
@@ -24,6 +18,2 @@
 
-var _createClass2 = require('babel-runtime/helpers/createClass');
-
-var _createClass3 = _interopRequireDefault(_createClass2);
-
 var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
@@ -60,46 +50,29 @@
     (0, _classCallCheck3['default'])(this, Step);
-    return (0, _possibleConstructorReturn3['default'])(this, (Step.__proto__ || Object.getPrototypeOf(Step)).apply(this, arguments));
+    return (0, _possibleConstructorReturn3['default'])(this, _React$Component.apply(this, arguments));
   }
 
-  (0, _createClass3['default'])(Step, [{
-    key: 'renderIconNode',
-    value: function renderIconNode() {
-      var _classNames;
+  Step.prototype.renderIconNode = function renderIconNode() {
+    var _classNames;
 
-      var _props = this.props,
-          prefixCls = _props.prefixCls,
-          progressDot = _props.progressDot,
-          stepNumber = _props.stepNumber,
-          status = _props.status,
-          title = _props.title,
-          description = _props.description,
-          icon = _props.icon,
-          iconPrefix = _props.iconPrefix;
+    var _props = this.props,
+        prefixCls = _props.prefixCls,
+        progressDot = _props.progressDot,
+        stepNumber = _props.stepNumber,
+        status = _props.status,
+        title = _props.title,
+        description = _props.description,
+        icon = _props.icon,
+        iconPrefix = _props.iconPrefix;
 
-      var iconNode = void 0;
-      var iconClassName = (0, _classnames2['default'])(prefixCls + '-icon', iconPrefix + 'icon', (_classNames = {}, (0, _defineProperty3['default'])(_classNames, iconPrefix + 'icon-' + icon, icon && isString(icon)), (0, _defineProperty3['default'])(_classNames, iconPrefix + 'icon-check', !icon && status === 'finish'), (0, _defineProperty3['default'])(_classNames, iconPrefix + 'icon-cross', !icon && status === 'error'), _classNames));
-      var iconDot = _react2['default'].createElement('span', { className: prefixCls + '-icon-dot' });
-      // `progressDot` enjoy the highest priority
-      if (progressDot) {
-        if (typeof progressDot === 'function') {
-          iconNode = _react2['default'].createElement(
-            'span',
-            { className: prefixCls + '-icon' },
-            progressDot(iconDot, { index: stepNumber - 1, status: status, title: title, description: description })
-          );
-        } else {
-          iconNode = _react2['default'].createElement(
-            'span',
-            { className: prefixCls + '-icon' },
-            iconDot
-          );
-        }
-      } else if (icon && !isString(icon)) {
+    var iconNode = void 0;
+    var iconClassName = (0, _classnames2['default'])(prefixCls + '-icon', iconPrefix + 'icon', (_classNames = {}, _classNames[iconPrefix + 'icon-' + icon] = icon && isString(icon), _classNames[iconPrefix + 'icon-check'] = !icon && status === 'finish', _classNames[iconPrefix + 'icon-cross'] = !icon && status === 'error', _classNames));
+    var iconDot = _react2['default'].createElement('span', { className: prefixCls + '-icon-dot' });
+    // `progressDot` enjoy the highest priority
+    if (progressDot) {
+      if (typeof progressDot === 'function') {
         iconNode = _react2['default'].createElement(
           'span',
           { className: prefixCls + '-icon' },
-          icon
+          progressDot(iconDot, { index: stepNumber - 1, status: status, title: title, description: description })
         );
-      } else if (icon || status === 'finish' || status === 'error') {
-        iconNode = _react2['default'].createElement('span', { className: iconClassName });
       } else {
@@ -109,70 +82,86 @@ iconNode = _react2['default'].createElement(
           { className: prefixCls + '-icon' },
-          stepNumber
+          iconDot
         );
       }
-      return iconNode;
+    } else if (icon && !isString(icon)) {
+      iconNode = _react2['default'].createElement(
+        'span',
+        { className: prefixCls + '-icon' },
+        icon
+      );
+    } else if (icon || status === 'finish' || status === 'error') {
+      iconNode = _react2['default'].createElement('span', { className: iconClassName });
+    } else {
+      iconNode = _react2['default'].createElement(
+        'span',
+        { className: prefixCls + '-icon' },
+        stepNumber
+      );
     }
-  }, {
-    key: 'render',
-    value: function render() {
-      var _props2 = this.props,
-          className = _props2.className,
-          prefixCls = _props2.prefixCls,
-          style = _props2.style,
-          itemWidth = _props2.itemWidth,
-          _props2$status = _props2.status,
-          status = _props2$status === undefined ? 'wait' : _props2$status,
-          iconPrefix = _props2.iconPrefix,
-          icon = _props2.icon,
-          wrapperStyle = _props2.wrapperStyle,
-          adjustMarginRight = _props2.adjustMarginRight,
-          stepNumber = _props2.stepNumber,
-          description = _props2.description,
-          title = _props2.title,
-          progressDot = _props2.progressDot,
-          tailContent = _props2.tailContent,
-          restProps = (0, _objectWithoutProperties3['default'])(_props2, ['className', 'prefixCls', 'style', 'itemWidth', 'status', 'iconPrefix', 'icon', 'wrapperStyle', 'adjustMarginRight', 'stepNumber', 'description', 'title', 'progressDot', 'tailContent']);
+    return iconNode;
+  };
 
+  Step.prototype.render = function render() {
+    var _classNames2;
 
-      var classString = (0, _classnames2['default'])(prefixCls + '-item', prefixCls + '-item-' + status, className, (0, _defineProperty3['default'])({}, prefixCls + '-item-custom', icon));
-      var stepItemStyle = (0, _extends3['default'])({}, style);
-      if (itemWidth) {
-        stepItemStyle.width = itemWidth;
-      }
-      if (adjustMarginRight) {
-        stepItemStyle.marginRight = adjustMarginRight;
-      }
-      return _react2['default'].createElement(
+    var _props2 = this.props,
+        className = _props2.className,
+        prefixCls = _props2.prefixCls,
+        style = _props2.style,
+        itemWidth = _props2.itemWidth,
+        _props2$status = _props2.status,
+        status = _props2$status === undefined ? 'wait' : _props2$status,
+        iconPrefix = _props2.iconPrefix,
+        icon = _props2.icon,
+        wrapperStyle = _props2.wrapperStyle,
+        adjustMarginRight = _props2.adjustMarginRight,
+        stepNumber = _props2.stepNumber,
+        description = _props2.description,
+        title = _props2.title,
+        progressDot = _props2.progressDot,
+        tailContent = _props2.tailContent,
+        restProps = (0, _objectWithoutProperties3['default'])(_props2, ['className', 'prefixCls', 'style', 'itemWidth', 'status', 'iconPrefix', 'icon', 'wrapperStyle', 'adjustMarginRight', 'stepNumber', 'description', 'title', 'progressDot', 'tailContent']);
+
+
+    var classString = (0, _classnames2['default'])(prefixCls + '-item', prefixCls + '-item-' + status, className, (_classNames2 = {}, _classNames2[prefixCls + '-item-custom'] = icon, _classNames2));
+    var stepItemStyle = (0, _extends3['default'])({}, style);
+    if (itemWidth) {
+      stepItemStyle.width = itemWidth;
+    }
+    if (adjustMarginRight) {
+      stepItemStyle.marginRight = adjustMarginRight;
+    }
+    return _react2['default'].createElement(
+      'div',
+      (0, _extends3['default'])({}, restProps, {
+        className: classString,
+        style: stepItemStyle
+      }),
+      _react2['default'].createElement(
         'div',
-        (0, _extends3['default'])({}, restProps, {
-          className: classString,
-          style: stepItemStyle
-        }),
+        { className: prefixCls + '-item-tail' },
+        tailContent
+      ),
+      _react2['default'].createElement(
+        'div',
+        { className: prefixCls + '-item-icon' },
+        this.renderIconNode()
+      ),
+      _react2['default'].createElement(
+        'div',
+        { className: prefixCls + '-item-content' },
         _react2['default'].createElement(
           'div',
-          { className: prefixCls + '-item-tail' },
-          tailContent
+          { className: prefixCls + '-item-title' },
+          title
         ),
-        _react2['default'].createElement(
+        description && _react2['default'].createElement(
           'div',
-          { className: prefixCls + '-item-icon' },
-          this.renderIconNode()
-        ),
-        _react2['default'].createElement(
-          'div',
-          { className: prefixCls + '-item-content' },
-          _react2['default'].createElement(
-            'div',
-            { className: prefixCls + '-item-title' },
-            title
-          ),
-          description && _react2['default'].createElement(
-            'div',
-            { className: prefixCls + '-item-description' },
-            description
-          )
+          { className: prefixCls + '-item-description' },
+          description
         )
-      );
-    }
-  }]);
+      )
+    );
+  };
+
   return Step;
@@ -179,0 +168,0 @@ }(_react2['default'].Component);

lib/Steps.js

 'use strict';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
+exports.__esModule = true;
 
@@ -11,6 +9,2 @@ var _extends2 = require('babel-runtime/helpers/extends');
 
-var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
-
-var _defineProperty3 = _interopRequireDefault(_defineProperty2);
-
 var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
@@ -24,6 +18,2 @@
 
-var _createClass2 = require('babel-runtime/helpers/createClass');
-
-var _createClass3 = _interopRequireDefault(_createClass2);
-
 var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
@@ -66,3 +56,3 @@
 
-    var _this = (0, _possibleConstructorReturn3['default'])(this, (Steps.__proto__ || Object.getPrototypeOf(Steps)).call(this, props));
+    var _this = (0, _possibleConstructorReturn3['default'])(this, _Component.call(this, props));
 
@@ -99,93 +89,90 @@ _this.calcStepOffsetWidth = function () {
 
-  (0, _createClass3['default'])(Steps, [{
-    key: 'componentDidMount',
-    value: function componentDidMount() {
-      this.calcStepOffsetWidth();
-      if (!(0, _utils.isFlexSupported)()) {
-        this.setState({
-          flexSupported: false
-        });
-      }
+  Steps.prototype.componentDidMount = function componentDidMount() {
+    this.calcStepOffsetWidth();
+    if (!(0, _utils.isFlexSupported)()) {
+      this.setState({
+        flexSupported: false
+      });
     }
-  }, {
-    key: 'componentDidUpdate',
-    value: function componentDidUpdate() {
-      this.calcStepOffsetWidth();
+  };
+
+  Steps.prototype.componentDidUpdate = function componentDidUpdate() {
+    this.calcStepOffsetWidth();
+  };
+
+  Steps.prototype.componentWillUnmount = function componentWillUnmount() {
+    if (this.calcTimeout) {
+      clearTimeout(this.calcTimeout);
     }
-  }, {
-    key: 'componentWillUnmount',
-    value: function componentWillUnmount() {
-      if (this.calcTimeout) {
-        clearTimeout(this.calcTimeout);
-      }
-      if (this.calcStepOffsetWidth && this.calcStepOffsetWidth.cancel) {
-        this.calcStepOffsetWidth.cancel();
-      }
+    if (this.calcStepOffsetWidth && this.calcStepOffsetWidth.cancel) {
+      this.calcStepOffsetWidth.cancel();
     }
-  }, {
-    key: 'render',
-    value: function render() {
-      var _classNames;
+  };
 
-      var _props = this.props,
-          prefixCls = _props.prefixCls,
-          _props$style = _props.style,
-          style = _props$style === undefined ? {} : _props$style,
-          className = _props.className,
-          children = _props.children,
-          direction = _props.direction,
-          labelPlacement = _props.labelPlacement,
-          iconPrefix = _props.iconPrefix,
-          status = _props.status,
-          size = _props.size,
-          current = _props.current,
-          progressDot = _props.progressDot,
-          restProps = (0, _objectWithoutProperties3['default'])(_props, ['prefixCls', 'style', 'className', 'children', 'direction', 'labelPlacement', 'iconPrefix', 'status', 'size', 'current', 'progressDot']);
-      var _state = this.state,
-          lastStepOffsetWidth = _state.lastStepOffsetWidth,
-          flexSupported = _state.flexSupported;
+  Steps.prototype.render = function render() {
+    var _classNames;
 
-      var filteredChildren = _react2['default'].Children.toArray(children).filter(function (c) {
-        return !!c;
-      });
-      var lastIndex = filteredChildren.length - 1;
-      var adjustedlabelPlacement = !!progressDot ? 'vertical' : labelPlacement;
-      var classString = (0, _classnames2['default'])(prefixCls, prefixCls + '-' + direction, className, (_classNames = {}, (0, _defineProperty3['default'])(_classNames, prefixCls + '-' + size, size), (0, _defineProperty3['default'])(_classNames, prefixCls + '-label-' + adjustedlabelPlacement, direction === 'horizontal'), (0, _defineProperty3['default'])(_classNames, prefixCls + '-dot', !!progressDot), _classNames));
+    var _props = this.props,
+        prefixCls = _props.prefixCls,
+        _props$style = _props.style,
+        style = _props$style === undefined ? {} : _props$style,
+        className = _props.className,
+        children = _props.children,
+        direction = _props.direction,
+        labelPlacement = _props.labelPlacement,
+        iconPrefix = _props.iconPrefix,
+        status = _props.status,
+        size = _props.size,
+        current = _props.current,
+        progressDot = _props.progressDot,
+        initial = _props.initial,
+        restProps = (0, _objectWithoutProperties3['default'])(_props, ['prefixCls', 'style', 'className', 'children', 'direction', 'labelPlacement', 'iconPrefix', 'status', 'size', 'current', 'progressDot', 'initial']);
+    var _state = this.state,
+        lastStepOffsetWidth = _state.lastStepOffsetWidth,
+        flexSupported = _state.flexSupported;
 
-      return _react2['default'].createElement(
-        'div',
-        (0, _extends3['default'])({ className: classString, style: style }, restProps),
-        _react.Children.map(filteredChildren, function (child, index) {
-          if (!child) {
-            return null;
+    var filteredChildren = _react2['default'].Children.toArray(children).filter(function (c) {
+      return !!c;
+    });
+    var lastIndex = filteredChildren.length - 1;
+    var adjustedlabelPlacement = !!progressDot ? 'vertical' : labelPlacement;
+    var classString = (0, _classnames2['default'])(prefixCls, prefixCls + '-' + direction, className, (_classNames = {}, _classNames[prefixCls + '-' + size] = size, _classNames[prefixCls + '-label-' + adjustedlabelPlacement] = direction === 'horizontal', _classNames[prefixCls + '-dot'] = !!progressDot, _classNames));
+
+    return _react2['default'].createElement(
+      'div',
+      (0, _extends3['default'])({ className: classString, style: style }, restProps),
+      _react.Children.map(filteredChildren, function (child, index) {
+        if (!child) {
+          return null;
+        }
+        var stepNumber = initial ? initial + index : index + 1;
+        var childProps = (0, _extends3['default'])({
+          stepNumber: '' + stepNumber,
+          prefixCls: prefixCls,
+          iconPrefix: iconPrefix,
+          wrapperStyle: style,
+          progressDot: progressDot
+        }, child.props);
+        if (!flexSupported && direction !== 'vertical' && index !== lastIndex) {
+          childProps.itemWidth = 100 / lastIndex + '%';
+          childProps.adjustMarginRight = -Math.round(lastStepOffsetWidth / lastIndex + 1);
+        }
+        // fix tail color
+        if (status === 'error' && index === current - 1) {
+          childProps.className = prefixCls + '-next-error';
+        }
+        if (!child.props.status) {
+          if (stepNumber === current) {
+            childProps.status = status;
+          } else if (stepNumber < current) {
+            childProps.status = 'finish';
+          } else {
+            childProps.status = 'wait';
           }
-          var childProps = (0, _extends3['default'])({
-            stepNumber: '' + (index + 1),
-            prefixCls: prefixCls,
-            iconPrefix: iconPrefix,
-            wrapperStyle: style,
-            progressDot: progressDot
-          }, child.props);
-          if (!flexSupported && direction !== 'vertical' && index !== lastIndex) {
-            childProps.itemWidth = 100 / lastIndex + '%';
-            childProps.adjustMarginRight = -Math.round(lastStepOffsetWidth / lastIndex + 1);
-          }
-          // fix tail color
-          if (status === 'error' && index === current - 1) {
-            childProps.className = prefixCls + '-next-error';
-          }
-          if (!child.props.status) {
-            if (index === current) {
-              childProps.status = status;
-            } else if (index < current) {
-              childProps.status = 'finish';
-            } else {
-              childProps.status = 'wait';
-            }
-          }
-          return (0, _react.cloneElement)(child, childProps);
-        })
-      );
-    }
-  }]);
+        }
+        return (0, _react.cloneElement)(child, childProps);
+      })
+    );
+  };
+
   return Steps;
@@ -205,2 +192,3 @@ }(_react.Component);
   style: _propTypes2['default'].object,
+  initial: _propTypes2['default'].number,
   current: _propTypes2['default'].number
@@ -213,2 +201,3 @@ };
   labelPlacement: 'horizontal',
+  initial: 0,
   current: 0,
@@ -215,0 +204,0 @@ status: 'process',

lib/utils.js

 'use strict';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
+exports.__esModule = true;
 exports.isFlexSupported = isFlexSupported;
@@ -7,0 +5,0 @@ function isFlexSupported() {

package.json

 {
   "name": "rc-steps",
-  "version": "3.1.1",
+  "version": "3.2.0",
   "description": "steps ui component for react",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -66,2 +66,8 @@ # rc-steps
     <tr>
+      <td>initial</td>
+      <td>number</td>
+      <td>0</td>
+      <td>index initial</td>
+    </tr>
+    <tr>
       <td>size</td>
@@ -68,0 +74,0 @@ <td>string</td>

No alert changes

Improved metrics

Number of lines in readme file

147

4.26%

Worsened metrics

Total package byte prevSize

52321

-3.59%

Lines of code

1512

-2.83%

No dependency changes