Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

rc-steps

Package Overview
Dependencies
Maintainers
8
Versions
74
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

rc-steps - npm Package Compare versions

Comparing version 3.4.1 to 3.5.0

2

es/index.js
import Steps from './Steps';
import Step from './Step';
Steps.Step = Step;
export { Step };
export default Steps;

334

es/Step.js

@@ -1,6 +0,29 @@

import _extends from 'babel-runtime/helpers/extends';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a 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); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
import React from 'react';

@@ -14,155 +37,169 @@ import PropTypes from 'prop-types';

var Step = function (_React$Component) {
var Step =
/*#__PURE__*/
function (_React$Component) {
_inherits(Step, _React$Component);
function Step() {
var _temp, _this, _ret;
var _getPrototypeOf2;
var _this;
_classCallCheck(this, Step);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
for (var _len = arguments.length, _args = new Array(_len), _key = 0; _key < _len; _key++) {
_args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _initialiseProps.call(_this), _temp), _possibleConstructorReturn(_this, _ret);
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(Step)).call.apply(_getPrototypeOf2, [this].concat(_args)));
_defineProperty(_assertThisInitialized(_this), "onClick", function () {
var _this$props = _this.props,
onClick = _this$props.onClick,
onStepClick = _this$props.onStepClick,
stepIndex = _this$props.stepIndex;
if (onClick) {
onClick.apply(void 0, arguments);
}
onStepClick(stepIndex);
});
return _this;
}
Step.prototype.renderIconNode = function renderIconNode() {
var _classNames;
_createClass(Step, [{
key: "renderIconNode",
value: 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,
icons = _props.icons;
var _this$props2 = this.props,
prefixCls = _this$props2.prefixCls,
progressDot = _this$props2.progressDot,
stepNumber = _this$props2.stepNumber,
status = _this$props2.status,
title = _this$props2.title,
description = _this$props2.description,
icon = _this$props2.icon,
iconPrefix = _this$props2.iconPrefix,
icons = _this$props2.icons;
var iconNode;
var iconClassName = classNames("".concat(prefixCls, "-icon"), "".concat(iconPrefix, "icon"), (_classNames = {}, _defineProperty(_classNames, "".concat(iconPrefix, "icon-").concat(icon), icon && isString(icon)), _defineProperty(_classNames, "".concat(iconPrefix, "icon-check"), !icon && status === 'finish' && icons && !icons.finish), _defineProperty(_classNames, "".concat(iconPrefix, "icon-close"), !icon && status === 'error' && icons && !icons.error), _classNames));
var iconDot = React.createElement("span", {
className: "".concat(prefixCls, "-icon-dot")
}); // `progressDot` enjoy the highest priority
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' && icons && !icons.finish, _classNames[iconPrefix + 'icon-close'] = !icon && status === 'error' && icons && !icons.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 })
);
if (progressDot) {
if (typeof progressDot === 'function') {
iconNode = React.createElement("span", {
className: "".concat(prefixCls, "-icon")
}, progressDot(iconDot, {
index: stepNumber - 1,
status: status,
title: title,
description: description
}));
} else {
iconNode = React.createElement("span", {
className: "".concat(prefixCls, "-icon")
}, iconDot);
}
} else if (icon && !isString(icon)) {
iconNode = React.createElement("span", {
className: "".concat(prefixCls, "-icon")
}, icon);
} else if (icons && icons.finish && status === 'finish') {
iconNode = React.createElement("span", {
className: "".concat(prefixCls, "-icon")
}, icons.finish);
} else if (icons && icons.error && status === 'error') {
iconNode = React.createElement("span", {
className: "".concat(prefixCls, "-icon")
}, icons.error);
} else if (icon || status === 'finish' || status === 'error') {
iconNode = React.createElement("span", {
className: iconClassName
});
} else {
iconNode = React.createElement(
'span',
{ className: prefixCls + '-icon' },
iconDot
);
iconNode = React.createElement("span", {
className: "".concat(prefixCls, "-icon")
}, stepNumber);
}
} else if (icon && !isString(icon)) {
iconNode = React.createElement(
'span',
{ className: prefixCls + '-icon' },
icon
);
} else if (icons && icons.finish && status === 'finish') {
iconNode = React.createElement(
'span',
{ className: prefixCls + '-icon' },
icons.finish
);
} else if (icons && icons.error && status === 'error') {
iconNode = React.createElement(
'span',
{ className: prefixCls + '-icon' },
icons.error
);
} else if (icon || status === 'finish' || status === 'error') {
iconNode = React.createElement('span', { className: iconClassName });
} else {
iconNode = React.createElement(
'span',
{ className: prefixCls + '-icon' },
stepNumber
);
return iconNode;
}
}, {
key: "render",
value: function render() {
var _classNames2;
return iconNode;
};
var _this$props3 = this.props,
className = _this$props3.className,
prefixCls = _this$props3.prefixCls,
style = _this$props3.style,
itemWidth = _this$props3.itemWidth,
active = _this$props3.active,
_this$props3$status = _this$props3.status,
status = _this$props3$status === void 0 ? 'wait' : _this$props3$status,
iconPrefix = _this$props3.iconPrefix,
icon = _this$props3.icon,
wrapperStyle = _this$props3.wrapperStyle,
adjustMarginRight = _this$props3.adjustMarginRight,
stepNumber = _this$props3.stepNumber,
disabled = _this$props3.disabled,
description = _this$props3.description,
title = _this$props3.title,
subTitle = _this$props3.subTitle,
progressDot = _this$props3.progressDot,
tailContent = _this$props3.tailContent,
icons = _this$props3.icons,
stepIndex = _this$props3.stepIndex,
onStepClick = _this$props3.onStepClick,
onClick = _this$props3.onClick,
restProps = _objectWithoutProperties(_this$props3, ["className", "prefixCls", "style", "itemWidth", "active", "status", "iconPrefix", "icon", "wrapperStyle", "adjustMarginRight", "stepNumber", "disabled", "description", "title", "subTitle", "progressDot", "tailContent", "icons", "stepIndex", "onStepClick", "onClick"]);
Step.prototype.render = function render() {
var _classNames2;
var classString = classNames("".concat(prefixCls, "-item"), "".concat(prefixCls, "-item-").concat(status), className, (_classNames2 = {}, _defineProperty(_classNames2, "".concat(prefixCls, "-item-custom"), icon), _defineProperty(_classNames2, "".concat(prefixCls, "-item-active"), active), _defineProperty(_classNames2, "".concat(prefixCls, "-item-disabled"), disabled === true), _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,
icons = _props2.icons,
stepIndex = _props2.stepIndex,
onStepClick = _props2.onStepClick,
onClick = _props2.onClick,
restProps = _objectWithoutProperties(_props2, ['className', 'prefixCls', 'style', 'itemWidth', 'status', 'iconPrefix', 'icon', 'wrapperStyle', 'adjustMarginRight', 'stepNumber', 'description', 'title', 'progressDot', 'tailContent', 'icons', 'stepIndex', 'onStepClick', 'onClick']);
var stepItemStyle = _objectSpread({}, style);
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;
}
if (itemWidth) {
stepItemStyle.width = itemWidth;
}
var accessibilityProps = {};
if (onStepClick) {
accessibilityProps.role = 'button';
accessibilityProps.tabIndex = 0;
accessibilityProps.onClick = this.onClick;
}
if (adjustMarginRight) {
stepItemStyle.marginRight = adjustMarginRight;
}
return React.createElement(
'div',
_extends({
onClick: onClick
}, accessibilityProps, restProps, {
var accessibilityProps = {};
if (onStepClick && !disabled) {
accessibilityProps.role = 'button';
accessibilityProps.tabIndex = 0;
accessibilityProps.onClick = this.onClick;
}
return React.createElement("div", _extends({}, restProps, {
className: classString,
style: stepItemStyle
}),
React.createElement(
'div',
{ 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-title' },
title
),
description && React.createElement(
'div',
{ className: prefixCls + '-item-description' },
description
)
)
);
};
}), React.createElement("div", _extends({
onClick: onClick
}, accessibilityProps, {
className: "".concat(prefixCls, "-item-container")
}), React.createElement("div", {
className: "".concat(prefixCls, "-item-tail")
}, tailContent), React.createElement("div", {
className: "".concat(prefixCls, "-item-icon")
}, this.renderIconNode()), React.createElement("div", {
className: "".concat(prefixCls, "-item-content")
}, React.createElement("div", {
className: "".concat(prefixCls, "-item-title")
}, title, subTitle && React.createElement("div", {
title: subTitle,
className: "".concat(prefixCls, "-item-subtitle")
}, subTitle)), description && React.createElement("div", {
className: "".concat(prefixCls, "-item-description")
}, description))));
}
}]);

