fix: Progress type="circle" error (#30855)

* fix: Progress `type="circle"` error

`Rendered more hooks than during the previous render`

close #30685

* update snapshot

* fix gradient strokeColor

* fix snapshot
This commit is contained in:
afc163 2021-06-05 13:25:19 +08:00 committed by GitHub
parent e851fa4548
commit ad60e9544c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 305 additions and 22 deletions

View File

@ -12,24 +12,8 @@ interface CircleProps extends ProgressProps {
}
function getPercentage({ percent, success, successPercent }: CircleProps) {
const ptg = validProgress(percent);
const realSuccessPercent = getSuccessPercent({ success, successPercent });
if (!realSuccessPercent) {
return ptg;
}
return [
validProgress(realSuccessPercent),
validProgress(ptg - validProgress(realSuccessPercent)),
];
}
function getStrokeColor({ success, strokeColor, successPercent }: CircleProps) {
const color = strokeColor || null;
const realSuccessPercent = getSuccessPercent({ success, successPercent });
if (!realSuccessPercent) {
return color;
}
return [presetPrimaryColors.green, color];
const realSuccessPercent = validProgress(getSuccessPercent({ success, successPercent }));
return [realSuccessPercent, validProgress(validProgress(percent) - realSuccessPercent)];
}
const Circle: React.FC<CircleProps> = props => {
@ -65,8 +49,8 @@ const Circle: React.FC<CircleProps> = props => {
};
// using className to style stroke color
const strokeColor = getStrokeColor(props) as string | string[] | object;
const isGradient = Object.prototype.toString.call(strokeColor) === '[object Object]';
const isGradient = Object.prototype.toString.call(props.strokeColor) === '[object Object]';
const strokeColor = [presetPrimaryColors.green, props.strokeColor || null];
const wrapperClassName = classNames(`${prefixCls}-inner`, {
[`${prefixCls}-circle-gradient`]: isGradient,

View File

@ -35,6 +35,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:221.48228207808043px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -77,6 +89,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:206.7167966062084px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -136,6 +160,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:295.3097094374406px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -200,6 +236,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -303,6 +351,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:88.59291283123217px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -345,6 +405,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:206.7167966062084px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -404,6 +476,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:295.3097094374406px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -468,6 +552,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:165.23228207808043px 295.3097094374406px;stroke-dashoffset:-37.5px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,47
a 47,47 0 1 1 0,-94
a 47,47 0 1 1 0,94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-37.5px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -510,6 +606,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:198.98228207808043px 295.3097094374406px;stroke-dashoffset:-15px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,47
a 47,47 0 1 1 0,-94
a 47,47 0 1 1 0,94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-15px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -640,6 +748,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:221.48228207808043px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -682,6 +802,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:295.3097094374406px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -791,6 +923,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:265.77873849369655px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -851,6 +995,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:295.3097094374406px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -1209,6 +1365,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:221.48228207808043px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="square"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -1251,6 +1419,18 @@ Array [
stroke-width="6"
style="stroke-dasharray:165.23228207808043px 295.3097094374406px;stroke-dashoffset:-37.5px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,47
a 47,47 0 1 1 0,-94
a 47,47 0 1 1 0,94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="square"
stroke-width="6"
style="stroke:#52C41A;stroke-dasharray:0px 295.3097094374406px;stroke-dashoffset:-37.5px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"

View File

@ -34,6 +34,18 @@ exports[`Progress render dashboard 295 gapDegree 1`] = `
stroke-width="6"
style="stroke-dasharray: 0px 295.3097094374406px; stroke-dashoffset: -147.5px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; transition-duration: .3s, .3s, .3s, .06s;"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,47
a 47,47 0 1 1 0,-94
a 47,47 0 1 1 0,94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke: #52C41A; stroke-dasharray: 0px 295.3097094374406px; stroke-dashoffset: -147.5px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; transition-duration: .3s, .3s, .3s, .06s;"
/>
</svg>
<span
class="ant-progress-text"
@ -79,6 +91,18 @@ exports[`Progress render dashboard 296 gapDegree 1`] = `
stroke-width="6"
style="stroke-dasharray: 0px 295.3097094374406px; stroke-dashoffset: -148px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; transition-duration: .3s, .3s, .3s, .06s;"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,47
a 47,47 0 1 1 0,-94
a 47,47 0 1 1 0,94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke: #52C41A; stroke-dasharray: 0px 295.3097094374406px; stroke-dashoffset: -148px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; transition-duration: .3s, .3s, .3s, .06s;"
/>
</svg>
<span
class="ant-progress-text"
@ -124,6 +148,18 @@ exports[`Progress render dashboard zero gapDegree 1`] = `
stroke-width="6"
style="stroke-dasharray: 0px 295.3097094374406px; stroke-dashoffset: -0px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; transition-duration: .3s, .3s, .3s, .06s;"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,47
a 47,47 0 1 1 0,-94
a 47,47 0 1 1 0,94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke: #52C41A; stroke-dasharray: 0px 295.3097094374406px; stroke-dashoffset: -0px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; transition-duration: .3s, .3s, .3s, .06s;"
/>
</svg>
<span
class="ant-progress-text"
@ -361,6 +397,18 @@ exports[`Progress render strokeColor 1`] = `
stroke-width="6"
style="stroke: red; stroke-dasharray: 147.6548547187203px 295.3097094374406px; stroke-dashoffset: -0px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; transition-duration: .3s, .3s, .3s, .06s;"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-47
a 47,47 0 1 1 0,94
a 47,47 0 1 1 0,-94"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="6"
style="stroke: #52C41A; stroke-dasharray: 0px 295.3097094374406px; stroke-dashoffset: -0px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; transition-duration: .3s, .3s, .3s, .06s;"
/>
</svg>
<span
class="ant-progress-text"

View File

@ -204,4 +204,14 @@ describe('Progress', () => {
'Warning: [antd: Progress] `success.progress` is deprecated. Please use `success.percent` instead.',
);
});
// https://github.com/ant-design/ant-design/issues/30685
describe('github issues', () => {
it('"Rendered more hooks than during the previous render"', () => {
expect(() => {
const wrapper = mount(<Progress percent={60} success={{ percent: 0 }} type="circle" />);
wrapper.setProps({ success: { percent: 10 } });
}).not.toThrow();
});
});
});

View File

@ -83,8 +83,9 @@ export default class Progress extends React.Component<ProgressProps> {
renderProcessInfo(prefixCls: string, progressStatus: typeof ProgressStatuses[number]) {
const { showInfo, format, type, percent } = this.props;
const successPercent = getSuccessPercent(this.props);
if (!showInfo) return null;
if (!showInfo) {
return null;
}
let text;
const textFormatter = format || (percentNumber => `${percentNumber}%`);
const isLineType = type === 'line';

View File

@ -1289,6 +1289,18 @@ exports[`renders ./components/steps/demo/progress.md correctly 1`] = `
stroke-width="4"
style="stroke-dasharray:180.95573684677208px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-48
a 48,48 0 1 1 0,96
a 48,48 0 1 1 0,-96"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="4"
style="stroke:#52C41A;stroke-dasharray:0px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -1522,6 +1534,18 @@ Array [
stroke-width="4"
style="stroke-dasharray:0px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-48
a 48,48 0 1 1 0,96
a 48,48 0 1 1 0,-96"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="4"
style="stroke:#52C41A;stroke-dasharray:0px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -1695,6 +1719,18 @@ Array [
stroke-width="4"
style="stroke-dasharray:0px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-48
a 48,48 0 1 1 0,96
a 48,48 0 1 1 0,-96"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="4"
style="stroke:#52C41A;stroke-dasharray:0px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -1868,6 +1904,18 @@ Array [
stroke-width="4"
style="stroke-dasharray:0px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-48
a 48,48 0 1 1 0,96
a 48,48 0 1 1 0,-96"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="4"
style="stroke:#52C41A;stroke-dasharray:0px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"
@ -2041,6 +2089,18 @@ Array [
stroke-width="4"
style="stroke-dasharray:0px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
<path
class="ant-progress-circle-path"
d="M 50,50 m 0,-48
a 48,48 0 1 1 0,96
a 48,48 0 1 1 0,-96"
fill-opacity="0"
opacity="0"
stroke=""
stroke-linecap="round"
stroke-width="4"
style="stroke:#52C41A;stroke-dasharray:0px 301.59289474462014px;stroke-dashoffset:-0px;transition:stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s"
/>
</svg>
<span
class="ant-progress-text"