@toptal/picasso-modal 100.1.3 → 100.1.4
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAEtD,OAAO,KAAoD,MAAM,OAAO,CAAA;AACxE,OAAO,KAAK,EACV,SAAS,EACT,QAAQ,EACR,eAAe,EAChB,MAAM,wBAAwB,CAAA;AAc/B,KAAK,cAAc,GAAG,WAAW,GAAG,CAAC,MAAM,WAAW,CAAC,CAAA;AACvD,KAAK,SAAS,GAAG,KAAK,GAAG,UAAU,CAAA;AAEnC,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,cAAc,CAAC,cAAc,CAAC;IACtE,iCAAiC;IACjC,QAAQ,EAAE,SAAS,CAAA;IACnB,wCAAwC;IACxC,IAAI,EAAE,OAAO,CAAA;IACb,qBAAqB;IACrB,IAAI,CAAC,EACD,QAAQ,CAAC,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC,GAC5D,aAAa,CAAA;IACjB,kDAAkD;IAClD,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,oFAAoF;IACpF,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,uDAAuD;IACvD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,2GAA2G;IAC3G,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,8CAA8C;IAC9C,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,6EAA6E;IAC7E,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,+DAA+D;IAC/D,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,kKAAkK;IAClK,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,gFAAgF;IAChF,UAAU,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;IACjD,OAAO,CAAC,EAAE;QACR,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,CAAA;IACD,OAAO,CAAC,EAAE;QACR,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,CAAA;CACF;
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAEtD,OAAO,KAAoD,MAAM,OAAO,CAAA;AACxE,OAAO,KAAK,EACV,SAAS,EACT,QAAQ,EACR,eAAe,EAChB,MAAM,wBAAwB,CAAA;AAc/B,KAAK,cAAc,GAAG,WAAW,GAAG,CAAC,MAAM,WAAW,CAAC,CAAA;AACvD,KAAK,SAAS,GAAG,KAAK,GAAG,UAAU,CAAA;AAEnC,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,cAAc,CAAC,cAAc,CAAC;IACtE,iCAAiC;IACjC,QAAQ,EAAE,SAAS,CAAA;IACnB,wCAAwC;IACxC,IAAI,EAAE,OAAO,CAAA;IACb,qBAAqB;IACrB,IAAI,CAAC,EACD,QAAQ,CAAC,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAC,GAC5D,aAAa,CAAA;IACjB,kDAAkD;IAClD,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,oFAAoF;IACpF,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,uDAAuD;IACvD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,2GAA2G;IAC3G,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,8CAA8C;IAC9C,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,6EAA6E;IAC7E,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,+DAA+D;IAC/D,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,kKAAkK;IAClK,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,gFAAgF;IAChF,UAAU,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;IACjD,OAAO,CAAC,EAAE;QACR,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,CAAA;IACD,OAAO,CAAC,EAAE;QACR,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,CAAA;CACF;AAuCD,eAAO,MAAM,KAAK,8EAyMhB,CAAA;AAIF,eAAe,KAAK,CAAA"}
|
|
@@ -30,23 +30,13 @@ const focusFirstFocusableElement = (node) => {
|
|
|
30
30
|
var _a;
|
|
31
31
|
(_a = node.querySelector(focusableElementsString)) === null || _a === void 0 ? void 0 : _a.focus();
|
|
32
32
|
};
|
|
33
|
-
const isFocusInsideModal = (modalNode) =>
|
|
34
|
-
|
|
35
|
-
if (
|
|
36
|
-
return true;
|
|
37
|
-
}
|
|
38
|
-
return false;
|
|
39
|
-
};
|
|
40
|
-
const isFocusInsideExemptPopup = () => {
|
|
41
|
-
const popupContainers = document.querySelectorAll(exemptPopupContainerString);
|
|
42
|
-
if (popupContainers.length === 0) {
|
|
33
|
+
const isFocusInsideModal = (modalNode, focused) => focused !== null && modalNode.contains(focused);
|
|
34
|
+
const isFocusInsideExemptPopup = (focused) => {
|
|
35
|
+
if (focused === null) {
|
|
43
36
|
return false;
|
|
44
37
|
}
|
|
45
|
-
const
|
|
46
|
-
|
|
47
|
-
return true;
|
|
48
|
-
}
|
|
49
|
-
return false;
|
|
38
|
+
const popupContainers = document.querySelectorAll(exemptPopupContainerString);
|
|
39
|
+
return Array.from(popupContainers).some(container => container.contains(focused));
|
|
50
40
|
};
|
|
51
41
|
const generateKey = (() => {
|
|
52
42
|
let count = 0;
|
|
@@ -64,7 +54,9 @@ export const Modal = forwardRef(function Modal(_a, ref) {
|
|
|
64
54
|
const mouseUpOnPopupRef = useRef(false);
|
|
65
55
|
const { rootRef } = useContext(RootContext);
|
|
66
56
|
useEffect(() => {
|
|
67
|
-
const handleDocumentFocus = () => {
|
|
57
|
+
const handleDocumentFocus = (event) => {
|
|
58
|
+
var _a;
|
|
59
|
+
const focused = (_a = event.target) !== null && _a !== void 0 ? _a : document.activeElement;
|
|
68
60
|
if (!(rootRef === null || rootRef === void 0 ? void 0 : rootRef.current)) {
|
|
69
61
|
console.warn('Modal is not rendered inside PicassoRoot, some things might not work as expected. Please open the Modal on mount using useEffect.');
|
|
70
62
|
}
|
|
@@ -74,10 +66,10 @@ export const Modal = forwardRef(function Modal(_a, ref) {
|
|
|
74
66
|
if (!modalRef || !modalRef.current) {
|
|
75
67
|
return;
|
|
76
68
|
}
|
|
77
|
-
if (isFocusInsideModal(modalRef.current)) {
|
|
69
|
+
if (isFocusInsideModal(modalRef.current, focused)) {
|
|
78
70
|
return;
|
|
79
71
|
}
|
|
80
|
-
if (isFocusInsideExemptPopup()) {
|
|
72
|
+
if (isFocusInsideExemptPopup(focused)) {
|
|
81
73
|
return;
|
|
82
74
|
}
|
|
83
75
|
focusFirstFocusableElement(modalRef.current);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/Modal/Modal.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAC9D,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAMxE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtE,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACpD,OAAO,EACL,eAAe,EACf,YAAY,EACZ,iBAAiB,GAClB,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AACvD,OAAO,YAAY,MAAM,+BAA+B,CAAA;AACxD,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAExD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AA2C1C,MAAM,cAAc,GAAG,IAAI,YAAY,EAAE,CAAA;AAEzC,kHAAkH;AAClH,6FAA6F;AAC7F,kCAAkC;AAClC,MAAM,uBAAuB,GAC3B,qMAAqM,CAAA;AACvM,2EAA2E;AAC3E,iFAAiF;AACjF,MAAM,0BAA0B,GAAG,uCAAuC,CAAA;AAE1E,MAAM,0BAA0B,GAAG,CAAC,IAAa,EAAE,EAAE;;IACnD,MAAA,IAAI,CAAC,aAAa,CAAc,uBAAuB,CAAC,0CAAE,KAAK,EAAE,CAAA;AACnE,CAAC,CAAA;AAED,MAAM,kBAAkB,GAAG,CAAC,SAAkB,EAAE,EAAE
|
|
1
|
+
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/Modal/Modal.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
package/src/Modal/Modal.tsx
CHANGED
|
@@ -75,32 +75,19 @@ const focusFirstFocusableElement = (node: Element) => {
|
|
|
75
75
|
node.querySelector<HTMLElement>(focusableElementsString)?.focus()
|
|
76
76
|
}
|
|
77
77
|
|
|
78
|
-
const isFocusInsideModal = (modalNode: Element) =>
|
|
79
|
-
|
|
78
|
+
const isFocusInsideModal = (modalNode: Element, focused: Node | null) =>
|
|
79
|
+
focused !== null && modalNode.contains(focused)
|
|
80
80
|
|
|
81
|
-
|
|
82
|
-
|
|
81
|
+
const isFocusInsideExemptPopup = (focused: Node | null) => {
|
|
82
|
+
if (focused === null) {
|
|
83
|
+
return false
|
|
83
84
|
}
|
|
84
85
|
|
|
85
|
-
return false
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
const isFocusInsideExemptPopup = () => {
|
|
89
86
|
const popupContainers = document.querySelectorAll(exemptPopupContainerString)
|
|
90
87
|
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
const popupContainsFocusedElement = Array.from(popupContainers).some(
|
|
96
|
-
container => container.contains(document.activeElement)
|
|
88
|
+
return Array.from(popupContainers).some(container =>
|
|
89
|
+
container.contains(focused)
|
|
97
90
|
)
|
|
98
|
-
|
|
99
|
-
if (popupContainsFocusedElement) {
|
|
100
|
-
return true
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
return false
|
|
104
91
|
}
|
|
105
92
|
|
|
106
93
|
const generateKey = (() => {
|
|
@@ -152,7 +139,9 @@ export const Modal = forwardRef<HTMLDivElement, Props>(function Modal(
|
|
|
152
139
|
const { rootRef } = useContext(RootContext)
|
|
153
140
|
|
|
154
141
|
useEffect(() => {
|
|
155
|
-
const handleDocumentFocus = () => {
|
|
142
|
+
const handleDocumentFocus = (event: FocusEvent) => {
|
|
143
|
+
const focused = (event.target as Node | null) ?? document.activeElement
|
|
144
|
+
|
|
156
145
|
if (!rootRef?.current) {
|
|
157
146
|
console.warn(
|
|
158
147
|
'Modal is not rendered inside PicassoRoot, some things might not work as expected. Please open the Modal on mount using useEffect.'
|
|
@@ -167,11 +156,11 @@ export const Modal = forwardRef<HTMLDivElement, Props>(function Modal(
|
|
|
167
156
|
return
|
|
168
157
|
}
|
|
169
158
|
|
|
170
|
-
if (isFocusInsideModal(modalRef.current)) {
|
|
159
|
+
if (isFocusInsideModal(modalRef.current, focused)) {
|
|
171
160
|
return
|
|
172
161
|
}
|
|
173
162
|
|
|
174
|
-
if (isFocusInsideExemptPopup()) {
|
|
163
|
+
if (isFocusInsideExemptPopup(focused)) {
|
|
175
164
|
return
|
|
176
165
|
}
|
|
177
166
|
|
package/src/Modal/test.tsx
CHANGED
|
@@ -406,6 +406,24 @@ describe('Modal', () => {
|
|
|
406
406
|
|
|
407
407
|
expect(popupButton).toHaveFocus()
|
|
408
408
|
})
|
|
409
|
+
|
|
410
|
+
it('leaves focus inside an exempt popup before activeElement moves', async () => {
|
|
411
|
+
const field = await renderModal(<input data-testid='field' />)
|
|
412
|
+
|
|
413
|
+
render(
|
|
414
|
+
<div data-picasso-popper=''>
|
|
415
|
+
<Button>Popup action</Button>
|
|
416
|
+
</div>
|
|
417
|
+
)
|
|
418
|
+
|
|
419
|
+
const popupButton = screen.getByRole('button', { name: 'Popup action' })
|
|
420
|
+
|
|
421
|
+
// fake the browser order: capture-phase focus before activeElement moves
|
|
422
|
+
;(document.activeElement as HTMLElement | null)?.blur()
|
|
423
|
+
popupButton.dispatchEvent(new FocusEvent('focus'))
|
|
424
|
+
|
|
425
|
+
expect(field).not.toHaveFocus()
|
|
426
|
+
})
|
|
409
427
|
})
|
|
410
428
|
|
|
411
429
|
describe('page scroll lock', () => {
|