@@ -172,3 +209,3 @@ return Step;

Step.propTypes = {
_defineProperty(Step, "propTypes", {
className: PropTypes.string,

@@ -179,2 +216,4 @@ prefixCls: PropTypes.string,

itemWidth: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
active: PropTypes.bool,
disabled: PropTypes.bool,
status: PropTypes.string,

@@ -188,2 +227,3 @@ iconPrefix: PropTypes.string,

title: PropTypes.any,
subTitle: PropTypes.any,
progressDot: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),

@@ -197,22 +237,4 @@ tailContent: PropTypes.any,

onStepClick: PropTypes.func
};
});
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onClick = function () {
var _props3 = _this2.props,
onClick = _props3.onClick,
onStepClick = _props3.onStepClick,
stepIndex = _props3.stepIndex;
if (onClick) {
onClick.apply(undefined, arguments);
}
onStepClick(stepIndex);
};
};
export default Step;
export { Step as default };

@@ -1,6 +0,29 @@

import _extends from 'babel-runtime/helpers/extends';
import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a 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); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/* eslint react/no-did-mount-set-state: 0 */

@@ -14,11 +37,15 @@ import React, { cloneElement, Children, Component } from 'react';

var Steps = function (_Component) {
var Steps =
/*#__PURE__*/
function (_Component) {
_inherits(Steps, _Component);
function Steps(props) {
var _this;
_classCallCheck(this, Steps);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_this = _possibleConstructorReturn(this, _getPrototypeOf(Steps).call(this, props));
_this.onStepClick = function (next) {
_defineProperty(_assertThisInitialized(_this), "onStepClick", function (next) {
var _this$props = _this.props,

@@ -31,10 +58,13 @@ onChange = _this$props.onChange,

}
};
});
_this.calcStepOffsetWidth = function () {
_defineProperty(_assertThisInitialized(_this), "calcStepOffsetWidth", function () {
if (isFlexSupported()) {
return;
}
// Just for IE9
var domNode = findDOMNode(_this);
var lastStepOffsetWidth = _this.state.lastStepOffsetWidth; // Just for IE9
var domNode = findDOMNode(_assertThisInitialized(_this));
if (domNode.children.length > 0) {

@@ -44,13 +74,17 @@ if (_this.calcTimeout) {

}
_this.calcTimeout = setTimeout(function () {
// +1 for fit edge bug of digit width, like 35.4px
var lastStepOffsetWidth = (domNode.lastChild.offsetWidth || 0) + 1;
// Reduce shake bug
if (_this.state.lastStepOffsetWidth === lastStepOffsetWidth || Math.abs(_this.state.lastStepOffsetWidth - lastStepOffsetWidth) <= 3) {
var offsetWidth = (domNode.lastChild.offsetWidth || 0) + 1; // Reduce shake bug
if (lastStepOffsetWidth === offsetWidth || Math.abs(lastStepOffsetWidth - offsetWidth) <= 3) {
return;
}
_this.setState({ lastStepOffsetWidth: lastStepOffsetWidth });
_this.setState({
lastStepOffsetWidth: offsetWidth
});
});
}
};
});

@@ -65,67 +99,76 @@ _this.state = {

Steps.prototype.componentDidMount = function componentDidMount() {
this.calcStepOffsetWidth();
if (!isFlexSupported()) {
this.setState({
flexSupported: false
});
}
};
_createClass(Steps, [{
key: "componentDidMount",
value: function componentDidMount() {
this.calcStepOffsetWidth();
Steps.prototype.componentDidUpdate = function componentDidUpdate() {
this.calcStepOffsetWidth();
};
Steps.prototype.componentWillUnmount = function componentWillUnmount() {
if (this.calcTimeout) {
clearTimeout(this.calcTimeout);
if (!isFlexSupported()) {
this.setState({
flexSupported: false
});
}
}
if (this.calcStepOffsetWidth && this.calcStepOffsetWidth.cancel) {
this.calcStepOffsetWidth.cancel();
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
this.calcStepOffsetWidth();
}
};
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.calcTimeout) {
clearTimeout(this.calcTimeout);
}
Steps.prototype.render = function render() {
var _classNames,
_this2 = this;
if (this.calcStepOffsetWidth && this.calcStepOffsetWidth.cancel) {
this.calcStepOffsetWidth.cancel();
}
}
}, {
key: "render",
value: function render() {
var _classNames,
_this2 = this;
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,
icons = _props.icons,
onChange = _props.onChange,
restProps = _objectWithoutProperties(_props, ['prefixCls', 'style', 'className', 'children', 'direction', 'labelPlacement', 'iconPrefix', 'status', 'size', 'current', 'progressDot', 'initial', 'icons', 'onChange']);
var _this$props2 = this.props,
prefixCls = _this$props2.prefixCls,
_this$props2$style = _this$props2.style,
style = _this$props2$style === void 0 ? {} : _this$props2$style,
className = _this$props2.className,
children = _this$props2.children,
direction = _this$props2.direction,
type = _this$props2.type,
labelPlacement = _this$props2.labelPlacement,
iconPrefix = _this$props2.iconPrefix,
status = _this$props2.status,
size = _this$props2.size,
current = _this$props2.current,
progressDot = _this$props2.progressDot,
initial = _this$props2.initial,
icons = _this$props2.icons,
onChange = _this$props2.onChange,
restProps = _objectWithoutProperties(_this$props2, ["prefixCls", "style", "className", "children", "direction", "type", "labelPlacement", "iconPrefix", "status", "size", "current", "progressDot", "initial", "icons", "onChange"]);
var _state = this.state,
lastStepOffsetWidth = _state.lastStepOffsetWidth,
flexSupported = _state.flexSupported;
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[prefixCls + '-flex-not-supported'] = !flexSupported, _classNames));
return React.createElement(
'div',
_extends({ className: classString, style: style }, restProps),
Children.map(filteredChildren, function (child, index) {
var isNav = type === 'navigation';
var _this$state = this.state,
lastStepOffsetWidth = _this$state.lastStepOffsetWidth,
flexSupported = _this$state.flexSupported;
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, "".concat(prefixCls, "-").concat(direction), className, (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-").concat(size), size), _defineProperty(_classNames, "".concat(prefixCls, "-label-").concat(adjustedlabelPlacement), direction === 'horizontal'), _defineProperty(_classNames, "".concat(prefixCls, "-dot"), !!progressDot), _defineProperty(_classNames, "".concat(prefixCls, "-navigation"), isNav), _defineProperty(_classNames, "".concat(prefixCls, "-flex-not-supported"), !flexSupported), _classNames));
return React.createElement("div", _extends({
className: classString,
style: style
}, restProps), Children.map(filteredChildren, function (child, index) {
if (!child) {
return null;
}
var stepNumber = initial + index;
var childProps = _extends({
stepNumber: '' + (stepNumber + 1),
var childProps = _objectSpread({
stepNumber: "".concat(stepNumber + 1),
stepIndex: stepNumber,

@@ -139,10 +182,18 @@ prefixCls: prefixCls,

}, child.props);
if (!flexSupported && direction !== 'vertical' && index !== lastIndex) {
childProps.itemWidth = 100 / lastIndex + '%';
childProps.adjustMarginRight = -Math.round(lastStepOffsetWidth / lastIndex + 1);
}
// fix tail color
if (!flexSupported && direction !== 'vertical') {
if (isNav) {
childProps.itemWidth = "".concat(100 / (lastIndex + 1), "%");
childProps.adjustMarginRight = 0;
} else if (index !== lastIndex) {
childProps.itemWidth = "".concat(100 / lastIndex, "%");
childProps.adjustMarginRight = -Math.round(lastStepOffsetWidth / lastIndex + 1);
}
} // fix tail color
if (status === 'error' && index === current - 1) {
childProps.className = prefixCls + '-next-error';
childProps.className = "".concat(prefixCls, "-next-error");
}
if (!child.props.status) {

@@ -157,6 +208,8 @@ if (stepNumber === current) {

}
childProps.active = stepNumber === current;
return cloneElement(child, childProps);
})
);
};
}));
}
}]);

@@ -166,3 +219,4 @@ return Steps;

Steps.propTypes = {
_defineProperty(Steps, "propTypes", {
type: PropTypes.string,
prefixCls: PropTypes.string,

@@ -185,4 +239,6 @@ className: PropTypes.string,

onChange: PropTypes.func
};
Steps.defaultProps = {
});
_defineProperty(Steps, "defaultProps", {
type: 'default',
prefixCls: 'rc-steps',

@@ -197,3 +253,4 @@ iconPrefix: 'rc',

progressDot: false
};
export default Steps;
});
export { Steps as default };

@@ -0,8 +1,9 @@

// eslint-disable-next-line import/prefer-default-export
export function isFlexSupported() {
if (typeof window !== 'undefined' && window.document && window.document.documentElement) {
var documentElement = window.document.documentElement;
return 'flex' in documentElement.style || 'webkitFlex' in documentElement.style || 'Flex' in documentElement.style || 'msFlex' in documentElement.style;
}
return false;
}
# History
----
## 3.5.0
- Support `navigation` type & `disabled` prop.
## 3.4.0

@@ -5,0 +9,0 @@

@@ -1,19 +0,22 @@

'use strict';
"use strict";
exports.__esModule = true;
exports.Step = undefined;
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "Step", {
enumerable: true,
get: function get() {
return _Step["default"];
}
});
exports["default"] = void 0;
var _Steps = require('./Steps');
var _Steps = _interopRequireDefault(require("./Steps"));
var _Steps2 = _interopRequireDefault(_Steps);
var _Step = _interopRequireDefault(require("./Step"));
var _Step = require('./Step');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
var _Step2 = _interopRequireDefault(_Step);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
_Steps2['default'].Step = _Step2['default'];
exports.Step = _Step2['default'];
exports['default'] = _Steps2['default'];
_Steps["default"].Step = _Step["default"];
var _default = _Steps["default"];
exports["default"] = _default;

@@ -1,39 +0,44 @@

'use strict';
"use strict";
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireDefault(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _propTypes = _interopRequireDefault(require("prop-types"));
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
var _classnames = _interopRequireDefault(require("classnames"));
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _inherits3 = _interopRequireDefault(_inherits2);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _react = require('react');
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); } }
var _react2 = _interopRequireDefault(_react);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _propTypes = require('prop-types');
function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _classnames = require('classnames');
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _classnames2 = _interopRequireDefault(_classnames);
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function isString(str) {

@@ -43,203 +48,202 @@ return typeof str === 'string';

var Step = function (_React$Component) {
(0, _inherits3['default'])(Step, _React$Component);
var Step =
/*#__PURE__*/
function (_React$Component) {
_inherits(Step, _React$Component);
function Step() {
var _temp, _this, _ret;
var _getPrototypeOf2;
(0, _classCallCheck3['default'])(this, Step);
var _this;
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
_classCallCheck(this, Step);
for (var _len = arguments.length, _args = new Array(_len), _key = 0; _key < _len; _key++) {
_args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _initialiseProps.call(_this), _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(Step)).call.apply(_getPrototypeOf2, [this].concat(_args)));
_defineProperty(_assertThisInitialized(_this), "onClick", function () {
var _this$props = _this.props,
onClick = _this$props.onClick,
onStepClick = _this$props.onStepClick,
stepIndex = _this$props.stepIndex;
if (onClick) {
onClick.apply(void 0, arguments);
}
onStepClick(stepIndex);
});
return _this;
}
Step.prototype.renderIconNode = function renderIconNode() {
var _classNames;
_createClass(Step, [{
key: "renderIconNode",
value: 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,
icons = _props.icons;
var _this$props2 = this.props,
prefixCls = _this$props2.prefixCls,
progressDot = _this$props2.progressDot,
stepNumber = _this$props2.stepNumber,
status = _this$props2.status,
title = _this$props2.title,
description = _this$props2.description,
icon = _this$props2.icon,
iconPrefix = _this$props2.iconPrefix,
icons = _this$props2.icons;
var iconNode;
var iconClassName = (0, _classnames["default"])("".concat(prefixCls, "-icon"), "".concat(iconPrefix, "icon"), (_classNames = {}, _defineProperty(_classNames, "".concat(iconPrefix, "icon-").concat(icon), icon && isString(icon)), _defineProperty(_classNames, "".concat(iconPrefix, "icon-check"), !icon && status === 'finish' && icons && !icons.finish), _defineProperty(_classNames, "".concat(iconPrefix, "icon-close"), !icon && status === 'error' && icons && !icons.error), _classNames));
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' && icons && !icons.finish, _classNames[iconPrefix + 'icon-close'] = !icon && status === 'error' && icons && !icons.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 })
);
var iconDot = _react["default"].createElement("span", {
className: "".concat(prefixCls, "-icon-dot")
}); // `progressDot` enjoy the highest priority
if (progressDot) {
if (typeof progressDot === 'function') {
iconNode = _react["default"].createElement("span", {
className: "".concat(prefixCls, "-icon")
}, progressDot(iconDot, {
index: stepNumber - 1,
status: status,
title: title,
description: description
}));
} else {
iconNode = _react["default"].createElement("span", {
className: "".concat(prefixCls, "-icon")
}, iconDot);
}
} else if (icon && !isString(icon)) {
iconNode = _react["default"].createElement("span", {
className: "".concat(prefixCls, "-icon")
}, icon);
} else if (icons && icons.finish && status === 'finish') {
iconNode = _react["default"].createElement("span", {
className: "".concat(prefixCls, "-icon")
}, icons.finish);
} else if (icons && icons.error && status === 'error') {
iconNode = _react["default"].createElement("span", {
className: "".concat(prefixCls, "-icon")
}, icons.error);
} else if (icon || status === 'finish' || status === 'error') {
iconNode = _react["default"].createElement("span", {
className: iconClassName
});
} else {
iconNode = _react2['default'].createElement(
'span',
{ className: prefixCls + '-icon' },
iconDot
);
iconNode = _react["default"].createElement("span", {
className: "".concat(prefixCls, "-icon")
}, stepNumber);
}
} else if (icon && !isString(icon)) {
iconNode = _react2['default'].createElement(
'span',
{ className: prefixCls + '-icon' },
icon
);
} else if (icons && icons.finish && status === 'finish') {
iconNode = _react2['default'].createElement(
'span',
{ className: prefixCls + '-icon' },
icons.finish
);
} else if (icons && icons.error && status === 'error') {
iconNode = _react2['default'].createElement(
'span',
{ className: prefixCls + '-icon' },
icons.error
);
} else if (icon || status === 'finish' || status === 'error') {
iconNode = _react2['default'].createElement('span', { className: iconClassName });
} else {
iconNode = _react2['default'].createElement(
'span',
{ className: prefixCls + '-icon' },
stepNumber
);
return iconNode;
}
}, {
key: "render",
value: function render() {
var _classNames2;
return iconNode;
};
var _this$props3 = this.props,
className = _this$props3.className,
prefixCls = _this$props3.prefixCls,
style = _this$props3.style,
itemWidth = _this$props3.itemWidth,
active = _this$props3.active,
_this$props3$status = _this$props3.status,
status = _this$props3$status === void 0 ? 'wait' : _this$props3$status,
iconPrefix = _this$props3.iconPrefix,
icon = _this$props3.icon,
wrapperStyle = _this$props3.wrapperStyle,
adjustMarginRight = _this$props3.adjustMarginRight,
stepNumber = _this$props3.stepNumber,
disabled = _this$props3.disabled,
description = _this$props3.description,
title = _this$props3.title,
subTitle = _this$props3.subTitle,
progressDot = _this$props3.progressDot,
tailContent = _this$props3.tailContent,
icons = _this$props3.icons,
stepIndex = _this$props3.stepIndex,
onStepClick = _this$props3.onStepClick,
onClick = _this$props3.onClick,
restProps = _objectWithoutProperties(_this$props3, ["className", "prefixCls", "style", "itemWidth", "active", "status", "iconPrefix", "icon", "wrapperStyle", "adjustMarginRight", "stepNumber", "disabled", "description", "title", "subTitle", "progressDot", "tailContent", "icons", "stepIndex", "onStepClick", "onClick"]);
Step.prototype.render = function render() {
var _classNames2;
var classString = (0, _classnames["default"])("".concat(prefixCls, "-item"), "".concat(prefixCls, "-item-").concat(status), className, (_classNames2 = {}, _defineProperty(_classNames2, "".concat(prefixCls, "-item-custom"), icon), _defineProperty(_classNames2, "".concat(prefixCls, "-item-active"), active), _defineProperty(_classNames2, "".concat(prefixCls, "-item-disabled"), disabled === true), _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,
icons = _props2.icons,
stepIndex = _props2.stepIndex,
onStepClick = _props2.onStepClick,
onClick = _props2.onClick,
restProps = (0, _objectWithoutProperties3['default'])(_props2, ['className', 'prefixCls', 'style', 'itemWidth', 'status', 'iconPrefix', 'icon', 'wrapperStyle', 'adjustMarginRight', 'stepNumber', 'description', 'title', 'progressDot', 'tailContent', 'icons', 'stepIndex', 'onStepClick', 'onClick']);
var stepItemStyle = _objectSpread({}, style);
if (itemWidth) {
stepItemStyle.width = itemWidth;
}
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;
}
if (adjustMarginRight) {
stepItemStyle.marginRight = adjustMarginRight;
}
var accessibilityProps = {};
if (onStepClick) {
accessibilityProps.role = 'button';
accessibilityProps.tabIndex = 0;
accessibilityProps.onClick = this.onClick;
}
var accessibilityProps = {};
return _react2['default'].createElement(
'div',
(0, _extends3['default'])({
onClick: onClick
}, accessibilityProps, restProps, {
if (onStepClick && !disabled) {
accessibilityProps.role = 'button';
accessibilityProps.tabIndex = 0;
accessibilityProps.onClick = this.onClick;
}
return _react["default"].createElement("div", _extends({}, restProps, {
className: classString,
style: stepItemStyle
}),
_react2['default'].createElement(
'div',
{ 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-title' },
title
),
description && _react2['default'].createElement(
'div',
{ className: prefixCls + '-item-description' },
description
)
)
);
};
}), _react["default"].createElement("div", _extends({
onClick: onClick
}, accessibilityProps, {
className: "".concat(prefixCls, "-item-container")
}), _react["default"].createElement("div", {
className: "".concat(prefixCls, "-item-tail")
}, tailContent), _react["default"].createElement("div", {
className: "".concat(prefixCls, "-item-icon")
}, this.renderIconNode()), _react["default"].createElement("div", {
className: "".concat(prefixCls, "-item-content")
}, _react["default"].createElement("div", {
className: "".concat(prefixCls, "-item-title")
}, title, subTitle && _react["default"].createElement("div", {
title: subTitle,
className: "".concat(prefixCls, "-item-subtitle")
}, subTitle)), description && _react["default"].createElement("div", {
className: "".concat(prefixCls, "-item-description")
}, description))));
}
}]);
return Step;
}(_react2['default'].Component);
}(_react["default"].Component);
Step.propTypes = {
className: _propTypes2['default'].string,
prefixCls: _propTypes2['default'].string,
style: _propTypes2['default'].object,
wrapperStyle: _propTypes2['default'].object,
itemWidth: _propTypes2['default'].oneOfType([_propTypes2['default'].number, _propTypes2['default'].string]),
status: _propTypes2['default'].string,
iconPrefix: _propTypes2['default'].string,
icon: _propTypes2['default'].node,
adjustMarginRight: _propTypes2['default'].oneOfType([_propTypes2['default'].number, _propTypes2['default'].string]),
stepNumber: _propTypes2['default'].string,
stepIndex: _propTypes2['default'].number,
description: _propTypes2['default'].any,
title: _propTypes2['default'].any,
progressDot: _propTypes2['default'].oneOfType([_propTypes2['default'].bool, _propTypes2['default'].func]),
tailContent: _propTypes2['default'].any,
icons: _propTypes2['default'].shape({
finish: _propTypes2['default'].node,
error: _propTypes2['default'].node
exports["default"] = Step;
_defineProperty(Step, "propTypes", {
className: _propTypes["default"].string,
prefixCls: _propTypes["default"].string,
style: _propTypes["default"].object,
wrapperStyle: _propTypes["default"].object,
itemWidth: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),
active: _propTypes["default"].bool,
disabled: _propTypes["default"].bool,
status: _propTypes["default"].string,
iconPrefix: _propTypes["default"].string,
icon: _propTypes["default"].node,
adjustMarginRight: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),
stepNumber: _propTypes["default"].string,
stepIndex: _propTypes["default"].number,
description: _propTypes["default"].any,
title: _propTypes["default"].any,
subTitle: _propTypes["default"].any,
progressDot: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].func]),
tailContent: _propTypes["default"].any,
icons: _propTypes["default"].shape({
finish: _propTypes["default"].node,
error: _propTypes["default"].node
}),
onClick: _propTypes2['default'].func,
onStepClick: _propTypes2['default'].func
};
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onClick = function () {
var _props3 = _this2.props,
onClick = _props3.onClick,
onStepClick = _props3.onStepClick,
stepIndex = _props3.stepIndex;
if (onClick) {
onClick.apply(undefined, arguments);
}
onStepClick(stepIndex);
};
};
exports['default'] = Step;
module.exports = exports['default'];
onClick: _propTypes["default"].func,
onStepClick: _propTypes["default"].func
});

