{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "scroll-progress",
  "title": "Scroll Progress",
  "description": "Fixed bar that tracks reading progress down the page.",
  "dependencies": [
    "@vllnt/ui@^0.2.1"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/default/scroll-progress/scroll-progress.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\n\nimport { cn } from \"@vllnt/ui\";\n\n/** Props for {@link ScrollProgress}. */\nexport type ScrollProgressProps = React.ComponentPropsWithoutRef<\"div\">;\n\nfunction computeProgress(): number {\n  const element = document.documentElement;\n  const scrollable = element.scrollHeight - element.clientHeight;\n  if (scrollable <= 0) {\n    return 0;\n  }\n  return (element.scrollTop / scrollable) * 100;\n}\n\n/**\n * Fixed bar pinned to the top of the page that grows with scroll progress.\n *\n * Functional under `prefers-reduced-motion`: it updates instantly.\n *\n * @example\n * ```tsx\n * <ScrollProgress />\n * ```\n */\nexport const ScrollProgress = ({\n  className,\n  ref,\n  style,\n  ...props\n}: ScrollProgressProps & { ref?: React.Ref<HTMLDivElement> }) => {\n  const [progress, setProgress] = React.useState(0);\n\n  React.useEffect(() => {\n    const onScroll = (): void => {\n      setProgress(computeProgress());\n    };\n\n    onScroll();\n    window.addEventListener(\"scroll\", onScroll, { passive: true });\n\n    return () => {\n      window.removeEventListener(\"scroll\", onScroll);\n    };\n  }, []);\n\n  return (\n    <div\n      aria-valuemax={100}\n      aria-valuemin={0}\n      aria-valuenow={Math.round(progress)}\n      className={cn(\n        \"fixed inset-x-0 top-0 z-50 h-1 origin-left bg-primary\",\n        className,\n      )}\n      ref={ref}\n      role=\"progressbar\"\n      style={{ width: `${progress}%`, ...style }}\n      {...props}\n    />\n  );\n};\nScrollProgress.displayName = \"ScrollProgress\";\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component",
  "version": "0.2.1",
  "stability": "stable"
}