{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "base-progress-glass",
  "type": "registry:component",
  "title": "Base Progress Glass",
  "description": "Base progress bar component used as foundation for:",
  "dependencies": [
    "react"
  ],
  "registryDependencies": [
    "cn"
  ],
  "files": [
    {
      "path": "components/glass/specialized/base-progress-glass.tsx",
      "type": "registry:component",
      "content": "/**\n * BaseProgressGlass Component\n *\n * Base progress bar component used as foundation for:\n * - ProgressGlass (standard progress bar)\n * - RainbowProgressGlass (gradient progress bar)\n *\n * Features:\n * - Theme-aware styling\n * - Percentage calculation\n * - Accessible (ARIA progressbar)\n * - Customizable through children render prop\n */\n\nimport { forwardRef, type ReactNode } from 'react';\nimport { cn } from '@/lib/utils';\nimport '@/glass-theme.css';\n\n// ========================================\n// PROPS INTERFACE\n// ========================================\n\nexport interface BaseProgressGlassProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  readonly value?: number;\n  readonly max?: number;\n  readonly children?: ReactNode | ((percentage: number) => ReactNode);\n}\n\n// ========================================\n// COMPONENT\n// ========================================\n\nexport const BaseProgressGlass = forwardRef<HTMLDivElement, BaseProgressGlassProps>(\n  ({ value = 0, max = 100, className, children, ...props }, ref) => {\n    const percentage = Math.min(100, Math.max(0, (value / max) * 100));\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'relative h-2 w-full overflow-hidden rounded-full',\n          'bg-white/5 backdrop-blur-sm',\n          className\n        )}\n        role=\"progressbar\"\n        aria-valuenow={value}\n        aria-valuemin={0}\n        aria-valuemax={max}\n        aria-valuetext={`${Math.round(percentage)}%`}\n        {...props}\n      >\n        {typeof children === 'function'\n          ? children(percentage)\n          : children || (\n              <div\n                className=\"h-full transition-all duration-300 ease-out\"\n                style={{\n                  width: `${percentage}%`,\n                  background: 'var(--progress-bar-bg, linear-gradient(90deg, #a855f7, #ec4899))',\n                }}\n              />\n            )}\n      </div>\n    );\n  }\n);\n\nBaseProgressGlass.displayName = 'BaseProgressGlass';\n"
    }
  ],
  "categories": [
    "specialized"
  ]
}