@ai-matrx/capture 0.4.3 → 0.5.0

package/dist/react.cjs

@@ -28,6 +28,7 @@ __export(react_exports, {
   CaptureFilmstrip: () => CaptureFilmstrip,
   CaptureRail: () => CaptureRail,
   CaptureSheet: () => CaptureSheet,
+  CloudLibrarySheet: () => CloudLibrarySheet,
   CountdownOverlay: () => CountdownOverlay,
   GridOverlay: () => GridOverlay,
   HoldShutter: () => HoldShutter,
@@ -35,14 +36,33 @@ __export(react_exports, {
   MediaViewer: () => MediaViewer,
   ModeSelector: () => ModeSelector,
   OptionsGridPanel: () => OptionsGridPanel,
+  PHOTO_JPEG_QUALITY: () => PHOTO_JPEG_QUALITY,
   ShutterButton: () => ShutterButton,
   ZoomRow: () => ZoomRow,
+  acquireWarmMic: () => acquireWarmMic,
+  adoptWarmAudioStream: () => adoptWarmAudioStream,
+  buildWarmMicConstraints: () => buildWarmMicConstraints,
+  classifyCameraBlockReason: () => classifyCameraBlockReason,
+  cropBlobToAspect: () => cropBlobToAspect,
   getMediaUrl: () => getMediaUrl,
+  getWarmMicState: () => getWarmMicState,
+  hardStopWarmMic: () => hardStopWarmMic,
   invalidateMedia: () => invalidateMedia,
+  isMediaDenialError: () => isMediaDenialError,
+  nextCameraDevice: () => nextCameraDevice,
+  notifyMicPermissionRevoked: () => notifyMicPermissionRevoked,
   primeMedia: () => primeMedia,
+  queryCameraPermission: () => queryCameraPermission,
+  queryMicPermission: () => queryMicPermission,
+  releaseWarmMic: () => releaseWarmMic,
+  setPreferredMicDeviceId: () => setPreferredMicDeviceId,
+  shouldCombineMicPrompt: () => shouldCombineMicPrompt,
+  subscribeWarmMic: () => subscribeWarmMic,
+  subscribeWarmMicInterruption: () => subscribeWarmMicInterruption,
   useDefaultCaptureEngine: () => useDefaultCaptureEngine,
   useMediaUrl: () => useMediaUrl,
-  useTrackControls: () => useTrackControls
+  useTrackControls: () => useTrackControls,
+  warmMicDebug: () => warmMicDebug
 });
 module.exports = __toCommonJS(react_exports);
 
@@ -118,6 +138,23 @@ function ImagesIcon(props) {
 function Loader2Icon(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { ...svgProps(props), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }) });
 }
