{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "scroll-area1",
  "title": "Scroll area",
  "description": "A scroll area is a container that allows the user to scroll through a large amount of content. Each scroll area variant functions identically with Radix UI and Base UI.",
  "registryDependencies": [
    "scroll-area",
    "separator"
  ],
  "files": [
    {
      "path": "contents/components/scroll-area/1/index.tsx",
      "content": "import * as React from \"react\";\n\nimport { ScrollArea } from \"@/components/ui/scroll-area\";\nimport { Separator } from \"@/components/ui/separator\";\n\nconst tags = Array.from({ length: 50 }).map((_, i, a) => `v1.2.0-beta.${a.length - i}`);\n\nexport default function ScrollAreaDemo() {\n  return (\n    <ScrollArea className=\"h-72 max-w-xs w-full rounded-md border\">\n      <div className=\"p-4\">\n        <h4 className=\"mb-4 text-sm leading-none font-medium\">Tags</h4>\n        {tags.map((tag) => (\n          <React.Fragment key={tag}>\n            <div className=\"text-sm\">{tag}</div>\n            <Separator className=\"my-2\" />\n          </React.Fragment>\n        ))}\n      </div>\n    </ScrollArea>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/scroll-area1.tsx"
    }
  ],
  "type": "registry:component"
}