@kdcloudjs/kdesign 1.0.2

package/es/popconfirm/style/index.css

@@ -0,0 +1,213 @@
+/* -----------  color  ——————---- start */
+/* -----------  color  ——————---- end */
+/* -----------  motion  ——————---- start */
+/* -----------  motion  ——————---- end */
+/* -----------  transition  ——————---- start */
+/* -----------  transition  ——————---- end */
+/* -----------  font  ——————---- start */
+/* -----------  font  ——————---- end */
+/* -----------  zIndex  ——————---- start */
+/*
+    普通组件内部自身层级应设置在0-100间
+*/
+/* -----------  zIndex  ——————---- end */
+/* -----------  Button  ——————---- start */
+/* -----------  Button  ——————---- end */
+/* -----------  Collapse  ——————---- start */
+/* -----------  Collapse  ——————---- end */
+/* -----------  Card  ——————---- start */
+/* -----------  Card  ——————---- end */
+/* -----------  Carousel  ——————---- start */
+/* -----------  Carousel  ——————---- end */
+/* -----------  Cascader  ——————---- start */
+/* -----------  Cascader  ——————---- end */
+/* -----------  Switch  ——————---- start */
+/* -----------  Switch  ——————---- end */
+/* -----------  Input  ——————---- start */
+/* -----------  Input  ——————---- end */
+/* -----------  InputNumber  ——————---- start */
+/* -----------  InputNumber  ——————---- end */
+/* -----------  checkbox  ——————---- start */
+/* -----------  checkbox  ——————---- start */
+/* -----------  checkbox  ——————---- end */
+/* -----------  Radio  ——————---- start */
+/* -----------  Radio  ——————---- end */
+/* -----------  icon  ——————---- start */
+/* -----------  icon  ——————---- end */
+/* -----------  Popconfirm  ——————---- start */
+/* -----------  Popconfirm  ——————---- end */
+/* -----------  Progress  ——————---- start */
+/* -----------  Progress  ——————---- end */
+/* -----------  Pagination  ——————---- start */
+/* -----------  Pagination  ——————---- end */
+/* -----------  Timeline  ——————---- start */
+/* -----------  Timeline  ——————---- end */
+/* -----------  Tabs  ——————---- start */
+/* -----------  Tabs  ——————---- end */
+/* -----------  Select  ——————---- start */
+/* -----------  Select  ——————---- end */
+/* -----------  Rate  ——————---- start */
+/* -----------  Rate  ——————---- end */
+/* -----------  Dropdown  ——————---- start */
+/* -----------  Dropdown  ——————---- end */
+/* -----------  Tooltip  ——————---- start */
+/* -----------  Tooltip  ——————---- end */
+/* -----------  Transfer  ——————---- start */
+/* -----------  Transfer  ——————---- end */
+/* -----------  DatePicker  ——————---- start */
+/* -----------  DatePicker  ——————---- end */
+/* -----------  Tree  ——————---- start */
+/* -----------  Tree  ——————---- end */
+/* -----------  Alert  ——————---- start */
+/* -----------  Alert  ——————---- end */
+/* -----------  Split-Panel ——————---- start */
+/* -----------  Split-Panel ——————---- end */
+/* -----------  Modal  ——————---- start */
+/* -----------  Modal  ——————---- end */
+/* -----------  Steps  ——————---- start */
+/* -----------  Steps  ——————---- end */
+/* -----------  Form  ——————---- start */
+/* -----------  Form  ——————---- end */
+/* -----------  Tag ——————---- start */
+/* -----------  Tag ——————---- end */
+/* -----------  Menu  ——————---- start */
+/* -----------  Menu  ——————---- end */
+/* -----------  notice  ——————---- start */
+/* -----------  message  ——————---- end */
+/* -----------  Spin  ——————---- start */
+/* -----------  Spin  ——————---- end */
+/* -----------  Spin  ——————---- start */
+/* -----------  Spin  ——————---- end */
+/* -----------  Layout  ——————---- start */
+/* -----------  Layout  ——————---- end */
+/* -----------  Typography  ——————---- start */
+/* -----------  Typography  ——————---- start */
+/* -----------  Search  ——————---- start */
+/* -----------  Search  ——————---- start */
+/* -----------  Badge  ——————---- start */
+/* -----------  Badge  ——————---- end */
+/* -----------  Anchor  ——————---- start */
+/* -----------  Anchor  ——————---- end */
+/* -----------  Avatar  ——————---- start */
+/* -----------  Avatar  ——————---- end */
+/* -----------  AdvancedSelector  ——————---- start */
+/* -----------  AdvancedSelector  ——————---- end */
+/* 多行显示省略号 */
+/* 单行显示省略号 */
+/** 浮层箭头样式 **/
+.kd-popconfirm {
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  font-variant: tabular-nums;
+  list-style: none;
+  -webkit-font-feature-settings: 'tnum';
+          font-feature-settings: 'tnum';
+  color: #212121;
+  border-radius: 2px;
+  font-size: 12px;
+  background-color: #fff;
+  -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
+          box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
+  opacity: 1;
+  z-index: 1050;
+  visibility: visible;
+}
+.kd-popconfirm.hidden {
+  opacity: 0;
+  visibility: hidden;
+}
+.kd-popconfirm.arrow::before {
+  position: absolute;
+  z-index: -2;
+  background: transparent;
+  border-style: solid;
+  border-width: var(--arrowSize);
+  -webkit-transform: rotate(45deg);
+          transform: rotate(45deg);
+  content: '';
+}
+.kd-popconfirm.arrow::after {
+  position: absolute;
+  z-index: -1;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  content: '';
+  background: #fff;
+  border-radius: 2px;
+}
+.kd-popconfirm.arrow.bottomLeft::before,
+.kd-popconfirm.arrow.bottom::before,
+.kd-popconfirm.arrow.bottomRight::before {
+  left: var(--arrowLeft);
+  top: var(--arrowSpill);
+  -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.1);
+          box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.1);
+  border-color: #fff transparent transparent #fff;
+}
+.kd-popconfirm.arrow.topLeft::before,
+.kd-popconfirm.arrow.top::before,
+.kd-popconfirm.arrow.topRight::before {
+  left: var(--arrowLeft);
+  bottom: var(--arrowSpill);
+  -webkit-box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.15);
+          box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.15);
+  border-color: transparent #fff #fff transparent;
+}
+.kd-popconfirm.arrow.leftTop::before,
+.kd-popconfirm.arrow.left::before,
+.kd-popconfirm.arrow.leftBottom::before {
+  top: var(--arrowTop);
+  right: var(--arrowSpill);
+  -webkit-box-shadow: 3px 0 6px rgba(0, 0, 0, 0.12), 0 -2px 6px rgba(204, 149, 149, 0.12);
+          box-shadow: 3px 0 6px rgba(0, 0, 0, 0.12), 0 -2px 6px rgba(204, 149, 149, 0.12);
+  border-color: #fff #fff transparent transparent;
+}
+.kd-popconfirm.arrow.rightTop::before,
+.kd-popconfirm.arrow.right::before,
+.kd-popconfirm.arrow.rightBottom::before {
+  top: var(--arrowTop);
+  left: var(--arrowSpill);
+  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), -2px 0 6px rgba(0, 0, 0, 0.1);
+          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), -2px 0 6px rgba(0, 0, 0, 0.1);
+  border-color: transparent transparent #fff #fff;
+}
+.kd-popconfirm-content {
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  font-variant: tabular-nums;
+  list-style: none;
+  -webkit-font-feature-settings: 'tnum';
+          font-feature-settings: 'tnum';
+  min-width: 164px;
+  max-width: 500px;
+  min-height: 98px;
+  max-height: 400px;
+  padding: 16px 16px;
+  overflow-y: auto;
+}
+.kd-popconfirm-title {
+  line-height: 21px;
+  font-size: 14px;
+}
+.kd-popconfirm-title i {
+  margin-right: 8px;
+  vertical-align: top;
+  color: #ff991c;
+  font-size: 17px;
+  line-height: 21px;
+}
+.kd-popconfirm-message {
+  margin: 6px 0 20px;
+}
+.kd-popconfirm-interaction {
+  text-align: right;
+}
+.kd-popconfirm-interaction button:not(:last-child) {
+  margin-right: 12px;
+}

package/es/popconfirm/style/index.d.ts

@@ -0,0 +1,2 @@
+import '../../style/index.less';
+import './index.less';

package/es/popconfirm/style/index.js

@@ -0,0 +1,2 @@
+import '../../style/index.less';
+import './index.less';

package/es/popconfirm/style/index.less

@@ -0,0 +1,59 @@
+@import '../../style/themes/index';
+@import '../../style/mixins/index';
+
+@popconfirm-prefix-cls: ~'@{kd-prefix}-popconfirm';
+
+.@{popconfirm-prefix-cls} {
+  .reset-component;
+  color: @popconfirm-color;
+  border-radius: @radius-size;
+  font-size: @popconfirm-font-size;
+  background-color: @popconfirm-background-color;
+  box-shadow: 0 1px @popconfirm-box-shadow-blur 0 rgba(0, 0, 0, 0.3);
+  opacity: 1;
+  z-index: @zIndex-popper;
+  visibility: visible;
+
+  &.hidden {
+    opacity: 0;
+    visibility: hidden;
+  }
+
+  // 箭头样式
+  .popperArrow(@popconfirm-background-color, @popconfirm-horizontal-gap, @popconfirm-box-shadow-blur);
+
+  &-content {
+    .reset-component;
+    min-width: @popconfirm-min-width;
+    max-width: @popconfirm-max-width;
+    min-height: @popconfirm-min-height;
+    max-height: @popconfirm-max-height;
+    padding: @popconfirm-vertical-gap @popconfirm-horizontal-gap;
+    overflow-y: auto;
+  }
+
+  &-title {
+    line-height: @popconfirm-title-line-height;
+    font-size: @popconfirm-title-font-size;
+
+    i {
+      margin-right: 8px;
+      vertical-align: top;
+      color: @warning-color;
+      font-size: @popconfirm-icon-size;
+      line-height: @popconfirm-title-line-height;
+    }
+  }
+
+  &-message {
+    margin: 6px 0 20px;
+  }
+
+  &-interaction {
+    text-align: right;
+
+    button:not(:last-child) {
+      margin-right: 12px;
+    }
+  }
+}

