Drawer

Tag: &lt;flint-drawer&gt;
Class: FlintDrawer

Left (default)

Navigation drawers provide ergonomic access to destinations in a site or app.

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

html

<flint-drawer></flint-drawer>

Property	Attribute	Type	Default	Description
`open`	`open`	`boolean`	`false`	Whether the drawer is open.
`anchor`	`anchor`	`'left' \| 'right' \| 'top' \| 'bottom'`	`'left'`	Side from which the drawer slides in.
`variant`	`variant`	`'temporary' \| 'persistent' \| 'mini'`	`'temporary'`	Drawer behavior mode.
`edge`	`edge`	`boolean`	`false`	Whether the drawer uses edge spacing.
`container`	`container`	`boolean`	`false`	Whether the drawer is contained within its parent.
`label`	`label`	`string`	`'Drawer'`	Accessible label for the drawer panel (used as aria-label on the panel).

Event	Detail	Description
`flint-drawer-close`	—	Dispatched when the drawer requests to be closed (backdrop click or Escape).

Name	Description
`(default)`	Drawer content.

Drawer ​