Skip to content

emilkowalski/vaul

Folders and files

NameName
Last commit message
Last commit date

Latest commit

6ba4c44 · Dec 13, 2024
Sep 4, 2024
Aug 29, 2023
Dec 13, 2024
Oct 13, 2024
Jul 23, 2023
Sep 15, 2024
Jul 23, 2023
Aug 26, 2023
Jul 23, 2023
Oct 5, 2024
Nov 4, 2024
Oct 3, 2023
Sep 25, 2024
Sep 25, 2024
Oct 13, 2024
Jul 23, 2023

Repository files navigation

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';

function MyComponent() {
  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.