{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "stats-09",
  "type": "registry:block",
  "title": "Stats with Progress",
  "description": "A stats with progress block.",
  "author": "ephraim duncan <https://ephraimduncan.com>",
  "registryDependencies": [
    "card",
    "progress"
  ],
  "dependencies": [],
  "files": [
    {
      "path": "content/components/stats/stats-09.tsx",
      "type": "registry:component",
      "target": "components/stats-09.tsx",
      "content": "'use client';\n\nimport { Card, CardContent } from '@/components/ui/card';\nimport { Progress } from '@/components/ui/progress';\n\nconst data = [\n  {\n    name: 'Requests',\n    stat: '996',\n    limit: '10,000',\n    percentage: 9.96,\n  },\n  {\n    name: 'Credits',\n    stat: '$672',\n    limit: '$1,000',\n    percentage: 67.2,\n  },\n  {\n    name: 'Storage',\n    stat: '1.85',\n    limit: '10GB',\n    percentage: 18.5,\n  },\n  {\n    name: 'API Calls',\n    stat: '4,328',\n    limit: '5,000',\n    percentage: 86.56,\n  },\n];\n\nexport default function Stats09() {\n  return (\n    <div className=\"flex w-full items-center justify-center p-10\">\n      <dl className=\"grid w-full grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-4\">\n        {data.map((item) => (\n          <Card className=\"py-4 shadow-2xs\" key={item.name}>\n            <CardContent className=\"\">\n              <dt className=\"text-muted-foreground text-sm\">{item.name}</dt>\n              <dd className=\"font-semibold text-2xl text-foreground tabular-nums\">\n                {item.stat}\n              </dd>\n              <Progress className=\"mt-6 h-2\" value={item.percentage} />\n              <dd className=\"mt-2 flex items-center justify-between text-sm\">\n                <span className=\"text-primary\">{item.percentage}&#37;</span>\n                <span className=\"text-muted-foreground\">\n                  {item.stat} of {item.limit}\n                </span>\n              </dd>\n            </CardContent>\n          </Card>\n        ))}\n      </dl>\n    </div>\n  );\n}\n"
    }
  ],
  "categories": [
    "stats"
  ]
}