@@ -1,57 +0,65 @@

'use strict';
"use strict";
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _extends2 = require('babel-runtime/helpers/extends');
var _react = _interopRequireWildcard(require("react"));
var _extends3 = _interopRequireDefault(_extends2);
var _propTypes = _interopRequireDefault(require("prop-types"));
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
var _reactDom = require("react-dom");
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
var _classnames = _interopRequireDefault(require("classnames"));
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _debounce = _interopRequireDefault(require("lodash/debounce"));
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _utils = require("./utils");
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } }
var _inherits2 = require('babel-runtime/helpers/inherits');
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _inherits3 = _interopRequireDefault(_inherits2);
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
var _react = require('react');
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
var _react2 = _interopRequireDefault(_react);
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
var _propTypes = require('prop-types');
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _reactDom = require('react-dom');
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); } }
var _classnames = require('classnames');
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _classnames2 = _interopRequireDefault(_classnames);
function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _debounce = require('lodash/debounce');
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _debounce2 = _interopRequireDefault(_debounce);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _utils = require('./utils');
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
/* eslint react/no-did-mount-set-state: 0 */
var Steps = function (_Component) {
(0, _inherits3['default'])(Steps, _Component);
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var Steps =
/*#__PURE__*/
function (_Component) {
_inherits(Steps, _Component);
function Steps(props) {
(0, _classCallCheck3['default'])(this, Steps);
var _this;
var _this = (0, _possibleConstructorReturn3['default'])(this, _Component.call(this, props));
_classCallCheck(this, Steps);
_this.onStepClick = function (next) {
_this = _possibleConstructorReturn(this, _getPrototypeOf(Steps).call(this, props));
_defineProperty(_assertThisInitialized(_this), "onStepClick", function (next) {
var _this$props = _this.props,

@@ -64,10 +72,13 @@ onChange = _this$props.onChange,

}
};
});
_this.calcStepOffsetWidth = function () {
_defineProperty(_assertThisInitialized(_this), "calcStepOffsetWidth", function () {
if ((0, _utils.isFlexSupported)()) {
return;
}
// Just for IE9
var domNode = (0, _reactDom.findDOMNode)(_this);
var lastStepOffsetWidth = _this.state.lastStepOffsetWidth; // Just for IE9
var domNode = (0, _reactDom.findDOMNode)(_assertThisInitialized(_this));
if (domNode.children.length > 0) {

@@ -77,13 +88,17 @@ if (_this.calcTimeout) {

}
_this.calcTimeout = setTimeout(function () {
// +1 for fit edge bug of digit width, like 35.4px
var lastStepOffsetWidth = (domNode.lastChild.offsetWidth || 0) + 1;
// Reduce shake bug
if (_this.state.lastStepOffsetWidth === lastStepOffsetWidth || Math.abs(_this.state.lastStepOffsetWidth - lastStepOffsetWidth) <= 3) {
var offsetWidth = (domNode.lastChild.offsetWidth || 0) + 1; // Reduce shake bug
if (lastStepOffsetWidth === offsetWidth || Math.abs(lastStepOffsetWidth - offsetWidth) <= 3) {
return;
}
_this.setState({ lastStepOffsetWidth: lastStepOffsetWidth });
_this.setState({
lastStepOffsetWidth: offsetWidth
});
});
}
};
});

@@ -94,70 +109,82 @@ _this.state = {

};
_this.calcStepOffsetWidth = (0, _debounce2['default'])(_this.calcStepOffsetWidth, 150);
_this.calcStepOffsetWidth = (0, _debounce["default"])(_this.calcStepOffsetWidth, 150);
return _this;
}
Steps.prototype.componentDidMount = function componentDidMount() {
this.calcStepOffsetWidth();
if (!(0, _utils.isFlexSupported)()) {
this.setState({
flexSupported: false
});
}
};
_createClass(Steps, [{
key: "componentDidMount",
value: function componentDidMount() {
this.calcStepOffsetWidth();
Steps.prototype.componentDidUpdate = function componentDidUpdate() {
this.calcStepOffsetWidth();
};
Steps.prototype.componentWillUnmount = function componentWillUnmount() {
if (this.calcTimeout) {
clearTimeout(this.calcTimeout);
if (!(0, _utils.isFlexSupported)()) {
this.setState({
flexSupported: false
});
}
}
if (this.calcStepOffsetWidth && this.calcStepOffsetWidth.cancel) {
this.calcStepOffsetWidth.cancel();
}, {
key: "componentDidUpdate",
value: function componentDidUpdate() {
this.calcStepOffsetWidth();
}
};
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (this.calcTimeout) {
clearTimeout(this.calcTimeout);
}
Steps.prototype.render = function render() {
var _classNames,
_this2 = this;
if (this.calcStepOffsetWidth && this.calcStepOffsetWidth.cancel) {
this.calcStepOffsetWidth.cancel();
}
}
}, {
key: "render",
value: function render() {
var _classNames,
_this2 = this;
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,
icons = _props.icons,
onChange = _props.onChange,
restProps = (0, _objectWithoutProperties3['default'])(_props, ['prefixCls', 'style', 'className', 'children', 'direction', 'labelPlacement', 'iconPrefix', 'status', 'size', 'current', 'progressDot', 'initial', 'icons', 'onChange']);
var _state = this.state,
lastStepOffsetWidth = _state.lastStepOffsetWidth,
flexSupported = _state.flexSupported;
var _this$props2 = this.props,
prefixCls = _this$props2.prefixCls,
_this$props2$style = _this$props2.style,
style = _this$props2$style === void 0 ? {} : _this$props2$style,
className = _this$props2.className,
children = _this$props2.children,
direction = _this$props2.direction,
type = _this$props2.type,
labelPlacement = _this$props2.labelPlacement,
iconPrefix = _this$props2.iconPrefix,
status = _this$props2.status,
size = _this$props2.size,
current = _this$props2.current,
progressDot = _this$props2.progressDot,
initial = _this$props2.initial,
icons = _this$props2.icons,
onChange = _this$props2.onChange,
restProps = _objectWithoutProperties(_this$props2, ["prefixCls", "style", "className", "children", "direction", "type", "labelPlacement", "iconPrefix", "status", "size", "current", "progressDot", "initial", "icons", "onChange"]);
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[prefixCls + '-flex-not-supported'] = !flexSupported, _classNames));
var isNav = type === 'navigation';
var _this$state = this.state,
lastStepOffsetWidth = _this$state.lastStepOffsetWidth,
flexSupported = _this$state.flexSupported;
return _react2['default'].createElement(
'div',
(0, _extends3['default'])({ className: classString, style: style }, restProps),
_react.Children.map(filteredChildren, function (child, index) {
var filteredChildren = _react["default"].Children.toArray(children).filter(function (c) {
return !!c;
});
var lastIndex = filteredChildren.length - 1;
var adjustedlabelPlacement = progressDot ? 'vertical' : labelPlacement;
var classString = (0, _classnames["default"])(prefixCls, "".concat(prefixCls, "-").concat(direction), className, (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-").concat(size), size), _defineProperty(_classNames, "".concat(prefixCls, "-label-").concat(adjustedlabelPlacement), direction === 'horizontal'), _defineProperty(_classNames, "".concat(prefixCls, "-dot"), !!progressDot), _defineProperty(_classNames, "".concat(prefixCls, "-navigation"), isNav), _defineProperty(_classNames, "".concat(prefixCls, "-flex-not-supported"), !flexSupported), _classNames));
return _react["default"].createElement("div", _extends({
className: classString,
style: style
}, restProps), _react.Children.map(filteredChildren, function (child, index) {
if (!child) {
return null;
}
var stepNumber = initial + index;
var childProps = (0, _extends3['default'])({
stepNumber: '' + (stepNumber + 1),
var childProps = _objectSpread({
stepNumber: "".concat(stepNumber + 1),
stepIndex: stepNumber,

@@ -171,10 +198,18 @@ prefixCls: prefixCls,

}, child.props);
if (!flexSupported && direction !== 'vertical' && index !== lastIndex) {
childProps.itemWidth = 100 / lastIndex + '%';
childProps.adjustMarginRight = -Math.round(lastStepOffsetWidth / lastIndex + 1);
}
// fix tail color
if (!flexSupported && direction !== 'vertical') {
if (isNav) {
childProps.itemWidth = "".concat(100 / (lastIndex + 1), "%");
childProps.adjustMarginRight = 0;
} else if (index !== lastIndex) {
childProps.itemWidth = "".concat(100 / lastIndex, "%");
childProps.adjustMarginRight = -Math.round(lastStepOffsetWidth / lastIndex + 1);
}
} // fix tail color
if (status === 'error' && index === current - 1) {
childProps.className = prefixCls + '-next-error';
childProps.className = "".concat(prefixCls, "-next-error");
}
if (!child.props.status) {

@@ -189,6 +224,8 @@ if (stepNumber === current) {

}
childProps.active = stepNumber === current;
return (0, _react.cloneElement)(child, childProps);
})
);
};
}));
}
}]);

@@ -198,22 +235,27 @@ return Steps;

Steps.propTypes = {
prefixCls: _propTypes2['default'].string,
className: _propTypes2['default'].string,
iconPrefix: _propTypes2['default'].string,
direction: _propTypes2['default'].string,
labelPlacement: _propTypes2['default'].string,
children: _propTypes2['default'].any,
status: _propTypes2['default'].string,
size: _propTypes2['default'].string,
progressDot: _propTypes2['default'].oneOfType([_propTypes2['default'].bool, _propTypes2['default'].func]),
style: _propTypes2['default'].object,
initial: _propTypes2['default'].number,
current: _propTypes2['default'].number,
icons: _propTypes2['default'].shape({
finish: _propTypes2['default'].node,
error: _propTypes2['default'].node
exports["default"] = Steps;
_defineProperty(Steps, "propTypes", {
type: _propTypes["default"].string,
prefixCls: _propTypes["default"].string,
className: _propTypes["default"].string,
iconPrefix: _propTypes["default"].string,
direction: _propTypes["default"].string,
labelPlacement: _propTypes["default"].string,
children: _propTypes["default"].any,
status: _propTypes["default"].string,
size: _propTypes["default"].string,
progressDot: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].func]),
style: _propTypes["default"].object,
initial: _propTypes["default"].number,
current: _propTypes["default"].number,
icons: _propTypes["default"].shape({
finish: _propTypes["default"].node,
error: _propTypes["default"].node
}),
onChange: _propTypes2['default'].func
};
Steps.defaultProps = {
onChange: _propTypes["default"].func
});
_defineProperty(Steps, "defaultProps", {
type: 'default',
prefixCls: 'rc-steps',

@@ -228,4 +270,2 @@ iconPrefix: 'rc',

progressDot: false
};
exports['default'] = Steps;
module.exports = exports['default'];
});

@@ -1,12 +0,16 @@

'use strict';
"use strict";
exports.__esModule = true;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.isFlexSupported = isFlexSupported;
// eslint-disable-next-line import/prefer-default-export
function isFlexSupported() {
if (typeof window !== 'undefined' && window.document && window.document.documentElement) {
var documentElement = window.document.documentElement;
return 'flex' in documentElement.style || 'webkitFlex' in documentElement.style || 'Flex' in documentElement.style || 'msFlex' in documentElement.style;
}
return false;
}
{
"name": "rc-steps",
"version": "3.4.1",
"version": "3.5.0",
"description": "steps ui component for react",

@@ -47,3 +47,5 @@ "keywords": [

"coverage": "jest --coverage && cat ./coverage/lcov.info | coveralls",
"now-build": "npm run build"
"now-build": "npm run build",
"pre-commit": "rc-tools run pre-commit",
"lint-staged": "lint-staged"
},

@@ -65,3 +67,3 @@ "jest": {

"devDependencies": {
"coveralls": "^2.11.15",
"coveralls": "^3.0.4",
"enzyme": "^3.0.0",

@@ -74,10 +76,17 @@ "enzyme-adapter-react-16": "^1.0.1",

"rc-dialog": "6.x",
"rc-tools": "7.x",
"rc-tools": "9.x",
"react": "^16.0.0",
"react-dom": "^16.0.0",
"react-test-renderer": "^16.0.0"
"react-test-renderer": "^16.0.0",
"lint-staged": "^9.0.0"
},
"pre-commit": [
"lint"
"lint-staged"
],
"lint-staged": {
"*.{js,jsx,ts,tsx}": [
"npm run pre-commit",
"git add"
]
},
"dependencies": {

@@ -84,0 +93,0 @@ "babel-runtime": "^6.23.0",

@@ -54,2 +54,8 @@ # rc-steps

<tr>
<td>type</td>
<td>string</td>
<td>default</td>
<td>diretypetion of Steps, enum: `default` or `navigation`</td>
</tr>
<tr>
<td>direction</td>

@@ -124,2 +130,8 @@ <td>string</td>

<tr>
<td>subTitle</td>
<td>ReactNode</td>
<td></td>
<td>subTitle of step item</td>
</tr>
<tr>
<td>description</td>

@@ -148,2 +160,8 @@ <td>ReactNode</td>

</tr>
<tr>
<td>disabled</td>
<td>bool</td>
<td>false</td>
<td>disabled step when onChange exist</td>
</tr>
</tbody>

@@ -150,0 +168,0 @@ </table>

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc