New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Created a light-weight configurable modal #107

Open

saadkhokhar-git wants to merge 1 commit into contra:main from saadkhokhar-git:main

saadkhokhar-git commented May 5, 2023 •

edited

For Contra Frontend Technical Assessment, created a lightweight configurable modal the implements:

Focus Management
Background scroll-locking
Tab navigation
React portals
Multi-modal environment (i.e. stacking)
Accessibility
Mobile

With additional configurable options like:

isOpen: If true, the component is shown.
setIsOpen: setter for isOpen
closeOverride: Callback fired when the component requests to be closed. The reason parameter can optionally be used to control the response to onClose.
size: Options are 'xs', 'sm', 'md' & 'lg'.
title: It's the title of the modal.
overlayDismissed: It handle overlay dismissed functionality. user can close the modal by clicking outside overlay if enabled.

Loom video: https://www.loom.com/share/f8f66f27c2b549b2948861958f53c797


          Created a lightwight configurable modal

17886e1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment