@arbidocs/react 0.3.173 → 0.3.175

package/dist/index.js

@@ -1,13 +1,13 @@
-import { useArbi, ArbiProvider, AudioViewer } from './chunk-Q6XAXIT3.js';
-export { ArbiProvider, useArbi } from './chunk-Q6XAXIT3.js';
-import { cn, Avatar, AvatarFallback, AvatarImage, Tooltip, TooltipTrigger, TooltipContent, Popover, PopoverTrigger, PopoverContent, AiMarkdown, Card, Button, Badge, MarkdownRenderer, Input, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, ScrollArea, DropdownMenuItem, Textarea, Slider, Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, DropdownMenuLabel, DropdownMenuSeparator, Checkbox } from './chunk-PAJGQHFM.js';
-export { AiMarkdown, Avatar, AvatarFallback, AvatarImage, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, HoverCard, HoverCardContent, HoverCardTrigger, Input, Label, MarkdownRenderer, MarkdownStreamingContext, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cardVariants, cn, markdownBaseComponents, splitMarkdownBlocks, toggleVariants } from './chunk-PAJGQHFM.js';
+import { cn, Avatar, AvatarFallback, AvatarImage, Tooltip, TooltipTrigger, TooltipContent, Popover, PopoverTrigger, PopoverContent, AiMarkdown, Card, Button, Badge, MarkdownRenderer, Input, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, ScrollArea, DropdownMenuItem, Textarea, Slider, Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, DropdownMenuLabel, DropdownMenuSeparator, Checkbox, useAudioRecorder, MicWaveformIndicator, IconToggle, classifyMediaError, formatElapsed } from './chunk-I256BUCX.js';
+export { AiMarkdown, Avatar, AvatarFallback, AvatarImage, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DictateProvider, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, HoverCard, HoverCardContent, HoverCardTrigger, IconToggle, InlineMicButton, Input, Label, MarkdownRenderer, MarkdownStreamingContext, MicRecordingOverlay, MicWaveformIndicator, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cardVariants, cn, formatElapsed, markdownBaseComponents, splitMarkdownBlocks, toggleVariants, useAudioRecorder } from './chunk-I256BUCX.js';
+import { useArbi, ArbiProvider, AudioViewer, ImageViewer, VideoViewer } from './chunk-JKO3NR5L.js';
+export { ArbiProvider, useArbi } from './chunk-JKO3NR5L.js';
 import React2, { memo, useState, createContext, forwardRef, useMemo, useCallback, useId, useRef, useContext, useEffect, Fragment as Fragment$1 } from 'react';
 import { useQuery, useMutation, useQueries, QueryClient, QueryClientProvider, useQueryClient } from '@tanstack/react-query';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { connectWithReconnect, resolveCitations, summarizeCitations } from '@arbidocs/sdk/browser';
 export { Arbi, ArbiError } from '@arbidocs/sdk/browser';
