@uiw/react-steps/cjs/Steps.js

Steps component

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireWildcard(require("react"));
var _Step = _interopRequireDefault(require("./Step"));
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["prefixCls", "style", "className", "children", "current", "status", "progressDot", "direction"];
function InternalSteps(props) {
  var _props$prefixCls = props.prefixCls,
    prefixCls = _props$prefixCls === void 0 ? 'w-steps' : _props$prefixCls,
    _props$style = props.style,
    style = _props$style === void 0 ? {} : _props$style,
    className = props.className,
    children = props.children,
    current = props.current,
    _props$status = props.status,
    status = _props$status === void 0 ? 'process' : _props$status,
    _props$progressDot = props.progressDot,
    progressDot = _props$progressDot === void 0 ? false : _props$progressDot,
    _props$direction = props.direction,
    direction = _props$direction === void 0 ? 'horizontal' : _props$direction,
    resetProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
  var warpRef = (0, _react.useRef)(null);
  var _useState = (0, _react.useState)(0),
    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
    lastStepOffsetWidth = _useState2[0],
    setLastStepOffsetWidth = _useState2[1];
  var filteredChildren = _react["default"].Children.toArray(children).filter(function (c) {
    return !!c;
  });
  var lastIndex = filteredChildren.length - 1; // 最后一个节点的索引数字
  var classString = [prefixCls, "".concat(prefixCls, "-").concat(direction), !!progressDot ? "".concat(prefixCls, "-dot") : null].filter(Boolean).join(' ').trim();
  (0, _react.useEffect)(function () {
    return calcStepOffsetWidth();
  });

  // 计算每一步的宽度
  function calcStepOffsetWidth() {
    var domNode = warpRef.current;
    if (domNode && domNode.lastChild) {
      var width = (domNode.lastChild.offsetWidth || 0) + 1;
      if (width === lastStepOffsetWidth || Math.abs(width - lastStepOffsetWidth) <= 3) {
        return;
      }
      setLastStepOffsetWidth(width);
    }
  }
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
    className: classString,
    style: style
  }, resetProps), {}, {
    ref: warpRef,
    children: _react["default"].Children.map(children, function (child, index) {
      var childProps = (0, _objectSpread2["default"])({
        stepNumber: "".concat(index + 1),
        prefixCls: prefixCls,
        progressDot: progressDot
      }, child.props);
      if (index !== lastIndex && direction !== 'vertical') {
        childProps.itemWidth = "".concat(100 / lastIndex, "%");
        childProps.adjustMarginRight = -Math.round(lastStepOffsetWidth / lastIndex + 1);
      }
      if (progressDot && direction !== 'vertical') {
        childProps.itemWidth = "".concat(100 / filteredChildren.length, "%");
        childProps.adjustMarginRight = 0;
      }
      // 错误前面
      if (status === 'error' && index === current - 1) {
        childProps.className = "".concat(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 /*#__PURE__*/_react["default"].cloneElement(child, childProps);
    })
  }));
}
InternalSteps.Step = _Step["default"];
var _default = exports["default"] = InternalSteps;
module.exports = exports.default;