Operations Builder

The Operations Builder is an event-handler system available in Vega runtime modules. It lets Creators attach one or more operations to a component event without using a separate logic component. Common uses include setting a field value when a component loads or making an API call when a Button component is clicked.

The Operations Builder displays in the component settings panel when a component is placed in a Vega module or a Vega-enabled Panel component. Not every component supports every event. See Event Compatibility below.

Events

An event is an action or condition that triggers the Operations Builder to run. When the event occurs, the operations assigned to it execute in order.

Event	Description
On Initialize	Occurs when a component loads, including components that are hidden. Fires on both page load and Dynamic Refresh.
On New Submission	Occurs when the page loads without an existing submission ID. Similar to the Initializer component's New Submission trigger.
On Edit Submission	Occurs when the page loads with an existing submission ID. Similar to the Initializer component's Edit Submission trigger.
On Click	Occurs when a Creator clicks the component. Not recommended for non-focusable elements.
On Change	Occurs when the component's value changes and the end-user commits the change.
On Focus	Occurs when the component receives focus.
On Blur	Occurs when the component loses focus.
On Mouse Enter	Occurs when the mouse cursor moves over the component.
On Mouse Leave	Occurs when the mouse cursor moves off the component.
On Execute	Occurs when the component is triggered using the Execute operation or the `trigger` output type from a logic component.

Event Compatibility

Not all events are compatible with all components. The table below shows event support for the components that use the Operations Builder most commonly.

Component	On Initialize	On New	On Edit Submission	On Click	On Change	On Focus	On Blur	On Execute
Text Field	✓	✓	✓	✓	✓	✓	✓	✓
Text Area	✓	✓	✓	✓	✓	✓	✓	✓
Number	✓	✓	✓	✓	✓	✓	✓	✓
Email	✓	✓	✓	✓	✓	✓	✓	✓
Phone Number	✓	✓	✓	✓	✓	✓	✓	✓
Date Input	✓	✓	✓	✓	Limited	✓	✓	✓
Dropdown	✓	✓	✓	✓	✓	✓	✓	Limited
Radio Buttons	✓	✓	✓	✓	✓	✓	✓	✓
Checkboxes	✓	✓	✓	✓	✓	✓	✓	✓
Simple Select	✓	✓	✓	✓	Limited	✓	✓	✓
Search Select	✓	✓	✓	✓	Limited	✓	✓	✓
Button	✓	✓	✓	✓	—	✓	✓	✓
Panel	✓	✓	✓	✓	✓	✓	✓	✓
Columns	✓	✓	✓	✓	✓	✓	✓	✓
Field Group	✓	✓	✓	✓	✓	✓	✓	✓
Hidden	✓	✓	✓	—	—	—	—	✓
HTML Element	✓	✓	✓	✓	—	—	—	✓
Image	✓	✓	✓	✓	—	—	—	✓
iFrame	✓	✓	✓	Limited	Limited	Limited	Limited	✓
Initializer	✓	✓	✓	✓	✓	✓	✓	✓
Timer	✓	✓	✓	✓	—	—	—	✓
File	✓	✓	✓	✓	✓	✓	✓	✓

Limited: The event is available but might have restricted behavior for this component. —: The event is not supported for this component.

Event Scopes

Each event handler has an Event Scopes setting that controls which component context the event targets. Select one or more scopes from the following:

Scope	Description
Self	The event fires for the component itself.
Child	The event fires for child components nested in the component.

At least one scope is required. The available scopes vary by signal type. Some signals are self-only and do not offer the Child option.

Should Execute

Each operation has a Should Execute setting that controls whether the operation runs when its event fires. This is a conditional gate on individual operations in an event handler.

Mode	Description
Boolean	A toggle. When set to ON, the operation always runs. When set to OFF, the operation is skipped. Default is ON.
String	A static string value evaluated as a condition at runtime.
Dynamic	A `$syntax` expression resolved at runtime. Use this to make execution conditional on component values or other runtime state.

Stability Tags

Operations and events display a stability badge when they are not yet fully stable. No badge means the operation is stable and production-ready. Stability badges are synced from the runtime manifest and reflect the current stability state of each operation in the active runtime.

Badge	Meaning
beta	Available for general use but subject to change.
alpha	Early access. Behavior might change significantly. Requires a feature flag to be enabled.
deprecated	Being phased out. Avoid using in new configurations.

Stable operations display no badge.

Operations

An operation is an action that executes when an event fires. Each event handler can contain multiple operations that run in order. The following categories summarize the available operations.

Properties

Operation	Description
Set Property	Sets a property on a target component, like `value`, `hidden`, or `disabled`. The Target key, Property, and Value fields each include a type selector (string, number, or boolean) for specifying the value type.
Get Property	Reads a property from a target component and stores it for use in subsequent operations.
Clear	Clears the value of a target component.

Validation

Operation	Description
Validate	Triggers validation on a target component.
Validate Module	Triggers validation across the entire module.
Set Validation Rule	Dynamically sets a validation rule on a target component.
Clear Validation Errors	Clears all validation errors on a target component.

Display and Styling

Operation	Description
Set Modal	Opens or closes a Panel component configured as a modal.
Set Popup Alert	Displays a pop-up alert message to the end-user.
Set Component State	Sets the state of a target component.
Set Spinner	Shows or hides a loading spinner on a target component.
Focus	Moves focus to a target component.
Scroll To	Scrolls the page to bring a target component into view.
Set Styling	Applies inline CSS styling to a component.
Append Styling	Adds a CSS class to a component.
Clear Styling	Removes a CSS class from a component.
Toggle Class on Target	Toggles a CSS class on a component.

Operation	Description
Navigation	Navigates to a specified page or route.
Open New Page	Opens a URL in a new browser tab.
Workflow Navigate	Navigates forward or backward in a Workflow application.

Persisted Data

Operation	Description
Set Persisted Data	Writes a value to browser local storage.
Read Persisted Data	Reads a value from browser local storage.
Delete Persisted Data	Removes a value from browser local storage.

Module

Operation	Description
Load Module	Dynamically loads a module into a Panel component with Dynamic Refresh enabled.
Download File	Downloads a file to the end-user's device.
Emit Event	Dispatches a custom event that other components in the module can handle.

Network

Operation	Description
API Call	Makes an HTTP request to an external or internal API endpoint. Supports configurable headers, body, retry logic, and timeout.
Data Workflow	Executes a Data Workflow operation from in an event handler.

Control Flow

Operation	Description
If	Conditionally executes a branch of operations based on an expression.
Try Catch	Executes operations and routes to a catch branch if an error occurs.
Async All Settled	Executes multiple operation branches in parallel and continues after all complete.

Lifecycle

Operation	Description
Execute	Triggers an On Execute event on a target component.
Submit	Submits the module's current .
Reset	Resets the module to its initial state.

Changelog

Date	Change
2026-06-09	Initial publication.
2026-06-29	Added typed value type selectors to Set Property; added stability runtime sync note (UQE-13522 follow-up, #7595).
2026-06-25	Added Event Scopes, Should Execute, and Stability Tags sections (UQE-13522).
2026-06-15	Added 7 missing operations from source: Clear Validation Errors, Scroll To, Set Popup Alert, Set Component State, Download File, Emit Event, Data Workflow.