-import { Link, Trash2, CheckCheck, Check, MessageCircleMore, MoreVertical, MessageSquareLock, Info, FileQuestion, BookOpen, Upload, LogOut, LayoutGrid, Bell, MessageSquare, CircleUserRound, Wrench, CreditCard, ClipboardList, UserPlus, UserStar, Settings2, Users, User, NotebookPen, NotebookText, StickyNote, FolderPlus, Hash, EyeOff, Eye, CaptionsOff, FolderOpen, MessageSquareMore, MessageSquarePlus, MessageSquareText, MessageSquareOff, MessagesSquare, Columns3Cog, SquarePlus, SquareM, ChevronsDown, Bot, Calendar, Search, Folder, List, SquareCheckBig, Loader2, AlertTriangle, ShieldCheck, Copy, Sparkles, FileText, GitCompareArrows, Download, Image as Image$1, CornerDownLeft, X, ArrowLeft, Send, Tags, Crown, Activity, Gauge, Gift, PartyPopper, UserCheck, FileX2, FileCheck2, Pencil, SquareArrowOutUpRight, BellOff, XCircle, CheckCircle2, ArrowRight, ChevronDown, MoreHorizontal, SquarePen, Mic, Pause, Play, Square, RotateCcw, FileX, SkipForward, CheckCircle } from 'lucide-react';
+import { Link, Trash2, CheckCheck, Check, MessageCircleMore, MoreVertical, MessageSquareLock, Info, FileQuestion, BookOpen, Upload, LogOut, LayoutGrid, Bell, MessageSquare, CircleUserRound, Wrench, CreditCard, ClipboardList, UserPlus, UserStar, Settings2, Users, User, NotebookPen, NotebookText, StickyNote, FolderPlus, Hash, EyeOff, Eye, CaptionsOff, FolderOpen, MessageSquareMore, MessageSquarePlus, MessageSquareText, MessageSquareOff, MessagesSquare, Columns3Cog, SquarePlus, SquareM, ChevronsDown, Bot, Calendar, Search, Folder, List, SquareCheckBig, Loader2, AlertTriangle, ShieldCheck, Copy, Sparkles, FileText, GitCompareArrows, Download, Image as Image$1, CornerDownLeft, X, ArrowLeft, Send, Tags, Crown, Activity, Gauge, Gift, PartyPopper, UserCheck, FileX2, FileCheck2, Pencil, SquareArrowOutUpRight, BellOff, XCircle, CheckCircle2, ArrowRight, ChevronDown, MoreHorizontal, SquarePen, Mic, Pause, Play, Square, RotateCcw, Camera, Circle, FileX, SkipForward, CheckCircle } from 'lucide-react';
 import { isMessageType } from '@arbidocs/client';
 export { isMessageType } from '@arbidocs/client';
 import { create } from 'zustand';
@@ -7160,227 +7160,11 @@ function DocumentGallery({
     }
   );
 }
