@zag-js/aria-hidden 2.0.0-next.3 → 2.0.0-next.4

package/dist/aria-hidden.d.mts

@@ -1,5 +1,3 @@
-declare const hideOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement | null, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
-declare const inertOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement | null, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
-declare const suppressOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
-
-export { hideOthers, inertOthers, suppressOthers };
+export declare const hideOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement | null, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
+export declare const inertOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement | null, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
+export declare const suppressOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;

package/dist/aria-hidden.d.ts

@@ -1,5 +1,3 @@
-declare const hideOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement | null, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
-declare const inertOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement | null, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
-declare const suppressOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
-
-export { hideOthers, inertOthers, suppressOthers };
+export declare const hideOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement | null, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
+export declare const inertOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement | null, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;
+export declare const suppressOthers: (originalTarget: Element | Element[], parentNode?: HTMLElement, markerName?: string, followControlledElements?: boolean) => VoidFunction | undefined;

package/dist/aria-hidden.js

@@ -1,63 +1,34 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/aria-hidden.ts
-var aria_hidden_exports = {};
-__export(aria_hidden_exports, {
-  hideOthers: () => hideOthers,
-  inertOthers: () => inertOthers,
-  suppressOthers: () => suppressOthers
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
 });
-module.exports = __toCommonJS(aria_hidden_exports);
-var import_walk_tree_outside = require("./walk-tree-outside.js");
-var getParentNode = (originalTarget) => {
-  const target = Array.isArray(originalTarget) ? originalTarget[0] : originalTarget;
-  return target.ownerDocument.body;
+const require_walk_tree_outside = require("./walk-tree-outside.js");
+// src/aria-hidden.ts
+const getParentNode = (originalTarget) => {
+	return (Array.isArray(originalTarget) ? originalTarget[0] : originalTarget).ownerDocument.body;
 };
-var hideOthers = (originalTarget, parentNode = getParentNode(originalTarget), markerName = "data-aria-hidden", followControlledElements = true) => {
-  if (!parentNode) return;
-  return (0, import_walk_tree_outside.walkTreeOutside)(originalTarget, {
-    parentNode,
-    markerName,
-    controlAttribute: "aria-hidden",
-    explicitBooleanValue: true,
-    followControlledElements
-  });
+const hideOthers = (originalTarget, parentNode = getParentNode(originalTarget), markerName = "data-aria-hidden", followControlledElements = true) => {
+	if (!parentNode) return;
+	return require_walk_tree_outside.walkTreeOutside(originalTarget, {
+		parentNode,
+		markerName,
+		attribute: "aria-hidden",
+		followControlledElements
+	});
 };
-var inertOthers = (originalTarget, parentNode = getParentNode(originalTarget), markerName = "data-inerted", followControlledElements = true) => {
-  if (!parentNode) return;
-  return (0, import_walk_tree_outside.walkTreeOutside)(originalTarget, {
-    parentNode,
-    markerName,
-    controlAttribute: "inert",
-    explicitBooleanValue: false,
-    followControlledElements
-  });
+const inertOthers = (originalTarget, parentNode = getParentNode(originalTarget), markerName = "data-inerted", followControlledElements = true) => {
+	if (!parentNode) return;
+	return require_walk_tree_outside.walkTreeOutside(originalTarget, {
+		parentNode,
+		markerName,
+		attribute: "inert",
+		followControlledElements
+	});
 };
-var supportsInert = () => typeof HTMLElement !== "undefined" && HTMLElement.prototype.hasOwnProperty("inert");
-var suppressOthers = (originalTarget, parentNode, markerName = "data-suppressed", followControlledElements = true) => {
-  const fn = supportsInert() ? inertOthers : hideOthers;
-  return fn(originalTarget, parentNode, markerName, followControlledElements);
+const supportsInert = () => typeof HTMLElement !== "undefined" && HTMLElement.prototype.hasOwnProperty("inert");
+const suppressOthers = (originalTarget, parentNode, markerName = "data-suppressed", followControlledElements = true) => {
+	return (supportsInert() ? inertOthers : hideOthers)(originalTarget, parentNode, markerName, followControlledElements);
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  hideOthers,
-  inertOthers,
-  suppressOthers
-});
+exports.hideOthers = hideOthers;
+exports.inertOthers = inertOthers;
+exports.suppressOthers = suppressOthers;

package/dist/aria-hidden.mjs

@@ -1,36 +1,28 @@
-// src/aria-hidden.ts
 import { walkTreeOutside } from "./walk-tree-outside.mjs";
-var getParentNode = (originalTarget) => {
-  const target = Array.isArray(originalTarget) ? originalTarget[0] : originalTarget;
-  return target.ownerDocument.body;
-};
-var hideOthers = (originalTarget, parentNode = getParentNode(originalTarget), markerName = "data-aria-hidden", followControlledElements = true) => {
-  if (!parentNode) return;
-  return walkTreeOutside(originalTarget, {
-    parentNode,
-    markerName,
-    controlAttribute: "aria-hidden",
-    explicitBooleanValue: true,
-    followControlledElements
-  });
+// src/aria-hidden.ts
+const getParentNode = (originalTarget) => {
+	return (Array.isArray(originalTarget) ? originalTarget[0] : originalTarget).ownerDocument.body;
 };
-var inertOthers = (originalTarget, parentNode = getParentNode(originalTarget), markerName = "data-inerted", followControlledElements = true) => {
-  if (!parentNode) return;
-  return walkTreeOutside(originalTarget, {
-    parentNode,
-    markerName,
-    controlAttribute: "inert",
-    explicitBooleanValue: false,
-    followControlledElements
-  });
+const hideOthers = (originalTarget, parentNode = getParentNode(originalTarget), markerName = "data-aria-hidden", followControlledElements = true) => {
+	if (!parentNode) return;
+	return walkTreeOutside(originalTarget, {
+		parentNode,
+		markerName,
+		attribute: "aria-hidden",
+		followControlledElements
+	});
 };
-var supportsInert = () => typeof HTMLElement !== "undefined" && HTMLElement.prototype.hasOwnProperty("inert");
-var suppressOthers = (originalTarget, parentNode, markerName = "data-suppressed", followControlledElements = true) => {
-  const fn = supportsInert() ? inertOthers : hideOthers;
-  return fn(originalTarget, parentNode, markerName, followControlledElements);
+const inertOthers = (originalTarget, parentNode = getParentNode(originalTarget), markerName = "data-inerted", followControlledElements = true) => {
+	if (!parentNode) return;
+	return walkTreeOutside(originalTarget, {
+		parentNode,
+		markerName,
+		attribute: "inert",
+		followControlledElements
+	});
 };
-export {
-  hideOthers,
-  inertOthers,
-  suppressOthers
+const supportsInert = () => typeof HTMLElement !== "undefined" && HTMLElement.prototype.hasOwnProperty("inert");
+const suppressOthers = (originalTarget, parentNode, markerName = "data-suppressed", followControlledElements = true) => {
+	return (supportsInert() ? inertOthers : hideOthers)(originalTarget, parentNode, markerName, followControlledElements);
 };
+export { hideOthers, inertOthers, suppressOthers };

package/dist/index.d.mts

@@ -2,8 +2,7 @@ type MaybeElement = HTMLElement | null;
 type Targets = Array<MaybeElement>;
 type TargetsOrFn = Targets | (() => Targets);
 type Options = {
-    defer?: boolean | undefined;
+  defer?: boolean | undefined;
 };
-declare function ariaHidden(targetsOrFn: TargetsOrFn, options?: Options): () => void;
-
-export { ariaHidden };
+export declare function ariaHidden(targetsOrFn: TargetsOrFn, options?: Options): () => void;
+export {};

package/dist/index.d.ts

@@ -2,8 +2,7 @@ type MaybeElement = HTMLElement | null;
 type Targets = Array<MaybeElement>;
 type TargetsOrFn = Targets | (() => Targets);
 type Options = {
-    defer?: boolean | undefined;
+  defer?: boolean | undefined;
 };
-declare function ariaHidden(targetsOrFn: TargetsOrFn, options?: Options): () => void;
-
-export { ariaHidden };
+export declare function ariaHidden(targetsOrFn: TargetsOrFn, options?: Options): () => void;
+export {};

package/dist/index.js

@@ -1,50 +1,24 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  ariaHidden: () => ariaHidden
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
 });
-module.exports = __toCommonJS(index_exports);
-var import_aria_hidden = require("./aria-hidden.js");
-var raf = (fn) => {
-  const frameId = requestAnimationFrame(() => fn());
-  return () => cancelAnimationFrame(frameId);
+const require_aria_hidden = require("./aria-hidden.js");
+// src/index.ts
+const raf = (fn) => {
+	const frameId = requestAnimationFrame(() => fn());
+	return () => cancelAnimationFrame(frameId);
 };
 function ariaHidden(targetsOrFn, options = {}) {
-  const { defer = true } = options;
-  const func = defer ? raf : (v) => v();
-  const cleanups = [];
-  cleanups.push(
-    func(() => {
-      const targets = typeof targetsOrFn === "function" ? targetsOrFn() : targetsOrFn;
-      const elements = targets.filter(Boolean);
-      if (elements.length === 0) return;
-      cleanups.push((0, import_aria_hidden.hideOthers)(elements));
-    })
-  );
-  return () => {
-    cleanups.forEach((fn) => fn?.());
-  };
+	const { defer = true } = options;
+	const func = defer ? raf : (v) => v();
+	const cleanups = [];
+	cleanups.push(func(() => {
+		const elements = (typeof targetsOrFn === "function" ? targetsOrFn() : targetsOrFn).filter(Boolean);
+		if (elements.length === 0) return;
+		cleanups.push(require_aria_hidden.hideOthers(elements));
+	}));
+	return () => {
+		cleanups.forEach((fn) => fn?.());
+	};
 }
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  ariaHidden
-});
+exports.ariaHidden = ariaHidden;

package/dist/index.mjs

@@ -1,25 +1,20 @@
-// src/index.ts
 import { hideOthers } from "./aria-hidden.mjs";
-var raf = (fn) => {
-  const frameId = requestAnimationFrame(() => fn());
-  return () => cancelAnimationFrame(frameId);
+// src/index.ts
+const raf = (fn) => {
+	const frameId = requestAnimationFrame(() => fn());
+	return () => cancelAnimationFrame(frameId);
 };
 function ariaHidden(targetsOrFn, options = {}) {
-  const { defer = true } = options;
-  const func = defer ? raf : (v) => v();
-  const cleanups = [];
-  cleanups.push(
-    func(() => {
-      const targets = typeof targetsOrFn === "function" ? targetsOrFn() : targetsOrFn;
-      const elements = targets.filter(Boolean);
-      if (elements.length === 0) return;
-      cleanups.push(hideOthers(elements));
-    })
-  );
-  return () => {
-    cleanups.forEach((fn) => fn?.());
-  };
+	const { defer = true } = options;
+	const func = defer ? raf : (v) => v();
+	const cleanups = [];
+	cleanups.push(func(() => {
+		const elements = (typeof targetsOrFn === "function" ? targetsOrFn() : targetsOrFn).filter(Boolean);
+		if (elements.length === 0) return;
+		cleanups.push(hideOthers(elements));
+	}));
+	return () => {
+		cleanups.forEach((fn) => fn?.());
+	};
 }
-export {
-  ariaHidden
-};
+export { ariaHidden };

package/dist/walk-tree-outside.d.mts

@@ -1,10 +1,8 @@
 interface WalkTreeOutsideOptions {
-    parentNode: HTMLElement;
-    markerName: string;
-    controlAttribute: string;
-    explicitBooleanValue: boolean;
-    followControlledElements?: boolean;
+  parentNode: HTMLElement;
+  markerName: string;
+  attribute: "aria-hidden" | "inert";
+  followControlledElements?: boolean;
 }
-declare const walkTreeOutside: (originalTarget: Element | Element[], props: WalkTreeOutsideOptions) => VoidFunction;
-
-export { walkTreeOutside };
+export declare const walkTreeOutside: (originalTarget: Element | Element[], props: WalkTreeOutsideOptions) => VoidFunction;
+export {};

package/dist/walk-tree-outside.d.ts

@@ -1,10 +1,8 @@
 interface WalkTreeOutsideOptions {
-    parentNode: HTMLElement;
-    markerName: string;
-    controlAttribute: string;
-    explicitBooleanValue: boolean;
-    followControlledElements?: boolean;
+  parentNode: HTMLElement;
+  markerName: string;
+  attribute: "aria-hidden" | "inert";
+  followControlledElements?: boolean;
 }
-declare const walkTreeOutside: (originalTarget: Element | Element[], props: WalkTreeOutsideOptions) => VoidFunction;
-
-export { walkTreeOutside };
+export declare const walkTreeOutside: (originalTarget: Element | Element[], props: WalkTreeOutsideOptions) => VoidFunction;
+export {};

package/dist/walk-tree-outside.js

@@ -1,132 +1,159 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/walk-tree-outside.ts
-var walk_tree_outside_exports = {};
-__export(walk_tree_outside_exports, {
-  walkTreeOutside: () => walkTreeOutside
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
 });
-module.exports = __toCommonJS(walk_tree_outside_exports);
-var import_dom_query = require("@zag-js/dom-query");
-var counterMap = /* @__PURE__ */ new WeakMap();
-var uncontrolledNodes = /* @__PURE__ */ new WeakMap();
-var markerMap = {};
-var lockCount = 0;
-var unwrapHost = (node) => node && (node.host || unwrapHost(node.parentNode));
-var correctTargets = (parent, targets) => targets.map((target) => {
-  if (parent.contains(target)) return target;
-  const correctedTarget = unwrapHost(target);
-  if (correctedTarget && parent.contains(correctedTarget)) {
-    return correctedTarget;
-  }
-  console.error("[zag-js > ariaHidden] target", target, "in not contained inside", parent, ". Doing nothing");
-  return null;
+let _zag_js_dom_query = require("@zag-js/dom-query");
+// src/walk-tree-outside.ts
+let counterMap = /* @__PURE__ */ new WeakMap();
+let uncontrolledNodes = /* @__PURE__ */ new WeakMap();
+let markerMap = {};
+let lockCount = 0;
+const unwrapHost = (node) => node && (node.host || unwrapHost(node.parentNode));
+const correctTargets = (parent, targets) => targets.map((target) => {
+	if (parent.contains(target)) return target;
+	const correctedTarget = unwrapHost(target);
+	if (correctedTarget && parent.contains(correctedTarget)) return correctedTarget;
+	console.error("[zag-js > ariaHidden] target", target, "in not contained inside", parent, ". Doing nothing");
+	return null;
 }).filter((x) => Boolean(x));
-var ignoreableNodes = /* @__PURE__ */ new Set(["script", "output", "status", "next-route-announcer"]);
-var isIgnoredNode = (node) => {
-  if (ignoreableNodes.has(node.localName)) return true;
-  if (node.role === "status") return true;
-  if (node.hasAttribute("aria-live")) return true;
-  return node.matches("[data-live-announcer]");
+const LIVE_REGION_SELECTOR = "output, status, next-route-announcer, [role=\"status\"], [aria-live], [data-live-announcer]";
+const isIgnoredNode = (node) => node.localName === "script" || node.matches(LIVE_REGION_SELECTOR);
+const applyAttributeToOthers = (allTargets, props) => {
+	var _markerMap;
+	const { parentNode, markerName, attribute, followControlledElements = true } = props;
+	const attributeValue = attribute === "aria-hidden" ? "true" : "";
+	const targets = allTargets.filter((target) => parentNode.contains(target));
+	if (!targets.length) return () => {};
+	(_markerMap = markerMap)[markerName] || (_markerMap[markerName] = /* @__PURE__ */ new WeakMap());
+	const markerCounter = markerMap[markerName];
+	const hiddenNodes = [];
+	const elementsToKeep = /* @__PURE__ */ new Set();
+	const elementsToStop = new Set(targets);
+	const keep = (el) => {
+		if (!el || elementsToKeep.has(el)) return;
+		elementsToKeep.add(el);
+		keep(el.parentNode);
+	};
+	parentNode.querySelectorAll(LIVE_REGION_SELECTOR).forEach((region) => {
+		if (targets.some((target) => target.contains(region) || region.contains(target))) return;
+		keep(region);
+		elementsToStop.add(region);
+	});
+	targets.forEach((target) => {
+		keep(target);
+		if (followControlledElements && (0, _zag_js_dom_query.isHTMLElement)(target)) (0, _zag_js_dom_query.findControlledElements)(target, (controlledElement) => {
+			keep(controlledElement);
+			elementsToStop.add(controlledElement);
+		});
+	});
+	const deep = (parent) => {
+		if (!parent || elementsToStop.has(parent)) return;
+		Array.prototype.forEach.call(parent.children, (node) => {
+			if (elementsToKeep.has(node)) deep(node);
+			else try {
+				if (isIgnoredNode(node)) return;
+				const alreadyHidden = attribute === "aria-hidden" ? node.getAttribute(attribute) === "true" : node.hasAttribute(attribute);
+				const counterValue = (counterMap.get(node) || 0) + 1;
+				const markerValue = (markerCounter.get(node) || 0) + 1;
+				counterMap.set(node, counterValue);
+				markerCounter.set(node, markerValue);
+				hiddenNodes.push(node);
+				if (counterValue === 1 && alreadyHidden) uncontrolledNodes.set(node, true);
+				if (markerValue === 1) node.setAttribute(markerName, "");
+				if (!alreadyHidden) node.setAttribute(attribute, attributeValue);
+			} catch (e) {
+				console.error("[zag-js > ariaHidden] cannot operate on ", node, e);
+			}
+		});
+	};
+	deep(parentNode);
+	elementsToKeep.clear();
+	lockCount++;
+	return () => {
+		hiddenNodes.forEach((node) => {
+			const counterValue = counterMap.get(node) - 1;
+			const markerValue = markerCounter.get(node) - 1;
+			counterMap.set(node, counterValue);
+			markerCounter.set(node, markerValue);
+			if (!counterValue) {
+				if (!uncontrolledNodes.has(node)) node.removeAttribute(attribute);
+				uncontrolledNodes.delete(node);
+			}
+			if (!markerValue) node.removeAttribute(markerName);
+		});
+		lockCount--;
+		if (!lockCount) {
+			counterMap = /* @__PURE__ */ new WeakMap();
+			uncontrolledNodes = /* @__PURE__ */ new WeakMap();
+			markerMap = {};
+		}
+	};
 };
-var walkTreeOutside = (originalTarget, props) => {
-  const { parentNode, markerName, controlAttribute, explicitBooleanValue, followControlledElements = true } = props;
-  const targets = correctTargets(parentNode, Array.isArray(originalTarget) ? originalTarget : [originalTarget]);
-  markerMap[markerName] || (markerMap[markerName] = /* @__PURE__ */ new WeakMap());
-  const markerCounter = markerMap[markerName];
-  const hiddenNodes = [];
-  const elementsToKeep = /* @__PURE__ */ new Set();
-  const elementsToStop = new Set(targets);
-  const keep = (el) => {
-    if (!el || elementsToKeep.has(el)) return;
-    elementsToKeep.add(el);
-    keep(el.parentNode);
-  };
-  targets.forEach((target) => {
-    keep(target);
-    if (followControlledElements && (0, import_dom_query.isHTMLElement)(target)) {
-      (0, import_dom_query.findControlledElements)(target, (controlledElement) => {
-        keep(controlledElement);
-      });
-    }
-  });
-  const deep = (parent) => {
-    if (!parent || elementsToStop.has(parent)) {
-      return;
-    }
-    Array.prototype.forEach.call(parent.children, (node) => {
-      if (elementsToKeep.has(node)) {
-        deep(node);
-      } else {
-        try {
-          if (isIgnoredNode(node)) return;
-          const attr = node.getAttribute(controlAttribute);
-          const alreadyHidden = explicitBooleanValue ? attr === "true" : attr !== null && attr !== "false";
-          const counterValue = (counterMap.get(node) || 0) + 1;
-          const markerValue = (markerCounter.get(node) || 0) + 1;
-          counterMap.set(node, counterValue);
-          markerCounter.set(node, markerValue);
-          hiddenNodes.push(node);
-          if (counterValue === 1 && alreadyHidden) {
-            uncontrolledNodes.set(node, true);
-          }
-          if (markerValue === 1) {
-            node.setAttribute(markerName, "");
-          }
-          if (!alreadyHidden) {
-            node.setAttribute(controlAttribute, explicitBooleanValue ? "true" : "");
-          }
-        } catch (e) {
-          console.error("[zag-js > ariaHidden] cannot operate on ", node, e);
-        }
-      }
-    });
-  };
-  deep(parentNode);
-  elementsToKeep.clear();
-  lockCount++;
-  return () => {
-    hiddenNodes.forEach((node) => {
-      const counterValue = counterMap.get(node) - 1;
-      const markerValue = markerCounter.get(node) - 1;
-      counterMap.set(node, counterValue);
-      markerCounter.set(node, markerValue);
-      if (!counterValue) {
-        if (!uncontrolledNodes.has(node)) {
-          node.removeAttribute(controlAttribute);
-        }
-        uncontrolledNodes.delete(node);
-      }
-      if (!markerValue) {
-        node.removeAttribute(markerName);
-      }
-    });
-    lockCount--;
-    if (!lockCount) {
-      counterMap = /* @__PURE__ */ new WeakMap();
-      counterMap = /* @__PURE__ */ new WeakMap();
-      uncontrolledNodes = /* @__PURE__ */ new WeakMap();
-      markerMap = {};
-    }
-  };
+function createLockStack() {
+	const locks = [];
+	return {
+		add(lock) {
+			locks[locks.length - 1]?.pause();
+			locks.push(lock);
+			lock.resume();
+		},
+		remove(lock) {
+			const index = locks.indexOf(lock);
+			if (index === -1) return;
+			const isTop = index === locks.length - 1;
+			locks.splice(index, 1);
+			if (!isTop) return;
+			lock.pause();
+			locks[locks.length - 1]?.resume();
+		}
+	};
+}
+const lockStacks = /* @__PURE__ */ new WeakMap();
+const getLockStack = (doc) => {
+	let stack = lockStacks.get(doc);
+	if (!stack) {
+		stack = createLockStack();
+		lockStacks.set(doc, stack);
+	}
+	return stack;
 };
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  walkTreeOutside
-});
+const walkTreeOutside = (originalTarget, props) => {
+	const { parentNode, attribute, followControlledElements = true } = props;
+	const targets = correctTargets(parentNode, Array.isArray(originalTarget) ? originalTarget : [originalTarget]);
+	if (!targets.length) return () => {};
+	const hiddenSelector = attribute === "aria-hidden" ? "[aria-hidden=\"true\"]" : "[inert]";
+	let undo;
+	let observer;
+	const apply = () => {
+		const prevUndo = undo;
+		undo = applyAttributeToOthers(targets, props);
+		prevUndo?.();
+	};
+	const release = () => {
+		undo?.();
+		undo = void 0;
+	};
+	const lock = {
+		pause() {
+			observer?.disconnect();
+			observer = void 0;
+			release();
+		},
+		resume() {
+			apply();
+			if (!followControlledElements) return;
+			observer = new ((0, _zag_js_dom_query.getWindow)(parentNode)).MutationObserver((records) => {
+				if (records.some(({ target }) => (0, _zag_js_dom_query.isElement)(target) && !target.closest(hiddenSelector))) apply();
+			});
+			observer.observe(parentNode, {
+				attributes: true,
+				attributeFilter: ["aria-expanded"],
+				subtree: true
+			});
+		}
+	};
+	const lockStack = getLockStack(parentNode.ownerDocument);
+	lockStack.add(lock);
+	return () => lockStack.remove(lock);
+};
+exports.walkTreeOutside = walkTreeOutside;

package/dist/walk-tree-outside.mjs

@@ -1,107 +1,155 @@
+import { findControlledElements, getWindow, isElement, isHTMLElement } from "@zag-js/dom-query";
 // src/walk-tree-outside.ts
-import { findControlledElements, isHTMLElement } from "@zag-js/dom-query";
-var counterMap = /* @__PURE__ */ new WeakMap();
-var uncontrolledNodes = /* @__PURE__ */ new WeakMap();
-var markerMap = {};
-var lockCount = 0;
-var unwrapHost = (node) => node && (node.host || unwrapHost(node.parentNode));
-var correctTargets = (parent, targets) => targets.map((target) => {
-  if (parent.contains(target)) return target;
-  const correctedTarget = unwrapHost(target);
-  if (correctedTarget && parent.contains(correctedTarget)) {
-    return correctedTarget;
-  }
-  console.error("[zag-js > ariaHidden] target", target, "in not contained inside", parent, ". Doing nothing");
-  return null;
+let counterMap = /* @__PURE__ */ new WeakMap();
+let uncontrolledNodes = /* @__PURE__ */ new WeakMap();
+let markerMap = {};
+let lockCount = 0;
+const unwrapHost = (node) => node && (node.host || unwrapHost(node.parentNode));
+const correctTargets = (parent, targets) => targets.map((target) => {
+	if (parent.contains(target)) return target;
+	const correctedTarget = unwrapHost(target);
+	if (correctedTarget && parent.contains(correctedTarget)) return correctedTarget;
+	console.error("[zag-js > ariaHidden] target", target, "in not contained inside", parent, ". Doing nothing");
+	return null;
 }).filter((x) => Boolean(x));
-var ignoreableNodes = /* @__PURE__ */ new Set(["script", "output", "status", "next-route-announcer"]);
-var isIgnoredNode = (node) => {
-  if (ignoreableNodes.has(node.localName)) return true;
-  if (node.role === "status") return true;
-  if (node.hasAttribute("aria-live")) return true;
-  return node.matches("[data-live-announcer]");
+const LIVE_REGION_SELECTOR = "output, status, next-route-announcer, [role=\"status\"], [aria-live], [data-live-announcer]";
+const isIgnoredNode = (node) => node.localName === "script" || node.matches(LIVE_REGION_SELECTOR);
+const applyAttributeToOthers = (allTargets, props) => {
+	var _markerMap;
+	const { parentNode, markerName, attribute, followControlledElements = true } = props;
+	const attributeValue = attribute === "aria-hidden" ? "true" : "";
+	const targets = allTargets.filter((target) => parentNode.contains(target));
+	if (!targets.length) return () => {};
+	(_markerMap = markerMap)[markerName] || (_markerMap[markerName] = /* @__PURE__ */ new WeakMap());
+	const markerCounter = markerMap[markerName];
+	const hiddenNodes = [];
+	const elementsToKeep = /* @__PURE__ */ new Set();
+	const elementsToStop = new Set(targets);
+	const keep = (el) => {
+		if (!el || elementsToKeep.has(el)) return;
+		elementsToKeep.add(el);
+		keep(el.parentNode);
+	};
+	parentNode.querySelectorAll(LIVE_REGION_SELECTOR).forEach((region) => {
+		if (targets.some((target) => target.contains(region) || region.contains(target))) return;
+		keep(region);
+		elementsToStop.add(region);
+	});
+	targets.forEach((target) => {
+		keep(target);
+		if (followControlledElements && isHTMLElement(target)) findControlledElements(target, (controlledElement) => {
+			keep(controlledElement);
+			elementsToStop.add(controlledElement);
+		});
+	});
+	const deep = (parent) => {
+		if (!parent || elementsToStop.has(parent)) return;
+		Array.prototype.forEach.call(parent.children, (node) => {
+			if (elementsToKeep.has(node)) deep(node);
+			else try {
+				if (isIgnoredNode(node)) return;
+				const alreadyHidden = attribute === "aria-hidden" ? node.getAttribute(attribute) === "true" : node.hasAttribute(attribute);
+				const counterValue = (counterMap.get(node) || 0) + 1;
+				const markerValue = (markerCounter.get(node) || 0) + 1;
+				counterMap.set(node, counterValue);
+				markerCounter.set(node, markerValue);
+				hiddenNodes.push(node);
+				if (counterValue === 1 && alreadyHidden) uncontrolledNodes.set(node, true);
+				if (markerValue === 1) node.setAttribute(markerName, "");
+				if (!alreadyHidden) node.setAttribute(attribute, attributeValue);
+			} catch (e) {
+				console.error("[zag-js > ariaHidden] cannot operate on ", node, e);
+			}
+		});
+	};
+	deep(parentNode);
+	elementsToKeep.clear();
+	lockCount++;
+	return () => {
+		hiddenNodes.forEach((node) => {
+			const counterValue = counterMap.get(node) - 1;
+			const markerValue = markerCounter.get(node) - 1;
+			counterMap.set(node, counterValue);
+			markerCounter.set(node, markerValue);
+			if (!counterValue) {
+				if (!uncontrolledNodes.has(node)) node.removeAttribute(attribute);
+				uncontrolledNodes.delete(node);
+			}
+			if (!markerValue) node.removeAttribute(markerName);
+		});
+		lockCount--;
+		if (!lockCount) {
+			counterMap = /* @__PURE__ */ new WeakMap();
+			uncontrolledNodes = /* @__PURE__ */ new WeakMap();
+			markerMap = {};
+		}
+	};
 };
-var walkTreeOutside = (originalTarget, props) => {
-  const { parentNode, markerName, controlAttribute, explicitBooleanValue, followControlledElements = true } = props;
-  const targets = correctTargets(parentNode, Array.isArray(originalTarget) ? originalTarget : [originalTarget]);
-  markerMap[markerName] || (markerMap[markerName] = /* @__PURE__ */ new WeakMap());
-  const markerCounter = markerMap[markerName];
-  const hiddenNodes = [];
-  const elementsToKeep = /* @__PURE__ */ new Set();
-  const elementsToStop = new Set(targets);
-  const keep = (el) => {
-    if (!el || elementsToKeep.has(el)) return;
-    elementsToKeep.add(el);
-    keep(el.parentNode);
-  };
-  targets.forEach((target) => {
-    keep(target);
-    if (followControlledElements && isHTMLElement(target)) {
-      findControlledElements(target, (controlledElement) => {
-        keep(controlledElement);
-      });
-    }
-  });
-  const deep = (parent) => {
-    if (!parent || elementsToStop.has(parent)) {
-      return;
-    }
-    Array.prototype.forEach.call(parent.children, (node) => {
-      if (elementsToKeep.has(node)) {
-        deep(node);
-      } else {
-        try {
-          if (isIgnoredNode(node)) return;
-          const attr = node.getAttribute(controlAttribute);
-          const alreadyHidden = explicitBooleanValue ? attr === "true" : attr !== null && attr !== "false";
-          const counterValue = (counterMap.get(node) || 0) + 1;
-          const markerValue = (markerCounter.get(node) || 0) + 1;
-          counterMap.set(node, counterValue);
-          markerCounter.set(node, markerValue);
-          hiddenNodes.push(node);
-          if (counterValue === 1 && alreadyHidden) {
-            uncontrolledNodes.set(node, true);
-          }
-          if (markerValue === 1) {
-            node.setAttribute(markerName, "");
-          }
-          if (!alreadyHidden) {
-            node.setAttribute(controlAttribute, explicitBooleanValue ? "true" : "");
-          }
-        } catch (e) {
-          console.error("[zag-js > ariaHidden] cannot operate on ", node, e);
-        }
-      }
-    });
-  };
-  deep(parentNode);
-  elementsToKeep.clear();
-  lockCount++;
-  return () => {
-    hiddenNodes.forEach((node) => {
-      const counterValue = counterMap.get(node) - 1;
-      const markerValue = markerCounter.get(node) - 1;
-      counterMap.set(node, counterValue);
-      markerCounter.set(node, markerValue);
-      if (!counterValue) {
-        if (!uncontrolledNodes.has(node)) {
-          node.removeAttribute(controlAttribute);
-        }
-        uncontrolledNodes.delete(node);
-      }
-      if (!markerValue) {
-        node.removeAttribute(markerName);
-      }
-    });
-    lockCount--;
-    if (!lockCount) {
-      counterMap = /* @__PURE__ */ new WeakMap();
-      counterMap = /* @__PURE__ */ new WeakMap();
-      uncontrolledNodes = /* @__PURE__ */ new WeakMap();
-      markerMap = {};
-    }
-  };
+function createLockStack() {
+	const locks = [];
+	return {
+		add(lock) {
+			locks[locks.length - 1]?.pause();
+			locks.push(lock);
+			lock.resume();
+		},
+		remove(lock) {
+			const index = locks.indexOf(lock);
+			if (index === -1) return;
+			const isTop = index === locks.length - 1;
+			locks.splice(index, 1);
+			if (!isTop) return;
+			lock.pause();
+			locks[locks.length - 1]?.resume();
+		}
+	};
+}
+const lockStacks = /* @__PURE__ */ new WeakMap();
+const getLockStack = (doc) => {
+	let stack = lockStacks.get(doc);
+	if (!stack) {
+		stack = createLockStack();
+		lockStacks.set(doc, stack);
+	}
+	return stack;
 };
-export {
-  walkTreeOutside
+const walkTreeOutside = (originalTarget, props) => {
+	const { parentNode, attribute, followControlledElements = true } = props;
+	const targets = correctTargets(parentNode, Array.isArray(originalTarget) ? originalTarget : [originalTarget]);
+	if (!targets.length) return () => {};
+	const hiddenSelector = attribute === "aria-hidden" ? "[aria-hidden=\"true\"]" : "[inert]";
+	let undo;
+	let observer;
+	const apply = () => {
+		const prevUndo = undo;
+		undo = applyAttributeToOthers(targets, props);
+		prevUndo?.();
+	};
+	const release = () => {
+		undo?.();
+		undo = void 0;
+	};
+	const lock = {
+		pause() {
+			observer?.disconnect();
+			observer = void 0;
+			release();
+		},
+		resume() {
+			apply();
+			if (!followControlledElements) return;
+			observer = new (getWindow(parentNode)).MutationObserver((records) => {
+				if (records.some(({ target }) => isElement(target) && !target.closest(hiddenSelector))) apply();
+			});
+			observer.observe(parentNode, {
+				attributes: true,
+				attributeFilter: ["aria-expanded"],
+				subtree: true
+			});
+		}
+	};
+	const lockStack = getLockStack(parentNode.ownerDocument);
+	lockStack.add(lock);
+	return () => lockStack.remove(lock);
 };
+export { walkTreeOutside };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/aria-hidden",
-  "version": "2.0.0-next.3",
+  "version": "2.0.0-next.4",
   "description": "Hide targets from screen readers",
   "keywords": [
     "js",
@@ -27,7 +27,7 @@
   "clean-package": "../../../clean-package.config.json",
   "main": "dist/index.js",
   "dependencies": {
-    "@zag-js/dom-query": "2.0.0-next.3"
+    "@zag-js/dom-query": "2.0.0-next.4"
   },
   "devDependencies": {
     "clean-package": "2.2.0"
@@ -48,7 +48,7 @@
     "./package.json": "./package.json"
   },
   "scripts": {
-    "build": "tsup",
+    "build": "tsdown",
     "test": "vitest",
     "lint": "oxlint src",
     "test-ci": "pnpm test --ci --runInBand -u",