Diff Viewer API

Full surface of oge-diff-viewer: its inputs, methods and output, the comparison model and the config provider.

Properties Methods Events Types

OgeDiffViewer

oge-diff-viewer

Name	Type	Default	Description
`oldValue / newValue`	`unknown`	`''`	The two sides: texts, or with `language="json"` JSON text or values.
`language`	`'text' \| 'json'`	`'text'`	`language="json"` parses JSON text (or takes values) and compares canonical, two-space text with keys sorted (`sortKeys`), so key order is never a change; `diff().changes` lists the changed paths (`$.items[2].price`). A side that is not JSON shows the `invalidJson` message.
`mode`	`'split' \| 'inline' (model)`	`'split'`	Two-way: side by side, or one column with removed lines above the added ones.
`context`	`number \| undefined`	`config ?? 3`	Unchanged lines kept around each change; `Infinity` folds nothing.
`ignoreWhitespace / ignoreCase`	`boolean`	`false`	Lines differing only in whitespace, or only in letter case, count as equal.
`wordDiff`	`boolean`	`true`	Highlight the changed words inside changed lines.
`sortKeys`	`boolean`	`true`	JSON: sort object keys before comparing.
`toolbar`	`boolean`	`true`	The added / removed counts, the layout switch and previous / next change (announced politely).
`messages`	`Partial<OgeDiffViewerMessages>`	—	Per-instance overrides of the config catalog.

Name	Type	Description
`nextChange() / previousChange()`	`() => void`	Scrolls to the next or previous change (wrapping) and announces “Change 2 of 5”.
`diff()`	`() => OgeDiffModel`	What the viewer shows: `{ rows, stats: { added, removed, changes }, changes, error }` — a signal in Angular.

Name	Type	Description
`modeChange`	`'split' \| 'inline'`	The banana half of `[(mode)]`.

Name	Type	Description
`Lines and words`	`Myers O(ND)`	A Myers line diff (the shortest edit script); within a changed pair of lines the changed words are highlighted. Unchanged runs fold to `context` lines around each change and open on a click. Every changed line carries a visually hidden “Added” / “Removed” for screen readers — the colour is never the only signal — and the scroll area takes focus for keyboard scrolling.

Name	Type	Description
`OgeDiffModel`	`{ rows; stats; changes; error }`	What `diff()` returns.
`OgeDiffRow`	`{ kind: 'line'; old; new; change } \| { kind: 'fold'; count; oldLine; newLine }`	A drawn row: a line (a cell per side, with its word segments), or folded unchanged lines.
`OgeJsonChange`	`{ path; kind: 'added' \| 'removed' \| 'changed'; before?; after? }`	One changed path of two JSON values.
`OgeDiffLanguage`	`'text' \| 'json'`	What the viewer compares.
`ogeDiffModel / ogeJsonChanges`	`functions (@oge-ui/behavior, re-exported)`	The model without a view (servers, tests, a change log), and the changed paths of two JSON values.

Name	Type	Description
`ogeDiffLines / ogeDiffWords / ogeDiffSplitLines / OgeDiffOp / OgeDiffOptions`	`functions`	The line diff (runs of equal, deleted and inserted lines), the word diff, the line splitter (any newline style).
`ogeDiffRows / OgeDiffRowOptions / OgeDiffCell / OgeDiffSegment`	`functions`	The rows a split or inline view draws, folds and word highlights included.
`ogeDiffStats / ogeJsonDiffText / ogeParseJson`	`functions`	Counts of added, removed and changed; canonical JSON text; JSON parsing with the error message.

Name	Type	Description
`messages`	`OgeDiffViewerMessages`	Every user-facing string: `label`, `oldLabel` / `newLabel` (the column headings), `split`, `inline`, `previousChange`, `nextChange`, `expand` (an ICU plural over `{count}`), `stats`, `changePosition` (`{index}` / `{count}`), `noChanges`, `invalidJson` (`{side}`, `{error}`), `added` and `removed`. Translated in every `@oge-ui/locales` pack (`layout.diffViewer`).
`context`	`number \| undefined`	Default unchanged lines around a change. Pass a function for a live config.

Name	Type	Description
`provideOgeDiffViewerConfig`	`(config: OgeDiffViewerConfigInput \| (() => OgeDiffViewerConfigInput)) => Provider`	Application- or component-scoped defaults; a function makes the config live.
`OGE_DIFF_VIEWER_CONFIG`	`InjectionToken<OgeDiffViewerConfig>`	The resolved config the viewer injects.
`OGE_DEFAULT_DIFF_VIEWER_CONFIG`	`OgeDiffViewerConfig`	The defaults (from `@oge-ui/behavior`).
`OGE_DEFAULT_DIFF_VIEWER_MESSAGES`	`OgeDiffViewerMessages`	The English catalog.
`resolveOgeDiffViewerConfig`	`(input?, base?) => OgeDiffViewerConfig`	Merges a partial config over a base (the defaults).
`OgeDiffViewerConfig`	`{ messages: OgeDiffViewerMessages; context? }`	Resolved config shape.
`OgeDiffViewerConfigInput`	`Partial<OgeDiffViewerConfig> with partial messages`	What the provider accepts.
`OgeDiffViewerMessages`	`{ label; oldLabel; newLabel; split; inline; previousChange; nextChange; expand; stats; changePosition; noChanges; invalidJson; added; removed }`	The diff viewer catalog.