Function AgentChecklist

cli/src/components/agent-checklist.tsx:126–350

({
  allAgents,
  filteredAgents,
  selectedIds,
  searchQuery,
  focusedIndex,
  onToggleAgent,
  onFocusChange,
  agentDefinitions,
  maxHeight = 8,
})

}

export const AgentChecklist: React.FC<AgentChecklistProps> = ({
  allAgents,
  filteredAgents,
  selectedIds,
  searchQuery,
  focusedIndex,
  onToggleAgent,
  onFocusChange,
  agentDefinitions,
  maxHeight = 8,
}) => {
  const theme = useTheme()
  const scrollRef = useRef<ScrollBoxRenderable | null>(null)
  const [hoveredIndex, setHoveredIndex] = useState<number | null>(null)
  const [expandedAgentIds, setExpandedAgentIds] = useState<Set<string>>(new Set())
  const [hoveredSubagentLink, setHoveredSubagentLink] = useState<string | null>(null)

  // Precompute local agent IDs for dependency calculations
  const localAgentIds = useMemo(() => new Set(allAgents.map((a) => a.id)), [allAgents])

  // Calculate dependency count for each agent
  const dependencyCounts = useMemo(() => {
    const counts = new Map<string, number>()
    for (const agent of allAgents) {
      const count = countDependencies(agent.id, agentDefinitions, localAgentIds, new Set())
      counts.set(agent.id, count)
    }
    return counts
  }, [allAgents, agentDefinitions, localAgentIds])

  // Toggle expansion of an agent's dependencies
  const toggleExpanded = (agentId: string) => {
    setExpandedAgentIds((prev) => {
      const next = new Set(prev)
      if (next.has(agentId)) {
        next.delete(agentId)
      } else {
        next.add(agentId)
      }
      return next
    })
  }

  // Scroll focused item into view when focus changes via keyboard
  useEffect(() => {
    const scrollbox = scrollRef.current
    if (!scrollbox || filteredAgents.length === 0) return

    // Calculate approximate position of focused item (1 line per item)
    const itemHeight = 1
    const focusedTop = focusedIndex * itemHeight
    const focusedBottom = focusedTop + itemHeight

    const viewportHeight = scrollbox.viewport.height
    const currentScroll = scrollbox.scrollTop

    // Scroll up if focused item is above viewport
    if (focusedTop < currentScroll) {