The operations type, typically generated from your OpenAPI spec
Configuration object containing operations metadata and axios instance
API instance with useQuery, useMutation, useEndpoint, and debug methods
Debug utility to inspect operation metadata.
Creates a reactive query for GET operations.
This composable wraps TanStack Query for read-only operations with automatic type inference, caching, and reactive updates.
// Query without path parameters
const { data: pets, isLoading } = api.useQuery(OperationId.listPets, {
enabled: true,
onLoad: (data) => console.log('Loaded:', data)
})
// Query with path parameters
const { data: pet } = api.useQuery(OperationId.getPet, { petId: '123' }, {
enabled: computed(() => Boolean(petId.value))
})
Creates a reactive mutation for POST/PUT/PATCH/DELETE operations.
This composable wraps TanStack Query's useMutation for data-modifying operations with automatic cache invalidation and optimistic updates.
// Mutation without path parameters
const createPet = api.useMutation(OperationId.createPet, {
onSuccess: (data) => console.log('Created:', data),
onError: (error) => console.error('Failed:', error)
})
// Mutation with path parameters
const updatePet = api.useMutation(OperationId.updatePet, { petId: '123' }, {
onSuccess: async () => {
// Automatically invalidates related queries
}
})
// Execute the mutation
await createPet.mutateAsync({ data: { name: 'Fluffy' } })
Generic endpoint composable that automatically detects operation type.
This is a universal composable that returns either a query or mutation based on the operation's HTTP method. Use this when you want unified handling.
// Automatically becomes a query for GET operations
const listEndpoint = api.useEndpoint(OperationId.listPets)
// Automatically becomes a mutation for POST operations
const createEndpoint = api.useEndpoint(OperationId.createPet)
// TypeScript knows the correct return type based on the operation
const data = listEndpoint.data // Query data
await createEndpoint.mutateAsync({ data: petData }) // Mutation execution
import { useOpenApi } from '@qualisero/openapi-endpoint'
// See documentation on how to generate types and operations automatically:
import { openApiOperations, type OpenApiOperations } from './generated/api-operations'
import axios from 'axios'
const api = useOpenApi<OpenApiOperations>({
operations: openApiOperations,
axios: axios.create({ baseURL: 'https://api.example.com' })
})
// Use in components
const { data, isLoading } = api.useQuery('listPets', {})
const createPet = api.useMutation('createPet', {})
Creates a type-safe OpenAPI client for Vue applications.
This is the main entry point for the library. It provides reactive composables for API operations with full TypeScript type safety based on your OpenAPI specification.