@arbidocs/react 0.5.110 → 0.5.112

package/dist/documents/PhotoCapture.js

@@ -0,0 +1,120 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { Camera, Check, Loader2, RotateCcw, Trash2 } from "lucide-react";
+import { Button } from "../ui/button.js";
+import { ImageViewer } from "../viewers/ImageViewer.js";
+import { useCameraStream } from "./useCameraStream.js";
+import { captureFrameAsBlob } from "./capture-frame.js";
+function PhotoCapture({ onSave, onDiscard, onError, isSaving = false }) {
+  const camera = useCameraStream({ video: true, audio: false });
+  const videoRef = useRef(null);
+  const [capturedBlob, setCapturedBlob] = useState(null);
+  const [captureError, setCaptureError] = useState(null);
+  useEffect(() => {
+    void camera.start();
+  }, []);
+  useEffect(() => {
+    if (camera.error) onError?.(camera.error);
+  }, [camera.error]);
+  useEffect(() => {
+    const video = videoRef.current;
+    if (!video) return;
+    video.srcObject = camera.stream;
+    if (camera.stream) void video.play().catch(() => {
+    });
+  }, [camera.stream]);
+  const handleShutter = () => {
+    const video = videoRef.current;
+    if (!video) return;
+    setCaptureError(null);
+    captureFrameAsBlob(video).then(setCapturedBlob).catch((err) => {
+      const message = err instanceof Error ? err.message : "Failed to capture the photo";
+      setCaptureError(message);
+      onError?.(message);
+    });
+  };
+  const handleRetake = () => setCapturedBlob(null);
+  const handleSave = () => {
+    if (!capturedBlob) return;
+    void onSave(capturedBlob, "image/png");
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col items-center justify-center gap-6 p-8", children: [
+    !capturedBlob && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "w-full max-w-md overflow-hidden rounded-lg bg-muted/30", children: /* @__PURE__ */ jsx(
+        "video",
+        {
+          ref: videoRef,
+          autoPlay: true,
+          muted: true,
+          playsInline: true,
+          className: "w-full max-h-[60vh] object-contain",
+          "data-testid": "photo-capture-preview"
+        }
+      ) }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          size: "lg",
+          className: "h-16 w-16 rounded-full p-0",
+          onClick: handleShutter,
+          disabled: !camera.stream,
+          "data-testid": "photo-capture-shutter-button",
+          children: /* @__PURE__ */ jsx(Camera, { className: "h-6 w-6" })
+        }
+      ),
+      /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: camera.isStarting ? "Starting camera\u2026" : camera.stream ? "Press to take a photo" : "Waiting for camera access\u2026" }),
+      captureError && /* @__PURE__ */ jsx("p", { className: "text-sm text-red-text", children: captureError })
+    ] }),
+    capturedBlob && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "w-full max-w-md", children: /* @__PURE__ */ jsx(ImageViewer, { blob: capturedBlob, alt: "Captured photo" }) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: onDiscard,
+            disabled: isSaving,
+            "data-testid": "photo-capture-discard-button",
+            children: [
+              /* @__PURE__ */ jsx(Trash2, { className: "mr-1.5 h-4 w-4" }),
+              "Discard"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: handleRetake,
+            disabled: isSaving,
+            "data-testid": "photo-capture-retake-button",
+            children: [
+              /* @__PURE__ */ jsx(RotateCcw, { className: "mr-1.5 h-4 w-4" }),
+              "Retake"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            onClick: handleSave,
+            disabled: isSaving,
+            "data-testid": "photo-capture-save-button",
+            children: [
+              isSaving ? /* @__PURE__ */ jsx(Loader2, { className: "mr-1.5 h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx(Check, { className: "mr-1.5 h-4 w-4" }),
+              isSaving ? "Saving\u2026" : "Save"
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+export {
+  PhotoCapture
+};
+//# sourceMappingURL=PhotoCapture.js.map

package/dist/documents/PhotoCapture.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/documents/PhotoCapture.tsx"],
+  "sourcesContent": ["/**\n * PhotoCapture\n *\n * Camera capture UI: live preview \u2192 shutter \u2192 review (retake or save).\n * Shares its shape (onSave/onDiscard/onError/isSaving) with VoiceNoteRecorder\n * so a host app wires them identically \u2014 see ViewerCaptureDraft\n * (`@arbidocs/blocks`, connection/viewer/drafts.tsx) for how the three capture\n * modes plug into the same draft/save contract.\n *\n * REUSE-FIRST: no app coupling. This component owns only the capture UI and\n * in-memory blob, never persistence \u2014 nothing is uploaded until the host's\n * `onSave` is called.\n */\n\nimport { useEffect, useRef, useState } from 'react'\nimport { Camera, Check, Loader2, RotateCcw, Trash2 } from 'lucide-react'\nimport { Button } from '../ui/button'\nimport { ImageViewer } from '../viewers/ImageViewer'\nimport { useCameraStream } from './useCameraStream'\nimport { captureFrameAsBlob } from './capture-frame'\n\nexport interface PhotoCaptureProps {\n  /** Called with the captured photo when the user hits Save. Resolve to let\n   *  the host close/replace this capture UI; shows a saving spinner while\n   *  the promise is pending. */\n  onSave: (blob: Blob, mimeType: string | null) => Promise<void> | void\n  /** Called when the user discards the draft. */\n  onDiscard: () => void\n  /** Surfaces camera failures (e.g. denied permission) \u2014 wire this to the\n   *  host's own notification system. Without it, failures are silent. */\n  onError?: (message: string) => void\n  isSaving?: boolean\n}\n\nexport function PhotoCapture({ onSave, onDiscard, onError, isSaving = false }: PhotoCaptureProps) {\n  const camera = useCameraStream({ video: true, audio: false })\n  const videoRef = useRef<HTMLVideoElement>(null)\n  const [capturedBlob, setCapturedBlob] = useState<Blob | null>(null)\n  const [captureError, setCaptureError] = useState<string | null>(null)\n\n  useEffect(() => {\n    void camera.start()\n    // Start the camera once on mount \u2014 camera.start is stable (useCallback\n    // with no deps), so this intentionally doesn't re-run per render.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n\n  useEffect(() => {\n    if (camera.error) onError?.(camera.error)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [camera.error])\n\n  useEffect(() => {\n    const video = videoRef.current\n    if (!video) return\n    video.srcObject = camera.stream\n    if (camera.stream) void video.play().catch(() => {})\n  }, [camera.stream])\n\n  const handleShutter = () => {\n    const video = videoRef.current\n    if (!video) return\n    setCaptureError(null)\n    captureFrameAsBlob(video)\n      .then(setCapturedBlob)\n      .catch((err) => {\n        const message = err instanceof Error ? err.message : 'Failed to capture the photo'\n        setCaptureError(message)\n        onError?.(message)\n      })\n  }\n\n  const handleRetake = () => setCapturedBlob(null)\n\n  const handleSave = () => {\n    if (!capturedBlob) return\n    void onSave(capturedBlob, 'image/png')\n  }\n\n  return (\n    <div className=\"flex h-full flex-col items-center justify-center gap-6 p-8\">\n      {!capturedBlob && (\n        <>\n          <div className=\"w-full max-w-md overflow-hidden rounded-lg bg-muted/30\">\n            <video\n              ref={videoRef}\n              autoPlay\n              muted\n              playsInline\n              className=\"w-full max-h-[60vh] object-contain\"\n              data-testid=\"photo-capture-preview\"\n            />\n          </div>\n          <Button\n            type=\"button\"\n            size=\"lg\"\n            className=\"h-16 w-16 rounded-full p-0\"\n            onClick={handleShutter}\n            disabled={!camera.stream}\n            data-testid=\"photo-capture-shutter-button\"\n          >\n            <Camera className=\"h-6 w-6\" />\n          </Button>\n          <p className=\"text-sm text-muted-foreground\">\n            {camera.isStarting\n              ? 'Starting camera\u2026'\n              : camera.stream\n                ? 'Press to take a photo'\n                : 'Waiting for camera access\u2026'}\n          </p>\n          {captureError && <p className=\"text-sm text-red-text\">{captureError}</p>}\n        </>\n      )}\n\n      {capturedBlob && (\n        <>\n          <div className=\"w-full max-w-md\">\n            <ImageViewer blob={capturedBlob} alt=\"Captured photo\" />\n          </div>\n          <div className=\"flex items-center gap-3\">\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              onClick={onDiscard}\n              disabled={isSaving}\n              data-testid=\"photo-capture-discard-button\"\n            >\n              <Trash2 className=\"mr-1.5 h-4 w-4\" />\n              Discard\n            </Button>\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              onClick={handleRetake}\n              disabled={isSaving}\n              data-testid=\"photo-capture-retake-button\"\n            >\n              <RotateCcw className=\"mr-1.5 h-4 w-4\" />\n              Retake\n            </Button>\n            <Button\n              type=\"button\"\n              onClick={handleSave}\n              disabled={isSaving}\n              data-testid=\"photo-capture-save-button\"\n            >\n              {isSaving ? (\n                <Loader2 className=\"mr-1.5 h-4 w-4 animate-spin\" />\n              ) : (\n                <Check className=\"mr-1.5 h-4 w-4\" />\n              )}\n              {isSaving ? 'Saving\u2026' : 'Save'}\n            </Button>\n          </div>\n        </>\n      )}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/documents/VideoCapture.js

@@ -0,0 +1,129 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+import { Check, Circle, Loader2, RotateCcw, Square, Trash2 } from "lucide-react";
+import { Button } from "../ui/button.js";
+import { VideoViewer } from "../viewers/VideoViewer.js";
+import { useCameraStream } from "./useCameraStream.js";
+import { useVideoRecorder } from "./useVideoRecorder.js";
+import { formatElapsed } from "./format-elapsed.js";
+function VideoCapture({ onSave, onDiscard, onError, isSaving = false }) {
+  const camera = useCameraStream({ video: true, audio: true });
+  const recorder = useVideoRecorder(camera.stream);
+  const videoRef = useRef(null);
+  useEffect(() => {
+    void camera.start();
+  }, []);
+  useEffect(() => {
+    if (camera.error) onError?.(camera.error);
+  }, [camera.error]);
+  useEffect(() => {
+    const video = videoRef.current;
+    if (!video || recorder.state === "stopped") return;
+    video.srcObject = camera.stream;
+    if (camera.stream) void video.play().catch(() => {
+    });
+  }, [camera.stream, recorder.state]);
+  const handleRetake = () => {
+    recorder.reset();
+  };
+  const handleSave = () => {
+    if (!recorder.blob) return;
+    void onSave(recorder.blob, recorder.mimeType);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col items-center justify-center gap-6 p-8", children: [
+    recorder.state !== "stopped" && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "w-full max-w-md overflow-hidden rounded-lg bg-muted/30", children: /* @__PURE__ */ jsx(
+        "video",
+        {
+          ref: videoRef,
+          autoPlay: true,
+          muted: true,
+          playsInline: true,
+          className: "w-full max-h-[60vh] object-contain",
+          "data-testid": "video-capture-preview"
+        }
+      ) }),
+      recorder.state === "recording" && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", "data-testid": "video-capture-rec-indicator", children: [
+        /* @__PURE__ */ jsxs("span", { className: "relative flex h-2 w-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "absolute inline-flex h-full w-full animate-ping rounded-full bg-red-500 opacity-75" }),
+          /* @__PURE__ */ jsx("span", { className: "relative inline-flex h-2 w-2 rounded-full bg-red-500" })
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold uppercase tracking-wide text-red-500", children: "Rec" }),
+        /* @__PURE__ */ jsx("span", { className: "font-mono text-xs tabular-nums text-muted-foreground", children: formatElapsed(recorder.elapsedMs) })
+      ] }),
+      recorder.state === "recording" ? /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          size: "lg",
+          className: "h-16 w-16 rounded-full p-0",
+          onClick: recorder.stop,
+          "data-testid": "video-capture-stop-button",
+          children: /* @__PURE__ */ jsx(Square, { className: "h-5 w-5 fill-current" })
+        }
+      ) : /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          size: "lg",
+          className: "h-16 w-16 rounded-full p-0",
+          onClick: recorder.start,
+          disabled: !camera.stream,
+          "data-testid": "video-capture-record-button",
+          children: /* @__PURE__ */ jsx(Circle, { className: "h-6 w-6 fill-current" })
+        }
+      ),
+      /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: recorder.state === "recording" ? "Tap to stop recording" : camera.isStarting ? "Starting camera\u2026" : camera.stream ? "Tap to start recording" : "Waiting for camera access\u2026" })
+    ] }),
+    recorder.state === "stopped" && recorder.blob && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "w-full max-w-md", children: /* @__PURE__ */ jsx(VideoViewer, { blob: recorder.blob, title: "Captured video" }) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: onDiscard,
+            disabled: isSaving,
+            "data-testid": "video-capture-discard-button",
+            children: [
+              /* @__PURE__ */ jsx(Trash2, { className: "mr-1.5 h-4 w-4" }),
+              "Discard"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: handleRetake,
+            disabled: isSaving,
+            "data-testid": "video-capture-retake-button",
+            children: [
+              /* @__PURE__ */ jsx(RotateCcw, { className: "mr-1.5 h-4 w-4" }),
+              "Record again"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            onClick: handleSave,
+            disabled: isSaving,
+            "data-testid": "video-capture-save-button",
+            children: [
+              isSaving ? /* @__PURE__ */ jsx(Loader2, { className: "mr-1.5 h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx(Check, { className: "mr-1.5 h-4 w-4" }),
+              isSaving ? "Saving\u2026" : "Save"
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+export {
+  VideoCapture
+};
+//# sourceMappingURL=VideoCapture.js.map

package/dist/documents/VideoCapture.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/documents/VideoCapture.tsx"],
+  "sourcesContent": ["/**\n * VideoCapture\n *\n * Camera capture UI: live preview \u2192 tap to record / tap to stop \u2192 review\n * (playback, retake, or save). Shares its shape (onSave/onDiscard/onError/\n * isSaving) with VoiceNoteRecorder and PhotoCapture \u2014 see ViewerCaptureDraft\n * (`@arbidocs/blocks`, connection/viewer/drafts.tsx) for how the three capture\n * modes plug into the same draft/save contract.\n *\n * Deliberately a simple tap-to-start/tap-to-stop toggle rather than a\n * press-and-hold gesture \u2014 matches VoiceNoteRecorder's toggle interaction\n * and needs no extra gesture handling for a first cut of camera video.\n *\n * REUSE-FIRST: no app coupling. This component owns only the capture UI and\n * in-memory blob, never persistence \u2014 nothing is uploaded until the host's\n * `onSave` is called.\n */\n\nimport { useEffect, useRef } from 'react'\nimport { Check, Circle, Loader2, RotateCcw, Square, Trash2 } from 'lucide-react'\nimport { Button } from '../ui/button'\nimport { VideoViewer } from '../viewers/VideoViewer'\nimport { useCameraStream } from './useCameraStream'\nimport { useVideoRecorder } from './useVideoRecorder'\nimport { formatElapsed } from './format-elapsed'\n\nexport interface VideoCaptureProps {\n  /** Called with the recorded clip when the user hits Save. Resolve to let\n   *  the host close/replace this capture UI; shows a saving spinner while\n   *  the promise is pending. */\n  onSave: (blob: Blob, mimeType: string | null) => Promise<void> | void\n  /** Called when the user discards the draft. */\n  onDiscard: () => void\n  /** Surfaces camera failures (e.g. denied permission) \u2014 wire this to the\n   *  host's own notification system. Without it, failures are silent. */\n  onError?: (message: string) => void\n  isSaving?: boolean\n}\n\nexport function VideoCapture({ onSave, onDiscard, onError, isSaving = false }: VideoCaptureProps) {\n  // Camera audio too, not just video \u2014 a silent clip would surprise anyone\n  // used to phone camera video capture.\n  const camera = useCameraStream({ video: true, audio: true })\n  const recorder = useVideoRecorder(camera.stream)\n  const videoRef = useRef<HTMLVideoElement>(null)\n\n  useEffect(() => {\n    void camera.start()\n    // Start the camera once on mount \u2014 see PhotoCapture's identical effect.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n\n  useEffect(() => {\n    if (camera.error) onError?.(camera.error)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [camera.error])\n\n  // Live preview binds to the camera stream while previewing/recording; once\n  // stopped, the video element is replaced by VideoViewer playing the\n  // recorded blob (below), so this effect only matters pre-stop.\n  useEffect(() => {\n    const video = videoRef.current\n    if (!video || recorder.state === 'stopped') return\n    video.srcObject = camera.stream\n    if (camera.stream) void video.play().catch(() => {})\n  }, [camera.stream, recorder.state])\n\n  const handleRetake = () => {\n    recorder.reset()\n  }\n\n  const handleSave = () => {\n    if (!recorder.blob) return\n    void onSave(recorder.blob, recorder.mimeType)\n  }\n\n  return (\n    <div className=\"flex h-full flex-col items-center justify-center gap-6 p-8\">\n      {recorder.state !== 'stopped' && (\n        <>\n          <div className=\"w-full max-w-md overflow-hidden rounded-lg bg-muted/30\">\n            <video\n              ref={videoRef}\n              autoPlay\n              muted\n              playsInline\n              className=\"w-full max-h-[60vh] object-contain\"\n              data-testid=\"video-capture-preview\"\n            />\n          </div>\n          {recorder.state === 'recording' && (\n            <div className=\"flex items-center gap-2\" data-testid=\"video-capture-rec-indicator\">\n              <span className=\"relative flex h-2 w-2\">\n                <span className=\"absolute inline-flex h-full w-full animate-ping rounded-full bg-red-500 opacity-75\" />\n                <span className=\"relative inline-flex h-2 w-2 rounded-full bg-red-500\" />\n              </span>\n              <span className=\"text-xs font-semibold uppercase tracking-wide text-red-500\">\n                Rec\n              </span>\n              <span className=\"font-mono text-xs tabular-nums text-muted-foreground\">\n                {formatElapsed(recorder.elapsedMs)}\n              </span>\n            </div>\n          )}\n          {recorder.state === 'recording' ? (\n            <Button\n              type=\"button\"\n              size=\"lg\"\n              className=\"h-16 w-16 rounded-full p-0\"\n              onClick={recorder.stop}\n              data-testid=\"video-capture-stop-button\"\n            >\n              <Square className=\"h-5 w-5 fill-current\" />\n            </Button>\n          ) : (\n            <Button\n              type=\"button\"\n              size=\"lg\"\n              className=\"h-16 w-16 rounded-full p-0\"\n              onClick={recorder.start}\n              disabled={!camera.stream}\n              data-testid=\"video-capture-record-button\"\n            >\n              <Circle className=\"h-6 w-6 fill-current\" />\n            </Button>\n          )}\n          <p className=\"text-sm text-muted-foreground\">\n            {recorder.state === 'recording'\n              ? 'Tap to stop recording'\n              : camera.isStarting\n                ? 'Starting camera\u2026'\n                : camera.stream\n                  ? 'Tap to start recording'\n                  : 'Waiting for camera access\u2026'}\n          </p>\n        </>\n      )}\n\n      {recorder.state === 'stopped' && recorder.blob && (\n        <>\n          <div className=\"w-full max-w-md\">\n            <VideoViewer blob={recorder.blob} title=\"Captured video\" />\n          </div>\n          <div className=\"flex items-center gap-3\">\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              onClick={onDiscard}\n              disabled={isSaving}\n              data-testid=\"video-capture-discard-button\"\n            >\n              <Trash2 className=\"mr-1.5 h-4 w-4\" />\n              Discard\n            </Button>\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              onClick={handleRetake}\n              disabled={isSaving}\n              data-testid=\"video-capture-retake-button\"\n            >\n              <RotateCcw className=\"mr-1.5 h-4 w-4\" />\n              Record again\n            </Button>\n            <Button\n              type=\"button\"\n              onClick={handleSave}\n              disabled={isSaving}\n              data-testid=\"video-capture-save-button\"\n            >\n              {isSaving ? (\n                <Loader2 className=\"mr-1.5 h-4 w-4 animate-spin\" />\n              ) : (\n                <Check className=\"mr-1.5 h-4 w-4\" />\n              )}\n              {isSaving ? 'Saving\u2026' : 'Save'}\n            </Button>\n          </div>\n        </>\n      )}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/documents/VoiceNoteRecorder.js

@@ -0,0 +1,166 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Mic, Pause, Play, Square, Trash2, Check, Loader2, RotateCcw } from "lucide-react";
+import { Button } from "../ui/button.js";
+import { AudioViewer } from "../viewers/AudioViewer.js";
+import { useAudioRecorder } from "./useAudioRecorder.js";
+import { MicWaveformIndicator } from "./MicWaveformIndicator.js";
+function VoiceNoteRecorder({
+  onSave,
+  onDiscard,
+  onError,
+  title = "Voice Memo",
+  isSaving = false,
+  transcribe
+}) {
+  const recorder = useAudioRecorder();
+  const [transcript, setTranscript] = useState(null);
+  const [isTranscribing, setIsTranscribing] = useState(false);
+  useEffect(() => {
+    if (recorder.error) onError?.(recorder.error);
+  }, [recorder.error]);
+  useEffect(() => {
+    if (recorder.state !== "stopped" || !recorder.blob) {
+      setTranscript(null);
+      setIsTranscribing(false);
+      return;
+    }
+    if (!transcribe) return;
+    let cancelled = false;
+    setIsTranscribing(true);
+    transcribe(recorder.blob).then((text) => {
+      if (!cancelled) setTranscript(text);
+    }).catch(() => {
+    }).finally(() => {
+      if (!cancelled) setIsTranscribing(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [recorder.state, recorder.blob]);
+  const handleSave = () => {
+    if (!recorder.blob) return;
+    void onSave(recorder.blob, recorder.mimeType);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col items-center justify-center gap-6 p-8", children: [
+    recorder.state === "idle" && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          size: "lg",
+          className: "h-16 w-16 rounded-full p-0",
+          onClick: () => void recorder.start(),
+          "data-testid": "voice-note-record-button",
+          children: /* @__PURE__ */ jsx(Mic, { className: "h-6 w-6" })
+        }
+      ),
+      /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Press to start recording" })
+    ] }),
+    (recorder.state === "recording" || recorder.state === "paused") && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        MicWaveformIndicator,
+        {
+          level: recorder.level,
+          elapsedMs: recorder.elapsedMs,
+          paused: recorder.state === "paused"
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        recorder.state === "recording" ? /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: recorder.pause,
+            "data-testid": "voice-note-pause-button",
+            children: [
+              /* @__PURE__ */ jsx(Pause, { className: "mr-1.5 h-4 w-4" }),
+              "Pause"
+            ]
+          }
+        ) : /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: recorder.resume,
+            "data-testid": "voice-note-resume-button",
+            children: [
+              /* @__PURE__ */ jsx(Play, { className: "mr-1.5 h-4 w-4" }),
+              "Resume"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(Button, { type: "button", onClick: recorder.stop, "data-testid": "voice-note-stop-button", children: [
+          /* @__PURE__ */ jsx(Square, { className: "mr-1.5 h-3.5 w-3.5 fill-current" }),
+          "Stop"
+        ] })
+      ] })
+    ] }),
+    recorder.state === "stopped" && recorder.blob && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: "w-full max-w-md", children: /* @__PURE__ */ jsx(AudioViewer, { blob: recorder.blob, title }) }),
+      (isTranscribing || transcript) && /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "w-full max-w-md rounded-md border border-border bg-muted/30 p-3 text-sm text-muted-foreground",
+          "data-testid": "voice-note-rough-transcript",
+          children: isTranscribing ? /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5", children: [
+            /* @__PURE__ */ jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin" }),
+            "Transcribing\u2026"
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("p", { className: "mb-1 text-xs font-semibold uppercase tracking-wide", children: "Rough transcript" }),
+            /* @__PURE__ */ jsx("p", { children: transcript })
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: onDiscard,
+            disabled: isSaving,
+            "data-testid": "voice-note-discard-button",
+            children: [
+              /* @__PURE__ */ jsx(Trash2, { className: "mr-1.5 h-4 w-4" }),
+              "Discard"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: recorder.reset,
+            disabled: isSaving,
+            "data-testid": "voice-note-record-again-button",
+            children: [
+              /* @__PURE__ */ jsx(RotateCcw, { className: "mr-1.5 h-4 w-4" }),
+              "Record again"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            onClick: handleSave,
+            disabled: isSaving,
+            "data-testid": "voice-note-save-button",
+            children: [
+              isSaving ? /* @__PURE__ */ jsx(Loader2, { className: "mr-1.5 h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx(Check, { className: "mr-1.5 h-4 w-4" }),
+              isSaving ? "Saving\u2026" : "Save"
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+export {
+  VoiceNoteRecorder
+};
+//# sourceMappingURL=VoiceNoteRecorder.js.map

package/dist/documents/VoiceNoteRecorder.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/documents/VoiceNoteRecorder.tsx"],
+  "sourcesContent": ["/**\n * VoiceNoteRecorder\n *\n * A toggle-style recorder (press to start, pause/resume, stop, review, then\n * save or discard) as opposed to a press-and-hold mic. Shares its\n * capture/metering engine (useAudioRecorder) and its REC-badge/timer/waveform\n * visual (MicWaveformIndicator) with any other recorder a host app builds.\n *\n * REUSE-FIRST: no app coupling. The host supplies `onSave`/`onDiscard` (and\n * optionally `onError`) \u2014 this component owns only the recording UI and\n * in-memory blob, never persistence. Nothing is uploaded until the host's\n * `onSave` is called and resolves.\n */\n\nimport { useEffect, useState } from 'react'\nimport { Mic, Pause, Play, Square, Trash2, Check, Loader2, RotateCcw } from 'lucide-react'\nimport { Button } from '../ui/button'\nimport { AudioViewer } from '../viewers/AudioViewer'\nimport { useAudioRecorder } from './useAudioRecorder'\nimport { MicWaveformIndicator } from './MicWaveformIndicator'\n\nexport interface VoiceNoteRecorderProps {\n  /** Called with the reviewed recording when the user hits Save. Resolve to\n   *  let the host close/replace this recorder; the recorder shows a saving\n   *  spinner while the promise is pending. */\n  onSave: (blob: Blob, mimeType: string | null) => Promise<void> | void\n  /** Called when the user discards the draft. */\n  onDiscard: () => void\n  /** Surfaces recorder failures (e.g. denied mic permission) \u2014 wire this to\n   *  the host's own notification system. Without it, failures are silent. */\n  onError?: (message: string) => void\n  /** Title passed through to the playback preview. */\n  title?: string\n  /** External saving state, e.g. while the host's onSave promise is\n   *  pending \u2014 disables actions and shows a spinner on Save. */\n  isSaving?: boolean\n  /**\n   * Optional: called once with the finished recording as soon as it stops,\n   * to produce a quick rough transcript shown inline during review. Purely\n   * client-side and ephemeral \u2014 it's never uploaded and has no bearing on\n   * what onSave receives; a host with real (e.g. diarized) transcription as\n   * part of its normal document processing can skip this prop entirely.\n   */\n  transcribe?: (blob: Blob) => Promise<string>\n}\n\nexport function VoiceNoteRecorder({\n  onSave,\n  onDiscard,\n  onError,\n  title = 'Voice Memo',\n  isSaving = false,\n  transcribe,\n}: VoiceNoteRecorderProps) {\n  const recorder = useAudioRecorder()\n  const [transcript, setTranscript] = useState<string | null>(null)\n  const [isTranscribing, setIsTranscribing] = useState(false)\n\n  useEffect(() => {\n    if (recorder.error) onError?.(recorder.error)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [recorder.error])\n\n  // Kick off the rough transcript the moment a recording is ready to review,\n  // so it's usually done by the time the user has looked at the playback\n  // controls. Reset on any state other than 'stopped' (re-record, discard)\n  // so a stale transcript from a previous take never lingers.\n  useEffect(() => {\n    if (recorder.state !== 'stopped' || !recorder.blob) {\n      setTranscript(null)\n      setIsTranscribing(false)\n      return\n    }\n    if (!transcribe) return\n    let cancelled = false\n    setIsTranscribing(true)\n    transcribe(recorder.blob)\n      .then((text) => {\n        if (!cancelled) setTranscript(text)\n      })\n      .catch(() => {\n        // Best-effort: a failed rough transcript just means the review UI\n        // shows nothing extra \u2014 the real transcript still arrives later.\n      })\n      .finally(() => {\n        if (!cancelled) setIsTranscribing(false)\n      })\n    return () => {\n      cancelled = true\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [recorder.state, recorder.blob])\n\n  const handleSave = () => {\n    if (!recorder.blob) return\n    void onSave(recorder.blob, recorder.mimeType)\n  }\n\n  return (\n    <div className=\"flex h-full flex-col items-center justify-center gap-6 p-8\">\n      {recorder.state === 'idle' && (\n        <>\n          <Button\n            type=\"button\"\n            size=\"lg\"\n            className=\"h-16 w-16 rounded-full p-0\"\n            onClick={() => void recorder.start()}\n            data-testid=\"voice-note-record-button\"\n          >\n            <Mic className=\"h-6 w-6\" />\n          </Button>\n          <p className=\"text-sm text-muted-foreground\">Press to start recording</p>\n        </>\n      )}\n\n      {(recorder.state === 'recording' || recorder.state === 'paused') && (\n        <>\n          <MicWaveformIndicator\n            level={recorder.level}\n            elapsedMs={recorder.elapsedMs}\n            paused={recorder.state === 'paused'}\n          />\n          <div className=\"flex items-center gap-3\">\n            {recorder.state === 'recording' ? (\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                onClick={recorder.pause}\n                data-testid=\"voice-note-pause-button\"\n              >\n                <Pause className=\"mr-1.5 h-4 w-4\" />\n                Pause\n              </Button>\n            ) : (\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                onClick={recorder.resume}\n                data-testid=\"voice-note-resume-button\"\n              >\n                <Play className=\"mr-1.5 h-4 w-4\" />\n                Resume\n              </Button>\n            )}\n            <Button type=\"button\" onClick={recorder.stop} data-testid=\"voice-note-stop-button\">\n              <Square className=\"mr-1.5 h-3.5 w-3.5 fill-current\" />\n              Stop\n            </Button>\n          </div>\n        </>\n      )}\n\n      {recorder.state === 'stopped' && recorder.blob && (\n        <>\n          <div className=\"w-full max-w-md\">\n            <AudioViewer blob={recorder.blob} title={title} />\n          </div>\n          {(isTranscribing || transcript) && (\n            <div\n              className=\"w-full max-w-md rounded-md border border-border bg-muted/30 p-3 text-sm text-muted-foreground\"\n              data-testid=\"voice-note-rough-transcript\"\n            >\n              {isTranscribing ? (\n                <span className=\"flex items-center gap-1.5\">\n                  <Loader2 className=\"h-3.5 w-3.5 animate-spin\" />\n                  Transcribing\u2026\n                </span>\n              ) : (\n                <>\n                  <p className=\"mb-1 text-xs font-semibold uppercase tracking-wide\">\n                    Rough transcript\n                  </p>\n                  <p>{transcript}</p>\n                </>\n              )}\n            </div>\n          )}\n          <div className=\"flex items-center gap-3\">\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              onClick={onDiscard}\n              disabled={isSaving}\n              data-testid=\"voice-note-discard-button\"\n            >\n              <Trash2 className=\"mr-1.5 h-4 w-4\" />\n              Discard\n            </Button>\n            <Button\n              type=\"button\"\n              variant=\"outline\"\n              onClick={recorder.reset}\n              disabled={isSaving}\n              data-testid=\"voice-note-record-again-button\"\n            >\n              <RotateCcw className=\"mr-1.5 h-4 w-4\" />\n              Record again\n            </Button>\n            <Button\n              type=\"button\"\n              onClick={handleSave}\n              disabled={isSaving}\n              data-testid=\"voice-note-save-button\"\n            >\n              {isSaving ? (\n                <Loader2 className=\"mr-1.5 h-4 w-4 animate-spin\" />\n              ) : (\n                <Check className=\"mr-1.5 h-4 w-4\" />\n              )}\n              {isSaving ? 'Saving\u2026' : 'Save'}\n            </Button>\n          </div>\n        </>\n      )}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/documents/audio-segmenter.js

@@ -0,0 +1,63 @@
+const DEFAULT_SEGMENTER_CONFIG = {
+  voiceThreshold: 0.3,
+  silenceMs: 700,
+  maxMs: 1e4,
+  minVoiceMs: 600
+};
+const INITIAL_SEGMENTER_STATE = { phase: "idle" };
+function levelFromRms(rms) {
+  return Math.sqrt(Math.min(1, rms * 8));
+}
+function end(state, at, reason, config) {
+  return {
+    type: "end",
+    at,
+    startedAt: state.startedAt,
+    voiceMs: state.voiceMs,
+    keep: state.voiceMs >= config.minVoiceMs,
+    reason
+  };
+}
+function stepSegmenter(state, level, t, config = DEFAULT_SEGMENTER_CONFIG) {
+  const voice = level >= config.voiceThreshold;
+  if (state.phase === "idle") {
+    if (!voice) return { state, events: [] };
+    return {
+      state: { phase: "voice", startedAt: t, lastVoiceAt: t, lastSampleAt: t, voiceMs: 0 },
+      events: [{ type: "start", at: t }]
+    };
+  }
+  const dt = Math.max(0, t - state.lastSampleAt);
+  const next = {
+    ...state,
+    lastSampleAt: t,
+    lastVoiceAt: voice ? t : state.lastVoiceAt,
+    voiceMs: state.voiceMs + (voice ? dt : 0)
+  };
+  if (t - next.startedAt >= config.maxMs) {
+    const events = [end(next, t, "max", config)];
+    if (!voice) return { state: { phase: "idle" }, events };
+    events.push({ type: "start", at: t });
+    return {
+      state: { phase: "voice", startedAt: t, lastVoiceAt: t, lastSampleAt: t, voiceMs: 0 },
+      events
+    };
+  }
+  const silence = config.silenceMs + (next.voiceMs < config.minVoiceMs ? config.holdShortMs ?? 0 : 0);
+  if (!voice && t - next.lastVoiceAt >= silence) {
+    return { state: { phase: "idle" }, events: [end(next, t, "silence", config)] };
+  }
+  return { state: next, events: [] };
+}
+function flushSegmenter(state, t, config = DEFAULT_SEGMENTER_CONFIG) {
+  if (state.phase === "idle") return { state, events: [] };
+  return { state: { phase: "idle" }, events: [end(state, t, "flush", config)] };
+}
+export {
+  DEFAULT_SEGMENTER_CONFIG,
+  INITIAL_SEGMENTER_STATE,
+  flushSegmenter,
+  levelFromRms,
+  stepSegmenter
+};
+//# sourceMappingURL=audio-segmenter.js.map

package/dist/documents/audio-segmenter.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/documents/audio-segmenter.ts"],
+  "sourcesContent": ["/**\n * audio-segmenter \u2014 the voice-activity state machine behind `useAudioRecorder`'s\n * segmenting mode. Pure: fed one (level, time) sample per meter tick, it says\n * when a speech segment starts and when it ends, and whether the segment held\n * enough voice to be worth keeping. The hook owns the MediaRecorders; this\n * owns only the decisions, so it is unit-testable with synthetic levels.\n *\n * A segment starts on the first sample at or above `voiceThreshold`, ends after\n * `silenceMs` without voice or at `maxMs` (a cut while still speaking starts the\n * next segment on the same sample), and is dropped when it held less than\n * `minVoiceMs` of voice \u2014 a cough, a click, a door.\n */\n\nexport interface SegmenterConfig {\n  /** Meter level (0-1, as `useAudioRecorder` reports it) that counts as voice. */\n  voiceThreshold: number\n  /** Silence that ends a segment. */\n  silenceMs: number\n  /** Longest segment; a longer utterance is cut into several. */\n  maxMs: number\n  /** Segments with less voice than this are dropped. */\n  minVoiceMs: number\n  /**\n   * Extra silence a segment that is still too short waits for more voice before it ends (0 = none).\n   * A short word and a short phrase a pause apart \u2014 \"Perfect.\" \u2026 \"Thank you both.\" \u2014 then make one\n   * segment instead of two dropped ones.\n   */\n  holdShortMs?: number\n}\n\nexport const DEFAULT_SEGMENTER_CONFIG: SegmenterConfig = {\n  voiceThreshold: 0.3,\n  silenceMs: 700,\n  maxMs: 10_000,\n  minVoiceMs: 600,\n}\n\nexport type SegmenterState =\n  | { phase: 'idle' }\n  | {\n      phase: 'voice'\n      /** When the segment started (the clock of the samples). */\n      startedAt: number\n      /** The last sample that carried voice. */\n      lastVoiceAt: number\n      /** The previous sample, to integrate voice time between samples. */\n      lastSampleAt: number\n      /** Voice accumulated so far. */\n      voiceMs: number\n    }\n\nexport type SegmenterEvent =\n  | { type: 'start'; at: number }\n  | {\n      type: 'end'\n      at: number\n      startedAt: number\n      voiceMs: number\n      /** False when the segment held too little voice: discard it. */\n      keep: boolean\n      reason: 'silence' | 'max' | 'flush'\n    }\n\nexport const INITIAL_SEGMENTER_STATE: SegmenterState = { phase: 'idle' }\n\n/**\n * The meter level (0-1) of an RMS amplitude, as the segmenter's thresholds expect it. Normal\n * speech RMS is tiny (a laptop mic at conversational distance rarely exceeds ~0.1), so it is\n * boosted, then a sqrt (perceptual) curve makes quiet-to-moderate speech clearly visible.\n */\nexport function levelFromRms(rms: number): number {\n  return Math.sqrt(Math.min(1, rms * 8))\n}\n\nfunction end(\n  state: Extract<SegmenterState, { phase: 'voice' }>,\n  at: number,\n  reason: 'silence' | 'max' | 'flush',\n  config: SegmenterConfig\n): SegmenterEvent {\n  return {\n    type: 'end',\n    at,\n    startedAt: state.startedAt,\n    voiceMs: state.voiceMs,\n    keep: state.voiceMs >= config.minVoiceMs,\n    reason,\n  }\n}\n\n/** Feed one meter sample. Returns the next state and what happened (0-2 events). */\nexport function stepSegmenter(\n  state: SegmenterState,\n  level: number,\n  t: number,\n  config: SegmenterConfig = DEFAULT_SEGMENTER_CONFIG\n): { state: SegmenterState; events: SegmenterEvent[] } {\n  const voice = level >= config.voiceThreshold\n  if (state.phase === 'idle') {\n    if (!voice) return { state, events: [] }\n    return {\n      state: { phase: 'voice', startedAt: t, lastVoiceAt: t, lastSampleAt: t, voiceMs: 0 },\n      events: [{ type: 'start', at: t }],\n    }\n  }\n  const dt = Math.max(0, t - state.lastSampleAt)\n  const next = {\n    ...state,\n    lastSampleAt: t,\n    lastVoiceAt: voice ? t : state.lastVoiceAt,\n    voiceMs: state.voiceMs + (voice ? dt : 0),\n  }\n  if (t - next.startedAt >= config.maxMs) {\n    const events: SegmenterEvent[] = [end(next, t, 'max', config)]\n    if (!voice) return { state: { phase: 'idle' }, events }\n    events.push({ type: 'start', at: t })\n    return {\n      state: { phase: 'voice', startedAt: t, lastVoiceAt: t, lastSampleAt: t, voiceMs: 0 },\n      events,\n    }\n  }\n  const silence =\n    config.silenceMs + (next.voiceMs < config.minVoiceMs ? (config.holdShortMs ?? 0) : 0)\n  if (!voice && t - next.lastVoiceAt >= silence) {\n    return { state: { phase: 'idle' }, events: [end(next, t, 'silence', config)] }\n  }\n  return { state: next, events: [] }\n}\n\n/** Close the open segment, if any (recording stopped). */\nexport function flushSegmenter(\n  state: SegmenterState,\n  t: number,\n  config: SegmenterConfig = DEFAULT_SEGMENTER_CONFIG\n): { state: SegmenterState; events: SegmenterEvent[] } {\n  if (state.phase === 'idle') return { state, events: [] }\n  return { state: { phase: 'idle' }, events: [end(state, t, 'flush', config)] }\n}\n"],
+  "mappings": "AA8BO,MAAM,2BAA4C;AAAA,EACvD,gBAAgB;AAAA,EAChB,WAAW;AAAA,EACX,OAAO;AAAA,EACP,YAAY;AACd;AA4BO,MAAM,0BAA0C,EAAE,OAAO,OAAO;AAOhE,SAAS,aAAa,KAAqB;AAChD,SAAO,KAAK,KAAK,KAAK,IAAI,GAAG,MAAM,CAAC,CAAC;AACvC;AAEA,SAAS,IACP,OACA,IACA,QACA,QACgB;AAChB,SAAO;AAAA,IACL,MAAM;AAAA,IACN;AAAA,IACA,WAAW,MAAM;AAAA,IACjB,SAAS,MAAM;AAAA,IACf,MAAM,MAAM,WAAW,OAAO;AAAA,IAC9B;AAAA,EACF;AACF;AAGO,SAAS,cACd,OACA,OACA,GACA,SAA0B,0BAC2B;AACrD,QAAM,QAAQ,SAAS,OAAO;AAC9B,MAAI,MAAM,UAAU,QAAQ;AAC1B,QAAI,CAAC,MAAO,QAAO,EAAE,OAAO,QAAQ,CAAC,EAAE;AACvC,WAAO;AAAA,MACL,OAAO,EAAE,OAAO,SAAS,WAAW,GAAG,aAAa,GAAG,cAAc,GAAG,SAAS,EAAE;AAAA,MACnF,QAAQ,CAAC,EAAE,MAAM,SAAS,IAAI,EAAE,CAAC;AAAA,IACnC;AAAA,EACF;AACA,QAAM,KAAK,KAAK,IAAI,GAAG,IAAI,MAAM,YAAY;AAC7C,QAAM,OAAO;AAAA,IACX,GAAG;AAAA,IACH,cAAc;AAAA,IACd,aAAa,QAAQ,IAAI,MAAM;AAAA,IAC/B,SAAS,MAAM,WAAW,QAAQ,KAAK;AAAA,EACzC;AACA,MAAI,IAAI,KAAK,aAAa,OAAO,OAAO;AACtC,UAAM,SAA2B,CAAC,IAAI,MAAM,GAAG,OAAO,MAAM,CAAC;AAC7D,QAAI,CAAC,MAAO,QAAO,EAAE,OAAO,EAAE,OAAO,OAAO,GAAG,OAAO;AACtD,WAAO,KAAK,EAAE,MAAM,SAAS,IAAI,EAAE,CAAC;AACpC,WAAO;AAAA,MACL,OAAO,EAAE,OAAO,SAAS,WAAW,GAAG,aAAa,GAAG,cAAc,GAAG,SAAS,EAAE;AAAA,MACnF;AAAA,IACF;AAAA,EACF;AACA,QAAM,UACJ,OAAO,aAAa,KAAK,UAAU,OAAO,aAAc,OAAO,eAAe,IAAK;AACrF,MAAI,CAAC,SAAS,IAAI,KAAK,eAAe,SAAS;AAC7C,WAAO,EAAE,OAAO,EAAE,OAAO,OAAO,GAAG,QAAQ,CAAC,IAAI,MAAM,GAAG,WAAW,MAAM,CAAC,EAAE;AAAA,EAC/E;AACA,SAAO,EAAE,OAAO,MAAM,QAAQ,CAAC,EAAE;AACnC;AAGO,SAAS,eACd,OACA,GACA,SAA0B,0BAC2B;AACrD,MAAI,MAAM,UAAU,OAAQ,QAAO,EAAE,OAAO,QAAQ,CAAC,EAAE;AACvD,SAAO,EAAE,OAAO,EAAE,OAAO,OAAO,GAAG,QAAQ,CAAC,IAAI,OAAO,GAAG,SAAS,MAAM,CAAC,EAAE;AAC9E;",
+  "names": []
+}

package/dist/documents/capture-frame.js

@@ -0,0 +1,21 @@
+function captureFrameAsBlob(video, mimeType = "image/png") {
+  return new Promise((resolve, reject) => {
+    const canvas = document.createElement("canvas");
+    canvas.width = video.videoWidth;
+    canvas.height = video.videoHeight;
+    const ctx = canvas.getContext("2d");
+    if (!ctx) {
+      reject(new Error("Canvas 2D context is not available"));
+      return;
+    }
+    ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
+    canvas.toBlob((blob) => {
+      if (blob) resolve(blob);
+      else reject(new Error("Failed to capture the photo"));
+    }, mimeType);
+  });
+}
+export {
+  captureFrameAsBlob
+};
+//# sourceMappingURL=capture-frame.js.map

package/dist/documents/capture-frame.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/documents/capture-frame.ts"],
+  "sourcesContent": ["/**\n * Captures the current frame of a live `<video>` element (bound to a camera\n * `MediaStream`, e.g. via useCameraStream) as an image Blob \u2014 the shutter\n * action for photo capture. Draws to an off-screen canvas rather than reading\n * pixels any other way, since `HTMLCanvasElement.toBlob` is the one\n * cross-browser path from \"a decoded video frame\" to \"an encoded image file\".\n */\nexport function captureFrameAsBlob(video: HTMLVideoElement, mimeType = 'image/png'): Promise<Blob> {\n  return new Promise((resolve, reject) => {\n    const canvas = document.createElement('canvas')\n    canvas.width = video.videoWidth\n    canvas.height = video.videoHeight\n    const ctx = canvas.getContext('2d')\n    if (!ctx) {\n      reject(new Error('Canvas 2D context is not available'))\n      return\n    }\n    ctx.drawImage(video, 0, 0, canvas.width, canvas.height)\n    canvas.toBlob((blob) => {\n      if (blob) resolve(blob)\n      else reject(new Error('Failed to capture the photo'))\n    }, mimeType)\n  })\n}\n"],
+  "mappings": "AAOO,SAAS,mBAAmB,OAAyB,WAAW,aAA4B;AACjG,SAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AACtC,UAAM,SAAS,SAAS,cAAc,QAAQ;AAC9C,WAAO,QAAQ,MAAM;AACrB,WAAO,SAAS,MAAM;AACtB,UAAM,MAAM,OAAO,WAAW,IAAI;AAClC,QAAI,CAAC,KAAK;AACR,aAAO,IAAI,MAAM,oCAAoC,CAAC;AACtD;AAAA,IACF;AACA,QAAI,UAAU,OAAO,GAAG,GAAG,OAAO,OAAO,OAAO,MAAM;AACtD,WAAO,OAAO,CAAC,SAAS;AACtB,UAAI,KAAM,SAAQ,IAAI;AAAA,UACjB,QAAO,IAAI,MAAM,6BAA6B,CAAC;AAAA,IACtD,GAAG,QAAQ;AAAA,EACb,CAAC;AACH;",
+  "names": []
+}