react-responsive-modal 6.1.0 → 6.3.2
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/CHANGELOG.md +140 -0
- package/dist/index.d.ts +8 -0
- package/dist/react-responsive-modal.cjs.development.js +10 -5
- package/dist/react-responsive-modal.cjs.development.js.map +1 -1
- package/dist/react-responsive-modal.cjs.production.min.js +1 -1
- package/dist/react-responsive-modal.cjs.production.min.js.map +1 -1
- package/dist/react-responsive-modal.esm.js +10 -5
- package/dist/react-responsive-modal.esm.js.map +1 -1
- package/dist/useScrollLock.d.ts +1 -1
- package/package.json +3 -3
- package/src/index.tsx +12 -1
- package/src/useScrollLock.ts +4 -3
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
## [6.3.2](https://github.com/pradel/react-responsive-modal/compare/v6.3.1...v6.3.2) (2022-07-21)
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
### Miscellaneous
|
|
7
|
+
|
|
8
|
+
* fix publishing process ([2cec9a2](https://github.com/pradel/react-responsive-modal/commit/2cec9a28a4a2eff8de7de2d1550d0e9550824bbe))
|
|
9
|
+
|
|
10
|
+
### [6.3.1](https://www.github.com/pradel/react-responsive-modal/compare/v6.3.0...v6.3.1) (2022-04-25)
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
### Bug Fixes
|
|
14
|
+
|
|
15
|
+
* fix publishing process ([#492](https://www.github.com/pradel/react-responsive-modal/issues/492)) ([2ecd108](https://www.github.com/pradel/react-responsive-modal/commit/2ecd1084a0398a0ae0d7baa40b9b2b4e03f3d91c))
|
|
16
|
+
|
|
17
|
+
## [6.3.0](https://www.github.com/pradel/react-responsive-modal/compare/v6.2.0...v6.3.0) (2022-04-25)
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
### Features
|
|
21
|
+
|
|
22
|
+
* ability to specify id for container ([#489](https://www.github.com/pradel/react-responsive-modal/issues/489)) ([3e09b5c](https://www.github.com/pradel/react-responsive-modal/commit/3e09b5c668e5cbe6127c5b439d57a80a3d24bd33))
|
|
23
|
+
|
|
24
|
+
## [6.2.0](https://www.github.com/pradel/react-responsive-modal/compare/v6.1.0...v6.2.0) (2021-12-14)
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
### Features
|
|
28
|
+
|
|
29
|
+
* add optional reserveScrollBarGap ([#484](https://www.github.com/pradel/react-responsive-modal/issues/484)) ([69249f8](https://www.github.com/pradel/react-responsive-modal/commit/69249f8f97d02e4eaf07bedb52cb4ff1b1d4f636))
|
|
30
|
+
|
|
31
|
+
## [6.1.0](https://www.github.com/pradel/react-responsive-modal/compare/v6.0.1...v6.1.0) (2021-06-01)
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
### Features
|
|
35
|
+
|
|
36
|
+
* add options to set initial focus within modal ([#476](https://www.github.com/pradel/react-responsive-modal/issues/476)) ([5bdc362](https://www.github.com/pradel/react-responsive-modal/commit/5bdc362521a6db00030d723015c8abd2e76f19c7))
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
### Documentation
|
|
40
|
+
|
|
41
|
+
* fix typo in menu ([#473](https://www.github.com/pradel/react-responsive-modal/issues/473)) ([23cccc6](https://www.github.com/pradel/react-responsive-modal/commit/23cccc60a71342e3c122f968888118b911387056))
|
|
42
|
+
|
|
43
|
+
### [6.0.1](https://www.github.com/pradel/react-responsive-modal/compare/v6.0.0...v6.0.1) (2021-01-08)
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
### Bug Fixes
|
|
47
|
+
|
|
48
|
+
* **docs:** fix website dependencies ([222c6ed](https://www.github.com/pradel/react-responsive-modal/commit/222c6edef3851d2939a4fafa4d6c96e19ef35b1a))
|
|
49
|
+
* fix iOS problem with scroll not working in Safari ([#464](https://www.github.com/pradel/react-responsive-modal/issues/464)) ([0e38605](https://www.github.com/pradel/react-responsive-modal/commit/0e38605e37fa0e9d67ff5104e79fadfde5941bb0))
|
|
50
|
+
* fix release-script publishing script ([9347ad5](https://www.github.com/pradel/react-responsive-modal/commit/9347ad57d781aeca637b0527e89e34acd1cf6b3a))
|
|
51
|
+
* update changelogs path ([f6f3a65](https://www.github.com/pradel/react-responsive-modal/commit/f6f3a655b4d4a5ffc7f208684f439af9b20ef897))
|
|
52
|
+
* update README path ([fce1829](https://www.github.com/pradel/react-responsive-modal/commit/fce1829fe051ab5bef85811ad6d1d34d68bbfc5a))
|
|
53
|
+
|
|
54
|
+
|
|
55
|
+
### Miscellaneous
|
|
56
|
+
|
|
57
|
+
* remove unused dev dependencies ([38d2f1b](https://www.github.com/pradel/react-responsive-modal/commit/38d2f1bbda80641e857ce80ba71e995d8c44c438))
|
|
58
|
+
* upgrade yarn ([523536e](https://www.github.com/pradel/react-responsive-modal/commit/523536e783f82d69b8af0af9ec7dd2062af15349))
|
|
59
|
+
* uppdate release-please-action ([2172030](https://www.github.com/pradel/react-responsive-modal/commit/2172030427023c068644c71d8cbbe88c389ccf18))
|
|
60
|
+
|
|
61
|
+
## [6.0.0](https://www.github.com/pradel/react-responsive-modal/compare/v5.2.6...v6.0.0) (2020-11-15)
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
### ⚠ BREAKING CHANGES
|
|
65
|
+
|
|
66
|
+
* fix rendering issues in Safari, Firefox by changing the structure
|
|
67
|
+
|
|
68
|
+
### Features
|
|
69
|
+
|
|
70
|
+
* create E2E suite to test on real browser ([#449](https://www.github.com/pradel/react-responsive-modal/issues/449)) ([847ab1c](https://www.github.com/pradel/react-responsive-modal/commit/847ab1cac2044a6e11e3474f5fc34d7af69250bc))
|
|
71
|
+
* new documentation website ✨ ([#450](https://www.github.com/pradel/react-responsive-modal/issues/450)) ([3f620aa](https://www.github.com/pradel/react-responsive-modal/commit/3f620aa058c57ee251c968816a790a390edeba6e))
|
|
72
|
+
* switch project to monorepo ([#451](https://www.github.com/pradel/react-responsive-modal/issues/451)) ([ce59bad](https://www.github.com/pradel/react-responsive-modal/commit/ce59bad87178986bd1a87f80fd6a4489e066e614))
|
|
73
|
+
* upgrade focus-trap-js to support focus on radio elements ([#447](https://www.github.com/pradel/react-responsive-modal/issues/447)) ([d51f8e0](https://www.github.com/pradel/react-responsive-modal/commit/d51f8e06a81694b753d4e7777f5388bb05b69423))
|
|
74
|
+
* use body-scroll-lock instead of no-scroll ([#455](https://www.github.com/pradel/react-responsive-modal/issues/455)) ([033f901](https://www.github.com/pradel/react-responsive-modal/commit/033f9014b9951112da610435e0360f5ce463232b))
|
|
75
|
+
|
|
76
|
+
|
|
77
|
+
### Bug Fixes
|
|
78
|
+
|
|
79
|
+
* fix rendering issues in Safari, Firefox by changing the structure ([5727913](https://www.github.com/pradel/react-responsive-modal/commit/572791340fcc7b0f66e519fcbb7d4be9b998e088))
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
### Tests
|
|
83
|
+
|
|
84
|
+
* test that scroll is not blocked when blockScroll is false ([3d909b6](https://www.github.com/pradel/react-responsive-modal/commit/3d909b6c90261e6bd1a40de0a522ac4f85a487a8))
|
|
85
|
+
* test that scroll is unblocked when multiple modals are closed ([fba3593](https://www.github.com/pradel/react-responsive-modal/commit/fba35933ec6f270bbeb1fd779a6feef97b65bb82))
|
|
86
|
+
* test that scroll is unblocked when second modal has blockScroll set to false ([cf4b6b3](https://www.github.com/pradel/react-responsive-modal/commit/cf4b6b37ec55c24003d085cd5ad4d3bccc031bec))
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
### Miscellaneous
|
|
90
|
+
|
|
91
|
+
* delete `xmlns` prop from svg close icon ([#429](https://www.github.com/pradel/react-responsive-modal/issues/429)) ([8743327](https://www.github.com/pradel/react-responsive-modal/commit/87433278e10dc7077a7fddeaf6d2d088a3227bc9))
|
|
92
|
+
* use hook with modal manager ([#453](https://www.github.com/pradel/react-responsive-modal/issues/453)) ([b016ec4](https://www.github.com/pradel/react-responsive-modal/commit/b016ec41ff1208f0a56713c30734aae482abf3d6))
|
|
93
|
+
|
|
94
|
+
|
|
95
|
+
### Documentation
|
|
96
|
+
|
|
97
|
+
* **readme:** add integration tips ([4ad6d1d](https://www.github.com/pradel/react-responsive-modal/commit/4ad6d1d005fc441875cd680e4e42e1e0fb4b62cc))
|
|
98
|
+
* **readme:** remove dependencies badge ([5f7d0ad](https://www.github.com/pradel/react-responsive-modal/commit/5f7d0adc66783ed11b1bb0ed7610318c53dde17f))
|
|
99
|
+
* **readme:** remove example links ([9a06a62](https://www.github.com/pradel/react-responsive-modal/commit/9a06a62d7566380c74febf2b3d7a3e8b4268f71f))
|
|
100
|
+
* **readme:** update features ([ce05bd2](https://www.github.com/pradel/react-responsive-modal/commit/ce05bd2bab1605c14c4e63e8817bb81fd1aa35d4))
|
|
101
|
+
|
|
102
|
+
### [5.2.6](https://www.github.com/pradel/react-responsive-modal/compare/v5.2.5...v5.2.6) (2020-11-07)
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
### Miscellaneous
|
|
106
|
+
|
|
107
|
+
* fix publishing ([f024bd5](https://www.github.com/pradel/react-responsive-modal/commit/f024bd588ff315f440cc090eb90595d6f165fb98))
|
|
108
|
+
|
|
109
|
+
### [5.2.5](https://www.github.com/pradel/react-responsive-modal/compare/v5.2.4...v5.2.5) (2020-11-07)
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
### Miscellaneous
|
|
113
|
+
|
|
114
|
+
* fix build ([1a5f07c](https://www.github.com/pradel/react-responsive-modal/commit/1a5f07cb7a6f6682c01d487129309152e41b23c0))
|
|
115
|
+
|
|
116
|
+
### [5.2.4](https://www.github.com/pradel/react-responsive-modal/compare/v5.2.3...v5.2.4) (2020-11-07)
|
|
117
|
+
|
|
118
|
+
|
|
119
|
+
### Miscellaneous
|
|
120
|
+
|
|
121
|
+
* trigger release ([d14af23](https://www.github.com/pradel/react-responsive-modal/commit/d14af2334292d9aaf81385ccfdcd0b7ff506a7cb))
|
|
122
|
+
|
|
123
|
+
### [5.2.3](https://www.github.com/pradel/react-responsive-modal/compare/v5.2.2...v5.2.3) (2020-11-07)
|
|
124
|
+
|
|
125
|
+
|
|
126
|
+
### Miscellaneous
|
|
127
|
+
|
|
128
|
+
* upgrade dev dependencies ([6745a09](https://www.github.com/pradel/react-responsive-modal/commit/6745a09ddd26ac938f77615afc7ced8ff1703e62))
|
|
129
|
+
|
|
130
|
+
### [5.2.2](https://www.github.com/pradel/react-responsive-modal/compare/v5.2.1...v5.2.2) (2020-11-07)
|
|
131
|
+
|
|
132
|
+
|
|
133
|
+
### Bug Fixes
|
|
134
|
+
|
|
135
|
+
* fix closing modal via close icon ([#437](https://www.github.com/pradel/react-responsive-modal/issues/437)) ([f13ee4a](https://www.github.com/pradel/react-responsive-modal/commit/f13ee4abfce63b156f64a8cf5ea5ea50dfff4e19))
|
|
136
|
+
|
|
137
|
+
|
|
138
|
+
### Tests
|
|
139
|
+
|
|
140
|
+
* add tests for body scroll blocking ([#438](https://www.github.com/pradel/react-responsive-modal/issues/438)) ([f4077b8](https://www.github.com/pradel/react-responsive-modal/commit/f4077b8f0f24d9e4b12107d8ebe7382d5dafbfef))
|
package/dist/index.d.ts
CHANGED
|
@@ -106,6 +106,14 @@ export interface ModalProps {
|
|
|
106
106
|
* ARIA description for modal
|
|
107
107
|
*/
|
|
108
108
|
ariaDescribedby?: string;
|
|
109
|
+
/**
|
|
110
|
+
* Avoid unpleasant flickering effect when body overflow is hidden. For more information see https://www.npmjs.com/package/body-scroll-lock
|
|
111
|
+
*/
|
|
112
|
+
reserveScrollBarGap?: boolean;
|
|
113
|
+
/**
|
|
114
|
+
* id attribute for modal container
|
|
115
|
+
*/
|
|
116
|
+
containerId?: string;
|
|
109
117
|
/**
|
|
110
118
|
* id attribute for modal
|
|
111
119
|
*/
|
|
@@ -251,12 +251,14 @@ function useModalManager(ref, open) {
|
|
|
251
251
|
}, [open, ref]);
|
|
252
252
|
}
|
|
253
253
|
|
|
254
|
-
var useScrollLock = function useScrollLock(refModal, open, showPortal, blockScroll) {
|
|
254
|
+
var useScrollLock = function useScrollLock(refModal, open, showPortal, blockScroll, reserveScrollBarGap) {
|
|
255
255
|
var oldRef = React.useRef(null);
|
|
256
256
|
React.useEffect(function () {
|
|
257
257
|
if (open && refModal.current && blockScroll) {
|
|
258
258
|
oldRef.current = refModal.current;
|
|
259
|
-
bodyScrollLock.disableBodyScroll(refModal.current
|
|
259
|
+
bodyScrollLock.disableBodyScroll(refModal.current, {
|
|
260
|
+
reserveScrollBarGap: reserveScrollBarGap
|
|
261
|
+
});
|
|
260
262
|
}
|
|
261
263
|
|
|
262
264
|
return function () {
|
|
@@ -265,7 +267,7 @@ var useScrollLock = function useScrollLock(refModal, open, showPortal, blockScro
|
|
|
265
267
|
oldRef.current = null;
|
|
266
268
|
}
|
|
267
269
|
};
|
|
268
|
-
}, [open, showPortal, refModal]);
|
|
270
|
+
}, [open, showPortal, refModal, blockScroll, reserveScrollBarGap]);
|
|
269
271
|
};
|
|
270
272
|
|
|
271
273
|
var classes = {
|
|
@@ -308,12 +310,14 @@ var Modal = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
308
310
|
role = _ref$role === void 0 ? 'dialog' : _ref$role,
|
|
309
311
|
ariaDescribedby = _ref.ariaDescribedby,
|
|
310
312
|
ariaLabelledby = _ref.ariaLabelledby,
|
|
313
|
+
containerId = _ref.containerId,
|
|
311
314
|
modalId = _ref.modalId,
|
|
312
315
|
onClose = _ref.onClose,
|
|
313
316
|
onEscKeyDown = _ref.onEscKeyDown,
|
|
314
317
|
onOverlayClick = _ref.onOverlayClick,
|
|
315
318
|
onAnimationEnd = _ref.onAnimationEnd,
|
|
316
|
-
children = _ref.children
|
|
319
|
+
children = _ref.children,
|
|
320
|
+
reserveScrollBarGap = _ref.reserveScrollBarGap;
|
|
317
321
|
var refDialog = useForwardedRef(ref);
|
|
318
322
|
var refModal = React.useRef(null);
|
|
319
323
|
var refShouldClose = React.useRef(null);
|
|
@@ -333,7 +337,7 @@ var Modal = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
333
337
|
|
|
334
338
|
useModalManager(refModal, open); // Hook used to manage the scroll
|
|
335
339
|
|
|
336
|
-
useScrollLock(refModal, open, showPortal, blockScroll);
|
|
340
|
+
useScrollLock(refModal, open, showPortal, blockScroll, reserveScrollBarGap);
|
|
337
341
|
|
|
338
342
|
var handleOpen = function handleOpen() {
|
|
339
343
|
if (refContainer.current && !container && !document.body.contains(refContainer.current)) {
|
|
@@ -428,6 +432,7 @@ var Modal = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
|
428
432
|
}, styles == null ? void 0 : styles.overlay)
|
|
429
433
|
}), React__default.createElement("div", {
|
|
430
434
|
ref: refModal,
|
|
435
|
+
id: containerId,
|
|
431
436
|
className: cx(classes.modalContainer, center && classes.modalContainerCenter, classNames == null ? void 0 : classNames.modalContainer),
|
|
432
437
|
style: styles == null ? void 0 : styles.modalContainer,
|
|
433
438
|
"data-testid": "modal-container",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-responsive-modal.cjs.development.js","sources":["../src/CloseIcon.tsx","../src/utils.ts","../src/lib/focusTrapJs.ts","../src/FocusTrap.tsx","../src/modalManager.ts","../src/useScrollLock.ts","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\ninterface CloseIconProps {\n id?: string;\n closeIcon?: React.ReactNode;\n styles?: {\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n classNames?: {\n closeButton?: string;\n closeIcon?: string;\n };\n classes: {\n closeButton?: string;\n };\n onClick: () => void;\n}\n\nconst CloseIcon = ({\n classes,\n classNames,\n styles,\n id,\n closeIcon,\n onClick,\n}: CloseIconProps) => (\n <button\n id={id}\n className={cx(classes.closeButton, classNames?.closeButton)}\n style={styles?.closeButton}\n onClick={onClick}\n data-testid=\"close-button\"\n >\n {closeIcon ? (\n closeIcon\n ) : (\n <svg\n className={classNames?.closeIcon}\n style={styles?.closeIcon}\n width={28}\n height={28}\n viewBox=\"0 0 36 36\"\n data-testid=\"close-icon\"\n >\n <path d=\"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z\" />\n </svg>\n )}\n </button>\n);\n\nexport default CloseIcon;\n","export const isBrowser = typeof window !== 'undefined';\n","// https://github.com/alexandrzavalii/focus-trap-js/blob/master/src/index.js v1.1.0\n\nexport const candidateSelectors = [\n 'input',\n 'select',\n 'textarea',\n 'a[href]',\n 'button',\n '[tabindex]',\n 'audio[controls]',\n 'video[controls]',\n '[contenteditable]:not([contenteditable=\"false\"])',\n];\n\nfunction isHidden(node: any) {\n // offsetParent being null will allow detecting cases where an element is invisible or inside an invisible element,\n // as long as the element does not use position: fixed. For them, their visibility has to be checked directly as well.\n return (\n node.offsetParent === null || getComputedStyle(node).visibility === 'hidden'\n );\n}\n\nfunction getCheckedRadio(nodes: any, form: any) {\n for (var i = 0; i < nodes.length; i++) {\n if (nodes[i].checked && nodes[i].form === form) {\n return nodes[i];\n }\n }\n}\n\nfunction isNotRadioOrTabbableRadio(node: any) {\n if (node.tagName !== 'INPUT' || node.type !== 'radio' || !node.name) {\n return true;\n }\n var radioScope = node.form || node.ownerDocument;\n var radioSet = radioScope.querySelectorAll(\n 'input[type=\"radio\"][name=\"' + node.name + '\"]'\n );\n var checked = getCheckedRadio(radioSet, node.form);\n return checked === node || (checked === undefined && radioSet[0] === node);\n}\n\nexport function getAllTabbingElements(parentElem: any) {\n var currentActiveElement = document.activeElement;\n var tabbableNodes = parentElem.querySelectorAll(candidateSelectors.join(','));\n var onlyTabbable = [];\n for (var i = 0; i < tabbableNodes.length; i++) {\n var node = tabbableNodes[i];\n if (\n currentActiveElement === node ||\n (!node.disabled &&\n getTabindex(node) > -1 &&\n !isHidden(node) &&\n isNotRadioOrTabbableRadio(node))\n ) {\n onlyTabbable.push(node);\n }\n }\n return onlyTabbable;\n}\n\nexport function tabTrappingKey(event: any, parentElem: any) {\n // check if current event keyCode is tab\n if (!event || event.key !== 'Tab') return;\n\n if (!parentElem || !parentElem.contains) {\n if (process && process.env.NODE_ENV === 'development') {\n console.warn('focus-trap-js: parent element is not defined');\n }\n return false;\n }\n\n if (!parentElem.contains(event.target)) {\n return false;\n }\n\n var allTabbingElements = getAllTabbingElements(parentElem);\n var firstFocusableElement = allTabbingElements[0];\n var lastFocusableElement = allTabbingElements[allTabbingElements.length - 1];\n\n if (event.shiftKey && event.target === firstFocusableElement) {\n lastFocusableElement.focus();\n event.preventDefault();\n return true;\n } else if (!event.shiftKey && event.target === lastFocusableElement) {\n firstFocusableElement.focus();\n event.preventDefault();\n return true;\n }\n return false;\n}\n\nfunction getTabindex(node: any) {\n var tabindexAttr = parseInt(node.getAttribute('tabindex'), 10);\n\n if (!isNaN(tabindexAttr)) return tabindexAttr;\n // Browsers do not return tabIndex correctly for contentEditable nodes;\n // so if they don't have a tabindex attribute specifically set, assume it's 0.\n\n if (isContentEditable(node)) return 0;\n return node.tabIndex;\n}\n\nfunction isContentEditable(node: any) {\n return node.getAttribute('contentEditable');\n}\n","import { useEffect, useRef } from 'react';\nimport { isBrowser } from './utils';\nimport {\n tabTrappingKey,\n candidateSelectors,\n getAllTabbingElements,\n} from './lib/focusTrapJs';\n\ninterface FocusTrapProps {\n container?: React.RefObject<HTMLElement> | null;\n initialFocusRef?: React.RefObject<HTMLElement>;\n}\n\nexport const FocusTrap = ({ container, initialFocusRef }: FocusTrapProps) => {\n const refLastFocus = useRef<HTMLElement | null>();\n /**\n * Handle focus lock on the modal\n */\n useEffect(() => {\n const handleKeyEvent = (event: KeyboardEvent) => {\n if (container?.current) {\n tabTrappingKey(event, container.current);\n }\n };\n\n if (isBrowser) {\n document.addEventListener('keydown', handleKeyEvent);\n }\n // On mount we focus on the first focusable element in the modal if there is one\n if (isBrowser && container?.current) {\n const savePreviousFocus = () => {\n // First we save the last focused element\n // only if it's a focusable element\n if (\n candidateSelectors.findIndex((selector) =>\n document.activeElement?.matches(selector)\n ) !== -1\n ) {\n refLastFocus.current = document.activeElement as HTMLElement;\n }\n };\n\n if (initialFocusRef) {\n savePreviousFocus();\n // We need to schedule focusing on a next frame - this allows to focus on the modal root\n requestAnimationFrame(() => {\n initialFocusRef.current?.focus();\n });\n } else {\n const allTabbingElements = getAllTabbingElements(container.current);\n if (allTabbingElements[0]) {\n savePreviousFocus();\n allTabbingElements[0].focus();\n }\n }\n }\n return () => {\n if (isBrowser) {\n document.removeEventListener('keydown', handleKeyEvent);\n // On unmount we restore the focus to the last focused element\n refLastFocus.current?.focus();\n }\n };\n }, [container, initialFocusRef]);\n\n return null;\n};\n","import { Ref, useEffect } from 'react';\n\nlet modals: Ref<Element>[] = [];\n\n/**\n * Handle the order of the modals.\n * Inspired by the material-ui implementation.\n */\nexport const modalManager = {\n /**\n * Register a new modal\n */\n add: (newModal: Ref<Element>) => {\n modals.push(newModal);\n },\n\n /**\n * Remove a modal\n */\n remove: (oldModal: Ref<Element>) => {\n modals = modals.filter((modal) => modal !== oldModal);\n },\n\n /**\n * When multiple modals are rendered will return true if current modal is the last one\n */\n isTopModal: (modal: Ref<Element>) =>\n !!modals.length && modals[modals.length - 1] === modal,\n};\n\nexport function useModalManager(ref: Ref<Element>, open: boolean) {\n useEffect(() => {\n if (open) {\n modalManager.add(ref);\n }\n return () => {\n modalManager.remove(ref);\n };\n }, [open, ref]);\n}\n","import { useEffect, useRef } from 'react';\nimport { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';\n\nexport const useScrollLock = (\n refModal: React.RefObject<Element>,\n open: boolean,\n showPortal: boolean,\n blockScroll: boolean\n) => {\n const oldRef = useRef<Element | null>(null);\n\n useEffect(() => {\n if (open && refModal.current && blockScroll) {\n oldRef.current = refModal.current;\n disableBodyScroll(refModal.current);\n }\n return () => {\n if (oldRef.current) {\n enableBodyScroll(oldRef.current);\n oldRef.current = null;\n }\n };\n }, [open, showPortal, refModal]);\n};\n","import React, { useEffect, useRef, useState } from 'react';\nimport ReactDom from 'react-dom';\nimport cx from 'classnames';\nimport CloseIcon from './CloseIcon';\nimport { FocusTrap } from './FocusTrap';\nimport { modalManager, useModalManager } from './modalManager';\nimport { useScrollLock } from './useScrollLock';\nimport { isBrowser } from './utils';\nimport useForwardedRef from '@bedrock-layout/use-forwarded-ref';\n\nconst classes = {\n root: 'react-responsive-modal-root',\n overlay: 'react-responsive-modal-overlay',\n overlayAnimationIn: 'react-responsive-modal-overlay-in',\n overlayAnimationOut: 'react-responsive-modal-overlay-out',\n modalContainer: 'react-responsive-modal-container',\n modalContainerCenter: 'react-responsive-modal-containerCenter',\n modal: 'react-responsive-modal-modal',\n modalAnimationIn: 'react-responsive-modal-modal-in',\n modalAnimationOut: 'react-responsive-modal-modal-out',\n closeButton: 'react-responsive-modal-closeButton',\n};\n\nexport interface ModalProps {\n /**\n * Control if the modal is open or not.\n */\n open: boolean;\n /**\n * Should the dialog be centered.\n *\n * Default to false.\n */\n center?: boolean;\n /**\n * Is the modal closable when user press esc key.\n *\n * Default to true.\n */\n closeOnEsc?: boolean;\n /**\n * Is the modal closable when user click on overlay.\n *\n * Default to true.\n */\n closeOnOverlayClick?: boolean;\n /**\n * Whether to block scrolling when dialog is open.\n *\n * Default to true.\n */\n blockScroll?: boolean;\n /**\n * Show the close icon.\n *\n * Default to true.\n */\n showCloseIcon?: boolean;\n /**\n * id attribute for the close icon button.\n */\n closeIconId?: string;\n /**\n * Custom icon to render (svg, img, etc...).\n */\n closeIcon?: React.ReactNode;\n /**\n * When the modal is open, trap focus within it.\n *\n * Default to true.\n */\n focusTrapped?: boolean;\n /**\n * Element to focus when focus trap is used.\n *\n * Default to undefined.\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /**\n * You can specify a container prop which should be of type `Element`.\n * The portal will be rendered inside that element.\n * The default behavior will create a div node and render it at the at the end of document.body.\n */\n container?: Element | null;\n /**\n * An object containing classNames to style the modal.\n */\n classNames?: {\n root?: string;\n overlay?: string;\n overlayAnimationIn?: string;\n overlayAnimationOut?: string;\n modalContainer?: string;\n modal?: string;\n modalAnimationIn?: string;\n modalAnimationOut?: string;\n closeButton?: string;\n closeIcon?: string;\n };\n /**\n * An object containing the styles objects to style the modal.\n */\n styles?: {\n root?: React.CSSProperties;\n overlay?: React.CSSProperties;\n modalContainer?: React.CSSProperties;\n modal?: React.CSSProperties;\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n /**\n * Animation duration in milliseconds.\n *\n * Default to 300.\n */\n animationDuration?: number;\n /**\n * ARIA role for modal\n *\n * Default to 'dialog'.\n */\n role?: string;\n /**\n * ARIA label for modal\n */\n ariaLabelledby?: string;\n /**\n * ARIA description for modal\n */\n ariaDescribedby?: string;\n /**\n * id attribute for modal\n */\n modalId?: string;\n /**\n * Callback fired when the Modal is requested to be closed by a click on the overlay or when user press esc key.\n */\n onClose: () => void;\n /**\n * Callback fired when the escape key is pressed.\n */\n onEscKeyDown?: (event: KeyboardEvent) => void;\n /**\n * Callback fired when the overlay is clicked.\n */\n onOverlayClick?: (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => void;\n /**\n * Callback fired when the Modal has exited and the animation is finished.\n */\n onAnimationEnd?: () => void;\n children?: React.ReactNode;\n}\n\nexport const Modal = React.forwardRef(\n (\n {\n open,\n center,\n blockScroll = true,\n closeOnEsc = true,\n closeOnOverlayClick = true,\n container,\n showCloseIcon = true,\n closeIconId,\n closeIcon,\n focusTrapped = true,\n initialFocusRef = undefined,\n animationDuration = 300,\n classNames,\n styles,\n role = 'dialog',\n ariaDescribedby,\n ariaLabelledby,\n modalId,\n onClose,\n onEscKeyDown,\n onOverlayClick,\n onAnimationEnd,\n children,\n }: ModalProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const refDialog = useForwardedRef(ref);\n const refModal = useRef<HTMLDivElement>(null);\n const refShouldClose = useRef<boolean | null>(null);\n const refContainer = useRef<HTMLDivElement | null>(null);\n // Lazily create the ref instance\n // https://reactjs.org/docs/hooks-faq.html#how-to-create-expensive-objects-lazily\n if (refContainer.current === null && isBrowser) {\n refContainer.current = document.createElement('div');\n }\n\n // The value should be false for srr, that way when the component is hydrated client side,\n // it will match the server rendered content\n const [showPortal, setShowPortal] = useState(false);\n\n // Hook used to manage multiple modals opened at the same time\n useModalManager(refModal, open);\n\n // Hook used to manage the scroll\n useScrollLock(refModal, open, showPortal, blockScroll);\n\n const handleOpen = () => {\n if (\n refContainer.current &&\n !container &&\n !document.body.contains(refContainer.current)\n ) {\n document.body.appendChild(refContainer.current);\n }\n\n document.addEventListener('keydown', handleKeydown);\n };\n\n const handleClose = () => {\n if (\n refContainer.current &&\n !container &&\n document.body.contains(refContainer.current)\n ) {\n document.body.removeChild(refContainer.current);\n }\n document.removeEventListener('keydown', handleKeydown);\n };\n\n const handleKeydown = (event: KeyboardEvent) => {\n // Only the last modal need to be escaped when pressing the esc key\n if (event.keyCode !== 27 || !modalManager.isTopModal(refModal)) {\n return;\n }\n\n onEscKeyDown?.(event);\n\n if (closeOnEsc) {\n onClose();\n }\n };\n\n useEffect(() => {\n return () => {\n if (showPortal) {\n // When the modal is closed or removed directly, cleanup the listeners\n handleClose();\n }\n };\n }, [showPortal]);\n\n useEffect(() => {\n // If the open prop is changing, we need to open the modal\n // This is also called on the first render if the open prop is true when the modal is created\n if (open && !showPortal) {\n setShowPortal(true);\n handleOpen();\n }\n }, [open]);\n\n const handleClickOverlay = (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => {\n if (refShouldClose.current === null) {\n refShouldClose.current = true;\n }\n\n if (!refShouldClose.current) {\n refShouldClose.current = null;\n return;\n }\n\n onOverlayClick?.(event);\n\n if (closeOnOverlayClick) {\n onClose();\n }\n\n refShouldClose.current = null;\n };\n\n const handleModalEvent = () => {\n refShouldClose.current = false;\n };\n\n const handleAnimationEnd = () => {\n if (!open) {\n setShowPortal(false);\n }\n\n onAnimationEnd?.();\n };\n\n const containerModal = container || refContainer.current;\n\n const overlayAnimation = open\n ? classNames?.overlayAnimationIn ?? classes.overlayAnimationIn\n : classNames?.overlayAnimationOut ?? classes.overlayAnimationOut;\n\n const modalAnimation = open\n ? classNames?.modalAnimationIn ?? classes.modalAnimationIn\n : classNames?.modalAnimationOut ?? classes.modalAnimationOut;\n\n return showPortal && containerModal\n ? ReactDom.createPortal(\n <div\n className={cx(classes.root, classNames?.root)}\n style={styles?.root}\n data-testid=\"root\"\n >\n <div\n className={cx(classes.overlay, classNames?.overlay)}\n data-testid=\"overlay\"\n aria-hidden={true}\n style={{\n animation: `${overlayAnimation} ${animationDuration}ms`,\n ...styles?.overlay,\n }}\n />\n <div\n ref={refModal}\n className={cx(\n classes.modalContainer,\n center && classes.modalContainerCenter,\n classNames?.modalContainer\n )}\n style={styles?.modalContainer}\n data-testid=\"modal-container\"\n onClick={handleClickOverlay}\n >\n <div\n ref={refDialog}\n className={cx(classes.modal, classNames?.modal)}\n style={{\n animation: `${modalAnimation} ${animationDuration}ms`,\n ...styles?.modal,\n }}\n onMouseDown={handleModalEvent}\n onMouseUp={handleModalEvent}\n onClick={handleModalEvent}\n onAnimationEnd={handleAnimationEnd}\n id={modalId}\n role={role}\n aria-modal=\"true\"\n aria-labelledby={ariaLabelledby}\n aria-describedby={ariaDescribedby}\n data-testid=\"modal\"\n tabIndex={-1}\n >\n {focusTrapped && (\n <FocusTrap\n container={refDialog}\n initialFocusRef={initialFocusRef}\n />\n )}\n {children}\n {showCloseIcon && (\n <CloseIcon\n classes={classes}\n classNames={classNames}\n styles={styles}\n closeIcon={closeIcon}\n onClick={onClose}\n id={closeIconId}\n />\n )}\n </div>\n </div>\n </div>,\n containerModal\n )\n : null;\n }\n);\n\nexport default Modal;\n"],"names":["CloseIcon","classes","classNames","styles","id","closeIcon","onClick","React","className","cx","closeButton","style","width","height","viewBox","d","isBrowser","window","candidateSelectors","isHidden","node","offsetParent","getComputedStyle","visibility","getCheckedRadio","nodes","form","i","length","checked","isNotRadioOrTabbableRadio","tagName","type","name","radioScope","ownerDocument","radioSet","querySelectorAll","undefined","getAllTabbingElements","parentElem","currentActiveElement","document","activeElement","tabbableNodes","join","onlyTabbable","disabled","getTabindex","push","tabTrappingKey","event","key","contains","process","console","warn","target","allTabbingElements","firstFocusableElement","lastFocusableElement","shiftKey","focus","preventDefault","tabindexAttr","parseInt","getAttribute","isNaN","isContentEditable","tabIndex","FocusTrap","container","initialFocusRef","refLastFocus","useRef","useEffect","handleKeyEvent","current","addEventListener","savePreviousFocus","findIndex","selector","matches","requestAnimationFrame","removeEventListener","modals","modalManager","add","newModal","remove","oldModal","filter","modal","isTopModal","useModalManager","ref","open","useScrollLock","refModal","showPortal","blockScroll","oldRef","disableBodyScroll","enableBodyScroll","root","overlay","overlayAnimationIn","overlayAnimationOut","modalContainer","modalContainerCenter","modalAnimationIn","modalAnimationOut","Modal","forwardRef","center","closeOnEsc","closeOnOverlayClick","showCloseIcon","closeIconId","focusTrapped","animationDuration","role","ariaDescribedby","ariaLabelledby","modalId","onClose","onEscKeyDown","onOverlayClick","onAnimationEnd","children","refDialog","useForwardedRef","refShouldClose","refContainer","createElement","useState","setShowPortal","handleOpen","body","appendChild","handleKeydown","handleClose","removeChild","keyCode","handleClickOverlay","handleModalEvent","handleAnimationEnd","containerModal","overlayAnimation","modalAnimation","ReactDom","createPortal","animation","onMouseDown","onMouseUp"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-responsive-modal.cjs.development.js","sources":["../src/CloseIcon.tsx","../src/utils.ts","../src/lib/focusTrapJs.ts","../src/FocusTrap.tsx","../src/modalManager.ts","../src/useScrollLock.ts","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\ninterface CloseIconProps {\n id?: string;\n closeIcon?: React.ReactNode;\n styles?: {\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n classNames?: {\n closeButton?: string;\n closeIcon?: string;\n };\n classes: {\n closeButton?: string;\n };\n onClick: () => void;\n}\n\nconst CloseIcon = ({\n classes,\n classNames,\n styles,\n id,\n closeIcon,\n onClick,\n}: CloseIconProps) => (\n <button\n id={id}\n className={cx(classes.closeButton, classNames?.closeButton)}\n style={styles?.closeButton}\n onClick={onClick}\n data-testid=\"close-button\"\n >\n {closeIcon ? (\n closeIcon\n ) : (\n <svg\n className={classNames?.closeIcon}\n style={styles?.closeIcon}\n width={28}\n height={28}\n viewBox=\"0 0 36 36\"\n data-testid=\"close-icon\"\n >\n <path d=\"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z\" />\n </svg>\n )}\n </button>\n);\n\nexport default CloseIcon;\n","export const isBrowser = typeof window !== 'undefined';\n","// https://github.com/alexandrzavalii/focus-trap-js/blob/master/src/index.js v1.1.0\n\nexport const candidateSelectors = [\n 'input',\n 'select',\n 'textarea',\n 'a[href]',\n 'button',\n '[tabindex]',\n 'audio[controls]',\n 'video[controls]',\n '[contenteditable]:not([contenteditable=\"false\"])',\n];\n\nfunction isHidden(node: any) {\n // offsetParent being null will allow detecting cases where an element is invisible or inside an invisible element,\n // as long as the element does not use position: fixed. For them, their visibility has to be checked directly as well.\n return (\n node.offsetParent === null || getComputedStyle(node).visibility === 'hidden'\n );\n}\n\nfunction getCheckedRadio(nodes: any, form: any) {\n for (var i = 0; i < nodes.length; i++) {\n if (nodes[i].checked && nodes[i].form === form) {\n return nodes[i];\n }\n }\n}\n\nfunction isNotRadioOrTabbableRadio(node: any) {\n if (node.tagName !== 'INPUT' || node.type !== 'radio' || !node.name) {\n return true;\n }\n var radioScope = node.form || node.ownerDocument;\n var radioSet = radioScope.querySelectorAll(\n 'input[type=\"radio\"][name=\"' + node.name + '\"]'\n );\n var checked = getCheckedRadio(radioSet, node.form);\n return checked === node || (checked === undefined && radioSet[0] === node);\n}\n\nexport function getAllTabbingElements(parentElem: any) {\n var currentActiveElement = document.activeElement;\n var tabbableNodes = parentElem.querySelectorAll(candidateSelectors.join(','));\n var onlyTabbable = [];\n for (var i = 0; i < tabbableNodes.length; i++) {\n var node = tabbableNodes[i];\n if (\n currentActiveElement === node ||\n (!node.disabled &&\n getTabindex(node) > -1 &&\n !isHidden(node) &&\n isNotRadioOrTabbableRadio(node))\n ) {\n onlyTabbable.push(node);\n }\n }\n return onlyTabbable;\n}\n\nexport function tabTrappingKey(event: any, parentElem: any) {\n // check if current event keyCode is tab\n if (!event || event.key !== 'Tab') return;\n\n if (!parentElem || !parentElem.contains) {\n if (process && process.env.NODE_ENV === 'development') {\n console.warn('focus-trap-js: parent element is not defined');\n }\n return false;\n }\n\n if (!parentElem.contains(event.target)) {\n return false;\n }\n\n var allTabbingElements = getAllTabbingElements(parentElem);\n var firstFocusableElement = allTabbingElements[0];\n var lastFocusableElement = allTabbingElements[allTabbingElements.length - 1];\n\n if (event.shiftKey && event.target === firstFocusableElement) {\n lastFocusableElement.focus();\n event.preventDefault();\n return true;\n } else if (!event.shiftKey && event.target === lastFocusableElement) {\n firstFocusableElement.focus();\n event.preventDefault();\n return true;\n }\n return false;\n}\n\nfunction getTabindex(node: any) {\n var tabindexAttr = parseInt(node.getAttribute('tabindex'), 10);\n\n if (!isNaN(tabindexAttr)) return tabindexAttr;\n // Browsers do not return tabIndex correctly for contentEditable nodes;\n // so if they don't have a tabindex attribute specifically set, assume it's 0.\n\n if (isContentEditable(node)) return 0;\n return node.tabIndex;\n}\n\nfunction isContentEditable(node: any) {\n return node.getAttribute('contentEditable');\n}\n","import { useEffect, useRef } from 'react';\nimport { isBrowser } from './utils';\nimport {\n tabTrappingKey,\n candidateSelectors,\n getAllTabbingElements,\n} from './lib/focusTrapJs';\n\ninterface FocusTrapProps {\n container?: React.RefObject<HTMLElement> | null;\n initialFocusRef?: React.RefObject<HTMLElement>;\n}\n\nexport const FocusTrap = ({ container, initialFocusRef }: FocusTrapProps) => {\n const refLastFocus = useRef<HTMLElement | null>();\n /**\n * Handle focus lock on the modal\n */\n useEffect(() => {\n const handleKeyEvent = (event: KeyboardEvent) => {\n if (container?.current) {\n tabTrappingKey(event, container.current);\n }\n };\n\n if (isBrowser) {\n document.addEventListener('keydown', handleKeyEvent);\n }\n // On mount we focus on the first focusable element in the modal if there is one\n if (isBrowser && container?.current) {\n const savePreviousFocus = () => {\n // First we save the last focused element\n // only if it's a focusable element\n if (\n candidateSelectors.findIndex((selector) =>\n document.activeElement?.matches(selector)\n ) !== -1\n ) {\n refLastFocus.current = document.activeElement as HTMLElement;\n }\n };\n\n if (initialFocusRef) {\n savePreviousFocus();\n // We need to schedule focusing on a next frame - this allows to focus on the modal root\n requestAnimationFrame(() => {\n initialFocusRef.current?.focus();\n });\n } else {\n const allTabbingElements = getAllTabbingElements(container.current);\n if (allTabbingElements[0]) {\n savePreviousFocus();\n allTabbingElements[0].focus();\n }\n }\n }\n return () => {\n if (isBrowser) {\n document.removeEventListener('keydown', handleKeyEvent);\n // On unmount we restore the focus to the last focused element\n refLastFocus.current?.focus();\n }\n };\n }, [container, initialFocusRef]);\n\n return null;\n};\n","import { Ref, useEffect } from 'react';\n\nlet modals: Ref<Element>[] = [];\n\n/**\n * Handle the order of the modals.\n * Inspired by the material-ui implementation.\n */\nexport const modalManager = {\n /**\n * Register a new modal\n */\n add: (newModal: Ref<Element>) => {\n modals.push(newModal);\n },\n\n /**\n * Remove a modal\n */\n remove: (oldModal: Ref<Element>) => {\n modals = modals.filter((modal) => modal !== oldModal);\n },\n\n /**\n * When multiple modals are rendered will return true if current modal is the last one\n */\n isTopModal: (modal: Ref<Element>) =>\n !!modals.length && modals[modals.length - 1] === modal,\n};\n\nexport function useModalManager(ref: Ref<Element>, open: boolean) {\n useEffect(() => {\n if (open) {\n modalManager.add(ref);\n }\n return () => {\n modalManager.remove(ref);\n };\n }, [open, ref]);\n}\n","import { useEffect, useRef } from 'react';\nimport { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';\n\nexport const useScrollLock = (\n refModal: React.RefObject<Element>,\n open: boolean,\n showPortal: boolean,\n blockScroll: boolean,\n reserveScrollBarGap?: boolean\n) => {\n const oldRef = useRef<Element | null>(null);\n\n useEffect(() => {\n if (open && refModal.current && blockScroll) {\n oldRef.current = refModal.current;\n disableBodyScroll(refModal.current, { reserveScrollBarGap });\n }\n return () => {\n if (oldRef.current) {\n enableBodyScroll(oldRef.current);\n oldRef.current = null;\n }\n };\n }, [open, showPortal, refModal, blockScroll, reserveScrollBarGap]);\n};\n","import React, { useEffect, useRef, useState } from 'react';\nimport ReactDom from 'react-dom';\nimport cx from 'classnames';\nimport CloseIcon from './CloseIcon';\nimport { FocusTrap } from './FocusTrap';\nimport { modalManager, useModalManager } from './modalManager';\nimport { useScrollLock } from './useScrollLock';\nimport { isBrowser } from './utils';\nimport useForwardedRef from '@bedrock-layout/use-forwarded-ref';\n\nconst classes = {\n root: 'react-responsive-modal-root',\n overlay: 'react-responsive-modal-overlay',\n overlayAnimationIn: 'react-responsive-modal-overlay-in',\n overlayAnimationOut: 'react-responsive-modal-overlay-out',\n modalContainer: 'react-responsive-modal-container',\n modalContainerCenter: 'react-responsive-modal-containerCenter',\n modal: 'react-responsive-modal-modal',\n modalAnimationIn: 'react-responsive-modal-modal-in',\n modalAnimationOut: 'react-responsive-modal-modal-out',\n closeButton: 'react-responsive-modal-closeButton',\n};\n\nexport interface ModalProps {\n /**\n * Control if the modal is open or not.\n */\n open: boolean;\n /**\n * Should the dialog be centered.\n *\n * Default to false.\n */\n center?: boolean;\n /**\n * Is the modal closable when user press esc key.\n *\n * Default to true.\n */\n closeOnEsc?: boolean;\n /**\n * Is the modal closable when user click on overlay.\n *\n * Default to true.\n */\n closeOnOverlayClick?: boolean;\n /**\n * Whether to block scrolling when dialog is open.\n *\n * Default to true.\n */\n blockScroll?: boolean;\n /**\n * Show the close icon.\n *\n * Default to true.\n */\n showCloseIcon?: boolean;\n /**\n * id attribute for the close icon button.\n */\n closeIconId?: string;\n /**\n * Custom icon to render (svg, img, etc...).\n */\n closeIcon?: React.ReactNode;\n /**\n * When the modal is open, trap focus within it.\n *\n * Default to true.\n */\n focusTrapped?: boolean;\n /**\n * Element to focus when focus trap is used.\n *\n * Default to undefined.\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /**\n * You can specify a container prop which should be of type `Element`.\n * The portal will be rendered inside that element.\n * The default behavior will create a div node and render it at the at the end of document.body.\n */\n container?: Element | null;\n /**\n * An object containing classNames to style the modal.\n */\n classNames?: {\n root?: string;\n overlay?: string;\n overlayAnimationIn?: string;\n overlayAnimationOut?: string;\n modalContainer?: string;\n modal?: string;\n modalAnimationIn?: string;\n modalAnimationOut?: string;\n closeButton?: string;\n closeIcon?: string;\n };\n /**\n * An object containing the styles objects to style the modal.\n */\n styles?: {\n root?: React.CSSProperties;\n overlay?: React.CSSProperties;\n modalContainer?: React.CSSProperties;\n modal?: React.CSSProperties;\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n /**\n * Animation duration in milliseconds.\n *\n * Default to 300.\n */\n animationDuration?: number;\n /**\n * ARIA role for modal\n *\n * Default to 'dialog'.\n */\n role?: string;\n /**\n * ARIA label for modal\n */\n ariaLabelledby?: string;\n /**\n * ARIA description for modal\n */\n ariaDescribedby?: string;\n /**\n * Avoid unpleasant flickering effect when body overflow is hidden. For more information see https://www.npmjs.com/package/body-scroll-lock\n */\n reserveScrollBarGap?: boolean;\n /**\n * id attribute for modal container\n */\n containerId?: string;\n /**\n * id attribute for modal\n */\n modalId?: string;\n /**\n * Callback fired when the Modal is requested to be closed by a click on the overlay or when user press esc key.\n */\n onClose: () => void;\n /**\n * Callback fired when the escape key is pressed.\n */\n onEscKeyDown?: (event: KeyboardEvent) => void;\n /**\n * Callback fired when the overlay is clicked.\n */\n onOverlayClick?: (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => void;\n /**\n * Callback fired when the Modal has exited and the animation is finished.\n */\n onAnimationEnd?: () => void;\n children?: React.ReactNode;\n}\n\nexport const Modal = React.forwardRef(\n (\n {\n open,\n center,\n blockScroll = true,\n closeOnEsc = true,\n closeOnOverlayClick = true,\n container,\n showCloseIcon = true,\n closeIconId,\n closeIcon,\n focusTrapped = true,\n initialFocusRef = undefined,\n animationDuration = 300,\n classNames,\n styles,\n role = 'dialog',\n ariaDescribedby,\n ariaLabelledby,\n containerId,\n modalId,\n onClose,\n onEscKeyDown,\n onOverlayClick,\n onAnimationEnd,\n children,\n reserveScrollBarGap,\n }: ModalProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const refDialog = useForwardedRef(ref);\n const refModal = useRef<HTMLDivElement>(null);\n const refShouldClose = useRef<boolean | null>(null);\n const refContainer = useRef<HTMLDivElement | null>(null);\n // Lazily create the ref instance\n // https://reactjs.org/docs/hooks-faq.html#how-to-create-expensive-objects-lazily\n if (refContainer.current === null && isBrowser) {\n refContainer.current = document.createElement('div');\n }\n\n // The value should be false for srr, that way when the component is hydrated client side,\n // it will match the server rendered content\n const [showPortal, setShowPortal] = useState(false);\n\n // Hook used to manage multiple modals opened at the same time\n useModalManager(refModal, open);\n\n // Hook used to manage the scroll\n useScrollLock(refModal, open, showPortal, blockScroll, reserveScrollBarGap);\n\n const handleOpen = () => {\n if (\n refContainer.current &&\n !container &&\n !document.body.contains(refContainer.current)\n ) {\n document.body.appendChild(refContainer.current);\n }\n\n document.addEventListener('keydown', handleKeydown);\n };\n\n const handleClose = () => {\n if (\n refContainer.current &&\n !container &&\n document.body.contains(refContainer.current)\n ) {\n document.body.removeChild(refContainer.current);\n }\n document.removeEventListener('keydown', handleKeydown);\n };\n\n const handleKeydown = (event: KeyboardEvent) => {\n // Only the last modal need to be escaped when pressing the esc key\n if (event.keyCode !== 27 || !modalManager.isTopModal(refModal)) {\n return;\n }\n\n onEscKeyDown?.(event);\n\n if (closeOnEsc) {\n onClose();\n }\n };\n\n useEffect(() => {\n return () => {\n if (showPortal) {\n // When the modal is closed or removed directly, cleanup the listeners\n handleClose();\n }\n };\n }, [showPortal]);\n\n useEffect(() => {\n // If the open prop is changing, we need to open the modal\n // This is also called on the first render if the open prop is true when the modal is created\n if (open && !showPortal) {\n setShowPortal(true);\n handleOpen();\n }\n }, [open]);\n\n const handleClickOverlay = (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => {\n if (refShouldClose.current === null) {\n refShouldClose.current = true;\n }\n\n if (!refShouldClose.current) {\n refShouldClose.current = null;\n return;\n }\n\n onOverlayClick?.(event);\n\n if (closeOnOverlayClick) {\n onClose();\n }\n\n refShouldClose.current = null;\n };\n\n const handleModalEvent = () => {\n refShouldClose.current = false;\n };\n\n const handleAnimationEnd = () => {\n if (!open) {\n setShowPortal(false);\n }\n\n onAnimationEnd?.();\n };\n\n const containerModal = container || refContainer.current;\n\n const overlayAnimation = open\n ? classNames?.overlayAnimationIn ?? classes.overlayAnimationIn\n : classNames?.overlayAnimationOut ?? classes.overlayAnimationOut;\n\n const modalAnimation = open\n ? classNames?.modalAnimationIn ?? classes.modalAnimationIn\n : classNames?.modalAnimationOut ?? classes.modalAnimationOut;\n\n return showPortal && containerModal\n ? ReactDom.createPortal(\n <div\n className={cx(classes.root, classNames?.root)}\n style={styles?.root}\n data-testid=\"root\"\n >\n <div\n className={cx(classes.overlay, classNames?.overlay)}\n data-testid=\"overlay\"\n aria-hidden={true}\n style={{\n animation: `${overlayAnimation} ${animationDuration}ms`,\n ...styles?.overlay,\n }}\n />\n <div\n ref={refModal}\n id={containerId}\n className={cx(\n classes.modalContainer,\n center && classes.modalContainerCenter,\n classNames?.modalContainer\n )}\n style={styles?.modalContainer}\n data-testid=\"modal-container\"\n onClick={handleClickOverlay}\n >\n <div\n ref={refDialog}\n className={cx(classes.modal, classNames?.modal)}\n style={{\n animation: `${modalAnimation} ${animationDuration}ms`,\n ...styles?.modal,\n }}\n onMouseDown={handleModalEvent}\n onMouseUp={handleModalEvent}\n onClick={handleModalEvent}\n onAnimationEnd={handleAnimationEnd}\n id={modalId}\n role={role}\n aria-modal=\"true\"\n aria-labelledby={ariaLabelledby}\n aria-describedby={ariaDescribedby}\n data-testid=\"modal\"\n tabIndex={-1}\n >\n {focusTrapped && (\n <FocusTrap\n container={refDialog}\n initialFocusRef={initialFocusRef}\n />\n )}\n {children}\n {showCloseIcon && (\n <CloseIcon\n classes={classes}\n classNames={classNames}\n styles={styles}\n closeIcon={closeIcon}\n onClick={onClose}\n id={closeIconId}\n />\n )}\n </div>\n </div>\n </div>,\n containerModal\n )\n : null;\n }\n);\n\nexport default Modal;\n"],"names":["CloseIcon","classes","classNames","styles","id","closeIcon","onClick","React","className","cx","closeButton","style","width","height","viewBox","d","isBrowser","window","candidateSelectors","isHidden","node","offsetParent","getComputedStyle","visibility","getCheckedRadio","nodes","form","i","length","checked","isNotRadioOrTabbableRadio","tagName","type","name","radioScope","ownerDocument","radioSet","querySelectorAll","undefined","getAllTabbingElements","parentElem","currentActiveElement","document","activeElement","tabbableNodes","join","onlyTabbable","disabled","getTabindex","push","tabTrappingKey","event","key","contains","process","console","warn","target","allTabbingElements","firstFocusableElement","lastFocusableElement","shiftKey","focus","preventDefault","tabindexAttr","parseInt","getAttribute","isNaN","isContentEditable","tabIndex","FocusTrap","container","initialFocusRef","refLastFocus","useRef","useEffect","handleKeyEvent","current","addEventListener","savePreviousFocus","findIndex","selector","matches","requestAnimationFrame","removeEventListener","modals","modalManager","add","newModal","remove","oldModal","filter","modal","isTopModal","useModalManager","ref","open","useScrollLock","refModal","showPortal","blockScroll","reserveScrollBarGap","oldRef","disableBodyScroll","enableBodyScroll","root","overlay","overlayAnimationIn","overlayAnimationOut","modalContainer","modalContainerCenter","modalAnimationIn","modalAnimationOut","Modal","forwardRef","center","closeOnEsc","closeOnOverlayClick","showCloseIcon","closeIconId","focusTrapped","animationDuration","role","ariaDescribedby","ariaLabelledby","containerId","modalId","onClose","onEscKeyDown","onOverlayClick","onAnimationEnd","children","refDialog","useForwardedRef","refShouldClose","refContainer","createElement","useState","setShowPortal","handleOpen","body","appendChild","handleKeydown","handleClose","removeChild","keyCode","handleClickOverlay","handleModalEvent","handleAnimationEnd","containerModal","overlayAnimation","modalAnimation","ReactDom","createPortal","animation","onMouseDown","onMouseUp"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var n=require("react"),t=e(n),o=e(require("react-dom")),r=e(require("classnames")),l=require("body-scroll-lock"),a=e(require("@bedrock-layout/use-forwarded-ref"));function i(){return(i=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e}).apply(this,arguments)}var u=function(e){var n=e.classNames,o=e.styles,l=e.closeIcon,a=e.onClick;return t.createElement("button",{id:e.id,className:r(e.classes.closeButton,null==n?void 0:n.closeButton),style:null==o?void 0:o.closeButton,onClick:a,"data-testid":"close-button"},l||t.createElement("svg",{className:null==n?void 0:n.closeIcon,style:null==o?void 0:o.closeIcon,width:28,height:28,viewBox:"0 0 36 36","data-testid":"close-icon"},t.createElement("path",{d:"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z"})))},c="undefined"!=typeof window,d=["input","select","textarea","a[href]","button","[tabindex]","audio[controls]","video[controls]",'[contenteditable]:not([contenteditable="false"])'];function s(e){return null===e.offsetParent||"hidden"===getComputedStyle(e).visibility}function
|
|
1
|
+
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var n=require("react"),t=e(n),o=e(require("react-dom")),r=e(require("classnames")),l=require("body-scroll-lock"),a=e(require("@bedrock-layout/use-forwarded-ref"));function i(){return(i=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e}).apply(this,arguments)}var u=function(e){var n=e.classNames,o=e.styles,l=e.closeIcon,a=e.onClick;return t.createElement("button",{id:e.id,className:r(e.classes.closeButton,null==n?void 0:n.closeButton),style:null==o?void 0:o.closeButton,onClick:a,"data-testid":"close-button"},l||t.createElement("svg",{className:null==n?void 0:n.closeIcon,style:null==o?void 0:o.closeIcon,width:28,height:28,viewBox:"0 0 36 36","data-testid":"close-icon"},t.createElement("path",{d:"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z"})))},c="undefined"!=typeof window,d=["input","select","textarea","a[href]","button","[tabindex]","audio[controls]","video[controls]",'[contenteditable]:not([contenteditable="false"])'];function s(e){return null===e.offsetParent||"hidden"===getComputedStyle(e).visibility}function v(e){if("INPUT"!==e.tagName||"radio"!==e.type||!e.name)return!0;var n=(e.form||e.ownerDocument).querySelectorAll('input[type="radio"][name="'+e.name+'"]'),t=function(e,n){for(var t=0;t<e.length;t++)if(e[t].checked&&e[t].form===n)return e[t]}(n,e.form);return t===e||void 0===t&&n[0]===e}function m(e){for(var n=document.activeElement,t=e.querySelectorAll(d.join(",")),o=[],r=0;r<t.length;r++){var l=t[r];(n===l||!l.disabled&&f(l)>-1&&!s(l)&&v(l))&&o.push(l)}return o}function f(e){var n=parseInt(e.getAttribute("tabindex"),10);return isNaN(n)?function(e){return e.getAttribute("contentEditable")}(e)?0:e.tabIndex:n}var y=function(e){var t=e.container,o=e.initialFocusRef,r=n.useRef();return n.useEffect((function(){var e=function(e){(null==t?void 0:t.current)&&function(e,n){if(e&&"Tab"===e.key){if(!n||!n.contains)return process,!1;if(!n.contains(e.target))return!1;var t=m(n),o=t[0],r=t[t.length-1];e.shiftKey&&e.target===o?(r.focus(),e.preventDefault()):!e.shiftKey&&e.target===r&&(o.focus(),e.preventDefault())}}(e,t.current)};if(c&&document.addEventListener("keydown",e),c&&(null==t?void 0:t.current)){var n=function(){-1!==d.findIndex((function(e){var n;return null==(n=document.activeElement)?void 0:n.matches(e)}))&&(r.current=document.activeElement)};if(o)n(),requestAnimationFrame((function(){var e;null==(e=o.current)||e.focus()}));else{var l=m(t.current);l[0]&&(n(),l[0].focus())}}return function(){var n;c&&(document.removeEventListener("keydown",e),null==(n=r.current)||n.focus())}}),[t,o]),null},p=[],b={root:"react-responsive-modal-root",overlay:"react-responsive-modal-overlay",overlayAnimationIn:"react-responsive-modal-overlay-in",overlayAnimationOut:"react-responsive-modal-overlay-out",modalContainer:"react-responsive-modal-container",modalContainerCenter:"react-responsive-modal-containerCenter",modal:"react-responsive-modal-modal",modalAnimationIn:"react-responsive-modal-modal-in",modalAnimationOut:"react-responsive-modal-modal-out",closeButton:"react-responsive-modal-closeButton"},E=t.forwardRef((function(e,d){var s,v,m,f,E=e.open,h=e.center,C=e.blockScroll,I=void 0===C||C,A=e.closeOnEsc,g=void 0===A||A,k=e.closeOnOverlayClick,w=void 0===k||k,O=e.container,N=e.showCloseIcon,x=void 0===N||N,B=e.closeIconId,R=e.closeIcon,S=e.focusTrapped,q=void 0===S||S,L=e.initialFocusRef,D=void 0===L?void 0:L,j=e.animationDuration,M=void 0===j?300:j,P=e.classNames,F=e.styles,K=e.role,T=void 0===K?"dialog":K,G=e.ariaDescribedby,U=e.ariaLabelledby,_=e.containerId,z=e.modalId,H=e.onClose,J=e.onEscKeyDown,Q=e.onOverlayClick,V=e.onAnimationEnd,W=e.children,X=e.reserveScrollBarGap,Y=a(d),Z=n.useRef(null),$=n.useRef(null),ee=n.useRef(null);null===ee.current&&c&&(ee.current=document.createElement("div"));var ne=n.useState(!1),te=ne[0],oe=ne[1];!function(e,t){n.useEffect((function(){return t&&p.push(e),function(){var n;n=e,p=p.filter((function(e){return e!==n}))}}),[t,e])}(Z,E),function(e,t,o,r,a){var i=n.useRef(null);n.useEffect((function(){return t&&e.current&&r&&(i.current=e.current,l.disableBodyScroll(e.current,{reserveScrollBarGap:a})),function(){i.current&&(l.enableBodyScroll(i.current),i.current=null)}}),[t,o,e,r,a])}(Z,E,te,I,X);var re=function(e){27===e.keyCode&&p.length&&p[p.length-1]===Z&&(null==J||J(e),g&&H())};n.useEffect((function(){return function(){te&&(ee.current&&!O&&document.body.contains(ee.current)&&document.body.removeChild(ee.current),document.removeEventListener("keydown",re))}}),[te]),n.useEffect((function(){E&&!te&&(oe(!0),!ee.current||O||document.body.contains(ee.current)||document.body.appendChild(ee.current),document.addEventListener("keydown",re))}),[E]);var le=function(){$.current=!1},ae=O||ee.current,ie=E?null!=(s=null==P?void 0:P.overlayAnimationIn)?s:b.overlayAnimationIn:null!=(v=null==P?void 0:P.overlayAnimationOut)?v:b.overlayAnimationOut,ue=E?null!=(m=null==P?void 0:P.modalAnimationIn)?m:b.modalAnimationIn:null!=(f=null==P?void 0:P.modalAnimationOut)?f:b.modalAnimationOut;return te&&ae?o.createPortal(t.createElement("div",{className:r(b.root,null==P?void 0:P.root),style:null==F?void 0:F.root,"data-testid":"root"},t.createElement("div",{className:r(b.overlay,null==P?void 0:P.overlay),"data-testid":"overlay","aria-hidden":!0,style:i({animation:ie+" "+M+"ms"},null==F?void 0:F.overlay)}),t.createElement("div",{ref:Z,id:_,className:r(b.modalContainer,h&&b.modalContainerCenter,null==P?void 0:P.modalContainer),style:null==F?void 0:F.modalContainer,"data-testid":"modal-container",onClick:function(e){null===$.current&&($.current=!0),$.current?(null==Q||Q(e),w&&H(),$.current=null):$.current=null}},t.createElement("div",{ref:Y,className:r(b.modal,null==P?void 0:P.modal),style:i({animation:ue+" "+M+"ms"},null==F?void 0:F.modal),onMouseDown:le,onMouseUp:le,onClick:le,onAnimationEnd:function(){E||oe(!1),null==V||V()},id:z,role:T,"aria-modal":"true","aria-labelledby":U,"aria-describedby":G,"data-testid":"modal",tabIndex:-1},q&&t.createElement(y,{container:Y,initialFocusRef:D}),W,x&&t.createElement(u,{classes:b,classNames:P,styles:F,closeIcon:R,onClick:H,id:B})))),ae):null}));exports.Modal=E,exports.default=E;
|
|
2
2
|
//# sourceMappingURL=react-responsive-modal.cjs.production.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-responsive-modal.cjs.production.min.js","sources":["../src/CloseIcon.tsx","../src/utils.ts","../src/lib/focusTrapJs.ts","../src/FocusTrap.tsx","../src/modalManager.ts","../src/index.tsx","../src/useScrollLock.ts"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\ninterface CloseIconProps {\n id?: string;\n closeIcon?: React.ReactNode;\n styles?: {\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n classNames?: {\n closeButton?: string;\n closeIcon?: string;\n };\n classes: {\n closeButton?: string;\n };\n onClick: () => void;\n}\n\nconst CloseIcon = ({\n classes,\n classNames,\n styles,\n id,\n closeIcon,\n onClick,\n}: CloseIconProps) => (\n <button\n id={id}\n className={cx(classes.closeButton, classNames?.closeButton)}\n style={styles?.closeButton}\n onClick={onClick}\n data-testid=\"close-button\"\n >\n {closeIcon ? (\n closeIcon\n ) : (\n <svg\n className={classNames?.closeIcon}\n style={styles?.closeIcon}\n width={28}\n height={28}\n viewBox=\"0 0 36 36\"\n data-testid=\"close-icon\"\n >\n <path d=\"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z\" />\n </svg>\n )}\n </button>\n);\n\nexport default CloseIcon;\n","export const isBrowser = typeof window !== 'undefined';\n","// https://github.com/alexandrzavalii/focus-trap-js/blob/master/src/index.js v1.1.0\n\nexport const candidateSelectors = [\n 'input',\n 'select',\n 'textarea',\n 'a[href]',\n 'button',\n '[tabindex]',\n 'audio[controls]',\n 'video[controls]',\n '[contenteditable]:not([contenteditable=\"false\"])',\n];\n\nfunction isHidden(node: any) {\n // offsetParent being null will allow detecting cases where an element is invisible or inside an invisible element,\n // as long as the element does not use position: fixed. For them, their visibility has to be checked directly as well.\n return (\n node.offsetParent === null || getComputedStyle(node).visibility === 'hidden'\n );\n}\n\nfunction getCheckedRadio(nodes: any, form: any) {\n for (var i = 0; i < nodes.length; i++) {\n if (nodes[i].checked && nodes[i].form === form) {\n return nodes[i];\n }\n }\n}\n\nfunction isNotRadioOrTabbableRadio(node: any) {\n if (node.tagName !== 'INPUT' || node.type !== 'radio' || !node.name) {\n return true;\n }\n var radioScope = node.form || node.ownerDocument;\n var radioSet = radioScope.querySelectorAll(\n 'input[type=\"radio\"][name=\"' + node.name + '\"]'\n );\n var checked = getCheckedRadio(radioSet, node.form);\n return checked === node || (checked === undefined && radioSet[0] === node);\n}\n\nexport function getAllTabbingElements(parentElem: any) {\n var currentActiveElement = document.activeElement;\n var tabbableNodes = parentElem.querySelectorAll(candidateSelectors.join(','));\n var onlyTabbable = [];\n for (var i = 0; i < tabbableNodes.length; i++) {\n var node = tabbableNodes[i];\n if (\n currentActiveElement === node ||\n (!node.disabled &&\n getTabindex(node) > -1 &&\n !isHidden(node) &&\n isNotRadioOrTabbableRadio(node))\n ) {\n onlyTabbable.push(node);\n }\n }\n return onlyTabbable;\n}\n\nexport function tabTrappingKey(event: any, parentElem: any) {\n // check if current event keyCode is tab\n if (!event || event.key !== 'Tab') return;\n\n if (!parentElem || !parentElem.contains) {\n if (process && process.env.NODE_ENV === 'development') {\n console.warn('focus-trap-js: parent element is not defined');\n }\n return false;\n }\n\n if (!parentElem.contains(event.target)) {\n return false;\n }\n\n var allTabbingElements = getAllTabbingElements(parentElem);\n var firstFocusableElement = allTabbingElements[0];\n var lastFocusableElement = allTabbingElements[allTabbingElements.length - 1];\n\n if (event.shiftKey && event.target === firstFocusableElement) {\n lastFocusableElement.focus();\n event.preventDefault();\n return true;\n } else if (!event.shiftKey && event.target === lastFocusableElement) {\n firstFocusableElement.focus();\n event.preventDefault();\n return true;\n }\n return false;\n}\n\nfunction getTabindex(node: any) {\n var tabindexAttr = parseInt(node.getAttribute('tabindex'), 10);\n\n if (!isNaN(tabindexAttr)) return tabindexAttr;\n // Browsers do not return tabIndex correctly for contentEditable nodes;\n // so if they don't have a tabindex attribute specifically set, assume it's 0.\n\n if (isContentEditable(node)) return 0;\n return node.tabIndex;\n}\n\nfunction isContentEditable(node: any) {\n return node.getAttribute('contentEditable');\n}\n","import { useEffect, useRef } from 'react';\nimport { isBrowser } from './utils';\nimport {\n tabTrappingKey,\n candidateSelectors,\n getAllTabbingElements,\n} from './lib/focusTrapJs';\n\ninterface FocusTrapProps {\n container?: React.RefObject<HTMLElement> | null;\n initialFocusRef?: React.RefObject<HTMLElement>;\n}\n\nexport const FocusTrap = ({ container, initialFocusRef }: FocusTrapProps) => {\n const refLastFocus = useRef<HTMLElement | null>();\n /**\n * Handle focus lock on the modal\n */\n useEffect(() => {\n const handleKeyEvent = (event: KeyboardEvent) => {\n if (container?.current) {\n tabTrappingKey(event, container.current);\n }\n };\n\n if (isBrowser) {\n document.addEventListener('keydown', handleKeyEvent);\n }\n // On mount we focus on the first focusable element in the modal if there is one\n if (isBrowser && container?.current) {\n const savePreviousFocus = () => {\n // First we save the last focused element\n // only if it's a focusable element\n if (\n candidateSelectors.findIndex((selector) =>\n document.activeElement?.matches(selector)\n ) !== -1\n ) {\n refLastFocus.current = document.activeElement as HTMLElement;\n }\n };\n\n if (initialFocusRef) {\n savePreviousFocus();\n // We need to schedule focusing on a next frame - this allows to focus on the modal root\n requestAnimationFrame(() => {\n initialFocusRef.current?.focus();\n });\n } else {\n const allTabbingElements = getAllTabbingElements(container.current);\n if (allTabbingElements[0]) {\n savePreviousFocus();\n allTabbingElements[0].focus();\n }\n }\n }\n return () => {\n if (isBrowser) {\n document.removeEventListener('keydown', handleKeyEvent);\n // On unmount we restore the focus to the last focused element\n refLastFocus.current?.focus();\n }\n };\n }, [container, initialFocusRef]);\n\n return null;\n};\n","import { Ref, useEffect } from 'react';\n\nlet modals: Ref<Element>[] = [];\n\n/**\n * Handle the order of the modals.\n * Inspired by the material-ui implementation.\n */\nexport const modalManager = {\n /**\n * Register a new modal\n */\n add: (newModal: Ref<Element>) => {\n modals.push(newModal);\n },\n\n /**\n * Remove a modal\n */\n remove: (oldModal: Ref<Element>) => {\n modals = modals.filter((modal) => modal !== oldModal);\n },\n\n /**\n * When multiple modals are rendered will return true if current modal is the last one\n */\n isTopModal: (modal: Ref<Element>) =>\n !!modals.length && modals[modals.length - 1] === modal,\n};\n\nexport function useModalManager(ref: Ref<Element>, open: boolean) {\n useEffect(() => {\n if (open) {\n modalManager.add(ref);\n }\n return () => {\n modalManager.remove(ref);\n };\n }, [open, ref]);\n}\n","import React, { useEffect, useRef, useState } from 'react';\nimport ReactDom from 'react-dom';\nimport cx from 'classnames';\nimport CloseIcon from './CloseIcon';\nimport { FocusTrap } from './FocusTrap';\nimport { modalManager, useModalManager } from './modalManager';\nimport { useScrollLock } from './useScrollLock';\nimport { isBrowser } from './utils';\nimport useForwardedRef from '@bedrock-layout/use-forwarded-ref';\n\nconst classes = {\n root: 'react-responsive-modal-root',\n overlay: 'react-responsive-modal-overlay',\n overlayAnimationIn: 'react-responsive-modal-overlay-in',\n overlayAnimationOut: 'react-responsive-modal-overlay-out',\n modalContainer: 'react-responsive-modal-container',\n modalContainerCenter: 'react-responsive-modal-containerCenter',\n modal: 'react-responsive-modal-modal',\n modalAnimationIn: 'react-responsive-modal-modal-in',\n modalAnimationOut: 'react-responsive-modal-modal-out',\n closeButton: 'react-responsive-modal-closeButton',\n};\n\nexport interface ModalProps {\n /**\n * Control if the modal is open or not.\n */\n open: boolean;\n /**\n * Should the dialog be centered.\n *\n * Default to false.\n */\n center?: boolean;\n /**\n * Is the modal closable when user press esc key.\n *\n * Default to true.\n */\n closeOnEsc?: boolean;\n /**\n * Is the modal closable when user click on overlay.\n *\n * Default to true.\n */\n closeOnOverlayClick?: boolean;\n /**\n * Whether to block scrolling when dialog is open.\n *\n * Default to true.\n */\n blockScroll?: boolean;\n /**\n * Show the close icon.\n *\n * Default to true.\n */\n showCloseIcon?: boolean;\n /**\n * id attribute for the close icon button.\n */\n closeIconId?: string;\n /**\n * Custom icon to render (svg, img, etc...).\n */\n closeIcon?: React.ReactNode;\n /**\n * When the modal is open, trap focus within it.\n *\n * Default to true.\n */\n focusTrapped?: boolean;\n /**\n * Element to focus when focus trap is used.\n *\n * Default to undefined.\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /**\n * You can specify a container prop which should be of type `Element`.\n * The portal will be rendered inside that element.\n * The default behavior will create a div node and render it at the at the end of document.body.\n */\n container?: Element | null;\n /**\n * An object containing classNames to style the modal.\n */\n classNames?: {\n root?: string;\n overlay?: string;\n overlayAnimationIn?: string;\n overlayAnimationOut?: string;\n modalContainer?: string;\n modal?: string;\n modalAnimationIn?: string;\n modalAnimationOut?: string;\n closeButton?: string;\n closeIcon?: string;\n };\n /**\n * An object containing the styles objects to style the modal.\n */\n styles?: {\n root?: React.CSSProperties;\n overlay?: React.CSSProperties;\n modalContainer?: React.CSSProperties;\n modal?: React.CSSProperties;\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n /**\n * Animation duration in milliseconds.\n *\n * Default to 300.\n */\n animationDuration?: number;\n /**\n * ARIA role for modal\n *\n * Default to 'dialog'.\n */\n role?: string;\n /**\n * ARIA label for modal\n */\n ariaLabelledby?: string;\n /**\n * ARIA description for modal\n */\n ariaDescribedby?: string;\n /**\n * id attribute for modal\n */\n modalId?: string;\n /**\n * Callback fired when the Modal is requested to be closed by a click on the overlay or when user press esc key.\n */\n onClose: () => void;\n /**\n * Callback fired when the escape key is pressed.\n */\n onEscKeyDown?: (event: KeyboardEvent) => void;\n /**\n * Callback fired when the overlay is clicked.\n */\n onOverlayClick?: (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => void;\n /**\n * Callback fired when the Modal has exited and the animation is finished.\n */\n onAnimationEnd?: () => void;\n children?: React.ReactNode;\n}\n\nexport const Modal = React.forwardRef(\n (\n {\n open,\n center,\n blockScroll = true,\n closeOnEsc = true,\n closeOnOverlayClick = true,\n container,\n showCloseIcon = true,\n closeIconId,\n closeIcon,\n focusTrapped = true,\n initialFocusRef = undefined,\n animationDuration = 300,\n classNames,\n styles,\n role = 'dialog',\n ariaDescribedby,\n ariaLabelledby,\n modalId,\n onClose,\n onEscKeyDown,\n onOverlayClick,\n onAnimationEnd,\n children,\n }: ModalProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const refDialog = useForwardedRef(ref);\n const refModal = useRef<HTMLDivElement>(null);\n const refShouldClose = useRef<boolean | null>(null);\n const refContainer = useRef<HTMLDivElement | null>(null);\n // Lazily create the ref instance\n // https://reactjs.org/docs/hooks-faq.html#how-to-create-expensive-objects-lazily\n if (refContainer.current === null && isBrowser) {\n refContainer.current = document.createElement('div');\n }\n\n // The value should be false for srr, that way when the component is hydrated client side,\n // it will match the server rendered content\n const [showPortal, setShowPortal] = useState(false);\n\n // Hook used to manage multiple modals opened at the same time\n useModalManager(refModal, open);\n\n // Hook used to manage the scroll\n useScrollLock(refModal, open, showPortal, blockScroll);\n\n const handleOpen = () => {\n if (\n refContainer.current &&\n !container &&\n !document.body.contains(refContainer.current)\n ) {\n document.body.appendChild(refContainer.current);\n }\n\n document.addEventListener('keydown', handleKeydown);\n };\n\n const handleClose = () => {\n if (\n refContainer.current &&\n !container &&\n document.body.contains(refContainer.current)\n ) {\n document.body.removeChild(refContainer.current);\n }\n document.removeEventListener('keydown', handleKeydown);\n };\n\n const handleKeydown = (event: KeyboardEvent) => {\n // Only the last modal need to be escaped when pressing the esc key\n if (event.keyCode !== 27 || !modalManager.isTopModal(refModal)) {\n return;\n }\n\n onEscKeyDown?.(event);\n\n if (closeOnEsc) {\n onClose();\n }\n };\n\n useEffect(() => {\n return () => {\n if (showPortal) {\n // When the modal is closed or removed directly, cleanup the listeners\n handleClose();\n }\n };\n }, [showPortal]);\n\n useEffect(() => {\n // If the open prop is changing, we need to open the modal\n // This is also called on the first render if the open prop is true when the modal is created\n if (open && !showPortal) {\n setShowPortal(true);\n handleOpen();\n }\n }, [open]);\n\n const handleClickOverlay = (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => {\n if (refShouldClose.current === null) {\n refShouldClose.current = true;\n }\n\n if (!refShouldClose.current) {\n refShouldClose.current = null;\n return;\n }\n\n onOverlayClick?.(event);\n\n if (closeOnOverlayClick) {\n onClose();\n }\n\n refShouldClose.current = null;\n };\n\n const handleModalEvent = () => {\n refShouldClose.current = false;\n };\n\n const handleAnimationEnd = () => {\n if (!open) {\n setShowPortal(false);\n }\n\n onAnimationEnd?.();\n };\n\n const containerModal = container || refContainer.current;\n\n const overlayAnimation = open\n ? classNames?.overlayAnimationIn ?? classes.overlayAnimationIn\n : classNames?.overlayAnimationOut ?? classes.overlayAnimationOut;\n\n const modalAnimation = open\n ? classNames?.modalAnimationIn ?? classes.modalAnimationIn\n : classNames?.modalAnimationOut ?? classes.modalAnimationOut;\n\n return showPortal && containerModal\n ? ReactDom.createPortal(\n <div\n className={cx(classes.root, classNames?.root)}\n style={styles?.root}\n data-testid=\"root\"\n >\n <div\n className={cx(classes.overlay, classNames?.overlay)}\n data-testid=\"overlay\"\n aria-hidden={true}\n style={{\n animation: `${overlayAnimation} ${animationDuration}ms`,\n ...styles?.overlay,\n }}\n />\n <div\n ref={refModal}\n className={cx(\n classes.modalContainer,\n center && classes.modalContainerCenter,\n classNames?.modalContainer\n )}\n style={styles?.modalContainer}\n data-testid=\"modal-container\"\n onClick={handleClickOverlay}\n >\n <div\n ref={refDialog}\n className={cx(classes.modal, classNames?.modal)}\n style={{\n animation: `${modalAnimation} ${animationDuration}ms`,\n ...styles?.modal,\n }}\n onMouseDown={handleModalEvent}\n onMouseUp={handleModalEvent}\n onClick={handleModalEvent}\n onAnimationEnd={handleAnimationEnd}\n id={modalId}\n role={role}\n aria-modal=\"true\"\n aria-labelledby={ariaLabelledby}\n aria-describedby={ariaDescribedby}\n data-testid=\"modal\"\n tabIndex={-1}\n >\n {focusTrapped && (\n <FocusTrap\n container={refDialog}\n initialFocusRef={initialFocusRef}\n />\n )}\n {children}\n {showCloseIcon && (\n <CloseIcon\n classes={classes}\n classNames={classNames}\n styles={styles}\n closeIcon={closeIcon}\n onClick={onClose}\n id={closeIconId}\n />\n )}\n </div>\n </div>\n </div>,\n containerModal\n )\n : null;\n }\n);\n\nexport default Modal;\n","import { useEffect, useRef } from 'react';\nimport { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';\n\nexport const useScrollLock = (\n refModal: React.RefObject<Element>,\n open: boolean,\n showPortal: boolean,\n blockScroll: boolean\n) => {\n const oldRef = useRef<Element | null>(null);\n\n useEffect(() => {\n if (open && refModal.current && blockScroll) {\n oldRef.current = refModal.current;\n disableBodyScroll(refModal.current);\n }\n return () => {\n if (oldRef.current) {\n enableBodyScroll(oldRef.current);\n oldRef.current = null;\n }\n };\n }, [open, showPortal, refModal]);\n};\n"],"names":["CloseIcon","classNames","styles","closeIcon","onClick","React","id","className","cx","classes","closeButton","style","width","height","viewBox","d","isBrowser","window","candidateSelectors","isHidden","node","offsetParent","getComputedStyle","visibility","isNotRadioOrTabbableRadio","tagName","type","name","radioSet","form","ownerDocument","querySelectorAll","checked","nodes","i","length","getCheckedRadio","undefined","getAllTabbingElements","parentElem","currentActiveElement","document","activeElement","tabbableNodes","join","onlyTabbable","disabled","getTabindex","push","tabindexAttr","parseInt","getAttribute","isNaN","isContentEditable","tabIndex","FocusTrap","container","initialFocusRef","refLastFocus","useRef","useEffect","handleKeyEvent","event","current","key","contains","process","target","allTabbingElements","firstFocusableElement","lastFocusableElement","shiftKey","focus","preventDefault","tabTrappingKey","addEventListener","savePreviousFocus","findIndex","selector","_document$activeEleme","matches","requestAnimationFrame","removeEventListener","modals","root","overlay","overlayAnimationIn","overlayAnimationOut","modalContainer","modalContainerCenter","modal","modalAnimationIn","modalAnimationOut","Modal","forwardRef","ref","open","center","blockScroll","closeOnEsc","closeOnOverlayClick","showCloseIcon","closeIconId","focusTrapped","animationDuration","role","ariaDescribedby","ariaLabelledby","modalId","onClose","onEscKeyDown","onOverlayClick","onAnimationEnd","children","refDialog","useForwardedRef","refModal","refShouldClose","refContainer","createElement","useState","showPortal","setShowPortal","oldModal","filter","useModalManager","oldRef","disableBodyScroll","enableBodyScroll","useScrollLock","handleKeydown","keyCode","body","removeChild","appendChild","handleModalEvent","containerModal","overlayAnimation","modalAnimation","ReactDom","createPortal","animation","onMouseDown","onMouseUp"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-responsive-modal.cjs.production.min.js","sources":["../src/CloseIcon.tsx","../src/utils.ts","../src/lib/focusTrapJs.ts","../src/FocusTrap.tsx","../src/modalManager.ts","../src/index.tsx","../src/useScrollLock.ts"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\ninterface CloseIconProps {\n id?: string;\n closeIcon?: React.ReactNode;\n styles?: {\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n classNames?: {\n closeButton?: string;\n closeIcon?: string;\n };\n classes: {\n closeButton?: string;\n };\n onClick: () => void;\n}\n\nconst CloseIcon = ({\n classes,\n classNames,\n styles,\n id,\n closeIcon,\n onClick,\n}: CloseIconProps) => (\n <button\n id={id}\n className={cx(classes.closeButton, classNames?.closeButton)}\n style={styles?.closeButton}\n onClick={onClick}\n data-testid=\"close-button\"\n >\n {closeIcon ? (\n closeIcon\n ) : (\n <svg\n className={classNames?.closeIcon}\n style={styles?.closeIcon}\n width={28}\n height={28}\n viewBox=\"0 0 36 36\"\n data-testid=\"close-icon\"\n >\n <path d=\"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z\" />\n </svg>\n )}\n </button>\n);\n\nexport default CloseIcon;\n","export const isBrowser = typeof window !== 'undefined';\n","// https://github.com/alexandrzavalii/focus-trap-js/blob/master/src/index.js v1.1.0\n\nexport const candidateSelectors = [\n 'input',\n 'select',\n 'textarea',\n 'a[href]',\n 'button',\n '[tabindex]',\n 'audio[controls]',\n 'video[controls]',\n '[contenteditable]:not([contenteditable=\"false\"])',\n];\n\nfunction isHidden(node: any) {\n // offsetParent being null will allow detecting cases where an element is invisible or inside an invisible element,\n // as long as the element does not use position: fixed. For them, their visibility has to be checked directly as well.\n return (\n node.offsetParent === null || getComputedStyle(node).visibility === 'hidden'\n );\n}\n\nfunction getCheckedRadio(nodes: any, form: any) {\n for (var i = 0; i < nodes.length; i++) {\n if (nodes[i].checked && nodes[i].form === form) {\n return nodes[i];\n }\n }\n}\n\nfunction isNotRadioOrTabbableRadio(node: any) {\n if (node.tagName !== 'INPUT' || node.type !== 'radio' || !node.name) {\n return true;\n }\n var radioScope = node.form || node.ownerDocument;\n var radioSet = radioScope.querySelectorAll(\n 'input[type=\"radio\"][name=\"' + node.name + '\"]'\n );\n var checked = getCheckedRadio(radioSet, node.form);\n return checked === node || (checked === undefined && radioSet[0] === node);\n}\n\nexport function getAllTabbingElements(parentElem: any) {\n var currentActiveElement = document.activeElement;\n var tabbableNodes = parentElem.querySelectorAll(candidateSelectors.join(','));\n var onlyTabbable = [];\n for (var i = 0; i < tabbableNodes.length; i++) {\n var node = tabbableNodes[i];\n if (\n currentActiveElement === node ||\n (!node.disabled &&\n getTabindex(node) > -1 &&\n !isHidden(node) &&\n isNotRadioOrTabbableRadio(node))\n ) {\n onlyTabbable.push(node);\n }\n }\n return onlyTabbable;\n}\n\nexport function tabTrappingKey(event: any, parentElem: any) {\n // check if current event keyCode is tab\n if (!event || event.key !== 'Tab') return;\n\n if (!parentElem || !parentElem.contains) {\n if (process && process.env.NODE_ENV === 'development') {\n console.warn('focus-trap-js: parent element is not defined');\n }\n return false;\n }\n\n if (!parentElem.contains(event.target)) {\n return false;\n }\n\n var allTabbingElements = getAllTabbingElements(parentElem);\n var firstFocusableElement = allTabbingElements[0];\n var lastFocusableElement = allTabbingElements[allTabbingElements.length - 1];\n\n if (event.shiftKey && event.target === firstFocusableElement) {\n lastFocusableElement.focus();\n event.preventDefault();\n return true;\n } else if (!event.shiftKey && event.target === lastFocusableElement) {\n firstFocusableElement.focus();\n event.preventDefault();\n return true;\n }\n return false;\n}\n\nfunction getTabindex(node: any) {\n var tabindexAttr = parseInt(node.getAttribute('tabindex'), 10);\n\n if (!isNaN(tabindexAttr)) return tabindexAttr;\n // Browsers do not return tabIndex correctly for contentEditable nodes;\n // so if they don't have a tabindex attribute specifically set, assume it's 0.\n\n if (isContentEditable(node)) return 0;\n return node.tabIndex;\n}\n\nfunction isContentEditable(node: any) {\n return node.getAttribute('contentEditable');\n}\n","import { useEffect, useRef } from 'react';\nimport { isBrowser } from './utils';\nimport {\n tabTrappingKey,\n candidateSelectors,\n getAllTabbingElements,\n} from './lib/focusTrapJs';\n\ninterface FocusTrapProps {\n container?: React.RefObject<HTMLElement> | null;\n initialFocusRef?: React.RefObject<HTMLElement>;\n}\n\nexport const FocusTrap = ({ container, initialFocusRef }: FocusTrapProps) => {\n const refLastFocus = useRef<HTMLElement | null>();\n /**\n * Handle focus lock on the modal\n */\n useEffect(() => {\n const handleKeyEvent = (event: KeyboardEvent) => {\n if (container?.current) {\n tabTrappingKey(event, container.current);\n }\n };\n\n if (isBrowser) {\n document.addEventListener('keydown', handleKeyEvent);\n }\n // On mount we focus on the first focusable element in the modal if there is one\n if (isBrowser && container?.current) {\n const savePreviousFocus = () => {\n // First we save the last focused element\n // only if it's a focusable element\n if (\n candidateSelectors.findIndex((selector) =>\n document.activeElement?.matches(selector)\n ) !== -1\n ) {\n refLastFocus.current = document.activeElement as HTMLElement;\n }\n };\n\n if (initialFocusRef) {\n savePreviousFocus();\n // We need to schedule focusing on a next frame - this allows to focus on the modal root\n requestAnimationFrame(() => {\n initialFocusRef.current?.focus();\n });\n } else {\n const allTabbingElements = getAllTabbingElements(container.current);\n if (allTabbingElements[0]) {\n savePreviousFocus();\n allTabbingElements[0].focus();\n }\n }\n }\n return () => {\n if (isBrowser) {\n document.removeEventListener('keydown', handleKeyEvent);\n // On unmount we restore the focus to the last focused element\n refLastFocus.current?.focus();\n }\n };\n }, [container, initialFocusRef]);\n\n return null;\n};\n","import { Ref, useEffect } from 'react';\n\nlet modals: Ref<Element>[] = [];\n\n/**\n * Handle the order of the modals.\n * Inspired by the material-ui implementation.\n */\nexport const modalManager = {\n /**\n * Register a new modal\n */\n add: (newModal: Ref<Element>) => {\n modals.push(newModal);\n },\n\n /**\n * Remove a modal\n */\n remove: (oldModal: Ref<Element>) => {\n modals = modals.filter((modal) => modal !== oldModal);\n },\n\n /**\n * When multiple modals are rendered will return true if current modal is the last one\n */\n isTopModal: (modal: Ref<Element>) =>\n !!modals.length && modals[modals.length - 1] === modal,\n};\n\nexport function useModalManager(ref: Ref<Element>, open: boolean) {\n useEffect(() => {\n if (open) {\n modalManager.add(ref);\n }\n return () => {\n modalManager.remove(ref);\n };\n }, [open, ref]);\n}\n","import React, { useEffect, useRef, useState } from 'react';\nimport ReactDom from 'react-dom';\nimport cx from 'classnames';\nimport CloseIcon from './CloseIcon';\nimport { FocusTrap } from './FocusTrap';\nimport { modalManager, useModalManager } from './modalManager';\nimport { useScrollLock } from './useScrollLock';\nimport { isBrowser } from './utils';\nimport useForwardedRef from '@bedrock-layout/use-forwarded-ref';\n\nconst classes = {\n root: 'react-responsive-modal-root',\n overlay: 'react-responsive-modal-overlay',\n overlayAnimationIn: 'react-responsive-modal-overlay-in',\n overlayAnimationOut: 'react-responsive-modal-overlay-out',\n modalContainer: 'react-responsive-modal-container',\n modalContainerCenter: 'react-responsive-modal-containerCenter',\n modal: 'react-responsive-modal-modal',\n modalAnimationIn: 'react-responsive-modal-modal-in',\n modalAnimationOut: 'react-responsive-modal-modal-out',\n closeButton: 'react-responsive-modal-closeButton',\n};\n\nexport interface ModalProps {\n /**\n * Control if the modal is open or not.\n */\n open: boolean;\n /**\n * Should the dialog be centered.\n *\n * Default to false.\n */\n center?: boolean;\n /**\n * Is the modal closable when user press esc key.\n *\n * Default to true.\n */\n closeOnEsc?: boolean;\n /**\n * Is the modal closable when user click on overlay.\n *\n * Default to true.\n */\n closeOnOverlayClick?: boolean;\n /**\n * Whether to block scrolling when dialog is open.\n *\n * Default to true.\n */\n blockScroll?: boolean;\n /**\n * Show the close icon.\n *\n * Default to true.\n */\n showCloseIcon?: boolean;\n /**\n * id attribute for the close icon button.\n */\n closeIconId?: string;\n /**\n * Custom icon to render (svg, img, etc...).\n */\n closeIcon?: React.ReactNode;\n /**\n * When the modal is open, trap focus within it.\n *\n * Default to true.\n */\n focusTrapped?: boolean;\n /**\n * Element to focus when focus trap is used.\n *\n * Default to undefined.\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /**\n * You can specify a container prop which should be of type `Element`.\n * The portal will be rendered inside that element.\n * The default behavior will create a div node and render it at the at the end of document.body.\n */\n container?: Element | null;\n /**\n * An object containing classNames to style the modal.\n */\n classNames?: {\n root?: string;\n overlay?: string;\n overlayAnimationIn?: string;\n overlayAnimationOut?: string;\n modalContainer?: string;\n modal?: string;\n modalAnimationIn?: string;\n modalAnimationOut?: string;\n closeButton?: string;\n closeIcon?: string;\n };\n /**\n * An object containing the styles objects to style the modal.\n */\n styles?: {\n root?: React.CSSProperties;\n overlay?: React.CSSProperties;\n modalContainer?: React.CSSProperties;\n modal?: React.CSSProperties;\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n /**\n * Animation duration in milliseconds.\n *\n * Default to 300.\n */\n animationDuration?: number;\n /**\n * ARIA role for modal\n *\n * Default to 'dialog'.\n */\n role?: string;\n /**\n * ARIA label for modal\n */\n ariaLabelledby?: string;\n /**\n * ARIA description for modal\n */\n ariaDescribedby?: string;\n /**\n * Avoid unpleasant flickering effect when body overflow is hidden. For more information see https://www.npmjs.com/package/body-scroll-lock\n */\n reserveScrollBarGap?: boolean;\n /**\n * id attribute for modal container\n */\n containerId?: string;\n /**\n * id attribute for modal\n */\n modalId?: string;\n /**\n * Callback fired when the Modal is requested to be closed by a click on the overlay or when user press esc key.\n */\n onClose: () => void;\n /**\n * Callback fired when the escape key is pressed.\n */\n onEscKeyDown?: (event: KeyboardEvent) => void;\n /**\n * Callback fired when the overlay is clicked.\n */\n onOverlayClick?: (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => void;\n /**\n * Callback fired when the Modal has exited and the animation is finished.\n */\n onAnimationEnd?: () => void;\n children?: React.ReactNode;\n}\n\nexport const Modal = React.forwardRef(\n (\n {\n open,\n center,\n blockScroll = true,\n closeOnEsc = true,\n closeOnOverlayClick = true,\n container,\n showCloseIcon = true,\n closeIconId,\n closeIcon,\n focusTrapped = true,\n initialFocusRef = undefined,\n animationDuration = 300,\n classNames,\n styles,\n role = 'dialog',\n ariaDescribedby,\n ariaLabelledby,\n containerId,\n modalId,\n onClose,\n onEscKeyDown,\n onOverlayClick,\n onAnimationEnd,\n children,\n reserveScrollBarGap,\n }: ModalProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const refDialog = useForwardedRef(ref);\n const refModal = useRef<HTMLDivElement>(null);\n const refShouldClose = useRef<boolean | null>(null);\n const refContainer = useRef<HTMLDivElement | null>(null);\n // Lazily create the ref instance\n // https://reactjs.org/docs/hooks-faq.html#how-to-create-expensive-objects-lazily\n if (refContainer.current === null && isBrowser) {\n refContainer.current = document.createElement('div');\n }\n\n // The value should be false for srr, that way when the component is hydrated client side,\n // it will match the server rendered content\n const [showPortal, setShowPortal] = useState(false);\n\n // Hook used to manage multiple modals opened at the same time\n useModalManager(refModal, open);\n\n // Hook used to manage the scroll\n useScrollLock(refModal, open, showPortal, blockScroll, reserveScrollBarGap);\n\n const handleOpen = () => {\n if (\n refContainer.current &&\n !container &&\n !document.body.contains(refContainer.current)\n ) {\n document.body.appendChild(refContainer.current);\n }\n\n document.addEventListener('keydown', handleKeydown);\n };\n\n const handleClose = () => {\n if (\n refContainer.current &&\n !container &&\n document.body.contains(refContainer.current)\n ) {\n document.body.removeChild(refContainer.current);\n }\n document.removeEventListener('keydown', handleKeydown);\n };\n\n const handleKeydown = (event: KeyboardEvent) => {\n // Only the last modal need to be escaped when pressing the esc key\n if (event.keyCode !== 27 || !modalManager.isTopModal(refModal)) {\n return;\n }\n\n onEscKeyDown?.(event);\n\n if (closeOnEsc) {\n onClose();\n }\n };\n\n useEffect(() => {\n return () => {\n if (showPortal) {\n // When the modal is closed or removed directly, cleanup the listeners\n handleClose();\n }\n };\n }, [showPortal]);\n\n useEffect(() => {\n // If the open prop is changing, we need to open the modal\n // This is also called on the first render if the open prop is true when the modal is created\n if (open && !showPortal) {\n setShowPortal(true);\n handleOpen();\n }\n }, [open]);\n\n const handleClickOverlay = (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => {\n if (refShouldClose.current === null) {\n refShouldClose.current = true;\n }\n\n if (!refShouldClose.current) {\n refShouldClose.current = null;\n return;\n }\n\n onOverlayClick?.(event);\n\n if (closeOnOverlayClick) {\n onClose();\n }\n\n refShouldClose.current = null;\n };\n\n const handleModalEvent = () => {\n refShouldClose.current = false;\n };\n\n const handleAnimationEnd = () => {\n if (!open) {\n setShowPortal(false);\n }\n\n onAnimationEnd?.();\n };\n\n const containerModal = container || refContainer.current;\n\n const overlayAnimation = open\n ? classNames?.overlayAnimationIn ?? classes.overlayAnimationIn\n : classNames?.overlayAnimationOut ?? classes.overlayAnimationOut;\n\n const modalAnimation = open\n ? classNames?.modalAnimationIn ?? classes.modalAnimationIn\n : classNames?.modalAnimationOut ?? classes.modalAnimationOut;\n\n return showPortal && containerModal\n ? ReactDom.createPortal(\n <div\n className={cx(classes.root, classNames?.root)}\n style={styles?.root}\n data-testid=\"root\"\n >\n <div\n className={cx(classes.overlay, classNames?.overlay)}\n data-testid=\"overlay\"\n aria-hidden={true}\n style={{\n animation: `${overlayAnimation} ${animationDuration}ms`,\n ...styles?.overlay,\n }}\n />\n <div\n ref={refModal}\n id={containerId}\n className={cx(\n classes.modalContainer,\n center && classes.modalContainerCenter,\n classNames?.modalContainer\n )}\n style={styles?.modalContainer}\n data-testid=\"modal-container\"\n onClick={handleClickOverlay}\n >\n <div\n ref={refDialog}\n className={cx(classes.modal, classNames?.modal)}\n style={{\n animation: `${modalAnimation} ${animationDuration}ms`,\n ...styles?.modal,\n }}\n onMouseDown={handleModalEvent}\n onMouseUp={handleModalEvent}\n onClick={handleModalEvent}\n onAnimationEnd={handleAnimationEnd}\n id={modalId}\n role={role}\n aria-modal=\"true\"\n aria-labelledby={ariaLabelledby}\n aria-describedby={ariaDescribedby}\n data-testid=\"modal\"\n tabIndex={-1}\n >\n {focusTrapped && (\n <FocusTrap\n container={refDialog}\n initialFocusRef={initialFocusRef}\n />\n )}\n {children}\n {showCloseIcon && (\n <CloseIcon\n classes={classes}\n classNames={classNames}\n styles={styles}\n closeIcon={closeIcon}\n onClick={onClose}\n id={closeIconId}\n />\n )}\n </div>\n </div>\n </div>,\n containerModal\n )\n : null;\n }\n);\n\nexport default Modal;\n","import { useEffect, useRef } from 'react';\nimport { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';\n\nexport const useScrollLock = (\n refModal: React.RefObject<Element>,\n open: boolean,\n showPortal: boolean,\n blockScroll: boolean,\n reserveScrollBarGap?: boolean\n) => {\n const oldRef = useRef<Element | null>(null);\n\n useEffect(() => {\n if (open && refModal.current && blockScroll) {\n oldRef.current = refModal.current;\n disableBodyScroll(refModal.current, { reserveScrollBarGap });\n }\n return () => {\n if (oldRef.current) {\n enableBodyScroll(oldRef.current);\n oldRef.current = null;\n }\n };\n }, [open, showPortal, refModal, blockScroll, reserveScrollBarGap]);\n};\n"],"names":["CloseIcon","classNames","styles","closeIcon","onClick","React","id","className","cx","classes","closeButton","style","width","height","viewBox","d","isBrowser","window","candidateSelectors","isHidden","node","offsetParent","getComputedStyle","visibility","isNotRadioOrTabbableRadio","tagName","type","name","radioSet","form","ownerDocument","querySelectorAll","checked","nodes","i","length","getCheckedRadio","undefined","getAllTabbingElements","parentElem","currentActiveElement","document","activeElement","tabbableNodes","join","onlyTabbable","disabled","getTabindex","push","tabindexAttr","parseInt","getAttribute","isNaN","isContentEditable","tabIndex","FocusTrap","container","initialFocusRef","refLastFocus","useRef","useEffect","handleKeyEvent","event","current","key","contains","process","target","allTabbingElements","firstFocusableElement","lastFocusableElement","shiftKey","focus","preventDefault","tabTrappingKey","addEventListener","savePreviousFocus","findIndex","selector","_document$activeEleme","matches","requestAnimationFrame","removeEventListener","modals","root","overlay","overlayAnimationIn","overlayAnimationOut","modalContainer","modalContainerCenter","modal","modalAnimationIn","modalAnimationOut","Modal","forwardRef","ref","open","center","blockScroll","closeOnEsc","closeOnOverlayClick","showCloseIcon","closeIconId","focusTrapped","animationDuration","role","ariaDescribedby","ariaLabelledby","containerId","modalId","onClose","onEscKeyDown","onOverlayClick","onAnimationEnd","children","reserveScrollBarGap","refDialog","useForwardedRef","refModal","refShouldClose","refContainer","createElement","useState","showPortal","setShowPortal","oldModal","filter","useModalManager","oldRef","disableBodyScroll","enableBodyScroll","useScrollLock","handleKeydown","keyCode","body","removeChild","appendChild","handleModalEvent","containerModal","overlayAnimation","modalAnimation","ReactDom","createPortal","animation","onMouseDown","onMouseUp"],"mappings":"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"}
|
|
@@ -244,12 +244,14 @@ function useModalManager(ref, open) {
|
|
|
244
244
|
}, [open, ref]);
|
|
245
245
|
}
|
|
246
246
|
|
|
247
|
-
var useScrollLock = function useScrollLock(refModal, open, showPortal, blockScroll) {
|
|
247
|
+
var useScrollLock = function useScrollLock(refModal, open, showPortal, blockScroll, reserveScrollBarGap) {
|
|
248
248
|
var oldRef = useRef(null);
|
|
249
249
|
useEffect(function () {
|
|
250
250
|
if (open && refModal.current && blockScroll) {
|
|
251
251
|
oldRef.current = refModal.current;
|
|
252
|
-
disableBodyScroll(refModal.current
|
|
252
|
+
disableBodyScroll(refModal.current, {
|
|
253
|
+
reserveScrollBarGap: reserveScrollBarGap
|
|
254
|
+
});
|
|
253
255
|
}
|
|
254
256
|
|
|
255
257
|
return function () {
|
|
@@ -258,7 +260,7 @@ var useScrollLock = function useScrollLock(refModal, open, showPortal, blockScro
|
|
|
258
260
|
oldRef.current = null;
|
|
259
261
|
}
|
|
260
262
|
};
|
|
261
|
-
}, [open, showPortal, refModal]);
|
|
263
|
+
}, [open, showPortal, refModal, blockScroll, reserveScrollBarGap]);
|
|
262
264
|
};
|
|
263
265
|
|
|
264
266
|
var classes = {
|
|
@@ -301,12 +303,14 @@ var Modal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
301
303
|
role = _ref$role === void 0 ? 'dialog' : _ref$role,
|
|
302
304
|
ariaDescribedby = _ref.ariaDescribedby,
|
|
303
305
|
ariaLabelledby = _ref.ariaLabelledby,
|
|
306
|
+
containerId = _ref.containerId,
|
|
304
307
|
modalId = _ref.modalId,
|
|
305
308
|
onClose = _ref.onClose,
|
|
306
309
|
onEscKeyDown = _ref.onEscKeyDown,
|
|
307
310
|
onOverlayClick = _ref.onOverlayClick,
|
|
308
311
|
onAnimationEnd = _ref.onAnimationEnd,
|
|
309
|
-
children = _ref.children
|
|
312
|
+
children = _ref.children,
|
|
313
|
+
reserveScrollBarGap = _ref.reserveScrollBarGap;
|
|
310
314
|
var refDialog = useForwardedRef(ref);
|
|
311
315
|
var refModal = useRef(null);
|
|
312
316
|
var refShouldClose = useRef(null);
|
|
@@ -326,7 +330,7 @@ var Modal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
326
330
|
|
|
327
331
|
useModalManager(refModal, open); // Hook used to manage the scroll
|
|
328
332
|
|
|
329
|
-
useScrollLock(refModal, open, showPortal, blockScroll);
|
|
333
|
+
useScrollLock(refModal, open, showPortal, blockScroll, reserveScrollBarGap);
|
|
330
334
|
|
|
331
335
|
var handleOpen = function handleOpen() {
|
|
332
336
|
if (refContainer.current && !container && !document.body.contains(refContainer.current)) {
|
|
@@ -421,6 +425,7 @@ var Modal = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
421
425
|
}, styles == null ? void 0 : styles.overlay)
|
|
422
426
|
}), React.createElement("div", {
|
|
423
427
|
ref: refModal,
|
|
428
|
+
id: containerId,
|
|
424
429
|
className: cx(classes.modalContainer, center && classes.modalContainerCenter, classNames == null ? void 0 : classNames.modalContainer),
|
|
425
430
|
style: styles == null ? void 0 : styles.modalContainer,
|
|
426
431
|
"data-testid": "modal-container",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-responsive-modal.esm.js","sources":["../src/CloseIcon.tsx","../src/utils.ts","../src/lib/focusTrapJs.ts","../src/FocusTrap.tsx","../src/modalManager.ts","../src/useScrollLock.ts","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\ninterface CloseIconProps {\n id?: string;\n closeIcon?: React.ReactNode;\n styles?: {\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n classNames?: {\n closeButton?: string;\n closeIcon?: string;\n };\n classes: {\n closeButton?: string;\n };\n onClick: () => void;\n}\n\nconst CloseIcon = ({\n classes,\n classNames,\n styles,\n id,\n closeIcon,\n onClick,\n}: CloseIconProps) => (\n <button\n id={id}\n className={cx(classes.closeButton, classNames?.closeButton)}\n style={styles?.closeButton}\n onClick={onClick}\n data-testid=\"close-button\"\n >\n {closeIcon ? (\n closeIcon\n ) : (\n <svg\n className={classNames?.closeIcon}\n style={styles?.closeIcon}\n width={28}\n height={28}\n viewBox=\"0 0 36 36\"\n data-testid=\"close-icon\"\n >\n <path d=\"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z\" />\n </svg>\n )}\n </button>\n);\n\nexport default CloseIcon;\n","export const isBrowser = typeof window !== 'undefined';\n","// https://github.com/alexandrzavalii/focus-trap-js/blob/master/src/index.js v1.1.0\n\nexport const candidateSelectors = [\n 'input',\n 'select',\n 'textarea',\n 'a[href]',\n 'button',\n '[tabindex]',\n 'audio[controls]',\n 'video[controls]',\n '[contenteditable]:not([contenteditable=\"false\"])',\n];\n\nfunction isHidden(node: any) {\n // offsetParent being null will allow detecting cases where an element is invisible or inside an invisible element,\n // as long as the element does not use position: fixed. For them, their visibility has to be checked directly as well.\n return (\n node.offsetParent === null || getComputedStyle(node).visibility === 'hidden'\n );\n}\n\nfunction getCheckedRadio(nodes: any, form: any) {\n for (var i = 0; i < nodes.length; i++) {\n if (nodes[i].checked && nodes[i].form === form) {\n return nodes[i];\n }\n }\n}\n\nfunction isNotRadioOrTabbableRadio(node: any) {\n if (node.tagName !== 'INPUT' || node.type !== 'radio' || !node.name) {\n return true;\n }\n var radioScope = node.form || node.ownerDocument;\n var radioSet = radioScope.querySelectorAll(\n 'input[type=\"radio\"][name=\"' + node.name + '\"]'\n );\n var checked = getCheckedRadio(radioSet, node.form);\n return checked === node || (checked === undefined && radioSet[0] === node);\n}\n\nexport function getAllTabbingElements(parentElem: any) {\n var currentActiveElement = document.activeElement;\n var tabbableNodes = parentElem.querySelectorAll(candidateSelectors.join(','));\n var onlyTabbable = [];\n for (var i = 0; i < tabbableNodes.length; i++) {\n var node = tabbableNodes[i];\n if (\n currentActiveElement === node ||\n (!node.disabled &&\n getTabindex(node) > -1 &&\n !isHidden(node) &&\n isNotRadioOrTabbableRadio(node))\n ) {\n onlyTabbable.push(node);\n }\n }\n return onlyTabbable;\n}\n\nexport function tabTrappingKey(event: any, parentElem: any) {\n // check if current event keyCode is tab\n if (!event || event.key !== 'Tab') return;\n\n if (!parentElem || !parentElem.contains) {\n if (process && process.env.NODE_ENV === 'development') {\n console.warn('focus-trap-js: parent element is not defined');\n }\n return false;\n }\n\n if (!parentElem.contains(event.target)) {\n return false;\n }\n\n var allTabbingElements = getAllTabbingElements(parentElem);\n var firstFocusableElement = allTabbingElements[0];\n var lastFocusableElement = allTabbingElements[allTabbingElements.length - 1];\n\n if (event.shiftKey && event.target === firstFocusableElement) {\n lastFocusableElement.focus();\n event.preventDefault();\n return true;\n } else if (!event.shiftKey && event.target === lastFocusableElement) {\n firstFocusableElement.focus();\n event.preventDefault();\n return true;\n }\n return false;\n}\n\nfunction getTabindex(node: any) {\n var tabindexAttr = parseInt(node.getAttribute('tabindex'), 10);\n\n if (!isNaN(tabindexAttr)) return tabindexAttr;\n // Browsers do not return tabIndex correctly for contentEditable nodes;\n // so if they don't have a tabindex attribute specifically set, assume it's 0.\n\n if (isContentEditable(node)) return 0;\n return node.tabIndex;\n}\n\nfunction isContentEditable(node: any) {\n return node.getAttribute('contentEditable');\n}\n","import { useEffect, useRef } from 'react';\nimport { isBrowser } from './utils';\nimport {\n tabTrappingKey,\n candidateSelectors,\n getAllTabbingElements,\n} from './lib/focusTrapJs';\n\ninterface FocusTrapProps {\n container?: React.RefObject<HTMLElement> | null;\n initialFocusRef?: React.RefObject<HTMLElement>;\n}\n\nexport const FocusTrap = ({ container, initialFocusRef }: FocusTrapProps) => {\n const refLastFocus = useRef<HTMLElement | null>();\n /**\n * Handle focus lock on the modal\n */\n useEffect(() => {\n const handleKeyEvent = (event: KeyboardEvent) => {\n if (container?.current) {\n tabTrappingKey(event, container.current);\n }\n };\n\n if (isBrowser) {\n document.addEventListener('keydown', handleKeyEvent);\n }\n // On mount we focus on the first focusable element in the modal if there is one\n if (isBrowser && container?.current) {\n const savePreviousFocus = () => {\n // First we save the last focused element\n // only if it's a focusable element\n if (\n candidateSelectors.findIndex((selector) =>\n document.activeElement?.matches(selector)\n ) !== -1\n ) {\n refLastFocus.current = document.activeElement as HTMLElement;\n }\n };\n\n if (initialFocusRef) {\n savePreviousFocus();\n // We need to schedule focusing on a next frame - this allows to focus on the modal root\n requestAnimationFrame(() => {\n initialFocusRef.current?.focus();\n });\n } else {\n const allTabbingElements = getAllTabbingElements(container.current);\n if (allTabbingElements[0]) {\n savePreviousFocus();\n allTabbingElements[0].focus();\n }\n }\n }\n return () => {\n if (isBrowser) {\n document.removeEventListener('keydown', handleKeyEvent);\n // On unmount we restore the focus to the last focused element\n refLastFocus.current?.focus();\n }\n };\n }, [container, initialFocusRef]);\n\n return null;\n};\n","import { Ref, useEffect } from 'react';\n\nlet modals: Ref<Element>[] = [];\n\n/**\n * Handle the order of the modals.\n * Inspired by the material-ui implementation.\n */\nexport const modalManager = {\n /**\n * Register a new modal\n */\n add: (newModal: Ref<Element>) => {\n modals.push(newModal);\n },\n\n /**\n * Remove a modal\n */\n remove: (oldModal: Ref<Element>) => {\n modals = modals.filter((modal) => modal !== oldModal);\n },\n\n /**\n * When multiple modals are rendered will return true if current modal is the last one\n */\n isTopModal: (modal: Ref<Element>) =>\n !!modals.length && modals[modals.length - 1] === modal,\n};\n\nexport function useModalManager(ref: Ref<Element>, open: boolean) {\n useEffect(() => {\n if (open) {\n modalManager.add(ref);\n }\n return () => {\n modalManager.remove(ref);\n };\n }, [open, ref]);\n}\n","import { useEffect, useRef } from 'react';\nimport { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';\n\nexport const useScrollLock = (\n refModal: React.RefObject<Element>,\n open: boolean,\n showPortal: boolean,\n blockScroll: boolean\n) => {\n const oldRef = useRef<Element | null>(null);\n\n useEffect(() => {\n if (open && refModal.current && blockScroll) {\n oldRef.current = refModal.current;\n disableBodyScroll(refModal.current);\n }\n return () => {\n if (oldRef.current) {\n enableBodyScroll(oldRef.current);\n oldRef.current = null;\n }\n };\n }, [open, showPortal, refModal]);\n};\n","import React, { useEffect, useRef, useState } from 'react';\nimport ReactDom from 'react-dom';\nimport cx from 'classnames';\nimport CloseIcon from './CloseIcon';\nimport { FocusTrap } from './FocusTrap';\nimport { modalManager, useModalManager } from './modalManager';\nimport { useScrollLock } from './useScrollLock';\nimport { isBrowser } from './utils';\nimport useForwardedRef from '@bedrock-layout/use-forwarded-ref';\n\nconst classes = {\n root: 'react-responsive-modal-root',\n overlay: 'react-responsive-modal-overlay',\n overlayAnimationIn: 'react-responsive-modal-overlay-in',\n overlayAnimationOut: 'react-responsive-modal-overlay-out',\n modalContainer: 'react-responsive-modal-container',\n modalContainerCenter: 'react-responsive-modal-containerCenter',\n modal: 'react-responsive-modal-modal',\n modalAnimationIn: 'react-responsive-modal-modal-in',\n modalAnimationOut: 'react-responsive-modal-modal-out',\n closeButton: 'react-responsive-modal-closeButton',\n};\n\nexport interface ModalProps {\n /**\n * Control if the modal is open or not.\n */\n open: boolean;\n /**\n * Should the dialog be centered.\n *\n * Default to false.\n */\n center?: boolean;\n /**\n * Is the modal closable when user press esc key.\n *\n * Default to true.\n */\n closeOnEsc?: boolean;\n /**\n * Is the modal closable when user click on overlay.\n *\n * Default to true.\n */\n closeOnOverlayClick?: boolean;\n /**\n * Whether to block scrolling when dialog is open.\n *\n * Default to true.\n */\n blockScroll?: boolean;\n /**\n * Show the close icon.\n *\n * Default to true.\n */\n showCloseIcon?: boolean;\n /**\n * id attribute for the close icon button.\n */\n closeIconId?: string;\n /**\n * Custom icon to render (svg, img, etc...).\n */\n closeIcon?: React.ReactNode;\n /**\n * When the modal is open, trap focus within it.\n *\n * Default to true.\n */\n focusTrapped?: boolean;\n /**\n * Element to focus when focus trap is used.\n *\n * Default to undefined.\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /**\n * You can specify a container prop which should be of type `Element`.\n * The portal will be rendered inside that element.\n * The default behavior will create a div node and render it at the at the end of document.body.\n */\n container?: Element | null;\n /**\n * An object containing classNames to style the modal.\n */\n classNames?: {\n root?: string;\n overlay?: string;\n overlayAnimationIn?: string;\n overlayAnimationOut?: string;\n modalContainer?: string;\n modal?: string;\n modalAnimationIn?: string;\n modalAnimationOut?: string;\n closeButton?: string;\n closeIcon?: string;\n };\n /**\n * An object containing the styles objects to style the modal.\n */\n styles?: {\n root?: React.CSSProperties;\n overlay?: React.CSSProperties;\n modalContainer?: React.CSSProperties;\n modal?: React.CSSProperties;\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n /**\n * Animation duration in milliseconds.\n *\n * Default to 300.\n */\n animationDuration?: number;\n /**\n * ARIA role for modal\n *\n * Default to 'dialog'.\n */\n role?: string;\n /**\n * ARIA label for modal\n */\n ariaLabelledby?: string;\n /**\n * ARIA description for modal\n */\n ariaDescribedby?: string;\n /**\n * id attribute for modal\n */\n modalId?: string;\n /**\n * Callback fired when the Modal is requested to be closed by a click on the overlay or when user press esc key.\n */\n onClose: () => void;\n /**\n * Callback fired when the escape key is pressed.\n */\n onEscKeyDown?: (event: KeyboardEvent) => void;\n /**\n * Callback fired when the overlay is clicked.\n */\n onOverlayClick?: (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => void;\n /**\n * Callback fired when the Modal has exited and the animation is finished.\n */\n onAnimationEnd?: () => void;\n children?: React.ReactNode;\n}\n\nexport const Modal = React.forwardRef(\n (\n {\n open,\n center,\n blockScroll = true,\n closeOnEsc = true,\n closeOnOverlayClick = true,\n container,\n showCloseIcon = true,\n closeIconId,\n closeIcon,\n focusTrapped = true,\n initialFocusRef = undefined,\n animationDuration = 300,\n classNames,\n styles,\n role = 'dialog',\n ariaDescribedby,\n ariaLabelledby,\n modalId,\n onClose,\n onEscKeyDown,\n onOverlayClick,\n onAnimationEnd,\n children,\n }: ModalProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const refDialog = useForwardedRef(ref);\n const refModal = useRef<HTMLDivElement>(null);\n const refShouldClose = useRef<boolean | null>(null);\n const refContainer = useRef<HTMLDivElement | null>(null);\n // Lazily create the ref instance\n // https://reactjs.org/docs/hooks-faq.html#how-to-create-expensive-objects-lazily\n if (refContainer.current === null && isBrowser) {\n refContainer.current = document.createElement('div');\n }\n\n // The value should be false for srr, that way when the component is hydrated client side,\n // it will match the server rendered content\n const [showPortal, setShowPortal] = useState(false);\n\n // Hook used to manage multiple modals opened at the same time\n useModalManager(refModal, open);\n\n // Hook used to manage the scroll\n useScrollLock(refModal, open, showPortal, blockScroll);\n\n const handleOpen = () => {\n if (\n refContainer.current &&\n !container &&\n !document.body.contains(refContainer.current)\n ) {\n document.body.appendChild(refContainer.current);\n }\n\n document.addEventListener('keydown', handleKeydown);\n };\n\n const handleClose = () => {\n if (\n refContainer.current &&\n !container &&\n document.body.contains(refContainer.current)\n ) {\n document.body.removeChild(refContainer.current);\n }\n document.removeEventListener('keydown', handleKeydown);\n };\n\n const handleKeydown = (event: KeyboardEvent) => {\n // Only the last modal need to be escaped when pressing the esc key\n if (event.keyCode !== 27 || !modalManager.isTopModal(refModal)) {\n return;\n }\n\n onEscKeyDown?.(event);\n\n if (closeOnEsc) {\n onClose();\n }\n };\n\n useEffect(() => {\n return () => {\n if (showPortal) {\n // When the modal is closed or removed directly, cleanup the listeners\n handleClose();\n }\n };\n }, [showPortal]);\n\n useEffect(() => {\n // If the open prop is changing, we need to open the modal\n // This is also called on the first render if the open prop is true when the modal is created\n if (open && !showPortal) {\n setShowPortal(true);\n handleOpen();\n }\n }, [open]);\n\n const handleClickOverlay = (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => {\n if (refShouldClose.current === null) {\n refShouldClose.current = true;\n }\n\n if (!refShouldClose.current) {\n refShouldClose.current = null;\n return;\n }\n\n onOverlayClick?.(event);\n\n if (closeOnOverlayClick) {\n onClose();\n }\n\n refShouldClose.current = null;\n };\n\n const handleModalEvent = () => {\n refShouldClose.current = false;\n };\n\n const handleAnimationEnd = () => {\n if (!open) {\n setShowPortal(false);\n }\n\n onAnimationEnd?.();\n };\n\n const containerModal = container || refContainer.current;\n\n const overlayAnimation = open\n ? classNames?.overlayAnimationIn ?? classes.overlayAnimationIn\n : classNames?.overlayAnimationOut ?? classes.overlayAnimationOut;\n\n const modalAnimation = open\n ? classNames?.modalAnimationIn ?? classes.modalAnimationIn\n : classNames?.modalAnimationOut ?? classes.modalAnimationOut;\n\n return showPortal && containerModal\n ? ReactDom.createPortal(\n <div\n className={cx(classes.root, classNames?.root)}\n style={styles?.root}\n data-testid=\"root\"\n >\n <div\n className={cx(classes.overlay, classNames?.overlay)}\n data-testid=\"overlay\"\n aria-hidden={true}\n style={{\n animation: `${overlayAnimation} ${animationDuration}ms`,\n ...styles?.overlay,\n }}\n />\n <div\n ref={refModal}\n className={cx(\n classes.modalContainer,\n center && classes.modalContainerCenter,\n classNames?.modalContainer\n )}\n style={styles?.modalContainer}\n data-testid=\"modal-container\"\n onClick={handleClickOverlay}\n >\n <div\n ref={refDialog}\n className={cx(classes.modal, classNames?.modal)}\n style={{\n animation: `${modalAnimation} ${animationDuration}ms`,\n ...styles?.modal,\n }}\n onMouseDown={handleModalEvent}\n onMouseUp={handleModalEvent}\n onClick={handleModalEvent}\n onAnimationEnd={handleAnimationEnd}\n id={modalId}\n role={role}\n aria-modal=\"true\"\n aria-labelledby={ariaLabelledby}\n aria-describedby={ariaDescribedby}\n data-testid=\"modal\"\n tabIndex={-1}\n >\n {focusTrapped && (\n <FocusTrap\n container={refDialog}\n initialFocusRef={initialFocusRef}\n />\n )}\n {children}\n {showCloseIcon && (\n <CloseIcon\n classes={classes}\n classNames={classNames}\n styles={styles}\n closeIcon={closeIcon}\n onClick={onClose}\n id={closeIconId}\n />\n )}\n </div>\n </div>\n </div>,\n containerModal\n )\n : null;\n }\n);\n\nexport default Modal;\n"],"names":["CloseIcon","classes","classNames","styles","id","closeIcon","onClick","React","className","cx","closeButton","style","width","height","viewBox","d","isBrowser","window","candidateSelectors","isHidden","node","offsetParent","getComputedStyle","visibility","getCheckedRadio","nodes","form","i","length","checked","isNotRadioOrTabbableRadio","tagName","type","name","radioScope","ownerDocument","radioSet","querySelectorAll","undefined","getAllTabbingElements","parentElem","currentActiveElement","document","activeElement","tabbableNodes","join","onlyTabbable","disabled","getTabindex","push","tabTrappingKey","event","key","contains","process","env","NODE_ENV","console","warn","target","allTabbingElements","firstFocusableElement","lastFocusableElement","shiftKey","focus","preventDefault","tabindexAttr","parseInt","getAttribute","isNaN","isContentEditable","tabIndex","FocusTrap","container","initialFocusRef","refLastFocus","useRef","useEffect","handleKeyEvent","current","addEventListener","savePreviousFocus","findIndex","selector","matches","requestAnimationFrame","removeEventListener","modals","modalManager","add","newModal","remove","oldModal","filter","modal","isTopModal","useModalManager","ref","open","useScrollLock","refModal","showPortal","blockScroll","oldRef","disableBodyScroll","enableBodyScroll","root","overlay","overlayAnimationIn","overlayAnimationOut","modalContainer","modalContainerCenter","modalAnimationIn","modalAnimationOut","Modal","forwardRef","center","closeOnEsc","closeOnOverlayClick","showCloseIcon","closeIconId","focusTrapped","animationDuration","role","ariaDescribedby","ariaLabelledby","modalId","onClose","onEscKeyDown","onOverlayClick","onAnimationEnd","children","refDialog","useForwardedRef","refShouldClose","refContainer","createElement","useState","setShowPortal","handleOpen","body","appendChild","handleKeydown","handleClose","removeChild","keyCode","handleClickOverlay","handleModalEvent","handleAnimationEnd","containerModal","overlayAnimation","modalAnimation","ReactDom","createPortal","animation","onMouseDown","onMouseUp"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAoBA,IAAMA,SAAS,GAAG,SAAZA,SAAY;AAAA,MAChBC,OADgB,QAChBA,OADgB;AAAA,MAEhBC,UAFgB,QAEhBA,UAFgB;AAAA,MAGhBC,MAHgB,QAGhBA,MAHgB;AAAA,MAIhBC,EAJgB,QAIhBA,EAJgB;AAAA,MAKhBC,SALgB,QAKhBA,SALgB;AAAA,MAMhBC,OANgB,QAMhBA,OANgB;AAAA,SAQhBC,mBAAA,SAAA;AACEH,IAAAA,EAAE,EAAEA;AACJI,IAAAA,SAAS,EAAEC,EAAE,CAACR,OAAO,CAACS,WAAT,EAAsBR,UAAtB,oBAAsBA,UAAU,CAAEQ,WAAlC;AACbC,IAAAA,KAAK,EAAER,MAAF,oBAAEA,MAAM,CAAEO;AACfJ,IAAAA,OAAO,EAAEA;mBACG;GALd,EAOGD,SAAS,GACRA,SADQ,GAGRE,mBAAA,MAAA;AACEC,IAAAA,SAAS,EAAEN,UAAF,oBAAEA,UAAU,CAAEG;AACvBM,IAAAA,KAAK,EAAER,MAAF,oBAAEA,MAAM,CAAEE;AACfO,IAAAA,KAAK,EAAE;AACPC,IAAAA,MAAM,EAAE;AACRC,IAAAA,OAAO,EAAC;mBACI;GANd,EAQEP,mBAAA,OAAA;AAAMQ,IAAAA,CAAC,EAAC;GAAR,CARF,CAVJ,CARgB;AAAA,CAAlB;;ACpBO,IAAMC,SAAS,GAAG,OAAOC,MAAP,KAAkB,WAApC;;ACAP;AAEA,AAAO,IAAMC,kBAAkB,GAAG,CAChC,OADgC,EAEhC,QAFgC,EAGhC,UAHgC,EAIhC,SAJgC,EAKhC,QALgC,EAMhC,YANgC,EAOhC,iBAPgC,EAQhC,iBARgC,EAShC,kDATgC,CAA3B;;AAYP,SAASC,QAAT,CAAkBC,IAAlB;AACE;AACA;AACA,SACEA,IAAI,CAACC,YAAL,KAAsB,IAAtB,IAA8BC,gBAAgB,CAACF,IAAD,CAAhB,CAAuBG,UAAvB,KAAsC,QADtE;AAGD;;AAED,SAASC,eAAT,CAAyBC,KAAzB,EAAqCC,IAArC;AACE,OAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGF,KAAK,CAACG,MAA1B,EAAkCD,CAAC,EAAnC,EAAuC;AACrC,QAAIF,KAAK,CAACE,CAAD,CAAL,CAASE,OAAT,IAAoBJ,KAAK,CAACE,CAAD,CAAL,CAASD,IAAT,KAAkBA,IAA1C,EAAgD;AAC9C,aAAOD,KAAK,CAACE,CAAD,CAAZ;AACD;AACF;AACF;;AAED,SAASG,yBAAT,CAAmCV,IAAnC;AACE,MAAIA,IAAI,CAACW,OAAL,KAAiB,OAAjB,IAA4BX,IAAI,CAACY,IAAL,KAAc,OAA1C,IAAqD,CAACZ,IAAI,CAACa,IAA/D,EAAqE;AACnE,WAAO,IAAP;AACD;;AACD,MAAIC,UAAU,GAAGd,IAAI,CAACM,IAAL,IAAaN,IAAI,CAACe,aAAnC;AACA,MAAIC,QAAQ,GAAGF,UAAU,CAACG,gBAAX,CACb,+BAA+BjB,IAAI,CAACa,IAApC,GAA2C,IAD9B,CAAf;AAGA,MAAIJ,OAAO,GAAGL,eAAe,CAACY,QAAD,EAAWhB,IAAI,CAACM,IAAhB,CAA7B;AACA,SAAOG,OAAO,KAAKT,IAAZ,IAAqBS,OAAO,KAAKS,SAAZ,IAAyBF,QAAQ,CAAC,CAAD,CAAR,KAAgBhB,IAArE;AACD;;AAED,SAAgBmB,sBAAsBC;AACpC,MAAIC,oBAAoB,GAAGC,QAAQ,CAACC,aAApC;AACA,MAAIC,aAAa,GAAGJ,UAAU,CAACH,gBAAX,CAA4BnB,kBAAkB,CAAC2B,IAAnB,CAAwB,GAAxB,CAA5B,CAApB;AACA,MAAIC,YAAY,GAAG,EAAnB;;AACA,OAAK,IAAInB,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGiB,aAAa,CAAChB,MAAlC,EAA0CD,CAAC,EAA3C,EAA+C;AAC7C,QAAIP,IAAI,GAAGwB,aAAa,CAACjB,CAAD,CAAxB;;AACA,QACEc,oBAAoB,KAAKrB,IAAzB,IACC,CAACA,IAAI,CAAC2B,QAAN,IACCC,WAAW,CAAC5B,IAAD,CAAX,GAAoB,CAAC,CADtB,IAEC,CAACD,QAAQ,CAACC,IAAD,CAFV,IAGCU,yBAAyB,CAACV,IAAD,CAL7B,EAME;AACA0B,MAAAA,YAAY,CAACG,IAAb,CAAkB7B,IAAlB;AACD;AACF;;AACD,SAAO0B,YAAP;AACD;AAED,SAAgBI,eAAeC,OAAYX;AACzC;AACA,MAAI,CAACW,KAAD,IAAUA,KAAK,CAACC,GAAN,KAAc,KAA5B,EAAmC;;AAEnC,MAAI,CAACZ,UAAD,IAAe,CAACA,UAAU,CAACa,QAA/B,EAAyC;AACvC,QAAIC,OAAO,IAAIA,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAAxC,EAAuD;AACrDC,MAAAA,OAAO,CAACC,IAAR,CAAa,8CAAb;AACD;;AACD,WAAO,KAAP;AACD;;AAED,MAAI,CAAClB,UAAU,CAACa,QAAX,CAAoBF,KAAK,CAACQ,MAA1B,CAAL,EAAwC;AACtC,WAAO,KAAP;AACD;;AAED,MAAIC,kBAAkB,GAAGrB,qBAAqB,CAACC,UAAD,CAA9C;AACA,MAAIqB,qBAAqB,GAAGD,kBAAkB,CAAC,CAAD,CAA9C;AACA,MAAIE,oBAAoB,GAAGF,kBAAkB,CAACA,kBAAkB,CAAChC,MAAnB,GAA4B,CAA7B,CAA7C;;AAEA,MAAIuB,KAAK,CAACY,QAAN,IAAkBZ,KAAK,CAACQ,MAAN,KAAiBE,qBAAvC,EAA8D;AAC5DC,IAAAA,oBAAoB,CAACE,KAArB;AACAb,IAAAA,KAAK,CAACc,cAAN;AACA,WAAO,IAAP;AACD,GAJD,MAIO,IAAI,CAACd,KAAK,CAACY,QAAP,IAAmBZ,KAAK,CAACQ,MAAN,KAAiBG,oBAAxC,EAA8D;AACnED,IAAAA,qBAAqB,CAACG,KAAtB;AACAb,IAAAA,KAAK,CAACc,cAAN;AACA,WAAO,IAAP;AACD;;AACD,SAAO,KAAP;AACD;;AAED,SAASjB,WAAT,CAAqB5B,IAArB;AACE,MAAI8C,YAAY,GAAGC,QAAQ,CAAC/C,IAAI,CAACgD,YAAL,CAAkB,UAAlB,CAAD,EAAgC,EAAhC,CAA3B;AAEA,MAAI,CAACC,KAAK,CAACH,YAAD,CAAV,EAA0B,OAAOA,YAAP;AAE1B;;AAEA,MAAII,iBAAiB,CAAClD,IAAD,CAArB,EAA6B,OAAO,CAAP;AAC7B,SAAOA,IAAI,CAACmD,QAAZ;AACD;;AAED,SAASD,iBAAT,CAA2BlD,IAA3B;AACE,SAAOA,IAAI,CAACgD,YAAL,CAAkB,iBAAlB,CAAP;AACD;;AC5FM,IAAMI,SAAS,GAAG,SAAZA,SAAY;MAAGC,iBAAAA;MAAWC,uBAAAA;AACrC,MAAMC,YAAY,GAAGC,MAAM,EAA3B;AACA;;;;AAGAC,EAAAA,SAAS,CAAC;AACR,QAAMC,cAAc,GAAG,SAAjBA,cAAiB,CAAC3B,KAAD;AACrB,UAAIsB,SAAJ,oBAAIA,SAAS,CAAEM,OAAf,EAAwB;AACtB7B,QAAAA,cAAc,CAACC,KAAD,EAAQsB,SAAS,CAACM,OAAlB,CAAd;AACD;AACF,KAJD;;AAMA,QAAI/D,SAAJ,EAAe;AACb0B,MAAAA,QAAQ,CAACsC,gBAAT,CAA0B,SAA1B,EAAqCF,cAArC;AACD;;;AAED,QAAI9D,SAAS,KAAIyD,SAAJ,oBAAIA,SAAS,CAAEM,OAAf,CAAb,EAAqC;AACnC,UAAME,iBAAiB,GAAG,SAApBA,iBAAoB;AACxB;AACA;AACA,YACE/D,kBAAkB,CAACgE,SAAnB,CAA6B,UAACC,QAAD;AAAA;;AAAA,0CAC3BzC,QAAQ,CAACC,aADkB,qBAC3B,sBAAwByC,OAAxB,CAAgCD,QAAhC,CAD2B;AAAA,SAA7B,MAEM,CAAC,CAHT,EAIE;AACAR,UAAAA,YAAY,CAACI,OAAb,GAAuBrC,QAAQ,CAACC,aAAhC;AACD;AACF,OAVD;;AAYA,UAAI+B,eAAJ,EAAqB;AACnBO,QAAAA,iBAAiB,GADE;;AAGnBI,QAAAA,qBAAqB,CAAC;;;AACpB,mCAAAX,eAAe,CAACK,OAAhB,2CAAyBf,KAAzB;AACD,SAFoB,CAArB;AAGD,OAND,MAMO;AACL,YAAMJ,kBAAkB,GAAGrB,qBAAqB,CAACkC,SAAS,CAACM,OAAX,CAAhD;;AACA,YAAInB,kBAAkB,CAAC,CAAD,CAAtB,EAA2B;AACzBqB,UAAAA,iBAAiB;AACjBrB,UAAAA,kBAAkB,CAAC,CAAD,CAAlB,CAAsBI,KAAtB;AACD;AACF;AACF;;AACD,WAAO;AACL,UAAIhD,SAAJ,EAAe;AAAA;;AACb0B,QAAAA,QAAQ,CAAC4C,mBAAT,CAA6B,SAA7B,EAAwCR,cAAxC,EADa;;AAGb,iCAAAH,YAAY,CAACI,OAAb,2CAAsBf,KAAtB;AACD;AACF,KAND;AAOD,GA7CQ,EA6CN,CAACS,SAAD,EAAYC,eAAZ,CA7CM,CAAT;AA+CA,SAAO,IAAP;AACD,CArDM;;ACXP,IAAIa,MAAM,GAAmB,EAA7B;AAEA;;;;;AAIA,AAAO,IAAMC,YAAY,GAAG;AAC1B;;;AAGAC,EAAAA,GAAG,EAAE,aAACC,QAAD;AACHH,IAAAA,MAAM,CAACtC,IAAP,CAAYyC,QAAZ;AACD,GANyB;;AAQ1B;;;AAGAC,EAAAA,MAAM,EAAE,gBAACC,QAAD;AACNL,IAAAA,MAAM,GAAGA,MAAM,CAACM,MAAP,CAAc,UAACC,KAAD;AAAA,aAAWA,KAAK,KAAKF,QAArB;AAAA,KAAd,CAAT;AACD,GAbyB;;AAe1B;;;AAGAG,EAAAA,UAAU,EAAE,oBAACD,KAAD;AAAA,WACV,CAAC,CAACP,MAAM,CAAC3D,MAAT,IAAmB2D,MAAM,CAACA,MAAM,CAAC3D,MAAP,GAAgB,CAAjB,CAAN,KAA8BkE,KADvC;AAAA;AAlBc,CAArB;AAsBP,SAAgBE,gBAAgBC,KAAmBC;AACjDrB,EAAAA,SAAS,CAAC;AACR,QAAIqB,IAAJ,EAAU;AACRV,MAAAA,YAAY,CAACC,GAAb,CAAiBQ,GAAjB;AACD;;AACD,WAAO;AACLT,MAAAA,YAAY,CAACG,MAAb,CAAoBM,GAApB;AACD,KAFD;AAGD,GAPQ,EAON,CAACC,IAAD,EAAOD,GAAP,CAPM,CAAT;AAQD;;ACpCM,IAAME,aAAa,GAAG,SAAhBA,aAAgB,CAC3BC,QAD2B,EAE3BF,IAF2B,EAG3BG,UAH2B,EAI3BC,WAJ2B;AAM3B,MAAMC,MAAM,GAAG3B,MAAM,CAAiB,IAAjB,CAArB;AAEAC,EAAAA,SAAS,CAAC;AACR,QAAIqB,IAAI,IAAIE,QAAQ,CAACrB,OAAjB,IAA4BuB,WAAhC,EAA6C;AAC3CC,MAAAA,MAAM,CAACxB,OAAP,GAAiBqB,QAAQ,CAACrB,OAA1B;AACAyB,MAAAA,iBAAiB,CAACJ,QAAQ,CAACrB,OAAV,CAAjB;AACD;;AACD,WAAO;AACL,UAAIwB,MAAM,CAACxB,OAAX,EAAoB;AAClB0B,QAAAA,gBAAgB,CAACF,MAAM,CAACxB,OAAR,CAAhB;AACAwB,QAAAA,MAAM,CAACxB,OAAP,GAAiB,IAAjB;AACD;AACF,KALD;AAMD,GAXQ,EAWN,CAACmB,IAAD,EAAOG,UAAP,EAAmBD,QAAnB,CAXM,CAAT;AAYD,CApBM;;ACOP,IAAMnG,OAAO,GAAG;AACdyG,EAAAA,IAAI,EAAE,6BADQ;AAEdC,EAAAA,OAAO,EAAE,gCAFK;AAGdC,EAAAA,kBAAkB,EAAE,mCAHN;AAIdC,EAAAA,mBAAmB,EAAE,oCAJP;AAKdC,EAAAA,cAAc,EAAE,kCALF;AAMdC,EAAAA,oBAAoB,EAAE,wCANR;AAOdjB,EAAAA,KAAK,EAAE,8BAPO;AAQdkB,EAAAA,gBAAgB,EAAE,iCARJ;AASdC,EAAAA,iBAAiB,EAAE,kCATL;AAUdvG,EAAAA,WAAW,EAAE;AAVC,CAAhB;AAiJA,IAAawG,KAAK,gBAAG3G,KAAK,CAAC4G,UAAN,CACnB,gBA0BElB,GA1BF;;;MAEIC,YAAAA;MACAkB,cAAAA;8BACAd;MAAAA,4CAAc;6BACde;MAAAA,0CAAa;mCACbC;MAAAA,yDAAsB;MACtB7C,iBAAAA;gCACA8C;MAAAA,gDAAgB;MAChBC,mBAAAA;MACAnH,iBAAAA;+BACAoH;MAAAA,8CAAe;kCACf/C;MAAAA,oDAAkBpC;mCAClBoF;MAAAA,uDAAoB;MACpBxH,kBAAAA;MACAC,cAAAA;uBACAwH;MAAAA,8BAAO;MACPC,uBAAAA;MACAC,sBAAAA;MACAC,eAAAA;MACAC,eAAAA;MACAC,oBAAAA;MACAC,sBAAAA;MACAC,sBAAAA;MACAC,gBAAAA;AAIF,MAAMC,SAAS,GAAGC,eAAe,CAACpC,GAAD,CAAjC;AACA,MAAMG,QAAQ,GAAGxB,MAAM,CAAiB,IAAjB,CAAvB;AACA,MAAM0D,cAAc,GAAG1D,MAAM,CAAiB,IAAjB,CAA7B;AACA,MAAM2D,YAAY,GAAG3D,MAAM,CAAwB,IAAxB,CAA3B;AAEA;;AACA,MAAI2D,YAAY,CAACxD,OAAb,KAAyB,IAAzB,IAAiC/D,SAArC,EAAgD;AAC9CuH,IAAAA,YAAY,CAACxD,OAAb,GAAuBrC,QAAQ,CAAC8F,aAAT,CAAuB,KAAvB,CAAvB;AACD;AAGD;;;kBACoCC,QAAQ,CAAC,KAAD;MAArCpC;MAAYqC;;;AAGnB1C,EAAAA,eAAe,CAACI,QAAD,EAAWF,IAAX,CAAf;;AAGAC,EAAAA,aAAa,CAACC,QAAD,EAAWF,IAAX,EAAiBG,UAAjB,EAA6BC,WAA7B,CAAb;;AAEA,MAAMqC,UAAU,GAAG,SAAbA,UAAa;AACjB,QACEJ,YAAY,CAACxD,OAAb,IACA,CAACN,SADD,IAEA,CAAC/B,QAAQ,CAACkG,IAAT,CAAcvF,QAAd,CAAuBkF,YAAY,CAACxD,OAApC,CAHH,EAIE;AACArC,MAAAA,QAAQ,CAACkG,IAAT,CAAcC,WAAd,CAA0BN,YAAY,CAACxD,OAAvC;AACD;;AAEDrC,IAAAA,QAAQ,CAACsC,gBAAT,CAA0B,SAA1B,EAAqC8D,aAArC;AACD,GAVD;;AAYA,MAAMC,WAAW,GAAG,SAAdA,WAAc;AAClB,QACER,YAAY,CAACxD,OAAb,IACA,CAACN,SADD,IAEA/B,QAAQ,CAACkG,IAAT,CAAcvF,QAAd,CAAuBkF,YAAY,CAACxD,OAApC,CAHF,EAIE;AACArC,MAAAA,QAAQ,CAACkG,IAAT,CAAcI,WAAd,CAA0BT,YAAY,CAACxD,OAAvC;AACD;;AACDrC,IAAAA,QAAQ,CAAC4C,mBAAT,CAA6B,SAA7B,EAAwCwD,aAAxC;AACD,GATD;;AAWA,MAAMA,aAAa,GAAG,SAAhBA,aAAgB,CAAC3F,KAAD;AACpB;AACA,QAAIA,KAAK,CAAC8F,OAAN,KAAkB,EAAlB,IAAwB,CAACzD,YAAY,CAACO,UAAb,CAAwBK,QAAxB,CAA7B,EAAgE;AAC9D;AACD;;AAED4B,IAAAA,YAAY,QAAZ,YAAAA,YAAY,CAAG7E,KAAH,CAAZ;;AAEA,QAAIkE,UAAJ,EAAgB;AACdU,MAAAA,OAAO;AACR;AACF,GAXD;;AAaAlD,EAAAA,SAAS,CAAC;AACR,WAAO;AACL,UAAIwB,UAAJ,EAAgB;AACd;AACA0C,QAAAA,WAAW;AACZ;AACF,KALD;AAMD,GAPQ,EAON,CAAC1C,UAAD,CAPM,CAAT;AASAxB,EAAAA,SAAS,CAAC;AACR;AACA;AACA,QAAIqB,IAAI,IAAI,CAACG,UAAb,EAAyB;AACvBqC,MAAAA,aAAa,CAAC,IAAD,CAAb;AACAC,MAAAA,UAAU;AACX;AACF,GAPQ,EAON,CAACzC,IAAD,CAPM,CAAT;;AASA,MAAMgD,kBAAkB,GAAG,SAArBA,kBAAqB,CACzB/F,KADyB;AAGzB,QAAImF,cAAc,CAACvD,OAAf,KAA2B,IAA/B,EAAqC;AACnCuD,MAAAA,cAAc,CAACvD,OAAf,GAAyB,IAAzB;AACD;;AAED,QAAI,CAACuD,cAAc,CAACvD,OAApB,EAA6B;AAC3BuD,MAAAA,cAAc,CAACvD,OAAf,GAAyB,IAAzB;AACA;AACD;;AAEDkD,IAAAA,cAAc,QAAd,YAAAA,cAAc,CAAG9E,KAAH,CAAd;;AAEA,QAAImE,mBAAJ,EAAyB;AACvBS,MAAAA,OAAO;AACR;;AAEDO,IAAAA,cAAc,CAACvD,OAAf,GAAyB,IAAzB;AACD,GAnBD;;AAqBA,MAAMoE,gBAAgB,GAAG,SAAnBA,gBAAmB;AACvBb,IAAAA,cAAc,CAACvD,OAAf,GAAyB,KAAzB;AACD,GAFD;;AAIA,MAAMqE,kBAAkB,GAAG,SAArBA,kBAAqB;AACzB,QAAI,CAAClD,IAAL,EAAW;AACTwC,MAAAA,aAAa,CAAC,KAAD,CAAb;AACD;;AAEDR,IAAAA,cAAc,QAAd,YAAAA,cAAc;AACf,GAND;;AAQA,MAAMmB,cAAc,GAAG5E,SAAS,IAAI8D,YAAY,CAACxD,OAAjD;AAEA,MAAMuE,gBAAgB,GAAGpD,IAAI,4BACzBhG,UADyB,oBACzBA,UAAU,CAAE0G,kBADa,oCACS3G,OAAO,CAAC2G,kBADjB,6BAEzB1G,UAFyB,oBAEzBA,UAAU,CAAE2G,mBAFa,qCAEU5G,OAAO,CAAC4G,mBAF/C;AAIA,MAAM0C,cAAc,GAAGrD,IAAI,4BACvBhG,UADuB,oBACvBA,UAAU,CAAE8G,gBADW,oCACS/G,OAAO,CAAC+G,gBADjB,6BAEvB9G,UAFuB,oBAEvBA,UAAU,CAAE+G,iBAFW,qCAEUhH,OAAO,CAACgH,iBAF7C;AAIA,SAAOZ,UAAU,IAAIgD,cAAd,GACHG,QAAQ,CAACC,YAAT,CACElJ,mBAAA,MAAA;AACEC,IAAAA,SAAS,EAAEC,EAAE,CAACR,OAAO,CAACyG,IAAT,EAAexG,UAAf,oBAAeA,UAAU,CAAEwG,IAA3B;AACb/F,IAAAA,KAAK,EAAER,MAAF,oBAAEA,MAAM,CAAEuG;mBACH;GAHd,EAKEnG,mBAAA,MAAA;AACEC,IAAAA,SAAS,EAAEC,EAAE,CAACR,OAAO,CAAC0G,OAAT,EAAkBzG,UAAlB,oBAAkBA,UAAU,CAAEyG,OAA9B;mBACD;mBACC;AACbhG,IAAAA,KAAK;AACH+I,MAAAA,SAAS,EAAKJ,gBAAL,SAAyB5B,iBAAzB;AADN,OAEAvH,MAFA,oBAEAA,MAAM,CAAEwG,OAFR;GAJP,CALF,EAcEpG,mBAAA,MAAA;AACE0F,IAAAA,GAAG,EAAEG;AACL5F,IAAAA,SAAS,EAAEC,EAAE,CACXR,OAAO,CAAC6G,cADG,EAEXM,MAAM,IAAInH,OAAO,CAAC8G,oBAFP,EAGX7G,UAHW,oBAGXA,UAAU,CAAE4G,cAHD;AAKbnG,IAAAA,KAAK,EAAER,MAAF,oBAAEA,MAAM,CAAE2G;mBACH;AACZxG,IAAAA,OAAO,EAAE4I;GATX,EAWE3I,mBAAA,MAAA;AACE0F,IAAAA,GAAG,EAAEmC;AACL5H,IAAAA,SAAS,EAAEC,EAAE,CAACR,OAAO,CAAC6F,KAAT,EAAgB5F,UAAhB,oBAAgBA,UAAU,CAAE4F,KAA5B;AACbnF,IAAAA,KAAK;AACH+I,MAAAA,SAAS,EAAKH,cAAL,SAAuB7B,iBAAvB;AADN,OAEAvH,MAFA,oBAEAA,MAAM,CAAE2F,KAFR;AAIL6D,IAAAA,WAAW,EAAER;AACbS,IAAAA,SAAS,EAAET;AACX7I,IAAAA,OAAO,EAAE6I;AACTjB,IAAAA,cAAc,EAAEkB;AAChBhJ,IAAAA,EAAE,EAAE0H;AACJH,IAAAA,IAAI,EAAEA;kBACK;uBACME;wBACCD;mBACN;AACZrD,IAAAA,QAAQ,EAAE,CAAC;GAjBb,EAmBGkD,YAAY,IACXlH,mBAAA,CAACiE,SAAD;AACEC,IAAAA,SAAS,EAAE2D;AACX1D,IAAAA,eAAe,EAAEA;GAFnB,CApBJ,EAyBGyD,QAzBH,EA0BGZ,aAAa,IACZhH,mBAAA,CAACP,SAAD;AACEC,IAAAA,OAAO,EAAEA;AACTC,IAAAA,UAAU,EAAEA;AACZC,IAAAA,MAAM,EAAEA;AACRE,IAAAA,SAAS,EAAEA;AACXC,IAAAA,OAAO,EAAEyH;AACT3H,IAAAA,EAAE,EAAEoH;GANN,CA3BJ,CAXF,CAdF,CADF,EAiEE6B,cAjEF,CADG,GAoEH,IApEJ;AAqED,CAvNkB,CAAd;;;;;"}
|
|
1
|
+
{"version":3,"file":"react-responsive-modal.esm.js","sources":["../src/CloseIcon.tsx","../src/utils.ts","../src/lib/focusTrapJs.ts","../src/FocusTrap.tsx","../src/modalManager.ts","../src/useScrollLock.ts","../src/index.tsx"],"sourcesContent":["import React from 'react';\nimport cx from 'classnames';\n\ninterface CloseIconProps {\n id?: string;\n closeIcon?: React.ReactNode;\n styles?: {\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n classNames?: {\n closeButton?: string;\n closeIcon?: string;\n };\n classes: {\n closeButton?: string;\n };\n onClick: () => void;\n}\n\nconst CloseIcon = ({\n classes,\n classNames,\n styles,\n id,\n closeIcon,\n onClick,\n}: CloseIconProps) => (\n <button\n id={id}\n className={cx(classes.closeButton, classNames?.closeButton)}\n style={styles?.closeButton}\n onClick={onClick}\n data-testid=\"close-button\"\n >\n {closeIcon ? (\n closeIcon\n ) : (\n <svg\n className={classNames?.closeIcon}\n style={styles?.closeIcon}\n width={28}\n height={28}\n viewBox=\"0 0 36 36\"\n data-testid=\"close-icon\"\n >\n <path d=\"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z\" />\n </svg>\n )}\n </button>\n);\n\nexport default CloseIcon;\n","export const isBrowser = typeof window !== 'undefined';\n","// https://github.com/alexandrzavalii/focus-trap-js/blob/master/src/index.js v1.1.0\n\nexport const candidateSelectors = [\n 'input',\n 'select',\n 'textarea',\n 'a[href]',\n 'button',\n '[tabindex]',\n 'audio[controls]',\n 'video[controls]',\n '[contenteditable]:not([contenteditable=\"false\"])',\n];\n\nfunction isHidden(node: any) {\n // offsetParent being null will allow detecting cases where an element is invisible or inside an invisible element,\n // as long as the element does not use position: fixed. For them, their visibility has to be checked directly as well.\n return (\n node.offsetParent === null || getComputedStyle(node).visibility === 'hidden'\n );\n}\n\nfunction getCheckedRadio(nodes: any, form: any) {\n for (var i = 0; i < nodes.length; i++) {\n if (nodes[i].checked && nodes[i].form === form) {\n return nodes[i];\n }\n }\n}\n\nfunction isNotRadioOrTabbableRadio(node: any) {\n if (node.tagName !== 'INPUT' || node.type !== 'radio' || !node.name) {\n return true;\n }\n var radioScope = node.form || node.ownerDocument;\n var radioSet = radioScope.querySelectorAll(\n 'input[type=\"radio\"][name=\"' + node.name + '\"]'\n );\n var checked = getCheckedRadio(radioSet, node.form);\n return checked === node || (checked === undefined && radioSet[0] === node);\n}\n\nexport function getAllTabbingElements(parentElem: any) {\n var currentActiveElement = document.activeElement;\n var tabbableNodes = parentElem.querySelectorAll(candidateSelectors.join(','));\n var onlyTabbable = [];\n for (var i = 0; i < tabbableNodes.length; i++) {\n var node = tabbableNodes[i];\n if (\n currentActiveElement === node ||\n (!node.disabled &&\n getTabindex(node) > -1 &&\n !isHidden(node) &&\n isNotRadioOrTabbableRadio(node))\n ) {\n onlyTabbable.push(node);\n }\n }\n return onlyTabbable;\n}\n\nexport function tabTrappingKey(event: any, parentElem: any) {\n // check if current event keyCode is tab\n if (!event || event.key !== 'Tab') return;\n\n if (!parentElem || !parentElem.contains) {\n if (process && process.env.NODE_ENV === 'development') {\n console.warn('focus-trap-js: parent element is not defined');\n }\n return false;\n }\n\n if (!parentElem.contains(event.target)) {\n return false;\n }\n\n var allTabbingElements = getAllTabbingElements(parentElem);\n var firstFocusableElement = allTabbingElements[0];\n var lastFocusableElement = allTabbingElements[allTabbingElements.length - 1];\n\n if (event.shiftKey && event.target === firstFocusableElement) {\n lastFocusableElement.focus();\n event.preventDefault();\n return true;\n } else if (!event.shiftKey && event.target === lastFocusableElement) {\n firstFocusableElement.focus();\n event.preventDefault();\n return true;\n }\n return false;\n}\n\nfunction getTabindex(node: any) {\n var tabindexAttr = parseInt(node.getAttribute('tabindex'), 10);\n\n if (!isNaN(tabindexAttr)) return tabindexAttr;\n // Browsers do not return tabIndex correctly for contentEditable nodes;\n // so if they don't have a tabindex attribute specifically set, assume it's 0.\n\n if (isContentEditable(node)) return 0;\n return node.tabIndex;\n}\n\nfunction isContentEditable(node: any) {\n return node.getAttribute('contentEditable');\n}\n","import { useEffect, useRef } from 'react';\nimport { isBrowser } from './utils';\nimport {\n tabTrappingKey,\n candidateSelectors,\n getAllTabbingElements,\n} from './lib/focusTrapJs';\n\ninterface FocusTrapProps {\n container?: React.RefObject<HTMLElement> | null;\n initialFocusRef?: React.RefObject<HTMLElement>;\n}\n\nexport const FocusTrap = ({ container, initialFocusRef }: FocusTrapProps) => {\n const refLastFocus = useRef<HTMLElement | null>();\n /**\n * Handle focus lock on the modal\n */\n useEffect(() => {\n const handleKeyEvent = (event: KeyboardEvent) => {\n if (container?.current) {\n tabTrappingKey(event, container.current);\n }\n };\n\n if (isBrowser) {\n document.addEventListener('keydown', handleKeyEvent);\n }\n // On mount we focus on the first focusable element in the modal if there is one\n if (isBrowser && container?.current) {\n const savePreviousFocus = () => {\n // First we save the last focused element\n // only if it's a focusable element\n if (\n candidateSelectors.findIndex((selector) =>\n document.activeElement?.matches(selector)\n ) !== -1\n ) {\n refLastFocus.current = document.activeElement as HTMLElement;\n }\n };\n\n if (initialFocusRef) {\n savePreviousFocus();\n // We need to schedule focusing on a next frame - this allows to focus on the modal root\n requestAnimationFrame(() => {\n initialFocusRef.current?.focus();\n });\n } else {\n const allTabbingElements = getAllTabbingElements(container.current);\n if (allTabbingElements[0]) {\n savePreviousFocus();\n allTabbingElements[0].focus();\n }\n }\n }\n return () => {\n if (isBrowser) {\n document.removeEventListener('keydown', handleKeyEvent);\n // On unmount we restore the focus to the last focused element\n refLastFocus.current?.focus();\n }\n };\n }, [container, initialFocusRef]);\n\n return null;\n};\n","import { Ref, useEffect } from 'react';\n\nlet modals: Ref<Element>[] = [];\n\n/**\n * Handle the order of the modals.\n * Inspired by the material-ui implementation.\n */\nexport const modalManager = {\n /**\n * Register a new modal\n */\n add: (newModal: Ref<Element>) => {\n modals.push(newModal);\n },\n\n /**\n * Remove a modal\n */\n remove: (oldModal: Ref<Element>) => {\n modals = modals.filter((modal) => modal !== oldModal);\n },\n\n /**\n * When multiple modals are rendered will return true if current modal is the last one\n */\n isTopModal: (modal: Ref<Element>) =>\n !!modals.length && modals[modals.length - 1] === modal,\n};\n\nexport function useModalManager(ref: Ref<Element>, open: boolean) {\n useEffect(() => {\n if (open) {\n modalManager.add(ref);\n }\n return () => {\n modalManager.remove(ref);\n };\n }, [open, ref]);\n}\n","import { useEffect, useRef } from 'react';\nimport { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';\n\nexport const useScrollLock = (\n refModal: React.RefObject<Element>,\n open: boolean,\n showPortal: boolean,\n blockScroll: boolean,\n reserveScrollBarGap?: boolean\n) => {\n const oldRef = useRef<Element | null>(null);\n\n useEffect(() => {\n if (open && refModal.current && blockScroll) {\n oldRef.current = refModal.current;\n disableBodyScroll(refModal.current, { reserveScrollBarGap });\n }\n return () => {\n if (oldRef.current) {\n enableBodyScroll(oldRef.current);\n oldRef.current = null;\n }\n };\n }, [open, showPortal, refModal, blockScroll, reserveScrollBarGap]);\n};\n","import React, { useEffect, useRef, useState } from 'react';\nimport ReactDom from 'react-dom';\nimport cx from 'classnames';\nimport CloseIcon from './CloseIcon';\nimport { FocusTrap } from './FocusTrap';\nimport { modalManager, useModalManager } from './modalManager';\nimport { useScrollLock } from './useScrollLock';\nimport { isBrowser } from './utils';\nimport useForwardedRef from '@bedrock-layout/use-forwarded-ref';\n\nconst classes = {\n root: 'react-responsive-modal-root',\n overlay: 'react-responsive-modal-overlay',\n overlayAnimationIn: 'react-responsive-modal-overlay-in',\n overlayAnimationOut: 'react-responsive-modal-overlay-out',\n modalContainer: 'react-responsive-modal-container',\n modalContainerCenter: 'react-responsive-modal-containerCenter',\n modal: 'react-responsive-modal-modal',\n modalAnimationIn: 'react-responsive-modal-modal-in',\n modalAnimationOut: 'react-responsive-modal-modal-out',\n closeButton: 'react-responsive-modal-closeButton',\n};\n\nexport interface ModalProps {\n /**\n * Control if the modal is open or not.\n */\n open: boolean;\n /**\n * Should the dialog be centered.\n *\n * Default to false.\n */\n center?: boolean;\n /**\n * Is the modal closable when user press esc key.\n *\n * Default to true.\n */\n closeOnEsc?: boolean;\n /**\n * Is the modal closable when user click on overlay.\n *\n * Default to true.\n */\n closeOnOverlayClick?: boolean;\n /**\n * Whether to block scrolling when dialog is open.\n *\n * Default to true.\n */\n blockScroll?: boolean;\n /**\n * Show the close icon.\n *\n * Default to true.\n */\n showCloseIcon?: boolean;\n /**\n * id attribute for the close icon button.\n */\n closeIconId?: string;\n /**\n * Custom icon to render (svg, img, etc...).\n */\n closeIcon?: React.ReactNode;\n /**\n * When the modal is open, trap focus within it.\n *\n * Default to true.\n */\n focusTrapped?: boolean;\n /**\n * Element to focus when focus trap is used.\n *\n * Default to undefined.\n */\n initialFocusRef?: React.RefObject<HTMLElement>;\n /**\n * You can specify a container prop which should be of type `Element`.\n * The portal will be rendered inside that element.\n * The default behavior will create a div node and render it at the at the end of document.body.\n */\n container?: Element | null;\n /**\n * An object containing classNames to style the modal.\n */\n classNames?: {\n root?: string;\n overlay?: string;\n overlayAnimationIn?: string;\n overlayAnimationOut?: string;\n modalContainer?: string;\n modal?: string;\n modalAnimationIn?: string;\n modalAnimationOut?: string;\n closeButton?: string;\n closeIcon?: string;\n };\n /**\n * An object containing the styles objects to style the modal.\n */\n styles?: {\n root?: React.CSSProperties;\n overlay?: React.CSSProperties;\n modalContainer?: React.CSSProperties;\n modal?: React.CSSProperties;\n closeButton?: React.CSSProperties;\n closeIcon?: React.CSSProperties;\n };\n /**\n * Animation duration in milliseconds.\n *\n * Default to 300.\n */\n animationDuration?: number;\n /**\n * ARIA role for modal\n *\n * Default to 'dialog'.\n */\n role?: string;\n /**\n * ARIA label for modal\n */\n ariaLabelledby?: string;\n /**\n * ARIA description for modal\n */\n ariaDescribedby?: string;\n /**\n * Avoid unpleasant flickering effect when body overflow is hidden. For more information see https://www.npmjs.com/package/body-scroll-lock\n */\n reserveScrollBarGap?: boolean;\n /**\n * id attribute for modal container\n */\n containerId?: string;\n /**\n * id attribute for modal\n */\n modalId?: string;\n /**\n * Callback fired when the Modal is requested to be closed by a click on the overlay or when user press esc key.\n */\n onClose: () => void;\n /**\n * Callback fired when the escape key is pressed.\n */\n onEscKeyDown?: (event: KeyboardEvent) => void;\n /**\n * Callback fired when the overlay is clicked.\n */\n onOverlayClick?: (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => void;\n /**\n * Callback fired when the Modal has exited and the animation is finished.\n */\n onAnimationEnd?: () => void;\n children?: React.ReactNode;\n}\n\nexport const Modal = React.forwardRef(\n (\n {\n open,\n center,\n blockScroll = true,\n closeOnEsc = true,\n closeOnOverlayClick = true,\n container,\n showCloseIcon = true,\n closeIconId,\n closeIcon,\n focusTrapped = true,\n initialFocusRef = undefined,\n animationDuration = 300,\n classNames,\n styles,\n role = 'dialog',\n ariaDescribedby,\n ariaLabelledby,\n containerId,\n modalId,\n onClose,\n onEscKeyDown,\n onOverlayClick,\n onAnimationEnd,\n children,\n reserveScrollBarGap,\n }: ModalProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const refDialog = useForwardedRef(ref);\n const refModal = useRef<HTMLDivElement>(null);\n const refShouldClose = useRef<boolean | null>(null);\n const refContainer = useRef<HTMLDivElement | null>(null);\n // Lazily create the ref instance\n // https://reactjs.org/docs/hooks-faq.html#how-to-create-expensive-objects-lazily\n if (refContainer.current === null && isBrowser) {\n refContainer.current = document.createElement('div');\n }\n\n // The value should be false for srr, that way when the component is hydrated client side,\n // it will match the server rendered content\n const [showPortal, setShowPortal] = useState(false);\n\n // Hook used to manage multiple modals opened at the same time\n useModalManager(refModal, open);\n\n // Hook used to manage the scroll\n useScrollLock(refModal, open, showPortal, blockScroll, reserveScrollBarGap);\n\n const handleOpen = () => {\n if (\n refContainer.current &&\n !container &&\n !document.body.contains(refContainer.current)\n ) {\n document.body.appendChild(refContainer.current);\n }\n\n document.addEventListener('keydown', handleKeydown);\n };\n\n const handleClose = () => {\n if (\n refContainer.current &&\n !container &&\n document.body.contains(refContainer.current)\n ) {\n document.body.removeChild(refContainer.current);\n }\n document.removeEventListener('keydown', handleKeydown);\n };\n\n const handleKeydown = (event: KeyboardEvent) => {\n // Only the last modal need to be escaped when pressing the esc key\n if (event.keyCode !== 27 || !modalManager.isTopModal(refModal)) {\n return;\n }\n\n onEscKeyDown?.(event);\n\n if (closeOnEsc) {\n onClose();\n }\n };\n\n useEffect(() => {\n return () => {\n if (showPortal) {\n // When the modal is closed or removed directly, cleanup the listeners\n handleClose();\n }\n };\n }, [showPortal]);\n\n useEffect(() => {\n // If the open prop is changing, we need to open the modal\n // This is also called on the first render if the open prop is true when the modal is created\n if (open && !showPortal) {\n setShowPortal(true);\n handleOpen();\n }\n }, [open]);\n\n const handleClickOverlay = (\n event: React.MouseEvent<HTMLDivElement, MouseEvent>\n ) => {\n if (refShouldClose.current === null) {\n refShouldClose.current = true;\n }\n\n if (!refShouldClose.current) {\n refShouldClose.current = null;\n return;\n }\n\n onOverlayClick?.(event);\n\n if (closeOnOverlayClick) {\n onClose();\n }\n\n refShouldClose.current = null;\n };\n\n const handleModalEvent = () => {\n refShouldClose.current = false;\n };\n\n const handleAnimationEnd = () => {\n if (!open) {\n setShowPortal(false);\n }\n\n onAnimationEnd?.();\n };\n\n const containerModal = container || refContainer.current;\n\n const overlayAnimation = open\n ? classNames?.overlayAnimationIn ?? classes.overlayAnimationIn\n : classNames?.overlayAnimationOut ?? classes.overlayAnimationOut;\n\n const modalAnimation = open\n ? classNames?.modalAnimationIn ?? classes.modalAnimationIn\n : classNames?.modalAnimationOut ?? classes.modalAnimationOut;\n\n return showPortal && containerModal\n ? ReactDom.createPortal(\n <div\n className={cx(classes.root, classNames?.root)}\n style={styles?.root}\n data-testid=\"root\"\n >\n <div\n className={cx(classes.overlay, classNames?.overlay)}\n data-testid=\"overlay\"\n aria-hidden={true}\n style={{\n animation: `${overlayAnimation} ${animationDuration}ms`,\n ...styles?.overlay,\n }}\n />\n <div\n ref={refModal}\n id={containerId}\n className={cx(\n classes.modalContainer,\n center && classes.modalContainerCenter,\n classNames?.modalContainer\n )}\n style={styles?.modalContainer}\n data-testid=\"modal-container\"\n onClick={handleClickOverlay}\n >\n <div\n ref={refDialog}\n className={cx(classes.modal, classNames?.modal)}\n style={{\n animation: `${modalAnimation} ${animationDuration}ms`,\n ...styles?.modal,\n }}\n onMouseDown={handleModalEvent}\n onMouseUp={handleModalEvent}\n onClick={handleModalEvent}\n onAnimationEnd={handleAnimationEnd}\n id={modalId}\n role={role}\n aria-modal=\"true\"\n aria-labelledby={ariaLabelledby}\n aria-describedby={ariaDescribedby}\n data-testid=\"modal\"\n tabIndex={-1}\n >\n {focusTrapped && (\n <FocusTrap\n container={refDialog}\n initialFocusRef={initialFocusRef}\n />\n )}\n {children}\n {showCloseIcon && (\n <CloseIcon\n classes={classes}\n classNames={classNames}\n styles={styles}\n closeIcon={closeIcon}\n onClick={onClose}\n id={closeIconId}\n />\n )}\n </div>\n </div>\n </div>,\n containerModal\n )\n : null;\n }\n);\n\nexport default Modal;\n"],"names":["CloseIcon","classes","classNames","styles","id","closeIcon","onClick","React","className","cx","closeButton","style","width","height","viewBox","d","isBrowser","window","candidateSelectors","isHidden","node","offsetParent","getComputedStyle","visibility","getCheckedRadio","nodes","form","i","length","checked","isNotRadioOrTabbableRadio","tagName","type","name","radioScope","ownerDocument","radioSet","querySelectorAll","undefined","getAllTabbingElements","parentElem","currentActiveElement","document","activeElement","tabbableNodes","join","onlyTabbable","disabled","getTabindex","push","tabTrappingKey","event","key","contains","process","env","NODE_ENV","console","warn","target","allTabbingElements","firstFocusableElement","lastFocusableElement","shiftKey","focus","preventDefault","tabindexAttr","parseInt","getAttribute","isNaN","isContentEditable","tabIndex","FocusTrap","container","initialFocusRef","refLastFocus","useRef","useEffect","handleKeyEvent","current","addEventListener","savePreviousFocus","findIndex","selector","matches","requestAnimationFrame","removeEventListener","modals","modalManager","add","newModal","remove","oldModal","filter","modal","isTopModal","useModalManager","ref","open","useScrollLock","refModal","showPortal","blockScroll","reserveScrollBarGap","oldRef","disableBodyScroll","enableBodyScroll","root","overlay","overlayAnimationIn","overlayAnimationOut","modalContainer","modalContainerCenter","modalAnimationIn","modalAnimationOut","Modal","forwardRef","center","closeOnEsc","closeOnOverlayClick","showCloseIcon","closeIconId","focusTrapped","animationDuration","role","ariaDescribedby","ariaLabelledby","containerId","modalId","onClose","onEscKeyDown","onOverlayClick","onAnimationEnd","children","refDialog","useForwardedRef","refShouldClose","refContainer","createElement","useState","setShowPortal","handleOpen","body","appendChild","handleKeydown","handleClose","removeChild","keyCode","handleClickOverlay","handleModalEvent","handleAnimationEnd","containerModal","overlayAnimation","modalAnimation","ReactDom","createPortal","animation","onMouseDown","onMouseUp"],"mappings":"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"}
|
package/dist/useScrollLock.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const useScrollLock: (refModal: React.RefObject<Element>, open: boolean, showPortal: boolean, blockScroll: boolean) => void;
|
|
1
|
+
export declare const useScrollLock: (refModal: React.RefObject<Element>, open: boolean, showPortal: boolean, blockScroll: boolean, reserveScrollBarGap?: boolean | undefined) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-responsive-modal",
|
|
3
|
-
"version": "6.
|
|
3
|
+
"version": "6.3.2",
|
|
4
4
|
"description": "A simple responsive and accessible react modal",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -47,11 +47,11 @@
|
|
|
47
47
|
"size-limit": [
|
|
48
48
|
{
|
|
49
49
|
"path": "dist/react-responsive-modal.cjs.production.min.js",
|
|
50
|
-
"limit": "4.
|
|
50
|
+
"limit": "4.1 KB"
|
|
51
51
|
},
|
|
52
52
|
{
|
|
53
53
|
"path": "dist/react-responsive-modal.esm.js",
|
|
54
|
-
"limit": "4.
|
|
54
|
+
"limit": "4.1 KB"
|
|
55
55
|
}
|
|
56
56
|
],
|
|
57
57
|
"dependencies": {
|
package/src/index.tsx
CHANGED
|
@@ -128,6 +128,14 @@ export interface ModalProps {
|
|
|
128
128
|
* ARIA description for modal
|
|
129
129
|
*/
|
|
130
130
|
ariaDescribedby?: string;
|
|
131
|
+
/**
|
|
132
|
+
* Avoid unpleasant flickering effect when body overflow is hidden. For more information see https://www.npmjs.com/package/body-scroll-lock
|
|
133
|
+
*/
|
|
134
|
+
reserveScrollBarGap?: boolean;
|
|
135
|
+
/**
|
|
136
|
+
* id attribute for modal container
|
|
137
|
+
*/
|
|
138
|
+
containerId?: string;
|
|
131
139
|
/**
|
|
132
140
|
* id attribute for modal
|
|
133
141
|
*/
|
|
@@ -173,12 +181,14 @@ export const Modal = React.forwardRef(
|
|
|
173
181
|
role = 'dialog',
|
|
174
182
|
ariaDescribedby,
|
|
175
183
|
ariaLabelledby,
|
|
184
|
+
containerId,
|
|
176
185
|
modalId,
|
|
177
186
|
onClose,
|
|
178
187
|
onEscKeyDown,
|
|
179
188
|
onOverlayClick,
|
|
180
189
|
onAnimationEnd,
|
|
181
190
|
children,
|
|
191
|
+
reserveScrollBarGap,
|
|
182
192
|
}: ModalProps,
|
|
183
193
|
ref: React.ForwardedRef<HTMLDivElement>
|
|
184
194
|
) => {
|
|
@@ -200,7 +210,7 @@ export const Modal = React.forwardRef(
|
|
|
200
210
|
useModalManager(refModal, open);
|
|
201
211
|
|
|
202
212
|
// Hook used to manage the scroll
|
|
203
|
-
useScrollLock(refModal, open, showPortal, blockScroll);
|
|
213
|
+
useScrollLock(refModal, open, showPortal, blockScroll, reserveScrollBarGap);
|
|
204
214
|
|
|
205
215
|
const handleOpen = () => {
|
|
206
216
|
if (
|
|
@@ -317,6 +327,7 @@ export const Modal = React.forwardRef(
|
|
|
317
327
|
/>
|
|
318
328
|
<div
|
|
319
329
|
ref={refModal}
|
|
330
|
+
id={containerId}
|
|
320
331
|
className={cx(
|
|
321
332
|
classes.modalContainer,
|
|
322
333
|
center && classes.modalContainerCenter,
|
package/src/useScrollLock.ts
CHANGED
|
@@ -5,14 +5,15 @@ export const useScrollLock = (
|
|
|
5
5
|
refModal: React.RefObject<Element>,
|
|
6
6
|
open: boolean,
|
|
7
7
|
showPortal: boolean,
|
|
8
|
-
blockScroll: boolean
|
|
8
|
+
blockScroll: boolean,
|
|
9
|
+
reserveScrollBarGap?: boolean
|
|
9
10
|
) => {
|
|
10
11
|
const oldRef = useRef<Element | null>(null);
|
|
11
12
|
|
|
12
13
|
useEffect(() => {
|
|
13
14
|
if (open && refModal.current && blockScroll) {
|
|
14
15
|
oldRef.current = refModal.current;
|
|
15
|
-
disableBodyScroll(refModal.current);
|
|
16
|
+
disableBodyScroll(refModal.current, { reserveScrollBarGap });
|
|
16
17
|
}
|
|
17
18
|
return () => {
|
|
18
19
|
if (oldRef.current) {
|
|
@@ -20,5 +21,5 @@ export const useScrollLock = (
|
|
|
20
21
|
oldRef.current = null;
|
|
21
22
|
}
|
|
22
23
|
};
|
|
23
|
-
}, [open, showPortal, refModal]);
|
|
24
|
+
}, [open, showPortal, refModal, blockScroll, reserveScrollBarGap]);
|
|
24
25
|
};
|