import type { SvelteDiffProps } from './index.js'; /** * A Svelte 5 component that visually compares two strings using the diff-match-patch algorithm. * * Supports character-level diffing, semantic and efficiency cleanup, custom rendering via Svelte snippets, and flexible CSS-class styling. * * ### Expected Patterns * * When `originalText` contains named capture groups like `(?\\d{4})`, the component * extracts matching values from `modifiedText` and renders them with distinct "expected" * styling instead of normal insert/remove colors. This is useful for templates where * certain dynamic regions (dates, names, versions) are expected to differ. * * @example Basic usage with CSS classes * ```svelte * * ``` * * @example Custom snippet rendering * ```svelte * * {#snippet remove(text)}{text}{/snippet} * {#snippet insert(text)}{text}{/snippet} * {#snippet equal(text)}{text}{/snippet} * {#snippet expected(text, groupName)}{text}{/snippet} * {#snippet lineBreak()}
{/snippet} *
* ``` * * @example Expected patterns (named capture groups) * ```svelte * \\d{4}) (?.+)'} * modifiedText={'Copyright 2024 Jason Kummerl'} * /> * ``` * * @property {string} originalText - The original (left-side) string to compare (the "before" or source text). May contain `(?pattern)` capture groups for expected-pattern matching. * @property {string} modifiedText - The modified (right-side) string to compare (the "after" or target text) * @property {number} [timeout=1] - Maximum time in seconds to spend computing the diff (0 for unlimited) * @property {boolean} [cleanupSemantic=false] - If true, applies semantic cleanup for human readability * @property {number} [cleanupEfficiency=4] - Edit cost for efficiency cleanup; higher values are more aggressive * @property {boolean} [compact=true] - By default, built-in equal segments without an equal class render as text. Set to false to restore legacy equal spans. Custom equal snippets/renderers and `rendererClasses.equal` retain their requested markup, and line breaks continue through the `lineBreak` renderer. * @property {function} [onProcessing] - Callback invoked after diff computation, receiving `(timing, diffs, captures?)`. The `captures` argument is a `Record` when expected patterns match. * @property {Snippet} [remove] - Child snippet rendering a removed segment. Takes precedence over `renderers.remove`. * @property {Snippet} [insert] - Child snippet rendering an inserted segment. Takes precedence over `renderers.insert`. * @property {Snippet} [equal] - Child snippet rendering an unchanged segment. Takes precedence over `renderers.equal`. * @property {Snippet} [expected] - Child snippet rendering an expected segment, receiving `(text, groupName)`. Takes precedence over `renderers.expected`. * @property {Snippet} [lineBreak] - Child snippet rendering a line break between diff lines. Takes precedence over `renderers.lineBreak`. * @property {Partial} [renderers] - Custom Svelte snippets for rendering diff segments: `remove`, `insert`, `equal`, `expected`, and `lineBreak`. Per segment type, a child snippet wins over the `renderers` entry, which wins over the built-in rendering. * @property {RendererClasses} [rendererClasses] - Custom CSS classes for each diff type: `remove`, `insert`, `equal`, `expected`. Only effective for segment types with no custom snippet. */ declare const SvelteDiff: import("svelte").Component; type SvelteDiff = ReturnType; export default SvelteDiff;