📊 Riverpod Graph

A static analysis tool that visualizes dependencies between your Riverpod providers using UML-style graphs powered by Mermaid. Great for understanding complex state relationships in your Flutter app. (this tool was written in a rage filled 30 minute session after trying to debug a complex riverpod app for hours. It's probably not perfect.)

✨ Features

Visualizes ref.watch, ref.read, and ref.listen dependencies.
Detects .notifier and Provider.family(...) usage.
Displays file paths and line numbers for traceability.
Outputs a self-contained .html file with Mermaid live preview.
Works as a CLI tool or build step.

📦 Installation

You can install the package globally using the following command:

dart pub global activate riverpod_graph

Make sure $HOME/.pub-cache/bin is in your PATH so you can use riverpod_graph from the command line.

🚀 Usage

Run the tool in your project directory:

riverpod_graph

This will:

Analyze all Dart files under lib/
Detect providers and their dependencies
Output a riverpod_graph.html file in the current directory

📂 Example Output (Mermaid syntax)

graph TD
  fooProvider --> barProvider["barProvider\n(main.dart:12)"]:::watch
  uiProvider -.-> counterProvider["counterProvider\n(counter.dart:8)"]:::read

  classDef watch fill:#cce,stroke:#336,stroke-width:2px;
  classDef read  fill:#eef,stroke:#99f,stroke-dasharray: 4;

Open riverpod_graph.html in your browser to view the graph.

🔍 Graph Legend

Access Type	Arrow Symbol	Mermaid Class	Style
`ref.watch`	`-->`	`watch`	Solid edge
`ref.read`	`-.->`	`read`	Dashed edge
`ref.listen`	`==>>`	`listen`	Bold+Dashed edge
`.notifier`	Detected	—	Label includes it
`Provider.family`	Detected	—	Normal edge

📄 License

MIT License – use it freely, credit appreciated.