AI & AgentsPro

Diff View

The result of an edit tool call: file, added and removed lines, and the changed code.

Usage

@@ -41,3 +41,6 @@ TabsList

export function TabsList({ className, ...props }) {

return <div role="tablist" {...props} />

const ref = useRovingFocus()

return (

<div ref={ref} role="tablist" {...props} />

)

}

bash

npm install @wunderui/react

Then import what you need:

tsx

import { DiffView } from "@wunderui/react"

How the component is used inside real screens — the same compositions as the Usage section of the Figma page.

The agent's edit_file call as it appears in the transcript: what it changed, folded open.

edit_file

Applied 1 file edit

Done