Sheet
Panel that slides in from an edge for a side task.
Usage
import { Sheet } from '@smartui/react';
import '@smartui/react/styles.css';When to use
- Phone: choosing, short forms, details.
- Web: details of one table row.
When not to use
- A one-line confirmation. Use Dialog.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
trigger | ReactNode | - | |
title | string | required | |
side | 'bottom' | 'right' | 'bottom' | |
footer | ReactNode | - | |
isOpen, onOpenChange | boolean, (open) => void | - |
Accessibility
- Always has a close button in addition to dismissing by tapping outside.