---
title: "Operations Builder"
slug: "operations-builder"
tags: ["module-builder"]
status: "update"
updated: 2026-10-19T16:56:03Z
published: 2026-10-19T16:56:03Z
canonical: "docs.unqork.io/operations-builder"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.unqork.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Operations Builder

The Operations Builder is an event-handler system available in [Vega runtime](/unqorkai/docs/centauri-and-vega-runtimes) 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](/unqorkai/docs/operations-builder#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 an end-user 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 Submission | On Edit Submission | On Click | On Change | On Focus | On Blur | On Mouse Enter | On Mouse Leave | On Execute |
| --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
| Text Field | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| Text Area | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| Number | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| Email | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| Phone Number | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| Date | ✓ | ✓ | ✓ | ✓ | 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 that runs the operation when set to **ON** and skips it when set to **OFF**. Default is ON. |
| **String** | A static string value evaluated as a condition at runtime. |
| **Dynamic** | A `$syntax` expression resolved at runtime, for conditions based 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. |

## 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. |
| Toggle | Toggles a boolean property on a target component between true and false. |

### 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. |

### Navigation

| 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 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. |
| Execute External Command | Sends a command to an external host application. |
| Submit | Submits the module's current submission data. |
| Reset | Resets the module to its initial state. |

---

**Changelog**

| Date | Change |
| --- | --- |
| 2026-06-09 | Initial publication. |
| 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. |
| 2026-06-25 | Added Event Scopes, Should Execute, and Stability Tags sections. |
| 2026-06-29 | Added typed value type selectors to Set Property and a stability runtime sync note. |
| 2026-10-15 | Fixed a typo in the Data Workflow operation description, corrected the On Click description to say end-user, added the Toggle and Execute External Command operations and the On Mouse Enter and On Mouse Leave events, corrected the event support for Checkboxes, File, and Initializer, and removed a repeated sentence. |

Also known as Unqork Users, or Designer Users; is anyone who is inside the Unqork platform.

APIs (application programming interfaces) are a set of protocols and definitions developers use to build and integrate application software. APIs act as the connective tissue between products and services.

The Vega (v 2.0.0) runtime is the next-generation engine of the UDesigner platform. Vega uses cutting-edge technologies to improve the Creator and end-user experience.

The component fires when the page or called module loads without an existing submission ID. Dashboards and remote execute modules are great uses for this trigger.

Enter the Property ID of the component that you want to trigger on each button-click.

End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product.

Elements are are what you use to build Unqork applications. Elements include modules, workflows, Data Collections, Data Schema, and Record Collections.

The Number data type accepts integer or floating point values. The number data type does not use quotes around numerical values.

HTML (Hyper Text Markup Language) is the standard markup language for for achieving font, color, graphic, and hyperlink effects when creating web pages.

The Boolean data type accepts one of two values: true, or, false.

A string is an object that represents a sequence of characters. Strings typically hold data represented in text form.

A functionality of a software. For example, Copy and Paste is a feature of a computer's operating system.

A JavaScript property is a member of an object that associates a key with a value. A JavaScript object is a data structure that stores a collection of properties.

A modal is a window that appears on top of the content you are currently viewing.

Focus indicates the element of the graphical user interface which is currently selected to receive input. Elements with focus sometimes have an accesibility border highlighted around them.

Cascading Style Sheets (CSS) is a style sheet language used for presenting how a HTML or XML document looks to end-users.

A URL (uniform resource locator) is a unique identifier used to locate a resource on the internet. Also known as a web address.

End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product.

HTTP (Hypertext Transfer Protocol) is an application-layer protocol used to transmit hypermedia documents like HTML.

An API endpoint is the location where an API receives requests for a specific resource on its server. It's the point of contact between an API client and an API server, and is usually a uniform resource locator (URL) that provides the location of the resource.