TaskGraph

A live view of a task plan: one row per task with a status marker ([ ] pending, [>] running, [x] done, [!] failed), its description, the tasks it waits on, and progress.

Import: package:fleury/fleury.dart, or package:fleury/fleury_core.dart in browser code.

Usage

const TaskGraph(
  nodes: <TaskGraphNode>[
    TaskGraphNode(
      id: '1',
      title: 'Inspect CLI',
      status: TaskGraphStatus.succeeded,
    ),
    TaskGraphNode(
      id: '2',
      title: 'Handle --version',
      status: TaskGraphStatus.running,
    ),
    TaskGraphNode(
      id: '3',
      title: 'Add a test',
      status: TaskGraphStatus.pending,
    ),
  ],
)

Details

Up and Down move the selected task; PageUp, PageDown, Home, and End jump; clicking a task selects it. Ctrl+C copies the selected task. When you pass a new nodes list mid-run, the selection stays on the task with the same id.

Constructors

TaskGraph()

Parameter	Type	Default	Description
nodes:	List<TaskGraphNode>	required	Source task nodes to display and copy.
controller:	TaskGraphController?	—	External selection and visible-range controller.
focusNode:	FocusNode?	—	Focus node used for keyboard navigation.
autofocus:	bool	false	Whether the graph should request focus when mounted.
semanticLabel:	String	'Task graph'	Semantic label (the accessibility name; not rendered) for the task graph.
copySelection:	bool	true	Whether Ctrl+C (and the semantic copy action) copies the selected task.
copyOptions:	TaskGraphCopyOptions	const TaskGraphCopyOptions()	Clipboard/export options for selected-task copy.
onCopy:	void Function(TaskGraphCopyResult result)?	—	Called after a copy attempt completes.

Source

TaskGraph is defined in packages/fleury/lib/src/catalog/task_graph.dart.

Category: Agent surfaces · All widgets

Live demo

taskgraph_example.dart

Restart Run Expand

Example · editable Revert Format

Widget example() => const TaskGraph(
  nodes: <TaskGraphNode>[
    TaskGraphNode(
      id: '1',
      title: 'Inspect CLI',
      status: TaskGraphStatus.succeeded,
    ),
    TaskGraphNode(
      id: '2',
      title: 'Handle --version',
      status: TaskGraphStatus.running,
    ),
    TaskGraphNode(
      id: '3',
      title: 'Add a test',
      status: TaskGraphStatus.pending,
    ),
  ],
);

Live preview

Live

ⓘ how this demo runs ⛶ Expand