Skip to main content
The Suki Dictation SDK is a JavaScript and React library that lets you add to your web application using Suki’s hosted iframe UI. After you initialize the SDK, you can start Dictation in either In-field mode for direct text entry or Scratchpad mode for free-form dictation.
If you use the Headed Web SDK v3.X.X+, Dictation capabilities are available out of the box. Refer to the Web SDK for Audio Dictation guide for more information.
The Suki Dictation SDK supports two Dictation modes: In-field and Scratchpad.

In-Field Mode

Use this mode for Dictation over a target field. Commonly used for notes and forms.

Scratchpad Mode

Use this mode for a floating Dictation panel, not tied to one input. Commonly used for Dictation in a separate area of the page.
When the user starts the Dictation session:
  1. Recording begins automatically.
  2. Transcription appears inside the text field and the scratchpad UI.
  3. When the user finishes Dictation and confirms, the SDK calls the handler functions you registered and passes the final transcript into your app so you can update fields, save data, or run your own logic.
The Dictation SDK is different from integrating directly with the Dictation APIs. The SDK manages authentication through SukiAuthManager, iframe lifecycle, and transcript callbacks for you.If you need a custom or server-side integration without the hosted iframe experience, use the APIs described in Dictation basic usage.

​
Supported packages

The Dictation SDK is available in the following packages:

React

Use @suki-sdk/dictation-react for React web applications.Install the Dictation SDK for React:

Vanilla JavaScript

Use @suki-sdk/dictation for vanilla JavaScript applications.Install the Dictation SDK for JavaScript:
Both require shared authentication through @suki-sdk/core (Refer to the Dictation SDK Quickstart for more information).

​
When to use Dictation SDK

Choose the Dictation SDK when:
  • You want real-time speech-to-text in the browser with Suki’s hosted iframe experience.
  • You need in-field overlays on inputs or a scratchpad workflow for Dictation mechanics.
  • You prefer callback-driven commit of the transcription result over owning REST and WebSocket Dictation calls yourself.

​
Common use cases

The Dictation SDK provides a hosted browser experience for real-time speech-to-text, including in-field overlays and scratchpad mode. Your application owns field targeting, commit handling, and how transcripts are used in your workflow. The following examples show common ways to integrate the Dictation SDK into your web application.

Dictate into a Target Field

Use in-field mode over a note, form, or charting input, then commit the transcript when the clinician confirms.

Dictate in a Scratchpad

Open scratchpad mode for a floating draft area, then place the final text into your app state or target fields.

Reuse One Client Across Fields

Reuse one DictationClient on the page, activate it for the focused field, and handle each commit in your callbacks.

Commit Transcripts into Your Workflow

Handle onSubmit and optional draft callbacks to update state, save drafts, or write text into your EHR model without owning REST and WebSocket Dictation yourself.

Capture Short-Form Clinical Dictation

Add the Dictation SDK on screens where clinicians need speech-to-text for targeted fields, not a full ambient note session.

Dictate on Telehealth Screens

Mount the same in-field or scratchpad experience on virtual visit pages so remote clinicians can dictate into documentation fields.
Follow the below pattern to integrate the Dictation SDK into your application:

​
How the Dictation SDK works

The following diagram illustrates the Dictation SDK architecture and workflow:

​
Architecture workflow

Your Web Application

  • You choose when Dictation should open and where it should appear on the page (for example over one input, or as a separate floating area).
  • Your code starts Dictation and listens for results from the SDK. When the user finishes, you receive the final text.
  • Your UI decides what to do with that text (fill a field, save a draft, discard, and so on).

Suki Services

  • Sign-in: Suki checks your configuration, signs in with the partner account details you provide, keeps access fresh, and hands the hosted Dictation experience what it needs to run securely.
  • Hosted Dictation: The microphone experience and transcription run in an embedded view that Suki hosts. That way the Dictation screen looks and behaves the same in every app, and it does not inherit your site’s fonts, colors, or layout.

Typical Session

  1. Set up sign-in once using the partner details Suki gives you.
  2. Add the Dictation SDK to your app and connect it to that sign-in.
  3. When the user asks to dictate, open Dictation in the place you picked (over a field or as a scratchpad-style area).
  4. The user speaks and confirms. Your app receives the text so you can put it where it belongs in your workflow.
  5. When Dictation should stop, close it from your app so the session ends.
Refer to the Architecture guide for more details.

​
Next steps

Get started by following these steps: Refer to the Installation guide to add the packages to your project Refer to the Prerequisites guide to confirm browser, CSP, and layout requirements Refer to the Quickstart for JavaScript and React examples through your first show() call
Last modified on August 7, 2026