Code Diff
Before and after code lines, the way an agent proposes a change.
$ npx shadcn@latest add https://ui.elysiumdesigns.in/r/code-diff.jsonbilling/prorate.ts
const days = diff(start, end)
- return amount * days / 30
+ return amount * days / daysIn(month)
}
When to use
- Before and after code lines, the way an agent proposes a change.
- You want a chat piece that already handles empty, loading and dark states.
Installation
Add Code Diff with the shadcn CLI – your project needs a components.json – or copy the file by hand.
$ npx shadcn@latest add https://ui.elysiumdesigns.in/r/code-diff.jsonAPI reference
CodeDiff
| Prop | Type | Default | Description |
|---|---|---|---|
className | string | – | Extra classes on the root element. |
look | "classic" | "clean" | "classic" | Visual style. Both follow your light or dark theme. |