@vuetify/v0 0.0.18 → 0.0.20

package/dist/{useStep-DC_JvZpy.mjs → useStep-Dw7XloDM.mjs}

@@ -1,25 +1,9 @@
-import { _ as range, d as isObject, h as isUndefined, l as isNullOrUndefined, m as isSymbol, o as isFunction, p as isString, r as genId, s as isNaN } from "./utilities-JxCe-nF2.mjs";
-import { a as SUPPORTS_OBSERVER, s as __LOGGER_ENABLED__, t as IN_BROWSER } from "./globals-BGVqrlN7.mjs";
-import { computed, getCurrentInstance, inject, isRef, onScopeDispose, provide, reactive, shallowReactive, shallowReadonly, shallowRef, toRef, toValue, watch } from "vue";
+import { _ as range, d as isObject, h as isUndefined, l as isNullOrUndefined, m as isSymbol, o as isFunction, p as isString, r as genId, s as isNaN } from "./utilities-BrFKLHFS.mjs";
+import { a as SUPPORTS_OBSERVER, s as __LOGGER_ENABLED__, t as IN_BROWSER } from "./globals-exvZ8fiO.mjs";
+import { computed, getCurrentInstance, inject, isRef, onScopeDispose, provide, reactive, shallowReactive, shallowReadonly, shallowRef, toRef, toValue, watch, watchEffect } from "vue";
 
 //#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.
