Drawer - React

Drawer

ReactVueJS + CSS

Impor

Copy

import { Drawer } from '@idds/react';

Contoh Penggunaan

Contoh 1 - Drawer Sederhana

PreviewCode

Open Basic Drawer

Contoh 2 - Posisi Drawer

PreviewCode

Open LeftOpen RightOpen TopOpen Bottom

Contoh 3 - Drawer Persistent

PreviewCode

Open Persistent Drawer

Props

Name	Type	Default	Required	Description
isOpen	boolean	—	Yes	Kontrol apakah drawer terbuka.
onClose	() => void	—	Yes	Callback saat drawer ditutup.
position?	'right' | 'left' | 'top' | 'bottom'	'right'	No	Sisi kemana drawer muncul di desktop.
closeOnBackdrop?	boolean	true	No	Klik backdrop menutup drawer.
className?	string	—	No	Tailwind class tambahan untuk panel.
width?	'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full' | string	'sm'	No	Width panel (desktop). Bisa menggunakan predefined size atau custom CSS value.
title?	string	—	No	Title yang ditampilkan di header.
children	ReactNode | VNode | Component	—	Yes	Konten di dalam drawer.

Di halaman ini

• Impor
• Contoh Penggunaan
• Props