Foblex Flow is an Angular library designed to simplify the creation and manipulation of dynamic flows. It provides components for flows, nodes, and connections, automating node manipulation and inter-node connections.
-
Call Center - A simple example of a call center flow.
-
Scheme Editor - A more complex example of a scheme editor.
- Node and Connection creation and manipulation.
- Connection and Node events.
- Reassigning Nodes and Connections.
- Customizable Node and Connection templates.
- Drag-and-drop support.
- Zoom and pan support.
Visit our Documentation to learn how to install and use the library in your Angular project.
To add Foblex Flow to your project, run the following command:
npm install @foblex/flow
Example:
<f-flow fDraggable>
<f-canvas>
<f-connection fOutputId="output1" fInputId="input1"></f-connection>
<div fNode fDragHandle [fNodePosition]="{ x: 24, y: 24 }" fNodeOutput fOutputId="output1" fOutputConnectableSide="right"> Drag me</div>
<div fNode fDragHandle [fNodePosition]="{ x: 244, y: 24 }" fNodeInput fInputId="input1" fInputConnectableSide="left"> Drag me</div>
</f-canvas>
</f-flow>
For questions, feedback, and support, visit the Foblex Portal to connect with the community and the development team. You can also report issues and request features on the GitHub repository.
This library is available for use under the MIT License.
For more information please contact our support.