package/es/progress/circle.d.ts

@@ -0,0 +1,8 @@
+import React, { FC } from 'react';
+import { ProgressProps } from './progress';
+interface CircleProps extends ProgressProps {
+    prefixCls?: string;
+    children?: React.ReactNode;
+}
+declare const Circle: FC<CircleProps>;
+export default Circle;

package/es/progress/circle.js

@@ -0,0 +1,105 @@
+import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
+import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
+import _sortInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/sort";
+import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
+import React from 'react';
+import classNames from 'classnames';
+var gradientSeed = 0;
+
+var Circle = function Circle(props) {
+  var _context, _context2, _context3, _context4, _context5, _context6, _context7, _context8, _context9, _context10, _context11, _context12, _context13;
+
+  var prefixCls = props.prefixCls,
+      _props$percent = props.percent,
+      percent = _props$percent === void 0 ? 0 : _props$percent,
+      _props$width = props.width,
+      width = _props$width === void 0 ? 88 : _props$width,
+      _props$strokeWidth = props.strokeWidth,
+      strokeWidth = _props$strokeWidth === void 0 ? 4 : _props$strokeWidth,
+      trailColor = props.trailColor,
+      strokeColor = props.strokeColor,
+      children = props.children;
+  var circleStyle = {
+    width: "".concat(width, "px"),
+    height: "".concat(width, "px")
+  };
+  var gradientId = gradientSeed;
+  gradientSeed++;
+  var radius = 50 - strokeWidth / 2;
+  var beginPositionX = 0;
+  var beginPositionY = -radius;
+  var endPositionX = 0;
+  var endPositionY = radius * 2;
+  var len = Math.PI * 2 * radius;
+  var isGradient = Object.prototype.toString.call(strokeColor) === '[object Object]';
+
+  var stripPercentToNumber = function stripPercentToNumber(percent) {
+    return +percent.replace('%', '');
+  };
+
+  var toArray = function toArray(symArray) {
+    return Array.isArray(symArray) ? symArray : [symArray];
+  };
+
+  var gradientColor = _findInstanceProperty(_context = toArray(strokeColor)).call(_context, function (color) {
+    return Object.prototype.toString.call(color) === '[object Object]';
+  });
+
+  var gradientArr = isGradient ? _sortInstanceProperty(_context2 = _Object$keys(gradientColor)).call(_context2, function (a, b) {
+    return stripPercentToNumber(a) - stripPercentToNumber(b);
+  }) : null;
+  var gradientDom = isGradient ? /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+    id: _concatInstanceProperty(_context3 = "".concat(prefixCls, "-gradient-")).call(_context3, gradientId),
+    x1: "100%",
+    y1: "0%",
+    x2: "0%",
+    y2: "0%"
+  }, gradientArr === null || gradientArr === void 0 ? void 0 : _mapInstanceProperty(gradientArr).call(gradientArr, function (key, index) {
+    return /*#__PURE__*/React.createElement("stop", {
+      key: index,
+      offset: key,
+      stopColor: gradientColor[key]
+    });
+  }))) : null;
+  var pathColor = strokeColor && typeof strokeColor !== 'string' ? _concatInstanceProperty(_context4 = "url(#".concat(prefixCls, "-gradient-")).call(_context4, gradientId, ")") : strokeColor;
+
+  var pathString = _concatInstanceProperty(_context5 = _concatInstanceProperty(_context6 = _concatInstanceProperty(_context7 = _concatInstanceProperty(_context8 = _concatInstanceProperty(_context9 = _concatInstanceProperty(_context10 = _concatInstanceProperty(_context11 = _concatInstanceProperty(_context12 = "M 50,50 m ".concat(beginPositionX, ",").concat(beginPositionY, " \n\n                      a ")).call(_context12, radius, ",")).call(_context11, radius, " 0 1 1 ")).call(_context10, endPositionX, ",")).call(_context9, endPositionY, " \n\n                      a ")).call(_context8, radius, ",")).call(_context7, radius, " 0 1 1 ")).call(_context6, endPositionX, ",")).call(_context5, -endPositionY, " \n");
+
+  var pathStyle = {
+    strokeDasharray: _concatInstanceProperty(_context13 = "".concat(percent / 100 * len, "px ")).call(_context13, len, "px"),
+    strokeDashoffset: '0px',
+    opacity: percent === 0 ? 0 : 1,
+    stroke: pathColor
+  };
+  var wrapperClassName = classNames("".concat(prefixCls, "-circle-box"), _defineProperty({}, "".concat(prefixCls, "-circle-gradient"), isGradient));
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: wrapperClassName,
+    style: circleStyle
+  }, /*#__PURE__*/React.createElement("svg", {
+    className: "".concat(prefixCls, "-circle"),
+    viewBox: "0 0 100 100",
+    strokeWidth: strokeWidth
+  }, gradientDom, /*#__PURE__*/React.createElement("path", {
+    className: "".concat(prefixCls, "-circle-trail"),
+    style: {
+      stroke: trailColor
+    },
+    d: pathString,
+    // stroke={trailColor}
+    strokeWidth: strokeWidth,
+    fillOpacity: "0",
+    strokeLinecap: "round"
+  }), /*#__PURE__*/React.createElement("path", {
+    className: "".concat(prefixCls, "-circle-path"),
+    d: pathString,
+    // stroke={pathColor}
+    strokeWidth: strokeWidth,
+    style: pathStyle,
+    fillOpacity: "0",
+    strokeLinecap: "round"
+  })), children));
+};
+
+export default Circle;

