Sheet

Slide-over panel anchored to any edge of the viewport. Built on the same accessible primitives as Dialog.

Usage

import {
  SheetRoot,
  SheetTrigger,
  SheetContent,
  SheetHeader,
  SheetTitle,
  SheetDescription,
} from '@bwo-ui/react';

<SheetRoot>
  <SheetTrigger asChild>
    <Button>Open sheet</Button>
  </SheetTrigger>
  <SheetContent side="right">
    <SheetHeader>
      <SheetTitle>Profile</SheetTitle>
      <SheetDescription>Update your account info.</SheetDescription>
    </SheetHeader>
    {/* body */}
  </SheetContent>
</SheetRoot>

Props — SheetContent

Prop	Type	Default	Description
`side`	`'top' \| 'right' \| 'bottom' \| 'left'`	`'right'`	Edge the sheet slides in from.
`showClose`	`boolean`	`true`	Render the top-right close button.