Progress Ring

Circular (radial) progress indicator drawn with SVG stroke-dasharray, showing completion as a ring that fills clockwise from 12 o'clock with a smooth animated transition. Use it when a linear progress bar doesn't fit the space or you want the percent in the center — file/image upload progress, a usage or quota meter (storage, API credits, plan limits), a goal/completion or profile-strength tracker, a step or onboarding progress badge, or a countdown/timer dial. Set showValue to render the rounded percent in the middle, pass children for a custom center (icon or label), or set indeterminate to spin an arc while the total is unknown. Exposes role=progressbar with aria-valuenow/min/max. Unlike shadcn's linear Progress, this is a compact radial gauge. Depends only on your cn util — no extra packages.