Chat bubble with an avatar and timestamp. Role flips alignment and color.
The import and the props worth knowing about, in one place.
import { Chat1 } from "@/components/beste/piece/chat1";
<Chat1
avatarSrc="https://images.unsplash.com/photo-1573140247632-f8fd74997d5c?w=200&auto=format&fit=crop&q=60&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MjI0fHxwb3J0cmFpdHxlbnwwfHwwfHx8MA%3D%3D"
avatarAlt="Ayşe Kaya"
fallback="AK"
message="Hey, did you get a chance to look at the new onboarding flow?"
timestamp="09:42"
role="received"
/>