> ## Documentation Index
> Fetch the complete documentation index at: https://docs.raykoi.com/llms.txt
> Use this file to discover all available pages before exploring further.

# React

> useRaykoiForm — the entire submission lifecycle, no useState boilerplate.

```bash theme={null}
npm install @raykoi/sdk
```

`useRaykoiForm` manages the entire submission lifecycle — `submit` is passed directly to `onSubmit` and reads field values off each input's `name` attribute (uncontrolled).

```jsx theme={null}
import { useRaykoiForm, RaykoiFieldError, RaykoiStatus } from '@raykoi/sdk/react';

export default function MyForm() {
  const { submit, submitting } = useRaykoiForm('YOUR_PUBLIC_ID');

  return (
    <form onSubmit={submit}>
      <input type="email" name="email" required />
      <RaykoiFieldError name="email" />
      <button type="submit" disabled={submitting}>
        {submitting ? 'Sending…' : 'Submit'}
      </button>
      <RaykoiStatus />
    </form>
  );
}
```

For controlled inputs, call `submit(data)` with your own object instead of passing the event, and read `fieldErrors`/`status` off the hook's return value directly.

<Info>
  Using Next.js? See the dedicated [Next.js](/integrations/nextjs) page. Remix or another React meta-framework? See [Meta-Frameworks](/integrations/meta-frameworks) for placement/hydration notes.
</Info>
