@vuetify/v0 0.1.8 → 0.1.9

package/dist/{useClickOutside-W0Sur1rC.mjs → useClickOutside-hOhNk4eS.mjs}

@@ -1,14 +1,14 @@
-import { a as SUPPORTS_OBSERVER, i as SUPPORTS_MUTATION_OBSERVER, n as SUPPORTS_INTERSECTION_OBSERVER, r as SUPPORTS_MATCH_MEDIA, t as IN_BROWSER } from "./globals-ClSU6mqC.mjs";
+import { a as SUPPORTS_OBSERVER, i as SUPPORTS_MUTATION_OBSERVER, n as SUPPORTS_INTERSECTION_OBSERVER, r as SUPPORTS_MATCH_MEDIA, t as IN_BROWSER } from "./globals-3i9umzyz.mjs";
 import { clamp, instanceExists, isElement, isFunction, isNull, isNullOrUndefined, isNumber, isObject, isString, isUndefined, mergeDeep, useId as useId$1 } from "./utilities/index.mjs";
 import { i as useContext, n as createContext, t as createTrinity } from "./createTrinity-C_c8eedz.mjs";
-import { a as createPlugin, i as useLogger, o as createPluginContext } from "./useLogger-DY1Hbcy1.mjs";
-import { i as createRegistry } from "./createTokens-CXlT0Vc6.mjs";
-import { i as createModel, t as createSelection } from "./createSelection-8MX0OHXR.mjs";
-import { t as createSingle } from "./createSingle-CbuOBb-E.mjs";
-import { t as createGroup } from "./createGroup-BpJFi41X.mjs";
+import { a as createPlugin, i as useLogger, o as createPluginContext } from "./useLogger-cGK00Ywd.mjs";
+import { i as createRegistry } from "./createTokens-C1gIuKCK.mjs";
+import { i as createModel, t as createSelection } from "./createSelection-DbWP6c7H.mjs";
+import { t as createSingle } from "./createSingle-CeAJpbXs.mjs";
+import { t as createGroup } from "./createGroup-PvzsLu9E.mjs";
 import { t as toArray } from "./toArray-VdROPpy-.mjs";
-import { a as useLocale } from "./useLocale-cQlPxbpV.mjs";
-import { a as useRules, o as isStandardSchema } from "./useRules-BbA6_gvs.mjs";
+import { a as useLocale } from "./useLocale-BaufqE5Z.mjs";
+import { a as useRules, o as isStandardSchema } from "./useRules-LD-_-Hxt.mjs";
 import { t as MemoryAdapter } from "./memory-XCMtkld1.mjs";
 import { computed, effectScope, isRef, nextTick, onMounted, onScopeDispose, reactive, readonly, ref, shallowReactive, shallowReadonly, shallowRef, toRef, toValue, unref, watch, watchEffect } from "vue";
 //#region src/composables/createBreadcrumbs/index.ts
