@vuetify/v0 0.0.16 → 0.0.20

package/dist/browser/index.js

@@ -1,4 +1,4 @@
-import { computed, createBlock, createCommentVNode, createPropsRestProxy, createTextVNode, defineComponent, effectScope, getCurrentInstance, guardReactiveProps, inject, isRef, mergeModels, mergeProps, normalizeProps, onBeforeUnmount, onMounted, onScopeDispose, onUnmounted, openBlock, provide, reactive, readonly, ref, renderSlot, resolveDynamicComponent, shallowReactive, shallowReadonly, shallowRef, toDisplayString, toRef, toValue, unref, useAttrs, useId, useModel, useTemplateRef, vShow, watch, withCtx, withDirectives } from "vue";
+import { computed, createBlock, createCommentVNode, createPropsRestProxy, createTextVNode, defineComponent, effectScope, getCurrentInstance, guardReactiveProps, inject, isRef, mergeModels, mergeProps, normalizeProps, onBeforeUnmount, onMounted, onScopeDispose, onUnmounted, openBlock, provide, reactive, readonly, ref, renderSlot, resolveDynamicComponent, shallowReactive, shallowReadonly, shallowRef, toDisplayString, toRef, toValue, unref, useAttrs, useId, useModel, useTemplateRef, vShow, watch, watchEffect, withCtx, withDirectives } from "vue";
 
 //#region src/constants/htmlElements.ts
 const selfClosingTags = [
@@ -78,54 +78,263 @@ function isSelfClosingTag(tag) {
 
 //#endregion
 //#region src/utilities/helpers.ts
+/**
+* Checks if a value is a function
+*
+* @param item The value to check
+* @returns True if the value is a function
+*
+* @example
+* ```ts
+* isFunction(() => {})  // true
+* isFunction('string')  // false
+* ```
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isFunction(item) {
 	return typeof item === "function";
 }
+/**
+* Checks if a value is a string
+*
+* @param item The value to check
+* @returns True if the value is a string
+*
+* @example
+* ```ts
+* isString('hello')  // true
+* isString(123)      // false
+* ```
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isString(item) {
 	return typeof item === "string";
 }
+/**
+* Checks if a value is a number
+*
+* @param item The value to check
+* @returns True if the value is a number (including NaN)
+*
+* @example
+* ```ts
+* isNumber(123)       // true
+* isNumber(NaN)       // true
+* isNumber('123')     // false
+* ```
+*
+* @see {@link isNaN} to check for NaN specifically
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isNumber(item) {
 	return typeof item === "number";
 }
+/**
+* Checks if a value is a boolean
+*
+* @param item The value to check
+* @returns True if the value is a boolean
+*
+* @example
+* ```ts
+* isBoolean(true)   // true
+* isBoolean(false)  // true
+* isBoolean(0)      // false
+* ```
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isBoolean(item) {
 	return typeof item === "boolean";
 }
+/**
+* Checks if a value is a plain object (excludes null and arrays)
+*
+* @param item The value to check
+* @returns True if the value is a plain object
+*
+* @remarks
+* Returns false for null and arrays, even though `typeof null === 'object'`
+* and `typeof [] === 'object'` in JavaScript.
+*
+* @example
+* ```ts
+* isObject({})        // true
+* isObject({ a: 1 })  // true
+* isObject(null)      // false
+* isObject([])        // false
+* ```
+*
+* @see {@link isArray} to check for arrays
+* @see {@link isNull} to check for null
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isObject(item) {
 	return typeof item === "object" && item !== null && !Array.isArray(item);
 }
+/**
+* Checks if a value is an array
+*
+* @param item The value to check
+* @returns True if the value is an array
+*
+* @example
+* ```ts
+* isArray([])        // true
+* isArray([1, 2, 3]) // true
+* isArray('string')  // false
+* ```
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isArray(item) {
 	return Array.isArray(item);
 }
+/**
+* Checks if a value is null
+*
+* @param item The value to check
+* @returns True if the value is null
+*
+* @example
+* ```ts
+* isNull(null)      // true
+* isNull(undefined) // false
+* ```
+*
+* @see {@link isUndefined} to check for undefined
+* @see {@link isNullOrUndefined} to check for either
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isNull(item) {
 	return item === null;
 }
+/**
+* Checks if a value is null or undefined
+*
+* @param item The value to check
+* @returns True if the value is null or undefined
+*
+* @remarks
+* Uses loose equality (`== null`) which matches both null and undefined.
+*
+* @example
+* ```ts
+* isNullOrUndefined(null)      // true
+* isNullOrUndefined(undefined) // true
+* isNullOrUndefined(0)         // false
+* isNullOrUndefined('')        // false
+* ```
+*
+* @see {@link isNull} to check for null only
+* @see {@link isUndefined} to check for undefined only
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isNullOrUndefined(item) {
 	return item == null;
 }
+/**
+* Checks if a value is undefined
+*
+* @param item The value to check
+* @returns True if the value is undefined
+*
+* @example
+* ```ts
+* isUndefined(undefined) // true
+* isUndefined(null)      // false
+* ```
+*
+* @see {@link isNull} to check for null
+* @see {@link isNullOrUndefined} to check for either
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isUndefined(item) {
 	return item === void 0;
 }
+/**
+* Checks if a value is a primitive (string, number, or boolean)
+*
+* @param item The value to check
+* @returns True if the value is a string, number, or boolean
+*
+* @example
+* ```ts
+* isPrimitive('hello') // true
+* isPrimitive(123)     // true
+* isPrimitive(true)    // true
+* isPrimitive({})      // false
+* isPrimitive(null)    // false
+* ```
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isPrimitive(item) {
 	return typeof item === "string" || typeof item === "number" || typeof item === "boolean";
 }
+/**
+* Checks if a value is a symbol
+*
+* @param item The value to check
+* @returns True if the value is a symbol
+*
+* @example
+* ```ts
+* isSymbol(Symbol('test')) // true
+* isSymbol('symbol')       // false
+* ```
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isSymbol(item) {
 	return typeof item === "symbol";
 }
+/**
+* Checks if a value is NaN (Not a Number)
+*
+* @param item The value to check
+* @returns True if the value is NaN
+*
+* @remarks
+* Uses `Number.isNaN()` which only returns true for the actual NaN value,
+* unlike the global `isNaN()` which coerces the argument to a number first.
+*
+* @example
+* ```ts
+* isNaN(NaN)         // true
+* isNaN(123)         // false
+* isNaN('hello')     // false (unlike global isNaN)
+* isNaN(undefined)   // false (unlike global isNaN)
+* ```
+*
+* @see {@link isNumber} to check if a value is a number type
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function isNaN(item) {
 	return /* @__PURE__ */ isNumber(item) && Number.isNaN(item);
 }
+/**
+* Deeply merges source objects into a target object
+*
+* @param target The target object to merge into (will be mutated)
+* @param sources One or more source objects to merge from
+* @returns The mutated target object
+*
+* @remarks
+* - Mutates the target object in place
+* - Nested objects are recursively merged
+* - Arrays are replaced, not merged
+* - Primitives from sources overwrite target values
+*
+* @example
+* ```ts
+* const target = { a: 1, b: { c: 2 } }
+* mergeDeep(target, { b: { d: 3 } })
+* // target is now { a: 1, b: { c: 2, d: 3 } }
+*
+* // Multiple sources
+* mergeDeep({}, { a: 1 }, { b: 2 }) // { a: 1, b: 2 }
+*
+* // Arrays are replaced
+* mergeDeep({ arr: [1, 2] }, { arr: [3] }) // { arr: [3] }
+* ```
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function mergeDeep(target, ...sources) {
 	if (sources.length === 0) return target;
@@ -141,6 +350,21 @@ function mergeDeep(target, ...sources) {
 	}
 	return /* @__PURE__ */ mergeDeep(target, ...sources);
 }
