What you'll find here

You'll learn how to create your own workflow element from scratch.

How to create an element

In this section, we'll walk you through all the steps needed to create a new workflow element. The existing elements are Action, Condition, Switch, and Loop. You'll be adding a new one called Parallel, which represents actions that can be executed simultaneously.

All the steps we'll follow are listed below:

• System element: Add the new element type to the model layer.
• System widget: Add the corresponding element widget types.
• System failure: Define the failure type for errors the element can produce.
• System element changes: Create the types for the element's changes.
• System element utils: Implement utility functions related to the element.
• Apply system changes: Add the logic to apply element changes to the workflow.
• Element view: Create the function that renders the element visually.
• Element drag view: Create the render function for the element during drag.
• Widget view: Implement the function that renders the active element widget.
• Controller: Create the logic that maps node-level changes to workflow-level updates.
• Controller utils: Update controller utilities to support the new element.
• Element error detection: Implement logic to detect errors within the new element.
• Element to JSON: Add support for serializing the element into JSON format.

You can view the final implementation on the following page.