nuxt-openapi-hyperfetch 0.1.6-alpha.1 → 0.1.8-alpha.1

package/dist/generators/use-async-data/runtime/useApiAsyncData.js

@@ -1,4 +1,11 @@
+// @ts-nocheck
+/**
+ * Nuxt Runtime Helper - This file is copied to the generated output
+ * It requires Nuxt 3 to be installed in the target project
+ */
+import { ref, computed } from 'vue';
 import { getGlobalHeaders, getGlobalBaseUrl, applyPick, mergeCallbacks, } from '../../shared/runtime/apiHelpers.js';
+import { getGlobalApiPagination, buildPaginationRequest, extractPaginationMetaFromBody, extractPaginationMetaFromHeaders, unwrapDataKey, } from '../../shared/runtime/pagination.js';
 /**
  * Generic wrapper for API calls using Nuxt's useAsyncData
  * Supports:
@@ -9,9 +16,21 @@ import { getGlobalHeaders, getGlobalBaseUrl, applyPick, mergeCallbacks, } from '
  * - Watch pattern for reactive parameters
  */
 export function useApiAsyncData(key, url, options) {
-    const { method = 'GET', body, headers = {}, params, transform, pick, onRequest, onSuccess, onError, onFinish, skipGlobalCallbacks, immediate = true, lazy = false, server = true, dedupe = 'cancel', watch: watchOption = true, ...restOptions } = options || {};
+    const { method = 'GET', body, headers = {}, params, baseURL, cacheKey, transform, pick, onRequest, onSuccess, onError, onFinish, skipGlobalCallbacks, immediate = true, lazy = false, server = true, dedupe = 'cancel', watch: watchOption = true, paginated, initialPage, initialPerPage, paginationConfig, ...restOptions } = options || {};
+    // ---------------------------------------------------------------------------
+    // Pagination setup
+    // ---------------------------------------------------------------------------
+    const activePaginationConfig = paginationConfig ?? (paginated ? getGlobalApiPagination() : null);
+    const page = ref(initialPage ?? activePaginationConfig?.request.defaults.page ?? 1);
+    const perPage = ref(initialPerPage ?? activePaginationConfig?.request.defaults.perPage ?? 20);
+    const paginationState = ref({
+        currentPage: page.value,
+        totalPages: 0,
+        total: 0,
+        perPage: perPage.value,
+    });
     // Resolve base URL once at setup time (not inside fetchFn to avoid warning on every request)
-    const resolvedBaseURL = restOptions.baseURL || getGlobalBaseUrl();
+    const resolvedBaseURL = baseURL || getGlobalBaseUrl();
     if (!resolvedBaseURL) {
         console.warn('[nuxt-openapi-hyperfetch] No baseURL configured. Set runtimeConfig.public.apiBaseUrl in nuxt.config.ts or pass baseURL in options.');
     }
@@ -29,13 +48,27 @@ export function useApiAsyncData(key, url, options) {
                         ? [() => params]
                         : []
                 : []),
+            // Add pagination refs so page/perPage changes trigger re-fetch
+            ...(paginated ? [page, perPage] : []),
         ];
+    // Build a reactive cache key: composableName + resolved URL + serialized query params
+    // This ensures distinct params produce distinct keys — preventing cache collisions
+    const computedKey = () => {
+        if (cacheKey)
+            return cacheKey;
+        const resolvedUrl = typeof url === 'function' ? url() : url;
+        const resolvedParams = toValue(params);
+        const paramsSuffix = resolvedParams && typeof resolvedParams === 'object' && Object.keys(resolvedParams).length > 0
+            ? '-' + JSON.stringify(resolvedParams)
+            : '';
+        return `${key}-${resolvedUrl}${paramsSuffix}`;
+    };
     // Fetch function for useAsyncData
     const fetchFn = async () => {
         // Get URL value for merging callbacks
         const finalUrl = typeof url === 'function' ? url() : url;
         // Merge local and global callbacks
-        const mergedCallbacks = mergeCallbacks(finalUrl, { onRequest, onSuccess, onError, onFinish }, skipGlobalCallbacks);
+        const mergedCallbacks = mergeCallbacks(finalUrl, method, { onRequest, onSuccess, onError, onFinish }, skipGlobalCallbacks);
         try {
             // Get global headers
             const globalHeaders = getGlobalHeaders();
@@ -63,23 +96,81 @@ export function useApiAsyncData(key, url, options) {
                             ...modifications.headers,
                         };
                     }
-                    if (modifications.params !== undefined) {
+                    if (modifications.query !== undefined) {
                         modifiedContext.params = {
                             ...modifiedContext.params,
-                            ...modifications.params,
+                            ...modifications.query,
                         };
                     }
                 }
             }
             // Make the request with $fetch — toValue() unrefs any Ref/ComputedRef
