Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions packages/clients/client-helpers/README.md
Original file line number Diff line number Diff line change
@@ -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.
32 changes: 32 additions & 0 deletions packages/clients/fetch-client/README.md
Original file line number Diff line number Diff line change
@@ -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)
41 changes: 41 additions & 0 deletions packages/clients/tanstack-query/README.md
Original file line number Diff line number Diff line change
@@ -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 <ul>{posts?.map((p) => <li key={p.id}>{p.title}</li>)}</ul>;
}
```

## Learn More

- [ZenStack Documentation](https://zenstack.dev/docs/service/client-sdk/tanstack-query/)
Loading