Interval Input
A comprehensive row layout containing six individual numerical text input boxes representing structural time blocks, accompanied by custom visual prefix or suffix icon adornments.
- Allowing users to explicitly input precise time durations or chronological spans broken down by individual units (years, months, days, hours, minutes, seconds).
- Capturing structured interval properties within a form grid context to update backend database columns.
Disabled by default until a default_form container exists on the page. Requires a valid Data Source pairing (Element ID and Field Path) to map selection variables back to form states.
Code Field
Read-only source code with syntax highlighting, and optionally a copy button.
- Showing a stored snippet, query or payload where the highlighting and monospaced layout carry meaning.
- Displaying the SQL behind a saved report.
- Using it for ordinary prose — a Text Field or Markdown Field reads better.
- Using it where the user is meant to edit; that is a Code Input.
Use instead
Json Input
An interactive code input interface container panel outfitted with structural workspace controls to append property objects, clear array items, edit dictionary keys, and copy data configurations.
- Allowing users to interactively construct, edit, and manipulate complex hierarchical JSON datasets inside a form context.
- Providing an interface for creating dynamic structural payloads where keys can be added, nested arrays built, or values assigned on the fly.
Deactivated by default until a default_form is present on the page layout viewports. Requires establishing a connection path linking Element ID and Field Path references.
Color Field
A read-only colored rectangle block that visually reflects a specified HEX value and can optionally print that color string in its center.
- Displaying a read-only visual color rectangle based on a HEX color string or dynamic color evaluation.
- Providing quick status color blocks, palette swatch summaries, or dynamic color indicators within a dashboard layout.
- A status tile showing the color code of a company’s custom branding palette element.
- A visual reference box showing an item’s tracked category color directly from a database hex string.
- Using as an interactive color picker input where users are expected to select or modify colors inside a form, use a dedicated color input component instead of this read-only color display field.
- Writing raw color names (e.g., ‘red’, ‘blue’) or invalid color strings in the color expression textbox instead of valid Hex color format strings (e.g., ‘#FFFFFF’ or ‘#FF0000’).
- Enabling ‘Show Value’ on small container tile sizes (e.g., 1x1 grid tiles) with low Width/Height slider percentages, which causes the centered Hex text string to clip or become illegible.
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.
Markdown Input
An interactive multiline text input text box topped by a comprehensive horizontal toolbar containing visual shortcuts for H1/H2/H3 headers, bold, italic, strikeout text, hyperlinks, quotes, code text blocks, and embedded images.
- Allowing users to compose long-form prose with rich formatting tools (headers, lists, blockquotes, code blocks) inside forms.
- Gathering detailed user document descriptions, policy inputs, or technical comments that require rich shorthand markdown representations.
Deactivated by default until a parent default_form is established on the page layer. Requires explicit mapping references linking Element ID and Field Path attributes.
Custom Text Field
Text built from an expression, so the wording can change with the record or the signed-in user.
- A sentence that has to combine several values, or change wording depending on the data.
- ‘3 of 12 tasks complete’ assembled from two counts.
- Building long formatted documents in one expression — a Markdown Field keeps the content readable.
- Using it for a single unmodified column value, which a Text Field shows with less configuration.
Use instead
Number Input
An interactive numeric input box with custom formatting masks (thousand/decimal separators, custom masks) and support for persistent left/right visual adornments (icons or text).
- Capturing numeric inputs inside forms where precise mask formatting (decimal precision, custom separators, number masks) or visual adornments (icons/prefixes) are needed.
- Collecting financial, statistical, or masked numerical data that binds directly to database schema fields.
The Data Source configuration section remains deactivated until a default_form is present on the page layout. Once linked to a form via Element ID and Field Path, the input binds directly to the form’s state and schema.
Date Time Field
A read-only typography block formatting timestamps into absolute patterns or descriptive human-readable relative timelines.
- Presenting a read-only date, timestamp, or temporal string formatted cleanly for user viewports.
- Displaying historical records or future milestone markers utilizing relative time statements (e.g., ‘6 years ago’).
- ISO timestamps, Date objects, or string representations processed dynamically via custom expressions.
- Displaying a record creation timestamp as ‘dd.MM.yyyy HH:mm’.
- Rendering audit track histories using relative phrase transformations like ‘3 days ago’.
- Attempting to capture or mutate dates, use input-based date selectors instead.
- Enabling both ‘Is Relative’ and specialized absolute ‘Custom’ formats simultaneously, as relative processing completely overrides layout format specifiers.
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.
Radio Input
A single-select option group outputting a string, rendered as a list of circular radio indicators or interactive toggle buttons aligned vertically or horizontally.
- Allowing users to select exactly one option from a small, clear set of mutually exclusive choices.
- Presenting discrete categorical choices visually using classic radio indicators or segment toggle buttons.
Deactivated by default until a default_form is present on the page layout. Requires a valid Data Source connection (Element ID and Field Path) to store the selected option string.
Delete Button
A button that deletes the record it is bound to, optionally behind a confirmation dialog.
- Removing the record shown by the surrounding form, or the row it sits in inside a table body.
Needs a record to act on: either the parent form’s record, or the row it is placed in when used as a table body element.