Bottom Sheet
The BottomSheet component is a mobile-friendly dialog that slides up from the bottom of the screen. It is typically used to display supplementary content or actions without losing context of the underlying page.
The BottomSheet component is a mobile-friendly dialog that slides up from the bottom of the screen. It is commonly used in responsive layouts to present additional information without navigating away from the current view.
Basic BottomSheet
A simple bottom sheet with a title and basic content. By default, it features a built-in header with a close button and dismisses when users tap the backdrop or press Escape.
Usage
The BottomSheet component supports various configurations tailored to different use cases:
- Basic BottomSheet: A bottom sheet with standard title, close button, and content.
- No Title BottomSheet: A clean bottom sheet without a header block, offering more space for custom layouts.
- Custom Height BottomSheet: A bottom sheet configured with custom maximum heights for larger content.
- Custom Header BottomSheet: A bottom sheet with a customized header background and text colors to match specific brand requirements.