dce-reactkit 3.7.10-beta.2 → 3.7.10-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +10 -5
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.js +10 -5
- package/dist/esm/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Modal/ModalForWrapper.tsx +14 -7
package/package.json
CHANGED
|
@@ -31,6 +31,10 @@ import { isDarkModeOn } from '../../client/initClient';
|
|
|
31
31
|
/* ------------------------------ Constants ----------------------------- */
|
|
32
32
|
/*------------------------------------------------------------------------*/
|
|
33
33
|
|
|
34
|
+
// Base level of z-index
|
|
35
|
+
const BASE_Z_INDEX = 1000000000;
|
|
36
|
+
const BASE_Z_INDEX_ON_TOP = 2000000000;
|
|
37
|
+
|
|
34
38
|
// Constants
|
|
35
39
|
const MS_TO_ANIMATE = 200; // Animation duration
|
|
36
40
|
|
|
@@ -290,6 +294,13 @@ const Modal: React.FC<ModalProps> = (props) => {
|
|
|
290
294
|
/* ------------------------------- Render ------------------------------- */
|
|
291
295
|
/*------------------------------------------------------------------------*/
|
|
292
296
|
|
|
297
|
+
// Calculate Z-index
|
|
298
|
+
const baseZIndex = (
|
|
299
|
+
onTopOfOtherModals
|
|
300
|
+
? BASE_Z_INDEX_ON_TOP
|
|
301
|
+
: BASE_Z_INDEX
|
|
302
|
+
);
|
|
303
|
+
|
|
293
304
|
// Get list of buttons for this modal type
|
|
294
305
|
const ModalButtonTypes: ModalButtonType[] = modalTypeToModalButtonTypes[type] ?? [];
|
|
295
306
|
|
|
@@ -359,11 +370,7 @@ const Modal: React.FC<ModalProps> = (props) => {
|
|
|
359
370
|
className="modal show"
|
|
360
371
|
tabIndex={-1}
|
|
361
372
|
style={{
|
|
362
|
-
zIndex:
|
|
363
|
-
onTopOfOtherModals
|
|
364
|
-
? 2000000001
|
|
365
|
-
: 2000000000
|
|
366
|
-
),
|
|
373
|
+
zIndex: baseZIndex,
|
|
367
374
|
display: 'block',
|
|
368
375
|
margin: 'auto',
|
|
369
376
|
left: 0,
|
|
@@ -374,7 +381,7 @@ const Modal: React.FC<ModalProps> = (props) => {
|
|
|
374
381
|
<div
|
|
375
382
|
className={`ModalForWrapper-backdrop ${backdropAnimationClass}`}
|
|
376
383
|
style={{
|
|
377
|
-
zIndex:
|
|
384
|
+
zIndex: baseZIndex + 1,
|
|
378
385
|
}}
|
|
379
386
|
onClick={async () => {
|
|
380
387
|
// Skip if exit via backdrop not allowed
|
|
@@ -396,7 +403,7 @@ const Modal: React.FC<ModalProps> = (props) => {
|
|
|
396
403
|
<div
|
|
397
404
|
className={`modal-dialog modal-${size} ${animationClass} modal-dialog-scrollable modal-dialog-centered`}
|
|
398
405
|
style={{
|
|
399
|
-
zIndex:
|
|
406
|
+
zIndex: baseZIndex + 2,
|
|
400
407
|
}}
|
|
401
408
|
>
|
|
402
409
|
<div
|