ngx-workflow

ngx-workflow is a native Angular library designed for creating interactive node-based editors, flow charts, and diagrams. It leverages Angular Signals and OnPush change detection for high performance and reactivity, providing a comprehensive toolkit for visualizing complex workflows and data relationships.

Key Features

• Native Angular Integration — Built from the ground up for Angular, using Signals and OnPush change detection for optimal performance.
• Interactive Canvas — Supports drag-and-drop nodes, zoom and pan, edge connections, and visual alignment guides.
• Rich UI Components — Includes a minimap, properties panel, context menu, search bar, and built-in export controls for PNG, SVG, and clipboard.
• Customizable Templates — Offers fully customizable node and edge templates, theming via CSS variables, and support for custom SVG markers.
• Advanced Layouts — Provides automatic layout support via Dagre and ELK, along with snap-to-grid and collision detection.
• Robust History & Clipboard — Features undo/redo stacks, copy/paste/cut operations with localStorage persistence, and connection validation.
• Visual Effects — Includes edge animations, node motion along paths, and support for background images and patterns.

Philosophy

ngx-workflow is built with a focus on developer experience and flexibility, offering a comprehensive, out-of-the-box solution that remains highly extensible through custom components and templates.