@vizejs/ui 0.347.7 → 0.351.0

package/dist/inert-outside-CyqtoKQ4.mjs

@@ -0,0 +1,346 @@
+import { getCurrentInstance, getCurrentScope, onMounted, onScopeDispose, shallowReadonly, shallowRef, toValue, watch } from "vue";
+//#region src/inert-outside-internal.ts
+const optionDiagnostic = "VIZE_UI_INERT_OUTSIDE_OPTION";
+const rootDiagnostic = "VIZE_UI_INERT_OUTSIDE_ROOT";
+function readRoot(source) {
+	const value = toValue(source);
+	if (value === void 0 || value === null) return null;
+	const candidate = value;
+	if (candidate.nodeType !== 1 || !candidate.ownerDocument) throw new TypeError(`${rootDiagnostic}: root must resolve to an Element or null`);
+	return value;
+}
+function readBranches(source, document) {
+	const value = toValue(source) ?? [];
+	if (!Array.isArray(value)) throw new TypeError(`${optionDiagnostic}: branches must resolve to an array of Elements`);
+	const unique = [...new Set(value)];
+	for (const branch of unique) {
+		const candidate = branch;
+		if (candidate.nodeType !== 1 || !candidate.ownerDocument) throw new TypeError(`${optionDiagnostic}: branches must contain only Elements`);
+		if (document && candidate.ownerDocument !== document) throw new TypeError(`${optionDiagnostic}: branches must share the root document`);
+	}
+	return unique;
+}
+function readEnabled(source) {
+	const value = toValue(source);
+	if (value === void 0) return true;
+	if (typeof value !== "boolean") throw new TypeError(`${optionDiagnostic}: enabled must resolve to a boolean`);
+	return value;
+}
+function readMode(source) {
+	const value = toValue(source) ?? "both";
+	if (value !== "aria-hidden" && value !== "both" && value !== "inert") throw new TypeError(`${optionDiagnostic}: mode must resolve to "aria-hidden", "both", or "inert"`);
+	return value;
+}
+function validateOptions(options) {
+	if (!options || typeof options !== "object" || Array.isArray(options)) throw new TypeError(`${optionDiagnostic}: options must be an object`);
+	const root = readRoot(options.root);
+	readBranches(options.branches, root?.ownerDocument ?? null);
+	readEnabled(options.enabled);
+	readMode(options.mode);
+}
+//#endregion
+//#region src/inert-outside-dom.ts
+const ignoredNames = new Set([
+	"link",
+	"meta",
+	"noscript",
+	"script",
+	"style",
+	"template"
+]);
+function composedParent(element) {
+	if (element.assignedSlot) return element.assignedSlot;
+	if (element.parentElement) return element.parentElement;
+	return element.getRootNode().host ?? null;
+}
+function containsComposed(root, element) {
+	let current = element;
+	while (current) {
+		if (current === root || root.contains(current)) return true;
+		current = composedParent(current);
+	}
+	return false;
+}
+function renderedChildren(element) {
+	const slot = element;
+	if (slot.localName === "slot" && typeof slot.assignedElements === "function") {
+		const assigned = slot.assignedElements({ flatten: true });
+		if (assigned.length > 0) return assigned;
+	}
+	return Array.from(element.shadowRoot?.children ?? element.children);
+}
+/** Collect every currently reachable open shadow root for document-level observation. */
+function collectOpenShadowRoots(root) {
+	const roots = [];
+	for (const element of root.querySelectorAll("*")) {
+		const shadowRoot = element.shadowRoot;
+		if (!shadowRoot) continue;
+		roots.push(shadowRoot, ...collectOpenShadowRoots(shadowRoot));
+	}
+	return roots;
+}
+function isInsideAllowed(element, allowed) {
+	return allowed.some((root) => root === element || containsComposed(root, element));
+}
+function containsAllowed(element, allowed) {
+	return allowed.some((root) => root === element || containsComposed(element, root));
+}
+/** Find the smallest rendered sibling subtrees outside every allowed root. */
+function collectOutside(document, allowed) {
+	const body = document.body;
+	if (!body || allowed.some((root) => root === body || containsComposed(root, body))) return [];
+	const outside = [];
+	const visit = (container) => {
+		for (const child of renderedChildren(container)) {
+			if (ignoredNames.has(child.localName)) continue;
+			if (isInsideAllowed(child, allowed)) continue;
+			if (containsAllowed(child, allowed)) visit(child);
+			else outside.push(child);
+		}
+	};
+	visit(body);
+	return outside;
+}
+function maskFor(mode) {
+	return {
+		ariaHidden: mode === "aria-hidden" || mode === "both",
+		inert: mode === "inert" || mode === "both"
+	};
+}
+//#endregion
+//#region src/inert-outside-stack.ts
+const states = /* @__PURE__ */ new WeakMap();
+const observationOptions = Object.freeze({
+	attributes: true,
+	attributeFilter: [
+		"aria-hidden",
+		"inert",
+		"name",
+		"slot"
+	],
+	childList: true,
+	subtree: true
+});
+function stateFor(document) {
+	let state = states.get(document);
+	if (!state) {
+		state = {
+			document,
+			managed: /* @__PURE__ */ new Map(),
+			observer: null,
+			queued: false,
+			tokens: []
+		};
+		states.set(document, state);
+	}
+	return state;
+}
+function restore(state) {
+	for (const [element, snapshot] of state.managed) {
+		if (snapshot.ariaHidden === null) element.removeAttribute("aria-hidden");
+		else element.setAttribute("aria-hidden", snapshot.ariaHidden);
+		if (snapshot.inert) element.setAttribute("inert", "");
+		else element.removeAttribute("inert");
+	}
+	state.managed.clear();
+}
+function mergeMask(current, next) {
+	return {
+		ariaHidden: current?.ariaHidden === true || next.ariaHidden,
+		inert: current?.inert === true || next.inert
+	};
+}
+function refreshObservationRoots(state) {
+	const root = state.document.documentElement;
+	if (!state.observer || !root) return;
+	state.observer.disconnect();
+	state.observer.observe(root, observationOptions);
+	for (const shadowRoot of collectOpenShadowRoots(state.document)) state.observer.observe(shadowRoot, observationOptions);
+}
+function connectedRoots(token) {
+	if (!token.root?.isConnected || !token.readEnabled()) return [];
+	return [...new Set([token.root, ...token.readBranches()])].filter((root) => root.isConnected);
+}
+function recomputeDocument(state) {
+	const records = state.tokens.map((token) => ({
+		mode: token.readMode(),
+		roots: connectedRoots(token),
+		token
+	})).filter(({ roots }) => roots.length > 0);
+	const desired = /* @__PURE__ */ new Map();
+	for (let index = 0; index < records.length; index++) {
+		const record = records[index];
+		if (!record) continue;
+		const allowed = records.slice(index).flatMap(({ roots }) => roots);
+		const affected = collectOutside(state.document, allowed);
+		record.token.setAffected(Object.freeze(affected));
+		const mask = maskFor(record.mode);
+		for (const element of affected) desired.set(element, mergeMask(desired.get(element), mask));
+	}
+	for (const token of state.tokens) if (!records.some((record) => record.token === token)) token.setAffected(Object.freeze([]));
+	restore(state);
+	for (const [element, mask] of desired) {
+		state.managed.set(element, {
+			ariaHidden: element.getAttribute("aria-hidden"),
+			inert: element.hasAttribute("inert")
+		});
+		if (mask.ariaHidden) element.setAttribute("aria-hidden", "true");
+		if (mask.inert) element.setAttribute("inert", "");
+	}
+	state.observer?.takeRecords();
+	refreshObservationRoots(state);
+}
+function observe(state) {
+	if (state.observer) return;
+	const Observer = state.document.defaultView?.MutationObserver;
+	const root = state.document.documentElement;
+	if (!Observer || !root) return;
+	state.observer = new Observer(() => {
+		if (state.queued) return;
+		state.queued = true;
+		queueMicrotask(() => {
+			state.queued = false;
+			if (state.tokens.length > 0) recomputeDocument(state);
+		});
+	});
+	refreshObservationRoots(state);
+}
+function attachToken(token, root) {
+	if (token.document === root.ownerDocument) {
+		token.root = root;
+		recomputeDocument(stateFor(root.ownerDocument));
+		return;
+	}
+	detachToken(token);
+	token.document = root.ownerDocument;
+	token.root = root;
+	const state = stateFor(root.ownerDocument);
+	state.tokens.push(token);
+	observe(state);
+	recomputeDocument(state);
+}
+function detachToken(token) {
+	const document = token.document;
+	if (!document) {
+		token.root = null;
+		token.setAffected(Object.freeze([]));
+		return;
+	}
+	const state = stateFor(document);
+	const index = state.tokens.indexOf(token);
+	if (index >= 0) state.tokens.splice(index, 1);
+	token.document = null;
+	token.root = null;
+	token.setAffected(Object.freeze([]));
+	if (state.tokens.length === 0) {
+		state.observer?.disconnect();
+		state.observer = null;
+		restore(state);
+		states.delete(document);
+	} else recomputeDocument(state);
+}
+function refreshToken(token) {
+	if (token.document) recomputeDocument(stateFor(token.document));
+}
+//#endregion
+//#region src/inert-outside.ts
+const disposedDiagnostic = "VIZE_UI_INERT_OUTSIDE_DISPOSED";
+const setupDiagnostic = "VIZE_UI_INERT_OUTSIDE_SETUP";
+/** Isolate rendered content outside reactive allowed roots without owning visual styling. */
+function createInertOutside(options) {
+	validateOptions(options);
+	const activeState = shallowRef(false);
+	const affectedState = shallowRef(Object.freeze([]));
+	const token = {
+		document: null,
+		root: null,
+		readBranches: () => readBranches(options.branches, token.document),
+		readEnabled: () => readEnabled(options.enabled),
+		readMode: () => readMode(options.mode),
+		setAffected: (elements) => {
+			affectedState.value = elements;
+		}
+	};
+	let disposed = false;
+	const assertAlive = () => {
+		if (disposed) throw new Error(`${disposedDiagnostic}: the controller has been disposed`);
+	};
+	const refresh = () => {
+		assertAlive();
+		if (!activeState.value) return;
+		const nextRoot = readRoot(options.root);
+		if (nextRoot !== token.root) if (nextRoot) {
+			readBranches(options.branches, nextRoot.ownerDocument);
+			readEnabled(options.enabled);
+			readMode(options.mode);
+			attachToken(token, nextRoot);
+		} else detachToken(token);
+		else {
+			readBranches(options.branches, token.document);
+			readEnabled(options.enabled);
+			readMode(options.mode);
+			refreshToken(token);
+		}
+	};
+	const activate = () => {
+		assertAlive();
+		if (activeState.value) return;
+		activeState.value = true;
+		try {
+			refresh();
+		} catch (error) {
+			activeState.value = false;
+			detachToken(token);
+			throw error;
+		}
+	};
+	const deactivate = () => {
+		assertAlive();
+		if (!activeState.value) return;
+		try {
+			detachToken(token);
+		} finally {
+			activeState.value = false;
+		}
+	};
+	const stopWatch = watch(() => {
+		const root = toValue(options.root);
+		const branches = toValue(options.branches) ?? [];
+		return [
+			root,
+			Array.isArray(branches) ? [...branches] : branches,
+			toValue(options.enabled),
+			toValue(options.mode)
+		];
+	}, () => {
+		if (activeState.value) refresh();
+	}, { flush: "sync" });
+	return Object.freeze({
+		isActive: shallowReadonly(activeState),
+		affectedElements: shallowReadonly(affectedState),
+		activate,
+		deactivate,
+		refresh,
+		dispose: () => {
+			if (disposed) return;
+			try {
+				detachToken(token);
+			} finally {
+				activeState.value = false;
+				disposed = true;
+				stopWatch();
+			}
+		}
+	});
+}
+/** Create, mount-activate, and scope-dispose an outside-inerting controller. */
+function useInertOutside(options) {
+	if (!getCurrentScope()) throw new Error(`${setupDiagnostic}: use inside component setup or an active effect scope`);
+	const controller = createInertOutside(options);
+	if (getCurrentInstance()) onMounted(controller.activate);
+	else controller.activate();
+	onScopeDispose(controller.dispose);
+	return controller;
+}
+//#endregion
+export { useInertOutside as n, createInertOutside as t };

