Tree
The Avonni Tree presents hierarchical data in a user-friendly, expandable/collapsible tree for easy navigation.
Tutorials
Interactive tree shows account details, dynamically updating on selection.
Configuring the Tree
Data Source
Before using the List, you must decide where the data will come from. The Data Source setting determines how the list is created and what it displays.
For a predefined set of items that don’t require dynamic updates.
Ideal for static content or rapid setup with specific items.
Displaying a list of options defined in a Salesforce picklist.
Best for presenting a list of predefined options for selection.
Fetching data based on a specific query, pulling various records or data points.
Ideal for complex data retrieval or when sourcing. Using a 'Get Records' collection is not necessary with this method, as the query itself is powerful enough to simplify your flow
Data Mappings
When using a dynamic data source like 'Query' or 'Picklist' for your Avonni Tree, the Data Mappings section becomes crucial. It bridges your Salesforce data and the tree structure, accurately representing your hierarchical data.
Why are Data Mappings Important for Avonni Tree?
Without data mappings, the Avonni Tree wouldn't understand how to organize your data into parent-child relationships. This could lead to a disorganized or flat tree structure, failing to convey the intended hierarchy.
How Do Data Mappings Work for Avonni Tree?
In the Data Mappings section, you'll define the connection between your Salesforce fields and the corresponding Avonni Tree attributes. This involves specifying:
Parent Item Label: Choose the field that will be used as the name for the main items in your tree (e.g., "Account Name" if your tree is based on Accounts).
Other Attributes: You can also connect other fields to additional features in the Avonni Tree, like "Metatext" (extra information displayed next to an item)
Adding Related Items to Your Tree (Optional)
You can also display items related to the main items in your tree. To do this:
Add an Item: Click the "Add Item" button.
Choose the Child Object: Select the object's name that contains the related items you want to show (e.g., "Contact" if you will show contacts related to each account).
Select the Relationship Field: Choose the field that connects the child object to the parent object (e.g., "AccountId" on the Contact object).
Map the Data: Tell the Avonni Tree how to display the information for the related items, just like you did for the main items.
By establishing these mappings, you ensure that each item in the Avonni Tree accurately displays the correct information from your Salesforce data and that the hierarchical structure reflects the relationships defined in your data model.
Other Options
Header
The text at the top of the tree serves as a title or label for the data.
Is Multi Select
Enables users to select multiple items within the tree.
Independent Multi Select
Allows multiple selections across different levels or branches of the tree without affecting selections in other areas.
Show Item Count
Displays the number of child items next to each parent item in the tree.
Interactions
The Tree supports one interaction event: On Item Click. It fires when a user clicks on any item in the tree — whether it's a parent node or a child node.
Open the Interactions tab in the Component Builder to configure what happens when an item is clicked.
On Item Click
This event fires when the user clicks on a tree item. The clicked item's data (record, name, and object API name) becomes available as output variables for use in subsequent flow elements.
Flow Navigation
Moves to the next screen
To navigate to a detail screen showing the clicked item's full record
Open Flow Dialog
Opens a sub-flow in a modal
To display record details or an edit form in a popup without leaving the tree screen
Show Toast
Displays a confirmation message
To confirm the selection (e.g., "Department selected: Marketing")
Navigate
Redirects to a Salesforce page
To open the clicked record's detail page directly in Salesforce
Update Records
Saves data to Salesforce
To update the clicked record immediately (e.g., mark a category as "Reviewed")
Accessing the clicked item in your flow
After the screen, three output variables are available on the Tree component:
Clicked Item — the full Salesforce record the user clicked
Clicked Item Name — the name of the clicked item
Clicked Item SObject Api Name — the API name of the object (useful when the tree mixes multiple object types, like Accounts and Contacts)
Accessing selected items (multi-select)
If Is Multi Select is enabled, the Tree also exposes Selected Items (record collection) and Selected Item Names (text collection) to retrieve all items the user checked.
Output Variables
The Tree exposes several output variables you can reference in your flow after the screen. To use them, select the screen element in Flow Builder, then the Tree component, and pick the output variable you need.
Item Selection
When users select items in the Tree (with multi-select enabled), these variables update automatically.
Selected Items
Record Collection (SObject[])
All currently selected items as a collection of Salesforce records. Use this to loop through selected records in a subsequent flow element.
Selected Item Names
Text Collection (String[])
The names of all selected items, as a list of strings.
Example: A user selects multiple categories in an Account hierarchy tree. Use a Loop element to iterate through Selected Items and create related records for each selected node.
Item Clicks
When users click on a tree item, these variables tell you which item was clicked.
Clicked Item
Record (SObject)
The full Salesforce record of the tree item the user clicked.
Clicked Item Name
Text (String)
The name of the clicked item.
Clicked Item SObject Api Name
Text (String)
The API name of the Salesforce object associated with the clicked item. Useful when the tree contains items from multiple object types and you need to route logic accordingly.
Example: A user clicks on a department in an org chart tree. Use Clicked Item to display the department's details, and Clicked Item SObject Api Name to determine if the clicked node is a Department or a Team record.
Component Metadata
Number of Items
Integer
The total number of items currently loaded in the tree. Useful for displaying a count or making decisions when the tree is empty.
Last updated
Was this helpful?