51:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 52:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:T2063,import { Box, Text } from "ink"; import React, { useEffect, useState } from "react"; import { useInteraction } from "@/hooks/use-interaction"; import type { InteractionProps } from "@/hooks/use-interaction"; import { useTheme } from "@/hooks/use-theme"; import { useUnicode } from "@/hooks/use-unicode"; import { resolveStatusSymbol, resolveTerminalSymbol, } from "@/lib/terminal-symbols"; import { DiffView } from "./diff-view"; export type FileChangeType = "modify" | "create" | "delete"; export interface FileChangeItem { path: string; type: FileChangeType; diff?: string; content?: string; } export interface FileChangeProps extends InteractionProps { changes: FileChangeItem[]; onAccept?: (path: string) => void; onReject?: (path: string) => void; onAcceptAll?: () => void; "aria-label"?: string; } const TYPE_ICON: Record = { create: "A", delete: "D", modify: "M", }; /** * Parse a unified diff string into old and new text arrays for DiffView. * Handles simple unified diff format. */ const parseDiff = ( diff: string ): { oldText: string; newText: string; } => { const lines = diff.split("\n"); const oldLines: string[] = []; const newLines: string[] = []; for (const line of lines) { if ( line.startsWith("---") || line.startsWith("+++") || line.startsWith("@@") ) { continue; } if (line.startsWith("-")) { oldLines.push(line.slice(1)); } else if (line.startsWith("+")) { newLines.push(line.slice(1)); } else if (line.startsWith(" ")) { const content = line.slice(1); oldLines.push(content); newLines.push(content); } else { oldLines.push(line); newLines.push(line); } } return { newText: newLines.join("\n"), oldText: oldLines.join("\n") }; }; export const FileChange = ({ changes, onAccept, onReject, onAcceptAll, id, autoFocus, isActive, disabled, "aria-label": ariaLabel = "File changes", }: FileChangeProps) => { const theme = useTheme(); const unicode = useUnicode(); const cursor = resolveTerminalSymbol(unicode, "›", ">"); const [activeIndex, setActiveIndex] = useState(0); const [expandedPaths, setExpandedPaths] = useState>(new Set()); const [acceptedPaths, setAcceptedPaths] = useState>(new Set()); const [rejectedPaths, setRejectedPaths] = useState>(new Set()); const { isFocused } = useInteraction( (input, key) => { if (key.upArrow) { setActiveIndex((i) => Math.max(0, i - 1)); } else if (key.downArrow) { setActiveIndex((i) => Math.min(changes.length - 1, i + 1)); } else if (key.home) { setActiveIndex(0); } else if (key.end) { setActiveIndex(Math.max(0, changes.length - 1)); } else if (key.return || input === " ") { const item = changes[activeIndex]; if (!item) { return; } setExpandedPaths((prev) => { const next = new Set(prev); if (next.has(item.path)) { next.delete(item.path); } else { next.add(item.path); } return next; }); } else if (input === "y" || input === "Y") { const item = changes[activeIndex]; if (!item) { return; } setAcceptedPaths((prev) => new Set([...prev, item.path])); setRejectedPaths((prev) => { const next = new Set(prev); next.delete(item.path); return next; }); onAccept?.(item.path); } else if (input === "n" || input === "N") { const item = changes[activeIndex]; if (!item) { return; } setRejectedPaths((prev) => new Set([...prev, item.path])); setAcceptedPaths((prev) => { const next = new Set(prev); next.delete(item.path); return next; }); onReject?.(item.path); } else if (input === "a" || input === "A") { onAcceptAll?.(); } }, { autoFocus, disabled, id, isActive } ); useEffect(() => { setActiveIndex((current) => Math.min(current, Math.max(0, changes.length - 1)) ); }, [changes.length]); const typeColor = (type: FileChangeType): string => { switch (type) { case "create": { return theme.colors.success ?? "green"; } case "delete": { return theme.colors.error ?? "red"; } case "modify": { return theme.colors.warning ?? "yellow"; } default: { return theme.colors.mutedForeground; } } }; return ( {""} File Changes ({changes.length}) {unicode ? "[↑↓] navigate [Enter/Space] expand [y] accept [n] reject [a] accept all" : "[up/down] navigate [Enter/Space] expand [y] accept [n] reject [a] accept all"} {changes.map((item, idx) => { const isActive = idx === activeIndex; const isExpanded = expandedPaths.has(item.path); const isAccepted = acceptedPaths.has(item.path); const isRejected = rejectedPaths.has(item.path); const diffParts = item.diff ? parseDiff(item.diff) : null; return ( {""} {isActive ? `[${cursor}]` : " "} {TYPE_ICON[item.type]} {item.path} {isAccepted && ( {resolveStatusSymbol(unicode, "success")} accepted )} {isRejected && ( {resolveStatusSymbol(unicode, "error")} rejected )} {(item.diff || item.content) && ( {isExpanded ? resolveTerminalSymbol(unicode, "▼", "v") : resolveTerminalSymbol(unicode, "▶", ">")} )} {isExpanded && ( {item.diff && diffParts && ( )} {!(item.diff && diffParts) && item.content && ( {item.content.split("\n").map((line, li) => ( +{line} ))} )} )} ); })} ); }; 50:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","ink",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/ink","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"ink"}]]}]}]]}],["$","$L51",null,{"namespace":"@termcn","registryDependencies":["https://termcn.dev/r/ink/diff-view.json","https://termcn.dev/r/ink/interaction.json","https://termcn.dev/r/ink/terminal-symbols.json","https://termcn.dev/r/ink/use-theme.json","https://termcn.dev/r/ink/use-unicode.json"]}]]}],null]}],["$","$L52",null,{"files":[{"path":"registry/ui/file-change.tsx","content":"$53","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]