1 files changed, 24 insertions, 0 deletions
diff --git a/packages/ui/src/components/diff-changes.tsx b/packages/ui/src/components/diff-changes.tsx
new file mode 100644
index 000000000..7661a9741
--- /dev/null
+++ b/packages/ui/src/components/diff-changes.tsx
@@ -0,0 +1,24 @@
+import type { FileDiff } from "@opencode-ai/sdk"
+import { createMemo, Show } from "solid-js"
+
+export function DiffChanges(props: { diff: FileDiff | FileDiff[] }) {
+  const additions = createMemo(() =>
+    Array.isArray(props.diff)
+      ? props.diff.reduce((acc, diff) => acc + (diff.additions ?? 0), 0)
+      : props.diff.additions,
+  )
+  const deletions = createMemo(() =>
+    Array.isArray(props.diff)
+      ? props.diff.reduce((acc, diff) => acc + (diff.deletions ?? 0), 0)
+      : props.diff.deletions,
+  )
+  const total = createMemo(() => (additions() ?? 0) + (deletions() ?? 0))
+  return (
+    <Show when={total() > 0}>
+      <div data-component="diff-changes">
+        <span data-slot="additions">{`+${additions()}`}</span>
+        <span data-slot="deletions">{`-${deletions()}`}</span>
+      </div>
+    </Show>
+  )
+}