package/es/progress/index.d.ts

@@ -0,0 +1,3 @@
+import Progress from './progress';
+export { ProgressType, ProgressProps } from './progress';
+export default Progress;

package/es/progress/index.js

@@ -0,0 +1,2 @@
+import Progress from './progress';
+export default Progress;

package/es/progress/line.d.ts

@@ -0,0 +1,8 @@
+import React, { FC } from 'react';
+import { ProgressProps } from './progress';
+interface LineProps extends ProgressProps {
+    prefixCls?: string;
+    children?: React.ReactNode;
+}
+declare const Line: FC<LineProps>;
+export default Line;

package/es/progress/line.js

@@ -0,0 +1,36 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import React from 'react';
+import { validProgress, handleGradient } from './utils';
+
+var Line = function Line(props) {
+  var prefixCls = props.prefixCls,
+      children = props.children,
+      percent = props.percent,
+      trailColor = props.trailColor,
+      strokeColor = props.strokeColor,
+      strokeWidth = props.strokeWidth;
+  var backgroundProps = strokeColor && typeof strokeColor !== 'string' ? handleGradient(strokeColor) : {
+    background: strokeColor
+  };
+  var trailStyle = {
+    backgroundColor: trailColor || undefined
+  };
+
+  var percentStyle = _extends({
+    width: "".concat(validProgress(percent), "%"),
+    height: strokeWidth && "".concat(strokeWidth, "px")
+  }, backgroundProps);
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-outer")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-inner"),
+    style: trailStyle
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-bg"),
+    style: percentStyle
+  }))), children);
+};
+
+Line.displayName = 'Line';
+export default Line;

package/es/progress/progress.d.ts

