Skip to content

Commit 1300c5b

Browse files
zombieJzombieJ
committed
refactor: all use rail
1 parent 9b7899e commit 1300c5b

File tree

8 files changed

+39
-39
lines changed

8 files changed

+39
-39
lines changed

‎src/Circle/index.tsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -20,10 +20,10 @@ const Circle: React.FC<ProgressProps> = (props) => {
2020
styles = {},
2121
steps,
2222
strokeWidth,
23-
trailWidth,
23+
railWidth,
2424
gapDegree = 0,
2525
gapPosition,
26-
trailColor,
26+
railColor,
2727
strokeLinecap,
2828
style,
2929
className,
@@ -68,7 +68,7 @@ const Circle: React.FC<ProgressProps> = (props) => {
6868
rotateDeg,
6969
gapDegree,
7070
gapPosition,
71-
trailColor,
71+
railColor,
7272
mergedStrokeLinecap,
7373
strokeWidth,
7474
);
@@ -129,7 +129,7 @@ const Circle: React.FC<ProgressProps> = (props) => {
129129

130130
let stackPtg = 0;
131131
return new Array(stepCount).fill(null).map<React.ReactNode>((_, index) => {
132-
const color = index <= current - 1 ? strokeColorList[0] : trailColor;
132+
const color = index <= current - 1 ? strokeColorList[0] : railColor;
133133
const stroke = color && typeof color === 'object' ? `url(#${gradientId})` : undefined;
134134
const circleStyleForStack = getCircleStyle(
135135
perimeter,
@@ -181,13 +181,13 @@ const Circle: React.FC<ProgressProps> = (props) => {
181181
>
182182
{!stepCount && (
183183
<circle
184-
className={cls(`${prefixCls}-circle-trail`, classNames.rail)}
184+
className={cls(`${prefixCls}-circle-rail`, classNames.rail)}
185185
r={radius}
186186
cx={halfSize}
187187
cy={halfSize}
188-
stroke={trailColor}
188+
stroke={railColor}
189189
strokeLinecap={mergedStrokeLinecap}
190-
strokeWidth={trailWidth || strokeWidth}
190+
strokeWidth={railWidth || strokeWidth}
191191
style={{
192192
...circleStyle,
193193
...styles.rail,

‎src/Line.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,8 @@ const Line: React.FC<ProgressProps> = (props) => {
1515
strokeLinecap,
1616
strokeWidth,
1717
style,
18-
trailColor,
19-
trailWidth,
18+
railColor,
19+
railWidth,
2020
transition,
2121
loading,
2222
...restProps
@@ -57,11 +57,11 @@ const Line: React.FC<ProgressProps> = (props) => {
5757
{...restProps}
5858
>
5959
<path
60-
className={`${prefixCls}-line-trail`}
60+
className={`${prefixCls}-line-rail`}
6161
d={pathString}
6262
strokeLinecap={strokeLinecap}
63-
stroke={trailColor}
64-
strokeWidth={trailWidth || strokeWidth}
63+
stroke={railColor}
64+
strokeWidth={railWidth || strokeWidth}
6565
fillOpacity="0"
6666
/>
6767
{percentList.map((ptg, index) => {

‎src/common.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ export const defaultProps: Partial<ProgressProps> = {
77
strokeColor: '#2db7f5',
88
strokeLinecap: 'round',
99
strokeWidth: 1,
10-
trailColor: '#D9D9D9',
11-
trailWidth: 1,
10+
railColor: '#D9D9D9',
11+
railWidth: 1,
1212
gapPosition: 'bottom',
1313
loading: false,
1414
};

‎src/interface.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,13 @@ export type SemanticName = 'root' | 'rail' | 'track';
33
export interface ProgressProps {
44
id?: string;
55
strokeWidth?: number;
6-
trailWidth?: number;
6+
railWidth?: number;
77
className?: string;
88
classNames?: Partial<Record<SemanticName, string>>;
99
styles?: Partial<Record<SemanticName, React.CSSProperties>>;
1010
percent?: number | number[];
1111
strokeColor?: StrokeColorType;
12-
trailColor?: string;
12+
railColor?: string;
1313
strokeLinecap?: StrokeLinecapType;
1414
prefixCls?: string;
1515
style?: React.CSSProperties;

‎tests/__snapshots__/conic.spec.tsx.snap

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ exports[`Circle.conic gapDegree 1`] = `
88
viewBox="0 0 100 100"
99
>
1010
<circle
11-
class="rc-progress-circle-trail"
11+
class="rc-progress-circle-rail"
1212
cx="50"
1313
cy="50"
1414
r="47"
@@ -59,7 +59,7 @@ exports[`Circle.conic should work 1`] = `
5959
viewBox="0 0 100 100"
6060
>
6161
<circle
62-
class="rc-progress-circle-trail"
62+
class="rc-progress-circle-rail"
6363
cx="50"
6464
cy="50"
6565
r="47"

‎tests/__snapshots__/index.spec.js.snap

+17-17
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ exports[`Progress Circle change with animation 1`] = `
77
viewBox="0 0 100 100"
88
>
99
<circle
10-
class="rc-progress-circle-trail"
10+
class="rc-progress-circle-rail"
1111
cx="50"
1212
cy="50"
1313
r="49.5"
@@ -36,7 +36,7 @@ exports[`Progress Circle change with animation 2`] = `
3636
viewBox="0 0 100 100"
3737
>
3838
<circle
39-
class="rc-progress-circle-trail"
39+
class="rc-progress-circle-rail"
4040
cx="50"
4141
cy="50"
4242
r="49.5"
@@ -66,7 +66,7 @@ exports[`Progress Circle should gradient works and circles have different gradie
6666
viewBox="0 0 100 100"
6767
>
6868
<circle
69-
class="rc-progress-circle-trail"
69+
class="rc-progress-circle-rail"
7070
cx="50"
7171
cy="50"
7272
r="47"
@@ -112,7 +112,7 @@ exports[`Progress Circle should gradient works and circles have different gradie
112112
viewBox="0 0 100 100"
113113
>
114114
<circle
115-
class="rc-progress-circle-trail"
115+
class="rc-progress-circle-rail"
116116
cx="50"
117117
cy="50"
118118
r="47"
@@ -163,7 +163,7 @@ exports[`Progress Circle should show right gapPosition 1`] = `
163163
viewBox="0 0 100 100"
164164
>
165165
<circle
166-
class="rc-progress-circle-trail"
166+
class="rc-progress-circle-rail"
167167
cx="50"
168168
cy="50"
169169
r="47"
@@ -189,7 +189,7 @@ exports[`Progress Circle should show right gapPosition 1`] = `
189189
viewBox="0 0 100 100"
190190
>
191191
<circle
192-
class="rc-progress-circle-trail"
192+
class="rc-progress-circle-rail"
193193
cx="50"
194194
cy="50"
195195
r="47"
@@ -215,7 +215,7 @@ exports[`Progress Circle should show right gapPosition 1`] = `
215215
viewBox="0 0 100 100"
216216
>
217217
<circle
218-
class="rc-progress-circle-trail"
218+
class="rc-progress-circle-rail"
219219
cx="50"
220220
cy="50"
221221
r="47"
@@ -241,7 +241,7 @@ exports[`Progress Circle should show right gapPosition 1`] = `
241241
viewBox="0 0 100 100"
242242
>
243243
<circle
244-
class="rc-progress-circle-trail"
244+
class="rc-progress-circle-rail"
245245
cx="50"
246246
cy="50"
247247
r="47"
@@ -267,7 +267,7 @@ exports[`Progress Circle should show right gapPosition 1`] = `
267267
viewBox="0 0 100 100"
268268
>
269269
<circle
270-
class="rc-progress-circle-trail"
270+
class="rc-progress-circle-rail"
271271
cx="50"
272272
cy="50"
273273
r="47"
@@ -293,7 +293,7 @@ exports[`Progress Circle should show right gapPosition 1`] = `
293293
viewBox="0 0 100 100"
294294
>
295295
<circle
296-
class="rc-progress-circle-trail"
296+
class="rc-progress-circle-rail"
297297
cx="50"
298298
cy="50"
299299
r="47"
@@ -324,7 +324,7 @@ exports[`Progress Diff Line should match snapshot 1`] = `
324324
viewBox="0 0 100 1"
325325
>
326326
<path
327-
class="rc-progress-line-trail"
327+
class="rc-progress-line-rail"
328328
d="M 0,0.5
329329
L 100,0.5"
330330
fill-opacity="0"
@@ -350,7 +350,7 @@ exports[`Progress Diff Line should match snapshot 1`] = `
350350
viewBox="0 0 100 1"
351351
>
352352
<path
353-
class="rc-progress-line-trail"
353+
class="rc-progress-line-rail"
354354
d="M 0.5,0.5
355355
L 99.5,0.5"
356356
fill-opacity="0"
@@ -376,7 +376,7 @@ exports[`Progress Diff Line should match snapshot 1`] = `
376376
viewBox="0 0 100 1"
377377
>
378378
<path
379-
class="rc-progress-line-trail"
379+
class="rc-progress-line-rail"
380380
d="M 0,0.5
381381
L 100,0.5"
382382
fill-opacity="0"
@@ -405,7 +405,7 @@ exports[`Progress Line change with animation 1`] = `
405405
viewBox="0 0 100 1"
406406
>
407407
<path
408-
class="rc-progress-line-trail"
408+
class="rc-progress-line-rail"
409409
d="M 0.5,0.5
410410
L 99.5,0.5"
411411
fill-opacity="0"
@@ -433,7 +433,7 @@ exports[`Progress Line change with animation 2`] = `
433433
viewBox="0 0 100 1"
434434
>
435435
<path
436-
class="rc-progress-line-trail"
436+
class="rc-progress-line-rail"
437437
d="M 0.5,0.5
438438
L 99.5,0.5"
439439
fill-opacity="0"
@@ -462,7 +462,7 @@ exports[`Progress should support percentage array changes 1`] = `
462462
viewBox="0 0 100 100"
463463
>
464464
<circle
465-
class="rc-progress-circle-trail"
465+
class="rc-progress-circle-rail"
466466
cx="50"
467467
cy="50"
468468
r="49.5"
@@ -502,7 +502,7 @@ exports[`Progress should support percentage array changes 2`] = `
502502
viewBox="0 0 100 100"
503503
>
504504
<circle
505-
class="rc-progress-circle-trail"
505+
class="rc-progress-circle-rail"
506506
cx="50"
507507
cy="50"
508508
r="49.5"

‎tests/index.spec.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -179,7 +179,7 @@ describe('Progress', () => {
179179
steps={steps}
180180
percent={percent}
181181
strokeColor="red"
182-
trailColor="grey"
182+
railColor="grey"
183183
strokeWidth={20}
184184
/>,
185185
);
@@ -199,7 +199,7 @@ describe('Progress', () => {
199199
'0%': '#108ee9',
200200
'100%': '#87d068',
201201
}}
202-
trailColor="grey"
202+
railColor="grey"
203203
strokeWidth={20}
204204
/>,
205205
);
@@ -215,7 +215,7 @@ describe('Progress', () => {
215215
gapDegree={60}
216216
percent={50}
217217
strokeColor="red"
218-
trailColor="grey"
218+
railColor="grey"
219219
strokeWidth={20}
220220
/>,
221221
);

‎tests/semantic.spec.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ describe('Semantic', () => {
2626
);
2727

2828
expect(container.querySelector('.rc-progress-circle')).toHaveClass(classNames.root);
29-
expect(container.querySelector('.rc-progress-circle-trail')).toHaveClass(classNames.rail);
29+
expect(container.querySelector('.rc-progress-circle-rail')).toHaveClass(classNames.rail);
3030
expect(container.querySelector('.rc-progress-circle-path')).toHaveClass(classNames.track);
3131

3232
expect(container.querySelector('.my-root')).toHaveStyle(styles.root);

0 commit comments

Comments
 (0)