-            let data = await $fetch(modifiedContext.url, {
-                method: modifiedContext.method,
-                headers: modifiedContext.headers,
-                body: toValue(modifiedContext.body),
-                params: toValue(modifiedContext.params),
-                ...(resolvedBaseURL ? { baseURL: resolvedBaseURL } : {}),
-                ...restOptions,
-            });
+            // For paginated requests with metaSource:'headers', use $fetch.raw for header access
+            let data;
+            if (paginated && activePaginationConfig) {
+                // Inject pagination params into the correct location
+                const paginationPayload = buildPaginationRequest(page.value, perPage.value, activePaginationConfig);
+                const paginatedQuery = { ...toValue(modifiedContext.params), ...paginationPayload.query };
+                const paginatedBody = paginationPayload.body
+                    ? { ...(toValue(modifiedContext.body) ?? {}), ...paginationPayload.body }
+                    : toValue(modifiedContext.body);
+                const paginatedHeaders = paginationPayload.headers
+                    ? { ...modifiedContext.headers, ...paginationPayload.headers }
+                    : modifiedContext.headers;
+                if (activePaginationConfig.meta.metaSource === 'headers') {
+                    // Need raw fetch to access response headers
+                    const response = await $fetch.raw(modifiedContext.url, {
+                        method: modifiedContext.method,
+                        headers: paginatedHeaders,
+                        body: paginatedBody,
+                        params: paginatedQuery,
+                        ...(resolvedBaseURL ? { baseURL: resolvedBaseURL } : {}),
+                        ...restOptions,
+                    });
+                    // Extract pagination meta from headers
+                    const meta = extractPaginationMetaFromHeaders(response.headers, activePaginationConfig);
+                    if (meta.total !== undefined)
+                        paginationState.value.total = meta.total;
+                    if (meta.totalPages !== undefined)
+                        paginationState.value.totalPages = meta.totalPages;
+                    if (meta.currentPage !== undefined)
+                        paginationState.value.currentPage = meta.currentPage;
+                    if (meta.perPage !== undefined)
+                        paginationState.value.perPage = meta.perPage;
+                    data = unwrapDataKey(response._data, activePaginationConfig);
+                }
+                else {
+                    // metaSource: 'body' — extract after receiving the data
+                    const rawData = await $fetch(modifiedContext.url, {
+                        method: modifiedContext.method,
+                        headers: paginatedHeaders,
+                        body: paginatedBody,
+                        params: paginatedQuery,
+                        ...(resolvedBaseURL ? { baseURL: resolvedBaseURL } : {}),
+                        ...restOptions,
+                    });
+                    const meta = extractPaginationMetaFromBody(rawData, activePaginationConfig);
+                    if (meta.total !== undefined)
+                        paginationState.value.total = meta.total;
+                    if (meta.totalPages !== undefined)
+                        paginationState.value.totalPages = meta.totalPages;
+                    if (meta.currentPage !== undefined)
+                        paginationState.value.currentPage = meta.currentPage;
+                    if (meta.perPage !== undefined)
+                        paginationState.value.perPage = meta.perPage;
+                    data = unwrapDataKey(rawData, activePaginationConfig);
+                }
+            }
+            else {
+                data = await $fetch(modifiedContext.url, {
+                    method: modifiedContext.method,
+                    headers: modifiedContext.headers,
+                    body: toValue(modifiedContext.body),
+                    params: toValue(modifiedContext.params),
+                    ...(resolvedBaseURL ? { baseURL: resolvedBaseURL } : {}),
+                    ...restOptions,
+                });
+            }
             // Apply pick if provided
             if (pick) {
                 data = applyPick(data, pick);
@@ -116,13 +207,35 @@ export function useApiAsyncData(key, url, options) {
             }
         }
     };