-var LEVEL_UPDATE_INTERVAL_MS = 50;
-function classifyMicError(err) {
-  const name = err instanceof DOMException ? err.name : void 0;
-  if (name === "NotAllowedError" || name === "SecurityError") {
-    return "Microphone access is blocked. Allow microphone permission in your browser settings to use voice input.";
-  }
-  if (name === "NotFoundError" || name === "DevicesNotFoundError") {
-    return "No microphone found on this device.";
-  }
-  if (!navigator.mediaDevices?.getUserMedia) {
-    return "Voice input is not supported in this browser.";
-  }
-  return "Could not start recording. Please try again.";
-}
-function useAudioRecorder() {
-  const [state, setState] = useState("idle");
-  const [level, setLevel] = useState(0);
-  const [elapsedMs, setElapsedMs] = useState(0);
-  const [blob, setBlob] = useState(null);
-  const [mimeType, setMimeType] = useState(null);
-  const [error, setError] = useState(null);
-  const mediaRecorderRef = useRef(null);
-  const chunksRef = useRef([]);
-  const streamRef = useRef(null);
-  const stateRef = useRef("idle");
-  stateRef.current = state;
-  const segmentStartRef = useRef(0);
-  const accumulatedMsRef = useRef(0);
-  const audioContextRef = useRef(null);
-  const analyserRef = useRef(null);
-  const levelRafRef = useRef(null);
-  const stopMeter = useCallback(() => {
-    if (levelRafRef.current !== null) cancelAnimationFrame(levelRafRef.current);
-    levelRafRef.current = null;
-    analyserRef.current = null;
-    void audioContextRef.current?.close().catch(() => {
-    });
-    audioContextRef.current = null;
-  }, []);
-  const startMeter = useCallback((stream) => {
-    const audioContext = new AudioContext();
-    const source = audioContext.createMediaStreamSource(stream);
-    const analyser = audioContext.createAnalyser();
-    analyser.fftSize = 256;
-    source.connect(analyser);
-    audioContextRef.current = audioContext;
-    analyserRef.current = analyser;
-    const data = new Uint8Array(analyser.frequencyBinCount);
-    let lastUpdate = 0;
-    const tick = (t) => {
-      const active = analyserRef.current;
-      if (!active) return;
-      if (t - lastUpdate >= LEVEL_UPDATE_INTERVAL_MS) {
-        lastUpdate = t;
-        active.getByteTimeDomainData(data);
-        let sumSquares = 0;
-        for (let i = 0; i < data.length; i++) {
-          const centered = (data[i] - 128) / 128;
-          sumSquares += centered * centered;
-        }
-        const rms = Math.sqrt(sumSquares / data.length);
-        setLevel(Math.sqrt(Math.min(1, rms * 8)));
-        setElapsedMs(accumulatedMsRef.current + (t - segmentStartRef.current));
-      }
-      levelRafRef.current = requestAnimationFrame(tick);
-    };
-    levelRafRef.current = requestAnimationFrame(tick);
-  }, []);
-  const stopTracks = useCallback(() => {
-    streamRef.current?.getTracks().forEach((t) => t.stop());
-    streamRef.current = null;
-  }, []);
-  useEffect(
-    () => () => {
-      stopTracks();
-      stopMeter();
-    },
-    [stopTracks, stopMeter]
-  );
-  const start = useCallback(async () => {
-    if (stateRef.current === "recording" || stateRef.current === "paused") return;
-    setError(null);
-    try {
-      const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
-      streamRef.current = stream;
-      const mt = MediaRecorder.isTypeSupported("audio/webm") ? "audio/webm" : "audio/mp4";
-      const recorder = new MediaRecorder(stream, { mimeType: mt });
-      chunksRef.current = [];
-      recorder.ondataavailable = (e) => {
-        if (e.data.size > 0) chunksRef.current.push(e.data);
-      };
-      mediaRecorderRef.current = recorder;
-      setMimeType(mt);
-      setBlob(null);
-      accumulatedMsRef.current = 0;
-      segmentStartRef.current = performance.now();
-      recorder.start();
-      setState("recording");
-      startMeter(stream);
-    } catch (err) {
-      stopTracks();
-      setError(classifyMicError(err));
-    }
-  }, [startMeter, stopTracks]);
-  const pause = useCallback(() => {
-    const recorder = mediaRecorderRef.current;
-    if (!recorder || recorder.state !== "recording") return;
-    recorder.pause();
-    accumulatedMsRef.current += performance.now() - segmentStartRef.current;
-    stopMeter();
-    setLevel(0);
-    setState("paused");
-  }, [stopMeter]);
-  const resume = useCallback(() => {
-    const recorder = mediaRecorderRef.current;
-    if (!recorder || recorder.state !== "paused") return;
-    recorder.resume();
-    segmentStartRef.current = performance.now();
-    setState("recording");
-    if (streamRef.current) startMeter(streamRef.current);
-  }, [startMeter]);
-  const stop = useCallback(() => {
-    const recorder = mediaRecorderRef.current;
-    if (!recorder || recorder.state === "inactive") return;
-    const finalElapsed = recorder.state === "paused" ? accumulatedMsRef.current : accumulatedMsRef.current + (performance.now() - segmentStartRef.current);
-    stopMeter();
-    recorder.onstop = () => {
-      stopTracks();
-      const finalBlob = chunksRef.current.length ? new Blob(chunksRef.current, { type: recorder.mimeType }) : null;
-      setBlob(finalBlob);
-      setElapsedMs(finalElapsed);
-      setLevel(0);
-      setState("stopped");
-    };
-    recorder.stop();
-  }, [stopMeter, stopTracks]);
-  const reset = useCallback(() => {
-    setState("idle");
-    setBlob(null);
-    setElapsedMs(0);
-    setLevel(0);
-    setMimeType(null);
-    setError(null);
-  }, []);
-  return { state, level, elapsedMs, blob, mimeType, error, start, pause, resume, stop, reset };
-}
-
-// src/documents/format-elapsed.ts
-function formatElapsed(ms) {
-  const totalSeconds = Math.max(0, Math.floor(ms / 1e3));
-  const minutes = Math.floor(totalSeconds / 60);
-  const seconds = totalSeconds % 60;
-  return `${String(minutes).padStart(2, "0")}:${String(seconds).padStart(2, "0")}`;
-}
-var BAR_WEIGHTS = [
-  0.25,
-  0.32,
-  0.48,
-  0.62,
-  0.82,
-  0.56,
-  0.92,
-  0.72,
-  1,
-  0.86,
-  0.62,
-  0.96,
-  0.76,
-  0.5,
-  0.84,
-  0.66,
-  0.42,
-  0.56,
-  0.36,
-  0.28,
-  0.22
-];
-var MIN_BAR_PX = 3;
-var MAX_BAR_PX = 40;
-function MicWaveformIndicator({
-  level,
-  elapsedMs,
-  paused = false
-}) {
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-3", "data-testid": "mic-waveform-indicator", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxs("span", { className: "relative flex h-2 w-2", children: [
-        !paused && /* @__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 ${paused ? "bg-muted-foreground" : "bg-red-500"}`
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: `text-xs font-semibold uppercase tracking-wide ${paused ? "text-muted-foreground" : "text-red-500"}`,
-          children: paused ? "Paused" : "Rec"
-        }
-      ),
-      /* @__PURE__ */ jsx("span", { className: "font-mono text-xs tabular-nums text-muted-foreground", children: formatElapsed(elapsedMs) })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "flex h-10 items-end gap-[3px]", "data-testid": "mic-waveform-indicator-bars", children: BAR_WEIGHTS.map((weight, i) => /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: "w-1 rounded-full bg-secondary transition-[height] duration-75 ease-out",
-        style: {
-          height: Math.min(MAX_BAR_PX, Math.max(MIN_BAR_PX, level * weight * MAX_BAR_PX))
-        }
-      },
-      i
-    )) })
-  ] });
-}
 function VoiceNoteRecorder({
   onSave,
   onDiscard,
   onError,
-  title = "Voice note",
+  title = "Voice Memo",
   isSaving = false,
   transcribe
 }) {
@@ -7531,6 +7315,371 @@ function VoiceNoteRecorder({
     ] })
   ] });
 }
