diff --git a/components/progress/Line.tsx b/components/progress/Line.tsx index 4c55aff316..aaeaa20022 100644 --- a/components/progress/Line.tsx +++ b/components/progress/Line.tsx @@ -108,14 +108,16 @@ const Line: React.FC = (props) => { warning.deprecated(!('strokeWidth' in props), 'strokeWidth', 'size'); } + const percentBorderRadius = strokeLinecap === 'square' || strokeLinecap === 'butt' ? 0 : '100px'; + const percentStyle: React.CSSProperties = { width: `100%`, height, borderRadius, clipPath: direction === 'rtl' - ? `inset(0 0 0 ${100 - validProgress(percent)}% round 100px)` - : `inset(0 ${100 - validProgress(percent)}% 0 0 round 100px)`, + ? `inset(0 0 0 ${100 - validProgress(percent)}% round ${percentBorderRadius})` + : `inset(0 ${100 - validProgress(percent)}% 0 0 round ${percentBorderRadius})`, ...backgroundProps, }; @@ -127,8 +129,8 @@ const Line: React.FC = (props) => { borderRadius, clipPath: direction === 'rtl' - ? `inset(0 0 0 ${100 - validProgress(successPercent)}% round 100px)` - : `inset(0 ${100 - validProgress(successPercent)}% 0 0 round 100px)`, + ? `inset(0 0 0 ${100 - validProgress(successPercent)}% round ${percentBorderRadius})` + : `inset(0 ${100 - validProgress(successPercent)}% 0 0 round ${percentBorderRadius})`, backgroundColor: success?.strokeColor, }; diff --git a/components/progress/__tests__/__snapshots__/demo-extend.test.ts.snap b/components/progress/__tests__/__snapshots__/demo-extend.test.ts.snap index 4f0ffa4163..ea9d54b448 100644 --- a/components/progress/__tests__/__snapshots__/demo-extend.test.ts.snap +++ b/components/progress/__tests__/__snapshots__/demo-extend.test.ts.snap @@ -2410,7 +2410,7 @@ Array [ >
diff --git a/components/progress/__tests__/__snapshots__/demo.test.ts.snap b/components/progress/__tests__/__snapshots__/demo.test.ts.snap index 39a48e7541..11db3397b6 100644 --- a/components/progress/__tests__/__snapshots__/demo.test.ts.snap +++ b/components/progress/__tests__/__snapshots__/demo.test.ts.snap @@ -2318,7 +2318,7 @@ Array [ >