# @repo/api-client — Shared React Query Hooks

Framework-agnostic tRPC + React Query provider consumed by all apps.

## Rules

- NEVER import framework-specific code (no next/, no tanstack/)
- NEVER put business logic in hooks
- Hooks use `useTRPC()` from `./trpc.ts`
- Both Next.js and TanStack Start apps use the same `<ApiProvider>`

## Usage in Apps

```tsx
import { ApiProvider, useTRPC } from "@repo/api-client";

// Root layout:
<ApiProvider trpcUrl="/api/trpc">{children}</ApiProvider>

// In components:
const trpc = useTRPC();
const articles = trpc.content.listArticles.useQuery({});
```

## Adding a New Hook (optional wrapper)

Custom hooks are optional — `useTRPC()` provides typed access to all procedures directly. Only create wrapper hooks if you need shared query logic across multiple components.