Message Scroller

"use client";

import {
  MessageScroller,
  MessageScrollerButton,
  MessageScrollerContent,
  MessageScrollerItem,
  MessageScrollerProvider,
  MessageScrollerViewport,
} from "@/components/ui/message-scroller";

export default function Example() {
  return (
    <MessageScrollerProvider>
      <MessageScroller className="h-[300px]">
        <MessageScrollerViewport>
          <MessageScrollerContent>
            <MessageScrollerItem>First message</MessageScrollerItem>
            <MessageScrollerItem>Second message</MessageScrollerItem>
            <MessageScrollerItem>Third message</MessageScrollerItem>
          </MessageScrollerContent>
        </MessageScrollerViewport>
        <MessageScrollerButton />
      </MessageScroller>
    </MessageScrollerProvider>
  );
}