react-magma-dom 4.7.0-next.8 → 4.7.0-next.9

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.
@@ -6544,11 +6544,20 @@ function useFocusLock(active, header, body) {
6544
6544
  var focusableItems = React.useRef([]);
6545
6545
  var updateFocusableItems = function updateFocusableItems() {
6546
6546
  var _rootNode$current;
6547
- focusableItems.current = (_rootNode$current = rootNode.current) == null ? void 0 : _rootNode$current.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"]), video');
6547
+ focusableItems.current = Array.from(((_rootNode$current = rootNode.current) == null ? void 0 : _rootNode$current.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"]), video')) || []);
6548
6548
  };
6549
6549
  React.useEffect(function () {
6550
6550
  if (active) {
6551
6551
  updateFocusableItems();
6552
+ var observer = new MutationObserver(function () {
6553
+ updateFocusableItems();
6554
+ });
6555
+ if (rootNode.current) {
6556
+ observer.observe(rootNode.current, {
6557
+ childList: true,
6558
+ subtree: true
6559
+ });
6560
+ }
6552
6561
  if (header && header.current) {
6553
6562
  header.current.focus();
6554
6563
  } else if (focusableItems.current && focusableItems.current.length > 0) {
@@ -6558,21 +6567,11 @@ function useFocusLock(active, header, body) {
6558
6567
  body.current.firstChild.setAttribute('tabIndex', '-1');
6559
6568
  body.current.firstChild.focus();
6560
6569
  }
6570
+ return function () {
6571
+ observer.disconnect();
6572
+ };
6561
6573
  }
6562
- }, [active]);
6563
- React.useEffect(function () {
6564
- var observer = new MutationObserver(function () {
6565
- updateFocusableItems();
6566
- });
6567
- updateFocusableItems();
6568
- rootNode.current && observer.observe(rootNode.current, {
6569
- childList: true,
6570
- subtree: true
6571
- });
6572
- return function () {
6573
- observer.disconnect();
6574
- };
6575
- }, [rootNode]);
6574
+ }, [active, header, body]);
6576
6575
  React.useEffect(function () {
6577
6576
  var handleKeyPress = function handleKeyPress(event) {
6578
6577
  if (!focusableItems.current) return;
@@ -6614,7 +6613,7 @@ function useFocusLock(active, header, body) {
6614
6613
  return function () {
6615
6614
  window.removeEventListener('keydown', handleKeyPress);
6616
6615
  };
6617
- }, [active, focusableItems]);
6616
+ }, [active, focusableItems, header]);
6618
6617
  return rootNode;
6619
6618
  }
6620
6619