Lightning Web Components & Design Attributes

This page covers:

Overview of Lightning Web Components & Design Attributes

Lightning Web Components (LWC) is a framework designed for creating custom user interfaces. With the later releases of Amp Impact, we’ve created LWC versions of the original Visualforce pages to provide a more flexible and modern custom interface solution for many of our features. In the same way that we often use Custom Settings to customize the Visualforce Pages, we use Design Attributes in LWCs to customize the interface.

Accessing Lightning Web Components in Amp Impact

To add a LWC to a Lightning Page, simply navigate to the Lightning Page Builder and add the relevant LWC to the Lightning Page. We document and add guidance for the use of Amp Impact LWCs in the Set Up & Customization by Functional Area Section.

Use Lightning Web Security for Lightning Web Components and Aura Components

As of Salesforce Summer 23' release, Lightning Web Security has started to replace Lightning Locker for Lightning web components as well as Aura components.

Determine whether this needs to be enabled for your client based on considerations mentioned here

Accessing Design Attributes for Lightning Web Components

Unlike Custom Settings that are accessed from the setup interface, you will find the Design Attributes for a LWC in the Lightning Page edit interface. Once you’ve selected and added the relevant LWC to your Lightning Page, the Design Attributes will be listed on the right side of the page. This is where you can select the relevant options to customize the interface for the LWC on the page.

Open

Amp Impact Lightning Web Components & Design Attributes

Details on how to add the LWCs to Lightning Pages and how to navigate the related design attributes are documented here:

• Project Setup & Modifications: Add Lightning Web Components to the Project Lightning Record Page

• Frameworks: Manage Framework: Lightning Web Component

• Impact/Outcome Reporting:

  • Indicators: Manage Indicators: Lightning Web Component

  • Set Targets: Set Targets Lightning Web Component

  • Add Results: Add Results Lightning Web Component

• Workplanning & Resource Management: Activities: Design Attributes

• Financial Management: Budget Cycle Component