Home

Welcome to the @foblex/flow

@foblex/flow is an Angular library designed to simplify the creation and manipulation of dynamic flow. Provides components for flows, nodes, and connections, automating node manipulation and inter-node connections.

Features

1. Node and Connection creation and manipulation.
2. Connection and Node events.
3. Reassigning Nodes and Connections.
4. Customizable Node and Connection templates.
5. Drag-and-drop support.
6. Zoom and pan support.

Getting Started and Documentation

Visit the Foblex Flow Documentation to learn how to install and use the library in your Angular project.

Installation

To add @foblex/flow to your project, run the following command:

npm install @foblex/flow

Usage

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>

Examples

Call Center

Support and Community

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.

License

This library is available for use under the MIT License.

For more information please contact our support.