Conditional Builder

The Conditional Builder widget is a powerful tool for displaying different widgets based on a set of conditions. It evaluates a series of ConditionalItem children and displays the first one whose condition evaluates to true. This is useful for creating dynamic UIs that change based on application state, user input, or other factors.

Use Cases

Use Conditional Builder when you want to:

  • Switch between loading / error / data UIs

  • Show different layouts for logged-in vs guest users

  • Change UI based on selected plan, mode, or step

  • Display different views based on app state or API response

Core Concepts

  • First Match Logic Conditions are checked in order. The first true condition wins, and its widget is shown.

  • Shared Data (Data Ref) A Data Ref is provided at the builder level and can be used by all ConditionalItems in their conditions.

  • Active View You can manually set Active View to a specific index to force showing a particular ConditionalItem (useful for debugging or previews).

Data Source

The Conditional Builder widget has a Data Ref property that can be used by the ConditionalItem children. You can input either static data or dynamic data using expressions.

Properties

Property
Description

Data Ref

A list of data that can be used by the ConditionalItem children.

Active View

The index of the ConditionalItem to display. This is useful for debugging or forcing a specific view.

Children of Conditional Builder

Children
Description

children

A list of ConditionalItem widgets. The first ConditionalItem whose condition evaluates to true will be displayed.

Default Properties

The Conditional Builder widget supports all Default Properties.

Last updated