कॉन्टेंट कंपोनेंट

ये कंपोनेंट सेल ग्रिड पर Markdown, कोड, डिफ़ और बड़े अक्षर रेंडर करते हैं।

#<Markdown>

स्ट्रीमिंग के लिए सुरक्षित Markdown। बढ़ती हुई स्ट्रिंग पास करें और फ़्रेम स्थिर रहता है।

const [text, setText] = useState("");useEffect(() => stream.on("token", (t) => setText((s) => s + t)), []);return <Markdown>{text}</Markdown>;

#<Code>

ts, tsx, json, bash, python, rust, go और अन्य के लिए सिंटैक्स हाइलाइटिंग।

<Code code={source} language="tsx" showLineNumbers maxHeight={12} />

#<Diff>

यूनिफ़ाइड डिफ़, या { before, after } से गणना किए गए डिफ़।

<Diff patch={{ before, after, filename: "app/page.tsx" }} />

#<Spinner>

वैरिएंट: dots, pulse, matrix, line और braille (टर्मिनल के लिए; Menlo में ब्रेल ग्लिफ़ नहीं हैं)। पॉज़ होने पर टाइमर रुक जाते हैं।

<Spinner variant="dots" label="Building…" />

#<AsciiFont>

हेडर के लिए बड़े पिक्सेल अक्षर।

<AsciiFont text="▼ TEXT.JS" color="accent" />

3 पंक्तियों वाले वैरिएंट के लिए font="compact" इस्तेमाल करें। figlet अक्षरों के लिए @textjs/font से FIGlet फ़ॉन्ट पास करें, जैसे font={slant}।