@orthacms/media-admin 0.0.0-reserve.0

package/dist/lib/pages/MediaLibraryPage/index.js

@@ -0,0 +1,425 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useState } from 'react';
+import { defineMessages, useIntl } from 'react-intl';
+import { Button, ConfirmDialog, Drawer, DrawerContent, DrawerTitle, cn, toast } from '@orthacms/design-system';
+import { PanelLeft } from 'lucide-react';
+import { useHasPermission } from '@orthacms/identity-admin';
+import { MEDIA_CREATE, MEDIA_DELETE, MEDIA_READ, MEDIA_UPDATE, ROOT_FOLDER_ID } from '../../constants';
+import { useMediaLibrary } from '../../hooks/useMediaLibrary';
+import { MediaFoldersNav } from '../../components/MediaFoldersNav';
+import { MediaTopBar } from '../../components/MediaTopBar';
+import { MediaToolbar } from '../../components/MediaToolbar';
+import { MediaSelectionBar } from '../../components/MediaSelectionBar';
+import { MediaUploadBanner } from '../../components/MediaUploadBanner';
+import { MediaGrid } from '../../components/MediaGrid';
+import { MediaPagination } from '../../components/MediaPagination';
+import { MediaEmptyState } from '../../components/MediaEmptyState';
+import { AssetDetailDrawer } from '../../components/AssetDetailDrawer';
+import { NewFolderDialog } from '../../components/NewFolderDialog';
+import { RenameDialog } from '../../components/RenameDialog';
+import { MoveAssetsDialog } from '../../components/MoveAssetsDialog';
+import { UploadDialog } from '../../components/UploadDialog';
+import { folderContents } from '../../utils/folderContents';
+import { useDocumentTitle } from '@orthacms/utils-admin';
+/** Intl descriptors for the Media Library page + its toasts, co-located. */
+const messages = defineMessages({
+    title: { id: 'media.page.title', defaultMessage: 'Media Library' },
+    subtitle: {
+        id: 'media.page.subtitle',
+        defaultMessage: '{count, plural, one {# item} other {# items}} in {location}'
+    },
+    allMedia: { id: 'media.page.allMedia', defaultMessage: 'All media' },
+    noAccess: {
+        id: 'media.page.noAccess',
+        defaultMessage: 'You don’t have permission to view the media library.'
+    },
+    loadError: {
+        id: 'media.page.loadError',
+        defaultMessage: 'We couldn’t load the media library.'
+    },
+    retry: { id: 'media.page.retry', defaultMessage: 'Try again' },
+    openNav: { id: 'media.page.openNav', defaultMessage: 'Folders' },
+    navTitle: {
+        id: 'media.page.navTitle',
+        defaultMessage: 'Folder navigation'
+    },
+    selection: {
+        id: 'media.page.selection',
+        defaultMessage: '{count, plural, =0 {No items selected} one {# item selected} other {# items selected}}'
+    },
+    deleteAssetsTitle: {
+        id: 'media.page.deleteAssetsTitle',
+        defaultMessage: 'Delete {count, plural, one {# item} other {# items}}?'
+    },
+    deleteAssetsBody: {
+        id: 'media.page.deleteAssetsBody',
+        defaultMessage: 'This can’t be undone. The selected assets will be permanently removed.'
+    },
+    deleteFolderTitle: {
+        id: 'media.page.deleteFolderTitle',
+        defaultMessage: 'Delete “{name}”?'
+    },
+    deleteFolderTitleFull: {
+        id: 'media.page.deleteFolderTitleFull',
+        defaultMessage: 'Delete “{name}” and everything inside?'
+    },
+    deleteFolderBody: {
+        id: 'media.page.deleteFolderBody',
+        defaultMessage: 'This folder is empty. It will be permanently removed — this can’t be undone.'
+    },
+    /**
+     * Names exactly what goes with the folder. Both counts are always spelled
+     * out (`=0` included) so the sentence reads the same shape however the
+     * folder is filled, and nobody has to infer that "3 assets" also means the
+     * subfolders they sit in.
+     */
+    deleteFolderBodyFull: {
+        id: 'media.page.deleteFolderBodyFull',
+        defaultMessage: 'Deleting it also deletes {assets, plural, =0 {no assets} one {# asset} other {# assets}} and {folders, plural, =0 {no subfolders} one {# subfolder} other {# subfolders}} inside it. This can’t be undone.'
+    },
+    confirmDelete: { id: 'media.page.confirmDelete', defaultMessage: 'Delete' },
+    // toasts
+    tCreated: {
+        id: 'media.page.toast.created',
+        defaultMessage: 'Folder “{name}” created'
+    },
+    tRenamed: {
+        id: 'media.page.toast.renamed',
+        defaultMessage: 'Renamed to “{name}”'
+    },
+    tDuplicated: {
+        id: 'media.page.toast.duplicated',
+        defaultMessage: '{count, plural, one {# asset duplicated} other {# assets duplicated}}'
+    },
+    tMoved: {
+        id: 'media.page.toast.moved',
+        defaultMessage: '{count, plural, one {# asset moved} other {# assets moved}}'
+    },
+    tDeletedAssets: {
+        id: 'media.page.toast.deletedAssets',
+        defaultMessage: '{count, plural, one {# asset deleted} other {# assets deleted}}'
+    },
+    tDeletedFolder: {
+        id: 'media.page.toast.deletedFolder',
+        defaultMessage: 'Folder “{name}” deleted'
+    },
+    tDownload: {
+        id: 'media.page.toast.download',
+        defaultMessage: 'Downloading “{name}”'
+    },
+    tCopied: {
+        id: 'media.page.toast.copied',
+        defaultMessage: 'Link copied to clipboard'
+    },
+    tCopyFailed: {
+        id: 'media.page.toast.copyFailed',
+        defaultMessage: 'Couldn’t copy the link'
+    },
+    tAltSaved: {
+        id: 'media.page.toast.altSaved',
+        defaultMessage: 'Alt text saved'
+    },
+    assetsRegion: { id: 'media.page.assetsRegion', defaultMessage: 'Assets' }
+});
+/**
+ * How long a confirmed delete keeps trying to hold focus on the grid.
+ *
+ * Two overlays unwind after a delete and each restores focus to its own
+ * trigger, both of which sat on the tile that just went away — so whichever
+ * settles last can drop focus on `<body>` well after the dialog closed. The
+ * window is generous because that timing moves with machine load; nothing is
+ * taken from a control the user actually focused, so a long window costs
+ * nothing.
+ */
+const FOCUS_RECLAIM_MS = 1_000;
+/**
+ * The Media Library, mounted inside the workspace shell at
+ * `/workspaces/:id/media`. `useMediaLibrary` is the store — folders and the open
+ * folder's assets come from `@orthacms/media-server`, and every action (browse
+ * folders, upload, create folder, rename, duplicate, move, delete, filter, sort,
+ * open the detail drawer) runs against the API, firing a toast per action —
+ * except uploads, whose status lives in the `MediaUploadBanner`. Controls gate
+ * on the real `media:*` matrix via `useHasPermission`.
+ *
+ * A sticky `MediaTopBar` heads the page (the shared icon-tile + breadcrumb
+ * header every admin page carries), spanning both panes. Below it sits a
+ * two-pane layout — a folders sidebar beside the asset browser — plus the detail
+ * drawer and the create/rename/move/upload dialogs. Both panes sit
+ * **flush on the canvas** (no muted board, no bordered island), mirroring the
+ * Content Library's work area: the sidebar is divided by a hairline `border-r`
+ * and each pane scrolls independently. Sized with `flex-1` against the workspace
+ * shell's `min-h-svh` column — NOT its own `svh` calc — so there is exactly one
+ * viewport measurement in the chain; a second, independently rounded one can end
+ * up a pixel taller (visible at browser zoom ≠ 100%) and give the document a
+ * phantom scrollbar beside the pane's own.
+ */
+export function MediaLibraryPage() {
+    const intl = useIntl();
+    // Names this route in the tab strip, the window list, the history
+    // and a screen reader's window announcement. Every private route but
+    // Workspaces was still titled a bare "Admin" (WCAG 2.4.2, `ORT-140`).
+    useDocumentTitle(intl.formatMessage(messages.title));
+    // Mirror the server's RBAC: reads gate the queries, writes gate controls.
+    const canRead = useHasPermission(MEDIA_READ);
+    const canCreate = useHasPermission(MEDIA_CREATE);
+    const canUpdate = useHasPermission(MEDIA_UPDATE);
+    const canDelete = useHasPermission(MEDIA_DELETE);
+    const store = useMediaLibrary(canRead);
+    /** Focus target after a delete removes the tile whose menu opened it. */
+    const gridRef = useRef(null);
+    /** Set by a confirmed delete, read once by the dialog's close-focus hook. */
+    const focusGridOnCloseRef = useRef(false);
+    const [navOpen, setNavOpen] = useState(false);
+    const [newFolderOpen, setNewFolderOpen] = useState(false);
+    const [uploadOpen, setUploadOpen] = useState(false);
+    const [renameTarget, setRenameTarget] = useState(null);
+    const [moveIds, setMoveIds] = useState(null);
+    const [deleteTarget, setDeleteTarget] = useState(null);
+    /**
+     * Puts focus on the grid and **keeps** it there for a few frames.
+     *
+     * A delete travels through two overlays — the tile's ⋯ menu and the confirm
+     * dialog — and each restores focus to its own trigger when it closes, on its
+     * own schedule. Both triggers live on the tile the delete just removed, so
+     * whichever lands last drops focus on `<body>`. Claiming the dialog's
+     * `onCloseAutoFocus` handles one of them; this reclaims from the other,
+     * bounded so it can never fight a focus the user chose themselves (it only
+     * acts while nothing at all is focused).
+     */
+    const focusGrid = () => {
+        const deadline = Date.now() + FOCUS_RECLAIM_MS;
+        const reclaim = () => {
+            // Re-read the ref every tick: a refetch can re-render the region.
+            const grid = gridRef.current;
+            if (!grid || document.activeElement === grid)
+                return;
+            const active = document.activeElement;
+            // Only step in when nothing holds focus: `<body>` after a layer
+            // gave up, or a node that has since left the document. A control
+            // the user actually moved to is left alone.
+            if (!active || active === document.body || !active.isConnected) {
+                grid.focus();
+            }
+            if (Date.now() < deadline)
+                window.setTimeout(reclaim, 32);
+        };
+        reclaim();
+    };
+    const locationLabel = store.currentFolder
+        ? store.currentFolder.name
+        : intl.formatMessage(messages.allMedia);
+    const hasFilters = store.search.trim() !== '' || store.kindFilter !== 'all';
+    // Sub-folders belong to the folder, not to a page of its assets, so they are
+    // drawn once on the first page rather than repeating above every page of
+    // files. On any later page the grid is assets alone.
+    const showFolders = store.page === 1;
+    const visibleFolders = showFolders ? store.childFolders : [];
+    // Emptiness is now a fact about the whole folder, not about what happened to
+    // load: `total` counts every asset matching the search and filter across it.
+    const isEmpty = visibleFolders.length === 0 && store.total === 0;
+    // Triggers a browser download for one asset (its bytes stream from the
+    // `media:read`-gated raw route). Shared by the row action and bulk download.
+    const downloadAsset = (asset) => {
+        const link = document.createElement('a');
+        link.href = asset.url;
+        link.download = asset.name;
+        document.body.appendChild(link);
+        link.click();
+        link.remove();
+    };
+    // A single dispatcher every card / row / drawer forwards asset actions to.
+    const handleAssetAction = (kind, asset) => {
+        switch (kind) {
+            case 'open':
+                store.openDetail(asset.id);
+                break;
+            case 'download': {
+                downloadAsset(asset);
+                toast.success(intl.formatMessage(messages.tDownload, { name: asset.name }));
+                break;
+            }
+            case 'copyLink':
+                // Confirm only once the clipboard actually took it — a denied
+                // permission used to still say "Link copied".
+                void navigator.clipboard
+                    ?.writeText(new URL(asset.url, window.location.origin).href)
+                    .then(() => toast.success(intl.formatMessage(messages.tCopied)), () => toast.error(intl.formatMessage(messages.tCopyFailed)));
+                break;
+            case 'duplicate': {
+                void store.duplicateAssets([asset.id]).then((ok) => {
+                    if (ok) {
+                        toast.success(intl.formatMessage(messages.tDuplicated, {
+                            count: 1
+                        }));
+                    }
+                });
+                break;
+            }
+            case 'rename':
+                setRenameTarget({
+                    kind: 'asset',
+                    id: asset.id,
+                    name: asset.name
+                });
+                break;
+            case 'move':
+                setMoveIds([asset.id]);
+                break;
+            case 'delete':
+                setDeleteTarget({ kind: 'assets', ids: [asset.id] });
+                break;
+        }
+    };
+    const handleRenameFolder = (folder) => setRenameTarget({ kind: 'folder', id: folder.id, name: folder.name });
+    const handleDeleteFolder = (folder) => setDeleteTarget({ kind: 'folder', folder });
+    const submitRename = (name) => {
+        if (!renameTarget)
+            return;
+        const done = renameTarget.kind === 'asset'
+            ? store.renameAsset(renameTarget.id, name)
+            : store.renameFolder(renameTarget.id, name);
+        void done.then((ok) => {
+            if (ok) {
+                toast.success(intl.formatMessage(messages.tRenamed, { name }));
+            }
+        });
+    };
+    const submitMove = (folderId) => {
+        if (!moveIds)
+            return;
+        const count = moveIds.length;
+        void store.moveAssets(moveIds, folderId).then((ok) => {
+            if (ok) {
+                toast.success(intl.formatMessage(messages.tMoved, { count }));
+            }
+        });
+        store.clearSelection();
+    };
+    const confirmDelete = () => {
+        if (!deleteTarget)
+            return;
+        if (deleteTarget.kind === 'assets') {
+            const count = deleteTarget.ids.length;
+            void store.deleteAssets(deleteTarget.ids).then((ok) => {
+                if (ok) {
+                    toast.success(intl.formatMessage(messages.tDeletedAssets, { count }));
+                }
+            });
+        }
+        else {
+            const name = deleteTarget.folder.name;
+            void store.deleteFolder(deleteTarget.folder.id).then((ok) => {
+                if (ok) {
+                    toast.success(intl.formatMessage(messages.tDeletedFolder, { name }));
+                }
+            });
+        }
+        setDeleteTarget(null);
+        // The dialog restores focus to whatever opened it — a tile's ⋯ trigger
+        // the delete is about to remove from the DOM, leaving focus on `<body>`.
+        // Claim the close so it lands on the grid instead. Cancelling leaves the
+        // flag false, so the trigger (which still exists) keeps focus.
+        focusGridOnCloseRef.current = true;
+    };
+    // What the pending folder delete would take with it, so the confirmation
+    // can say so — a folder delete cascades now, and an unqualified "Delete?"
+    // over a populated tree is the kind of prompt people regret answering.
+    const doomed = deleteTarget?.kind === 'folder'
+        ? folderContents(store.folders, store.folderCounts, deleteTarget.folder.id)
+        : null;
+    const isEmptyFolder = !!doomed && !doomed.assets && !doomed.folders;
+    const selectedIds = store.selectedAssets.map((asset) => asset.id);
+    if (!canRead) {
+        return (_jsx("div", { className: "flex min-h-0 flex-1 items-center justify-center p-6 text-center", children: _jsx("p", { className: "max-w-sm text-sm text-muted-foreground", children: intl.formatMessage(messages.noAccess) }) }));
+    }
+    // A failed load gets its own state with a retry — never the empty state,
+    // which would misread a server error as "this folder is empty".
+    if (store.isError) {
+        return (_jsxs("div", { className: "flex min-h-0 flex-1 flex-col items-center justify-center gap-3 p-6 text-center", children: [_jsx("p", { className: "max-w-sm text-sm text-muted-foreground", role: "alert", children: intl.formatMessage(messages.loadError) }), _jsx(Button, { variant: "outline", onClick: store.reload, children: intl.formatMessage(messages.retry) })] }));
+    }
+    return (_jsxs("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col", children: [_jsx(MediaTopBar, { breadcrumbs: store.breadcrumbs, onNavigate: store.navigateTo }), _jsxs("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col lg:flex-row", children: [_jsx("div", { className: "border-b p-3 lg:hidden", children: _jsxs(Button, { variant: "outline", size: "sm", className: "shadow-none", onClick: () => setNavOpen(true), children: [_jsx(PanelLeft, { "aria-hidden": true }), intl.formatMessage(messages.openNav)] }) }), _jsx(MediaFoldersNav, { className: "hidden lg:flex lg:border-r", folders: store.folders, currentFolderId: store.currentFolderId, counts: store.folderCounts, rootCount: store.folderCounts.get(ROOT_FOLDER_ID) ?? 0, onNavigate: store.navigateTo, onNewFolder: () => setNewFolderOpen(true), canCreate: canCreate }), _jsx("div", { className: "min-w-0 flex-1 overflow-auto", children: _jsxs("div", { className: "p-4 sm:p-6", children: [_jsxs("div", { className: "mb-4", children: [_jsx("h1", { className: "text-2xl font-semibold tracking-[-0.01em]", children: store.currentFolder
+                                                ? store.currentFolder.name
+                                                : intl.formatMessage(messages.title) }), _jsx("p", { className: "mt-0.5 text-sm text-muted-foreground", children: intl.formatMessage(messages.subtitle, {
+                                                count: store.total,
+                                                location: locationLabel
+                                            }) })] }), _jsx(MediaToolbar, { search: store.search, onSearchChange: store.setSearch, kindFilter: store.kindFilter, onKindFilterChange: store.setKindFilter, sort: store.sort, onSortChange: store.setSort, onNewFolder: () => setNewFolderOpen(true), onUpload: () => setUploadOpen(true), canCreate: canCreate }), _jsx("p", { className: "sr-only", "aria-live": "polite", children: intl.formatMessage(messages.selection, {
+                                        count: selectedIds.length
+                                    }) }), _jsx(MediaUploadBanner, { items: store.uploadItems, summary: store.uploadSummary, onRetry: store.retryUpload, onCancel: store.cancelUpload, onDismiss: store.dismissUploads }), selectedIds.length > 0 ? (_jsx(MediaSelectionBar, { count: selectedIds.length, onDownload: () => {
+                                        store.selectedAssets.forEach(downloadAsset);
+                                        toast.success(intl.formatMessage(messages.tDownload, {
+                                            name: `${selectedIds.length} files`
+                                        }));
+                                    }, onDuplicate: () => {
+                                        const count = selectedIds.length;
+                                        void store
+                                            .duplicateAssets(selectedIds)
+                                            .then((ok) => {
+                                            if (ok) {
+                                                toast.success(intl.formatMessage(messages.tDuplicated, { count }));
+                                            }
+                                        });
+                                    }, onMove: () => setMoveIds(selectedIds), onDelete: () => setDeleteTarget({
+                                        kind: 'assets',
+                                        ids: selectedIds
+                                    }), onClear: store.clearSelection, canCreate: canCreate, canUpdate: canUpdate, canDelete: canDelete })) : null, _jsx("section", { ref: gridRef, tabIndex: -1, "aria-label": intl.formatMessage(messages.assetsRegion), "aria-busy": store.isRefreshing, className: cn('transition-opacity focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring', store.isRefreshing && 'opacity-60'), children: isEmpty ? (_jsx(MediaEmptyState, { hasFilters: hasFilters, canCreate: canCreate, onUpload: () => setUploadOpen(true), onClearFilters: () => {
+                                            store.setSearch('');
+                                            store.setKindFilter('all');
+                                        } })) : (_jsx(MediaGrid, { folders: visibleFolders, assets: store.visibleAssets, folderCounts: store.folderCounts, selectedIds: store.selectedIds, onOpenFolder: store.navigateTo, onRenameFolder: handleRenameFolder, onDeleteFolder: handleDeleteFolder, onToggleSelect: store.toggleSelect, onAssetAction: handleAssetAction, canCreate: canCreate, canUpdate: canUpdate, canDelete: canDelete })) }), store.total > 0 ? (_jsx(MediaPagination, { page: store.page, pageCount: store.pageCount, pageSize: store.pageSize, total: store.total, onPageChange: store.setPage, onPageSizeChange: store.setPageSize })) : null] }) })] }), _jsx(Drawer, { direction: "left", open: navOpen, onOpenChange: setNavOpen, shouldScaleBackground: false, children: _jsxs(DrawerContent, { className: "data-[vaul-drawer-direction=left]:w-72", children: [_jsx(DrawerTitle, { className: "sr-only", children: intl.formatMessage(messages.navTitle) }), _jsx(MediaFoldersNav, { className: "w-full", folders: store.folders, currentFolderId: store.currentFolderId, counts: store.folderCounts, rootCount: store.folderCounts.get(ROOT_FOLDER_ID) ?? 0, onNavigate: (folderId) => {
+                                store.navigateTo(folderId);
+                                setNavOpen(false);
+                            }, onNewFolder: () => {
+                                setNavOpen(false);
+                                setNewFolderOpen(true);
+                            }, canCreate: canCreate })] }) }), _jsx(AssetDetailDrawer, { asset: store.detailAsset, locationLabel: locationLabel, onOpenChange: (open) => {
+                    if (!open)
+                        store.closeDetail();
+                }, onAction: handleAssetAction, onSaveAlt: (id, alt) => store.setAssetAlt(id, alt).then((ok) => {
+                    if (ok) {
+                        toast.success(intl.formatMessage(messages.tAltSaved));
+                    }
+                    return ok;
+                }), canCreate: canCreate, canUpdate: canUpdate, canDelete: canDelete }), _jsx(NewFolderDialog, { open: newFolderOpen, onOpenChange: setNewFolderOpen, locationLabel: locationLabel, onCreate: (name) => {
+                    void store.createFolder(name).then((ok) => {
+                        if (ok) {
+                            toast.success(intl.formatMessage(messages.tCreated, { name }));
+                        }
+                    });
+                } }), _jsx(UploadDialog, { open: uploadOpen, onOpenChange: setUploadOpen, locationLabel: locationLabel, 
+                // No toast here: the upload has only been *queued*. Progress and
+                // the per-file outcome are the banner's job — a success toast
+                // fired at submit time would claim a result nobody has yet.
+                onUpload: store.uploadFiles, 
+                // The library's queue forwards alt to the API, so this is the
+                // one caller that may ask the author to describe the image.
+                collectAlt: true }), _jsx(RenameDialog, { open: renameTarget !== null, onOpenChange: (open) => {
+                    if (!open)
+                        setRenameTarget(null);
+                }, currentName: renameTarget?.name ?? '', onRename: submitRename }), _jsx(MoveAssetsDialog, { open: moveIds !== null, onOpenChange: (open) => {
+                    if (!open)
+                        setMoveIds(null);
+                }, folders: store.folders, count: moveIds?.length ?? 0, currentFolderId: store.currentFolderId, onMove: submitMove }), _jsx(ConfirmDialog, { open: deleteTarget !== null, onOpenChange: (open) => {
+                    if (!open)
+                        setDeleteTarget(null);
+                }, title: deleteTarget?.kind === 'folder'
+                    ? intl.formatMessage(isEmptyFolder
+                        ? messages.deleteFolderTitle
+                        : messages.deleteFolderTitleFull, { name: deleteTarget.folder.name })
+                    : intl.formatMessage(messages.deleteAssetsTitle, {
+                        count: deleteTarget?.kind === 'assets'
+                            ? deleteTarget.ids.length
+                            : 0
+                    }), description: deleteTarget?.kind === 'folder'
+                    ? isEmptyFolder
+                        ? intl.formatMessage(messages.deleteFolderBody)
+                        : intl.formatMessage(messages.deleteFolderBodyFull, {
+                            assets: doomed?.assets ?? 0,
+                            folders: doomed?.folders ?? 0
+                        })
+                    : intl.formatMessage(messages.deleteAssetsBody), confirmLabel: intl.formatMessage(messages.confirmDelete), confirmVariant: "destructive", onCloseAutoFocus: (event) => {
+                    if (!focusGridOnCloseRef.current)
+                        return;
+                    focusGridOnCloseRef.current = false;
+                    event.preventDefault();
+                    focusGrid();
+                }, onConfirm: confirmDelete })] }));
+}

