{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "animated-progress",
  "title": "Animated Progress",
  "description": "A smooth progress bar with determinate, semantic, and pending states.",
  "dependencies": [
    "motion"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/corr/components/animated-progress.tsx",
      "content": "\"use client\"\n\nimport { motion, useReducedMotion } from \"motion/react\"\n\nimport { cn } from \"@/lib/utils\"\nimport { AnimatedNumber } from \"./animated-number\"\n\nexport type AnimatedProgressTone = \"neutral\" | \"success\" | \"warning\"\n\nconst toneClassName: Record<AnimatedProgressTone, string> = {\n  neutral: \"bg-primary\",\n  success: \"bg-emerald-500\",\n  warning: \"bg-amber-500\",\n}\n\nfunction clampProgress(value: number) {\n  return Math.min(100, Math.max(0, value))\n}\n\nexport function AnimatedProgress({\n  value,\n  label,\n  showValue = false,\n  tone = \"neutral\",\n  className,\n}: {\n  value?: number\n  label?: string\n  showValue?: boolean\n  tone?: AnimatedProgressTone\n  className?: string\n}) {\n  const reduceMotion = useReducedMotion()\n  const isIndeterminate = value === undefined\n  const progress = clampProgress(value ?? 0)\n\n  return (\n    <div className={cn(\"w-full space-y-2\", className)}>\n      {(label || showValue) && (\n        <div className=\"flex items-center justify-between gap-3 text-xs font-medium\">\n          {label ? <span>{label}</span> : <span />}\n          {showValue && !isIndeterminate ? (\n            <span className=\"flex items-center font-mono text-muted-foreground\">\n              <AnimatedNumber value={Math.round(progress)} />\n              <span>%</span>\n            </span>\n          ) : null}\n        </div>\n      )}\n      <div className=\"h-2 overflow-hidden rounded-full bg-muted\">\n        {isIndeterminate ? (\n          <motion.div\n            className={cn(\"h-full w-1/3 rounded-full\", toneClassName[tone])}\n            animate={\n              reduceMotion\n                ? { x: \"100%\" }\n                : {\n                    x: [\"-130%\", \"105%\", \"340%\"],\n                    scaleX: [0.45, 1, 0.45],\n                  }\n            }\n            transition={{\n              duration: 1.85,\n              ease: [0.65, 0, 0.35, 1],\n              repeat: reduceMotion ? 0 : Infinity,\n            }}\n          />\n        ) : (\n          <motion.div\n            className={cn(\"h-full rounded-full\", toneClassName[tone])}\n            initial={false}\n            animate={{ width: `${progress}%` }}\n            transition={\n              reduceMotion\n                ? { duration: 0 }\n                : { duration: 0.45, ease: [0.22, 1, 0.36, 1] }\n            }\n          />\n        )}\n      </div>\n    </div>\n  )\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}