Skip to content

Drawer

A drawer component that slides from either the right or left side of the screen

Usage

vue
<script setup lang="ts">
import { ref } from 'vue';
import { Drawer } from '@youcan/ui-vue3';
const showDrawer = ref(false);
</script>

<template>
  <Drawer v-model:visible="showDrawer">
    Drawer Content
  </Drawer>
  <div class="container">
    <PrimaryButton @click="showDrawer = true">
      <span>Open Drawer</span>
    </PrimaryButton>
  </div>
</template>

API Reference