@assistant-ui/react-hook-form#
React Hook Form integration for @assistant-ui/react. Replace useForm with useAssistantForm to give the assistant the ability to read and fill your form fields through tool calls.
Installation#
npm install @assistant-ui/react @assistant-ui/react-hook-form react-hook-form
Usage#
"use client";
import { useAssistantForm } from "@assistant-ui/react-hook-form";
export function SignupForm() {
const form = useAssistantForm({
defaultValues: { firstName: "", lastName: "", email: "" },
assistant: {
tools: {
set_form_field: { render: () => <FieldUpdated /> },
submit_form: { render: () => <FormSubmitted /> },
},
},
});
return <form onSubmit={form.handleSubmit(onSubmit)}>{/* fields */}</form>;
}
The assistant gets two built-in tools: set_form_field to write values into fields and submit_form to call your submit handler.
See also#
@assistant-ui/react-lexicalif you also want a rich-text composer with@-mention support inside the same chat.
Full API reference at assistant-ui.com/docs/api-reference/integrations/react-hook-form. See examples/with-react-hook-form for a complete app.