@@ -747,7 +747,8 @@ function useProxyModel(context, model, options) {
 	const modelAsArray = transformIn(model);
 	const pending = new Set(modelAsArray);
 	context.apply(modelAsArray, applyOptions);
-	for (const value of modelAsArray) if (Array.from(context.selectedValues.value).includes(value)) pending.delete(value);
+	const selected = new Set(context.selectedValues.value);
+	for (const value of modelAsArray) if (selected.has(value)) pending.delete(value);
 	const contextWatch = watch(context.selectedValues, (val) => {
 		modelWatch.pause();
 		model.value = transformOut(Array.from(toValue(val)));
@@ -1010,24 +1011,22 @@ function createBreakpoints(_options = {}) {
 	const mdAndUp = shallowRef(initialIndex >= 2);
 	const lgAndUp = shallowRef(initialIndex >= 3);
 	const xlAndUp = shallowRef(initialIndex >= 4);
-	const xxlAndUp = shallowRef(initialIndex >= 5);
 	const smAndDown = shallowRef(initialIndex <= 1);
 	const mdAndDown = shallowRef(initialIndex <= 2);
 	const lgAndDown = shallowRef(initialIndex <= 3);
 	const xlAndDown = shallowRef(initialIndex <= 4);
-	const xxlAndDown = shallowRef(initialIndex <= 5);
 	function update() {
 		if (!IN_BROWSER) return;
 		width.value = window.innerWidth;
 		height.value = window.innerHeight;
 		let current = "xs";
-		for (let i = sorted.length - 1; i >= 0; i--) if (width.value >= sorted[i][1]) {
+		for (let i = sorted.length - 1; i >= 0; i--) if (window.matchMedia(`(min-width: ${sorted[i][1]}px)`).matches) {
 			current = sorted[i][0];
 			break;
 		}
 		name.value = current;
 		const index = names.indexOf(current);
-		isMobile.value = width.value < mb;
+		isMobile.value = /* @__PURE__ */ isNumber(mb) ? !window.matchMedia(`(min-width: ${mb}px)`).matches : index < names.indexOf(mobileBreakpoint);
 		xs.value = index === 0;
 		sm.value = index === 1;
 		md.value = index === 2;
@@ -1038,12 +1037,10 @@ function createBreakpoints(_options = {}) {
 		mdAndUp.value = index >= 2;
 		lgAndUp.value = index >= 3;
 		xlAndUp.value = index >= 4;
-		xxlAndUp.value = index >= 5;
 		smAndDown.value = index <= 1;
 		mdAndDown.value = index <= 2;
 		lgAndDown.value = index <= 3;
 		xlAndDown.value = index <= 4;
-		xxlAndDown.value = index <= 5;
 	}
 	return {
 		breakpoints,
@@ -1062,12 +1059,10 @@ function createBreakpoints(_options = {}) {
 		mdAndUp: readonly(mdAndUp),
 		lgAndUp: readonly(lgAndUp),
 		xlAndUp: readonly(xlAndUp),
-		xxlAndUp: readonly(xxlAndUp),
 		smAndDown: readonly(smAndDown),
 		mdAndDown: readonly(mdAndDown),
 		lgAndDown: readonly(lgAndDown),
 		xlAndDown: readonly(xlAndDown),
-		xxlAndDown: readonly(xxlAndDown),
 		ssr: isSSR,
 		update
 	};
@@ -1081,8 +1076,8 @@ function createBreakpointsFallback(options = {}) {
 		name: readonly(shallowRef("xs")),
 		width: readonly(shallowRef(0)),
 		height: readonly(shallowRef(0)),
-		isMobile: readonly(shallowRef(false)),
-		xs: readonly(shallowRef(false)),
+		isMobile: readonly(shallowRef(true)),
+		xs: readonly(shallowRef(true)),
 		sm: readonly(shallowRef(false)),
 		md: readonly(shallowRef(false)),
 		lg: readonly(shallowRef(false)),
@@ -1092,12 +1087,10 @@ function createBreakpointsFallback(options = {}) {
 		mdAndUp: readonly(shallowRef(false)),
 		lgAndUp: readonly(shallowRef(false)),
 		xlAndUp: readonly(shallowRef(false)),
-		xxlAndUp: readonly(shallowRef(false)),
-		smAndDown: readonly(shallowRef(false)),
-		mdAndDown: readonly(shallowRef(false)),
-		lgAndDown: readonly(shallowRef(false)),
-		xlAndDown: readonly(shallowRef(false)),
-		xxlAndDown: readonly(shallowRef(false)),
+		smAndDown: readonly(shallowRef(true)),
+		mdAndDown: readonly(shallowRef(true)),
+		lgAndDown: readonly(shallowRef(true)),
+		xlAndDown: readonly(shallowRef(true)),
 		ssr: false,
 		update: () => {}
 	};
@@ -2015,6 +2008,132 @@ function useElementIntersection(target, options = {}) {
 	};
 }
 //#endregion
+//#region src/composables/useTimer/index.ts
+/**
+* @module useTimer
+*
+* @remarks
+* A reactive timer composable with pause/resume support.
+*
+* Key features:
+* - Start/stop/pause/resume controls
+* - Reactive remaining time tracking
+* - One-shot (default) or repeating mode
+* - Automatic cleanup on scope disposal
+* - SSR-safe
+*/
+/**
+* Creates a reactive timer with pause/resume support.
+*
+* @param handler Callback invoked when the timer fires.
+* @param options Timer configuration.
+* @returns Timer controls and reactive state.
+*
+* @see https://0.vuetifyjs.com/composables/system/use-timer
+*
+* @example
+* ```ts
+* const timer = useTimer(() => console.log('fired'), { duration: 5000 })
+*
+* timer.start()
+* timer.pause()
+* timer.resume()
+* timer.stop()
+* ```
+*/
+function useTimer(handler, options = {}) {
+	const { duration = 1e3, repeat = false } = options;
+	const remaining = shallowRef(duration);
+	const isActive = shallowRef(false);
+	const isPaused = shallowRef(false);
+	let timeoutId;
+	let trackingId;
+	let startedAt = 0;
+	let budget = duration;
+	function clearTimer() {
+		if (!/* @__PURE__ */ isUndefined(timeoutId)) {
+			globalThis.clearTimeout(timeoutId);
+			timeoutId = void 0;
+		}
+	}
+	function startTracking() {
+		stopTracking();
+		if (!IN_BROWSER) return;
+		trackingId = globalThis.setInterval(() => {
+			if (!isActive.value || isPaused.value) return;
+			const elapsed = Date.now() - startedAt;
+			remaining.value = Math.max(0, budget - elapsed);
+		}, 100);
+	}
+	function stopTracking() {
+		if (!/* @__PURE__ */ isUndefined(trackingId)) {
+			globalThis.clearInterval(trackingId);
+			trackingId = void 0;
+		}
+	}
+	function fire() {
+		clearTimer();
+		stopTracking();
+		handler();
+		if (repeat) begin(duration);
+		else {
+			isActive.value = false;
+			remaining.value = 0;
+		}
+	}
+	function begin(ms) {
+		clearTimer();
+		stopTracking();
+		budget = ms;
+		startedAt = Date.now();
+		remaining.value = ms;
+		isActive.value = true;
+		isPaused.value = false;
+		timeoutId = globalThis.setTimeout(fire, ms);
+		startTracking();
+	}
+	function start() {
+		if (duration < 0) return;
+		begin(duration);
+	}
+	function stop() {
+		clearTimer();
+		stopTracking();
+		isActive.value = false;
+		isPaused.value = false;
+		remaining.value = duration;
+	}
+	function pause() {
+		if (!isActive.value || isPaused.value) return;
+		const elapsed = Date.now() - startedAt;
+		budget = Math.max(0, budget - elapsed);
+		remaining.value = budget;
+		clearTimer();
+		stopTracking();
+		isPaused.value = true;
+	}
+	function resume() {
+		if (!isPaused.value) return;
+		isPaused.value = false;
+		startedAt = Date.now();
+		timeoutId = globalThis.setTimeout(fire, budget);
+		startTracking();
+	}
+	onScopeDispose(() => {
+		clearTimer();
+		stopTracking();
+	}, true);
+	return {
+		start,
+		stop,
+		pause,
+		resume,
+		remaining,
+		isActive,
+		isPaused
+	};
+}
+//#endregion
 //#region src/composables/useLazy/index.ts
 /**
 * @module useLazy
@@ -2078,11 +2197,16 @@ function useElementIntersection(target, options = {}) {
 * ```
 */
 function useLazy(active, options = {}) {
-	const { eager = false } = options;
+	const { eager = false, delay = 0 } = options;
 	const isBooted = shallowRef(false);
 	const hasContent = toRef(() => isBooted.value || toValue(eager) || toValue(active));
+	const timer = delay > 0 ? useTimer(() => {
+		isBooted.value = true;
+	}, { duration: delay }) : void 0;
 	const stop = watch(() => toValue(active), (value) => {
-		if (value) isBooted.value = true;
+		if (value) if (timer) timer.start();
+		else isBooted.value = true;
+		else timer?.stop();
 	}, { immediate: true });
 	function reset() {
 		isBooted.value = false;
@@ -2143,7 +2267,7 @@ function useLazy(active, options = {}) {
 function useMediaQuery(query) {
 	const matches = shallowRef(false);
 	const mediaQueryList = shallowRef(null);
-	const resolvedQuery = computed(() => toValue(query));
+	const resolvedQuery = toRef(() => toValue(query));
 	const hydration = useHydration();
 	let cleanup = null;
 	function update() {
@@ -2935,83 +3059,6 @@ function useNested(namespace = "v0:nested") {
 	return useContext(namespace);
 }
 //#endregion
-//#region src/composables/usePopover/index.ts
-/**
-* @module usePopover
-*
-* @remarks
-* Composable for native popover API behavior with CSS anchor positioning.
-* Manages open/close state, anchor styles, content attributes, and
-* bidirectional sync between reactive state and native popover events.
-*
-* Key features:
-* - Native popover API (showPopover/hidePopover)
-* - CSS anchor positioning (position-area, position-try-fallbacks)
-* - Toggle event sync for native state changes
-* - SSR-safe (no DOM ops outside browser)
-* - Optional external isOpen ref for v-model integration
-*
-* Perfect for building select, combobox, tooltip, and menu components
-* without wrapping the Popover compound component.
-*/
-function usePopover(options = {}) {
-	const { id: _id, positionArea = "bottom", positionTry = "most-width bottom" } = options;
-	const id = _id ?? /* @__PURE__ */ useId$1();
-	const isOpen = options.isOpen ?? shallowRef(false);
-	function open() {
-		isOpen.value = true;
-	}
-	function close() {
-		isOpen.value = false;
-	}
-	function toggle() {
-		isOpen.value = !isOpen.value;
-	}
-	const anchorStyles = toRef(() => ({ anchorName: `--${id}` }));
-	const contentAttrs = toRef(() => ({
-		id,
-		popover: ""
-	}));
-	const contentStyles = toRef(() => ({
-		"position": "fixed",
-		"margin": "unset",
-		"inset-area": positionArea,
-		"position-area": positionArea,
-		"position-anchor": `--${id}`,
-		"position-try-fallbacks": positionTry
-	}));
-	/* v8 ignore start -- browser popover API */
-	function attach(el) {
-		onMounted(() => {
-			const element = toValue(el);
-			if (isOpen.value) element?.showPopover();
-		});
-		watch(isOpen, (value) => {
-			const element = toValue(el);
-			if (!element?.isConnected) return;
-			if (value === element.matches?.(":popover-open")) return;
-			if (value) element.showPopover?.();
-			else element.hidePopover?.();
-		});
-		useEventListener(el, "toggle", (e) => {
-			if (!toValue(el)?.isConnected) return;
-			isOpen.value = e.newState === "open";
-		});
-	}
-	/* v8 ignore stop */
-	return {
-		isOpen,
-		id,
-		open,
-		close,
-		toggle,
-		anchorStyles,
-		contentAttrs,
-		contentStyles,
-		attach
-	};
-}
-//#endregion
 //#region src/composables/createQueue/index.ts
 /**
 * @module createQueue
@@ -3065,21 +3112,22 @@ function createQueue(_options = {}) {
 		...options,
 		events: true
 	});
-	const timeouts = /* @__PURE__ */ new Map();
-	function startTimeout(ticket) {
+	const timers = /* @__PURE__ */ new Map();
+	function createTicketTimer(ticket) {
 		if (/* @__PURE__ */ isUndefined(ticket.timeout) || ticket.timeout < 0 || ticket.isPaused) return;
-		const timeout = setTimeout(() => {
-			timeouts.delete(ticket.id);
+		const timer = useTimer(() => {
+			timers.delete(ticket.id);
 			registry.unregister(ticket.id);
 			resume();
-		}, ticket.timeout);
-		timeouts.set(ticket.id, timeout);
-	}
-	function clearTimeout(id) {
-		const timeout = timeouts.get(id);
-		if (timeout) {
-			globalThis.clearTimeout(timeout);
-			timeouts.delete(id);
+		}, { duration: ticket.timeout });
+		timers.set(ticket.id, timer);
+		timer.start();
+	}
+	function stopTimer(id) {
+		const timer = timers.get(id);
+		if (timer) {
+			timer.stop();
+			timers.delete(id);
 		}
 	}
 	function register(registration = {}) {
@@ -3093,14 +3141,14 @@ function createQueue(_options = {}) {
 			dismiss: () => unregister(id)
 		};
 		const registered = registry.register(ticket);
-		startTimeout(registered);
+		createTicketTimer(registered);
 		return registered;
 	}
 	function unregister(id) {
 		const ticket = /* @__PURE__ */ isUndefined(id) ? registry.seek("first") : registry.get(id);
 		if (!ticket) return void 0;
 		const wasFirst = ticket.index === 0;
-		clearTimeout(ticket.id);
+		stopTimer(ticket.id);
 		registry.unregister(ticket.id);
 		if (wasFirst) resume();
 		return ticket;
@@ -3111,7 +3159,7 @@ function createQueue(_options = {}) {
 			const ticket = registry.get(id);
 			if (!ticket) continue;
 			if (ticket.index === 0) hadFirst = true;
-			clearTimeout(ticket.id);
+			stopTimer(ticket.id);
 		}
 		registry.offboard(ids);
 		if (hadFirst) resume();
@@ -3119,18 +3167,21 @@ function createQueue(_options = {}) {
 	function pause() {
 		const ticket = registry.seek("first");
 		if (!ticket || ticket.isPaused) return void 0;
-		clearTimeout(ticket.id);
+		timers.get(ticket.id)?.pause();
 		return registry.upsert(ticket.id, { isPaused: true });
 	}
 	function resume() {
 		const ticket = registry.seek("first");
 		if (!ticket || ticket.index !== 0 || !ticket.isPaused) return void 0;
 		const updated = registry.upsert(ticket.id, { isPaused: false });
-		startTimeout(updated);
+		const timer = timers.get(updated.id);
+		if (timer) timer.start();
+		else createTicketTimer(updated);
 		return updated;
 	}
 	function clear() {
-		for (const id of timeouts.keys()) clearTimeout(id);
+		for (const timer of timers.values()) timer.stop();
+		timers.clear();
 		registry.clear();
 	}
 	function dispose() {
@@ -3205,6 +3256,679 @@ function useQueue(namespace = "v0:queue") {
 	return useContext(namespace);
 }
 //#endregion
+//#region src/composables/useNotifications/index.ts
+/**
+* @module useNotifications
+* @see https://0.vuetifyjs.com/composables/plugins/use-notifications
+*
+* @remarks
+* Notification management composable built on createRegistry and createQueue.
+* Registry stores the full notification lifecycle (permanent record).
+* Queue manages the display surface (toasts) with FIFO ordering and auto-dismiss.
+*
+* Supports:
+* - Push notifications with severity levels and configurable timeouts
+* - State mutations: read, seen, archived, snoozed
+* - Bulk operations: readAll, archiveAll, clear
+* - Toast queue with pause/resume and auto-dismiss
+* - Adapter integration via event system
+* - Plugin installation via createNotificationsPlugin
+*/
+function createNotifications(options = {}) {
+	const { timeout = 3e3, ...registryOptions } = options;
+	const registry = createRegistry({
+		...registryOptions,
+		events: true,
+		reactive: true
+	});
+	const queue = createQueue({
+		timeout,
+		events: true,
+		reactive: true
+	});
+	registry.on("unregister:ticket", (ticket) => {
+		if (queue.has(ticket.id)) queue.unregister(ticket.id);
+	});
+	/**
+	* Build a full {@link NotificationTicket} from raw input
+	*
+	* @param input The notification input to hydrate.
+	* @returns A partial ticket with timestamps, lifecycle methods, and an ID.
+	* @internal Used by {@link send}, {@link register}, and {@link onboard}.
+	*/
+	function hydrate(input) {
+		const id = input.id ?? /* @__PURE__ */ useId$1();
+		const now = /* @__PURE__ */ new Date();
+		return {
+			...input,
+			id,
+			createdAt: now,
+			readAt: null,
+			seenAt: null,
+			archivedAt: null,
+			snoozedUntil: null,
+			read: () => read(id),
+			unread: () => unread(id),
+			seen: () => seen(id),
+			archive: () => archive(id),
+			unarchive: () => unarchive(id),
+			snooze: (until) => snooze(id, until),
+			wake: () => wake(id),
+			dismiss: () => queue.unregister(id)
+		};
+	}
+	/**
+	* Create a notification and enqueue it for toast display
+	*
+	* @param input The notification input to create.
+	* @returns The hydrated notification ticket.
+	* @remarks Hydrates the input with timestamps and lifecycle methods, registers
+	* it in the registry, adds it to the display queue, and emits
+	* `notification:received`. The ticket auto-dismisses after the configured
+	* timeout unless paused.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#send
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* // Basic toast
+	* notifications.send({ subject: 'Changes saved', severity: 'success' })
+	*
+	* // With custom timeout
+	* const ticket = notifications.send({ subject: 'Connection lost', severity: 'error', timeout: 10000 })
+	*
+	* console.log(ticket.id)        // 'generated-id'
+	* console.log(ticket.createdAt) // Date
+	* console.log(ticket.readAt)    // null
+	*
+	* // Ticket convenience methods
+	* ticket.read()    // marks as read
+	* ticket.dismiss() // removes from toast queue, keeps in registry
+	* ```
+	*/
+	function send(input) {
+		const ticket = registry.register(hydrate(input));
+		queue.register(/* @__PURE__ */ isUndefined(input.timeout) ? { id: ticket.id } : {
+			id: ticket.id,
+			timeout: input.timeout
+		});
+		registry.emit("notification:received", ticket);
+		return ticket;
+	}
+	/**
+	* Register a notification in the registry without adding it to the toast queue
+	*
+	* @param input The notification input to register.
+	* @returns The hydrated notification ticket.
+	* @remarks Overrides the base registry `register` to hydrate the input with
+	* timestamps and lifecycle methods. Use for historical or pre-existing items
+	* that should appear in an inbox but not pop up as toasts.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#register
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* // Register a historical item (appears in inbox, not as toast)
+	* const ticket = notifications.register({ id: 'old-1', subject: 'Deployed v2.1' })
+	*
+	* console.log(ticket.createdAt) // Date
+	* console.log(ticket.readAt)    // null
+	*
+	* // Lifecycle methods work the same as send()
+	* ticket.read()
+	* ticket.archive()
+	* ```
+	*/
+	function register(input) {
+		return registry.register(hydrate(input));
+	}
+	/**
+	* Bulk version of {@link register}
+	*
+	* @param inputs Array of notification inputs to register.
+	* @returns Array of hydrated notification tickets.
+	* @remarks Registers multiple notifications into the registry without toast
+	* display. Wraps all registrations in a single `registry.batch()` call so
+	* reactive updates are deferred until the entire batch completes.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#onboard
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* // Load historical items on mount
+	* const tickets = notifications.onboard([
+	*   { id: 'n1', subject: 'Welcome to the team' },
+	*   { id: 'n2', subject: 'Setup complete', severity: 'success' },
+	* ])
+	*
+	* console.log(tickets.length)              // 2
+	* console.log(notifications.queue.values()) // [] (no toasts)
+	* console.log(notifications.values().length) // 2 (in registry)
+	* ```
+	*/
+	function onboard(inputs) {
+		return registry.batch(() => inputs.map((input) => register(input)));
+	}
+	/**
+	* Mark a notification as read
+	*
+	* @param id The ID of the notification to mark as read.
+	* @remarks Sets `readAt` to the current time and emits `notification:read`.
+	* Adapters listen to this event for outbound sync.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#read
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* const ticket = notifications.send({ subject: 'New message' })
+	*
+	* notifications.read(ticket.id)
+	* console.log(ticket.readAt) // Date
+	*
+	* // Or via ticket convenience method
+	* ticket.read()
+	* ```
+	*/
+	function read(id) {
+		registry.upsert(id, { readAt: /* @__PURE__ */ new Date() }, "notification:read");
+	}
+	/**
+	* Mark a notification as unread
+	*
+	* @param id The ID of the notification to mark as unread.
+	* @remarks Clears `readAt` and emits `notification:unread`.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#unread
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* notifications.unread('notif-1')
+	* ```
+	*/
+	function unread(id) {
+		registry.upsert(id, { readAt: null }, "notification:unread");
+	}
+	/**
+	* Mark a notification as seen
+	*
+	* @param id The ID of the notification to mark as seen.
+	* @remarks Sets `seenAt` to the current time and emits `notification:seen`.
+	* Distinct from read — seen tracks whether the notification appeared in the
+	* user's viewport, while read indicates the user actively engaged with it.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#seen
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* // Mark as seen when visible in inbox viewport
+	* notifications.seen('notif-1')
+	* ```
+	*/
+	function seen(id) {
+		registry.upsert(id, { seenAt: /* @__PURE__ */ new Date() }, "notification:seen");
+	}
+	/**
+	* Archive a notification
+	*
+	* @param id The ID of the notification to archive.
+	* @remarks Sets `archivedAt` to the current time and emits `notification:archived`.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#archive
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* notifications.archive('notif-1')
+	* ```
+	*/
+	function archive(id) {
+		registry.upsert(id, { archivedAt: /* @__PURE__ */ new Date() }, "notification:archived");
+	}
+	/**
+	* Restore an archived notification
+	*
+	* @param id The ID of the notification to unarchive.
+	* @remarks Clears `archivedAt` and emits `notification:unarchived`.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#unarchive
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* notifications.unarchive('notif-1')
+	* ```
+	*/
+	function unarchive(id) {
+		registry.upsert(id, { archivedAt: null }, "notification:unarchived");
+	}
+	/**
+	* Snooze a notification until a given time
+	*
+	* @param id The ID of the notification to snooze.
+	* @param until The time at which the snooze expires.
+	* @remarks Sets `snoozedUntil` and emits `notification:snoozed`. The composable
+	* does not auto-wake — consumers are responsible for calling {@link wake} when
+	* the snooze expires (e.g., via a timer or server push).
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#snooze
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* const tomorrow = new Date(Date.now() + 86_400_000)
+	* notifications.snooze('notif-1', tomorrow)
+	* ```
+	*/
+	function snooze(id, until) {
+		registry.upsert(id, { snoozedUntil: until }, "notification:snoozed");
+	}
+	/**
+	* Cancel a snooze
+	*
+	* @param id The ID of the notification to wake.
+	* @remarks Clears `snoozedUntil` and emits `notification:unsnoozed`.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#wake
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* notifications.wake('notif-1')
+	* ```
+	*/
+	function wake(id) {
+		registry.upsert(id, { snoozedUntil: null }, "notification:unsnoozed");
+	}
+	/**
+	* Mark all unread notifications as read
+	*
+	* @remarks Iterates all notifications and marks unread ones as read in a single
+	* batch. Skips already-read notifications to preserve their original `readAt`
+	* timestamp. Emits `notification:read` for each affected notification.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#readall
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* notifications.send({ subject: 'Message 1' })
+	* notifications.send({ subject: 'Message 2' })
+	*
+	* notifications.readAll()
+	*
+	* console.log(notifications.values().every(t => t.readAt !== null)) // true
+	* ```
+	*/
+	function readAll() {
+		const now = /* @__PURE__ */ new Date();
+		registry.batch(() => {
+			for (const ticket of registry.values()) if (/* @__PURE__ */ isNull(ticket.readAt)) registry.upsert(ticket.id, { readAt: now }, "notification:read");
+		});
+	}
+	/**
+	* Archive all unarchived notifications
+	*
+	* @remarks Iterates all notifications and archives unarchived ones in a single
+	* batch. Skips already-archived notifications to preserve their original
+	* `archivedAt` timestamp. Emits `notification:archived` for each affected notification.
+	*
+	* @see https://0.vuetifyjs.com/composables/plugins/use-notifications#archiveall
+	*
+	* @example
+	* ```ts
+	* import { useNotifications } from '@vuetify/v0'
+	*
+	* const notifications = useNotifications()
+	*
+	* notifications.send({ subject: 'Alert 1' })
+	* notifications.send({ subject: 'Alert 2' })
+	*
+	* notifications.archiveAll()
+	*
+	* console.log(notifications.values().every(t => t.archivedAt !== null)) // true
+	* ```
+	*/
+	function archiveAll() {
+		const now = /* @__PURE__ */ new Date();
+		registry.batch(() => {
+			for (const ticket of registry.values()) if (/* @__PURE__ */ isNull(ticket.archivedAt)) registry.upsert(ticket.id, { archivedAt: now }, "notification:archived");
+		});
+	}
+	return {
+		...registry,
+		send,
+		register,
+		onboard,
+		queue,
+		read,
+		unread,
+		seen,
+		archive,
+		unarchive,
+		snooze,
+		wake,
+		readAll,
+		archiveAll,
+		get size() {
+			return registry.size;
+		}
+	};
+}
+function noop() {}
+const EMPTY = [];
+function createNotificationsFallback() {
+	const stub = {
+		id: "",
+		index: 0,
+		value: 0,
+		valueIsIndex: true,
+		createdAt: /* @__PURE__ */ new Date(0),
+		readAt: null,
+		seenAt: null,
+		archivedAt: null,
+		snoozedUntil: null,
+		read: noop,
+		unread: noop,
+		seen: noop,
+		archive: noop,
+		unarchive: noop,
+		snooze: noop,
+		wake: noop,
+		dismiss: noop,
+		unregister: noop
+	};
+	return {
+		collection: /* @__PURE__ */ new Map(),
+		size: 0,
+		send: () => stub,
+		queue: {
+			collection: /* @__PURE__ */ new Map(),
+			size: 0,
+			register: () => ({}),
+			unregister: () => void 0,
+			has: () => false,
+			get: () => void 0,
+			keys: () => EMPTY,
+			values: () => EMPTY,
+			entries: () => EMPTY,
+			browse: () => void 0,
+			lookup: () => void 0,
+			upsert: () => ({}),
+			seek: () => void 0,
+			move: () => void 0,
+			on: noop,
+			off: noop,
+			emit: noop,
+			dispose: noop,
+			clear: noop,
+			reindex: noop,
+			batch: (fn) => fn(),
+			onboard: () => EMPTY,
+			offboard: noop,
+			pause: () => void 0,
+			resume: () => void 0
+		},
+		read: noop,
+		unread: noop,
+		seen: noop,
+		archive: noop,
+		unarchive: noop,
+		snooze: noop,
+		wake: noop,
+		readAll: noop,
+		archiveAll: noop,
+		clear: noop,
+		has: () => false,
+		get: () => void 0,
+		keys: () => EMPTY,
+		values: () => EMPTY,
+		entries: () => EMPTY,
+		browse: () => void 0,
+		lookup: () => void 0,
+		upsert: () => stub,
+		register: () => stub,
+		unregister: noop,
+		reindex: noop,
+		move: () => void 0,
+		seek: () => void 0,
+		on: noop,
+		off: noop,
+		emit: noop,
+		dispose: noop,
+		batch: (fn) => fn(),
+		onboard: () => EMPTY,
+		offboard: noop
+	};
+}
+/**
+* Notification management with registry, event system, and optional adapters.
+*
+* @see https://0.vuetifyjs.com/composables/plugins/use-notifications
+*
+* @example
+* ```ts
+* import { createNotificationsPlugin, useNotifications } from '@vuetify/v0'
+*
+* // Install as plugin
+* app.use(createNotificationsPlugin())
+*
+* // Use in components
+* const notifications = useNotifications()
+* notifications.send({ subject: 'Saved', severity: 'success' })
+* ```
+*/
+const [createNotificationsContext, createNotificationsPlugin, useNotifications] = createPluginContext("v0:notifications", (options) => createNotifications(options), {
+	fallback: () => createNotificationsFallback(),
+	setup: (context, app, options) => {
+		app.onUnmount(() => {
+			context.dispose();
+			context.queue.dispose();
+		});
+		const { adapter } = options;
+		if (!adapter) return;
+		adapter.setup({
+			send: context.send,
+			register: context.register,
+			on: context.on,
+			off: context.off
+		});
+		if (/* @__PURE__ */ isFunction(adapter.dispose)) app.onUnmount(() => adapter.dispose());
+	}
+});
+//#endregion
+//#region src/composables/usePopover/index.ts
+/**
+* @module usePopover
+*
+* @remarks
+* Composable for native popover API behavior with CSS anchor positioning.
+* Manages open/close state, anchor styles, content attributes, and
+* bidirectional sync between reactive state and native popover events.
+*
+* Key features:
+* - Native popover API (showPopover/hidePopover)
+* - CSS anchor positioning (position-area, position-try-fallbacks)
+* - Toggle event sync for native state changes
+* - SSR-safe (no DOM ops outside browser)
+* - Optional external isOpen ref for v-model integration
+*
+* Perfect for building select, combobox, tooltip, and menu components
+* without wrapping the Popover compound component.
+*/
+function usePopover(options = {}) {
+	const { id: _id, positionArea = "bottom", positionTry = "most-width bottom", showDelay = 0, hideDelay = 0 } = options;
+	const id = _id ?? /* @__PURE__ */ useId$1();
+	const isOpen = options.isOpen ?? shallowRef(false);
+	const showTimer = showDelay > 0 ? useTimer(() => {
+		isOpen.value = true;
+	}, { duration: showDelay }) : void 0;
+	const hideTimer = hideDelay > 0 ? useTimer(() => {
+		isOpen.value = false;
+	}, { duration: hideDelay }) : void 0;
+	function open() {
+		hideTimer?.stop();
+		if (showTimer) showTimer.start();
+		else isOpen.value = true;
+	}
+	function close() {
+		showTimer?.stop();
+		if (hideTimer) hideTimer.start();
+		else isOpen.value = false;
+	}
+	function toggle() {
+		if (isOpen.value) close();
+		else open();
+	}
+	const anchorStyles = toRef(() => ({ anchorName: `--${id}` }));
+	const contentAttrs = toRef(() => ({
+		id,
+		popover: ""
+	}));
+	const contentStyles = toRef(() => ({
+		"position": "fixed",
+		"margin": "unset",
+		"inset-area": positionArea,
+		"position-area": positionArea,
+		"position-anchor": `--${id}`,
+		"position-try-fallbacks": positionTry
+	}));
+	/* v8 ignore start -- browser popover API */
+	function attach(el) {
+		onMounted(() => {
+			const element = toValue(el);
+			if (isOpen.value) element?.showPopover();
+		});
+		watch(isOpen, (value) => {
+			const element = toValue(el);
+			if (!element?.isConnected) return;
+			if (value === element.matches?.(":popover-open")) return;
+			if (value) element.showPopover?.();
+			else element.hidePopover?.();
+		});
+		useEventListener(el, "toggle", (e) => {
+			if (!toValue(el)?.isConnected) return;
+			isOpen.value = e.newState === "open";
+		});
+	}
+	/* v8 ignore stop */
+	return {
+		isOpen,
+		id,
+		open,
+		close,
+		toggle,
+		anchorStyles,
+		contentAttrs,
+		contentStyles,
+		attach
+	};
+}
+//#endregion
+//#region src/composables/useRaf/index.ts
+/**
+* @module useRaf
+*
+* @see https://0.vuetifyjs.com/composables/system/use-raf
+*
+* @remarks
+* Scope-disposed safe requestAnimationFrame composable.
+*
+* Key features:
+* - Cancel-then-request pattern (deduplicates rapid calls)
+* - Automatic cleanup on scope disposal
+* - SSR-safe (no-op in non-browser environments)
+* - Callable function with cancel method
+*
+* Perfect for throttling updates to the next animation frame.
+*/
+/**
+* Scope-disposed safe requestAnimationFrame.
+*
+* @param callback Function to call on animation frame.
+* @returns Callable that requests frame (canceling pending), with cancel method.
+*
+* @see https://0.vuetifyjs.com/composables/system/use-raf
+*
+* @example
+* ```ts
+* // Basic usage
+* const update = useRaf((timestamp) => {
+*   // Runs on next animation frame
+* })
+*
+* update() // Request frame
+* update() // Cancels previous, requests new (deduplicated)
+*
+* // Manual cancel
+* update.cancel()
+*
+* // Check if pending
+* if (update.isActive.value) { ... }
+* ```
+*/
+function useRaf(callback) {
+	const id = shallowRef();
+	const isActive = toRef(() => !/* @__PURE__ */ isUndefined(id.value));
+	function cancel() {
+		if (!/* @__PURE__ */ isUndefined(id.value)) {
+			cancelAnimationFrame(id.value);
+			id.value = void 0;
+		}
+	}
+	function request() {
+		if (!IN_BROWSER) return;
+		cancel();
+		id.value = requestAnimationFrame((timestamp) => {
+			id.value = void 0;
+			callback(timestamp);
+		});
+	}
+	onScopeDispose(cancel, true);
+	return Object.assign(request, {
+		cancel,
+		isActive
+	});
+}
+//#endregion
 //#region src/composables/createFocusTraversal/index.ts
 /**
 * @module createFocusTraversal
@@ -3653,6 +4377,9 @@ function createSlider(options = {}) {
 	function ceil(index) {
 		set(index, max);
 	}
+	function onboard(registrations) {
+		return model.batch(() => registrations.map((r) => register(r)));
+	}
 	return {
 		...model,
 		values,
@@ -3669,6 +4396,7 @@ function createSlider(options = {}) {
 		orientation,
 		inverted,
 		register,
+		onboard,
 		snap,
 		fromValue,
 		fromPercent,
@@ -3748,12 +4476,12 @@ function createStack(_options = {}) {
 		const id = input.id ?? /* @__PURE__ */ useId$1();
 		const blocking = input.blocking ?? false;
 		const onDismiss = input.onDismiss;
-		const zIndex = computed(() => {
+		const zIndex = toRef(() => {
 			const position = ids().indexOf(id);
 			if (position === -1) return baseZIndex;
 			return baseZIndex + position * increment;
 		});
-		const globalTop = computed(() => {
+		const globalTop = toRef(() => {
 			const list = ids();
 			if (list.length === 0) return false;
 			return list.at(-1) === id;
@@ -4326,6 +5054,12 @@ function createTimeline(_options = {}) {
 	function redo() {
 		if (stack.length === 0) return void 0;
 		const item = stack.pop();
+		if (registry.size >= size) {
+			const oldest = registry.seek("first");
+			if (overflow.length === size) overflow.shift();
+			overflow.push(oldest);
+			registry.unregister(oldest.id);
+		}
 		const ticket = registry.register(item);
 		registry.reindex();
 		return ticket;
@@ -5381,4 +6115,4 @@ function useClickOutside(target, handler, options = {}) {
 	};
 }
 //#endregion
-export { useForm as $, useRtl as A, multipleOpenStrategy as B, createStackPlugin as C, useBreadcrumbs as Ct, createRtlContext as D, createRtl as E, useQueue as F, usePrefersDark as G, useMutationObserver as H, usePopover as I, useElementIntersection as J, usePrefersReducedMotion as K, createNested as L, useRovingFocus as M, createQueue as N, createRtlFallback as O, createQueueContext as P, createFormContext as Q, createNestedContext as R, createStackContext as S, createBreadcrumbsContext as St, createSlider as T, useMediaQuery as U, singleOpenStrategy as V, usePrefersContrast as W, useHotkey as X, useIntersectionObserver as Y, createForm as Z, useStorage as _, createHydration as _t, useVirtualFocus as a, createBreakpointsContext as at, useStep as b, useHydration as bt, useVirtual as c, toReactive as ct, createTimeline as d, createOverflowContext as dt, createDate as et, createTimelineContext as f, useOverflow as ft, createStoragePlugin as g, createFallbackHydration as gt, createStorageContext as h, toElement as ht, useWindowEventListener as i, createBreakpoints as it, Vuetify0RtlAdapter as j, createRtlPlugin as k, useToggleScope as l, useProxyModel as lt, createStorage as m, useResizeObserver as mt, useDocumentEventListener as n, createDatePlugin as nt, createVirtual as o, createBreakpointsPlugin as ot, useTimeline as p, useElementSize as pt, useLazy as q, useEventListener as r, useDate as rt, createVirtualContext as s, useBreakpoints as st, useClickOutside as t, createDateContext as tt, createValidation as u, createOverflow as ut, createStep as v, createHydrationContext as vt, useStack as w, createStack as x, createBreadcrumbs as xt, createStepContext as y, createHydrationPlugin as yt, useNested as z };
+export { useTimer as $, useRtl as A, createQueueContext as B, createStackPlugin as C, createHydration as Ct, createRtlContext as D, createBreadcrumbs as Dt, createRtl as E, useHydration as Et, createNotifications as F, multipleOpenStrategy as G, createNested as H, createNotificationsContext as I, useMediaQuery as J, singleOpenStrategy as K, createNotificationsPlugin as L, useRovingFocus as M, useRaf as N, createRtlFallback as O, createBreadcrumbsContext as Ot, usePopover as P, useLazy as Q, useNotifications as R, createStackContext as S, createFallbackHydration as St, createSlider as T, createHydrationPlugin as Tt, createNestedContext as U, useQueue as V, useNested as W, usePrefersDark as X, usePrefersContrast as Y, usePrefersReducedMotion as Z, useStorage as _, createOverflowContext as _t, useVirtualFocus as a, useForm as at, useStep as b, useResizeObserver as bt, useVirtual as c, createDatePlugin as ct, createTimeline as d, createBreakpointsContext as dt, useElementIntersection as et, createTimelineContext as f, createBreakpointsPlugin as ft, createStoragePlugin as g, createOverflow as gt, createStorageContext as h, useProxyModel as ht, useWindowEventListener as i, createFormContext as it, Vuetify0RtlAdapter as j, createRtlPlugin as k, useBreadcrumbs as kt, useToggleScope as l, useDate as lt, createStorage as m, toReactive as mt, useDocumentEventListener as n, useHotkey as nt, createVirtual as o, createDate as ot, useTimeline as p, useBreakpoints as pt, useMutationObserver as q, useEventListener as r, createForm as rt, createVirtualContext as s, createDateContext as st, useClickOutside as t, useIntersectionObserver as tt, createValidation as u, createBreakpoints as ut, createStep as v, useOverflow as vt, useStack as w, createHydrationContext as wt, createStack as x, toElement as xt, createStepContext as y, useElementSize as yt, createQueue as z };