API REFERENCE · OVERLAYS
<dj-slide-pane>
A panel that slides in from an edge. Slots: title, default (content). Closes on Escape, the close button, and underlay click. Locks body scroll while open. Emits dj-close. Width/height comes from width (px). Parts: underlay, pane, title, close, content.
npm install @dojo-ng/slide-pane
import "@dojo-ng/slide-pane";Properties
| Property | Attribute | Type | Default |
|---|---|---|---|
open |
open reflected |
boolean |
false |
align |
align reflected |
"left""right""top""bottom" |
"left" |
width |
width |
number |
320 |
underlay |
underlay |
boolean |
true |
closeText |
close-text |
string |
None |
Events
dj-close
Slots
| Slot | Description |
|---|---|
title | |
| Default slot | content |
CSS parts
Style these with dj-slide-pane::part(name).
underlaypanetitleclosecontent
CSS custom properties
| Property | Default | Description |
|---|---|---|
--dj-slide-pane-size | 320px | Width (left/right) or height (top/bottom) of the pane. |
--dj-slide-pane-z-index | 931 | Stacking order of the pane. |
--dj-slide-pane-underlay-z-index | 930 | Stacking order of the pane underlay (scrim). |
Methods
close()