Can You Use Built-in Lightning Components in Aura?

Question
I have a form where users need to select 3 out of 5 products, similar to the Order > Add Product modal. I was wondering if there is a way to bring that functionality into my Aura component while applying a filter to display only the products I want to show. I explored the <lightning:listView>
component with the following implementation:
<lightning:listView objectApiName="Product2"
listName="productsView"
showActionBar="true"
enableInlineEdit="true"
showRowLevelActions="true"/>
However, Product2
is not supported in this component. Upon inspecting the browser, I also found the following data-aura-class
attributes when rendered:
<div data-aura-class="forceMultiAddUsingLVM forceListViewManager"></div>
Is there any way to use these built-in components within my Aura component to achieve the required functionality?
Answer
No, it is not possible to directly use built-in standard Lightning components or UI elements inside a custom Aura component unless Salesforce explicitly documents a way to do so. These components are not exposed at the framework level for customization. They are core parts of Salesforce’s internal UI and are not intended for extension.
What is available to developers are the Lightning framework components, which can be used to build custom solutions based on specific requirements.
In this case, since the built-in modal for adding products is not exposed for customization, you will need to build a custom Lightning component to handle this functionality. You can achieve this by creating a custom modal with a Lightning Datatable or a custom list view, applying filters to display only the required products, and allowing users to select three of them. Here’s an example of how you can build a custom product selection component using Lightning Datatable:
Aura Component (productSelector.cmp
<aura:component controller="ProductController">
<aura:attribute name="products" type="Product2[]"/>
<aura:attribute name="selectedProducts" type="Id[]" default="[]"/>
<lightning:datatable
data="{! v.products }"
columns="{! v.columns }"
keyField="Id"
onrowselection="{! c.handleRowSelection }"
/>
<lightning:button label="Confirm Selection" onclick="{! c.confirmSelection }"/>
</aura:component>
Explanation:
This component retrieves a list of products from the server and displays them in a lightning:datatable.
Users can select products, and their choices are stored in the selectedProducts
attribute.
A Confirm Selection button ensures exactly three products are selected before proceeding.
Controller (productSelectorController.js)
({
doInit : function(component, event, helper) {
helper.fetchProducts(component);
},
handleRowSelection : function(component, event) {
let selectedRows = event.getParam('selectedRows');
let selectedIds = selectedRows.map(row => row.Id);
component.set("v.selectedProducts", selectedIds);
},
confirmSelection : function(component) {
let selectedProducts = component.get("v.selectedProducts");
if(selectedProducts.length !== 3) {
alert("Please select exactly 3 products.");
} else {
console.log("Selected Products:", selectedProducts);
}
}
})
Explanation:
The doInit
function calls a helper method to fetch product records from Apex.
The handleRowSelection
function stores the selected product IDs in v.selectedProducts
The confirmSelection
function ensures that exactly three products are selected before proceeding.
Helper (productSelectorHelper.js
)
({
fetchProducts : function(component) {
let action = component.get("c.getFilteredProducts");
action.setCallback(this, function(response) {
if(response.getState() === "SUCCESS") {
component.set("v.products", response.getReturnValue());
}
});
$A.enqueueAction(action);
}
})
Explanation:
Calls the Apex method getFilteredProducts
to retrieve a filtered product list.
Sets the fetched products into the v.products
attribute.
Apex Controller (ProductController.cls
public with sharing class ProductController {
@AuraEnabled
public static List<Product2> getFilteredProducts() {
return [SELECT Id, Name FROM Product2 WHERE SomeField__c = 'YourFilterCriteria'];
}
}
Explanation:
This method queries the Product2
object, applying filters to retrieve only the required products.
The results are sent back to the Aura component for display in the datatable.
Since Salesforce does not expose built-in modals for customization, creating a custom product selection component using Lightning Datatable is the best solution. This approach provides flexibility while ensuring only the required products are available for selection.
Job-Oriented Salesforce Course with Real-Time Projects and Money Back Guarantee
Our Salesforce course is expertly designed to provide a comprehensive understanding of the Salesforce platform, equipping you with essential skills to excel in the CRM industry. The curriculum covers key modules like Salesforce Admin, Developer, and AI, combining theoretical knowledge with hands-on practice. By working on real-world projects and interactive exercises, you’ll gain the expertise to solve complex business challenges using Salesforce solutions. Our skilled instructors ensure you develop both technical proficiency and industry-relevant insights to succeed in the Salesforce ecosystem.
Beyond technical skills, our Salesforce Training in Australia includes personalized mentorship, certification support, and interview preparation to elevate your career opportunities. You’ll have access to extensive study materials, hands-on project experience, and continuous guidance throughout your learning journey. By the end of the course, you’ll be well-prepared for certification exams and possess the practical problem-solving abilities that employers seek. Tak the first step toward your Salesforce career—enroll in a Free Demo today!