A minimal typescript implementation of mobile sheets
$ npm i @royalzsoftware/mobile-sheet
$ npm i @royalzsoftware/mobile-sheet.angular
- Import the MobileSheet Component, exposed from the library.
- Provide the SHEET_CONFIGURATION Injection token, to configure dock points and transition speed.
- Then add following tag.
<mobile-sheet>
<div #handle>
Your handle to drag the sheet
</div>
</mobile-sheet>
The mobile sheet component has ViewEncapsulation.None. Style the sheet by overriding styles on the #sheet selector. The handle is client code and you can change it yourself without dealing with the library.