@@ -0,0 +1,35 @@
+import React, { FC } from 'react';
+export declare const ProgressTypes: ["line", "circle"];
+export declare type ProgressType = typeof ProgressTypes[number];
+export declare const ProgressStatuses: ["normal", "cycle", "loading", "failure", "success"];
+export declare type StringGradients = {
+    [percentage: string]: string;
+};
+declare type FromToGradients = {
+    from: string;
+    to: string;
+};
+export declare type ProgressGradient = {
+    direction?: string;
+} & (StringGradients | FromToGradients);
+export interface ProgressProps {
+    type?: ProgressType;
+    style?: Record<string, unknown>;
+    className?: string;
+    width?: number;
+    strokeWidth?: number;
+    strokeColor?: string | ProgressGradient;
+    percent?: number;
+    showInfo?: boolean;
+    status?: typeof ProgressStatuses[number];
+    infoPosition?: string;
+    trailColor?: string;
+    textMap?: React.ReactNode[];
+    successIcon?: React.ReactNode;
+    failureIcon?: React.ReactNode;
+    format?: (percent: number) => React.ReactNode;
+    onProcess?: <T>(p: T) => T;
+    onFailedClick?: (percent: number, successPercent: number) => boolean;
+}
+declare const Progress: FC<ProgressProps>;
+export default Progress;

package/es/progress/progress.js

