Installation

Install the full stack or individual packages in a React project.

#Install packages

bash

# Full React stack
pnpm add @void-snippets/core @void-snippets/client @void-snippets/react

# Required peer dependencies
pnpm add axios @tanstack/react-query

# Only needed if you use socket hooks
pnpm add socket.io-client

# Only needed if you use the routing contract
pnpm add react-router

#Peer dependency versions

Peer	Minimum	Required for
`react`	`>=17.0.0`	All React hooks
`axios`	`^1.6.0`	`@void-snippets/client`
`@tanstack/react-query`	`^5.0.0`	`createResourceHooks`
`socket.io-client`	`>=4.6.0`	`createSocketHooks`
`react-router`	`>=7.0.0`	`createRouteContract`
TypeScript	`^5.4.0`	Everything

#One-time app setup

Do this once at your app's entry point, before any service is called.

1. Configure the HTTP client:

typescript

// main.ts
import axios from 'axios';
import { configure } from '@void-snippets/client';

configure(
  axios.create({
    baseURL: import.meta.env.VITE_API_URL,
    headers: { 'Content-Type': 'application/json' },
  })
);

2. Wrap your app with QueryClientProvider:

tsx

// main.tsx
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';

const queryClient = new QueryClient({
  defaultOptions: { queries: { retry: 1, staleTime: 30_000 } },
});

root.render(
  <QueryClientProvider client={queryClient}>
    <App />
  </QueryClientProvider>
);