@ai-matrx/media 0.4.4 → 0.5.0

package/dist/react.d.cts

@@ -280,16 +280,6 @@ interface FileUploadDropzoneProps {
 }
 declare function FileUploadDropzone({ uploadOptions, accept, maxSize, enablePaste, mode, children, className, actions, onUploadStart, onUploaded, onError, onOpenFile, pickerEventName, }: FileUploadDropzoneProps): react.JSX.Element;
 
-/**
- * Human file size.
- *
- * `null` / `undefined` / NaN / negative collapse to an em-dash, NOT to
- * "0 B" (fixed at 0.4.0 while absorbing the viewer bodies — matrx-frontend's
- * `formatFileSize` already had this guard and the package's did not, so a
- * corrupt or mid-upload `size` row rendered as a confident, wrong "0 B"
- * instead of an honest "size unknown").
- */
-declare function formatFileSize(bytes: number | null | undefined): string;
 interface UploadProgressListProps {
     uploads: MediaUploadEntry[];
     /** Remove an entry from the tray (wire to `useMediaUpload().clearEntry`). */
@@ -350,4 +340,4 @@ interface MediaLightboxProps {
 }
 declare function MediaLightbox({ open, onClose, mediaRef, fileName, alt, as, autoPlay, playsInline, poster, playbackLabel, actions, hideUnavailableActions, headerExtra, className, }: MediaLightboxProps): react.JSX.Element | null;
 
-export { AlertCircleIcon, ArchiveIcon, BracesIcon, CheckCircle2Icon, CheckIcon, CodeIcon, CopyIcon, DatabaseIcon, DownloadIcon, ExternalLinkIcon, FileAudioIcon, FileCodeIcon, FileIcon, type FileIconProps, FileJsonIcon, FileSpreadsheetIcon, FileTextIcon, FileTypeIcon, FileUploadDropzone, type FileUploadDropzoneActions, type FileUploadDropzoneProps, FileVideoIcon, FolderIcon, FolderOpenIcon, GlobeIcon, ImageIcon, ImageOffIcon, InlineMediaRef, type InlineMediaRefFit, type InlineMediaRefProps, type InlineMediaRefSize, Link2Icon, MediaActionToolbar, type MediaActionToolbarProps, type MediaDropzoneOptions, type MediaDropzoneState, type MediaIconProps, MediaLightbox, type MediaLightboxProps, MediaThumbnail, type MediaThumbnailProps, MusicIcon, PackageBoxIcon, PenToolIcon, PlusIcon, SearchIcon, Settings2Icon, Share2Icon, SpinnerIcon, SubtitlesIcon, UploadIcon, UploadProgressList, type UploadProgressListProps, VideoIcon, VideoOffIcon, VolumeXIcon, XIcon, cn, formatFileSize, useMediaDropzone };
+export { AlertCircleIcon, ArchiveIcon, BracesIcon, CheckCircle2Icon, CheckIcon, CodeIcon, CopyIcon, DatabaseIcon, DownloadIcon, ExternalLinkIcon, FileAudioIcon, FileCodeIcon, FileIcon, type FileIconProps, FileJsonIcon, FileSpreadsheetIcon, FileTextIcon, FileTypeIcon, FileUploadDropzone, type FileUploadDropzoneActions, type FileUploadDropzoneProps, FileVideoIcon, FolderIcon, FolderOpenIcon, GlobeIcon, ImageIcon, ImageOffIcon, InlineMediaRef, type InlineMediaRefFit, type InlineMediaRefProps, type InlineMediaRefSize, Link2Icon, MediaActionToolbar, type MediaActionToolbarProps, type MediaDropzoneOptions, type MediaDropzoneState, type MediaIconProps, MediaLightbox, type MediaLightboxProps, MediaThumbnail, type MediaThumbnailProps, MusicIcon, PackageBoxIcon, PenToolIcon, PlusIcon, SearchIcon, Settings2Icon, Share2Icon, SpinnerIcon, SubtitlesIcon, UploadIcon, UploadProgressList, type UploadProgressListProps, VideoIcon, VideoOffIcon, VolumeXIcon, XIcon, cn, useMediaDropzone };

package/dist/react.d.ts

@@ -280,16 +280,6 @@ interface FileUploadDropzoneProps {
 }
 declare function FileUploadDropzone({ uploadOptions, accept, maxSize, enablePaste, mode, children, className, actions, onUploadStart, onUploaded, onError, onOpenFile, pickerEventName, }: FileUploadDropzoneProps): react.JSX.Element;
 
-/**
- * Human file size.
- *
- * `null` / `undefined` / NaN / negative collapse to an em-dash, NOT to
- * "0 B" (fixed at 0.4.0 while absorbing the viewer bodies — matrx-frontend's
- * `formatFileSize` already had this guard and the package's did not, so a
- * corrupt or mid-upload `size` row rendered as a confident, wrong "0 B"
- * instead of an honest "size unknown").
- */
-declare function formatFileSize(bytes: number | null | undefined): string;
 interface UploadProgressListProps {
     uploads: MediaUploadEntry[];
     /** Remove an entry from the tray (wire to `useMediaUpload().clearEntry`). */
@@ -350,4 +340,4 @@ interface MediaLightboxProps {
 }
 declare function MediaLightbox({ open, onClose, mediaRef, fileName, alt, as, autoPlay, playsInline, poster, playbackLabel, actions, hideUnavailableActions, headerExtra, className, }: MediaLightboxProps): react.JSX.Element | null;
 
-export { AlertCircleIcon, ArchiveIcon, BracesIcon, CheckCircle2Icon, CheckIcon, CodeIcon, CopyIcon, DatabaseIcon, DownloadIcon, ExternalLinkIcon, FileAudioIcon, FileCodeIcon, FileIcon, type FileIconProps, FileJsonIcon, FileSpreadsheetIcon, FileTextIcon, FileTypeIcon, FileUploadDropzone, type FileUploadDropzoneActions, type FileUploadDropzoneProps, FileVideoIcon, FolderIcon, FolderOpenIcon, GlobeIcon, ImageIcon, ImageOffIcon, InlineMediaRef, type InlineMediaRefFit, type InlineMediaRefProps, type InlineMediaRefSize, Link2Icon, MediaActionToolbar, type MediaActionToolbarProps, type MediaDropzoneOptions, type MediaDropzoneState, type MediaIconProps, MediaLightbox, type MediaLightboxProps, MediaThumbnail, type MediaThumbnailProps, MusicIcon, PackageBoxIcon, PenToolIcon, PlusIcon, SearchIcon, Settings2Icon, Share2Icon, SpinnerIcon, SubtitlesIcon, UploadIcon, UploadProgressList, type UploadProgressListProps, VideoIcon, VideoOffIcon, VolumeXIcon, XIcon, cn, formatFileSize, useMediaDropzone };
+export { AlertCircleIcon, ArchiveIcon, BracesIcon, CheckCircle2Icon, CheckIcon, CodeIcon, CopyIcon, DatabaseIcon, DownloadIcon, ExternalLinkIcon, FileAudioIcon, FileCodeIcon, FileIcon, type FileIconProps, FileJsonIcon, FileSpreadsheetIcon, FileTextIcon, FileTypeIcon, FileUploadDropzone, type FileUploadDropzoneActions, type FileUploadDropzoneProps, FileVideoIcon, FolderIcon, FolderOpenIcon, GlobeIcon, ImageIcon, ImageOffIcon, InlineMediaRef, type InlineMediaRefFit, type InlineMediaRefProps, type InlineMediaRefSize, Link2Icon, MediaActionToolbar, type MediaActionToolbarProps, type MediaDropzoneOptions, type MediaDropzoneState, type MediaIconProps, MediaLightbox, type MediaLightboxProps, MediaThumbnail, type MediaThumbnailProps, MusicIcon, PackageBoxIcon, PenToolIcon, PlusIcon, SearchIcon, Settings2Icon, Share2Icon, SpinnerIcon, SubtitlesIcon, UploadIcon, UploadProgressList, type UploadProgressListProps, VideoIcon, VideoOffIcon, VolumeXIcon, XIcon, cn, useMediaDropzone };

package/dist/react.js

@@ -465,11 +465,11 @@ function FileIcon2({
 
 // src/react/inline-media-ref.tsx
 import {
-  useCallback as useCallback2,
-  useEffect as useEffect4,
+  useCallback as useCallback3,
+  useEffect as useEffect5,
   useMemo as useMemo2,
-  useRef as useRef3,
-  useState as useState3
+  useRef as useRef4,
+  useState as useState4
 } from "react";
 
 // src/core/context.ts
@@ -620,8 +620,83 @@ function useMediaBlob(ref) {
   };
 }
 
+// src/core/use-media-blob-load-recovery.ts
+import { useCallback as useCallback2, useEffect as useEffect2, useRef as useRef2, useState as useState2 } from "react";
+function useMediaBlobLoadRecovery(ref, source, options) {
+  const client = useMediaClient();
+  const capture = useMediaFailureCapture();
+  const refKey = stableRefKey(ref);
+  const [failed, setFailed] = useState2(false);
+  const attemptRef = useRef2(0);
+  const recoveryInFlightRef = useRef2(false);
+  const onRetry = options.onRetry;
+  const onTerminal = options.onTerminal;
+  useEffect2(() => {
+    attemptRef.current = 0;
+    recoveryInFlightRef.current = false;
+    setFailed(false);
+  }, [refKey]);
+  useEffect2(() => {
+    recoveryInFlightRef.current = false;
+  }, [source]);
+  const finishTerminal = useCallback2(
+    (event, attempt, message) => {
+      setFailed(true);
+      capture({
+        phase: "element-load",
+        mediaRef: failureMediaIdentity(ref ?? null, source),
+        terminal: true,
+        retryOutcome: attempt > 1 ? "retried" : "not-attempted",
+        message
+      });
+      onTerminal?.(event);
+    },
+    [capture, onTerminal, ref, source]
+  );
+  const onLoadError = useCallback2(
+    (event) => {
+      if (recoveryInFlightRef.current || !source) return;
+      recoveryInFlightRef.current = true;
+      attemptRef.current += 1;
+      const attempt = attemptRef.current;
+      const recover = client.recoverBlobLoadError;
+      if (!ref || !recover) {
+        finishTerminal(
+          event,
+          attempt,
+          "blob-backed media element failed to load and the client exposes no object-URL recovery policy"
+        );
+        return;
+      }
+      recover(ref, attempt).then(
+        (verdict) => {
+          if (verdict === "retry") {
+            setFailed(false);
+            onRetry();
+            return;
+          }
+          finishTerminal(
+            event,
+            attempt,
+            attempt > 1 ? "blob-backed media element failed after the client-approved re-read" : "blob-backed media recovery was declined on the first attempt"
+          );
+        },
+        (err) => {
+          finishTerminal(
+            event,
+            attempt,
+            `blob-backed media recovery failed: ${err instanceof Error ? err.message : String(err ?? "unknown error")}`
+          );
+        }
+      );
+    },
+    [client, finishTerminal, onRetry, ref, source]
+  );
+  return { onLoadError, failed };
+}
+
 // src/core/use-media-load-recovery.ts
-import { useEffect as useEffect2, useLayoutEffect, useRef as useRef2, useState as useState2 } from "react";
+import { useEffect as useEffect3, useLayoutEffect, useRef as useRef3, useState as useState3 } from "react";
 
 // src/types.ts
 function mintDurableSrc(url) {
@@ -639,10 +714,10 @@ function useMediaLoadRecovery(src, options) {
   const recoverable = options?.recoverable !== false;
   const onTerminal = options?.onTerminal;
   const failureRef = options?.failureRef;
-  const [result, setResult] = useState2({ source: src, retryKey: 0, failed: false });
-  const attemptRef = useRef2(0);
-  const recoveryInFlightRef = useRef2(false);
-  useEffect2(() => {
+  const [result, setResult] = useState3({ source: src, retryKey: 0, failed: false });
+  const attemptRef = useRef3(0);
+  const recoveryInFlightRef = useRef3(false);
+  useEffect3(() => {
     attemptRef.current = 0;
     recoveryInFlightRef.current = false;
   }, [src]);
@@ -720,7 +795,7 @@ function useMediaLoadRecovery(src, options) {
 }
 
 // src/core/use-media-resolution.ts
-import { useEffect as useEffect3, useMemo } from "react";
+import { useEffect as useEffect4, useMemo } from "react";
 function useMediaResolution(ref) {
   const client = useMediaClient();
   const capture = useMediaFailureCapture();
@@ -755,7 +830,7 @@ function useMediaResolution(ref) {
       };
     }
   }, [client, refKey]);
-  useEffect3(() => {
+  useEffect4(() => {
     if (state.status !== "unavailable") return;
     capture({
       phase: "resolve",
@@ -810,7 +885,7 @@ function prettifyUrl(url) {
 }
 var INERT_PLAYBACK = {
   useMediaElementSink(forward) {
-    return useCallback2(
+    return useCallback3(
       (node) => {
         if (!forward) return;
         if (typeof forward === "function") forward(node);
@@ -861,7 +936,7 @@ function InformativeErrorFallback({
 }) {
   const capture = useMediaFailureCapture();
   const identity = failureMediaIdentity(mediaRef ?? null, url);
-  useEffect4(() => {
+  useEffect5(() => {
     capture({
       phase: failurePhase,
       mediaRef: identity,
@@ -925,10 +1000,10 @@ function InformativeErrorPanel({
   icon,
   tooltip
 }) {
-  const [copied, setCopied] = useState3(false);
+  const [copied, setCopied] = useState4(false);
   const isFill = dimensions === "fill";
   const { host, tail } = prettifyUrl(url);
-  const handleCopy = useCallback2(
+  const handleCopy = useCallback3(
     (event) => {
       event.stopPropagation();
       event.preventDefault();
@@ -1045,16 +1120,25 @@ function InlineMediaRef({
   );
   const blob = useMediaBlob(needsBlob ? mediaRef : null);
   const url = needsBlob ? blob.url : resolution?.src ?? null;
+  const terminalCallback = (event) => onError?.(
+    event
+  );
   const recovery = useMediaLoadRecovery(url, {
-    recoverable: !needsBlob && resolution?.recoverable !== false,
+    recoverable: resolution?.recoverable !== false,
     failureRef: mediaRef,
-    onTerminal: (event) => onError?.(
-      event
-    )
+    onTerminal: terminalCallback
   });
+  const blobRecovery = useMediaBlobLoadRecovery(
+    needsBlob ? mediaRef : null,
+    needsBlob ? url : null,
+    {
+      onRetry: blob.retry,
+      onTerminal: terminalCallback
+    }
+  );
   const playback = ports.playbackSession ?? INERT_PLAYBACK;
-  const sessionElRef = useRef3(null);
-  const [isMediaPlaying, setIsMediaPlaying] = useState3(false);
+  const sessionElRef = useRef4(null);
+  const [isMediaPlaying, setIsMediaPlaying] = useState4(false);
   const portSinkRef = playback.useMediaElementSink(
     mediaElementRef
   );
@@ -1085,8 +1169,10 @@ function InlineMediaRef({
   const mediaResolutionError = status === "unavailable" ? reason ?? "unknown" : blob.error ?? null;
   const dimensions = resolveDimensions(size);
   const isFill = dimensions === "fill";
-  const hasLoadError = recovery.failed;
-  const handleLoadError = recovery.onLoadError;
+  const activeRecovery = needsBlob ? blobRecovery : recovery;
+  const retryKey = needsBlob ? 0 : recovery.retryKey;
+  const hasLoadError = activeRecovery.failed;
+  const handleLoadError = activeRecovery.onLoadError;
   const defaultIcon = elementType === "video" ? /* @__PURE__ */ jsx3(FileVideoIcon, { className: "h-1/2 w-1/2" }) : elementType === "audio" ? /* @__PURE__ */ jsx3(FileAudioIcon, { className: "h-1/2 w-1/2" }) : mediaRef ? /* @__PURE__ */ jsx3(ImageIcon, { className: "h-1/2 w-1/2" }) : /* @__PURE__ */ jsx3(FileIcon, { className: "h-1/2 w-1/2" });
   const unresolvedDisplayUrl = mediaRef && typeof mediaRef === "object" && mediaRef.file_id ? `file:${mediaRef.file_id}` : "unresolved-media";
   if (!url) {
@@ -1222,7 +1308,7 @@ function InlineMediaRef({
         ...mediaSessionEvents,
         ...interactiveProps
       },
-      recovery.retryKey
+      retryKey
     );
   }
   if (elementType === "audio") {
@@ -1243,7 +1329,7 @@ function InlineMediaRef({
         crossOrigin,
         ...interactiveProps
       },
-      recovery.retryKey
+      retryKey
     );
   }
   const needsPlainImg = !!onLoad || !!mediaElementRef || !!crossOrigin;
@@ -1261,7 +1347,7 @@ function InlineMediaRef({
         onError: handleLoadError,
         ...interactiveProps
       },
-      recovery.retryKey
+      retryKey
     );
   }
   return /* @__PURE__ */ jsx3(
@@ -1277,12 +1363,12 @@ function InlineMediaRef({
       crossOrigin,
       ...interactiveProps
     },
-    recovery.retryKey
+    retryKey
   );
 }
 
 // src/react/media-thumbnail.tsx
-import { useEffect as useEffect5, useRef as useRef4 } from "react";
+import { useEffect as useEffect6, useRef as useRef5 } from "react";
 
 // src/core/use-thumbnail-source.ts
 import { useMemo as useMemo3 } from "react";
@@ -1440,8 +1526,8 @@ function VideoPosterThumb({
     recoverable,
     failureRef: mediaRef
   });
-  const ref = useRef4(null);
-  useEffect5(() => {
+  const ref = useRef5(null);
+  useEffect6(() => {
     const v = ref.current;
     if (!v) return void 0;
     const onMeta = () => {
@@ -1471,11 +1557,11 @@ function VideoPosterThumb({
 
 // src/react/use-media-dropzone.ts
 import {
-  useCallback as useCallback3,
-  useEffect as useEffect6,
+  useCallback as useCallback4,
+  useEffect as useEffect7,
   useMemo as useMemo4,
-  useRef as useRef5,
-  useState as useState4
+  useRef as useRef6,
+  useState as useState5
 } from "react";
 function matchesAccept(file, accept) {
   if (!accept || accept.length === 0) return true;
@@ -1500,16 +1586,16 @@ function useMediaDropzone(options) {
     disabled = false,
     multiple = true
   } = options;
-  const [isDragActive, setIsDragActive] = useState4(false);
-  const [pasteHighlight, setPasteHighlight] = useState4(false);
-  const dragDepth = useRef5(0);
-  const inputRef = useRef5(null);
-  const onFilesRef = useRef5(onFiles);
+  const [isDragActive, setIsDragActive] = useState5(false);
+  const [pasteHighlight, setPasteHighlight] = useState5(false);
+  const dragDepth = useRef6(0);
+  const inputRef = useRef6(null);
+  const onFilesRef = useRef6(onFiles);
   onFilesRef.current = onFiles;
-  const onRejectedRef = useRef5(onRejected);
+  const onRejectedRef = useRef6(onRejected);
   onRejectedRef.current = onRejected;
   const acceptKey = accept?.join(",") ?? "";
-  const filterFiles = useCallback3(
+  const filterFiles = useCallback4(
     (files) => {
       const accepted = [];
       const rejected = [];
@@ -1527,23 +1613,23 @@ function useMediaDropzone(options) {
     },
     [acceptKey, maxSize]
   );
-  const emit = useCallback3(
+  const emit = useCallback4(
     (files) => {
       const accepted = filterFiles(files);
       if (accepted.length) onFilesRef.current(accepted);
     },
     [filterFiles]
   );
-  const openPicker = useCallback3(() => {
+  const openPicker = useCallback4(() => {
     if (!disabled) inputRef.current?.click();
   }, [disabled]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (!pickerEventName || typeof window === "undefined") return void 0;
     const handler = () => openPicker();
     window.addEventListener(pickerEventName, handler);
     return () => window.removeEventListener(pickerEventName, handler);
   }, [openPicker, pickerEventName]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (!enablePaste || disabled || typeof window === "undefined") {
       return void 0;
     }
@@ -1569,7 +1655,7 @@ function useMediaDropzone(options) {
     window.addEventListener("paste", handler);
     return () => window.removeEventListener("paste", handler);
   }, [enablePaste, disabled, emit]);
-  const getRootProps = useCallback3(
+  const getRootProps = useCallback4(
     () => ({
       onDragEnter: (event) => {
         if (disabled) return;
@@ -1602,7 +1688,7 @@ function useMediaDropzone(options) {
     () => acceptKey.length ? acceptKey : void 0,
     [acceptKey]
   );
-  const getInputProps = useCallback3(
+  const getInputProps = useCallback4(
     () => ({
       ref: (node) => {
         inputRef.current = node;
@@ -1624,20 +1710,20 @@ function useMediaDropzone(options) {
 }
 
 // src/react/file-upload-dropzone.tsx
-import { useCallback as useCallback5 } from "react";
+import { useCallback as useCallback6 } from "react";
 
 // src/core/use-media-upload.ts
-import { useCallback as useCallback4, useRef as useRef6, useState as useState5 } from "react";
+import { useCallback as useCallback5, useRef as useRef7, useState as useState6 } from "react";
 var entrySeq = 0;
 function useMediaUpload() {
   const client = useMediaClient();
-  const [uploading, setUploading] = useState5(false);
-  const [progress, setProgress] = useState5(null);
-  const [result, setResult] = useState5(null);
-  const [error, setError] = useState5(null);
-  const [entries, setEntries] = useState5([]);
-  const activeCount = useRef6(0);
-  const patchEntry = useCallback4(
+  const [uploading, setUploading] = useState6(false);
+  const [progress, setProgress] = useState6(null);
+  const [result, setResult] = useState6(null);
+  const [error, setError] = useState6(null);
+  const [entries, setEntries] = useState6([]);
+  const activeCount = useRef7(0);
+  const patchEntry = useCallback5(
     (id, patch) => {
       setEntries(
         (current) => current.map((e) => e.id === id ? { ...e, ...patch } : e)
@@ -1645,7 +1731,7 @@ function useMediaUpload() {
     },
     []
   );
-  const upload = useCallback4(
+  const upload = useCallback5(
     async (file, opts = {}) => {
       const id = `up-${++entrySeq}`;
       const fileName = opts.fileName ?? (file instanceof File ? file.name : "file");
@@ -1699,7 +1785,7 @@ function useMediaUpload() {
     },
     [client, patchEntry]
   );
-  const uploadMany = useCallback4(
+  const uploadMany = useCallback5(
     async (files, opts = {}) => {
       if (client.uploadMany) {
         activeCount.current += 1;
@@ -1728,10 +1814,10 @@ function useMediaUpload() {
     },
     [client, upload]
   );
-  const clearEntry = useCallback4((id) => {
+  const clearEntry = useCallback5((id) => {
     setEntries((current) => current.filter((e) => e.id !== id));
   }, []);
-  const reset = useCallback4(() => {
+  const reset = useCallback5(() => {
     setResult(null);
     setError(null);
     setProgress(null);
@@ -1751,37 +1837,26 @@ function useMediaUpload() {
 }
 
 // src/react/upload-progress-list.tsx
-import { memo, useEffect as useEffect7, useRef as useRef7, useState as useState6 } from "react";
+import { memo, useEffect as useEffect8, useRef as useRef8, useState as useState7 } from "react";
+import { formatFileSize } from "@ai-matrx/kit/format";
 import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
 var AUTO_DISMISS_MS = 1e4;
-function formatFileSize(bytes) {
-  if (bytes == null || !Number.isFinite(bytes) || bytes < 0) return "\u2014";
-  if (bytes < 1024) return `${bytes} B`;
-  const units = ["KB", "MB", "GB", "TB"];
-  let value = bytes;
-  let unit = -1;
-  do {
-    value /= 1024;
-    unit += 1;
-  } while (value >= 1024 && unit < units.length - 1);
-  return `${value >= 10 ? Math.round(value) : value.toFixed(1)} ${units[unit] ?? "TB"}`;
-}
 function UploadProgressListImpl({
   uploads,
   onDismiss,
   onOpenFile,
   className
 }) {
-  const [hovered, setHovered] = useState6(false);
+  const [hovered, setHovered] = useState7(false);
   const activeCount = uploads.filter((u) => u.status === "uploading").length;
   const successCount = uploads.filter((u) => u.status === "success").length;
   const errorCount = uploads.filter((u) => u.status === "error").length;
-  const timersRef = useRef7(
+  const timersRef = useRef8(
     /* @__PURE__ */ new Map()
   );
-  const onDismissRef = useRef7(onDismiss);
+  const onDismissRef = useRef8(onDismiss);
   onDismissRef.current = onDismiss;
-  useEffect7(() => {
+  useEffect8(() => {
     const timers = timersRef.current;
     if (hovered) {
       timers.forEach((t) => clearTimeout(t));
@@ -1809,7 +1884,7 @@ function UploadProgressListImpl({
       }
     }
   }, [uploads, hovered]);
-  useEffect7(() => {
+  useEffect8(() => {
     const timers = timersRef.current;
     return () => {
       timers.forEach((t) => clearTimeout(t));
@@ -1941,7 +2016,7 @@ function FileUploadDropzone({
   pickerEventName
 }) {
   const { uploadMany, entries, clearEntry } = useMediaUpload();
-  const handleUpload = useCallback5(
+  const handleUpload = useCallback6(
     async (files) => {
       if (!files.length) return;
       try {
@@ -2048,22 +2123,22 @@ function FileUploadDropzone({
 }
 
 // src/react/media-action-toolbar.tsx
-import { useState as useState8 } from "react";
+import { useState as useState9 } from "react";
 
 // src/core/use-media-actions.ts
-import { useCallback as useCallback6, useMemo as useMemo5, useState as useState7 } from "react";
+import { useCallback as useCallback7, useMemo as useMemo5, useState as useState8 } from "react";
 function useMediaActions(ref, options = {}) {
   const ports = useMediaHostPorts();
   const { resolution } = useMediaResolution(ref);
-  const [busy, setBusy] = useState7(null);
-  const [lastError, setLastError] = useState7(null);
+  const [busy, setBusy] = useState8(null);
+  const [lastError, setLastError] = useState8(null);
   const actions = ports.actions;
   const { fileName, alt } = options;
   const context = useMemo5(() => {
     if (!ref) return null;
     return { ref, resolution, fileName, alt };
   }, [ref, resolution, fileName, alt]);
-  const isAvailable = useCallback6(
+  const isAvailable = useCallback7(
     (kind) => {
       if (!context || !actions) return false;
       if (kind === "share") return Boolean(actions.share || actions.SharePopover);
@@ -2071,7 +2146,7 @@ function useMediaActions(ref, options = {}) {
     },
     [context, actions]
   );
-  const run = useCallback6(
+  const run = useCallback7(
     async (kind) => {
       if (!context || !actions) return;
       const handler = actions[kind];
@@ -2120,7 +2195,7 @@ function MediaActionToolbar({
   buttonClassName
 }) {
   const state = useMediaActions(mediaRef, { fileName, alt });
-  const [shareOpen, setShareOpen] = useState8(false);
+  const [shareOpen, setShareOpen] = useState9(false);
   const SharePopover = state.SharePopover;
   const visible = hideUnavailable ? actions.filter((kind) => state.isAvailable(kind)) : actions;
   if (visible.length === 0) return null;
@@ -2177,7 +2252,7 @@ function MediaActionToolbar({
 }
 
 // src/react/media-lightbox.tsx
-import { useEffect as useEffect8 } from "react";
+import { useEffect as useEffect9 } from "react";
 import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 function MediaLightbox({
   open,
@@ -2195,7 +2270,7 @@ function MediaLightbox({
   headerExtra,
   className
 }) {
-  useEffect8(() => {
+  useEffect9(() => {
     if (!open || typeof window === "undefined") return void 0;
     const handler = (event) => {
       if (event.key === "Escape") {
@@ -2327,7 +2402,6 @@ export {
   VolumeXIcon,
   XIcon,
   cn,
-  formatFileSize,
   useMediaDropzone
 };
 //# sourceMappingURL=react.js.map