dce-reactkit 3.7.10-beta.0 → 3.7.10-beta.2

package/dist/esm/types/index.d.ts

@@ -1,7 +1,7 @@
 import AppWrapper, { alert, confirm, showFatalError, addFatalErrorHandler, leaveToURL } from './components/AppWrapper';
 import LoadingSpinner from './components/LoadingSpinner';
 import ErrorBox from './components/ErrorBox';
-import Modal from './components/Modal/ModalForWrapper';
+import Modal from './components/Modal';
 import TabBox from './components/TabBox';
 import RadioButton from './components/RadioButton';
 import CheckboxButton from './components/CheckboxButton';

package/dist/index.d.ts

@@ -178,8 +178,7 @@ type Props$j = {
 declare const ErrorBox: React$1.FC<Props$j>;
 
 /**
- * The displayable modal component (this is the modal that's added to the
- *   wrapper, not the one that the programmer renders)
+ * General use modal component
  * @author Gabe Abrams
  */
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dce-reactkit",
-  "version": "3.7.10-beta.0",
+  "version": "3.7.10-beta.2",
   "description": "Shared components for Harvard DCE apps",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

package/src/components/AppWrapper.tsx

@@ -24,7 +24,7 @@ import ModalProps from './Modal/ModalProps';
 // Import shared components
 // TODO: fix dependency cycle
 // eslint-disable-next-line import/no-cycle
-import Modal from './Modal/ModalForWrapper';
+import ModalForWrapper from './Modal/ModalForWrapper';
 
 // Import custom errors
 import ErrorWithCode from '../errors/ErrorWithCode';
@@ -580,7 +580,7 @@ const AppWrapper: React.FC<Props> = (props: Props): React.ReactElement => {
 
   if (alertInfo) {
     modal = (
-      <Modal
+      <ModalForWrapper
         key={`alert-${alertInfo.title}-${alertInfo.text}`}
         title={alertInfo.title}
         type={ModalType.Okay}
@@ -594,7 +594,7 @@ const AppWrapper: React.FC<Props> = (props: Props): React.ReactElement => {
         onTopOfOtherModals
       >
         {alertInfo.text}
-      </Modal>
+      </ModalForWrapper>
     );
   }
 
@@ -602,7 +602,7 @@ const AppWrapper: React.FC<Props> = (props: Props): React.ReactElement => {
 
   if (confirmInfo) {
     modal = (
-      <Modal
+      <ModalForWrapper
         key={`confirm-${confirmInfo.title}-${confirmInfo.text}`}
         title={confirmInfo.title}
         type={ModalType.OkayCancel}
@@ -619,7 +619,7 @@ const AppWrapper: React.FC<Props> = (props: Props): React.ReactElement => {
         dontAllowBackdropExit
       >
         {confirmInfo.text}
-      </Modal>
+      </ModalForWrapper>
     );
   }
 
@@ -631,7 +631,7 @@ const AppWrapper: React.FC<Props> = (props: Props): React.ReactElement => {
   // Add custom modals
   modalsFromState.forEach((modalTuple) => {
     customModals.push(
-      <Modal
+      <ModalForWrapper
         key={String(modalTuple.props.key ?? modalTuple.id)}
         // eslint-disable-next-line react/jsx-props-no-spreading
         {...modalTuple.props}

package/src/components/Modal/ModalForWrapper.tsx

@@ -361,8 +361,8 @@ const Modal: React.FC<ModalProps> = (props) => {
       style={{
         zIndex: (
           onTopOfOtherModals
-            ? 5000000001
-            : 5000000000
+            ? 2000000001
+            : 2000000000
         ),
         display: 'block',
         margin: 'auto',
@@ -374,7 +374,7 @@ const Modal: React.FC<ModalProps> = (props) => {
       <div
         className={`ModalForWrapper-backdrop ${backdropAnimationClass}`}
         style={{
-          zIndex: 5000000003,
+          zIndex: 2000000003,
         }}
         onClick={async () => {
           // Skip if exit via backdrop not allowed
@@ -396,7 +396,7 @@ const Modal: React.FC<ModalProps> = (props) => {
       <div
         className={`modal-dialog modal-${size} ${animationClass} modal-dialog-scrollable modal-dialog-centered`}
         style={{
-          zIndex: 5000000002,
+          zIndex: 2000000002,
         }}
       >
         <div

package/src/index.ts

@@ -8,7 +8,7 @@ import AppWrapper, {
 } from './components/AppWrapper';
 import LoadingSpinner from './components/LoadingSpinner';
 import ErrorBox from './components/ErrorBox';
-import Modal from './components/Modal/ModalForWrapper';
+import Modal from './components/Modal';
 import TabBox from './components/TabBox';
 import RadioButton from './components/RadioButton';
 import CheckboxButton from './components/CheckboxButton';