Built-in widget catalog
The widgets that ship in the box, grouped by job, each with the properties you can set. Bind any of them to live data like any other field.
Layout & structure
Container
Groups and lays out child widgets in a row or column. Hosts other widgets.
| Property | Label | Type |
|---|---|---|
title |
Title | String |
showWhenEmpty |
Show When Empty | Boolean |
background |
Background | color |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Stretch Spacer
Flexible gap that pushes neighbours apart, by ratio or percent.
| Property | Label | Type |
|---|---|---|
mode |
Mode | String |
ratio |
Ratio | Integer |
percent |
Percent (%) | Integer |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Fixed Spacer
A precise pixel gap between widgets.
| Property | Label | Type |
|---|---|---|
size |
Size (px) | Integer |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Image Container
Places children at absolute spots over a background image. Collapses below a set width.
| Property | Label | Type |
|---|---|---|
src |
Image | image |
alt |
Alt text | String |
fit |
Fit | String |
collapseBelow |
Collapse below (px) | Integer |
childPositions |
Child placement | child-positions |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Content & controls
Button
Runs actions and can bind a writable boolean struct (bVisible / bEnabled / bValue).
| Property | Label | Type |
|---|---|---|
label |
Label | String |
iconName |
Icon | icon |
color |
Color | color |
variant |
Style | String |
variable |
Variable | struct |
actions |
Actions | actions |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Icon
A themeable Phosphor icon at any size and colour.
| Property | Label | Type |
|---|---|---|
iconName |
Icon | icon |
size |
Size (px) | Integer |
color |
Color | color |
chrome |
Chip background | Boolean |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Status Pill
A tone-colored status pill, with an optional pulsing dot and card frame.
| Property | Label | Type |
|---|---|---|
text |
Text | String |
tone |
Tone | String |
pulse |
Pulse | Boolean |
icon |
Icon (shown when not pulsing) | icon |
framed |
Card frame | Boolean |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Image
Shows an asset with a fit mode and optional data-driven indicators.
| Property | Label | Type |
|---|---|---|
src |
Image | image |
alt |
Alt text | String |
fit |
Fit | String |
indicators |
Indicators | image-indicators |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Alarm List
Live active alarms, filterable by level, with acknowledgement.
| Property | Label | Type |
|---|---|---|
title |
Title | String |
filterLevel |
Filter Level | String |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Alarm History
The rolling log of past alarm events.
| Property | Label | Type |
|---|---|---|
title |
Title | String |
maxRows |
Max Rows | Integer |
filterLevel |
Filter Level | String |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Trend Chart
Plots recorded tag history over selectable time ranges, with zoom.
| Property | Label | Type |
|---|---|---|
variables |
Variables | String |
timeRange |
Default time range | String |
showControls |
Show zoom buttons | Boolean |
refreshInterval |
Refresh interval (s) | Integer |
colors |
Line colors | String |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Page Title
The current page's title, or your own override text.
| Property | Label | Type |
|---|---|---|
text |
Text | String |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Navigation
Page Navigator
Back / forward / up controls within a page group.
| Property | Label | Type |
|---|---|---|
groupId |
Target group | page-group |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Tab Bar
Switches between the sibling pages of a group as tabs.
| Property | Label | Type |
|---|---|---|
groupId |
Target group | page-group |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Language Switcher
Lets operators change the interface language.
| Property | Label | Type |
|---|---|---|
label |
Label | String |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Breadcrumb
The trail of pages to where you are, with optional home icon.
| Property | Label | Type |
|---|---|---|
separator |
Separator | String |
showHomeIcon |
Show home icon | Boolean |
homeLabel |
Home label | String |
homePageId |
Home page id | String |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Menu Toggle
Collapses or expands a bound menu state; swaps icon per state.
| Property | Label | Type |
|---|---|---|
bound |
Bound state | Boolean |
iconCollapsed |
Icon (collapsed) | icon |
iconExpanded |
Icon (expanded) | icon |
ariaLabel |
Aria label | String |
actions |
Actions | actions |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Navigation Menu
Sidebar or top-bar menu mirroring the page tree, with rich display options.
| Property | Label | Type |
|---|---|---|
mode |
Mode | String |
orientation |
Orientation | String |
display |
Display | String |
hierarchy |
Hierarchy | String |
submenuMode |
Submenu mode | String |
iconStrategy |
Icon strategy | String |
activeStyle |
Active style | String |
groupExpansion |
Group expansion | String |
showSearch |
Show search | Boolean |
showBadges |
Show badges | Boolean |
collapsed |
Collapsed | Boolean |
visible |
Visible | Boolean |
interactable |
Interactable | Boolean |
Beyond these you have Components (reusable page fragments with input properties) and every custom widget in the active project. They all live in the same Add-widget menu — see Building your own widgets.