+var AUTO_RENAME_COLORS = { text: "text-amber-700", bg: "bg-amber-500" };
+function DraftTitleControls({
+  title,
+  onTitleChange,
+  placeholder,
+  autoRename,
+  onAutoRenameChange
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-shrink-0 items-center gap-1.5", children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "text",
+        value: title,
+        onChange: (e) => onTitleChange(e.target.value),
+        placeholder,
+        className: "min-w-0 max-w-[220px] rounded-md bg-muted px-2 py-1 text-sm font-medium outline-none focus-visible:ring-1 focus-visible:ring-primary",
+        "data-testid": "draft-title-input"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      IconToggle,
+      {
+        icon: Sparkles,
+        isActive: autoRename,
+        onToggle: onAutoRenameChange,
+        colors: AUTO_RENAME_COLORS,
+        tooltipActive: "Auto-name from content is on \u2014 generates a title once saved",
+        tooltipInactive: "Auto-name from content is off \u2014 uses the name typed above",
+        "data-testid": "draft-auto-rename-toggle"
+      }
+    )
+  ] });
+}
+function useCameraStream(constraints = { video: true, audio: false }) {
+  const [stream, setStream] = useState(null);
+  const [isStarting, setIsStarting] = useState(false);
+  const [error, setError] = useState(null);
+  const streamRef = useRef(null);
+  const stop = useCallback(() => {
+    streamRef.current?.getTracks().forEach((t) => t.stop());
+    streamRef.current = null;
+    setStream(null);
+  }, []);
+  const constraintsRef = useRef(constraints);
+  constraintsRef.current = constraints;
+  const start = useCallback(async () => {
+    if (streamRef.current) return;
+    setError(null);
+    setIsStarting(true);
+    try {
+      const media = await navigator.mediaDevices.getUserMedia(constraintsRef.current);
+      streamRef.current = media;
+      setStream(media);
+    } catch (err) {
+      setError(classifyMediaError(err, "camera"));
+    } finally {
+      setIsStarting(false);
+    }
+  }, []);
+  useEffect(() => () => stop(), [stop]);
+  return { stream, isStarting, error, start, stop };
+}
+var ELAPSED_TICK_MS = 200;
+function useVideoRecorder(stream) {
+  const [state, setState] = useState("idle");
+  const [elapsedMs, setElapsedMs] = useState(0);
+  const [blob, setBlob] = useState(null);
+  const [mimeType, setMimeType] = useState(null);
+  const mediaRecorderRef = useRef(null);
+  const chunksRef = useRef([]);
+  const startedAtRef = useRef(0);
+  const tickRef = useRef(null);
+  const stateRef = useRef("idle");
+  stateRef.current = state;
+  const stopTicking = useCallback(() => {
+    if (tickRef.current !== null) clearInterval(tickRef.current);
+    tickRef.current = null;
+  }, []);
+  useEffect(() => stopTicking, [stopTicking]);
+  const start = useCallback(() => {
+    if (!stream || stateRef.current === "recording") return;
+    const mt = MediaRecorder.isTypeSupported("video/webm") ? "video/webm" : "video/mp4";
+    const recorder = new MediaRecorder(stream, { mimeType: mt });
+    chunksRef.current = [];
+    recorder.ondataavailable = (e) => {
+      if (e.data.size > 0) chunksRef.current.push(e.data);
+    };
+    mediaRecorderRef.current = recorder;
+    setMimeType(mt);
+    setBlob(null);
+    startedAtRef.current = performance.now();
+    setElapsedMs(0);
+    recorder.start();
+    setState("recording");
+    tickRef.current = setInterval(() => {
+      setElapsedMs(performance.now() - startedAtRef.current);
+    }, ELAPSED_TICK_MS);
+  }, [stream]);
+  const stop = useCallback(() => {
+    const recorder = mediaRecorderRef.current;
+    if (!recorder || recorder.state === "inactive") return;
+    const finalElapsed = performance.now() - startedAtRef.current;
+    stopTicking();
+    recorder.onstop = () => {
+      const finalBlob = chunksRef.current.length ? new Blob(chunksRef.current, { type: recorder.mimeType }) : null;
+      setBlob(finalBlob);
+      setElapsedMs(finalElapsed);
+      setState("stopped");
+    };
+    recorder.stop();
+  }, [stopTicking]);
+  const reset = useCallback(() => {
+    setState("idle");
+    setBlob(null);
+    setElapsedMs(0);
+    setMimeType(null);
+  }, []);
+  return { state, elapsedMs, blob, mimeType, start, stop, reset };
+}
+
+// src/documents/capture-frame.ts
+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);
+  });
+}
+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"
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+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"
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
 
 // src/documents/has-video-track.ts
 function hasVideoTrack(blob) {
@@ -7556,6 +7705,6 @@ function hasVideoTrack(blob) {
   });
 }
 
