Code Diff

The CodeDiff component is used to display code differences with syntax highlighting. It supports split and unified view modes, full-featured collapsible headers, patch rendering, custom actions, and visual variants for different display styles.

Library

Lobe UI

Framework

React

Type

component

License

MIT

Install

pnpm add @lobehub/ui

Files

• src/CodeDiff/CodeDiff.tsx
• src/CodeDiff/DiffPanel.tsx
• src/CodeDiff/index.ts
• src/CodeDiff/PatchDiff.tsx
• src/CodeDiff/stable.ts
• src/CodeDiff/style.css
• src/CodeDiff/style.ts
• src/CodeDiff/theme.ts

Source

https://github.com/lobehub/lobe-ui

Categories

• Dev Tool Components
• React Dev Tool Components
• Diff Viewer Components
• React Diff Viewer Components

More from Lobe UI

• Accordion
• Action Icon
• Action Icon Group
• Agent Avatar
• Alert
• Anchor
• Auto Complete
• Avatar
• Badge
• Block
• Breadcrumb
• Burger