Conigma Connect

Show UI

Overview

The Show UI instruction displays a user interface during flow execution. Depending on how it is configured, it can pause the flow to collect user input (synchronous) or display information while the flow continues running (asynchronous).

Getting started? See Interactive Flows for the end-to-end workflow from building a flow to sharing it with users.

Synchronous vs. Asynchronous UI

The behaviour of the Show UI instruction is determined by the output binding:

Synchronous UI (Collects Data)

When the output binding is set to a flow variable, the instruction operates synchronously:

  • The flow pauses and waits for the user to submit data.

  • The UI must contain a Submit Data button. If none is present, the flow raises an error.

  • Once the user clicks Submit, the collected data is written to the bound variable and the flow resumes.

  • The Submit button is disabled after the first successful submission to prevent duplicates.

Use cases:

  • Data-entry forms (e.g., filling in customer details, configuration values)

  • Approval workflows (e.g., accept/reject with comments)

  • Multi-step wizards where each step collects different data

Asynchronous UI (Display Only)

When the output binding is left empty, the instruction operates asynchronously:

  • The flow does not wait — it continues to the next instruction immediately.

  • No Submit Data button is required. Any Submit Data button present will be rendered as disabled since there is no data target.

  • The UI remains visible alongside the flow's execution progress until the flow completes.

Use cases:

  • Progress dashboards showing real-time status

  • Informational screens (e.g., "Your request is being processed")

  • Read-only result displays

The Component Model

The UI is defined as a JSON component tree — a hierarchy of components that describes what the user sees. Each component is identified by a "component" field in the JSON. The tree is rendered as a Fluent UI interface on the run page.

UI Rendering

Common Patterns

Pattern 1: Simple Data Collection Form

A single synchronous UI with a JSON Schema form and a Submit button. The flow pauses, the user fills in the form, and the submitted data is written to a flow variable.

Rendering...

Pattern 2: Confirmation Dialog

A synchronous UI that shows a summary and asks the user to confirm. The Submit button collects a simple acknowledgement.

Rendering...

Pattern 3: Multi-Step Wizard

Multiple Show UI instructions in sequence, each collecting different data. The wizard automatically creates a step for each one.

Rendering...

Pattern 4: Display-Only Dashboard

An asynchronous UI that shows a status dashboard while the flow continues processing in the background.

Rendering...

Pattern 5: Data Grid Selection → Flow Start

A synchronous UI where the user selects rows from a data grid, and a Flow Start button passes the selection as input to another flow.

Rendering...