package/dist/lib/types/mediaAsset/index.d.ts

@@ -0,0 +1,44 @@
+import type { MediaKind } from '../../constants';
+/**
+ * A single media asset in the library — an uploaded file (image, video, audio,
+ * document, or archive) with its display metadata. This is the admin's model;
+ * once a media server exists it will be mapped from that API's wire shape.
+ */
+export type MediaAsset = {
+    /** Stable unique id. */
+    id: string;
+    /** File name shown to the user (includes extension). */
+    name: string;
+    /** Coarse category driving the icon, badge, and kind filter. */
+    kind: MediaKind;
+    /** Route the browser fetches to stream the original bytes (download). */
+    url: string;
+    /** Small (~320px) WebP derivative for grid tiles; `undefined` if none. */
+    thumbUrl?: string;
+    /** Larger (~1280px) WebP derivative for the detail drawer; `undefined` if none. */
+    previewUrl?: string;
+    /** MIME type, e.g. `image/png`. */
+    mimeType: string;
+    /** File size in bytes. */
+    size: number;
+    /** Id of the folder the asset lives in (`ROOT_FOLDER_ID` at the top level). */
+    folderId: string;
+    /** Pixel dimensions for visual assets (`undefined` for audio/documents). */
+    dimensions?: {
+        width: number;
+        height: number;
+    };
+    /** Playback duration in seconds for audio/video. */
+    duration?: number;
+    /** Free-form labels for filtering and organisation. */
+    tags: string[];
+    /** Alternative text (accessibility) for images. */
+    alt?: string;
+    /** Display name of the member who uploaded it. */
+    uploadedBy: string;
+    /** ISO timestamp the asset was created/uploaded. */
+    createdAt: string;
+    /** ISO timestamp the asset was last modified. */
+    updatedAt: string;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/types/mediaAsset/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/types/mediaAsset/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEjD;;;;GAIG;AACH,MAAM,MAAM,UAAU,GAAG;IACrB,wBAAwB;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,wDAAwD;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,gEAAgE;IAChE,IAAI,EAAE,SAAS,CAAC;IAChB,yEAAyE;IACzE,GAAG,EAAE,MAAM,CAAC;IACZ,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,mFAAmF;IACnF,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,mCAAmC;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,0BAA0B;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,+EAA+E;IAC/E,QAAQ,EAAE,MAAM,CAAC;IACjB,4EAA4E;IAC5E,UAAU,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IAC/C,oDAAoD;IACpD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,uDAAuD;IACvD,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,mDAAmD;IACnD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kDAAkD;IAClD,UAAU,EAAE,MAAM,CAAC;IACnB,oDAAoD;IACpD,SAAS,EAAE,MAAM,CAAC;IAClB,iDAAiD;IACjD,SAAS,EAAE,MAAM,CAAC;CACrB,CAAC"}

package/dist/lib/types/mediaAsset/index.js

@@ -0,0 +1 @@
+export {};

package/dist/lib/types/mediaFieldDisplay/index.d.ts

@@ -0,0 +1,48 @@
+/**
+ * One attached asset as a media **field** renders it — the merge of what the
+ * server resolved (`MediaRef`) and what the editor learned locally by picking or
+ * uploading (`MediaAsset`). A ref carries no size/dimensions, so those are
+ * optional: the tile shows whichever facts it has.
+ */
+export type MediaFieldDisplay = {
+    /** The asset id stored in the field value. */
+    id: string;
+    /** File name, or the raw id while nothing else is known yet. */
+    name: string;
+    /**
+     * What the tile renders — the small derivative when the asset has one, else
+     * the original. A tile is ~180px wide, so pulling a full-size original for
+     * it is pure waste; a staged (not yet uploaded) file uses its local object
+     * URL here, which is the same idea from the other direction.
+     */
+    url: string;
+    /** The original bytes — the "open in a new tab" target, never the tile's `src`. */
+    originalUrl?: string;
+    /** Coarse kind; empty string when the asset hasn't been resolved yet. */
+    kind: string;
+    mimeType: string;
+    /** File size in bytes — known only for a picked/uploaded asset. */
+    size?: number;
+    /** Pixel dimensions — known only for a picked/uploaded visual asset. */
+    dimensions?: {
+        width: number;
+        height: number;
+    };
+    /** The id resolved to nothing: deleted, or in another workspace. */
+    missing?: boolean;
+    /**
+     * A file staged on the field but **not uploaded yet** — it goes up with the
+     * record on Save. `url` is a local object URL (images only) and `id` is the
+     * placeholder standing in for the asset.
+     */
+    pending?: boolean;
+    /**
+     * The id is real but nothing is known about it yet — the entry's media read
+     * is still in flight. The tile renders a placeholder rather than guessing
+     * the asset's raw route: guessing meant every edit-mode open fetched
+     * **full-size originals** for the moment before the refs landed (and
+     * labelled each tile with a uuid).
+     */
+    resolving?: boolean;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/types/mediaFieldDisplay/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/types/mediaFieldDisplay/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC5B,8CAA8C;IAC9C,EAAE,EAAE,MAAM,CAAC;IACX,gEAAgE;IAChE,IAAI,EAAE,MAAM,CAAC;IACb;;;;;OAKG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ,mFAAmF;IACnF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,yEAAyE;IACzE,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,mEAAmE;IACnE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wEAAwE;IACxE,UAAU,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IAC/C,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC"}

package/dist/lib/types/mediaFieldDisplay/index.js

@@ -0,0 +1 @@
+export {};

package/dist/lib/types/mediaFolder/index.d.ts

@@ -0,0 +1,16 @@
+/**
+ * A folder grouping assets in the library. Folders form a tree via `parentId`;
+ * the top level is the synthetic root (`ROOT_FOLDER_ID`), which has no folder
+ * record of its own. This is the admin's model, mirrored from the future API.
+ */
+export type MediaFolder = {
+    /** Stable unique id. */
+    id: string;
+    /** Folder name shown to the user. */
+    name: string;
+    /** Parent folder id (`ROOT_FOLDER_ID` for a top-level folder). */
+    parentId: string;
+    /** ISO timestamp the folder was created. */
+    createdAt: string;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/types/mediaFolder/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/types/mediaFolder/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,MAAM,WAAW,GAAG;IACtB,wBAAwB;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,qCAAqC;IACrC,IAAI,EAAE,MAAM,CAAC;IACb,kEAAkE;IAClE,QAAQ,EAAE,MAAM,CAAC;IACjB,4CAA4C;IAC5C,SAAS,EAAE,MAAM,CAAC;CACrB,CAAC"}

package/dist/lib/types/mediaFolder/index.js

@@ -0,0 +1 @@
+export {};

package/dist/lib/types/pendingUpload/index.d.ts

@@ -0,0 +1,38 @@
+/**
+ * One file staged on a media field and **not yet uploaded** — the record is
+ * saved first, and only then do the bytes move (see `usePendingMediaUploads`).
+ */
+export type PendingUpload = {
+    /**
+     * The placeholder id standing in for the asset in the form value. A real
+     * uuid on purpose: the shared kernel validates a media value as a uuid (or
+     * uuid[]), so a staged file satisfies client validation and the publish gate
+     * exactly like an attached asset would.
+     */
+    id: string;
+    /** The bytes to send when the record is saved. */
+    file: File;
+    /** Object URL for an image preview; revoked when the entry is dropped. */
+    previewUrl?: string;
+    /**
+     * The real asset id, once this file has been uploaded. Set when a save's
+     * upload step succeeded but the write behind it did not — so a retry attaches
+     * the asset already in the library instead of uploading it a second time.
+     */
+    uploadedId?: string;
+};
+/**
+ * What a media field needs in order to stage files — the handle
+ * `usePendingMediaUploads` publishes through the entry editor's presave slot, so
+ * the staging outlives the Media tab's body (tabs are routes; the panel unmounts
+ * on every tab switch).
+ */
+export type MediaPendingUploads = {
+    /** Every staged file, keyed by its placeholder id. */
+    pending: ReadonlyMap<string, PendingUpload>;
+    /** Stage files and return their placeholder ids, in order. */
+    stage: (files: File[]) => string[];
+    /** Forget one staged file (removing it from a field also drops it here). */
+    drop: (id: string) => void;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/types/pendingUpload/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/types/pendingUpload/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG;IACxB;;;;;OAKG;IACH,EAAE,EAAE,MAAM,CAAC;IACX,kDAAkD;IAClD,IAAI,EAAE,IAAI,CAAC;IACX,0EAA0E;IAC1E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAC9B,sDAAsD;IACtD,OAAO,EAAE,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;IAC5C,8DAA8D;IAC9D,KAAK,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,MAAM,EAAE,CAAC;IACnC,4EAA4E;IAC5E,IAAI,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9B,CAAC"}

package/dist/lib/types/pendingUpload/index.js

@@ -0,0 +1 @@
+export {};

package/dist/lib/types/upload/index.d.ts

@@ -0,0 +1,37 @@
+import type { UploadStatus } from '../../constants';
+/**
+ * One file in the upload queue — the view model the progress banner renders.
+ * The `File` itself is **not** here: it lives in the queue hook's ref map, so a
+ * progress tick re-renders a small serializable row instead of dragging a blob
+ * through React state.
+ */
+export type UploadItem = {
+    /** Queue-local id (files have no stable identity of their own). */
+    id: string;
+    name: string;
+    /** Bytes, used both for display and to weight the batch percentage. */
+    size: number;
+    /** Whole-number percent of bytes sent, 0–100. */
+    progress: number;
+    status: UploadStatus;
+    /** Localized failure reason; set only when `status` is `failed`. */
+    error?: string;
+};
+/** The batch roll-up the banner headline reads from. */
+export type UploadSummary = {
+    /** Every item still pending or uploading. */
+    inFlight: number;
+    done: number;
+    failed: number;
+    /** Items in the batch, excluding cancelled ones. */
+    total: number;
+    /**
+     * Whole-number percent across the batch, **weighted by file size** — ten
+     * thumbnails finishing shouldn't read as 90% while a 200 MB video is still
+     * going.
+     */
+    percent: number;
+    /** True while anything is pending or uploading. */
+    active: boolean;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/types/upload/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/types/upload/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAEpD;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG;IACrB,mEAAmE;IACnE,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,uEAAuE;IACvE,IAAI,EAAE,MAAM,CAAC;IACb,iDAAiD;IACjD,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,YAAY,CAAC;IACrB,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,wDAAwD;AACxD,MAAM,MAAM,aAAa,GAAG;IACxB,6CAA6C;IAC7C,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB,mDAAmD;IACnD,MAAM,EAAE,OAAO,CAAC;CACnB,CAAC"}

package/dist/lib/types/upload/index.js

@@ -0,0 +1 @@
+export {};