Component

Drawer

A panel that slides in from a screen edge, sized as a percentage of the viewport with sensible min and max widths, dismissed by backdrop tap or Escape.

Standalone

drawer.tsx

<NativeDrawer open={open} onClose={() => setOpen(false)} surface="plain">
  <div className={nativeMobileSheetProseClassName}>...</div>
</NativeDrawer>

Example

Holds a side menu, anchored to the screen edge so navigation stays reachable without leaving the current screen.

drawer-example.tsx

<NativeDrawer open={open} onClose={() => setOpen(false)} surface="plain" side="right">
  <NativeRow label="Profile" onPress={onSelectProfile} />
  <NativeRow label="Connections" onPress={onSelectConnections} />
  <NativeRow label="Sign out" onPress={onSignOut} />
</NativeDrawer>

Capabilities

Prop	Type	Description
openrequired	boolean	-
onCloserequired	() => void	-
childrenrequired	ReactNode	-
side	NativeDrawerSide	-
widthPercent	number	-
maxWidthPx	number	-
minWidthPx	number	-
surface	NativeDrawerSurface	-
closeOnBackdropPress	boolean	-
lockBodyScroll	boolean	-
className	string	-