{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "glass-progress",
  "title": "Glass Progress",
  "description": "Glass-styled progress bar with a translucent track and token-colored fill.",
  "dependencies": [
    "@vllnt/ui@^0.2.1"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/default/glass-progress/glass-progress.tsx",
      "content": "import * as React from \"react\";\n\nimport { cn } from \"@vllnt/ui\";\n\n/** Props for {@link GlassProgress}. */\nexport type GlassProgressProps = React.ComponentPropsWithoutRef<\"div\"> & {\n  /** Completion percentage between `0` and `100`. */\n  value: number;\n};\n\nfunction clampPercent(value: number): number {\n  return Math.min(Math.max(value, 0), 100);\n}\n\n/**\n * Glass-styled progress bar with a translucent track and a solid fill.\n *\n * @example\n * ```tsx\n * <GlassProgress value={60} />\n * ```\n */\nexport const GlassProgress = ({\n  className,\n  ref,\n  value,\n  ...props\n}: GlassProgressProps & { ref?: React.Ref<HTMLDivElement> }) => {\n  const clamped = clampPercent(value);\n\n  return (\n    <div\n      aria-valuemax={100}\n      aria-valuemin={0}\n      aria-valuenow={clamped}\n      className={cn(\n        \"relative h-2 w-full overflow-hidden rounded-full border border-border/50 bg-muted/40 backdrop-blur\",\n        className,\n      )}\n      ref={ref}\n      role=\"progressbar\"\n      {...props}\n    >\n      <div\n        className=\"h-full rounded-full bg-primary transition-all\"\n        style={{ width: `${clamped}%` }}\n      />\n    </div>\n  );\n};\nGlassProgress.displayName = \"GlassProgress\";\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component",
  "version": "0.2.1",
  "stability": "stable"
}
