Layer Manager

Inspired from react-layer-manager, I created a layer manager. But since I wanted there to be no boilerplate code, I didn't use react context. Instead created a Singleton class to manage layers. All no frills ui components that renders in a seperate DOM tree than application will get the layer from this service.

This ensures that user will never have to worry about the z-index on which the component will render and can continue to nest components as per the requirement. For example, a user can keep opening dialogs one after another and each dialog will render in a seperate layer.

This layer also takes care of managing stack and overlay and can close a layer on click of esc key. All these behaviour can be customized.

Example

Following components use layer mananger

• Dialog
• Modal
• Drawer
• Notification
• Toast