A collection of React hooks and utilities for managing URL state in GraphQL and REST API applications with automatic type inference and schema validation.
## Key Components
**Main Hooks:**
- `useQueryParams` - GraphQL query parameter management with automatic schema extraction
- `useApiParams` - REST API parameter management with custom schema definitions
- `useCursorPaginationState` - Specialized hook for cursor-based pagination state
**Core Utilities:**
- `GraphQLIntrospector` - Runtime GraphQL schema introspection and variable extraction
- `createSearchParams` - Helper for creating URLSearchParams objects
- Schema validation and type coercion utilities
**Type Definitions:**
- `ParamSchema` - Schema definition for API parameters
- `VariableDefinition` - GraphQL variable type definitions
- Return types for all hooks with full TypeScript support
## Usage Example
```typescript
import { useQueryParams, useApiParams } from '@flamingo/ui-kit/hooks'
import { GET_USERS_QUERY } from './queries'
// GraphQL with automatic schema detection
function UserList() {
const { variables, setParam } = useQueryParams(GET_USERS_QUERY)
const { data } = useQuery(GET_USERS_QUERY, { variables })
return (
setParam('search', e.target.value)}
/>
)
}
// REST API with custom schema
function ProductGrid() {
const { params, setParam } = useApiParams({
category: { type: 'string', default: 'all' },
minPrice: { type: 'number', required: false },
tags: { type: 'array', default: [] }
})
// params are automatically synced with URL
return
}
```