feat: modal

packages/core/package.json

@@ -27,11 +27,13 @@
     "@latus/react": "^2.0.0",
     "autoprefixer": "^9.8.6",
     "debug": "4.3.1",
+    "deepmerge": "^4.2.2",
     "express": "^4.17.1",
     "glob": "^7.1.6",
     "lodash.flatten": "^4.4.0",
     "natsort": "^2.0.2",
-    "react-hex-editor": "^0.3.0"
+    "react-hex-editor": "^0.3.0",
+    "react-modal": "^3.12.1"
   },
   "devDependencies": {
     "@latus/db": "^2.0.0",

packages/core/src/components/modal/index.jsx

@@ -0,0 +1,44 @@
+import {PropTypes, React} from '@latus/react';
+import merge from 'deepmerge';
+import ReactModal from 'react-modal';
+
+const Modal = ({
+  children,
+  isOpen,
+  onRequestClose,
+  style,
+}) => (
+  <ReactModal
+    ariaHideApp={false}
+    style={merge(
+      {
+        overlay: {
+          backgroundColor: 'rgba(0, 0, 0, 0.5)',
+        },
+        content: {
+          background: 'rgb(64, 64, 64)',
+          border: 'rgba(255, 255, 255, 0.2)',
+          padding: '1em',
+        },
+      },
+      style,
+    )}
+    isOpen={isOpen}
+    onRequestClose={onRequestClose}
+  >
+    {children}
+  </ReactModal>
+);
+
+Modal.defaultProps = {
+  style: {},
+};
+
+Modal.propTypes = {
+  children: PropTypes.node.isRequired,
+  isOpen: PropTypes.bool.isRequired,
+  onRequestClose: PropTypes.func.isRequired,
+  style: PropTypes.shape({}),
+};
+
+export default Modal;

packages/core/src/index.js

@@ -5,6 +5,7 @@ import ImageResourceController from './resource-controllers/image';
 import TextResourceController from './resource-controllers/text';
 import {projects, user} from './state';
 
+export {default as Modal} from './components/modal';
 export {default as Number} from './components/number';
 export {default as Range, rangePropType} from './components/range';
 export {default as Vector, vectorPropType} from './components/vector';

packages/core/yarn.lock

@@ -3816,6 +3816,11 @@ execa@^1.0.0:
     signal-exit "^3.0.0"
     strip-eof "^1.0.0"
 
+exenv@^1.2.0:
+  version "1.2.2"
+  resolved "http://npm.cha0sdev/exenv/-/exenv-1.2.2.tgz#2ae78e85d9894158670b03d47bec1f03bd91bb9d"
+  integrity sha1-KueOhdmJQVhnCwPUe+wfA72Ru50=
+
 expand-brackets@^2.1.4:
   version "2.1.4"
   resolved "http://npm.cha0sdev/expand-brackets/-/expand-brackets-2.1.4.tgz#b77735e315ce30f6b6eff0f83b04151a22449622"
@@ -5495,7 +5500,7 @@ long@^4.0.0:
   resolved "http://npm.cha0sdev/long/-/long-4.0.0.tgz#9a7b71cfb7d361a194ea555241c92f7468d5bf28"
   integrity sha512-XsP+KhQif4bjX1kbuSiySJFNAehNxgLb6hPRGJ9QsUr8ajHkuXGdrHmFUTUUXhDwVX2R5bY4JNZEwbUiMhV+MA==
 
-loose-envify@^1.1.0, loose-envify@^1.4.0:
+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
   version "1.4.0"
   resolved "http://npm.cha0sdev/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
   integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -6810,7 +6815,7 @@ promise-inflight@^1.0.1:
   resolved "http://npm.cha0sdev/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"
   integrity sha1-mEcocL8igTL8vdhoEputEsPAKeM=
 
-prop-types@^15.6.1, prop-types@^15.7.2:
+prop-types@^15.5.10, prop-types@^15.6.1, prop-types@^15.7.2:
   version "15.7.2"
   resolved "http://npm.cha0sdev/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
   integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@@ -7003,11 +7008,21 @@ react-is@^16.13.1, react-is@^16.7.0, react-is@^16.8.1:
   resolved "http://npm.cha0sdev/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
 
-react-lifecycles-compat@^3.0.4:
+react-lifecycles-compat@^3.0.0, react-lifecycles-compat@^3.0.4:
   version "3.0.4"
   resolved "http://npm.cha0sdev/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
   integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==
 
+react-modal@^3.12.1:
+  version "3.12.1"
+  resolved "http://npm.cha0sdev/react-modal/-/react-modal-3.12.1.tgz#38c33f70d81c33d02ff1ed115530443a3dc2afd3"
+  integrity sha512-WGuXn7Fq31PbFJwtWmOk+jFtGC7E9tJVbFX0lts8ZoS5EPi9+WWylUJWLKKVm3H4GlQ7ZxY7R6tLlbSIBQ5oZA==
+  dependencies:
+    exenv "^1.2.0"
+    prop-types "^15.5.10"
+    react-lifecycles-compat "^3.0.0"
+    warning "^4.0.3"
+
 react-redux@^7.2.2:
   version "7.2.2"
   resolved "http://npm.cha0sdev/react-redux/-/react-redux-7.2.2.tgz#03862e803a30b6b9ef8582dadcc810947f74b736"
@@ -8616,6 +8631,13 @@ vm-browserify@^1.0.1:
   resolved "http://npm.cha0sdev/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
   integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
 
+warning@^4.0.3:
+  version "4.0.3"
+  resolved "http://npm.cha0sdev/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3"
+  integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==
+  dependencies:
+    loose-envify "^1.0.0"
+
 watchpack-chokidar2@^2.0.1:
   version "2.0.1"
   resolved "http://npm.cha0sdev/watchpack-chokidar2/-/watchpack-chokidar2-2.0.1.tgz#38500072ee6ece66f3769936950ea1771be1c957"