-    // Use Nuxt's useAsyncData
-    const result = useAsyncData(key, fetchFn, {
+    // Use Nuxt's useAsyncData with a computed key for proper cache isolation per params
+    const result = useAsyncData(computedKey, fetchFn, {
         immediate,
         lazy,
         server,
         dedupe,
-        watch: watchSources.length > 0 ? watchSources : undefined,
+        watch: watchOption === false ? [] : watchSources,
     });
-    return result;
+    if (!paginated)
+        return result;
+    // Pagination computed helpers
+    const hasNextPage = computed(() => paginationState.value.currentPage < paginationState.value.totalPages);
+    const hasPrevPage = computed(() => paginationState.value.currentPage > 1);
+    const goToPage = (n) => { page.value = n; };
+    const nextPage = () => { if (hasNextPage.value)
+        goToPage(page.value + 1); };
+    const prevPage = () => { if (hasPrevPage.value)
+        goToPage(page.value - 1); };
+    const setPerPage = (n) => { perPage.value = n; page.value = 1; };
+    return {
+        ...result,
+        pagination: computed(() => ({
+            ...paginationState.value,
+            hasNextPage: hasNextPage.value,
+            hasPrevPage: hasPrevPage.value,
+        })),
+        goToPage,
+        nextPage,
+        prevPage,
+        setPerPage,
+    };
 }

package/dist/generators/use-async-data/runtime/useApiAsyncDataRaw.js

@@ -1,4 +1,13 @@
+// @ts-nocheck
+/**
+ * Nuxt Runtime Helper - This file is copied to the generated output
+ * It requires Nuxt 3 to be installed in the target project
+ *
+ * RAW VERSION: Returns full response including headers, status, and statusText
+ */
+import { ref, computed } from 'vue';
 import { getGlobalHeaders, getGlobalBaseUrl, applyPick, mergeCallbacks, } from '../../shared/runtime/apiHelpers.js';
+import { getGlobalApiPagination, buildPaginationRequest, extractPaginationMetaFromBody, extractPaginationMetaFromHeaders, unwrapDataKey, } from '../../shared/runtime/pagination.js';
 /**
  * Generic wrapper for API calls using Nuxt's useAsyncData - RAW VERSION
  * Returns full response with headers and status information
@@ -12,9 +21,21 @@ import { getGlobalHeaders, getGlobalBaseUrl, applyPick, mergeCallbacks, } from '
  * - Watch pattern for reactive parameters
  */
 export function useApiAsyncDataRaw(key, url, options) {
-    const { method = 'GET', body, headers = {}, params, transform, pick, onRequest, onSuccess, onError, onFinish, skipGlobalCallbacks, immediate = true, lazy = false, server = true, dedupe = 'cancel', ...restOptions } = options || {};
+    const { method = 'GET', body, headers = {}, params, baseURL, cacheKey, transform, pick, onRequest, onSuccess, onError, onFinish, skipGlobalCallbacks, immediate = true, lazy = false, server = true, dedupe = 'cancel', paginated, initialPage, initialPerPage, paginationConfig, ...restOptions } = options || {};
+    // ---------------------------------------------------------------------------
+    // Pagination setup
+    // ---------------------------------------------------------------------------
+    const activePaginationConfig = paginationConfig ?? (paginated ? getGlobalApiPagination() : null);
+    const page = ref(initialPage ?? activePaginationConfig?.request.defaults.page ?? 1);
+    const perPage = ref(initialPerPage ?? activePaginationConfig?.request.defaults.perPage ?? 20);
+    const paginationState = ref({
+        currentPage: page.value,
+        totalPages: 0,
+        total: 0,
+        perPage: perPage.value,
+    });
     // Resolve base URL once at setup time (not inside fetchFn to avoid warning on every request)
-    const resolvedBaseURL = restOptions.baseURL || getGlobalBaseUrl();
+    const resolvedBaseURL = baseURL || getGlobalBaseUrl();
     if (!resolvedBaseURL) {
         console.warn('[nuxt-openapi-hyperfetch] No baseURL configured. Set runtimeConfig.public.apiBaseUrl in nuxt.config.ts or pass baseURL in options.');
     }
@@ -23,13 +44,27 @@ export function useApiAsyncDataRaw(key, url, options) {
         ...(typeof url === 'function' ? [url] : []),
         ...(body && typeof body === 'object' ? [() => body] : []),
         ...(params && typeof params === 'object' ? [() => params] : []),
+        // Add pagination refs so page/perPage changes trigger re-fetch
+        ...(paginated ? [page, perPage] : []),
     ];
+    // Build a reactive cache key: composableName + resolved URL + serialized query params
+    // This ensures distinct params produce distinct keys — preventing cache collisions
+    const computedKey = () => {
+        if (cacheKey)
+            return cacheKey;
+        const resolvedUrl = typeof url === 'function' ? url() : url;
+        const resolvedParams = toValue(params);
+        const paramsSuffix = resolvedParams && typeof resolvedParams === 'object' && Object.keys(resolvedParams).length > 0
+            ? '-' + JSON.stringify(resolvedParams)
+            : '';
+        return `${key}-${resolvedUrl}${paramsSuffix}`;
+    };
     // Fetch function for useAsyncData
     const fetchFn = async () => {
         // Get URL value for merging callbacks
         const finalUrl = typeof url === 'function' ? url() : url;
         // Merge local and global callbacks
-        const mergedCallbacks = mergeCallbacks(finalUrl, { onRequest, onSuccess, onError, onFinish }, skipGlobalCallbacks);
+        const mergedCallbacks = mergeCallbacks(finalUrl, method, { onRequest, onSuccess, onError, onFinish }, skipGlobalCallbacks);
         try {
             // Get global headers
             const globalHeaders = getGlobalHeaders();
@@ -57,25 +92,58 @@ export function useApiAsyncDataRaw(key, url, options) {
                             ...modifications.headers,
                         };
                     }
-                    if (modifications.params !== undefined) {
+                    if (modifications.query !== undefined) {
                         modifiedContext.params = {
                             ...modifiedContext.params,
-                            ...modifications.params,
+                            ...modifications.query,
                         };
                     }
                 }
             }
+            // Build final request params, injecting pagination if enabled
+            let finalQuery = modifiedContext.params;
+            let finalBody = modifiedContext.body;
+            let finalHeaders = modifiedContext.headers;
+            if (paginated && activePaginationConfig) {
+                const paginationPayload = buildPaginationRequest(page.value, perPage.value, activePaginationConfig);
+                if (paginationPayload.query)
+                    finalQuery = { ...finalQuery, ...paginationPayload.query };
+                if (paginationPayload.body)
+                    finalBody = { ...(finalBody ?? {}), ...paginationPayload.body };
+                if (paginationPayload.headers)
+                    finalHeaders = { ...finalHeaders, ...paginationPayload.headers };
+            }
             // Make the request with $fetch.raw to get full response
             const response = await $fetch.raw(modifiedContext.url, {
                 method: modifiedContext.method,
-                headers: modifiedContext.headers,
-                body: modifiedContext.body,
-                params: modifiedContext.params,
+                headers: finalHeaders,
+                body: finalBody,
+                params: finalQuery,
                 ...(resolvedBaseURL ? { baseURL: resolvedBaseURL } : {}),
                 ...restOptions,
             });
-            // Extract data from response
-            let data = response._data;
+            // Extract pagination meta from headers or body
+            if (paginated && activePaginationConfig) {
+                let meta;
+                if (activePaginationConfig.meta.metaSource === 'headers') {
+                    meta = extractPaginationMetaFromHeaders(response.headers, activePaginationConfig);
+                }
+                else {
+                    meta = extractPaginationMetaFromBody(response._data, activePaginationConfig);
+                }
+                if (meta.total !== undefined)
+                    paginationState.value.total = meta.total;
+                if (meta.totalPages !== undefined)
+                    paginationState.value.totalPages = meta.totalPages;
+                if (meta.currentPage !== undefined)
+                    paginationState.value.currentPage = meta.currentPage;
+                if (meta.perPage !== undefined)
+                    paginationState.value.perPage = meta.perPage;
+            }
+            // Extract data from response (unwrap dataKey for paginated responses)
+            let data = paginated && activePaginationConfig
+                ? unwrapDataKey(response._data, activePaginationConfig)
+                : response._data;
             // Apply pick if provided (only to data)
             if (pick) {
                 data = applyPick(data, pick);
@@ -120,13 +188,35 @@ export function useApiAsyncDataRaw(key, url, options) {
             }
         }
     };
-    // Use Nuxt's useAsyncData
-    const result = useAsyncData(key, fetchFn, {
+    // Use Nuxt's useAsyncData with a computed key for proper cache isolation per params
+    const result = useAsyncData(computedKey, fetchFn, {
         immediate,
         lazy,
         server,
         dedupe,
         watch: watchSources.length > 0 ? watchSources : undefined,
     });
-    return result;
+    if (!paginated)
+        return result;
+    // Pagination computed helpers
+    const hasNextPage = computed(() => paginationState.value.currentPage < paginationState.value.totalPages);
+    const hasPrevPage = computed(() => paginationState.value.currentPage > 1);
+    const goToPage = (n) => { page.value = n; };
+    const nextPage = () => { if (hasNextPage.value)
+        goToPage(page.value + 1); };
+    const prevPage = () => { if (hasPrevPage.value)
+        goToPage(page.value - 1); };
+    const setPerPage = (n) => { perPage.value = n; page.value = 1; };
+    return {
+        ...result,
+        pagination: computed(() => ({
+            ...paginationState.value,
+            hasNextPage: hasNextPage.value,
+            hasPrevPage: hasPrevPage.value,
+        })),
+        goToPage,
+        nextPage,
+        prevPage,
+        setPerPage,
+    };
 }

package/dist/generators/use-async-data/templates.js

@@ -2,18 +2,18 @@
  * Generate file header with auto-generation warning
  */
 function generateFileHeader() {
-    return `/**
- * ⚠️ AUTO-GENERATED FILE - DO NOT EDIT MANUALLY
- *
- * This file was automatically generated by nuxt-openapi-generator.
- * Any manual changes will be overwritten on the next generation.
- *
- * @generated by nuxt-openapi-generator
- * @see https://github.com/dmartindiaz/nuxt-openapi-hyperfetch
- */
-
-/* eslint-disable */
-// @ts-nocheck
+    return `/**
+ * ⚠️ AUTO-GENERATED FILE - DO NOT EDIT MANUALLY
+ *
+ * This file was automatically generated by nuxt-openapi-generator.
+ * Any manual changes will be overwritten on the next generation.
+ *
+ * @generated by nuxt-openapi-generator
+ * @see https://github.com/dmartindiaz/nuxt-openapi-hyperfetch
+ */
+
+/* eslint-disable */
+// @ts-nocheck
 `;
 }
 /**
@@ -117,8 +117,14 @@ function generateFunctionBody(method, isRaw, generateOptions) {
     // Choose the correct wrapper function
     const wrapperFunction = isRaw ? 'useApiAsyncDataRaw' : 'useApiAsyncData';
     const pInit = hasParams ? `\n  const p = shallowRef(params)` : '';
-    return `${description}export const ${composableName} = (${args}) => {${pInit}
-  return ${wrapperFunction}${responseTypeGeneric}(${key}, ${url}, ${fetchOptions})
+    const argsExtraction = hasParams
+        ? `  const _hasKey = typeof args[0] === 'string'\n  const params = _hasKey ? args[1] : args[0]\n  const options = _hasKey ? { cacheKey: args[0], ...args[2] } : args[1]`
+        : `  const _hasKey = typeof args[0] === 'string'\n  const options = _hasKey ? { cacheKey: args[0], ...args[1] } : args[0]`;
+    return `${description}export function ${composableName}(key: string, ${args})
+export function ${composableName}(${args})
+export function ${composableName}(...args: any[]) {
+${argsExtraction}${pInit}
+  return ${wrapperFunction}${responseTypeGeneric}(${key}, ${url}, ${fetchOptions})
 }`;
 }
 /**

package/dist/generators/use-fetch/generator.d.ts

@@ -1,5 +1,6 @@
 import { type GenerateOptions } from './templates.js';
+import { type Logger } from '../../cli/logger.js';
 /**
  * Main function to generate useFetch composables
  */
-export declare function generateUseFetchComposables(inputDir: string, outputDir: string, options?: GenerateOptions): Promise<void>;
+export declare function generateUseFetchComposables(inputDir: string, outputDir: string, options?: GenerateOptions, logger?: Logger): Promise<void>;

package/dist/generators/use-fetch/generator.js

@@ -5,12 +5,12 @@ import { format } from 'prettier';
 import { getApiFiles as getApiFilesOfficial, parseApiFile as parseApiFileOfficial, } from './parser.js';
 import { getApiFiles as getApiFilesHeyApi, parseApiFile as parseApiFileHeyApi, } from '../shared/parsers/heyapi-parser.js';
 import { generateComposableFile, generateIndexFile } from './templates.js';
-import { p, logSuccess, logError } from '../../cli/logger.js';
+import { createClackLogger } from '../../cli/logger.js';
 /**
  * Main function to generate useFetch composables
  */
-export async function generateUseFetchComposables(inputDir, outputDir, options) {
-    const mainSpinner = p.spinner();
+export async function generateUseFetchComposables(inputDir, outputDir, options, logger = createClackLogger()) {
+    const mainSpinner = logger.spinner();
     // Select parser based on chosen backend
     const getApiFiles = options?.backend === 'heyapi' ? getApiFilesHeyApi : getApiFilesOfficial;
     const parseApiFile = options?.backend === 'heyapi' ? parseApiFileHeyApi : parseApiFileOfficial;
@@ -31,12 +31,12 @@ export async function generateUseFetchComposables(inputDir, outputDir, options)
             allMethods.push(...apiInfo.methods);
         }
         catch (error) {
-            logError(`Error parsing ${fileName}: ${String(error)}`);
+            logger.log.error(`Error parsing ${fileName}: ${String(error)}`);
         }
     }
     mainSpinner.stop(`Found ${allMethods.length} methods to generate`);
     if (allMethods.length === 0) {
-        p.log.warn('No methods found to generate');
+        logger.log.warn('No methods found to generate');
         return;
     }
     // 3. Clean and create output directories
@@ -72,27 +72,27 @@ export async function generateUseFetchComposables(inputDir, outputDir, options)
     for (const method of allMethods) {
         try {
             const code = generateComposableFile(method, relativePath, options);
-            const formattedCode = await formatCode(code);
+            const formattedCode = await formatCode(code, logger);
             const fileName = `${method.composableName}.ts`;
             const filePath = path.join(composablesDir, fileName);
             await fs.writeFile(filePath, formattedCode, 'utf-8');
             successCount++;
         }
         catch (error) {
-            logError(`Error generating ${method.composableName}: ${String(error)}`);
+            logger.log.error(`Error generating ${method.composableName}: ${String(error)}`);
             errorCount++;
         }
     }
     // 7. Generate index.ts
     const indexCode = generateIndexFile(allMethods.map((m) => m.composableName));
-    const formattedIndex = await formatCode(indexCode);
+    const formattedIndex = await formatCode(indexCode, logger);
     await fs.writeFile(path.join(outputDir, 'index.ts'), formattedIndex, 'utf-8');
     mainSpinner.stop(`Generated ${successCount} composables`);
     // 8. Summary
     if (errorCount > 0) {
-        p.log.warn(`Completed with ${errorCount} error(s)`);
+        logger.log.warn(`Completed with ${errorCount} error(s)`);
     }
-    logSuccess(`Generated ${successCount} useFetch composable(s) in ${outputDir}`);
+    logger.log.success(`Generated ${successCount} useFetch composable(s) in ${outputDir}`);
 }
 /**
  * Calculate relative import path from composables to APIs
@@ -113,7 +113,7 @@ function calculateRelativeImportPath(composablesDir, inputDir) {
 /**
  * Format code with Prettier
  */
-async function formatCode(code) {
+async function formatCode(code, logger) {
     try {
         return await format(code, {
             parser: 'typescript',
@@ -125,7 +125,7 @@ async function formatCode(code) {
         });
     }
     catch {
-        p.log.warn('Could not format code with Prettier');
+        logger.log.warn('Could not format code with Prettier');
         return code;
     }
 }