About this block

Edit History Diff is the change-review surface: a two-panel layout where the left column lists five versions of the Pricing page (Maya Chen rewording the CTA, Priya Nair clarifying the pricing section, Avery Stone adding the feature comparison table, down to Noah Park initial draft) and the right panel shows the selected edit as an inline diff. Added runs get bg-foreground/10 and font-medium; removed runs get bg-foreground/5 and line-through. A legend below the diff names Added and Removed with color swatches. The footer says the history is read-only and cannot be deleted, which is the audit guarantee.

Edits are one typed array with a selected flag; diffLines is a separate typed array of segment arrays. Theme-token opacity replaces literal green and red so the diff reads on dark and light themes without special-casing.

When to use

Reach for this block on a document detail page or a settings audit panel, wired to your document version history API. The selected edit state should be driven by the URL or click state in the real implementation.

A natural flow around it on an Application Pro page:

Before

• App shell
• Activity feed

After

• Activity feed
• Settings page

What you can display

One strong use is the document version diff for a content or copy workflow. Other diff surfaces:

• Config diff. Diff lines become JSON or YAML property changes for settings or feature-flag history.
• Code review snippet. The right panel shows a code hunk with the same token-opacity diff style.
• Form field audit. Each edit entry is a field change on a record, useful in CRM or admin tools.

Tip: the read-only footer is the one place in a product where admitting a constraint builds more trust than hiding it; keep it.