{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "stock-sm-05",
  "type": "registry:component",
  "registryDependencies": [
    "https://wigggle-ui.vercel.app/r/widget.json",
    "https://wigggle-ui.vercel.app/r/icons.json",
    "https://wigggle-ui.vercel.app/r/label.json",
    "https://wigggle-ui.vercel.app/r/tooltip.json"
  ],
  "files": [
    {
      "path": "registry/default/widgets/stocks/sm/stock-05.tsx",
      "content": "import * as React from \"react\";\r\n\r\nimport { Widget, WidgetContent } from \"@/registry/default/ui/widget\";\r\nimport { Label } from \"@/registry/default/ui/label\";\r\nimport { Icons } from \"@/components/icons\";\r\nimport {\r\n  Tooltip,\r\n  TooltipContent,\r\n  TooltipTrigger,\r\n} from \"@/registry/default/ui/tooltip\";\r\n\r\ntype Stock = {\r\n  logo: React.FC<React.SVGProps<SVGSVGElement>>;\r\n  ticker: string;\r\n  companyName: string;\r\n  price: number;\r\n};\r\n\r\nconst stocks: Stock[] = [\r\n  {\r\n    logo: Icons.apple,\r\n    ticker: \"AAPL\",\r\n    price: 262.82,\r\n    companyName: \"Apple Inc.\",\r\n  },\r\n  {\r\n    logo: Icons.salesforce,\r\n    ticker: \"CRM\",\r\n    price: 307.46,\r\n    companyName: \"Salesforce, Inc.\",\r\n  },\r\n  {\r\n    logo: Icons.starbucks,\r\n    ticker: \"SBUX\",\r\n    price: 86.09,\r\n    companyName: \"Starbucks Corp.\",\r\n  },\r\n  {\r\n    logo: Icons.tesla,\r\n    ticker: \"TSLA\",\r\n    price: 433.72,\r\n    companyName: \"Tesla Inc.\",\r\n  },\r\n];\r\n\r\nexport default function WidgetDemo() {\r\n  return (\r\n    <Widget>\r\n      <WidgetContent className=\"items-center\">\r\n        <div className=\"grid size-full grid-cols-2 items-center gap-6\">\r\n          {stocks.map(({ logo: Logo, ticker, price, companyName }) => (\r\n            <Tooltip delayDuration={300} key={ticker}>\r\n              <TooltipTrigger asChild>\r\n                <div className=\"flex flex-col items-center justify-center gap-1\">\r\n                  <Logo className=\"fill-foreground size-8 rounded-full\" />\r\n                  <Label className=\"text-base\">${price}</Label>\r\n                </div>\r\n              </TooltipTrigger>\r\n              <TooltipContent>\r\n                <p>{companyName}</p>\r\n              </TooltipContent>\r\n            </Tooltip>\r\n          ))}\r\n        </div>\r\n      </WidgetContent>\r\n    </Widget>\r\n  );\r\n}\r\n",
      "type": "registry:component"
    }
  ],
  "meta": {
    "tags": [
      "stocks"
    ],
    "size": "sm"
  }
}