Tweet Card

A card that displays a tweet with the author's name, handle, and profile picture.

Installation

npx nyxbui@latest add tweet-card

Usage

To render on server side using RSC (Next.js 13):

import { TweetCard } from "~/components/ui/tweet-card.tsx";
 
export default async function App() {
  return <TweetCard id="1703861725534011484" />;
}

To render on client side:

"use client";
import { ClientTweetCard } from "~/components/ui/client-tweet-card.tsx";
 
export default function App() {
  return <ClientTweetCard id="1703861725534011484" />;
}

Examples

Tweet Card With Image Carousel

Tweet Card With Meta URL Preview

Props

ClientTweetCard

Prop	Type	Description
id	string	The id of the tweet to display.

TweetCard

Prop	Type	Description
id	string	The id of the tweet to display.

Credits

This component is built on top of React Tweet.