{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"c-scroll-area-5","type":"registry:block","title":"Scroll area with scrollbar gutter","description":"Scroll area with scrollbar gutter","dependencies":[],"registryDependencies":["scroll-area"],"files":[{"path":"c-scroll-area-5.tsx","type":"registry:block","content":"import { ScrollArea } from \"@/components/ui/scroll-area\"\n\nexport function Pattern() {\n  return (\n    <ScrollArea className=\"rounded-2xl h-72 w-56 border data-has-overflow-x:py-2.5 data-has-overflow-y:px-2.5\">\n      <div className=\"flex w-full flex-col items-center gap-4 py-2\">\n        {Array.from({ length: 10 }).map((_, i) => (\n          <div\n            key={i}\n            className=\"rounded-2xl relative h-36 w-full shrink-0 overflow-hidden border\"\n          >\n            <img\n              src={`https://picsum.photos/400/300?random=${i + 1}`}\n              alt={`Image ${i + 1}`}\n              className=\"h-full w-full object-cover\"\n            />\n          </div>\n        ))}\n      </div>\n    </ScrollArea>\n  )\n}","target":"components/examples/c-scroll-area-5.tsx"}],"meta":{"order":5}}