Skip to main content

​
Overview

The Sheet component is an alternative implementation for slide-in overlay panels.
Note: The Sheet component source file was not found in the Nuxt UI codebase. You may want to use the Drawer component instead, which provides similar slide-in overlay functionality.

​
Alternative: Use Drawer

For slide-in overlay panels from screen edges, use the Drawer component: 
<template>
  <UDrawer v-model:open="isOpen" title="Drawer Title">
    <template #default>
      <UButton>Open Drawer</UButton>
    </template>
    <template #body>
      <p>Drawer content goes here</p>
    </template>
  </UDrawer>
</template>

<script setup>
const isOpen = ref(false)
</script>
  • Drawer - Slide-in overlay from screen edges (recommended alternative)
  • Modal - Centered dialog overlays
  • Popover - Floating content containers

Build docs developers (and LLMs) love

Get started for freeTalk to us