Layout
In the Layout tab of the element:

- Visible on page load — uncheck
- Collapse when hidden — check
- Fit width to content — uncheck
- Fit height to content — uncheck
- Place the element on a dedicated page by itself


Setup

1. Add the W4B Flow Builder element to your page
2. Set the element properties:
  - Workflow Data — bind to the saved flow in your database
  - Integrations — bind to your saved integrations
  - Global Context — optional JSON with global variables accessible across all nodes
  - Payload — optional default payload for the Start node
  - Flow Name — display name for the current flow
  - Theme — dark or light
  - locale — pt-BR or en-US

3. Save the flow: the element exposes a state with the encrypted flow — store it in your database to reuse later


Running a Flow

Use the Run Flow (Client) or Run Flow (Server) action in any Bubble workflow.

Inputs:
- Flow Data — pass the flow state saved by the element
- Trigger Payload — JSON with the data that starts the flow, e.g. {"cep": "01310-100"}
- Global Context — JSON with global variables, e.g. {"token": "Bearer abc"}
- Integrations — pass the integrations state saved by the element

Server action outputs:
- success — yes or no
- output_json — full execution context with all saved variables
- logs_json — detailed log of every step executed
- error_message — error description, if any


Dynamic Variables

Use {{variable}} syntax in any node field to reference values at runtime:

- {{payload.field}} — data from the trigger payload
- {{context.key}} — data from the global context
- {{result.data}} — response from an API call
- {{loop.index}} — current loop iteration index
- {{my_var}} — any variable saved with a Save node


Tips

- Build and test your flow in the canvas first using the Run Flow button
- The element's flow state is always the latest saved — pass it directly to the Run actions
- Client and Server actions use the same engine — pick based on your use case
- Use the template library built into the element header to browse ready-made flow examples and get started faster