Installation

Requirements

antd-forge requires the following peer dependencies:

React 18.0+ or 19.0+
Ant Design 5.0+ or 6.0+

Install

npm install @dyrhoi/antd-forge

pnpm add @dyrhoi/antd-forge

bun add @dyrhoi/antd-forge

yarn add @dyrhoi/antd-forge

Setup

Add the Provider

Wrap your application with AntdForgeProvider. This sets up the internal TanStack Query client used by useTable.

import { AntdForgeProvider } from "@dyrhoi/antd-forge";

function App() {
  return (
    <AntdForgeProvider>
      {/* Your app */}
    </AntdForgeProvider>
  );
}

If you're already using TanStack Query, pass your existing queryClient to avoid creating a duplicate:

<AntdForgeProvider queryClient={yourQueryClient}>

Start using the hooks

You're ready to go! Here's a quick example with useForm:

import { useForm } from "@dyrhoi/antd-forge";
import { Form, Input, Button } from "antd";
import { z } from "zod";

const schema = z.object({
  email: z.string().email(),
  name: z.string().min(2),
});

function MyForm() {
  const { formProps, FormItem } = useForm({
    validator: schema,
    onFinish: (values) => {
      // values is fully typed as { email: string; name: string }
      console.log(values);
    },
  });

  return (
    <Form {...formProps}>
      <FormItem name="email" label="Email">
        <Input />
      </FormItem>
      <FormItem name="name" label="Name">
        <Input />
      </FormItem>
      <Button type="primary" htmlType="submit">
        Submit
      </Button>
    </Form>
  );
}

Schema Validator (Optional)

antd-forge works with any Standard Schema compatible validator. Install your preferred library:

npm install zod

npm install valibot

npm install arktype

You can also use useForm and useTable without a schema validator by providing an explicit type parameter instead.