Soenneker.Blazor.Drawflow
3.0.3
Prefix Reserved
There is a newer version of this package available.
See the version list below for details.
See the version list below for details.
dotnet add package Soenneker.Blazor.Drawflow --version 3.0.3
NuGet\Install-Package Soenneker.Blazor.Drawflow -Version 3.0.3
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="Soenneker.Blazor.Drawflow" Version="3.0.3" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
<PackageVersion Include="Soenneker.Blazor.Drawflow" Version="3.0.3" />
<PackageReference Include="Soenneker.Blazor.Drawflow" />
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package.
paket add Soenneker.Blazor.Drawflow --version 3.0.3
The NuGet Team does not provide support for this client. Please contact its maintainers for support.
#r "nuget: Soenneker.Blazor.Drawflow, 3.0.3"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
#:package Soenneker.Blazor.Drawflow@3.0.3
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package.
#addin nuget:?package=Soenneker.Blazor.Drawflow&version=3.0.3
#tool nuget:?package=Soenneker.Blazor.Drawflow&version=3.0.3
The NuGet Team does not provide support for this client. Please contact its maintainers for support.
Soenneker.Blazor.Drawflow
A lightweight Blazor wrapper for drawflow.js.
Installation
dotnet add package Soenneker.Blazor.Drawflow
Usage
<Drawflow @ref="Flow" Options="_options" OnNodeCreated="Handle" style="height:400px"></Drawflow>
@code {
private Drawflow? Flow;
private readonly DrawflowOptions _options = new();
private Task Handle(string id)
{
Console.WriteLine($"Node created {id}");
return Task.CompletedTask;
}
}
See the demo project for a working example.
Additional helpers
The component exposes many of the functions provided by drawflow.js. Some useful helpers include:
await Flow.ZoomIn();
await Flow.ZoomOut();
await Flow.AddModule("Other");
await Flow.ChangeModule("Other");
There are also methods for manipulating inputs/outputs, removing connections and clearing modules.
| Product | Versions Compatible and additional computed target framework versions. |
|---|---|
| .NET | net9.0 is compatible. net9.0-android was computed. net9.0-browser was computed. net9.0-ios was computed. net9.0-maccatalyst was computed. net9.0-macos was computed. net9.0-tvos was computed. net9.0-windows was computed. net10.0 was computed. net10.0-android was computed. net10.0-browser was computed. net10.0-ios was computed. net10.0-maccatalyst was computed. net10.0-macos was computed. net10.0-tvos was computed. net10.0-windows was computed. |
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.
-
net9.0
- Intellenum (>= 1.0.6)
- Microsoft.AspNetCore.Components.Web (>= 9.0.6)
- Soenneker.Blazor.Utils.InteropEventListener (>= 3.0.3664)
- Soenneker.Blazor.Utils.ResourceLoader (>= 3.0.1476)
- Soenneker.Extensions.List (>= 3.0.927)
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.
| Version | Downloads | Last Updated |
|---|---|---|
| 3.0.42 | 25 | 8/22/2025 |
| 3.0.41 | 97 | 8/17/2025 |
| 3.0.40 | 99 | 8/17/2025 |
| 3.0.39 | 109 | 8/15/2025 |
| 3.0.38 | 125 | 8/12/2025 |
| 3.0.37 | 121 | 8/12/2025 |
| 3.0.36 | 130 | 8/12/2025 |
| 3.0.35 | 125 | 8/12/2025 |
| 3.0.34 | 126 | 8/11/2025 |
| 3.0.33 | 130 | 8/11/2025 |
| 3.0.32 | 127 | 8/11/2025 |
| 3.0.31 | 121 | 8/11/2025 |
| 3.0.30 | 125 | 8/11/2025 |
| 3.0.29 | 206 | 8/7/2025 |
| 3.0.28 | 212 | 8/5/2025 |
| 3.0.27 | 207 | 8/5/2025 |
| 3.0.26 | 208 | 8/5/2025 |
| 3.0.25 | 209 | 8/5/2025 |
| 3.0.24 | 207 | 8/5/2025 |
| 3.0.23 | 204 | 8/5/2025 |
| 3.0.22 | 111 | 7/30/2025 |
| 3.0.21 | 441 | 7/24/2025 |
| 3.0.20 | 438 | 7/21/2025 |
| 3.0.19 | 188 | 7/20/2025 |
| 3.0.18 | 189 | 7/19/2025 |
| 3.0.17 | 22 | 7/19/2025 |
| 3.0.16 | 21 | 7/19/2025 |
| 3.0.13 | 34 | 7/18/2025 |
| 3.0.12 | 164 | 7/9/2025 |
| 3.0.11 | 136 | 7/9/2025 |
| 3.0.10 | 141 | 7/9/2025 |
| 3.0.9 | 140 | 7/9/2025 |
| 3.0.8 | 139 | 7/3/2025 |
| 3.0.7 | 136 | 7/3/2025 |
| 3.0.6 | 137 | 7/3/2025 |
| 3.0.5 | 138 | 7/1/2025 |
| 3.0.4 | 132 | 7/1/2025 |
| 3.0.3 | 137 | 7/1/2025 |
| 3.0.1 | 140 | 6/30/2025 |