@copilotz/chat-ui 0.1.33 → 0.1.35

package/dist/index.cjs

@@ -96,12 +96,14 @@ var defaultChatConfig = {
     voiceFinishing: "Finishing capture...",
     voiceReview: "Ready to send",
     voiceSending: "Sending...",
+    voiceReviewArmedHint: "Still listening. Speak to add more before it sends.",
+    voiceReviewPausedHint: "Tap the mic to keep adding to this message.",
     voiceStart: "Start recording",
     voiceStop: "Stop recording",
     voiceSendNow: "Send now",
     voiceCancel: "Cancel",
     voiceDiscard: "Delete recording",
-    voiceRecordAgain: "Record again",
+    voiceRecordAgain: "Continue recording",
     voiceAutoSendIn: "Auto-sends in {{seconds}}s",
     voiceTranscriptPending: "Transcript unavailable",
     voicePermissionDenied: "Microphone access was denied.",
@@ -171,6 +173,7 @@ var defaultChatConfig = {
   voiceCompose: {
     enabled: false,
     defaultMode: "text",
+    reviewMode: "manual",
     autoSendDelayMs: 5e3,
     persistComposer: true,
     showTranscriptPreview: true,
@@ -2866,6 +2869,121 @@ var blobToDataUrl = (blob) => new Promise((resolve, reject) => {
   reader.onerror = () => reject(reader.error ?? new Error("Failed to read recorded audio"));
   reader.readAsDataURL(blob);
 });
+var joinTranscriptParts = (...parts) => {
+  const value = parts.map((part) => part?.trim()).filter((part) => Boolean(part && part.length > 0)).join(" ").trim();
+  return value.length > 0 ? value : void 0;
+};
+var getAudioContextCtor = () => globalThis.AudioContext || globalThis.webkitAudioContext;
+var getOfflineAudioContextCtor = () => globalThis.OfflineAudioContext || globalThis.webkitOfflineAudioContext;
+var attachmentToArrayBuffer = async (attachment) => {
+  const response = await fetch(attachment.dataUrl);
+  return response.arrayBuffer();
+};
+var decodeAudioAttachment = async (attachment) => {
+  const AudioContextCtor = getAudioContextCtor();
+  if (!AudioContextCtor) {
+    throw new Error("Audio decoding is not supported in this browser");
+  }
+  const audioContext = new AudioContextCtor();
+  try {
+    const arrayBuffer = await attachmentToArrayBuffer(attachment);
+    return await audioContext.decodeAudioData(arrayBuffer.slice(0));
+  } finally {
+    await closeAudioContext(audioContext);
+  }
+};
+var renderMergedBuffer = async (buffers) => {
+  const OfflineAudioContextCtor = getOfflineAudioContextCtor();
+  if (!OfflineAudioContextCtor) {
+    throw new Error("Offline audio rendering is not supported in this browser");
+  }
+  const numberOfChannels = Math.max(...buffers.map((buffer) => buffer.numberOfChannels));
+  const sampleRate = Math.max(...buffers.map((buffer) => buffer.sampleRate));
+  const totalFrames = Math.max(1, Math.ceil(buffers.reduce((sum, buffer) => sum + buffer.duration * sampleRate, 0)));
+  const offlineContext = new OfflineAudioContextCtor(numberOfChannels, totalFrames, sampleRate);
+  let offsetSeconds = 0;
+  for (const buffer of buffers) {
+    const source = offlineContext.createBufferSource();
+    source.buffer = buffer;
+    source.connect(offlineContext.destination);
+    source.start(offsetSeconds);
+    offsetSeconds += buffer.duration;
+  }
+  return offlineContext.startRendering();
+};
+var encodeWav = (audioBuffer) => {
+  const numberOfChannels = audioBuffer.numberOfChannels;
+  const sampleRate = audioBuffer.sampleRate;
+  const bitsPerSample = 16;
+  const bytesPerSample = bitsPerSample / 8;
+  const dataLength = audioBuffer.length * numberOfChannels * bytesPerSample;
+  const buffer = new ArrayBuffer(44 + dataLength);
+  const view = new DataView(buffer);
+  const writeString = (offset2, value) => {
+    for (let index = 0; index < value.length; index += 1) {
+      view.setUint8(offset2 + index, value.charCodeAt(index));
+    }
+  };
+  writeString(0, "RIFF");
+  view.setUint32(4, 36 + dataLength, true);
+  writeString(8, "WAVE");
+  writeString(12, "fmt ");
+  view.setUint32(16, 16, true);
+  view.setUint16(20, 1, true);
+  view.setUint16(22, numberOfChannels, true);
+  view.setUint32(24, sampleRate, true);
+  view.setUint32(28, sampleRate * numberOfChannels * bytesPerSample, true);
+  view.setUint16(32, numberOfChannels * bytesPerSample, true);
+  view.setUint16(34, bitsPerSample, true);
+  writeString(36, "data");
+  view.setUint32(40, dataLength, true);
+  let offset = 44;
+  const channelData = Array.from({ length: numberOfChannels }, (_, index) => audioBuffer.getChannelData(index));
+  for (let sampleIndex = 0; sampleIndex < audioBuffer.length; sampleIndex += 1) {
+    for (let channelIndex = 0; channelIndex < numberOfChannels; channelIndex += 1) {
+      const sample = Math.max(-1, Math.min(1, channelData[channelIndex][sampleIndex]));
+      const pcmValue = sample < 0 ? sample * 32768 : sample * 32767;
+      view.setInt16(offset, pcmValue, true);
+      offset += 2;
+    }
+  }
+  return new Blob([buffer], { type: "audio/wav" });
+};
+var resolveSegmentCount = (segment) => {
+  const candidate = segment?.metadata?.segmentCount;
+  return typeof candidate === "number" && Number.isFinite(candidate) && candidate > 0 ? candidate : segment ? 1 : 0;
+};
+var mergeVoiceTranscripts = (previous, incoming) => ({
+  final: joinTranscriptParts(previous?.final, incoming?.final),
+  partial: joinTranscriptParts(previous?.final, incoming?.partial)
+});
+var appendVoiceSegments = async (previous, incoming) => {
+  const [previousBuffer, incomingBuffer] = await Promise.all([
+    decodeAudioAttachment(previous.attachment),
+    decodeAudioAttachment(incoming.attachment)
+  ]);
+  const mergedBuffer = await renderMergedBuffer([previousBuffer, incomingBuffer]);
+  const mergedBlob = encodeWav(mergedBuffer);
+  const dataUrl = await blobToDataUrl(mergedBlob);
+  const segmentCount = resolveSegmentCount(previous) + resolveSegmentCount(incoming);
+  return {
+    attachment: {
+      kind: "audio",
+      dataUrl,
+      mimeType: mergedBlob.type,
+      durationMs: Math.round(mergedBuffer.duration * 1e3),
+      fileName: `voice-${(/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-")}.wav`,
+      size: mergedBlob.size
+    },
+    transcript: mergeVoiceTranscripts(previous.transcript, incoming.transcript),
+    metadata: {
+      ...previous.metadata,
+      ...incoming.metadata,
+      segmentCount,
+      source: segmentCount > 1 ? "merged" : incoming.metadata?.source ?? previous.metadata?.source
+    }
+  };
+};
 var stopStream = (stream) => {
   if (!stream) return;
   stream.getTracks().forEach((track) => track.stop());
@@ -2987,7 +3105,7 @@ var createManualVoiceProvider = async (handlers, options = {}) => {
                 fileName: `voice-${(/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-")}.webm`,
                 size: blob.size
               },
-              metadata: { source: "manual" }
+              metadata: { source: "manual", segmentCount: 1 }
             });
           } else {
             handlers.onStateChange?.("idle");
@@ -3141,11 +3259,13 @@ var VoiceComposer = ({
   countdownMs,
   autoSendDelayMs,
   isAutoSendActive,
+  reviewMode,
   errorMessage,
   disabled = false,
   labels,
   onStart,
   onStop,
+  onPauseReview,
   onCancelAutoSend,
   onDiscard,
   onRecordAgain,
@@ -3157,9 +3277,26 @@ var VoiceComposer = ({
   const countdownValue = autoSendDelayMs > 0 ? Math.min(100, Math.max(0, (autoSendDelayMs - countdownMs) / autoSendDelayMs * 100)) : 100;
   const isBusy = state === "preparing" || state === "finishing" || state === "sending";
   const isCapturing = state === "waiting_for_speech" || state === "listening";
-  const isReviewing = state === "review";
+  const hasDraft = Boolean(attachment);
+  const isDraftLayout = hasDraft;
+  const isArmedDraft = isDraftLayout && reviewMode === "armed" && (state === "waiting_for_speech" || state === "listening");
   const levelValue = isCapturing || state === "preparing" || state === "finishing" ? Math.max(8, Math.round(audioLevel * 100)) : 0;
-  const headerLabel = state === "error" ? labels?.voiceCaptureError || "Unable to capture audio." : resolveStateLabel(state, labels, errorMessage);
+  const headerLabel = hasDraft && state !== "sending" && state !== "error" ? labels?.voiceReview || "Ready to send" : state === "error" ? labels?.voiceCaptureError || "Unable to capture audio." : resolveStateLabel(state, labels, errorMessage);
+  const reviewHelperText = isArmedDraft ? labels?.voiceReviewArmedHint || "Speak to add more before it sends." : labels?.voiceReviewPausedHint || labels?.voiceRecordAgain || "Tap the mic to continue this message.";
+  const orbIsListening = state === "listening";
+  const orbCanStop = !isDraftLayout && (state === "waiting_for_speech" || state === "listening");
+  const orbIsReviewBusy = state === "preparing" || state === "finishing" || state === "sending";
+  const handleReviewOrbClick = () => {
+    if (state === "listening") {
+      onStop();
+      return;
+    }
+    if (isArmedDraft) {
+      onPauseReview();
+      return;
+    }
+    onRecordAgain();
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "w-full max-w-3xl rounded-xl border bg-background p-3 shadow-sm sm:p-4 md:min-w-3xl", children: [
     /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center justify-between gap-2 sm:gap-3", children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex min-w-0 items-center gap-2", children: [
@@ -3182,7 +3319,7 @@ var VoiceComposer = ({
         }
       )
     ] }),
-    !isReviewing ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mt-3 rounded-xl border border-dashed border-primary/30 bg-primary/5 px-3 py-3 text-center sm:px-4 sm:py-4", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "mx-auto flex w-full max-w-sm flex-col items-center gap-3", children: [
+    !isDraftLayout ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mt-3 rounded-xl border border-dashed border-primary/30 bg-primary/5 px-3 py-3 text-center sm:px-4 sm:py-4", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "mx-auto flex w-full max-w-sm flex-col items-center gap-3", children: [
       /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         Button,
         {
@@ -3224,6 +3361,27 @@ var VoiceComposer = ({
           }
         )
       ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "mt-4 flex flex-col items-center gap-3 text-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+          Button,
+          {
+            type: "button",
+            size: "icon",
+            variant: orbCanStop ? "destructive" : "outline",
+            className: `h-16 w-16 rounded-full sm:h-20 sm:w-20 ${orbIsListening ? "border-red-500 bg-red-500 text-white hover:bg-red-600" : isArmedDraft ? "border-red-200 bg-red-50 text-red-600 shadow-[0_0_0_10px_rgba(239,68,68,0.08)] hover:bg-red-100 hover:text-red-700" : "border-red-200 bg-red-50 text-red-600 hover:bg-red-100 hover:text-red-700"}`,
+            onClick: handleReviewOrbClick,
+            disabled: disabled || orbIsReviewBusy,
+            children: orbIsReviewBusy ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react9.Loader2, { className: "h-7 w-7 animate-spin" }) : orbIsListening ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react9.Square, { className: "h-7 w-7" }) : isArmedDraft ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react9.Mic, { className: "h-7 w-7 animate-pulse" }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react9.Mic, { className: "h-7 w-7" })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "w-full max-w-sm space-y-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Progress, { value: levelValue, className: "h-2" }),
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center justify-between text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: formatDuration(durationMs) }),
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "max-w-[15rem] text-right", children: reviewHelperText })
+          ] })
+        ] })
+      ] }),
       attachment && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mt-3 rounded-lg bg-background p-2", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("audio", { controls: true, preload: "metadata", className: "w-full", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("source", { src: attachment.dataUrl, type: attachment.mimeType }) }) }),
       showTranscriptPreview && transcriptMode !== "none" && transcriptText && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mt-3 rounded-lg border bg-background px-3 py-2 text-left text-sm", children: transcriptText }),
       isAutoSendActive && autoSendDelayMs > 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "mt-3 space-y-2", children: [
@@ -3235,26 +3393,13 @@ var VoiceComposer = ({
           /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react9.X, { className: "h-4 w-4" }),
           labels?.voiceCancel || "Cancel"
         ] }),
