52: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"] 53: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"] 54:T2395,import { useIsScreenReaderEnabled, Box, Text } from "ink"; import { useEffect, useId, useState } from "react"; import { FocusScope, useInteraction, } from "@/hooks/use-interaction"; import { useTheme } from "@/hooks/use-theme"; import { useUnicode } from "@/hooks/use-unicode"; import { resolveBorderStyle } from "@/lib/terminal-style"; import { graphemeLength, removeGraphemeBefore, } from "@/lib/terminal-text"; export interface Command { id: string; label: string; description?: string; shortcut?: string; onSelect?: () => void; group?: string; disabled?: boolean; } export interface CommandPaletteProps { commands: Command[]; open?: boolean; defaultOpen?: boolean; onOpenChange?: (open: boolean) => void; isOpen?: boolean; onClose?: () => void; placeholder?: string; maxItems?: number; returnFocusId?: string; "aria-label"?: string; } const fuzzyMatch = (value: string, query: string): boolean => { if (!query) { return true; } const normalizedValue = value.toLocaleLowerCase(); const normalizedQuery = query.toLocaleLowerCase(); let queryIndex = 0; for ( let valueIndex = 0; valueIndex < normalizedValue.length && queryIndex < normalizedQuery.length; valueIndex += 1 ) { if (normalizedValue[valueIndex] === normalizedQuery[queryIndex]) { queryIndex += 1; } } return queryIndex === normalizedQuery.length; }; const fuzzyScore = (value: string, query: string): number => { if (!query) { return 0; } const normalizedValue = value.toLocaleLowerCase(); const normalizedQuery = query.toLocaleLowerCase(); let score = 0; let queryIndex = 0; let previousMatch = -1; for ( let valueIndex = 0; valueIndex < normalizedValue.length && queryIndex < normalizedQuery.length; valueIndex += 1 ) { if (normalizedValue[valueIndex] === normalizedQuery[queryIndex]) { score += valueIndex - previousMatch - 1; previousMatch = valueIndex; queryIndex += 1; } } return score; }; interface CommandPaletteContentProps { commands: Command[]; controlId: string; label: string; maxItems: number; onClose: () => void; placeholder: string; } const CommandPaletteContent = ({ commands, controlId, label, maxItems, onClose, placeholder, }: CommandPaletteContentProps) => { const unicode = useUnicode(); const theme = useTheme(); const isScreenReaderEnabled = useIsScreenReaderEnabled(); const [query, setQuery] = useState(""); const [cursor, setCursor] = useState(0); const filtered = commands .filter((command) => fuzzyMatch(command.label, query)) .toSorted( (first, second) => fuzzyScore(first.label, query) - fuzzyScore(second.label, query) ) .slice(0, maxItems); useEffect(() => { setCursor((current) => Math.max(0, Math.min(current, filtered.length - 1))); }, [filtered.length]); const { isFocused } = useInteraction( (input, key) => { if (key.upArrow) { setCursor((current) => Math.max(0, current - 1)); return; } if (key.downArrow) { setCursor((current) => Math.max(0, Math.min(filtered.length - 1, current + 1)) ); return; } if (key.home) { setCursor(0); return; } if (key.end) { setCursor(Math.max(0, filtered.length - 1)); return; } if (key.return) { const command = filtered[cursor]; if (command && !command.disabled) { command.onSelect?.(); onClose(); } return; } if (key.backspace) { setQuery( (current) => removeGraphemeBefore(current, graphemeLength(current)).value ); setCursor(0); return; } if (key.delete || key.tab || key.ctrl || key.meta) { return; } if (input) { setQuery((current) => current + input); setCursor(0); } }, { autoFocus: true, id: controlId } ); const groups = new Map(); for (const command of filtered) { const groupCommands = groups.get(command.group) ?? []; groupCommands.push(command); groups.set(command.group, groupCommands); } const indexById = new Map( filtered.map((command, index) => [command.id, index] as const) ); return ( {""} {unicode ? "⌘ " : "> "} {query || placeholder} {isFocused && !isScreenReaderEnabled && ( {unicode ? "█" : "|"} )} {filtered.length === 0 ? ( No commands found ) : ( {[...groups.entries()].map(([group, groupCommands]) => ( {group && ( {group} )} {groupCommands.map((command) => { const index = indexById.get(command.id) ?? -1; const isCursor = index === cursor; return ( {command.label} {command.description && ( {`${unicode ? " — " : " - "}${command.description}`} )} {command.shortcut && ( {command.shortcut} )} ); })} ))} )} {unicode ? "↑↓: navigate · Enter: run · Esc: close" : "up/down: navigate - Enter: run - Esc: close"} ); }; export const CommandPalette = ({ commands, open: controlledOpen, defaultOpen = false, onOpenChange, isOpen, onClose, placeholder = "Type a command...", maxItems = 8, returnFocusId, "aria-label": ariaLabel = "Command palette", }: CommandPaletteProps) => { const generatedId = useId(); const controlId = `command-palette-${generatedId}`; const [internalOpen, setInternalOpen] = useState(defaultOpen); const open = controlledOpen ?? isOpen ?? internalOpen; const close = () => { if (controlledOpen === undefined && isOpen === undefined) { setInternalOpen(false); } onOpenChange?.(false); onClose?.(); }; if (!open) { return null; } return ( ); }; 51:["$","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"}]]}]}]]}],["$","$L52",null,{"namespace":"@termcn","registryDependencies":["https://termcn.dev/r/ink/interaction.json","https://termcn.dev/r/ink/terminal-style.json","https://termcn.dev/r/ink/terminal-text.json","https://termcn.dev/r/ink/use-theme.json","https://termcn.dev/r/ink/use-unicode.json"]}]]}],null]}],["$","$L53",null,{"files":[{"path":"registry/ui/command-palette.tsx","content":"$54","type":"registry:ui"}],"className":"h-[70svh] min-h-80"}]]}]