@base-ui/react 1.1.0 → 1.3.0

package/floating-ui-react/utils/composite.js

@@ -1,6 +1,5 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -12,10 +11,11 @@ exports.getGridNavigatedIndex = getGridNavigatedIndex;
 exports.getMaxListIndex = getMaxListIndex;
 exports.getMinListIndex = getMinListIndex;
 exports.isDifferentGridRow = isDifferentGridRow;
+exports.isElementVisible = isElementVisible;
 exports.isIndexOutOfListBounds = isIndexOutOfListBounds;
 exports.isListIndexDisabled = isListIndexDisabled;
-var _formatErrorMessage2 = _interopRequireDefault(require("@base-ui/utils/formatErrorMessage"));
 var _utils = require("@floating-ui/utils");
+var _dom = require("@floating-ui/utils/dom");
 var _event = require("./event");
 var _constants = require("./constants");
 function isDifferentGridRow(index, cols, prevRow) {
@@ -61,151 +61,145 @@ function getGridNavigatedIndex(listRef, {
   stopEvent: stop = false
 }) {
   let nextIndex = prevIndex;
-
-  // ---------------------------------------------------------------------------
-  // Detect row structure based on DOM. This works when items are grouped inside
-  // elements that declare `role="row"` (e.g., Combobox.Row). We build a matrix
-  // where each entry is the array of item indices for that visual row. The
-  // algorithm gracefully falls back to regular `cols`-based handling when no
-  // row structure can be detected.
-  // ---------------------------------------------------------------------------
-  const rows = [];
-  const rowIndexMap = {};
-  let hasRoleRow = false;
-  {
-    let currentRowEl = null;
-    let currentRowIndex = -1;
-    listRef.current.forEach((el, idx) => {
-      if (el == null) {
-        return;
-      }
-      const rowEl = el.closest('[role="row"]');
-      if (rowEl) {
-        hasRoleRow = true;
-      }
-      if (rowEl !== currentRowEl || currentRowIndex === -1) {
-        currentRowEl = rowEl;
-        currentRowIndex += 1;
-        rows[currentRowIndex] = [];
-      }
-      rows[currentRowIndex].push(idx);
-      rowIndexMap[idx] = currentRowIndex;
-    });
+  let verticalDirection;
+  if (event.key === _constants.ARROW_UP) {
+    verticalDirection = 'up';
+  } else if (event.key === _constants.ARROW_DOWN) {
+    verticalDirection = 'down';
   }
-  const hasDomRows = hasRoleRow && rows.length > 0 && rows.some(row => row.length !== cols);
-  function navigateVertically(direction) {
-    if (!hasDomRows || prevIndex === -1) {
-      return undefined;
-    }
-    const currentRow = rowIndexMap[prevIndex];
-    if (currentRow == null) {
-      return undefined;
+  if (verticalDirection) {
+    // -------------------------------------------------------------------------
+    // Detect row structure only when handling vertical navigation. This keeps
+    // the non-vertical key paths free from row inference work.
+    // -------------------------------------------------------------------------
+    const rows = [];
+    const rowIndexMap = [];
+    let hasRoleRow = false;
+    let visibleItemCount = 0;
+    {
+      let currentRowEl = null;
+      let currentRowIndex = -1;
+      listRef.current.forEach((el, idx) => {
+        if (el == null) {
+          return;
+        }
+        visibleItemCount += 1;
+        const rowEl = el.closest('[role="row"]');
+        if (rowEl) {
+          hasRoleRow = true;
+        }
+        if (rowEl !== currentRowEl || currentRowIndex === -1) {
+          currentRowEl = rowEl;
+          currentRowIndex += 1;
+          rows[currentRowIndex] = [];
+        }
+        rows[currentRowIndex].push(idx);
+        rowIndexMap[idx] = currentRowIndex;
+      });
     }
-    const colInRow = rows[currentRow].indexOf(prevIndex);
-    let nextRow = direction === 'up' ? currentRow - 1 : currentRow + 1;
-    if (loopFocus) {
-      if (nextRow < 0) {
-        nextRow = rows.length - 1;
-      } else if (nextRow >= rows.length) {
-        nextRow = 0;
+    let hasDomRows = false;
+    let inferredDomCols = 0;
+    if (hasRoleRow) {
+      for (const row of rows) {
+        const rowLength = row.length;
+        if (rowLength > inferredDomCols) {
+          inferredDomCols = rowLength;
+        }
+        if (rowLength !== cols) {
+          hasDomRows = true;
+        }
       }
     }
-    const visited = new Set();
-    while (nextRow >= 0 && nextRow < rows.length && !visited.has(nextRow)) {
-      visited.add(nextRow);
-      const targetRow = rows[nextRow];
-      if (targetRow.length === 0) {
-        nextRow = direction === 'up' ? nextRow - 1 : nextRow + 1;
-        continue;
+    const hasVirtualizedGaps = hasDomRows && visibleItemCount < listRef.current.length;
+    const verticalCols = inferredDomCols || cols;
+    const navigateVertically = direction => {
+      if (!hasDomRows || prevIndex === -1) {
+        return undefined;
+      }
+      const currentRow = rowIndexMap[prevIndex];
+      if (currentRow == null) {
+        return undefined;
       }
-      const clampedCol = Math.min(colInRow, targetRow.length - 1);
-      // Start from the preferred column, fallback leftwards until first
-      // enabled item is found.
-      for (let col = clampedCol; col >= 0; col -= 1) {
-        const candidate = targetRow[col];
-        if (!isListIndexDisabled(listRef, candidate, disabledIndices)) {
-          return candidate;
+      const colInRow = rows[currentRow].indexOf(prevIndex);
+      const step = direction === 'up' ? -1 : 1;
+      for (let nextRow = currentRow + step, i = 0; i < rows.length; i += 1, nextRow += step) {
+        if (nextRow < 0 || nextRow >= rows.length) {
+          if (!loopFocus || hasVirtualizedGaps) {
+            return undefined;
+          }
+          nextRow = nextRow < 0 ? rows.length - 1 : 0;
+        }
+        const targetRow = rows[nextRow];
+        for (let col = Math.min(colInRow, targetRow.length - 1); col >= 0; col -= 1) {
+          const candidate = targetRow[col];
+          if (!isListIndexDisabled(listRef, candidate, disabledIndices)) {
+            return candidate;
+          }
         }
       }
-      // Row had no enabled items, move to next row in the same direction.
-      nextRow = direction === 'up' ? nextRow - 1 : nextRow + 1;
-      if (loopFocus) {
-        if (nextRow < 0) {
-          nextRow = rows.length - 1;
-        } else if (nextRow >= rows.length) {
-          nextRow = 0;
+      return undefined;
+    };
+    const navigateVerticallyWithInferredRows = direction => {
+      if (!hasVirtualizedGaps || prevIndex === -1) {
+        return undefined;
+      }
+      const colInRow = prevIndex % verticalCols;
+      const rowStep = direction === 'up' ? -verticalCols : verticalCols;
+      const lastRowStart = maxIndex - maxIndex % verticalCols;
+      const rowCount = (0, _utils.floor)(maxIndex / verticalCols) + 1;
+      for (let rowStart = prevIndex - colInRow + rowStep, i = 0; i < rowCount; i += 1, rowStart += rowStep) {
+        if (rowStart < 0 || rowStart > maxIndex) {
+          if (!loopFocus) {
+            return undefined;
+          }
+          rowStart = rowStart < 0 ? lastRowStart : 0;
+        }
+        const rowEnd = Math.min(rowStart + verticalCols - 1, maxIndex);
+        for (let candidate = Math.min(rowStart + colInRow, rowEnd); candidate >= rowStart; candidate -= 1) {
+          if (!isListIndexDisabled(listRef, candidate, disabledIndices)) {
+            return candidate;
+          }
         }
       }
+      return undefined;
+    };
+    if (stop) {
+      (0, _event.stopEvent)(event);
     }
-    return undefined;
-  }
-  if (event.key === _constants.ARROW_UP) {
-    const domBasedCandidate = navigateVertically('up');
-    if (domBasedCandidate !== undefined) {
-      if (stop) {
-        (0, _event.stopEvent)(event);
-      }
-      nextIndex = domBasedCandidate;
+    const verticalCandidate = navigateVertically(verticalDirection) ?? navigateVerticallyWithInferredRows(verticalDirection);
+    if (verticalCandidate !== undefined) {
+      nextIndex = verticalCandidate;
+    } else if (prevIndex === -1) {
+      nextIndex = verticalDirection === 'up' ? maxIndex : minIndex;
     } else {
-      // fallback to original logic
-      if (stop) {
-        (0, _event.stopEvent)(event);
-      }
-      if (prevIndex === -1) {
-        nextIndex = maxIndex;
-      } else {
-        nextIndex = findNonDisabledListIndex(listRef, {
-          startingIndex: nextIndex,
-          amount: cols,
-          decrement: true,
-          disabledIndices
-        });
-        if (loopFocus && (prevIndex - cols < minIndex || nextIndex < 0)) {
-          const col = prevIndex % cols;
-          const maxCol = maxIndex % cols;
+      nextIndex = findNonDisabledListIndex(listRef, {
+        startingIndex: prevIndex,
+        amount: verticalCols,
+        decrement: verticalDirection === 'up',
+        disabledIndices
+      });
+      if (loopFocus) {
+        if (verticalDirection === 'up' && (prevIndex - verticalCols < minIndex || nextIndex < 0)) {
+          const col = prevIndex % verticalCols;
+          const maxCol = maxIndex % verticalCols;
           const offset = maxIndex - (maxCol - col);
           if (maxCol === col) {
             nextIndex = maxIndex;
           } else {
-            nextIndex = maxCol > col ? offset : offset - cols;
+            nextIndex = maxCol > col ? offset : offset - verticalCols;
           }
         }
-      }
-      if (isIndexOutOfListBounds(listRef, nextIndex)) {
-        nextIndex = prevIndex;
-      }
-    }
-  }
-  if (event.key === _constants.ARROW_DOWN) {
-    const domBasedCandidate = navigateVertically('down');
-    if (domBasedCandidate !== undefined) {
-      if (stop) {
-        (0, _event.stopEvent)(event);
-      }
-      nextIndex = domBasedCandidate;
-    } else {
-      if (stop) {
-        (0, _event.stopEvent)(event);
-      }
-      if (prevIndex === -1) {
-        nextIndex = minIndex;
-      } else {
-        nextIndex = findNonDisabledListIndex(listRef, {
-          startingIndex: prevIndex,
-          amount: cols,
-          disabledIndices
-        });
-        if (loopFocus && prevIndex + cols > maxIndex) {
+        if (verticalDirection === 'down' && prevIndex + verticalCols > maxIndex) {
           nextIndex = findNonDisabledListIndex(listRef, {
-            startingIndex: prevIndex % cols - cols,
-            amount: cols,
+            startingIndex: prevIndex % verticalCols - verticalCols,
+            amount: verticalCols,
             disabledIndices
           });
         }
       }
-      if (isIndexOutOfListBounds(listRef, nextIndex)) {
-        nextIndex = prevIndex;
-      }
+    }
+    if (isIndexOutOfListBounds(listRef, nextIndex)) {
+      nextIndex = prevIndex;
     }
   }
 
@@ -290,7 +284,7 @@ function createGridCellMap(sizes, cols, dense) {
   }, index) => {
     if (width > cols) {
       if (process.env.NODE_ENV !== 'production') {
-        throw new Error(process.env.NODE_ENV !== "production" ? `[Floating UI]: Invalid grid - item width at index ${index} is greater than grid columns` : (0, _formatErrorMessage2.default)(29, index));
+        throw new Error(`[Floating UI]: Invalid grid - item width at index ${index} is greater than grid columns`);
       }
     }
     let itemPlaced = false;
@@ -351,15 +345,19 @@ function getGridCellIndices(indices, cellMap) {
   return cellMap.flatMap((index, cellIndex) => indices.includes(index) ? [cellIndex] : []);
 }
 function isListIndexDisabled(listRef, index, disabledIndices) {
-  if (typeof disabledIndices === 'function') {
-    return disabledIndices(index);
-  }
-  if (disabledIndices) {
-    return disabledIndices.includes(index);
+  const isExplicitlyDisabled = typeof disabledIndices === 'function' ? disabledIndices(index) : disabledIndices?.includes(index) ?? false;
+  if (isExplicitlyDisabled) {
+    return true;
   }
   const element = listRef.current[index];
   if (!element) {
     return false;
   }
-  return element.hasAttribute('disabled') || element.getAttribute('aria-disabled') === 'true';
+  if (!isElementVisible(element)) {
+    return true;
+  }
+  return !disabledIndices && (element.hasAttribute('disabled') || element.getAttribute('aria-disabled') === 'true');
+}
+function isElementVisible(element) {
+  return (0, _dom.getComputedStyle)(element).display !== 'none';
 }

package/floating-ui-react/utils/element.d.ts

@@ -1,9 +1,10 @@
+import { type PopupTriggerMap } from "../../utils/popups/index.js";
 export declare function activeElement(doc: Document): Element | null;
 export declare function contains(parent?: Element | null, child?: Element | null): boolean;
+export declare function isTargetInsideEnabledTrigger(target: EventTarget | null, triggerElements: PopupTriggerMap): boolean;
 export declare function getTarget(event: Event): EventTarget | null;
 export declare function isEventTargetWithin(event: Event, node: Node | null | undefined): boolean;
 export declare function isRootElement(element: Element): boolean;
-export declare function getDocument(node: Element | null): Document;
 export declare function isTypeableElement(element: unknown): boolean;
 export declare function isTypeableCombobox(element: Element | null): boolean;
 export declare function matchesFocusVisible(element: Element | null): boolean;

package/floating-ui-react/utils/element.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.activeElement = activeElement;
 exports.contains = contains;
-exports.getDocument = getDocument;
 exports.getFloatingFocusElement = getFloatingFocusElement;
 exports.getTarget = getTarget;
 exports.isEventTargetWithin = isEventTargetWithin;
 exports.isRootElement = isRootElement;
+exports.isTargetInsideEnabledTrigger = isTargetInsideEnabledTrigger;
 exports.isTypeableCombobox = isTypeableCombobox;
 exports.isTypeableElement = isTypeableElement;
 exports.matchesFocusVisible = matchesFocusVisible;
@@ -48,6 +48,21 @@ function contains(parent, child) {
   // Give up, the result is false
   return false;
 }
+function isTargetInsideEnabledTrigger(target, triggerElements) {
+  if (!(0, _dom.isElement)(target)) {
+    return false;
+  }
+  const targetElement = target;
+  if (triggerElements.hasElement(targetElement)) {
+    return !targetElement.hasAttribute('data-trigger-disabled');
+  }
+  for (const [, trigger] of triggerElements.entries()) {
+    if (contains(trigger, targetElement)) {
+      return !trigger.hasAttribute('data-trigger-disabled');
+    }
+  }
+  return false;
+}
 function getTarget(event) {
   if ('composedPath' in event) {
     return event.composedPath()[0];
@@ -72,9 +87,6 @@ function isEventTargetWithin(event, node) {
 function isRootElement(element) {
   return element.matches('html,body');
 }
-function getDocument(node) {
-  return node?.ownerDocument || document;
-}
 function isTypeableElement(element) {
   return (0, _dom.isHTMLElement)(element) && element.matches(_constants.TYPEABLE_SELECTOR);
 }

package/floating-ui-react/utils/enqueueFocus.d.ts

@@ -1,8 +1,8 @@
 import type { FocusableElement } from 'tabbable';
 interface Options {
-  preventScroll?: boolean;
-  cancelPrevious?: boolean;
-  sync?: boolean;
+  preventScroll?: boolean | undefined;
+  cancelPrevious?: boolean | undefined;
+  sync?: boolean | undefined;
 }
 export declare function enqueueFocus(el: FocusableElement | null, options?: Options): void;
 export {};

package/floating-ui-react/utils/event.js

@@ -18,11 +18,9 @@ function isReactEvent(event) {
   return 'nativeEvent' in event;
 }
 
-// License: https://github.com/adobe/react-spectrum/blob/b35d5c02fe900badccd0cf1a8f23bb593419f238/packages/@react-aria/utils/src/isVirtualEvent.ts
+// License: https://github.com/adobe/react-spectrum/blob/main/packages/@react-aria/utils/src/isVirtualEvent.ts
 function isVirtualClick(event) {
-  // FIXME: Firefox is now emitting a deprecation warning for `mozInputSource`.
-  // Try to find a workaround for this. `react-aria` source still has the check.
-  if (event.mozInputSource === 0 && event.isTrusted) {
+  if (event.pointerType === '' && event.isTrusted) {
     return true;
   }
   if (_detectBrowser.isAndroid && event.pointerType) {

package/floating-ui-react/utils/markOthers.d.ts

@@ -1,4 +1,10 @@
 type Undo = () => void;
+interface MarkOthersOptions {
+  ariaHidden?: boolean | undefined;
+  inert?: boolean | undefined;
+  mark?: boolean | undefined;
+  markerIgnoreElements?: Element[] | undefined;
+}
 export declare const supportsInert: () => boolean;
-export declare function markOthers(avoidElements: Element[], ariaHidden?: boolean, inert?: boolean): Undo;
+export declare function markOthers(avoidElements: Element[], options?: MarkOthersOptions): Undo;
 export {};

package/floating-ui-react/utils/markOthers.js

@@ -6,30 +6,32 @@ Object.defineProperty(exports, "__esModule", {
 exports.markOthers = markOthers;
 exports.supportsInert = void 0;
 var _dom = require("@floating-ui/utils/dom");
-var _element = require("./element");
+var _owner = require("@base-ui/utils/owner");
 // Modified to add conditional `aria-hidden` support:
 // https://github.com/theKashey/aria-hidden/blob/9220c8f4a4fd35f63bee5510a9f41a37264382d4/src/index.ts
 
 const counters = {
   inert: new WeakMap(),
-  'aria-hidden': new WeakMap(),
-  none: new WeakMap()
+  'aria-hidden': new WeakMap()
 };
-function getCounterMap(control) {
-  if (control === 'inert') {
-    return counters.inert;
-  }
-  if (control === 'aria-hidden') {
-    return counters['aria-hidden'];
-  }
-  return counters.none;
-}
-let uncontrolledElementsSet = new WeakSet();
-let markerMap = {};
+const markerName = 'data-base-ui-inert';
+const uncontrolledElementsSets = {
+  inert: new WeakSet(),
+  'aria-hidden': new WeakSet()
+};
+let markerCounterMap = new WeakMap();
 let lockCount = 0;
+function getUncontrolledElementsSet(controlAttribute) {
+  return uncontrolledElementsSets[controlAttribute];
+}
 const supportsInert = () => typeof HTMLElement !== 'undefined' && 'inert' in HTMLElement.prototype;
 exports.supportsInert = supportsInert;
-const unwrapHost = node => node && (node.host || unwrapHost(node.parentNode));
+function unwrapHost(node) {
+  if (!node) {
+    return null;
+  }
+  return (0, _dom.isShadowRoot)(node) ? node.host : unwrapHost(node.parentNode);
+}
 const correctElements = (parent, targets) => targets.map(target => {
   if (parent.contains(target)) {
     return target;
@@ -40,91 +42,127 @@ const correctElements = (parent, targets) => targets.map(target => {
   }
   return null;
 }).filter(x => x != null);
-function applyAttributeToOthers(uncorrectedAvoidElements, body, ariaHidden, inert) {
-  const markerName = 'data-base-ui-inert';
-  // eslint-disable-next-line no-nested-ternary
-  const controlAttribute = inert ? 'inert' : ariaHidden ? 'aria-hidden' : null;
-  const avoidElements = correctElements(body, uncorrectedAvoidElements);
-  const elementsToKeep = new Set();
-  const elementsToStop = new Set(avoidElements);
-  const hiddenElements = [];
-  if (!markerMap[markerName]) {
-    markerMap[markerName] = new WeakMap();
-  }
-  const markerCounter = markerMap[markerName];
-  avoidElements.forEach(keep);
-  deep(body);
-  elementsToKeep.clear();
-  function keep(el) {
-    if (!el || elementsToKeep.has(el)) {
-      return;
+const buildKeepSet = targets => {
+  const keep = new Set();
+  targets.forEach(target => {
+    let node = target;
+    while (node && !keep.has(node)) {
+      keep.add(node);
+      node = node.parentNode;
     }
-    elementsToKeep.add(el);
-    if (el.parentNode) {
-      keep(el.parentNode);
-    }
-  }
-  function deep(parent) {
-    if (!parent || elementsToStop.has(parent)) {
+  });
+  return keep;
+};
+const collectOutsideElements = (root, keepElements, stopElements) => {
+  const outside = [];
+  const walk = parent => {
+    if (!parent || stopElements.has(parent)) {
       return;
     }
-    [].forEach.call(parent.children, node => {
+    Array.from(parent.children).forEach(node => {
       if ((0, _dom.getNodeName)(node) === 'script') {
         return;
       }
-      if (elementsToKeep.has(node)) {
-        deep(node);
+      if (keepElements.has(node)) {
+        walk(node);
       } else {
-        const attr = controlAttribute ? node.getAttribute(controlAttribute) : null;
-        const alreadyHidden = attr !== null && attr !== 'false';
-        const counterMap = getCounterMap(controlAttribute);
-        const counterValue = (counterMap.get(node) || 0) + 1;
-        const markerValue = (markerCounter.get(node) || 0) + 1;
-        counterMap.set(node, counterValue);
-        markerCounter.set(node, markerValue);
-        hiddenElements.push(node);
-        if (counterValue === 1 && alreadyHidden) {
-          uncontrolledElementsSet.add(node);
-        }
-        if (markerValue === 1) {
-          node.setAttribute(markerName, '');
-        }
-        if (!alreadyHidden && controlAttribute) {
-          node.setAttribute(controlAttribute, controlAttribute === 'inert' ? '' : 'true');
-        }
+        outside.push(node);
+      }
+    });
+  };
+  walk(root);
+  return outside;
+};
+function applyAttributeToOthers(uncorrectedAvoidElements, body, ariaHidden, inert, {
+  mark = true,
+  markerIgnoreElements = []
+}) {
+  // eslint-disable-next-line no-nested-ternary
+  const controlAttribute = inert ? 'inert' : ariaHidden ? 'aria-hidden' : null;
+  let counterMap = null;
+  let uncontrolledElementsSet = null;
+  const avoidElements = correctElements(body, uncorrectedAvoidElements);
+  const markerIgnoreTargets = mark ? correctElements(body, markerIgnoreElements) : [];
+  const markerIgnoreSet = new Set(markerIgnoreTargets);
+  const markerTargets = mark ? collectOutsideElements(body, buildKeepSet(avoidElements), new Set(avoidElements)).filter(target => !markerIgnoreSet.has(target)) : [];
+  const hiddenElements = [];
+  const markedElements = [];
+  if (controlAttribute) {
+    const map = counters[controlAttribute];
+    const currentUncontrolledElementsSet = getUncontrolledElementsSet(controlAttribute);
+    uncontrolledElementsSet = currentUncontrolledElementsSet;
+    counterMap = map;
+    const ariaLiveElements = correctElements(body, Array.from(body.querySelectorAll('[aria-live]')));
+    const controlElements = avoidElements.concat(ariaLiveElements);
+    const controlTargets = collectOutsideElements(body, buildKeepSet(controlElements), new Set(controlElements));
+    controlTargets.forEach(node => {
+      const attr = node.getAttribute(controlAttribute);
+      const alreadyHidden = attr !== null && attr !== 'false';
+      const counterValue = (map.get(node) || 0) + 1;
+      map.set(node, counterValue);
+      hiddenElements.push(node);
+      if (counterValue === 1 && alreadyHidden) {
+        currentUncontrolledElementsSet.add(node);
+      }
+      if (!alreadyHidden) {
+        node.setAttribute(controlAttribute, controlAttribute === 'inert' ? '' : 'true');
+      }
+    });
+  }
+  if (mark) {
+    markerTargets.forEach(node => {
+      const markerValue = (markerCounterMap.get(node) || 0) + 1;
+      markerCounterMap.set(node, markerValue);
+      markedElements.push(node);
+      if (markerValue === 1) {
+        node.setAttribute(markerName, '');
       }
     });
   }
   lockCount += 1;
   return () => {
-    hiddenElements.forEach(element => {
-      const counterMap = getCounterMap(controlAttribute);
-      const currentCounterValue = counterMap.get(element) || 0;
-      const counterValue = currentCounterValue - 1;
-      const markerValue = (markerCounter.get(element) || 0) - 1;
-      counterMap.set(element, counterValue);
-      markerCounter.set(element, markerValue);
-      if (!counterValue) {
-        if (!uncontrolledElementsSet.has(element) && controlAttribute) {
-          element.removeAttribute(controlAttribute);
+    if (counterMap) {
+      hiddenElements.forEach(element => {
+        const currentCounterValue = counterMap.get(element) || 0;
+        const counterValue = currentCounterValue - 1;
+        counterMap.set(element, counterValue);
+        if (!counterValue) {
+          if (!uncontrolledElementsSet?.has(element) && controlAttribute) {
+            element.removeAttribute(controlAttribute);
+          }
+          uncontrolledElementsSet?.delete(element);
         }
-        uncontrolledElementsSet.delete(element);
-      }
-      if (!markerValue) {
-        element.removeAttribute(markerName);
-      }
-    });
+      });
+    }
+    if (mark) {
+      markedElements.forEach(element => {
+        const markerValue = (markerCounterMap.get(element) || 0) - 1;
+        markerCounterMap.set(element, markerValue);
+        if (!markerValue) {
+          element.removeAttribute(markerName);
+        }
+      });
+    }
     lockCount -= 1;
     if (!lockCount) {
       counters.inert = new WeakMap();
       counters['aria-hidden'] = new WeakMap();
-      counters.none = new WeakMap();
-      uncontrolledElementsSet = new WeakSet();
-      markerMap = {};
+      uncontrolledElementsSets.inert = new WeakSet();
+      uncontrolledElementsSets['aria-hidden'] = new WeakSet();
+      markerCounterMap = new WeakMap();
     }
   };
 }
-function markOthers(avoidElements, ariaHidden = false, inert = false) {
-  const body = (0, _element.getDocument)(avoidElements[0]).body;
-  return applyAttributeToOthers(avoidElements.concat(Array.from(body.querySelectorAll('[aria-live]'))), body, ariaHidden, inert);
+function markOthers(avoidElements, options = {}) {
+  const {
+    ariaHidden = false,
+    inert = false,
+    mark = true,
+    markerIgnoreElements = []
+  } = options;
+  const body = (0, _owner.ownerDocument)(avoidElements[0]).body;
+  return applyAttributeToOthers(avoidElements, body, ariaHidden, inert, {
+    mark,
+    markerIgnoreElements
+  });
 }