index.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. "use strict";
  2. "use client";
  3. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
  4. var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
  5. Object.defineProperty(exports, "__esModule", {
  6. value: true
  7. });
  8. exports.default = void 0;
  9. var React = _interopRequireWildcard(require("react"));
  10. var _CheckOutlined = _interopRequireDefault(require("@ant-design/icons/CheckOutlined"));
  11. var _CloseOutlined = _interopRequireDefault(require("@ant-design/icons/CloseOutlined"));
  12. var _classnames = _interopRequireDefault(require("classnames"));
  13. var _rcSteps = _interopRequireDefault(require("rc-steps"));
  14. var _context = require("../config-provider/context");
  15. var _useSize = _interopRequireDefault(require("../config-provider/hooks/useSize"));
  16. var _useBreakpoint = _interopRequireDefault(require("../grid/hooks/useBreakpoint"));
  17. var _progress = _interopRequireDefault(require("../progress"));
  18. var _tooltip = _interopRequireDefault(require("../tooltip"));
  19. var _style = _interopRequireDefault(require("./style"));
  20. var _useLegacyItems = _interopRequireDefault(require("./useLegacyItems"));
  21. var __rest = void 0 && (void 0).__rest || function (s, e) {
  22. var t = {};
  23. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  24. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  25. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  26. }
  27. return t;
  28. };
  29. const Steps = props => {
  30. const {
  31. percent,
  32. size: customizeSize,
  33. className,
  34. rootClassName,
  35. direction,
  36. items,
  37. responsive = true,
  38. current = 0,
  39. children,
  40. style
  41. } = props,
  42. restProps = __rest(props, ["percent", "size", "className", "rootClassName", "direction", "items", "responsive", "current", "children", "style"]);
  43. const {
  44. xs
  45. } = (0, _useBreakpoint.default)(responsive);
  46. const {
  47. getPrefixCls,
  48. direction: rtlDirection,
  49. className: contextClassName,
  50. style: contextStyle
  51. } = (0, _context.useComponentConfig)('steps');
  52. const realDirectionValue = React.useMemo(() => responsive && xs ? 'vertical' : direction, [xs, direction]);
  53. const size = (0, _useSize.default)(customizeSize);
  54. const prefixCls = getPrefixCls('steps', props.prefixCls);
  55. const [wrapCSSVar, hashId, cssVarCls] = (0, _style.default)(prefixCls);
  56. const isInline = props.type === 'inline';
  57. const iconPrefix = getPrefixCls('', props.iconPrefix);
  58. const mergedItems = (0, _useLegacyItems.default)(items, children);
  59. const mergedPercent = isInline ? undefined : percent;
  60. const mergedStyle = Object.assign(Object.assign({}, contextStyle), style);
  61. const stepsClassName = (0, _classnames.default)(contextClassName, {
  62. [`${prefixCls}-rtl`]: rtlDirection === 'rtl',
  63. [`${prefixCls}-with-progress`]: mergedPercent !== undefined
  64. }, className, rootClassName, hashId, cssVarCls);
  65. const icons = {
  66. finish: /*#__PURE__*/React.createElement(_CheckOutlined.default, {
  67. className: `${prefixCls}-finish-icon`
  68. }),
  69. error: /*#__PURE__*/React.createElement(_CloseOutlined.default, {
  70. className: `${prefixCls}-error-icon`
  71. })
  72. };
  73. const stepIconRender = ({
  74. node,
  75. status
  76. }) => {
  77. if (status === 'process' && mergedPercent !== undefined) {
  78. // currently it's hard-coded, since we can't easily read the actually width of icon
  79. const progressWidth = size === 'small' ? 32 : 40;
  80. // iconWithProgress
  81. return /*#__PURE__*/React.createElement("div", {
  82. className: `${prefixCls}-progress-icon`
  83. }, /*#__PURE__*/React.createElement(_progress.default, {
  84. type: "circle",
  85. percent: mergedPercent,
  86. size: progressWidth,
  87. strokeWidth: 4,
  88. format: () => null
  89. }), node);
  90. }
  91. return node;
  92. };
  93. const itemRender = (item, stepItem) => item.description ? /*#__PURE__*/React.createElement(_tooltip.default, {
  94. title: item.description
  95. }, stepItem) : stepItem;
  96. return wrapCSSVar(/*#__PURE__*/React.createElement(_rcSteps.default, Object.assign({
  97. icons: icons
  98. }, restProps, {
  99. style: mergedStyle,
  100. current: current,
  101. size: size,
  102. items: mergedItems,
  103. itemRender: isInline ? itemRender : undefined,
  104. stepIcon: stepIconRender,
  105. direction: realDirectionValue,
  106. prefixCls: prefixCls,
  107. iconPrefix: iconPrefix,
  108. className: stepsClassName
  109. })));
  110. };
  111. Steps.Step = _rcSteps.default.Step;
  112. if (process.env.NODE_ENV !== 'production') {
  113. Steps.displayName = 'Steps';
  114. }
  115. var _default = exports.default = Steps;