Getting Started

About

The overlay component for the Salesforce Design System.

Installation

npm i @salesforce-ux/sds-overlay

Usage

Lightning Web Component

Import the CSS

After installation, you need to import the component's CSS into your LWC component module. To do this, use the @import CSS syntax within the CSS file of your component module.

/* myComponent.css */
@import '@salesforce-ux/slds-overlay/dist/overlay.compiled.css';

The *.compiled.css files in the /dist folder have all the component's dependencies rolled up into one file. If you choose to import your modules explicitly, you should the *.css files in the /dist folder.

Decorate the HTML to match specification

Additionally, you will need to decorate the HTML of your LWC component template to have all the named part attributes in the component's specification.