Installation & Licenses Management

Install the Avonni LWC Components package and set up licenses and permissions.

Before you can use the Avonni LWC Components in your own Lightning Web Components, you need to install the package in your Salesforce org.

Install from Salesforce AppExchange

1. Navigate to AppExchange — Go to the Salesforce AppExchange, or click the App Launcher in Salesforce and search for "AppExchange".
2. Find Avonni — Search for the Avonni LWC Components in the AppExchange marketplace, or open the listing directly below.
3. Install the package — Click Get It Now and follow the installation prompts.
4. Choose installation options:

   • Install for Admins Only (recommended for initial setup)
   • Install for All Users (after testing and configuration)
5. Complete installation — Review and accept the package permissions, then click Install.

Avonni LWC Library | 50+ Lightning Web Components for SalesforceSalesforce AppExchange | Leading Enterprise Cloud Marketplace

View the Avonni LWC Components listing on AppExchange

---

Post-Installation Setup

Assign licenses

After installation, assign licenses to the users who will interact with the components:

1. Go to Setup > Installed Packages.
2. Find the Avonni LWC Components package and click Manage Licenses.
3. Assign licenses to the appropriate users.

Configure permission sets

Assign the permission set included with the package based on user role:

• Developers — users who build their own Lightning Web Components on top of the Avonni components.
• End users — users who view and interact with apps or pages that include Avonni components.

Permission set assignment steps:

1. Go to Setup > Permission Sets.
2. Select the appropriate permission set.
3. Click Manage Assignments.
4. Click Add Assignments.
5. Select the users who need access.
6. Click Assign.

Verify Installation

Confirm the package installed correctly:

1. Go to Setup > Installed Packages.
2. Confirm Avonni LWC Components appears in the list.

Once it's listed, you can reference any Avonni component in your own code.

---

Accessing Avonni Components

You access the Avonni components through your own custom LWC code. Once the package is installed, reference any component in your Lightning Web Component's HTML template using the avonni namespace prefix — no JavaScript import is required for the markup:

<!-- myComponent.html -->
<template>
    <avonni-avatar
        primary-text="Jane Cooper"
        secondary-text="Product Designer"
        fallback-icon-name="standard:user"
        size="x-large"
        variant="circle"
    ></avonni-avatar>
</template>

Pass data and handle events from your component's JavaScript as usual:

// myComponent.js
import { LightningElement } from 'lwc';

export default class MyComponent extends LightningElement {
    handleActionClick(event) {
        // react to component events
    }
}

Each component's tag, attributes, events, and a copy-paste example are documented under Core Components and Data Driven Components.

---

Need help with installation?

If you run into issues during installation or setup:

• Check the Troubleshooting & FAQs guide for common solutions.
• Join the Trailblazer Community Group, where admins share installation tips and solutions.
• Contact support at [email protected].