Every design change is expressed as a structured diff of props, styles, and tree — not a screenshot comparison. Reviewers see exactly what changed and why.
Intent Diff runs a Myers/LCS algorithm on serialized component trees — not on pixels. Every merge triggers a full, machine-readable patch automatically.
The component tree is serialized to a structured document of props and styles, validated against a Zod schema before being stored as the diff baseline.
The LCS-based Myers diff algorithm compares the serialized lines of the before and after snapshots, finding the minimum edit script between them.
A standard unified patch string is emitted — --- before / +++ after with hunk headers and context lines on each side.
The patch is passed to @pierre/diffs and displayed in Split or Unified view for reviewers to inspect, accept, or reject individual prop changes.
Screenshot comparison tools tell you something looks different. Intent Diff tells you exactly which prop changed, from what value to what value. Every diff is a first-class data structure — queryable, storable, and consumable by CI/CD pipelines without any manual interpretation.
Reviewers are not forced to approve or reject an entire diff. Each prop change is an independent item — cherry-pick what ships and what goes back, with a full audit trail recorded per decision. No more all-or-nothing PR approvals on design work.
Intent Diff applies battle-tested diff theory — the same algorithm that powers Git — to component trees, not text files. Structured input means structured, machine-readable output.
The O(ND) Myers diff algorithm finds the shortest edit script between two sequences. The same algorithm used in git diff — applied here to serialized component prop lines, not source code.
After the edit graph is constructed, longest-common-subsequence backtracking produces the minimum set of additions and removals — minimizing diff noise and keeping context stable across rebases.
Edit scriptOutput is a standard unified patch string with --- and +++ headers, @@ hunk ranges, and three lines of context. Parseable by any standard tooling out of the box.
The patch is rendered by @pierre/diffs in two modes: Split (side-by-side panels) for detailed prop comparison, and Unified (stacked) for a linear review flow.
Every component snapshot is validated at write time against a shared Zod schema. Type-safe serialization means the diff algorithm always operates on well-formed input — no silent failures or undefined prop shapes.
Type safetyThe unified patch is available as a JSON payload on every merge event. Pipe it into GitHub Actions, Linear, or your own webhook to block PRs on token violations or notify designers of overridden changes.
AutomationEvery artboard edit creates a diff. Every diff is queryable by the graph. Every diff is shippable through the bridge.
Every design change expressed as a structured, machine-readable, component-level diff. Early access is free.