📊 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.

#

✨ 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:

1. Analyze all Dart files under lib/
2. Detect providers and their dependencies
3. 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 #

📄 License #

MIT License – use it freely, credit appreciated.