Backdrop

Loading...

A backdrop component that narrows the user's focus to a particular element.

• Tag: <flint-backdrop>
• Class: FlintBackdrop

Import

import 'flint-ui'; // auto-registers all
// or
import { FlintBackdrop } from 'flint-ui';

Usage

<flint-backdrop></flint-backdrop>

Properties

Property	Attribute	Type	Default	Description
open	open	boolean	false	Whether the backdrop is visible and active.
invisible	invisible	boolean	false	When true, the backdrop overlay is transparent.
container	container	boolean	false	When true, the backdrop is scoped to its parent container instead of the viewport.

Events

Event	Detail	Description
flint-backdrop-close	—	Dispatched when the backdrop is clicked or Escape is pressed.

Slots

Name	Description
(default)	Content to display in the foreground.

CSS Custom Properties

Property	Default
--flint-backdrop-position	fixed
--flint-backdrop-color	—
--flint-backdrop-z-index	—

---