Building with group blocks

Overview

Group blocks help with building experiences that require strict relationships between steps (e.g. completing steps sequentially), specific intent methods to move between steps (e.g. prev() or goTo()), or access to collective step data (e.g. how many steps have been completed).

This guide will show you how to use group blocks in the flow builder.

Creating a group

Create a group by dragging a group block from the block palette onto the canvas. This will add a new group to the flow with three step blocks inside.

Connecting a group

Drawing paths to and from a group works just like other blocks.

To create a path from the group to another block, select the group and then drag a path from the arrow icon to the block you want to connect to.

To create a path from another block to the group, select the block and then drag a path from the arrow icon to the group.

Deleting a group

Delete a group by selecting the group and pressing ⌫ Backspace. Alternatively, you can access the Delete menu item from the more menu in the group panel.

caution

Deleting a group will also delete all steps within the group. This action can’t be undone.

Adding steps

There are a few ways to add steps to a group:

• Click the + (plus) icon in the group
• Drag a new step block from the block pallette into the group
• Drag an existing step block on the canvas into the group

info

Moving a step block that is already on the canvas into a group will remove any paths connecting to that step block.

Reordering steps

Reorder steps within a group by dragging the step up or down to its new desired position.

Removing steps

Remove a step from a group by dragging the step out of the group and onto the canvas.

Alternatively, you can delete a step completely to remove it from the group.

Developing with groups

Access to group specific data and intents are available via Dopt SDKs. Learn more →