Skip to main content
Overlay

Sheet

Service-launched **bottom sheet** — a mobile-first, bottom-anchored modal surface with a grab handle and drag-to-dismiss. Inject `KjSheetService` and call `open()` with a body component; the sheet slides up from the bottom edge, traps focus, and locks background scroll. It reuses the same overlay primitive stack as the drawer and dialog — bottom sheet is the mobile composition of that engine, not a new one. The wrapper component exists to host this documentation page.

03

Import

#import

Add the symbol to your component's imports array. The walkthrough below shows the most common usages — copy & tweak.

import { KjSheetComponent } from '@kouji-ui/components';
04

Playground

#playground
detent
sheet.open(SheetBody, {
  detent: 'auto',
  dismissible: true,
});