Icon
A standalone display vector glyph rendered from a catalog dropdown or custom expression text path, supporting multi-scale scaling boundaries.
- Adding supporting graphic iconography to visually distinguish layout categories or metrics headers.
- Rendering platform-supported glyph indicators or custom icon expressions within dashboard grids.
- Static branding vectors or state flags evaluated dynamically via text box expression workflows.
- A 1x1 summary card status indicator rendering a warning symbol based on error flag calculations.
- An information icon badge aligned inside a visual dashboard heading panel tracking help references.
- Sizing the bounding canvas larger than a 2x2 grid blueprint area, which misuses structural row tracking grids and forces unnecessary white space.
- Using an independent icon layout block as a standalone interactive link component without descriptive anchor titles.
Configure these in the Application Designer property panel. Group headings mirror the editor where possible. Data Source is where the element gets its rows or field binding (a view/query, a connector operation, or a parent form field). References appear only for view-backed sources and map foreign-key ID columns to readable labels from another view.
Internal Link Button
A styleable navigation layout link or button component designed strictly for routing internally between local workspace page templates.
- Navigating users cleanly between different pages or routing dashboards inside the current application workspace environment.
- Providing simple routing triggers (e.g., standard ‘Back to List’ cancel paths or detail page redirects) without triggering secondary transactional database operations.
- A ‘Cancel’ secondary action button nested within a form layout that returns the user safely to the main dashboard directory.
- A compact icon-only navigation shortcut placed inside a data grid header routing users straight to a detailed analytics overview tab.
- Navigating to third-party web portals or external addresses outside the current platform domain, use the external_link_field instead.
- Configuring complex multi-step mutation procedures or API transactions directly on this element, use default_call_button or action_button instead.
- Allocating visual footprints taller than 1 grid row unit high, which breaks visual layout conventions.
Use instead
Internal Link Field
A data-aware detective anchor hyperlink that looks like standard underlined body text by default, pulling specific row criteria parameters to compute dynamic page transfers.
- Navigating users dynamically to specific record detail views by extracting unique row variables from the current screen context (e.g., clicking a specific product row to go to its unique page).
- Building smart, data-aware text links inside tables, list rows, or informational cards that require identifier parameter interpolation.
Requires binding a relational query name source, choosing the underlying primary target identifier column, and passing an active evaluation expression to capture runtime row values.
Default Interval Field
A read-only single row duration string that outputs individual segmented time measurements separated by unit letters based on configuration toggles.
- Displaying specific time durations or elapsed period chunks (e.g., ‘3y, 5m, 3d’) cleanly in the interface.
- Rendering structured ISO 8601 duration intervals parsed from technical database columns into human-readable segmented blocks.
Accepts a raw ISO 8601 interval duration text string (e.g., ‘P3Y5M3DT3H3M3S’) or an expressional codebase script returning equivalent data logs. Alternatively can be hardcoded manually using individual numeric inputs across six chronological time parameter buckets.
Json Field
A read-only interactive code viewer tree containing collapsible object nesting hierarchies and visual type-specific markers.
- Presenting structured data payloads, complex nested records, or configuration logs in a clean, expandable tree structure.
- Providing developers or administrative users with readable debugging viewports that indicate property data types (string, number, boolean) explicitly.
Sourced strictly through custom expressions capable of invoking direct structural data objects, dynamic API queries, or active field value references.
Label Field
A short static caption, used to title a group of elements that have no heading of their own.
- Naming a section of a form or a block inside a Grid.
- A ‘Shipping address’ caption above an address block.
- Using it to label a single input — inputs carry their own label, and a second one is read twice by screen readers.
- Using it for values that change; it holds fixed text.
Use instead
List
A scrollable stack of repeated row cards (each built from one shared grid template), with optional row selection and a pagination footer.
- Browse many records as custom row cards — each row is a grid layout you design, not fixed columns.
- Build a selectable list that drives a detail panel, form, or chart from
elements.<listId>.selected. - Show compact work queues, catalogs, or pickers where a freeform row layout beats a dense table.
Requires a Data Source view/query name. Set Identifier Name whenever selection or per-row actions must address a specific record. Build the visual layout inside the single row → default_grid template.
Modal Dialog
A launcher button that opens an overlay with a title and close control.
- Open a secondary flow (edit dialog, confirmation, wizard step) without leaving the current page.
- Show a form, chart, or summary in an overlay launched from a button.
- A layout container for nested forms, charts, or confirmation content.
- A button that opens a medium dialog to edit related sub-form fields.
- An icon-only button that opens a full-screen analytics overlay.
- Nesting modals inside modals, which confuses focus and navigation.
Configure these in the Application Designer property panel. Group headings mirror the editor where possible. Data Source is where the element gets its rows or field binding (a view/query, a connector operation, or a parent form field). References appear only for view-backed sources and map foreign-key ID columns to readable labels from another view.
Number Field
A compact, read-only numerical data text block that displays formatted integers or decimals alongside units, percentages, custom currency markings, and contextual error accent highlights.
- Displaying a read-only numeric value, score, index, metric, or currency value within user interfaces.
- Rendering financial tracking fields or statistical values that require explicit prefix/suffix symbols (e.g. £, €) or dynamic highlight gating for losses.
- A dashboard tile rendering a database revenue cell formatted with a currency prefix and bold red styling triggered on negative margins.
- Displaying a precise fractional calculation summary clamped cleanly via decimal precision configurations.
- Using to capture user numerical entries, use a form-bound number input control element instead.
- Allocating massive grid canvas dimensions, keep this small indicator element sized to 1 row tall and 1 or 2 columns broad.
Configure these in the Application Designer property panel. Group headings mirror the editor where possible. Data Source is where the element gets its rows or field binding (a view/query, a connector operation, or a parent form field). References appear only for view-backed sources and map foreign-key ID columns to readable labels from another view.
Procedure Button
A button that calls a database function or procedure directly, for work that belongs in the database rather than in the page.
- Triggering server-side logic that would be wrong to express as a sequence of page actions — a batch recalculation or a state transition with its own rules.
The function must exist in the database and be callable by the signed-in user’s role; arguments are supplied from the page.