package/dist/inert-outside-tuHRmaqJ.d.mts

@@ -0,0 +1,43 @@
+import { MaybeRefOrGetter, ShallowRef } from "vue";
+
+//#region src/inert-outside-types.d.ts
+/** Attribute strategy used to isolate content outside an allowed subtree. */
+type InertOutsideMode = "aria-hidden" | "both" | "inert";
+/** Reactive configuration for one document-level inerting layer. */
+interface InertOutsideOptions {
+  /** Primary allowed root. It may be `null` during SSR and before mount. */
+  readonly root: MaybeRefOrGetter<Element | null | undefined>;
+  /** Additional portalled or exceptional roots that remain available. */
+  readonly branches?: MaybeRefOrGetter<readonly Element[] | undefined>;
+  /** Whether an activated controller currently isolates outside content. @default true */
+  readonly enabled?: MaybeRefOrGetter<boolean | undefined>;
+  /**
+   * Isolation attributes to apply. `aria-hidden` alone does not prevent focus or pointer input;
+   * reserve that mode for integrations that provide equivalent interaction blocking separately.
+   * @default "both"
+   */
+  readonly mode?: MaybeRefOrGetter<InertOutsideMode | undefined>;
+}
+/** Lifecycle and inspection interface returned by `createInertOutside`. */
+interface InertOutsideController {
+  /** Whether this controller is activated, independently of reactive enablement. */
+  readonly isActive: Readonly<ShallowRef<boolean>>;
+  /** Elements selected by this layer during the latest recomputation. */
+  readonly affectedElements: Readonly<ShallowRef<readonly Element[]>>;
+  /** Join the document isolation stack. Safe to call repeatedly. */
+  readonly activate: () => void;
+  /** Leave the stack and restore every attribute owned by this layer. */
+  readonly deactivate: () => void;
+  /** Re-read roots and options after imperative DOM movement. */
+  readonly refresh: () => void;
+  /** Permanently release reactive and document-level ownership. */
+  readonly dispose: () => void;
+}
+//#endregion
+//#region src/inert-outside.d.ts
+/** Isolate rendered content outside reactive allowed roots without owning visual styling. */
+declare function createInertOutside(options: InertOutsideOptions): InertOutsideController;
+/** Create, mount-activate, and scope-dispose an outside-inerting controller. */
+declare function useInertOutside(options: InertOutsideOptions): InertOutsideController;
+//#endregion
+export { InertOutsideOptions as a, InertOutsideMode as i, useInertOutside as n, InertOutsideController as r, createInertOutside as t };

