sera-ai 1.0.2 → 1.0.4

package/README.md

@@ -55,6 +55,68 @@ export default App;
 
 That's it! No configuration files, no worker files to copy, no CSS frameworks to install.
 
+## Audio Dictation Component
+
+For shorter dictation tasks, use the `AudioDictation` component which provides push-to-talk functionality:
+
+```tsx
+import React, { useState } from 'react';
+import { AudioDictation } from 'sera-ai';
+
+function DictationApp() {
+  const [dictatedText, setDictatedText] = useState('');
+
+  return (
+    <div style={{ padding: '20px' }}>
+      <h1>Medical Dictation</h1>
+      
+      <AudioDictation
+        apiKey="your-api-key"
+        doctorName="Dr. Smith"
+        patientId="12345"
+        specialty="cardiology"
+        selectedFormat="json"
+        onDictationComplete={(text) => {
+          setDictatedText(prev => prev + ' ' + text);
+        }}
+      />
+      
+      <div style={{ marginTop: '20px', padding: '10px', border: '1px solid #ccc' }}>
+        <h3>Dictated Text:</h3>
+        <p>{dictatedText}</p>
+      </div>
+    </div>
+  );
+}
+```
+
+### AudioDictation Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `apiKey` | `string` | - | Your Sera AI API key |
+| `appendMode` | `boolean` | `true` | Whether to append to existing text |
+| `doctorName` | `string` | `"doctor"` | Doctor's name for the dictation |
+| `patientId` | `string` | - | Patient identifier |
+| `sessionId` | `string` | - | Session identifier |
+| `language` | `string` | `"en"` | Language code for dictation |
+| `specialty` | `string` | `"general"` | Medical specialty |
+| `selectedFormat` | `"json" \| "hl7" \| "fhir"` | `"json"` | Output format |
+| `onDictationComplete` | `(text: string) => void` | **Required** | Callback when dictation is complete |
+| `className` | `string` | - | Custom CSS classes |
+| `style` | `CSSProperties` | - | Inline styles |
+| `buttonText` | `string` | `"Hold to Dictate"` | Custom button text |
+| `placeholder` | `string` | `"Click and hold to dictate..."` | Tooltip text |
+
+### AudioDictation Features
+
+- **Push-to-talk**: Hold mouse button or spacebar to dictate
+- **Mobile support**: Touch and hold on mobile devices
+- **Visual feedback**: Button animates while recording
+- **Error handling**: Built-in error display and recovery
+- **Multiple formats**: Support for JSON, HL7, and FHIR output
+- **Real-time processing**: Immediate transcription after release
+
 ## Advanced Usage
 
 ### Medical Specialties

package/dist/index.d.mts

@@ -35,4 +35,22 @@ interface ClassificationInfoResponse {
 
 declare const AudioRecorder: React$1.FC<AudioRecorderProps>;
 
-export { type APIOptions, type APIResponse, AudioRecorder, type AudioRecorderProps };
+interface AudioDictationProps {
+    apiKey?: string;
+    apiBaseUrl?: string;
+    appendMode?: boolean;
+    doctorName?: string;
+    patientId?: string;
+    sessionId?: string;
+    language?: string;
+    specialty?: string;
+    selectedFormat?: "json" | "hl7" | "fhir";
+    onDictationComplete: (message: string) => void;
+    className?: string;
+    style?: React$1.CSSProperties;
+    buttonText?: string;
+    placeholder?: string;
+}
+declare const AudioDictation: React$1.FC<AudioDictationProps>;
+
+export { type APIOptions, type APIResponse, AudioDictation, type AudioDictationProps, AudioRecorder, type AudioRecorderProps };

package/dist/index.d.ts

@@ -35,4 +35,22 @@ interface ClassificationInfoResponse {
 
 declare const AudioRecorder: React$1.FC<AudioRecorderProps>;
 
-export { type APIOptions, type APIResponse, AudioRecorder, type AudioRecorderProps };
+interface AudioDictationProps {
+    apiKey?: string;
+    apiBaseUrl?: string;
+    appendMode?: boolean;
+    doctorName?: string;
+    patientId?: string;
+    sessionId?: string;
+    language?: string;
+    specialty?: string;
+    selectedFormat?: "json" | "hl7" | "fhir";
+    onDictationComplete: (message: string) => void;
+    className?: string;
+    style?: React$1.CSSProperties;
+    buttonText?: string;
+    placeholder?: string;
+}
+declare const AudioDictation: React$1.FC<AudioDictationProps>;
+
+export { type APIOptions, type APIResponse, AudioDictation, type AudioDictationProps, AudioRecorder, type AudioRecorderProps };

package/dist/index.js

@@ -4602,7 +4602,480 @@ var AudioRecorder = ({
   ] });
 };
 var AudioRecorder_default = AudioRecorder;
