
▲ 39 r/Blazor
I'm working on Flowy.Blazor v2
I'm working on Flowy.Blazor v2
v1 shipped as a hierarchical tree visualizer (drag & drop, auto-layout, zoom/pan, JSON import/export, custom node templates). v2 turns it into a proper visual editor — way bigger scope than I expected.
New in v2 (not in v1):
Canvas & navigation
- Free canvas mode alongside tree mode (multi-root, manual positioning)
- Programmatic viewport —
FitViewAsync,SetViewportAsync(animated),GetViewportAsync - Fit to subset — fit the view to a specific set of item IDs
- Pan boundaries (translateExtent) and min/max zoom clamps
- Auto-pan when dragging near canvas edges (configurable speed + threshold)
- Coordinate helpers —
ScreenToFlowPositionAsync/FlowToScreenPositionAsync
Selection & editing
- Marquee selection — shift-drag to box-select
- Ctrl-click multi-select
- Programmatic selection API —
SelectItemAsync,SelectItemsAsync,ClearSelectionAsync,RemoveSelectedAsync - Undo / Redo with configurable history depth
- Bulk mutations —
DeleteItemsAsync, read-only queries (AllItems,Roots,GetChildren, etc.) - Promote / demote items in the tree, with
OnTreeRestructuredevent - Manual layout — drop items at custom positions,
OnItemRepositionedevent - Snap to grid (configurable X/Y)
Edges
- Edge markers — arrow heads on start/end with multiple variants
- Edge styling — stroke width, dash patterns, animated dashes
- Edge labels with animation support
Drag & drop
- Configurable drag threshold
- Drop position bands (left/right/under)
- Drop validation — reject by depth, position, custom rules, with
ValidationMessage - Cross-canvas dragging via a drag registry — move items between separate canvases
NoDragclass to opt subtrees out of dragging
Events
- Pane events:
OnPaneClick,OnPaneContextMenu,OnItemContextMenu - Hover events:
OnItemMouseEnter/Leave/Move - Drag event log, drop events, tree restructure, error events
Other
- Configurable keyboard bindings — every key (delete, undo, redo, pan/zoom activation, selection modifiers) is overridable; full disable supported
- SVG export with options
- Light/dark theming with token overrides
- Background variants (slot + overlay) you can switch live
- Minimap
- Customizable toolbox palette
Small UX wins too: toolbar hides while dragging, smoother layout animations (JS-driven transforms), order map preserved across JSON round-trips.
u/VenniCidi — 7 days ago