Progress drops value before Root: bar is indeterminate for assistive tech
Describe the bug
The generated progress.tsx destructures value and uses it only for the Indicator's transform - it never forwards value to ProgressPrimitive.Root:
function Progress({
className,
value,
...props
}: React.ComponentProps<typeof ProgressPrimitive.Root>) {
return (
<ProgressPrimitive.Root className={cn("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className)} {...props}>
<ProgressPrimitive.Indicator
className="h-full w-full flex-1 bg-primary transition-all"
style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
/>
</ProgressPrimitive.Root>
);
}
Because value is not in props, Root never receives it: the bar renders data-state="indeterminate" and omits aria-valuenow, even when the consumer passes a number. The fill still moves visually (the Indicator reads the value directly), so the regression is invisible until you inspect the accessibility tree.
Reproduction
- Add the Progress component from the registry (
npx shadcn@latest add progress). - Render
<Progress value={42} />and inspect the rendered root:data-state="indeterminate", noaria-valuenow. - Screen readers announce an indeterminate progressbar while the fill shows 42%.
Expected behavior
Root receives the consumer's value, so the bar reports data-state="loading" (or complete) and exposes aria-valuenow="42" to assistive technology.
Fix
Spread value={value} onto Root:
- <ProgressPrimitive.Root className={cn("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className)} {...props}>
+ <ProgressPrimitive.Root value={value} className={cn("relative h-2 w-full overflow-hidden rounded-full bg-primary/20", className)} {...props}>
Verified against the current new-york registry output (ui.shadcn.com/r/styles/new-york/progress.json) on Radix @radix-ui/react-progress as resolved by the unified radix-ui package.
Source: shadcn-ui/ui