package/dist/inert-outside.d.mts

@@ -0,0 +1,2 @@
+import { a as InertOutsideOptions, i as InertOutsideMode, n as useInertOutside, r as InertOutsideController, t as createInertOutside } from "./inert-outside-tuHRmaqJ.mjs";
+export { type InertOutsideController, type InertOutsideMode, type InertOutsideOptions, createInertOutside, useInertOutside };

package/dist/inert-outside.mjs

@@ -0,0 +1,2 @@
+import { n as useInertOutside, t as createInertOutside } from "./inert-outside-CyqtoKQ4.mjs";
+export { createInertOutside, useInertOutside };

package/dist/interaction-modality.d.mts

@@ -1,2 +1,2 @@
-import { a as InteractionModalityChange, c as InteractionModalityTracker, i as InteractionModality, n as isElementFocusVisible, o as InteractionModalityChangeReason, r as useInteractionModality, s as InteractionModalityOptions, t as createInteractionModalityTracker } from "./interaction-modality-tee79ZBZ.mjs";
-export { InteractionModality, InteractionModalityChange, InteractionModalityChangeReason, InteractionModalityOptions, InteractionModalityTracker, createInteractionModalityTracker, isElementFocusVisible, useInteractionModality };
+import { a as InteractionModalityChange, c as InteractionModalityTracker, i as InteractionModality, n as isElementFocusVisible, o as InteractionModalityChangeReason, r as useInteractionModality, s as InteractionModalityOptions, t as createInteractionModalityTracker } from "./interaction-modality-jgHKjPFB.mjs";
+export { type InteractionModality, type InteractionModalityChange, type InteractionModalityChangeReason, type InteractionModalityOptions, type InteractionModalityTracker, createInteractionModalityTracker, isElementFocusVisible, useInteractionModality };

package/dist/interaction-modality.mjs

@@ -1,2 +1,2 @@
-import { n as isElementFocusVisible, r as useInteractionModality, t as createInteractionModalityTracker } from "./interaction-modality-CO-eQzNy.mjs";
+import { n as isElementFocusVisible, r as useInteractionModality, t as createInteractionModalityTracker } from "./interaction-modality-DOZK0BpZ.mjs";
 export { createInteractionModalityTracker, isElementFocusVisible, useInteractionModality };