search

seas-computing / mark-one

A UI component library for building React Apps (in development)
https://seas-computing.github.io/mark-one/
BSD 3-Clause "New" or "Revised" License
0 stars 1 forks source link

Create Modal component #53

Closed jonseitz closed 4 years ago

jonseitz commented 4 years ago

Implements a full-screen overlay modal, suitable for use with edit screens, confirmation dialogs, and other communication purposes.

The ModalHeader and ModalFooter components will come in separate PRs, and those will be responsible for more of the look and feel of the modals. This component is mostly handling the appearing and disappearing effects.

codecov[bot] commented 4 years ago

Codecov Report

Merging #53 into develop will not change coverage by %. The diff coverage is 100.00%.

Impacted file tree graph

@@            Coverage Diff            @@
##           develop       #53   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           26        27    +1     
  Lines          311       343   +32     
  Branches        27        33    +6     
=========================================
+ Hits           311       343   +32
Impacted Files Coverage Δ
src/Modals/Modal.tsx 100.00% <100.00%> (ø)

Continue to review full report at Codecov.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update bb7a5de...64df623. Read the comment docs.

jonseitz commented 4 years ago

Thanks for reviewing. We did talk about using the Esc key to clear the modal, but I think we decided to have that be handled by the parent component instead. I think you always want to be careful about adding/changing key bindings like that, and leaving it up to the implementation helps make sure that it's the "correct" behavior that the developer intended.