본문으로 건너뛰기

Drawer

화면의 한쪽에서 슬라이드 형태로 나타나는 메뉴나 사이드바를 제공하는 컴포넌트입니다.

import { Drawer } from 'layout-component-hp';

Anatomy

  • Drawer: 화면의 한쪽에서 슬라이드 형태로 나타나는 메뉴나 사이드바 컴포넌트입니다.
  • Drawer.Backdrop: Drawer 외부 백그라운드. 클릭으로 Drawer를 닫을 수 있습니다.
  • Drawer.Content: Drawer 내부 컨텐츠입니다.
  • Drawer.CloseButton: Drawer를 닫을 수 있는 버튼입니다.

Usage

Drawer 컴포넌트의 사용법은 다음과 같습니다. 함께 제공하는 useDisclosure 훅과 사용 가능합니다.

결과
라이브 에디터