Bottom Sheet 라이브러리 비교

react-modal-sheet 추천:

• 활발한 유지보수 (v5 최근 릴리즈)
• Motion(구 Framer Motion) 기반, Compound component 패턴
• avoidKeyboard, disableDismiss 등 유용한 옵션

import { Sheet } from 'react-modal-sheet'

<Sheet isOpen={isOpen} onClose={() => setOpen(false)}>
  <Sheet.Container>
    <Sheet.Header />
    <Sheet.Content>콘텐츠</Sheet.Content>
  </Sheet.Container>
  <Sheet.Backdrop />
</Sheet>

---

• react-modal-sheet
• vaul - Radix Dialog 기반 대안. 지금은 유지보수 중단¹
• Material Design - Bottom Sheet
• Apple HIG - Sheet

Footnotes

1. vaul README: “This repo is unmaintained. I might come back to it at some point, but not in the near future.” ↩