Write Dictation Text to an EHR Field

Problem: Dictation records, but the EHR chart field does not update on submit. Solution: Pass onSubmit to DictationClient.show (or <Dictation />) and write text into the field for fieldId.

This cookbook assumes you already have your Partner ID, Partner Token, and the other prerequisites for the Dictation SDK.

JavaScript
React

import { SukiAuthManager } from "@suki-sdk/core";
import { DictationClient } from "@suki-sdk/dictation";

const authManager = new SukiAuthManager({
  partnerId: "YOUR_PARTNER_ID",
  partnerToken: "YOUR_PARTNER_TOKEN",
  environment: "staging",
  loginOnInitialize: true,
  providerId: "1234567890",
  providerName: "Jane Doe",
  providerOrgId: "1234",
});

const dictationClient = new DictationClient({ authManager });

await dictationClient.show({
  mode: "in-field",
  fieldId: "clinical-notes",
  rootElement: document.getElementById("clinical-notes-field-root-element-id"),
  initialText: "",
  onSubmit: ({ fieldId, text }) => {
    const el = document.getElementById(fieldId);
    if (el) el.value = text;
  },
  onCancel: ({ fieldId }) => {
    console.log("Cancelled", fieldId);
  },
});

import { useEffect, useMemo, useRef, useState } from "react";
import { SukiAuthManager } from "@suki-sdk/core";
import { DictationClient } from "@suki-sdk/dictation";
import { DictationProvider, Dictation } from "@suki-sdk/dictation-react";

export function NotesWithDictation() {
  const rootRef = useRef(null);
  const [rootElement, setRootElement] = useState(null);
  const [notes, setNotes] = useState("");

  const client = useMemo(() => {
    const authManager = new SukiAuthManager({
      partnerId: "YOUR_PARTNER_ID",
      partnerToken: "YOUR_PARTNER_TOKEN",
      environment: "staging",
      loginOnInitialize: true,
      providerId: "1234567890",
      providerName: "Jane Doe",
      providerOrgId: "1234",
    });
    return new DictationClient({ authManager });
  }, []);

  useEffect(() => {
    setRootElement(rootRef.current);
  }, []);

  return (
    <DictationProvider client={client}>
      <textarea
        id="clinical-notes"
        value={notes}
        onChange={(e) => setNotes(e.target.value)}
      />
      <div ref={rootRef} id="dictation-root" />
      {rootElement ? (
        <Dictation
          mode="in-field"
          fieldId="clinical-notes"
          rootElement={rootElement}
          initialText={notes}
          onSubmit={({ text }) => {
            setNotes(text);
          }}
          onCancel={({ fieldId }) => {
            console.log("Cancelled", fieldId);
          }}
        />
      ) : null}
    </DictationProvider>
  );
}

Common mistakes

fieldId must match the input you update. rootElement must exist before show.
Set loginOnInitialize: true, or call login() before show.

Other cookbooks

AuthenticationAPI

Send provider_id on Bearer login.

5 min

​Common mistakes

​Other cookbooks

​Add provider_id to Bearer Login

Common mistakes

Other cookbooks

Add provider_id to Bearer Login