logo svelte /diff v0.4.1

Types & Exports

Everything public is exported from the package root.

import SvelteDiff, {
    SvelteDiff as NamedSvelteDiff,
    type SvelteDiffProps,
    type SvelteDiffTiming,
    type SvelteDiffTuple,
    type Renderers,
    type RendererClasses,
    type CaptureRange,
    type DisplayDiff,
    type PatternMatchResult
} from '@humanspeak/svelte-diff'
import SvelteDiff, {
    SvelteDiff as NamedSvelteDiff,
    type SvelteDiffProps,
    type SvelteDiffTiming,
    type SvelteDiffTuple,
    type Renderers,
    type RendererClasses,
    type CaptureRange,
    type DisplayDiff,
    type PatternMatchResult
} from '@humanspeak/svelte-diff'

Components

ExportNotes
defaultThe SvelteDiff component
SvelteDiffNamed export of the same component
SvelteDiffMatchPatchDeprecated compatibility alias

SvelteDiffTiming

type SvelteDiffTiming = {
    main: number
    cleanup: number
    total: number
}
type SvelteDiffTiming = {
    main: number
    cleanup: number
    total: number
}

All values are milliseconds. main measures the core algorithm, cleanup measures the selected cleanup pass, and total covers both.

SvelteDiffTuple

An alias for Diff from diff-match-patch-ts. Each tuple is an operation and its text:

type SvelteDiffTuple = [operation: -1 | 0 | 1, text: string]
type SvelteDiffTuple = [operation: -1 | 0 | 1, text: string]
  • -1 — removed
  • 0 — equal
  • 1 — inserted

Renderers

type Renderers = {
    remove?: Snippet<[string]>
    equal?: Snippet<[string]>
    insert?: Snippet<[string]>
    expected?: Snippet<[string, string]>
    lineBreak?: Snippet<[]>
}
type Renderers = {
    remove?: Snippet<[string]>
    equal?: Snippet<[string]>
    insert?: Snippet<[string]>
    expected?: Snippet<[string, string]>
    lineBreak?: Snippet<[]>
}

The expected renderer receives both the matched text and its named capture-group name.

RendererClasses

type RendererClasses = {
    remove?: string
    equal?: string
    insert?: string
    expected?: string
}
type RendererClasses = {
    remove?: string
    equal?: string
    insert?: string
    expected?: string
}

Classes only affect built-in fallbacks. When you replace a segment with a snippet, that snippet owns its own classes.

Expected-pattern types

CaptureRange describes a named match inside the modified string. DisplayDiff is an internal-rendering-shaped segment that may carry an expected group name. PatternMatchResult combines resolved template text, captured values, and capture ranges.

interface PatternMatchResult {
    resolvedText: string
    captures: Record<string, string>
    captureRanges: CaptureRange[]
}
interface PatternMatchResult {
    resolvedText: string
    captures: Record<string, string>
    captureRanges: CaptureRange[]
}

These are exported for integrations that want to share the component’s expected-region concepts without duplicating type definitions.