-export { ActivityFeed, AgentBadge, AiActionCard, AiAnswer, AppleIcon, ArbiBotHeadIcon, ArbiBotIcon, ArbiChat, ArbiChatPanel, ArbiIcon, ArbiWebSocketProvider, ArtifactCanvas, AudIcon, BASE_COLORS2 as BASE_COLORS, ChatBubble, CitationRenderer, ClaudeIcon, CommandPalette, CommandPaletteProvider, ConversationList, DEFAULT_ASPECT_OPTIONS, DEFAULT_NOTIFY_TONE, DateSeparator, DirectMessages, DmAvatar, DmComposer, DocIcon, DocQaPanel, DocSearch, DocumentCard, DocumentCardMenu, DocumentEntity, DocumentGallery, DocumentReview, DocumentTable, ENTITY_MAPPINGS, EmlIcon, EntityIcon, EntityPill, FILE_TYPE_COLORS, FileIcon, FireworksIcon, GeminiIcon, GitHubIcon, GoogleIcon, HtmlIcon, ImageCropModal, ImageCropper, ImgIcon, LinkedInIcon, MessageArtifactCard, MessageBubble2 as MessageBubble, MessageThread, MicWaveformIndicator, NEUTRAL_GRAY2 as NEUTRAL_GRAY, NotificationBell, OpenAIIcon, PLACEHOLDER_COLOR, PassageCard, PdfIcon, PresenceLabel, ProjectEntity, ProviderIcon, RUN_WINDOW_MS, RagDot, RelevanceDot, SemanticSearch, StatusPill, TAG_TYPE_ICONS, TAG_TYPE_LABELS, TagEntity, Toaster, TxtIcon, TypingIndicator, UserEntity, UserMenu, VISIBILITY_ICONS, VidIcon, VisibilityIcon, VoiceNoteRecorder, XlsIcon, annotateThread, arbiQueryKeys, configureEntityRegistry, configureRagLabels, configureStatusRegistry, cropImage, dayKey, describeActivity, formatElapsed, formatRelativeTime, getDocIcon, getEntityColor2 as getEntityColor, getEntityColorStyles, getEntityIcon, getEntityLabel, getNotificationTypeMeta, getStatusVariant, getTagTypeIcon, getTagTypeLabel, getWorkspaceActionText, getWorkspaceColor, getWorkspaceSentPhrase, hasVideoTrack, isWorkspaceNotificationType, notify, parseActivityContent, redlineStats, seedNotifications, selectUnread, textToArtifact, toRedlineMarkdown, useActivity, useAgents, useAiTask, useArbiConnected, useArbiDocumentSync, useArbiUiStore, useArbiWebSocket, useArbiWsContext, useArbiWsMessage, useArbiWsStatus, useArbiWsStore, useArbiWsTask, useArbiWsTasks, useAssistantQuery, useAudioRecorder, useCommandPalette, useConfigs, useConversations, useDeleteAgents, useDirectMessages, useDocuments, useFacts, useHealth, useNotify, useParsedDocument, useProjectInvoices, useProjectUsage, useProjects, useProjectsUsage, useSemanticSearch, useSessions, useTags, useTasks, useThumbnails, useUserUsageToday, useWorkspaceDocs, useWorkspaces, userDisplayName, userInitials };
+export { ActivityFeed, AgentBadge, AiActionCard, AiAnswer, AppleIcon, ArbiBotHeadIcon, ArbiBotIcon, ArbiChat, ArbiChatPanel, ArbiIcon, ArbiWebSocketProvider, ArtifactCanvas, AudIcon, BASE_COLORS2 as BASE_COLORS, ChatBubble, CitationRenderer, ClaudeIcon, CommandPalette, CommandPaletteProvider, ConversationList, DEFAULT_ASPECT_OPTIONS, DEFAULT_NOTIFY_TONE, DateSeparator, DirectMessages, DmAvatar, DmComposer, DocIcon, DocQaPanel, DocSearch, DocumentCard, DocumentCardMenu, DocumentEntity, DocumentGallery, DocumentReview, DocumentTable, DraftTitleControls, ENTITY_MAPPINGS, EmlIcon, EntityIcon, EntityPill, FILE_TYPE_COLORS, FileIcon, FireworksIcon, GeminiIcon, GitHubIcon, GoogleIcon, HtmlIcon, ImageCropModal, ImageCropper, ImgIcon, LinkedInIcon, MessageArtifactCard, MessageBubble2 as MessageBubble, MessageThread, NEUTRAL_GRAY2 as NEUTRAL_GRAY, NotificationBell, OpenAIIcon, PLACEHOLDER_COLOR, PassageCard, PdfIcon, PhotoCapture, PresenceLabel, ProjectEntity, ProviderIcon, RUN_WINDOW_MS, RagDot, RelevanceDot, SemanticSearch, StatusPill, TAG_TYPE_ICONS, TAG_TYPE_LABELS, TagEntity, Toaster, TxtIcon, TypingIndicator, UserEntity, UserMenu, VISIBILITY_ICONS, VidIcon, VideoCapture, VisibilityIcon, VoiceNoteRecorder, XlsIcon, annotateThread, arbiQueryKeys, captureFrameAsBlob, configureEntityRegistry, configureRagLabels, configureStatusRegistry, cropImage, dayKey, describeActivity, formatRelativeTime, getDocIcon, getEntityColor2 as getEntityColor, getEntityColorStyles, getEntityIcon, getEntityLabel, getNotificationTypeMeta, getStatusVariant, getTagTypeIcon, getTagTypeLabel, getWorkspaceActionText, getWorkspaceColor, getWorkspaceSentPhrase, hasVideoTrack, isWorkspaceNotificationType, notify, parseActivityContent, redlineStats, seedNotifications, selectUnread, textToArtifact, toRedlineMarkdown, useActivity, useAgents, useAiTask, useArbiConnected, useArbiDocumentSync, useArbiUiStore, useArbiWebSocket, useArbiWsContext, useArbiWsMessage, useArbiWsStatus, useArbiWsStore, useArbiWsTask, useArbiWsTasks, useAssistantQuery, useCameraStream, useCommandPalette, useConfigs, useConversations, useDeleteAgents, useDirectMessages, useDocuments, useFacts, useHealth, useNotify, useParsedDocument, useProjectInvoices, useProjectUsage, useProjects, useProjectsUsage, useSemanticSearch, useSessions, useTags, useTasks, useThumbnails, useUserUsageToday, useVideoRecorder, useWorkspaceDocs, useWorkspaces, userDisplayName, userInitials };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map