Creating a List Configurator Manually

🔸 Creating the Component Directly

In addition to creating a tab through the builder, you can add the list configurator anywhere using the Aura Component <SBLS:ListConfigurator />.

<aura:component >
    <SBLS:ListConfigurator configurationid="{BUILDER_RECORD_ID}" />
</aura:component>

---

🔸 Aura Component Attributes

Attribute	Description
configurationId	The record ID of the builder.
height	The height of the configurator (unit: px). The default value is 500px.
parentFieldApiName	When adding the configurator as a related list on a record page, specify the API name of the field that references the list configurator object from the record page object.
recordId	When adding the configurator as a related list on a record page, set this to the record ID of the record page object.
hideFilters	Hides the configured filters.
filters	Use the filters attribute to set default filter conditions for the list. This attribute accepts filter values in a JSON array format, and the specified conditions will be automatically applied when the list is loaded.

---

🔸 Example: Creating a Component

Creating a Component for a Tab

If your organization or profile has IP restrictions, you may not be able to use the builder’s tab creation feature. In such cases, you need to create a tab manually by writing an Aura Component.

<aura:component implements="force:appHostable">
    <SBLS:ListConfigurator configurationid="{BUILDER_RECORD_ID}" height="null" />
</aura:component>

When manually creating a tab with a component, set the height attribute to null.

This allows the list configurator to automatically adjust its height within the tab for optimal display.

Manually Creating a Component for a Related List

If you want to embed a list configurator for Opportunity Products (OpportunityLineItem) on an Opportunity (Opportunity) record page, you can create an Aura Component as follows:

<aura:component implements="force:hasRecordId">
    <SBLS:ListConfigurator 
        configurationid="{BUILDER_RECORD_ID}"
        parentFieldApiName="OpportunityId"
        recordId="{!v.recordId}" />
</aura:component>

Passing Filter Values

Let’s say you have an Aura Component named OpportunityProductList.cmp that displays a list of Opportunity Products:

OpportunityProductList.cmp

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId">
    <SBLS:ListConfigurator 
        configurationId="{Builder_Record_ID}"
        parentFieldApiName="OpportunityId"
        recordId="{!v.recordId}" />
</aura:component>

OpportunityProductList.cmp

Assume the Opportunity Product list has the following filters:

• ProductCode: contains ‘CLOUD’

• Quantity: greater than 1

• ServiceDate: between 2025-06-01 and 2025-12-31

To apply these default values, modify the component like this:

OpportunityProductList.cmp

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId">
    <aura:attribute name="filters" type="Object" />
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <SBLS:ListConfigurator 
        configurationId="{Builder_Record_ID}"
        parentFieldApiName="OpportunityId"
        recordId="{!v.recordId}"
        filters="{!v.filters}" />
</aura:component>

• The filters attribute is used to set default filter conditions for the list.

• It accepts a JSON array and the specified filters will be automatically applied when the list loads.

• The <aura:handler name="init" /> tag is used to initialize the filter values when the component loads.

Controller example (OpportunityProductListController.js):

OpportunityProductListController.js

({
    doInit : function(component, event, helper) {
        component.set("v.filters", [
            {
                fieldApiName: 'ProductCode',
                value: 'CLOUD'
            },
            {
                fieldApiName: 'Quantity',
                value: 1,
                operator: 'greater_than'
            },
            {
                fieldApiName: 'ServiceDate',
                value: {
                    from: '2025-06-01',
                    to: '2025-12-31'
                }
            }
        ]);
    }
})

You will see that the list is loaded with the filter values you specified in the component.

filters Attribute

The filters attribute is used to apply default filter conditions to the list. It accepts an array of filter objects, each with the following properties:

Attribute	Value
fieldApiName	The API name of the field to apply the filter to.
value	The value to filter by. For number or date ranges, use an object with from and to properties.
operator	Used to define comparison logic for number or date filters. Supported operator values: equals: Equal to not_equal_to: Not equal to less_than: Less than greater_than: Greater than less_or_equal: Less than or equal to greater_or_equal: Greater than or equal to