Velocity X Components

Standard Data

Text Diff Viewer

Shows exactly what changed between two blocks of text — side-by-side or as a single unified list — with every added or removed line carrying a glyph and a screen-reader label so the change is readable without relying on colour.

Subscription Included with the Velocity Components subscription.
bash
$ velocityx add standard-text-diff-viewer

Built for astro.

Full docs for Text Diff Viewer →

Needs a licence key — subscribe here, then velocityx loginonce.

astro v1.0.2
Text Diff Viewer
config.yaml +2 −1 2 lines added, 1 line removed
config.yaml: 2 lines added, 1 line removed
v12 v13
1 server: 1 server:
2 port: 8080 2 port: 8080
3 Removed: timeout: 30
3 Added: timeout: 60
4 retries: 3 4 retries: 3
5 Added: keepAlive: true
5   6  

Props

NameTypeRequiredDefaultDescription
beforestringNo""
afterstringNo""
beforeLabelstringNo"Before"
afterLabelstringNo"After"
mode"split" | "unified"No"split"
labelstringNo"Text comparison"
classNamestringNo""

File this creates

The CLI writes this path into your project, relative to its root — nothing else moves.

text
components/velocity/standard-text-diff-viewer/TextDiffViewer.astro

Using the Text Diff Viewer component

Install it with velocityx add standard-text-diff-viewer. The CLI writes the source straight into your project — no runtime dependency, no registry lock-in, and it themes itself from the same primary-*/accent-* scale as the rest of the library.

More from Standard Data.