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

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.

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.

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.

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

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.