Components
Loading preview...
Display an overflowing list of items.
@shugar
npx shadcn@latest add https://21st.dev/r/shugar/scroller-1import { Scroller } from "@/components/ui/scroller-1";
export default function HorizontalWithButtonsDemo() {
return (
<div className="w-3/4">
<Scroller
childrenContainerClassName="gap-4"
height="100%"
overflow="x"
width="100%"
withButtons
>
{...Array.from({ length: 4 }, (_, i) => (
<div className="bg-[#171717] dark:bg-[#ededed] dark:text-[#171717] text-[#ededed] h-60 w-96" key={i} />
))}
</Scroller>
</div>
);
}