---
# System prepended metadata

title: '`FormContextProvider` component'
tags: [zeta-dom-react]

---

---
tags: zeta-dom-react
---

# `FormContextProvider` component

Provides `FormContext` to field controls.

All field components using the [`useFormField`](#useFormField) hook will expose field value to `FormContext.data` dictionary and listen to form events for validation or reset.

```typescript
import { FormContextProvider, useFormContext } from "zeta-dom-react";

function Component() {
    const form = useFormContext();
    return (
        <FormContextProvider value={form}>
            {...}
        </FormContextProvider>
    );
}
```

:::info
It is recommend to use the [`Form`](/5PYJWlzBTeCumFQt3_Vt5w) component.
:::