import { ScrollArea } from "./scroll-area";

const tags = Array.from({ length: 50 }).map((_, i) => `Item ${i + 1}`);

export default function ScrollAreaDemo() {
  return (
    <div className="flex items-center justify-center p-8">
      <ScrollArea className="h-48 w-48 rounded-base border-2 border-border shadow-shadow">
        <div className="p-4">
          {tags.map((tag) => (
            <div key={tag} className="text-sm font-base py-1 border-b border-border last:border-0">
              {tag}
            </div>
          ))}
        </div>
      </ScrollArea>
    </div>
  );
}