+/**
+* Generates a random 7-character alphanumeric ID
+*
+* @returns A random string of 7 characters (a-z, 0-9)
+*
+* @remarks
+* Uses `Math.random()` converted to base-36. Not cryptographically secure.
+* Suitable for unique keys in UI components, not for security purposes.
+*
+* @example
+* ```ts
+* genId() // 'k7x9m2p'
+* genId() // 'a3b8c1d'
+* ```
+*/
 /* @__NO_SIDE_EFFECTS__ */
 function genId() {
 	return Math.random().toString(36).slice(2, 9);
@@ -216,7 +440,7 @@ function debounce(fn, delay) {
 
 //#endregion
 //#region src/components/Atom/Atom.vue
-const _sfc_main$26 = /* @__PURE__ */ defineComponent({
+const _sfc_main$27 = /* @__PURE__ */ defineComponent({
 	name: "Atom",
 	__name: "Atom",
 	props: {
@@ -247,27 +471,11 @@ const _sfc_main$26 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var Atom_default = _sfc_main$26;
+var Atom_default = _sfc_main$27;
 
 //#endregion
 //#region src/composables/createContext/index.ts
 /**
-* @module createContext
-*
-* @see https://0.vuetifyjs.com/composables/foundation/create-context
-*
-* @remarks
-* Factory for creating type-safe Vue dependency injection contexts.
-*
-* Provides a wrapper around Vue's provide/inject that throws errors when context is not found,
-* eliminating silent failures and improving developer experience. Supports both app-level and
-* component-level provision.
-*
-* Supports two modes:
-* - **Static key**: `createContext('my-key')` - key is fixed at creation time
-* - **Dynamic key**: `createContext()` or `createContext({ suffix: 'item' })` - key provided at runtime
-*/
-/**
 * Injects a context provided by an ancestor component.
 *
 * @param key The key of the context to inject.
@@ -513,7 +721,7 @@ const SUPPORTS_MATCH_MEDIA = IN_BROWSER && "matchMedia" in window && typeof wind
 const SUPPORTS_OBSERVER = IN_BROWSER && "ResizeObserver" in window;
 const SUPPORTS_INTERSECTION_OBSERVER = IN_BROWSER && "IntersectionObserver" in window;
 const SUPPORTS_MUTATION_OBSERVER = IN_BROWSER && "MutationObserver" in window;
-const version = "0.0.16";
+const version = "0.0.20";
 const __LOGGER_ENABLED__ = false;
 
 //#endregion
@@ -700,12 +908,12 @@ function createFallbackLogger(namespace = "v0:logger") {
 		return `[${namespace} ${type}] ${message}`;
 	}
 	return {
-		debug: (message, ...args) => console.log(format(message, "debug"), ...args),
-		info: (message, ...args) => console.log(format(message, "info"), ...args),
-		warn: (message, ...args) => console.log(format(message, "warn"), ...args),
-		error: (message, ...args) => console.log(format(message, "error"), ...args),
-		trace: (message, ...args) => console.log(format(message, "trace"), ...args),
-		fatal: (message, ...args) => console.log(format(message, "fatal"), ...args),
+		debug: (message, ...args) => console.debug(format(message, "debug"), ...args),
+		info: (message, ...args) => console.info(format(message, "info"), ...args),
+		warn: (message, ...args) => console.warn(format(message, "warn"), ...args),
+		error: (message, ...args) => console.error(format(message, "error"), ...args),
+		trace: (message, ...args) => console.trace(format(message, "trace"), ...args),
+		fatal: (message, ...args) => console.error(format(message, "fatal"), ...args),
 		level: () => {},
 		current: () => "info",
 		enabled: () => true,
@@ -733,7 +941,7 @@ function createFallbackLogger(namespace = "v0:logger") {
 * ```
 */
 function createLoggerContext(_options = {}) {
-	const { namespace = "v0:logger",...options } = _options;
+	const { namespace = "v0:logger", ...options } = _options;
 	const [useLoggerContext, _provideLoggerContext] = createContext(namespace);
 	const context = createLogger(options);
 	function provideLoggerContext(_context = context, app) {
@@ -768,7 +976,7 @@ function createLoggerContext(_options = {}) {
 * ```
 */
 function createLoggerPlugin(_options = {}) {
-	const { namespace = "v0:logger",...options } = _options;
+	const { namespace = "v0:logger", ...options } = _options;
 	const [, provideLoggerContext, context] = createLoggerContext({
 		...options,
 		namespace
@@ -815,21 +1023,6 @@ function useLogger(namespace = "v0:logger") {
 //#endregion
 //#region src/composables/useRegistry/index.ts
 /**
-* @module useRegistry
-*
-* @remarks
-* A foundational composable for managing collections of items (tickets) with:
-* - Unique ID-based access
-* - Index-based ordering
-* - Value-based reverse lookup
-* - Automatic reindexing
-* - Optional event emission
-* - Performance-optimized caching
-*
-* The registry serves as the base for many other composables in the system,
-* including useSelection, useForm, useTimeline, and more.
-*/
-/**
 * Creates a new registry instance.
 *
 * @param options The options for the registry instance.
@@ -863,6 +1056,8 @@ function useRegistry(options) {
 	let indexDependentCount = 0;
 	let needsReindex = false;
 	let minDirtyIndex = Infinity;
+	let batching = false;
+	let pendingEmits = [];
 	function emit(event, data = void 0) {
 		if (!events) return;
 		const cbs = listeners.get(event);
@@ -871,17 +1066,21 @@ function useRegistry(options) {
 	}
 	function on(event, cb) {
 		if (!events) {
-			logger.warn(`Attempted to register event listener for "${event}" but events are disabled.`);
+			logger.warn(`Events are disabled. Initialize with \`useRegistry({ events: true })\` to enable.`);
 			return;
 		}
 		if (!listeners.has(event)) listeners.set(event, /* @__PURE__ */ new Set());
 		listeners.get(event).add(cb);
 	}
 	function off(event, cb) {
+		if (!events) {
+			logger.warn(`Events are disabled. Initialize with \`useRegistry({ events: true })\` to enable.`);
+			return;
+		}
 		listeners.get(event)?.delete(cb);
 	}
 	function dispose() {
-		if (listeners.size > 0) listeners.clear();
+		listeners.clear();
 		clear();
 	}
 	function get(id) {
@@ -938,24 +1137,19 @@ function useRegistry(options) {
 	function assign(value, id) {
 		const bucket = catalog.get(value);
 		if (bucket) {
-			if (/* @__PURE__ */ isArray(bucket)) {
-				if (!bucket.includes(id)) bucket.push(id);
-			} else if (bucket !== id) catalog.set(value, [bucket, id]);
-		} else catalog.set(value, id);
+			if (!bucket.includes(id)) bucket.push(id);
+		} else catalog.set(value, [id]);
 	}
 	function unassign(value, id) {
 		const bucket = catalog.get(value);
 		if (!bucket) return;
-		if (/* @__PURE__ */ isArray(bucket)) {
-			const next = bucket.filter((v) => v !== id);
-			if (next.length === 0) catalog.delete(value);
-			else if (next.length === 1) catalog.set(value, next[0]);
-			else catalog.set(value, next);
-		} else if (bucket === id) catalog.delete(value);
+		const next = bucket.filter((v) => v !== id);
+		if (next.length === 0) catalog.delete(value);
+		else catalog.set(value, next);
 	}
 	function keys() {
 		const cached = cache.get("keys");
-		if (cached != void 0) return cached;
+		if (!/* @__PURE__ */ isUndefined(cached)) return cached;
 		const keys$1 = Array.from(collection.keys());
 		cache.set("keys", keys$1);
 		return keys$1;
@@ -975,9 +1169,9 @@ function useRegistry(options) {
 		return entries$1;
 	}
 	function clear() {
-		if (collection.size > 0) collection.clear();
-		if (catalog.size > 0) catalog.clear();
-		if (directory.size > 0) directory.clear();
+		collection.clear();
+		catalog.clear();
+		directory.clear();
 		invalidate();
 		indexDependentCount = 0;
 		needsReindex = false;
@@ -985,13 +1179,35 @@ function useRegistry(options) {
 		emit("clear:registry");
 	}
 	function invalidate() {
-		if (cache.size > 0) cache.clear();
+		if (batching) return;
+		cache.clear();
+	}
+	function queueEmit(event, data) {
+		if (batching) pendingEmits.push({
+			event,
+			data
+		});
+		else emit(event, data);
+	}
+	function batch(fn) {
+		if (batching) return fn();
+		batching = true;
+		pendingEmits = [];
+		try {
+			const result = fn();
+			cache.clear();
+			for (const { event, data } of pendingEmits) emit(event, data);
+			return result;
+		} finally {
+			batching = false;
+			pendingEmits = [];
+		}
 	}
 	function reindex() {
 		const startIndex = minDirtyIndex === Infinity ? 0 : minDirtyIndex;
 		if (startIndex === 0) {
-			if (catalog.size > 0) catalog.clear();
-			if (directory.size > 0) directory.clear();
+			catalog.clear();
+			directory.clear();
 		}
 		invalidate();
 		let index = 0;
@@ -1018,7 +1234,7 @@ function useRegistry(options) {
 		const size = collection.size;
 		const id = registration.id ?? /* @__PURE__ */ genId();
 		if (has(id)) {
-			logger.warn(`Ticket with id "${id}" already exists in the registry. Skipping registration.`);
+			logger.warn(`Ticket "${id}" already exists. Use \`upsert()\` to update or check \`has()\` before registering.`);
 			return get(id);
 		}
 		const valueIsUndefined = /* @__PURE__ */ isUndefined(registration.value);
@@ -1037,7 +1253,7 @@ function useRegistry(options) {
 		directory.set(ticket.index, ticket.id);
 		assign(ticket.value, ticket.id);
 		invalidate();
-		emit("register:ticket", ticket);
+		queueEmit("register:ticket", ticket);
 		return ticket;
 	}
 	function unregister(id) {
@@ -1047,15 +1263,12 @@ function useRegistry(options) {
 		collection.delete(ticket.id);
 		directory.delete(ticket.index);
 		unassign(ticket.value, ticket.id);
-		invalidate();
+		const willReindex = indexDependentCount > 0 && ticket.index < collection.size;
+		if (!willReindex) invalidate();
 		emit("unregister:ticket", ticket);
-		if (indexDependentCount > 0 && ticket.index < collection.size) {
-			minDirtyIndex = Math.min(minDirtyIndex, ticket.index);
-			reindex();
-		} else {
-			minDirtyIndex = Math.min(minDirtyIndex, ticket.index);
-			needsReindex = true;
-		}
+		minDirtyIndex = Math.min(minDirtyIndex, ticket.index);
+		if (willReindex) reindex();
+		else needsReindex = true;
 	}
 	function offboard(ids) {
 		const removed = [];
@@ -1071,12 +1284,16 @@ function useRegistry(options) {
 		}
 		if (removed.length === 0) return;
 		invalidate();
-		if (events) for (const ticket of removed) emit("unregister:ticket", ticket);
+		for (const ticket of removed) queueEmit("unregister:ticket", ticket);
 		needsReindex = true;
 	}
 	function seek(direction = "first", from, predicate) {
 		if (collection.size === 0) return void 0;
 		if (needsReindex) reindex();
+		if (!predicate && /* @__PURE__ */ isUndefined(from)) {
+			const tickets$1 = values();
+			return direction === "first" ? tickets$1[0] : tickets$1.at(-1);
+		}
 		const tickets = values();
 		const index = /* @__PURE__ */ isUndefined(from) ? void 0 : Math.max(0, Math.min(from, tickets.length - 1));
 		if (direction === "last") {
@@ -1112,8 +1329,9 @@ function useRegistry(options) {
 		unregister,
 		reindex,
 		seek,
+		batch,
 		onboard(registrations) {
-			return registrations.map((registration) => register(registration));
+			return batch(() => registrations.map((registration) => register(registration)));
 		},
 		offboard,
 		get size() {
@@ -1124,8 +1342,7 @@ function useRegistry(options) {
 /**
 * Creates a new registry context.
 *
-* @param namespace The namespace for the registry context.
-* @param options The options for the registry context.
+* @param options The options for the registry context, including `namespace` (defaults to `'v0:registry'`) and `events`.
 * @template Z The type of registry ticket that extends RegistryTicket. Use this to add custom properties to tickets.
 * @template E The type of registry context that extends RegistryContext<Z>. Use this when extending the registry with additional methods.
 * @returns A new registry context.
@@ -1151,7 +1368,7 @@ function useRegistry(options) {
 * ```
 */
 function createRegistryContext(_options = {}) {
-	const { namespace = "v0:registry",...options } = _options;
+	const { namespace = "v0:registry", ...options } = _options;
 	const [useRegistryContext, _provideRegistryContext] = createContext(namespace);
 	const context = useRegistry(options);
 	function provideRegistryContext(_context = context, app) {
@@ -1163,21 +1380,6 @@ function createRegistryContext(_options = {}) {
 //#endregion
 //#region src/composables/useSelection/index.ts
 /**
-* @module useSelection
-*
-* @remarks
-* Base composable for managing selected items in a collection with Set-based tracking.
-*
-* Key features:
-* - Set-based selectedIds for O(1) selection checks
-* - Mandatory selection mode (prevents deselecting last item)
-* - Auto-enrollment option (selects non-disabled items on register)
-* - Disabled item filtering
-* - Computed selectedItems and selectedValues Sets
-*
-* Extends useRegistry and serves as the base for useSingle, useGroup, useStep, and useFeatures.
-*/
-/**
 * Creates a new selection instance for managing multiple selected items.
 *
 * Extends `useRegistry` with selection tracking via a reactive `Set` of selected IDs.
@@ -1224,14 +1426,14 @@ function createRegistryContext(_options = {}) {
 * ```
 */
 function createSelection(_options = {}) {
-	const { disabled = false, enroll = false, mandatory = false, multiple = false,...options } = _options;
+	const { disabled = false, enroll = false, mandatory = false, multiple = false, ...options } = _options;
 	const registry = useRegistry(options);
 	const selectedIds = shallowReactive(/* @__PURE__ */ new Set());
 	const selectedItems = computed(() => {
-		return new Set(Array.from(selectedIds).map((id) => registry.get(id)));
+		return new Set(Array.from(selectedIds).map((id) => registry.get(id)).filter((item) => !/* @__PURE__ */ isUndefined(item)));
 	});
 	const selectedValues = computed(() => {
-		return new Set(Array.from(selectedItems.value).map((item) => item?.value));
+		return new Set(Array.from(selectedItems.value).map((item) => item.value));
 	});
 	function seek(direction = "first", from) {
 		return registry.seek(direction, from, (ticket) => !toValue(ticket.disabled));
@@ -1242,16 +1444,19 @@ function createSelection(_options = {}) {
 		if (ticket) select(ticket.id);
 	}
 	function select(id) {
+		if (toValue(disabled)) return;
 		const item = registry.get(id);
 		if (!item || toValue(item.disabled)) return;
 		if (!multiple) selectedIds.clear();
 		selectedIds.add(id);
 	}
 	function unselect(id) {
+		if (toValue(disabled)) return;
 		if (mandatory && selectedIds.size === 1) return;
 		selectedIds.delete(id);
 	}
 	function toggle(id) {
+		if (toValue(disabled)) return;
 		if (selected(id)) unselect(id);
 		else select(id);
 	}
@@ -1270,7 +1475,7 @@ function createSelection(_options = {}) {
 			id
 		};
 		const ticket = registry.register(item);
-		if (enroll && !toValue(item.disabled)) selectedIds.add(ticket.id);
+		if (enroll && !toValue(disabled) && !toValue(item.disabled)) selectedIds.add(ticket.id);
 		if (mandatory === "force") mandate();
 		return ticket;
 	}
@@ -1341,7 +1546,7 @@ function createSelection(_options = {}) {
 * ```
 */
 function createSelectionContext(_options = {}) {
-	const { namespace = "v0:selection",...options } = _options;
+	const { namespace = "v0:selection", ...options } = _options;
 	const [useSelectionContext, _provideSelectionContext] = createContext(namespace);
 	const context = createSelection(options);
 	function provideSelectionContext(_context = context, app) {
@@ -1379,7 +1584,7 @@ function useSelection(namespace = "v0:selection") {
 //#endregion
 //#region src/components/Avatar/AvatarRoot.vue
 const [useAvatarRoot, provideAvatarContext] = createContext();
-const _sfc_main$25 = /* @__PURE__ */ defineComponent({
+const _sfc_main$26 = /* @__PURE__ */ defineComponent({
 	name: "AvatarRoot",
 	__name: "AvatarRoot",
 	props: {
@@ -1404,11 +1609,11 @@ const _sfc_main$25 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var AvatarRoot_default = _sfc_main$25;
+var AvatarRoot_default = _sfc_main$26;
 
 //#endregion
 //#region src/components/Avatar/AvatarFallback.vue
-const _sfc_main$24 = /* @__PURE__ */ defineComponent({
+const _sfc_main$25 = /* @__PURE__ */ defineComponent({
 	name: "AvatarFallback",
 	__name: "AvatarFallback",
 	props: {
@@ -1433,11 +1638,11 @@ const _sfc_main$24 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var AvatarFallback_default = _sfc_main$24;
+var AvatarFallback_default = _sfc_main$25;
 
 //#endregion
 //#region src/components/Avatar/AvatarImage.vue
-const _sfc_main$23 = /* @__PURE__ */ defineComponent({
+const _sfc_main$24 = /* @__PURE__ */ defineComponent({
 	name: "AvatarImage",
 	inheritAttrs: false,
 	__name: "AvatarImage",
@@ -1497,14 +1702,19 @@ const _sfc_main$23 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var AvatarImage_default = _sfc_main$23;
+var AvatarImage_default = _sfc_main$24;
 
 //#endregion
 //#region src/components/Avatar/index.ts
+/**
+* Avatar component with sub-components for building avatars.
+*
+* @see https://0.vuetifyjs.com/components/avatar
+*/
 const Avatar = {
-	Fallback: AvatarFallback_default,
+	Root: AvatarRoot_default,
 	Image: AvatarImage_default,
-	Root: AvatarRoot_default
+	Fallback: AvatarFallback_default
 };
 
 //#endregion
@@ -1545,20 +1755,6 @@ function toArray(value) {
 //#endregion
 //#region src/composables/useProxyModel/index.ts
 /**
-* @module useProxyModel
-*
-* @remarks
-* Proxy composable for bidirectional sync between selection registry and v-model.
-*
-* Key features:
-* - Bidirectional synchronization
-* - Array and single-value modes
-* - Automatic cleanup on scope disposal
-* - Perfect for form controls with selection backing
-*
-* Bridges the gap between selection composables and Vue's v-model.
-*/
-/**
 * Syncs a ref with a selection registry bidirectionally.
 *
 * @param registry The selection registry to bind to.
@@ -1599,12 +1795,9 @@ function useProxyModel(registry, model, options) {
 	const pending = new Set(modelAsArray);
 	for (const value of modelAsArray) {
 		const ids = registry.browse(value);
-		if (/* @__PURE__ */ isArray(ids)) {
+		if (ids) {
 			for (const id of ids) registry.select(id);
 			pending.delete(value);
-		} else if (ids) {
-			registry.select(ids);
-			pending.delete(value);
 		}
 	}
 	const registryWatch = watch(registry.selectedValues, (val) => {
@@ -1618,8 +1811,7 @@ function useProxyModel(registry, model, options) {
 		const targetIds = /* @__PURE__ */ new Set();
 		for (const value of transformIn(val)) {
 			const ids = registry.browse(value);
-			if (/* @__PURE__ */ isArray(ids)) for (const single of ids) targetIds.add(single);
-			else if (ids) targetIds.add(ids);
+			if (ids) for (const id of ids) targetIds.add(id);
 		}
 		if (multiple) {
 			for (const id of currentIds.difference(targetIds)) registry.selectedIds.delete(id);
@@ -1635,7 +1827,8 @@ function useProxyModel(registry, model, options) {
 		flush: "sync",
 		deep: multiple
 	});
-	function onRegister(ticket) {
+	function onRegister(data) {
+		const ticket = data;
 		if (!pending.has(ticket.value) || ticket.disabled) return;
 		registryWatch.pause();
 		modelWatch.pause();
@@ -1657,7 +1850,7 @@ function useProxyModel(registry, model, options) {
 //#endregion
 //#region src/components/ExpansionPanel/ExpansionPanelRoot.vue
 const [useExpansionPanelRoot, provideExpansionPanelSelection] = createContext();
-const _sfc_main$22 = /* @__PURE__ */ defineComponent({
+const _sfc_main$23 = /* @__PURE__ */ defineComponent({
 	name: "ExpansionPanelRoot",
 	__name: "ExpansionPanelRoot",
 	props: /* @__PURE__ */ mergeModels({
@@ -1714,12 +1907,12 @@ const _sfc_main$22 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var ExpansionPanelRoot_default = _sfc_main$22;
+var ExpansionPanelRoot_default = _sfc_main$23;
 
 //#endregion
 //#region src/components/ExpansionPanel/ExpansionPanelItem.vue
 const [useExpansionPanelItem, provideExpansionPanelItem] = createContext({ suffix: "item" });
-const _sfc_main$21 = /* @__PURE__ */ defineComponent({
+const _sfc_main$22 = /* @__PURE__ */ defineComponent({
 	name: "ExpansionPanelItem",
 	__name: "ExpansionPanelItem",
 	props: {
@@ -1763,11 +1956,11 @@ const _sfc_main$21 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var ExpansionPanelItem_default = _sfc_main$21;
+var ExpansionPanelItem_default = _sfc_main$22;
 
 //#endregion
 //#region src/components/ExpansionPanel/ExpansionPanelActivator.vue
-const _sfc_main$20 = /* @__PURE__ */ defineComponent({
+const _sfc_main$21 = /* @__PURE__ */ defineComponent({
 	name: "ExpansionPanelActivator",
 	__name: "ExpansionPanelActivator",
 	props: {
@@ -1813,11 +2006,11 @@ const _sfc_main$20 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var ExpansionPanelActivator_default = _sfc_main$20;
+var ExpansionPanelActivator_default = _sfc_main$21;
 
 //#endregion
 //#region src/components/ExpansionPanel/ExpansionPanelContent.vue
-const _sfc_main$19 = /* @__PURE__ */ defineComponent({
+const _sfc_main$20 = /* @__PURE__ */ defineComponent({
 	name: "ExpansionPanelContent",
 	__name: "ExpansionPanelContent",
 	props: {
@@ -1848,11 +2041,11 @@ const _sfc_main$19 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var ExpansionPanelContent_default = _sfc_main$19;
+var ExpansionPanelContent_default = _sfc_main$20;
 
 //#endregion
 //#region src/components/ExpansionPanel/ExpansionPanelHeader.vue
-const _sfc_main$18 = /* @__PURE__ */ defineComponent({
+const _sfc_main$19 = /* @__PURE__ */ defineComponent({
 	name: "ExpansionPanelHeader",
 	__name: "ExpansionPanelHeader",
 	props: {
@@ -1877,10 +2070,15 @@ const _sfc_main$18 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var ExpansionPanelHeader_default = _sfc_main$18;
+var ExpansionPanelHeader_default = _sfc_main$19;
 
 //#endregion
 //#region src/components/ExpansionPanel/index.ts
+/**
+* ExpansionPanel component with sub-components for building expansion panels.
+*
+* @see https://0.vuetifyjs.com/components/expansion-panels
+*/
 const ExpansionPanel = {
 	Root: ExpansionPanelRoot_default,
 	Item: ExpansionPanelItem_default,
@@ -1892,21 +2090,6 @@ const ExpansionPanel = {
 //#endregion
 //#region src/composables/useProxyRegistry/index.ts
 /**
-* @module useProxyRegistry
-*
-* @remarks
-* Proxy composable for reactive registry keys, values, entries, and size.
-*
-* Key features:
-* - Reactive proxy for registry data
-* - Deep or shallow reactivity options
-* - Event-based updates
-* - Automatic cleanup on scope disposal
-* - Transforms Map-based registry into reactive refs
-*
-* Perfect for exposing registry data as reactive computed properties.
-*/
-/**
 * Creates a proxy registry that provides reactive objects for registry data.
 *
 * @param registry The registry instance to proxy.
@@ -1956,26 +2139,6 @@ function useProxyRegistry(registry, options) {
 //#endregion
 //#region src/composables/useGroup/index.ts
 /**
-* @module useGroup
-*
-* @remarks
-* Multi-selection composable that extends useSelection with batch operations and tri-state support.
-*
-* Key features:
-* - Batch operations (select/unselect/toggle accept ID | ID[])
-* - Tri-state support via mixed/indeterminate state (mix/unmix)
-* - selectedIndexes computed Set for position-based tracking
-* - Perfect for checkbox trees, multi-select dropdowns, filter panels
-*
-* Tri-state behavior:
-* - Items can be selected, mixed (indeterminate), or unselected
-* - select() clears mixed state, mix() clears selected state (mutually exclusive)
-* - toggle() on a mixed item selects it (resolves positively)
-*
-* Inheritance chain: useRegistry → useSelection → useGroup
-* Extended by: useFeatures
-*/
-/**
 * Creates a new group instance with batch selection and tri-state support.
 *
 * Extends `createSelection` to support selecting, unselecting, and toggling multiple items
@@ -2049,7 +2212,7 @@ function useProxyRegistry(registry, options) {
 * ```
 */
 function createGroup(_options = {}) {
-	const { mandatory = false, multiple = true,...options } = _options;
+	const { mandatory = false, multiple = true, ...options } = _options;
 	const selection = createSelection({
 		...options,
 		mandatory,
@@ -2059,10 +2222,10 @@ function createGroup(_options = {}) {
 	const proxy = useProxyRegistry(selection);
 	const mixedIds = shallowReactive(/* @__PURE__ */ new Set());
 	const selectedIndexes = computed(() => {
-		return new Set(Array.from(selection.selectedItems.value).map((item) => item?.index));
+		return new Set(Array.from(selection.selectedItems.value).map((item) => item?.index).filter((index) => !/* @__PURE__ */ isUndefined(index)));
 	});
 	const mixedItems = computed(() => {
-		return new Set(Array.from(mixedIds).map((id) => selection.get(id)));
+		return new Set(Array.from(mixedIds).map((id) => selection.get(id)).filter((item) => !/* @__PURE__ */ isUndefined(item)));
 	});
 	function mixed(id) {
 		return mixedIds.has(id);
@@ -2129,10 +2292,10 @@ function createGroup(_options = {}) {
 		if (items.length === 0) return false;
 		return items.every((item) => selection.selectedIds.has(item.id));
 	});
-	const isMixed = toRef(() => {
+	const isNoneSelected = computed(() => selection.selectedIds.size === 0);
+	const isMixed = computed(() => {
 		return mixedIds.size > 0 || !isNoneSelected.value && !isAllSelected.value;
 	});
-	const isNoneSelected = toRef(() => selection.selectedIds.size === 0);
 	function selectAll() {
 		for (const item of selectableItems.value) {
 			mixedIds.delete(item.id);
@@ -2204,7 +2367,7 @@ function createGroup(_options = {}) {
 * ```
 */
 function createGroupContext(_options = {}) {
-	const { namespace = "v0:group",...options } = _options;
+	const { namespace = "v0:group", ...options } = _options;
 	const [useGroupContext, _provideGroupContext] = createContext(namespace);
 	const context = createGroup(options);
 	function provideGroupContext(_context = context, app) {
@@ -2242,7 +2405,7 @@ function useGroup(namespace = "v0:group") {
 //#endregion
 //#region src/components/Group/GroupRoot.vue
 const [useGroupRoot, provideGroupRoot] = createContext();
-const _sfc_main$17 = /* @__PURE__ */ defineComponent({
+const _sfc_main$18 = /* @__PURE__ */ defineComponent({
 	name: "GroupRoot",
 	__name: "GroupRoot",
 	props: /* @__PURE__ */ mergeModels({
@@ -2263,7 +2426,7 @@ const _sfc_main$17 = /* @__PURE__ */ defineComponent({
 		"modelValue": {},
 		"modelModifiers": {}
 	}),
-	emits: ["update:modelValue"],
+	emits: /* @__PURE__ */ mergeModels(["update:model-value"], ["update:modelValue"]),
 	setup(__props) {
 		const model = useModel(__props, "modelValue");
 		const group = createGroup({
@@ -2292,11 +2455,11 @@ const _sfc_main$17 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var GroupRoot_default = _sfc_main$17;
+var GroupRoot_default = _sfc_main$18;
 
 //#endregion
 //#region src/components/Group/GroupItem.vue
-const _sfc_main$16 = /* @__PURE__ */ defineComponent({
+const _sfc_main$17 = /* @__PURE__ */ defineComponent({
 	name: "GroupItem",
 	__name: "GroupItem",
 	props: {
@@ -2332,7 +2495,8 @@ const _sfc_main$16 = /* @__PURE__ */ defineComponent({
 			mix: ticket.mix,
 			unmix: ticket.unmix,
 			attrs: {
-				"aria-selected": toValue(ticket.isSelected),
+				"role": "checkbox",
+				"aria-checked": toValue(ticket.isMixed) ? "mixed" : toValue(ticket.isSelected),
 				"aria-disabled": toValue(isDisabled),
 				"data-selected": toValue(ticket.isSelected) || void 0,
 				"data-disabled": toValue(isDisabled) || void 0,
@@ -2344,1355 +2508,1254 @@ const _sfc_main$16 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var GroupItem_default = _sfc_main$16;
+var GroupItem_default = _sfc_main$17;
 
 //#endregion
 //#region src/components/Group/index.ts
+/**
+* Group component with sub-components for multi-selection.
+*
+* @see https://0.vuetifyjs.com/components/group
+*/
 const Group = {
 	Root: GroupRoot_default,
 	Item: GroupItem_default
 };
 
 //#endregion
-//#region src/composables/useHydration/index.ts
+//#region src/composables/useLocale/adapters/v0.ts
 /**
-* @module useHydration
-*
-* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
-*
-* @remarks
-* SSR hydration state management composable.
-*
-* Key features:
-* - Hydration state detection (browser vs SSR)
-* - Root component detection
-* - Readonly hydration state refs
-* - Plugin installation support
-* - Perfect for hydration-safe rendering
+* Vuetify0.x locale adapter implementation
 *
-* Essential for composables that need to behave differently during SSR vs client-side.
+* This adapter provides translation and number formatting
+* capabilities using the Intl API and supports both
+* numbered ({0}, {1}) and named ({name}) variables in translation strings.
 */
+var Vuetify0LocaleAdapter = class {
+	t(message, ...params) {
+		let resolvedMessage = message;
+		if (params.length > 0 && /* @__PURE__ */ isObject(params[0])) {
+			const variables = params[0];
+			resolvedMessage = resolvedMessage.replace(/{([a-zA-Z][a-zA-Z0-9_]*)}/g, (match, name) => {
+				return /* @__PURE__ */ isUndefined(variables[name]) ? match : String(variables[name]);
+			});
+			params = params.slice(1);
+		}
+		resolvedMessage = resolvedMessage.replace(/\{(\d+)\}/g, (match, index) => {
+			const idx = Number.parseInt(index, 10);
+			if (!/* @__PURE__ */ isUndefined(params[idx])) return String(params[idx]);
+			return match;
+		});
+		return resolvedMessage;
+	}
+	n(value, locale, ...params) {
+		if (!IN_BROWSER || !locale) return value.toString();
+		const options = params[0];
+		return new Intl.NumberFormat(String(locale), options).format(value);
+	}
+};
+
+//#endregion
+//#region src/composables/useSingle/index.ts
 /**
-* Creates a new hydration instance.
-*
-* @returns A new hydration instance.
+* Creates a new single selection instance that enforces only one selected item at a time.
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
+* Extends `createSelection` by automatically clearing previous selections when a new item is selected.
+* Adds computed singular properties: `selectedId`, `selectedItem`, `selectedIndex`, `selectedValue`.
 *
-* @example
-* ```ts
-* import { createHydration } from '@vuetify/v0'
+* @param options The options for the single selection instance.
+* @template Z The type of the single selection ticket.
+* @template E The type of the single selection context.
+* @returns A new single selection instance with single-selection enforcement.
 *
-* const hydration = createHydration()
-* console.log(hydration.isHydrated.value) // false
-* hydration.hydrate()
-* console.log(hydration.isHydrated.value) // true
-* ```
-*/
-function createHydration() {
-	const isHydrated = shallowRef(false);
-	function hydrate() {
-		isHydrated.value = true;
-	}
-	return {
-		isHydrated: shallowReadonly(isHydrated),
-		hydrate
-	};
-}
-function createFallbackHydration() {
-	return {
-		isHydrated: shallowReadonly(shallowRef(true)),
-		hydrate: () => {}
-	};
-}
-/**
-* Creates a new hydration context trinity.
+* @remarks
+* **Key Differences from `createSelection`:**
+* - Automatically clears `selectedIds` before selecting a new item (enforces single selection)
+* - Provides singular computed properties instead of plural sets
+* - Perfect for tabs, radio buttons, theme selectors, and other single-choice UI components
 *
-* @param options Options for creating the hydration context.
-* @template E The type of the hydration context.
-* @returns A new hydration context trinity.
+* **Computed Properties:**
+* - `selectedId`: The ID of the selected item (undefined if none selected)
+* - `selectedItem`: The selected ticket object (undefined if none selected)
+* - `selectedIndex`: The index of the selected item (-1 if none selected)
+* - `selectedValue`: The value of the selected item (undefined if none selected)
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
+* **Inheritance Chain:**
+* `useRegistry` → `createSelection` → `createSingle` → `createStep`
+*
+* @see https://0.vuetifyjs.com/composables/selection/use-single
 *
 * @example
 * ```ts
-* import { createHydrationContext } from '@vuetify/v0'
+* import { createSingle } from '@vuetify/v0'
 *
-* export const [useHydrationContext, provideHydrationContext, context] = createHydrationContext({
-*   namespace: 'app:hydration',
-* })
+* const tabs = createSingle({ mandatory: true })
+*
+* tabs.onboard([
+*   { id: 'home', value: 'Home' },
+*   { id: 'about', value: 'About' },
+*   { id: 'contact', value: 'Contact' },
+* ])
+*
+* tabs.first() // Select first tab
+*
+* console.log(tabs.selectedId.value) // 'home'
+* console.log(tabs.selectedIndex.value) // 0
+*
+* tabs.select('about') // Switch to about tab
+* console.log(tabs.selectedId.value) // 'about'
+* console.log(tabs.selectedIds.size) // 1 (always enforces single selection)
 * ```
 */
-function createHydrationContext(_options = {}) {
-	const { namespace = "v0:hydration" } = _options;
-	const [useHydrationContext, _provideHydrationContext] = createContext(namespace);
-	const context = createHydration();
-	function provideHydrationContext(_context = context, app) {
-		return _provideHydrationContext(_context, app);
+function createSingle(_options = {}) {
+	const { mandatory = false, multiple = false, ...options } = _options;
+	const registry = createSelection({
+		...options,
+		mandatory,
+		multiple
+	});
+	const selectedId = computed(() => registry.selectedIds.values().next().value);
+	const selectedItem = computed(() => registry.selectedItems.value.values().next().value);
+	const selectedIndex = computed(() => selectedItem.value?.index ?? -1);
+	const selectedValue = computed(() => selectedItem.value?.value);
+	function unselect(id) {
+		if (mandatory && registry.selectedIds.size === 1) return;
+		registry.selectedIds.delete(id);
 	}
-	return createTrinity(useHydrationContext, provideHydrationContext, context);
+	function toggle(id) {
+		if (registry.selectedIds.has(id)) unselect(id);
+		else registry.select(id);
+	}
+	return {
+		...registry,
+		selectedId,
+		selectedItem,
+		selectedIndex,
+		selectedValue,
+		unselect,
+		toggle,
+		get size() {
+			return registry.size;
+		}
+	};
 }
 /**
-* Creates a new hydration plugin.
+* Creates a new single selection context.
 *
-* @param options The options for the hydration plugin.
-* @template E The type of the hydration context.
-* @returns A new hydration plugin.
+* @param options The options for the single selection context.
+* @template Z The type of the single selection ticket.
+* @template E The type of the single selection context.
+* @returns A new single selection context.
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
+* @see https://0.vuetifyjs.com/composables/selection/use-single
 *
 * @example
 * ```ts
-* import { createApp } from 'vue'
-* import { createHydrationPlugin } from '@vuetify/v0'
-* import App from './App.vue'
+* import { createSingleContext } from '@vuetify/v0'
 *
-* const app = createApp(App)
+* // With default namespace 'v0:single'
+* export const [useSingle, provideSingle, context] = createSingleContext()
 *
-* app.use(createHydrationPlugin())
+* // In a parent component:
+* provideSingle()
 *
-* app.mount('#app')
+* // In a child component:
+* const single = useSingle()
+* single.select('tab-1')
 * ```
 */
-function createHydrationPlugin(_options = {}) {
-	const { namespace = "v0:hydration",...options } = _options;
-	const [, provideHydrationContext, context] = createHydrationContext({
-		...options,
-		namespace
-	});
-	return createPlugin({
-		namespace,
-		provide: (app) => {
-			provideHydrationContext(context, app);
-		},
-		setup: (app) => {
-			app.mixin({ mounted() {
-				if (this.$parent !== null) return;
-				context.hydrate();
-			} });
-		}
-	});
+function createSingleContext(_options = {}) {
+	const { namespace = "v0:single", ...options } = _options;
+	const [useSingleContext, _provideSingleContext] = createContext(namespace);
+	const context = createSingle(options);
+	function provideSingleContext(_context = context, app) {
+		return _provideSingleContext(_context, app);
+	}
+	return createTrinity(useSingleContext, provideSingleContext, context);
 }
 /**
-* Returns the current hydration instance.
+* Returns the current single selection instance.
 *
-* @param namespace The namespace for the hydration context. Defaults to `v0:hydration`.
-* @returns The current hydration instance.
+* @param namespace The namespace for the single selection context. Defaults to `'v0:single'`.
+* @returns The current single selection instance.
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
+* @see https://0.vuetifyjs.com/composables/selection/use-single
 *
 * @example
 * ```vue
 * <script setup lang="ts">
-*   import { useHydration } from '@vuetify/v0'
+*   import { useSingle } from '@vuetify/v0'
 *
-*   const hydration = useHydration()
+*   const tabs = useSingle()
 * <\/script>
 *
 * <template>
 *   <div>
-*     <p>Is hydrated: {{ hydration.isHydrated.value }}</p>
+*     <p>Selected: {{ tabs.selectedId }}</p>
 *   </div>
 * </template>
 * ```
 */
-function useHydration(namespace = "v0:hydration") {
-	const fallback = createFallbackHydration();
-	if (!getCurrentInstance()) return fallback;
-	try {
-		return useContext(namespace, fallback);
-	} catch {
-		return fallback;
-	}
+function useSingle(namespace = "v0:single") {
+	return useContext(namespace);
 }
 
 //#endregion
-//#region src/composables/useResizeObserver/index.ts
-/**
-* @module useResizeObserver
-*
-* @remarks
-* ResizeObserver composable with lifecycle management.
-*
-* Key features:
-* - ResizeObserver API wrapper
-* - Pause/resume/stop functionality
-* - Automatic cleanup on unmount
-* - SSR-safe (checks SUPPORTS_OBSERVER)
-* - Hydration-aware
-* - Box model options (content-box/border-box)
-*
-* Perfect for responsive components and size-based rendering.
-*/
+//#region src/composables/useTokens/index.ts
 /**
-* A composable that uses the Resize Observer API to detect when an element's
-* size changes.
+* Creates a new token instance.
 *
-* @param target The element to observe.
-* @param callback The callback to execute when the element's size changes.
-* @param options The options for the Resize Observer.
-* @returns An object with methods to control the observer.
+* @param tokens The tokens to use.
+* @param options The options for the token instance.
+* @template Z The type of the token ticket.
+* @template E The type of the token context.
+* @returns A new token instance.
 *
-* @see https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver
-* @see https://0.vuetifyjs.com/composables/system/use-resize-observer
+* @see https://www.designtokens.org/tr/drafts/format/
+* @see https://0.vuetifyjs.com/composables/registration/use-tokens
 *
 * @example
 * ```ts
-* import { ref } from 'vue'
-* import { useResizeObserver } from '@vuetify/v0'
-*
-* const el = ref<HTMLElement>()
-* const width = ref(0)
-* const height = ref(0)
+* import { useTokens } from '@vuetify/v0'
 *
-* const { pause, resume, isPaused } = useResizeObserver(
-*   el,
-*   (entries) => {
-*     const entry = entries[0]
-*     if (entry) {
-*       width.value = entry.contentRect.width
-*       height.value = entry.contentRect.height
-*       console.log('Size changed:', width.value, 'x', height.value)
-*     }
+* const tokens = useTokens({
+*   colors: {
+*     primary: '#3b82f6',
+*     secondary: '{colors.primary}', // Alias reference
 *   },
-*   { immediate: true }
-* )
-*
-* // Pause observation
-* pause()
+* })
 *
-* // Resume observation
-* resume()
+* console.log(tokens.resolve('{colors.primary}')) // '#3b82f6'
+* console.log(tokens.resolve('{colors.secondary}')) // '#3b82f6'
 * ```
 */
-function useResizeObserver(target, callback, options = {}) {
-	const { isHydrated } = useHydration();
-	const observer = shallowRef();
-	const isPaused = shallowRef(false);
-	const isActive = toRef(() => !!observer.value);
-	function setup() {
-		if (!isHydrated.value || !SUPPORTS_OBSERVER || !target.value || isPaused.value) return;
-		observer.value = new ResizeObserver((entries) => {
-			callback(entries.map((entry) => ({
-				contentRect: {
-					width: entry.contentRect.width,
-					height: entry.contentRect.height,
-					top: entry.contentRect.top,
-					left: entry.contentRect.left
-				},
-				target: entry.target
-			})));
-		});
-		observer.value.observe(target.value, { box: options.box || "content-box" });
-		if (options.immediate) {
-			const rect = target.value.getBoundingClientRect();
-			callback([{
-				contentRect: {
-					width: rect.width,
-					height: rect.height,
-					top: rect.top,
-					left: rect.left
-				},
-				target: target.value
-			}]);
-		}
-	}
-	watch([isHydrated, target], () => {
-		cleanup();
-		setup();
-	}, { immediate: true });
-	function cleanup() {
-		if (observer.value) {
-			observer.value.disconnect();
-			observer.value = void 0;
-		}
-	}
-	function pause() {
-		isPaused.value = true;
-		observer.value?.disconnect();
+function createTokens(tokens = {}, options = {}) {
+	const logger = useLogger();
+	const registry = useRegistry(options);
+	const cache = /* @__PURE__ */ new Map();
+	registry.onboard(flatten(tokens, options.prefix, !!options.flat));
+	function isAlias(token) {
+		return /* @__PURE__ */ isString(token) && token.length > 2 && token[0] === "{" && token.at(-1) === "}";
 	}
-	function resume() {
-		isPaused.value = false;
-		setup();
+	function isTokenAlias(value) {
+		return /* @__PURE__ */ isObject(value) && "$value" in value;
 	}
-	function stop() {
-		cleanup();
+	function resolve(token, visited = /* @__PURE__ */ new Set()) {
+		const cacheKey = /* @__PURE__ */ isString(token) ? token : JSON.stringify(token);
+		const cached = cache.get(cacheKey);
+		if (!/* @__PURE__ */ isUndefined(cached)) return cached;
+		const reference = isTokenAlias(token) ? token.$value : token;
+		const isAliasReference = /* @__PURE__ */ isString(reference) && isAlias(reference);
+		const clean = isAliasReference ? reference.slice(1, -1) : String(reference);
+		if (visited.has(clean)) {
+			logger.warn(`Circular alias detected for "${clean}"`);
+			cache.set(cacheKey, void 0);
+			return;
+		}
+		visited.add(clean);
+		let found = registry.get(clean);
+		let segments = [];
+		if (!found && clean.includes(".")) {
+			const parts = clean.split(".");
+			for (let i = parts.length - 1; i > 0; i--) {
+				const prefix = parts.slice(0, i).join(".");
+				const suffix = parts.slice(i);
+				const candidate = registry.get(prefix);
+				if (!/* @__PURE__ */ isUndefined(candidate?.value)) {
+					found = candidate;
+					segments = suffix;
+					break;
+				}
+			}
+		}
+		if (/* @__PURE__ */ isUndefined(found?.value)) {
+			if (isAliasReference) logger.warn(`Alias not found for "${String(reference)}"`);
+			cache.set(cacheKey, void 0);
+			return;
+		}
+		let result;
+		let current = found.value;
+		if (segments.length > 0) {
+			if (isTokenAlias(current)) current = current.$value;
+			for (const segment of segments) {
+				if (!/* @__PURE__ */ isObject(current) || !(segment in current)) {
+					current = void 0;
+					break;
+				}
+				current = current[segment];
+				if (isTokenAlias(current)) current = current.$value;
+			}
+			if (/* @__PURE__ */ isUndefined(current)) {
+				logger.warn(`Path not found inside "${clean}": ${segments.join(".")}`);
+				cache.set(cacheKey, void 0);
+				return;
+			}
+			result = current;
+		} else if (isTokenAlias(current)) {
+			const inner = current.$value;
+			if (/* @__PURE__ */ isString(inner) && isAlias(inner)) return resolve(inner, visited);
+			result = inner;
+		} else if (/* @__PURE__ */ isString(current) && isAlias(current)) return resolve(current, visited);
+		else result = current;
+		cache.set(cacheKey, result);
+		return result;
 	}
-	onScopeDispose(stop, true);
 	return {
-		isActive: shallowReadonly(isActive),
-		isPaused: shallowReadonly(isPaused),
-		pause,
-		resume,
-		stop
+		...registry,
+		resolve,
+		isAlias,
+		get size() {
+			return registry.size;
+		}
 	};
 }
 /**
-* A convenience composable that uses the Resize Observer API to track an
-* element's size.
+* Creates a new token context.
 *
-* @param target The element to observe.
-* @returns An object with the element's width and height.
+* @param namespace The namespace for the token context.
+* @param tokens The tokens to use.
+* @template Z The type of the token ticket.
+* @template E The type of the token context.
+* @returns A new token context.
 *
-* @see https://0.vuetifyjs.com/composables/system/use-resize-observer#use-element-size
+* @see https://0.vuetifyjs.com/composables/registration/use-tokens
 *
 * @example
 * ```ts
-* import { ref, watchEffect } from 'vue'
-* import { useElementSize } from '@vuetify/v0'
-*
-* const box = ref<HTMLElement>()
-* const { width, height } = useElementSize(box)
+* import { createTokensContext } from '@vuetify/v0'
 *
-* // Width and height are reactive refs
-* watchEffect(() => {
-*   console.log('Box size:', width.value, 'x', height.value)
+* export const [useTokens, provideTokens, context] = createTokensContext({
+*  namespace: 'v0:tokens',
+*  tokens: {
+*    colors: {
+*      primary: '#3b82f6',
+*      secondary: '{colors.primary}', // Alias reference
+*    },
+*  },
 * })
 * ```
 */
-function useElementSize(target) {
-	const width = shallowRef(0);
-	const height = shallowRef(0);
-	const { pause: _pause, resume, stop, isActive, isPaused } = useResizeObserver(target, (entries) => {
-		const entry = entries[0];
-		if (entry) {
-			width.value = entry.contentRect.width;
-			height.value = entry.contentRect.height;
-		}
-	}, { immediate: true });
-	function pause() {
-		width.value = 0;
-		height.value = 0;
-		_pause();
+function createTokensContext(_options) {
+	const { namespace = "v0:tokens", tokens = {}, ...options } = _options;
+	const [useTokensContext, _provideTokensContext] = createContext(namespace);
+	const context = createTokens(tokens, options);
+	function provideTokensContext(_context = context, app) {
+		return _provideTokensContext(_context, app);
 	}
-	return {
-		width,
-		height,
-		isActive,
-		isPaused,
-		pause,
-		resume,
-		stop
-	};
+	return createTrinity(useTokensContext, provideTokensContext, context);
 }
-
-//#endregion
-//#region src/composables/useOverflow/index.ts
 /**
-* @module useOverflow
-*
-* @remarks
-* Composable for computing how many items fit in a container based on available width.
-* Enables responsive truncation logic for Pagination, Breadcrumbs, and similar components.
+* Returns the current tokens instance.
 *
-* Key features:
-* - Container width tracking via ResizeObserver
-* - Two modes: variable-width (per-item) or uniform-width (sample-based)
-* - Computes capacity (how many items fit)
-* - SSR-safe with Infinity fallback
-* - Supports reserved space for nav buttons, ellipsis, etc.
-*
-* Use variable mode (default) for items with different widths like Breadcrumbs.
-* Use uniform mode (itemWidth option) for same-width items like Pagination buttons.
-*/
-/**
-* Creates a new overflow context for computing how many items fit in a container.
+* @param namespace The namespace for the tokens context. Defaults to `'v0:tokens'`.
+* @returns The current tokens instance.
 *
-* @param options Configuration options
-* @returns Overflow context with container ref, capacity, and measurement functions
+* @see https://0.vuetifyjs.com/composables/registration/use-tokens
 *
-* @example Variable-width mode (Breadcrumbs)
+* @example
 * ```vue
-* <script lang="ts" setup>
-*   import { useTemplateRef } from 'vue'
-*   import { createOverflow } from '@vuetify/v0'
+* <script setup lang="ts">
+*   import { useTokens } from '@vuetify/v0'
 *
-*   const containerRef = useTemplateRef('container')
-*   const overflow = createOverflow({
-*     container: containerRef,
-*     gap: 8,
-*     reserved: 40,
-*   })
+*   const tokens = useTokens()
 * <\/script>
-*
-* <template>
-*   <div ref="container">
-*     <span
-*       v-for="(item, i) in items.slice(0, overflow.capacity.value)"
-*       :key="i"
-*       :ref="el => overflow.measure(i, el)"
-*     >
-*       {{ item }}
-*     </span>
-*     <span v-if="overflow.isOverflowing.value">...</span>
-*   </div>
-* </template>
-* ```
-*
-* @example Uniform-width mode (Pagination)
-* ```ts
-* const overflow = createOverflow({
-*   container: () => atom.value?.element,
-*   itemWidth: buttonWidth,
-*   reserved: () => buttonWidth.value * 4,
-* })
 * ```
 */
-function createOverflow(options = {}) {
-	const { container: _container, gap = 0, reserved = 0, itemWidth, reverse } = options;
-	const container = /* @__PURE__ */ isUndefined(_container) ? shallowRef() : toRef(_container);
-	const widths = shallowRef(/* @__PURE__ */ new Map());
-	const { width } = useElementSize(container);
-	function measure(index, el) {
-		if (!el) {
-			if (widths.value.has(index)) {
-				const next = new Map(widths.value);
-				next.delete(index);
-				widths.value = next;
+function useTokens(namespace = "v0:tokens") {
+	return useContext(namespace);
+}
+/**
+* Flattens a nested collection of tokens into a flat array of tokens.
+* Each token is represented by an object containing its ID & value.
+* @param tokens The collection of tokens to flatten.
+* @param prefix An optional prefix to prepend to each token ID.
+* @returns An array of flattened tokens, each with an ID and value.
+*/
+function flatten(tokens, prefix = "", flat = false) {
+	const flattened = [];
+	const stack = [{
+		tokens,
+		prefix,
+		flat
+	}];
+	while (stack.length > 0) {
+		const { tokens: currentTokens, prefix: currentPrefix, flat: flat$1 } = stack.pop();
+		const meta = {};
+		for (const k in currentTokens) if (k.startsWith("$")) meta[k] = currentTokens[k];
+		if (Object.keys(meta).length > 0 && currentPrefix) flattened.push({
+			id: currentPrefix,
+			value: meta
+		});
+		for (const key in currentTokens) {
+			if (key.startsWith("$")) continue;
+			const value = currentTokens[key];
+			const id = currentPrefix ? `${currentPrefix}.${key}` : key;
+			if (!/* @__PURE__ */ isObject(value)) {
+				flattened.push({
+					id,
+					value
+				});
+				continue;
 			}
-			return;
+			if ("$value" in value) {
+				flattened.push({
+					id,
+					value
+				});
+				const inner = value.$value;
+				if (/* @__PURE__ */ isObject(inner) && !flat$1) for (const innerKey in inner) {
+					if (innerKey.startsWith("$")) continue;
+					const child = inner[innerKey];
+					const childId = `${id}.${innerKey}`;
+					if (!/* @__PURE__ */ isObject(child)) flattened.push({
+						id: childId,
+						value: child
+					});
+					else if ("$value" in child) flattened.push({
+						id: childId,
+						value: child
+					});
+					else stack.push({
+						tokens: child,
+						prefix: childId,
+						flat: flat$1
+					});
+				}
+				continue;
+			}
+			if (flat$1) {
+				flattened.push({
+					id,
+					value
+				});
+				continue;
+			}
+			stack.push({
+				tokens: value,
+				prefix: id,
+				flat: flat$1
+			});
 		}
-		const style = getComputedStyle(el);
-		const marginX = Number.parseFloat(style.marginLeft) + Number.parseFloat(style.marginRight);
-		const w = el.offsetWidth + marginX;
-		if (widths.value.get(index) !== w) widths.value = new Map(widths.value).set(index, w);
 	}
-	function reset() {
-		widths.value = /* @__PURE__ */ new Map();
+	return flattened;
+}
+
+//#endregion
+//#region src/composables/useLocale/index.ts
+/**
+* Creates a new locale instance.
+*
+* @param options The options for the locale instance.
+* @template Z The type of the locale ticket.
+* @template E The type of the locale context.
+* @returns A new locale instance.
+*
+* @see https://0.vuetifyjs.com/composables/plugins/use-locale
+*/
+function createLocale(_options = {}) {
+	const { adapter = new Vuetify0LocaleAdapter(), messages = {}, ...options } = _options;
+	const tokens = createTokens(messages);
+	const registry = createSingle(options);
+	for (const id in messages) {
+		registry.register({ id });
+		if (id === options.default && !registry.selectedId.value) registry.select(id);
 	}
-	const total = computed(() => {
-		const g = toValue(gap);
-		let sum = 0;
-		let count = 0;
-		for (const w of widths.value.values()) {
-			sum += w + (count > 0 ? g : 0);
-			count++;
+	function t(key, params, fallback) {
+		const locale = registry.selectedId.value;
+		const args = toArray(params);
+		if (!locale) return adapter.t(fallback ?? key, ...args);
+		const path = `${locale}.${key}`;
+		const message = tokens.get(path)?.value;
+		const template = /* @__PURE__ */ isString(message) ? resolve(locale, message) : fallback ?? key;
+		return adapter.t(template, ...args);
+	}
+	function n(value, ...params) {
+		return adapter.n(value, registry.selectedId.value, ...params);
+	}
+	function resolve(locale, str) {
+		return str.replace(/{([a-zA-Z0-9.-_]+)}/g, (match, key) => {
+			const [prefix, ...rest] = key.split(".");
+			const target = registry.has(prefix) ? prefix : locale;
+			const path = `${target}.${registry.has(prefix) ? rest.join(".") : key}`;
+			const resolved = tokens.get(path)?.value;
+			if (/* @__PURE__ */ isString(resolved)) return resolve(target, resolved);
+			return match;
+		});
+	}
+	return {
+		...registry,
+		t,
+		n,
+		get size() {
+			return registry.size;
 		}
-		return sum;
-	});
+	};
+}
+function createLocaleFallback() {
 	return {
-		container,
-		width,
-		capacity: computed(() => {
-			const available = width.value - toValue(reserved);
-			if (width.value === 0) return Infinity;
-			if (available <= 0) return 0;
-			const g = toValue(gap);
-			const uniformWidth = toValue(itemWidth);
-			if (uniformWidth && uniformWidth > 0) {
-				const first = uniformWidth;
-				const subsequent = uniformWidth + g;
-				if (available < first) return 0;
-				return Math.max(1, Math.floor((available - first) / subsequent) + 1);
-			}
-			const entries = [...widths.value.entries()].toSorted((a, b) => a[0] - b[0]);
-			if (toValue(reverse)) entries.reverse();
-			let sum = 0;
-			let count = 0;
-			for (const [, w] of entries) {
-				const next = sum + w + (count > 0 ? g : 0);
-				if (next > available) break;
-				sum = next;
-				count++;
-			}
-			return count;
-		}),
-		total,
-		isOverflowing: toRef(() => {
-			return total.value > width.value - toValue(reserved);
-		}),
-		measure,
-		reset
+		size: 0,
+		t: (key, _params, fallback) => fallback ?? key,
+		n: String
 	};
 }
 /**
-* Creates an overflow context with dependency injection support.
+* Creates a new locale context.
 *
-* @param options Configuration options including namespace
-* @returns Trinity tuple: [useContext, provideContext, defaultContext]
+* @param options The options for the locale context.
+* @template Z The type of the locale ticket.
+* @template E The type of the locale context.
+* @returns A new locale context.
+*
+* @see https://0.vuetifyjs.com/composables/plugins/use-locale
 *
 * @example
 * ```ts
-* // Create injectable context
-* const [useOverflow, provideOverflow, overflow] = createOverflowContext({
-*   namespace: 'my-overflow',
-*   gap: 8,
-*   reserved: 160,
+* import { createLocaleContext } from '@vuetify/v0'
+*
+* export const [useAppLocale, provideAppLocale, appLocale] = createLocaleContext({
+*   namespace: 'app:locale',
+*   messages: {
+*     en: { hello: 'Hello' },
+*     es: { hello: 'Hola' },
+*   },
 * })
 *
-* // In parent component
-* provideOverflow()
+* // In a parent component:
+* provideAppLocale()
 *
-* // In child component
-* const overflow = useOverflow()
+* // In a child component:
+* const locale = useAppLocale()
+* locale.select('es')
 * ```
 */
-function createOverflowContext(_options = {}) {
-	const { namespace = "v0:overflow",...options } = _options;
-	const [useOverflowContext, _provideOverflowContext] = createContext(namespace);
-	const context = createOverflow(options);
-	function provideOverflowContext(_context = context, app) {
-		return _provideOverflowContext(_context, app);
+function createLocaleContext(_options = {}) {
+	const { namespace = "v0:locale", ...options } = _options;
+	const [useLocaleContext, _provideLocaleContext] = createContext(namespace);
+	const context = createLocale(options);
+	function provideLocaleContext(_context = context, app) {
+		return _provideLocaleContext(_context, app);
 	}
-	return createTrinity(useOverflowContext, provideOverflowContext, context);
+	return createTrinity(useLocaleContext, provideLocaleContext, context);
 }
 /**
-* Returns the current overflow context from dependency injection.
+* Creates a new locale plugin.
 *
-* @param namespace The namespace for the overflow context. Defaults to `v0:overflow`.
-* @returns The current overflow context.
+* @param options The options for the locale plugin.
+* @template Z The type of the locale ticket.
+* @template E The type of the locale context.
+* @template R The type of the token ticket.
+* @template O The type of the token context.
+* @returns A new locale plugin.
 *
-* @example
-* ```vue
-* <script lang="ts" setup>
-*   import { useOverflow } from '@vuetify/v0'
+* @see https://0.vuetifyjs.com/composables/plugins/use-locale
+*/
+function createLocalePlugin(_options = {}) {
+	const { namespace = "v0:locale", adapter = new Vuetify0LocaleAdapter(), messages = {}, ...options } = _options;
+	const [, provideLocaleContext, context] = createLocaleContext({
+		...options,
+		namespace,
+		adapter,
+		messages
+	});
+	return createPlugin({
+		namespace,
+		provide: (app) => {
+			provideLocaleContext(context, app);
+		}
+	});
+}
+/**
+* Returns the current locale instance.
 *
-*   // Inject overflow context provided by parent
-*   const overflow = useOverflow()
-* <\/script>
+* @returns The current locale instance.
 *
-* <template>
-*   <div>
-*     <p>Capacity: {{ overflow.capacity.value }}</p>
-*   </div>
-* </template>
-* ```
+* @see https://0.vuetifyjs.com/composables/plugins/use-locale
 */
-function useOverflow(namespace = "v0:overflow") {
-	return useContext(namespace);
+function useLocale(namespace = "v0:locale") {
+	const fallback = createLocaleFallback();
+	if (!getCurrentInstance()) return fallback;
+	try {
+		return useContext(namespace, fallback);
+	} catch {
+		return fallback;
+	}
 }
 
 //#endregion
-//#region src/composables/usePagination/index.ts
+//#region src/composables/useHydration/index.ts
 /**
-* @module usePagination
-*
-* @remarks
-* Lightweight pagination composable for navigating through pages.
+* Creates a new hydration instance.
 *
-* Key features:
-* - No registry overhead - just a bounded integer
-* - Direct ref support for v-model compatibility
-* - Navigation methods: next, prev, first, last
-* - Computed visible items with ellipsis
-* - Trinity pattern for dependency injection
-*
-* Unlike registry-based composables, pagination tracks a single number
-* within a range, making it efficient for large page counts.
-*/
-/**
-* Creates a pagination instance.
+* @returns A new hydration instance.
 *
-* @param options The options for the pagination instance.
-* @returns A pagination context with navigation methods.
+* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
 *
 * @example
 * ```ts
-* import { createPagination } from '@vuetify/v0'
-*
-* // Basic usage
-* const pagination = createPagination({ size: 100 })
-* pagination.next()
-* pagination.items.value // [{ type: 'page', value: 1 }, { type: 'page', value: 2 }, ...]
+* import { createHydration } from '@vuetify/v0'
 *
-* // With v-model (pass a ref)
-* const page = ref(1)
-* const pagination = createPagination({ page, size: 100 })
-* // Mutating pagination.page or the passed ref syncs both
+* const hydration = createHydration()
+* console.log(hydration.isHydrated.value) // false
+* hydration.hydrate()
+* console.log(hydration.isHydrated.value) // true
 * ```
 */
-function createPagination(_options = {}) {
-	const { page: _page = 1, itemsPerPage: _itemsPerPage = 10, size: _size = 0, visible: _visible = 7, ellipsis = "..." } = _options;
-	const page = isRef(_page) ? _page : shallowRef(_page);
-	const pages = computed(() => {
-		const size = toValue(_size);
-		const perPage = toValue(_itemsPerPage);
-		if (size <= 0 || /* @__PURE__ */ isNaN(size)) return 0;
-		return Math.ceil(size / perPage);
-	});
-	function first() {
-		page.value = 1;
-	}
-	function last() {
-		page.value = Math.max(1, pages.value);
-	}
-	function next() {
-		if (page.value < pages.value) page.value++;
-	}
-	function prev() {
-		if (page.value > 1) page.value--;
-	}
-	function select(value) {
-		if (value < 1) page.value = 1;
-		else if (value > pages.value) page.value = Math.max(1, pages.value);
-		else page.value = value;
-	}
-	const isFirst = computed(() => page.value <= 1);
-	const isLast = computed(() => page.value >= pages.value);
-	const pageStart = computed(() => (page.value - 1) * toValue(_itemsPerPage));
-	const pageStop = computed(() => Math.min(pageStart.value + toValue(_itemsPerPage), toValue(_size)));
-	function toPage(value) {
-		return {
-			type: "page",
-			value
-		};
-	}
-	function toEllipsis() {
-		return ellipsis === false ? false : {
-			type: "ellipsis",
-			value: ellipsis
-		};
-	}
-	function filter(array) {
-		return array.filter(Boolean);
+function createHydration() {
+	const isHydrated = shallowRef(false);
+	function hydrate() {
+		isHydrated.value = true;
 	}
 	return {
-		page,
-		ellipsis,
-		items: computed(() => {
-			const pageCount = pages.value;
-			const visible = toValue(_visible);
-			const current = page.value;
-			if (pageCount <= 0 || /* @__PURE__ */ isNaN(pageCount) || pageCount > Number.MAX_SAFE_INTEGER) return [];
-			if (visible <= 0) return [];
-			if (visible <= 2) return [toPage(current)];
-			if (pageCount <= visible) return (/* @__PURE__ */ range(pageCount, 1)).map(toPage);
-			if (visible === 3) {
-				const mid = current <= 1 ? 2 : current >= pageCount ? pageCount - 1 : current;
-				return [
-					toPage(1),
-					toPage(mid),
-					toPage(pageCount)
-				];
-			}
-			const boundary = visible - 2;
-			const middle = visible - 4;
-			if (middle <= 0) {
-				if (current <= boundary) return filter([
-					...(/* @__PURE__ */ range(boundary, 1)).map(toPage),
-					toEllipsis(),
-					toPage(pageCount)
-				]);
-				if (current > pageCount - boundary) return filter([
-					toPage(1),
-					toEllipsis(),
-					...(/* @__PURE__ */ range(boundary, pageCount - boundary + 1)).map(toPage)
-				]);
-				return current <= Math.ceil(pageCount / 2) ? filter([
-					toPage(1),
-					toPage(current),
-					toEllipsis(),
-					toPage(pageCount)
-				]) : filter([
-					toPage(1),
-					toEllipsis(),
-					toPage(current),
-					toPage(pageCount)
-				]);
-			}
-			const leftThreshold = boundary - 1;
-			const rightThreshold = pageCount - boundary + 2;
-			if (current <= leftThreshold) return filter([
-				...(/* @__PURE__ */ range(boundary, 1)).map(toPage),
-				toEllipsis(),
-				toPage(pageCount)
-			]);
-			else if (current >= rightThreshold) return filter([
-				toPage(1),
-				toEllipsis(),
-				...(/* @__PURE__ */ range(boundary, pageCount - boundary + 1)).map(toPage)
-			]);
-			else {
-				const start = current - Math.floor(middle / 2);
-				return filter([
-					toPage(1),
-					toEllipsis(),
-					...(/* @__PURE__ */ range(middle, start)).map(toPage),
-					toEllipsis(),
-					toPage(pageCount)
-				]);
-			}
-		}),
-		pageStart,
-		pageStop,
-		isFirst,
-		isLast,
-		first,
-		last,
-		next,
-		prev,
-		select,
-		get itemsPerPage() {
-			return toValue(_itemsPerPage);
-		},
-		get size() {
-			return toValue(_size);
-		},
-		get pages() {
-			return pages.value;
-		}
+		isHydrated: shallowReadonly(isHydrated),
+		hydrate
+	};
+}
+function createFallbackHydration() {
+	return {
+		isHydrated: shallowReadonly(shallowRef(true)),
+		hydrate: () => {}
 	};
 }
 /**
-* Creates a pagination context for dependency injection.
+* Creates a new hydration context trinity.
+*
+* @param options Options for creating the hydration context.
+* @template E The type of the hydration context.
+* @returns A new hydration context trinity.
+*
+* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
+*
+* @example
+* ```ts
+* import { createHydrationContext } from '@vuetify/v0'
+*
+* export const [useHydrationContext, provideHydrationContext, context] = createHydrationContext({
+*   namespace: 'app:hydration',
+* })
+* ```
+*/
+function createHydrationContext(_options = {}) {
+	const { namespace = "v0:hydration" } = _options;
+	const [useHydrationContext, _provideHydrationContext] = createContext(namespace);
+	const context = createHydration();
+	function provideHydrationContext(_context = context, app) {
+		return _provideHydrationContext(_context, app);
+	}
+	return createTrinity(useHydrationContext, provideHydrationContext, context);
+}
+/**
+* Creates a new hydration plugin.
 *
-* @param options The options including namespace.
-* @returns A trinity: [usePagination, providePagination, defaultContext]
+* @param options The options for the hydration plugin.
+* @template E The type of the hydration context.
+* @returns A new hydration plugin.
+*
+* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
 *
 * @example
 * ```ts
-* // With default namespace 'v0:pagination'
-* const [usePagination, providePaginationContext] = createPaginationContext({ size: 50 })
+* import { createApp } from 'vue'
+* import { createHydrationPlugin } from '@vuetify/v0'
+* import App from './App.vue'
 *
-* // Or with custom namespace
-* const [usePagination, providePaginationContext] = createPaginationContext({
-*   namespace: 'my-pagination',
-*   size: 50,
-* })
+* const app = createApp(App)
 *
-* // Parent component
-* providePaginationContext()
+* app.use(createHydrationPlugin())
 *
-* // Child component
-* const pagination = usePagination()
-* pagination.next()
+* app.mount('#app')
 * ```
 */
-function createPaginationContext(_options = {}) {
-	const { namespace = "v0:pagination",...options } = _options;
-	const [usePaginationContext, _providePaginationContext] = createContext(namespace);
-	const context = createPagination(options);
-	function providePaginationContext(_context = context, app) {
-		return _providePaginationContext(_context, app);
-	}
-	return createTrinity(usePaginationContext, providePaginationContext, context);
+function createHydrationPlugin(_options = {}) {
+	const { namespace = "v0:hydration", ...options } = _options;
+	const [, provideHydrationContext, context] = createHydrationContext({
+		...options,
+		namespace
+	});
+	return createPlugin({
+		namespace,
+		provide: (app) => {
+			provideHydrationContext(context, app);
+		},
+		setup: (app) => {
+			app.mixin({ mounted() {
+				if (this.$parent !== null) return;
+				context.hydrate();
+			} });
+		}
+	});
 }
 /**
-* Returns the current pagination instance from context.
+* Returns the current hydration instance.
 *
-* @param namespace The namespace. @default 'v0:pagination'
-* @returns The pagination context.
+* @param namespace The namespace for the hydration context. Defaults to `v0:hydration`.
+* @returns The current hydration instance.
+*
+* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
 *
 * @example
 * ```vue
-* <script setup>
-*  import { usePagination } from '@vuetify/v0'
+* <script setup lang="ts">
+*   import { useHydration } from '@vuetify/v0'
 *
-*  const pagination = usePagination()
+*   const hydration = useHydration()
 * <\/script>
 *
 * <template>
-*   <button @click="pagination.prev()" :disabled="pagination.isFirst.value">Prev</button>
-*   <button @click="pagination.next()" :disabled="pagination.isLast.value">Next</button>
+*   <div>
+*     <p>Is hydrated: {{ hydration.isHydrated.value }}</p>
+*   </div>
 * </template>
 * ```
 */
-function usePagination(namespace = "v0:pagination") {
-	return useContext(namespace);
+function useHydration(namespace = "v0:hydration") {
+	const fallback = createFallbackHydration();
+	if (!getCurrentInstance()) return fallback;
+	try {
+		return useContext(namespace, fallback);
+	} catch {
+		return fallback;
+	}
 }
 
 //#endregion
-//#region src/composables/useSingle/index.ts
-/**
-* @module useSingle
-*
-* @remarks
-* Single-selection composable that extends useSelection to enforce only one selected item.
-*
-* Key features:
-* - Auto-clears previous selection when selecting new item
-* - Singular computed properties (selectedId, selectedItem, selectedIndex, selectedValue)
-* - Perfect for tabs, radio buttons, theme selectors
-*
-* Inheritance chain: useRegistry → useSelection → useSingle
-*/
+//#region src/composables/useResizeObserver/index.ts
 /**
-* Creates a new single selection instance that enforces only one selected item at a time.
-*
-* Extends `createSelection` by automatically clearing previous selections when a new item is selected.
-* Adds computed singular properties: `selectedId`, `selectedItem`, `selectedIndex`, `selectedValue`.
-*
-* @param options The options for the single selection instance.
-* @template Z The type of the single selection ticket.
-* @template E The type of the single selection context.
-* @returns A new single selection instance with single-selection enforcement.
-*
-* @remarks
-* **Key Differences from `createSelection`:**
-* - Automatically clears `selectedIds` before selecting a new item (enforces single selection)
-* - Provides singular computed properties instead of plural sets
-* - Perfect for tabs, radio buttons, theme selectors, and other single-choice UI components
-*
-* **Computed Properties:**
-* - `selectedId`: The ID of the selected item (undefined if none selected)
-* - `selectedItem`: The selected ticket object (undefined if none selected)
-* - `selectedIndex`: The index of the selected item (-1 if none selected)
-* - `selectedValue`: The value of the selected item (undefined if none selected)
+* A composable that uses the Resize Observer API to detect when an element's
+* size changes.
 *
-* **Inheritance Chain:**
-* `useRegistry` → `createSelection` → `createSingle` → `createStep`
+* @param target The element to observe.
+* @param callback The callback to execute when the element's size changes.
+* @param options The options for the Resize Observer.
+* @returns An object with methods to control the observer.
 *
-* @see https://0.vuetifyjs.com/composables/selection/use-single
+* @see https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver
+* @see https://0.vuetifyjs.com/composables/system/use-resize-observer
 *
 * @example
 * ```ts
-* import { createSingle } from '@vuetify/v0'
-*
-* const tabs = createSingle({ mandatory: true })
+* import { ref } from 'vue'
+* import { useResizeObserver } from '@vuetify/v0'
 *
-* tabs.onboard([
-*   { id: 'home', value: 'Home' },
-*   { id: 'about', value: 'About' },
-*   { id: 'contact', value: 'Contact' },
-* ])
+* const el = ref<HTMLElement>()
+* const width = ref(0)
+* const height = ref(0)
 *
-* tabs.first() // Select first tab
+* const { pause, resume, isPaused } = useResizeObserver(
+*   el,
+*   (entries) => {
+*     const entry = entries[0]
+*     if (entry) {
+*       width.value = entry.contentRect.width
+*       height.value = entry.contentRect.height
+*       console.log('Size changed:', width.value, 'x', height.value)
+*     }
+*   },
+*   { immediate: true }
+* )
 *
-* console.log(tabs.selectedId.value) // 'home'
-* console.log(tabs.selectedIndex.value) // 0
+* // Pause observation
+* pause()
 *
-* tabs.select('about') // Switch to about tab
-* console.log(tabs.selectedId.value) // 'about'
-* console.log(tabs.selectedIds.size) // 1 (always enforces single selection)
+* // Resume observation
+* resume()
 * ```
 */
-function createSingle(_options = {}) {
-	const { mandatory = false, multiple = false,...options } = _options;
-	const registry = createSelection({
-		...options,
-		mandatory,
-		multiple
+function useResizeObserver(target, callback, options = {}) {
+	const { isHydrated } = useHydration();
+	const observer = shallowRef();
+	const isPaused = shallowRef(false);
+	const isActive = toRef(() => !!observer.value);
+	function setup() {
+		if (observer.value === null) return;
+		if (!isHydrated.value || !SUPPORTS_OBSERVER || !target.value || isPaused.value) return;
+		observer.value = new ResizeObserver((entries) => {
+			callback(entries.map((entry) => ({
+				contentRect: {
+					width: entry.contentRect.width,
+					height: entry.contentRect.height,
+					top: entry.contentRect.top,
+					left: entry.contentRect.left
+				},
+				target: entry.target
+			})));
+			if (options.once) stop();
+		});
+		observer.value.observe(target.value, { box: options.box || "content-box" });
+		if (options.immediate) {
+			const rect = target.value.getBoundingClientRect();
+			callback([{
+				contentRect: {
+					width: rect.width,
+					height: rect.height,
+					top: rect.top,
+					left: rect.left
+				},
+				target: target.value
+			}]);
+		}
+	}
+	watchEffect(() => {
+		const hydrated = isHydrated.value;
+		const el = target.value;
+		cleanup();
+		if (hydrated && el) setup();
 	});
-	const selectedId = computed(() => registry.selectedIds.values().next().value);
-	const selectedItem = computed(() => registry.selectedItems.value.values().next().value);
-	const selectedIndex = computed(() => selectedItem.value?.index ?? -1);
-	const selectedValue = computed(() => selectedItem.value?.value);
-	function unselect(id) {
-		if (mandatory && registry.selectedIds.size === 1) return;
-		registry.selectedIds.delete(id);
+	function cleanup() {
+		if (observer.value) {
+			observer.value.disconnect();
+			observer.value = void 0;
+		}
 	}
-	function toggle(id) {
-		if (registry.selectedIds.has(id)) unselect(id);
-		else registry.select(id);
+	function pause() {
+		isPaused.value = true;
+		observer.value?.disconnect();
+	}
+	function resume() {
+		isPaused.value = false;
+		setup();
+	}
+	function stop() {
+		cleanup();
+		observer.value = null;
 	}
+	onScopeDispose(stop, true);
 	return {
-		...registry,
-		selectedId,
-		selectedItem,
-		selectedIndex,
-		selectedValue,
-		unselect,
-		toggle,
-		get size() {
-			return registry.size;
-		}
+		isActive: shallowReadonly(isActive),
+		isPaused: shallowReadonly(isPaused),
+		pause,
+		resume,
+		stop
 	};
 }
 /**
-* Creates a new single selection context.
+* A convenience composable that uses the Resize Observer API to track an
+* element's size.
 *
-* @param options The options for the single selection context.
-* @template Z The type of the single selection ticket.
-* @template E The type of the single selection context.
-* @returns A new single selection context.
+* @param target The element to observe.
+* @returns An object with the element's width and height.
 *
-* @see https://0.vuetifyjs.com/composables/selection/use-single
+* @see https://0.vuetifyjs.com/composables/system/use-resize-observer#use-element-size
 *
 * @example
 * ```ts
-* import { createSingleContext } from '@vuetify/v0'
-*
-* // With default namespace 'v0:single'
-* export const [useSingle, provideSingle, context] = createSingleContext()
+* import { ref, watchEffect } from 'vue'
+* import { useElementSize } from '@vuetify/v0'
 *
-* // In a parent component:
-* provideSingle()
+* const box = ref<HTMLElement>()
+* const { width, height } = useElementSize(box)
 *
-* // In a child component:
-* const single = useSingle()
-* single.select('tab-1')
+* // Width and height are reactive refs
+* watchEffect(() => {
+*   console.log('Box size:', width.value, 'x', height.value)
+* })
 * ```
 */
-function createSingleContext(_options = {}) {
-	const { namespace = "v0:single",...options } = _options;
-	const [useSingleContext, _provideSingleContext] = createContext(namespace);
-	const context = createSingle(options);
-	function provideSingleContext(_context = context, app) {
-		return _provideSingleContext(_context, app);
+function useElementSize(target) {
+	const width = shallowRef(0);
+	const height = shallowRef(0);
+	const { pause: _pause, resume, stop, isActive, isPaused } = useResizeObserver(target, (entries) => {
+		const entry = entries[0];
+		if (entry) {
+			width.value = entry.contentRect.width;
+			height.value = entry.contentRect.height;
+		}
+	}, { immediate: true });
+	function pause() {
+		width.value = 0;
+		height.value = 0;
+		_pause();
 	}
-	return createTrinity(useSingleContext, provideSingleContext, context);
+	return {
+		width,
+		height,
+		isActive,
+		isPaused,
+		pause,
+		resume,
+		stop
+	};
 }
+
+//#endregion
+//#region src/composables/useOverflow/index.ts
 /**
-* Returns the current single selection instance.
-*
-* @param namespace The namespace for the single selection context. Defaults to `'v0:single'`.
-* @returns The current single selection instance.
+* Creates a new overflow context for computing how many items fit in a container.
 *
-* @see https://0.vuetifyjs.com/composables/selection/use-single
+* @param options Configuration options
+* @returns Overflow context with container ref, capacity, and measurement functions
 *
-* @example
+* @example Variable-width mode (Breadcrumbs)
 * ```vue
-* <script setup lang="ts">
-*   import { useSingle } from '@vuetify/v0'
+* <script lang="ts" setup>
+*   import { useTemplateRef } from 'vue'
+*   import { createOverflow } from '@vuetify/v0'
 *
-*   const tabs = useSingle()
+*   const containerRef = useTemplateRef('container')
+*   const overflow = createOverflow({
+*     container: containerRef,
+*     gap: 8,
+*     reserved: 40,
+*   })
 * <\/script>
 *
 * <template>
-*   <div>
-*     <p>Selected: {{ tabs.selectedId }}</p>
+*   <div ref="container">
+*     <span
+*       v-for="(item, i) in items.slice(0, overflow.capacity.value)"
+*       :key="i"
+*       :ref="el => overflow.measure(i, el)"
+*     >
+*       {{ item }}
+*     </span>
+*     <span v-if="overflow.isOverflowing.value">...</span>
 *   </div>
 * </template>
 * ```
-*/
-function useSingle(namespace = "v0:single") {
-	return useContext(namespace);
-}
-
-//#endregion
-//#region src/composables/useTokens/index.ts
-/**
-* @module useTokens
-*
-* @see https://0.vuetifyjs.com/composables/registration/use-tokens
 *
-* @remarks
-* Design token registry with alias resolution and W3C Design Tokens format support.
-*
-* Key features:
-* - Alias resolution with circular reference detection
-* - Nested token flattening with dot notation
-* - W3C Design Tokens format ($value, $type, $description, $extensions)
-* - Path-based resolution (e.g., {colors}.blue.500)
-* - Resolution caching for performance (~28,590 ops/sec)
-*
-* Used by useTheme, useLocale, and useFeatures for token-based configuration.
-*/
-/**
-* Creates a new token instance.
-*
-* @param tokens The tokens to use.
-* @param options The options for the token instance.
-* @template Z The type of the token ticket.
-* @template E The type of the token context.
-* @returns A new token instance.
-*
-* @see https://www.designtokens.org/tr/drafts/format/
-* @see https://0.vuetifyjs.com/composables/registration/use-tokens
-*
-* @example
+* @example Uniform-width mode (Pagination)
 * ```ts
-* import { useTokens } from '@vuetify/v0'
-*
-* const tokens = useTokens({
-*   colors: {
-*     primary: '#3b82f6',
-*     secondary: '{colors.primary}', // Alias reference
-*   },
+* const overflow = createOverflow({
+*   container: () => atom.value?.element,
+*   itemWidth: buttonWidth,
+*   reserved: () => buttonWidth.value * 4,
 * })
-*
-* console.log(tokens.resolve('{colors.primary}')) // '#3b82f6'
-* console.log(tokens.resolve('{colors.secondary}')) // '#3b82f6'
 * ```
 */
-function createTokens(tokens = {}, options = {}) {
-	const logger = useLogger();
-	const registry = useRegistry(options);
-	const cache = /* @__PURE__ */ new Map();
-	registry.onboard(flatten(tokens, options.prefix, !!options.flat));
-	function isAlias(token) {
-		return /* @__PURE__ */ isString(token) && token.length > 2 && token[0] === "{" && token.at(-1) === "}";
-	}
-	function isTokenAlias(value) {
-		return /* @__PURE__ */ isObject(value) && "$value" in value;
-	}
-	function resolve(token, visited = /* @__PURE__ */ new Set()) {
-		const cacheKey = /* @__PURE__ */ isString(token) ? token : JSON.stringify(token);
-		const cached = cache.get(cacheKey);
-		if (!/* @__PURE__ */ isUndefined(cached)) return cached;
-		const reference = isTokenAlias(token) ? token.$value : token;
-		const isAliasReference = /* @__PURE__ */ isString(reference) && isAlias(reference);
-		const clean = isAliasReference ? reference.slice(1, -1) : String(reference);
-		if (visited.has(clean)) {
-			logger.warn(`Circular alias detected for "${clean}"`);
-			cache.set(cacheKey, void 0);
-			return;
-		}
-		visited.add(clean);
-		let found = registry.get(clean);
-		let segments = [];
-		if (!found && clean.includes(".")) {
-			const parts = clean.split(".");
-			for (let i = parts.length - 1; i > 0; i--) {
-				const prefix = parts.slice(0, i).join(".");
-				const suffix = parts.slice(i);
-				const candidate = registry.get(prefix);
-				if (!/* @__PURE__ */ isUndefined(candidate?.value)) {
-					found = candidate;
-					segments = suffix;
-					break;
-				}
+function createOverflow(options = {}) {
+	const { container: _container, gap = 0, reserved = 0, itemWidth, reverse } = options;
+	const container = /* @__PURE__ */ isUndefined(_container) ? shallowRef() : toRef(_container);
+	const widths = shallowRef(/* @__PURE__ */ new Map());
+	const { width } = useElementSize(container);
+	function measure(index, el) {
+		if (!el) {
+			if (widths.value.has(index)) {
+				const next = new Map(widths.value);
+				next.delete(index);
+				widths.value = next;
 			}
-		}
-		if (/* @__PURE__ */ isUndefined(found?.value)) {
-			if (isAliasReference) logger.warn(`Alias not found for "${String(reference)}"`);
-			cache.set(cacheKey, void 0);
 			return;
 		}
-		let result;
-		let current = found.value;
-		if (segments.length > 0) {
-			if (isTokenAlias(current)) current = current.$value;
-			for (const segment of segments) {
-				if (!/* @__PURE__ */ isObject(current) || !(segment in current)) {
-					current = void 0;
-					break;
-				}
-				current = current[segment];
-				if (isTokenAlias(current)) current = current.$value;
-			}
-			if (/* @__PURE__ */ isUndefined(current)) {
-				logger.warn(`Path not found inside "${clean}": ${segments.join(".")}`);
-				cache.set(cacheKey, void 0);
-				return;
-			}
-			result = current;
-		} else if (isTokenAlias(current)) {
-			const inner = current.$value;
-			if (/* @__PURE__ */ isString(inner) && isAlias(inner)) return resolve(inner, visited);
-			result = inner;
-		} else if (/* @__PURE__ */ isString(current) && isAlias(current)) return resolve(current, visited);
-		else result = current;
-		cache.set(cacheKey, result);
-		return result;
+		const style = getComputedStyle(el);
+		const marginX = Number.parseFloat(style.marginLeft) + Number.parseFloat(style.marginRight);
+		const w = el.offsetWidth + marginX;
+		if (widths.value.get(index) !== w) widths.value = new Map(widths.value).set(index, w);
 	}
-	return {
-		...registry,
-		resolve,
-		isAlias,
-		get size() {
-			return registry.size;
+	function reset() {
+		widths.value = /* @__PURE__ */ new Map();
+	}
+	const total = computed(() => {
+		const g = toValue(gap);
+		let sum = 0;
+		let count = 0;
+		for (const w of widths.value.values()) {
+			sum += w + (count > 0 ? g : 0);
+			count++;
 		}
+		return sum;
+	});
+	return {
+		container,
+		width,
+		capacity: computed(() => {
+			const available = width.value - toValue(reserved);
+			if (width.value === 0) return Infinity;
+			if (available <= 0) return 0;
+			const g = toValue(gap);
+			const uniformWidth = toValue(itemWidth);
+			if (uniformWidth && uniformWidth > 0) {
+				const first = uniformWidth;
+				const subsequent = uniformWidth + g;
+				if (available < first) return 0;
+				return Math.max(1, Math.floor((available - first) / subsequent) + 1);
+			}
+			const entries = [...widths.value.entries()].toSorted((a, b) => a[0] - b[0]);
+			if (toValue(reverse)) entries.reverse();
+			let sum = 0;
+			let count = 0;
+			for (const [, w] of entries) {
+				const next = sum + w + (count > 0 ? g : 0);
+				if (next > available) break;
+				sum = next;
+				count++;
+			}
+			return count;
+		}),
+		total,
+		isOverflowing: toRef(() => {
+			return total.value > width.value - toValue(reserved);
+		}),
+		measure,
+		reset
 	};
 }
 /**
-* Creates a new token context.
-*
-* @param namespace The namespace for the token context.
-* @param tokens The tokens to use.
-* @template Z The type of the token ticket.
-* @template E The type of the token context.
-* @returns A new token context.
+* Creates an overflow context with dependency injection support.
 *
-* @see https://0.vuetifyjs.com/composables/registration/use-tokens
+* @param options Configuration options including namespace
+* @returns Trinity tuple: [useContext, provideContext, defaultContext]
 *
 * @example
 * ```ts
-* import { createTokensContext } from '@vuetify/v0'
-*
-* export const [useTokens, provideTokens, context] = createTokensContext({
-*  namespace: 'v0:tokens',
-*  tokens: {
-*    colors: {
-*      primary: '#3b82f6',
-*      secondary: '{colors.primary}', // Alias reference
-*    },
-*  },
+* // Create injectable context
+* const [useOverflow, provideOverflow, overflow] = createOverflowContext({
+*   namespace: 'my-overflow',
+*   gap: 8,
+*   reserved: 160,
 * })
+*
+* // In parent component
+* provideOverflow()
+*
+* // In child component
+* const overflow = useOverflow()
 * ```
 */
-function createTokensContext(_options) {
-	const { namespace = "v0:tokens", tokens = {},...options } = _options;
-	const [useTokensContext, _provideTokensContext] = createContext(namespace);
-	const context = createTokens(tokens, options);
-	function provideTokensContext(_context = context, app) {
-		return _provideTokensContext(_context, app);
+function createOverflowContext(_options = {}) {
+	const { namespace = "v0:overflow", ...options } = _options;
+	const [useOverflowContext, _provideOverflowContext] = createContext(namespace);
+	const context = createOverflow(options);
+	function provideOverflowContext(_context = context, app) {
+		return _provideOverflowContext(_context, app);
 	}
-	return createTrinity(useTokensContext, provideTokensContext, context);
+	return createTrinity(useOverflowContext, provideOverflowContext, context);
 }
 /**
-* Returns the current tokens instance.
-*
-* @param namespace The namespace for the tokens context. Defaults to `'v0:tokens'`.
-* @returns The current tokens instance.
+* Returns the current overflow context from dependency injection.
 *
-* @see https://0.vuetifyjs.com/composables/registration/use-tokens
+* @param namespace The namespace for the overflow context. Defaults to `v0:overflow`.
+* @returns The current overflow context.
 *
 * @example
 * ```vue
-* <script setup lang="ts">
-*   import { useTokens } from '@vuetify/v0'
+* <script lang="ts" setup>
+*   import { useOverflow } from '@vuetify/v0'
 *
-*   const tokens = useTokens()
+*   // Inject overflow context provided by parent
+*   const overflow = useOverflow()
 * <\/script>
+*
+* <template>
+*   <div>
+*     <p>Capacity: {{ overflow.capacity.value }}</p>
+*   </div>
+* </template>
 * ```
 */
-function useTokens(namespace = "v0:tokens") {
+function useOverflow(namespace = "v0:overflow") {
 	return useContext(namespace);
 }
-/**
-* Flattens a nested collection of tokens into a flat array of tokens.
-* Each token is represented by an object containing its ID & value.
-* @param tokens The collection of tokens to flatten.
-* @param prefix An optional prefix to prepend to each token ID.
-* @returns An array of flattened tokens, each with an ID and value.
-*/
-function flatten(tokens, prefix = "", flat = false) {
-	const flattened = [];
-	const stack = [{
-		tokens,
-		prefix,
-		flat
-	}];
-	while (stack.length > 0) {
-		const { tokens: currentTokens, prefix: currentPrefix, flat: flat$1 } = stack.pop();
-		const meta = {};
-		for (const k in currentTokens) if (k.startsWith("$")) meta[k] = currentTokens[k];
-		if (Object.keys(meta).length > 0 && currentPrefix) flattened.push({
-			id: currentPrefix,
-			value: meta
-		});
-		for (const key in currentTokens) {
-			if (key.startsWith("$")) continue;
-			const value = currentTokens[key];
-			const id = currentPrefix ? `${currentPrefix}.${key}` : key;
-			if (!/* @__PURE__ */ isObject(value)) {
-				flattened.push({
-					id,
-					value
-				});
-				continue;
-			}
-			if ("$value" in value) {
-				flattened.push({
-					id,
-					value
-				});
-				const inner = value.$value;
-				if (/* @__PURE__ */ isObject(inner) && !flat$1) for (const innerKey in inner) {
-					if (innerKey.startsWith("$")) continue;
-					const child = inner[innerKey];
-					const childId = `${id}.${innerKey}`;
-					if (!/* @__PURE__ */ isObject(child)) flattened.push({
-						id: childId,
-						value: child
-					});
-					else if ("$value" in child) flattened.push({
-						id: childId,
-						value: child
-					});
-					else stack.push({
-						tokens: child,
-						prefix: childId,
-						flat: flat$1
-					});
-				}
-				continue;
-			}
-			if (flat$1) {
-				flattened.push({
-					id,
-					value
-				});
-				continue;
-			}
-			stack.push({
-				tokens: value,
-				prefix: id,
-				flat: flat$1
-			});
-		}
-	}
-	return flattened;
-}
-
-//#endregion
-//#region src/composables/useLocale/adapters/v0.ts
-/**
-* Vuetify0.x locale adapter implementation
-*
-* This adapter provides translation and number formatting
-* capabilities using the Intl API and supports both
-* numbered ({0}, {1}) and named ({name}) variables in translation strings.
-*/
-var Vuetify0LocaleAdapter = class {
-	t(message, ...params) {
-		let resolvedMessage = message;
-		if (params.length > 0 && /* @__PURE__ */ isObject(params[0])) {
-			const variables = params[0];
-			resolvedMessage = resolvedMessage.replace(/{([a-zA-Z][a-zA-Z0-9_]*)}/g, (match, name) => {
-				return /* @__PURE__ */ isUndefined(variables[name]) ? match : String(variables[name]);
-			});
-			params = params.slice(1);
-		}
-		resolvedMessage = resolvedMessage.replace(/\{(\d+)\}/g, (match, index) => {
-			const idx = Number.parseInt(index, 10);
-			if (!/* @__PURE__ */ isUndefined(params[idx])) return String(params[idx]);
-			return match;
-		});
-		return resolvedMessage;
-	}
-	n(value, locale, ...params) {
-		if (!IN_BROWSER || !locale) return value.toString();
-		const options = params[0];
-		return new Intl.NumberFormat(String(locale), options).format(value);
-	}
-};
 
 //#endregion
-//#region src/composables/useLocale/index.ts
+//#region src/composables/usePagination/index.ts
 /**
-* @module useLocale
-*
-* @remarks
-* Internationalization (i18n) composable with adapter pattern for message translation.
+* Creates a pagination instance.
 *
-* Key features:
-* - Locale selection with createSingle
-* - Token-based message storage with useTokens
-* - Numbered and named placeholder support ({0}, {name})
-* - Number formatting with Intl.NumberFormat
-* - Adapter pattern for integration with i18n providers
+* @param options The options for the pagination instance.
+* @returns A pagination context with navigation methods.
 *
-* Integrates with createSingle for locale selection and useTokens for message resolution.
-*/
-/**
-* Creates a new locale instance.
+* @example
+* ```ts
+* import { createPagination } from '@vuetify/v0'
 *
-* @param options The options for the locale instance.
-* @template Z The type of the locale ticket.
-* @template E The type of the locale context.
-* @returns A new locale instance.
+* // Basic usage
+* const pagination = createPagination({ size: 100 })
+* pagination.next()
+* pagination.items.value // [{ type: 'page', value: 1 }, { type: 'page', value: 2 }, ...]
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-locale
+* // With v-model (pass a ref)
+* const page = ref(1)
+* const pagination = createPagination({ page, size: 100 })
+* // Mutating pagination.page or the passed ref syncs both
+* ```
 */
-function createLocale(_options = {}) {
-	const { adapter = new Vuetify0LocaleAdapter(), messages = {},...options } = _options;
-	const tokens = createTokens(messages);
-	const registry = createSingle(options);
-	for (const id in messages) {
-		registry.register({ id });
-		if (id === options.default && !registry.selectedId.value) registry.select(id);
+function createPagination(_options = {}) {
+	const { page: _page = 1, itemsPerPage: _itemsPerPage = 10, size: _size = 0, visible: _visible = 7, ellipsis = "..." } = _options;
+	const page = isRef(_page) ? _page : shallowRef(_page);
+	const pages = computed(() => {
+		const size = toValue(_size);
+		const perPage = toValue(_itemsPerPage);
+		if (size <= 0 || /* @__PURE__ */ isNaN(size)) return 0;
+		return Math.ceil(size / perPage);
+	});
+	function first() {
+		page.value = 1;
 	}
-	function t(key, params, fallback) {
-		const locale = registry.selectedId.value;
-		const args = toArray(params);
-		if (!locale) return adapter.t(fallback ?? key, ...args);
-		const path = `${locale}.${key}`;
-		const message = tokens.get(path)?.value;
-		const template = /* @__PURE__ */ isString(message) ? resolve(locale, message) : fallback ?? key;
-		return adapter.t(template, ...args);
+	function last() {
+		page.value = Math.max(1, pages.value);
+	}
+	function next() {
+		if (page.value < pages.value) page.value++;
+	}
+	function prev() {
+		if (page.value > 1) page.value--;
+	}
+	function select(value) {
+		if (value < 1) page.value = 1;
+		else if (value > pages.value) page.value = Math.max(1, pages.value);
+		else page.value = value;
+	}
+	const isFirst = computed(() => page.value <= 1);
+	const isLast = computed(() => page.value >= pages.value);
+	const pageStart = computed(() => (page.value - 1) * toValue(_itemsPerPage));
+	const pageStop = computed(() => Math.min(pageStart.value + toValue(_itemsPerPage), toValue(_size)));
+	function toPage(value) {
+		return {
+			type: "page",
+			value
+		};
 	}
-	function n(value, ...params) {
-		return adapter.n(value, registry.selectedId.value, ...params);
+	function toEllipsis() {
+		return ellipsis === false ? false : {
+			type: "ellipsis",
+			value: ellipsis
+		};
 	}
-	function resolve(locale, str) {
-		return str.replace(/{([a-zA-Z0-9.-_]+)}/g, (match, key) => {
-			const [prefix, ...rest] = key.split(".");
-			const target = registry.has(prefix) ? prefix : locale;
-			const path = `${target}.${registry.has(prefix) ? rest.join(".") : key}`;
-			const resolved = tokens.get(path)?.value;
-			if (/* @__PURE__ */ isString(resolved)) return resolve(target, resolved);
-			return match;
-		});
+	function filter(array) {
+		return array.filter((item) => item !== false);
 	}
 	return {
-		...registry,
-		t,
-		n,
+		page,
+		ellipsis,
+		items: computed(() => {
+			const pageCount = pages.value;
+			const visible = toValue(_visible);
+			const current = page.value;
+			if (pageCount <= 0 || /* @__PURE__ */ isNaN(pageCount) || pageCount > Number.MAX_SAFE_INTEGER) return [];
+			if (visible <= 0) return [];
+			if (visible <= 2) return [toPage(current)];
+			if (pageCount <= visible) return (/* @__PURE__ */ range(pageCount, 1)).map(toPage);
+			if (visible === 3) {
+				const mid = current <= 1 ? 2 : current >= pageCount ? pageCount - 1 : current;
+				return [
+					toPage(1),
+					toPage(mid),
+					toPage(pageCount)
+				];
+			}
+			const boundary = visible - 2;
+			const middle = visible - 4;
+			if (middle <= 0) {
+				if (current <= boundary) return filter([
+					...(/* @__PURE__ */ range(boundary, 1)).map(toPage),
+					toEllipsis(),
+					toPage(pageCount)
+				]);
+				if (current > pageCount - boundary) return filter([
+					toPage(1),
+					toEllipsis(),
+					...(/* @__PURE__ */ range(boundary, pageCount - boundary + 1)).map(toPage)
+				]);
+				return current <= Math.ceil(pageCount / 2) ? filter([
+					toPage(1),
+					toPage(current),
+					toEllipsis(),
+					toPage(pageCount)
+				]) : filter([
+					toPage(1),
+					toEllipsis(),
+					toPage(current),
+					toPage(pageCount)
+				]);
+			}
+			const leftThreshold = boundary - 1;
+			const rightThreshold = pageCount - boundary + 2;
+			if (current <= leftThreshold) return filter([
+				...(/* @__PURE__ */ range(boundary, 1)).map(toPage),
+				toEllipsis(),
+				toPage(pageCount)
+			]);
+			else if (current >= rightThreshold) return filter([
+				toPage(1),
+				toEllipsis(),
+				...(/* @__PURE__ */ range(boundary, pageCount - boundary + 1)).map(toPage)
+			]);
+			else {
+				const start = current - Math.floor(middle / 2);
+				return filter([
+					toPage(1),
+					toEllipsis(),
+					...(/* @__PURE__ */ range(middle, start)).map(toPage),
+					toEllipsis(),
+					toPage(pageCount)
+				]);
+			}
+		}),
+		pageStart,
+		pageStop,
+		isFirst,
+		isLast,
+		first,
+		last,
+		next,
+		prev,
+		select,
+		get itemsPerPage() {
+			return toValue(_itemsPerPage);
+		},
 		get size() {
-			return registry.size;
+			return toValue(_size);
+		},
+		get pages() {
+			return pages.value;
 		}
 	};
 }
-function createLocaleFallback() {
-	return {
-		size: 0,
-		t: (key, _params, fallback) => fallback ?? key,
-		n: String
-	};
-}
 /**
-* Creates a new locale context.
-*
-* @param options The options for the locale context.
-* @template Z The type of the locale ticket.
-* @template E The type of the locale context.
-* @returns A new locale context.
+* Creates a pagination context for dependency injection.
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-locale
+* @param options The options including namespace.
+* @returns A trinity: [usePagination, providePagination, defaultContext]
 *
 * @example
 * ```ts
-* import { createLocaleContext } from '@vuetify/v0'
+* // With default namespace 'v0:pagination'
+* const [usePagination, providePaginationContext] = createPaginationContext({ size: 50 })
 *
-* export const [useAppLocale, provideAppLocale, appLocale] = createLocaleContext({
-*   namespace: 'app:locale',
-*   messages: {
-*     en: { hello: 'Hello' },
-*     es: { hello: 'Hola' },
-*   },
+* // Or with custom namespace
+* const [usePagination, providePaginationContext] = createPaginationContext({
+*   namespace: 'my-pagination',
+*   size: 50,
 * })
 *
-* // In a parent component:
-* provideAppLocale()
+* // Parent component
+* providePaginationContext()
 *
-* // In a child component:
-* const locale = useAppLocale()
-* locale.select('es')
+* // Child component
+* const pagination = usePagination()
+* pagination.next()
 * ```
 */
-function createLocaleContext(_options = {}) {
-	const { namespace = "v0:locale",...options } = _options;
-	const [useLocaleContext, _provideLocaleContext] = createContext(namespace);
-	const context = createLocale(options);
-	function provideLocaleContext(_context = context, app) {
-		return _provideLocaleContext(_context, app);
+function createPaginationContext(_options = {}) {
+	const { namespace = "v0:pagination", ...options } = _options;
+	const [usePaginationContext, _providePaginationContext] = createContext(namespace);
+	const context = createPagination(options);
+	function providePaginationContext(_context = context, app) {
+		return _providePaginationContext(_context, app);
 	}
-	return createTrinity(useLocaleContext, provideLocaleContext, context);
+	return createTrinity(usePaginationContext, providePaginationContext, context);
 }
 /**
-* Creates a new locale plugin.
+* Returns the current pagination instance from context.
 *
-* @param options The options for the locale plugin.
-* @template Z The type of the locale ticket.
-* @template E The type of the locale context.
-* @template R The type of the token ticket.
-* @template O The type of the token context.
-* @returns A new locale plugin.
+* @param namespace The namespace. @default 'v0:pagination'
+* @returns The pagination context.
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-locale
-*/
-function createLocalePlugin(_options = {}) {
-	const { namespace = "v0:locale", adapter = new Vuetify0LocaleAdapter(), messages = {},...options } = _options;
-	const [, provideLocaleContext, context] = createLocaleContext({
-		...options,
-		namespace,
-		adapter,
-		messages
-	});
-	return createPlugin({
-		namespace,
-		provide: (app) => {
-			provideLocaleContext(context, app);
-		}
-	});
-}
-/**
-* Returns the current locale instance.
+* @example
+* ```vue
+* <script setup lang="ts">
+*  import { usePagination } from '@vuetify/v0'
 *
-* @returns The current locale instance.
+*  const pagination = usePagination()
+* <\/script>
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-locale
+* <template>
+*   <button @click="pagination.prev()" :disabled="pagination.isFirst.value">Prev</button>
+*   <button @click="pagination.next()" :disabled="pagination.isLast.value">Next</button>
+* </template>
+* ```
 */
-function useLocale(namespace = "v0:locale") {
-	const fallback = createLocaleFallback();
-	if (!getCurrentInstance()) return fallback;
-	try {
-		return useContext(namespace, fallback);
-	} catch {
-		return fallback;
-	}
+function usePagination(namespace = "v0:pagination") {
+	return useContext(namespace);
 }
 
 //#endregion
@@ -3700,7 +3763,7 @@ function useLocale(namespace = "v0:locale") {
 const [usePaginationRoot, providePaginationRoot] = createContext();
 const [usePaginationControls, providePaginationControls] = createContext({ suffix: "controls" });
 const [usePaginationItems, providePaginationItems] = createContext({ suffix: "items" });
-const _sfc_main$15 = /* @__PURE__ */ defineComponent({
+const _sfc_main$16 = /* @__PURE__ */ defineComponent({
 	name: "PaginationRoot",
 	__name: "PaginationRoot",
 	props: /* @__PURE__ */ mergeModels({
@@ -3748,7 +3811,7 @@ const _sfc_main$15 = /* @__PURE__ */ defineComponent({
 			page,
 			visible: computed(() => {
 				const totalCap = overflow.capacity.value;
-				if (totalCap === Infinity) return __props.totalVisible ?? Infinity;
+				if (totalCap === Infinity) return __props.totalVisible ?? 7;
 				const pageCap = Math.max(0, totalCap - controls.size);
 				const noVisible = /* @__PURE__ */ isNullOrUndefined(__props.totalVisible);
 				if (pageCap > 0) return noVisible ? pageCap : Math.min(__props.totalVisible, pageCap);
@@ -3773,7 +3836,10 @@ const _sfc_main$15 = /* @__PURE__ */ defineComponent({
 			next: pagination.next,
 			prev: pagination.prev,
 			select: pagination.select,
-			attrs: { "aria-label": locale.t("Pagination.label", void 0, "Pagination") }
+			attrs: {
+				"aria-label": locale.t("Pagination.label", void 0, "Pagination"),
+				"role": __props.as === "nav" ? void 0 : "navigation"
+			}
 		}));
 		providePaginationRoot(__props.namespace, pagination);
 		providePaginationControls(__props.namespace, controls);
@@ -3792,11 +3858,11 @@ const _sfc_main$15 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var PaginationRoot_default = _sfc_main$15;
+var PaginationRoot_default = _sfc_main$16;
 
 //#endregion
 //#region src/components/Pagination/PaginationEllipsis.vue
-const _sfc_main$14 = /* @__PURE__ */ defineComponent({
+const _sfc_main$15 = /* @__PURE__ */ defineComponent({
 	name: "PaginationEllipsis",
 	__name: "PaginationEllipsis",
 	props: {
@@ -3837,11 +3903,11 @@ const _sfc_main$14 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var PaginationEllipsis_default = _sfc_main$14;
+var PaginationEllipsis_default = _sfc_main$15;
 
 //#endregion
 //#region src/components/Pagination/PaginationFirst.vue
-const _sfc_main$13 = /* @__PURE__ */ defineComponent({
+const _sfc_main$14 = /* @__PURE__ */ defineComponent({
 	name: "PaginationFirst",
 	__name: "PaginationFirst",
 	props: {
@@ -3873,9 +3939,10 @@ const _sfc_main$13 = /* @__PURE__ */ defineComponent({
 			first,
 			attrs: {
 				"aria-label": locale.t("Pagination.first", void 0, "Go to first page"),
-				"aria-disabled": __props.as === "button" ? void 0 : isDisabled.value,
+				"aria-disabled": isDisabled.value,
 				"data-disabled": isDisabled.value || void 0,
 				"disabled": __props.as === "button" ? isDisabled.value : void 0,
+				"tabindex": isDisabled.value ? -1 : 0,
 				"type": __props.as === "button" ? "button" : void 0,
 				"onClick": first
 			}
@@ -3895,11 +3962,11 @@ const _sfc_main$13 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var PaginationFirst_default = _sfc_main$13;
+var PaginationFirst_default = _sfc_main$14;
 
 //#endregion
 //#region src/components/Pagination/PaginationItem.vue
-const _sfc_main$12 = /* @__PURE__ */ defineComponent({
+const _sfc_main$13 = /* @__PURE__ */ defineComponent({
 	name: "PaginationItem",
 	__name: "PaginationItem",
 	props: {
@@ -3941,9 +4008,11 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
 			attrs: {
 				"aria-label": ariaLabel.value,
 				"aria-current": isSelected.value ? "page" : void 0,
+				"aria-disabled": __props.disabled,
 				"data-selected": isSelected.value || void 0,
 				"data-disabled": __props.disabled || void 0,
 				"disabled": __props.as === "button" ? __props.disabled : void 0,
+				"tabindex": __props.disabled ? -1 : 0,
 				"type": __props.as === "button" ? "button" : void 0,
 				"onClick": select
 			}
@@ -3957,17 +4026,17 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
 				as: __props.as,
 				renderless: __props.renderless
 			}), {
-				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotProps.value)))]),
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotProps.value)), () => [createTextVNode(toDisplayString(__props.value), 1)])]),
 				_: 3
 			}, 16, ["as", "renderless"]);
 		};
 	}
 });
-var PaginationItem_default = _sfc_main$12;
+var PaginationItem_default = _sfc_main$13;
 
 //#endregion
 //#region src/components/Pagination/PaginationLast.vue
-const _sfc_main$11 = /* @__PURE__ */ defineComponent({
+const _sfc_main$12 = /* @__PURE__ */ defineComponent({
 	name: "PaginationLast",
 	__name: "PaginationLast",
 	props: {
@@ -3999,9 +4068,10 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
 			last,
 			attrs: {
 				"aria-label": locale.t("Pagination.last", void 0, "Go to last page"),
-				"aria-disabled": __props.as === "button" ? void 0 : isDisabled.value,
+				"aria-disabled": isDisabled.value,
 				"data-disabled": isDisabled.value || void 0,
 				"disabled": __props.as === "button" ? isDisabled.value : void 0,
+				"tabindex": isDisabled.value ? -1 : 0,
 				"type": __props.as === "button" ? "button" : void 0,
 				"onClick": last
 			}
@@ -4021,11 +4091,11 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var PaginationLast_default = _sfc_main$11;
+var PaginationLast_default = _sfc_main$12;
 
 //#endregion
 //#region src/components/Pagination/PaginationNext.vue
-const _sfc_main$10 = /* @__PURE__ */ defineComponent({
+const _sfc_main$11 = /* @__PURE__ */ defineComponent({
 	name: "PaginationNext",
 	__name: "PaginationNext",
 	props: {
@@ -4057,9 +4127,10 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
 			next,
 			attrs: {
 				"aria-label": locale.t("Pagination.next", void 0, "Go to next page"),
-				"aria-disabled": __props.as === "button" ? void 0 : isDisabled.value,
+				"aria-disabled": isDisabled.value,
 				"data-disabled": isDisabled.value || void 0,
 				"disabled": __props.as === "button" ? isDisabled.value : void 0,
+				"tabindex": isDisabled.value ? -1 : 0,
 				"type": __props.as === "button" ? "button" : void 0,
 				"onClick": next
 			}
@@ -4079,11 +4150,11 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
 		};
 	}
 });
-var PaginationNext_default = _sfc_main$10;
+var PaginationNext_default = _sfc_main$11;
 
 //#endregion
 //#region src/components/Pagination/PaginationPrev.vue
-const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+const _sfc_main$10 = /* @__PURE__ */ defineComponent({
 	name: "PaginationPrev",
 	__name: "PaginationPrev",
 	props: {
@@ -4115,32 +4186,84 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
 			prev,
 			attrs: {
 				"aria-label": locale.t("Pagination.prev", void 0, "Go to previous page"),
-				"aria-disabled": __props.as === "button" ? void 0 : isDisabled.value,
+				"aria-disabled": isDisabled.value,
 				"data-disabled": isDisabled.value || void 0,
 				"disabled": __props.as === "button" ? isDisabled.value : void 0,
+				"tabindex": isDisabled.value ? -1 : 0,
 				"type": __props.as === "button" ? "button" : void 0,
 				"onClick": prev
 			}
 		}));
-		onBeforeUnmount(() => controls.unregister(__props.id));
+		onBeforeUnmount(() => controls.unregister(__props.id));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(Atom_default), mergeProps({
+				ref_key: "atom",
+				ref: atom
+			}, slotProps.value.attrs, {
+				as: __props.as,
+				renderless: __props.renderless
+			}), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotProps.value)))]),
+				_: 3
+			}, 16, ["as", "renderless"]);
+		};
+	}
+});
+var PaginationPrev_default = _sfc_main$10;
+
+//#endregion
+//#region src/components/Pagination/PaginationStatus.vue
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+	name: "PaginationStatus",
+	__name: "PaginationStatus",
+	props: {
+		namespace: { default: "v0:pagination" },
+		as: { default: "div" },
+		renderless: { type: Boolean }
+	},
+	setup(__props) {
+		const locale = useLocale();
+		const pagination = usePaginationRoot(__props.namespace);
+		const text = shallowRef("");
+		watch(() => pagination.page.value, (page, prevPage) => {
+			if (prevPage === void 0) return;
+			setTimeout(() => {
+				text.value = locale.t("Pagination.status", {
+					page,
+					pages: pagination.pages
+				}, `Page ${page} of ${pagination.pages}`);
+			}, 100);
+		});
+		const slotProps = toRef(() => ({
+			page: pagination.page.value,
+			pages: pagination.pages,
+			text: text.value,
+			attrs: {
+				"aria-atomic": true,
+				"aria-live": "polite",
+				"role": "status"
+			}
+		}));
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(Atom_default), mergeProps({
-				ref_key: "atom",
-				ref: atom
-			}, slotProps.value.attrs, {
+			return openBlock(), createBlock(unref(Atom_default), mergeProps(slotProps.value.attrs, {
 				as: __props.as,
 				renderless: __props.renderless
 			}), {
-				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotProps.value)))]),
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotProps.value)), () => [createTextVNode(toDisplayString(text.value), 1)])]),
 				_: 3
 			}, 16, ["as", "renderless"]);
 		};
 	}
 });
-var PaginationPrev_default = _sfc_main$9;
+var PaginationStatus_default = _sfc_main$9;
 
 //#endregion
 //#region src/components/Pagination/index.ts
+/**
+* Pagination component with sub-components for building pagination controls.
+*
+* @see https://0.vuetifyjs.com/components/pagination
+*/
 const Pagination = {
 	Root: PaginationRoot_default,
 	Item: PaginationItem_default,
@@ -4148,7 +4271,8 @@ const Pagination = {
 	Prev: PaginationPrev_default,
 	Ellipsis: PaginationEllipsis_default,
 	Next: PaginationNext_default,
-	Last: PaginationLast_default
+	Last: PaginationLast_default,
+	Status: PaginationStatus_default
 };
 
 //#endregion
@@ -4295,6 +4419,11 @@ var PopoverContent_default = _sfc_main$6;
 
 //#endregion
 //#region src/components/Popover/index.ts
+/**
+* Popover component with sub-components for building popovers.
+*
+* @see https://0.vuetifyjs.com/components/popover
+*/
 const Popover = {
 	Root: PopoverRoot_default,
 	Anchor: PopoverAnchor_default,
@@ -4329,7 +4458,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
 		"modelValue": {},
 		"modelModifiers": {}
 	}),
-	emits: ["update:modelValue"],
+	emits: /* @__PURE__ */ mergeModels(["update:model-value"], ["update:modelValue"]),
 	setup(__props) {
 		const model = useModel(__props, "modelValue");
 		const selection = createSelection({
@@ -4404,6 +4533,11 @@ var SelectionItem_default = _sfc_main$4;
 
 //#endregion
 //#region src/components/Selection/index.ts
+/**
+* Selection component with sub-components for managing item selection state.
+*
+* @see https://0.vuetifyjs.com/components/selection
+*/
 const Selection = {
 	Root: SelectionRoot_default,
 	Item: SelectionItem_default
@@ -4506,6 +4640,11 @@ var SingleItem_default = _sfc_main$2;
 
 //#endregion
 //#region src/components/Single/index.ts
+/**
+* Single component with sub-components for building single-selection interfaces.
+*
+* @see https://0.vuetifyjs.com/components/single
+*/
 const Single = {
 	Root: SingleRoot_default,
 	Item: SingleItem_default
@@ -4514,20 +4653,6 @@ const Single = {
 //#endregion
 //#region src/composables/useStep/index.ts
 /**
-* @module useStep
-*
-* @remarks
-* Navigation composable that extends useSingle with first/last/next/prev/step methods.
-*
-* Key features:
-* - Configurable circular or bounded navigation
-* - Automatic disabled item skipping
-* - Arbitrary step counts (positive/negative)
-* - Perfect for wizards, carousels, pagination, onboarding flows
-*
-* Inheritance chain: useRegistry → useSelection → useSingle → useStep
-*/
-/**
 * Creates a new step instance with navigation through items.
 *
 * Extends `createSingle` with `first()`, `last()`, `next()`, `prev()`, and `step(count)` methods
@@ -4596,7 +4721,7 @@ const Single = {
 * ```
 */
 function createStep(_options = {}) {
-	const { circular = false,...options } = _options;
+	const { circular = false, ...options } = _options;
 	const registry = createSingle(options);
 	function first() {
 		const ticket = registry.seek("first");
@@ -4672,7 +4797,7 @@ function createStep(_options = {}) {
 * ```
 */
 function createStepContext(_options = {}) {
-	const { namespace = "v0:step",...options } = _options;
+	const { namespace = "v0:step", ...options } = _options;
 	const [useStepContext, _provideStepContext] = createContext(namespace);
 	const context = createStep(options);
 	function provideStepContext(_context = context, app) {
@@ -4810,6 +4935,11 @@ var StepItem_default = _sfc_main;
 
 //#endregion
 //#region src/components/Step/index.ts
+/**
+* Step component with sub-components for building stepper navigation.
+*
+* @see https://0.vuetifyjs.com/components/step
+*/
 const Step = {
 	Root: StepRoot_default,
 	Item: StepItem_default
@@ -4818,21 +4948,6 @@ const Step = {
 //#endregion
 //#region src/composables/toReactive/index.ts
 /**
-* @module toReactive
-*
-* @remarks
-* Utility function to convert values and refs into reactive proxies with ref unwrapping.
-*
-* Key features:
-* - Automatic ref unwrapping
-* - Deep reactive proxying
-* - Map and Set support with ref unwrapping
-* - Nested object/array reactivity
-* - Type preservation
-*
-* Perfect for creating reactive versions of plain objects while automatically unwrapping refs.
-*/
-/**
 * Converts a `MaybeRef` to a `UnwrapNestedRefs`.
 *
 * @param objectRef The object to convert.
@@ -4953,21 +5068,6 @@ function toReactive(objectRef) {
 //#endregion
 //#region src/composables/useEventListener/index.ts
 /**
-* @module useEventListener
-*
-* @remarks
-* Event listener composable with automatic cleanup on scope disposal.
-*
-* Key features:
-* - Supports Window, Document, and HTMLElement targets
-* - Reactive targets, events, and listeners
-* - Event options support (capture, passive, once)
-* - Automatic removeEventListener on unmount
-* - Multiple overloads for type safety
-*
-* Perfect for safely managing event listeners in Vue components.
-*/
-/**
 * Attaches an event listener to a target.
 *
 * @param target The target to attach the event listener to.
@@ -5022,7 +5122,7 @@ function useEventListener(target, event, listener, options) {
 * @see https://0.vuetifyjs.com/composables/system/use-event-listener
 */
 function useWindowEventListener(event, listener, options) {
-	return useEventListener(window, event, listener, options);
+	return IN_BROWSER ? useEventListener(window, event, listener, options) : () => {};
 }
 /**
 * Attaches an event listener to the document.
@@ -5036,30 +5136,12 @@ function useWindowEventListener(event, listener, options) {
 * @see https://0.vuetifyjs.com/composables/system/use-event-listener
 */
 function useDocumentEventListener(event, listener, options) {
-	return useEventListener(document, event, listener, options);
+	return IN_BROWSER ? useEventListener(document, event, listener, options) : () => {};
 }
 
 //#endregion
 //#region src/composables/useBreakpoints/index.ts
 /**
-* @module useBreakpoints
-*
-* @see https://0.vuetifyjs.com/composables/plugins/use-breakpoints
-*
-* @remarks
-* Responsive breakpoint detection composable with window resize handling.
-*
-* Key features:
-* - Window matchMedia integration
-* - Six built-in breakpoints (xs, sm, md, lg, xl, xxl)
-* - Automatic resize listener with cleanup
-* - SSR-safe (checks IN_BROWSER)
-* - Hydration-aware
-* - Custom breakpoint configuration
-*
-* Perfect for responsive layouts and conditional rendering based on screen size.
-*/
-/**
 * Creates default breakpoint configuration.
 *
 * @returns The default breakpoint configuration object.
@@ -5203,7 +5285,7 @@ function createBreakpoints(_options = {}) {
 * ```
 */
 function createBreakpointsContext(_options = {}) {
-	const { namespace = "v0:breakpoints",...options } = _options;
+	const { namespace = "v0:breakpoints", ...options } = _options;
 	const [useBreakpointsContext, _provideBreakpointsContext] = createContext(namespace);
 	const context = createBreakpoints(options);
 	function provideBreakpointsContext(_context = context, app) {
@@ -5247,7 +5329,7 @@ function createBreakpointsContext(_options = {}) {
 * ```
 */
 function createBreakpointsPlugin(_options = {}) {
-	const { namespace = "v0:breakpoints",...options } = _options;
+	const { namespace = "v0:breakpoints", ...options } = _options;
 	const [, provideBreakpointsContext, context] = createBreakpointsContext({
 		...options,
 		namespace
@@ -5305,25 +5387,217 @@ function useBreakpoints(namespace = "v0:breakpoints") {
 }
 
 //#endregion
-//#region src/composables/useFeatures/index.ts
+//#region src/composables/useClickOutside/index.ts
 /**
-* @module useFeatures
+* Detects clicks outside of the specified element(s).
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-features
+* Uses two-phase detection (pointerdown → pointerup) to prevent false positives
+* when users drag from inside to outside an element.
 *
-* @remarks
-* Feature flag system with boolean and token-based features.
+* @param target Element ref(s) to detect clicks outside of. Accepts a single ref/getter or array of refs/getters.
+* @param handler Callback invoked when a click outside is detected.
+* @param options Configuration options.
+* @returns An object with methods to control the listener.
 *
-* Key features:
-* - Boolean features (true/false activation)
-* - Token features with $variation support
-* - Auto-selection of enabled features
-* - Multi-select support for feature combinations
-* - Perfect for A/B testing, progressive rollout, feature toggles
-*
-* Inheritance chain: useRegistry → createSelection → createGroup → createFeatures
-* Integrates with useTokens for token-based features.
+* @see https://0.vuetifyjs.com/composables/system/use-click-outside
+*
+* @example Native element ref
+* ```ts
+* const menuRef = useTemplateRef<HTMLElement>('menu')
+*
+* useClickOutside(menuRef, () => { isOpen.value = false })
+* ```
+*
+* @example Component ref (e.g., Atom)
+* ```ts
+* const atomRef = useTemplateRef<AtomExpose>('atom')
+*
+* // Pass the exposed element TemplateRef via getter
+* useClickOutside(
+*   () => atomRef.value?.element,
+*   () => { isOpen.value = false }
+* )
+* ```
+*
+* @example Multiple targets
+* ```ts
+* const popoverRef = useTemplateRef<AtomExpose>('popover')
+* const anchorRef = useTemplateRef<HTMLElement>('anchor')
+*
+* useClickOutside(
+*   [() => popoverRef.value?.element, anchorRef],
+*   () => { isOpen.value = false }
+* )
+* ```
+*
+* @example Ignoring elements (CSS selectors or refs)
+* ```ts
+* useClickOutside(
+*  () => navRef.value?.element,
+*  () => { isOpen.value = false },
+*  { ignore: ['[data-app-bar]'] }
+* )
+* ```
 */
+function useClickOutside(target, handler, options = {}) {
+	const { capture = true, touchScrollThreshold = 30, detectIframe = false, ignore = [] } = options;
+	const isPaused = shallowRef(false);
+	const isActive = toRef(() => !isPaused.value);
+	let initialTarget = null;
+	let startPosition = {
+		x: 0,
+		y: 0
+	};
+	let cleanupPointerDown;
+	let cleanupPointerUp;
+	let cleanupBlur;
+	/**
+	* Resolve target(s) to an array of HTMLElements.
+	*/
+	function getTargets() {
+		return (Array.isArray(target) ? target : [target]).map((source) => toValue(source)).filter((el) => !/* @__PURE__ */ isNullOrUndefined(el));
+	}
+	/**
+	* Resolve ignore targets to a tuple of [selectors, elements].
+	* Called once per event to avoid repeated toValue() calls in hot path.
+	*/
+	function resolveIgnoreTargets() {
+		const ignoreTargets = toValue(ignore);
+		if (ignoreTargets.length === 0) return [[], []];
+		const selectors = [];
+		const elements = [];
+		for (const ignoreTarget of ignoreTargets) if (/* @__PURE__ */ isString(ignoreTarget)) selectors.push(ignoreTarget);
+		else {
+			const ignoreEl = toValue(ignoreTarget);
+			if (ignoreEl) elements.push(ignoreEl);
+		}
+		return [selectors, elements];
+	}
+	/**
+	* Check if an element matches resolved ignore targets.
+	*/
+	function isIgnored(el, selectors, elements) {
+		if (!el) return false;
+		for (const selector of selectors) try {
+			if (el.matches(selector) || !/* @__PURE__ */ isNull(el.closest(selector))) return true;
+		} catch {}
+		for (const ignoreEl of elements) if (ignoreEl === el || ignoreEl.contains(el)) return true;
+		return false;
+	}
+	/**
+	* Check if any element in the event path should be ignored.
+	*/
+	function shouldIgnore(path) {
+		const [selectors, elements] = resolveIgnoreTargets();
+		if (selectors.length === 0 && elements.length === 0) return false;
+		return path.some((node) => node instanceof Element && isIgnored(node, selectors, elements));
+	}
+	/**
+	* Check if the event target is outside all target elements.
+	*/
+	function isOutside(eventTarget) {
+		if (!eventTarget) return false;
+		if (!(eventTarget instanceof Node)) return false;
+		const targets = getTargets();
+		if (targets.length === 0) return false;
+		return targets.every((el) => {
+			return el !== eventTarget && !el.contains(eventTarget);
+		});
+	}
+	/**
+	* Validate that the target is still in the DOM.
+	*/
+	function isValidTarget(eventTarget) {
+		if (!(eventTarget instanceof Element)) return false;
+		if (!eventTarget.isConnected) return false;
+		return true;
+	}
+	/**
+	* Handle pointerdown - store initial target and position.
+	*/
+	function onPointerDown(event) {
+		if (isPaused.value) return;
+		if (event.defaultPrevented) return;
+		initialTarget = event.composedPath()[0] ?? event.target;
+		startPosition = {
+			x: event.clientX,
+			y: event.clientY
+		};
+	}
+	/**
+	* Handle pointerup - check if it's an outside click.
+	*/
+	function onPointerUp(event) {
+		if (isPaused.value) return;
+		if (event.defaultPrevented) return;
+		if (!initialTarget) return;
+		const pointerdownTarget = initialTarget;
+		initialTarget = null;
+		if (!isValidTarget(pointerdownTarget)) return;
+		const path = event.composedPath();
+		const pointerupTarget = path[0] ?? event.target;
+		if (event.pointerType === "touch") {
+			const dx = Math.abs(event.clientX - startPosition.x);
+			const dy = Math.abs(event.clientY - startPosition.y);
+			if (dx >= touchScrollThreshold || dy >= touchScrollThreshold) return;
+		}
+		if (isOutside(pointerdownTarget) && isOutside(pointerupTarget) && !shouldIgnore(path)) handler(event);
+	}
+	/**
+	* Handle window blur - detect focus moving to iframe.
+	*/
+	function onBlur(event) {
+		if (isPaused.value) return;
+		if (event.defaultPrevented) return;
+		if (document.activeElement instanceof HTMLIFrameElement) {
+			const iframeIsOutside = getTargets().every((el) => !el.contains(document.activeElement));
+			const [selectors, elements] = resolveIgnoreTargets();
+			if (iframeIsOutside && !isIgnored(document.activeElement, selectors, elements)) handler(event);
+		}
+	}
+	function setup() {
+		cleanupPointerDown = useDocumentEventListener("pointerdown", onPointerDown, capture);
+		cleanupPointerUp = useDocumentEventListener("pointerup", onPointerUp, capture);
+		if (!detectIframe) return;
+		cleanupBlur = useWindowEventListener("blur", onBlur, capture);
+	}
+	function cleanup() {
+		cleanupPointerDown?.();
+		cleanupPointerUp?.();
+		cleanupBlur?.();
+		cleanupPointerDown = void 0;
+		cleanupPointerUp = void 0;
+		cleanupBlur = void 0;
+	}
+	function pause() {
+		if (isPaused.value) return;
+		isPaused.value = true;
+		initialTarget = null;
+		cleanup();
+	}
+	function resume() {
+		if (!isPaused.value) return;
+		isPaused.value = false;
+		setup();
+	}
+	function stop() {
+		isPaused.value = true;
+		initialTarget = null;
+		cleanup();
+	}
+	setup();
+	onScopeDispose(stop, true);
+	return {
+		isActive: shallowReadonly(isActive),
+		isPaused: shallowReadonly(isPaused),
+		pause,
+		resume,
+		stop
+	};
+}
+
+//#endregion
+//#region src/composables/useFeatures/index.ts
 /**
 * Creates a new features instance.
 *
@@ -5348,7 +5622,7 @@ function useBreakpoints(namespace = "v0:breakpoints") {
 * ```
 */
 function createFeatures(_options = {}) {
-	const { features,...options } = _options;
+	const { features, ...options } = _options;
 	const tokens = createTokens(features, { flat: true });
 	const registry = createGroup(options);
 	for (const [id, { value }] of tokens.entries()) register({
@@ -5402,7 +5676,7 @@ function createFeatures(_options = {}) {
 * ```
 */
 function createFeaturesContext(_options = {}) {
-	const { namespace = "v0:features",...options } = _options;
+	const { namespace = "v0:features", ...options } = _options;
 	const [useFeaturesContext, _provideFeaturesContext] = createContext(namespace);
 	const context = createFeatures(options);
 	function provideFeaturesContext(_context = context, app) {
@@ -5441,7 +5715,7 @@ function createFeaturesContext(_options = {}) {
 * ```
 */
 function createFeaturesPlugin(_options = {}) {
-	const { namespace = "v0:features",...options } = _options;
+	const { namespace = "v0:features", ...options } = _options;
 	const [, provideFeaturesContext, context] = createFeaturesContext({
 		...options,
 		namespace
@@ -5484,21 +5758,6 @@ function useFeatures(namespace = "v0:features") {
 
 //#endregion
 //#region src/composables/useFilter/index.ts
-/**
-* @module useFilter
-*
-* @remarks
-* Reactive array filtering composable with multiple filter modes.
-*
-* Key features:
-* - Four filter modes: some, every, union, intersection
-* - Case-insensitive filtering
-* - Custom filter functions
-* - Reactive updates
-* - Perfect for search, multi-criteria filtering
-*
-* Filters arrays based on query strings with configurable matching strategies.
-*/
 function defaultFilter(query, item, keys, mode = "some") {
 	const queries = Array.isArray(query) ? query.map((q) => String(q).toLowerCase()) : [String(query).toLowerCase()];
 	function match(value, q) {
@@ -5512,6 +5771,89 @@ function defaultFilter(query, item, keys, mode = "some") {
 	return false;
 }
 /**
+* Creates a filter context with pre-configured options.
+*
+* @param options The filter options
+* @template Z The type of the items
+* @template E The type of the filter context
+* @returns A filter context
+*
+* @see https://0.vuetifyjs.com/composables/utilities/use-filter
+*
+* @example
+* ```ts
+* import { createFilter } from '@vuetify/v0'
+*
+* const filter = createFilter({
+*   mode: 'intersection',
+*   keys: ['name', 'email'],
+* })
+*
+* const { items } = filter.apply(query, users)
+* ```
+*/
+function createFilter(options = {}) {
+	const { customFilter, keys, mode = "some" } = options;
+	const filterFunction = customFilter ?? ((q, i) => defaultFilter(q, i, keys, mode));
+	const query = toRef("");
+	function apply(_query, items) {
+		const itemsRef = isRef(items) ? items : toRef(() => items);
+		const queryRef = toRef(_query);
+		return { items: computed(() => {
+			const q = toValue(queryRef);
+			query.value = q;
+			const queries = (Array.isArray(q) ? q : [q]).filter((q$1) => String(q$1).trim());
+			if (queries.length === 0) return itemsRef.value;
+			const queryParam = queries.length === 1 ? queries[0] : queries;
+			return itemsRef.value.filter((item) => filterFunction(queryParam, item));
+		}) };
+	}
+	return {
+		mode,
+		keys,
+		customFilter,
+		query,
+		apply
+	};
+}
+/**
+* Creates a filter context with dependency injection support.
+*
+* @param options The filter context options
+* @template Z The type of the items
+* @template E The type of the filter context
+* @returns A trinity tuple: [useContext, provideContext, defaultContext]
+*
+* @see https://0.vuetifyjs.com/composables/utilities/use-filter
+*
+* @example
+* ```ts
+* import { createFilterContext } from '@vuetify/v0'
+*
+* export const [useSearchFilter, provideSearchFilter, searchFilter] = createFilterContext({
+*   namespace: 'app:search',
+*   mode: 'union',
+*   keys: ['title', 'description'],
+* })
+*
+* // In parent component
+* provideSearchFilter()
+*
+* // In child component
+* const filter = useSearchFilter()
+* const { items } = filter.apply(query, products)
+* ```
+*/
+function createFilterContext(_options = {}) {
+	const { namespace = "v0:filter", ...options } = _options;
+	const [useFilterContext$1, _provideFilterContext] = createContext(namespace);
+	const context = createFilter(options);
+	function provideFilterContext(_context = context, app) {
+		return _provideFilterContext(_context, app);
+	}
+	return createTrinity(useFilterContext$1, provideFilterContext, context);
+}
+/**
 * A reusable function for filtering an array of items.
 *
 * @param query The query to filter by.
@@ -5540,37 +5882,34 @@ function defaultFilter(query, item, keys, mode = "some") {
 * ```
 */
 function useFilter(query, items, options = {}) {
-	const { customFilter, keys, mode = "some" } = options;
-	const filterFunction = customFilter ?? ((q, i) => defaultFilter(q, i, keys, mode));
-	const itemsRef = isRef(items) ? items : toRef(() => items);
-	const queryRef = toRef(query);
-	return { items: computed(() => {
-		const q = toValue(queryRef);
-		const queries = (Array.isArray(q) ? q : [q]).filter((q$1) => String(q$1).trim());
-		if (queries.length === 0) return itemsRef.value;
-		const queryParam = queries.length === 1 ? queries[0] : queries;
-		return itemsRef.value.filter((item) => filterFunction(queryParam, item));
-	}) };
+	return createFilter(options).apply(query, items);
 }
-
-//#endregion
-//#region src/composables/useForm/index.ts
 /**
-* @module useForm
+* Returns the current filter context from dependency injection.
 *
-* @remarks
-* Form validation composable with async rule support and multiple validation modes.
+* @param namespace The namespace for the filter context. Defaults to `'v0:filter'`.
+* @template Z The type of the items.
+* @template E The type of the filter context.
+* @returns The current filter context.
 *
-* Key features:
-* - Sync and async validation rules
-* - Multiple validation modes (submit, change, combined)
-* - Tri-state isValid (null/true/false)
-* - isPristine tracking
-* - Silent validation mode
-* - Form-level validation and reset
-*
-* Each field is registered with validation rules and tracks its own state independently.
+* @see https://0.vuetifyjs.com/composables/utilities/use-filter
+*
+* @example
+* ```vue
+* <script setup lang="ts">
+*   import { useFilterContext } from '@vuetify/v0'
+*
+*   const filter = useFilterContext()
+*   const { items } = filter.apply(query, products)
+* <\/script>
+* ```
 */
+function useFilterContext(namespace = "v0:filter") {
+	return useContext(namespace);
+}
+
+//#endregion
+//#region src/composables/useForm/index.ts
 /**
 * Creates a new form instance.
 *
@@ -5739,7 +6078,7 @@ function createForm(options) {
 * ```
 */
 function createFormContext(_options = {}) {
-	const { namespace = "v0:form",...options } = _options;
+	const { namespace = "v0:form", ...options } = _options;
 	const [useFormContext, _provideFormContext] = createContext(namespace);
 	const context = createForm(options);
 	function provideFormContext(_context = context, app) {
@@ -5777,22 +6116,6 @@ function useForm(namespace = "v0:form") {
 //#endregion
 //#region src/composables/useIntersectionObserver/index.ts
 /**
-* @module useIntersectionObserver
-*
-* @remarks
-* IntersectionObserver composable with lifecycle management.
-*
-* Key features:
-* - IntersectionObserver API wrapper
-* - Pause/resume/stop functionality
-* - Automatic cleanup on unmount
-* - SSR-safe (checks SUPPORTS_INTERSECTION_OBSERVER)
-* - Hydration-aware
-* - Immediate callback option
-*
-* Perfect for lazy loading, infinite scroll, and visibility detection.
-*/
-/**
 * A composable that uses the Intersection Observer API to detect when an element
 * is visible in the viewport.
 *
@@ -5833,12 +6156,14 @@ function useForm(namespace = "v0:form") {
 */
 function useIntersectionObserver(target, callback, options = {}) {
 	const { isHydrated } = useHydration();
+	const targetRef = isRef(target) ? target : shallowRef(target);
 	const observer = shallowRef();
 	const isPaused = shallowRef(false);
 	const isIntersecting = shallowRef(false);
 	const isActive = toRef(() => !!observer.value);
 	function setup() {
-		if (!isHydrated.value || !SUPPORTS_INTERSECTION_OBSERVER || !target.value || isPaused.value) return;
+		if (observer.value === null) return;
+		if (!isHydrated.value || !SUPPORTS_INTERSECTION_OBSERVER || !targetRef.value || isPaused.value) return;
 		observer.value = new IntersectionObserver((entries) => {
 			const transformedEntries = entries.map((entry) => ({
 				boundingClientRect: entry.boundingClientRect,
@@ -5852,26 +6177,29 @@ function useIntersectionObserver(target, callback, options = {}) {
 			const latestEntry = transformedEntries.at(-1);
 			if (latestEntry) isIntersecting.value = latestEntry.isIntersecting;
 			callback(transformedEntries);
+			if (options.once && latestEntry?.isIntersecting) stop();
 		}, {
 			root: options.root || null,
 			rootMargin: options.rootMargin || "0px",
 			threshold: options.threshold || 0
 		});
-		observer.value.observe(target.value);
+		observer.value.observe(targetRef.value);
 		if (options.immediate) callback([{
-			boundingClientRect: target.value.getBoundingClientRect(),
+			boundingClientRect: targetRef.value.getBoundingClientRect(),
 			intersectionRatio: 0,
 			intersectionRect: new DOMRect(0, 0, 0, 0),
 			isIntersecting: false,
 			rootBounds: null,
-			target: target.value,
+			target: targetRef.value,
 			time: performance.now()
 		}]);
 	}
-	watch([isHydrated, target], () => {
+	watchEffect(() => {
+		const hydrated = isHydrated.value;
+		const target$1 = targetRef.value;
 		cleanup();
-		setup();
-	}, { immediate: true });
+		if (hydrated && target$1) setup();
+	});
 	function cleanup() {
 		if (observer.value) {
 			observer.value.disconnect();
@@ -5889,6 +6217,7 @@ function useIntersectionObserver(target, callback, options = {}) {
 	}
 	function stop() {
 		cleanup();
+		observer.value = null;
 	}
 	onScopeDispose(stop, true);
 	return {
@@ -5960,20 +6289,6 @@ function useElementIntersection(target, options = {}) {
 //#endregion
 //#region src/composables/useKeydown/index.ts
 /**
-* @module useKeydown
-*
-* @remarks
-* Keydown event listener composable with key filtering.
-*
-* Key features:
-* - Key-specific event handling
-* - preventDefault and stopPropagation options
-* - Automatic cleanup on scope disposal
-* - Built on useEventListener for consistent event handling
-*
-* Simplified wrapper around useEventListener for keyboard interactions.
-*/
-/**
 * A composable that adds a keydown event listener to the document.
 *
 * @param handlers The key handlers to add.
@@ -5985,6 +6300,10 @@ function useElementIntersection(target, options = {}) {
 * ```ts
 * import { useKeydown } from '@vuetify/v0'
 *
+* // Single handler
+* useKeydown({ key: 'Escape', handler: () => console.log('Escape pressed') })
+*
+* // Multiple handlers
 * const { isActive, start, stop } = useKeydown([
 *   { key: 'Enter', handler: () => console.log('Enter pressed') },
 *   { key: 'Escape', handler: () => console.log('Escape pressed'), preventDefault: true },
@@ -6029,22 +6348,6 @@ function useKeydown(handlers) {
 //#endregion
 //#region src/composables/useMutationObserver/index.ts
 /**
-* @module useMutationObserver
-*
-* @remarks
-* MutationObserver composable with lifecycle management.
-*
-* Key features:
-* - MutationObserver API wrapper
-* - Pause/resume/stop functionality
-* - Automatic cleanup on unmount
-* - SSR-safe (checks SUPPORTS_MUTATION_OBSERVER)
-* - Hydration-aware
-* - Configurable observation options (childList, attributes, characterData, etc.)
-*
-* Perfect for detecting DOM changes and responding to mutations.
-*/
-/**
 * A composable that uses the Mutation Observer API to detect changes in the DOM.
 *
 * @param target The element to observe.
@@ -6091,7 +6394,7 @@ function useMutationObserver(target, callback, options = {}) {
 	const { isHydrated } = useHydration();
 	const observer = shallowRef();
 	const isPaused = shallowRef(false);
-	const isActive = computed(() => !!observer.value);
+	const isActive = toRef(() => !!observer.value);
 	const observerOptions = {
 		childList: options.childList ?? true,
 		attributes: options.attributes ?? false,
@@ -6102,6 +6405,7 @@ function useMutationObserver(target, callback, options = {}) {
 		attributeFilter: options.attributeFilter
 	};
 	function setup() {
+		if (observer.value === null) return;
 		if (!isHydrated.value || !SUPPORTS_MUTATION_OBSERVER || !target.value || isPaused.value) return;
 		observer.value = new MutationObserver((mutations) => {
 			callback(mutations.map((mutation) => ({
@@ -6115,6 +6419,7 @@ function useMutationObserver(target, callback, options = {}) {
 				attributeNamespace: mutation.attributeNamespace,
 				oldValue: mutation.oldValue
 			})));
+			if (options.once) stop();
 		});
 		observer.value.observe(target.value, observerOptions);
 		if (options.immediate) {
@@ -6135,12 +6440,15 @@ function useMutationObserver(target, callback, options = {}) {
 				attributeNamespace: null,
 				oldValue: null
 			}]);
+			if (options.once) stop();
 		}
 	}
-	watch([isHydrated, target], () => {
+	watchEffect(() => {
+		const hydrated = isHydrated.value;
+		const el = target.value;
 		cleanup();
-		setup();
-	}, { immediate: true });
+		if (hydrated && el) setup();
+	});
 	function cleanup() {
 		if (observer.value) {
 			observer.value.disconnect();
@@ -6157,6 +6465,7 @@ function useMutationObserver(target, callback, options = {}) {
 	}
 	function stop() {
 		cleanup();
+		observer.value = null;
 	}
 	onScopeDispose(stop, true);
 	return {
@@ -6189,23 +6498,6 @@ var Vuetify0PermissionAdapter = class extends PermissionAdapter {
 //#endregion
 //#region src/composables/usePermissions/index.ts
 /**
-* @module usePermissions
-*
-* @see https://0.vuetifyjs.com/composables/plugins/use-permissions
-*
-* @remarks
-* Permission management composable with support for RBAC and ABAC patterns.
-*
-* Key features:
-* - Role-Based Access Control (RBAC) support
-* - Attribute-Based Access Control (ABAC) with context
-* - Functional permission conditions
-* - Token-based permission storage
-* - Adapter pattern for custom permission systems
-*
-* Built on useTokens for flexible permission configuration.
-*/
-/**
 * Creates a new permissions instance.
 *
 * @param options The options for the permissions instance.
@@ -6229,7 +6521,7 @@ var Vuetify0PermissionAdapter = class extends PermissionAdapter {
 * ```
 */
 function createPermissions(_options = {}) {
-	const { adapter = new Vuetify0PermissionAdapter(), permissions = {},...options } = _options;
+	const { adapter = new Vuetify0PermissionAdapter(), permissions = {}, ...options } = _options;
 	const record = {};
 	for (const role in permissions) {
 		if (!record[role]) record[role] = {};
@@ -6271,7 +6563,7 @@ function createPermissions(_options = {}) {
 * ```
 */
 function createPermissionsContext(_options = {}) {
-	const { namespace = "v0:permissions",...options } = _options;
+	const { namespace = "v0:permissions", ...options } = _options;
 	const [usePermissionsContext, _providePermissionsContext] = createContext(namespace);
 	const context = createPermissions(options);
 	function providePermissionsContext(_context = context, app) {
@@ -6310,7 +6602,7 @@ function createPermissionsContext(_options = {}) {
 * ```
 */
 function createPermissionsPlugin(_options = {}) {
-	const { namespace = "v0:permissions",...options } = _options;
+	const { namespace = "v0:permissions", ...options } = _options;
 	const [, providePermissionContext, context] = createPermissionsContext({
 		...options,
 		namespace
@@ -6352,21 +6644,6 @@ function usePermissions(namespace = "v0:permissions") {
 //#endregion
 //#region src/composables/useQueue/index.ts
 /**
-* @module useQueue
-*
-* @remarks
-* A queue composable for managing time-based collections with:
-* - Automatic timeout-based removal
-* - Pause/resume functionality
-* - FIFO (First In, First Out) ordering
-* - Manual dismissal support
-* - Queue progression management
-*
-* Built on top of useRegistry, the queue automatically manages timeouts for tickets,
-* ensuring only the first ticket in the queue is active at any time. When an ticket
-* expires or is removed, the next ticket in the queue automatically becomes active.
-*/
-/**
 * Creates a new queue instance
 *
 * @param options The options for the queue instance
@@ -6398,7 +6675,7 @@ function usePermissions(namespace = "v0:permissions") {
 * ```
 */
 function createQueue(_options = {}) {
-	const { timeout: _timeout = 3e3,...options } = _options;
+	const { timeout: _timeout = 3e3, ...options } = _options;
 	const registry = useRegistry({
 		...options,
 		events: true
@@ -6493,7 +6770,6 @@ function createQueue(_options = {}) {
 /**
 * Creates a new queue context.
 *
-* @param namespace The namespace for the queue context.
 * @param options The options for the queue context.
 * @template Z The type of the queue ticket.
 * @template E The type of the queue context.
@@ -6505,13 +6781,13 @@ function createQueue(_options = {}) {
 * ```ts
 * import { createQueueContext } from '@vuetify/v0'
 *
-* export const [useQueue, provideQueue] = createQueueContext('v0:queue', {
+* export const [useQueue, provideQueue, context] = createQueueContext({
 *   timeout: 5000,
 * })
 * ```
 */
-function createQueueContext(_options) {
-	const { namespace,...options } = _options;
+function createQueueContext(_options = {}) {
+	const { namespace = "v0:queue", ...options } = _options;
 	const [useQueueContext, _provideQueueContext] = createContext(namespace);
 	const context = createQueue(options);
 	function provideQueueContext(_context = context, app) {
@@ -6569,21 +6845,6 @@ var MemoryAdapter = class {
 //#endregion
 //#region src/composables/useStorage/index.ts
 /**
-* @module useStorage
-*
-* @remarks
-* Reactive storage composable with adapter pattern for localStorage, sessionStorage, or memory.
-*
-* Key features:
-* - Reactive refs that sync with storage
-* - localStorage, sessionStorage, and memory adapters
-* - Custom serialization support
-* - SSR fallback to memory adapter
-* - Automatic cleanup on remove/clear
-*
-* Uses adapter pattern to abstract storage implementation details.
-*/
-/**
 * Creates a new storage instance.
 *
 * @param options The options for the storage instance.
@@ -6669,7 +6930,7 @@ function createStorage(options = {}) {
 	};
 }
 function createStorageContext(_options = {}) {
-	const { namespace = "v0:storage",...options } = _options;
+	const { namespace = "v0:storage", ...options } = _options;
 	const [useStorageContext, _provideStorageContext] = createContext(namespace);
 	const context = createStorage(options);
 	function provideStorageContext(_context = context, app) {
@@ -6699,7 +6960,7 @@ function createStorageContext(_options = {}) {
 * ```
 */
 function createStoragePlugin(_options = {}) {
-	const { namespace = "v0:storage",...options } = _options;
+	const { namespace = "v0:storage", ...options } = _options;
 	const [, provideStorageContext, context] = createStorageContext({
 		...options,
 		namespace
@@ -6820,24 +7081,6 @@ var Vuetify0ThemeAdapter = class extends ThemeAdapter {
 //#endregion
 //#region src/composables/useTheme/index.ts
 /**
-* @module useTheme
-*
-* @see https://0.vuetifyjs.com/composables/plugins/use-theme
-*
-* @remarks
-* Theme management composable with token resolution and CSS variable injection.
-*
-* Key features:
-* - Single-selection theme switching (extends createSingle)
-* - Token alias resolution via useTokens
-* - Lazy theme loading (compute colors only when selected)
-* - CSS variable generation via adapter pattern
-* - SSR support with head integration
-* - Theme cycling
-*
-* Integrates with createSingle for selection and useTokens for color resolution.
-*/
-/**
 * Creates a new theme instance.
 *
 * @param options The options for the theme instance.
@@ -6872,14 +7115,14 @@ var Vuetify0ThemeAdapter = class extends ThemeAdapter {
 * ```
 */
 function createTheme(_options = {}) {
-	const { themes = {}, palette = {},...options } = _options;
+	const { themes = {}, palette = {}, ...options } = _options;
 	const tokens = createTokens({
 		palette,
 		...themes
 	}, { flat: true });
 	const registry = createSingle(options);
 	for (const id in themes) {
-		const { colors: value,...theme } = themes[id];
+		const { colors: value, ...theme } = themes[id];
 		register({
 			id,
 			value,
@@ -6961,7 +7204,7 @@ function createTheme(_options = {}) {
 * ```
 */
 function createThemeContext(_options = {}) {
-	const { namespace = "v0:theme",...options } = _options;
+	const { namespace = "v0:theme", ...options } = _options;
 	const [useThemeContext, _provideThemeContext] = createContext(namespace);
 	const context = createTheme(options);
 	function provideThemeContext(_context = context, app) {
@@ -7011,7 +7254,7 @@ function createThemeContext(_options = {}) {
 * ```
 */
 function createThemePlugin(_options = {}) {
-	const { adapter = new Vuetify0ThemeAdapter(), namespace = "v0:theme", palette = {}, themes = {}, target,...options } = _options;
+	const { adapter = new Vuetify0ThemeAdapter(), namespace = "v0:theme", palette = {}, themes = {}, target, ...options } = _options;
 	const [, provideThemeContext, context] = createThemeContext({
 		...options,
 		namespace,
@@ -7058,21 +7301,6 @@ function useTheme(namespace = "v0:theme") {
 //#endregion
 //#region src/composables/useTimeline/index.ts
 /**
-* @module useTimeline
-*
-* @remarks
-* Bounded undo/redo system with overflow management.
-*
-* Key features:
-* - Fixed-size history (default: 10 items)
-* - Undo/redo stack management
-* - Overflow queue (preserves oldest items)
-* - Automatic reindexing after operations
-* - Perfect for command pattern, history tracking
-*
-* Extends useRegistry with temporal navigation capabilities.
-*/
-/**
 * Creates a new timeline instance.
 *
 * @param _options The options for the timeline instance.
@@ -7100,7 +7328,7 @@ function useTheme(namespace = "v0:theme") {
 * ```
 */
 function createTimeline(_options = {}) {
-	const { size = 10,...options } = _options;
+	const { size = 10, ...options } = _options;
 	const registry = useRegistry(options);
 	const stack = [];
 	const overflow = [];
@@ -7175,7 +7403,7 @@ function createTimeline(_options = {}) {
 * ```
 */
 function createTimelineContext(_options = {}) {
-	const { namespace = "v0:timeline",...options } = _options;
+	const { namespace = "v0:timeline", ...options } = _options;
 	const [useTimelineContext, _provideTimelineContext] = createContext(namespace);
 	const context = createTimeline(options);
 	function provideTimelineContext(_context = context, app) {
@@ -7207,24 +7435,6 @@ function useTimeline(namespace = "v0:timeline") {
 //#endregion
 //#region src/composables/useToggleScope/index.ts
 /**
-* @module useToggleScope
-*
-* @remarks
-* Conditionally manages an effect scope based on a reactive boolean condition.
-* When the source becomes true, creates and runs an effect scope. When false, stops the scope.
-* All reactive effects created within the scoped function are automatically cleaned up on deactivation.
-*
-* Key features:
-* - Uses Vue's effectScope for efficient reactive effect lifecycle management
-* - Automatic cleanup when condition becomes false
-* - Supports optional reset callback for scope restart capability
-* - Handles rapid toggling and parent scope disposal safely
-* - SSR-safe (effectScope is part of Vue core)
-*
-* Perfect for conditional side effects, feature flags, and performance optimization
-* by only running reactive effects when needed.
-*/
-/**
 * Conditionally manages an effect scope based on a reactive boolean source.
 *
 * @param source A reactive boolean value or getter that controls the scope lifecycle
@@ -7306,24 +7516,6 @@ function useToggleScope(source, fn) {
 //#endregion
 //#region src/composables/useVirtual/index.ts
 /**
-* @module useVirtual
-*
-* @remarks
-* Virtual scrolling composable for efficiently rendering large lists.
-*
-* Key features:
-* - Renders only visible items (viewport + overscan)
-* - Dynamic or fixed item heights
-* - SSR-safe (checks IN_BROWSER)
-* - Bidirectional scrolling (forward/reverse for chat apps)
-* - Scroll anchoring (maintains position across data changes)
-* - Edge detection for infinite scroll
-* - iOS momentum and elastic scrolling
-* - Configurable overscan (extra items rendered for smooth scrolling)
-*
-* Perfect for large data sets, chat apps, and infinite scroll implementations.
-*/
-/**
 * Virtual scrolling composable for efficiently rendering large lists
 *
 * @param items Reactive array of items to virtualize
@@ -7560,6 +7752,11 @@ function useVirtual(items, _options = {}) {
 			element.value.scrollTop = totalHeight;
 		}
 	}
+	onScopeDispose(() => {
+		cancelAnimationFrame(raf);
+		cancelAnimationFrame(rebuildRaf);
+		cancelAnimationFrame(edgeRaf);
+	}, true);
 	return {
 		element,
 		items: computedItems,
@@ -7575,4 +7772,4 @@ function useVirtual(items, _options = {}) {
 }
 
 //#endregion
-export { Atom_default as Atom, Avatar, COMMON_ELEMENTS, ConsolaLoggerAdapter, ExpansionPanel, Group, IN_BROWSER, MemoryAdapter, Pagination, PermissionAdapter, PinoLoggerAdapter, Popover, SELF_CLOSING_TAGS, SUPPORTS_INTERSECTION_OBSERVER, SUPPORTS_MATCH_MEDIA, SUPPORTS_MUTATION_OBSERVER, SUPPORTS_OBSERVER, SUPPORTS_TOUCH, Selection, Single, Step, Vuetify0LocaleAdapter, Vuetify0LoggerAdapter, Vuetify0ThemeAdapter, __LOGGER_ENABLED__, clamp, createBreakpoints, createBreakpointsContext, createBreakpointsPlugin, createContext, createFallbackHydration, createFeatures, createFeaturesContext, createFeaturesPlugin, createForm, createFormContext, createGroup, createGroupContext, createHydration, createHydrationContext, createHydrationPlugin, createLocale, createLocaleContext, createLocaleFallback, createLocalePlugin, createLogger, createLoggerContext, createLoggerPlugin, createOverflow, createOverflowContext, createPagination, createPaginationContext, createPermissions, createPermissionsContext, createPermissionsPlugin, createPlugin, createQueue, createQueueContext, createRegistryContext, createSelection, createSelectionContext, createSingle, createSingleContext, createStep, createStepContext, createStorage, createStorageContext, createStoragePlugin, createTheme, createThemeContext, createThemePlugin, createTimeline, createTimelineContext, createTokens, createTokensContext, createTrinity, debounce, genId, isArray, isBoolean, isFunction, isNaN, isNull, isNullOrUndefined, isNumber, isObject, isPrimitive, isSelfClosingTag, isString, isSymbol, isUndefined, mergeDeep, provideAvatarContext, provideContext, provideExpansionPanelItem, provideExpansionPanelSelection, provideGroupRoot, providePaginationControls, providePaginationItems, providePaginationRoot, providePopoverContext, provideSelectionRoot, provideSingleRoot, provideStepRoot, range, toArray, toReactive, useAvatarRoot, useBreakpoints, useContext, useDocumentEventListener, useElementIntersection, useElementSize, useEventListener, useExpansionPanelItem, useExpansionPanelRoot, useFeatures, useFilter, useForm, useGroup, useGroupRoot, useHydration, useIntersectionObserver, useKeydown, useLocale, useLogger, useMutationObserver, useOverflow, usePagination, usePaginationControls, usePaginationItems, usePaginationRoot, usePermissions, usePopoverContext, useProxyModel, useProxyRegistry, useQueue, useRegistry, useResizeObserver, useSelection, useSelectionRoot, useSingle, useSingleRoot, useStep, useStepRoot, useStorage, useTheme, useTimeline, useToggleScope, useTokens, useVirtual, useWindowEventListener, version };
+export { Atom_default as Atom, Avatar, AvatarFallback_default as AvatarFallback, AvatarImage_default as AvatarImage, AvatarRoot_default as AvatarRoot, COMMON_ELEMENTS, ConsolaLoggerAdapter, ExpansionPanel, ExpansionPanelActivator_default as ExpansionPanelActivator, ExpansionPanelContent_default as ExpansionPanelContent, ExpansionPanelHeader_default as ExpansionPanelHeader, ExpansionPanelItem_default as ExpansionPanelItem, ExpansionPanelRoot_default as ExpansionPanelRoot, Group, GroupItem_default as GroupItem, GroupRoot_default as GroupRoot, IN_BROWSER, MemoryAdapter, Pagination, PaginationEllipsis_default as PaginationEllipsis, PaginationFirst_default as PaginationFirst, PaginationItem_default as PaginationItem, PaginationLast_default as PaginationLast, PaginationNext_default as PaginationNext, PaginationPrev_default as PaginationPrev, PaginationRoot_default as PaginationRoot, PaginationStatus_default as PaginationStatus, PermissionAdapter, PinoLoggerAdapter, Popover, PopoverAnchor_default as PopoverAnchor, PopoverContent_default as PopoverContent, PopoverRoot_default as PopoverRoot, SELF_CLOSING_TAGS, SUPPORTS_INTERSECTION_OBSERVER, SUPPORTS_MATCH_MEDIA, SUPPORTS_MUTATION_OBSERVER, SUPPORTS_OBSERVER, SUPPORTS_TOUCH, Selection, SelectionItem_default as SelectionItem, SelectionRoot_default as SelectionRoot, Single, SingleItem_default as SingleItem, SingleRoot_default as SingleRoot, Step, StepItem_default as StepItem, StepRoot_default as StepRoot, Vuetify0LocaleAdapter, Vuetify0LoggerAdapter, Vuetify0ThemeAdapter, __LOGGER_ENABLED__, clamp, createBreakpoints, createBreakpointsContext, createBreakpointsPlugin, createContext, createFallbackHydration, createFeatures, createFeaturesContext, createFeaturesPlugin, createFilter, createFilterContext, createForm, createFormContext, createGroup, createGroupContext, createHydration, createHydrationContext, createHydrationPlugin, createLocale, createLocaleContext, createLocaleFallback, createLocalePlugin, createLogger, createLoggerContext, createLoggerPlugin, createOverflow, createOverflowContext, createPagination, createPaginationContext, createPermissions, createPermissionsContext, createPermissionsPlugin, createPlugin, createQueue, createQueueContext, createRegistryContext, createSelection, createSelectionContext, createSingle, createSingleContext, createStep, createStepContext, createStorage, createStorageContext, createStoragePlugin, createTheme, createThemeContext, createThemePlugin, createTimeline, createTimelineContext, createTokens, createTokensContext, createTrinity, debounce, genId, isArray, isBoolean, isFunction, isNaN, isNull, isNullOrUndefined, isNumber, isObject, isPrimitive, isSelfClosingTag, isString, isSymbol, isUndefined, mergeDeep, provideAvatarContext, provideContext, provideExpansionPanelItem, provideExpansionPanelSelection, provideGroupRoot, providePaginationControls, providePaginationItems, providePaginationRoot, providePopoverContext, provideSelectionRoot, provideSingleRoot, provideStepRoot, range, toArray, toReactive, useAvatarRoot, useBreakpoints, useClickOutside, useContext, useDocumentEventListener, useElementIntersection, useElementSize, useEventListener, useExpansionPanelItem, useExpansionPanelRoot, useFeatures, useFilter, useFilterContext, useForm, useGroup, useGroupRoot, useHydration, useIntersectionObserver, useKeydown, useLocale, useLogger, useMutationObserver, useOverflow, usePagination, usePaginationControls, usePaginationItems, usePaginationRoot, usePermissions, usePopoverContext, useProxyModel, useProxyRegistry, useQueue, useRegistry, useResizeObserver, useSelection, useSelectionRoot, useSingle, useSingleRoot, useStep, useStepRoot, useStorage, useTheme, useTimeline, useToggleScope, useTokens, useVirtual, useWindowEventListener, version };