@@ -558,21 +542,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.
@@ -616,17 +585,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) {
@@ -715,9 +688,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;
@@ -726,7 +699,7 @@ function useRegistry(options) {
 	}
 	function invalidate() {
 		if (batching) return;
-		if (cache.size > 0) cache.clear();
+		cache.clear();
 	}
 	function queueEmit(event, data) {
 		if (batching) pendingEmits.push({
@@ -741,7 +714,7 @@ function useRegistry(options) {
 		pendingEmits = [];
 		try {
 			const result = fn();
-			if (cache.size > 0) cache.clear();
+			cache.clear();
 			for (const { event, data } of pendingEmits) emit(event, data);
 			return result;
 		} finally {
@@ -752,8 +725,8 @@ function useRegistry(options) {
 	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;
@@ -780,7 +753,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);
@@ -830,12 +803,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") {
@@ -922,21 +899,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.
@@ -1176,20 +1138,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.
@@ -1262,7 +1210,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();
@@ -1284,21 +1233,6 @@ function useProxyModel(registry, model, options) {
 //#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.
@@ -1348,26 +1282,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
@@ -1632,1364 +1546,1244 @@ function useGroup(namespace = "v0:group") {
 }
 
 //#endregion
-//#region src/composables/useHydration/index.ts
+//#region src/composables/useLocale/adapters/v0.ts
 /**
-* @module useHydration
+* Vuetify0.x locale adapter implementation
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
+* 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 single selection instance that enforces only one selected item at a time.
 *
-* @remarks
-* SSR hydration state management composable.
+* Extends `createSelection` by automatically clearing previous selections when a new item is selected.
+* Adds computed singular properties: `selectedId`, `selectedItem`, `selectedIndex`, `selectedValue`.
 *
-* Key features:
-* - Hydration state detection (browser vs SSR)
-* - Root component detection
-* - Readonly hydration state refs
-* - Plugin installation support
-* - Perfect for hydration-safe rendering
+* @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.
 *
-* Essential for composables that need to behave differently during SSR vs client-side.
-*/
-/**
-* Creates a new hydration instance.
+* @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
 *
-* @returns A new hydration instance.
+* **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 { createHydration } from '@vuetify/v0'
+* import { createSingle } from '@vuetify/v0'
 *
-* 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.
+* const tabs = createSingle({ mandatory: true })
 *
-* @param options Options for creating the hydration context.
-* @template E The type of the hydration context.
-* @returns A new hydration context trinity.
+* tabs.onboard([
+*   { id: 'home', value: 'Home' },
+*   { id: 'about', value: 'About' },
+*   { id: 'contact', value: 'Contact' },
+* ])
 *
-* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
+* tabs.first() // Select first tab
 *
-* @example
-* ```ts
-* import { createHydrationContext } from '@vuetify/v0'
+* console.log(tabs.selectedId.value) // 'home'
+* console.log(tabs.selectedIndex.value) // 0
 *
-* export const [useHydrationContext, provideHydrationContext, context] = createHydrationContext({
-*   namespace: 'app:hydration',
-* })
+* 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
+* Returns the current tokens instance.
 *
-* @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.
-*
-* 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 }, ...]
-*
-* // 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 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((item) => item !== false);
-	}
-	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;
-		}
+* import { createHydration } from '@vuetify/v0'
+*
+* 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 pagination context for dependency injection.
+* Creates a new hydration context trinity.
 *
-* @param options The options including namespace.
-* @returns A trinity: [usePagination, providePagination, defaultContext]
+* @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
-* // With default namespace 'v0:pagination'
-* const [usePagination, providePaginationContext] = createPaginationContext({ size: 50 })
+* import { createHydrationContext } from '@vuetify/v0'
 *
-* // Or with custom namespace
-* const [usePagination, providePaginationContext] = createPaginationContext({
-*   namespace: 'my-pagination',
-*   size: 50,
+* 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.
 *
-* // Parent component
-* providePaginationContext()
+* @param options The options for the hydration plugin.
+* @template E The type of the hydration context.
+* @returns A new hydration plugin.
 *
-* // Child component
-* const pagination = usePagination()
-* pagination.next()
+* @see https://0.vuetifyjs.com/composables/plugins/use-hydration
+*
+* @example
+* ```ts
+* import { createApp } from 'vue'
+* import { createHydrationPlugin } from '@vuetify/v0'
+* import App from './App.vue'
+*
+* const app = createApp(App)
+*
+* app.use(createHydrationPlugin())
+*
+* 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 pause() {
+		isPaused.value = true;
+		observer.value?.disconnect();
 	}
-	function toggle(id) {
-		if (registry.selectedIds.has(id)) unselect(id);
-		else registry.select(id);
+	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;
+		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();
+	}
+	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);
 			}
-			if (/* @__PURE__ */ isUndefined(current)) {
-				logger.warn(`Path not found inside "${clean}": ${segments.join(".")}`);
-				cache.set(cacheKey, void 0);
-				return;
+			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++;
 			}
-			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;
-	}
-	return {
-		...registry,
-		resolve,
-		isAlias,
-		get size() {
-			return registry.size;
-		}
+			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 n(value, ...params) {
-		return adapter.n(value, registry.selectedId.value, ...params);
+	function next() {
+		if (page.value < pages.value) page.value++;
 	}
-	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 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((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
 //#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
@@ -3171,4 +2965,4 @@ function useStep(namespace = "v0:step") {
 }
 
 //#endregion
-export { createGroupContext as A, createLogger as B, useResizeObserver as C, createHydrationPlugin as D, createHydrationContext as E, createSelection as F, PinoLoggerAdapter as G, createLoggerPlugin as H, createSelectionContext as I, createTrinity as J, ConsolaLoggerAdapter as K, useSelection as L, useProxyRegistry as M, useProxyModel as N, useHydration as O, toArray as P, createRegistryContext as R, useElementSize as S, createHydration as T, useLogger as U, createLoggerContext as V, Vuetify0LoggerAdapter as W, provideContext as X, createContext as Y, useContext as Z, createPaginationContext as _, createLocaleContext as a, createOverflowContext as b, useLocale as c, createTokensContext as d, useTokens as f, createPagination as g, useSingle as h, createLocale as i, useGroup as j, createGroup as k, Vuetify0LocaleAdapter as l, createSingleContext as m, createStepContext as n, createLocaleFallback as o, createSingle as p, createPlugin as q, useStep as r, createLocalePlugin as s, createStep as t, createTokens as u, usePagination as v, createFallbackHydration as w, useOverflow as x, createOverflow as y, useRegistry as z };
+export { createGroupContext as A, createLogger as B, createTokensContext as C, useSingle as D, createSingleContext as E, createSelection as F, PinoLoggerAdapter as G, createLoggerPlugin as H, createSelectionContext as I, createTrinity as J, ConsolaLoggerAdapter as K, useSelection as L, useProxyRegistry as M, useProxyModel as N, Vuetify0LocaleAdapter as O, toArray as P, createRegistryContext as R, createTokens as S, createSingle as T, useLogger as U, createLoggerContext as V, Vuetify0LoggerAdapter as W, provideContext as X, createContext as Y, useContext as Z, createLocale as _, createPaginationContext as a, createLocalePlugin as b, createOverflowContext as c, useResizeObserver as d, createFallbackHydration as f, useHydration as g, createHydrationPlugin as h, createPagination as i, useGroup as j, createGroup as k, useOverflow as l, createHydrationContext as m, createStepContext as n, usePagination as o, createHydration as p, createPlugin as q, useStep as r, createOverflow as s, createStep as t, useElementSize as u, createLocaleContext as v, useTokens as w, useLocale as x, createLocaleFallback as y, useRegistry as z };