+function UploadIcon(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { ...svgProps(props), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12 3v12" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "m17 8-5-5-5 5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" })
+  ] });
+}
+function ImageOffIcon(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { ...svgProps(props), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "2", x2: "22", y1: "2", y2: "22" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M10.41 10.41a2 2 0 1 1-2.83-2.83" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "13.5", x2: "6", y1: "13.5", y2: "21" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: "18", x2: "21", y1: "12", y2: "15" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M3.59 3.59A1.99 1.99 0 0 0 3 5v14a2 2 0 0 0 2 2h14c.55 0 1.052-.22 1.41-.59" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M21 15V5a2 2 0 0 0-2-2H9" })
+  ] });
+}
 function LockIcon(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { ...svgProps(props), children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { width: "18", height: "11", x: "3", y: "11", rx: "2", ry: "2" }),
@@ -2572,6 +2609,349 @@ function CameraFeed({
 
 // src/engine/useDefaultEngine.ts
 var import_react11 = require("react");
+
+// src/engine/crop.ts
+var PHOTO_JPEG_QUALITY = 0.92;
+async function cropBlobToAspect(blob, aspect, quality = PHOTO_JPEG_QUALITY) {
+  if (aspect === "full") return blob;
+  const [wRatio, hRatio] = aspect === "1:1" ? [1, 1] : aspect === "4:3" ? [4, 3] : [16, 9];
+  const bitmap = await createImageBitmap(blob);
+  try {
+    const srcW = bitmap.width;
+    const srcH = bitmap.height;
+    const target = srcW >= srcH ? wRatio / hRatio : hRatio / wRatio;
+    let cropW = srcW;
+    let cropH = Math.round(srcW / target);
+    if (cropH > srcH) {
+      cropH = srcH;
+      cropW = Math.round(srcH * target);
+    }
+    if (cropW === srcW && cropH === srcH) return blob;
+    const canvas = document.createElement("canvas");
+    canvas.width = cropW;
+    canvas.height = cropH;
+    const ctx = canvas.getContext("2d");
+    if (!ctx) return blob;
+    ctx.drawImage(
+      bitmap,
+      Math.round((srcW - cropW) / 2),
+      Math.round((srcH - cropH) / 2),
+      cropW,
+      cropH,
+      0,
+      0,
+      cropW,
+      cropH
+    );
+    return await new Promise(
+      (resolve) => canvas.toBlob((out) => resolve(out ?? blob), "image/jpeg", quality)
+    );
+  } finally {
+    bitmap.close();
+  }
+}
+function nextCameraDevice(cameras, currentDeviceId) {
+  if (cameras.length < 2) return null;
+  const currentIdx = currentDeviceId ? cameras.findIndex((c) => c.deviceId === currentDeviceId) : -1;
+  return cameras[(Math.max(currentIdx, 0) + 1) % cameras.length] ?? null;
+}
+
+// src/engine/permissions.ts
+async function queryPermission(name) {
+  if (typeof navigator === "undefined" || !navigator.permissions) {
+    return "unknown";
+  }
+  try {
+    const status = await navigator.permissions.query({
+      name
+    });
+    if (status.state === "granted") return "granted";
+    if (status.state === "denied") return "denied";
+    return "prompt";
+  } catch {
+    return "unknown";
+  }
+}
+function queryCameraPermission() {
+  return queryPermission("camera");
+}
+function queryMicPermission() {
+  return queryPermission("microphone");
+}
+function shouldCombineMicPrompt(micPermissionState) {
+  return micPermissionState === "prompt" || micPermissionState === "unknown";
+}
+function isMediaDenialError(err) {
+  const name = err && typeof err === "object" && "name" in err ? String(err.name) : "";
+  return name === "NotAllowedError" || name === "SecurityError";
+}
+function classifyCameraBlockReason(err) {
+  return isMediaDenialError(err) ? "permission-denied" : "not-supported";
+}
+
+// src/engine/warm-mic.ts
+var DEFAULT_KEEPALIVE_MS = 6e3;
+var STATE_SLOT2 = /* @__PURE__ */ Symbol.for("ai-matrx.capture.warm-mic-state");
+function getManager() {
+  const holder = globalThis;
+  let m = holder[STATE_SLOT2];
+  if (!m) {
+    m = {
+      stream: null,
+      inFlight: null,
+      refCount: 0,
+      releaseTimer: null,
+      state: "idle",
+      keepAliveMs: DEFAULT_KEEPALIVE_MS,
+      preferredInputDeviceId: null,
+      listeners: /* @__PURE__ */ new Set(),
+      interruptionListeners: /* @__PURE__ */ new Set(),
+      pageLifecycleWatched: false,
+      permissionWatched: false
+    };
+    holder[STATE_SLOT2] = m;
+  }
+  return m;
+}
+function emitInterruption(reason) {
+  for (const l of getManager().interruptionListeners) {
+    try {
+      l(reason);
+    } catch {
+    }
+  }
+}
+function subscribeWarmMicInterruption(listener) {
+  const m = getManager();
+  m.interruptionListeners.add(listener);
+  return () => {
+    m.interruptionListeners.delete(listener);
+  };
+}
+function setState(next) {
+  const m = getManager();
+  m.state = next;
+  for (const l of m.listeners) {
+    try {
+      l(next);
+    } catch {
+    }
+  }
+}
+function clearReleaseTimer() {
+  const m = getManager();
+  if (m.releaseTimer) {
+    clearTimeout(m.releaseTimer);
+    m.releaseTimer = null;
+  }
+}
+function attachTrackHealth(stream) {
+  const m = getManager();
+  for (const track of stream.getAudioTracks()) {
+    track.onended = () => {
+      console.error(
+        "[capture:warm-mic] mic track ENDED (OS interruption / device change). The warm grant is gone; the next recording will re-prompt."
+      );
+      if (m.stream === stream) {
+        m.stream = null;
+        setState("error");
+      }
+      emitInterruption("ended");
+    };
+    track.onmute = () => {
+      console.warn(
+        "[capture:warm-mic] mic track MUTED (transient interruption \u2014 e.g. a call). The grant survives; it should unmute when the interruption ends."
+      );
+      emitInterruption("muted");
+    };
+    track.onunmute = () => {
+      emitInterruption("unmuted");
+    };
+  }
+}
+function notifyMicPermissionRevoked() {
+  console.error("[capture:warm-mic] microphone permission REVOKED.");
+  hardStopWarmMic();
+  emitInterruption("permission-revoked");
+}
+function watchMicPermission() {
+  const m = getManager();
+  if (m.permissionWatched) return;
+  if (typeof navigator === "undefined" || !navigator.permissions) return;
+  m.permissionWatched = true;
+  void (async () => {
+    try {
+      const status = await navigator.permissions.query({
+        name: "microphone"
+      });
+      status.onchange = () => {
+        if (status.state === "denied") notifyMicPermissionRevoked();
+      };
+    } catch {
+    }
+  })();
+}
+function watchPageLifecycle() {
+  const m = getManager();
+  if (m.pageLifecycleWatched) return;
+  if (typeof window === "undefined") return;
+  m.pageLifecycleWatched = true;
+  window.addEventListener("pagehide", () => {
+    if (m.stream || m.refCount > 0) {
+      if (m.refCount > 0) {
+        console.error(
+          `[capture:warm-mic] page hiding with ${m.refCount} unreleased mic holder(s) \u2014 forcing release. A surface leaked acquireWarmMic without a matching releaseWarmMic on unmount.`
+        );
+      }
+      hardStopWarmMic();
+    }
+  });
+}
+function setPreferredMicDeviceId(id) {
+  getManager().preferredInputDeviceId = id;
+}
+function streamIsLive(stream) {
+  if (!stream) return false;
+  const tracks = stream.getAudioTracks();
+  return tracks.length > 0 && tracks.every((t) => t.readyState === "live");
+}
+function buildWarmMicConstraints() {
+  const m = getManager();
+  const audio = {
+    echoCancellation: true,
+    noiseSuppression: true,
+    autoGainControl: true
+  };
+  if (m.preferredInputDeviceId) {
+    audio.deviceId = { ideal: m.preferredInputDeviceId };
+  }
+  return audio;
+}
+function adoptWarmAudioStream(stream) {
+  const m = getManager();
+  if (streamIsLive(m.stream) || m.inFlight) {
+    for (const t of stream.getTracks()) {
+      try {
+        t.stop();
+      } catch {
+      }
+    }
+    return;
+  }
+  if (!streamIsLive(stream)) return;
+  clearReleaseTimer();
+  m.stream = stream;
+  attachTrackHealth(stream);
+  watchPageLifecycle();
+  watchMicPermission();
+  if (m.refCount > 0) {
+    setState("active");
+  } else {
+    armKeepaliveStop();
+  }
+}
+async function acquireWarmMic(constraints) {
+  const m = getManager();
+  clearReleaseTimer();
+  m.refCount += 1;
+  if (streamIsLive(m.stream)) {
+    setState("active");
+    return m.stream;
+  }
+  m.stream = null;
+  if (m.inFlight) {
+    return m.inFlight;
+  }
+  setState("acquiring");
+  const audio = constraints ?? buildWarmMicConstraints();
+  if (m.preferredInputDeviceId && audio.deviceId == null) {
+    audio.deviceId = { ideal: m.preferredInputDeviceId };
+  }
+  m.inFlight = (async () => {
+    try {
+      const stream = await navigator.mediaDevices.getUserMedia({ audio });
+      m.stream = stream;
+      attachTrackHealth(stream);
+      watchPageLifecycle();
+      watchMicPermission();
+      if (m.refCount === 0) {
+        armKeepaliveStop();
+        return stream;
+      }
+      setState("active");
+      return stream;
+    } catch (err) {
+      m.refCount = Math.max(0, m.refCount - 1);
+      setState("error");
+      throw err;
+    } finally {
+      m.inFlight = null;
+    }
+  })();
+  return m.inFlight;
+}
+function releaseWarmMic() {
+  const m = getManager();
+  if (m.refCount === 0) {
+    console.error(
+      "[capture:warm-mic] releaseWarmMic() with zero holders \u2014 unbalanced release. Some caller released twice (or released a hold it never acquired)."
+    );
+    return;
+  }
+  m.refCount -= 1;
+  if (m.refCount > 0) return;
+  if (!m.stream) {
+    setState(m.inFlight ? "keepalive" : "idle");
+    return;
+  }
+  armKeepaliveStop();
+}
+function armKeepaliveStop() {
+  const m = getManager();
+  clearReleaseTimer();
+  setState("keepalive");
+  m.releaseTimer = setTimeout(() => {
+    m.releaseTimer = null;
+    if (m.refCount > 0) return;
+    hardStopWarmMic();
+  }, m.keepAliveMs);
+}
+function hardStopWarmMic() {
+  const m = getManager();
+  clearReleaseTimer();
+  if (m.stream) {
+    for (const t of m.stream.getTracks()) {
+      try {
+        t.stop();
+      } catch {
+      }
+    }
+    m.stream = null;
+  }
+  m.refCount = 0;
+  setState("idle");
+}
+function getWarmMicState() {
+  return getManager().state;
+}
+function subscribeWarmMic(listener) {
+  const m = getManager();
+  m.listeners.add(listener);
+  return () => {
+    m.listeners.delete(listener);
+  };
+}
+function warmMicDebug() {
+  const m = getManager();
+  return {
+    state: m.state,
+    refCount: m.refCount,
+    live: streamIsLive(m.stream),
+    keepAliveMs: m.keepAliveMs
+  };
+}
+
+// src/engine/useDefaultEngine.ts
 var RECORDING_MIME_LADDER = [
   'video/mp4;codecs="avc1.42E01E,mp4a.40.2"',
   "video/mp4",
@@ -2579,39 +2959,38 @@ var RECORDING_MIME_LADDER = [
   'video/webm;codecs="vp8,opus"',
   "video/webm"
 ];
-function cropRect(w, h, aspect) {
-  if (aspect === "full") return { x: 0, y: 0, w, h };
-  const [aw, ah] = aspect === "1:1" ? [1, 1] : aspect === "4:3" ? [3, 4] : [9, 16];
-  const [rw, rh] = w >= h ? [ah, aw] : [aw, ah];
-  const target = rw / rh;
-  let cw = w;
-  let ch = w / target;
-  if (ch > h) {
-    ch = h;
-    cw = h * target;
-  }
-  return { x: (w - cw) / 2, y: (h - ch) / 2, w: cw, h: ch };
-}
 function useDefaultCaptureEngine(options) {
   const {
     onPhoto,
     onVideo,
     onFiles,
     withAudio = true,
+    mode,
     facingMode: initialFacing = "environment",
-    photoQuality = 0.92
+    photoQuality = 0.92,
+    fileNamePrefix = "capture",
+    onError
   } = options;
   const [stream, setStream] = (0, import_react11.useState)(null);
   const [blocked, setBlocked] = (0, import_react11.useState)(null);
-  const [facing, setFacing] = (0, import_react11.useState)(initialFacing);
-  const [multipleCameras, setMultipleCameras] = (0, import_react11.useState)(false);
+  const [deviceId, setDeviceId] = (0, import_react11.useState)(null);
+  const [cameras, setCameras] = (0, import_react11.useState)([]);
   const [recording, setRecording] = (0, import_react11.useState)(false);
   const [recordElapsedSeconds, setRecordElapsedSeconds] = (0, import_react11.useState)(0);
+  const [flash, setFlash] = (0, import_react11.useState)(false);
+  const [acquireToken, setAcquireToken] = (0, import_react11.useState)(0);
   const videoRef = (0, import_react11.useRef)(null);
   const streamRef = (0, import_react11.useRef)(null);
   const recorderRef = (0, import_react11.useRef)(null);
-  const callbacksRef = (0, import_react11.useRef)({ onPhoto, onVideo, onFiles });
-  callbacksRef.current = { onPhoto, onVideo, onFiles };
+  const captureBusyRef = (0, import_react11.useRef)(false);
+  const reacquiredOnceRef = (0, import_react11.useRef)(false);
+  const callbacksRef = (0, import_react11.useRef)({ onPhoto, onVideo, onFiles, onError });
+  callbacksRef.current = { onPhoto, onVideo, onFiles, onError };
+  const reportError = (0, import_react11.useCallback)((message, err) => {
+    const sink = callbacksRef.current.onError;
+    if (sink) sink(message, err);
+    else console.error(`[capture:engine] ${message}`, err);
+  }, []);
   (0, import_react11.useEffect)(() => {
     let cancelled = false;
     let acquired = null;
@@ -2619,110 +2998,176 @@ function useDefaultCaptureEngine(options) {
       setBlocked({ reason: "not-supported" });
       return;
     }
-    navigator.mediaDevices.getUserMedia({
-      video: {
-        facingMode: facing,
-        width: { ideal: 4096 },
-        height: { ideal: 4096 }
-      },
-      audio: false
-    }).then((s) => {
-      if (cancelled) {
-        s.getTracks().forEach((t) => t.stop());
+    void (async () => {
+      const known = await queryCameraPermission();
+      if (cancelled) return;
+      if (known === "denied") {
+        setBlocked({ reason: "permission-denied" });
         return;
       }
-      acquired = s;
-      streamRef.current = s;
-      setStream(s);
-      setBlocked(null);
-      return navigator.mediaDevices.enumerateDevices().then((devices) => {
-        if (!cancelled)
-          setMultipleCameras(
-            devices.filter((d) => d.kind === "videoinput").length > 1
-          );
-      });
-    }).catch((err) => {
+      const includeMic = withAudio && shouldCombineMicPrompt(await queryMicPermission());
       if (cancelled) return;
-      const name = err && typeof err === "object" && "name" in err ? String(err.name) : "";
-      setBlocked({
-        reason: name === "NotAllowedError" || name === "SecurityError" ? "permission-denied" : "not-supported"
-      });
-    });
+      const video = {
+        width: { ideal: 4096 },
+        height: { ideal: 4096 },
+        ...deviceId ? { deviceId: { exact: deviceId } } : { facingMode: initialFacing }
+      };
+      const acquire = async (mic) => {
+        try {
+          return await navigator.mediaDevices.getUserMedia(
+            mic ? { video, audio: buildWarmMicConstraints() } : { video, audio: false }
+          );
+        } catch (err) {
+          if (mic && classifyCameraBlockReason(err) === "permission-denied") {
+            return navigator.mediaDevices.getUserMedia({ video, audio: false });
+          }
+          throw err;
+        }
+      };
+      try {
+        const s = await acquire(includeMic);
+        if (cancelled) {
+          s.getTracks().forEach((t) => t.stop());
+          return;
+        }
+        const audioTracks = s.getAudioTracks();
+        if (audioTracks.length > 0) {
+          for (const t of audioTracks) s.removeTrack(t);
+          adoptWarmAudioStream(new MediaStream(audioTracks));
+        }
+        acquired = s;
+        streamRef.current = s;
+        setStream(s);
+        setBlocked(null);
+        reacquiredOnceRef.current = false;
+        for (const track of s.getVideoTracks()) {
+          track.onended = () => {
+            if (cancelled || streamRef.current !== s) return;
+            console.error(
+              "[capture:engine] camera track ENDED (OS interruption / device change) \u2014 reacquiring."
+            );
+            if (reacquiredOnceRef.current) {
+              setBlocked({ reason: "not-supported" });
+              return;
+            }
+            reacquiredOnceRef.current = true;
+            setAcquireToken((n) => n + 1);
+          };
+        }
+        const devices = await navigator.mediaDevices.enumerateDevices();
+        if (!cancelled) {
+          setCameras(devices.filter((d) => d.kind === "videoinput"));
+        }
+      } catch (err) {
+        if (cancelled) return;
+        setBlocked({ reason: classifyCameraBlockReason(err) });
+      }
+    })();
     return () => {
       cancelled = true;
       acquired?.getTracks().forEach((t) => t.stop());
       if (streamRef.current === acquired) streamRef.current = null;
       setStream(null);
     };
-  }, [facing]);
+  }, [deviceId, initialFacing, withAudio, acquireToken]);
+  const cameraBlocked = blocked !== null;
+  (0, import_react11.useEffect)(() => {
+    if (mode !== "video" || cameraBlocked || !withAudio) return;
+    let cancelled = false;
+    let held = false;
+    void (async () => {
+      if (await queryMicPermission() === "denied") return;
+      if (cancelled) return;
+      acquireWarmMic().then(() => {
+        if (cancelled) {
+          releaseWarmMic();
+          return;
+        }
+        held = true;
+      }).catch(() => {
+      });
+    })();
+    return () => {
+      cancelled = true;
+      if (held) releaseWarmMic();
+    };
+  }, [mode, cameraBlocked, withAudio]);
   (0, import_react11.useEffect)(() => {
     return () => {
       const r = recorderRef.current;
       if (r) {
         clearInterval(r.timer);
         if (r.recorder.state !== "inactive") r.recorder.stop();
-        r.micTracks.forEach((t) => t.stop());
       }
     };
   }, []);
-  const onCapturePhoto = (0, import_react11.useCallback)(
+  const capturePhotoWith = (0, import_react11.useCallback)(
     (opts) => {
       const video = videoRef.current;
       if (!video || video.videoWidth === 0) return;
-      const rect = cropRect(
-        video.videoWidth,
-        video.videoHeight,
-        opts?.aspect ?? "full"
-      );
-      const canvas = document.createElement("canvas");
-      canvas.width = Math.round(rect.w);
-      canvas.height = Math.round(rect.h);
-      const ctx = canvas.getContext("2d");
-      if (!ctx) return;
-      ctx.drawImage(
-        video,
-        rect.x,
-        rect.y,
-        rect.w,
-        rect.h,
-        0,
-        0,
-        canvas.width,
-        canvas.height
-      );
-      canvas.toBlob(
-        (blob) => {
-          if (!blob) return;
+      if (captureBusyRef.current) return;
+      captureBusyRef.current = true;
+      void (async () => {
+        try {
+          const canvas = document.createElement("canvas");
+          canvas.width = video.videoWidth;
+          canvas.height = video.videoHeight;
+          const ctx = canvas.getContext("2d");
+          if (!ctx) throw new Error("2d canvas context unavailable");
+          ctx.drawImage(video, 0, 0);
+          const full = await new Promise(
+            (resolve, reject) => canvas.toBlob(
+              (b) => b ? resolve(b) : reject(new Error("toBlob returned null")),
+              "image/jpeg",
+              photoQuality
+            )
+          );
+          const blob = await cropBlobToAspect(
+            full,
+            opts.aspect ?? "full",
+            photoQuality
+          );
           callbacksRef.current.onPhoto(
-            new File([blob], `capture-${(/* @__PURE__ */ new Date()).toISOString()}.jpg`, {
-              type: "image/jpeg"
-            })
+            new File(
+              [blob],
+              `${opts.fileNamePrefix}-${(/* @__PURE__ */ new Date()).toISOString()}.jpg`,
+              { type: "image/jpeg" }
+            )
           );
-        },
-        "image/jpeg",
-        photoQuality
+          setFlash(true);
+          window.setTimeout(() => setFlash(false), 120);
+        } catch (err) {
+          reportError("The photo could not be captured \u2014 try again.", err);
+        } finally {
+          captureBusyRef.current = false;
+        }
+      })();
+    },
+    [photoQuality, reportError]
+  );
+  const onCapturePhoto = (0, import_react11.useCallback)(
+    (opts) => {
+      capturePhotoWith(
+        opts?.aspect ? { fileNamePrefix, aspect: opts.aspect } : { fileNamePrefix }
       );
     },
-    [photoQuality]
+    [capturePhotoWith, fileNamePrefix]
   );
   const onStartRecording = (0, import_react11.useCallback)(() => {
     const base = streamRef.current;
     if (!base || recorderRef.current) return;
     void (async () => {
-      let micTracks = [];
+      let micClones = [];
+      let micHeld = false;
       if (withAudio) {
         try {
-          const mic = await navigator.mediaDevices.getUserMedia({
-            audio: true
-          });
-          micTracks = mic.getAudioTracks();
+          const mic = await acquireWarmMic();
+          micHeld = true;
+          micClones = mic.getAudioTracks().map((t) => t.clone());
         } catch {
         }
       }
-      const composed = new MediaStream([
-        ...base.getVideoTracks(),
-        ...micTracks
-      ]);
+      const composed = new MediaStream([...base.getVideoTracks(), ...micClones]);
       const mime = RECORDING_MIME_LADDER.find(
         (m) => typeof MediaRecorder !== "undefined" && MediaRecorder.isTypeSupported(m)
       );
@@ -2732,15 +3177,18 @@ function useDefaultCaptureEngine(options) {
           composed,
           mime ? { mimeType: mime } : void 0
         );
-      } catch {
-        micTracks.forEach((t) => t.stop());
+      } catch (err) {
+        micClones.forEach((t) => t.stop());
+        if (micHeld) releaseWarmMic();
+        reportError("Could not start the video recording.", err);
         return;
       }
       const entry = {
         recorder,
         chunks: [],
         startedAt: performance.now(),
-        micTracks,
+        micClones,
+        micHeld,
         timer: setInterval(() => {
           setRecordElapsedSeconds(
             Math.floor((performance.now() - entry.startedAt) / 1e3)
@@ -2753,7 +3201,8 @@ function useDefaultCaptureEngine(options) {
       };
       recorder.onstop = () => {
         clearInterval(entry.timer);
-        entry.micTracks.forEach((t) => t.stop());
+        entry.micClones.forEach((t) => t.stop());
+        if (entry.micHeld) releaseWarmMic();
         recorderRef.current = null;
         setRecording(false);
         const durationMs = Math.round(performance.now() - entry.startedAt);
@@ -2761,7 +3210,7 @@ function useDefaultCaptureEngine(options) {
         const blob = new Blob(entry.chunks, { type });
         const ext = type.includes("mp4") ? "mp4" : "webm";
         callbacksRef.current.onVideo(
-          new File([blob], `capture-${(/* @__PURE__ */ new Date()).toISOString()}.${ext}`, {
+          new File([blob], `${fileNamePrefix}-video-${Date.now()}.${ext}`, {
             type
           }),
           durationMs
@@ -2771,7 +3220,7 @@ function useDefaultCaptureEngine(options) {
       setRecordElapsedSeconds(0);
       setRecording(true);
     })();
-  }, [withAudio]);
+  }, [withAudio, fileNamePrefix, reportError]);
   const onStopRecording = (0, import_react11.useCallback)(() => {
     const r = recorderRef.current;
     if (r && r.recorder.state !== "inactive") r.recorder.stop();
@@ -2788,8 +3237,12 @@ function useDefaultCaptureEngine(options) {
     input.click();
   }, []);
   const onFlipCamera = (0, import_react11.useCallback)(() => {
-    setFacing((f) => f === "environment" ? "user" : "environment");
-  }, []);
+    if (recorderRef.current) return;
+    const current = deviceId ?? streamRef.current?.getVideoTracks()[0]?.getSettings().deviceId ?? null;
+    const next = nextCameraDevice(cameras, current);
+    if (next) setDeviceId(next.deviceId);
+  }, [cameras, deviceId]);
+  const canFlip = cameras.length > 1 && !cameraBlocked && !recording;
   return (0, import_react11.useMemo)(
     () => ({
       stream,
@@ -2801,7 +3254,9 @@ function useDefaultCaptureEngine(options) {
       recording,
       recordElapsedSeconds,
       onUpload,
-      onFlipCamera: multipleCameras ? onFlipCamera : null
+      onFlipCamera: canFlip ? onFlipCamera : null,
+      flash,
+      capturePhotoWith
     }),
     [
       stream,
@@ -2813,8 +3268,129 @@ function useDefaultCaptureEngine(options) {
       recordElapsedSeconds,
       onUpload,
       onFlipCamera,
-      multipleCameras
+      canFlip,
+      flash,
+      capturePhotoWith
     ]
   );
 }
+
+// src/components/CloudLibrarySheet.tsx
+var import_react12 = require("react");
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var PAGE_SIZE = 60;
+function CloudLibrarySheet({
+  open,
+  onClose,
+  items,
+  loading,
+  busy = false,
+  onOpenItem,
+  onUpload,
+  title = "Your media"
+}) {
+  const [visibleCount, setVisibleCount] = (0, import_react12.useState)(PAGE_SIZE);
+  (0, import_react12.useEffect)(() => {
+    if (open) setVisibleCount(PAGE_SIZE);
+  }, [open]);
+  if (!open) return null;
+  const uploadThenClose = onUpload ? () => {
+    onClose();
+    onUpload();
+  } : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "absolute inset-0 z-50 flex flex-col bg-black", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+      "div",
+      {
+        className: "flex shrink-0 items-center justify-between bg-black/80 px-4",
+        style: safeTop,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("h2", { className: "py-4 text-[17px] font-semibold text-white", children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex items-center gap-2", children: [
+            uploadThenClose ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+              "button",
+              {
+                type: "button",
+                onClick: uploadThenClose,
+                className: "flex h-10 touch-manipulation items-center gap-1.5 rounded-full bg-white/10 px-3.5 text-[13px] font-medium text-white transition-colors hover:bg-white/20",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(UploadIcon, { className: "h-4 w-4" }),
+                  "Upload"
+                ]
+              }
+            ) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+              "button",
+              {
+                type: "button",
+                onClick: onClose,
+                "aria-label": "Close library",
+                className: "flex h-10 w-10 items-center justify-center rounded-full bg-white/10 text-white transition-colors hover:bg-white/20",
+                children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(XIcon, { className: "h-5 w-5" })
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+      "div",
+      {
+        className: "min-h-0 flex-1 overflow-y-auto overscroll-contain px-1",
+        style: safeBottom,
+        children: [
+          loading ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Loader2Icon, { className: "h-6 w-6 animate-spin text-white/60" }) }) : items.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex h-full flex-col items-center justify-center gap-3 text-white/60", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ImageOffIcon, { className: "h-8 w-8" }),
+            /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-sm", children: "No photos or videos in your cloud yet." }),
+            uploadThenClose ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+              "button",
+              {
+                type: "button",
+                onClick: uploadThenClose,
+                className: "flex h-11 touch-manipulation items-center gap-2 rounded-full bg-white/10 px-5 text-sm font-medium text-white transition-colors hover:bg-white/20",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(UploadIcon, { className: "h-4 w-4" }),
+                  "Upload from this device"
+                ]
+              }
+            ) : null
+          ] }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "grid grid-cols-3 gap-0.5 sm:grid-cols-5 md:grid-cols-7", children: items.slice(0, visibleCount).map((item) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+            "button",
+            {
+              type: "button",
+              onClick: () => onOpenItem(item.id),
+              "aria-label": `Open ${item.fileName}`,
+              className: "relative aspect-square overflow-hidden bg-white/5 transition-opacity active:opacity-70",
+              children: [
+                item.thumbnail,
+                item.kind === "video" && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+                  PlayIcon,
+                  {
+                    className: "absolute bottom-1.5 left-1.5 h-4 w-4 text-white drop-shadow",
+                    fill: "currentColor"
+                  }
+                )
+              ]
+            },
+            item.id
+          )) }),
+          !loading && items.length > visibleCount && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex justify-center py-4", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+            "button",
+            {
+              type: "button",
+              onClick: () => setVisibleCount((n) => n + PAGE_SIZE),
+              className: "h-11 touch-manipulation rounded-full bg-white/10 px-6 text-sm font-medium text-white",
+              children: [
+                "Show more (",
+                items.length - visibleCount,
+                " left)"
+              ]
+            }
+          ) }),
+          busy && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center bg-black/40", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Loader2Icon, { className: "h-6 w-6 animate-spin text-white" }) })
+        ]
+      }
+    )
+  ] });
+}
 //# sourceMappingURL=react.cjs.map