@ai-matrx/media 0.4.5 → 0.5.1

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

@@ -1392,7 +1392,9 @@ function useThumbnailSource(ref, options = {}) {
       mode: "thumbnail",
       loading: false,
       resolution,
-      recoverable: explicitThumb.recoverable !== false
+      recoverable: explicitThumb.recoverable !== false,
+      blobBacked: false,
+      retryBlob: blob.retry
     };
   }
   if (resolution?.thumbnailSrc) {
@@ -1401,7 +1403,9 @@ function useThumbnailSource(ref, options = {}) {
       mode: "thumbnail",
       loading: false,
       resolution,
-      recoverable: resolution.recoverable !== false
+      recoverable: resolution.recoverable !== false,
+      blobBacked: false,
+      retryBlob: blob.retry
     };
   }
   if (allowSourceFallback && resolution) {
@@ -1411,7 +1415,9 @@ function useThumbnailSource(ref, options = {}) {
         mode: blob.url ? resolution.kind === "video" ? "live-video-poster" : "live-image" : "icon",
         loading: blob.loading,
         resolution,
-        recoverable: false
+        recoverable: false,
+        blobBacked: true,
+        retryBlob: blob.retry
       };
     }
     if (resolution.kind === "image") {
@@ -1420,7 +1426,9 @@ function useThumbnailSource(ref, options = {}) {
         mode: "live-image",
         loading: false,
         resolution,
-        recoverable: resolution.recoverable !== false
+        recoverable: resolution.recoverable !== false,
+        blobBacked: false,
+        retryBlob: blob.retry
       };
     }
     if (resolution.kind === "video") {
@@ -1429,7 +1437,9 @@ function useThumbnailSource(ref, options = {}) {
         mode: "live-video-poster",
         loading: false,
         resolution,
-        recoverable: resolution.recoverable !== false
+        recoverable: resolution.recoverable !== false,
+        blobBacked: false,
+        retryBlob: blob.retry
       };
     }
   }
@@ -1438,7 +1448,9 @@ function useThumbnailSource(ref, options = {}) {
     mode: "icon",
     loading: false,
     resolution,
-    recoverable: false
+    recoverable: false,
+    blobBacked: false,
+    retryBlob: blob.retry
   };
 }
 
@@ -1468,6 +1480,8 @@ function MediaThumbnail({
           url: source.src,
           mediaRef,
           recoverable: source.recoverable,
+          blobBacked: source.blobBacked,
+          retryBlob: source.retryBlob,
           fallback
         }
       );
@@ -1479,6 +1493,8 @@ function MediaThumbnail({
           alt: fileName,
           mediaRef,
           recoverable: source.recoverable,
+          blobBacked: source.blobBacked,
+          retryBlob: source.retryBlob,
           fallback
         }
       );
@@ -1497,13 +1513,21 @@ function ImageThumb({
   alt,
   mediaRef,
   recoverable,
+  blobBacked,
+  retryBlob,
   fallback
 }) {
   const { retryKey, onLoadError, failed } = useMediaLoadRecovery(url, {
     recoverable,
     failureRef: mediaRef
   });
-  if (failed) return /* @__PURE__ */ jsx4(Fragment2, { children: fallback });
+  const blobRecovery = useMediaBlobLoadRecovery(
+    blobBacked ? mediaRef : null,
+    blobBacked ? url : null,
+    { onRetry: retryBlob }
+  );
+  const activeRecovery = blobBacked ? { retryKey: 0, ...blobRecovery } : { retryKey, onLoadError, failed };
+  if (activeRecovery.failed) return /* @__PURE__ */ jsx4(Fragment2, { children: fallback });
   return /* @__PURE__ */ jsx4(
     "img",
     {
@@ -1511,21 +1535,29 @@ function ImageThumb({
       alt,
       loading: url.startsWith("blob:") ? "eager" : "lazy",
       className: "h-full w-full object-cover",
-      onError: onLoadError
+      onError: activeRecovery.onLoadError
     },
-    retryKey
+    activeRecovery.retryKey
   );
 }
 function VideoPosterThumb({
   url,
   mediaRef,
   recoverable,
+  blobBacked,
+  retryBlob,
   fallback
 }) {
   const { retryKey, onLoadError, failed } = useMediaLoadRecovery(url, {
     recoverable,
     failureRef: mediaRef
   });
+  const blobRecovery = useMediaBlobLoadRecovery(
+    blobBacked ? mediaRef : null,
+    blobBacked ? url : null,
+    { onRetry: retryBlob }
+  );
+  const activeRecovery = blobBacked ? { retryKey: 0, ...blobRecovery } : { retryKey, onLoadError, failed };
   const ref = useRef5(null);
   useEffect6(() => {
     const v = ref.current;
@@ -1539,7 +1571,7 @@ function VideoPosterThumb({
     v.addEventListener("loadedmetadata", onMeta);
     return () => v.removeEventListener("loadedmetadata", onMeta);
   }, []);
-  if (failed) return /* @__PURE__ */ jsx4(Fragment2, { children: fallback });
+  if (activeRecovery.failed) return /* @__PURE__ */ jsx4(Fragment2, { children: fallback });
   return /* @__PURE__ */ jsx4(
     "video",
     {
@@ -1549,9 +1581,9 @@ function VideoPosterThumb({
       preload: "metadata",
       muted: true,
       playsInline: true,
-      onError: onLoadError
+      onError: activeRecovery.onLoadError
     },
-    retryKey
+    activeRecovery.retryKey
   );
 }
 
@@ -1838,20 +1870,9 @@ function useMediaUpload() {
 
 // src/react/upload-progress-list.tsx
 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,
@@ -2413,7 +2434,6 @@ export {
   VolumeXIcon,
   XIcon,
   cn,
-  formatFileSize,
   useMediaDropzone
 };
 //# sourceMappingURL=react.js.map