@@ -0,0 +1,171 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
+import React, { useContext, useEffect } from 'react';
+import classNames from 'classnames';
+import Icon from '../icon';
+import Line from './line';
+import Circle from './circle';
+import ConfigContext from '../config-provider/ConfigContext';
+import { tuple } from '../_utils/type';
+import { omit } from '../_utils/omit';
+import { getCompProps } from '../_utils';
+import { validProgress } from './utils';
+import devWarning from '../_utils/devwarning';
+export var ProgressTypes = tuple('line', 'circle');
+export var ProgressStatuses = tuple('normal', 'cycle', 'loading', 'failure', 'success');
+
+var Progress = function Progress(props) {
+  var _context, _context2, _classNames;
+
+  var _useContext = useContext(ConfigContext),
+      getPrefixCls = _useContext.getPrefixCls,
+      prefixCls = _useContext.prefixCls,
+      userDefaultProps = _useContext.compDefaultProps,
+      locale = _useContext.locale;
+
+  var progressProps = getCompProps('Progress', userDefaultProps, props);
+  var type = progressProps.type,
+      className = progressProps.className,
+      customPrefixcls = progressProps.prefixCls,
+      showInfo = progressProps.showInfo,
+      percent = progressProps.percent,
+      onProcess = progressProps.onProcess;
+  devWarning(ProgressTypes.indexOf(type) === -1, 'progress', "cannot found progress type '".concat(type, "'"));
+  devWarning(type !== 'circle' && !!props.width, 'progress', 'props width only effect when type is circle');
+
+  if (props.strokeWidth === undefined) {
+    progressProps.strokeWidth = type === 'circle' ? progressProps.strokeWidth : progressProps.trailWidth;
+  }
+
+  var getPercentNumber = function getPercentNumber(props) {
+    var _props$percent = props.percent,
+        percent = _props$percent === void 0 ? 0 : _props$percent;
+    return parseInt(percent.toString(), 10);
+  };
+
+  var getProgressStatus = function getProgressStatus(props) {
+    var status = props.status;
+
+    if (ProgressStatuses.indexOf(status) < 0 && getPercentNumber(props) >= 100) {
+      return 'success';
+    }
+
+    return status || 'normal';
+  };
+
+  var progressStatus = getProgressStatus(progressProps);
+  var progressPrefixCls = getPrefixCls(prefixCls, 'progress', customPrefixcls);
+  var progressClasses = classNames(progressPrefixCls, className, (_classNames = {}, _defineProperty(_classNames, _concatInstanceProperty(_context = "".concat(progressPrefixCls, "-type-")).call(_context, type), type), _defineProperty(_classNames, _concatInstanceProperty(_context2 = "".concat(progressPrefixCls, "-status-")).call(_context2, progressStatus), true), _defineProperty(_classNames, "".concat(progressPrefixCls, "-show-info"), showInfo), _classNames));
+
+  var renderProgressInfo = function renderProgressInfo(prefixCls, progressStatus, props) {
+    var _props$type = props.type,
+        type = _props$type === void 0 ? 'line' : _props$type,
+        showInfo = props.showInfo,
+        format = props.format,
+        percent = props.percent,
+        infoPosition = props.infoPosition,
+        successIcon = props.successIcon,
+        failureIcon = props.failureIcon;
+    var isLoading = progressStatus !== 'failure' && progressStatus !== 'success';
+    if (!showInfo && type !== 'circle' || infoPosition !== 'right' && isLoading) return null;
+    var text;
+
+    var textFormatter = format || function (percentNumber) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
+        className: "".concat(prefixCls, "-text-percent")
+      }, percentNumber), /*#__PURE__*/React.createElement("span", {
+        className: "".concat(prefixCls, "-text-unit")
+      }, "%"));
+    };
+
+    var successNodeMap = {
+      line: /*#__PURE__*/React.createElement(Icon, {
+        className: "".concat(prefixCls, "-icon"),
+        type: "right-solid"
+      }),
+      circle: /*#__PURE__*/React.createElement(Icon, {
+        className: "".concat(prefixCls, "-icon"),
+        type: "right-bold"
+      }),
+      custom: successIcon
+    };
+    var failureNodeMap = {
+      line: /*#__PURE__*/React.createElement(Icon, {
+        className: "".concat(prefixCls, "-icon"),
+        type: "refresh-solid"
+      }),
+      circle: /*#__PURE__*/React.createElement(Icon, {
+        className: "".concat(prefixCls, "-icon"),
+        type: "close-bold"
+      }),
+      custom: failureIcon
+    };
+
+    if (format || isLoading) {
+      text = textFormatter(validProgress(percent));
+    } else if (progressStatus === 'failure') {
+      text = failureNodeMap.custom || failureNodeMap[type];
+    } else if (progressStatus === 'success') {
+      text = successNodeMap.custom || successNodeMap[type];
+    }
+
+    return /*#__PURE__*/React.createElement("span", {
+      className: "".concat(prefixCls, "-text")
+    }, text);
+  };
+
+  var renderSpecialInfo = function renderSpecialInfo(prefixCls, progressStatus, props) {
+    var type = props.type,
+        showInfo = props.showInfo,
+        infoPosition = props.infoPosition,
+        _props$textMap = props.textMap,
+        textMap = _props$textMap === void 0 ? [] : _props$textMap;
+    var langMsgs = locale.getCompLangMsg({
+      componentName: 'Progress'
+    });
+    var defaultTextMap = [langMsgs.loading, langMsgs.fail, langMsgs.success];
+    var isLoading = progressStatus !== 'failure' && progressStatus !== 'success';
+    if (!showInfo || infoPosition === 'right' && type !== 'circle') return null;
+
+    var concatMap = _mapInstanceProperty(defaultTextMap).call(defaultTextMap, function (text, index) {
+      if (type === 'circle' && index === 0) return textMap[index] || langMsgs.circleLoadingDesc;
+      return textMap[index] || text;
+    });
+
+    var text;
+
+    if (isLoading) {
+      text = concatMap[0];
+    } else if (progressStatus === 'failure') {
+      text = concatMap[1];
+    } else if (progressStatus === 'success') {
+      text = concatMap[2];
+    }
+
+    return /*#__PURE__*/React.createElement("div", {
+      className: "".concat(prefixCls, "-special-text")
+    }, text);
+  };
+
+  var progress = /*#__PURE__*/React.createElement(Line, _extends({}, progressProps, {
+    prefixCls: progressPrefixCls
+  }), renderProgressInfo(progressPrefixCls, progressStatus, progressProps));
+
+  if (type === 'circle') {
+    progress = /*#__PURE__*/React.createElement(Circle, _extends({}, progressProps, {
+      prefixCls: progressPrefixCls
+    }), renderProgressInfo(progressPrefixCls, progressStatus, progressProps));
+  }
+
+  useEffect(function () {
+    onProcess && onProcess(percent);
+  }, [percent, onProcess]);
+  return /*#__PURE__*/React.createElement("div", _extends({}, omit(progressProps, ['status', 'format', 'width', 'strokeWidth', 'trailWidth', 'trailColor', 'strokeColor', 'percent', 'infoPosition', 'showInfo', 'textMap', 'onProcess']), {
+    className: progressClasses
+  }), progress, renderSpecialInfo(progressPrefixCls, progressStatus, progressProps));
+};
+
+Progress.displayName = 'Progress';
+export default Progress;

package/es/progress/style/css.js

@@ -0,0 +1,2 @@
+import '../../style/index.css';
+import './index.css';