Field
The Avonni Field component displays or edits a single Salesforce record field, automatically resolving the field's label, type, and picklist values from the object metadata. Bind it to a record variable field and it renders the right input for that field's type.
Overview
Rather than hardcoding an input, the Field component reads the underlying Salesforce field and renders the appropriate control, text, number, date, checkbox, picklist, and so on, with the field's own label. The entered value is coerced to match the field type, so the value you get back is always valid for that field. Use it to build compact, metadata-driven forms where each field stays in sync with its object definition.
Adding a Field to the Canvas
The Field is the one component you will not find in the Components list of the Component Library. It is created from the Fields tab beside it, because a Field only means something once it is attached to an object field.
Open the Fields tab and it fills with the fields of the object you are working against, either the Target Object API Name set in the builder settings or a Record Variable you select at the top of the tab. With neither of those in place the tab shows Select a Record Variable to see available fields and stays empty. See Fields for both routes in full.
Drag a field from that tab onto the canvas and the builder creates the component for you, already bound to the value. Which component you get depends on the field:
A long text area becomes a Text Area.
A lookup or a relationship field becomes a Record Picker.
Every other field type becomes a Field.
Info
Polymorphic fields, such as the Who and What fields on a Task, are not listed in the Fields tab.
Configuration
To configure the Field, select it on the canvas. The Edit Field panel opens on the right with three tabs: Properties, Interactions, and Style. The sections below mirror the Properties tab.
Properties
Value binds the component to a record variable field to display. The value is coerced to match the underlying Salesforce field type (number, boolean, date, and so on).
Custom Label overrides the field label derived from the object metadata. Leave it blank to use the object's own field label.
Variant changes the appearance of the field. Options are Standard (default), Label Hidden, Label Inline, and Label Stacked.
Read Only displays the field value without allowing edits.
Edit Mode controls how editing works when the field is editable. Choose Input (default) to render a standard input, or Inline to show the value as read-only with a pencil button that activates an editable input on click. Requires Read Only = disabled.
Set Component Visibility
All components support conditional visibility, see Component Visibility.
Interactions
Interactions define what happens when users interact with the Field. Configure them from the Interactions tab of the Edit Field panel.
Change
Fires when the field value changes and passes validation. Use it to update related records, recompute other fields, or drive conditional visibility elsewhere on the page.
Styling
Configure the Field's appearance from the Style tab of the Edit Field panel.
Controls the outer spacing around the component.
Top / Right / Bottom / Left: Adjust the space on each side.
Controls the inner spacing between the component's content and its border.
Top / Right / Bottom / Left: Adjust the inner spacing on each side.
Controls the component's dimensions.
Width / Height: Set fixed dimensions.
Customizes the border surrounding the component.
Color / Size / Style / Radius: Set the border color, thickness, style, and corner rounding.
Last updated
Was this helpful?