choerodon-ui/es/rc-components/steps/Step.js

An enterprise-class UI design language and React-based implementation

import _extends from "@babel/runtime/helpers/extends";
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["className", "prefixCls", "style", "itemWidth", "status", "iconPrefix", "icon", "wrapperStyle", "adjustMarginRight", "stepNumber", "description", "title", "progressDot", "tailContent", "onChange", "onClick", "navigation"];
import React, { useCallback } from 'react';
import classNames from 'classnames';
import noop from 'lodash/noop';
import RenderIcon from './RenderIcon';
import Icon from '../../icon';

var Step = function Step(props) {
  var className = props.className,
      prefixCls = props.prefixCls,
      style = props.style,
      itemWidth = props.itemWidth,
      _props$status = props.status,
      status = _props$status === void 0 ? 'wait' : _props$status,
      iconPrefix = props.iconPrefix,
      icon = props.icon,
      wrapperStyle = props.wrapperStyle,
      adjustMarginRight = props.adjustMarginRight,
      stepNumber = props.stepNumber,
      description = props.description,
      title = props.title,
      progressDot = props.progressDot,
      tailContent = props.tailContent,
      onChange = props.onChange,
      _props$onClick = props.onClick,
      onClick = _props$onClick === void 0 ? noop : _props$onClick,
      navigation = props.navigation,
      restProps = _objectWithoutProperties(props, _excluded);

  var onClickItem = useCallback(function (e) {
    onClick(e);

    if (onChange) {
      onChange(Number(stepNumber) - 1);
    }
  }, [stepNumber, onChange, onClick]);
  var classString = classNames("".concat(prefixCls, "-item"), "".concat(prefixCls, "-item-").concat(status), className, _defineProperty({}, "".concat(prefixCls, "-item-custom"), icon));

  var stepItemStyle = _objectSpread({}, style);

  if (itemWidth) {
    stepItemStyle.width = itemWidth;
  }

  if (adjustMarginRight) {
    stepItemStyle.marginRight = adjustMarginRight;
  }

  if (onChange) {
    stepItemStyle.cursor = 'pointer';
  }

  return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
    className: classString,
    style: stepItemStyle,
    onClick: onClickItem
  }), /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-item-tail")
  }, tailContent), /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-item-icon")
  }, /*#__PURE__*/React.createElement(RenderIcon, props)), /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-item-content")
  }, /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-item-title")
  }, title, navigation && /*#__PURE__*/React.createElement(Icon, {
    type: "navigate_next",
    className: "".concat(prefixCls, "-item-title-icon")
  })), description && /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-item-description")
  }, description)));
};

Step.displayName = 'RcStep';
export default Step;
//# sourceMappingURL=Step.js.map