github.mp4

Vaul is an unstyled drawer component for React that can be used as a Dialog replacement on tablet and mobile devices. You can read about why and how it was built here.

Usage

To start using the library, install it in your project:,

npm install vaul

Use the drawer in your app.

import{Drawer}from'vaul';functionMyComponent(){return(<Drawer.Root><Drawer.Trigger>Open</Drawer.Trigger><Drawer.Portal><Drawer.Content><Drawer.Title>Title</Drawer.Title></Drawer.Content><Drawer.Overlay/></Drawer.Portal></Drawer.Root>);}

Documentation

Find the full API reference and examples in the documentation.