Terminal
Terminal
macOS-style terminal window with traffic lights, input lines ($ prompt), and output lines
Installation
npx @ravikumarsurya/mdx-ui add terminalUsage
<Terminal title="Installation">
<TerminalLine cmd>npm install @ravikumarsurya/mdx-ui</TerminalLine>
<TerminalLine>added 5 packages in 1.2s</TerminalLine>
</Terminal>Examples
Installing mdx-ui
npx @ravikumarsurya/mdx-ui init
✔ Created mdx-ui.json
npx @ravikumarsurya/mdx-ui add accordion badge callout
✔ accordion
✔ badge
✔ callout
Done! 🎉
Installation steps
Getting started
npx @ravikumarsurya/mdx-ui init
✔ Created mdx-ui.json
npx @ravikumarsurya/mdx-ui add callout tabs
✔ callout
✔ tabs
Build output
npm run build
npm run build
▲ Next.js 14.2.0
✓ Compiled successfully
✓ Collecting page data
✓ Generating static pages (12/12)
No title
<Terminal>
<TerminalLine cmd>git status</TerminalLine>
<TerminalLine>nothing to commit, working tree clean</TerminalLine>
</Terminal>Props
Terminal
| Prop | Type | Default | Description |
|---|---|---|---|
title | string | "Terminal" | Text shown in the title bar |
className | string | — | Extra classes on the outer <figure> |
TerminalLine
| Prop | Type | Default | Description |
|---|---|---|---|
cmd | boolean | false | Show $ prompt; renders text in white instead of grey |
children | ReactNode | — | Line content |