+var API_BASE_URL2 = "https://nuxera.cloud";
+var useAudioDictation = ({
+  setIsProcessing,
+  setIsDictating,
+  onDictationComplete,
+  apiKey,
+  apiBaseUrl = API_BASE_URL2,
+  appendMode = true,
+  doctorName = "asad",
+  patientId,
+  sessionId,
+  language,
+  specialty,
+  selectedFormat = "json"
+}) => {
+  const [dictationError, setDictationError] = React3.useState(null);
+  const audioContextRef = React3.useRef(null);
+  const processorRef = React3.useRef(null);
+  const mediaStreamRef = React3.useRef(null);
+  const audioSamplesRef = React3.useRef([]);
+  const [audioBuffer, setAudioBuffer] = React3.useState(null);
+  const { createHL7DictationRequest, createFHIRDictationRequest, convertDictationResponse } = useHL7FHIRConverter_default();
+  const effectiveApiKey = apiKey;
+  React3.useEffect(() => {
+    return () => {
+      if (mediaStreamRef.current) {
+        mediaStreamRef.current.getTracks().forEach((track) => track.stop());
+        mediaStreamRef.current = null;
+      }
+      if (processorRef.current) {
+        try {
+          processorRef.current.disconnect();
+        } catch (e) {
+          console.error("Error disconnecting processor:", e);
+        }
+        processorRef.current = null;
+      }
+      if (audioContextRef.current && audioContextRef.current.state !== "closed") {
+        try {
+          audioContextRef.current.close();
+        } catch (e) {
+          console.error("Error closing AudioContext:", e);
+        }
+      }
+      audioContextRef.current = null;
+    };
+  }, []);
+  const startDictating = async () => {
+    try {
+      console.log("Starting recording");
+      setAudioBuffer(null);
+      audioSamplesRef.current = [];
+      setDictationError(null);
+      const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
+      mediaStreamRef.current = stream;
+      const audioContext = new (window.AudioContext || window.webkitAudioContext)();
+      console.log("Loading audio-processor.js module...");
+      try {
+        await audioContext.audioWorklet.addModule("/audio-processor.js");
+        console.log("Audio worklet module loaded successfully");
+      } catch (err) {
+        console.error("Error loading audio worklet module:", err);
+        throw err;
+      }
+      const processor = new AudioWorkletNode(audioContext, "audio-processor");
+      processor.port.onmessage = (event) => {
+        console.log("Received message from processor:", event.data.command);
+        if (event.data.audioBuffer) {
+          console.log("Received audio buffer", event.data.audioBuffer.length);
+          audioSamplesRef.current.push(new Float32Array(event.data.audioBuffer));
+        }
+        if (event.data.command === "finalChunk") {
+          console.log("Received final chunk");
+          if (event.data.audioBuffer) {
+            audioSamplesRef.current.push(new Float32Array(event.data.audioBuffer));
+          }
+          const totalLength = audioSamplesRef.current.reduce(
+            (acc, buffer) => acc + buffer.length,
+            0
+          );
+          if (totalLength > 0) {
+            const combinedBuffer = new Float32Array(totalLength);
+            let offset = 0;
+            audioSamplesRef.current.forEach((buffer) => {
+              combinedBuffer.set(buffer, offset);
+              offset += buffer.length;
+            });
+            console.log("Combined buffer length:", combinedBuffer.length);
+            setAudioBuffer(combinedBuffer);
+          } else {
+            console.warn("Final chunk received but no audio data accumulated");
+            setDictationError("No audio data was recorded");
+          }
+        }
+      };
+      const source = audioContext.createMediaStreamSource(stream);
+      source.connect(processor);
+      audioContextRef.current = audioContext;
+      processorRef.current = processor;
+      setIsDictating(true);
+      console.log("Recording started successfully");
+    } catch (error) {
+      console.error("Error starting dictation:", error);
+      setIsDictating(false);
+      setDictationError("An error occurred while starting dictation");
+    }
+  };
+  const stopDictating = async () => {
+    console.log("Stopping dictation");
+    try {
+      if (processorRef.current) {
+        console.log("Sending stop command to processor");
+        processorRef.current.port.postMessage({ command: "stop" });
+        await new Promise((resolve) => setTimeout(resolve, 100));
+      }
+      if (mediaStreamRef.current) {
+        console.log("Stopping media stream tracks");
+        mediaStreamRef.current.getTracks().forEach((track) => {
+          track.stop();
+          console.log("Track stopped:", track.kind, track.readyState);
+        });
+        mediaStreamRef.current = null;
+      }
+      if (processorRef.current) {
+        console.log("Disconnecting processor");
+        try {
+          processorRef.current.disconnect();
+          processorRef.current = null;
+        } catch (e) {
+          console.error("Error disconnecting processor:", e);
+          processorRef.current = null;
+        }
+      }
+      if (audioContextRef.current) {
+        console.log("Closing audio context, current state:", audioContextRef.current.state);
+        try {
+          if (audioContextRef.current.state !== "closed") {
+            await audioContextRef.current.close();
+            console.log("Audio context closed successfully");
+          }
+        } catch (e) {
+          console.error("Error closing AudioContext:", e);
+        }
+        audioContextRef.current = null;
+      }
+      await new Promise((resolve) => setTimeout(resolve, 200));
+      if (audioBuffer && audioBuffer.length > 0) {
+        console.log(`Processing audio buffer of size ${audioBuffer.length} samples`);
+        await processDictationAudio(audioBuffer);
+      } else if (audioSamplesRef.current.length > 0) {
+        console.log("No audio buffer but have samples, combining now");
+        const totalLength = audioSamplesRef.current.reduce((acc, buffer) => acc + buffer.length, 0);
+        if (totalLength > 0) {
+          const combinedBuffer = new Float32Array(totalLength);
+          let offset = 0;
+          audioSamplesRef.current.forEach((buffer) => {
+            combinedBuffer.set(buffer, offset);
+            offset += buffer.length;
+          });
+          console.log(`Created combined buffer of size ${combinedBuffer.length} samples`);
+          await processDictationAudio(combinedBuffer);
+        } else {
+          console.error("No valid audio data found");
+          setDictationError("No audio data recorded");
+        }
+      } else {
+        console.error("No audio data to process");
+        setDictationError("No audio data to process");
+      }
+    } catch (error) {
+      console.error("Error stopping recording:", error);
+      setDictationError("An error occurred while stopping dictation");
+    } finally {
+      setIsDictating(false);
+      audioSamplesRef.current = [];
+      setAudioBuffer(null);
+    }
+  };
+  const encodeWAV = (samples) => {
+    console.log(`Encoding WAV with ${samples.length} samples`);
+    const sampleRate = audioContextRef.current?.sampleRate || 44100;
+    console.log(`Using sample rate: ${sampleRate}Hz`);
+    const buffer = new ArrayBuffer(44 + samples.length * 2);
+    const view = new DataView(buffer);
+    const writeString = (offset2, str) => {
+      for (let i = 0; i < str.length; i++) {
+        view.setUint8(offset2 + i, str.charCodeAt(i));
+      }
+    };
+    writeString(0, "RIFF");
+    view.setUint32(4, 36 + samples.length * 2, true);
+    writeString(8, "WAVE");
+    writeString(12, "fmt ");
+    view.setUint32(16, 16, true);
+    view.setUint16(20, 1, true);
+    view.setUint16(22, 1, true);
+    view.setUint32(24, sampleRate, true);
+    view.setUint32(28, sampleRate * 2, true);
+    view.setUint16(32, 2, true);
+    view.setUint16(34, 16, true);
+    writeString(36, "data");
+    view.setUint32(40, samples.length * 2, true);
+    let offset = 44;
+    for (let i = 0; i < samples.length; i++) {
+      const sample = Math.max(-1, Math.min(1, samples[i]));
+      view.setInt16(offset, sample < 0 ? sample * 32768 : sample * 32767, true);
+      offset += 2;
+    }
+    const wavBlob = new Blob([view], { type: "audio/wav" });
+    console.log(`Created WAV blob: ${(wavBlob.size / 1024).toFixed(2)} KB`);
+    return wavBlob;
+  };
+  const processDictationAudio = async (audioData) => {
+    try {
+      console.log(`Processing dictation with audio data length: ${audioData.length}`);
+      console.log(`Using format: ${selectedFormat}`);
+      setIsProcessing(true);
+      const wavBlob = encodeWAV(audioData);
+      console.log(`Sending audio to dictation API (${wavBlob.size / 1024} KB)`);
+      const requestData = {
+        doctorName,
+        patientId,
+        sessionId,
+        language,
+        specialty
+      };
+      let requestBody;
+      let headers = {
+        "x-api-key": effectiveApiKey || ""
+      };
+      switch (selectedFormat) {
+        case "hl7":
+          requestBody = createHL7DictationRequest(
+            new File([wavBlob], "dictation.wav", { type: "audio/wav" }),
+            requestData
+          );
+          headers["x-request-format"] = "hl7";
+          headers["x-response-format"] = "hl7";
+          console.log("Created HL7-formatted dictation request");
+          break;
+        case "fhir":
+          requestBody = createFHIRDictationRequest(
+            new File([wavBlob], "dictation.wav", { type: "audio/wav" }),
+            requestData
+          );
+          headers["x-request-format"] = "fhir";
+          headers["x-response-format"] = "fhir";
+          console.log("Created FHIR-formatted dictation request");
+          break;
+        case "json":
+        default:
+          requestBody = new FormData();
+          requestBody.append("audio", wavBlob);
+          requestBody.append("doctorName", doctorName);
+          if (patientId) requestBody.append("patientId", patientId);
+          if (sessionId) requestBody.append("sessionId", sessionId);
+          if (language) requestBody.append("language", language);
+          if (specialty) requestBody.append("specialty", specialty);
+          headers["x-request-format"] = "json";
+          headers["x-response-format"] = "json";
+          console.log("Created JSON-formatted dictation request");
+          break;
+      }
+      console.log("Request headers:", headers);
+      console.log("Sending request to API...");
+      const response = await fetch(`${apiBaseUrl}/api/dictate`, {
+        method: "POST",
+        body: requestBody,
+        headers
+      });
+      console.log("API response status:", response.status);
+      if (!response.ok) {
+        throw new Error(`API request failed with status ${response.status}`);
+      }
+      let responseData;
+      const contentType = response.headers.get("content-type") || "";
+      if (selectedFormat === "json" || contentType.includes("application/json")) {
+        responseData = await response.json();
+      } else {
+        responseData = await response.text();
+      }
+      console.log("Raw API response data:", responseData);
+      const convertedData = convertDictationResponse(responseData, selectedFormat);
+      console.log("Converted response data:", convertedData);
+      if (convertedData.dictation) {
+        console.log("Dictation text received:", convertedData.dictation);
+        onDictationComplete(convertedData.dictation);
+      } else {
+        console.error("No dictation text in response");
+        setDictationError("No dictation text in response");
+      }
+    } catch (error) {
+      console.error("Error processing dictation audio:", error);
+      setDictationError("An error occurred while processing dictation");
+    } finally {
+      setIsProcessing(false);
+      setIsDictating(false);
+    }
+  };
+  return { startDictating, stopDictating, dictationError };
+};
+var useAudioDictation_default = useAudioDictation;
+var dictationStyles = `
+  .dictation-button-recording {
+    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
+    background-size: 400% 400%;
+    animation: gradientShift 2s ease infinite;
+  }
+  
+  @keyframes gradientShift {
+    0% { background-position: 0% 50%; }
+    50% { background-position: 100% 50%; }
+    100% { background-position: 0% 50%; }
+  }
+
+  .dictation-pulse {
+    animation: dictationPulse 1.5s ease-in-out infinite;
+  }
+
+  @keyframes dictationPulse {
+    0%, 100% { transform: scale(1); opacity: 1; }
+    50% { transform: scale(1.05); opacity: 0.8; }
+  }
+
+  .bg-blue-600 { background-color: rgb(37 99 235); }
+  .hover\\:bg-blue-700:hover { background-color: rgb(29 78 216); }
+  .bg-red-600 { background-color: rgb(220 38 38); }
+  .hover\\:bg-red-700:hover { background-color: rgb(185 28 28); }
+  .bg-gray-600 { background-color: rgb(75 85 99); }
+  .hover\\:bg-gray-700:hover { background-color: rgb(55 65 81); }
+  .text-white { color: rgb(255 255 255); }
+  .flex { display: flex; }
+  .items-center { align-items: center; }
+  .justify-center { justify-content: center; }
+  .space-x-2 > :not([hidden]) ~ :not([hidden]) { margin-left: 0.5rem; }
+  .px-4 { padding-left: 1rem; padding-right: 1rem; }
+  .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
+  .rounded-lg { border-radius: 0.5rem; }
+  .rounded-full { border-radius: 9999px; }
+  .transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; }
+  .duration-200 { transition-duration: 200ms; }
+  .disabled\\:opacity-50:disabled { opacity: 0.5; }
+  .disabled\\:cursor-not-allowed:disabled { cursor: not-allowed; }
+  .h-5 { height: 1.25rem; }
+  .w-5 { width: 1.25rem; }
+  .h-6 { height: 1.5rem; }
+  .w-6 { width: 1.5rem; }
+  .text-sm { font-size: 0.875rem; line-height: 1.25rem; }
+  .font-medium { font-weight: 500; }
+  .animate-spin { animation: spin 1s linear infinite; }
+  @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
+  .bg-red-50 { background-color: rgb(254 242 242); }
+  .border { border-width: 1px; }
+  .border-red-200 { border-color: rgb(254 202 202); }
+  .text-red-800 { color: rgb(153 27 27); }
+  .text-red-700 { color: rgb(185 28 28); }
+  .p-3 { padding: 0.75rem; }
+  .mt-2 { margin-top: 0.5rem; }
+  .text-xs { font-size: 0.75rem; line-height: 1rem; }
+`;
+var dictationStylesInjected = false;
+var injectDictationStyles = () => {
+  if (!dictationStylesInjected && typeof document !== "undefined") {
+    const styleElement = document.createElement("style");
+    styleElement.textContent = dictationStyles;
+    document.head.appendChild(styleElement);
+    dictationStylesInjected = true;
+  }
+};
+var AudioDictation = ({
+  apiKey,
+  apiBaseUrl,
+  appendMode = true,
+  doctorName = "doctor",
+  patientId,
+  sessionId,
+  language = "en",
+  specialty = "general",
+  selectedFormat = "json",
+  onDictationComplete,
+  className = "",
+  style,
+  buttonText,
+  placeholder = "Click to dictate..."
+}) => {
+  const [isDictating, setIsDictating] = React3__namespace.useState(false);
+  const [isProcessing, setIsProcessing] = React3__namespace.useState(false);
+  React3__namespace.useEffect(() => {
+    injectDictationStyles();
+  }, []);
+  const { startDictating, stopDictating, dictationError } = useAudioDictation_default({
+    setIsProcessing,
+    setIsDictating,
+    onDictationComplete,
+    apiKey,
+    apiBaseUrl,
+    appendMode,
+    doctorName,
+    patientId,
+    sessionId,
+    language,
+    specialty,
+    selectedFormat
+  });
+  const handleToggleDictation = (e) => {
+    e.preventDefault();
+    if (isProcessing) return;
+    if (isDictating) {
+      stopDictating();
+    } else {
+      startDictating();
+    }
+  };
+  React3__namespace.useEffect(() => {
+    const handleKeyDown = (e) => {
+      if (e.code === "Space" && !e.repeat && !isProcessing) {
+        e.preventDefault();
+        if (isDictating) {
+          stopDictating();
+        } else {
+          startDictating();
+        }
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [isDictating, isProcessing, startDictating, stopDictating]);
+  const getButtonContent = () => {
+    if (isProcessing) {
+      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-5 w-5 animate-spin" }) });
+    }
+    if (isDictating) {
+      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Square, { className: "h-5 w-5" }) });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Mic, { className: "h-5 w-5" }) });
+  };
+  const getButtonClass = () => {
+    const baseClass = "flex items-center justify-center space-x-2 px-4 py-2 rounded-lg font-medium transition-all duration-200 disabled:opacity-50 disabled:cursor-not-allowed";
+    if (className) {
+      return `${baseClass} ${className}`;
+    }
+    if (isProcessing) {
+      return `${baseClass} bg-gray-600 text-white`;
+    }
+    if (isDictating) {
+      return `${baseClass} dictation-button-recording text-white dictation-pulse`;
+    }
+    return `${baseClass} bg-blue-600 hover:bg-blue-700 text-white`;
+  };
+  if (dictationError) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-red-50 border border-red-200 rounded-lg p-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "h-5 w-5 text-red-600" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-red-800", children: "Dictation Error" }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-red-700 mt-1", children: dictationError })
+      ] })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      className: getButtonClass(),
+      onClick: handleToggleDictation,
+      disabled: isProcessing,
+      title: isDictating ? "Click to stop dictating" : placeholder,
+      children: getButtonContent()
+    }
+  ) });
+};
+var AudioDictation_default = AudioDictation;
 
+exports.AudioDictation = AudioDictation_default;
 exports.AudioRecorder = AudioRecorder_default;
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map