diff --git a/packages/clients/client-helpers/README.md b/packages/clients/client-helpers/README.md new file mode 100644 index 000000000..5fc4a8416 --- /dev/null +++ b/packages/clients/client-helpers/README.md @@ -0,0 +1,3 @@ +# @zenstackhq/client-helpers + +Shared building blocks for implementing clients that consume ZenStack's CRUD service. Used internally by [`@zenstackhq/fetch-client`](../fetch-client) and [`@zenstackhq/tanstack-query`](../tanstack-query), and useful when building your own custom client. diff --git a/packages/clients/fetch-client/README.md b/packages/clients/fetch-client/README.md new file mode 100644 index 000000000..1afb9986c --- /dev/null +++ b/packages/clients/fetch-client/README.md @@ -0,0 +1,32 @@ +# @zenstackhq/fetch-client + +A lightweight, type-safe fetch-based client for consuming ZenStack's RPC-style auto CRUD API. Provides the same model and operation surface as the server-side `ZenStackClient`, but issues HTTP requests instead of running queries locally. + +## Installation + +```bash +npm install @zenstackhq/fetch-client +``` + +## Usage + +```typescript +import { createClient } from '@zenstackhq/fetch-client'; +import { schema } from './schema'; + +const client = createClient(schema, { + endpoint: 'https://example.com/api/model', +}); + +const users = await client.user.findMany({ where: { active: true } }); +const post = await client.post.create({ data: { title: 'Hello' } }); + +const [user, newPost] = await client.$transaction([ + { model: 'User', op: 'create', args: { data: { email: 'alice@example.com' } } }, + { model: 'Post', op: 'create', args: { data: { title: 'Hello' } } }, +]); +``` + +## Learn More + +- [ZenStack Documentation](https://zenstack.dev/docs/service/client-sdk/fetch-client) diff --git a/packages/clients/tanstack-query/README.md b/packages/clients/tanstack-query/README.md new file mode 100644 index 000000000..0f62ff0a1 --- /dev/null +++ b/packages/clients/tanstack-query/README.md @@ -0,0 +1,41 @@ +# @zenstackhq/tanstack-query + +[TanStack Query](https://tanstack.com/query) integration for ZenStack. Generates fully typed query and mutation hooks from your ZModel schema for React, Vue, and Svelte, with built-in cache invalidation and optimistic update helpers. + +## Supported Frameworks + +- **React** — `@zenstackhq/tanstack-query/react` +- **Vue** — `@zenstackhq/tanstack-query/vue` +- **Svelte** — `@zenstackhq/tanstack-query/svelte` + +## Installation + +```bash +npm install @zenstackhq/tanstack-query @tanstack/react-query +``` + +Replace `@tanstack/react-query` with `@tanstack/vue-query` or `@tanstack/svelte-query` as needed. + +## Usage (React example) + +```tsx +import { useClientQueries } from '@zenstackhq/tanstack-query/react'; +import { schema } from './schema'; + +function PostList() { + const client = useClientQueries(schema); + + const { data: posts } = client.post.useQuery({ + where: { published: true }, + include: { author: true }, + }); + + const { mutate: createPost } = client.post.useMutation(); + + return ; +} +``` + +## Learn More + +- [ZenStack Documentation](https://zenstack.dev/docs/service/client-sdk/tanstack-query/)