Seamless AI documentation
for your customers.

import { useState } from "react";
import { useSpeechToForm } from "@speechineer/react";
 
export default function Page() {
  const [data, setData] = useState({ name: "", email: "" });
  const set = (id: string, value: string) =>
    setData((d) => ({ ...d, [id]: value }));
  const { start, stop, isListening } = useSpeechToForm({
    form: {
      source: "workspace", key: "patient-intake",
      version: "1", language: "en",
    },
    onFieldValue: (id, value) => set(id, String(value ?? "")),
  });
  return (
    <form>
      <input name="name" value={data.name}
        onChange={(e) => set("name", e.target.value)} />
      <input name="email" type="email" value={data.email}
        onChange={(e) => set("email", e.target.value)} />
      <button type="button"
        onClick={isListening ? stop : () => void start()}>
        {isListening ? "Stop" : "Talk to form"}
      </button>
      <button type="submit">Submit</button>
    </form>
  );
}