Skip to content

Releases: sitefinitysteve/diff-text

v1.6.0

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 30 Sep 00:13
1782614

diff-text now covers Vue, React and PHP from one repository, with one behavior contract and one set of shared test fixtures. The three packages produce the same diffs and the same markup.

Package Install
vue-diff-text 1.6.0 npm i vue-diff-text
react-diff-text 1.6.0 (new) npm i react-diff-text
sitefinitysteve/php-diff-text 1.6.0 composer require sitefinitysteve/php-diff-text

Live demo: Vue · React · PHP

New

  • React package. react-diff-text is a 1:1 port of the Vue components: same names, same props, same DOM.
  • Line views:
    • DiffUnified: line numbers and folded context you can click to expand.
    • DiffSplit: side by side, with the changed words highlighted inside edited lines.
  • DiffStats: a badge with added, removed and unchanged counts, plus a similarity percentage.
  • Visualizations. All of them are static HTML and CSS, so they work in PHP output too:
    • Rewrite heatmap (DiffHeatmap): each sentence is shaded by how much it changed. Useful for AI-edited prose.
    • Moved blocks (detectMoves): a paragraph that moved shows as moved, not as a deletion plus an addition.
    • Change minimap (minimap): a strip of links to every change.
    • Revision timeline (DiffTimeline): step through v1 → v2 → v3.
    • Animated playback (DiffPlayback): changes animate in order, and it respects reduced motion.
  • Navigation: next(), prev() and goTo() on every view.

Fixed

  • HTML diff. It now runs one engine on every platform, replacing diffblazer in Vue/React:
    • output is always valid, balanced HTML;
    • content after <script>/<style> is no longer dropped;
    • entities compare by value (&eacute; equals é);
    • output is byte-identical across Vue, React and PHP.
  • PHP text diffs:
    • word and sentence diffs no longer drop spaces;
    • HTML output no longer breaks tags apart;
    • the engine is rewritten (Myers, jsdiff-compatible): a 10,000-character diff that used to run out of memory now takes about 2 ms.
  • Similarity stays between 0 and 1. It could go above 1 before. It also only strips tags for HTML input.
  • Split view: each column shows its own line exactly, including indentation.
  • Vue/React state: expanded rows and the navigation highlight survive parent re-renders.
  • Server rendering: SSR and hydration are clean for Nuxt/Next, including text with Windows line endings.

Upgrading

The public APIs are backward compatible, but some output changed on purpose:

  • Full replacement in DiffHtml renders <div class="diff-removed"> / <div class="diff-added"> instead of <span>.
  • Change attributes: every change carries data-change-index.
  • Word diffs follow jsdiff v8 whitespace rules (Vue was on v5).
  • Removed DiffHtml options: markers, atomicTags, repeatingWordsAccuracy, matchGranularity and ignoreWhiteSpaceDifferences were diffblazer-only and are now ignored. orphanMatchThreshold, ignoreFormattingTags, similarityThreshold and ignoreCase all work.
  • Runtime dependencies: Vue and React have none now; everything is bundled, and the bundles are about half the size (gzip).

Full details are in the changelogs: Vue, React, PHP.

Repository

sitefinitysteve/vue-diff-text is now sitefinitysteve/diff-text, and old links redirect. sitefinitysteve/php-diff-text is a read-only mirror that Packagist reads; please open issues and pull requests on diff-text.

v1.5.4

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 10 Mar 19:30

Bug Fix: Garbled interleaving on partial text replacement

  • ignoreFormattingTags now defaults to true — inline formatting tags (<strong>, <em>, etc.) no longer create separate token groups in diffblazer, preventing garbled word-by-word interleaving when formatting differs between old and new text
  • Added regression tests for real-world HTML content with <p> and <strong> tags

v1.5.2

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 10 Mar 17:38

Bug Fixes

  • Set default orphanMatchThreshold: 0.3 in htmldiff options to prevent garbled interleaving on partial text replacements

Tests

  • Added test coverage for partial text replacement producing clean block diffs
  • Added test for small word-level changes still producing fine-grained diffs
  • Added test for small additions at end of text
  • Added test for consumer overriding orphanMatchThreshold via options prop

Docs

v1.5.0

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 10 Mar 12:44

Added

  • Quote normalization — smart/curly quotes (""'') are now automatically normalized to straight quotes before diffing in DiffHtml, eliminating false diffs caused by copy-paste from word processors or CMS editors
  • ignoreFormattingTags prop for DiffHtml — strips inline formatting tags (<strong>, <em>, <b>, <i>, <u>, <s>, <mark>, <sub>, <sup>) before diffing so style-only changes don't produce noisy output
  • normalizeQuotes and stripFormattingTags utility functions (src/utils/normalizeHtml.ts)
  • Comprehensive test suites for quote normalization and formatting tag stripping (DiffHtml + normalizeHtml)

Changed

  • DiffHtml now pipes both oldText and newText through a normalization step before computing the diff
  • ESLint config, lint scripts (lint, lint:fix), and Husky prepare script added to package.json
  • Self-closing tag formatting applied to DiffHtml template

v1.4.0

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 09 Mar 02:31

Added

  • similarity-threshold prop for DiffHtml — when text similarity falls below the threshold, renders a clean full replacement (old text deleted, new text added) instead of garbled word-level diff
  • computeTextSimilarity utility using Dice coefficient via diffWords
  • Test suite with Vitest covering all 6 component types and similarity utility (45 tests)
  • ESLint 9 + Husky pre-commit hook (lint + test)
  • CHANGELOG.md
  • Demo section showing similarity threshold with side-by-side comparison
  • Playground threshold slider for DiffHtml

Changed

  • DiffHtml template now supports conditional full-replacement rendering

v1.3.0

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 09 Mar 02:31

Added

  • DiffHtml component using diffblazer for HTML-aware diffing
  • diffblazer dependency for HTML diff support

Changed

  • Updated description for clarity on component functionality

v1.2.1

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 09 Mar 02:31

Fixed

  • CSS import documentation — removed automatic CSS import, users must import explicitly

v1.2.0

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 09 Mar 02:31

Changed

  • Converted from scoped CSS to global CSS with .text-diff class scoping for easier customization

v1.1.2

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 09 Mar 02:31

Added

  • Specific CSS class names per component (text-diff-chars, text-diff-words, etc.) for targeted styling

Fixed

  • Vue dependency moved to peerDependencies to prevent multiple Vue instances

v1.1.1

Choose a tag to compare

@sitefinitysteve sitefinitysteve released this 09 Mar 02:31

Fixed

  • Module resolution — corrected file paths in package.json