@kimesh/query 0.0.1

package/dist/index.mjs

@@ -0,0 +1,1005 @@
+import { QueryClient, QueryClient as QueryClient$1, VueQueryPlugin, VueQueryPlugin as VueQueryPlugin$1, queryOptions, useInfiniteQuery, useInfiniteQuery as useInfiniteQuery$1, useMutation, useMutation as useMutation$1, useQuery, useQuery as useQuery$1, useQueryClient, useQueryClient as useQueryClient$1 } from "@tanstack/vue-query";
+import { ofetch } from "ofetch";
+import { computed, ref, toValue, watch } from "vue";
+import { hash } from "ohash";
+
+//#region src/plugin.ts
+/** Default timing values */
+const DEFAULT_STALE_TIME = 5 * 1e3;
+const DEFAULT_GC_TIME = 300 * 1e3;
+const DEFAULT_RETRY = 1;
+const DEFAULT_REFETCH_ON_WINDOW_FOCUS = false;
+/**
+* Create a QueryClient with Kimesh-optimized defaults
+*
+* Defaults are designed for typical SPA usage:
+* - Short stale time (5s) for responsive UX
+* - Longer GC time (5min) to preserve cache during navigation
+* - Single retry to recover from transient errors
+* - No refetch on focus to reduce unnecessary requests
+*/
+function createKimeshQueryClient(options = {}) {
+	return new QueryClient$1({ defaultOptions: { queries: {
+		staleTime: options.staleTime ?? DEFAULT_STALE_TIME,
+		gcTime: options.gcTime ?? DEFAULT_GC_TIME,
+		retry: options.retry ?? DEFAULT_RETRY,
+		refetchOnWindowFocus: options.refetchOnWindowFocus ?? DEFAULT_REFETCH_ON_WINDOW_FOCUS
+	} } });
+}
+/**
+* KimeshQueryPlugin - Centralized query plugin with sensible defaults
+*
+* @example
+* ```ts
+* import { KimeshQueryPlugin } from '@kimesh/query'
+*
+* // Basic usage with defaults
+* app.use(KimeshQueryPlugin)
+*
+* // With custom options
+* app.use(KimeshQueryPlugin, {
+*   staleTime: 10 * 1000,
+*   retry: 2,
+* })
+*
+* // With custom QueryClient
+* app.use(KimeshQueryPlugin, {
+*   queryClient: myCustomQueryClient,
+* })
+* ```
+*/
+const KimeshQueryPlugin = { install(app, options = {}) {
+	const queryClient = options.queryClient ?? createKimeshQueryClient(options);
+	app.use(VueQueryPlugin$1, {
+		...options,
+		queryClient
+	});
+} };
+
+//#endregion
+//#region src/fetch/create-fetch.ts
+/**
+* Factory function for creating configured fetch instances.
+*/
+/**
+* Create a configured fetch instance.
+*
+* @example
+* ```ts
+* const api = createKmFetch({
+*   baseURL: 'https://api.example.com',
+*   timeout: 5000,
+* })
+*
+* const users = await api('/users')
+* ```
+*/
+function createKmFetch(config = {}) {
+	const fetchInstance = ofetch.create(config);
+	fetchInstance.create = (defaults) => createKmFetch({
+		...config,
+		...defaults,
+		headers: {
+			...config.headers,
+			...defaults.headers
+		}
+	});
+	return fetchInstance;
+}
+
+//#endregion
+//#region src/fetch/layer-fetch.ts
+/**
+* Layer-aware fetch system.
+*
+* Provides fetch instances that automatically switch based on the current route's layer.
+* This enables layer-specific API configurations (e.g., blog layer uses blog-api.com).
+*/
+const currentLayer = ref("app");
+const layerInstances = /* @__PURE__ */ new Map();
+const layerInterceptors = /* @__PURE__ */ new Map();
+let defaultConfig = {};
+let isInitialized = false;
+let routerRef = null;
+let pendingRoute = null;
+function registerLayerInterceptors(layer, interceptors) {
+	layerInterceptors.set(layer, interceptors);
+}
+/**
+* Set router reference for layer detection.
+* Installs navigation hooks to track pending route during navigation.
+*/
+function setRouter(router) {
+	routerRef = router;
+	router.beforeEach((to) => {
+		pendingRoute = to;
+	});
+	router.afterEach(() => {
+		pendingRoute = null;
+	});
+}
+function getLayerFromRoute(route) {
+	return [...route.matched].reverse().find((r) => r.meta.__kimeshLayer)?.meta.__kimeshLayer ?? "app";
+}
+function detectCurrentLayer() {
+	if (pendingRoute) return getLayerFromRoute(pendingRoute);
+	if (routerRef) return getLayerFromRoute(routerRef.currentRoute.value);
+	return currentLayer.value;
+}
+/**
+* Initialize the layer-aware fetch system.
+*/
+function initLayerFetch(configs) {
+	defaultConfig = configs.default;
+	layerInstances.clear();
+	for (const [layer, config] of Object.entries(configs.layers)) {
+		const mergedConfig = {
+			...defaultConfig,
+			...config,
+			headers: {
+				...defaultConfig.headers,
+				...config.headers
+			}
+		};
+		layerInstances.set(layer, createKmFetch(mergedConfig));
+	}
+	if (!layerInstances.has("app")) layerInstances.set("app", createKmFetch(defaultConfig));
+	isInitialized = true;
+}
+function setCurrentLayer(layer) {
+	currentLayer.value = layer;
+}
+function getCurrentLayer() {
+	return currentLayer.value;
+}
+/**
+* Get fetch instance for a specific layer.
+* Falls back to 'app' layer if the requested layer is not found.
+*/
+function getLayerFetch(layer) {
+	const targetLayer = layer ?? detectCurrentLayer();
+	if (layerInstances.has(targetLayer)) return layerInstances.get(targetLayer);
+	if (layerInstances.has("app")) return layerInstances.get("app");
+	layerInstances.set("app", createKmFetch(defaultConfig));
+	return layerInstances.get("app");
+}
+function isLayerFetchInitialized() {
+	return isInitialized;
+}
+/**
+* Layer-aware $fetch proxy.
+*
+* Automatically routes requests through the current layer's fetch instance.
+* When navigating to /blog/*, the current layer becomes 'blog' and uses
+* the blog layer's configuration.
+*
+* @example
+* ```ts
+* // In a blog route component - uses blog layer's baseURL
+* const posts = await $fetch('/posts')
+*
+* // Force specific layer
+* const hostData = await getLayerFetch('app')('/data')
+* ```
+*/
+const $fetch = new Proxy((() => {}), {
+	get(_target, prop) {
+		const instance = getLayerFetch();
+		const value = instance[prop];
+		return typeof value === "function" ? value.bind(instance) : value;
+	},
+	apply(_target, _thisArg, args) {
+		const layer = detectCurrentLayer();
+		const instance = getLayerFetch(layer);
+		const interceptors = layerInterceptors.get(layer);
+		if (interceptors?.onRequest) interceptors.onRequest({
+			request: args[0],
+			options: args[1] ?? {}
+		});
+		const promise = instance(args[0], args[1]);
+		if (interceptors?.onResponse) return promise.then((response) => {
+			interceptors.onResponse({
+				request: args[0],
+				response: { status: 200 }
+			});
+			return response;
+		});
+		return promise;
+	}
+});
+
+//#endregion
+//#region src/fetch/fetch-plugin.ts
+function extractFetchConfig(config) {
+	if (!config) return {};
+	return {
+		baseURL: config.baseURL,
+		timeout: config.timeout,
+		retry: config.retry,
+		retryDelay: config.retryDelay,
+		credentials: config.credentials,
+		headers: config.headers
+	};
+}
+function mergeHeaders(...headerSets) {
+	return Object.assign({}, ...headerSets.filter(Boolean));
+}
+/**
+* Create a Kimesh runtime plugin for $fetch.
+*
+* @example Basic usage
+* ```typescript
+* import { fetchPlugin } from '@kimesh/query'
+* export default fetchPlugin()
+* ```
+*
+* @example With custom config
+* ```typescript
+* import { fetchPlugin } from '@kimesh/query'
+* export default fetchPlugin({
+*   config: {
+*     onRequest: ({ options }) => {
+*       options.headers = { ...options.headers, 'X-Custom': 'value' }
+*     },
+*   },
+* })
+* ```
+*/
+function fetchPlugin(options = {}) {
+	const { config: overrideConfig = {}, key = "fetch", disableLayerAware = false } = options;
+	const plugin = (app) => {
+		const defaultFetchConfig = extractFetchConfig(app.$config?.fetch);
+		const defaultConfig$1 = {
+			...defaultFetchConfig,
+			...overrideConfig,
+			headers: mergeHeaders(defaultFetchConfig.headers, overrideConfig.headers)
+		};
+		const layersConfig = app.$layersConfig ?? {};
+		const hasLayerConfigs = Object.keys(layersConfig).length > 0;
+		if (!disableLayerAware && hasLayerConfigs) {
+			const layerFetchConfigs = {};
+			for (const [layerName, layerConfig] of Object.entries(layersConfig)) {
+				const fetchConfig = extractFetchConfig(layerConfig.fetch);
+				if (Object.keys(fetchConfig).some((k) => fetchConfig[k] !== void 0)) layerFetchConfigs[layerName] = fetchConfig;
+			}
+			initLayerFetch({
+				layers: layerFetchConfigs,
+				default: defaultConfig$1
+			});
+			setRouter(app.router);
+			return { provide: { [key]: $fetch } };
+		}
+		return { provide: { [key]: createKmFetch(defaultConfig$1) } };
+	};
+	plugin.__kimesh_plugin = true;
+	plugin._name = "kimesh:fetch";
+	plugin.meta = {
+		name: "kimesh:fetch",
+		enforce: "pre"
+	};
+	return plugin;
+}
+/**
+* Create a named fetch plugin for multi-instance scenarios.
+*
+* @example
+* ```typescript
+* export const blogFetch = createNamedFetchPlugin('blogFetch', {
+*   baseURL: 'https://blog-api.example.com',
+* })
+* ```
+*/
+function createNamedFetchPlugin(name, config = {}) {
+	return fetchPlugin({
+		key: name,
+		config
+	});
+}
+/**
+* Create a layer-specific fetch interceptor plugin.
+* Use this in layer plugins to add logging or modify requests for that layer only.
+*
+* @example
+* ```typescript
+* // blog/src/plugins/01.fetch.ts
+* import { layerFetchPlugin } from '@kimesh/query'
+*
+* export default layerFetchPlugin({
+*   layer: 'blog',
+*   onRequest: ({ request }) => console.log(`[Blog] Fetching: ${request}`),
+* })
+* ```
+*/
+function layerFetchPlugin(options) {
+	const { layer, onRequest, onResponse } = options;
+	const plugin = () => {
+		registerLayerInterceptors(layer, {
+			onRequest,
+			onResponse
+		});
+	};
+	plugin.__kimesh_plugin = true;
+	plugin._name = `kimesh:fetch:${layer}`;
+	return plugin;
+}
+
+//#endregion
+//#region src/fetch/global-fetch.ts
+/**
+* Global $fetch instance configured from runtime config.
+*/
+let globalInstance = null;
+/**
+* Initialize the global $fetch instance with runtime config.
+* Called automatically by Kimesh during app initialization.
+*/
+function initGlobalFetch(config) {
+	globalInstance = createKmFetch({
+		baseURL: config.fetch?.baseURL ?? config.apiBase,
+		headers: config.fetch?.headers,
+		timeout: config.fetch?.timeout,
+		retry: config.fetch?.retry,
+		retryDelay: config.fetch?.retryDelay,
+		credentials: config.fetch?.credentials
+	});
+	return globalInstance;
+}
+/**
+* Get the global fetch instance. Creates a default instance if not initialized.
+*/
+function useGlobalFetch() {
+	if (!globalInstance) globalInstance = createKmFetch({});
+	return globalInstance;
+}
+/**
+* Global $fetch proxy that lazily accesses the global fetch instance.
+*
+* @example
+* ```ts
+* const users = await $fetch('/api/users')
+* const user = await $fetch('/api/users', { method: 'POST', body: { name: 'John' } })
+* ```
+*/
+const $fetch$1 = new Proxy((() => {}), {
+	get(_target, prop) {
+		const instance = useGlobalFetch();
+		const value = instance[prop];
+		return typeof value === "function" ? value.bind(instance) : value;
+	},
+	apply(_target, _thisArg, args) {
+		return useGlobalFetch()(args[0], args[1]);
+	}
+});
+
+//#endregion
+//#region src/loader.ts
+/**
+* Normalizes a loader result to an array
+*/
+function normalizeLoaders(loader) {
+	return Array.isArray(loader) ? loader : [loader];
+}
+/**
+* Execute a loader and prefetch data
+*/
+async function executeLoader(queryClient, loader) {
+	const loaders = normalizeLoaders(loader);
+	await Promise.all(loaders.map((def) => queryClient.prefetchQuery({
+		queryKey: def.queryKey,
+		queryFn: def.queryFn,
+		staleTime: def.staleTime,
+		gcTime: def.gcTime
+	})));
+}
+/**
+* Type guard to check if a component has a loader function
+*/
+function hasLoader(component) {
+	if (typeof component !== "object" || component === null) return false;
+	return "loader" in component && typeof component.loader === "function";
+}
+/**
+* Extract loaders from route matched components
+*/
+function extractLoaders(to) {
+	const loaders = [];
+	for (const matched of to.matched) {
+		const component = matched.components?.default;
+		if (!hasLoader(component)) continue;
+		const result = component.loader(to);
+		if (!result) continue;
+		loaders.push(...normalizeLoaders(result));
+	}
+	return loaders;
+}
+
+//#endregion
+//#region src/prefetch.ts
+/**
+* Check if a path matches a single pattern (string or regex)
+*/
+function matchesSinglePattern(path, pattern) {
+	if (typeof pattern === "string") return path === pattern || path.startsWith(pattern + "/");
+	return pattern.test(path);
+}
+/**
+* Check if a path matches any pattern in the array
+*/
+function matchesAnyPattern(path, patterns) {
+	return patterns.some((pattern) => matchesSinglePattern(path, pattern));
+}
+/**
+* Determines if a path should be prefetched based on include/exclude patterns
+*/
+function shouldPrefetch(path, exclude, include) {
+	if (exclude.length > 0 && matchesAnyPattern(path, exclude)) return false;
+	if (include && !matchesAnyPattern(path, include)) return false;
+	return true;
+}
+/**
+* Setup query prefetching on route navigation
+*
+* @example
+* ```ts
+* import { setupQueryPrefetching } from '@kimesh/query'
+*
+* const router = createRouter({ ... })
+* const queryClient = new QueryClient()
+*
+* setupQueryPrefetching(router, queryClient, {
+*   onStart: (to) => console.log('Prefetching', to.path),
+*   onError: (error) => console.error('Prefetch failed', error),
+* })
+* ```
+*
+* @returns Function to remove the guard
+*/
+function setupQueryPrefetching(router, queryClient, options = {}) {
+	const { onStart, onComplete, onError, exclude = [], include } = options;
+	return router.beforeResolve(async (to) => {
+		if (!shouldPrefetch(to.path, exclude, include)) return;
+		const loaders = extractLoaders(to);
+		if (loaders.length === 0) return;
+		onStart?.(to, loaders);
+		try {
+			await Promise.all(loaders.map((loader) => executeLoader(queryClient, loader)));
+			onComplete?.(to, loaders);
+		} catch (error) {
+			onError?.(error, to);
+		}
+	});
+}
+/**
+* Create a prefetch function for manual prefetching (e.g., on hover)
+*
+* @example
+* ```ts
+* const prefetch = createPrefetcher(queryClient, router)
+*
+* // Prefetch on hover
+* <RouterLink :to="{ name: 'user' }" @mouseenter="prefetch('/user/123')">
+* ```
+*/
+function createPrefetcher(queryClient, router) {
+	return async function prefetch(path) {
+		const loaders = extractLoaders(router.resolve(path));
+		if (loaders.length === 0) return;
+		await Promise.all(loaders.map((loader) => executeLoader(queryClient, loader)));
+	};
+}
+
+//#endregion
+//#region src/composables/useKmFetch.ts
+/**
+* Builds a Nuxt-style result from a TanStack Query result.
+*/
+function buildAsyncDataResult$1(query, queryKey, queryClient) {
+	const pending = computed(() => query.isLoading.value || query.isFetching.value);
+	const status = computed(() => {
+		if (query.isLoading.value) return "pending";
+		if (query.isError.value) return "error";
+		if (query.isSuccess.value) return "success";
+		return "idle";
+	});
+	return {
+		data: query.data,
+		pending,
+		error: query.error,
+		status,
+		refresh: async () => {
+			await query.refetch();
+		},
+		execute: async () => {
+			await query.refetch();
+		},
+		clear: () => {
+			queryClient.removeQueries({ queryKey: [...queryKey] });
+		}
+	};
+}
+/**
+* Generate a unique cache key from URL and options.
+*/
+function generateKey(url, method, query, body) {
+	return `kmFetch:${hash({
+		url,
+		method,
+		query,
+		body
+	})}`;
+}
+/**
+* Nuxt-style fetch composable built on $fetch and TanStack Query.
+*
+* @example
+* ```ts
+* // Simple GET
+* const { data, pending, error } = useKmFetch('/api/users')
+*
+* // With query params
+* const { data } = useKmFetch('/api/users', {
+*   query: { page: 1, limit: 10 },
+* })
+*
+* // POST with body
+* const { data } = useKmFetch('/api/users', {
+*   method: 'POST',
+*   body: { name: 'John' },
+* })
+*
+* // With interceptors
+* const { data } = useKmFetch('/api/protected', {
+*   onRequest({ options }) {
+*     options.headers.set('Authorization', `Bearer ${token}`)
+*   },
+* })
+*
+* // Reactive URL
+* const userId = ref(1)
+* const { data } = useKmFetch(() => `/api/users/${userId.value}`)
+* ```
+*/
+function useKmFetch(url, options = {}) {
+	const queryClient = useQueryClient$1();
+	const fetchInstance = options.$fetch ?? useGlobalFetch();
+	const resolvedUrl = computed(() => toValue(url));
+	const resolvedMethod = computed(() => toValue(options.method) ?? "GET");
+	const resolvedQuery = computed(() => toValue(options.query ?? options.params));
+	const resolvedBody = computed(() => toValue(options.body));
+	const resolvedHeaders = computed(() => toValue(options.headers));
+	const resolvedBaseURL = computed(() => toValue(options.baseURL));
+	const resolvedTimeout = computed(() => toValue(options.timeout));
+	const queryKey = computed(() => {
+		return [options.key ?? generateKey(resolvedUrl.value, resolvedMethod.value, resolvedQuery.value, resolvedBody.value)];
+	});
+	const query = useQuery$1({
+		queryKey: queryKey.value,
+		queryFn: async () => {
+			const response = await fetchInstance(resolvedUrl.value, {
+				method: resolvedMethod.value,
+				query: resolvedQuery.value,
+				body: resolvedBody.value,
+				headers: resolvedHeaders.value,
+				baseURL: resolvedBaseURL.value,
+				timeout: resolvedTimeout.value,
+				onRequest: options.onRequest,
+				onRequestError: options.onRequestError,
+				onResponse: options.onResponse,
+				onResponseError: options.onResponseError
+			});
+			return options.transform ? options.transform(response) : response;
+		},
+		enabled: options.immediate !== false,
+		staleTime: options.staleTime,
+		gcTime: options.gcTime,
+		initialData: options.default
+	});
+	if (options.watch !== false) {
+		const watchSources = options.watch ?? [
+			resolvedUrl,
+			resolvedMethod,
+			resolvedQuery,
+			resolvedBody
+		];
+		if (watchSources.length > 0) watch(watchSources, () => {
+			query.refetch();
+		});
+	}
+	return buildAsyncDataResult$1(query, queryKey.value, queryClient);
+}
+/**
+* Lazy variant - starts fetching immediately (non-blocking pattern).
+*
+* Note: Despite the "lazy" name (Nuxt convention), this starts immediately.
+* Use this when data loading shouldn't block rendering.
+*/
+function useLazyKmFetch(url, options = {}) {
+	return useKmFetch(url, {
+		...options,
+		immediate: true
+	});
+}
+
+//#endregion
+//#region src/composables/useKmAsyncData.ts
+/**
+* Builds a Nuxt-style result from a TanStack Query result.
+*/
+function buildAsyncDataResult(query, queryKey, queryClient) {
+	const pending = computed(() => query.isLoading.value || query.isFetching.value);
+	const status = computed(() => {
+		if (query.isLoading.value) return "pending";
+		if (query.isError.value) return "error";
+		if (query.isSuccess.value) return "success";
+		return "idle";
+	});
+	return {
+		data: query.data,
+		pending,
+		error: query.error,
+		status,
+		refresh: async () => {
+			await query.refetch();
+		},
+		execute: async () => {
+			await query.refetch();
+		},
+		clear: () => {
+			queryClient.removeQueries({ queryKey: [...queryKey] });
+		}
+	};
+}
+/**
+* Generic async data composable.
+*
+* @example
+* ```ts
+* // Basic usage
+* const { data, pending } = useKmAsyncData('currentUser', async () => {
+*   return await api.users.getCurrentUser()
+* })
+*
+* // With $fetch from context
+* const { data } = useKmAsyncData('users', async ({ $fetch }) => {
+*   return await $fetch('/api/users')
+* })
+*
+* // With transform
+* const { data } = useKmAsyncData('posts', fetchPosts, {
+*   transform: (data) => data.items,
+* })
+* ```
+*/
+function useKmAsyncData(key, handler, options = {}) {
+	const queryClient = useQueryClient$1();
+	const fetchInstance = options.$fetch ?? useGlobalFetch();
+	const queryKey = [key];
+	const query = useQuery$1({
+		queryKey,
+		queryFn: async () => {
+			const raw = await handler({ $fetch: fetchInstance });
+			return options.transform ? options.transform(raw) : raw;
+		},
+		enabled: options.immediate !== false,
+		staleTime: options.staleTime,
+		gcTime: options.gcTime,
+		initialData: options.default
+	});
+	if (options.watch?.length) watch(options.watch, () => {
+		query.refetch();
+	});
+	return buildAsyncDataResult(query, queryKey, queryClient);
+}
+/**
+* Lazy variant - starts fetching immediately (non-blocking pattern).
+*
+* Note: Despite the "lazy" name (Nuxt convention), this starts immediately.
+* Use this when data loading shouldn't block rendering.
+*/
+function useLazyKmAsyncData(key, handler, options = {}) {
+	return useKmAsyncData(key, handler, {
+		...options,
+		immediate: true
+	});
+}
+
+//#endregion
+//#region src/composables/useKmData.ts
+/**
+* Access cached data by key
+*
+* @example
+* ```ts
+* const user = useKmData<User>('currentUser')
+* // Can also update
+* user.value = { ...user.value, name: 'New Name' }
+* ```
+*/
+function useKmData(key) {
+	const queryClient = useQueryClient$1();
+	return computed({
+		get: () => queryClient.getQueryData([key]),
+		set: (value) => {
+			queryClient.setQueryData([key], value);
+		}
+	});
+}
+
+//#endregion
+//#region src/define-query.ts
+/**
+* Extracts the query function from options, supporting both naming styles
+*/
+function extractQueryFn(options) {
+	const queryFn = options.query ?? options.queryFn;
+	if (!queryFn) throw new Error("Query function required: provide either \"query\" or \"queryFn\"");
+	return queryFn;
+}
+/**
+* Define static query options (Pinia Colada style)
+*
+* @example
+* ```ts
+* // Pinia Colada naming (preferred)
+* export const postsListQuery = defineQueryOptions({
+*   key: ['posts', 'list'],
+*   query: () => api.posts.getAll(),
+*   staleTime: 5 * 60 * 1000,
+* })
+*
+* // TanStack naming (also supported)
+* export const postsListQuery = defineQueryOptions({
+*   key: ['posts', 'list'],
+*   queryFn: () => api.posts.getAll(),
+* })
+*
+* // Usage with useQuery
+* const { data } = useQuery(postsListQuery)
+* ```
+*/
+function defineQueryOptions(options) {
+	const queryFn = extractQueryFn(options);
+	return {
+		key: options.key,
+		query: queryFn,
+		queryKey: options.key,
+		queryFn,
+		staleTime: options.staleTime,
+		gcTime: options.gcTime,
+		enabled: options.enabled
+	};
+}
+/**
+* Create a reusable query composable (Pinia Colada style)
+*
+* @example
+* ```ts
+* export const useCurrentUser = defineQuery({
+*   key: ['user', 'current'],
+*   query: () => api.users.getCurrentUser(),
+* })
+*
+* // State is shared across components!
+* const { data: user } = useCurrentUser()
+* ```
+*/
+function defineQuery(options) {
+	const queryFn = extractQueryFn(options);
+	return function useDefinedQuery() {
+		return useQuery$1({
+			queryKey: options.key,
+			queryFn,
+			staleTime: options.staleTime,
+			gcTime: options.gcTime
+		});
+	};
+}
+
+//#endregion
+//#region src/define-mutation.ts
+/**
+* Define a reusable mutation composable (Pinia Colada style)
+*
+* Creates a composable that can be imported and used across multiple components.
+* The mutation configuration is defined once and reused everywhere.
+*
+* @example
+* ```ts
+* // Define the mutation
+* export const useCreatePost = defineMutation({
+*   mutation: (data: { title: string; body: string }) => api.posts.create(data),
+*   onSuccess: (data, variables) => {
+*     queryClient.invalidateQueries({ queryKey: ['posts'] })
+*   },
+* })
+*
+* // Use in component
+* const { mutate, mutateAsync, isPending } = useCreatePost()
+* mutate({ title: 'New Post', body: 'Content...' })
+* ```
+*/
+function defineMutation(options) {
+	return function useDefinedMutation() {
+		return useMutation$1({
+			mutationFn: options.mutation,
+			onSuccess: options.onSuccess,
+			onError: options.onError,
+			onSettled: options.onSettled
+		});
+	};
+}
+
+//#endregion
+//#region src/query-keys.ts
+/**
+* Create a type-safe query key factory
+*
+* Creates a factory object with methods that generate consistent, hierarchical
+* query keys. This helps maintain cache invalidation patterns and ensures
+* type safety across your application.
+*
+* @example
+* ```ts
+* export const postKeys = createQueryKeyFactory('posts', {
+*   lists: null,                              // () => ['posts', 'lists']
+*   list: (filters: { page: number }) => filters,  // (f) => ['posts', 'list', f]
+*   details: null,                            // () => ['posts', 'details']
+*   detail: (id: string) => id,               // (id) => ['posts', 'detail', id]
+* })
+*
+* // Usage
+* postKeys.all()             // ['posts']
+* postKeys.lists()           // ['posts', 'lists']
+* postKeys.list({ page: 1 }) // ['posts', 'list', { page: 1 }]
+* postKeys.detail('123')     // ['posts', 'detail', '123']
+*
+* // Invalidation example
+* queryClient.invalidateQueries({ queryKey: postKeys.all() })
+* ```
+*/
+function createQueryKeyFactory(root, keys) {
+	const factory = { all: () => [root] };
+	for (const [key, handler] of Object.entries(keys)) if (handler === null) factory[key] = () => [root, key];
+	else factory[key] = (arg) => [
+		root,
+		key,
+		handler(arg)
+	];
+	return factory;
+}
+
+//#endregion
+//#region src/defer.ts
+/**
+* Prefetches a single query using the query client
+*/
+function prefetchSingleQuery(queryClient, query) {
+	return queryClient.prefetchQuery({
+		queryKey: query.queryKey,
+		queryFn: query.queryFn,
+		staleTime: query.staleTime,
+		gcTime: query.gcTime
+	});
+}
+/**
+* Start fetching queries without blocking navigation (fire-and-forget).
+*
+* Use this in route loaders for non-critical data. The queries will start
+* fetching in the background, and components using useSuspenseQuery will
+* suspend until the data is ready.
+*
+* @example
+* ```ts
+* export const Route = createFileRoute('/users/:userId')({
+*   loader: async ({ params, context }) => {
+*     const { queryClient } = context
+*
+*     // Critical - blocks navigation until ready
+*     await queryClient.ensureQueryData(userQuery(params.userId))
+*
+*     // Deferred - starts fetching without blocking navigation
+*     defer(queryClient,
+*       userActivityQuery(params.userId),
+*       userRecommendationsQuery(params.userId),
+*     )
+*   },
+* })
+* ```
+*/
+function defer(queryClient, ...queries) {
+	for (const query of queries) prefetchSingleQuery(queryClient, query);
+}
+/**
+* Start fetching queries and return promises for optional awaiting.
+*
+* Unlike defer(), this returns the prefetch promises, allowing you to
+* optionally await them later (e.g., for analytics or debugging).
+*
+* @example
+* ```ts
+* // Start fetching
+* const promises = deferWithPromises(queryClient, slowQuery1, slowQuery2)
+*
+* // Continue with other work...
+*
+* // Later, if you need to know when they complete:
+* await Promise.all(promises)
+* ```
+*/
+function deferWithPromises(queryClient, ...queries) {
+	return queries.map((query) => prefetchSingleQuery(queryClient, query));
+}
+
+//#endregion
+//#region src/suspense.ts
+/**
+* @kimesh/query - Suspense Query Composables
+*
+* Provides a simple API for suspense-compatible data fetching.
+* Uses top-level await in <script setup> to trigger Vue's Suspense.
+*
+* @example
+* ```vue
+* <script setup>
+* // Top-level await triggers Suspense automatically
+* const { data } = await useSuspenseQuery(postsQuery)
+* <\/script>
+* ```
+*/
+/**
+* Suspense-compatible query hook for Vue.
+*
+* Returns a Promise that resolves to the query result when data is ready.
+* Use with top-level await in <script setup> to trigger Suspense.
+*
+* @example
+* ```vue
+* <script setup>
+* import { useSuspenseQuery } from '@kimesh/query'
+* import { postsQuery } from './posts.data'
+*
+* // Awaiting triggers Suspense - component suspends until data ready
+* // data is typed as Ref<Post[]> (not Ref<Post[] | undefined>)
+* const { data: posts } = await useSuspenseQuery(postsQuery)
+* <\/script>
+*
+* <template>
+*   <div v-for="post in posts" :key="post.id">{{ post.title }}</div>
+* </template>
+* ```
+*/
+async function useSuspenseQuery(options) {
+	const result = useQuery$1({
+		queryKey: options.queryKey,
+		queryFn: options.queryFn,
+		staleTime: options.staleTime,
+		gcTime: options.gcTime,
+		enabled: options.enabled
+	});
+	await result.suspense();
+	return result;
+}
+/**
+* Suspense-compatible infinite query hook for Vue.
+*
+* Note: This is a basic implementation. For full infinite query support,
+* you may need to extend the options interface to include initialPageParam
+* and getNextPageParam configuration.
+*/
+async function useSuspenseInfiniteQuery(options) {
+	const result = useInfiniteQuery$1({
+		queryKey: options.queryKey,
+		queryFn: options.queryFn,
+		staleTime: options.staleTime,
+		gcTime: options.gcTime,
+		enabled: options.enabled,
+		initialPageParam: 0,
+		getNextPageParam: () => void 0
+	});
+	await result.suspense();
+	return result;
+}
+
+//#endregion
+export { $fetch, KimeshQueryPlugin, QueryClient, VueQueryPlugin, createKimeshQueryClient, createKmFetch, createNamedFetchPlugin, createPrefetcher, createQueryKeyFactory, defer, deferWithPromises, defineMutation, defineQuery, defineQueryOptions, executeLoader, extractLoaders, fetchPlugin, getCurrentLayer, getLayerFetch, hasLoader, initGlobalFetch, initLayerFetch, isLayerFetchInitialized, layerFetchPlugin, queryOptions, setCurrentLayer, setupQueryPrefetching, useGlobalFetch, useInfiniteQuery, useKmAsyncData, useKmData, useKmFetch, useLazyKmAsyncData, useLazyKmFetch, useMutation, useQuery, useQueryClient, useSuspenseInfiniteQuery, useSuspenseQuery };
+//# sourceMappingURL=index.mjs.map