Examples

This page collects the strongest Foblex Flow examples for Angular so you can evaluate the library by concrete interaction patterns, not only by API reference. The examples cover node editors, workflow builders, interactive diagrams, layout helpers, and richer production-style demos.

Most teams should start with a small example, not the largest reference app. The point is to learn the core flow primitives first and add advanced features only when you actually need them.

Use this section when you want to answer one of these questions quickly:

• Can I build custom nodes and connectors with Angular templates?
• How does drag-to-connect or connection reassignment work?
• Which examples cover workflow builders, minimaps, undo/redo, and auto layout?
• What should I start from if I need a production-style editor rather than a tiny demo?

For lower-level APIs, combine these pages with the documentation. For full source code, open the GitHub repository.

How to use this section

• Start with Custom Nodes, Drag to Connect, or Get Started if you want the fastest path into the library.
• Open Reference Apps after the basics if you want complete, product-like editors.
• Open Connections and Extensions if you are comparing specific interaction features.
• Use Advanced when you need layout engines, history, larger-scene performance tools, or more complex editor behavior.

Nodes

Connectors

Connections

Extensions

Advanced

Reference Apps