-        !isAutoSendActive && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-          Button,
-          {
-            type: "button",
-            variant: "outline",
-            size: "icon",
-            onClick: onRecordAgain,
-            disabled,
-            "aria-label": labels?.voiceRecordAgain || "Record again",
-            title: labels?.voiceRecordAgain || "Record again",
-            children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react9.Mic, { className: "h-4 w-4" })
-          }
-        ),
         /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Button, { type: "button", size: "sm", onClick: onSendNow, disabled, children: [
           /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react9.Send, { className: "h-4 w-4" }),
           labels?.voiceSendNow || "Send now"
         ] })
       ] })
     ] }),
-    state === "error" && errorMessage && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mt-3 rounded-lg border border-destructive/30 bg-destructive/5 px-3 py-2 text-sm text-destructive", children: errorMessage })
+    errorMessage && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mt-3 rounded-lg border border-destructive/30 bg-destructive/5 px-3 py-2 text-sm text-destructive", children: errorMessage })
   ] });
 };
 
@@ -3503,6 +3648,7 @@ var resolveVoiceErrorMessage = (error, config) => {
   return config?.labels?.voiceCaptureError || "Unable to capture audio.";
 };
 var clearVoiceTranscript = () => ({});
+var resolveVoiceSegmentDuration = (segment) => segment.attachment.durationMs ?? 0;
 var ChatInput = (0, import_react5.memo)(function ChatInput2({
   value,
   onChange,
@@ -3524,6 +3670,7 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
 }) {
   const voiceComposeEnabled = config?.voiceCompose?.enabled === true;
   const voiceDefaultMode = config?.voiceCompose?.defaultMode ?? "text";
+  const voiceReviewMode = config?.voiceCompose?.reviewMode ?? "manual";
   const voiceAutoSendDelayMs = config?.voiceCompose?.autoSendDelayMs ?? 5e3;
   const voicePersistComposer = config?.voiceCompose?.persistComposer ?? true;
   const voiceShowTranscriptPreview = config?.voiceCompose?.showTranscriptPreview ?? true;
@@ -3551,6 +3698,9 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
   const recordingInterval = (0, import_react5.useRef)(null);
   const mediaStreamRef = (0, import_react5.useRef)(null);
   const voiceProviderRef = (0, import_react5.useRef)(null);
+  const voiceDraftRef = (0, import_react5.useRef)(null);
+  const voiceAppendBaseRef = (0, import_react5.useRef)(null);
+  const voiceAppendBaseDurationRef = (0, import_react5.useRef)(0);
   (0, import_react5.useEffect)(() => {
     return () => {
       if (mediaStreamRef.current) {
@@ -3565,6 +3715,9 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
       }
     };
   }, []);
+  (0, import_react5.useEffect)(() => {
+    voiceDraftRef.current = voiceDraft;
+  }, [voiceDraft]);
   const handleSubmit = (e) => {
     e.preventDefault();
     if (!value.trim() && attachments.length === 0 || disabled || isGenerating) return;
@@ -3742,6 +3895,9 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
   const resetVoiceComposerState = (0, import_react5.useCallback)((nextState = "idle") => {
     setVoiceState(nextState);
     setVoiceDraft(null);
+    voiceDraftRef.current = null;
+    voiceAppendBaseRef.current = null;
+    voiceAppendBaseDurationRef.current = 0;
     setVoiceTranscript(clearVoiceTranscript());
     setVoiceDurationMs(0);
     setVoiceAudioLevel(0);
@@ -3749,31 +3905,102 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
     setIsVoiceAutoSendActive(false);
     setVoiceError(null);
   }, []);
+  const armVoiceDraftForAppend = (0, import_react5.useCallback)((segment) => {
+    voiceAppendBaseRef.current = segment;
+    voiceAppendBaseDurationRef.current = segment ? resolveVoiceSegmentDuration(segment) : 0;
+  }, []);
+  const handleVoiceProviderStateChange = (0, import_react5.useCallback)((nextState) => {
+    if (voiceReviewMode === "armed" && (nextState === "waiting_for_speech" || nextState === "listening")) {
+      const currentDraft = voiceDraftRef.current;
+      if (currentDraft) {
+        armVoiceDraftForAppend(currentDraft);
+      }
+    }
+    if (voiceReviewMode === "armed" && nextState === "listening" && voiceDraftRef.current) {
+      setVoiceCountdownMs(voiceAutoSendDelayMs);
+      setIsVoiceAutoSendActive(false);
+    }
+    setVoiceState(nextState);
+  }, [armVoiceDraftForAppend, voiceAutoSendDelayMs, voiceReviewMode]);
   const ensureVoiceProvider = (0, import_react5.useCallback)(async () => {
     if (voiceProviderRef.current) {
       return voiceProviderRef.current;
     }
     const createProvider = resolveVoiceProviderFactory(config?.voiceCompose?.createProvider);
     const provider = await createProvider({
-      onStateChange: setVoiceState,
+      onStateChange: handleVoiceProviderStateChange,
       onAudioLevelChange: setVoiceAudioLevel,
-      onDurationChange: setVoiceDurationMs,
-      onTranscriptChange: setVoiceTranscript,
+      onDurationChange: (durationMs) => {
+        setVoiceDurationMs(voiceAppendBaseDurationRef.current + durationMs);
+      },
+      onTranscriptChange: (transcript) => {
+        const baseTranscript = voiceAppendBaseRef.current?.transcript;
+        setVoiceTranscript(
+          baseTranscript ? mergeVoiceTranscripts(baseTranscript, transcript) : transcript
+        );
+      },
       onSegmentReady: (segment) => {
-        setVoiceDraft(segment);
-        setVoiceTranscript(segment.transcript ?? clearVoiceTranscript());
-        setVoiceDurationMs(segment.attachment.durationMs ?? 0);
-        setVoiceAudioLevel(0);
-        setVoiceCountdownMs(voiceAutoSendDelayMs);
-        setIsVoiceAutoSendActive(voiceAutoSendDelayMs > 0);
-        setVoiceError(null);
-        setVoiceState("review");
+        void (async () => {
+          const previousSegment = voiceAppendBaseRef.current;
+          try {
+            const nextSegment = previousSegment ? await appendVoiceSegments(previousSegment, segment) : segment;
+            voiceDraftRef.current = nextSegment;
+            setVoiceDraft(nextSegment);
+            setVoiceTranscript(nextSegment.transcript ?? clearVoiceTranscript());
+            setVoiceDurationMs(resolveVoiceSegmentDuration(nextSegment));
+            setVoiceAudioLevel(0);
+            setVoiceCountdownMs(voiceAutoSendDelayMs);
+            setIsVoiceAutoSendActive(voiceAutoSendDelayMs > 0);
+            setVoiceError(null);
+            if (voiceReviewMode === "armed") {
+              armVoiceDraftForAppend(nextSegment);
+            } else {
+              armVoiceDraftForAppend(null);
+            }
+            setVoiceState((currentState) => voiceReviewMode === "armed" && (currentState === "waiting_for_speech" || currentState === "listening") ? currentState : "review");
+          } catch (error) {
+            const resolvedError = resolveVoiceErrorMessage(error, config);
+            armVoiceDraftForAppend(null);
+            setVoiceAudioLevel(0);
+            setVoiceCountdownMs(0);
+            setIsVoiceAutoSendActive(false);
+            if (previousSegment) {
+              voiceDraftRef.current = previousSegment;
+              setVoiceDraft(previousSegment);
+              setVoiceTranscript(previousSegment.transcript ?? clearVoiceTranscript());
+              setVoiceDurationMs(resolveVoiceSegmentDuration(previousSegment));
+              setVoiceError(resolvedError);
+              setVoiceState("review");
+              return;
+            }
+            voiceDraftRef.current = null;
+            setVoiceDraft(null);
+            setVoiceTranscript(clearVoiceTranscript());
+            setVoiceDurationMs(0);
+            setVoiceError(resolvedError);
+            setVoiceState("error");
+          }
+        })();
       },
       onError: (error) => {
+        const previousSegment = voiceAppendBaseRef.current;
+        armVoiceDraftForAppend(null);
         setVoiceError(resolveVoiceErrorMessage(error, config));
         setVoiceAudioLevel(0);
         setVoiceCountdownMs(0);
         setIsVoiceAutoSendActive(false);
+        if (previousSegment) {
+          voiceDraftRef.current = previousSegment;
+          setVoiceDraft(previousSegment);
+          setVoiceTranscript(previousSegment.transcript ?? clearVoiceTranscript());
+          setVoiceDurationMs(resolveVoiceSegmentDuration(previousSegment));
+          setVoiceState("review");
+          return;
+        }
+        voiceDraftRef.current = null;
+        setVoiceDraft(null);
+        setVoiceTranscript(clearVoiceTranscript());
+        setVoiceDurationMs(0);
         setVoiceState("error");
       }
     }, {
@@ -3781,37 +4008,69 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
     });
     voiceProviderRef.current = provider;
     return provider;
-  }, [config, voiceAutoSendDelayMs, voiceMaxRecordingMs]);
+  }, [armVoiceDraftForAppend, config, handleVoiceProviderStateChange, voiceAutoSendDelayMs, voiceMaxRecordingMs, voiceReviewMode]);
   const closeVoiceComposer = (0, import_react5.useCallback)(async () => {
+    voiceAppendBaseRef.current = null;
+    voiceAppendBaseDurationRef.current = 0;
     setIsVoiceComposerOpen(false);
     setVoiceError(null);
     setVoiceCountdownMs(0);
     setVoiceAudioLevel(0);
     setVoiceTranscript(clearVoiceTranscript());
     setVoiceDraft(null);
+    voiceDraftRef.current = null;
     setVoiceDurationMs(0);
     setVoiceState("idle");
     if (voiceProviderRef.current) {
       await voiceProviderRef.current.cancel();
     }
   }, []);
-  const startVoiceCapture = (0, import_react5.useCallback)(async () => {
+  const startVoiceCapture = (0, import_react5.useCallback)(async (appendToDraft = false) => {
     if (disabled || isGenerating) {
       return;
     }
+    const previousDraft = appendToDraft ? voiceDraftRef.current : null;
+    const previousDurationMs = previousDraft ? resolveVoiceSegmentDuration(previousDraft) : 0;
     setIsVoiceComposerOpen(true);
     setVoiceError(null);
-    setVoiceDraft(null);
     setVoiceCountdownMs(0);
-    setVoiceTranscript(clearVoiceTranscript());
     setVoiceAudioLevel(0);
-    setVoiceDurationMs(0);
     setIsVoiceAutoSendActive(false);
+    voiceAppendBaseRef.current = previousDraft;
+    voiceAppendBaseDurationRef.current = previousDurationMs;
+    if (!previousDraft) {
+      setVoiceDraft(null);
+      voiceDraftRef.current = null;
+      setVoiceTranscript(clearVoiceTranscript());
+      setVoiceDurationMs(0);
+    } else {
+      setVoiceTranscript(previousDraft.transcript ?? clearVoiceTranscript());
+      setVoiceDurationMs(previousDurationMs);
+    }
     try {
       const provider = await ensureVoiceProvider();
       await provider.start();
     } catch (error) {
-      setVoiceError(resolveVoiceErrorMessage(error, config));
+      const resolvedError = resolveVoiceErrorMessage(error, config);
+      voiceAppendBaseRef.current = null;
+      voiceAppendBaseDurationRef.current = 0;
+      setVoiceAudioLevel(0);
+      setVoiceCountdownMs(0);
+      setIsVoiceAutoSendActive(false);
+      if (previousDraft) {
+        voiceDraftRef.current = previousDraft;
+        setVoiceDraft(previousDraft);
+        setVoiceTranscript(previousDraft.transcript ?? clearVoiceTranscript());
+        setVoiceDurationMs(previousDurationMs);
+        setVoiceError(resolvedError);
+        setVoiceState("review");
+        return;
+      }
+      voiceDraftRef.current = null;
+      setVoiceDraft(null);
+      setVoiceTranscript(clearVoiceTranscript());
+      setVoiceDurationMs(0);
+      setVoiceError(resolvedError);
       setVoiceState("error");
     }
   }, [disabled, isGenerating, ensureVoiceProvider, config]);
@@ -3825,6 +4084,8 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
     }
   }, [config]);
   const cancelVoiceCapture = (0, import_react5.useCallback)(async () => {
+    voiceAppendBaseRef.current = null;
+    voiceAppendBaseDurationRef.current = 0;
     if (voiceProviderRef.current) {
       await voiceProviderRef.current.cancel();
     }
@@ -3839,16 +4100,21 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
     void closeVoiceComposer();
   }, [voicePersistComposer, resetVoiceComposerState, closeVoiceComposer]);
   const sendVoiceDraft = (0, import_react5.useCallback)(() => {
-    if (!voiceDraft || disabled || isGenerating) {
-      return;
-    }
-    setVoiceState("sending");
-    setVoiceCountdownMs(0);
-    setIsVoiceAutoSendActive(false);
-    onSubmit("", [...attachments, voiceDraft.attachment]);
-    onChange("");
-    onAttachmentsChange([]);
-    finalizeVoiceComposerAfterSend();
+    void (async () => {
+      if (!voiceDraft || disabled || isGenerating) {
+        return;
+      }
+      setVoiceState("sending");
+      setVoiceCountdownMs(0);
+      setIsVoiceAutoSendActive(false);
+      if (voiceProviderRef.current) {
+        await voiceProviderRef.current.cancel();
+      }
+      onSubmit("", [...attachments, voiceDraft.attachment]);
+      onChange("");
+      onAttachmentsChange([]);
+      finalizeVoiceComposerAfterSend();
+    })();
   }, [
     voiceDraft,
     disabled,
@@ -3860,25 +4126,51 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
     finalizeVoiceComposerAfterSend
   ]);
   const cancelVoiceAutoSend = (0, import_react5.useCallback)(() => {
+    void (async () => {
+      if (voiceReviewMode === "armed" && voiceProviderRef.current) {
+        await voiceProviderRef.current.cancel();
+      }
+      armVoiceDraftForAppend(null);
+      setVoiceAudioLevel(0);
+      setVoiceState("review");
+    })();
     setVoiceCountdownMs(0);
     setIsVoiceAutoSendActive(false);
-  }, []);
+  }, [armVoiceDraftForAppend, voiceReviewMode]);
+  const pauseVoiceReview = (0, import_react5.useCallback)(async () => {
+    if (voiceState === "listening") {
+      await stopVoiceCapture();
+      return;
+    }
+    if (voiceReviewMode === "armed" && voiceProviderRef.current) {
+      await voiceProviderRef.current.cancel();
+    }
+    armVoiceDraftForAppend(null);
+    setVoiceAudioLevel(0);
+    setVoiceState("review");
+  }, [armVoiceDraftForAppend, stopVoiceCapture, voiceReviewMode, voiceState]);
   (0, import_react5.useEffect)(() => {
-    if (voiceState !== "review" || !voiceDraft || voiceAutoSendDelayMs <= 0 || !isVoiceAutoSendActive) {
+    if (!voiceDraft || voiceAutoSendDelayMs <= 0 || !isVoiceAutoSendActive) {
+      return;
+    }
+    const canContinueCounting = voiceState === "review" || voiceReviewMode === "armed" && voiceState === "waiting_for_speech";
+    if (!canContinueCounting) {
       return;
     }
-    const startedAt = Date.now();
-    setVoiceCountdownMs(voiceAutoSendDelayMs);
     const timer = setInterval(() => {
-      const remaining = Math.max(0, voiceAutoSendDelayMs - (Date.now() - startedAt));
-      setVoiceCountdownMs(remaining);
-      if (remaining <= 0) {
-        clearInterval(timer);
-        sendVoiceDraft();
-      }
+      setVoiceCountdownMs((previous) => {
+        const remaining = Math.max(0, previous - 100);
+        if (remaining <= 0) {
+          clearInterval(timer);
+          queueMicrotask(() => {
+            sendVoiceDraft();
+          });
+        }
+        return remaining;
+      });
     }, 100);
     return () => clearInterval(timer);
-  }, [voiceState, voiceDraft, voiceAutoSendDelayMs, isVoiceAutoSendActive, sendVoiceDraft]);
+  }, [voiceState, voiceDraft, voiceReviewMode, voiceAutoSendDelayMs, isVoiceAutoSendActive, sendVoiceDraft]);
   const removeAttachment = (index) => {
     const newAttachments = attachments.filter((_, i) => i !== index);
     onAttachmentsChange(newAttachments);
@@ -3933,6 +4225,7 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
         countdownMs: voiceCountdownMs,
         autoSendDelayMs: voiceAutoSendDelayMs,
         isAutoSendActive: isVoiceAutoSendActive,
+        reviewMode: voiceReviewMode,
         errorMessage: voiceError,
         disabled: disabled || isGenerating,
         labels: config?.labels,
@@ -3942,6 +4235,9 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
         onStop: () => {
           void stopVoiceCapture();
         },
+        onPauseReview: () => {
+          void pauseVoiceReview();
+        },
         onCancelAutoSend: () => {
           cancelVoiceAutoSend();
         },
@@ -3949,7 +4245,7 @@ var ChatInput = (0, import_react5.memo)(function ChatInput2({
           void cancelVoiceCapture();
         },
         onRecordAgain: () => {
-          void startVoiceCapture();
+          void startVoiceCapture(true);
         },
         onSendNow: sendVoiceDraft,
         onExit: () => {