Styling Parameters

Override by passing parameter values or extend with a wrapping CSS class via UserStyle.

Granularity Behavior

• Character: Fine-grained semantic diff (uses DiffMatchPatch) on each line.
• Word: Tokenizes into whitespace + word runs; preserves spacing; optional NBSP padding.
• Line: Each aligned line treated as a single segment (modified vs equal).

Alignment Logic

Lines are normalized (optionally whitespace collapsed), then encoded into tokens for diffing. Deletes followed immediately by inserts are paired as modified lines; pure inserts/deletes create blank counterpart placeholders for visual alignment.

Accessibility

• Panels have aria-label regions.
• Lines are focusable (tabindex="0"), enabling keyboard navigation.
• Placeholder lines include a title for context.

JavaScript Interop

Scroll synchronization uses a tiny JS module (tsCompareSync) injected inline. No external script file needed. If you bundle scripts separately, you may extract that <script> block.

Performance Notes

• DiffMatchPatch is efficient for typical text sizes; extremely large files (> several MB) may benefit from pre-truncation.
• Word granularity token mapping uses in-memory dictionaries; memory footprint proportional to distinct tokens.
• Re-render triggers recomputation when IgnoreWhitespace or Granularity changes�cache externally if needed.

Extensibility Ideas

• Add export of diff summary (counts)
• Provide virtualized rendering for very large files (wrap lines list)
• Add unified diff view mode (single panel) or inline change markers

Example With Custom Theme

Footer Metrics

• Lines = aligned line pair count
• Words / characters refer to right side counts (you can extend to show both)
• Differences = number of non-equal segments under current granularity

Namespace

Use @using TextCompareForBlazor.Components (or add in _Imports.razor).

License / Attribution

Uses DiffMatchPatch via NuGet (DiffMatchPatch 3.0.0). Ensure compliance with its license (Apache 2.0).

Questions or improvements? Extend SideBySideTextCompareBase in your own partial class for additional behaviors.