github pierrecomputer/pierre diffs-v1.6.0
@pierre/diffs v1.6.0

3 hours ago

Highlights (no pun intended)

  • New Highlights highlighter: opt in with preferredHighlighter: 'highlights' for WebAssembly syntax highlighting and custom Zed themes. Shiki remains the default while 'highlights' is in beta. Built-in themes work with either backend; custom TextMate themes and grammars still require Shiki.
  • Small files can skip workers: set mainThreadMaxCharacters in your worker pool options to highlight small files and diffs on the main thread. Larger content still uses workers. Leave it unset to keep the current behavior.
  • Annotations stay with their content: new content and its annotations now appear together, including when syntax highlighting finishes asynchronously.
  • Word navigation on Windows/Linux: Ctrl+Left/Right moves by word in edit mode; add Shift to select by word.

To try Highlights, set preferredHighlighter before the first highlighter initialization, in component options or the worker pool's highlighterOptions. Also make sure to check for the appropriate WASM and SIMD support with the included helper.

import { canUseWASM } from '@pierre/diffs';

const preferredHighlighter = canUseWASM() ? 'highlights' : 'shiki-js';

Migrating from 1.5

CodeView annotation callbacks

The displayed file/diff is now the second argument. Move your existing item or context parameter to third:

  • React: (annotation, item) → (annotation, fileOrDiff, item).
  • Vanilla: (annotation, context) → (annotation, fileOrDiff, context).

Read annotation content from fileOrDiff; item or context.item may already contain a replacement that is still being highlighted. Callbacks using only annotation need no changes. Standalone File and FileDiff also receive the displayed file/diff as their second argument.

Constructor ownership argument

For File, FileDiff, UnresolvedFile, VirtualizedFile, and VirtualizedFileDiff, the final isContainerManaged boolean becomes requestOwnerRender?: () => void.

This callback is for framework wrappers, such as a SolidJS component. When the instance needs another render, it calls the callback to request an update from the wrapper. The wrapper then calls render() with its current props during that update.

  • Vanilla JS (false or omitted): omit the argument.
  • Custom wrappers (true): pass a callback that triggers the wrapper's update cycle.

CodeView's constructor still takes a boolean.

CSS-variable themes

If you call createCSSVariablesTheme() directly, it now returns a DiffsTheme and defaults to --diffs-* variables. To keep an existing --shiki-* stylesheet, set the prefix explicitly and register with type 'diffs':

const theme = createCSSVariablesTheme({
  name: 'my-theme',
  variablePrefix: '--shiki-',
});
registerCustomTheme('my-theme', async () => theme, 'diffs');

New diff metadata fields

FileDiffMetadata now includes deletionCharacterCount and additionCharacterCount: the total character counts of deletionLines and additionLines, respectively. parseDiffFromFile() and parsePatchFiles() populate these automatically.

Direct shared-highlighter usage

getSharedHighlighter() now returns DiffsHighlighter instead of the full Shiki API; codeToHast() is no longer available on it.

Full Changelog: diffs-v1.5.2...diffs-v1.6.0

Don't miss a new pierre release

NewReleases is sending notifications on new releases.