MazDrawer
MazDrawer is a standalone component to add a collapsible sidebar at the top and bottom bar
INFO
Before you have to import the global css files in your project, follow instructions in Getting Started
TIP
This component uses <Teleport to="body">
with MazBackdrop, so you can implement this component anywhere and it inherits all its props
Basic usage
Props, Event & Slots
Props
Prop name | Description | Type | Values | Default |
---|---|---|---|---|
title | The title of the drawer | string | - | undefined |
variant | The variant of the drawer@values 'right', 'top', 'left', 'bottom' | union | - | 'right' |
size | The size of the drawer | string | - | '30rem' |
backdropClass | The class of the backdrop | string | - | undefined |
noClose | Disable the close button | boolean | - | false |
Events
Event name | Properties | Description |
---|---|---|
close | emitted when drawer is close (after animation) | |
open | emitted when drawer is open | |
before-close | emitted before drawer is close | |
update:model-value | value boolean - The value of the model | emitted when drawer is open or close |
Slots
Name | Description | Bindings |
---|---|---|
title | ||
default |