Docs
Slide Over

Slide Over

A window overlaid on either the primary window or another dialog window, rendering the content underneath inert.

Installation

npx nyxb@latest add slide-over

Usage

import {
  SlideOver,
  SlideOverContent,
  SlideOverDescription,
  SlideOverHeader,
  SlideOverTitle,
  SlideOverTrigger,
} from "~/components/ui/slide-over"
<SlideOver>
  <SlideOverTrigger>Open</SlideOverTrigger>
  <SlideOverContent>
    <SlideOverHeader>
      <SlideOverTitle>Are you absolutely sure?</SlideOverTitle>
      <SlideOverDescription>
        This action cannot be undone. This will permanently delete your account
        and remove your data from our servers.
      </SlideOverDescription>
    </SlideOverHeader>
  </SlideOverContent>
</SlideOver>

Examples

Custom close button