docs
evals
scenario-1
scenario-10
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
scenario-9
{
"context": "This evaluation assesses how effectively the engineer uses the rc-progress package to implement a dashboard-style semi-circular gauge with gradient colors. The focus is specifically on utilizing rc-progress's Circle component with gap positioning and gradient color features.",
"type": "weighted_checklist",
"checklist": [
{
"name": "Circle component usage",
"description": "Uses the Circle component from rc-progress (imported correctly as { Circle } from 'rc-progress' or similar)",
"max_score": 15
},
{
"name": "Gap degree configuration",
"description": "Sets gapDegree prop to 180 (or appropriate value) to create a semi-circular arc instead of a full circle",
"max_score": 20
},
{
"name": "Gap position setting",
"description": "Sets gapPosition prop to 'bottom' (or equivalent positioning) to orient the gauge from left to right",
"max_score": 20
},
{
"name": "Gradient color object",
"description": "Uses strokeColor prop with an object containing color stops (e.g., { '0%': 'green', '50%': 'yellow', '100%': 'red' }) to create the gradient effect",
"max_score": 25
},
{
"name": "Progress percentage binding",
"description": "Correctly binds the value prop to Circle's percent prop to control the gauge position",
"max_score": 10
},
{
"name": "Stroke width styling",
"description": "Sets strokeWidth prop to 10 to control the thickness of the gauge",
"max_score": 5
},
{
"name": "Rail color styling",
"description": "Sets railColor prop to a light gray color for the background rail",
"max_score": 5
}
]
}