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

# Web SDK For Form Filling Overview

> Overview of Form filling in the Suki Web SDK for JavaScript and React applications

<div className="quick-summary-wrapper">
  <div className="quick-summary-header">
    <span className="quick-summary-icon" aria-hidden="true" />

    <span className="quick-summary-title">Quick summary</span>
  </div>

  <div className="quick-summary-content">
    Add Form filling capabilities to a browser-based JavaScript or React app with the Suki Web SDK. If you already use the Web SDK, import the Form filling client and components from the Web SDK package. You do not need a standalone Form filling SDK install.
  </div>

  <div className="quick-summary-footer">
    <span className="quick-summary-footer-icon" aria-hidden="true" />

    <span className="quick-summary-footer-text">Last updated:</span>
    <span className="quick-summary-footer-date">July 2026</span>
  </div>
</div>

This section walks you through the process of integrating Form filling using the Suki Web SDK in a browser-based JavaScript or React application. You will use the packages provided by Suki to complete the integration.

From Web SDK **`v3.2.0`** or later, Form filling is included in **`@suki-sdk/js`** and **`@suki-sdk/react`**. You do not need to install the standalone Form filling SDK packages.

To implement Form filling, you must create a **`SukiAuthManager`** and a **`FormFillingClient`**.

In a **React application**, you wrap your component tree with the **`FormFillingProvider`**. You then render the **`FormFilling`** component when you want the clinician to fill forms. In a **JavaScript application**, you call **`await formFillingClient.start({ ... })`** when the clinician is ready to begin Form filling.

## Prerequisites

Before you begin, meet the necessary requirements in [Web SDK prerequisites](/web-sdk/prerequisites) and obtain **`partnerId`** and **`partnerToken`** after [Partner onboarding](/documentation/get-started/partner-onboarding).

You also need:

* **Template IDs:** **`template_id`** UUIDs from your Suki support team for **`form_template_ids`**. Learn more about [Template IDs](/documentation/concepts/form-filling/form-filling-overview#medical-form-templates).
* **Encounter ID:** pass your encounter ID as **`correlation_id`** so callbacks and webhooks map to the correct record

## Integration guides

Choose the integration guide for your stack:

<CardGroup cols={2}>
  <Card title="JavaScript" icon="js" href="/web-sdk/guides/form-filling-javascript" arrow="true">
    Use the JavaScript package provided by Suki Web SDK to integrate Form filling in a JavaScript application (browser-based).
  </Card>

  <Card title="React" icon="react" href="/web-sdk/guides/form-filling-react" arrow="true">
    Use the React package provided by Suki Web SDK to integrate Form filling in a React application (browser-based).
  </Card>
</CardGroup>

For options such as **`form_template_ids`**, **`correlation_id`**, and callbacks, refer to the [Configuration](/form-filling-sdk/guides/configuration) guide in the Form filling SDK section.