) {
+ // Keep focus inside the modal when pressing on the overlay, so keyboard handling (such as
+ // Escape to dismiss) keeps working even when the press does not close the modal
+ if (!dialogRef.current?.contains(event.target as Node)) {
+ event.preventDefault()
+ }
+ }
- if (!isOpen) {
+ /**
+ * Focus the element marked with the `data-autofocus` attribute if present, or fall back to
+ * the default behaviour of focusing the first focusable element inside the modal.
+ */
+ function getInitialFocus() {
+ const autofocusElement = dialogRef.current?.querySelector('[data-autofocus]')
+ return autofocusElement instanceof HTMLElement ? autofocusElement : true
+ }
+
+ if (typeof portalElement === 'function' && resolvedPortalElement == null) {
return null
}
return (
-
-
+
-
-
- }
- className={classNames(exceptionallySetClassName, styles.container)}
- store={store}
- preventBodyScroll
- // Disable focus lock as we set up our own using ReactFocusLock
- modal={false}
- autoFocus={false}
- autoFocusOnShow={false}
- autoFocusOnHide={false}
- // Disable portal and backdrop as we control their markup
- portal={false}
- backdrop={false}
- hideOnInteractOutside={false}
- hideOnEscape={false}
- onKeyDown={handleKeyDown}
- >
-
- {children}
-
-
-
-
-
+
+
+ }
+ className={classNames(exceptionallySetClassName, styles.container)}
+ >
+
+ {children}
+
+
+
+
+
+
)
}