Drawer

The Drawer component is a panel that slides out from the edge of the screen with supplementary content.

import { Drawer } from '@backyard-ui/core';

Use the placement prop to change where the Drawer will appears.

Use the size prop to increase the visual size.

By default, the Drawer closes when you click its overlay. You can set closeOnOverlayClick to false if you want the Drawer to stay visible.

By default, the Drawer are uncontrolled but you can make it controlled

• size
  Description The `max-width` css property

  Type

  "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full"

  Default

  md
• isOpen
  Description If `true` the Dialog will be initially opened

  Type

  boolean

  Default

  false
• placement
  Description The drawer position

  Type

  "top" | "right" | "bottom" | "left"

  Default

  right
• closeOnOverlayClick
  Description If `false` the Dialog will be close when clicked on overlay

  Type

  boolean

  Default

  false

• asChild
  Description

  Type

  boolean

• asChild
  Description

  Type

  boolean

• asChild
  Description

  Type

  boolean